@ttoss/fsl-theme 1.1.22 → 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 +14 -12
  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-BWbICg4p.cjs → baseBundle-DdRSa5mf.cjs} +3 -2
  5. package/dist/{baseBundle-DiYlHNG5.mjs → baseBundle-R7WyjyTw.mjs} +3 -2
  6. package/dist/{createTheme-BHGc1IFI.cjs → createTheme--UFgVlEn.cjs} +34 -3
  7. package/dist/{createTheme-C1r5nJco.mjs → createTheme-B6tVIikC.mjs} +29 -4
  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-CIqeJ8yd.cjs → helpers-BU40JvFA.cjs} +27 -5
  21. package/dist/{helpers-Dz7NfNK6.mjs → helpers-BXaKe2s3.mjs} +27 -5
  22. package/dist/{index-BuszkWMy.d.mts → index-7YL90Xqs.d.cts} +9 -12
  23. package/dist/{index-Djro6G4e.d.cts → index-BmCTIOzh.d.mts} +9 -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-D2J482kx.d.mts → react-C8JrZf-b.d.mts} +14 -2
  29. package/dist/{react-BKLEzIN8.cjs → react-DLB8nrXQ.cjs} +18 -2
  30. package/dist/{react-BXqSYnmk.d.cts → react-Dt7vGAVG.d.cts} +14 -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 +18 -2
  35. package/dist/runtime-entry.cjs +1 -1
  36. package/dist/runtime-entry.mjs +1 -1
  37. package/dist/{ssrScript-DfmopH-w.mjs → ssrScript-DNLlLDps.mjs} +1 -1
  38. package/dist/{ssrScript-D3mYscp1.cjs → ssrScript-MF5SIONH.cjs} +1 -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-DDowz4wU.cjs → toCssVars-BseqmMcT.cjs} +27 -2
  44. package/dist/{toCssVars-CeckLjW1.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-CrgXLR5A.mjs → withDataviz-BvpZJnFx.mjs} +2 -2
  52. package/dist/{withDataviz-BzZwFV2e.cjs → withDataviz-CYRf4exT.cjs} +2 -2
  53. package/llms.txt +5 -5
  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-Dz7NfNK6.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-DfmopH-w.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
@@ -2,7 +2,7 @@
2
2
  Object.defineProperty(exports, Symbol.toStringTag, {
3
3
  value: 'Module'
4
4
  });
5
- const require_ssrScript = require('./ssrScript-D3mYscp1.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-DfmopH-w.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-Dz7NfNK6.mjs";
2
+ import { n as SAFE_ID_RE } from "./helpers-BXaKe2s3.mjs";
3
3
 
4
4
  //#region src/themeBootstrap.ts
5
5
  /**
@@ -1,5 +1,5 @@
1
1
  /** Powered by @ttoss/config. https://ttoss.dev/docs/modules/packages/config/ */
2
- const require_helpers = require('./helpers-CIqeJ8yd.cjs');
2
+ const require_helpers = require('./helpers-BU40JvFA.cjs');
3
3
 
4
4
  //#region src/themeBootstrap.ts
5
5
  /**
@@ -2,9 +2,9 @@
2
2
  Object.defineProperty(exports, Symbol.toStringTag, {
3
3
  value: 'Module'
4
4
  });
5
- const require_createTheme = require('../createTheme-BHGc1IFI.cjs');
6
- const require_helpers = require('../helpers-CIqeJ8yd.cjs');
7
- const require_withDataviz = require('../withDataviz-BzZwFV2e.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-Djro6G4e.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-BuszkWMy.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-C1r5nJco.mjs";
3
- import { r as deepMerge } from "../helpers-Dz7NfNK6.mjs";
4
- import { t as withDataviz } from "../withDataviz-CrgXLR5A.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-CIqeJ8yd.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-Dz7NfNK6.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-CIqeJ8yd.cjs');
6
- const require_baseBundle = require('./baseBundle-BWbICg4p.cjs');
7
- const require_toCssVars = require('./toCssVars-DDowz4wU.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-Dz7NfNK6.mjs";
3
- import { t as baseBundle } from "./baseBundle-DiYlHNG5.mjs";
4
- import { t as toCssVarName } from "./toCssVars-CeckLjW1.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-C1r5nJco.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-BHGc1IFI.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: {
package/llms.txt CHANGED
@@ -9,7 +9,7 @@ This file is the LLM-facing guide for using the package in an external applicati
9
9
  ## Entry points
10
10
 
11
11
  ```ts
12
- import { createTheme, baseTheme, bruttal, corporate, oca, ventures } from '@ttoss/fsl-theme';
12
+ import { createTheme, baseTheme, bruttal } from '@ttoss/fsl-theme';
13
13
  import { ThemeProvider, useColorMode, useResolvedTokens } from '@ttoss/fsl-theme/react';
14
14
  import { vars } from '@ttoss/fsl-theme/vars'; // typed CSS var(--tt-*) refs — CSS environments
15
15
  import { toCssVarName } from '@ttoss/fsl-theme/css'; // raw --tt-* names — tooling / PostCSS
@@ -46,7 +46,7 @@ export function App() {
46
46
  **Built-in themes** — extend instead of building from scratch:
47
47
 
48
48
  ```ts
49
- import { bruttal, corporate, oca, ventures } from '@ttoss/fsl-theme';
49
+ import { bruttal } from '@ttoss/fsl-theme';
50
50
  // Use directly as-is:
51
51
  <ThemeProvider theme={bruttal}>...</ThemeProvider>
52
52
  // Or extend with brand overrides:
@@ -614,7 +614,7 @@ const theme = createTheme({
614
614
  ```
615
615
 
616
616
  - Default: `createTheme()` returns the built-in `baseTheme` + built-in `darkAlternate`.
617
- - `extends`: inherit from a built-in (`bruttal`, `corporate`, `oca`, `ventures`).
617
+ - `extends`: inherit from a built-in (`bruttal`).
618
618
  - `alternate: null`: opt out of dark mode entirely (single-mode theme).
619
619
 
620
620
  ## Intent → override map
@@ -636,7 +636,7 @@ createTheme({
636
636
  - All semantic tokens that reference `{core.colors.brand.*}` automatically pick up the new values. No semantic remap needed unless contrast breaks.
637
637
  - For dark mode, the built-in `darkAlternate` already remaps semantic references to lighter brand steps — usually no extra work.
638
638
 
639
- **Reference patterns:** `corporate.ts`, `oca.ts`, `ventures.ts` are minimal brand-only overrides.
639
+ **Reference pattern:** `bruttal.ts` shows a full brand customization (palette + geometry + surface model + dark alternate). A brand-hue-only override is insufficient on its own — see the `brand.500` contrast invariant above.
640
640
 
641
641
  ### Adjust density
642
642
 
@@ -727,5 +727,5 @@ Cross-token semantic correctness (the rules above) is **not** statically validat
727
727
 
728
728
  - README — full grammar tables, usage examples per import path
729
729
  - `dist/Types-*.d.ts` — every token has co-located JSDoc with semantics + anti-pattern notes
730
- - `src/themes/{bruttal,corporate,oca,ventures}.ts` — worked customization patterns
730
+ - `src/themes/bruttal.ts` — worked customization pattern
731
731
  - Family specs (full grammar, decision matrices, ADRs): `docs/design/design-system/design-tokens/families/{family}.md` in the ttoss monorepo
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ttoss/fsl-theme",
3
- "version": "1.1.22",
3
+ "version": "2.0.0",
4
4
  "description": "ttoss theme provider for UI.",
5
5
  "keywords": [
6
6
  "css-variables",