@ttoss/fsl-theme 1.1.21 → 2.0.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.
Files changed (66) hide show
  1. package/README.md +16 -14
  2. package/dist/{Types-BiBa17RL.d.cts → Types-BkaxtsMv.d.cts} +61 -13
  3. package/dist/{Types-BiBa17RL.d.mts → Types-BkaxtsMv.d.mts} +61 -13
  4. package/dist/{baseBundle-BXvPJYzj.cjs → baseBundle-DdRSa5mf.cjs} +3 -2
  5. package/dist/{baseBundle-BLvD8XVS.mjs → baseBundle-R7WyjyTw.mjs} +3 -2
  6. package/dist/{createTheme-JOu16Shb.cjs → createTheme--UFgVlEn.cjs} +144 -16
  7. package/dist/{createTheme-DzLnsknT.mjs → createTheme-B6tVIikC.mjs} +138 -16
  8. package/dist/css.cjs +2 -2
  9. package/dist/css.d.cts +1 -1
  10. package/dist/css.d.mts +1 -1
  11. package/dist/css.mjs +2 -2
  12. package/dist/dataviz/index.cjs +2 -2
  13. package/dist/dataviz/index.d.cts +1 -1
  14. package/dist/dataviz/index.d.mts +1 -1
  15. package/dist/dataviz/index.mjs +1 -1
  16. package/dist/dtcg.cjs +26 -9
  17. package/dist/dtcg.d.cts +17 -4
  18. package/dist/dtcg.d.mts +17 -4
  19. package/dist/dtcg.mjs +26 -9
  20. package/dist/{helpers-C29fy-Ad.cjs → helpers-BU40JvFA.cjs} +27 -78
  21. package/dist/{helpers-CA4Qkxct.mjs → helpers-BXaKe2s3.mjs} +28 -73
  22. package/dist/{index-CsIjfw86.d.cts → index-7YL90Xqs.d.cts} +36 -12
  23. package/dist/{index-nJrjI0BA.d.mts → index-BmCTIOzh.d.mts} +36 -12
  24. package/dist/index.cjs +2 -8
  25. package/dist/index.d.cts +4 -4
  26. package/dist/index.d.mts +4 -4
  27. package/dist/index.mjs +2 -5
  28. package/dist/{react-DnKxR2gK.d.mts → react-C8JrZf-b.d.mts} +43 -2
  29. package/dist/{react-CoWIQYx_.cjs → react-DLB8nrXQ.cjs} +32 -2
  30. package/dist/{react-CGa6FlNL.d.cts → react-Dt7vGAVG.d.cts} +43 -2
  31. package/dist/react.cjs +1 -1
  32. package/dist/react.d.cts +1 -1
  33. package/dist/react.d.mts +1 -1
  34. package/dist/react.mjs +32 -2
  35. package/dist/runtime-entry.cjs +1 -1
  36. package/dist/runtime-entry.mjs +1 -1
  37. package/dist/{ssrScript-CoRE6jjq.mjs → ssrScript-DNLlLDps.mjs} +2 -1
  38. package/dist/{ssrScript-DOpLExaG.cjs → ssrScript-MF5SIONH.cjs} +2 -1
  39. package/dist/themes/bruttal.cjs +19 -4
  40. package/dist/themes/bruttal.d.cts +1 -1
  41. package/dist/themes/bruttal.d.mts +1 -1
  42. package/dist/themes/bruttal.mjs +19 -4
  43. package/dist/{toCssVars-CUiqx2kh.cjs → toCssVars-BseqmMcT.cjs} +27 -2
  44. package/dist/{toCssVars-BHRiSykR.mjs → toCssVars-C-9yIZDR.mjs} +27 -2
  45. package/dist/{tokenRegistry-DolhB5Vf.mjs → tokenRegistry-DviyqDeE.mjs} +19 -28
  46. package/dist/{tokenRegistry-B9zMRjpL.cjs → tokenRegistry-f_Bx_BAN.cjs} +19 -28
  47. package/dist/vars.cjs +3 -3
  48. package/dist/vars.d.cts +1 -1
  49. package/dist/vars.d.mts +1 -1
  50. package/dist/vars.mjs +3 -3
  51. package/dist/{withDataviz-DYV1S_xr.mjs → withDataviz-BvpZJnFx.mjs} +2 -2
  52. package/dist/{withDataviz-BlJcYhcw.cjs → withDataviz-CYRf4exT.cjs} +2 -2
  53. package/llms.txt +6 -6
  54. package/package.json +1 -1
  55. package/dist/themes/corporate.cjs +0 -34
  56. package/dist/themes/corporate.d.cts +0 -3
  57. package/dist/themes/corporate.d.mts +0 -3
  58. package/dist/themes/corporate.mjs +0 -31
  59. package/dist/themes/oca.cjs +0 -34
  60. package/dist/themes/oca.d.cts +0 -3
  61. package/dist/themes/oca.d.mts +0 -3
  62. package/dist/themes/oca.mjs +0 -31
  63. package/dist/themes/ventures.cjs +0 -34
  64. package/dist/themes/ventures.d.cts +0 -3
  65. package/dist/themes/ventures.d.mts +0 -3
  66. package/dist/themes/ventures.mjs +0 -31
package/dist/react.mjs CHANGED
@@ -1,11 +1,22 @@
1
1
  /** Powered by @ttoss/config. https://ttoss.dev/docs/modules/packages/config/ */
2
- import { r as deepMerge, s as toFlatTokens } from "./helpers-CA4Qkxct.mjs";
2
+ import { r as deepMerge, s as toFlatTokens } from "./helpers-BXaKe2s3.mjs";
3
3
  import { getThemeStylesContent } from "./css.mjs";
4
- import { i as createThemeRuntime, t as getThemeScriptContent } from "./ssrScript-CoRE6jjq.mjs";
4
+ import { i as createThemeRuntime, t as getThemeScriptContent } from "./ssrScript-DNLlLDps.mjs";
5
5
  import * as React from "react";
6
6
  import { Fragment, jsx, jsxs } from "react/jsx-runtime";
7
7
 
8
8
  //#region src/react.tsx
9
+ /**
10
+ * Stable `href` for the theme's hoistable `<style>` tag. React 19 keys style
11
+ * hoisting **and dedup** on `href` + `precedence`, so re-renders and multiple
12
+ * `<ThemeProvider>`s sharing a `themeId` collapse to a single tag, while
13
+ * distinct `themeId`s coexist (micro-frontends). Note: `ThemeStyles` /
14
+ * `ThemeHead` render an href-less inline `<style>`, so they do **not** dedup
15
+ * against this hoisted tag — don't combine them with a themed `ThemeProvider`.
16
+ */
17
+ var themeStyleHref = themeId => {
18
+ return `tt-theme-${themeId ?? "root"}`;
19
+ };
9
20
  var COARSE_QUERY = "(any-pointer: coarse)";
10
21
  /**
11
22
  * Subscribe to coarse-pointer media query changes.
@@ -160,6 +171,7 @@ var ThemeProvider = ({
160
171
  });
161
172
  if (theme) return /* @__PURE__ */jsxs(Fragment, {
162
173
  children: [/* @__PURE__ */jsx("style", {
174
+ href: themeStyleHref(themeId),
163
175
  precedence: "default",
164
176
  children: cssContent
165
177
  }), /* @__PURE__ */jsx(ResolvedTokensCtx.Provider, {
@@ -316,6 +328,10 @@ var ThemeScript = ({
316
328
  * `dangerouslySetInnerHTML` is safe: content comes exclusively from
317
329
  * `toCssVars()` (a pure internal function) — no user input is interpolated.
318
330
  *
331
+ * Renders a plain inline `<style>` where you place it (put it in `<head>`).
332
+ * Do **not** also pass `theme` to `<ThemeProvider>` — that injects a second
333
+ * copy; pass `theme` to the head component only (see README SSR section).
334
+ *
319
335
  * @example
320
336
  * ```tsx
321
337
  * // SSR escape hatch — no themeId needed for canonical 1-theme model
@@ -365,6 +381,12 @@ var ThemeStyles = ({
365
381
  * Use in SSR frameworks (Next.js, Remix) where you need explicit `<head>`
366
382
  * injection. In CSR apps, `<ThemeProvider theme={...}>` handles everything.
367
383
  *
384
+ * **`storageKey` invariant:** `ThemeHead` forwards `storageKey` to `ThemeScript`,
385
+ * which reads localStorage before the first paint. `ThemeProvider` reads the
386
+ * same key at runtime. If you pass a custom `storageKey`, pass the **same value**
387
+ * to both `<ThemeHead>` and `<ThemeProvider>` — a mismatch causes a theme flash
388
+ * exactly in the scenario this component was designed to prevent.
389
+ *
368
390
  * @example
369
391
  * ```tsx
370
392
  * // Next.js app/layout.tsx
@@ -386,6 +408,14 @@ var ThemeStyles = ({
386
408
  * );
387
409
  * }
388
410
  * ```
411
+ *
412
+ * @example
413
+ * ```tsx
414
+ * // Custom storageKey — must be identical on both sides
415
+ * <ThemeHead theme={myTheme} storageKey="my-app-theme" />
416
+ * // ...
417
+ * <ThemeProvider theme={myTheme} storageKey="my-app-theme">{children}</ThemeProvider>
418
+ * ```
389
419
  */
390
420
  var ThemeHead = ({
391
421
  theme,
@@ -2,7 +2,7 @@
2
2
  Object.defineProperty(exports, Symbol.toStringTag, {
3
3
  value: 'Module'
4
4
  });
5
- const require_ssrScript = require('./ssrScript-DOpLExaG.cjs');
5
+ const require_ssrScript = require('./ssrScript-MF5SIONH.cjs');
6
6
  exports.DATA_MODE_ATTR = require_ssrScript.DATA_MODE_ATTR;
7
7
  exports.DATA_THEME_ATTR = require_ssrScript.DATA_THEME_ATTR;
8
8
  exports.createThemeRuntime = require_ssrScript.createThemeRuntime;
@@ -1,3 +1,3 @@
1
1
  /** Powered by @ttoss/config. https://ttoss.dev/docs/modules/packages/config/ */
2
- import { i as createThemeRuntime, n as DATA_MODE_ATTR, r as DATA_THEME_ATTR, t as getThemeScriptContent } from "./ssrScript-CoRE6jjq.mjs";
2
+ import { i as createThemeRuntime, n as DATA_MODE_ATTR, r as DATA_THEME_ATTR, t as getThemeScriptContent } from "./ssrScript-DNLlLDps.mjs";
3
3
  export { DATA_MODE_ATTR, DATA_THEME_ATTR, createThemeRuntime, getThemeScriptContent };
@@ -1,5 +1,5 @@
1
1
  /** Powered by @ttoss/config. https://ttoss.dev/docs/modules/packages/config/ */
2
- import { n as SAFE_ID_RE } from "./helpers-CA4Qkxct.mjs";
2
+ import { n as SAFE_ID_RE } from "./helpers-BXaKe2s3.mjs";
3
3
 
4
4
  //#region src/themeBootstrap.ts
5
5
  /**
@@ -96,6 +96,7 @@ var createThemeRuntime = (config = {}) => {
96
96
  };
97
97
  const mediaQuery = window.matchMedia("(prefers-color-scheme: dark)");
98
98
  const onSystemChange = () => {
99
+ if (destroyed) return;
99
100
  resolvedMode = mediaQuery.matches ? "dark" : "light";
100
101
  applyState({
101
102
  persist: false
@@ -1,5 +1,5 @@
1
1
  /** Powered by @ttoss/config. https://ttoss.dev/docs/modules/packages/config/ */
2
- const require_helpers = require('./helpers-C29fy-Ad.cjs');
2
+ const require_helpers = require('./helpers-BU40JvFA.cjs');
3
3
 
4
4
  //#region src/themeBootstrap.ts
5
5
  /**
@@ -96,6 +96,7 @@ var createThemeRuntime = (config = {}) => {
96
96
  };
97
97
  const mediaQuery = window.matchMedia("(prefers-color-scheme: dark)");
98
98
  const onSystemChange = () => {
99
+ if (destroyed) return;
99
100
  resolvedMode = mediaQuery.matches ? "dark" : "light";
100
101
  applyState({
101
102
  persist: false
@@ -2,9 +2,9 @@
2
2
  Object.defineProperty(exports, Symbol.toStringTag, {
3
3
  value: 'Module'
4
4
  });
5
- const require_createTheme = require('../createTheme-JOu16Shb.cjs');
6
- const require_helpers = require('../helpers-C29fy-Ad.cjs');
7
- const require_withDataviz = require('../withDataviz-BlJcYhcw.cjs');
5
+ const require_createTheme = require('../createTheme--UFgVlEn.cjs');
6
+ const require_helpers = require('../helpers-BU40JvFA.cjs');
7
+ const require_withDataviz = require('../withDataviz-CYRf4exT.cjs');
8
8
 
9
9
  //#region src/themes/bruttal.ts
10
10
  /**
@@ -67,7 +67,22 @@ var bundle = require_createTheme.createTheme({
67
67
  }
68
68
  }
69
69
  }
70
- })
70
+ }),
71
+ brief: {
72
+ name: "bruttal",
73
+ purpose: "warm-brown brutalist brand identity",
74
+ primaryPosture: "expressive",
75
+ secondaryPosture: "technical",
76
+ densityProfile: "balanced",
77
+ readingMode: "mixed",
78
+ pointerProfile: "hybrid",
79
+ interactionRisk: "medium",
80
+ surfaceModel: "flat",
81
+ brandEnergy: "expressive",
82
+ accessibilityTarget: "AA+",
83
+ colorModeStrategy: "dark-supported",
84
+ platformBias: "web"
85
+ }
71
86
  });
72
87
  var bruttal = require_withDataviz.withDataviz(bundle);
73
88
 
@@ -1,3 +1,3 @@
1
1
 
2
- import { i as bruttal } from "../index-CsIjfw86.cjs";
2
+ import { t as bruttal } from "../index-7YL90Xqs.cjs";
3
3
  export { bruttal };
@@ -1,3 +1,3 @@
1
1
 
2
- import { i as bruttal } from "../index-nJrjI0BA.mjs";
2
+ import { t as bruttal } from "../index-BmCTIOzh.mjs";
3
3
  export { bruttal };
@@ -1,7 +1,7 @@
1
1
  /** Powered by @ttoss/config. https://ttoss.dev/docs/modules/packages/config/ */
2
- import { i as darkAlternate, n as createTheme } from "../createTheme-DzLnsknT.mjs";
3
- import { r as deepMerge } from "../helpers-CA4Qkxct.mjs";
4
- import { t as withDataviz } from "../withDataviz-DYV1S_xr.mjs";
2
+ import { a as darkAlternate, n as createTheme } from "../createTheme-B6tVIikC.mjs";
3
+ import { r as deepMerge } from "../helpers-BXaKe2s3.mjs";
4
+ import { t as withDataviz } from "../withDataviz-BvpZJnFx.mjs";
5
5
 
6
6
  //#region src/themes/bruttal.ts
7
7
  /**
@@ -64,7 +64,22 @@ var bundle = createTheme({
64
64
  }
65
65
  }
66
66
  }
67
- })
67
+ }),
68
+ brief: {
69
+ name: "bruttal",
70
+ purpose: "warm-brown brutalist brand identity",
71
+ primaryPosture: "expressive",
72
+ secondaryPosture: "technical",
73
+ densityProfile: "balanced",
74
+ readingMode: "mixed",
75
+ pointerProfile: "hybrid",
76
+ interactionRisk: "medium",
77
+ surfaceModel: "flat",
78
+ brandEnergy: "expressive",
79
+ accessibilityTarget: "AA+",
80
+ colorModeStrategy: "dark-supported",
81
+ platformBias: "web"
82
+ }
68
83
  });
69
84
  var bruttal = withDataviz(bundle);
70
85
 
@@ -1,6 +1,6 @@
1
1
  /** Powered by @ttoss/config. https://ttoss.dev/docs/modules/packages/config/ */
2
- const require_helpers = require('./helpers-C29fy-Ad.cjs');
3
- const require_tokenRegistry = require('./tokenRegistry-B9zMRjpL.cjs');
2
+ const require_helpers = require('./helpers-BU40JvFA.cjs');
3
+ const require_tokenRegistry = require('./tokenRegistry-f_Bx_BAN.cjs');
4
4
 
5
5
  //#region src/roots/toCssVars.ts
6
6
  /**
@@ -26,6 +26,27 @@ var inlineRefsToVars = value => {
26
26
  });
27
27
  };
28
28
  /**
29
+ * Assert that no two token paths collapse to the same CSS custom property name.
30
+ *
31
+ * `toCssVarName` is first-match-wins with no duplicate detection, so two
32
+ * distinct token paths sharing a `cssPrefix` (e.g. a future
33
+ * `semantic.dataviz.color.state.*` vs `semantic.dataviz.geo.state.*`) could
34
+ * silently overwrite each other in the flat record. This guards the whole
35
+ * registry, not just dataviz.
36
+ *
37
+ * **DEV-only** — callers gate this behind `process.env.NODE_ENV !== 'production'`
38
+ * so bundlers tree-shake the entire call in production builds.
39
+ */
40
+ var assertDistinctCssVars = flat => {
41
+ const byVarName = /* @__PURE__ */new Map();
42
+ for (const path of Object.keys(flat)) {
43
+ const varName = toCssVarName(path);
44
+ const existing = byVarName.get(varName);
45
+ if (existing !== void 0 && existing !== path) throw new Error(`[fsl-theme] CSS variable name collision: '${varName}' is produced by both '${existing}' and '${path}'. Give one of them a distinct token path or CSS prefix (see roots/tokenRegistry.ts).`);
46
+ byVarName.set(varName, path);
47
+ }
48
+ };
49
+ /**
29
50
  * Build a flat CSS custom properties record from a ThemeTokens.
30
51
  *
31
52
  * Core tokens get raw values. Semantic tokens get `var()` references
@@ -42,6 +63,10 @@ var buildCssVars = theme => {
42
63
  const varName = toCssVarName(path);
43
64
  if (typeof value === "string" && value.includes("{")) vars[varName] = inlineRefsToVars(value);else vars[varName] = value;
44
65
  }
66
+ if (process.env.NODE_ENV !== "production") assertDistinctCssVars({
67
+ ...coreFlat,
68
+ ...semanticFlat
69
+ });
45
70
  return vars;
46
71
  };
47
72
  var sanitizeId = value => {
@@ -1,6 +1,6 @@
1
1
  /** Powered by @ttoss/config. https://ttoss.dev/docs/modules/packages/config/ */
2
- import { a as flattenTheme, i as flattenObject, n as SAFE_ID_RE, r as deepMerge, t as COMPOUND_REF_RE } from "./helpers-CA4Qkxct.mjs";
3
- import { t as CSS_PATH_PREFIXES } from "./tokenRegistry-DolhB5Vf.mjs";
2
+ import { a as flattenTheme, i as flattenObject, n as SAFE_ID_RE, r as deepMerge, t as COMPOUND_REF_RE } from "./helpers-BXaKe2s3.mjs";
3
+ import { t as CSS_PATH_PREFIXES } from "./tokenRegistry-DviyqDeE.mjs";
4
4
 
5
5
  //#region src/roots/toCssVars.ts
6
6
  /**
@@ -26,6 +26,27 @@ var inlineRefsToVars = value => {
26
26
  });
27
27
  };
28
28
  /**
29
+ * Assert that no two token paths collapse to the same CSS custom property name.
30
+ *
31
+ * `toCssVarName` is first-match-wins with no duplicate detection, so two
32
+ * distinct token paths sharing a `cssPrefix` (e.g. a future
33
+ * `semantic.dataviz.color.state.*` vs `semantic.dataviz.geo.state.*`) could
34
+ * silently overwrite each other in the flat record. This guards the whole
35
+ * registry, not just dataviz.
36
+ *
37
+ * **DEV-only** — callers gate this behind `process.env.NODE_ENV !== 'production'`
38
+ * so bundlers tree-shake the entire call in production builds.
39
+ */
40
+ var assertDistinctCssVars = flat => {
41
+ const byVarName = /* @__PURE__ */new Map();
42
+ for (const path of Object.keys(flat)) {
43
+ const varName = toCssVarName(path);
44
+ const existing = byVarName.get(varName);
45
+ if (existing !== void 0 && existing !== path) throw new Error(`[fsl-theme] CSS variable name collision: '${varName}' is produced by both '${existing}' and '${path}'. Give one of them a distinct token path or CSS prefix (see roots/tokenRegistry.ts).`);
46
+ byVarName.set(varName, path);
47
+ }
48
+ };
49
+ /**
29
50
  * Build a flat CSS custom properties record from a ThemeTokens.
30
51
  *
31
52
  * Core tokens get raw values. Semantic tokens get `var()` references
@@ -42,6 +63,10 @@ var buildCssVars = theme => {
42
63
  const varName = toCssVarName(path);
43
64
  if (typeof value === "string" && value.includes("{")) vars[varName] = inlineRefsToVars(value);else vars[varName] = value;
44
65
  }
66
+ if (process.env.NODE_ENV !== "production") assertDistinctCssVars({
67
+ ...coreFlat,
68
+ ...semanticFlat
69
+ });
45
70
  return vars;
46
71
  };
47
72
  var sanitizeId = value => {
@@ -20,28 +20,25 @@ var TOKEN_PATH_REGISTRY = [{
20
20
  dtcgType: "number"
21
21
  }, {
22
22
  path: "core.dataviz.",
23
- cssPrefix: "--tt-core-dataviz-",
24
- dtcgType: "string"
23
+ cssPrefix: "--tt-core-dataviz-"
25
24
  }, {
26
25
  path: "semantic.dataviz.color.",
27
- cssPrefix: "--tt-dataviz-",
26
+ cssPrefix: "--tt-dataviz-color-",
28
27
  dtcgType: "color"
29
28
  }, {
30
29
  path: "semantic.dataviz.encoding.opacity.",
31
- cssPrefix: "--tt-dataviz-",
30
+ cssPrefix: "--tt-dataviz-encoding-opacity-",
32
31
  dtcgType: "number"
33
32
  }, {
34
33
  path: "semantic.dataviz.geo.",
35
- cssPrefix: "--tt-dataviz-",
34
+ cssPrefix: "--tt-dataviz-geo-",
36
35
  dtcgType: "color"
37
36
  }, {
38
37
  path: "semantic.dataviz.encoding.",
39
- cssPrefix: "--tt-dataviz-",
40
- dtcgType: "string"
38
+ cssPrefix: "--tt-dataviz-encoding-"
41
39
  }, {
42
40
  path: "semantic.dataviz.",
43
- cssPrefix: "--tt-dataviz-",
44
- dtcgType: "string"
41
+ cssPrefix: "--tt-dataviz-"
45
42
  }, {
46
43
  path: "core.colors.",
47
44
  cssPrefix: "--tt-core-colors-",
@@ -72,12 +69,10 @@ var TOKEN_PATH_REGISTRY = [{
72
69
  dtcgType: "dimension"
73
70
  }, {
74
71
  path: "core.font.optical.",
75
- cssPrefix: "--tt-core-font-optical-",
76
- dtcgType: "string"
72
+ cssPrefix: "--tt-core-font-optical-"
77
73
  }, {
78
74
  path: "core.font.numeric.",
79
- cssPrefix: "--tt-core-font-numeric-",
80
- dtcgType: "string"
75
+ cssPrefix: "--tt-core-font-numeric-"
81
76
  }, {
82
77
  path: "core.font.scale.",
83
78
  cssPrefix: "--tt-core-font-scale-",
@@ -88,8 +83,7 @@ var TOKEN_PATH_REGISTRY = [{
88
83
  dtcgType: "dimension"
89
84
  }, {
90
85
  path: "core.sizing.behavior.",
91
- cssPrefix: "--tt-core-sizing-behavior-",
92
- dtcgType: "string"
86
+ cssPrefix: "--tt-core-sizing-behavior-"
93
87
  }, {
94
88
  path: "core.sizing.",
95
89
  cssPrefix: "--tt-core-sizing-",
@@ -104,8 +98,7 @@ var TOKEN_PATH_REGISTRY = [{
104
98
  dtcgType: "dimension"
105
99
  }, {
106
100
  path: "core.border.style.",
107
- cssPrefix: "--tt-core-border-style-",
108
- dtcgType: "string"
101
+ cssPrefix: "--tt-core-border-style-"
109
102
  }, {
110
103
  path: "core.opacity.",
111
104
  cssPrefix: "--tt-core-opacity-",
@@ -116,8 +109,7 @@ var TOKEN_PATH_REGISTRY = [{
116
109
  dtcgType: "duration"
117
110
  }, {
118
111
  path: "core.motion.easing.",
119
- cssPrefix: "--tt-core-motion-easing-",
120
- dtcgType: "string"
112
+ cssPrefix: "--tt-core-motion-easing-"
121
113
  }, {
122
114
  path: "core.zIndex.level.",
123
115
  cssPrefix: "--tt-core-z-index-",
@@ -136,8 +128,7 @@ var TOKEN_PATH_REGISTRY = [{
136
128
  dtcgType: "shadow"
137
129
  }, {
138
130
  path: "semantic.text.",
139
- cssPrefix: "--tt-text-",
140
- dtcgType: "string"
131
+ cssPrefix: "--tt-text-"
141
132
  }, {
142
133
  path: "semantic.spacing.",
143
134
  cssPrefix: "--tt-spacing-",
@@ -152,24 +143,21 @@ var TOKEN_PATH_REGISTRY = [{
152
143
  dtcgType: "dimension"
153
144
  }, {
154
145
  path: "semantic.focus.",
155
- cssPrefix: "--tt-focus-",
156
- dtcgType: "string"
146
+ cssPrefix: "--tt-focus-"
157
147
  }, {
158
148
  path: "semantic.overlay.",
159
149
  cssPrefix: "--tt-overlay-",
160
150
  dtcgType: "color"
161
151
  }, {
162
152
  path: "semantic.border.",
163
- cssPrefix: "--tt-border-",
164
- dtcgType: "string"
153
+ cssPrefix: "--tt-border-"
165
154
  }, {
166
155
  path: "semantic.opacity.",
167
156
  cssPrefix: "--tt-opacity-",
168
157
  dtcgType: "number"
169
158
  }, {
170
159
  path: "semantic.motion.",
171
- cssPrefix: "--tt-motion-",
172
- dtcgType: "string"
160
+ cssPrefix: "--tt-motion-"
173
161
  }, {
174
162
  path: "semantic.zIndex.layer.",
175
163
  cssPrefix: "--tt-z-index-",
@@ -179,7 +167,10 @@ var TOKEN_PATH_REGISTRY = [{
179
167
  var CSS_PATH_PREFIXES = TOKEN_PATH_REGISTRY.map(e => {
180
168
  return [e.path, e.cssPrefix];
181
169
  });
182
- /** Derived lookup table: `[path, dtcgType]` pairs. */
170
+ /**
171
+ * Derived lookup table: `[path, dtcgType]` pairs. `dtcgType` is `undefined` for
172
+ * opaque tokens — `toDTCG` omits `$type` when the matched entry has none.
173
+ */
183
174
  var DTCG_TYPE_PREFIXES = TOKEN_PATH_REGISTRY.map(e => {
184
175
  return [e.path, e.dtcgType];
185
176
  });
@@ -20,28 +20,25 @@ var TOKEN_PATH_REGISTRY = [{
20
20
  dtcgType: "number"
21
21
  }, {
22
22
  path: "core.dataviz.",
23
- cssPrefix: "--tt-core-dataviz-",
24
- dtcgType: "string"
23
+ cssPrefix: "--tt-core-dataviz-"
25
24
  }, {
26
25
  path: "semantic.dataviz.color.",
27
- cssPrefix: "--tt-dataviz-",
26
+ cssPrefix: "--tt-dataviz-color-",
28
27
  dtcgType: "color"
29
28
  }, {
30
29
  path: "semantic.dataviz.encoding.opacity.",
31
- cssPrefix: "--tt-dataviz-",
30
+ cssPrefix: "--tt-dataviz-encoding-opacity-",
32
31
  dtcgType: "number"
33
32
  }, {
34
33
  path: "semantic.dataviz.geo.",
35
- cssPrefix: "--tt-dataviz-",
34
+ cssPrefix: "--tt-dataviz-geo-",
36
35
  dtcgType: "color"
37
36
  }, {
38
37
  path: "semantic.dataviz.encoding.",
39
- cssPrefix: "--tt-dataviz-",
40
- dtcgType: "string"
38
+ cssPrefix: "--tt-dataviz-encoding-"
41
39
  }, {
42
40
  path: "semantic.dataviz.",
43
- cssPrefix: "--tt-dataviz-",
44
- dtcgType: "string"
41
+ cssPrefix: "--tt-dataviz-"
45
42
  }, {
46
43
  path: "core.colors.",
47
44
  cssPrefix: "--tt-core-colors-",
@@ -72,12 +69,10 @@ var TOKEN_PATH_REGISTRY = [{
72
69
  dtcgType: "dimension"
73
70
  }, {
74
71
  path: "core.font.optical.",
75
- cssPrefix: "--tt-core-font-optical-",
76
- dtcgType: "string"
72
+ cssPrefix: "--tt-core-font-optical-"
77
73
  }, {
78
74
  path: "core.font.numeric.",
79
- cssPrefix: "--tt-core-font-numeric-",
80
- dtcgType: "string"
75
+ cssPrefix: "--tt-core-font-numeric-"
81
76
  }, {
82
77
  path: "core.font.scale.",
83
78
  cssPrefix: "--tt-core-font-scale-",
@@ -88,8 +83,7 @@ var TOKEN_PATH_REGISTRY = [{
88
83
  dtcgType: "dimension"
89
84
  }, {
90
85
  path: "core.sizing.behavior.",
91
- cssPrefix: "--tt-core-sizing-behavior-",
92
- dtcgType: "string"
86
+ cssPrefix: "--tt-core-sizing-behavior-"
93
87
  }, {
94
88
  path: "core.sizing.",
95
89
  cssPrefix: "--tt-core-sizing-",
@@ -104,8 +98,7 @@ var TOKEN_PATH_REGISTRY = [{
104
98
  dtcgType: "dimension"
105
99
  }, {
106
100
  path: "core.border.style.",
107
- cssPrefix: "--tt-core-border-style-",
108
- dtcgType: "string"
101
+ cssPrefix: "--tt-core-border-style-"
109
102
  }, {
110
103
  path: "core.opacity.",
111
104
  cssPrefix: "--tt-core-opacity-",
@@ -116,8 +109,7 @@ var TOKEN_PATH_REGISTRY = [{
116
109
  dtcgType: "duration"
117
110
  }, {
118
111
  path: "core.motion.easing.",
119
- cssPrefix: "--tt-core-motion-easing-",
120
- dtcgType: "string"
112
+ cssPrefix: "--tt-core-motion-easing-"
121
113
  }, {
122
114
  path: "core.zIndex.level.",
123
115
  cssPrefix: "--tt-core-z-index-",
@@ -136,8 +128,7 @@ var TOKEN_PATH_REGISTRY = [{
136
128
  dtcgType: "shadow"
137
129
  }, {
138
130
  path: "semantic.text.",
139
- cssPrefix: "--tt-text-",
140
- dtcgType: "string"
131
+ cssPrefix: "--tt-text-"
141
132
  }, {
142
133
  path: "semantic.spacing.",
143
134
  cssPrefix: "--tt-spacing-",
@@ -152,24 +143,21 @@ var TOKEN_PATH_REGISTRY = [{
152
143
  dtcgType: "dimension"
153
144
  }, {
154
145
  path: "semantic.focus.",
155
- cssPrefix: "--tt-focus-",
156
- dtcgType: "string"
146
+ cssPrefix: "--tt-focus-"
157
147
  }, {
158
148
  path: "semantic.overlay.",
159
149
  cssPrefix: "--tt-overlay-",
160
150
  dtcgType: "color"
161
151
  }, {
162
152
  path: "semantic.border.",
163
- cssPrefix: "--tt-border-",
164
- dtcgType: "string"
153
+ cssPrefix: "--tt-border-"
165
154
  }, {
166
155
  path: "semantic.opacity.",
167
156
  cssPrefix: "--tt-opacity-",
168
157
  dtcgType: "number"
169
158
  }, {
170
159
  path: "semantic.motion.",
171
- cssPrefix: "--tt-motion-",
172
- dtcgType: "string"
160
+ cssPrefix: "--tt-motion-"
173
161
  }, {
174
162
  path: "semantic.zIndex.layer.",
175
163
  cssPrefix: "--tt-z-index-",
@@ -179,7 +167,10 @@ var TOKEN_PATH_REGISTRY = [{
179
167
  var CSS_PATH_PREFIXES = TOKEN_PATH_REGISTRY.map(e => {
180
168
  return [e.path, e.cssPrefix];
181
169
  });
182
- /** Derived lookup table: `[path, dtcgType]` pairs. */
170
+ /**
171
+ * Derived lookup table: `[path, dtcgType]` pairs. `dtcgType` is `undefined` for
172
+ * opaque tokens — `toDTCG` omits `$type` when the matched entry has none.
173
+ */
183
174
  var DTCG_TYPE_PREFIXES = TOKEN_PATH_REGISTRY.map(e => {
184
175
  return [e.path, e.dtcgType];
185
176
  });
package/dist/vars.cjs CHANGED
@@ -2,9 +2,9 @@
2
2
  Object.defineProperty(exports, Symbol.toStringTag, {
3
3
  value: 'Module'
4
4
  });
5
- const require_helpers = require('./helpers-C29fy-Ad.cjs');
6
- const require_baseBundle = require('./baseBundle-BXvPJYzj.cjs');
7
- const require_toCssVars = require('./toCssVars-CUiqx2kh.cjs');
5
+ const require_helpers = require('./helpers-BU40JvFA.cjs');
6
+ const require_baseBundle = require('./baseBundle-DdRSa5mf.cjs');
7
+ const require_toCssVars = require('./toCssVars-BseqmMcT.cjs');
8
8
 
9
9
  //#region src/roots/toVars.ts
10
10
  /**
package/dist/vars.d.cts CHANGED
@@ -1,5 +1,5 @@
1
1
 
2
- import { i as ThemeTokens, n as SemanticTokens } from "./Types-BiBa17RL.cjs";
2
+ import { a as ThemeTokens, n as SemanticTokens } from "./Types-BkaxtsMv.cjs";
3
3
 
4
4
  //#region src/roots/toVars.d.ts
5
5
  /**
package/dist/vars.d.mts CHANGED
@@ -1,5 +1,5 @@
1
1
 
2
- import { i as ThemeTokens, n as SemanticTokens } from "./Types-BiBa17RL.mjs";
2
+ import { a as ThemeTokens, n as SemanticTokens } from "./Types-BkaxtsMv.mjs";
3
3
 
4
4
  //#region src/roots/toVars.d.ts
5
5
  /**
package/dist/vars.mjs CHANGED
@@ -1,7 +1,7 @@
1
1
  /** Powered by @ttoss/config. https://ttoss.dev/docs/modules/packages/config/ */
2
- import { o as isPlainObject } from "./helpers-CA4Qkxct.mjs";
3
- import { t as baseBundle } from "./baseBundle-BLvD8XVS.mjs";
4
- import { t as toCssVarName } from "./toCssVars-BHRiSykR.mjs";
2
+ import { o as isPlainObject } from "./helpers-BXaKe2s3.mjs";
3
+ import { t as baseBundle } from "./baseBundle-R7WyjyTw.mjs";
4
+ import { t as toCssVarName } from "./toCssVars-C-9yIZDR.mjs";
5
5
 
6
6
  //#region src/roots/toVars.ts
7
7
  /**
@@ -1,5 +1,5 @@
1
1
  /** Powered by @ttoss/config. https://ttoss.dev/docs/modules/packages/config/ */
2
- import { t as buildTheme } from "./createTheme-DzLnsknT.mjs";
2
+ import { t as buildTheme } from "./createTheme-B6tVIikC.mjs";
3
3
 
4
4
  //#region src/dataviz/baseTheme.ts
5
5
  /**
@@ -81,7 +81,7 @@ var semanticDataviz = {
81
81
  status: {
82
82
  missing: "{core.colors.neutral.200}",
83
83
  suppressed: "{core.colors.neutral.700}",
84
- na: "{core.colors.neutral.500}"
84
+ notApplicable: "{core.colors.neutral.500}"
85
85
  }
86
86
  },
87
87
  encoding: {
@@ -1,5 +1,5 @@
1
1
  /** Powered by @ttoss/config. https://ttoss.dev/docs/modules/packages/config/ */
2
- const require_createTheme = require('./createTheme-JOu16Shb.cjs');
2
+ const require_createTheme = require('./createTheme--UFgVlEn.cjs');
3
3
 
4
4
  //#region src/dataviz/baseTheme.ts
5
5
  /**
@@ -81,7 +81,7 @@ var semanticDataviz = {
81
81
  status: {
82
82
  missing: "{core.colors.neutral.200}",
83
83
  suppressed: "{core.colors.neutral.700}",
84
- na: "{core.colors.neutral.500}"
84
+ notApplicable: "{core.colors.neutral.500}"
85
85
  }
86
86
  },
87
87
  encoding: {