@sugarcube-org/core 0.0.1-alpha.0 → 0.0.1-alpha.10
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/LICENSE.md +31 -0
- package/README.md +3 -5
- package/dist/index.d.ts +1330 -125
- package/dist/index.js +41 -6
- package/package.json +27 -5
package/dist/index.d.ts
CHANGED
|
@@ -1,230 +1,1435 @@
|
|
|
1
|
-
|
|
1
|
+
import { z } from 'zod';
|
|
2
|
+
|
|
3
|
+
/**
|
|
4
|
+
* Directional variants for utility properties
|
|
5
|
+
*/
|
|
6
|
+
type DirectionalVariant = "top" | "right" | "bottom" | "left" | "x" | "y" | "full" | "all";
|
|
7
|
+
/**
|
|
8
|
+
* Properties-first utility configuration
|
|
9
|
+
* This is the approach where users configure utilities by CSS property
|
|
10
|
+
* Made it separate in case we want other types of configs later
|
|
11
|
+
*/
|
|
12
|
+
type PropertyUtilityConfig = {
|
|
13
|
+
source: string;
|
|
14
|
+
directions?: DirectionalVariant | DirectionalVariant[];
|
|
15
|
+
prefix?: string;
|
|
16
|
+
stripDuplicates?: boolean;
|
|
17
|
+
};
|
|
18
|
+
|
|
19
|
+
type ColorFallbackStrategy = "native" | "polyfill";
|
|
20
|
+
type FluidConfig = {
|
|
21
|
+
min: number;
|
|
22
|
+
max: number;
|
|
23
|
+
};
|
|
24
|
+
type UserTransformsConfig = {
|
|
25
|
+
fluid?: FluidConfig;
|
|
26
|
+
colorFallbackStrategy?: ColorFallbackStrategy;
|
|
27
|
+
};
|
|
28
|
+
/**
|
|
29
|
+
* Configuration for transforms applied to tokens during processing (internal config)
|
|
30
|
+
*/
|
|
31
|
+
type TransformsConfig = {
|
|
32
|
+
fluid: FluidConfig;
|
|
33
|
+
colorFallbackStrategy: ColorFallbackStrategy;
|
|
34
|
+
};
|
|
35
|
+
/**
|
|
36
|
+
* Configuration for output directories (user config - optional fields)
|
|
37
|
+
*/
|
|
38
|
+
type UserOutputConfig = {
|
|
39
|
+
/** Output directory for CSS files */
|
|
40
|
+
css?: string;
|
|
41
|
+
/** Output directory for component files */
|
|
42
|
+
components?: string;
|
|
43
|
+
/** Attribute name for theme selectors (default: "data-theme") */
|
|
44
|
+
themeAttribute?: string;
|
|
45
|
+
/**
|
|
46
|
+
* Which context should use :root selector (default: resolver's default).
|
|
47
|
+
* Other contexts use [data-theme="contextName"].
|
|
48
|
+
*/
|
|
49
|
+
defaultContext?: string;
|
|
50
|
+
};
|
|
51
|
+
/**
|
|
52
|
+
* Configuration for output directories (internal config - required fields)
|
|
53
|
+
*/
|
|
54
|
+
type OutputConfig = {
|
|
55
|
+
css: string;
|
|
56
|
+
components?: string;
|
|
57
|
+
/** Attribute name for theme selectors */
|
|
58
|
+
themeAttribute: string;
|
|
59
|
+
/** Which context uses :root selector */
|
|
60
|
+
defaultContext?: string;
|
|
61
|
+
};
|
|
62
|
+
/**
|
|
63
|
+
* Utilities configuration
|
|
64
|
+
* This is the approach where users configure utilities by CSS property
|
|
65
|
+
* Can be a single configuration or an array of configurations
|
|
66
|
+
*/
|
|
67
|
+
type UtilitiesConfig = Record<string, PropertyUtilityConfig | PropertyUtilityConfig[]>;
|
|
68
|
+
/**
|
|
69
|
+
* User configuration for Sugarcube.
|
|
70
|
+
*
|
|
71
|
+
* Configuration uses the DTCG resolver format:
|
|
72
|
+
* ```ts
|
|
73
|
+
* export default {
|
|
74
|
+
* resolver: "./tokens.resolver.json",
|
|
75
|
+
* output: { css: "src/styles" }
|
|
76
|
+
* }
|
|
77
|
+
* ```
|
|
78
|
+
*/
|
|
79
|
+
interface UserConfig {
|
|
80
|
+
/**
|
|
81
|
+
* Path to the resolver.json file.
|
|
82
|
+
* Resolver defines all token sources, sets, and modifiers.
|
|
83
|
+
* Required for token processing, optional for validation-only scenarios.
|
|
84
|
+
*/
|
|
85
|
+
resolver?: string;
|
|
86
|
+
transforms?: UserTransformsConfig;
|
|
87
|
+
output?: UserOutputConfig;
|
|
88
|
+
utilities?: UtilitiesConfig;
|
|
89
|
+
}
|
|
90
|
+
/**
|
|
91
|
+
* Internal configuration type - what code uses (complete, required fields)
|
|
92
|
+
*/
|
|
93
|
+
interface InternalConfig {
|
|
94
|
+
/** Path to the resolver.json file (optional for validation-only scenarios) */
|
|
95
|
+
resolver?: string;
|
|
96
|
+
transforms: TransformsConfig;
|
|
97
|
+
output: OutputConfig;
|
|
98
|
+
utilities?: UtilitiesConfig;
|
|
99
|
+
}
|
|
100
|
+
|
|
101
|
+
/**
|
|
102
|
+
* Base error type that all other error types extend from.
|
|
103
|
+
* Used as the foundation for all error types in the system.
|
|
104
|
+
* Provides a consistent structure for error messages across the codebase.
|
|
105
|
+
*/
|
|
106
|
+
type BaseError = {
|
|
107
|
+
/** A human-readable error message describing what went wrong */
|
|
108
|
+
message: string;
|
|
109
|
+
};
|
|
110
|
+
|
|
111
|
+
/**
|
|
112
|
+
* A token value that can either be a raw value or a reference.
|
|
113
|
+
* This is the base type for all token values in the W3C Design Token Format.
|
|
114
|
+
* @template T - The type of token (e.g., "color", "dimension", etc.)
|
|
115
|
+
*/
|
|
116
|
+
type TokenValue<T extends TokenType> = RawTokenValue<T> | Reference<T>;
|
|
117
|
+
/**
|
|
118
|
+
* The actual value of a token without references.
|
|
119
|
+
* This represents the concrete value that will be used in the final output.
|
|
120
|
+
* @template T - The type of token (e.g., "color", "dimension", etc.)
|
|
121
|
+
*/
|
|
122
|
+
type RawTokenValue<T extends TokenType> = T extends SimpleTokenType ? SimpleTokenValue<T> : T extends CompositeTokenType ? CompositeTokenValue<T> : never;
|
|
123
|
+
/**
|
|
124
|
+
* A reference to another token, with optional type checking.
|
|
125
|
+
* References are strings that point to other tokens in the token tree.
|
|
126
|
+
* The phantom type parameter ensures type safety when resolving references.
|
|
127
|
+
* @template T - The type of token being referenced
|
|
128
|
+
*/
|
|
129
|
+
type Reference<T extends TokenType = TokenType> = string & {
|
|
130
|
+
/** Phantom type for type safety during reference resolution */
|
|
131
|
+
__tokenType?: T;
|
|
132
|
+
};
|
|
133
|
+
/**
|
|
134
|
+
* Metadata that can be attached to any node in the token tree.
|
|
135
|
+
* This includes descriptions and custom extensions as defined in the W3C spec.
|
|
136
|
+
*/
|
|
137
|
+
type NodeMetadata = {
|
|
138
|
+
/** Optional description of the token or group */
|
|
139
|
+
$description?: string;
|
|
140
|
+
/** Optional custom extensions as defined in the W3C spec */
|
|
141
|
+
$extensions?: {
|
|
142
|
+
[key: string]: unknown;
|
|
143
|
+
};
|
|
144
|
+
};
|
|
145
|
+
/**
|
|
146
|
+
* A single token with its value and metadata.
|
|
147
|
+
* This is the basic building block of the token system.
|
|
148
|
+
*/
|
|
149
|
+
type Token = NodeMetadata & {
|
|
150
|
+
/** The value of the token, which can be a raw value or a reference */
|
|
151
|
+
$value: TokenValue<TokenType>;
|
|
152
|
+
/** Optional type specification, can be inherited from parent groups */
|
|
153
|
+
$type?: TokenType;
|
|
154
|
+
};
|
|
155
|
+
/**
|
|
156
|
+
* A group of tokens that can be nested.
|
|
157
|
+
* The type allows for:
|
|
158
|
+
* - Regular token properties (non-$ prefixed) which must be Token | TokenGroup
|
|
159
|
+
* - Metadata properties from NodeMetadata (like $description, $extensions)
|
|
160
|
+
* - $type property for type inheritance as specified in the W3C spec
|
|
161
|
+
* - undefined to support optional metadata properties
|
|
162
|
+
*/
|
|
163
|
+
type TokenGroup = NodeMetadata & {
|
|
164
|
+
/** Optional type specification for the group, can be inherited by child tokens */
|
|
165
|
+
$type?: TokenType;
|
|
166
|
+
/** Dynamic properties that can be either tokens, token groups, or undefined */
|
|
167
|
+
[key: string]: Token | TokenGroup | TokenType | undefined;
|
|
168
|
+
};
|
|
169
|
+
/**
|
|
170
|
+
* All possible token types, either simple or composite.
|
|
171
|
+
* This is the union of all supported token types in the system.
|
|
172
|
+
*/
|
|
173
|
+
type TokenType = SimpleTokenType | CompositeTokenType;
|
|
174
|
+
/**
|
|
175
|
+
* Token types that contain a single value.
|
|
176
|
+
* These are the basic building blocks of the token system.
|
|
177
|
+
*/
|
|
178
|
+
type SimpleTokenType = "color" | "dimension" | "fluidDimension" | "duration" | "cubicBezier" | "fontFamily" | "fontWeight" | "number";
|
|
179
|
+
/**
|
|
180
|
+
* Values for simple token types.
|
|
181
|
+
* Maps each simple token type to its corresponding value type.
|
|
182
|
+
* @template T - The type of token (e.g., "color", "dimension", etc.)
|
|
183
|
+
*/
|
|
184
|
+
type SimpleTokenValue<T extends SimpleTokenType = SimpleTokenType> = T extends "color" ? Color : T extends "dimension" ? Dimension : T extends "fluidDimension" ? FluidDimension : T extends "duration" ? Duration : T extends "cubicBezier" ? CubicBezier : T extends "fontFamily" ? FontFamily : T extends "fontWeight" ? FontWeight : T extends "number" ? number : never;
|
|
185
|
+
/**
|
|
186
|
+
* Token types that contain multiple values or are structurally complex.
|
|
187
|
+
* These types combine multiple simple types to create more complex tokens.
|
|
188
|
+
*/
|
|
189
|
+
type CompositeTokenType = AlwaysDecomposedType | "border" | "shadow" | "gradient" | "transition" | StructuralCompositeType;
|
|
190
|
+
/**
|
|
191
|
+
* Token types that must always be broken down into their constituent parts.
|
|
192
|
+
* These types are never used directly in CSS output.
|
|
193
|
+
*/
|
|
194
|
+
type AlwaysDecomposedType = "typography";
|
|
195
|
+
/**
|
|
196
|
+
* Token types that define structural patterns.
|
|
197
|
+
* These types are used to define reusable patterns in the token system.
|
|
198
|
+
*/
|
|
199
|
+
type StructuralCompositeType = "strokeStyle";
|
|
200
|
+
/**
|
|
201
|
+
* Values for composite token types.
|
|
202
|
+
* Maps each composite token type to its corresponding value type.
|
|
203
|
+
* @template T - The type of token (e.g., "typography", "border", etc.)
|
|
204
|
+
*/
|
|
205
|
+
type CompositeTokenValue<T extends CompositeTokenType = CompositeTokenType> = T extends "typography" ? Typography : T extends "border" ? Border : T extends "shadow" ? Shadow : T extends "gradient" ? Gradient : T extends "transition" ? Transition : T extends "strokeStyle" ? StrokeStyle : never;
|
|
206
|
+
/**
|
|
207
|
+
* A color value in any valid CSS color format.
|
|
208
|
+
* This can be either:
|
|
209
|
+
* - A string that is valid in CSS color contexts (legacy format)
|
|
210
|
+
* - A W3C color object with colorSpace, components, and optional alpha/hex
|
|
211
|
+
*/
|
|
212
|
+
type Color = string | {
|
|
213
|
+
/** The color space - supports "oklch" and "display-p3" */
|
|
214
|
+
colorSpace: "oklch" | "display-p3";
|
|
215
|
+
/** Array of 3 numbers representing the color components */
|
|
216
|
+
components: [number, number, number];
|
|
217
|
+
/** Optional alpha value between 0 and 1 (defaults to 1 if omitted) */
|
|
218
|
+
alpha?: number;
|
|
219
|
+
/** Optional hex fallback value for compatibility */
|
|
220
|
+
hex?: string;
|
|
221
|
+
};
|
|
222
|
+
/**
|
|
223
|
+
* A dimensional value with a numeric value and unit.
|
|
224
|
+
* Used for measurements like width, height, spacing, etc.
|
|
225
|
+
*/
|
|
2
226
|
type Dimension = {
|
|
227
|
+
/** The numeric value of the dimension */
|
|
3
228
|
value: number;
|
|
229
|
+
/** The unit of measurement (px or rem) */
|
|
4
230
|
unit: "px" | "rem";
|
|
5
231
|
};
|
|
232
|
+
/**
|
|
233
|
+
* A fluid dimension that scales between min and max values.
|
|
234
|
+
* Used for responsive design tokens that need to scale with viewport size.
|
|
235
|
+
*/
|
|
6
236
|
type FluidDimension = {
|
|
237
|
+
/** The minimum value at the smallest viewport size */
|
|
7
238
|
min: Dimension;
|
|
239
|
+
/** The maximum value at the largest viewport size */
|
|
8
240
|
max: Dimension;
|
|
9
241
|
};
|
|
10
|
-
|
|
242
|
+
/**
|
|
243
|
+
* A duration value with a numeric value and time unit.
|
|
244
|
+
* Used for animations, transitions, and other time-based values.
|
|
245
|
+
*/
|
|
246
|
+
type Duration = {
|
|
247
|
+
/** The numeric value of the duration */
|
|
248
|
+
value: number;
|
|
249
|
+
/** The unit of time (milliseconds or seconds) */
|
|
250
|
+
unit: "ms" | "s";
|
|
251
|
+
};
|
|
252
|
+
/**
|
|
253
|
+
* A cubic bezier curve defined by four control points.
|
|
254
|
+
* Used for defining custom easing functions in animations and transitions.
|
|
255
|
+
* The four numbers represent the x,y coordinates of the two control points.
|
|
256
|
+
*/
|
|
11
257
|
type CubicBezier = [number, number, number, number];
|
|
258
|
+
/**
|
|
259
|
+
* A font family name or list of fallback fonts.
|
|
260
|
+
* Can be a single font name or an array of fonts in order of preference.
|
|
261
|
+
*/
|
|
12
262
|
type FontFamily = string | string[];
|
|
263
|
+
/**
|
|
264
|
+
* A font weight value as either a number or semantic string.
|
|
265
|
+
* Numbers range from 100-900, strings are semantic names for common weights.
|
|
266
|
+
*/
|
|
13
267
|
type FontWeight = number | FontWeightString;
|
|
268
|
+
/**
|
|
269
|
+
* Semantic font weight names.
|
|
270
|
+
* These are standardized names for common font weights.
|
|
271
|
+
*/
|
|
14
272
|
type FontWeightString = "thin" | "hairline" | "extra-light" | "ultra-light" | "light" | "normal" | "regular" | "book" | "medium" | "semi-bold" | "demi-bold" | "bold" | "extra-bold" | "ultra-bold" | "black" | "heavy" | "extra-black" | "ultra-black";
|
|
273
|
+
/**
|
|
274
|
+
* Line cap style for strokes.
|
|
275
|
+
* Defines how the end of a stroke should be rendered.
|
|
276
|
+
*/
|
|
15
277
|
type LineCap = "round" | "butt" | "square";
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
type OptionallyDecomposedType = "border" | "shadow" | "gradient" | "transition";
|
|
21
|
-
type StructuralCompositeType = "strokeStyle";
|
|
22
|
-
type Reference<T extends TokenType = TokenType> = string & {
|
|
23
|
-
__tokenType?: T;
|
|
24
|
-
};
|
|
25
|
-
type TokenValue<T extends TokenType> = RawTokenValue<T> | Reference<T>;
|
|
26
|
-
type RawTokenValue<T extends TokenType> = T extends SimpleTokenType ? SimpleTokenValue<T> : T extends CompositeTokenType ? CompositeTokenValue<T> : never;
|
|
27
|
-
type SimpleTokenValue<T extends SimpleTokenType = SimpleTokenType> = T extends "color" ? Color : T extends "dimension" ? Dimension : T extends "fluidDimension" ? FluidDimension : T extends "duration" ? Duration : T extends "cubicBezier" ? CubicBezier : T extends "fontFamily" ? FontFamily : T extends "fontWeight" ? FontWeight : T extends "number" ? number : never;
|
|
28
|
-
type CompositeTokenValue<T extends CompositeTokenType = CompositeTokenType> = T extends "typography" ? Typography : T extends "border" ? Border : T extends "shadow" ? Shadow : T extends "gradient" ? Gradient : T extends "transition" ? Transition : T extends "strokeStyle" ? StrokeStyle : never;
|
|
278
|
+
/**
|
|
279
|
+
* Typography token combining font properties.
|
|
280
|
+
* This is a composite type that combines multiple font-related properties.
|
|
281
|
+
*/
|
|
29
282
|
type Typography = {
|
|
283
|
+
/** The font family to use */
|
|
30
284
|
fontFamily: TokenValue<"fontFamily">;
|
|
285
|
+
/** The size of the font */
|
|
31
286
|
fontSize: TokenValue<"dimension">;
|
|
287
|
+
/** Optional font weight */
|
|
32
288
|
fontWeight?: TokenValue<"fontWeight">;
|
|
289
|
+
/** Optional letter spacing */
|
|
33
290
|
letterSpacing?: TokenValue<"dimension">;
|
|
291
|
+
/** Optional line height as a multiplier */
|
|
34
292
|
lineHeight?: TokenValue<"number">;
|
|
35
293
|
};
|
|
294
|
+
/**
|
|
295
|
+
* Transition token defining animation properties.
|
|
296
|
+
* Used to define how properties should animate between states.
|
|
297
|
+
*/
|
|
36
298
|
type Transition = {
|
|
299
|
+
/** How long the transition should take */
|
|
37
300
|
duration: TokenValue<"duration">;
|
|
301
|
+
/** Optional delay before the transition starts */
|
|
38
302
|
delay?: TokenValue<"duration">;
|
|
303
|
+
/** The easing function to use for the transition */
|
|
39
304
|
timingFunction: TokenValue<"cubicBezier">;
|
|
40
305
|
};
|
|
306
|
+
/**
|
|
307
|
+
* Predefined stroke style keywords.
|
|
308
|
+
* These are the standard stroke styles available in CSS.
|
|
309
|
+
*/
|
|
41
310
|
type StrokeStyleKeyword = "solid" | "dashed" | "dotted" | "double" | "groove" | "ridge" | "outset" | "inset";
|
|
311
|
+
/**
|
|
312
|
+
* Custom stroke style definition.
|
|
313
|
+
* Used when the predefined stroke styles are not sufficient.
|
|
314
|
+
*/
|
|
42
315
|
type StrokeStyleCustom = {
|
|
316
|
+
/** Array of dimensions defining the dash pattern */
|
|
43
317
|
dashArray: Array<TokenValue<"dimension">>;
|
|
318
|
+
/** How the ends of the stroke should be rendered */
|
|
44
319
|
lineCap: LineCap;
|
|
45
320
|
};
|
|
321
|
+
/**
|
|
322
|
+
* A stroke style can be either a predefined keyword or a custom definition.
|
|
323
|
+
* This allows for both simple and complex stroke styles.
|
|
324
|
+
*/
|
|
46
325
|
type StrokeStyle = StrokeStyleKeyword | StrokeStyleCustom;
|
|
326
|
+
/**
|
|
327
|
+
* Border token combining color, width, and style.
|
|
328
|
+
* This is a composite type that defines a complete border.
|
|
329
|
+
*/
|
|
47
330
|
type Border = {
|
|
331
|
+
/** The color of the border */
|
|
48
332
|
color: TokenValue<"color">;
|
|
333
|
+
/** The width of the border */
|
|
49
334
|
width: TokenValue<"dimension">;
|
|
50
|
-
style
|
|
335
|
+
/** The style of the border, either a stroke style or a reference to one */
|
|
336
|
+
style: StrokeStyle | Reference<"strokeStyle">;
|
|
51
337
|
};
|
|
338
|
+
/**
|
|
339
|
+
* A single shadow definition.
|
|
340
|
+
* This is the basic building block for shadow tokens.
|
|
341
|
+
*/
|
|
52
342
|
type ShadowObject = {
|
|
343
|
+
/** The color of the shadow */
|
|
53
344
|
color: TokenValue<"color">;
|
|
345
|
+
/** Horizontal offset of the shadow */
|
|
54
346
|
offsetX: TokenValue<"dimension">;
|
|
347
|
+
/** Vertical offset of the shadow */
|
|
55
348
|
offsetY: TokenValue<"dimension">;
|
|
349
|
+
/** How much the shadow should blur */
|
|
56
350
|
blur: TokenValue<"dimension">;
|
|
351
|
+
/** How much the shadow should spread */
|
|
57
352
|
spread: TokenValue<"dimension">;
|
|
353
|
+
/** Whether the shadow should be inset */
|
|
58
354
|
inset?: boolean;
|
|
59
355
|
};
|
|
356
|
+
/**
|
|
357
|
+
* A shadow can be either a single shadow or multiple shadows.
|
|
358
|
+
* Multiple shadows are rendered in order, with later shadows appearing on top.
|
|
359
|
+
*/
|
|
60
360
|
type Shadow = ShadowObject | ShadowObject[];
|
|
361
|
+
/**
|
|
362
|
+
* A single stop in a gradient.
|
|
363
|
+
* Defines the color and position of a point in the gradient.
|
|
364
|
+
*/
|
|
61
365
|
type GradientStop = {
|
|
366
|
+
/** The color at this point in the gradient */
|
|
62
367
|
color: TokenValue<"color">;
|
|
63
|
-
position
|
|
368
|
+
/** The position of this point in the gradient (0-1) */
|
|
369
|
+
position: number | Reference<"number">;
|
|
64
370
|
};
|
|
371
|
+
/**
|
|
372
|
+
* A gradient is defined by a series of stops.
|
|
373
|
+
* The stops define how the gradient transitions between colors.
|
|
374
|
+
*/
|
|
65
375
|
type Gradient = GradientStop[];
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
376
|
+
|
|
377
|
+
/**
|
|
378
|
+
* Source information for a token, tracking its context and origin.
|
|
379
|
+
* This metadata helps with error reporting and token organization.
|
|
380
|
+
*
|
|
381
|
+
* Terminology aligns with DTCG Resolver Module 2025.10:
|
|
382
|
+
* - "context" = a resolved variation from a modifier (e.g., "light", "dark")
|
|
383
|
+
*/
|
|
384
|
+
type TokenSource = {
|
|
385
|
+
/**
|
|
386
|
+
* Optional context name for modifier variations (e.g., "dark", "light", "compact").
|
|
387
|
+
*
|
|
388
|
+
* TODO: Future enhancement - support multiple orthogonal modifiers.
|
|
389
|
+
* The DTCG spec supports multiple modifiers (e.g., theme + density), which would
|
|
390
|
+
* require changing this to: `context?: string | Record<string, string>`
|
|
391
|
+
* For example: `{ theme: "dark", density: "compact" }`
|
|
392
|
+
* This would also require updating CSS generation to produce combined selectors
|
|
393
|
+
* like `[data-theme="dark"][data-density="compact"]`.
|
|
394
|
+
*/
|
|
395
|
+
context?: string;
|
|
396
|
+
/** The path to the source file containing this token */
|
|
397
|
+
sourcePath: string;
|
|
69
398
|
};
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
399
|
+
/**
|
|
400
|
+
* A complete token tree with context information.
|
|
401
|
+
* This represents a single token file's contents with its metadata.
|
|
402
|
+
*
|
|
403
|
+
* Terminology aligns with DTCG Resolver Module 2025.10:
|
|
404
|
+
* - "context" = a resolved variation from a modifier (e.g., "light", "dark")
|
|
405
|
+
*/
|
|
406
|
+
type TokenTree = {
|
|
407
|
+
/**
|
|
408
|
+
* Optional context name for modifier variations (e.g., "dark", "light", "compact").
|
|
409
|
+
*
|
|
410
|
+
* TODO: Future enhancement - support multiple orthogonal modifiers.
|
|
411
|
+
* See TokenSource.context for details.
|
|
412
|
+
*/
|
|
413
|
+
context?: string;
|
|
414
|
+
/** The actual token data following the W3C design tokens format */
|
|
415
|
+
tokens: TokenGroup;
|
|
416
|
+
/** The path to the source file containing these tokens */
|
|
417
|
+
sourcePath: string;
|
|
75
418
|
};
|
|
76
|
-
|
|
77
|
-
|
|
419
|
+
|
|
420
|
+
/**
|
|
421
|
+
* A resolved token with its final value.
|
|
422
|
+
* Contains both the original token data and its resolved value after reference resolution.
|
|
423
|
+
* @template T - The type of token (e.g., "color", "dimension", etc.)
|
|
424
|
+
*/
|
|
425
|
+
type ResolvedToken<T extends TokenType = TokenType> = NodeMetadata & {
|
|
426
|
+
/** The type of the token */
|
|
427
|
+
$type: T;
|
|
428
|
+
/** The original value of the token, which may contain references */
|
|
429
|
+
$value: RawTokenValue<T>;
|
|
430
|
+
/** The path to this token in the token tree */
|
|
431
|
+
$path: string;
|
|
432
|
+
/** Information about where this token was loaded from */
|
|
433
|
+
$source: TokenSource;
|
|
434
|
+
/** The original path before any resolution */
|
|
435
|
+
$originalPath: string;
|
|
436
|
+
/** The final resolved value after all references are resolved */
|
|
437
|
+
$resolvedValue: RawTokenValue<T>;
|
|
78
438
|
};
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
439
|
+
/**
|
|
440
|
+
* A map of resolved tokens by their lookup path.
|
|
441
|
+
* Used to store the final resolved state of all tokens in a collection.
|
|
442
|
+
* Keys are token paths, values are either resolved tokens or node metadata.
|
|
443
|
+
*/
|
|
444
|
+
type ResolvedTokens = {
|
|
445
|
+
/** Token path as key, resolved token or metadata as value */
|
|
446
|
+
[lookupKey: string]: ResolvedToken | NodeMetadata;
|
|
84
447
|
};
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
448
|
+
/**
|
|
449
|
+
* Type of resolution error that occurred.
|
|
450
|
+
* - "circular": A circular reference was detected
|
|
451
|
+
* - "missing": A referenced token could not be found
|
|
452
|
+
* - "type-mismatch": A referenced token's type doesn't match the expected type
|
|
453
|
+
*/
|
|
454
|
+
type ResolutionErrorType = "circular" | "missing" | "type-mismatch";
|
|
455
|
+
/**
|
|
456
|
+
* An error that occurred during token resolution.
|
|
457
|
+
* Extends the base error type with resolution-specific information.
|
|
458
|
+
*/
|
|
459
|
+
type ResolutionError = BaseError & {
|
|
460
|
+
/** The type of resolution error that occurred */
|
|
461
|
+
type: ResolutionErrorType;
|
|
462
|
+
/** The path to the token that failed resolution */
|
|
463
|
+
path: string;
|
|
464
|
+
/** Source information about where the token was loaded from */
|
|
465
|
+
source: TokenSource;
|
|
90
466
|
};
|
|
91
|
-
|
|
467
|
+
|
|
468
|
+
/**
|
|
469
|
+
* A token that has been converted to CSS properties.
|
|
470
|
+
* Extends ResolvedToken with CSS-specific properties.
|
|
471
|
+
* @template T The type of token
|
|
472
|
+
*/
|
|
473
|
+
type ConvertedToken<T extends TokenType = TokenType> = ResolvedToken<T> & {
|
|
474
|
+
/** The CSS properties generated from the token */
|
|
475
|
+
$cssProperties: CSSProperties<T>;
|
|
476
|
+
};
|
|
477
|
+
/**
|
|
478
|
+
* A collection of converted tokens.
|
|
479
|
+
* Maps token paths to their converted values or metadata nodes.
|
|
480
|
+
*/
|
|
481
|
+
type ConvertedTokens = {
|
|
482
|
+
[lookupKey: string]: ConvertedToken | NodeMetadata;
|
|
483
|
+
};
|
|
484
|
+
/**
|
|
485
|
+
* A collection of converted tokens organized by context.
|
|
486
|
+
* Structure: context → tokens
|
|
487
|
+
*
|
|
488
|
+
* Example:
|
|
489
|
+
* {
|
|
490
|
+
* default: { "color.primary": { ... } },
|
|
491
|
+
* dark: { "color.primary": { ... } },
|
|
492
|
+
* ocean: { "color.primary": { ... } }
|
|
493
|
+
* }
|
|
494
|
+
*/
|
|
495
|
+
type NormalizedConvertedTokens = {
|
|
496
|
+
[context: string]: ConvertedTokens;
|
|
497
|
+
};
|
|
498
|
+
/**
|
|
499
|
+
* CSS property types for different token types.
|
|
500
|
+
* Maps token types to their corresponding CSS property structures.
|
|
501
|
+
* @template T The type of token
|
|
502
|
+
*/
|
|
503
|
+
type CSSProperties<T extends TokenType> = T extends SimpleTokenType ? SimpleCSSProperties : T extends AlwaysDecomposedType ? AlwaysDecomposedProperties : T extends "border" ? CSSBorderProperties : T extends "shadow" ? CSSShadowProperties : T extends "gradient" ? CSSGradientProperties : T extends "transition" ? CSSTransitionProperties : T extends StructuralCompositeType ? SimpleCSSProperties : never;
|
|
504
|
+
/**
|
|
505
|
+
* Simple CSS properties with a single value.
|
|
506
|
+
* Used for tokens that map to a single CSS property.
|
|
507
|
+
*/
|
|
92
508
|
type SimpleCSSProperties = {
|
|
509
|
+
/** The CSS value */
|
|
93
510
|
value: string | number;
|
|
511
|
+
/** Optional feature queries for responsive values */
|
|
94
512
|
featureValues?: Array<{
|
|
95
513
|
query: string;
|
|
96
514
|
value: string;
|
|
97
515
|
}>;
|
|
98
516
|
};
|
|
517
|
+
/**
|
|
518
|
+
* CSS properties that are always broken down into multiple properties.
|
|
519
|
+
* Currently only used for typography tokens.
|
|
520
|
+
*/
|
|
99
521
|
type AlwaysDecomposedProperties = CSSTypographyProperties;
|
|
522
|
+
/**
|
|
523
|
+
* CSS properties specific to typography tokens.
|
|
524
|
+
* Maps typography tokens to their corresponding CSS properties.
|
|
525
|
+
*/
|
|
100
526
|
type CSSTypographyProperties = {
|
|
527
|
+
/** The font family to use */
|
|
101
528
|
"font-family": string;
|
|
529
|
+
/** The font size */
|
|
102
530
|
"font-size": string;
|
|
531
|
+
/** The font weight */
|
|
103
532
|
"font-weight"?: number | string;
|
|
533
|
+
/** The letter spacing */
|
|
104
534
|
"letter-spacing"?: string;
|
|
535
|
+
/** The line height */
|
|
105
536
|
"line-height"?: number | string;
|
|
106
537
|
};
|
|
107
|
-
|
|
538
|
+
/**
|
|
539
|
+
* CSS properties for specific token types.
|
|
540
|
+
* These types represent tokens that map to single CSS properties.
|
|
541
|
+
*/
|
|
542
|
+
/**
|
|
543
|
+
* CSS properties for border tokens.
|
|
544
|
+
*/
|
|
108
545
|
type CSSBorderProperties = {
|
|
546
|
+
/** The border value */
|
|
109
547
|
value: string;
|
|
110
|
-
split?: {
|
|
111
|
-
width: string;
|
|
112
|
-
style: string;
|
|
113
|
-
color: string;
|
|
114
|
-
};
|
|
115
548
|
};
|
|
549
|
+
/**
|
|
550
|
+
* CSS properties for shadow tokens.
|
|
551
|
+
*/
|
|
116
552
|
type CSSShadowProperties = {
|
|
553
|
+
/** The shadow value */
|
|
117
554
|
value: string;
|
|
118
|
-
split?: CSSShadowSplitProperties | CSSShadowSplitProperties[];
|
|
119
|
-
};
|
|
120
|
-
type CSSShadowSplitProperties = {
|
|
121
|
-
"offset-x": string;
|
|
122
|
-
"offset-y": string;
|
|
123
|
-
"blur": string;
|
|
124
|
-
"spread": string;
|
|
125
|
-
"color": string;
|
|
126
|
-
"inset"?: "inset";
|
|
127
555
|
};
|
|
556
|
+
/**
|
|
557
|
+
* CSS properties for gradient tokens.
|
|
558
|
+
*/
|
|
128
559
|
type CSSGradientProperties = {
|
|
560
|
+
/** The gradient value */
|
|
129
561
|
value: string;
|
|
130
|
-
split?: {
|
|
131
|
-
stops: Array<{
|
|
132
|
-
color: string;
|
|
133
|
-
position: string;
|
|
134
|
-
}>;
|
|
135
|
-
};
|
|
136
562
|
};
|
|
563
|
+
/**
|
|
564
|
+
* CSS properties for transition tokens.
|
|
565
|
+
*/
|
|
137
566
|
type CSSTransitionProperties = {
|
|
567
|
+
/** The transition value */
|
|
138
568
|
value: string;
|
|
139
|
-
split?: {
|
|
140
|
-
"duration": string;
|
|
141
|
-
"timing-function": string;
|
|
142
|
-
"delay"?: string;
|
|
143
|
-
};
|
|
144
569
|
};
|
|
145
|
-
|
|
146
|
-
|
|
570
|
+
|
|
571
|
+
/**
|
|
572
|
+
* Represents a single CSS file output with its path and content
|
|
573
|
+
*/
|
|
574
|
+
type CSSFile = {
|
|
575
|
+
/** The path where the CSS file will be written */
|
|
576
|
+
path: string;
|
|
577
|
+
/** The CSS content to write to the file */
|
|
578
|
+
css: string;
|
|
147
579
|
};
|
|
148
|
-
|
|
149
|
-
|
|
580
|
+
/**
|
|
581
|
+
* Represents multiple CSS file outputs
|
|
582
|
+
*/
|
|
583
|
+
type CSSFileOutput = CSSFile[];
|
|
584
|
+
|
|
585
|
+
/**
|
|
586
|
+
* An error that occurred during token flattening.
|
|
587
|
+
* Extends the base error type with flattening-specific information.
|
|
588
|
+
*/
|
|
589
|
+
type FlattenError = BaseError & {
|
|
590
|
+
/** The path to the token that failed flattening */
|
|
591
|
+
path: string;
|
|
592
|
+
/** Source information about where the token was loaded from */
|
|
593
|
+
source: TokenSource;
|
|
150
594
|
};
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
595
|
+
|
|
596
|
+
/**
|
|
597
|
+
* Result of loading a Sugarcube configuration file
|
|
598
|
+
*/
|
|
599
|
+
type LoadedConfig = {
|
|
600
|
+
/** The validated configuration */
|
|
601
|
+
config: InternalConfig;
|
|
602
|
+
/** The path to the config file that was loaded */
|
|
603
|
+
configPath: string;
|
|
160
604
|
};
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
605
|
+
/**
|
|
606
|
+
* Data structure for loading tokens from memory.
|
|
607
|
+
* Maps file paths to their token content and metadata.
|
|
608
|
+
* Used for programmatic token loading.
|
|
609
|
+
*
|
|
610
|
+
* Terminology aligns with DTCG Resolver Module 2025.10:
|
|
611
|
+
* - "context" = a resolved variation from a modifier (e.g., "light", "dark")
|
|
612
|
+
*/
|
|
613
|
+
type TokenMemoryData = Record<string, {
|
|
614
|
+
/**
|
|
615
|
+
* Optional context name for modifier variations (e.g., "dark", "light").
|
|
616
|
+
* See TokenSource.context for future enhancement notes.
|
|
617
|
+
*/
|
|
618
|
+
context?: string;
|
|
619
|
+
/** The raw token content as a string */
|
|
620
|
+
content: string;
|
|
621
|
+
}>;
|
|
622
|
+
/**
|
|
623
|
+
* An error that occurred during token loading.
|
|
624
|
+
* Extends the base error type with file-specific information.
|
|
625
|
+
*/
|
|
626
|
+
type LoadError = BaseError & {
|
|
627
|
+
/** The file path where the error occurred */
|
|
628
|
+
file: string;
|
|
164
629
|
};
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
630
|
+
|
|
631
|
+
/**
|
|
632
|
+
* An error that occurred during token validation.
|
|
633
|
+
* Extends the base error type with token-specific information.
|
|
634
|
+
*/
|
|
635
|
+
type ValidationError = BaseError & {
|
|
636
|
+
/** The path to the token that failed validation */
|
|
637
|
+
path: string;
|
|
638
|
+
/** Source information about where the token was loaded from */
|
|
639
|
+
source: TokenSource;
|
|
171
640
|
};
|
|
172
|
-
|
|
173
|
-
|
|
641
|
+
|
|
642
|
+
/**
|
|
643
|
+
* Modifier metadata for CSS generation.
|
|
644
|
+
* Used to build selectors like [data-theme="dark"].
|
|
645
|
+
*/
|
|
646
|
+
type ModifierMeta$1 = {
|
|
647
|
+
/** The modifier name (e.g., "theme", "density") */
|
|
648
|
+
name: string;
|
|
649
|
+
/** Auto-derived CSS attribute (e.g., "data-theme", "data-density") */
|
|
650
|
+
attribute: string;
|
|
651
|
+
/** The default context name */
|
|
652
|
+
defaultContext: string;
|
|
653
|
+
/** Available non-default context names */
|
|
654
|
+
contexts: string[];
|
|
174
655
|
};
|
|
175
|
-
|
|
176
|
-
|
|
656
|
+
/**
|
|
657
|
+
* Result of running any pipeline.
|
|
658
|
+
* Contains the generated output, token trees, and any errors.
|
|
659
|
+
*/
|
|
660
|
+
type PipelineResult = {
|
|
661
|
+
/** The generated output (e.g. CSS files) */
|
|
662
|
+
output: CSSFileOutput;
|
|
663
|
+
/** The loaded token trees */
|
|
664
|
+
trees: TokenTree[];
|
|
665
|
+
/** Modifier metadata for CSS selector generation */
|
|
666
|
+
modifiers?: ModifierMeta$1[];
|
|
667
|
+
/** Any errors that occurred during pipeline execution */
|
|
668
|
+
errors: PipelineErrors;
|
|
177
669
|
};
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
670
|
+
/**
|
|
671
|
+
* Common error types that can occur during pipeline execution.
|
|
672
|
+
* Organizes errors by the pipeline stage where they occurred.
|
|
673
|
+
*/
|
|
674
|
+
type PipelineErrors = {
|
|
675
|
+
/** Errors that occurred during token loading */
|
|
676
|
+
load: LoadError[];
|
|
677
|
+
/** Errors that occurred during token flattening */
|
|
678
|
+
flatten: FlattenError[];
|
|
679
|
+
/** Errors that occurred during token validation */
|
|
680
|
+
validation: ValidationError[];
|
|
681
|
+
/** Errors that occurred during token resolution */
|
|
682
|
+
resolution: ResolutionError[];
|
|
181
683
|
};
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
684
|
+
/**
|
|
685
|
+
* Defines how tokens should be loaded and processed.
|
|
686
|
+
* - "resolver": Load from a DTCG resolver document (primary method)
|
|
687
|
+
* - "memory": Load from in-memory data (for testing/programmatic use)
|
|
688
|
+
*/
|
|
689
|
+
type TokenPipelineSource = {
|
|
690
|
+
type: "resolver";
|
|
691
|
+
/** Path to the .resolver.json file */
|
|
692
|
+
resolverPath: string;
|
|
693
|
+
/** Configuration for output and transforms */
|
|
694
|
+
config: InternalConfig;
|
|
695
|
+
} | {
|
|
696
|
+
type: "memory";
|
|
697
|
+
/** In-memory token data */
|
|
698
|
+
data: TokenMemoryData;
|
|
699
|
+
/** Configuration for output and transforms */
|
|
700
|
+
config: InternalConfig;
|
|
186
701
|
};
|
|
187
702
|
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
|
|
703
|
+
/**
|
|
704
|
+
* Generate CSS variable files from converted tokens.
|
|
705
|
+
*
|
|
706
|
+
* @param convertedTokens - The normalized and converted tokens
|
|
707
|
+
* @param config - The configuration object
|
|
708
|
+
* @param modifiers - Optional modifier metadata for generating per-modifier attribute selectors
|
|
709
|
+
* @returns Array of CSS file outputs
|
|
710
|
+
*/
|
|
711
|
+
declare function generateCSSVariables(convertedTokens: NormalizedConvertedTokens, config: InternalConfig, modifiers?: ModifierMeta$1[]): Promise<CSSFileOutput>;
|
|
712
|
+
|
|
713
|
+
/**
|
|
714
|
+
* Core token processing pipeline.
|
|
715
|
+
*
|
|
716
|
+
* Loads tokens from a resolver document, flattens, validates, and resolves references.
|
|
717
|
+
* Returns processed tokens ready for CSS generation.
|
|
718
|
+
*/
|
|
192
719
|
|
|
193
|
-
|
|
720
|
+
/**
|
|
721
|
+
* Result of loading and resolving tokens.
|
|
722
|
+
*/
|
|
723
|
+
type LoadAndResolveResult = {
|
|
724
|
+
/** The loaded token trees */
|
|
725
|
+
trees: TokenTree[];
|
|
726
|
+
/** Resolved tokens after reference resolution */
|
|
194
727
|
resolved: ResolvedTokens;
|
|
195
|
-
|
|
728
|
+
/** Modifier metadata for CSS selector generation */
|
|
729
|
+
modifiers: ModifierMeta$1[];
|
|
730
|
+
/** Any errors that occurred */
|
|
731
|
+
errors: PipelineResult["errors"];
|
|
732
|
+
};
|
|
733
|
+
/**
|
|
734
|
+
* Core token processing pipeline that handles loading, validation, and resolution.
|
|
735
|
+
*
|
|
736
|
+
* This pipeline:
|
|
737
|
+
* 1. Loads token trees from resolver document or memory
|
|
738
|
+
* 2. Flattens trees into a single structure
|
|
739
|
+
* 3. Validates tokens for correctness
|
|
740
|
+
* 4. Resolves all token references
|
|
741
|
+
*
|
|
742
|
+
* For resolver sources, loads ALL contexts (not just default) and returns
|
|
743
|
+
* modifier metadata needed for CSS selector generation.
|
|
744
|
+
*
|
|
745
|
+
* @param source - The source of tokens to process (resolver or memory)
|
|
746
|
+
* @returns Processed tokens with modifier metadata and any errors
|
|
747
|
+
*
|
|
748
|
+
* @example
|
|
749
|
+
* const result = await loadAndResolveTokens({
|
|
750
|
+
* type: "resolver",
|
|
751
|
+
* resolverPath: "tokens.resolver.json",
|
|
752
|
+
* config
|
|
753
|
+
* });
|
|
754
|
+
* // result.trees - all token trees (base + modifier contexts)
|
|
755
|
+
* // result.modifiers - metadata for CSS selectors
|
|
756
|
+
*/
|
|
757
|
+
declare function loadAndResolveTokens(source: TokenPipelineSource): Promise<LoadAndResolveResult>;
|
|
758
|
+
|
|
759
|
+
/**
|
|
760
|
+
* Normalized tokens organized by context.
|
|
761
|
+
* Structure: context → tokens
|
|
762
|
+
*
|
|
763
|
+
* This is the structure for resolver-based configs where sets merge
|
|
764
|
+
* and modifiers define contexts (light, dark, ocean, etc.).
|
|
765
|
+
*
|
|
766
|
+
* Example:
|
|
767
|
+
* {
|
|
768
|
+
* light: { "color.primary": { $value: "#3b82f6" } },
|
|
769
|
+
* dark: { "color.primary": { $value: "#60a5fa" } },
|
|
770
|
+
* ocean: { "color.primary": { $value: "#0ea5e9" } }
|
|
771
|
+
* }
|
|
772
|
+
*/
|
|
773
|
+
type NormalizedTokens = Record<string, ResolvedTokens>;
|
|
774
|
+
/**
|
|
775
|
+
* Result of the normalization process.
|
|
776
|
+
*/
|
|
777
|
+
type NormalizeResult = {
|
|
778
|
+
/** The normalized tokens organized by context */
|
|
779
|
+
tokens: NormalizedTokens;
|
|
780
|
+
/** The default context name */
|
|
781
|
+
defaultContext?: string;
|
|
782
|
+
};
|
|
783
|
+
|
|
784
|
+
type NamedUtilityValue = {
|
|
785
|
+
kind: "named";
|
|
786
|
+
value: string;
|
|
787
|
+
fraction: string | null;
|
|
788
|
+
};
|
|
789
|
+
type ArbitraryUtilityValue = {
|
|
790
|
+
kind: "arbitrary";
|
|
791
|
+
value: string;
|
|
196
792
|
};
|
|
793
|
+
type UtilityValue = NamedUtilityValue | ArbitraryUtilityValue;
|
|
794
|
+
type StaticVariant = {
|
|
795
|
+
kind: "static";
|
|
796
|
+
root: string;
|
|
797
|
+
};
|
|
798
|
+
type FunctionalVariant = {
|
|
799
|
+
kind: "functional";
|
|
800
|
+
root: string;
|
|
801
|
+
value: UtilityValue;
|
|
802
|
+
};
|
|
803
|
+
type Variant = StaticVariant | FunctionalVariant;
|
|
804
|
+
type StaticCandidate = {
|
|
805
|
+
kind: "static";
|
|
806
|
+
root: string;
|
|
807
|
+
variants: Variant[];
|
|
808
|
+
raw: string;
|
|
809
|
+
};
|
|
810
|
+
type FunctionalCandidate = {
|
|
811
|
+
kind: "functional";
|
|
812
|
+
root: string;
|
|
813
|
+
value: UtilityValue | null;
|
|
814
|
+
variants: Variant[];
|
|
815
|
+
raw: string;
|
|
816
|
+
};
|
|
817
|
+
type Candidate = StaticCandidate | FunctionalCandidate;
|
|
818
|
+
interface StaticUtilityPattern {
|
|
819
|
+
properties: string[];
|
|
820
|
+
validator: (candidate: Candidate) => boolean;
|
|
821
|
+
generator: (candidate: Candidate) => string;
|
|
822
|
+
}
|
|
197
823
|
|
|
198
824
|
/**
|
|
199
|
-
*
|
|
200
|
-
*
|
|
201
|
-
*
|
|
202
|
-
*
|
|
203
|
-
*
|
|
825
|
+
* Processes and converts token trees into CSS-ready format.
|
|
826
|
+
* This pipeline:
|
|
827
|
+
* 1. Processes trees with resolved tokens to create a unified structure
|
|
828
|
+
* 2. Normalizes tokens into a context-based organization
|
|
829
|
+
* 3. Converts tokens to their CSS representations with properties
|
|
830
|
+
*
|
|
831
|
+
*
|
|
832
|
+
* @param trees - The token trees to process
|
|
833
|
+
* @param resolved - The resolved tokens for processing
|
|
834
|
+
* @param config - The sugarcube configuration
|
|
835
|
+
* @param validationErrors - Optional array of validation errors. Tokens with validation errors will be filtered out before conversion.
|
|
836
|
+
* @returns The processed and converted tokens ready for CSS generation
|
|
837
|
+
*
|
|
838
|
+
* @example
|
|
839
|
+
* const convertedTokens = await processAndConvertTokens(trees, resolved, config);
|
|
840
|
+
* // convertedTokens = { "default": { "token.path": { $cssProperties: {...} } }, "dark": {...} }
|
|
204
841
|
*/
|
|
205
|
-
declare function
|
|
842
|
+
declare function processAndConvertTokens(trees: TokenTree[], resolved: ResolvedTokens, config: InternalConfig, validationErrors?: ValidationError[]): Promise<NormalizedConvertedTokens>;
|
|
206
843
|
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
844
|
+
/**
|
|
845
|
+
* Resolver-based token loading for DTCG Resolver Module 2025.10
|
|
846
|
+
* https://www.designtokens.org/TR/2025.10/resolver/
|
|
847
|
+
*
|
|
848
|
+
* This module loads tokens from a resolver document, producing TokenTree[]
|
|
849
|
+
* for pipeline compatibility plus modifier metadata for CSS generation.
|
|
850
|
+
*/
|
|
210
851
|
|
|
211
|
-
|
|
212
|
-
|
|
213
|
-
|
|
852
|
+
/**
|
|
853
|
+
* Modifier metadata for CSS generation.
|
|
854
|
+
* Used to build selectors like [data-theme="dark"].
|
|
855
|
+
*/
|
|
856
|
+
type ModifierMeta = {
|
|
857
|
+
/** The modifier name (e.g., "theme", "density") */
|
|
858
|
+
name: string;
|
|
859
|
+
/** Auto-derived CSS attribute (e.g., "data-theme", "data-density") */
|
|
860
|
+
attribute: string;
|
|
861
|
+
/** The default context name */
|
|
862
|
+
defaultContext: string;
|
|
863
|
+
/** Available non-default context names */
|
|
864
|
+
contexts: string[];
|
|
865
|
+
};
|
|
866
|
+
/**
|
|
867
|
+
* Result of loading tokens from a resolver document.
|
|
868
|
+
*/
|
|
869
|
+
type ResolverLoadResult = {
|
|
870
|
+
/** Token trees for pipeline processing (base + all modifier contexts) */
|
|
871
|
+
trees: TokenTree[];
|
|
872
|
+
/** Modifier metadata for CSS selector generation */
|
|
873
|
+
modifiers: ModifierMeta[];
|
|
874
|
+
/** Any errors encountered during loading */
|
|
875
|
+
errors: LoadError[];
|
|
214
876
|
};
|
|
215
|
-
|
|
877
|
+
/**
|
|
878
|
+
* Load tokens from a resolver document.
|
|
879
|
+
*
|
|
880
|
+
* This function:
|
|
881
|
+
* 1. Parses the resolver document
|
|
882
|
+
* 2. Processes all sets and modifier contexts
|
|
883
|
+
* 3. Returns TokenTree[] with context info for the pipeline
|
|
884
|
+
* 4. Returns modifier metadata for CSS selector generation
|
|
885
|
+
*
|
|
886
|
+
* Token trees use compound context keys for non-default modifier contexts:
|
|
887
|
+
* - Base tokens: context = undefined (maps to :root)
|
|
888
|
+
* - Modifier contexts: context = "modifierName:contextName" (e.g., "theme:dark")
|
|
889
|
+
*
|
|
890
|
+
* @param resolverPath - Path to the .resolver.json file
|
|
891
|
+
* @returns ResolverLoadResult with trees, modifier metadata, and errors
|
|
892
|
+
*
|
|
893
|
+
* @example
|
|
894
|
+
* const result = await loadFromResolver("tokens.resolver.json");
|
|
895
|
+
* // result.trees -> TokenTree[] for flatten/validate/resolve
|
|
896
|
+
* // result.modifiers -> metadata for CSS selector generation
|
|
897
|
+
*/
|
|
898
|
+
declare function loadFromResolver(resolverPath: string): Promise<ResolverLoadResult>;
|
|
899
|
+
|
|
900
|
+
declare function generateIndex(stylesDir: string, config: InternalConfig): Promise<string>;
|
|
901
|
+
declare function shouldRegenerateIndex(stylesDir: string, config: InternalConfig): Promise<boolean>;
|
|
902
|
+
|
|
903
|
+
/**
|
|
904
|
+
* Writes CSS files to disk, creating directories as needed.
|
|
905
|
+
*
|
|
906
|
+
* This function:
|
|
907
|
+
* 1. Creates any missing directories in the file path
|
|
908
|
+
* 2. Adds a warning banner to prevent direct edits
|
|
909
|
+
* 3. Only writes files if the content has changed
|
|
910
|
+
* 4. Handles both single and multiple CSS file outputs
|
|
911
|
+
*
|
|
912
|
+
* @param output - Array of CSS file outputs to write
|
|
913
|
+
* @returns The original output array
|
|
914
|
+
* @throws Error if file writing fails
|
|
915
|
+
*
|
|
916
|
+
* @example
|
|
917
|
+
* await writeCSSFilesToDisk([
|
|
918
|
+
* { path: "styles/tokens.css", css: "body { color: red; }" }
|
|
919
|
+
* ]);
|
|
920
|
+
*/
|
|
921
|
+
declare function writeCSSVariablesToDisk(output: CSSFileOutput): Promise<CSSFileOutput>;
|
|
922
|
+
/**
|
|
923
|
+
* Writes utility CSS files to disk, creating directories as needed.
|
|
924
|
+
*
|
|
925
|
+
* This function:
|
|
926
|
+
* 1. Creates any missing directories in the file path
|
|
927
|
+
* 2. Adds a warning banner specific to utility classes
|
|
928
|
+
* 3. Only writes files if the content has changed
|
|
929
|
+
*
|
|
930
|
+
* @param output - The CSS file output to write
|
|
931
|
+
* @param config - The sugarcube configuration
|
|
932
|
+
* @returns The CSS file output that was written
|
|
933
|
+
* @throws Error if file writing fails
|
|
934
|
+
*
|
|
935
|
+
* @example
|
|
936
|
+
* await writeCSSUtilitiesToDisk(
|
|
937
|
+
* [{ path: "src/styles/utilities/utilities.css", css: ".p-4 { padding: var(--spacing-4); }" }],
|
|
938
|
+
* config
|
|
939
|
+
* );
|
|
940
|
+
*/
|
|
941
|
+
declare function writeCSSUtilitiesToDisk(output: CSSFileOutput): Promise<CSSFileOutput>;
|
|
942
|
+
|
|
943
|
+
declare function findConfigFile(basePath?: string): string | null;
|
|
944
|
+
declare function configFileExists(basePath?: string): boolean;
|
|
945
|
+
declare function loadTSConfig(configPath: string): Promise<unknown>;
|
|
946
|
+
declare function loadUserConfig(configPath?: string): Promise<{
|
|
947
|
+
config: UserConfig;
|
|
948
|
+
configPath: string;
|
|
949
|
+
}>;
|
|
950
|
+
declare function loadInternalConfig(configPath?: string): Promise<LoadedConfig>;
|
|
951
|
+
|
|
952
|
+
/**
|
|
953
|
+
* Validates a user configuration object against the user schema.
|
|
954
|
+
*
|
|
955
|
+
* @param config - The user configuration object to validate
|
|
956
|
+
* @returns The validated user configuration
|
|
957
|
+
* @throws Error if the configuration is invalid
|
|
958
|
+
*/
|
|
959
|
+
declare function validateUserConfig(config: Partial<UserConfig>): UserConfig;
|
|
960
|
+
/**
|
|
961
|
+
* Validates an internal configuration object against the internal schema.
|
|
962
|
+
*
|
|
963
|
+
* @param config - The internal configuration object to validate
|
|
964
|
+
* @returns The validated internal configuration
|
|
965
|
+
* @throws Error if the configuration is invalid
|
|
966
|
+
*/
|
|
967
|
+
declare function validateInternalConfig(config: InternalConfig): InternalConfig;
|
|
968
|
+
/**
|
|
969
|
+
* Validates a user configuration object against the schema and fills in defaults.
|
|
970
|
+
*
|
|
971
|
+
* This function:
|
|
972
|
+
* 1. Validates the configuration structure using the user schema
|
|
973
|
+
* 2. Fills in default values
|
|
974
|
+
* 3. Validates the complete configuration using the internal schema
|
|
975
|
+
* 4. Returns the validated configuration with defaults filled in
|
|
976
|
+
*
|
|
977
|
+
* @param config - The user configuration object to validate
|
|
978
|
+
* @returns The validated configuration with defaults filled in
|
|
979
|
+
* @throws Error if the configuration is invalid
|
|
980
|
+
*
|
|
981
|
+
* @example
|
|
982
|
+
* const config = { resolver: "./tokens.resolver.json" };
|
|
983
|
+
* const validatedConfig = validateConfig(config);
|
|
984
|
+
*/
|
|
985
|
+
declare function validateConfig(config: Partial<UserConfig>): InternalConfig;
|
|
986
|
+
/**
|
|
987
|
+
* Parses and validates a JSON configuration string.
|
|
988
|
+
*
|
|
989
|
+
* This function:
|
|
990
|
+
* 1. Parses the JSON string into a configuration object
|
|
991
|
+
* 2. Validates and normalizes the configuration using validateConfig
|
|
992
|
+
* 3. Returns the validated and normalized configuration
|
|
993
|
+
*
|
|
994
|
+
* @param configString - The JSON configuration string to parse and validate
|
|
995
|
+
* @returns The validated and normalized configuration
|
|
996
|
+
* @throws Error if the JSON is invalid or the configuration is invalid
|
|
997
|
+
*/
|
|
998
|
+
declare function parseAndValidateConfig(configString: string): InternalConfig;
|
|
216
999
|
|
|
217
1000
|
/**
|
|
218
|
-
*
|
|
219
|
-
*
|
|
1001
|
+
* Fills in default values for any omitted fields in a user configuration.
|
|
1002
|
+
*
|
|
1003
|
+
* This function takes a user config (with optional fields) and
|
|
1004
|
+
* returns a complete internal config (with all required fields filled in).
|
|
1005
|
+
*
|
|
1006
|
+
* @param userConfig - The user configuration with optional fields
|
|
1007
|
+
* @returns A complete configuration with all defaults filled in
|
|
220
1008
|
*
|
|
221
|
-
* @
|
|
222
|
-
*
|
|
223
|
-
*
|
|
224
|
-
*
|
|
1009
|
+
* @example
|
|
1010
|
+
* const userConfig = {
|
|
1011
|
+
* resolver: "./tokens.resolver.json"
|
|
1012
|
+
* };
|
|
1013
|
+
* const completeConfig = fillDefaults(userConfig);
|
|
1014
|
+
* // completeConfig.output.css === "src/styles"
|
|
225
1015
|
*/
|
|
226
|
-
declare function
|
|
1016
|
+
declare function fillDefaults(userConfig: UserConfig): InternalConfig;
|
|
1017
|
+
|
|
1018
|
+
interface CSSImport {
|
|
1019
|
+
path: string;
|
|
1020
|
+
layer: string;
|
|
1021
|
+
relativePath: string;
|
|
1022
|
+
}
|
|
1023
|
+
declare function discoverAllFiles(stylesDir: string, config: InternalConfig): Promise<CSSImport[]>;
|
|
1024
|
+
|
|
1025
|
+
declare function generateIndexContent(files: CSSImport[]): string;
|
|
1026
|
+
|
|
1027
|
+
declare class Instrumentation implements Disposable {
|
|
1028
|
+
#private;
|
|
1029
|
+
private defaultFlush;
|
|
1030
|
+
constructor(defaultFlush?: (message: string) => undefined);
|
|
1031
|
+
hit(label: string): void;
|
|
1032
|
+
start(label: string): void;
|
|
1033
|
+
end(label: string): void;
|
|
1034
|
+
report(flush?: (message: string) => undefined): void;
|
|
1035
|
+
[Symbol.dispose](): void;
|
|
1036
|
+
}
|
|
1037
|
+
|
|
1038
|
+
type CSSObject = Record<string, string | number | undefined>;
|
|
1039
|
+
declare function convertConfigToUnoRules(utilitiesConfig: UtilitiesConfig, tokens: NormalizedConvertedTokens): Array<[RegExp, (m: RegExpMatchArray) => CSSObject]>;
|
|
1040
|
+
|
|
1041
|
+
declare const SUGARCUBE_FILE = "_sugarcube.css";
|
|
1042
|
+
declare const GLOBAL_DIR = "global";
|
|
1043
|
+
declare const UTILITIES_DIR = "utilities";
|
|
1044
|
+
declare const VARIABLES_FILE_SUFFIX = ".variables.gen.css";
|
|
1045
|
+
declare const DEFAULT_VARIABLES_FILENAME = "tokens";
|
|
1046
|
+
declare const DEFAULT_UTILITIES_FILENAME = "utilities.gen.css";
|
|
1047
|
+
declare const DEFAULT_STYLES_PATH = "src/styles";
|
|
1048
|
+
declare const DEFAULT_DESIGN_TOKENS_PATH = "src/design-tokens";
|
|
1049
|
+
declare const SUGARCUBE_CONFIG_FILE = "sugarcube.config.ts";
|
|
1050
|
+
|
|
1051
|
+
declare const DEFAULT_CONFIG: {
|
|
1052
|
+
readonly output: {
|
|
1053
|
+
readonly css: "src/styles";
|
|
1054
|
+
readonly components: "src/components/ui";
|
|
1055
|
+
readonly themeAttribute: "data-theme";
|
|
1056
|
+
};
|
|
1057
|
+
readonly transforms: {
|
|
1058
|
+
readonly fluid: {
|
|
1059
|
+
readonly min: 320;
|
|
1060
|
+
readonly max: 1200;
|
|
1061
|
+
};
|
|
1062
|
+
readonly colorFallbackStrategy: "native";
|
|
1063
|
+
};
|
|
1064
|
+
};
|
|
1065
|
+
|
|
1066
|
+
declare const DEFAULT_COLLECTION = "default";
|
|
1067
|
+
declare const DEFAULT_CONTEXT = "default";
|
|
1068
|
+
|
|
1069
|
+
declare const ErrorMessages: {
|
|
1070
|
+
readonly LOAD: {
|
|
1071
|
+
readonly NO_FILES_FOUND: (pattern: string) => string;
|
|
1072
|
+
readonly INVALID_JSON: (path: string, message: string) => string;
|
|
1073
|
+
readonly GLOB_ERROR: (pattern: string, error: string) => string;
|
|
1074
|
+
};
|
|
1075
|
+
readonly FLATTEN: {
|
|
1076
|
+
readonly INVALID_TOKEN_NAME: (name: string) => string;
|
|
1077
|
+
readonly MISSING_DOLLAR_PREFIX: (path: string) => string;
|
|
1078
|
+
readonly INVALID_TOKEN_NESTING: (path: string) => string;
|
|
1079
|
+
readonly COMPOSITE_TOKEN_MISSING_TYPE: (path: string) => string;
|
|
1080
|
+
readonly CONFLICT_TOKEN_VS_GROUP: (path: string) => string;
|
|
1081
|
+
readonly CONFLICT_INCOMPATIBLE_TYPES: (expected: string, received: string, path: string) => string;
|
|
1082
|
+
};
|
|
1083
|
+
readonly METADATA: {
|
|
1084
|
+
readonly COLLECTION_ERROR: (message: string) => string;
|
|
1085
|
+
readonly INVALID_EXTENSIONS: (path: string) => string;
|
|
1086
|
+
readonly INVALID_DESCRIPTION: (path: string) => string;
|
|
1087
|
+
};
|
|
1088
|
+
readonly VALIDATE: {
|
|
1089
|
+
readonly MISSING_TYPE: (path: string) => string;
|
|
1090
|
+
readonly UNKNOWN_TOKEN_TYPE: (type: string, path: string) => string;
|
|
1091
|
+
readonly INVALID_COLOR: (value: unknown, path: string) => string;
|
|
1092
|
+
readonly INVALID_DIMENSION: (value: unknown, path: string) => string;
|
|
1093
|
+
readonly INVALID_DIMENSION_UNIT: (unit: unknown, path: string) => string;
|
|
1094
|
+
readonly INVALID_FONT_FAMILY: (value: unknown, path: string) => string;
|
|
1095
|
+
readonly INVALID_FONT_WEIGHT: (value: unknown, path: string) => string;
|
|
1096
|
+
readonly INVALID_DURATION: (value: unknown, path: string) => string;
|
|
1097
|
+
readonly INVALID_DURATION_UNIT: (unit: unknown, path: string) => string;
|
|
1098
|
+
readonly INVALID_CUBIC_BEZIER: (value: unknown, path: string) => string;
|
|
1099
|
+
readonly INVALID_STROKE_STYLE: (value: unknown, path: string) => string;
|
|
1100
|
+
readonly INVALID_STROKE_LINE_CAP: (value: unknown, path: string) => string;
|
|
1101
|
+
readonly INVALID_BORDER: (value: unknown, path: string) => string;
|
|
1102
|
+
readonly INVALID_SHADOW: (value: unknown, path: string) => string;
|
|
1103
|
+
readonly INVALID_SHADOW_INSET: (value: unknown, path: string) => string;
|
|
1104
|
+
readonly INVALID_TRANSITION: (value: unknown, path: string) => string;
|
|
1105
|
+
readonly INVALID_GRADIENT: (value: unknown, path: string) => string;
|
|
1106
|
+
readonly INVALID_GRADIENT_STOP_POSITION: (value: unknown, path: string) => string;
|
|
1107
|
+
readonly INVALID_TYPOGRAPHY: (value: unknown, path: string) => string;
|
|
1108
|
+
readonly MISSING_REQUIRED_PROPERTY: (prop: string, path: string) => string;
|
|
1109
|
+
readonly INVALID_NUMBER: (value: unknown, path: string) => string;
|
|
1110
|
+
readonly INVALID_ARRAY: (value: unknown, path: string) => string;
|
|
1111
|
+
readonly MISSING_FLUID_CONFIG: (path: string) => string;
|
|
1112
|
+
readonly INVALID_FLUID_DIMENSION: (value: unknown, path: string) => string;
|
|
1113
|
+
readonly INVALID_VIEWPORT_CONFIG: (value: unknown, path: string) => string;
|
|
1114
|
+
readonly MISMATCHED_UNITS: (unit1: unknown, unit2: unknown, path: string) => string;
|
|
1115
|
+
readonly INVALID_FLUID_VALUE_RANGE: (path: string) => string;
|
|
1116
|
+
readonly INVALID_TOKEN_TYPE: (expected: string, received: string, path: string) => string;
|
|
1117
|
+
readonly INVALID_TYPE: (expected: string, value: unknown, path: string) => string;
|
|
1118
|
+
readonly INVALID_ENUM_VALUE: (enumValues: unknown[], value: unknown, path: string) => string;
|
|
1119
|
+
};
|
|
1120
|
+
readonly RESOLVE: {
|
|
1121
|
+
readonly CIRCULAR_REFERENCE: (path: string, ref: string) => string;
|
|
1122
|
+
readonly REFERENCE_NOT_FOUND: (ref: string, path: string) => string;
|
|
1123
|
+
readonly TYPE_MISMATCH: (path: string) => string;
|
|
1124
|
+
};
|
|
1125
|
+
readonly GENERATE: {
|
|
1126
|
+
readonly INVALID_CSS_VALUE: (key: string, value: unknown) => string;
|
|
1127
|
+
readonly INVALID_VARIABLE_NAME: (path: string, name: string) => string;
|
|
1128
|
+
};
|
|
1129
|
+
readonly CONFIG: {
|
|
1130
|
+
readonly INVALID_JSON: (error: string) => string;
|
|
1131
|
+
readonly INVALID_CONFIG: (path: string, message: string) => string;
|
|
1132
|
+
readonly DUPLICATE_FILENAMES: (filename: string, paths: string[]) => string;
|
|
1133
|
+
readonly FILE_NOT_FOUND: (path: string) => string;
|
|
1134
|
+
};
|
|
1135
|
+
readonly UTILITIES: {
|
|
1136
|
+
readonly RESERVED_PREFIX: (prefix: string, tokenType: string) => string;
|
|
1137
|
+
readonly DUPLICATE_CLASS_NAME: (className: string, paths: string[]) => string;
|
|
1138
|
+
readonly INVALID_PROPERTY_MAPPING: (tokenType: string) => string;
|
|
1139
|
+
readonly DUPLICATE_PREFIX: (prefix: string, tokenType: string) => string;
|
|
1140
|
+
readonly MISSING_SOURCE: (property: string) => string;
|
|
1141
|
+
readonly INVALID_SOURCE_PATTERN: (property: string, source: string) => string;
|
|
1142
|
+
readonly INVALID_DIRECTIONS: (property: string) => string;
|
|
1143
|
+
readonly INVALID_CONFIG_OBJECT: "utilitiesConfig must be an object";
|
|
1144
|
+
readonly INVALID_TOKENS_OBJECT: "tokens must be an object";
|
|
1145
|
+
};
|
|
1146
|
+
readonly RESOLVER: {
|
|
1147
|
+
readonly FILE_NOT_FOUND: (path: string) => string;
|
|
1148
|
+
readonly INVALID_JSON: (message: string) => string;
|
|
1149
|
+
readonly INVALID_REFERENCE: (ref: string) => string;
|
|
1150
|
+
readonly INVALID_SOURCE_REFERENCE: (ref: string) => string;
|
|
1151
|
+
readonly UNDEFINED_SET: (name: string) => string;
|
|
1152
|
+
readonly UNDEFINED_MODIFIER: (name: string) => string;
|
|
1153
|
+
readonly CIRCULAR_REFERENCE: (ref: string) => string;
|
|
1154
|
+
readonly EXTERNAL_FILE_NOT_FOUND: (path: string) => string;
|
|
1155
|
+
readonly EXTERNAL_FILE_ERROR: (path: string, message: string) => string;
|
|
1156
|
+
readonly INVALID_JSON_POINTER: (pointer: string, reason: string) => string;
|
|
1157
|
+
readonly DUPLICATE_NAME: (name: string) => string;
|
|
1158
|
+
readonly MODIFIER_NEEDS_CONTEXTS: "Modifier must have at least one context defined.";
|
|
1159
|
+
readonly MODIFIER_SINGLE_CONTEXT: "Modifier has only one context. Consider using a set instead, or add more contexts.";
|
|
1160
|
+
readonly INVALID_DEFAULT: (name: string, contexts: string[]) => string;
|
|
1161
|
+
readonly UNKNOWN_MODIFIER: (name: string) => string;
|
|
1162
|
+
readonly INVALID_CONTEXT: (context: string, modifier: string, valid: string[]) => string;
|
|
1163
|
+
readonly MISSING_REQUIRED_INPUT: (name: string) => string;
|
|
1164
|
+
readonly INVALID_INPUT_TYPE: (name: string) => string;
|
|
1165
|
+
readonly MALFORMED_REFERENCE: (key: string, value: string) => string;
|
|
1166
|
+
readonly RESOLVER_AS_TOKEN_SOURCE: (path: string) => string;
|
|
1167
|
+
};
|
|
1168
|
+
};
|
|
1169
|
+
|
|
1170
|
+
/**
|
|
1171
|
+
* User Config Schema - what users write (minimal, optional fields)
|
|
1172
|
+
* Uses DTCG resolver format exclusively.
|
|
1173
|
+
*/
|
|
1174
|
+
declare const userConfigSchema: z.ZodObject<{
|
|
1175
|
+
resolver: z.ZodOptional<z.ZodString>;
|
|
1176
|
+
transforms: z.ZodOptional<z.ZodObject<{
|
|
1177
|
+
fluid: z.ZodOptional<z.ZodObject<{
|
|
1178
|
+
min: z.ZodNumber;
|
|
1179
|
+
max: z.ZodNumber;
|
|
1180
|
+
}, "strip", z.ZodTypeAny, {
|
|
1181
|
+
min: number;
|
|
1182
|
+
max: number;
|
|
1183
|
+
}, {
|
|
1184
|
+
min: number;
|
|
1185
|
+
max: number;
|
|
1186
|
+
}>>;
|
|
1187
|
+
colorFallbackStrategy: z.ZodOptional<z.ZodEnum<["native", "polyfill"]>>;
|
|
1188
|
+
}, "strip", z.ZodTypeAny, {
|
|
1189
|
+
fluid?: {
|
|
1190
|
+
min: number;
|
|
1191
|
+
max: number;
|
|
1192
|
+
} | undefined;
|
|
1193
|
+
colorFallbackStrategy?: "native" | "polyfill" | undefined;
|
|
1194
|
+
}, {
|
|
1195
|
+
fluid?: {
|
|
1196
|
+
min: number;
|
|
1197
|
+
max: number;
|
|
1198
|
+
} | undefined;
|
|
1199
|
+
colorFallbackStrategy?: "native" | "polyfill" | undefined;
|
|
1200
|
+
}>>;
|
|
1201
|
+
output: z.ZodOptional<z.ZodObject<{
|
|
1202
|
+
css: z.ZodOptional<z.ZodString>;
|
|
1203
|
+
components: z.ZodOptional<z.ZodString>;
|
|
1204
|
+
themeAttribute: z.ZodOptional<z.ZodString>;
|
|
1205
|
+
defaultContext: z.ZodOptional<z.ZodString>;
|
|
1206
|
+
}, "strip", z.ZodTypeAny, {
|
|
1207
|
+
css?: string | undefined;
|
|
1208
|
+
components?: string | undefined;
|
|
1209
|
+
themeAttribute?: string | undefined;
|
|
1210
|
+
defaultContext?: string | undefined;
|
|
1211
|
+
}, {
|
|
1212
|
+
css?: string | undefined;
|
|
1213
|
+
components?: string | undefined;
|
|
1214
|
+
themeAttribute?: string | undefined;
|
|
1215
|
+
defaultContext?: string | undefined;
|
|
1216
|
+
}>>;
|
|
1217
|
+
utilities: z.ZodOptional<z.ZodRecord<z.ZodString, z.ZodUnion<[z.ZodObject<{
|
|
1218
|
+
source: z.ZodString;
|
|
1219
|
+
directions: z.ZodOptional<z.ZodUnion<[z.ZodEnum<["top", "right", "bottom", "left", "x", "y", "full", "all"]>, z.ZodArray<z.ZodEnum<["top", "right", "bottom", "left", "x", "y", "full", "all"]>, "many">]>>;
|
|
1220
|
+
prefix: z.ZodOptional<z.ZodString>;
|
|
1221
|
+
stripDuplicates: z.ZodOptional<z.ZodBoolean>;
|
|
1222
|
+
}, "strip", z.ZodTypeAny, {
|
|
1223
|
+
source: string;
|
|
1224
|
+
directions?: "top" | "right" | "bottom" | "left" | "x" | "y" | "full" | "all" | ("top" | "right" | "bottom" | "left" | "x" | "y" | "full" | "all")[] | undefined;
|
|
1225
|
+
prefix?: string | undefined;
|
|
1226
|
+
stripDuplicates?: boolean | undefined;
|
|
1227
|
+
}, {
|
|
1228
|
+
source: string;
|
|
1229
|
+
directions?: "top" | "right" | "bottom" | "left" | "x" | "y" | "full" | "all" | ("top" | "right" | "bottom" | "left" | "x" | "y" | "full" | "all")[] | undefined;
|
|
1230
|
+
prefix?: string | undefined;
|
|
1231
|
+
stripDuplicates?: boolean | undefined;
|
|
1232
|
+
}>, z.ZodArray<z.ZodObject<{
|
|
1233
|
+
source: z.ZodString;
|
|
1234
|
+
directions: z.ZodOptional<z.ZodUnion<[z.ZodEnum<["top", "right", "bottom", "left", "x", "y", "full", "all"]>, z.ZodArray<z.ZodEnum<["top", "right", "bottom", "left", "x", "y", "full", "all"]>, "many">]>>;
|
|
1235
|
+
prefix: z.ZodOptional<z.ZodString>;
|
|
1236
|
+
stripDuplicates: z.ZodOptional<z.ZodBoolean>;
|
|
1237
|
+
}, "strip", z.ZodTypeAny, {
|
|
1238
|
+
source: string;
|
|
1239
|
+
directions?: "top" | "right" | "bottom" | "left" | "x" | "y" | "full" | "all" | ("top" | "right" | "bottom" | "left" | "x" | "y" | "full" | "all")[] | undefined;
|
|
1240
|
+
prefix?: string | undefined;
|
|
1241
|
+
stripDuplicates?: boolean | undefined;
|
|
1242
|
+
}, {
|
|
1243
|
+
source: string;
|
|
1244
|
+
directions?: "top" | "right" | "bottom" | "left" | "x" | "y" | "full" | "all" | ("top" | "right" | "bottom" | "left" | "x" | "y" | "full" | "all")[] | undefined;
|
|
1245
|
+
prefix?: string | undefined;
|
|
1246
|
+
stripDuplicates?: boolean | undefined;
|
|
1247
|
+
}>, "many">]>>>;
|
|
1248
|
+
}, "strip", z.ZodTypeAny, {
|
|
1249
|
+
resolver?: string | undefined;
|
|
1250
|
+
transforms?: {
|
|
1251
|
+
fluid?: {
|
|
1252
|
+
min: number;
|
|
1253
|
+
max: number;
|
|
1254
|
+
} | undefined;
|
|
1255
|
+
colorFallbackStrategy?: "native" | "polyfill" | undefined;
|
|
1256
|
+
} | undefined;
|
|
1257
|
+
output?: {
|
|
1258
|
+
css?: string | undefined;
|
|
1259
|
+
components?: string | undefined;
|
|
1260
|
+
themeAttribute?: string | undefined;
|
|
1261
|
+
defaultContext?: string | undefined;
|
|
1262
|
+
} | undefined;
|
|
1263
|
+
utilities?: Record<string, {
|
|
1264
|
+
source: string;
|
|
1265
|
+
directions?: "top" | "right" | "bottom" | "left" | "x" | "y" | "full" | "all" | ("top" | "right" | "bottom" | "left" | "x" | "y" | "full" | "all")[] | undefined;
|
|
1266
|
+
prefix?: string | undefined;
|
|
1267
|
+
stripDuplicates?: boolean | undefined;
|
|
1268
|
+
} | {
|
|
1269
|
+
source: string;
|
|
1270
|
+
directions?: "top" | "right" | "bottom" | "left" | "x" | "y" | "full" | "all" | ("top" | "right" | "bottom" | "left" | "x" | "y" | "full" | "all")[] | undefined;
|
|
1271
|
+
prefix?: string | undefined;
|
|
1272
|
+
stripDuplicates?: boolean | undefined;
|
|
1273
|
+
}[]> | undefined;
|
|
1274
|
+
}, {
|
|
1275
|
+
resolver?: string | undefined;
|
|
1276
|
+
transforms?: {
|
|
1277
|
+
fluid?: {
|
|
1278
|
+
min: number;
|
|
1279
|
+
max: number;
|
|
1280
|
+
} | undefined;
|
|
1281
|
+
colorFallbackStrategy?: "native" | "polyfill" | undefined;
|
|
1282
|
+
} | undefined;
|
|
1283
|
+
output?: {
|
|
1284
|
+
css?: string | undefined;
|
|
1285
|
+
components?: string | undefined;
|
|
1286
|
+
themeAttribute?: string | undefined;
|
|
1287
|
+
defaultContext?: string | undefined;
|
|
1288
|
+
} | undefined;
|
|
1289
|
+
utilities?: Record<string, {
|
|
1290
|
+
source: string;
|
|
1291
|
+
directions?: "top" | "right" | "bottom" | "left" | "x" | "y" | "full" | "all" | ("top" | "right" | "bottom" | "left" | "x" | "y" | "full" | "all")[] | undefined;
|
|
1292
|
+
prefix?: string | undefined;
|
|
1293
|
+
stripDuplicates?: boolean | undefined;
|
|
1294
|
+
} | {
|
|
1295
|
+
source: string;
|
|
1296
|
+
directions?: "top" | "right" | "bottom" | "left" | "x" | "y" | "full" | "all" | ("top" | "right" | "bottom" | "left" | "x" | "y" | "full" | "all")[] | undefined;
|
|
1297
|
+
prefix?: string | undefined;
|
|
1298
|
+
stripDuplicates?: boolean | undefined;
|
|
1299
|
+
}[]> | undefined;
|
|
1300
|
+
}>;
|
|
1301
|
+
/**
|
|
1302
|
+
* Internal Config Schema - what code uses (complete, required fields)
|
|
1303
|
+
*/
|
|
1304
|
+
declare const internalConfigSchema: z.ZodObject<{
|
|
1305
|
+
resolver: z.ZodOptional<z.ZodString>;
|
|
1306
|
+
transforms: z.ZodObject<{
|
|
1307
|
+
fluid: z.ZodObject<{
|
|
1308
|
+
min: z.ZodNumber;
|
|
1309
|
+
max: z.ZodNumber;
|
|
1310
|
+
}, "strip", z.ZodTypeAny, {
|
|
1311
|
+
min: number;
|
|
1312
|
+
max: number;
|
|
1313
|
+
}, {
|
|
1314
|
+
min: number;
|
|
1315
|
+
max: number;
|
|
1316
|
+
}>;
|
|
1317
|
+
colorFallbackStrategy: z.ZodEnum<["native", "polyfill"]>;
|
|
1318
|
+
}, "strip", z.ZodTypeAny, {
|
|
1319
|
+
fluid: {
|
|
1320
|
+
min: number;
|
|
1321
|
+
max: number;
|
|
1322
|
+
};
|
|
1323
|
+
colorFallbackStrategy: "native" | "polyfill";
|
|
1324
|
+
}, {
|
|
1325
|
+
fluid: {
|
|
1326
|
+
min: number;
|
|
1327
|
+
max: number;
|
|
1328
|
+
};
|
|
1329
|
+
colorFallbackStrategy: "native" | "polyfill";
|
|
1330
|
+
}>;
|
|
1331
|
+
output: z.ZodObject<{
|
|
1332
|
+
css: z.ZodString;
|
|
1333
|
+
components: z.ZodOptional<z.ZodString>;
|
|
1334
|
+
themeAttribute: z.ZodString;
|
|
1335
|
+
defaultContext: z.ZodOptional<z.ZodString>;
|
|
1336
|
+
}, "strip", z.ZodTypeAny, {
|
|
1337
|
+
css: string;
|
|
1338
|
+
themeAttribute: string;
|
|
1339
|
+
components?: string | undefined;
|
|
1340
|
+
defaultContext?: string | undefined;
|
|
1341
|
+
}, {
|
|
1342
|
+
css: string;
|
|
1343
|
+
themeAttribute: string;
|
|
1344
|
+
components?: string | undefined;
|
|
1345
|
+
defaultContext?: string | undefined;
|
|
1346
|
+
}>;
|
|
1347
|
+
utilities: z.ZodOptional<z.ZodRecord<z.ZodString, z.ZodUnion<[z.ZodObject<{
|
|
1348
|
+
source: z.ZodString;
|
|
1349
|
+
directions: z.ZodOptional<z.ZodUnion<[z.ZodEnum<["top", "right", "bottom", "left", "x", "y", "full", "all"]>, z.ZodArray<z.ZodEnum<["top", "right", "bottom", "left", "x", "y", "full", "all"]>, "many">]>>;
|
|
1350
|
+
prefix: z.ZodOptional<z.ZodString>;
|
|
1351
|
+
stripDuplicates: z.ZodOptional<z.ZodBoolean>;
|
|
1352
|
+
}, "strip", z.ZodTypeAny, {
|
|
1353
|
+
source: string;
|
|
1354
|
+
directions?: "top" | "right" | "bottom" | "left" | "x" | "y" | "full" | "all" | ("top" | "right" | "bottom" | "left" | "x" | "y" | "full" | "all")[] | undefined;
|
|
1355
|
+
prefix?: string | undefined;
|
|
1356
|
+
stripDuplicates?: boolean | undefined;
|
|
1357
|
+
}, {
|
|
1358
|
+
source: string;
|
|
1359
|
+
directions?: "top" | "right" | "bottom" | "left" | "x" | "y" | "full" | "all" | ("top" | "right" | "bottom" | "left" | "x" | "y" | "full" | "all")[] | undefined;
|
|
1360
|
+
prefix?: string | undefined;
|
|
1361
|
+
stripDuplicates?: boolean | undefined;
|
|
1362
|
+
}>, z.ZodArray<z.ZodObject<{
|
|
1363
|
+
source: z.ZodString;
|
|
1364
|
+
directions: z.ZodOptional<z.ZodUnion<[z.ZodEnum<["top", "right", "bottom", "left", "x", "y", "full", "all"]>, z.ZodArray<z.ZodEnum<["top", "right", "bottom", "left", "x", "y", "full", "all"]>, "many">]>>;
|
|
1365
|
+
prefix: z.ZodOptional<z.ZodString>;
|
|
1366
|
+
stripDuplicates: z.ZodOptional<z.ZodBoolean>;
|
|
1367
|
+
}, "strip", z.ZodTypeAny, {
|
|
1368
|
+
source: string;
|
|
1369
|
+
directions?: "top" | "right" | "bottom" | "left" | "x" | "y" | "full" | "all" | ("top" | "right" | "bottom" | "left" | "x" | "y" | "full" | "all")[] | undefined;
|
|
1370
|
+
prefix?: string | undefined;
|
|
1371
|
+
stripDuplicates?: boolean | undefined;
|
|
1372
|
+
}, {
|
|
1373
|
+
source: string;
|
|
1374
|
+
directions?: "top" | "right" | "bottom" | "left" | "x" | "y" | "full" | "all" | ("top" | "right" | "bottom" | "left" | "x" | "y" | "full" | "all")[] | undefined;
|
|
1375
|
+
prefix?: string | undefined;
|
|
1376
|
+
stripDuplicates?: boolean | undefined;
|
|
1377
|
+
}>, "many">]>>>;
|
|
1378
|
+
}, "strip", z.ZodTypeAny, {
|
|
1379
|
+
output: {
|
|
1380
|
+
css: string;
|
|
1381
|
+
themeAttribute: string;
|
|
1382
|
+
components?: string | undefined;
|
|
1383
|
+
defaultContext?: string | undefined;
|
|
1384
|
+
};
|
|
1385
|
+
transforms: {
|
|
1386
|
+
fluid: {
|
|
1387
|
+
min: number;
|
|
1388
|
+
max: number;
|
|
1389
|
+
};
|
|
1390
|
+
colorFallbackStrategy: "native" | "polyfill";
|
|
1391
|
+
};
|
|
1392
|
+
resolver?: string | undefined;
|
|
1393
|
+
utilities?: Record<string, {
|
|
1394
|
+
source: string;
|
|
1395
|
+
directions?: "top" | "right" | "bottom" | "left" | "x" | "y" | "full" | "all" | ("top" | "right" | "bottom" | "left" | "x" | "y" | "full" | "all")[] | undefined;
|
|
1396
|
+
prefix?: string | undefined;
|
|
1397
|
+
stripDuplicates?: boolean | undefined;
|
|
1398
|
+
} | {
|
|
1399
|
+
source: string;
|
|
1400
|
+
directions?: "top" | "right" | "bottom" | "left" | "x" | "y" | "full" | "all" | ("top" | "right" | "bottom" | "left" | "x" | "y" | "full" | "all")[] | undefined;
|
|
1401
|
+
prefix?: string | undefined;
|
|
1402
|
+
stripDuplicates?: boolean | undefined;
|
|
1403
|
+
}[]> | undefined;
|
|
1404
|
+
}, {
|
|
1405
|
+
output: {
|
|
1406
|
+
css: string;
|
|
1407
|
+
themeAttribute: string;
|
|
1408
|
+
components?: string | undefined;
|
|
1409
|
+
defaultContext?: string | undefined;
|
|
1410
|
+
};
|
|
1411
|
+
transforms: {
|
|
1412
|
+
fluid: {
|
|
1413
|
+
min: number;
|
|
1414
|
+
max: number;
|
|
1415
|
+
};
|
|
1416
|
+
colorFallbackStrategy: "native" | "polyfill";
|
|
1417
|
+
};
|
|
1418
|
+
resolver?: string | undefined;
|
|
1419
|
+
utilities?: Record<string, {
|
|
1420
|
+
source: string;
|
|
1421
|
+
directions?: "top" | "right" | "bottom" | "left" | "x" | "y" | "full" | "all" | ("top" | "right" | "bottom" | "left" | "x" | "y" | "full" | "all")[] | undefined;
|
|
1422
|
+
prefix?: string | undefined;
|
|
1423
|
+
stripDuplicates?: boolean | undefined;
|
|
1424
|
+
} | {
|
|
1425
|
+
source: string;
|
|
1426
|
+
directions?: "top" | "right" | "bottom" | "left" | "x" | "y" | "full" | "all" | ("top" | "right" | "bottom" | "left" | "x" | "y" | "full" | "all")[] | undefined;
|
|
1427
|
+
prefix?: string | undefined;
|
|
1428
|
+
stripDuplicates?: boolean | undefined;
|
|
1429
|
+
}[]> | undefined;
|
|
1430
|
+
}>;
|
|
227
1431
|
|
|
228
|
-
declare function
|
|
1432
|
+
declare function isResolvedToken(token: unknown): token is ResolvedToken;
|
|
1433
|
+
declare function isResolvedTokenOfType<T extends TokenType>(token: unknown, type: T): token is ResolvedToken<T>;
|
|
229
1434
|
|
|
230
|
-
export { type
|
|
1435
|
+
export { type ArbitraryUtilityValue, type CSSFileOutput, type Candidate, DEFAULT_COLLECTION, DEFAULT_CONFIG, DEFAULT_CONTEXT, DEFAULT_DESIGN_TOKENS_PATH, DEFAULT_STYLES_PATH, DEFAULT_UTILITIES_FILENAME, DEFAULT_VARIABLES_FILENAME, ErrorMessages, type FunctionalCandidate, type FunctionalVariant, GLOBAL_DIR, Instrumentation, type InternalConfig, type LoadAndResolveResult, type LoadedConfig, type ModifierMeta, type NamedUtilityValue, type NormalizeResult, type NormalizedConvertedTokens, type NormalizedTokens, type OutputConfig, type ModifierMeta$1 as PipelineModifierMeta, type PipelineResult, type ResolvedToken, type ResolvedTokens, type ResolverLoadResult, SUGARCUBE_CONFIG_FILE, SUGARCUBE_FILE, type StaticCandidate, type StaticUtilityPattern, type StaticVariant, type TokenPipelineSource, type TokenTree, UTILITIES_DIR, type UserConfig, type UserOutputConfig, type UtilitiesConfig, type UtilityValue, VARIABLES_FILE_SUFFIX, type Variant, configFileExists, convertConfigToUnoRules, discoverAllFiles, fillDefaults, findConfigFile, generateCSSVariables, generateIndex, generateIndexContent, internalConfigSchema, isResolvedToken, isResolvedTokenOfType, loadAndResolveTokens, loadFromResolver, loadInternalConfig, loadTSConfig, loadUserConfig, parseAndValidateConfig, processAndConvertTokens, shouldRegenerateIndex, userConfigSchema, validateConfig, validateInternalConfig, validateUserConfig, writeCSSUtilitiesToDisk, writeCSSVariablesToDisk };
|