@unocss/svelte-scoped
Version:
Use UnoCSS in a modular fashion with styles being stored only in the Svelte component they are used in: Vite plugin for apps, Svelte preprocessor for component libraries
59 lines (52 loc) • 2.09 kB
text/typescript
import { LoadConfigResult } from '@unocss/config';
import { UserConfig, UnoGenerator } from '@unocss/core';
interface UnocssSveltePreprocessOptions extends TransformClassesOptions, TransformApplyOptions, TransformDirectivesOptions {
/**
* UnoCSS config or path to config file. If not provided, will load unocss.config.ts/js. It's recommended to use the separate config file if you are having trouble with the UnoCSS extension in VSCode.
*/
configOrPath?: UserConfig | string
}
interface TransformClassesOptions {
/**
* Prefix for compiled class names. Distinct between `@unocss/svelte-scoped/vite` and `@unocss/svelte-scoped/preprocessor` to avoid bugs when using a component library built with `@unocss/svelte-scoped/preprocessor` in a project using `@unocss/svelte-scoped/vite`.
* @default 'uno-' // `@unocss/svelte-scoped/vite`
* @default 'usp-' // `@unocss/svelte-scoped/preprocessor`
*/
classPrefix?: string
/**
* Add hash and combine recognized tokens (optimal for production); set false in dev mode for easy dev tools toggling to allow for design adjustments in the browser
* @default true
*/
combine?: boolean
/**
* Used to generate hash for compiled class names
*/
hashFn?: (str: string) => string
}
interface TransformApplyOptions {
/**
* Transform CSS custom properties (recommended for CSS syntax compatibility) or @apply directives.
*
* Pass `false` to disable.
*
* @default ['--at-apply', '@apply']
*/
applyVariables?: string | string[] | false
}
interface TransformDirectivesOptions {
/**
* Transform the `theme()` directive (recommended for CSS syntax compatibility).
*
* Disable for TailwindCss compatibility.
*
* Pass `false` to disable.
*
* @default true
*/
transformThemeDirective?: boolean
}
interface SvelteScopedContext {
uno: UnoGenerator
ready: Promise<LoadConfigResult<UserConfig>>
}
export type { SvelteScopedContext as S, TransformClassesOptions as T, UnocssSveltePreprocessOptions as U, TransformApplyOptions as a, TransformDirectivesOptions as b };