@loworbitstudio/visor-theme-engine 0.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/adapters/index.d.ts +150 -0
- package/dist/adapters/index.js +537 -0
- package/dist/chunk-ZLXFCNYF.js +1399 -0
- package/dist/fowt.d.ts +37 -0
- package/dist/fowt.js +23 -0
- package/dist/index.d.ts +799 -0
- package/dist/index.js +2414 -0
- package/dist/types-r7ae3WP2.d.ts +314 -0
- package/package.json +62 -0
- package/src/visor-theme.schema.json +282 -0
package/dist/index.d.ts
ADDED
|
@@ -0,0 +1,799 @@
|
|
|
1
|
+
import { F as FontResolveOptions, a as FontResolution, V as VisorTypography, b as FontDisplayStrategy, T as ThemeFontResult, G as GoogleFontEntry, R as ResolvedThemeConfig, c as GeneratedPrimitives, d as ThemeOutput, e as ThemeData, f as VisorThemeConfig, g as FullShadeScale, C as ColorRole, S as SelectiveShadeScale, h as RGB, P as ParsedColor, O as OKLCH, i as SemanticTokens, j as ShadeStep } from './types-r7ae3WP2.js';
|
|
2
|
+
export { k as ColorFormat, l as FontSource, m as RGBA, n as SemanticTokenValue } from './types-r7ae3WP2.js';
|
|
3
|
+
|
|
4
|
+
/**
|
|
5
|
+
* Font resolver — maps font family names to loadable font resources.
|
|
6
|
+
*
|
|
7
|
+
* For Google Fonts: constructs the CSS URL deterministically.
|
|
8
|
+
* For custom/commercial fonts: flags them with setup guidance.
|
|
9
|
+
*/
|
|
10
|
+
|
|
11
|
+
/**
|
|
12
|
+
* Build a Visor Fonts CDN URL for a specific font file.
|
|
13
|
+
*
|
|
14
|
+
* URL pattern: https://fonts.visor.design/{org}/{family-slug}/{filename}.woff2
|
|
15
|
+
* Family slug: lowercase family name, spaces to hyphens.
|
|
16
|
+
* Filename: original uploaded name (e.g., PPModelPlastic-Regular).
|
|
17
|
+
*/
|
|
18
|
+
declare const VISOR_FONTS_CDN = "https://fonts.visor.design";
|
|
19
|
+
declare function buildVisorFontUrl(org: string, family: string, weight: number): string;
|
|
20
|
+
/**
|
|
21
|
+
* Resolve a font family name to a FontResolution.
|
|
22
|
+
*
|
|
23
|
+
* Resolution order:
|
|
24
|
+
* 1. If source is explicitly "visor-fonts", build CDN URLs (requires org)
|
|
25
|
+
* 2. If source is explicitly "local", return local guidance
|
|
26
|
+
* 3. Otherwise, look up in Google Fonts catalog
|
|
27
|
+
* 4. If not found in catalog, fall back to local
|
|
28
|
+
*/
|
|
29
|
+
declare function resolveFont(family: string, options?: FontResolveOptions): FontResolution;
|
|
30
|
+
|
|
31
|
+
/**
|
|
32
|
+
* Preload hint generation for font loading performance.
|
|
33
|
+
*
|
|
34
|
+
* Generates <link> tags for preconnecting to Google Fonts
|
|
35
|
+
* and preloading critical font files.
|
|
36
|
+
*/
|
|
37
|
+
|
|
38
|
+
/**
|
|
39
|
+
* Generate preconnect and preload link tags for resolved fonts.
|
|
40
|
+
*
|
|
41
|
+
* For Google Fonts:
|
|
42
|
+
* - <link rel="preconnect"> to fonts.googleapis.com
|
|
43
|
+
* - <link rel="preconnect" crossorigin> to fonts.gstatic.com
|
|
44
|
+
* - <link rel="preload" as="style"> for the CSS URL
|
|
45
|
+
*
|
|
46
|
+
* For custom fonts with provided file paths:
|
|
47
|
+
* - <link rel="preload" as="font" type="font/woff2" crossorigin> per file
|
|
48
|
+
*/
|
|
49
|
+
declare function generatePreloadLinks(resolutions: FontResolution[], customFontPaths?: Map<string, string[]>): string[];
|
|
50
|
+
/**
|
|
51
|
+
* Generate the stylesheet link tags for Google Fonts (non-preload).
|
|
52
|
+
* These are the actual <link rel="stylesheet"> tags that load the fonts.
|
|
53
|
+
*/
|
|
54
|
+
declare function generateStylesheetLinks(resolutions: FontResolution[]): string[];
|
|
55
|
+
|
|
56
|
+
/**
|
|
57
|
+
* Theme font pipeline — connects font resolution to the .visor.yaml import flow.
|
|
58
|
+
*
|
|
59
|
+
* Takes the typography section from a .visor.yaml file and produces:
|
|
60
|
+
* - Resolved font resources (Google Fonts URLs or custom flags)
|
|
61
|
+
* - Preload/preconnect link tags
|
|
62
|
+
* - CSS output (@font-face stubs, custom property overrides)
|
|
63
|
+
* - Warnings for fonts needing manual setup
|
|
64
|
+
*/
|
|
65
|
+
|
|
66
|
+
/**
|
|
67
|
+
* Resolve all fonts for a theme's typography configuration.
|
|
68
|
+
*
|
|
69
|
+
* This is the main entry point for the font pipeline — called during
|
|
70
|
+
* .visor.yaml import to process the typography section.
|
|
71
|
+
*/
|
|
72
|
+
declare function resolveThemeFonts(typography: VisorTypography, options?: {
|
|
73
|
+
display?: FontDisplayStrategy;
|
|
74
|
+
}): ThemeFontResult;
|
|
75
|
+
|
|
76
|
+
/**
|
|
77
|
+
* Google Fonts Catalog
|
|
78
|
+
*
|
|
79
|
+
* Curated set of popular Google Fonts families.
|
|
80
|
+
* Run `npm run update-catalog` to regenerate from the full API.
|
|
81
|
+
*
|
|
82
|
+
* Source: Google Fonts API (sorted by popularity)
|
|
83
|
+
*/
|
|
84
|
+
|
|
85
|
+
declare const googleFontsCatalog: GoogleFontEntry[];
|
|
86
|
+
/** Look up a font family in the Google Fonts catalog (case-insensitive) */
|
|
87
|
+
declare function lookupGoogleFont(family: string): GoogleFontEntry | undefined;
|
|
88
|
+
|
|
89
|
+
/**
|
|
90
|
+
* Import Pipeline
|
|
91
|
+
*
|
|
92
|
+
* Main public API that orchestrates all 4 stages:
|
|
93
|
+
* 1. Shade Generation (Primitives)
|
|
94
|
+
* 2. Semantic Assignment
|
|
95
|
+
* 3. Adaptive Assembly (CSS)
|
|
96
|
+
* 4. Override Application
|
|
97
|
+
*/
|
|
98
|
+
|
|
99
|
+
/**
|
|
100
|
+
* Generate all shade scales from a resolved config.
|
|
101
|
+
* If neutral is null, uses Tailwind Gray verbatim.
|
|
102
|
+
*/
|
|
103
|
+
declare function generatePrimitives(config: ResolvedThemeConfig): GeneratedPrimitives;
|
|
104
|
+
/**
|
|
105
|
+
* Parse a YAML string into a VisorThemeConfig.
|
|
106
|
+
* Validates the structure before returning.
|
|
107
|
+
*/
|
|
108
|
+
declare function parseConfig(yamlString: string): VisorThemeConfig;
|
|
109
|
+
/**
|
|
110
|
+
* Generate a complete theme from a .visor.yaml string.
|
|
111
|
+
* Parses YAML, validates, and runs all 4 pipeline stages.
|
|
112
|
+
*/
|
|
113
|
+
declare function generateTheme(yamlString: string): ThemeOutput;
|
|
114
|
+
/**
|
|
115
|
+
* Generate a complete theme from a pre-parsed config object.
|
|
116
|
+
* Skips YAML parsing — for browser consumers or programmatic use.
|
|
117
|
+
*/
|
|
118
|
+
declare function generateThemeFromConfig(config: VisorThemeConfig): ThemeOutput;
|
|
119
|
+
/**
|
|
120
|
+
* Generate theme data including intermediate artifacts from a .visor.yaml string.
|
|
121
|
+
* Returns config, primitives, tokens, and CSS output — used by adapters.
|
|
122
|
+
*/
|
|
123
|
+
declare function generateThemeData(yamlString: string): ThemeData;
|
|
124
|
+
/**
|
|
125
|
+
* Generate theme data including intermediate artifacts from a pre-parsed config.
|
|
126
|
+
* Returns config, primitives, tokens, and CSS output — used by adapters.
|
|
127
|
+
*/
|
|
128
|
+
declare function generateThemeDataFromConfig(config: VisorThemeConfig): ThemeData;
|
|
129
|
+
|
|
130
|
+
/**
|
|
131
|
+
* Export Pipeline
|
|
132
|
+
*
|
|
133
|
+
* Reverses the import pipeline: given theme data, produces a minimal .visor.yaml string.
|
|
134
|
+
* Only includes values that differ from defaults.
|
|
135
|
+
*/
|
|
136
|
+
|
|
137
|
+
/**
|
|
138
|
+
* Export a theme to a minimal .visor.yaml string.
|
|
139
|
+
* Omits values that match defaults to keep output minimal.
|
|
140
|
+
*/
|
|
141
|
+
declare function exportTheme(primitives: GeneratedPrimitives, config: ResolvedThemeConfig): string;
|
|
142
|
+
|
|
143
|
+
var $schema = "https://json-schema.org/draft/2020-12/schema";
|
|
144
|
+
var $id = "https://visor.loworbit.studio/schemas/visor-theme.schema.json";
|
|
145
|
+
var title = "Visor Theme";
|
|
146
|
+
var description = "Schema for .visor.yaml theme files — portable visual identity definitions for the Visor design system.";
|
|
147
|
+
var type = "object";
|
|
148
|
+
var required = [
|
|
149
|
+
"name",
|
|
150
|
+
"version",
|
|
151
|
+
"colors"
|
|
152
|
+
];
|
|
153
|
+
var additionalProperties = false;
|
|
154
|
+
var properties = {
|
|
155
|
+
name: {
|
|
156
|
+
type: "string",
|
|
157
|
+
minLength: 1,
|
|
158
|
+
description: "Human-readable theme name."
|
|
159
|
+
},
|
|
160
|
+
version: {
|
|
161
|
+
"const": 1,
|
|
162
|
+
description: "Schema version. Currently always 1."
|
|
163
|
+
},
|
|
164
|
+
group: {
|
|
165
|
+
type: "string",
|
|
166
|
+
description: "Theme group for the docs site theme switcher (e.g. 'Visor', 'Client', 'Low Orbit'). Used by `visor theme sync`. Defaults to folder-based grouping when omitted."
|
|
167
|
+
},
|
|
168
|
+
colors: {
|
|
169
|
+
type: "object",
|
|
170
|
+
description: "Color definitions for light mode. Only primary is required — all others have sensible defaults.",
|
|
171
|
+
required: [
|
|
172
|
+
"primary"
|
|
173
|
+
],
|
|
174
|
+
additionalProperties: false,
|
|
175
|
+
properties: {
|
|
176
|
+
primary: {
|
|
177
|
+
$ref: "#/$defs/cssColor",
|
|
178
|
+
description: "Brand color. Drives interactive-*, accent-*, text-link, border-focus tokens. Anchored at shade 600."
|
|
179
|
+
},
|
|
180
|
+
accent: {
|
|
181
|
+
$ref: "#/$defs/cssColor",
|
|
182
|
+
description: "Secondary brand color. Defaults to primary if omitted."
|
|
183
|
+
},
|
|
184
|
+
neutral: {
|
|
185
|
+
$ref: "#/$defs/cssColor",
|
|
186
|
+
description: "Base neutral color for generating the gray scale (50-950). Defaults to Tailwind Gray if omitted."
|
|
187
|
+
},
|
|
188
|
+
background: {
|
|
189
|
+
$ref: "#/$defs/cssColor",
|
|
190
|
+
description: "Page background for light mode. Default: #FFFFFF."
|
|
191
|
+
},
|
|
192
|
+
surface: {
|
|
193
|
+
$ref: "#/$defs/cssColor",
|
|
194
|
+
description: "Card/panel background for light mode. Default: #FFFFFF."
|
|
195
|
+
},
|
|
196
|
+
success: {
|
|
197
|
+
$ref: "#/$defs/cssColor",
|
|
198
|
+
description: "Success status color. Default: #22C55E (Tailwind green-500)."
|
|
199
|
+
},
|
|
200
|
+
warning: {
|
|
201
|
+
$ref: "#/$defs/cssColor",
|
|
202
|
+
description: "Warning status color. Default: #F59E0B (Tailwind amber-500)."
|
|
203
|
+
},
|
|
204
|
+
error: {
|
|
205
|
+
$ref: "#/$defs/cssColor",
|
|
206
|
+
description: "Error status color. Default: #EF4444 (Tailwind red-500)."
|
|
207
|
+
},
|
|
208
|
+
info: {
|
|
209
|
+
$ref: "#/$defs/cssColor",
|
|
210
|
+
description: "Info status color. Default: #0EA5E9 (Tailwind sky-500)."
|
|
211
|
+
}
|
|
212
|
+
}
|
|
213
|
+
},
|
|
214
|
+
"colors-dark": {
|
|
215
|
+
type: "object",
|
|
216
|
+
description: "Dark mode color overrides. Any key from colors can be overridden. Omitted keys inherit from the derived dark mode values (not from light mode).",
|
|
217
|
+
additionalProperties: false,
|
|
218
|
+
properties: {
|
|
219
|
+
primary: {
|
|
220
|
+
$ref: "#/$defs/cssColor"
|
|
221
|
+
},
|
|
222
|
+
accent: {
|
|
223
|
+
$ref: "#/$defs/cssColor"
|
|
224
|
+
},
|
|
225
|
+
neutral: {
|
|
226
|
+
$ref: "#/$defs/cssColor"
|
|
227
|
+
},
|
|
228
|
+
background: {
|
|
229
|
+
$ref: "#/$defs/cssColor"
|
|
230
|
+
},
|
|
231
|
+
surface: {
|
|
232
|
+
$ref: "#/$defs/cssColor"
|
|
233
|
+
},
|
|
234
|
+
success: {
|
|
235
|
+
$ref: "#/$defs/cssColor"
|
|
236
|
+
},
|
|
237
|
+
warning: {
|
|
238
|
+
$ref: "#/$defs/cssColor"
|
|
239
|
+
},
|
|
240
|
+
error: {
|
|
241
|
+
$ref: "#/$defs/cssColor"
|
|
242
|
+
},
|
|
243
|
+
info: {
|
|
244
|
+
$ref: "#/$defs/cssColor"
|
|
245
|
+
}
|
|
246
|
+
}
|
|
247
|
+
},
|
|
248
|
+
typography: {
|
|
249
|
+
type: "object",
|
|
250
|
+
description: "Typography configuration. Defaults to system font stacks if omitted.",
|
|
251
|
+
additionalProperties: false,
|
|
252
|
+
properties: {
|
|
253
|
+
heading: {
|
|
254
|
+
type: "object",
|
|
255
|
+
additionalProperties: false,
|
|
256
|
+
properties: {
|
|
257
|
+
family: {
|
|
258
|
+
type: "string",
|
|
259
|
+
description: "Google Fonts family name or CSS font stack."
|
|
260
|
+
},
|
|
261
|
+
weight: {
|
|
262
|
+
type: "integer",
|
|
263
|
+
minimum: 100,
|
|
264
|
+
maximum: 900,
|
|
265
|
+
description: "Font weight for headings. Default: 600."
|
|
266
|
+
},
|
|
267
|
+
source: {
|
|
268
|
+
type: "string",
|
|
269
|
+
"enum": [
|
|
270
|
+
"google-fonts",
|
|
271
|
+
"visor-fonts",
|
|
272
|
+
"local"
|
|
273
|
+
],
|
|
274
|
+
description: "Font source. Defaults to Google Fonts lookup, then local."
|
|
275
|
+
},
|
|
276
|
+
org: {
|
|
277
|
+
type: "string",
|
|
278
|
+
description: "Organization namespace for visor-fonts CDN (required when source is visor-fonts)."
|
|
279
|
+
}
|
|
280
|
+
}
|
|
281
|
+
},
|
|
282
|
+
display: {
|
|
283
|
+
type: "object",
|
|
284
|
+
description: "Display/decorative font for hero text and splash screens. Falls back to heading font if omitted.",
|
|
285
|
+
additionalProperties: false,
|
|
286
|
+
properties: {
|
|
287
|
+
family: {
|
|
288
|
+
type: "string",
|
|
289
|
+
description: "Google Fonts family name or CSS font stack."
|
|
290
|
+
},
|
|
291
|
+
weight: {
|
|
292
|
+
type: "integer",
|
|
293
|
+
minimum: 100,
|
|
294
|
+
maximum: 900,
|
|
295
|
+
description: "Font weight for display text. Default: 400."
|
|
296
|
+
},
|
|
297
|
+
source: {
|
|
298
|
+
type: "string",
|
|
299
|
+
"enum": [
|
|
300
|
+
"google-fonts",
|
|
301
|
+
"visor-fonts",
|
|
302
|
+
"local"
|
|
303
|
+
],
|
|
304
|
+
description: "Font source. Defaults to Google Fonts lookup, then local."
|
|
305
|
+
},
|
|
306
|
+
org: {
|
|
307
|
+
type: "string",
|
|
308
|
+
description: "Organization namespace for visor-fonts CDN (required when source is visor-fonts)."
|
|
309
|
+
}
|
|
310
|
+
}
|
|
311
|
+
},
|
|
312
|
+
body: {
|
|
313
|
+
type: "object",
|
|
314
|
+
additionalProperties: false,
|
|
315
|
+
properties: {
|
|
316
|
+
family: {
|
|
317
|
+
type: "string",
|
|
318
|
+
description: "Google Fonts family name or CSS font stack."
|
|
319
|
+
},
|
|
320
|
+
weight: {
|
|
321
|
+
type: "integer",
|
|
322
|
+
minimum: 100,
|
|
323
|
+
maximum: 900,
|
|
324
|
+
description: "Font weight for body text. Default: 400."
|
|
325
|
+
},
|
|
326
|
+
source: {
|
|
327
|
+
type: "string",
|
|
328
|
+
"enum": [
|
|
329
|
+
"google-fonts",
|
|
330
|
+
"visor-fonts",
|
|
331
|
+
"local"
|
|
332
|
+
],
|
|
333
|
+
description: "Font source. Defaults to Google Fonts lookup, then local."
|
|
334
|
+
},
|
|
335
|
+
org: {
|
|
336
|
+
type: "string",
|
|
337
|
+
description: "Organization namespace for visor-fonts CDN (required when source is visor-fonts)."
|
|
338
|
+
}
|
|
339
|
+
}
|
|
340
|
+
},
|
|
341
|
+
mono: {
|
|
342
|
+
type: "object",
|
|
343
|
+
additionalProperties: false,
|
|
344
|
+
properties: {
|
|
345
|
+
family: {
|
|
346
|
+
type: "string",
|
|
347
|
+
description: "Google Fonts family name or CSS font stack for monospace."
|
|
348
|
+
}
|
|
349
|
+
}
|
|
350
|
+
},
|
|
351
|
+
scale: {
|
|
352
|
+
type: "number",
|
|
353
|
+
description: "Type scale multiplier applied to the font-size ramp. Default: 1."
|
|
354
|
+
},
|
|
355
|
+
"letter-spacing": {
|
|
356
|
+
type: "object",
|
|
357
|
+
description: "Letter spacing scale.",
|
|
358
|
+
additionalProperties: false,
|
|
359
|
+
properties: {
|
|
360
|
+
tight: {
|
|
361
|
+
type: "string"
|
|
362
|
+
},
|
|
363
|
+
normal: {
|
|
364
|
+
type: "string"
|
|
365
|
+
},
|
|
366
|
+
wide: {
|
|
367
|
+
type: "string"
|
|
368
|
+
}
|
|
369
|
+
}
|
|
370
|
+
}
|
|
371
|
+
}
|
|
372
|
+
},
|
|
373
|
+
spacing: {
|
|
374
|
+
type: "object",
|
|
375
|
+
description: "Spacing configuration.",
|
|
376
|
+
additionalProperties: false,
|
|
377
|
+
properties: {
|
|
378
|
+
base: {
|
|
379
|
+
type: "number",
|
|
380
|
+
minimum: 1,
|
|
381
|
+
description: "Base spacing unit in pixels. Default: 4. Generates the full spacing scale."
|
|
382
|
+
}
|
|
383
|
+
}
|
|
384
|
+
},
|
|
385
|
+
radius: {
|
|
386
|
+
type: "object",
|
|
387
|
+
description: "Border radius scale in pixels.",
|
|
388
|
+
additionalProperties: false,
|
|
389
|
+
properties: {
|
|
390
|
+
sm: {
|
|
391
|
+
type: "number",
|
|
392
|
+
minimum: 0
|
|
393
|
+
},
|
|
394
|
+
md: {
|
|
395
|
+
type: "number",
|
|
396
|
+
minimum: 0
|
|
397
|
+
},
|
|
398
|
+
lg: {
|
|
399
|
+
type: "number",
|
|
400
|
+
minimum: 0
|
|
401
|
+
},
|
|
402
|
+
xl: {
|
|
403
|
+
type: "number",
|
|
404
|
+
minimum: 0
|
|
405
|
+
},
|
|
406
|
+
pill: {
|
|
407
|
+
type: "number",
|
|
408
|
+
minimum: 0,
|
|
409
|
+
description: "Default: 9999."
|
|
410
|
+
}
|
|
411
|
+
}
|
|
412
|
+
},
|
|
413
|
+
shadows: {
|
|
414
|
+
type: "object",
|
|
415
|
+
description: "Named shadow definitions as CSS box-shadow values.",
|
|
416
|
+
additionalProperties: false,
|
|
417
|
+
properties: {
|
|
418
|
+
xs: {
|
|
419
|
+
type: "string"
|
|
420
|
+
},
|
|
421
|
+
sm: {
|
|
422
|
+
type: "string"
|
|
423
|
+
},
|
|
424
|
+
md: {
|
|
425
|
+
type: "string"
|
|
426
|
+
},
|
|
427
|
+
lg: {
|
|
428
|
+
type: "string"
|
|
429
|
+
},
|
|
430
|
+
xl: {
|
|
431
|
+
type: "string"
|
|
432
|
+
}
|
|
433
|
+
}
|
|
434
|
+
},
|
|
435
|
+
motion: {
|
|
436
|
+
type: "object",
|
|
437
|
+
description: "Motion/animation configuration.",
|
|
438
|
+
additionalProperties: false,
|
|
439
|
+
properties: {
|
|
440
|
+
"duration-fast": {
|
|
441
|
+
type: "string",
|
|
442
|
+
pattern: "^\\d+ms$",
|
|
443
|
+
description: "Fast duration for micro-interactions. Default: 100ms."
|
|
444
|
+
},
|
|
445
|
+
"duration-normal": {
|
|
446
|
+
type: "string",
|
|
447
|
+
pattern: "^\\d+ms$",
|
|
448
|
+
description: "Normal duration for standard transitions. Default: 200ms."
|
|
449
|
+
},
|
|
450
|
+
"duration-slow": {
|
|
451
|
+
type: "string",
|
|
452
|
+
pattern: "^\\d+ms$",
|
|
453
|
+
description: "Slow duration for larger animations. Default: 500ms."
|
|
454
|
+
},
|
|
455
|
+
easing: {
|
|
456
|
+
type: "string",
|
|
457
|
+
description: "Default easing curve as a CSS timing function."
|
|
458
|
+
}
|
|
459
|
+
}
|
|
460
|
+
},
|
|
461
|
+
overrides: {
|
|
462
|
+
type: "object",
|
|
463
|
+
description: "Per-token escape hatch. Values replace derived tokens. Use CSS custom property names without the -- prefix as keys.",
|
|
464
|
+
additionalProperties: false,
|
|
465
|
+
properties: {
|
|
466
|
+
light: {
|
|
467
|
+
type: "object",
|
|
468
|
+
description: "Token overrides applied in light mode.",
|
|
469
|
+
additionalProperties: {
|
|
470
|
+
type: "string"
|
|
471
|
+
}
|
|
472
|
+
},
|
|
473
|
+
dark: {
|
|
474
|
+
type: "object",
|
|
475
|
+
description: "Token overrides applied in dark mode.",
|
|
476
|
+
additionalProperties: {
|
|
477
|
+
type: "string"
|
|
478
|
+
}
|
|
479
|
+
}
|
|
480
|
+
}
|
|
481
|
+
}
|
|
482
|
+
};
|
|
483
|
+
var $defs = {
|
|
484
|
+
cssColor: {
|
|
485
|
+
type: "string",
|
|
486
|
+
description: "CSS color value. Accepts hex (#RGB, #RRGGBB, #RRGGBBAA), rgb()/rgba(), hsl()/hsla(), or oklch() formats.",
|
|
487
|
+
anyOf: [
|
|
488
|
+
{
|
|
489
|
+
pattern: "^#([0-9a-fA-F]{3}|[0-9a-fA-F]{6}|[0-9a-fA-F]{8})$"
|
|
490
|
+
},
|
|
491
|
+
{
|
|
492
|
+
pattern: "^rgba?\\("
|
|
493
|
+
},
|
|
494
|
+
{
|
|
495
|
+
pattern: "^hsla?\\("
|
|
496
|
+
},
|
|
497
|
+
{
|
|
498
|
+
pattern: "^oklch\\("
|
|
499
|
+
}
|
|
500
|
+
]
|
|
501
|
+
}
|
|
502
|
+
};
|
|
503
|
+
var visorTheme_schema = {
|
|
504
|
+
$schema: $schema,
|
|
505
|
+
$id: $id,
|
|
506
|
+
title: title,
|
|
507
|
+
description: description,
|
|
508
|
+
type: type,
|
|
509
|
+
required: required,
|
|
510
|
+
additionalProperties: additionalProperties,
|
|
511
|
+
properties: properties,
|
|
512
|
+
$defs: $defs
|
|
513
|
+
};
|
|
514
|
+
|
|
515
|
+
/**
|
|
516
|
+
* JSON Schema & Validation
|
|
517
|
+
*
|
|
518
|
+
* Exports the .visor.yaml JSON Schema and a lightweight validation function.
|
|
519
|
+
* No external validation library — keeps the bundle small for browser use.
|
|
520
|
+
*/
|
|
521
|
+
|
|
522
|
+
interface ValidationResult {
|
|
523
|
+
valid: boolean;
|
|
524
|
+
errors: string[];
|
|
525
|
+
}
|
|
526
|
+
/**
|
|
527
|
+
* Lightweight structural validation for a .visor.yaml config object.
|
|
528
|
+
* Checks required fields, types, and hex color format.
|
|
529
|
+
* For full JSON Schema validation, use the exported schema with ajv or similar.
|
|
530
|
+
*/
|
|
531
|
+
declare function validateConfig(config: unknown): ValidationResult;
|
|
532
|
+
/**
|
|
533
|
+
* Type guard that validates and narrows an unknown config to VisorThemeConfig.
|
|
534
|
+
*/
|
|
535
|
+
declare function isVisorThemeConfig(config: unknown): config is VisorThemeConfig;
|
|
536
|
+
|
|
537
|
+
/**
|
|
538
|
+
* Theme Validator
|
|
539
|
+
*
|
|
540
|
+
* Comprehensive validation for .visor.yaml theme configs.
|
|
541
|
+
* Returns structured, JSON-serializable results with errors (blocking)
|
|
542
|
+
* and warnings (non-blocking).
|
|
543
|
+
*
|
|
544
|
+
* Consumed by CLI (`npx visor theme validate`) and the docs site
|
|
545
|
+
* (live validation in the future theme creator).
|
|
546
|
+
*/
|
|
547
|
+
type ValidationSeverity = "error" | "warning";
|
|
548
|
+
interface ValidationIssue {
|
|
549
|
+
severity: ValidationSeverity;
|
|
550
|
+
code: string;
|
|
551
|
+
message: string;
|
|
552
|
+
path?: string;
|
|
553
|
+
}
|
|
554
|
+
interface ThemeValidationResult {
|
|
555
|
+
valid: boolean;
|
|
556
|
+
errors: ValidationIssue[];
|
|
557
|
+
warnings: ValidationIssue[];
|
|
558
|
+
}
|
|
559
|
+
/**
|
|
560
|
+
* Validate a theme config comprehensively.
|
|
561
|
+
*
|
|
562
|
+
* Returns structured results with errors (blocking) and warnings (non-blocking).
|
|
563
|
+
* Results are JSON-serializable for CLI `--json` output.
|
|
564
|
+
*
|
|
565
|
+
* @param config - A parsed theme config object (from YAML or programmatic)
|
|
566
|
+
* @returns ThemeValidationResult with errors[], warnings[], and valid boolean
|
|
567
|
+
*/
|
|
568
|
+
declare function validate(config: unknown): ThemeValidationResult;
|
|
569
|
+
|
|
570
|
+
/**
|
|
571
|
+
* Shade Scale Generation
|
|
572
|
+
*
|
|
573
|
+
* Generates perceptually uniform shade scales (50-950) from a base hex color
|
|
574
|
+
* using the OKLCH color space. Implements the algorithm from the interchange format spec.
|
|
575
|
+
*/
|
|
576
|
+
|
|
577
|
+
/** Tailwind Gray — used verbatim when neutral is omitted from .visor.yaml. */
|
|
578
|
+
declare const TAILWIND_GRAY: FullShadeScale;
|
|
579
|
+
/**
|
|
580
|
+
* Generate a shade scale from a base color and a color role.
|
|
581
|
+
* Accepts any supported CSS color format (hex, rgba, hsla, oklch).
|
|
582
|
+
*
|
|
583
|
+
* Primary/accent/neutral produce a full 11-step scale (50-950).
|
|
584
|
+
* Status colors (success/warning/error/info) produce a selective 6-step scale.
|
|
585
|
+
*/
|
|
586
|
+
declare function generateShadeScale(color: string, role: ColorRole): FullShadeScale | SelectiveShadeScale;
|
|
587
|
+
|
|
588
|
+
/**
|
|
589
|
+
* OKLCH Color Math
|
|
590
|
+
*
|
|
591
|
+
* Pure color conversion and gamut mapping utilities with zero external dependencies.
|
|
592
|
+
* Ported from Blacklight's colorMath.ts with improved gamut clamping via binary search.
|
|
593
|
+
*/
|
|
594
|
+
|
|
595
|
+
/**
|
|
596
|
+
* Normalize a hex color to lowercase 6-digit format.
|
|
597
|
+
* Accepts #RGB, #RRGGBB, or #RRGGBBAA (alpha is stripped).
|
|
598
|
+
* Returns null if invalid.
|
|
599
|
+
*/
|
|
600
|
+
declare function normalizeHex(hex: string): string | null;
|
|
601
|
+
declare function isValidHex(hex: string): boolean;
|
|
602
|
+
declare function hexToRgb(hex: string): RGB;
|
|
603
|
+
declare function rgbToHex(rgb: RGB): string;
|
|
604
|
+
declare function hexToOklch(hex: string): OKLCH;
|
|
605
|
+
/**
|
|
606
|
+
* Gamut-map an OKLCH color into sRGB by reducing chroma via binary search.
|
|
607
|
+
* Preserves lightness and hue — only chroma is adjusted.
|
|
608
|
+
*/
|
|
609
|
+
declare function clampToSrgb(L: number, C: number, H: number): RGB;
|
|
610
|
+
/**
|
|
611
|
+
* Convert OKLCH to hex, with gamut clamping.
|
|
612
|
+
*/
|
|
613
|
+
declare function oklchToHex(L: number, C: number, H: number): string;
|
|
614
|
+
declare function getContrastRatio(color1: string | ParsedColor, color2: string | ParsedColor, compositeBackground?: RGB): number;
|
|
615
|
+
/** Parse a hex color string into a ParsedColor. */
|
|
616
|
+
declare function parseHex(str: string): ParsedColor | null;
|
|
617
|
+
/** Parse an rgb() or rgba() color string into a ParsedColor. */
|
|
618
|
+
declare function parseRgba(str: string): ParsedColor | null;
|
|
619
|
+
/** Parse an hsl() or hsla() color string into a ParsedColor. */
|
|
620
|
+
declare function parseHsla(str: string): ParsedColor | null;
|
|
621
|
+
/** Parse an oklch() color string into a ParsedColor. */
|
|
622
|
+
declare function parseOklch(str: string): ParsedColor | null;
|
|
623
|
+
/**
|
|
624
|
+
* Parse any supported CSS color string into a ParsedColor.
|
|
625
|
+
* Supports hex, rgba(), hsla(), and oklch().
|
|
626
|
+
* Returns null if the string is not a recognized format.
|
|
627
|
+
*/
|
|
628
|
+
declare function parseColor(str: string): ParsedColor | null;
|
|
629
|
+
/** Returns true if the string is a valid CSS color in any supported format. */
|
|
630
|
+
declare function isValidColor(str: string): boolean;
|
|
631
|
+
/**
|
|
632
|
+
* Alpha-composite a color with alpha onto an opaque background.
|
|
633
|
+
* Returns the composited RGB value.
|
|
634
|
+
*/
|
|
635
|
+
declare function compositeOverBackground(color: ParsedColor, background: RGB): RGB;
|
|
636
|
+
/**
|
|
637
|
+
* Serialize a ParsedColor back to a CSS string in its original format.
|
|
638
|
+
* For non-hex formats, returns the original string to avoid lossy round-trips
|
|
639
|
+
* (especially oklch, where gamut clamping makes RGB→OKLCH irreversible).
|
|
640
|
+
* Falls back to re-deriving from RGB only for hex format.
|
|
641
|
+
*/
|
|
642
|
+
declare function serializeColor(parsed: ParsedColor): string;
|
|
643
|
+
|
|
644
|
+
/**
|
|
645
|
+
* Config Resolution
|
|
646
|
+
*
|
|
647
|
+
* Takes a raw VisorThemeConfig and fills in all defaults,
|
|
648
|
+
* producing a fully resolved config ready for the pipeline.
|
|
649
|
+
*/
|
|
650
|
+
|
|
651
|
+
declare function resolveConfig(config: VisorThemeConfig): ResolvedThemeConfig;
|
|
652
|
+
|
|
653
|
+
/**
|
|
654
|
+
* Semantic Token Assignment (Stage 2)
|
|
655
|
+
*
|
|
656
|
+
* Takes generated primitives and resolved config, applies the semantic mapping table,
|
|
657
|
+
* and produces concrete hex values for every semantic token in light and dark modes.
|
|
658
|
+
*/
|
|
659
|
+
|
|
660
|
+
/**
|
|
661
|
+
* Assign semantic tokens from generated shade scales and resolved config.
|
|
662
|
+
* Returns concrete hex values for all ~55 tokens in both light and dark modes.
|
|
663
|
+
*/
|
|
664
|
+
declare function assignSemanticTokens(primitives: GeneratedPrimitives, config: ResolvedThemeConfig): SemanticTokens;
|
|
665
|
+
|
|
666
|
+
/**
|
|
667
|
+
* Override Application (Stage 4)
|
|
668
|
+
*
|
|
669
|
+
* Applies the optional `overrides` section from .visor.yaml,
|
|
670
|
+
* replacing derived token values with user-specified values.
|
|
671
|
+
*/
|
|
672
|
+
|
|
673
|
+
/**
|
|
674
|
+
* Apply override values to semantic tokens.
|
|
675
|
+
* Returns a new SemanticTokens with overrides applied (does not mutate input).
|
|
676
|
+
*/
|
|
677
|
+
declare function applyOverrides(tokens: SemanticTokens, overrides?: {
|
|
678
|
+
light?: Record<string, string>;
|
|
679
|
+
dark?: Record<string, string>;
|
|
680
|
+
}): SemanticTokens;
|
|
681
|
+
|
|
682
|
+
/**
|
|
683
|
+
* Semantic Token Mapping Table
|
|
684
|
+
*
|
|
685
|
+
* Static data encoding the complete Stage 2 mapping from the interchange format spec.
|
|
686
|
+
* Each token maps to a {role, shade} reference for both light and dark modes.
|
|
687
|
+
*
|
|
688
|
+
* Matches the existing adaptive.ts structure in packages/tokens/ exactly.
|
|
689
|
+
*/
|
|
690
|
+
|
|
691
|
+
interface ShadeRef {
|
|
692
|
+
role: ColorRole;
|
|
693
|
+
shade: ShadeStep;
|
|
694
|
+
}
|
|
695
|
+
interface ConstantRef {
|
|
696
|
+
constant: string;
|
|
697
|
+
}
|
|
698
|
+
type TokenRef = ShadeRef | ConstantRef;
|
|
699
|
+
interface SemanticMapping {
|
|
700
|
+
light: TokenRef;
|
|
701
|
+
dark: TokenRef;
|
|
702
|
+
}
|
|
703
|
+
/** All semantic maps grouped together. */
|
|
704
|
+
declare const SEMANTIC_MAP: {
|
|
705
|
+
text: Record<string, SemanticMapping>;
|
|
706
|
+
surface: Record<string, SemanticMapping>;
|
|
707
|
+
border: Record<string, SemanticMapping>;
|
|
708
|
+
interactive: Record<string, SemanticMapping>;
|
|
709
|
+
};
|
|
710
|
+
|
|
711
|
+
/**
|
|
712
|
+
* CSS Generation (Stage 3 + Output)
|
|
713
|
+
*
|
|
714
|
+
* Generates CSS custom property strings matching the existing
|
|
715
|
+
* packages/tokens/src/generate/generate-css.ts output format.
|
|
716
|
+
*/
|
|
717
|
+
|
|
718
|
+
declare function generatePrimitivesCss(primitives: GeneratedPrimitives, config: ResolvedThemeConfig): string;
|
|
719
|
+
declare function generateSemanticCss(tokens: SemanticTokens): string;
|
|
720
|
+
declare function generateLightCss(tokens: SemanticTokens): string;
|
|
721
|
+
declare function generateDarkCss(tokens: SemanticTokens): string;
|
|
722
|
+
declare function generateFullBundleCss(primitives: GeneratedPrimitives, tokens: SemanticTokens, config: ResolvedThemeConfig): string;
|
|
723
|
+
|
|
724
|
+
/**
|
|
725
|
+
* Theme Extraction Engine
|
|
726
|
+
*
|
|
727
|
+
* Scans CSS files from an existing project and produces a best-effort
|
|
728
|
+
* VisorThemeConfig with confidence annotations per token.
|
|
729
|
+
*
|
|
730
|
+
* Handles three CSS architectures:
|
|
731
|
+
* 1. Reference app: full 3-tier separation, :root/.dark, RGB channels
|
|
732
|
+
* 2. Blacklight: flat primitives only, no semantic layer, opacity variants
|
|
733
|
+
* 3. Kaiah: OKLCH format, @custom-variant dark, @theme inline syntax
|
|
734
|
+
*/
|
|
735
|
+
|
|
736
|
+
type Confidence = "high" | "medium" | "low";
|
|
737
|
+
interface ExtractedToken {
|
|
738
|
+
name: string;
|
|
739
|
+
value: string;
|
|
740
|
+
context: "light" | "dark";
|
|
741
|
+
confidence: Confidence;
|
|
742
|
+
reason: string;
|
|
743
|
+
}
|
|
744
|
+
interface ExtractionResult {
|
|
745
|
+
config: VisorThemeConfig;
|
|
746
|
+
tokens: ExtractedToken[];
|
|
747
|
+
unmapped: Array<{
|
|
748
|
+
name: string;
|
|
749
|
+
value: string;
|
|
750
|
+
context: "light" | "dark";
|
|
751
|
+
}>;
|
|
752
|
+
warnings: string[];
|
|
753
|
+
}
|
|
754
|
+
interface CSSFile {
|
|
755
|
+
path: string;
|
|
756
|
+
content: string;
|
|
757
|
+
}
|
|
758
|
+
interface CSSDeclaration {
|
|
759
|
+
property: string;
|
|
760
|
+
value: string;
|
|
761
|
+
context: "light" | "dark";
|
|
762
|
+
}
|
|
763
|
+
/**
|
|
764
|
+
* Parse CSS content and extract all custom property declarations.
|
|
765
|
+
* Groups them by light/dark context based on selector.
|
|
766
|
+
*/
|
|
767
|
+
declare function parseCSSDeclarations(css: string): CSSDeclaration[];
|
|
768
|
+
interface FontFaceDeclaration {
|
|
769
|
+
family: string;
|
|
770
|
+
src?: string;
|
|
771
|
+
weight?: string;
|
|
772
|
+
style?: string;
|
|
773
|
+
}
|
|
774
|
+
/**
|
|
775
|
+
* Parse @font-face blocks from CSS content and extract font metadata.
|
|
776
|
+
* Runs before CSS custom property extraction so @font-face fonts are
|
|
777
|
+
* available as fallback font hints.
|
|
778
|
+
*/
|
|
779
|
+
declare function parseFontFaceDeclarations(css: string): FontFaceDeclaration[];
|
|
780
|
+
/**
|
|
781
|
+
* Clean a font-family CSS value to extract just the primary font name.
|
|
782
|
+
*
|
|
783
|
+
* Handles:
|
|
784
|
+
* - var() references (returned as-is by default, or resolved via resolveVarFont)
|
|
785
|
+
* - Quoted font names with trailing quote artifacts (Fix 3: VI-82)
|
|
786
|
+
* - Font stacks with fallback families (Fix 3: VI-82)
|
|
787
|
+
* - Bare font names
|
|
788
|
+
*/
|
|
789
|
+
declare function cleanFontValue(val: string): string;
|
|
790
|
+
/**
|
|
791
|
+
* Extract a VisorThemeConfig from CSS files.
|
|
792
|
+
*
|
|
793
|
+
* @param files - Array of CSS files with path and content
|
|
794
|
+
* @param name - Theme name for the output config
|
|
795
|
+
* @returns ExtractionResult with config, token details, unmapped tokens, and warnings
|
|
796
|
+
*/
|
|
797
|
+
declare function extractFromCSS(files: CSSFile[], name?: string): ExtractionResult;
|
|
798
|
+
|
|
799
|
+
export { type CSSFile, ColorRole, type Confidence, type ExtractedToken, type ExtractionResult, FontDisplayStrategy, type FontFaceDeclaration, FontResolution, FontResolveOptions, FullShadeScale, GeneratedPrimitives, GoogleFontEntry, OKLCH, ParsedColor, RGB, ResolvedThemeConfig, SEMANTIC_MAP, SelectiveShadeScale, SemanticTokens, ShadeStep, TAILWIND_GRAY, ThemeData, ThemeFontResult, ThemeOutput, type ThemeValidationResult, VISOR_FONTS_CDN, type ValidationIssue, type ValidationSeverity, VisorThemeConfig, VisorTypography, applyOverrides, assignSemanticTokens, buildVisorFontUrl, clampToSrgb, cleanFontValue, compositeOverBackground, exportTheme, extractFromCSS, generateDarkCss, generateFullBundleCss, generateLightCss, generatePreloadLinks, generatePrimitives, generatePrimitivesCss, generateSemanticCss, generateShadeScale, generateStylesheetLinks, generateTheme, generateThemeData, generateThemeDataFromConfig, generateThemeFromConfig, getContrastRatio, googleFontsCatalog, hexToOklch, hexToRgb, isValidColor, isValidHex, isVisorThemeConfig, lookupGoogleFont, normalizeHex, oklchToHex, parseCSSDeclarations, parseColor, parseConfig, parseFontFaceDeclarations, parseHex, parseHsla, parseOklch, parseRgba, resolveConfig, resolveFont, resolveThemeFonts, rgbToHex, serializeColor, validate, validateConfig, visorTheme_schema as visorThemeSchema };
|