@styleframe/core 3.4.0 → 3.6.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/CHANGELOG.md +26 -0
- package/dist/constants.d.ts +2 -0
- package/dist/constants.d.ts.map +1 -0
- package/dist/defaults.d.ts +11 -0
- package/dist/defaults.d.ts.map +1 -0
- package/dist/defaults.test.d.ts +2 -0
- package/dist/defaults.test.d.ts.map +1 -0
- package/dist/index.d.ts +7 -0
- package/dist/index.d.ts.map +1 -0
- package/dist/styleframe.d.ts +20 -638
- package/dist/styleframe.d.ts.map +1 -0
- package/dist/styleframe.js +825 -970
- package/dist/styleframe.umd.cjs +1 -1
- package/dist/tokens/atRule.d.ts +5 -0
- package/dist/tokens/atRule.d.ts.map +1 -0
- package/dist/tokens/atRule.test.d.ts +2 -0
- package/dist/tokens/atRule.test.d.ts.map +1 -0
- package/dist/tokens/css.d.ts +3 -0
- package/dist/tokens/css.d.ts.map +1 -0
- package/dist/tokens/css.test.d.ts +2 -0
- package/dist/tokens/css.test.d.ts.map +1 -0
- package/dist/tokens/declarations.d.ts +4 -0
- package/dist/tokens/declarations.d.ts.map +1 -0
- package/dist/tokens/declarations.test.d.ts +2 -0
- package/dist/tokens/declarations.test.d.ts.map +1 -0
- package/dist/tokens/index.d.ts +13 -0
- package/dist/tokens/index.d.ts.map +1 -0
- package/dist/tokens/modifier.d.ts +4 -0
- package/dist/tokens/modifier.d.ts.map +1 -0
- package/dist/tokens/modifier.test.d.ts +2 -0
- package/dist/tokens/modifier.test.d.ts.map +1 -0
- package/dist/tokens/recipe.d.ts +208 -0
- package/dist/tokens/recipe.d.ts.map +1 -0
- package/dist/tokens/recipe.test.d.ts +2 -0
- package/dist/tokens/recipe.test.d.ts.map +1 -0
- package/dist/tokens/ref.d.ts +3 -0
- package/dist/tokens/ref.d.ts.map +1 -0
- package/dist/tokens/ref.test.d.ts +2 -0
- package/dist/tokens/ref.test.d.ts.map +1 -0
- package/dist/tokens/resolve.d.ts +28 -0
- package/dist/tokens/resolve.d.ts.map +1 -0
- package/dist/tokens/resolve.test.d.ts +2 -0
- package/dist/tokens/resolve.test.d.ts.map +1 -0
- package/dist/tokens/root.d.ts +3 -0
- package/dist/tokens/root.d.ts.map +1 -0
- package/dist/tokens/root.test.d.ts +2 -0
- package/dist/tokens/root.test.d.ts.map +1 -0
- package/dist/tokens/root.usage.test.d.ts +2 -0
- package/dist/tokens/root.usage.test.d.ts.map +1 -0
- package/dist/tokens/selector.d.ts +3 -0
- package/dist/tokens/selector.d.ts.map +1 -0
- package/dist/tokens/selector.test.d.ts +2 -0
- package/dist/tokens/selector.test.d.ts.map +1 -0
- package/dist/tokens/theme.d.ts +3 -0
- package/dist/tokens/theme.d.ts.map +1 -0
- package/dist/tokens/theme.test.d.ts +2 -0
- package/dist/tokens/theme.test.d.ts.map +1 -0
- package/dist/tokens/utility.d.ts +6 -0
- package/dist/tokens/utility.d.ts.map +1 -0
- package/dist/tokens/utility.test.d.ts +2 -0
- package/dist/tokens/utility.test.d.ts.map +1 -0
- package/dist/tokens/variable.d.ts +5 -0
- package/dist/tokens/variable.d.ts.map +1 -0
- package/dist/tokens/variable.test.d.ts +2 -0
- package/dist/tokens/variable.test.d.ts.map +1 -0
- package/dist/typeGuards.d.ts +24 -0
- package/dist/typeGuards.d.ts.map +1 -0
- package/dist/typeGuards.test.d.ts +2 -0
- package/dist/typeGuards.test.d.ts.map +1 -0
- package/dist/types/declarations.d.ts +21 -0
- package/dist/types/declarations.d.ts.map +1 -0
- package/dist/types/index.d.ts +5 -0
- package/dist/types/index.d.ts.map +1 -0
- package/dist/types/minify.d.ts +9 -0
- package/dist/types/minify.d.ts.map +1 -0
- package/dist/types/options.d.ts +25 -0
- package/dist/types/options.d.ts.map +1 -0
- package/dist/types/tokens.d.ts +156 -0
- package/dist/types/tokens.d.ts.map +1 -0
- package/dist/utils/capitalizeFirst.d.ts +6 -0
- package/dist/utils/capitalizeFirst.d.ts.map +1 -0
- package/dist/utils/cssSelector.d.ts +6 -0
- package/dist/utils/cssSelector.d.ts.map +1 -0
- package/dist/utils/cssSelector.test.d.ts +2 -0
- package/dist/utils/cssSelector.test.d.ts.map +1 -0
- package/dist/utils/deepClone.d.ts +23 -0
- package/dist/utils/deepClone.d.ts.map +1 -0
- package/dist/utils/generateRandomId.d.ts +9 -0
- package/dist/utils/generateRandomId.d.ts.map +1 -0
- package/dist/utils/getters.d.ts +5 -0
- package/dist/utils/getters.d.ts.map +1 -0
- package/dist/utils/getters.test.d.ts +2 -0
- package/dist/utils/getters.test.d.ts.map +1 -0
- package/dist/utils/hash.d.ts +9 -0
- package/dist/utils/hash.d.ts.map +1 -0
- package/dist/utils/hash.test.d.ts +2 -0
- package/dist/utils/hash.test.d.ts.map +1 -0
- package/dist/utils/index.d.ts +9 -0
- package/dist/utils/index.d.ts.map +1 -0
- package/dist/utils/isTokenEqual.d.ts +3 -0
- package/dist/utils/isTokenEqual.d.ts.map +1 -0
- package/dist/utils/isTokenEqual.test.d.ts +2 -0
- package/dist/utils/isTokenEqual.test.d.ts.map +1 -0
- package/dist/utils/merge.d.ts +8 -0
- package/dist/utils/merge.d.ts.map +1 -0
- package/dist/utils/merge.test.d.ts +2 -0
- package/dist/utils/merge.test.d.ts.map +1 -0
- package/package.json +8 -11
package/dist/styleframe.d.ts
CHANGED
|
@@ -1,638 +1,20 @@
|
|
|
1
|
-
import {
|
|
2
|
-
|
|
3
|
-
export
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
export declare function capitalizeFirst(str: string): string;
|
|
22
|
-
|
|
23
|
-
/**
|
|
24
|
-
* Convert a raw class name to a CSS selector by adding a `.` prefix
|
|
25
|
-
* and escaping special characters.
|
|
26
|
-
*/
|
|
27
|
-
export declare function classNameToCssSelector(className: string): string;
|
|
28
|
-
|
|
29
|
-
/**
|
|
30
|
-
* Deep clone a value.
|
|
31
|
-
*
|
|
32
|
-
* We're using rfdc for this, but maintaining our own implementation
|
|
33
|
-
* to avoid production dependencies on external libraries.
|
|
34
|
-
*
|
|
35
|
-
* @source https://github.com/davidmarkclements/rfdc
|
|
36
|
-
*/
|
|
37
|
-
declare type CloneFunction<T = any> = (obj: T) => T;
|
|
38
|
-
|
|
39
|
-
declare type ConstructorHandler<T = any> = (obj: T, fn: CloneFunction) => T;
|
|
40
|
-
|
|
41
|
-
declare type ConstructorHandlerTuple<T = any> = [
|
|
42
|
-
new (...args: any[]) => T,
|
|
43
|
-
ConstructorHandler<T>
|
|
44
|
-
];
|
|
45
|
-
|
|
46
|
-
export declare type Container = {
|
|
47
|
-
id: string;
|
|
48
|
-
parentId?: string;
|
|
49
|
-
children: ContainerChild[];
|
|
50
|
-
variables: Variable[];
|
|
51
|
-
declarations: DeclarationsBlock;
|
|
52
|
-
};
|
|
53
|
-
|
|
54
|
-
export declare type ContainerChild = Variable | Selector | AtRule | Utility;
|
|
55
|
-
|
|
56
|
-
export declare type ContainerInput = Pick<Container, "declarations" | "variables" | "children">;
|
|
57
|
-
|
|
58
|
-
export declare function createAtRuleFunction(parent: Container, root: Root): (identifier: string, rule: string, declarationsOrCallback?: DeclarationsBlock | ContainerInput | DeclarationsCallback) => AtRule;
|
|
59
|
-
|
|
60
|
-
export declare function createCssFunction(_parent: Container, _root: Root): (strings: TemplateStringsArray, ...interpolations: (TokenValue | Variable | AtRule)[]) => CSS_2;
|
|
61
|
-
|
|
62
|
-
export declare function createDeclarationsCallbackContext(parent: Container, root: Root): DeclarationsCallbackContext;
|
|
63
|
-
|
|
64
|
-
export declare function createKeyframesFunction(parent: Container, root: Root): (name: string, declarations: Record<string, DeclarationsBlock>) => AtRule;
|
|
65
|
-
|
|
66
|
-
export declare function createMediaFunction(parent: Container, root: Root): (query: string, declarationsOrCallback?: DeclarationsBlock | ContainerInput | DeclarationsCallback) => AtRule;
|
|
67
|
-
|
|
68
|
-
export declare function createModifierFunction(_parent: Container, root: Root): <Key extends string>(key: Key | Key[], factory: ModifierFactory["factory"]) => ModifierFactory;
|
|
69
|
-
|
|
70
|
-
/**
|
|
71
|
-
* Creates a resolver that converts @-prefixed variable references in string values.
|
|
72
|
-
* - Exact match "@name" → Reference object
|
|
73
|
-
* - Embedded "1px solid @name" → CSS object with mixed parts
|
|
74
|
-
* - Non-string or no @ → returns value unchanged
|
|
75
|
-
*/
|
|
76
|
-
export declare function createPropertyValueResolver(parent: Container, root: Root): (value: TokenValue) => TokenValue;
|
|
77
|
-
|
|
78
|
-
/**
|
|
79
|
-
* Creates a recipe function to define design system recipes with variants.
|
|
80
|
-
*
|
|
81
|
-
* @example ```ts
|
|
82
|
-
* recipe({
|
|
83
|
-
* name: "button",
|
|
84
|
-
* base: {
|
|
85
|
-
* borderWidth: ref(borderWidth), // Token reference => Variable<'border-width'> => Auto-generate _border-width
|
|
86
|
-
* borderStyle: ref(borderStyle), // Token reference => Variable<'border-style'> => Auto-generate _border-style
|
|
87
|
-
* boxShadow: ref(boxShadowMd), // Token reference => Variable<'box-shadow.md'> => Auto-generate _box-shadow:md
|
|
88
|
-
* 'hover:focus': { // Applying hover and focus modifiers
|
|
89
|
-
* boxShadow: ref(boxShadowSm), // Token reference => Variable<'box-shadow.sm'> => Auto-generate _hover:box-shadow:sm
|
|
90
|
-
* }
|
|
91
|
-
* },
|
|
92
|
-
* variants: {
|
|
93
|
-
* color: {
|
|
94
|
-
* primary: {
|
|
95
|
-
* background: ref(colorPrimary), // Token reference => Variable<'color.primary'> => Auto-generate _background:primary
|
|
96
|
-
* color: ref(colorWhite), // Token reference => Variable<'color.white'> => Auto-generate _color:white
|
|
97
|
-
* borderColor: ref(colorPrimaryShade50), // Token reference => Variable<'color.primary-shade-50'> => Auto-generate _border-color:primary-shade-50,
|
|
98
|
-
* },
|
|
99
|
-
* secondary: {
|
|
100
|
-
* background: "@color.secondary", // Token path => Variable<'color.secondary'> => Auto-generate _background:secondary
|
|
101
|
-
* color: "@color.white", // Token path => Variable<'color.white'> => Auto-generate _color:white
|
|
102
|
-
* borderColor: "@color.secondary-shade-50", // Token path => Variable<'color.secondary-shade-50'> => Auto-generate _border-color:secondary
|
|
103
|
-
* },
|
|
104
|
-
* disabled: {
|
|
105
|
-
* false: {},
|
|
106
|
-
* true: {
|
|
107
|
-
* opacity: "@opacity.50", // Token path => Variable<'opacity.50'> => Auto-generate _opacity:50
|
|
108
|
-
* cursor: "not-allowed", // Arbitrary value => Auto-generate _cursor:[not-allowed]
|
|
109
|
-
* }
|
|
110
|
-
* }
|
|
111
|
-
* },
|
|
112
|
-
* size: {
|
|
113
|
-
* sm: {
|
|
114
|
-
* padding: "@spacing.sm", // Token path => Variable<'spacing.sm'> => Auto-generate _padding:sm
|
|
115
|
-
* fontSize: "@font-size.sm", // Token path => Variable<'font-size.sm'> => Auto-generate _font-size:sm
|
|
116
|
-
* },
|
|
117
|
-
* md: {
|
|
118
|
-
* padding: "1rem", // Arbitrary value => Auto-generate _padding:[1rem]
|
|
119
|
-
* fontSize: "1rem", // Arbitrary value => Auto-generate _font-size:[1rem]
|
|
120
|
-
* },
|
|
121
|
-
* lg: {
|
|
122
|
-
* padding: "@spacing.lg", // Token path => Variable<'spacing.lg'> => Auto-generate _padding:lg
|
|
123
|
-
* fontSize: "1.25rem", // Arbitrary value => Auto-generate _font-size:[1.25rem]
|
|
124
|
-
* },
|
|
125
|
-
* },
|
|
126
|
-
* },
|
|
127
|
-
* defaultVariants: {
|
|
128
|
-
* color: "primary",
|
|
129
|
-
* size: "md",
|
|
130
|
-
* },
|
|
131
|
-
* compoundVariants: [
|
|
132
|
-
* {
|
|
133
|
-
* match: {
|
|
134
|
-
* color: "primary",
|
|
135
|
-
* disabled: false
|
|
136
|
-
* },
|
|
137
|
-
* css: {
|
|
138
|
-
* hover: {
|
|
139
|
-
* background: "@color.primary-shade-50", // Token path => Variable<'color.primary-shade-50'> => Auto-generate _hover:background:primary-shade-50
|
|
140
|
-
* }
|
|
141
|
-
* },
|
|
142
|
-
* },
|
|
143
|
-
* {
|
|
144
|
-
* match: {
|
|
145
|
-
* color: "secondary",
|
|
146
|
-
* disabled: false
|
|
147
|
-
* },
|
|
148
|
-
* css: {
|
|
149
|
-
* hover: {
|
|
150
|
-
* background: ref(colorSecondaryShade50), // Token reference => Variable<'color.secondary-shade-50'> => Auto-generate _hover:background:secondary-shade-50
|
|
151
|
-
* }
|
|
152
|
-
* },
|
|
153
|
-
* },
|
|
154
|
-
* ],
|
|
155
|
-
* _runtime: {
|
|
156
|
-
* base: {
|
|
157
|
-
* borderWidth: 'default',
|
|
158
|
-
* borderStyle: 'default',
|
|
159
|
-
* boxShadow: 'md',
|
|
160
|
-
* 'hover:focus': {
|
|
161
|
-
* boxShadow: 'sm',
|
|
162
|
-
* }
|
|
163
|
-
* },
|
|
164
|
-
* variants: {
|
|
165
|
-
* color: {
|
|
166
|
-
* primary: {
|
|
167
|
-
* background: "primary",
|
|
168
|
-
* color: "white",
|
|
169
|
-
* borderColor: "primary-shade-50",
|
|
170
|
-
* },
|
|
171
|
-
* secondary: {
|
|
172
|
-
* background: "secondary",
|
|
173
|
-
* color: "white",
|
|
174
|
-
* borderColor: "secondary-shade-50",
|
|
175
|
-
* }
|
|
176
|
-
* },
|
|
177
|
-
* disabled: {
|
|
178
|
-
* false: {},
|
|
179
|
-
* true: {
|
|
180
|
-
* opacity: "50",
|
|
181
|
-
* cursor: "[not-allowed]",
|
|
182
|
-
* }
|
|
183
|
-
* },
|
|
184
|
-
* size: {
|
|
185
|
-
* sm: {
|
|
186
|
-
* padding: "sm",
|
|
187
|
-
* fontSize: "sm",
|
|
188
|
-
* },
|
|
189
|
-
* md: {
|
|
190
|
-
* padding: "[1rem]",
|
|
191
|
-
* fontSize: "[1rem]",
|
|
192
|
-
* },
|
|
193
|
-
* lg: {
|
|
194
|
-
* padding: "lg",
|
|
195
|
-
* fontSize: "[1.25rem]",
|
|
196
|
-
* },
|
|
197
|
-
* },
|
|
198
|
-
* },
|
|
199
|
-
* defaultVariants: {
|
|
200
|
-
* color: "primary",
|
|
201
|
-
* size: "md",
|
|
202
|
-
* },
|
|
203
|
-
* compoundVariants: [
|
|
204
|
-
* {
|
|
205
|
-
* match: {
|
|
206
|
-
* color: "primary",
|
|
207
|
-
* disabled: false
|
|
208
|
-
* },
|
|
209
|
-
* css: {
|
|
210
|
-
* hover: {
|
|
211
|
-
* background: "primary-shade-50",
|
|
212
|
-
* }
|
|
213
|
-
* },
|
|
214
|
-
* },
|
|
215
|
-
* {
|
|
216
|
-
* match: {
|
|
217
|
-
* color: "secondary",
|
|
218
|
-
* disabled: false
|
|
219
|
-
* },
|
|
220
|
-
* css: {
|
|
221
|
-
* hover: {
|
|
222
|
-
* background: 'secondary-shade-50',
|
|
223
|
-
* }
|
|
224
|
-
* },
|
|
225
|
-
* },
|
|
226
|
-
* ],
|
|
227
|
-
* }
|
|
228
|
-
* });
|
|
229
|
-
* ```
|
|
230
|
-
*/
|
|
231
|
-
export declare function createRecipeFunction(_parent: Container, root: Root): <Name extends string, Variants extends VariantsBase>(options: Omit<Recipe<Name, Variants>, "type">) => Recipe<Name, Variants>;
|
|
232
|
-
|
|
233
|
-
export declare function createRefFunction(parent: Container, root: Root): <Name extends string>(variable: Variable<Name> | Name, fallback?: string) => Reference<Name>;
|
|
234
|
-
|
|
235
|
-
export declare function createRoot(): Root;
|
|
236
|
-
|
|
237
|
-
export declare function createSelectorFunction(parent: Container, root: Root): (query: string, declarationsOrCallback: DeclarationsBlock | ContainerInput | DeclarationsCallback) => Selector;
|
|
238
|
-
|
|
239
|
-
export declare function createThemeFunction(parent: Container, root: Root): (name: string, callback: DeclarationsCallback) => Theme;
|
|
240
|
-
|
|
241
|
-
export declare function createUtilityFunction(parent: Container, root: Root): <Name extends string>(name: Name, factory: UtilityCallbackFn, options?: {
|
|
242
|
-
autogenerate?: UtilityAutogenerateFn;
|
|
243
|
-
namespace?: string | string[];
|
|
244
|
-
}) => UtilityCreatorFn;
|
|
245
|
-
|
|
246
|
-
export declare function createVariableFunction(parent: Container, root: Root): <Name extends string>(nameOrInstance: Name | Variable<Name>, value: TokenValue, options?: {
|
|
247
|
-
default: boolean;
|
|
248
|
-
}) => Variable<Name>;
|
|
249
|
-
|
|
250
|
-
declare type CSS_2 = {
|
|
251
|
-
type: "css";
|
|
252
|
-
value: TokenValue[];
|
|
253
|
-
};
|
|
254
|
-
export { CSS_2 as CSS }
|
|
255
|
-
|
|
256
|
-
declare type CSSValueWithReference<T> = T extends string | number | undefined ? T | TokenValue : T extends object ? CSSValueWithReference<T> : T | TokenValue;
|
|
257
|
-
|
|
258
|
-
export declare type DeclarationsBlock = {
|
|
259
|
-
[K in keyof Properties]: CSSValueWithReference<Properties[K]>;
|
|
260
|
-
} & {
|
|
261
|
-
[key: string]: CSSValueWithReference<Properties[keyof Properties]> | DeclarationsBlock | ContainerInput;
|
|
262
|
-
};
|
|
263
|
-
|
|
264
|
-
export declare type DeclarationsCallback<Context extends DeclarationsCallbackContext = DeclarationsCallbackContext> = (context: Context) => DeclarationsBlock | void;
|
|
265
|
-
|
|
266
|
-
export declare type DeclarationsCallbackContext = {
|
|
267
|
-
variable: ReturnType<typeof createVariableFunction>;
|
|
268
|
-
selector: ReturnType<typeof createSelectorFunction>;
|
|
269
|
-
atRule: ReturnType<typeof createAtRuleFunction>;
|
|
270
|
-
keyframes: ReturnType<typeof createKeyframesFunction>;
|
|
271
|
-
media: ReturnType<typeof createMediaFunction>;
|
|
272
|
-
ref: ReturnType<typeof createRefFunction>;
|
|
273
|
-
css: ReturnType<typeof createCssFunction>;
|
|
274
|
-
};
|
|
275
|
-
|
|
276
|
-
export declare const deepClone: CloneFunction<any>;
|
|
277
|
-
|
|
278
|
-
export declare const defaultUtilitySelectorFn: UtilitySelectorFn;
|
|
279
|
-
|
|
280
|
-
/**
|
|
281
|
-
* Checks whether a variable with the given name exists in the scope chain,
|
|
282
|
-
* walking from the given scope up through ancestors via parentId.
|
|
283
|
-
*/
|
|
284
|
-
export declare function findVariableInScope(name: string, scope: Container, root: Root): boolean;
|
|
285
|
-
|
|
286
|
-
/**
|
|
287
|
-
* Generates a random ID string
|
|
288
|
-
*
|
|
289
|
-
* @param length - The length of the random ID to generate (default: 8)
|
|
290
|
-
* @param prefix - Optional prefix to prepend to the random ID
|
|
291
|
-
* @returns A random alphanumeric string with optional prefix
|
|
292
|
-
*/
|
|
293
|
-
export declare function generateRandomId(prefix?: string, length?: number): string;
|
|
294
|
-
|
|
295
|
-
/**
|
|
296
|
-
* Generates the runtime object for a recipe.
|
|
297
|
-
* This object contains resolved runtime keys for efficient class name lookups.
|
|
298
|
-
*
|
|
299
|
-
* @param recipe - The recipe to generate runtime for
|
|
300
|
-
* @param root - The root object containing utility factories
|
|
301
|
-
* @returns The runtime object
|
|
302
|
-
*/
|
|
303
|
-
export declare function generateRecipeRuntime<Name extends string, Variants extends VariantsBase>(recipe: Recipe<Name, Variants>, root: Root): RecipeRuntime<Variants>;
|
|
304
|
-
|
|
305
|
-
export declare function getModifier(root: Root, name: string): ModifierFactory;
|
|
306
|
-
|
|
307
|
-
export declare function getUtility(root: Root, name: string): UtilityFactory;
|
|
308
|
-
|
|
309
|
-
export declare function getVariable(root: Container, name: string): Variable;
|
|
310
|
-
|
|
311
|
-
/**
|
|
312
|
-
* Generates a deterministic, CSS-safe hash string from an arbitrary value.
|
|
313
|
-
* Uses DJB2 algorithm for fast, low-collision hashing.
|
|
314
|
-
*
|
|
315
|
-
* @param value - The string value to hash
|
|
316
|
-
* @returns A lowercase hex string of 7 characters (e.g., "a1b2c3d")
|
|
317
|
-
*/
|
|
318
|
-
export declare function hashValue(value: string): string;
|
|
319
|
-
|
|
320
|
-
export declare function isAtRule(value: unknown): value is AtRule;
|
|
321
|
-
|
|
322
|
-
export declare function isContainer(value: unknown): value is Container;
|
|
323
|
-
|
|
324
|
-
export declare function isContainerInput(value: unknown): value is ContainerInput;
|
|
325
|
-
|
|
326
|
-
export declare function isCSS(value: unknown): value is CSS_2;
|
|
327
|
-
|
|
328
|
-
export declare function isKeyReferenceValue(value: unknown): value is `@${string}`;
|
|
329
|
-
|
|
330
|
-
export declare function isModifier(value: unknown): value is ModifierFactory;
|
|
331
|
-
|
|
332
|
-
export declare function isObject(value: unknown): value is object;
|
|
333
|
-
|
|
334
|
-
export declare function isPrimitiveTokenValue(value: unknown): value is PrimitiveTokenValue;
|
|
335
|
-
|
|
336
|
-
export declare function isRecipe(value: unknown): value is Recipe;
|
|
337
|
-
|
|
338
|
-
export declare function isRef<Name extends string = string>(value: unknown): value is Reference<Name>;
|
|
339
|
-
|
|
340
|
-
export declare function isRoot(value: unknown): value is Root;
|
|
341
|
-
|
|
342
|
-
export declare function isSelector(value: unknown): value is Selector;
|
|
343
|
-
|
|
344
|
-
export declare function isStyleframe(value: unknown): value is Styleframe;
|
|
345
|
-
|
|
346
|
-
export declare function isTheme(value: unknown): value is Theme;
|
|
347
|
-
|
|
348
|
-
/**
|
|
349
|
-
* Tokens
|
|
350
|
-
*/
|
|
351
|
-
export declare function isToken<T>(value: unknown, type: TokenType): value is T;
|
|
352
|
-
|
|
353
|
-
export declare function isTokenEqual(a: TokenValue, b: TokenValue): boolean;
|
|
354
|
-
|
|
355
|
-
export declare function isTokenValue(value: unknown): value is TokenValue;
|
|
356
|
-
|
|
357
|
-
export declare function isUtility<Name extends string = string>(value: unknown): value is Utility<Name>;
|
|
358
|
-
|
|
359
|
-
export declare function isVariable<Name extends string = string>(value: unknown): value is Variable<Name>;
|
|
360
|
-
|
|
361
|
-
export declare function merge(base: Styleframe, ...instances: Styleframe[]): Styleframe;
|
|
362
|
-
|
|
363
|
-
export declare function mergeContainers<T extends Container>(a: T, b: T): T;
|
|
364
|
-
|
|
365
|
-
export declare function mergeThemesArray(a: Theme[], b: Theme[]): Theme[];
|
|
366
|
-
|
|
367
|
-
export declare function mergeVariablesArray(a: Variable[], b: Variable[]): Variable[];
|
|
368
|
-
|
|
369
|
-
export declare type ModifierCallbackFn = DeclarationsCallback<DeclarationsCallbackContext & Pick<Utility, "declarations" | "variables" | "children">>;
|
|
370
|
-
|
|
371
|
-
export declare type ModifierDeclarationsBlock = Record<string, TokenValue>;
|
|
372
|
-
|
|
373
|
-
export declare type ModifierFactory = {
|
|
374
|
-
type: "modifier";
|
|
375
|
-
key: string[];
|
|
376
|
-
factory: ModifierCallbackFn;
|
|
377
|
-
};
|
|
378
|
-
|
|
379
|
-
export declare function parseAtReferences(str: string): TokenValue[];
|
|
380
|
-
|
|
381
|
-
export declare function parseDeclarationsBlock(declarations: DeclarationsBlock, context: DeclarationsCallbackContext, parent: Container, root: Root): DeclarationsBlock;
|
|
382
|
-
|
|
383
|
-
export declare type PrimitiveTokenValue = number | string | boolean | null | undefined;
|
|
384
|
-
|
|
385
|
-
/**
|
|
386
|
-
* Processes a recipe and creates utilities for all style declarations.
|
|
387
|
-
*
|
|
388
|
-
* This function iterates through all style fields in a recipe:
|
|
389
|
-
* 1. `base` - Root level field key-value pairs
|
|
390
|
-
* 2. `variants.*.*` - Each variant group's options containing field key-value pairs
|
|
391
|
-
* 3. `compoundVariants.*.css` - Each compound variant's css declarations
|
|
392
|
-
*
|
|
393
|
-
* For efficiency, it:
|
|
394
|
-
* - Collects all values needed for each utility key across the entire recipe
|
|
395
|
-
* - Retrieves each utility factory only once
|
|
396
|
-
* - Creates all utility instances in a single call per utility
|
|
397
|
-
*
|
|
398
|
-
* @param recipe - The recipe to process
|
|
399
|
-
* @param root - The root object containing utility factories
|
|
400
|
-
*
|
|
401
|
-
* @example
|
|
402
|
-
* ```ts
|
|
403
|
-
* const buttonRecipe = recipe({
|
|
404
|
-
* name: "button",
|
|
405
|
-
* base: { borderWidth: "thin" },
|
|
406
|
-
* variants: {
|
|
407
|
-
* size: {
|
|
408
|
-
* sm: { padding: "0.5rem" },
|
|
409
|
-
* lg: { padding: "1rem" },
|
|
410
|
-
* },
|
|
411
|
-
* },
|
|
412
|
-
* });
|
|
413
|
-
*
|
|
414
|
-
* processRecipeUtilities(buttonRecipe, root);
|
|
415
|
-
* // Creates:
|
|
416
|
-
* // - borderWidth utility with value "thin"
|
|
417
|
-
* // - padding utility with values ["0.5rem", "1rem"]
|
|
418
|
-
* ```
|
|
419
|
-
*/
|
|
420
|
-
export declare function processRecipeUtilities(recipe: Recipe, root: Root): void;
|
|
421
|
-
|
|
422
|
-
export declare function rebuildRegistry(root: Root): void;
|
|
423
|
-
|
|
424
|
-
export declare type Recipe<Name extends string = string, Variants extends VariantsBase = VariantsBase> = {
|
|
425
|
-
type: "recipe";
|
|
426
|
-
name: Name;
|
|
427
|
-
base?: VariantDeclarationsBlock;
|
|
428
|
-
variants?: Variants;
|
|
429
|
-
defaultVariants?: {
|
|
430
|
-
[K in keyof Variants]?: keyof Variants[K] & string;
|
|
431
|
-
};
|
|
432
|
-
compoundVariants?: Array<{
|
|
433
|
-
match: {
|
|
434
|
-
[K in keyof Variants]?: keyof Variants[K] & string;
|
|
435
|
-
};
|
|
436
|
-
css?: VariantDeclarationsBlock;
|
|
437
|
-
className?: string;
|
|
438
|
-
}>;
|
|
439
|
-
_runtime?: RecipeRuntime<Variants>;
|
|
440
|
-
_exportName?: string;
|
|
441
|
-
};
|
|
442
|
-
|
|
443
|
-
export declare type RecipeRuntime<Variants extends VariantsBase = VariantsBase> = {
|
|
444
|
-
base?: RuntimeVariantDeclarationsBlock;
|
|
445
|
-
variants?: {
|
|
446
|
-
[K in keyof Variants]?: {
|
|
447
|
-
[O in keyof Variants[K]]?: RuntimeVariantDeclarationsBlock;
|
|
448
|
-
};
|
|
449
|
-
};
|
|
450
|
-
defaultVariants?: {
|
|
451
|
-
[K in keyof Variants]?: keyof Variants[K] & string;
|
|
452
|
-
};
|
|
453
|
-
compoundVariants?: Array<{
|
|
454
|
-
match: {
|
|
455
|
-
[K in keyof Variants]?: keyof Variants[K] & string;
|
|
456
|
-
};
|
|
457
|
-
css?: RuntimeVariantDeclarationsBlock;
|
|
458
|
-
className?: string;
|
|
459
|
-
}>;
|
|
460
|
-
};
|
|
461
|
-
|
|
462
|
-
export declare type Reference<Name extends string = string> = {
|
|
463
|
-
type: "reference";
|
|
464
|
-
name: Name;
|
|
465
|
-
fallback?: TokenValue;
|
|
466
|
-
};
|
|
467
|
-
|
|
468
|
-
export declare type RefFunction = (variable: string, fallback?: string) => Reference;
|
|
469
|
-
|
|
470
|
-
export declare function rfdc<T = any>(opts?: RfdcOptions): CloneFunction<T>;
|
|
471
|
-
|
|
472
|
-
declare interface RfdcOptions {
|
|
473
|
-
circular?: boolean;
|
|
474
|
-
proto?: boolean;
|
|
475
|
-
constructorHandlers?: ConstructorHandlerTuple[];
|
|
476
|
-
}
|
|
477
|
-
|
|
478
|
-
export declare type Root = {
|
|
479
|
-
type: "root";
|
|
480
|
-
id: string;
|
|
481
|
-
parentId?: string;
|
|
482
|
-
declarations: DeclarationsBlock;
|
|
483
|
-
utilities: UtilityFactory[];
|
|
484
|
-
modifiers: ModifierFactory[];
|
|
485
|
-
recipes: Recipe[];
|
|
486
|
-
variables: Variable[];
|
|
487
|
-
children: ContainerChild[];
|
|
488
|
-
themes: Theme[];
|
|
489
|
-
_registry: Map<string, Container | Root | Theme>;
|
|
490
|
-
_usage: {
|
|
491
|
-
variables: Set<string>;
|
|
492
|
-
};
|
|
493
|
-
};
|
|
494
|
-
|
|
495
|
-
export declare type RuntimeModifierDeclarationsBlock = Record<string, PrimitiveTokenValue>;
|
|
496
|
-
|
|
497
|
-
export declare type RuntimeVariantDeclarationsBlock = Record<string, RuntimeVariantDeclarationsValue>;
|
|
498
|
-
|
|
499
|
-
export declare type RuntimeVariantDeclarationsValue = PrimitiveTokenValue | RuntimeModifierDeclarationsBlock;
|
|
500
|
-
|
|
501
|
-
export declare type Selector = {
|
|
502
|
-
type: "selector";
|
|
503
|
-
id: string;
|
|
504
|
-
parentId?: string;
|
|
505
|
-
query: string;
|
|
506
|
-
declarations: DeclarationsBlock;
|
|
507
|
-
variables: Variable[];
|
|
508
|
-
children: ContainerChild[];
|
|
509
|
-
_exportName?: string;
|
|
510
|
-
};
|
|
511
|
-
|
|
512
|
-
export declare interface Styleframe {
|
|
513
|
-
id: string;
|
|
514
|
-
root: Root;
|
|
515
|
-
variable: ReturnType<typeof createVariableFunction>;
|
|
516
|
-
selector: ReturnType<typeof createSelectorFunction>;
|
|
517
|
-
utility: ReturnType<typeof createUtilityFunction>;
|
|
518
|
-
modifier: ReturnType<typeof createModifierFunction>;
|
|
519
|
-
recipe: ReturnType<typeof createRecipeFunction>;
|
|
520
|
-
theme: ReturnType<typeof createThemeFunction>;
|
|
521
|
-
atRule: ReturnType<typeof createAtRuleFunction>;
|
|
522
|
-
keyframes: ReturnType<typeof createKeyframesFunction>;
|
|
523
|
-
media: ReturnType<typeof createMediaFunction>;
|
|
524
|
-
ref: ReturnType<typeof createRefFunction>;
|
|
525
|
-
css: ReturnType<typeof createCssFunction>;
|
|
526
|
-
options: StyleframeOptions;
|
|
527
|
-
}
|
|
528
|
-
|
|
529
|
-
export declare function styleframe(userOptions?: StyleframeOptions): Styleframe;
|
|
530
|
-
|
|
531
|
-
export declare type StyleframeOptions = {
|
|
532
|
-
indent?: string;
|
|
533
|
-
variables?: {
|
|
534
|
-
name?: VariableNameFn;
|
|
535
|
-
};
|
|
536
|
-
utilities?: {
|
|
537
|
-
selector?: UtilitySelectorFn;
|
|
538
|
-
};
|
|
539
|
-
themes?: {
|
|
540
|
-
selector?: ThemeSelectorFn;
|
|
541
|
-
};
|
|
542
|
-
};
|
|
543
|
-
|
|
544
|
-
export declare type Theme = {
|
|
545
|
-
type: "theme";
|
|
546
|
-
id: string;
|
|
547
|
-
parentId?: string;
|
|
548
|
-
name: string;
|
|
549
|
-
declarations: DeclarationsBlock;
|
|
550
|
-
variables: Variable[];
|
|
551
|
-
children: ContainerChild[];
|
|
552
|
-
};
|
|
553
|
-
|
|
554
|
-
export declare type ThemeSelectorFn = (options: {
|
|
555
|
-
name: string;
|
|
556
|
-
}) => string;
|
|
557
|
-
|
|
558
|
-
export declare type TokenType = Variable["type"] | Reference["type"] | Selector["type"] | AtRule["type"] | CSS_2["type"] | Utility["type"] | ModifierFactory["type"] | Recipe["type"] | Theme["type"] | Root["type"];
|
|
559
|
-
|
|
560
|
-
export declare type TokenValue = PrimitiveTokenValue | Reference | CSS_2 | Array<PrimitiveTokenValue | Reference | CSS_2>;
|
|
561
|
-
|
|
562
|
-
export declare function transformUtilityKey(replacerOrOptions?: ((key: string) => string) | TransformUtilityKeyOptions): (value: TokenValue) => Record<string, TokenValue>;
|
|
563
|
-
|
|
564
|
-
export declare interface TransformUtilityKeyOptions {
|
|
565
|
-
/** Transforms the key used in the utility class name */
|
|
566
|
-
replacer?: (key: string) => string;
|
|
567
|
-
/** Namespace prepended to the reference name (e.g., "spacing" makes "@sm" resolve to ref("spacing.sm")) */
|
|
568
|
-
namespace?: string | string[];
|
|
569
|
-
}
|
|
570
|
-
|
|
571
|
-
export declare type Utility<Name extends string = string> = {
|
|
572
|
-
type: "utility";
|
|
573
|
-
id: string;
|
|
574
|
-
parentId?: string;
|
|
575
|
-
name: Name;
|
|
576
|
-
value: string;
|
|
577
|
-
declarations: DeclarationsBlock;
|
|
578
|
-
variables: Variable[];
|
|
579
|
-
children: ContainerChild[];
|
|
580
|
-
modifiers: string[];
|
|
581
|
-
};
|
|
582
|
-
|
|
583
|
-
export declare type UtilityAutogenerateFn = (value: TokenValue) => Record<string, TokenValue>;
|
|
584
|
-
|
|
585
|
-
export declare type UtilityCallbackFn = DeclarationsCallback<DeclarationsCallbackContext & {
|
|
586
|
-
value: TokenValue;
|
|
587
|
-
}>;
|
|
588
|
-
|
|
589
|
-
export declare type UtilityCreatorFn = (values: Record<string, TokenValue> | TokenValue[], modifiers?: (ModifierFactory | ModifierFactory[])[]) => void;
|
|
590
|
-
|
|
591
|
-
export declare type UtilityFactory<Name extends string = string> = {
|
|
592
|
-
type: "utility";
|
|
593
|
-
name: Name;
|
|
594
|
-
factory: UtilityCallbackFn;
|
|
595
|
-
values: Array<{
|
|
596
|
-
key: string;
|
|
597
|
-
value: TokenValue;
|
|
598
|
-
modifiers: string[];
|
|
599
|
-
}>;
|
|
600
|
-
autogenerate: UtilityAutogenerateFn;
|
|
601
|
-
namespace?: string | string[];
|
|
602
|
-
create: UtilityCreatorFn;
|
|
603
|
-
};
|
|
604
|
-
|
|
605
|
-
export declare type UtilitySelectorFn = (options: UtilitySelectorOptions) => string;
|
|
606
|
-
|
|
607
|
-
export declare interface UtilitySelectorOptions {
|
|
608
|
-
name: string;
|
|
609
|
-
value: string;
|
|
610
|
-
modifiers: string[];
|
|
611
|
-
}
|
|
612
|
-
|
|
613
|
-
/**
|
|
614
|
-
* Validates that a variable name exists in the scope chain.
|
|
615
|
-
* Walks from the given scope up through ancestors to root.
|
|
616
|
-
* Throws if the variable is not defined.
|
|
617
|
-
*/
|
|
618
|
-
export declare function validateReference(name: string, scope: Container, root: Root): void;
|
|
619
|
-
|
|
620
|
-
export declare type Variable<Name extends string = string> = {
|
|
621
|
-
type: "variable";
|
|
622
|
-
id: string;
|
|
623
|
-
parentId?: string;
|
|
624
|
-
name: Name;
|
|
625
|
-
value: TokenValue;
|
|
626
|
-
};
|
|
627
|
-
|
|
628
|
-
export declare type VariableNameFn = (options: {
|
|
629
|
-
name: string;
|
|
630
|
-
}) => string;
|
|
631
|
-
|
|
632
|
-
export declare type VariantDeclarationsBlock = Record<string, VariantDeclarationsValue>;
|
|
633
|
-
|
|
634
|
-
export declare type VariantDeclarationsValue = TokenValue | ModifierDeclarationsBlock;
|
|
635
|
-
|
|
636
|
-
export declare type VariantsBase = Record<string, Record<string, VariantDeclarationsBlock>>;
|
|
637
|
-
|
|
638
|
-
export { }
|
|
1
|
+
import { createAtRuleFunction, createCssFunction, createKeyframesFunction, createMediaFunction, createRefFunction, createSelectorFunction, createVariableFunction, createModifierFunction, createRecipeFunction, createThemeFunction, createUtilityFunction } from './tokens';
|
|
2
|
+
import { Root, StyleframeOptions } from './types';
|
|
3
|
+
export interface Styleframe {
|
|
4
|
+
id: string;
|
|
5
|
+
root: Root;
|
|
6
|
+
variable: ReturnType<typeof createVariableFunction>;
|
|
7
|
+
selector: ReturnType<typeof createSelectorFunction>;
|
|
8
|
+
utility: ReturnType<typeof createUtilityFunction>;
|
|
9
|
+
modifier: ReturnType<typeof createModifierFunction>;
|
|
10
|
+
recipe: ReturnType<typeof createRecipeFunction>;
|
|
11
|
+
theme: ReturnType<typeof createThemeFunction>;
|
|
12
|
+
atRule: ReturnType<typeof createAtRuleFunction>;
|
|
13
|
+
keyframes: ReturnType<typeof createKeyframesFunction>;
|
|
14
|
+
media: ReturnType<typeof createMediaFunction>;
|
|
15
|
+
ref: ReturnType<typeof createRefFunction>;
|
|
16
|
+
css: ReturnType<typeof createCssFunction>;
|
|
17
|
+
options: StyleframeOptions;
|
|
18
|
+
}
|
|
19
|
+
export declare function styleframe(userOptions?: StyleframeOptions): Styleframe;
|
|
20
|
+
//# sourceMappingURL=styleframe.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"styleframe.d.ts","sourceRoot":"","sources":["../src/styleframe.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACX,oBAAoB,EACpB,iBAAiB,EACjB,uBAAuB,EACvB,mBAAmB,EACnB,iBAAiB,EACjB,sBAAsB,EACtB,sBAAsB,EACtB,MAAM,UAAU,CAAC;AAClB,OAAO,EAEN,sBAAsB,EACtB,oBAAoB,EAEpB,mBAAmB,EACnB,qBAAqB,EACrB,MAAM,UAAU,CAAC;AAClB,OAAO,KAAK,EAAE,IAAI,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAGvD,MAAM,WAAW,UAAU;IAC1B,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,IAAI,CAAC;IACX,QAAQ,EAAE,UAAU,CAAC,OAAO,sBAAsB,CAAC,CAAC;IACpD,QAAQ,EAAE,UAAU,CAAC,OAAO,sBAAsB,CAAC,CAAC;IACpD,OAAO,EAAE,UAAU,CAAC,OAAO,qBAAqB,CAAC,CAAC;IAClD,QAAQ,EAAE,UAAU,CAAC,OAAO,sBAAsB,CAAC,CAAC;IACpD,MAAM,EAAE,UAAU,CAAC,OAAO,oBAAoB,CAAC,CAAC;IAChD,KAAK,EAAE,UAAU,CAAC,OAAO,mBAAmB,CAAC,CAAC;IAC9C,MAAM,EAAE,UAAU,CAAC,OAAO,oBAAoB,CAAC,CAAC;IAChD,SAAS,EAAE,UAAU,CAAC,OAAO,uBAAuB,CAAC,CAAC;IACtD,KAAK,EAAE,UAAU,CAAC,OAAO,mBAAmB,CAAC,CAAC;IAC9C,GAAG,EAAE,UAAU,CAAC,OAAO,iBAAiB,CAAC,CAAC;IAC1C,GAAG,EAAE,UAAU,CAAC,OAAO,iBAAiB,CAAC,CAAC;IAC1C,OAAO,EAAE,iBAAiB,CAAC;CAC3B;AAED,wBAAgB,UAAU,CAAC,WAAW,CAAC,EAAE,iBAAiB,GAAG,UAAU,CA8BtE"}
|