@ui0/theme 0.0.0-stage → 0.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +113 -2
- package/dist/backdrop.module.css +1 -0
- package/dist/backdrop.scss +7 -0
- package/dist/color.inject.module.css +7 -0
- package/dist/color.module.css +3 -0
- package/dist/color.scss +84 -0
- package/dist/components/index.d.ts +4 -0
- package/dist/components/index.d.ts.map +1 -0
- package/dist/components/index.js +53 -0
- package/dist/components/style.css +1 -0
- package/dist/components/theme-provider.keys.d.ts +4 -0
- package/dist/components/theme-provider.keys.d.ts.map +1 -0
- package/dist/components/theme-provider.module.css +1 -0
- package/dist/components/theme-provider.types.d.ts +18 -0
- package/dist/components/theme-provider.types.d.ts.map +1 -0
- package/dist/components/theme-provider.vue.d.ts +19 -0
- package/dist/config.default.d.mts +4 -0
- package/dist/config.default.d.mts.map +1 -0
- package/dist/config.default.mjs +73 -0
- package/dist/config.default.mjs.map +1 -0
- package/dist/disabled.inject.module.css +5 -0
- package/dist/disabled.module.css +1 -0
- package/dist/disabled.scss +3 -0
- package/dist/display.module.css +2 -0
- package/dist/display.scss +63 -0
- package/dist/duration.scss +17 -0
- package/dist/elevation.module.css +33 -0
- package/dist/elevation.scss +46 -0
- package/dist/generate-BPYE5ALG.mjs +1037 -0
- package/dist/generate-BPYE5ALG.mjs.map +1 -0
- package/dist/generator/cli.d.mts +1 -0
- package/dist/generator/cli.mjs +103 -0
- package/dist/generator/cli.mjs.map +1 -0
- package/dist/generator/vite.d.mts +18 -0
- package/dist/generator/vite.d.mts.map +1 -0
- package/dist/generator/vite.mjs +117 -0
- package/dist/generator/vite.mjs.map +1 -0
- package/dist/index.d.mts +339 -0
- package/dist/index.d.mts.map +1 -0
- package/dist/index.mjs +909 -0
- package/dist/index.mjs.map +1 -0
- package/dist/is.scss +185 -0
- package/dist/load-config-64q6nzFy.mjs +48 -0
- package/dist/load-config-64q6nzFy.mjs.map +1 -0
- package/dist/ripple.scss +57 -0
- package/dist/round.inject.module.css +92 -0
- package/dist/round.module.css +14 -0
- package/dist/round.scss +90 -0
- package/dist/size.inject.module.css +50 -0
- package/dist/size.module.css +13 -0
- package/dist/size.scss +28 -0
- package/dist/theme.scss +16 -0
- package/dist/typography.inject.module.css +81 -0
- package/dist/typography.module.css +32 -0
- package/dist/typography.scss +21 -0
- package/dist/util.scss +78 -0
- package/dist/vars.scss +0 -0
- package/package.json +96 -4
- package/src/contracts/backdrop/backdrop.contract.ts +44 -0
- package/src/contracts/backdrop/backdrop.generator.ts +82 -0
- package/src/contracts/backdrop/backdrop.keys.ts +7 -0
- package/src/contracts/backdrop/backdrop.module.css +3 -0
- package/src/contracts/backdrop/backdrop.scss +7 -0
- package/src/contracts/backdrop/backdrop.types.ts +45 -0
- package/src/contracts/backdrop/index.ts +21 -0
- package/src/contracts/color/color.contract.spec.ts +75 -0
- package/src/contracts/color/color.contract.ts +97 -0
- package/src/contracts/color/color.generator.spec.ts +73 -0
- package/src/contracts/color/color.generator.ts +122 -0
- package/src/contracts/color/color.gradient.spec.ts +32 -0
- package/src/contracts/color/color.gradient.ts +52 -0
- package/src/contracts/color/color.inject.module.css +5 -0
- package/src/contracts/color/color.keys.ts +7 -0
- package/src/contracts/color/color.module.css +5 -0
- package/src/contracts/color/color.scss +84 -0
- package/src/contracts/color/color.serialize.spec.ts +57 -0
- package/src/contracts/color/color.serialize.ts +35 -0
- package/src/contracts/color/color.token.spec.ts +57 -0
- package/src/contracts/color/color.token.ts +89 -0
- package/src/contracts/color/color.types.ts +82 -0
- package/src/contracts/color/index.md +87 -0
- package/src/contracts/color/index.ts +25 -0
- package/src/contracts/contract.ts +115 -0
- package/src/contracts/disabled/disabled.contract.ts +32 -0
- package/src/contracts/disabled/disabled.generator.ts +32 -0
- package/src/contracts/disabled/disabled.inject.module.css +5 -0
- package/src/contracts/disabled/disabled.keys.ts +6 -0
- package/src/contracts/disabled/disabled.module.css +3 -0
- package/src/contracts/disabled/disabled.scss +3 -0
- package/src/contracts/disabled/disabled.types.ts +19 -0
- package/src/contracts/disabled/index.ts +21 -0
- package/src/contracts/display/display.contract.ts +41 -0
- package/src/contracts/display/display.generator.ts +57 -0
- package/src/contracts/display/display.instance.ts +173 -0
- package/src/contracts/display/display.keys.ts +9 -0
- package/src/contracts/display/display.module.css +4 -0
- package/src/contracts/display/display.scss +63 -0
- package/src/contracts/display/display.types.ts +75 -0
- package/src/contracts/display/index.ts +27 -0
- package/src/contracts/elevation/elevation.contract.ts +37 -0
- package/src/contracts/elevation/elevation.generator.ts +71 -0
- package/src/contracts/elevation/elevation.keys.ts +6 -0
- package/src/contracts/elevation/elevation.module.css +35 -0
- package/src/contracts/elevation/elevation.scss +46 -0
- package/src/contracts/elevation/elevation.types.ts +21 -0
- package/src/contracts/elevation/index.ts +20 -0
- package/src/contracts/generator.ts +38 -0
- package/src/contracts/index.md +48 -0
- package/src/contracts/index.ts +37 -0
- package/src/contracts/round/index.ts +21 -0
- package/src/contracts/round/round.contract.ts +75 -0
- package/src/contracts/round/round.generator.ts +33 -0
- package/src/contracts/round/round.inject.module.scss +36 -0
- package/src/contracts/round/round.keys.ts +7 -0
- package/src/contracts/round/round.module.css +16 -0
- package/src/contracts/round/round.scss +90 -0
- package/src/contracts/round/round.types.ts +44 -0
- package/src/contracts/size/index.ts +22 -0
- package/src/contracts/size/size.contract.ts +98 -0
- package/src/contracts/size/size.generator.spec.ts +101 -0
- package/src/contracts/size/size.generator.ts +51 -0
- package/src/contracts/size/size.inject.module.scss +12 -0
- package/src/contracts/size/size.keys.ts +8 -0
- package/src/contracts/size/size.module.css +15 -0
- package/src/contracts/size/size.scss +28 -0
- package/src/contracts/size/size.types.ts +63 -0
- package/src/contracts/size/units.scss +17 -0
- package/src/contracts/style/index.ts +11 -0
- package/src/contracts/style/style.generator.ts +36 -0
- package/src/contracts/style/style.key.ts +4 -0
- package/src/contracts/style/style.types.ts +16 -0
- package/src/contracts/typography/index.ts +26 -0
- package/src/contracts/typography/typography.contract.ts +52 -0
- package/src/contracts/typography/typography.generator.spec.ts +48 -0
- package/src/contracts/typography/typography.generator.ts +44 -0
- package/src/contracts/typography/typography.inject.module.css +54 -0
- package/src/contracts/typography/typography.keys.ts +12 -0
- package/src/contracts/typography/typography.module.css +36 -0
- package/src/contracts/typography/typography.scss +21 -0
- package/src/contracts/typography/typography.types.ts +90 -0
- package/src/generator/theme.default.css +657 -0
- package/src/styles/duration.scss +17 -0
- package/src/styles/index.md +18 -0
- package/src/styles/is.scss +185 -0
- package/src/styles/ripple.scss +57 -0
- package/src/styles/theme.scss +16 -0
- package/src/styles/util.scss +78 -0
- package/src/styles/vars.scss +0 -0
package/dist/index.d.mts
ADDED
|
@@ -0,0 +1,339 @@
|
|
|
1
|
+
import { InjectionKey, Ref } from "vue";
|
|
2
|
+
import { ThemeProvider } from "./components/index.js";
|
|
3
|
+
import { AnyProps, CSSModuleClassList, ClassList, ComponentColor, ComponentElevation, ComponentRound, ComponentRoundTarget, ContractProvider, ContractRefs, InheritValue, LiteralUnion, MaybeAngle, MaybePercents, MaybeUnits, Numberish, RgbTuple, StyleList, ThemeAppearance, ThemeContract, ThemeContractDeal, ThemeContractGenerator, ThemeContractGenerator as ThemeContractGenerator$1, ThemeContractName, ThemeContractName as ThemeContractName$1, ThemeInstance, ThemeInstance as ThemeInstance$1, ThemeInstanceOptions, ThemeInstanceOptions as ThemeInstanceOptions$1, ThemePluginConfig, ThemePluginConfig as ThemePluginConfig$1, ThemePreset, ThemePresetName, ThemePresetName as ThemePresetName$1, Ui0CoreInstallablePlugin, Ui0ThemeColorRef, Ui0ThemeContractSettings, Ui0ThemeContracts, Ui0ThemeContracts as Ui0ThemeContracts$1, Ui0ThemePresetAppearanceConfig, Ui0ThemePresetAppearanceConfig as Ui0ThemePresetAppearanceConfig$1, UpdateFn } from "@ui0/types";
|
|
4
|
+
/** the backdrop-filter functions the backdrop prop selects from */
|
|
5
|
+
type BackdropFunction = 'blur' | 'brightness' | 'contrast' | 'drop-shadow' | 'grayscale' | 'hue-rotate' | 'invert' | 'opacity' | 'saturate' | 'sepia';
|
|
6
|
+
interface BackdropProps {
|
|
7
|
+
backdrop?: BackdropFunction | `${BackdropFunction}@${Numberish}`;
|
|
8
|
+
}
|
|
9
|
+
/** per-function default values the generator turns into setter classes */
|
|
10
|
+
interface BackdropThemeAppearanceConfig {
|
|
11
|
+
blur?: MaybeUnits;
|
|
12
|
+
brightness?: MaybePercents;
|
|
13
|
+
contrast?: MaybePercents;
|
|
14
|
+
'drop-shadow'?: string;
|
|
15
|
+
grayscale?: MaybePercents;
|
|
16
|
+
'hue-rotate'?: MaybeAngle;
|
|
17
|
+
invert?: MaybePercents;
|
|
18
|
+
opacity?: MaybePercents;
|
|
19
|
+
saturate?: MaybePercents;
|
|
20
|
+
sepia?: MaybePercents;
|
|
21
|
+
}
|
|
22
|
+
declare module '@ui0/types/theme' {
|
|
23
|
+
interface Ui0ThemePresetAppearanceConfig {
|
|
24
|
+
backdrop?: BackdropThemeAppearanceConfig;
|
|
25
|
+
}
|
|
26
|
+
interface Ui0ThemeContracts extends BackdropProps {}
|
|
27
|
+
interface Ui0ThemeContractSettings {
|
|
28
|
+
/** `false` disables the contract entirely; otherwise per-function toggles */
|
|
29
|
+
backdrop?: false | Partial<Record<BackdropFunction, boolean>>;
|
|
30
|
+
}
|
|
31
|
+
}
|
|
32
|
+
/** the `color` prop: text/foreground paint. See color.token.ts for the dsl. */
|
|
33
|
+
interface ColorProps {
|
|
34
|
+
color?: Ui0ThemeColorRef;
|
|
35
|
+
}
|
|
36
|
+
/** the `fill` prop: background paint. Same dsl as `color`. */
|
|
37
|
+
interface FillProps {
|
|
38
|
+
fill?: Ui0ThemeColorRef;
|
|
39
|
+
}
|
|
40
|
+
/** the `gradient` prop: background-image linear-gradient composed from pool
|
|
41
|
+
* refs (`to-br error->success@80`). Resolved onto `--0-g-cur` as an
|
|
42
|
+
* inline style - see color.gradient.ts. */
|
|
43
|
+
interface GradientProps {
|
|
44
|
+
gradient?: Ui0ThemeColorRef;
|
|
45
|
+
}
|
|
46
|
+
/** legacy alias kept for the package's public type exports */
|
|
47
|
+
interface Gradientable {
|
|
48
|
+
color?: ComponentColor;
|
|
49
|
+
}
|
|
50
|
+
type ThemeColorName = string;
|
|
51
|
+
type ThemeColorPool = Record<ThemeColorName, ThemeColorEntry>;
|
|
52
|
+
/** the color contract's settings inside a theme preset (appearance config) -
|
|
53
|
+
* a flat pool: role/arbitrary name -> color entry (ramp expressions allowed) */
|
|
54
|
+
type ColorThemeAppearanceConfig = ThemeColorPool;
|
|
55
|
+
/** (l)ighten, (d)arken, (c)ontrast, (s)hade. */
|
|
56
|
+
type ThemeColorRampType = 'l' | 'd' | 'c' | 's';
|
|
57
|
+
/** Color space the ramp math runs in - perceptual `oklch` or legacy `hsl`. */
|
|
58
|
+
type ThemeColorSpace = 'hsl' | 'oklch';
|
|
59
|
+
interface ColorOptions {
|
|
60
|
+
ramps?: ThemeColorRampType[];
|
|
61
|
+
space?: ThemeColorSpace;
|
|
62
|
+
}
|
|
63
|
+
type ThemeColorBlendExpr = [string | RgbTuple, string | RgbTuple, number];
|
|
64
|
+
type ThemeColorRef = string;
|
|
65
|
+
type ThemeColorEntry = ThemeColorRef | [ThemeColorRef | ThemeColorBlendExpr, number, (ThemeColorRampType[] | ColorOptions)?];
|
|
66
|
+
/** consumer-side color contract settings (ThemePluginConfig.contracts.color) */
|
|
67
|
+
type ColorScheme = 'light' | 'dark';
|
|
68
|
+
type ColorPseudo = 'hover' | 'active' | 'focus';
|
|
69
|
+
interface ColorToken {
|
|
70
|
+
scheme?: ColorScheme;
|
|
71
|
+
pseudo?: ColorPseudo;
|
|
72
|
+
/** pool reference: `name` or `name-{l|d|c|s}{step}` */
|
|
73
|
+
ref: string;
|
|
74
|
+
/** 0..1; undefined = fully opaque */
|
|
75
|
+
opacity?: number;
|
|
76
|
+
}
|
|
77
|
+
declare module '@ui0/types/theme' {
|
|
78
|
+
interface Ui0ThemePresetAppearanceConfig {
|
|
79
|
+
color?: ColorThemeAppearanceConfig;
|
|
80
|
+
}
|
|
81
|
+
interface Ui0ThemeContractSettings {
|
|
82
|
+
/** `false` (or `true`) toggles the contract wholesale; an object is
|
|
83
|
+
* reserved for color contract options (none yet) */
|
|
84
|
+
color?: boolean | Record<string, unknown>;
|
|
85
|
+
}
|
|
86
|
+
interface Ui0ThemeContracts extends ColorProps, FillProps, GradientProps {}
|
|
87
|
+
}
|
|
88
|
+
interface DisabledProps {
|
|
89
|
+
disabled?: boolean;
|
|
90
|
+
}
|
|
91
|
+
interface DisabledThemeAppearanceConfig {
|
|
92
|
+
opacity?: number;
|
|
93
|
+
}
|
|
94
|
+
declare module '@ui0/types/theme' {
|
|
95
|
+
interface Ui0ThemePresetAppearanceConfig {
|
|
96
|
+
disabled?: DisabledThemeAppearanceConfig;
|
|
97
|
+
}
|
|
98
|
+
interface Ui0ThemeContractSettings {
|
|
99
|
+
disabled?: boolean;
|
|
100
|
+
}
|
|
101
|
+
interface Ui0ThemeContracts extends DisabledProps {}
|
|
102
|
+
}
|
|
103
|
+
interface ElevationProps {
|
|
104
|
+
elevation?: ComponentElevation;
|
|
105
|
+
}
|
|
106
|
+
interface ElevationThemeAppearanceConfig {
|
|
107
|
+
steps?: number;
|
|
108
|
+
}
|
|
109
|
+
declare module '@ui0/types/theme' {
|
|
110
|
+
interface Ui0ThemePresetAppearanceConfig {
|
|
111
|
+
elevation?: ElevationThemeAppearanceConfig;
|
|
112
|
+
}
|
|
113
|
+
interface Ui0ThemeContractSettings {
|
|
114
|
+
elevation?: boolean;
|
|
115
|
+
}
|
|
116
|
+
interface Ui0ThemeContracts extends ElevationProps {}
|
|
117
|
+
}
|
|
118
|
+
interface RoundProps {
|
|
119
|
+
round?: Round;
|
|
120
|
+
roundTarget?: RoundTarget;
|
|
121
|
+
}
|
|
122
|
+
interface RoundThemeAppearanceConfig {
|
|
123
|
+
rounding: 'relative' | 'static';
|
|
124
|
+
}
|
|
125
|
+
declare module '@ui0/types/theme' {
|
|
126
|
+
interface Ui0ThemePresetAppearanceConfig {
|
|
127
|
+
round?: RoundThemeAppearanceConfig;
|
|
128
|
+
}
|
|
129
|
+
interface Ui0ThemeContractSettings {
|
|
130
|
+
round?: {
|
|
131
|
+
rounding: 'relative' | 'static';
|
|
132
|
+
};
|
|
133
|
+
}
|
|
134
|
+
interface Ui0ThemeContracts extends RoundProps {}
|
|
135
|
+
}
|
|
136
|
+
type RoundTarget = InheritValue | 'top' | 'bottom' | 'left' | 'right' | 'top-none' | 'bottom-none' | 'left-none' | 'right-none' | 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right' | 'top-left-none' | 'top-right-none' | 'bottom-left-none' | 'bottom-right-none';
|
|
137
|
+
type Round = LiteralUnion<InheritValue | 'basic' | 'full' | 'none' | 'hard' | 'smooth'>;
|
|
138
|
+
type SizeXXXS = 'xxx-small' | 'xxxs';
|
|
139
|
+
type SizeXXS = 'xx-small' | 'xxs';
|
|
140
|
+
type SizeXS = 'x-small' | 'xs';
|
|
141
|
+
type SizeS = 'small' | 's';
|
|
142
|
+
type SizeM = 'medium' | 'm';
|
|
143
|
+
type SizeL = 'large' | 'l';
|
|
144
|
+
type SizeXL = 'x-large' | 'xl';
|
|
145
|
+
type SizeXXL = 'xx-large' | 'xxl';
|
|
146
|
+
type SizeXXXL = 'xxx-large' | 'xxxl';
|
|
147
|
+
type Size = SizeXXXS | SizeXXS | SizeXS | SizeS | SizeM | SizeL | SizeXL | SizeXXL | SizeXXXL | 'custom' | 'smaller' | 'larger' | InheritValue;
|
|
148
|
+
type SizeDensity = LiteralUnion<'normal' | 'compact' | 'child'>;
|
|
149
|
+
interface SizeProps {
|
|
150
|
+
size?: Size;
|
|
151
|
+
}
|
|
152
|
+
interface DensityProps {
|
|
153
|
+
density?: SizeDensity;
|
|
154
|
+
}
|
|
155
|
+
/** the size contract's settings inside a theme preset (appearance config) */
|
|
156
|
+
interface SizeThemeAppearanceConfig {
|
|
157
|
+
/** the control's base height -> expands into the --0-s-* scale */
|
|
158
|
+
control?: MaybeUnits;
|
|
159
|
+
/** a control's child (icon etc.) base height -> the --0-sc-* scale */
|
|
160
|
+
child?: MaybeUnits;
|
|
161
|
+
}
|
|
162
|
+
/** the absolute scale steps a `size` prop can pick (long and short spellings) */
|
|
163
|
+
declare const SizeValuesAbsolute: Size[];
|
|
164
|
+
declare module '@ui0/types/theme' {
|
|
165
|
+
interface Ui0ThemePresetAppearanceConfig {
|
|
166
|
+
size?: SizeThemeAppearanceConfig;
|
|
167
|
+
}
|
|
168
|
+
interface Ui0ThemeContractSettings {
|
|
169
|
+
size?: boolean;
|
|
170
|
+
}
|
|
171
|
+
interface Ui0ThemeContracts extends SizeProps, DensityProps {}
|
|
172
|
+
}
|
|
173
|
+
/**
|
|
174
|
+
* Merge the built-in default preset UNDER every preset of the consumer's
|
|
175
|
+
* config (weakest -> strongest: built-in default <- the preset itself), so
|
|
176
|
+
* any setting a preset omits falls back to the default. The default preset
|
|
177
|
+
* itself is always present; an empty consumer config gets exactly the
|
|
178
|
+
* built-in default. Contract settings follow the same rule - the built-in
|
|
179
|
+
* `contracts` map sits under the consumer's one (deep-merged per contract).
|
|
180
|
+
*/
|
|
181
|
+
export declare function withDefaults(config?: ThemePluginConfig$1): ThemePluginConfig$1;
|
|
182
|
+
/**
|
|
183
|
+
* The structural result of a generation run: the theme css (preset blocks +
|
|
184
|
+
* contract setter classes inside `@layer theme`) plus each contract's css
|
|
185
|
+
* keyed by name - a consumer that wants to split outputs takes the pieces
|
|
186
|
+
* apart instead of the single {@link generateThemeCss} string.
|
|
187
|
+
*/
|
|
188
|
+
interface ThemeArtifacts {
|
|
189
|
+
themeCss: string;
|
|
190
|
+
contractCss: Record<string, string>;
|
|
191
|
+
/** per-contract consumer scss (localScss), first preset wins - config-independent */
|
|
192
|
+
localScss: Record<string, string>;
|
|
193
|
+
}
|
|
194
|
+
/**
|
|
195
|
+
* Generate the theme for a resolved config: one base block per preset
|
|
196
|
+
* (`.theme-{preset}`) plus a scheme block per declared appearance
|
|
197
|
+
* (`.theme_{scheme}`, re-declaring the full merged config), and every
|
|
198
|
+
* contract's setter classes, deduped across presets, inside `@layer theme`.
|
|
199
|
+
*
|
|
200
|
+
* @param config - a config already passed through {@link withDefaults}
|
|
201
|
+
* @param emitPresets - which presets get a css block. Defaults to every
|
|
202
|
+
* preset of `config`; pass the consumer's own preset names to keep the
|
|
203
|
+
* built-in default out of the emitted css while it still back-fills the
|
|
204
|
+
* consumer's presets with fallback values
|
|
205
|
+
* @returns the assembled theme css and the per-contract css/scss pieces
|
|
206
|
+
*/
|
|
207
|
+
export declare function generateThemeArtifacts(config: ThemePluginConfig$1, emitPresets?: ThemePresetName$1[]): ThemeArtifacts;
|
|
208
|
+
/**
|
|
209
|
+
* Generate the complete theme CSS for a resolved config - the single-string
|
|
210
|
+
* form of {@link generateThemeArtifacts}. Pass the result through
|
|
211
|
+
* `withDefaults` first unless the config is already self-complete.
|
|
212
|
+
*
|
|
213
|
+
* @param config - a config already passed through {@link withDefaults}
|
|
214
|
+
* @param emitPresets - which presets get a css block (see
|
|
215
|
+
* {@link generateThemeArtifacts})
|
|
216
|
+
* @returns the theme css (preset + scheme blocks + setter classes)
|
|
217
|
+
*/
|
|
218
|
+
export declare function generateThemeCss(config: ThemePluginConfig$1, emitPresets?: ThemePresetName$1[]): string;
|
|
219
|
+
/**
|
|
220
|
+
* Generate a .d.ts that augments the global Ui0Theme* registries so the
|
|
221
|
+
* editor can suggest what exists: Ui0ThemeNames (presets for ThemeProvider),
|
|
222
|
+
* Ui0ThemeSchemeNames (appearances), Ui0ThemeColorNames (pool refs incl.
|
|
223
|
+
* ramp steps, unioned across every emitted preset and scheme). Pass
|
|
224
|
+
* withDefaults(config).
|
|
225
|
+
*
|
|
226
|
+
* @param config - a config already passed through {@link withDefaults}
|
|
227
|
+
* @param emitPresets - which presets contribute names (see
|
|
228
|
+
* {@link generateThemeArtifacts}); defaults to every preset of `config`
|
|
229
|
+
*/
|
|
230
|
+
export declare function generateThemeTypes(config: ThemePluginConfig$1, emitPresets?: ThemePresetName$1[]): string;
|
|
231
|
+
export declare function createUi0Theme(config: ThemePluginConfig$1): Ui0CoreInstallablePlugin;
|
|
232
|
+
export declare function createThemeInstance(config: ThemePluginConfig$1, options?: ThemeInstanceOptions$1): ThemeInstance$1;
|
|
233
|
+
export declare function useTheme(): ThemeInstance$1 | undefined;
|
|
234
|
+
type DisplayMeasure = 'width' | 'height';
|
|
235
|
+
type DisplayBreakpoint = string | 'xxs' | 's' | 'xs' | 'xxl' | 'lg' | 'xl' | 'hd' | 'fhd' | 'qhd' | 'uhd';
|
|
236
|
+
type DisplayBreakpoints = Record<DisplayBreakpoint, Numberish>;
|
|
237
|
+
interface DisplayProps {}
|
|
238
|
+
interface DisplayThemeAppearanceConfig {
|
|
239
|
+
/** e.g. a base value the generator emits as a css var */
|
|
240
|
+
base?: MaybeUnits;
|
|
241
|
+
}
|
|
242
|
+
declare module '@ui0/types/theme' {
|
|
243
|
+
interface Ui0ThemePresetAppearanceConfig {
|
|
244
|
+
display?: DisplayThemeAppearanceConfig;
|
|
245
|
+
}
|
|
246
|
+
interface Ui0ThemeContractSettings {
|
|
247
|
+
display?: {
|
|
248
|
+
breakpoints: DisplayBreakpoints;
|
|
249
|
+
};
|
|
250
|
+
}
|
|
251
|
+
interface Ui0ThemeContracts extends DisplayProps {}
|
|
252
|
+
}
|
|
253
|
+
interface DisplayReturn {
|
|
254
|
+
breakpoints: DisplayBreakpoints;
|
|
255
|
+
between: (point: DisplayBreakpoint, b: DisplayBreakpoint, measure?: DisplayMeasure) => Ref<boolean>;
|
|
256
|
+
greater: (point: DisplayBreakpoint, measure?: DisplayMeasure) => Ref<boolean>;
|
|
257
|
+
less: (point: DisplayBreakpoint, measure?: DisplayMeasure) => Ref<boolean>;
|
|
258
|
+
}
|
|
259
|
+
export declare function useDisplay(onUpdate?: UpdateFn): DisplayReturn;
|
|
260
|
+
declare class ThemeContractInstance implements ContractProvider {
|
|
261
|
+
props: AnyProps;
|
|
262
|
+
/**
|
|
263
|
+
* context have any provided props from styler's
|
|
264
|
+
*/
|
|
265
|
+
context: ContractRefs | null;
|
|
266
|
+
$styles: CSSModuleClassList;
|
|
267
|
+
name: string;
|
|
268
|
+
classList: ClassList;
|
|
269
|
+
styleList: StyleList;
|
|
270
|
+
contracts: Partial<Record<ThemeContractName$1, ThemeContract>>;
|
|
271
|
+
constructor(name: string, props?: Ui0ThemeContracts$1, styles?: CSSModuleClassList);
|
|
272
|
+
add(contract: ThemeContract): void;
|
|
273
|
+
prop(name: keyof Ui0ThemeContracts$1 | Array<keyof Ui0ThemeContracts$1>): {
|
|
274
|
+
styles(): StyleList;
|
|
275
|
+
classes(): ClassList;
|
|
276
|
+
};
|
|
277
|
+
remove(name: ThemeContractName$1): void;
|
|
278
|
+
setContext(p: ContractRefs): void;
|
|
279
|
+
classes(props_?: AnyProps, $styles?: CSSModuleClassList): ClassList;
|
|
280
|
+
styles(props_?: AnyProps): StyleList;
|
|
281
|
+
/**
|
|
282
|
+
* Virtual's classes and styles injector
|
|
283
|
+
* @param data
|
|
284
|
+
* @private
|
|
285
|
+
*/
|
|
286
|
+
inject(data?: any): any;
|
|
287
|
+
}
|
|
288
|
+
export declare function useThemeContext(props: Ui0ThemeContracts$1, $styles?: CSSModuleClassList, _allowContracts?: Array<keyof Ui0ThemeContracts$1>): [ThemeInstance$1 | undefined, ThemeContractInstance | undefined];
|
|
289
|
+
interface ContractContext {
|
|
290
|
+
/** the preset this generator instance is created for */
|
|
291
|
+
presetName: ThemePresetName$1;
|
|
292
|
+
/**
|
|
293
|
+
* the resolved appearance config (extends flattened, base merged under
|
|
294
|
+
* the scheme) the vars are generated from
|
|
295
|
+
*/
|
|
296
|
+
config: Ui0ThemePresetAppearanceConfig$1;
|
|
297
|
+
/**
|
|
298
|
+
* the consumer-side contract settings (ThemePluginConfig.contracts) - a
|
|
299
|
+
* contract reads its own slice to toggle behavior preset-independently
|
|
300
|
+
* (e.g. which backdrop functions ship at all)
|
|
301
|
+
*/
|
|
302
|
+
settings: Ui0ThemeContractSettings;
|
|
303
|
+
/** class-name hasher - the same algorithm the distiller hashes module.css with */
|
|
304
|
+
hash: (name: string) => string;
|
|
305
|
+
}
|
|
306
|
+
type ContractFactory = (ctx: ContractContext) => ThemeContractGenerator$1;
|
|
307
|
+
export declare const contractGenerators: Record<string, ContractFactory>;
|
|
308
|
+
declare const RoundRefKey: InjectionKey<Ref<ComponentRound>>;
|
|
309
|
+
declare const RoundTargetRefKey: InjectionKey<Ref<ComponentRoundTarget>>;
|
|
310
|
+
declare const RoundContractKey: InjectionKey<ThemeContractDeal>;
|
|
311
|
+
declare const RoundPropsKeys: ReadonlyArray<keyof RoundProps>;
|
|
312
|
+
declare const round: ThemeContract;
|
|
313
|
+
declare const BackdropRefKey: InjectionKey<Ref<BackdropProps["backdrop"]>>;
|
|
314
|
+
declare const BackdropContractKey: InjectionKey<ThemeContractDeal>;
|
|
315
|
+
declare const BackdropPropsKeys: ReadonlyArray<keyof BackdropProps>;
|
|
316
|
+
declare const backdrop: ThemeContract;
|
|
317
|
+
declare const ColorContractKey: InjectionKey<ThemeContractDeal>;
|
|
318
|
+
declare const ColorRefKey: InjectionKey<Ref<ComponentColor>>;
|
|
319
|
+
declare const FillRefKey: InjectionKey<Ref<ComponentColor>>;
|
|
320
|
+
declare const ColorPropsKeys: ReadonlyArray<keyof (GradientProps & ColorProps & FillProps)>;
|
|
321
|
+
declare const color: ThemeContract;
|
|
322
|
+
declare const DisabledRefKey: InjectionKey<Ref<boolean>>;
|
|
323
|
+
declare const DisabledContractKey: InjectionKey<ThemeContractDeal>;
|
|
324
|
+
declare const DisabledPropsKeys: ReadonlyArray<keyof DisabledProps>;
|
|
325
|
+
declare const disabled: ThemeContract;
|
|
326
|
+
declare const ElevationRefKey: InjectionKey<Ref<ComponentElevation>>;
|
|
327
|
+
declare const ElevationContractKey: InjectionKey<ThemeContractDeal>;
|
|
328
|
+
declare const ElevationPropsKeys: ReadonlyArray<keyof ElevationProps>;
|
|
329
|
+
declare const elevation: ThemeContract;
|
|
330
|
+
declare const SizeRefKey: InjectionKey<Ref<Size>>;
|
|
331
|
+
declare const SizeDensityRefKey: InjectionKey<Ref<SizeDensity>>;
|
|
332
|
+
declare const SizeContractKey: InjectionKey<ThemeContractDeal>;
|
|
333
|
+
declare const sizeGenerator: ContractFactory;
|
|
334
|
+
declare const SizePropsKeys: ReadonlyArray<keyof (SizeProps & DensityProps)>;
|
|
335
|
+
declare const size: ThemeContract;
|
|
336
|
+
declare const contracts: Record<ThemeContractName$1, ThemeContract>;
|
|
337
|
+
declare const props: ("backdrop" | "color" | "disabled" | "elevation" | "size" | "gradient" | "fill" | keyof RoundProps | "density")[];
|
|
338
|
+
export { type BackdropContractKey, type BackdropFunction, type BackdropProps, type BackdropPropsKeys, type BackdropRefKey, type BackdropThemeAppearanceConfig, type ColorContractKey, type ColorOptions, type ColorProps, type ColorPropsKeys, type ColorPseudo, type ColorRefKey, type ColorScheme, type ColorThemeAppearanceConfig, type ColorToken, type DensityProps, type DisabledContractKey, type DisabledProps, type DisabledPropsKeys, type DisabledRefKey, type DisabledThemeAppearanceConfig, type ElevationContractKey, type ElevationProps, type ElevationPropsKeys, type ElevationRefKey, type ElevationThemeAppearanceConfig, type FillProps, type FillRefKey, type GradientProps, type Gradientable, type Round, type RoundContractKey, type RoundProps, type RoundPropsKeys, type RoundRefKey, type RoundTarget, type RoundTargetRefKey, type RoundThemeAppearanceConfig, type Size, type SizeContractKey, type SizeDensity, type SizeDensityRefKey, type SizeL, type SizeM, type SizeProps, type SizePropsKeys, type SizeRefKey, type SizeS, type SizeThemeAppearanceConfig, type SizeValuesAbsolute, type SizeXL, type SizeXS, type SizeXXL, type SizeXXS, type SizeXXXL, type SizeXXXS, type ThemeAppearance, type ThemeColorBlendExpr, type ThemeColorEntry, type ThemeColorName, type ThemeColorPool, type ThemeColorRampType, type ThemeColorRef, type ThemeColorSpace, type ThemeContractGenerator, type ThemeContractName, props as ThemeContractPropsKeys, type props, type ThemeInstance, type ThemeInstanceOptions, type ThemePluginConfig, type ThemePreset, type ThemePresetName, ThemeProvider, type Ui0ThemeContracts, type Ui0ThemePresetAppearanceConfig, type backdrop, type color, type contracts, type disabled, type elevation, type round, type size, type sizeGenerator };
|
|
339
|
+
//# sourceMappingURL=index.d.mts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.mts","names":["_0","_0","_0","_0","_0","_0","ThemePluginConfig","ThemePresetName","ThemePluginConfig","ThemePluginConfig","ThemeInstanceOptions","ThemeInstance","ThemeInstance","ThemeContractName","Ui0ThemeContracts","Ui0ThemeContracts","ThemeInstance","ThemePresetName","Ui0ThemePresetAppearanceConfig","ThemeContractGenerator","ThemeContractName","_$__round0.RoundProps"],"sources":["../src/contracts/backdrop/backdrop.types.ts","../src/contracts/color/color.types.ts","../src/contracts/disabled/disabled.types.ts","../src/contracts/elevation/elevation.types.ts","../src/contracts/round/round.types.ts","../src/contracts/size/size.types.ts","../src/generator/generate.ts","../src/plugin.ts","../src/instance.ts","../src/useTheme.ts","../src/contracts/display/display.types.ts","../src/useDisplay.ts","../src/contracts/contract.ts","../src/useThemeContext.ts","../src/contracts/generator.ts","../src/generator.ts","../src/contracts/round/round.keys.ts","../src/contracts/round/index.ts","../src/contracts/backdrop/backdrop.keys.ts","../src/contracts/backdrop/index.ts","../src/contracts/color/color.keys.ts","../src/contracts/color/index.ts","../src/contracts/disabled/disabled.keys.ts","../src/contracts/disabled/index.ts","../src/contracts/elevation/elevation.keys.ts","../src/contracts/elevation/index.ts","../src/contracts/size/size.keys.ts","../src/contracts/size/size.generator.ts","../src/contracts/size/index.ts","../src/contracts/index.ts"],"mappings":"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"}
|