Comparing version 1.0.0-next.39 to 1.0.0-next-20221114221321
122
CHANGELOG.md
# twind | ||
## 1.0.0-next-20221114221321 | ||
### Patch Changes | ||
- helpful error message during dev when no active twind instance is found ([`fe891f9c`](https://github.com/tw-in-js/twind/commit/fe891f9c7990a041e0eccaff9a4f58d0834d46d2)) | ||
- big documentation update ([`a63ca2cb`](https://github.com/tw-in-js/twind/commit/a63ca2cbf450d8a6f72f4d60f5856cee88d16911)) | ||
- allow for `cssom` and `dom` to accept a selector string to find the server rendered stylesheet ([`e2c17a2e`](https://github.com/tw-in-js/twind/commit/e2c17a2e8087875f1725e3b07bc32218d2f0c2c0)) | ||
- BREAKING: use `install` instead of `setup` for cdn configuration to align with other integrations ([`d481948b`](https://github.com/tw-in-js/twind/commit/d481948b0513a59cc3495d5e31f0437c9690d59b)) | ||
- handle hex encoded ampersand ([`a61e0d1d`](https://github.com/tw-in-js/twind/commit/a61e0d1d4a31be6f398b57ceefffdb04b6bceccf)) | ||
- warn about invalid classes and invalid css during development ([`e6acbea2`](https://github.com/tw-in-js/twind/commit/e6acbea2f48e3c6441e0cf71cd069f48500ca493)) | ||
When run in development mode, which is determined by the [export condition](https://nodejs.org/api/packages.html#packages_conditional_exports) `development`, twind notifies about invalid classes and invalid css. | ||
> Further reading: | ||
> | ||
> - [Conditional exports](https://nodejs.org/api/packages.html#packages_conditional_exports) | ||
> - [Vite](https://vitejs.dev/config/shared-options.html#resolve-conditions) | ||
> - [esbuild](https://esbuild.github.io/api/#conditions) | ||
In the the browser a `warning` event is emitted on the `window` object and, in case there is no event listener or the event listener did not call `event.preventDefault()`, a warning is logged to the console. | ||
```js | ||
addEventListener('warning', (event) => { | ||
// prevent default console.warn(`[<code>] <message>: <detail>`) logging | ||
event.preventDefault() | ||
const warning = event.detail | ||
// { message: '...', code: 'TWIND_INVALID_CLASS', detail: '<className>'} | ||
// { message: '...', code: 'TWIND_INVALID_CSS', detail: '<css>'} | ||
console.warn(warning) | ||
}) | ||
``` | ||
In Node.js a warning is emitted using [`process.emitWarning`](https://nodejs.org/api/process.html#processemitwarningwarning-options). | ||
If there is no `warning` event listener, the warning is printed to `stderr`. | ||
``` | ||
(node:56338) [TWIND_INVALID_CLASS] Warning: ... | ||
``` | ||
Alternatively, you can use the [`process.on('warning', ...)`](https://nodejs.org/api/process.html#event-warning) to handle warnings. | ||
```js | ||
import process from 'node:process' | ||
process.on('warning', (warning) => { | ||
console.warn(warning.message) // Print the warning message | ||
console.warn(warning.code) // 'TWIND_INVALID_CLASS' | 'TWIND_INVALID_CSS' | ||
console.warn(warning.detail) // '<className>' | '<css>' | ||
}) | ||
``` | ||
- initial intellisense support ([`2ac8e695`](https://github.com/tw-in-js/twind/commit/2ac8e6950ad37bac0eb88116448bee8738388f59)) | ||
- stringify in user config always wins ([`0705e419`](https://github.com/tw-in-js/twind/commit/0705e41946e191974da76c2b27019755520d9c0a)) | ||
## 1.0.0 | ||
### Patch Changes | ||
- helpful error message during dev when no active twind instance is found (fe891f9c) | ||
- allow for `cssom` and `dom` to accept a selector string to find the server rendered stylesheet (e2c17a2e) | ||
- BREAKING: use `install` instead of `setup` for cdn configuration to align with other integrations (d481948b) | ||
- warn about invalid classes and invalid css during development (e6acbea2) | ||
When run in development mode, which is determined by the [export condition](https://nodejs.org/api/packages.html#packages_conditional_exports) `development`, twind notifies about invalid classes and invalid css. | ||
> Further reading: | ||
> | ||
> - [Conditional exports](https://nodejs.org/api/packages.html#packages_conditional_exports) | ||
> - [Vite](https://vitejs.dev/config/shared-options.html#resolve-conditions) | ||
> - [esbuild](https://esbuild.github.io/api/#conditions) | ||
In the the browser a `warning` event is emitted on the `window` object and, in case there is no event listener or the event listener did not call `event.preventDefault()`, a warning is logged to the console. | ||
```js | ||
addEventListener('warning', (event) => { | ||
// prevent default console.warn(`[<code>] <message>: <detail>`) logging | ||
event.preventDefault() | ||
const warning = event.detail | ||
// { message: '...', code: 'TWIND_INVALID_CLASS', detail: '<className>'} | ||
// { message: '...', code: 'TWIND_INVALID_CSS', detail: '<css>'} | ||
console.warn(warning) | ||
}) | ||
``` | ||
In Node.js a warning is emitted using [`process.emitWarning`](https://nodejs.org/api/process.html#processemitwarningwarning-options). | ||
If there is no `warning` event listener, the warning is printed to `stderr`. | ||
``` | ||
(node:56338) [TWIND_INVALID_CLASS] Warning: ... | ||
``` | ||
Alternatively, you can use the [`process.on('warning', ...)`](https://nodejs.org/api/process.html#event-warning) to handle warnings. | ||
```js | ||
import process from 'node:process' | ||
process.on('warning', (warning) => { | ||
console.warn(warning.message) // Print the warning message | ||
console.warn(warning.code) // 'TWIND_INVALID_CLASS' | 'TWIND_INVALID_CSS' | ||
console.warn(warning.detail) // '<className>' | '<css>' | ||
}) | ||
``` | ||
- initial intellisense support (2ac8e695) | ||
- stringify in user config always wins (0705e419) | ||
## 1.0.0-next.39 | ||
@@ -4,0 +126,0 @@ |
{ | ||
"name": "twind", | ||
"version": "1.0.0-next.39", | ||
"version": "1.0.0-next-20221114221321", | ||
"description": "The core engine without any presets.", | ||
@@ -13,3 +13,3 @@ "type": "module", | ||
"url": "git+https://github.com/tw-in-js/twind.git", | ||
"direction": "packages/twind" | ||
"directory": "packages/twind" | ||
}, | ||
@@ -41,10 +41,2 @@ "keywords": [ | ||
}, | ||
"dependencies": { | ||
"@swc/helpers": "^0.4.11", | ||
"csstype": "^3.0.10" | ||
}, | ||
"publishConfig": { | ||
"tag": "next", | ||
"access": "public" | ||
}, | ||
"main": "./twind.cjs", | ||
@@ -54,4 +46,16 @@ "exports": { | ||
"types": "./twind.d.ts", | ||
"development": { | ||
"esnext": "./twind.esnext.dev.js", | ||
"module": "./twind.dev.js", | ||
"browser": "./twind.browser.dev.js", | ||
"script": "./twind.global.dev.js", | ||
"node": { | ||
"import": "./twind.dev.mjs", | ||
"require": "./twind.dev.cjs" | ||
}, | ||
"default": "./twind.dev.js" | ||
}, | ||
"esnext": "./twind.esnext.js", | ||
"module": "./twind.js", | ||
"browser": "./twind.browser.js", | ||
"script": "./twind.global.js", | ||
@@ -62,6 +66,3 @@ "node": { | ||
}, | ||
"default": { | ||
"import": "./twind.mjs", | ||
"require": "./twind.cjs" | ||
} | ||
"default": "./twind.js" | ||
}, | ||
@@ -71,2 +72,6 @@ "./package.json": "./package.json" | ||
"sideEffects": false, | ||
"dependencies": { | ||
"csstype": "^3.1.1", | ||
"@swc/helpers": "^0.4.11" | ||
}, | ||
"peerDependencies": { | ||
@@ -80,2 +85,5 @@ "typescript": "^4.8.4" | ||
}, | ||
"publishConfig": { | ||
"access": "public" | ||
}, | ||
"module": "./twind.js", | ||
@@ -85,3 +93,4 @@ "esnext": "./twind.esnext.js", | ||
"jsdelivr": "./twind.global.js", | ||
"browser": "./twind.browser.js", | ||
"types": "./twind.d.ts" | ||
} |
224
README.md
# twind [![MIT License](https://flat.badgen.net/github/license/tw-in-js/twind)](https://github.com/tw-in-js/twind/blob/next/LICENSE) [![Latest Release](https://flat.badgen.net/npm/v/twind/next?icon=npm&label&cache=10800&color=blue)](https://www.npmjs.com/package/twind/v/next) [![Github](https://flat.badgen.net/badge/icon/tw-in-js%2Ftwind%23twind?icon=github&label)](https://github.com/tw-in-js/twind/tree/next/packages/twind) | ||
--- | ||
## READ THIS FIRST! | ||
**Twind v1 is still in beta. Expect bugs!** | ||
--- | ||
Utility-first CSS without any build step right in the browser or any other environment like Node.js, deno, workers, ... | ||
Twind does **not** include any core utilities — use one or more of the existing presets: | ||
- 📖 Study [the documentation](https://twind.style) | ||
- 🤖 Try [the playground](https://twind.run) | ||
- 🧭 Explore [the examples](https://twind.style/examples) | ||
- 📓 Consult [the API reference](https://twind.style/packages/twind) | ||
- 📜 Read [the changelog](https://github.com/tw-in-js/twind/tree/next/packages/twind/CHANGELOG.md) | ||
- [@twind/preset-autoprefix](https://github.com/tw-in-js/twind/tree/next/packages/preset-autoprefix) | ||
- [@twind/preset-ext](https://github.com/tw-in-js/twind/tree/next/packages/preset-ext) | ||
- [@twind/preset-tailwind](https://github.com/tw-in-js/twind/tree/next/packages/preset-tailwind) | ||
- [@twind/preset-tailwind-forms](https://github.com/tw-in-js/twind/tree/next/packages/preset-tailwind-forms) to get Tailwind v3 and Tailwind Forms. | ||
## 📖 Documentation | ||
Here are some examples of how to write your own rules or variants: | ||
The full documentation is available at [twind.style](https://twind.style). | ||
- preset-tailwind: [rules](https://github.com/tw-in-js/twind/blob/next/packages/preset-tailwind/src/rules.ts) and [variants](https://github.com/tw-in-js/twind/blob/next/packages/preset-tailwind/src/variants.ts) | ||
- preset-ext: [rules](https://github.com/tw-in-js/twind/blob/next/packages/preset-ext/src/rules.ts) and [variants](https://github.com/tw-in-js/twind/blob/next/packages/preset-ext/src/variants.ts) | ||
## 💬 Community | ||
Additionally we provides several integrations: | ||
For help, discussion about best practices, or any other conversation that would benefit from being searchable use [Github Discussions](https://github.com/tw-in-js/twind/discussions). | ||
- [Gatsby](https://github.com/gatsbyjs/gatsby) — [gatsby-plugin-twind](https://github.com/tw-in-js/twind/tree/next/packages/gatsby-plugin-twind) | ||
- [Next.js](https://kit.svelte.dev) — [@twind/with-next](https://github.com/tw-in-js/twind/tree/next/packages/with-next) | ||
- [Remix](https://remix.run) — [@twind/with-remix](https://github.com/tw-in-js/twind/tree/next/packages/with-remix) | ||
- [SvelteKit](https://kit.svelte.dev) — [@twind/with-sveltekit](https://github.com/tw-in-js/twind/tree/next/packages/with-sveltekit) | ||
To ask questions and discuss with other Twind users in real time use [Discord Chat](https://chat.twind.style). | ||
To get you started, take a look at the [examples](https://github.com/tw-in-js/twind/tree/next/examples). | ||
## 🧱 Contribute | ||
## Usage | ||
See the [Contributing Guide](../../CONTRIBUTING.md) for information on how to contribute to this project. | ||
```sh | ||
npm install twind@next | ||
``` | ||
## 📜 Changelog | ||
```js | ||
import { setup } from 'twind' | ||
The Changelog for this package is [available on GitHub](https://github.com/tw-in-js/twind/tree/next/packages/twind/CHANGELOG.md). | ||
// You must call setup at least once, but can call it multiple times | ||
setup({ | ||
/* options */ | ||
}) | ||
``` | ||
## ⚖️ License | ||
Incase you are not using SSR to inject the pre-computed styles apply the following pattern to prevent [FOUC](https://en.wikipedia.org/wiki/Flash_of_unstyled_content): | ||
```html | ||
<body class="!block" style="display: none"> | ||
<!-- ... --> | ||
</body> | ||
``` | ||
If any element has the `autofocus` attribute, Twind will focus it after all styles are injected. | ||
<details><summary>Usage with a script tag</summary> | ||
Add this line to your `index.html`: | ||
```html | ||
<head> | ||
<script src="https://cdn.jsdelivr.net/npm/twind@next" crossorigin></script> | ||
<script> | ||
twind.setup({ | ||
/* options */ | ||
}) | ||
</script> | ||
</head> | ||
``` | ||
To add presets add their ids to the script `src` attribute: | ||
```html | ||
<head> | ||
<!-- ... --> | ||
<script | ||
src="https://cdn.jsdelivr.net/npm/twind@next,npm/@twind/preset-tailwind@next" | ||
crossorigin | ||
></script> | ||
<script> | ||
twind.setup({ | ||
presets: [twind.presetTailwind()], | ||
// ... | ||
}) | ||
</script> | ||
<!-- ... --> | ||
</head> | ||
``` | ||
</details> | ||
## API | ||
> If you are using the `script` tag these methods are available via the `twind` global object (eg `twind.setup`). | ||
### `setup(config [, sheet [, target]])` | ||
Initializes Twind and can be called as many times as you want. | ||
```js | ||
import { setup } from 'twind' | ||
// can be called as many times as you want. | ||
const tw = setup({ | ||
/* config */ | ||
}) | ||
// -> tw === import { tw } from 'twind' | ||
``` | ||
### `tw(...tokens)` — the current Twind instance | ||
```js | ||
import { tw } from 'twind' | ||
tw`underline` | ||
tw({ underline: true }) | ||
tw.theme('colors.blue.500', 'blue') | ||
``` | ||
### `cx` | ||
```js | ||
import { cx } from 'twind' | ||
// Set a className | ||
element.className = cx` | ||
underline | ||
/* multi | ||
line | ||
comment | ||
*/ | ||
hover:focus:!{ | ||
sm:{italic why} | ||
lg:-{px} | ||
-mx-1 | ||
} | ||
// Position | ||
!top-1 !-bottom-2 | ||
text-{xl black} | ||
` | ||
``` | ||
### `shortcut` | ||
TDB | ||
### `css` | ||
TDB | ||
### `style` | ||
TDB | ||
### `extract(html, tw)` | ||
Used for static HTML processing (usually to provide SSR support for your javascript-powered web apps) — powered by [consume(html, tw)](#consumehtml-tw) | ||
**Note**: Consider using [inline](#inlinehtml-tw) instead. | ||
**Note**: This clears the Twind instance before processing the HTML. | ||
```js | ||
import { setup, extract, tw } from 'twind' | ||
// can be in a different file — but should be called at least once | ||
setup({ | ||
/* config */ | ||
}) | ||
function render() { | ||
const { html, css } = extract(renderApp(), tw) | ||
// inject as last element into the head | ||
return html.replace('</head>', `<style data-twind>${css}</style></head>`) | ||
} | ||
``` | ||
## Low-Level API | ||
### `twind` | ||
TDB | ||
### `consume(html, tw)` | ||
Used for static HTML processing (usually to provide SSR support for your javascript-powered web apps) | ||
1. parse the markup and process element classes with the provided Twind instance | ||
2. update the class attributes _if_ necessary | ||
3. return the HTML string with the final element classes | ||
```js | ||
import { setup, consume, stringify, tw } from 'twind' | ||
// can be in a different file — but should be called at least once | ||
setup({ | ||
/* config */ | ||
}) | ||
function render() { | ||
const html = renderApp() | ||
// remember global classes | ||
const restore = tw.snapshot() | ||
// generated markup | ||
const markup = consume(html) | ||
// create CSS | ||
const css = stringify(tw.target) | ||
// restore global classes | ||
restore() | ||
// inject as last element into the head | ||
return markup.replace('</head>', `<style data-twind>${css}</style></head>`) | ||
} | ||
``` | ||
The [MIT license](https://github.com/tw-in-js/twind/blob/main/LICENSE) governs your use of Twind. |
682
twind.d.ts
@@ -102,4 +102,4 @@ import * as CSS$1 from 'csstype'; | ||
declare type RuleResult = string | CSSObject | Falsey | Partial<TwindRule>[]; | ||
declare type RuleResolver<Theme extends BaseTheme = BaseTheme> = (match: MatchResult, context: Context<Theme>) => RuleResult; | ||
declare type Rule<Theme extends BaseTheme = BaseTheme> = string | RegExp | [pattern: MaybeArray<string | RegExp>, alias: string] | [pattern: MaybeArray<string | RegExp>, css: CSSObject] | [pattern: MaybeArray<string | RegExp>, resolve: RuleResolver<Theme>] | [pattern: MaybeArray<string | RegExp>, property: keyof CSSProperties] | [ | ||
declare type RuleResolver<Theme extends BaseTheme = BaseTheme, Match extends MatchResult = MatchResult> = (match: Match, context: Context<Theme>) => RuleResult; | ||
declare type Rule<Theme extends BaseTheme = BaseTheme> = string | RegExp | [pattern: MaybeArray<string | RegExp>, alias: string & {}] | [pattern: MaybeArray<string | RegExp>, css: CSSObject] | [pattern: MaybeArray<string | RegExp>, resolve: RuleResolver<Theme>] | [pattern: MaybeArray<string | RegExp>, property: keyof CSSProperties] | [ | ||
pattern: MaybeArray<string | RegExp>, | ||
@@ -140,3 +140,3 @@ property: keyof CSSProperties, | ||
declare type HashFunction = (value: string, defaultHash: (value: string) => string) => string; | ||
declare type DarkModeConfig = 'media' | 'class' | string | boolean | undefined | [mode: 'class', selector: string]; | ||
declare type DarkModeConfig = 'media' | 'class' | (string & {}) | boolean | undefined | [mode: 'class', selector: string]; | ||
/** | ||
@@ -188,2 +188,3 @@ * Allows to return a dark color for the given light color. | ||
} & BaseTheme; | ||
/** @experimental */ | ||
declare type UnionToIntersection<U> = (U extends any ? (k: U) => void : never) extends (k: infer I) => void ? I : never; | ||
@@ -274,3 +275,3 @@ declare type ExtractThemes<Theme, Presets extends Preset<any>[]> = UnionToIntersection<ExtractTheme<ExtractUserTheme<Theme> | BaseTheme | ArrayType<Presets>>>; | ||
}; | ||
declare type MatchConverter<Theme extends BaseTheme = BaseTheme> = (match: MatchResult, context: Context<Theme>) => string; | ||
declare type MatchConverter<Theme extends BaseTheme = BaseTheme, Match extends MatchResult = MatchResult> = (match: Match, context: Context<Theme>) => string; | ||
interface PresetThunk<Theme = BaseTheme> { | ||
@@ -289,2 +290,11 @@ (config: TwindConfig<Theme & BaseTheme>): TwindPresetConfig<Theme>; | ||
/** | ||
* @group Class Name Generators | ||
*/ | ||
declare const apply: Nested; | ||
/** | ||
* @group Class Name Generators | ||
*/ | ||
declare const shortcut: Nested; | ||
interface AnimationFunction { | ||
@@ -296,4 +306,55 @@ (animation: string | CSSProperties, waypoints: StringLike): StringLike; | ||
}; | ||
/** | ||
* @group Class Name Generators | ||
*/ | ||
declare const animation: Animation; | ||
declare type AutocompleteItem = { | ||
prefix?: string; | ||
suffix: string; | ||
theme?: { | ||
section: string; | ||
key: string; | ||
}; | ||
modifiers?: AutocompleteModifier[] | false | null | undefined; | ||
color?: string | false | null | undefined; | ||
label?: string; | ||
}; | ||
declare type AutocompleteModifier = { | ||
modifier: string; | ||
theme?: { | ||
section: string; | ||
key: string; | ||
}; | ||
color?: string | false | null | undefined; | ||
label?: string; | ||
}; | ||
interface AutocompleteContext<Theme extends BaseTheme = BaseTheme> { | ||
/** Allows to resolve theme values. */ | ||
readonly theme: ThemeFunction<Theme>; | ||
readonly variants: Record<string, string>; | ||
} | ||
declare type AutocompleteProvider<Theme extends BaseTheme = BaseTheme> = (match: MatchResult, context: AutocompleteContext<Theme>) => (string | AutocompleteItem)[]; | ||
/** | ||
* @experimental | ||
* @group Configuration | ||
* @param resolver | ||
* @param autocomplete | ||
*/ | ||
declare function withAutocomplete<Theme extends BaseTheme = BaseTheme>(resolver: RuleResolver<Theme>, autocomplete: AutocompleteProvider<Theme> | false | null | undefined): RuleResolver<Theme>; | ||
declare function withAutocomplete<Theme extends BaseTheme = BaseTheme>(resolver: VariantResolver<Theme>, autocomplete: AutocompleteProvider<Theme> | false | null | undefined): VariantResolver<Theme>; | ||
declare function withAutocomplete<Theme extends BaseTheme = BaseTheme>(rule: Rule<Theme>, autocomplete: AutocompleteProvider<Theme> | false | null | undefined): Rule<Theme>; | ||
/** | ||
* @internal | ||
* @param resolver | ||
* @returns | ||
*/ | ||
declare function getAutocompleteProvider<Theme extends BaseTheme = BaseTheme>(resolver: RuleResolver<Theme> | VariantResolver<Theme>): AutocompleteProvider<Theme> | undefined; | ||
/** | ||
* @internal | ||
* @param color | ||
* @param options | ||
* @returns | ||
*/ | ||
declare function toColorValue(color: ColorValue, options?: ColorFunctionOptions): string; | ||
@@ -311,2 +372,3 @@ /** | ||
* | ||
* @group Configuration | ||
* @param section within theme to use | ||
@@ -319,7 +381,38 @@ * @param key of the light color or an arbitrary value | ||
/** | ||
* @group Class Name Generators | ||
* @param strings | ||
* @param interpolations | ||
*/ | ||
declare function css(strings: TemplateStringsArray, ...interpolations: readonly CSSValue[]): string; | ||
declare function css(style: CSSObject | string): string; | ||
declare function cx(strings: TemplateStringsArray | Class, ...interpolations: Class[]): string; | ||
/** | ||
* Constructs `class` strings conditionally. | ||
* | ||
* Twinds version of popular libraries like [classnames](https://github.com/JedWatson/classnames) or [clsx](https://github.com/lukeed/clsx). | ||
* The key advantage of `cx` is that it supports twinds enhanced class name syntax like grouping and aliases. | ||
* | ||
* @group Class Name Generators | ||
* @param strings | ||
* @param interpolations | ||
* @returns | ||
*/ | ||
declare function cx(strings: TemplateStringsArray, ...interpolations: Class[]): string; | ||
/** | ||
* Constructs `class` strings conditionally. | ||
* | ||
* Twinds version of popular libraries like [classnames](https://github.com/JedWatson/classnames) or [clsx](https://github.com/lukeed/clsx). | ||
* The key advantage of `cx` is that it supports twinds enhanced class name syntax like grouping and aliases. | ||
* | ||
* @group Class Name Generators | ||
* @param input | ||
*/ | ||
declare function cx(...input: Class[]): string; | ||
/** | ||
* @group Configuration | ||
* @param param0 | ||
* @returns | ||
*/ | ||
declare function defineConfig<Theme = BaseTheme, Presets extends Preset<any>[] = Preset[]>({ presets, ...userConfig }: TwindUserConfig<Theme, Presets>): TwindConfig<BaseTheme & ExtractThemes<Theme, Presets>>; | ||
@@ -338,7 +431,14 @@ | ||
* It **does not** return a class name, but adds the styles within the base layer to the stylesheet directly. | ||
* | ||
* @group Style Injectors | ||
*/ | ||
declare const injectGlobal: InjectGlobalFunction; | ||
declare function install<Theme extends BaseTheme = BaseTheme>(config: TwindConfig<Theme>, isProduction: boolean): Twind<Theme & BaseTheme>; | ||
declare function install<Theme = BaseTheme, Presets extends Preset<any>[] = Preset[]>(config: TwindUserConfig<Theme, Presets>, isProduction: boolean): Twind<BaseTheme & ExtractThemes<Theme, Presets>>; | ||
/** | ||
* @group Runtime | ||
* @param config | ||
* @param isProduction | ||
*/ | ||
declare function install<Theme extends BaseTheme = BaseTheme>(config: TwindConfig<Theme>, isProduction?: boolean): Twind<Theme & BaseTheme>; | ||
declare function install<Theme = BaseTheme, Presets extends Preset<any>[] = Preset[]>(config: TwindUserConfig<Theme, Presets>, isProduction?: boolean): Twind<BaseTheme & ExtractThemes<Theme, Presets>>; | ||
@@ -359,9 +459,42 @@ interface KeyframesFunction { | ||
}; | ||
/** | ||
* **Note**: The styles will be injected on first use. | ||
* | ||
* @group Style Injectors | ||
*/ | ||
declare const keyframes: Keyframes; | ||
declare const apply: Nested; | ||
declare const shortcut: Nested; | ||
/** | ||
* @group Runtime | ||
* @param tw | ||
* @param target | ||
* @returns | ||
*/ | ||
declare function observe<Theme extends BaseTheme = BaseTheme, Target = unknown>(tw?: Twind<Theme, Target>, target?: false | HTMLElement): Twind<Theme, Target>; | ||
interface ParsedRule { | ||
/** | ||
* The utility name including `-` if set, but without `!` and variants | ||
*/ | ||
readonly n: string; | ||
/** | ||
* All variants without trailing colon: `hover`, `after:`, `[...]` | ||
*/ | ||
readonly v: string[]; | ||
/** | ||
* Something like `!underline` or `!bg-red-500` or `!red-500` | ||
*/ | ||
readonly i?: boolean; | ||
} | ||
interface ParsedDevRule extends ParsedRule { | ||
readonly a: string[]; | ||
readonly l: [start: number, end: number]; | ||
} | ||
/** | ||
* @internal | ||
* @param token | ||
* @returns | ||
*/ | ||
declare function parse(token: string): ParsedRule[]; | ||
declare type ThemeMatchResult<Value> = MatchResult & { | ||
@@ -371,4 +504,74 @@ /** The found theme value */ | ||
}; | ||
declare type ThemeRuleResolver<Value, Theme extends BaseTheme = BaseTheme> = (match: ThemeMatchResult<Value>, context: Context<Theme>) => RuleResult; | ||
declare type ThemeMatchConverter<Value, Theme extends BaseTheme = BaseTheme> = (match: ThemeMatchResult<Value>, context: Context<Theme>) => string; | ||
declare type ThemeRuleResolver<Value, Theme extends BaseTheme = BaseTheme> = RuleResolver<Theme, ThemeMatchResult<Value>>; | ||
declare type ThemeMatchConverter<Value, Theme extends BaseTheme = BaseTheme> = MatchConverter<Theme, ThemeMatchResult<Value>>; | ||
/** | ||
* @group Configuration | ||
* @param pattern | ||
*/ | ||
declare function match<Theme extends BaseTheme = BaseTheme>(pattern: MaybeArray<string | RegExp>): Rule<Theme>; | ||
/** | ||
* @group Configuration | ||
* @param pattern | ||
* @param resolver | ||
*/ | ||
declare function match<Theme extends BaseTheme = BaseTheme>(pattern: MaybeArray<string | RegExp>, resolver: RuleResolver<Theme>): Rule<Theme>; | ||
/** | ||
* @group Configuration | ||
* @param pattern | ||
* @param resolve | ||
*/ | ||
declare function match<Theme extends BaseTheme = BaseTheme>(pattern: MaybeArray<string | RegExp>, resolve: (string & {}) | CSSObject): Rule<Theme>; | ||
/** | ||
* @group Configuration | ||
* @param pattern | ||
* @param resolve | ||
* @param convert | ||
*/ | ||
declare function match<Theme extends BaseTheme = BaseTheme>(pattern: MaybeArray<string | RegExp>, resolve: keyof CSSProperties, convert?: MatchConverter<Theme>): Rule<Theme>; | ||
/** | ||
* @group Configuration | ||
* @internal | ||
* @deprecated Use {@link match} instead. | ||
*/ | ||
declare function fromMatch<Theme extends BaseTheme = BaseTheme>(): RuleResolver<Theme>; | ||
/** | ||
* @group Configuration | ||
* @internal | ||
* @deprecated Use {@link match} instead. | ||
*/ | ||
declare function fromMatch<Theme extends BaseTheme = BaseTheme>(resolver: RuleResolver<Theme>): RuleResolver<Theme>; | ||
/** | ||
* @group Configuration | ||
* @internal | ||
* @deprecated Use {@link match} instead. | ||
*/ | ||
declare function fromMatch<Theme extends BaseTheme = BaseTheme>(resolve: keyof CSSProperties, convert?: MatchConverter<Theme>): RuleResolver<Theme>; | ||
/** | ||
* @group Configuration | ||
* @internal | ||
* @deprecated Use {@link match} instead. | ||
*/ | ||
declare function fromMatch<Theme extends BaseTheme = BaseTheme>(resolve: string | CSSObject): RuleResolver<Theme>; | ||
/** | ||
* @group Configuration | ||
* @param pattern | ||
* @param section | ||
* @param resolve | ||
* @param convert | ||
* @returns | ||
*/ | ||
declare function matchTheme<Theme extends BaseTheme = BaseTheme, Section extends keyof Theme & string = keyof Theme & string>(pattern: MaybeArray<string | RegExp>, | ||
/** Theme section to use (default: `$1` — The first matched group) */ | ||
section?: '' | Section | KebabCase<Section>, | ||
/** The css property (default: value of {@link section}) */ | ||
resolve?: keyof CSSProperties | ThemeRuleResolver<ThemeValue<Theme[Section]>, Theme>, convert?: ThemeMatchConverter<ThemeValue<Theme[Section]>, Theme>): Rule<Theme>; | ||
/** | ||
* @group Configuration | ||
* @internal | ||
* @deprecated Use {@link matchTheme} instead. | ||
* @param section | ||
* @param resolve | ||
* @param convert | ||
* @returns | ||
*/ | ||
declare function fromTheme<Theme extends BaseTheme = BaseTheme, Section extends keyof Theme & string = keyof Theme & string>( | ||
@@ -399,10 +602,50 @@ /** Theme section to use (default: `$1` — The first matched group) */ | ||
} | ||
/** | ||
* @group Configuration | ||
* @param pattern | ||
* @param options | ||
* @param resolve | ||
* @returns | ||
*/ | ||
declare function matchColor<Theme extends BaseTheme = BaseTheme, Section extends keyof FilterByThemeValue<Theme, ColorValue> = keyof FilterByThemeValue<Theme, ColorValue>, OpacitySection extends keyof FilterByThemeValue<Theme, string> = keyof FilterByThemeValue<Theme, string>>(pattern: MaybeArray<string | RegExp>, options?: ColorFromThemeOptions<Theme, Section, OpacitySection>, resolve?: ThemeRuleResolver<ColorFromThemeValue, Theme>): Rule<Theme>; | ||
/** | ||
* @group Configuration | ||
* @internal | ||
* @deprecated Use {@link matchColor} instead. | ||
* @param options | ||
* @param resolve | ||
* @returns | ||
*/ | ||
declare function colorFromTheme<Theme extends BaseTheme = BaseTheme, Section extends keyof FilterByThemeValue<Theme, ColorValue> = keyof FilterByThemeValue<Theme, ColorValue>, OpacitySection extends keyof FilterByThemeValue<Theme, string> = keyof FilterByThemeValue<Theme, string>>(options?: ColorFromThemeOptions<Theme, Section, OpacitySection>, resolve?: ThemeRuleResolver<ColorFromThemeValue, Theme>): RuleResolver<Theme>; | ||
/** | ||
* @internal | ||
* @param property | ||
* @param value | ||
* @returns | ||
*/ | ||
declare function toCSS(property: string, value: string | ColorFromThemeValue): CSSObject; | ||
/** | ||
* @internal | ||
* @param value | ||
* @param section | ||
* @param context | ||
* @returns | ||
*/ | ||
declare function arbitrary<Theme extends BaseTheme = BaseTheme>(value: string, section: string, context: Context<Theme>): string | undefined; | ||
/** | ||
* @internal | ||
* @param value | ||
* @returns | ||
*/ | ||
declare function normalize(value: string): string; | ||
declare function auto(setup: () => void): () => void; | ||
/** | ||
* @group Runtime | ||
* @param install | ||
* @returns | ||
*/ | ||
declare function auto(install: () => void): () => void; | ||
/** | ||
* A proxy to the currently active Twind instance. | ||
* @group Style Injectors | ||
*/ | ||
@@ -414,2 +657,3 @@ declare const tw: Twind<any, any>; | ||
* | ||
* @group Runtime | ||
* @param config | ||
@@ -423,178 +667,19 @@ * @param sheet | ||
declare type StrictMorphVariant<T> = T extends number ? `${T}` | T : T extends 'true' ? true | T : T extends 'false' ? false | T : T; | ||
declare type MorphVariant<T> = T extends number ? `${T}` | T : T extends 'true' ? boolean | T : T extends 'false' ? boolean | T : T extends `${number}` ? number | T : T; | ||
declare type StyleTokenValue = string | Falsey; | ||
declare type StyleToken = StyleTokenValue; | ||
/** | ||
* Allows to extract the supported properties of a style function. | ||
* | ||
* Here is an example for `react` | ||
* ```js | ||
* import { HTMLAttributes } from "react"; | ||
* import { style, PropsOf } from "twind"; | ||
* const button = style({ ... }) | ||
* type ButtonProps = PropsOf<typeof button> | ||
* export const Button = (props: ButtonProps & HTMLAttributes<HTMLButtonElement>) => { | ||
* return <button className={style(props)} {...rest} /> | ||
* } | ||
* ``` | ||
* @group Sheets | ||
* @param element | ||
* @returns | ||
*/ | ||
declare type PropsOf<T> = T extends Style<infer Variants> ? { | ||
[key in keyof Variants]: MorphVariant<keyof Variants[key]>; | ||
} : never; | ||
declare type DefaultVariants<Variants> = { | ||
[key in keyof Variants]?: StrictMorphVariant<keyof Variants[key]> | (Record<string, StrictMorphVariant<keyof Variants[key]>> & { | ||
/** initial breakpoint */ | ||
_?: StrictMorphVariant<keyof Variants[key]>; | ||
}); | ||
}; | ||
declare type VariantsProps<Variants> = { | ||
[key in keyof Variants]?: MorphVariant<keyof Variants[key]> | (Record<string, MorphVariant<keyof Variants[key]>> & { | ||
/** initial breakpoint */ | ||
_?: MorphVariant<keyof Variants[key]>; | ||
}); | ||
}; | ||
declare type When<Variants> = { | ||
[key in keyof Variants]?: StrictMorphVariant<keyof Variants[key]>; | ||
}; | ||
interface StyleConfig<Variants, BaseVariants = {}> { | ||
/** Used as prefix */ | ||
label?: string; | ||
base?: StyleToken; | ||
props?: Variants & { | ||
[variant in keyof BaseVariants]?: { | ||
[key in keyof BaseVariants[variant]]?: StyleToken; | ||
}; | ||
}; | ||
defaults?: DefaultVariants<Variants & BaseVariants>; | ||
when?: [match: When<Variants & BaseVariants>, then: StyleToken][]; | ||
} | ||
interface StyleFunction { | ||
<Variants>(config?: StyleConfig<Variants>): Style<Variants>; | ||
<Variants, BaseVariants>(base: Style<BaseVariants>, config?: StyleConfig<Variants, BaseVariants>): Style<Variants & BaseVariants>; | ||
} | ||
declare type StyleProps<Variants> = VariantsProps<Variants>; | ||
interface Style<Variants> { | ||
/** | ||
* CSS Class associated with the current component. | ||
* | ||
* ```jsx | ||
* const button = style({ | ||
* base: css({ | ||
* color: "DarkSlateGray" | ||
* }) | ||
* }) | ||
* | ||
* <div className={button()} /> | ||
* ``` | ||
* <br /> | ||
*/ | ||
(props?: StyleProps<Variants>): string; | ||
/** | ||
* To be used as resolve within config.rules: | ||
* | ||
* ```js | ||
* { | ||
* rules: [ | ||
* // label?prop=value&other=propValue | ||
* // if the style has base eg no prop is required | ||
* ['label(\\?.+)?', style( /* ... *\/ )], | ||
* | ||
* // if the style requires at least one prop | ||
* ['label\\?(.+)', style( /* ... *\/ )], | ||
* ] | ||
* } | ||
* ``` | ||
* | ||
* The first group is used to extract the props using {@link URLSearchParams}. | ||
*/ | ||
(match: MatchResult): string; | ||
readonly defaults: StyleProps<Variants>; | ||
/** | ||
* CSS Class associated with the current component. | ||
* | ||
* ```js | ||
* const button = style({ | ||
* base: css` | ||
* color: "DarkSlateGray" | ||
* ` | ||
* }) | ||
* | ||
* <div className={button.className} /> | ||
* ``` | ||
*/ | ||
readonly className: string; | ||
/** | ||
* CSS Selector associated with the current component. | ||
* | ||
* ```js | ||
* const button = style({ | ||
* base: css({ | ||
* color: "DarkSlateGray" | ||
* }) | ||
* }) | ||
* | ||
* const Card = styled({ | ||
* base: css` | ||
* & ${button.selector} { | ||
* boxShadow: "0 0 0 5px" | ||
* } | ||
* ` | ||
* }) | ||
* ``` | ||
*/ | ||
readonly selector: string; | ||
} | ||
declare const style: StyleFunction; | ||
declare function twind<Theme extends BaseTheme = BaseTheme, Target = unknown>(config: TwindConfig<Theme>, sheet: Sheet<Target>): Twind<Theme, Target>; | ||
declare function twind<Theme = BaseTheme, Presets extends Preset<any>[] = Preset[], Target = unknown>(config: TwindUserConfig<Theme, Presets>, sheet: Sheet<Target>): Twind<BaseTheme & ExtractThemes<Theme, Presets>, Target>; | ||
interface TxFunction { | ||
(...classes: Class[]): string; | ||
(strings: TemplateStringsArray, ...interpolations: readonly Class[]): string; | ||
bind(thisArg?: ((tokens: string) => string) | undefined | void): TxFunction; | ||
call(thisArg: ((tokens: string) => string) | undefined | void, ...classes: Class[]): string; | ||
call(thisArg: ((tokens: string) => string) | undefined | void, strings: TemplateStringsArray, ...interpolations: readonly Class[]): string; | ||
apply(thisArg: ((tokens: string) => string) | undefined | void, classes: Class[] | [strings: TemplateStringsArray, ...interpolations: readonly Class[]]): string; | ||
} | ||
declare function cssom(element?: CSSStyleSheet | HTMLStyleElement | string | null | false): Sheet<CSSStyleSheet>; | ||
/** | ||
* Combines {@link tw} and {@link cx}. | ||
* | ||
* Using the default `tw` instance: | ||
* | ||
* ```js | ||
* import { tw } from 'twind' | ||
* tx`underline ${falsy && 'italic'}` | ||
* tx('underline', falsy && 'italic') | ||
* tx({'underline': true, 'italic': false}) | ||
* | ||
* // using a custom twind instance | ||
* import { tw } from './custom/twind' | ||
* import { tw } from './custom/twind' | ||
* tx.bind(tw) | ||
* ``` | ||
* | ||
* Using a custom `tw` instance: | ||
* | ||
* ```js | ||
* import { tx as tx$ } from 'twind' | ||
* import { tw } from './custom/twind' | ||
* | ||
* export const tx = tx$.bind(tw) | ||
* | ||
* tx`underline ${falsy && 'italic'}` | ||
* tx('underline', falsy && 'italic') | ||
* tx({'underline': true, 'italic': false}) | ||
* ``` | ||
* | ||
* @param this {@link Twind} instance to use (default: {@link tw}) | ||
* @param strings | ||
* @param interpolations | ||
* @returns the class name | ||
* @group Sheets | ||
* @param element | ||
* @returns | ||
*/ | ||
declare const tx: TxFunction; | ||
declare function cssom(element?: CSSStyleSheet | Element | null | false): Sheet<CSSStyleSheet>; | ||
declare function dom(element?: Element | null | false): Sheet<HTMLStyleElement>; | ||
declare function dom(element?: HTMLStyleElement | string | null | false): Sheet<HTMLStyleElement>; | ||
/** | ||
* @group Sheets | ||
* @param includeResumeData | ||
* @returns | ||
*/ | ||
declare function virtual(includeResumeData?: boolean): Sheet<string[]>; | ||
@@ -604,3 +689,4 @@ /** | ||
* | ||
* @param useDOMSheet usually something like `process.env.NODE_ENV != 'production'` (default: browser={@link cssom}, server={@link virtual}) | ||
* @group Sheets | ||
* @param useDOMSheet usually something like `process.env.NODE_ENV != 'production'` or `import.meta.env.DEV` (default: browser={@link cssom}, server={@link virtual}) | ||
* @param disableResume to not include or use resume data | ||
@@ -610,2 +696,7 @@ * @returns a sheet to use | ||
declare function getSheet(useDOMSheet?: boolean, disableResume?: boolean): Sheet<string[] | HTMLStyleElement | CSSStyleSheet>; | ||
/** | ||
* @group Sheets | ||
* @param target | ||
* @returns | ||
*/ | ||
declare function stringify(target: unknown): string; | ||
@@ -618,3 +709,3 @@ | ||
/** | ||
* {@link Twind} instance to use (default: {@link tw$ | module tw}) | ||
* {@link Twind} instance to use (default: {@link twind.tw}) | ||
*/ | ||
@@ -675,4 +766,5 @@ tw?: Twind<any, any>; | ||
* | ||
* @group Static Extraction | ||
* @param markup HTML to process | ||
* @param tw a {@link Twind} instance | ||
* @param options to customize the processing | ||
* @returns the resulting HTML | ||
@@ -724,2 +816,3 @@ */ | ||
* | ||
* @group Static Extraction | ||
* @param markup HTML to process | ||
@@ -788,2 +881,3 @@ * @param tw a {@link Twind} instance (default: twind managed tw) | ||
* | ||
* @group Static Extraction | ||
* @param markup HTML to process | ||
@@ -795,10 +889,220 @@ * @param tw a {@link Twind} instance | ||
declare type StrictMorphVariant<T> = T extends number ? `${T}` | T : T extends 'true' ? true | T : T extends 'false' ? false | T : T; | ||
declare type MorphVariant<T> = T extends number ? `${T}` | T : T extends 'true' ? boolean | T : T extends 'false' ? boolean | T : T extends `${number}` ? number | T : T; | ||
declare type StyleTokenValue = string | Falsey; | ||
declare type StyleToken = StyleTokenValue; | ||
/** | ||
* Allows to extract the supported properties of a style function. | ||
* | ||
* Here is an example for `react` | ||
* ```js | ||
* import { HTMLAttributes } from "react"; | ||
* import { style, PropsOf } from "twind"; | ||
* const button = style({ ... }) | ||
* type ButtonProps = PropsOf<typeof button> | ||
* export const Button = (props: ButtonProps & HTMLAttributes<HTMLButtonElement>) => { | ||
* return <button className={style(props)} {...rest} /> | ||
* } | ||
* ``` | ||
*/ | ||
declare type PropsOf<T> = T extends Style<infer Variants> ? { | ||
[key in keyof Variants]: MorphVariant<keyof Variants[key]>; | ||
} : never; | ||
declare type DefaultVariants<Variants> = { | ||
[key in keyof Variants]?: StrictMorphVariant<keyof Variants[key]> | (Record<string, StrictMorphVariant<keyof Variants[key]>> & { | ||
/** initial breakpoint */ | ||
_?: StrictMorphVariant<keyof Variants[key]>; | ||
}); | ||
}; | ||
declare type VariantsProps<Variants> = { | ||
[key in keyof Variants]?: MorphVariant<keyof Variants[key]> | (Record<string, MorphVariant<keyof Variants[key]>> & { | ||
/** initial breakpoint */ | ||
_?: MorphVariant<keyof Variants[key]>; | ||
}); | ||
}; | ||
declare type When<Variants> = { | ||
[key in keyof Variants]?: StrictMorphVariant<keyof Variants[key]>; | ||
}; | ||
interface StyleConfig<Variants, BaseVariants = {}> { | ||
/** Used as prefix */ | ||
label?: string; | ||
base?: StyleToken; | ||
props?: Variants & { | ||
[variant in keyof BaseVariants]?: { | ||
[key in keyof BaseVariants[variant]]?: StyleToken; | ||
}; | ||
}; | ||
defaults?: DefaultVariants<Variants & BaseVariants>; | ||
when?: [match: When<Variants & BaseVariants>, then: StyleToken][]; | ||
} | ||
interface StyleFunction { | ||
<Variants>(config?: StyleConfig<Variants>): Style<Variants>; | ||
<Variants, BaseVariants>(base: Style<BaseVariants>, config?: StyleConfig<Variants, BaseVariants>): Style<Variants & BaseVariants>; | ||
} | ||
declare type StyleProps<Variants> = VariantsProps<Variants>; | ||
interface Style<Variants> { | ||
/** | ||
* CSS Class associated with the current component. | ||
* | ||
* ```jsx | ||
* const button = style({ | ||
* base: css({ | ||
* color: "DarkSlateGray" | ||
* }) | ||
* }) | ||
* | ||
* <div className={button()} /> | ||
* ``` | ||
* <br /> | ||
*/ | ||
(props?: StyleProps<Variants>): string; | ||
/** | ||
* To be used as resolve within config.rules: | ||
* | ||
* ```js | ||
* { | ||
* rules: [ | ||
* // label?prop=value&other=propValue | ||
* // if the style has base eg no prop is required | ||
* ['label(\\?.+)?', style( /* ... *\/ )], | ||
* | ||
* // if the style requires at least one prop | ||
* ['label\\?(.+)', style( /* ... *\/ )], | ||
* ] | ||
* } | ||
* ``` | ||
* | ||
* The first group is used to extract the props using {@link !URLSearchParams | URLSearchParams}. | ||
*/ | ||
(match: MatchResult): string; | ||
readonly defaults: StyleProps<Variants>; | ||
/** | ||
* CSS Class associated with the current component. | ||
* | ||
* ```js | ||
* const button = style({ | ||
* base: css` | ||
* color: "DarkSlateGray" | ||
* ` | ||
* }) | ||
* | ||
* <div className={button.className} /> | ||
* ``` | ||
*/ | ||
readonly className: string; | ||
/** | ||
* CSS Selector associated with the current component. | ||
* | ||
* ```js | ||
* const button = style({ | ||
* base: css({ | ||
* color: "DarkSlateGray" | ||
* }) | ||
* }) | ||
* | ||
* const Card = styled({ | ||
* base: css` | ||
* & ${button.selector} { | ||
* boxShadow: "0 0 0 5px" | ||
* } | ||
* ` | ||
* }) | ||
* ``` | ||
*/ | ||
readonly selector: string; | ||
} | ||
/** | ||
* @group Class Name Generators | ||
*/ | ||
declare const style: StyleFunction; | ||
/** | ||
* @group Runtime | ||
* @param config | ||
* @param sheet | ||
*/ | ||
declare function twind<Theme extends BaseTheme = BaseTheme, Target = unknown>(config: TwindConfig<Theme>, sheet: Sheet<Target>): Twind<Theme, Target>; | ||
declare function twind<Theme = BaseTheme, Presets extends Preset<any>[] = Preset[], Target = unknown>(config: TwindUserConfig<Theme, Presets>, sheet: Sheet<Target>): Twind<BaseTheme & ExtractThemes<Theme, Presets>, Target>; | ||
interface TxFunction { | ||
(...classes: Class[]): string; | ||
(strings: TemplateStringsArray, ...interpolations: readonly Class[]): string; | ||
bind(thisArg?: ((tokens: string) => string) | undefined | void): TxFunction; | ||
call(thisArg: ((tokens: string) => string) | undefined | void, ...classes: Class[]): string; | ||
call(thisArg: ((tokens: string) => string) | undefined | void, strings: TemplateStringsArray, ...interpolations: readonly Class[]): string; | ||
apply(thisArg: ((tokens: string) => string) | undefined | void, classes: Class[] | [strings: TemplateStringsArray, ...interpolations: readonly Class[]]): string; | ||
} | ||
/** | ||
* Combines {@link tw} and {@link cx}. | ||
* | ||
* Using the default `tw` instance: | ||
* | ||
* ```js | ||
* import { tw } from 'twind' | ||
* tx`underline ${falsy && 'italic'}` | ||
* tx('underline', falsy && 'italic') | ||
* tx({'underline': true, 'italic': false}) | ||
* | ||
* // using a custom twind instance | ||
* import { tw } from './custom/twind' | ||
* import { tw } from './custom/twind' | ||
* tx.bind(tw) | ||
* ``` | ||
* | ||
* Using a custom `tw` instance: | ||
* | ||
* ```js | ||
* import { tx as tx$ } from 'twind' | ||
* import { tw } from './custom/twind' | ||
* | ||
* export const tx = tx$.bind(tw) | ||
* | ||
* tx`underline ${falsy && 'italic'}` | ||
* tx('underline', falsy && 'italic') | ||
* tx({'underline': true, 'italic': false}) | ||
* ``` | ||
* | ||
* @group Style Injectors | ||
* @param this {@link Twind} instance to use (default: {@link tw}) | ||
* @param strings | ||
* @param interpolations | ||
* @returns the class name | ||
*/ | ||
declare const tx: TxFunction; | ||
/** | ||
* @internal | ||
*/ | ||
declare const escape: typeof CSS.escape; | ||
/** | ||
* @group Configuration | ||
* @param value | ||
* @returns | ||
*/ | ||
declare function hash(value: string): string; | ||
/** | ||
* @internal | ||
* @param screen | ||
* @param prefix | ||
* @returns | ||
*/ | ||
declare function mql(screen: MaybeArray<ScreenValue>, prefix?: string): string; | ||
/** | ||
* @internal | ||
* @param value | ||
* @returns | ||
*/ | ||
declare function asArray<T>(value?: T): T extends Array<any> ? T : T[]; | ||
/** | ||
* @internal | ||
* @param value | ||
* @returns | ||
*/ | ||
declare function identity<T>(value: T): T; | ||
/** | ||
* @internal | ||
*/ | ||
declare function noop(): void; | ||
export { Animation, AnimationFunction, BaseProperties, BaseTheme, CSSBase, CSSFontFace, CSSNested, CSSObject, CSSProperties, CSSValue, Class, ClassObject, ColorFromThemeOptions, ColorFromThemeValue, ColorFunction, ColorFunctionOptions, ColorRecord, ColorValue, Context, CustomProperties, DarkColor, DarkModeConfig, DefaultVariants, ExtractResult, ExtractThemes, Falsey, FilterByThemeValue, HashFunction, InjectGlobalFunction, InlineMinify, InlineOptions, KebabCase, Keyframes, KeyframesFunction, MatchConverter, MatchResult, MaybeArray, MaybeColorValue, MaybeThunk, MorphVariant, Nested, NestedFunction, PartialTheme, Preflight, PreflightThunk, Preset, PresetThunk, PropsOf, RestoreSnapshot, Rule, RuleResolver, RuleResult, ScreenValue, Sheet, SheetFactory, SheetRule, StrictMorphVariant, StringLike, StringifyDeclaration, Style, StyleConfig, StyleFunction, StyleProps, StyleToken, StyleTokenValue, ThemeConfig, ThemeFunction, ThemeMatchConverter, ThemeMatchResult, ThemeRuleResolver, ThemeSection, ThemeSectionResolver, ThemeSectionResolverContext, ThemeValue, Twind, TwindConfig, TwindPresetConfig, TwindRule, TwindUserConfig, TxFunction, TypedAtRules, Variant, VariantResolver, VariantResult, VariantsProps, When, animation, apply, arbitrary, asArray, auto, autoDarkColor, colorFromTheme, consume, css, cssom, cx, defineConfig, dom, escape, extract, fromTheme, getSheet, hash, identity, injectGlobal, inline, install, keyframes, mql, noop, normalize, observe, setup, shortcut, stringify, style, toCSS, toColorValue, tw, twind, tx, virtual }; | ||
export { Animation, AnimationFunction, ArrayType, AutocompleteContext, AutocompleteItem, AutocompleteModifier, AutocompleteProvider, BaseProperties, BaseTheme, CSSBase, CSSFontFace, CSSNested, CSSObject, CSSProperties, CSSValue, Class, ClassObject, ColorFromThemeOptions, ColorFromThemeValue, ColorFunction, ColorFunctionOptions, ColorRecord, ColorValue, Context, CustomProperties, DarkColor, DarkModeConfig, DefaultVariants, ExtractResult, ExtractTheme, ExtractThemes, ExtractUserTheme, Falsey, FilterByThemeValue, HashFunction, InjectGlobalFunction, InlineMinify, InlineOptions, KebabCase, Keyframes, KeyframesFunction, MatchConverter, MatchResult, MaybeArray, MaybeColorValue, MaybeThunk, MorphVariant, Nested, NestedFunction, ParsedDevRule, ParsedRule, PartialTheme, Preflight, PreflightThunk, Preset, PresetThunk, PropsOf, RestoreSnapshot, Rule, RuleResolver, RuleResult, ScreenValue, Sheet, SheetFactory, SheetRule, StrictMorphVariant, StringLike, StringifyDeclaration, Style, StyleConfig, StyleFunction, StyleProps, StyleToken, StyleTokenValue, ThemeConfig, ThemeFunction, ThemeMatchConverter, ThemeMatchResult, ThemeRuleResolver, ThemeSection, ThemeSectionResolver, ThemeSectionResolverContext, ThemeValue, Twind, TwindConfig, TwindPresetConfig, TwindRule, TwindUserConfig, TxFunction, TypedAtRules, TypedAtRulesKeys, UnionToIntersection, Variant, VariantResolver, VariantResult, VariantsProps, When, animation, apply, arbitrary, asArray, auto, autoDarkColor, colorFromTheme, consume, css, cssom, cx, defineConfig, dom, escape, extract, fromMatch, fromTheme, getAutocompleteProvider, getSheet, hash, identity, injectGlobal, inline, install, keyframes, match, matchColor, matchTheme, mql, noop, normalize, observe, parse, setup, shortcut, stringify, style, toCSS, toColorValue, tw, twind, tx, virtual, withAutocomplete }; | ||
//# sourceMappingURL=twind.d.ts.map |
@@ -1,1 +0,1 @@ | ||
var e=function(e){"use strict";let t;function n(){return(n=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e}).apply(this,arguments)}function r(){return n.apply(this,arguments)}let i=new Map;function l(e,t){return i.set(e,t),e}let o="undefined"!=typeof CSS&&CSS.escape||(e=>e.replace(/[!"'`*+.,;:\\/<=>?@#$%&^|~()[\]{}]/g,"\\$&").replace(/^\d/,"\\3$& "));function u(e){for(var t=9,n=e.length;n--;)t=Math.imul(t^e.charCodeAt(n),1597334677);return"#"+((t^t>>>9)>>>0).toString(36)}function s(e,t="@media "){return t+c(e).map(e=>("string"==typeof e&&(e={min:e}),e.raw||Object.keys(e).map(t=>`(${t}-width:${e[t]})`).join(" and "))).join(",")}function c(e=[]){return Array.isArray(e)?e:null==e?[]:[e]}function a(e){return e}function f(){}function p(e){return[...e.v,(e.i?"!":"")+e.n].join(":")}let d={d:0,b:134217728,c:268435456,s:671088640,u:805306368,o:939524096};function h(e,t){return e&~d.o|t}function g(e){var t;return(null==(t=e.match(/[-=:;]/g))?void 0:t.length)||0}function y(e){return Math.min(/(?:^|width[^\d]+)(\d+(?:.\d+)?)(p)?/.test(e)?+RegExp.$1/(RegExp.$2?15:1)/10:0,15)<<22|Math.min(g(e),15)<<18}let m=["rst-c","st-ch","h-chi","y-lin","nk","sited","ecked","pty","ad-on","cus-w","ver","cus","cus-v","tive","sable","tiona","quire"];function b(e){return 1<<~(/:([a-z-]+)/.test(e)&&~m.indexOf(RegExp.$1.slice(2,7))||-18)}function v(e){return"-"==e[0]?0:g(e)+(/^(?:(border-(?!w|c|sty)|[tlbr].{2,4}m?$|c.{7}$)|([fl].{5}l|g.{8}$|pl))/.test(e)?+!!RegExp.$1||-!!RegExp.$2:0)+1}function $({n:e,i:t,v:n=[]},r,i,l){for(let o of(e&&(e=p({n:e,i:t,v:n})),l=[...c(l)],n)){let u=r.theme("screens",o);for(let a of c(u&&s(u)||r.v(o)))l.push(a),i|=u?67108864|y(a):"dark"==o?1073741824:"@"==a[0]?y(a):b(a)}return{n:e,p:i,r:l,i:t}}function w(e){if(e.d){let t=[],n=x(e.r.reduce((e,n)=>{var r,i;return"@"==n[0]?(t.push(n),e):n?(r=e,i=n,x(r,e=>x(i,t=>{let n=/(:merge\(.+?\))(:[a-z-]+|\\[.+])/.exec(t);if(n){let r=e.indexOf(n[1]);return~r?e.slice(0,r)+n[0]+e.slice(r+n[1].length):k(e,t)}return k(t,e)}))):e},"&"),t=>k(t,e.n?"."+o(e.n):""));return n&&t.push(n.replace(/:merge\((.+?)\)/g,"$1")),t.reduceRight((e,t)=>t+"{"+e+"}",e.d)}}function x(e,t){return e.replace(/ *((?:\(.+?\)|\[.+?\]|[^,])+) *(,|$)/g,(e,n,r)=>t(n)+r)}function k(e,t){return e.replace(/&/g,t)}function j(e,t,n,r){return l(e,(e,i)=>{let{n:l,p:o,r:u,i:s}=$(e,i,t);return n&&T(l,t,n,i,o,u,s,r)})}function A(e,t=","){return e.map(p).join(t)}function O(e,t){if("("!=e[e.length-1]){let n=[],r=!1,i=!1,l="";for(let o of e)if(!("("==o||/[~@]$/.test(o))){if("!"==o[0]&&(o=o.slice(1),r=!r),o.endsWith(":")){n["dark:"==o?"unshift":"push"](o.slice(0,-1));continue}"-"==o[0]&&(o=o.slice(1),i=!i),o.endsWith("-")&&(o=o.slice(0,-1)),o&&"&"!=o&&(l+=(l&&"-")+o)}l&&(i&&(l="-"+l),t[0].push({n:l,v:n.filter(S),i:r}))}}function S(e,t,n){return n.indexOf(e)==t}function M(e){return e.replace(/\/\*[^]*?\*\/|\s\s+|\n/gm," ")}let C=new Map;function E(e){let t=C.get(e);if(!t){e=M(e);let n=[],r=[[]],i=0,l=0,o=0,s=(t,l=0)=>{i!=o&&(n.push(e.slice(i,o+l)),t&&O(n,r)),i=o+1};for(;o<e.length;o++){let c=e[o];if(l)"\\"!=e[o-1]&&(l+=+("["==c)||-("]"==c));else if("["==c)l+=1;else if("("==c)s(),n.push(c);else if(":"==c)":"!=e[o+1]&&s(!1,1);else if(/[\s,)]/.test(c)){s(!0);let a=n.lastIndexOf("(");if(")"==c){let f=n[a-1];if(/[~@]$/.test(f)){let p=r.shift();n.length=a,O([...n,"#"],r);let{v:h}=r[0].pop();for(let g of p)g.v.splice(+("dark"==g.v[0])-+("dark"==h[0]),h.length);O([...n,j(f.length>1?f.slice(0,-1)+u(JSON.stringify([f,p])):f+"("+A(p)+")",d.s,p,/@$/.test(f))],r)}a=n.lastIndexOf("(",a-1)}n.length=a+1}else/[~@]/.test(c)&&"("==e[o+1]&&r.unshift([])}s(!0),C.set(e,t=r[0])}return t}let R=new Intl.Collator("en",{numeric:!0});function N(e,t){for(var n=0,r=e.length;n<r;){let i=r+n>>1;0>=V(e[i],t)?n=i+1:r=i}return r}function V(e,t){let n=e.p&d.o;return n==(t.p&d.o)&&(n==d.b||n==d.o)?0:e.p-t.p||e.o-t.o||R.compare(e.n,t.n)}function P(e,t){let n;let i=[];for(let l of e)l.d&&l.n?(null==n?void 0:n.p)==l.p&&""+n.r==""+l.r?(n.c=[n.c,l.c].filter(Boolean).join(" "),n.d=n.d+";"+l.d):i.push(n=r({},l,{n:l.n&&t})):i.push(r({},l,{n:l.n&&t}));return i}function z(e,t,n=d.u,r,i){let l=[];for(let o of e)for(let u of F(o,t,n,r,i))l.splice(N(l,u),0,u);return l}function F(e,t,n,l,o){var u;e=r({},e,{i:e.i||o});let s=function(e,t){let n=i.get(e.n);return n?n(e,t):t.r(e.n,"dark"==e.v[0])}(e,t);return s?"string"==typeof s?({r:l,p:n}=$(e,t,n,l),P(z(E(s),t,n,l,e.i),e.n)):Array.isArray(s)?s.map(e=>r({o:0},e,{r:[...c(l),...c(e.r)],p:h(n,null!=(u=e.p)?u:n)})):L(s,e,t,n,l):[{c:p(e),p:0,o:0,r:[]}]}function T(e,t,n,i,l,o,u,s){return P((s?n.flatMap(e=>z([e],i,l,o,u)):z(n,i,l,o,u)).map(e=>e.p&d.o&&(e.n||t==d.b)?r({},e,{p:h(e.p,t),o:0}):e),e)}function _(e,t){return Math.round(parseInt(e,16)*t)}function I(e,t={}){if("function"==typeof e)return e(t);let{opacityValue:n="1",opacityVariable:r}=t,i=r?`var(${r})`:n;if(e.includes("<alpha-value>"))return e.replace("<alpha-value>",i);if("#"==e[0]&&(4==e.length||7==e.length)){let l=(e.length-1)/3,o=[17,1,.062272][l-1];return`rgba(${[_(e.substr(1,l),o),_(e.substr(1+l,l),o),_(e.substr(1+2*l,l),o),i]})`}return"1"==i?e:"0"==i?"#0000":e.replace(/^(rgb|hsl)(\([^)]+)\)$/,`$1a$2,${i})`)}function L(e,t,n,r,i=[]){return function e(t,{n:n,p:r,r:i=[],i:l},o){let a=[],f="",p=0,g=0;for(let m in t||{}){let b=t[m];if("@"==m[0]){if(!b)continue;if("a"==m[1]){a.push(...T(n,r,E(""+b),o,r,i,l,!0));continue}if("l"==m[1]){for(let $ of c(b))a.push(...e($,{n:n,p:h(r,d[m[7]]),r:i,i:l},o));continue}if("i"==m[1]){a.push(...c(b).map(e=>({p:-1,o:0,r:[],d:m+" "+e})));continue}if("k"==m[1]){a.push({p:d.d,o:0,r:[m],d:e(b,{p:d.d},o).map(w).join("")});continue}if("f"==m[1]){a.push(...c(b).map(t=>({p:d.d,o:0,r:[m],d:e(t,{p:d.d},o).map(w).join("")})));continue}}if("object"!=typeof b||Array.isArray(b))"label"==m&&b?n=b+u(JSON.stringify([r,l,t])):(b||0===b)&&(m=m.replace(/[A-Z]/g,e=>"-"+e.toLowerCase()),g+=1,p=Math.max(p,v(m)),f+=(f?";":"")+c(b).map(e=>o.s(m,q(""+e,o.theme)+(l?" !important":""))).join(";"));else if("@"==m[0]||m.includes("&")){let x=r;"@"==m[0]&&(m=m.replace(/\bscreen\(([^)]+)\)/g,(e,t)=>{let n=o.theme("screens",t);return n?(x|=67108864,s(n,"")):e}),x|=y(m)),a.push(...e(b,{n:n,p:x,r:[...i,m],i:l},o))}else a.push(...e(b,{p:r,r:[...i,m]},o))}return a.unshift({n:n,p:r,o:Math.max(0,15-g)+1.5*Math.min(p||15,15),r:i,d:f}),a.sort(V)}(e,$(t,n,r,i),n)}function q(e,t){return e.replace(/theme\((["'`])?(.+?)\1(?:\s*,\s*(["'`])?(.+?)\3)?\)/g,(e,n,r,i,l)=>{let o=t(r,l);return"function"==typeof o&&/color|fill|stroke/i.test(r)?I(o):""+o})}function D(e,t,n){return t.reduce((t,r,i)=>t+n(r)+e[i+1],e[0])}function B(e,t){return Array.isArray(e)?U(D(e,t,e=>null!=e&&"boolean"!=typeof e?e:"")):"string"==typeof e?U(e):[e]}let J=/ *(?:(?:([\u0080-\uFFFF\w-%@]+) *:? *([^{;]+?);|([^;}{]*?) *{)|(}))/g;function U(e){let t;e=M(e);let n=[{}],r=[n[0]],i=[];for(;t=J.exec(e);)t[4]&&(n.shift(),i.shift()),t[3]?(i.unshift(t[3]),n.unshift({}),r.push(i.reduce((e,t)=>({[t]:e}),n[0]))):t[4]||(n[0][t[1]]&&(n.unshift({}),r.push(i.reduce((e,t)=>({[t]:e}),n[0]))),n[0][t[1]]=t[2]);return r}function W(e,...t){var n;let r=B(e,t),i=((null==(n=r.find(e=>e.label))?void 0:n.label)||"css")+u(JSON.stringify(r));return l(i,(e,t)=>P(r.flatMap(n=>L(n,e,t,d.o)),i))}let G=new Proxy(function(e,t){return Y("animation",e,t)},{get:(e,t)=>t in e?e[t]:function(e,n){return Y(t,e,n)}});function Y(e,t,n){return{toString:()=>W({label:e,"@layer components":r({},"object"==typeof t?t:{animation:t},{animationName:""+n})})}}function Z(e,t){return Array.isArray(e)&&Array.isArray(e.raw)?D(e,t,e=>H(e).trim()):t.filter(Boolean).reduce((e,t)=>e+H(t),e?H(e):"")}function H(e){let t,n="";if(e&&"object"==typeof e){if(Array.isArray(e))(t=Z(e[0],e.slice(1)))&&(n+=" "+t);else for(let r in e)e[r]&&(n+=" "+r)}else null!=e&&"boolean"!=typeof e&&(n+=" "+e);return n}function K(e,t){if(null==e)return{};var n,r,i={},l=Object.keys(e);for(r=0;r<l.length;r++)n=l[r],t.indexOf(n)>=0||(i[n]=e[n]);return i}function Q(e){var{presets:t=[]}=e,n=K(e,["presets"]);let i={preflight:!1!==n.preflight&&[],darkMode:void 0,darkColor:void 0,theme:{},variants:c(n.variants),rules:c(n.rules),ignorelist:c(n.ignorelist),hash:n.hash,stringify:n.stringify||X};for(let l of c([...t,{darkMode:n.darkMode,darkColor:n.darkColor,preflight:!1!==n.preflight&&c(n.preflight),theme:n.theme}])){let{preflight:o,darkMode:u=i.darkMode,darkColor:s=i.darkColor,theme:a,variants:f,rules:p,hash:d=i.hash,ignorelist:h,stringify:g=i.stringify}="function"==typeof l?l(i):l;i={preflight:!1!==i.preflight&&!1!==o&&[...i.preflight,...c(o)],darkMode:u,darkColor:s,theme:r({},i.theme,a,{extend:r({},i.theme.extend,null==a?void 0:a.extend)}),variants:[...i.variants,...c(f)],rules:[...i.rules,...c(p)],ignorelist:[...i.ignorelist,...c(h)],hash:d,stringify:g}}return i}function X(e,t){return e+":"+t}function ee(e,t,n,r,i,l){for(let o of t){let u=n.get(o);u||n.set(o,u=r(o));let s=u(e,i,l);if(s)return s}}function et(e){var t,n;return t=e[0],el(t,"function"==typeof(n=e[1])?n:()=>n)}function en(e){return Array.isArray(e)?er(e[0],e[1],e[2]):er(e)}function er(e,t,n){return el(e,t?"function"==typeof t?t:"string"==typeof t&&/^[\w-]+$/.test(t)?(e,r)=>({[t]:n?n(e,r):ei(e.input,e.slice(1).find(Boolean)||e.$$||e.input)}):()=>t:e=>({[e[1]]:ei(e.input,e.slice(2).find(Boolean)||e.$$||e.input)}))}function ei(e,t){return"-"==e[0]?`calc(${t} * -1)`:t}function el(e,t){return eo(e,(e,n,r,i)=>{let l=n.exec(e);if(l)return l.$$=e.slice(l[0].length),l.dark=i,t(l,r)})}function eo(e,t){let n=c(e).map(eu);return(e,r,i)=>{for(let l of n){let o=t(e,l,r,i);if(o)return o}}}function eu(e){return"string"==typeof e?RegExp("^"+e+(e.includes("$")||"-"==e.slice(-1)?"":"$")):e}function es(e,t){return e.replace(/--(tw-[\w-]+)\b/g,(e,n)=>"--"+t(n).replace("#",""))}function ec(e,t){let n=Q(e),i=function({theme:e,darkMode:t,darkColor:n,variants:r,rules:i,hash:l,stringify:s,ignorelist:f}){let p=new Map,d=new Map,h=new Map,g=new Map,y=eo(f,(e,t)=>t.test(e));r.push(["dark",Array.isArray(t)||"class"==t?`${c(t)[1]||".dark"} &`:"string"==typeof t&&"media"!=t?t:"@media (prefers-color-scheme:dark)"]);let m="function"==typeof l?e=>l(e,u):l?u:a;return{theme:function(e){var{extend:t={}}=e,n=K(e,["extend"]);let r={},i={get colors(){return l("colors")},theme:l,negative:()=>({}),breakpoints(e){let t={};for(let n in e)"string"==typeof e[n]&&(t["screen-"+n]=e[n]);return t}};return l;function l(e,i,u,s){if(e){var c;if({1:e,2:s}=/^(\S+?)(?:\s*\/\s*([^/]+))?$/.exec(e)||[,e],/[.[]/.test(e)){let a=[];e.replace(/\[([^\]]+)\]|([^.[]+)/g,(e,t,n=t)=>a.push(n)),e=a.shift(),u=i,i=a.join("-")}let f=r[e]||Object.assign(Object.assign(r[e]={},o(n,e)),o(t,e));if(null==i)return f;let p=null!=(c=f[i||"DEFAULT"])?c:u;return s?I(p,{opacityValue:q(s,l)}):p}let d={};for(let h of[...Object.keys(n),...Object.keys(t)])d[h]=l(h);return d}function o(e,t){let n=e[t];return("function"==typeof n&&(n=n(i)),n&&/color|fill|stroke/i.test(t))?function e(t,n=[]){let r={};for(let i in t){let l=t[i],o=[...n,i];r[o.join("-")]=l,"DEFAULT"==i&&(o=n,r[n.join("-")]=l),"object"==typeof l&&Object.assign(r,e(l,o))}return r}(n):n}}(e),e:o,h:m,s(e,t){return s(es(e,m),es(t,m),this)},d(e,t,r){return null==n?void 0:n(e,t,this,r)},v(e){return p.has(e)||p.set(e,ee(e,r,d,et,this)||"&:"+e),p.get(e)},r(e,t){let n=JSON.stringify([e,t]);return h.has(n)||h.set(n,!y(e,this)&&ee(e,i,g,en,this,t)),h.get(n)}}}(n),l=new Map,s=[],f=new Set;function p(e){let n=e.n&&i.h(e.n),l=w(n?r({},e,{n:n}):e);if(l&&!f.has(l)){f.add(l);let o=N(s,e);t.insert(l,o,e),s.splice(o,0,e)}return n}return t.resume(e=>l.set(e,e),(e,n)=>{t.insert(e,s.length,n),s.push(n),f.add(e)}),Object.defineProperties(function(e){if(!l.size)for(let t of c(n.preflight))"function"==typeof t&&(t=t(i)),t&&("string"==typeof t?T("",d.b,E(t),i,d.b,[],!1,!0):L(t,{},i,d.b)).forEach(p);e=""+e;let r=l.get(e);if(!r){let o=new Set;for(let u of z(E(e),i))o.add(u.c).add(p(u));r=[...o].filter(Boolean).join(" "),l.set(e,r).set(r,r)}return r},Object.getOwnPropertyDescriptors({get target(){return t.target},theme:i.theme,config:n,snapshot(){let e=t.snapshot(),n=new Set(f),r=new Map(l),i=[...s];return()=>{e(),f=n,l=r,s=i}},clear(){t.clear(),f=new Set,l=new Map,s=[]},destroy(){this.clear(),t.destroy()}}))}function ea(e,t){return e!=t&&""+e.split(" ").sort()!=""+t.split(" ").sort()}function ef(e=eb,t=document.documentElement){if(!t)return e;let n=new MutationObserver(i);n.observe(t,{attributeFilter:["class"],subtree:!0,childList:!0}),l(t),i([{target:t,type:""}]);let{destroy:r}=e;return e.destroy=()=>{n.disconnect(),r.call(e)},e;function i(e){for(let{type:t,target:r}of e)if("a"==t[0])l(r);else for(let i of r.querySelectorAll("[class]"))l(i);n.takeRecords()}function l(t){let n;let r=t.getAttribute("class");r&&ea(r,n=e(r))&&t.setAttribute("class",n)}}function ep(e){let t=e||document.querySelector("style[data-twind]");return t&&"STYLE"==t.tagName||((t=document.createElement("style")).dataset.twind="",document.head.prepend(t)),t}function ed(e){let t=(null==e?void 0:e.cssRules)?e:ep(e).sheet;return{target:t,snapshot(){let e=Array.from(t.cssRules,e=>e.cssText);return()=>{this.clear(),e.forEach(this.insert)}},clear(){for(let e=t.cssRules.length;e--;)t.deleteRule(e)},destroy(){var e;null==(e=t.ownerNode)||e.remove()},insert(e,n){try{t.insertRule(e,n)}catch(r){t.insertRule(":root{}",n),/:-[mwo]/.test(e)||console.warn(r,e)}},resume:f}}function eh(e){let t=ep(e);return{target:t,snapshot(){let e=Array.from(t.childNodes,e=>e.textContent);return()=>{this.clear(),e.forEach(this.insert)}},clear(){t.textContent=""},destroy(){t.remove()},insert(e,n){t.insertBefore(document.createTextNode(e),t.childNodes[n]||null)},resume:f}}function eg(e,t){let n=e?eh():ed();return t||(n.resume=em),n}function ey(e){return(e.ownerNode||e).textContent||(e.cssRules?Array.from(e.cssRules,e=>e.cssText):c(e)).join("")}function em(e,t){let n=ey(this.target),r=/\/\*!([\da-z]+),([\da-z]+)(?:,(.+?))?\*\//g;if(r.test(n)){var i;let l;for(let o of(r.lastIndex=0,this.clear(),document.querySelectorAll("[class]")))e(o.getAttribute("class"));for(;i=r.exec(n),l&&t(n.slice(l.index+l[0].length,null==i?void 0:i.index),{p:parseInt(l[1],36),o:parseInt(l[2],36)/2,n:l[3]}),l=i;);}}let eb=new Proxy(f,{apply:(e,n,r)=>t(r[0]),get(e,n){let r=(t||e)[n];return"function"==typeof r?r.bind(t):r}});function ev(e={},n=eg,r){return null==t||t.destroy(),t=ef(ec(e,"function"==typeof n?n():n),r)}let e$=function(e,...t){("function"==typeof this?this:eb)(W({"@layer base":B(e,t)}))},ew=function e(t){return new Proxy(function(e,...n){return ex(t,"",e,n)},{get:(n,r)=>"bind"===r?e:r in n?n[r]:function(e,...n){return ex(t,r,e,n)}})}();function ex(e,t,n,r){return{toString(){let i=B(n,r),l=o(t+u(JSON.stringify([t,i])));return("function"==typeof e?e:eb)(W({[`@keyframes ${l}`]:B(n,r)})),l}}}let ek=eA("@"),ej=eA("~");function eA(e){return new Proxy(function(e,...n){return t("",e,n)},{get:(e,n)=>n in e?e[n]:function(e,...r){return t(n,e,r)}});function t(t,n,r){return A(E(t+e+"("+Z(n,r)+")"))}}function eO(e,t){let n={};return"string"==typeof t?n[e]=t:(t.opacityVariable&&t.value.includes(t.opacityVariable)&&(n[t.opacityVariable]=t.opacityValue||"1"),n[e]=t.value),n}function eS(e,t,n){if("["==e[0]&&"]"==e.slice(-1)){if(e=eC(q(e.slice(1,-1),n.theme)),/color|fill|stroke/i.test(t)){if(/^(#|((hsl|rgb)a?|hwb|lab|lch|color)\(|[a-z]+$)/.test(e))return e}else if(!/image/i.test(t))return e;else if(/^[a-z-]+\(/.test(e))return e}}function eM(e){return e.replace(/-./g,e=>e[1].toUpperCase())}function eC(e){return e.includes("url(")?e.replace(/(.*?)(url\(.*?\))(.*?)/g,(e,t="",n,r="")=>eC(t)+n+eC(r)):e.replace(/(^|[^\\])_+/g,(e,t)=>t+" ".repeat(e.length-t.length)).replace(/\\_/g,"_").replace(/(calc|min|max|clamp)\(.+\)/g,e=>e.replace(/(-?\d*\.?\d(?!\b-.+[,)](?![^+\-/*])\D)(?:%|[a-z]+)?|\))([+\-/*])/g,"$1 $2 "))}let eE=(e,t)=>"function"==typeof e?eR(t,e):eR(e);function eR(e={},t){let{label:n="style",base:i,props:l={},defaults:s,when:c=[]}=e,a=r({},null==t?void 0:t.defaults,s),f=u(JSON.stringify([n,null==t?void 0:t.className,i,l,a,c])),p=h("",i||"",d.c);function h(e,r,i){return j(((t?t.className.replace(/#.+$/,"~"):"")+n+e+f).replace(/[: ,()[\]]/,""),i,r&&E(r))}return Object.defineProperties(function(e){let n,i;Array.isArray(e)&&(n=!0,e=Object.fromEntries(new URLSearchParams(e[1]).entries()));let o=r({},a,e),u=n?"":(t?t(o)+" ":"")+p;for(let s in l){let f=l[s],d=o[s];if(d===Object(d)){let g="";for(let y in i="",d){let m=f[d[y]];m&&(g+="@"+y+"-"+d[y],i+=(i&&" ")+("_"==y?m:y+":("+m+")"))}i&&(u+=" "+h("--"+s+"-"+g,i,402653184))}else(i=f[d])&&(u+=" "+h("--"+s+"-"+d,i,402653184))}return c.forEach((e,t)=>{let n="";for(let r in e[0]){let l=o[r];if(l!==Object(l)&&""+l==""+e[0][r])n+=(n&&"_")+r+"-"+l;else{n="";break}}n&&(i=e[1])&&(u+=" "+h("-"+t+"--"+n,i,536870912))}),u},Object.getOwnPropertyDescriptors({className:p,defaults:a,selector:"."+o(p)}))}let eN=function(e,...t){return("function"==typeof this?this:eb)(Z(e,t))};function eV(e,t=eb){let n=t.snapshot(),r={html:eP(e,t),css:ey(t.target)};return n(),r}function eP(e,t=eb){let n="",r=0;return function(e,t){let n=1,r=0,i="",l="",o=e=>{5==n&&"class"==l&&t(r,e,i)};for(let u=0;u<e.length;u++){let s=e[u];1==n?"<"==s&&(n="!--"==e.substr(u+1,3)?4:3):4==n?">"==s&&"--"==e.slice(u-2,u)&&(n=1):i?s==i&&"\\"!=e[u-1]&&(o(u),n=2,i=""):'"'==s||"'"==s?(i=s,r+=1):">"==s?(o(u),n=1):n&&("="==s?(l=e.slice(r,u),n=5,r=u+1):"/"==s&&(n<5||">"==e[u+1])?(o(u),n=0):/\s/.test(s)&&(o(u),n=2,r=u+1))}}(e,(i,l,o)=>{let u=e.slice(i,l),s=('"'==o?u.replace(/(=|\[)(?:'|'|')|(?:'|'|')(])/g,"$1'$2"):"'"==o?u.replace(/(=|\[)(?:"|"|")|(?:"|"|")(])/g,'$1"$2'):u).replace(/&/g,"&"),c=t(s);ea(u,c)&&(o=o?"":'"',n+=e.slice(r,i)+o+c+o,r=l)}),n+e.slice(r,e.length)}return e.animation=G,e.apply=ek,e.arbitrary=eS,e.asArray=c,e.auto=function(e){if(document.currentScript){let t=()=>n.disconnect(),n=new MutationObserver(n=>{for(let{target:r}of n)if(r===document.body)return e(),t()});return n.observe(document.documentElement,{childList:!0,subtree:!0}),t}return f},e.autoDarkColor=function(e,t,{theme:n}){return t=t.replace(/\d+$/,e=>100*(9-~~(parseInt(e,10)/100)||.5)),n(e,t)},e.colorFromTheme=function(e={},t){return(n,r)=>{let{section:i=eM(n[0]).replace("-","")+"Color"}=e;if(!/^(\[[^\]]+]|[^/]+?)(?:\/(.+))?$/.test(n.$$))return;let{$1:l,$2:o}=RegExp,u=r.theme(i,l)||eS(l,i,r);if(!u)return;let{opacityVariable:s=`--tw-${n[0].replace(/-$/,"")}-opacity`,opacitySection:c=i.replace("Color","Opacity"),property:a=i,selector:f}=e,p=r.theme(c,o||"DEFAULT")||o&&eS(o,c,r),d=t||(({_:e})=>{let t=eO(a,e);return f?{[f]:t}:t});n._={value:I(u,{opacityVariable:s||void 0,opacityValue:p||void 0}),color:e=>I(u,e),opacityVariable:s||void 0,opacityValue:p||void 0};let h=d(n,r);if(!n.dark){let g=r.d(i,l,u);g&&g!==u&&(n._={value:I(g,{opacityVariable:s||void 0,opacityValue:p||"1"}),color:e=>I(g,e),opacityVariable:s||void 0,opacityValue:p||void 0},h={"&":h,[r.v("dark")]:d(n,r)})}return h}},e.consume=eP,e.css=W,e.cssom=ed,e.cx=function(e,...t){return A(E(Z(e,t))," ")},e.defineConfig=Q,e.dom=eh,e.escape=o,e.extract=eV,e.fromTheme=function(e,t,n){let r=t?"string"==typeof t?(e,r)=>({[t]:n?n(e,r):e._}):t:({1:e,_:t},n,r)=>({[e||r]:t});return(t,n)=>{var i;let l=eM(e||t[1]),o=null!=(i=n.theme(l,t.$$))?i:eS(t.$$,l,n);if(null!=o)return t._="-"==t.input[0]?`calc(${o} * -1)`:o,r(t,n,l)}},e.getSheet=eg,e.hash=u,e.identity=a,e.injectGlobal=e$,e.inline=function(e,t={}){let{tw:n=eb,minify:r=a}="function"==typeof t?{tw:t}:t,{html:i,css:l}=eV(e,n);return i.replace("</head>",`<style data-twind>${r(l,i)}</style></head>`)},e.install=function(e,t){var n;let i=Q(e);return ev(r({},i,{hash:null!=(n=i.hash)?n:t}),()=>eg(!t))},e.keyframes=ew,e.mql=s,e.noop=f,e.normalize=eC,e.observe=ef,e.setup=ev,e.shortcut=ej,e.stringify=ey,e.style=eE,e.toCSS=eO,e.toColorValue=I,e.tw=eb,e.twind=ec,e.tx=eN,e.virtual=function(e){let t=[];return{target:t,snapshot(){let e=[...t];return()=>{t.splice(0,t.length,...e)}},clear(){t.length=0},destroy(){this.clear()},insert(n,r,i){t.splice(r,0,e?`/*!${i.p.toString(36)},${(2*i.o).toString(36)}${i.n?","+i.n:""}*/${n}`:n)},resume:f}},e}({});//# sourceMappingURL=twind.global.js.map | ||
var e=function(e){"use strict";let t;function r(e){return[...e.v,(e.i?"!":"")+e.n].join(":")}function n(e,t=","){return e.map(r).join(t)}let i="undefined"!=typeof CSS&&CSS.escape||(e=>e.replace(/[!"'`*+.,;:\\/<=>?@#$%&^|~()[\]{}]/g,"\\$&").replace(/^\d/,"\\3$& "));function o(e){for(var t=9,r=e.length;r--;)t=Math.imul(t^e.charCodeAt(r),1597334677);return"#"+((t^t>>>9)>>>0).toString(36)}function l(e,t="@media "){return t+u(e).map(e=>("string"==typeof e&&(e={min:e}),e.raw||Object.keys(e).map(t=>`(${t}-width:${e[t]})`).join(" and "))).join(",")}function u(e=[]){return Array.isArray(e)?e:null==e?[]:[e]}function s(e){return e}function a(){}let c={d:0,b:134217728,c:268435456,a:671088640,u:805306368,o:939524096};function f(e){var t;return(null==(t=e.match(/[-=:;]/g))?void 0:t.length)||0}function p(e){return Math.min(/(?:^|width[^\d]+)(\d+(?:.\d+)?)(p)?/.test(e)?+RegExp.$1/(RegExp.$2?15:1)/10:0,15)<<22|Math.min(f(e),15)<<18}let h=["rst-c","st-ch","h-chi","y-lin","nk","sited","ecked","pty","ad-on","cus-w","ver","cus","cus-v","tive","sable","tiona","quire"];function d({n:e,i:t,v:n=[]},i,o,s){for(let a of(e&&(e=r({n:e,i:t,v:n})),s=[...u(s)],n)){let c=i.theme("screens",a);for(let f of u(c&&l(c)||i.v(a))){var d;s.push(f),o|=c?67108864|p(f):"dark"==a?1073741824:"@"==f[0]?p(f):(d=f,1<<~(/:([a-z-]+)/.test(d)&&~h.indexOf(RegExp.$1.slice(2,7))||-18))}}return{n:e,p:o,r:s,i:t}}let g=new Map;function y(){return(y=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var n in r)Object.prototype.hasOwnProperty.call(r,n)&&(e[n]=r[n])}return e}).apply(this,arguments)}function m(){return y.apply(this,arguments)}function v(e){if(e.d){let t=[],r=b(e.r.reduce((e,r)=>"@"==r[0]?(t.push(r),e):r?b(e,e=>b(r,t=>{let r=/(:merge\(.+?\))(:[a-z-]+|\\[.+])/.exec(t);if(r){let n=e.indexOf(r[1]);return~n?e.slice(0,n)+r[0]+e.slice(n+r[1].length):$(e,t)}return $(t,e)})):e,"&"),t=>$(t,e.n?"."+i(e.n):""));return r&&t.push(r.replace(/:merge\((.+?)\)/g,"$1")),t.reduceRight((e,t)=>t+"{"+e+"}",e.d)}}function b(e,t){return e.replace(/ *((?:\(.+?\)|\[.+?\]|[^,])+) *(,|$)/g,(e,r,n)=>t(r)+n)}function $(e,t){return e.replace(/&/g,t)}let w=new Intl.Collator("en",{numeric:!0});function x(e,t){for(var r=0,n=e.length;r<n;){let i=n+r>>1;0>=A(e[i],t)?r=i+1:n=i}return n}function A(e,t){let r=e.p&c.o;return r==(t.p&c.o)&&(r==c.b||r==c.o)?0:e.p-t.p||e.o-t.o||w.compare(e.n,t.n)}function j(e,t){return Math.round(parseInt(e,16)*t)}function k(e,t={}){if("function"==typeof e)return e(t);let{opacityValue:r="1",opacityVariable:n}=t,i=n?`var(${n})`:r;if(e.includes("<alpha-value>"))return e.replace("<alpha-value>",i);if("#"==e[0]&&(4==e.length||7==e.length)){let o=(e.length-1)/3,l=[17,1,.062272][o-1];return`rgba(${[j(e.substr(1,o),l),j(e.substr(1+o,o),l),j(e.substr(1+2*o,o),l),i]})`}return"1"==i?e:"0"==i?"#0000":e.replace(/^(rgb|hsl)(\([^)]+)\)$/,`$1a$2,${i})`)}function O(e,t,r,n,i=[]){return function e(t,{n:r,p:n,r:i=[],i:s},a){let h=[],d="",g=0,y=0;for(let m in t||{}){var b,$;let w=t[m];if("@"==m[0]){if(!w)continue;if("a"==m[1]){h.push(...E(r,n,P(""+w),a,n,i,s,!0));continue}if("l"==m[1]){for(let x of u(w))h.push(...e(x,{n:r,p:(b=c[m[7]],n&~c.o|b),r:i,i:s},a));continue}if("i"==m[1]){h.push(...u(w).map(e=>({p:-1,o:0,r:[],d:m+" "+e})));continue}if("k"==m[1]){h.push({p:c.d,o:0,r:[m],d:e(w,{p:c.d},a).map(v).join("")});continue}if("f"==m[1]){h.push(...u(w).map(t=>({p:c.d,o:0,r:[m],d:e(t,{p:c.d},a).map(v).join("")})));continue}}if("object"!=typeof w||Array.isArray(w))"label"==m&&w?r=w+o(JSON.stringify([n,s,t])):(w||0===w)&&(m=m.replace(/[A-Z]/g,e=>"-"+e.toLowerCase()),y+=1,g=Math.max(g,"-"==($=m)[0]?0:f($)+(/^(?:(border-(?!w|c|sty)|[tlbr].{2,4}m?$|c.{7}$)|([fl].{5}l|g.{8}$|pl))/.test($)?+!!RegExp.$1||-!!RegExp.$2:0)+1),d+=(d?";":"")+u(w).map(e=>a.s(m,S(""+e,a.theme)+(s?" !important":""))).join(";"));else if("@"==m[0]||m.includes("&")){let j=n;"@"==m[0]&&(m=m.replace(/\bscreen\(([^)]+)\)/g,(e,t)=>{let r=a.theme("screens",t);return r?(j|=67108864,l(r,"")):e}),j|=p(m)),h.push(...e(w,{n:r,p:j,r:[...i,m],i:s},a))}else h.push(...e(w,{p:n,r:[...i,m]},a))}return h.unshift({n:r,p:n,o:Math.max(0,15-y)+1.5*Math.min(g||15,15),r:i,d:d}),h.sort(A)}(e,d(t,r,n,i),r)}function S(e,t){return e.replace(/theme\((["'`])?(.+?)\1(?:\s*,\s*(["'`])?(.+?)\3)?\)/g,(e,r,n,i,o)=>{let l=t(n,o);return"function"==typeof l&&/color|fill|stroke/i.test(n)?k(l):""+l})}function M(e,t){let r;let n=[];for(let i of e)i.d&&i.n?(null==r?void 0:r.p)==i.p&&""+r.r==""+i.r?(r.c=[r.c,i.c].filter(Boolean).join(" "),r.d=r.d+";"+i.d):n.push(r=m({},i,{n:i.n&&t})):n.push(m({},i,{n:i.n&&t}));return n}function C(e,t,n=c.u,i,o){let l=[];for(let s of e)for(let a of function(e,t,n,i,o){var l;e=m({},e,{i:e.i||o});let s=function(e,t){let r=g.get(e.n);return r?r(e,t):t.r(e.n,"dark"==e.v[0])}(e,t);return s?"string"==typeof s?({r:i,p:n}=d(e,t,n,i),M(C(P(s),t,n,i,e.i),e.n)):Array.isArray(s)?s.map(e=>{var t,r;return m({o:0},e,{r:[...u(i),...u(e.r)],p:(t=n,r=null!=(l=e.p)?l:n,t&~c.o|r)})}):O(s,e,t,n,i):[{c:r(e),p:0,o:0,r:[]}]}(s,t,n,i,o))l.splice(x(l,a),0,a);return l}function E(e,t,r,n,i,o,l,u){return M((u?r.flatMap(e=>C([e],n,i,o,l)):C(r,n,i,o,l)).map(e=>e.p&c.o&&(e.n||t==c.b)?m({},e,{p:e.p&~c.o|t,o:0}):e),e)}function R(e,t,r,n){var i;return i=(e,i)=>{let{n:o,p:l,r:u,i:s}=d(e,i,t);return r&&E(o,t,r,i,l,u,s,n)},g.set(e,i),e}function N(e,t){if("("!=e[e.length-1]){let r=[],n=!1,i=!1,o="";for(let l of e)if(!("("==l||/[~@]$/.test(l))){if("!"==l[0]&&(l=l.slice(1),n=!n),l.endsWith(":")){r["dark:"==l?"unshift":"push"](l.slice(0,-1));continue}"-"==l[0]&&(l=l.slice(1),i=!i),l.endsWith("-")&&(l=l.slice(0,-1)),l&&"&"!=l&&(o+=(o&&"-")+l)}o&&(i&&(o="-"+o),t[0].push({n:o,v:r.filter(V),i:n}))}}function V(e,t,r){return r.indexOf(e)==t}let z=new Map;function P(e){let t=z.get(e);if(!t){let r=[],i=[[]],l=0,u=0,s=null,a=0,f=(t,n=0)=>{l!=a&&(r.push(e.slice(l,a+n)),t&&N(r,i)),l=a+1};for(;a<e.length;a++){let p=e[a];if(u)"\\"!=e[a-1]&&(u+=+("["==p)||-("]"==p));else if("["==p)u+=1;else if(s)"\\"!=e[a-1]&&s.test(e.slice(a))&&(s=null,l=a+RegExp.lastMatch.length);else if("/"==p&&"\\"!=e[a-1]&&("*"==e[a+1]||"/"==e[a+1]))s="*"==e[a+1]?/^\*\//:/^[\r\n]/;else if("("==p)f(),r.push(p);else if(":"==p)":"!=e[a+1]&&f(!1,1);else if(/[\s,)]/.test(p)){f(!0);let h=r.lastIndexOf("(");if(")"==p){let d=r[h-1];if(/[~@]$/.test(d)){let g=i.shift();r.length=h,N([...r,"#"],i);let{v:y}=i[0].pop();for(let m of g)m.v.splice(+("dark"==m.v[0])-+("dark"==y[0]),y.length);N([...r,R(d.length>1?d.slice(0,-1)+o(JSON.stringify([d,g])):d+"("+n(g)+")",c.a,g,/@$/.test(d))],i)}h=r.lastIndexOf("(",h-1)}r.length=h+1}else/[~@]/.test(p)&&"("==e[a+1]&&i.unshift([])}f(!0),z.set(e,t=i[0])}return t}function T(e,t,r){return t.reduce((t,n,i)=>t+r(n)+e[i+1],e[0])}function F(e,t){return Array.isArray(e)&&Array.isArray(e.raw)?T(e,t,e=>_(e).trim()):t.filter(Boolean).reduce((e,t)=>e+_(t),e?_(e):"")}function _(e){let t,r="";if(e&&"object"==typeof e){if(Array.isArray(e))(t=F(e[0],e.slice(1)))&&(r+=" "+t);else for(let n in e)e[n]&&(r+=" "+n)}else null!=e&&"boolean"!=typeof e&&(r+=" "+e);return r}let I=q("@"),L=q("~");function q(e){return new Proxy(function(e,...r){return t("",e,r)},{get:(e,r)=>r in e?e[r]:function(e,...n){return t(r,e,n)}});function t(t,r,i){return n(P(t+e+"("+F(r,i)+")"))}}function D(e,t){return Array.isArray(e)?B(T(e,t,e=>null!=e&&"boolean"!=typeof e?e:"")):"string"==typeof e?B(e):[e]}let J=/ *(?:(?:([\u0080-\uFFFF\w-%@]+) *:? *([^{;]+?);|([^;}{]*?) *{)|(}))/g;function B(e){let t;e=e.replace(/\/\*[^]*?\*\/|\s\s+|\n/gm," ");let r=[{}],n=[r[0]],i=[];for(;t=J.exec(e);)t[4]&&(r.shift(),i.shift()),t[3]?(i.unshift(t[3]),r.unshift({}),n.push(i.reduce((e,t)=>({[t]:e}),r[0]))):t[4]||(r[0][t[1]]&&(r.unshift({}),n.push(i.reduce((e,t)=>({[t]:e}),r[0]))),r[0][t[1]]=t[2]);return n}function U(e,...t){var r,n;let i=D(e,t),l=((null==(r=i.find(e=>e.label))?void 0:r.label)||"css")+o(JSON.stringify(i));return n=(e,t)=>M(i.flatMap(r=>O(r,e,t,c.o)),l),g.set(l,n),l}let W=new Proxy(function(e,t){return G("animation",e,t)},{get:(e,t)=>t in e?e[t]:function(e,r){return G(t,e,r)}});function G(e,t,r){return{toString:()=>U({label:e,"@layer components":m({},"object"==typeof t?t:{animation:t},{animationName:""+r})})}}let Y=Symbol();function Z(e,t){if(null==e)return{};var r,n,i={},o=Object.keys(e);for(n=0;n<o.length;n++)r=o[n],t.indexOf(r)>=0||(i[r]=e[r]);return i}function H(e){var{presets:t=[]}=e,r=Z(e,["presets"]);let n={preflight:!1!==r.preflight&&[],darkMode:void 0,darkColor:void 0,theme:{},variants:u(r.variants),rules:u(r.rules),ignorelist:u(r.ignorelist),hash:r.hash,stringify:r.stringify||K};for(let i of u([...t,{darkMode:r.darkMode,darkColor:r.darkColor,preflight:!1!==r.preflight&&u(r.preflight),theme:r.theme,hash:r.hash,stringify:r.stringify}])){let{preflight:o,darkMode:l=n.darkMode,darkColor:s=n.darkColor,theme:a,variants:c,rules:f,ignorelist:p,hash:h=n.hash,stringify:d=n.stringify}="function"==typeof i?i(n):i;n={preflight:!1!==n.preflight&&!1!==o&&[...n.preflight,...u(o)],darkMode:l,darkColor:s,theme:m({},n.theme,a,{extend:m({},n.theme.extend,null==a?void 0:a.extend)}),variants:[...n.variants,...u(c)],rules:[...n.rules,...u(f)],ignorelist:[...n.ignorelist,...u(p)],hash:h,stringify:d}}return n}function K(e,t){return e+":"+t}function Q(e,t){return"function"==typeof e?e:"string"==typeof e&&/^[\w-]+$/.test(e)?(r,n)=>({[e]:t?t(r,n):X(r,1)}):t=>e||{[t[1]]:X(t,2)}}function X(e,t,r=e.slice(t).find(Boolean)||e.$$||e.input){return"-"==e.input[0]?`calc(${r} * -1)`:r}function ee(e,t,r){let n="string"==typeof t?(e,n)=>({[t]:r?r(e,n):e._}):t||(({1:e,_:t},r,n)=>({[e||n]:t}));return(t,r)=>{var i;let o=ei(e||t[1]),l=null!=(i=r.theme(o,t.$$))?i:en(t.$$,o,r);if(null!=l)return t._=X(t,0,l),n(t,r,o)}}function et(e={},t){return(r,n)=>{let{section:i=ei(r[0]).replace("-","")+"Color"}=e;if(!/^(\[[^\]]+]|[^/]+?)(?:\/(.+))?$/.test(r.$$))return;let{$1:o,$2:l}=RegExp,u=n.theme(i,o)||en(o,i,n);if(!u||"object"==typeof u)return;let{opacityVariable:s=`--tw-${r[0].replace(/-$/,"")}-opacity`,opacitySection:a=i.replace("Color","Opacity"),property:c=i,selector:f}=e,p=n.theme(a,l||"DEFAULT")||l&&en(l,a,n),h=t||(({_:e})=>{let t=er(c,e);return f?{[f]:t}:t});r._={value:k(u,{opacityVariable:s||void 0,opacityValue:p||void 0}),color:e=>k(u,e),opacityVariable:s||void 0,opacityValue:p||void 0};let d=h(r,n);if(!r.dark){let g=n.d(i,o,u);g&&g!==u&&(r._={value:k(g,{opacityVariable:s||void 0,opacityValue:p||"1"}),color:e=>k(g,e),opacityVariable:s||void 0,opacityValue:p||void 0},d={"&":d,[n.v("dark")]:h(r,n)})}return d}}function er(e,t){let r={};return"string"==typeof t?r[e]=t:(t.opacityVariable&&t.value.includes(t.opacityVariable)&&(r[t.opacityVariable]=t.opacityValue||"1"),r[e]=t.value),r}function en(e,t,r){if("["==e[0]&&"]"==e.slice(-1)&&(e=eo(S(e.slice(1,-1),r.theme)),!(/color|fill|stroke/i.test(t)&&!(/^color:/.test(e)||/^(#|((hsl|rgb)a?|hwb|lab|lch|color)\(|[a-z]+$)/.test(e))||/image/i.test(t)&&!(/^image:/.test(e)||/^[a-z-]+\(/.test(e))||/weight/i.test(t)&&!(/^(number|any):/.test(e)||/^\d+$/.test(e))||/position/i.test(t)&&/^(length|size):/.test(e))))return e.replace(/^[a-z-]+:/,"")}function ei(e){return e.replace(/-./g,e=>e[1].toUpperCase())}function eo(e){return e.includes("url(")?e.replace(/(.*?)(url\(.*?\))(.*?)/g,(e,t="",r,n="")=>eo(t)+r+eo(n)):e.replace(/(^|[^\\])_+/g,(e,t)=>t+" ".repeat(e.length-t.length)).replace(/\\_/g,"_").replace(/(calc|min|max|clamp)\(.+\)/g,e=>e.replace(/(-?\d*\.?\d(?!\b-.+[,)](?![^+\-/*])\D)(?:%|[a-z]+)?|\))([+\-/*])/g,"$1 $2 "))}function el(e,t,r,n,i,o){for(let l of t){let u=r.get(l);u||r.set(l,u=n(l));let s=u(e,i,o);if(s)return s}}function eu(e){var t;return ea(e[0],"function"==typeof(t=e[1])?t:()=>t)}function es(e){var t,r;return Array.isArray(e)?ea(e[0],Q(e[1],e[2])):ea(e,Q(t,r))}function ea(e,t){return ec(e,(e,r,n,i)=>{let o=r.exec(e);if(o)return o.$$=e.slice(o[0].length),o.dark=i,t(o,n)})}function ec(e,t){let r=u(e).map(ef);return(e,n,i)=>{for(let o of r){let l=t(e,o,n,i);if(l)return l}}}function ef(e){return"string"==typeof e?RegExp("^"+e+(e.includes("$")||"-"==e.slice(-1)?"":"$")):e}function ep(e,t){return e.replace(/--(tw(?:-[\w-]+)?)\b/g,(e,r)=>"--"+t(r).replace("#",""))}function eh(e,t){let r=H(e),n=function({theme:e,darkMode:t,darkColor:r,variants:n,rules:l,hash:a,stringify:c,ignorelist:f}){let p=new Map,h=new Map,d=new Map,g=new Map,y=ec(f,(e,t)=>t.test(e));n.push(["dark",Array.isArray(t)||"class"==t?`${u(t)[1]||".dark"} &`:"string"==typeof t&&"media"!=t?t:"@media (prefers-color-scheme:dark)"]);let m="function"==typeof a?e=>a(e,o):a?o:s;return{theme:function(e){var{extend:t={}}=e,r=Z(e,["extend"]);let n={},i={get colors(){return o("colors")},theme:o,negative:()=>({}),breakpoints(e){let t={};for(let r in e)"string"==typeof e[r]&&(t["screen-"+r]=e[r]);return t}};return o;function o(e,i,u,s){if(e){var a;if({1:e,2:s}=/^(\S+?)(?:\s*\/\s*([^/]+))?$/.exec(e)||[,e],/[.[]/.test(e)){let c=[];e.replace(/\[([^\]]+)\]|([^.[]+)/g,(e,t,r=t)=>c.push(r)),e=c.shift(),u=i,i=c.join("-")}let f=n[e]||Object.assign(Object.assign(n[e]={},l(r,e)),l(t,e));if(null==i)return f;let p=null!=(a=f[i||"DEFAULT"])?a:u;return s?k(p,{opacityValue:S(s,o)}):p}let h={};for(let d of[...Object.keys(r),...Object.keys(t)])h[d]=o(d);return h}function l(e,t){let r=e[t];return("function"==typeof r&&(r=r(i)),r&&/color|fill|stroke/i.test(t))?function e(t,r=[]){let n={};for(let i in t){let o=t[i],l=[...r,i];n[l.join("-")]=o,"DEFAULT"==i&&(l=r,n[r.join("-")]=o),"object"==typeof o&&Object.assign(n,e(o,l))}return n}(r):r}}(e),e:i,h:m,s(e,t){return c(ep(e,m),ep(t,m),this)},d(e,t,n){return null==r?void 0:r(e,t,this,n)},v(e){return p.has(e)||p.set(e,el(e,n,h,eu,this)||"&:"+e),p.get(e)},r(e,t){let r=JSON.stringify([e,t]);return d.has(r)||d.set(r,!y(e,this)&&el(e,l,g,es,this,t)),d.get(r)}}}(r),l=new Map,a=[],f=new Set;function p(e){let r=e.n&&n.h(e.n),i=v(r?m({},e,{n:r}):e);if(i&&!f.has(i)){f.add(i);let o=x(a,e);t.insert(i,o,e),a.splice(o,0,e)}return r}return t.resume(e=>l.set(e,e),(e,r)=>{t.insert(e,a.length,r),a.push(r),f.add(e)}),Object.defineProperties(function(e){if(!l.size)for(let t of u(r.preflight))"function"==typeof t&&(t=t(n)),t&&("string"==typeof t?E("",c.b,P(t),n,c.b,[],!1,!0):O(t,{},n,c.b)).forEach(p);e=""+e;let i=l.get(e);if(!i){let o=new Set;for(let s of C(P(e),n))o.add(s.c).add(p(s));i=[...o].filter(Boolean).join(" "),l.set(e,i).set(i,i)}return i},Object.getOwnPropertyDescriptors({get target(){return t.target},theme:n.theme,config:r,snapshot(){let e=t.snapshot(),r=new Set(f),n=new Map(l),i=[...a];return()=>{e(),f=r,l=n,a=i}},clear(){t.clear(),f=new Set,l=new Map,a=[]},destroy(){this.clear(),t.destroy()}}))}function ed(e,t){return e!=t&&""+e.split(" ").sort()!=""+t.split(" ").sort()}function eg(e=ex,t=document.documentElement){if(!t)return e;let r=new MutationObserver(i);r.observe(t,{attributeFilter:["class"],subtree:!0,childList:!0}),o(t),i([{target:t,type:""}]);let{destroy:n}=e;return e.destroy=()=>{r.disconnect(),n.call(e)},e;function i(e){for(let{type:t,target:n}of e)if("a"==t[0])o(n);else for(let i of n.querySelectorAll("[class]"))o(i);r.takeRecords()}function o(t){let r;let n=t.getAttribute("class");n&&ed(n,r=e(n))&&t.setAttribute("class",r)}}function ey(e){let t=document.querySelector(e||"style[data-twind]");return t&&"STYLE"==t.tagName||((t=document.createElement("style")).dataset.twind="",document.head.prepend(t)),t}function em(e){let t=(null==e?void 0:e.cssRules)?e:(e&&"string"!=typeof e?e:ey(e)).sheet;return{target:t,snapshot(){let e=Array.from(t.cssRules,e=>e.cssText);return()=>{this.clear(),e.forEach(this.insert)}},clear(){for(let e=t.cssRules.length;e--;)t.deleteRule(e)},destroy(){var e;null==(e=t.ownerNode)||e.remove()},insert(e,r){try{t.insertRule(e,r)}catch(n){t.insertRule(":root{}",r),/:-[mwo]/.test(e)}},resume:a}}function ev(e){let t=e&&"string"!=typeof e?e:ey(e);return{target:t,snapshot(){let e=Array.from(t.childNodes,e=>e.textContent);return()=>{this.clear(),e.forEach(this.insert)}},clear(){t.textContent=""},destroy(){t.remove()},insert(e,r){t.insertBefore(document.createTextNode(e),t.childNodes[r]||null)},resume:a}}function eb(e,t){let r=e?ev():em();return t||(r.resume=ew),r}function e$(e){return(e.ownerNode||e).textContent||(e.cssRules?Array.from(e.cssRules,e=>e.cssText):u(e)).join("")}function ew(e,t){let r=e$(this.target),n=/\/\*!([\da-z]+),([\da-z]+)(?:,(.+?))?\*\//g;if(n.test(r)){var i;let o;for(let l of(n.lastIndex=0,this.clear(),document.querySelectorAll("[class]")))e(l.getAttribute("class"));for(;i=n.exec(r),o&&t(r.slice(o.index+o[0].length,null==i?void 0:i.index),{p:parseInt(o[1],36),o:parseInt(o[2],36)/2,n:o[3]}),o=i;);}}let ex=new Proxy(a,{apply:(e,r,n)=>t(n[0]),get(e,r){let n=t[r];return"function"==typeof n?function(){return n.apply(t,arguments)}:n}});function eA(e={},r=eb,n){return null==t||t.destroy(),t=eg(eh(e,"function"==typeof r?r():r),n)}let ej=function e(t){return new Proxy(function(e,...r){return ek(t,"",e,r)},{get:(r,n)=>"bind"===n?e:n in r?r[n]:function(e,...r){return ek(t,n,e,r)}})}();function ek(e,t,r,n){return{toString(){let l=D(r,n),u=i(t+o(JSON.stringify([t,l])));return("function"==typeof e?e:ex)(U({[`@keyframes ${u}`]:D(r,n)})),u}}}function eO(e,t=ex){let r=t.snapshot(),n={html:eS(e,t),css:e$(t.target)};return r(),n}function eS(e,t=ex){let r="",n=0;return!function(e,t){let r=1,n=0,i="",o="",l=l=>{5==r&&"class"==o&&!1===t(n,l,i)&&(e="")};for(let u=0;u<e.length;u++){let s=e[u];1==r?"<"==s&&(r="!--"==e.substr(u+1,3)?4:3):4==r?">"==s&&"--"==e.slice(u-2,u)&&(r=1):i?s==i&&"\\"!=e[u-1]&&(l(u),r=2,i=""):'"'==s||"'"==s?(i=s,n+=1):">"==s?(l(u),r=1):r&&("="==s?(o=e.slice(n,u),r=5,n=u+1):"/"==s&&(r<5||">"==e[u+1])?(l(u),r=0):/\s/.test(s)&&(l(u),r=2,n=u+1))}}(e,(i,o,l)=>{var u;let s=e.slice(i,o),a=t(('"'==(u=l)?s.replace(/(=|\[)(?:'|'|')|(?:'|'|')(])/g,"$1'$2"):"'"==u?s.replace(/(=|\[)(?:"|"|")|(?:"|"|")(])/g,'$1"$2'):s).replace(/(&|&|&)/g,"&"));ed(s,a)&&(l=l?"":'"',r+=e.slice(n,i)+l+a+l,n=o)}),r+e.slice(n,e.length)}let eM=(e,t)=>"function"==typeof e?eC(t,e):eC(e);function eC(e={},t){let{label:r="style",base:n,props:l={},defaults:u,when:s=[]}=e,a=m({},null==t?void 0:t.defaults,u),f=o(JSON.stringify([r,null==t?void 0:t.className,n,l,a,s])),p=h("",n||"",c.c);function h(e,n,i){return R(((t?t.className.replace(/#.+$/,"~"):"")+r+e+f).replace(/[: ,()[\]]/,""),i,n&&P(n))}return Object.defineProperties(function(e){let r,n;Array.isArray(e)&&(r=!0,e=Object.fromEntries(new URLSearchParams(e[1]).entries()));let i=m({},a,e),o=r?"":(t?t(i)+" ":"")+p;for(let u in l){let c=l[u],f=i[u];if(f===Object(f)){let d="";for(let g in n="",f){let y=c[f[g]];y&&(d+="@"+g+"-"+f[g],n+=(n&&" ")+("_"==g?y:g+":("+y+")"))}n&&(o+=" "+h("--"+u+"-"+d,n,402653184))}else(n=c[f])&&(o+=" "+h("--"+u+"-"+f,n,402653184))}return s.forEach((e,t)=>{let r="";for(let l in e[0]){let u=i[l];if(u!==Object(u)&&""+u==""+e[0][l])r+=(r&&"_")+l+"-"+u;else{r="";break}}r&&(n=e[1])&&(o+=" "+h("-"+t+"--"+r,n,536870912))}),o},Object.getOwnPropertyDescriptors({className:p,defaults:a,selector:"."+i(p)}))}return e.animation=W,e.apply=I,e.arbitrary=en,e.asArray=u,e.auto=function(e){if(document.currentScript){let t=()=>r.disconnect(),r=new MutationObserver(r=>{for(let{target:n}of r)if(n===document.body)return e(),t()});return r.observe(document.documentElement,{childList:!0,subtree:!0}),t}return a},e.autoDarkColor=function(e,t,{theme:r}){return r(e,t=t.replace(/\d+$/,e=>100*(9-~~(parseInt(e,10)/100)||.5)))},e.colorFromTheme=et,e.consume=eS,e.css=U,e.cssom=em,e.cx=function(e,...t){return n(P(F(e,t))," ")},e.defineConfig=H,e.dom=ev,e.escape=i,e.extract=eO,e.fromMatch=Q,e.fromTheme=ee,e.getAutocompleteProvider=function(e){return e[Y]},e.getSheet=eb,e.hash=o,e.identity=s,e.injectGlobal=function(e,...t){("function"==typeof this?this:ex)(U({"@layer base":D(e,t)}))},e.inline=function(e,t={}){let{tw:r=ex,minify:n=s}="function"==typeof t?{tw:t}:t,{html:i,css:o}=eO(e,r);return i.replace("</head>",`<style data-twind>${n(o,i)}</style></head>`)},e.install=function(e,t=!0){var r;let n=H(e);return eA(m({},n,{hash:null!=(r=n.hash)?r:t}),()=>eb(!t))},e.keyframes=ej,e.match=function(e,t,r){return[e,Q(t,r)]},e.matchColor=function(e,t={},r){return[e,et(t,r)]},e.matchTheme=function(e,t,r,n){return[e,ee(t,r,n)]},e.mql=l,e.noop=a,e.normalize=eo,e.observe=eg,e.parse=P,e.setup=eA,e.shortcut=L,e.stringify=e$,e.style=eM,e.toCSS=er,e.toColorValue=k,e.tw=ex,e.twind=eh,e.tx=function(e,...t){return("function"==typeof this?this:ex)(F(e,t))},e.virtual=function(e){let t=[];return{target:t,snapshot(){let e=[...t];return()=>{t.splice(0,t.length,...e)}},clear(){t.length=0},destroy(){this.clear()},insert(r,n,i){t.splice(n,0,e?`/*!${i.p.toString(36)},${(2*i.o).toString(36)}${i.n?","+i.n:""}*/${r}`:r)},resume:a}},e.withAutocomplete=function(e){return e},e}({});//# sourceMappingURL=twind.global.js.map |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is too big to display
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is too big to display
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Major refactor
Supply chain riskPackage has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.
Found 1 instance in 1 package
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
2247190
27
12668
32
1
Updatedcsstype@^3.1.1