@vellira-ui/tokens 2.98.6 → 2.99.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 (155) hide show
  1. package/dist/css/tokens.css +171 -213
  2. package/dist/dark/components/contextMenu.d.ts +13 -3
  3. package/dist/dark/components/contextMenu.d.ts.map +1 -1
  4. package/dist/dark/components/contextMenu.js +0 -2
  5. package/dist/dark/components/dropdown.d.ts +20 -10
  6. package/dist/dark/components/dropdown.d.ts.map +1 -1
  7. package/dist/dark/components/dropdown.js +6 -5
  8. package/dist/dark/components/input.d.ts +1 -1
  9. package/dist/dark/components/input.js +4 -4
  10. package/dist/dark/components/modal.d.ts +16 -7
  11. package/dist/dark/components/modal.d.ts.map +1 -1
  12. package/dist/dark/components/modal.js +1 -3
  13. package/dist/dark/components/popover.d.ts +5 -25
  14. package/dist/dark/components/popover.d.ts.map +1 -1
  15. package/dist/dark/components/popover.js +0 -4
  16. package/dist/dark/components/radio.js +1 -1
  17. package/dist/dark/components/select.d.ts +9 -2
  18. package/dist/dark/components/select.d.ts.map +1 -1
  19. package/dist/dark/components/select.js +5 -5
  20. package/dist/dark/components/tooltip.d.ts.map +1 -1
  21. package/dist/dark/components/tooltip.js +0 -2
  22. package/dist/dark/semantic/action.d.ts +2 -2
  23. package/dist/dark/semantic/action.js +2 -2
  24. package/dist/dark/semantic/border.d.ts +1 -1
  25. package/dist/dark/semantic/border.js +1 -1
  26. package/dist/dark/semantic/control.js +1 -1
  27. package/dist/dark/semantic/focus.d.ts +1 -1
  28. package/dist/dark/semantic/focus.js +1 -1
  29. package/dist/dark/semantic/icons.d.ts +2 -2
  30. package/dist/dark/semantic/icons.js +2 -2
  31. package/dist/dark/semantic/index.d.ts +0 -1
  32. package/dist/dark/semantic/index.d.ts.map +1 -1
  33. package/dist/dark/semantic/index.js +0 -1
  34. package/dist/dark/semantic/overlay.d.ts +2 -2
  35. package/dist/dark/semantic/overlay.js +2 -2
  36. package/dist/dark/semantic/status.d.ts +6 -6
  37. package/dist/dark/semantic/status.js +6 -6
  38. package/dist/dark/semantic/surface.d.ts +1 -1
  39. package/dist/dark/semantic/surface.js +1 -1
  40. package/dist/dark/semantic/text.d.ts +2 -2
  41. package/dist/dark/semantic/text.js +2 -2
  42. package/dist/factories/componentFocusRing.d.ts +15 -0
  43. package/dist/factories/componentFocusRing.d.ts.map +1 -0
  44. package/dist/factories/componentFocusRing.js +7 -0
  45. package/dist/factories/createContextMenuTokens.d.ts +50 -18
  46. package/dist/factories/createContextMenuTokens.d.ts.map +1 -1
  47. package/dist/factories/createContextMenuTokens.js +6 -5
  48. package/dist/factories/createModalTokens.d.ts +41 -21
  49. package/dist/factories/createModalTokens.d.ts.map +1 -1
  50. package/dist/factories/createModalTokens.js +8 -9
  51. package/dist/factories/createPopoverTokens.d.ts +12 -20
  52. package/dist/factories/createPopoverTokens.d.ts.map +1 -1
  53. package/dist/factories/createPopoverTokens.js +5 -9
  54. package/dist/factories/createTooltipTokens.d.ts +4 -7
  55. package/dist/factories/createTooltipTokens.d.ts.map +1 -1
  56. package/dist/factories/createTooltipTokens.js +4 -4
  57. package/dist/generated/token-types.d.ts +7 -6
  58. package/dist/generated/token-types.d.ts.map +1 -1
  59. package/dist/generated/token-types.js +176 -248
  60. package/dist/highContrast/components/contextMenu.d.ts +13 -3
  61. package/dist/highContrast/components/contextMenu.d.ts.map +1 -1
  62. package/dist/highContrast/components/contextMenu.js +0 -2
  63. package/dist/highContrast/components/dropdown.d.ts +19 -9
  64. package/dist/highContrast/components/dropdown.d.ts.map +1 -1
  65. package/dist/highContrast/components/dropdown.js +6 -5
  66. package/dist/highContrast/components/input.d.ts +4 -4
  67. package/dist/highContrast/components/input.js +4 -4
  68. package/dist/highContrast/components/modal.d.ts +16 -7
  69. package/dist/highContrast/components/modal.d.ts.map +1 -1
  70. package/dist/highContrast/components/modal.js +0 -2
  71. package/dist/highContrast/components/popover.d.ts +5 -25
  72. package/dist/highContrast/components/popover.d.ts.map +1 -1
  73. package/dist/highContrast/components/popover.js +0 -4
  74. package/dist/highContrast/components/radio.js +1 -1
  75. package/dist/highContrast/components/select.d.ts +10 -3
  76. package/dist/highContrast/components/select.d.ts.map +1 -1
  77. package/dist/highContrast/components/select.js +5 -5
  78. package/dist/highContrast/components/tooltip.d.ts.map +1 -1
  79. package/dist/highContrast/components/tooltip.js +0 -2
  80. package/dist/highContrast/semantic/action.d.ts +2 -2
  81. package/dist/highContrast/semantic/action.js +2 -2
  82. package/dist/highContrast/semantic/border.d.ts +1 -1
  83. package/dist/highContrast/semantic/border.js +1 -1
  84. package/dist/highContrast/semantic/focus.d.ts +1 -1
  85. package/dist/highContrast/semantic/focus.js +1 -1
  86. package/dist/highContrast/semantic/icons.d.ts +4 -4
  87. package/dist/highContrast/semantic/icons.js +4 -4
  88. package/dist/highContrast/semantic/index.d.ts +0 -1
  89. package/dist/highContrast/semantic/index.d.ts.map +1 -1
  90. package/dist/highContrast/semantic/index.js +0 -1
  91. package/dist/highContrast/semantic/overlay.d.ts +2 -2
  92. package/dist/highContrast/semantic/overlay.js +2 -2
  93. package/dist/highContrast/semantic/status.d.ts +4 -4
  94. package/dist/highContrast/semantic/status.js +4 -4
  95. package/dist/highContrast/semantic/surface.d.ts +1 -1
  96. package/dist/highContrast/semantic/surface.js +1 -1
  97. package/dist/light/components/contextMenu.d.ts +13 -3
  98. package/dist/light/components/contextMenu.d.ts.map +1 -1
  99. package/dist/light/components/contextMenu.js +0 -2
  100. package/dist/light/components/dropdown.d.ts +19 -9
  101. package/dist/light/components/dropdown.d.ts.map +1 -1
  102. package/dist/light/components/dropdown.js +6 -5
  103. package/dist/light/components/input.js +4 -4
  104. package/dist/light/components/modal.d.ts +16 -7
  105. package/dist/light/components/modal.d.ts.map +1 -1
  106. package/dist/light/components/modal.js +0 -2
  107. package/dist/light/components/popover.d.ts +5 -25
  108. package/dist/light/components/popover.d.ts.map +1 -1
  109. package/dist/light/components/popover.js +0 -4
  110. package/dist/light/components/radio.js +1 -1
  111. package/dist/light/components/select.d.ts +9 -2
  112. package/dist/light/components/select.d.ts.map +1 -1
  113. package/dist/light/components/select.js +5 -5
  114. package/dist/light/components/tooltip.d.ts.map +1 -1
  115. package/dist/light/components/tooltip.js +0 -2
  116. package/dist/light/semantic/action.d.ts +2 -2
  117. package/dist/light/semantic/action.js +2 -2
  118. package/dist/light/semantic/border.d.ts +1 -1
  119. package/dist/light/semantic/border.js +1 -1
  120. package/dist/light/semantic/focus.d.ts +1 -1
  121. package/dist/light/semantic/focus.js +1 -1
  122. package/dist/light/semantic/icons.d.ts +2 -2
  123. package/dist/light/semantic/icons.js +2 -2
  124. package/dist/light/semantic/index.d.ts +0 -1
  125. package/dist/light/semantic/index.d.ts.map +1 -1
  126. package/dist/light/semantic/index.js +0 -1
  127. package/dist/light/semantic/menu.js +1 -1
  128. package/dist/light/semantic/overlay.d.ts +2 -2
  129. package/dist/light/semantic/overlay.js +2 -2
  130. package/dist/light/semantic/status.d.ts +4 -4
  131. package/dist/light/semantic/status.js +4 -4
  132. package/dist/light/semantic/surface.d.ts +1 -1
  133. package/dist/light/semantic/surface.js +1 -1
  134. package/dist/platform-output/component-token-intents.d.ts +71 -0
  135. package/dist/platform-output/component-token-intents.d.ts.map +1 -0
  136. package/dist/platform-output/component-token-intents.js +110 -0
  137. package/dist/platform-output/component-token-web-compatibility.d.ts +32 -0
  138. package/dist/platform-output/component-token-web-compatibility.d.ts.map +1 -0
  139. package/dist/platform-output/component-token-web-compatibility.js +40 -0
  140. package/dist/preservation/token-migrations.d.ts +208 -13
  141. package/dist/preservation/token-migrations.d.ts.map +1 -1
  142. package/dist/preservation/token-migrations.js +332 -30
  143. package/dist/token-architecture.d.ts +56 -10
  144. package/dist/token-architecture.d.ts.map +1 -1
  145. package/dist/token-architecture.js +129 -20
  146. package/package.json +1 -1
  147. package/dist/dark/semantic/navigation.d.ts +0 -34
  148. package/dist/dark/semantic/navigation.d.ts.map +0 -1
  149. package/dist/dark/semantic/navigation.js +0 -37
  150. package/dist/highContrast/semantic/navigation.d.ts +0 -34
  151. package/dist/highContrast/semantic/navigation.d.ts.map +0 -1
  152. package/dist/highContrast/semantic/navigation.js +0 -36
  153. package/dist/light/semantic/navigation.d.ts +0 -34
  154. package/dist/light/semantic/navigation.d.ts.map +0 -1
  155. package/dist/light/semantic/navigation.js +0 -37
@@ -5,27 +5,27 @@ export const status = {
5
5
  bg: 'rgba(52, 211, 153, 0.14)',
6
6
  border: colors.success[400],
7
7
  ring: colors.success[300],
8
- strong: colors.success[600],
8
+ emphasisFg: colors.success[600],
9
9
  },
10
10
  error: {
11
11
  fg: colors.error[400],
12
12
  bg: 'rgba(251, 113, 133, 0.16)',
13
13
  border: colors.error[400],
14
14
  ring: colors.error[400],
15
- strong: colors.error[600],
15
+ emphasisFg: colors.error[600],
16
16
  },
17
17
  warning: {
18
18
  fg: colors.warning[400],
19
19
  bg: 'rgba(251, 191, 36, 0.14)',
20
20
  border: colors.warning[400],
21
- ring: colors.error[400],
22
- strong: colors.warning[600],
21
+ ring: colors.warning[300],
22
+ emphasisFg: colors.warning[600],
23
23
  },
24
24
  info: {
25
25
  fg: colors.info[200],
26
26
  bg: 'rgba(56, 189, 248, 0.14)',
27
27
  border: colors.info[200],
28
- ring: colors.error[400],
29
- strong: colors.info[500],
28
+ ring: colors.info[200],
29
+ emphasisFg: colors.info[500],
30
30
  },
31
31
  };
@@ -1,10 +1,10 @@
1
1
  export declare const surface: {
2
2
  readonly canvas: "#000000";
3
3
  readonly default: "#181521";
4
+ readonly panel: "#181521";
4
5
  readonly muted: "#231F31";
5
6
  readonly subtle: "#242034";
6
7
  readonly elevated: "#2F2A42";
7
- readonly background: "#181521";
8
8
  readonly hover: "#2F2A42";
9
9
  readonly active: "#3D3754";
10
10
  readonly pressed: "#4F4867";
@@ -3,10 +3,10 @@ import { withAlpha } from '../../utils/color.js';
3
3
  export const surface = {
4
4
  canvas: colors.mono[950],
5
5
  default: colors.vellira[950],
6
+ panel: colors.vellira[950],
6
7
  muted: colors.vellira[900],
7
8
  subtle: colors.vellira[850],
8
9
  elevated: colors.vellira[800],
9
- background: colors.vellira[950],
10
10
  hover: colors.vellira[800],
11
11
  active: colors.vellira[700],
12
12
  pressed: colors.vellira[600],
@@ -1,8 +1,8 @@
1
1
  export declare const text: {
2
2
  readonly primary: "#F4F1FB";
3
3
  readonly secondary: "#BBB2D2";
4
- readonly muted: "#958CB0";
5
- readonly subtle: "#9CA3AF";
4
+ readonly muted: "#9CA3AF";
5
+ readonly subtle: "#958CB0";
6
6
  readonly disabled: "#6B6386";
7
7
  readonly brand: "#B8A8FF";
8
8
  readonly interactive: "#B8A8FF";
@@ -2,8 +2,8 @@ import { colors } from '../../primitives/colors.js';
2
2
  export const text = {
3
3
  primary: colors.vellira[100],
4
4
  secondary: colors.vellira[300],
5
- muted: colors.vellira[400],
6
- subtle: colors.mono[500],
5
+ muted: colors.mono[500],
6
+ subtle: colors.vellira[400],
7
7
  disabled: colors.vellira[500],
8
8
  brand: colors.primary[300],
9
9
  interactive: colors.primary[300],
@@ -0,0 +1,15 @@
1
+ export type SemanticFocusRing = {
2
+ readonly color: string;
3
+ readonly width: string;
4
+ readonly offsetColor: string;
5
+ };
6
+ export declare const createComponentFocusRing: (ring: SemanticFocusRing) => {
7
+ readonly color: string;
8
+ readonly width: string;
9
+ readonly shadow: Readonly<{
10
+ kind: "shadow";
11
+ role: "focus-ring";
12
+ }>;
13
+ readonly offset: string;
14
+ };
15
+ //# sourceMappingURL=componentFocusRing.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"componentFocusRing.d.ts","sourceRoot":"","sources":["../../src/factories/componentFocusRing.ts"],"names":[],"mappings":"AAEA,MAAM,MAAM,iBAAiB,GAAG;IAC9B,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;IACvB,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;IACvB,QAAQ,CAAC,WAAW,EAAE,MAAM,CAAC;CAC9B,CAAC;AAEF,eAAO,MAAM,wBAAwB,GAAI,MAAM,iBAAiB;;;;;;;;CAMnD,CAAC"}
@@ -0,0 +1,7 @@
1
+ import { createComponentFocusRingShadowIntent } from '../platform-output/component-token-intents.js';
2
+ export const createComponentFocusRing = (ring) => ({
3
+ color: ring.color,
4
+ width: ring.width,
5
+ shadow: createComponentFocusRingShadowIntent(),
6
+ offset: ring.offsetColor,
7
+ });
@@ -1,3 +1,4 @@
1
+ import { createComponentFocusRing, type SemanticFocusRing } from './componentFocusRing.js';
1
2
  type ContextMenuState = {
2
3
  readonly bg: string;
3
4
  readonly fg: string;
@@ -8,16 +9,10 @@ type ContextMenuDangerStates = {
8
9
  readonly active: ContextMenuState;
9
10
  readonly disabled: ContextMenuState;
10
11
  };
11
- type ContextMenuFocusRing = {
12
- readonly color: string;
13
- readonly width: string;
14
- readonly shadow: string;
15
- readonly offset: string;
16
- };
12
+ type ContextMenuFocusRing = ReturnType<typeof createComponentFocusRing>;
17
13
  type ContextMenuTokensConfig = {
18
14
  contentBg: string;
19
15
  contentBorder: string;
20
- contentShadow: string;
21
16
  itemDefault: ContextMenuState;
22
17
  itemHover: ContextMenuState;
23
18
  itemActive: ContextMenuState;
@@ -35,7 +30,7 @@ type ContextMenuTokensConfig = {
35
30
  };
36
31
  export type ContextMenuThemeSemantics = {
37
32
  focus: {
38
- ring: ContextMenuFocusRing;
33
+ ring: SemanticFocusRing;
39
34
  };
40
35
  menu: {
41
36
  background: string;
@@ -49,9 +44,6 @@ export type ContextMenuThemeSemantics = {
49
44
  danger: ContextMenuDangerStates;
50
45
  };
51
46
  };
52
- shadow: {
53
- lg: string;
54
- };
55
47
  text: {
56
48
  interactive: string;
57
49
  interactiveHover: string;
@@ -63,7 +55,11 @@ export declare const createContextMenuTokens: (config: ContextMenuTokensConfig)
63
55
  readonly content: {
64
56
  readonly bg: string;
65
57
  readonly border: string;
66
- readonly shadow: string;
58
+ readonly shadow: Readonly<{
59
+ kind: "shadow";
60
+ role: "elevation";
61
+ level: import("../platform-output/component-token-intents.js").ComponentShadowLevel;
62
+ }>;
67
63
  };
68
64
  readonly item: {
69
65
  readonly default: ContextMenuState;
@@ -75,7 +71,15 @@ export declare const createContextMenuTokens: (config: ContextMenuTokensConfig)
75
71
  };
76
72
  readonly pressed: ContextMenuState;
77
73
  readonly focus: {
78
- readonly ring: ContextMenuFocusRing;
74
+ readonly ring: {
75
+ readonly color: string;
76
+ readonly width: string;
77
+ readonly shadow: Readonly<{
78
+ kind: "shadow";
79
+ role: "focus-ring";
80
+ }>;
81
+ readonly offset: string;
82
+ };
79
83
  };
80
84
  readonly disabled: ContextMenuState;
81
85
  readonly danger: ContextMenuDangerStates;
@@ -96,7 +100,15 @@ export declare const createContextMenuTokens: (config: ContextMenuTokensConfig)
96
100
  readonly bg: "transparent";
97
101
  readonly fg: string;
98
102
  readonly border: "transparent";
99
- readonly ring: ContextMenuFocusRing;
103
+ readonly ring: {
104
+ readonly color: string;
105
+ readonly width: string;
106
+ readonly shadow: Readonly<{
107
+ kind: "shadow";
108
+ role: "focus-ring";
109
+ }>;
110
+ readonly offset: string;
111
+ };
100
112
  };
101
113
  readonly disabled: {
102
114
  readonly bg: "transparent";
@@ -108,11 +120,15 @@ export declare const createContextMenuTokens: (config: ContextMenuTokensConfig)
108
120
  readonly fg: string;
109
121
  };
110
122
  };
111
- export declare const createContextMenuTokensFromSemantics: ({ focus, menu, shadow, text, }: ContextMenuThemeSemantics) => {
123
+ export declare const createContextMenuTokensFromSemantics: ({ focus, menu, text, }: ContextMenuThemeSemantics) => {
112
124
  readonly content: {
113
125
  readonly bg: string;
114
126
  readonly border: string;
115
- readonly shadow: string;
127
+ readonly shadow: Readonly<{
128
+ kind: "shadow";
129
+ role: "elevation";
130
+ level: import("../platform-output/component-token-intents.js").ComponentShadowLevel;
131
+ }>;
116
132
  };
117
133
  readonly item: {
118
134
  readonly default: ContextMenuState;
@@ -124,7 +140,15 @@ export declare const createContextMenuTokensFromSemantics: ({ focus, menu, shado
124
140
  };
125
141
  readonly pressed: ContextMenuState;
126
142
  readonly focus: {
127
- readonly ring: ContextMenuFocusRing;
143
+ readonly ring: {
144
+ readonly color: string;
145
+ readonly width: string;
146
+ readonly shadow: Readonly<{
147
+ kind: "shadow";
148
+ role: "focus-ring";
149
+ }>;
150
+ readonly offset: string;
151
+ };
128
152
  };
129
153
  readonly disabled: ContextMenuState;
130
154
  readonly danger: ContextMenuDangerStates;
@@ -145,7 +169,15 @@ export declare const createContextMenuTokensFromSemantics: ({ focus, menu, shado
145
169
  readonly bg: "transparent";
146
170
  readonly fg: string;
147
171
  readonly border: "transparent";
148
- readonly ring: ContextMenuFocusRing;
172
+ readonly ring: {
173
+ readonly color: string;
174
+ readonly width: string;
175
+ readonly shadow: Readonly<{
176
+ kind: "shadow";
177
+ role: "focus-ring";
178
+ }>;
179
+ readonly offset: string;
180
+ };
149
181
  };
150
182
  readonly disabled: {
151
183
  readonly bg: "transparent";
@@ -1 +1 @@
1
- {"version":3,"file":"createContextMenuTokens.d.ts","sourceRoot":"","sources":["../../src/factories/createContextMenuTokens.ts"],"names":[],"mappings":"AAAA,KAAK,gBAAgB,GAAG;IACtB,QAAQ,CAAC,EAAE,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,EAAE,MAAM,CAAC;CACrB,CAAC;AAEF,KAAK,uBAAuB,GAAG;IAC7B,QAAQ,CAAC,OAAO,EAAE,gBAAgB,CAAC;IACnC,QAAQ,CAAC,KAAK,EAAE,gBAAgB,CAAC;IACjC,QAAQ,CAAC,MAAM,EAAE,gBAAgB,CAAC;IAClC,QAAQ,CAAC,QAAQ,EAAE,gBAAgB,CAAC;CACrC,CAAC;AAEF,KAAK,oBAAoB,GAAG;IAC1B,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;IACvB,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;IACvB,QAAQ,CAAC,MAAM,EAAE,MAAM,CAAC;IACxB,QAAQ,CAAC,MAAM,EAAE,MAAM,CAAC;CACzB,CAAC;AAEF,KAAK,uBAAuB,GAAG;IAC7B,SAAS,EAAE,MAAM,CAAC;IAClB,aAAa,EAAE,MAAM,CAAC;IACtB,aAAa,EAAE,MAAM,CAAC;IACtB,WAAW,EAAE,gBAAgB,CAAC;IAC9B,SAAS,EAAE,gBAAgB,CAAC;IAC5B,UAAU,EAAE,gBAAgB,CAAC;IAC7B,WAAW,EAAE,gBAAgB,CAAC;IAC9B,aAAa,EAAE,oBAAoB,CAAC;IACpC,YAAY,EAAE,gBAAgB,CAAC;IAC/B,UAAU,EAAE,uBAAuB,CAAC;IACpC,gBAAgB,EAAE,MAAM,CAAC;IACzB,cAAc,EAAE,MAAM,CAAC;IACvB,cAAc,EAAE,MAAM,CAAC;IACvB,cAAc,EAAE,MAAM,CAAC;IACvB,gBAAgB,EAAE,oBAAoB,CAAC;IACvC,iBAAiB,EAAE,MAAM,CAAC;IAC1B,YAAY,EAAE,MAAM,CAAC;CACtB,CAAC;AAEF,MAAM,MAAM,yBAAyB,GAAG;IACtC,KAAK,EAAE;QACL,IAAI,EAAE,oBAAoB,CAAC;KAC5B,CAAC;IACF,IAAI,EAAE;QACJ,UAAU,EAAE,MAAM,CAAC;QACnB,MAAM,EAAE,MAAM,CAAC;QACf,IAAI,EAAE;YACJ,OAAO,EAAE,gBAAgB,CAAC;YAC1B,KAAK,EAAE,gBAAgB,CAAC;YACxB,MAAM,EAAE,gBAAgB,CAAC;YACzB,OAAO,EAAE,gBAAgB,CAAC;YAC1B,QAAQ,EAAE,gBAAgB,CAAC;YAC3B,MAAM,EAAE,uBAAuB,CAAC;SACjC,CAAC;KACH,CAAC;IACF,MAAM,EAAE;QACN,EAAE,EAAE,MAAM,CAAC;KACZ,CAAC;IACF,IAAI,EAAE;QACJ,WAAW,EAAE,MAAM,CAAC;QACpB,gBAAgB,EAAE,MAAM,CAAC;QACzB,QAAQ,EAAE,MAAM,CAAC;QACjB,SAAS,EAAE,MAAM,CAAC;KACnB,CAAC;CACH,CAAC;AAEF,eAAO,MAAM,uBAAuB,GAAI,QAAQ,uBAAuB;;;;;;;;;;;yBAjExD,MAAM;yBACN,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAmHR,CAAC;AAEd,eAAO,MAAM,oCAAoC,GAAI,gCAKlD,yBAAyB;;;;;;;;;;;yBA3Hb,MAAM;yBACN,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA6IjB,CAAC"}
1
+ {"version":3,"file":"createContextMenuTokens.d.ts","sourceRoot":"","sources":["../../src/factories/createContextMenuTokens.ts"],"names":[],"mappings":"AAEA,OAAO,EACL,wBAAwB,EACxB,KAAK,iBAAiB,EACvB,MAAM,yBAAyB,CAAC;AAEjC,KAAK,gBAAgB,GAAG;IACtB,QAAQ,CAAC,EAAE,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,EAAE,MAAM,CAAC;CACrB,CAAC;AAEF,KAAK,uBAAuB,GAAG;IAC7B,QAAQ,CAAC,OAAO,EAAE,gBAAgB,CAAC;IACnC,QAAQ,CAAC,KAAK,EAAE,gBAAgB,CAAC;IACjC,QAAQ,CAAC,MAAM,EAAE,gBAAgB,CAAC;IAClC,QAAQ,CAAC,QAAQ,EAAE,gBAAgB,CAAC;CACrC,CAAC;AAEF,KAAK,oBAAoB,GAAG,UAAU,CAAC,OAAO,wBAAwB,CAAC,CAAC;AAExE,KAAK,uBAAuB,GAAG;IAC7B,SAAS,EAAE,MAAM,CAAC;IAClB,aAAa,EAAE,MAAM,CAAC;IACtB,WAAW,EAAE,gBAAgB,CAAC;IAC9B,SAAS,EAAE,gBAAgB,CAAC;IAC5B,UAAU,EAAE,gBAAgB,CAAC;IAC7B,WAAW,EAAE,gBAAgB,CAAC;IAC9B,aAAa,EAAE,oBAAoB,CAAC;IACpC,YAAY,EAAE,gBAAgB,CAAC;IAC/B,UAAU,EAAE,uBAAuB,CAAC;IACpC,gBAAgB,EAAE,MAAM,CAAC;IACzB,cAAc,EAAE,MAAM,CAAC;IACvB,cAAc,EAAE,MAAM,CAAC;IACvB,cAAc,EAAE,MAAM,CAAC;IACvB,gBAAgB,EAAE,oBAAoB,CAAC;IACvC,iBAAiB,EAAE,MAAM,CAAC;IAC1B,YAAY,EAAE,MAAM,CAAC;CACtB,CAAC;AAEF,MAAM,MAAM,yBAAyB,GAAG;IACtC,KAAK,EAAE;QACL,IAAI,EAAE,iBAAiB,CAAC;KACzB,CAAC;IACF,IAAI,EAAE;QACJ,UAAU,EAAE,MAAM,CAAC;QACnB,MAAM,EAAE,MAAM,CAAC;QACf,IAAI,EAAE;YACJ,OAAO,EAAE,gBAAgB,CAAC;YAC1B,KAAK,EAAE,gBAAgB,CAAC;YACxB,MAAM,EAAE,gBAAgB,CAAC;YACzB,OAAO,EAAE,gBAAgB,CAAC;YAC1B,QAAQ,EAAE,gBAAgB,CAAC;YAC3B,MAAM,EAAE,uBAAuB,CAAC;SACjC,CAAC;KACH,CAAC;IACF,IAAI,EAAE;QACJ,WAAW,EAAE,MAAM,CAAC;QACpB,gBAAgB,EAAE,MAAM,CAAC;QACzB,QAAQ,EAAE,MAAM,CAAC;QACjB,SAAS,EAAE,MAAM,CAAC;KACnB,CAAC;CACH,CAAC;AAEF,eAAO,MAAM,uBAAuB,GAAI,QAAQ,uBAAuB;;;;;;;;;;;;;;;yBAxDxD,MAAM;yBACN,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA0GR,CAAC;AAEd,eAAO,MAAM,oCAAoC,GAAI,wBAIlD,yBAAyB;;;;;;;;;;;;;;;yBAjHb,MAAM;yBACN,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAkIjB,CAAC"}
@@ -1,8 +1,10 @@
1
+ import { createComponentShadowIntent } from '../platform-output/component-token-intents.js';
2
+ import { createComponentFocusRing, } from './componentFocusRing.js';
1
3
  export const createContextMenuTokens = (config) => ({
2
4
  content: {
3
5
  bg: config.contentBg,
4
6
  border: config.contentBorder,
5
- shadow: config.contentShadow,
7
+ shadow: createComponentShadowIntent('lg'),
6
8
  },
7
9
  item: {
8
10
  default: config.itemDefault,
@@ -46,22 +48,21 @@ export const createContextMenuTokens = (config) => ({
46
48
  fg: config.groupLabelFg,
47
49
  },
48
50
  });
49
- export const createContextMenuTokensFromSemantics = ({ focus, menu, shadow, text, }) => createContextMenuTokens({
51
+ export const createContextMenuTokensFromSemantics = ({ focus, menu, text, }) => createContextMenuTokens({
50
52
  contentBg: menu.background,
51
53
  contentBorder: menu.border,
52
- contentShadow: shadow.lg,
53
54
  itemDefault: menu.item.default,
54
55
  itemHover: menu.item.hover,
55
56
  itemActive: menu.item.active,
56
57
  itemPressed: menu.item.pressed,
57
- itemFocusRing: focus.ring,
58
+ itemFocusRing: createComponentFocusRing(focus.ring),
58
59
  itemDisabled: menu.item.disabled,
59
60
  itemDanger: menu.item.danger,
60
61
  triggerDefaultFg: text.interactive,
61
62
  triggerHoverBg: menu.item.hover.bg,
62
63
  triggerHoverFg: text.interactiveHover,
63
64
  triggerFocusFg: text.interactive,
64
- triggerFocusRing: focus.ring,
65
+ triggerFocusRing: createComponentFocusRing(focus.ring),
65
66
  triggerDisabledFg: text.disabled,
66
67
  groupLabelFg: text.secondary,
67
68
  });
@@ -1,15 +1,10 @@
1
- type ModalFocusRing = {
2
- color: string;
3
- width: string;
4
- shadow: string;
5
- offset: string;
6
- };
1
+ import { createComponentFocusRing, type SemanticFocusRing } from './componentFocusRing.js';
2
+ type ModalFocusRing = ReturnType<typeof createComponentFocusRing>;
7
3
  type ModalTokensConfig = {
8
4
  overlayBg: string;
9
5
  contentBg: string;
10
6
  contentFg: string;
11
7
  contentBorder: string;
12
- contentShadow: string;
13
8
  titleFg: string;
14
9
  descriptionFg: string;
15
10
  closeButtonDefaultFg: string;
@@ -31,11 +26,11 @@ export type ModalThemeSemantics = {
31
26
  closeButtonHoverBg?: string;
32
27
  closeButtonPressedBg?: string;
33
28
  focus: {
34
- ring: ModalFocusRing;
29
+ ring: SemanticFocusRing;
35
30
  };
36
31
  overlay: {
37
32
  backdrop: string;
38
- modal: {
33
+ dialog: {
39
34
  bg: string;
40
35
  border: string;
41
36
  };
@@ -44,9 +39,6 @@ export type ModalThemeSemantics = {
44
39
  lg: number;
45
40
  full: number;
46
41
  };
47
- shadow: {
48
- xl: string;
49
- };
50
42
  spacing: {
51
43
  1: number;
52
44
  3: number;
@@ -74,14 +66,20 @@ export declare const createModalTokens: (config: ModalTokensConfig) => {
74
66
  readonly bg: string;
75
67
  readonly fg: string;
76
68
  readonly border: string;
77
- readonly shadow: string;
69
+ readonly shadow: Readonly<{
70
+ kind: "shadow";
71
+ role: "elevation";
72
+ level: import("../platform-output/component-token-intents.js").ComponentShadowLevel;
73
+ }>;
78
74
  readonly borderWidth: 1;
79
75
  readonly radius: number;
80
76
  readonly padding: number;
81
77
  readonly gap: number;
82
78
  readonly minWidth: 320;
83
- readonly maxHeight: "90vh";
84
- readonly nativeMaxHeight: "90%";
79
+ readonly maxHeight: Readonly<{
80
+ kind: "viewport-height";
81
+ ratio: number;
82
+ }>;
85
83
  readonly viewportMargin: number;
86
84
  readonly topOffset: number;
87
85
  readonly zIndexOffset: 1;
@@ -131,7 +129,15 @@ export declare const createModalTokens: (config: ModalTokensConfig) => {
131
129
  readonly border: "transparent";
132
130
  };
133
131
  readonly focus: {
134
- readonly ring: ModalFocusRing;
132
+ readonly ring: {
133
+ readonly color: string;
134
+ readonly width: string;
135
+ readonly shadow: Readonly<{
136
+ kind: "shadow";
137
+ role: "focus-ring";
138
+ }>;
139
+ readonly offset: string;
140
+ };
135
141
  };
136
142
  readonly disabled: {
137
143
  readonly bg: "transparent";
@@ -145,7 +151,7 @@ export declare const createModalTokens: (config: ModalTokensConfig) => {
145
151
  readonly openDuration: "180ms";
146
152
  };
147
153
  };
148
- export declare const createModalTokensFromSemantics: ({ closeButtonHoverBg, closeButtonPressedBg, focus, overlay, radius, shadow, spacing, surface, text, }: ModalThemeSemantics) => {
154
+ export declare const createModalTokensFromSemantics: ({ closeButtonHoverBg, closeButtonPressedBg, focus, overlay, radius, spacing, surface, text, }: ModalThemeSemantics) => {
149
155
  readonly overlay: {
150
156
  readonly bg: string;
151
157
  readonly blur: 4;
@@ -155,14 +161,20 @@ export declare const createModalTokensFromSemantics: ({ closeButtonHoverBg, clos
155
161
  readonly bg: string;
156
162
  readonly fg: string;
157
163
  readonly border: string;
158
- readonly shadow: string;
164
+ readonly shadow: Readonly<{
165
+ kind: "shadow";
166
+ role: "elevation";
167
+ level: import("../platform-output/component-token-intents.js").ComponentShadowLevel;
168
+ }>;
159
169
  readonly borderWidth: 1;
160
170
  readonly radius: number;
161
171
  readonly padding: number;
162
172
  readonly gap: number;
163
173
  readonly minWidth: 320;
164
- readonly maxHeight: "90vh";
165
- readonly nativeMaxHeight: "90%";
174
+ readonly maxHeight: Readonly<{
175
+ kind: "viewport-height";
176
+ ratio: number;
177
+ }>;
166
178
  readonly viewportMargin: number;
167
179
  readonly topOffset: number;
168
180
  readonly zIndexOffset: 1;
@@ -212,7 +224,15 @@ export declare const createModalTokensFromSemantics: ({ closeButtonHoverBg, clos
212
224
  readonly border: "transparent";
213
225
  };
214
226
  readonly focus: {
215
- readonly ring: ModalFocusRing;
227
+ readonly ring: {
228
+ readonly color: string;
229
+ readonly width: string;
230
+ readonly shadow: Readonly<{
231
+ kind: "shadow";
232
+ role: "focus-ring";
233
+ }>;
234
+ readonly offset: string;
235
+ };
216
236
  };
217
237
  readonly disabled: {
218
238
  readonly bg: "transparent";
@@ -1 +1 @@
1
- {"version":3,"file":"createModalTokens.d.ts","sourceRoot":"","sources":["../../src/factories/createModalTokens.ts"],"names":[],"mappings":"AAAA,KAAK,cAAc,GAAG;IACpB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,MAAM,EAAE,MAAM,CAAC;CAChB,CAAC;AAEF,KAAK,iBAAiB,GAAG;IACvB,SAAS,EAAE,MAAM,CAAC;IAClB,SAAS,EAAE,MAAM,CAAC;IAClB,SAAS,EAAE,MAAM,CAAC;IAClB,aAAa,EAAE,MAAM,CAAC;IACtB,aAAa,EAAE,MAAM,CAAC;IACtB,OAAO,EAAE,MAAM,CAAC;IAChB,aAAa,EAAE,MAAM,CAAC;IACtB,oBAAoB,EAAE,MAAM,CAAC;IAC7B,kBAAkB,EAAE,MAAM,CAAC;IAC3B,kBAAkB,EAAE,MAAM,CAAC;IAC3B,oBAAoB,EAAE,MAAM,CAAC;IAC7B,oBAAoB,EAAE,MAAM,CAAC;IAC7B,qBAAqB,EAAE,MAAM,CAAC;IAC9B,oBAAoB,EAAE,cAAc,CAAC;IACrC,QAAQ,EAAE,MAAM,CAAC;IACjB,UAAU,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,MAAM,CAAC;IACjB,QAAQ,EAAE,MAAM,CAAC;IACjB,QAAQ,EAAE,MAAM,CAAC;IACjB,QAAQ,EAAE,MAAM,CAAC;IACjB,SAAS,EAAE,MAAM,CAAC;CACnB,CAAC;AAEF,MAAM,MAAM,mBAAmB,GAAG;IAChC,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,KAAK,EAAE;QACL,IAAI,EAAE,cAAc,CAAC;KACtB,CAAC;IACF,OAAO,EAAE;QACP,QAAQ,EAAE,MAAM,CAAC;QACjB,KAAK,EAAE;YACL,EAAE,EAAE,MAAM,CAAC;YACX,MAAM,EAAE,MAAM,CAAC;SAChB,CAAC;KACH,CAAC;IACF,MAAM,EAAE;QACN,EAAE,EAAE,MAAM,CAAC;QACX,IAAI,EAAE,MAAM,CAAC;KACd,CAAC;IACF,MAAM,EAAE;QACN,EAAE,EAAE,MAAM,CAAC;KACZ,CAAC;IACF,OAAO,EAAE;QACP,CAAC,EAAE,MAAM,CAAC;QACV,CAAC,EAAE,MAAM,CAAC;QACV,CAAC,EAAE,MAAM,CAAC;QACV,CAAC,EAAE,MAAM,CAAC;QACV,EAAE,EAAE,MAAM,CAAC;KACZ,CAAC;IACF,OAAO,EAAE;QACP,KAAK,EAAE,MAAM,CAAC;QACd,OAAO,EAAE,MAAM,CAAC;KACjB,CAAC;IACF,IAAI,EAAE;QACJ,OAAO,EAAE,MAAM,CAAC;QAChB,SAAS,EAAE,MAAM,CAAC;QAClB,QAAQ,EAAE,MAAM,CAAC;KAClB,CAAC;CACH,CAAC;AAcF,eAAO,MAAM,iBAAiB,GAAI,QAAQ,iBAAiB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2F9C,CAAC;AAEd,eAAO,MAAM,8BAA8B,GAAI,uGAU5C,mBAAmB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAuBlB,CAAC"}
1
+ {"version":3,"file":"createModalTokens.d.ts","sourceRoot":"","sources":["../../src/factories/createModalTokens.ts"],"names":[],"mappings":"AAKA,OAAO,EACL,wBAAwB,EACxB,KAAK,iBAAiB,EACvB,MAAM,yBAAyB,CAAC;AAEjC,KAAK,cAAc,GAAG,UAAU,CAAC,OAAO,wBAAwB,CAAC,CAAC;AAElE,KAAK,iBAAiB,GAAG;IACvB,SAAS,EAAE,MAAM,CAAC;IAClB,SAAS,EAAE,MAAM,CAAC;IAClB,SAAS,EAAE,MAAM,CAAC;IAClB,aAAa,EAAE,MAAM,CAAC;IACtB,OAAO,EAAE,MAAM,CAAC;IAChB,aAAa,EAAE,MAAM,CAAC;IACtB,oBAAoB,EAAE,MAAM,CAAC;IAC7B,kBAAkB,EAAE,MAAM,CAAC;IAC3B,kBAAkB,EAAE,MAAM,CAAC;IAC3B,oBAAoB,EAAE,MAAM,CAAC;IAC7B,oBAAoB,EAAE,MAAM,CAAC;IAC7B,qBAAqB,EAAE,MAAM,CAAC;IAC9B,oBAAoB,EAAE,cAAc,CAAC;IACrC,QAAQ,EAAE,MAAM,CAAC;IACjB,UAAU,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,MAAM,CAAC;IACjB,QAAQ,EAAE,MAAM,CAAC;IACjB,QAAQ,EAAE,MAAM,CAAC;IACjB,QAAQ,EAAE,MAAM,CAAC;IACjB,SAAS,EAAE,MAAM,CAAC;CACnB,CAAC;AAEF,MAAM,MAAM,mBAAmB,GAAG;IAChC,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,KAAK,EAAE;QACL,IAAI,EAAE,iBAAiB,CAAC;KACzB,CAAC;IACF,OAAO,EAAE;QACP,QAAQ,EAAE,MAAM,CAAC;QACjB,MAAM,EAAE;YACN,EAAE,EAAE,MAAM,CAAC;YACX,MAAM,EAAE,MAAM,CAAC;SAChB,CAAC;KACH,CAAC;IACF,MAAM,EAAE;QACN,EAAE,EAAE,MAAM,CAAC;QACX,IAAI,EAAE,MAAM,CAAC;KACd,CAAC;IACF,OAAO,EAAE;QACP,CAAC,EAAE,MAAM,CAAC;QACV,CAAC,EAAE,MAAM,CAAC;QACV,CAAC,EAAE,MAAM,CAAC;QACV,CAAC,EAAE,MAAM,CAAC;QACV,EAAE,EAAE,MAAM,CAAC;KACZ,CAAC;IACF,OAAO,EAAE;QACP,KAAK,EAAE,MAAM,CAAC;QACd,OAAO,EAAE,MAAM,CAAC;KACjB,CAAC;IACF,IAAI,EAAE;QACJ,OAAO,EAAE,MAAM,CAAC;QAChB,SAAS,EAAE,MAAM,CAAC;QAClB,QAAQ,EAAE,MAAM,CAAC;KAClB,CAAC;CACH,CAAC;AAaF,eAAO,MAAM,iBAAiB,GAAI,QAAQ,iBAAiB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA0F9C,CAAC;AAEd,eAAO,MAAM,8BAA8B,GAAI,+FAS5C,mBAAmB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAsBlB,CAAC"}
@@ -1,6 +1,7 @@
1
+ import { createComponentShadowIntent, createComponentViewportHeightIntent, } from '../platform-output/component-token-intents.js';
2
+ import { createComponentFocusRing, } from './componentFocusRing.js';
1
3
  const modalLayout = {
2
- maxHeight: '90vh',
3
- nativeMaxHeight: '90%',
4
+ maxHeight: createComponentViewportHeightIntent(0.9),
4
5
  zIndexOffset: 1,
5
6
  };
6
7
  const modalMotion = {
@@ -18,14 +19,13 @@ export const createModalTokens = (config) => ({
18
19
  bg: config.contentBg,
19
20
  fg: config.contentFg,
20
21
  border: config.contentBorder,
21
- shadow: config.contentShadow,
22
+ shadow: createComponentShadowIntent('xl'),
22
23
  borderWidth: 1,
23
24
  radius: config.radiusLg,
24
25
  padding: config.spacing4,
25
26
  gap: config.spacing4,
26
27
  minWidth: 320,
27
28
  maxHeight: modalLayout.maxHeight,
28
- nativeMaxHeight: modalLayout.nativeMaxHeight,
29
29
  viewportMargin: config.spacing8,
30
30
  topOffset: config.spacing10,
31
31
  zIndexOffset: modalLayout.zIndexOffset,
@@ -85,12 +85,11 @@ export const createModalTokens = (config) => ({
85
85
  },
86
86
  motion: modalMotion,
87
87
  });
88
- export const createModalTokensFromSemantics = ({ closeButtonHoverBg, closeButtonPressedBg, focus, overlay, radius, shadow, spacing, surface, text, }) => createModalTokens({
88
+ export const createModalTokensFromSemantics = ({ closeButtonHoverBg, closeButtonPressedBg, focus, overlay, radius, spacing, surface, text, }) => createModalTokens({
89
89
  overlayBg: overlay.backdrop,
90
- contentBg: overlay.modal.bg,
90
+ contentBg: overlay.dialog.bg,
91
91
  contentFg: text.primary,
92
- contentBorder: overlay.modal.border,
93
- contentShadow: shadow.xl,
92
+ contentBorder: overlay.dialog.border,
94
93
  titleFg: text.primary,
95
94
  descriptionFg: text.secondary,
96
95
  closeButtonDefaultFg: text.secondary,
@@ -99,7 +98,7 @@ export const createModalTokensFromSemantics = ({ closeButtonHoverBg, closeButton
99
98
  closeButtonPressedBg: closeButtonPressedBg ?? surface.pressed,
100
99
  closeButtonPressedFg: text.primary,
101
100
  closeButtonDisabledFg: text.disabled,
102
- closeButtonFocusRing: focus.ring,
101
+ closeButtonFocusRing: createComponentFocusRing(focus.ring),
103
102
  radiusLg: radius.lg,
104
103
  radiusFull: radius.full,
105
104
  spacing1: spacing[1],
@@ -1,11 +1,7 @@
1
- import type { shadows } from '../tokens/shadows.js';
2
- type NativeShadowToken = (typeof shadows)[keyof typeof shadows];
3
1
  type PopoverTokensConfig = {
4
2
  contentBg: string;
5
3
  contentFg: string;
6
4
  contentBorder: string;
7
- contentWebShadow: string;
8
- contentNativeShadow: NativeShadowToken;
9
5
  titleFg: string;
10
6
  descriptionFg: string;
11
7
  radiusLg: number;
@@ -14,17 +10,11 @@ type PopoverTokensConfig = {
14
10
  };
15
11
  export type PopoverThemeSources = {
16
12
  overlay: {
17
- popover: {
13
+ floating: {
18
14
  bg: string;
19
15
  border: string;
20
16
  };
21
17
  };
22
- shadow: {
23
- lg: string;
24
- };
25
- shadows: {
26
- lg: NativeShadowToken;
27
- };
28
18
  text: {
29
19
  primary: string;
30
20
  secondary: string;
@@ -41,10 +31,11 @@ export declare const createPopoverTokens: (config: PopoverTokensConfig) => {
41
31
  readonly bg: string;
42
32
  readonly fg: string;
43
33
  readonly border: string;
44
- readonly shadow: {
45
- readonly web: string;
46
- readonly native: NativeShadowToken;
47
- };
34
+ readonly shadow: Readonly<{
35
+ kind: "shadow";
36
+ role: "elevation";
37
+ level: import("../platform-output/component-token-intents.js").ComponentShadowLevel;
38
+ }>;
48
39
  readonly borderWidth: 1;
49
40
  readonly radius: number;
50
41
  readonly padding: number;
@@ -64,15 +55,16 @@ export declare const createPopoverTokens: (config: PopoverTokensConfig) => {
64
55
  readonly border: string;
65
56
  };
66
57
  };
67
- export declare const createPopoverTokensFromTheme: ({ overlay, shadow, shadows, text, radius, spacing, }: PopoverThemeSources) => {
58
+ export declare const createPopoverTokensFromTheme: ({ overlay, text, radius, spacing, }: PopoverThemeSources) => {
68
59
  readonly content: {
69
60
  readonly bg: string;
70
61
  readonly fg: string;
71
62
  readonly border: string;
72
- readonly shadow: {
73
- readonly web: string;
74
- readonly native: NativeShadowToken;
75
- };
63
+ readonly shadow: Readonly<{
64
+ kind: "shadow";
65
+ role: "elevation";
66
+ level: import("../platform-output/component-token-intents.js").ComponentShadowLevel;
67
+ }>;
76
68
  readonly borderWidth: 1;
77
69
  readonly radius: number;
78
70
  readonly padding: number;
@@ -1 +1 @@
1
- {"version":3,"file":"createPopoverTokens.d.ts","sourceRoot":"","sources":["../../src/factories/createPopoverTokens.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,sBAAsB,CAAC;AAEpD,KAAK,iBAAiB,GAAG,CAAC,OAAO,OAAO,CAAC,CAAC,MAAM,OAAO,OAAO,CAAC,CAAC;AAEhE,KAAK,mBAAmB,GAAG;IACzB,SAAS,EAAE,MAAM,CAAC;IAClB,SAAS,EAAE,MAAM,CAAC;IAClB,aAAa,EAAE,MAAM,CAAC;IACtB,gBAAgB,EAAE,MAAM,CAAC;IACzB,mBAAmB,EAAE,iBAAiB,CAAC;IACvC,OAAO,EAAE,MAAM,CAAC;IAChB,aAAa,EAAE,MAAM,CAAC;IACtB,QAAQ,EAAE,MAAM,CAAC;IACjB,QAAQ,EAAE,MAAM,CAAC;IACjB,QAAQ,EAAE,MAAM,CAAC;CAClB,CAAC;AAEF,MAAM,MAAM,mBAAmB,GAAG;IAChC,OAAO,EAAE;QACP,OAAO,EAAE;YACP,EAAE,EAAE,MAAM,CAAC;YACX,MAAM,EAAE,MAAM,CAAC;SAChB,CAAC;KACH,CAAC;IACF,MAAM,EAAE;QACN,EAAE,EAAE,MAAM,CAAC;KACZ,CAAC;IACF,OAAO,EAAE;QACP,EAAE,EAAE,iBAAiB,CAAC;KACvB,CAAC;IACF,IAAI,EAAE;QACJ,OAAO,EAAE,MAAM,CAAC;QAChB,SAAS,EAAE,MAAM,CAAC;KACnB,CAAC;IACF,MAAM,EAAE;QACN,EAAE,EAAE,MAAM,CAAC;KACZ,CAAC;IACF,OAAO,EAAE;QACP,QAAQ,EAAE,GAAG,EAAE,MAAM,GAAG,MAAM,CAAC;KAChC,CAAC;CACH,CAAC;AAEF,eAAO,MAAM,mBAAmB,GAAI,QAAQ,mBAAmB;;;;;;;;;;;;;;;;;;;;;;;;;;;CAiClD,CAAC;AAEd,eAAO,MAAM,4BAA4B,GAAI,sDAO1C,mBAAmB;;;;;;;;;;;;;;;;;;;;;;;;;;;CAYlB,CAAC"}
1
+ {"version":3,"file":"createPopoverTokens.d.ts","sourceRoot":"","sources":["../../src/factories/createPopoverTokens.ts"],"names":[],"mappings":"AAEA,KAAK,mBAAmB,GAAG;IACzB,SAAS,EAAE,MAAM,CAAC;IAClB,SAAS,EAAE,MAAM,CAAC;IAClB,aAAa,EAAE,MAAM,CAAC;IACtB,OAAO,EAAE,MAAM,CAAC;IAChB,aAAa,EAAE,MAAM,CAAC;IACtB,QAAQ,EAAE,MAAM,CAAC;IACjB,QAAQ,EAAE,MAAM,CAAC;IACjB,QAAQ,EAAE,MAAM,CAAC;CAClB,CAAC;AAEF,MAAM,MAAM,mBAAmB,GAAG;IAChC,OAAO,EAAE;QACP,QAAQ,EAAE;YACR,EAAE,EAAE,MAAM,CAAC;YACX,MAAM,EAAE,MAAM,CAAC;SAChB,CAAC;KACH,CAAC;IACF,IAAI,EAAE;QACJ,OAAO,EAAE,MAAM,CAAC;QAChB,SAAS,EAAE,MAAM,CAAC;KACnB,CAAC;IACF,MAAM,EAAE;QACN,EAAE,EAAE,MAAM,CAAC;KACZ,CAAC;IACF,OAAO,EAAE;QACP,QAAQ,EAAE,GAAG,EAAE,MAAM,GAAG,MAAM,CAAC;KAChC,CAAC;CACH,CAAC;AAEF,eAAO,MAAM,mBAAmB,GAAI,QAAQ,mBAAmB;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA8BlD,CAAC;AAEd,eAAO,MAAM,4BAA4B,GAAI,qCAK1C,mBAAmB;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAUlB,CAAC"}
@@ -1,12 +1,10 @@
1
+ import { createComponentShadowIntent } from '../platform-output/component-token-intents.js';
1
2
  export const createPopoverTokens = (config) => ({
2
3
  content: {
3
4
  bg: config.contentBg,
4
5
  fg: config.contentFg,
5
6
  border: config.contentBorder,
6
- shadow: {
7
- web: config.contentWebShadow,
8
- native: config.contentNativeShadow,
9
- },
7
+ shadow: createComponentShadowIntent('lg'),
10
8
  borderWidth: 1,
11
9
  radius: config.radiusLg,
12
10
  padding: config.spacing4,
@@ -26,12 +24,10 @@ export const createPopoverTokens = (config) => ({
26
24
  border: config.contentBorder,
27
25
  },
28
26
  });
29
- export const createPopoverTokensFromTheme = ({ overlay, shadow, shadows, text, radius, spacing, }) => createPopoverTokens({
30
- contentBg: overlay.popover.bg,
27
+ export const createPopoverTokensFromTheme = ({ overlay, text, radius, spacing, }) => createPopoverTokens({
28
+ contentBg: overlay.floating.bg,
31
29
  contentFg: text.primary,
32
- contentBorder: overlay.popover.border,
33
- contentWebShadow: shadow.lg,
34
- contentNativeShadow: shadows.lg,
30
+ contentBorder: overlay.floating.border,
35
31
  titleFg: text.primary,
36
32
  descriptionFg: text.secondary,
37
33
  radiusLg: radius.lg,
@@ -1,8 +1,9 @@
1
+ import { type ComponentElevationShadowIntent } from '../platform-output/component-token-intents.js';
1
2
  type TooltipContentTokens = {
2
3
  bg: string;
3
4
  fg: string;
4
5
  border: string;
5
- shadow: string;
6
+ shadow: ComponentElevationShadowIntent;
6
7
  borderWidth: number;
7
8
  radius: number;
8
9
  paddingX: number;
@@ -28,7 +29,6 @@ type TooltipTokensConfig = {
28
29
  contentBg: string;
29
30
  contentFg: string;
30
31
  contentBorder: string;
31
- contentShadow: string;
32
32
  contentBorderWidth?: number;
33
33
  contentRadius: number;
34
34
  contentPaddingX: number;
@@ -60,9 +60,6 @@ export type TooltipThemeSources = {
60
60
  border: string;
61
61
  };
62
62
  };
63
- shadow: {
64
- md: string;
65
- };
66
63
  radius: {
67
64
  sm: number;
68
65
  };
@@ -80,7 +77,7 @@ export type TooltipThemeSources = {
80
77
  };
81
78
  };
82
79
  };
83
- export declare const createTooltipTokens: ({ contentBg, contentFg, contentBorder, contentShadow, contentBorderWidth, contentRadius, contentPaddingX, contentPaddingY, contentMaxWidth, contentCompactMaxWidth, contentCompactPaddingX, contentCompactPaddingY, contentFontSize, contentLineHeight, contentCompactFontSize, contentCompactLineHeight, contentAnimationDuration, contentTranslateY, contentScale, arrowBg, arrowSize, arrowCompactSize, }: TooltipTokensConfig) => TooltipTokens;
84
- export declare const createTooltipTokensFromTheme: ({ overlay, shadow, radius, spacing, typography, }: TooltipThemeSources) => TooltipTokens;
80
+ export declare const createTooltipTokens: ({ contentBg, contentFg, contentBorder, contentBorderWidth, contentRadius, contentPaddingX, contentPaddingY, contentMaxWidth, contentCompactMaxWidth, contentCompactPaddingX, contentCompactPaddingY, contentFontSize, contentLineHeight, contentCompactFontSize, contentCompactLineHeight, contentAnimationDuration, contentTranslateY, contentScale, arrowBg, arrowSize, arrowCompactSize, }: TooltipTokensConfig) => TooltipTokens;
81
+ export declare const createTooltipTokensFromTheme: ({ overlay, radius, spacing, typography, }: TooltipThemeSources) => TooltipTokens;
85
82
  export {};
86
83
  //# sourceMappingURL=createTooltipTokens.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"createTooltipTokens.d.ts","sourceRoot":"","sources":["../../src/factories/createTooltipTokens.ts"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"createTooltipTokens.d.ts","sourceRoot":"","sources":["../../src/factories/createTooltipTokens.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,KAAK,8BAA8B,EAEpC,MAAM,+CAA+C,CAAC;AAEvD,KAAK,oBAAoB,GAAG;IAC1B,EAAE,EAAE,MAAM,CAAC;IACX,EAAE,EAAE,MAAM,CAAC;IACX,MAAM,EAAE,MAAM,CAAC;IACf,MAAM,EAAE,8BAA8B,CAAC;IACvC,WAAW,EAAE,MAAM,CAAC;IACpB,MAAM,EAAE,MAAM,CAAC;IACf,QAAQ,EAAE,MAAM,CAAC;IACjB,QAAQ,EAAE,MAAM,CAAC;IACjB,QAAQ,EAAE,MAAM,CAAC;IACjB,eAAe,EAAE,MAAM,CAAC;IACxB,eAAe,EAAE,MAAM,CAAC;IACxB,eAAe,EAAE,MAAM,CAAC;IACxB,QAAQ,EAAE,MAAM,CAAC;IACjB,UAAU,EAAE,MAAM,CAAC;IACnB,eAAe,EAAE,MAAM,CAAC;IACxB,iBAAiB,EAAE,MAAM,CAAC;IAC1B,iBAAiB,EAAE,MAAM,CAAC;IAC1B,UAAU,EAAE,MAAM,CAAC;IACnB,KAAK,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,KAAK,kBAAkB,GAAG;IACxB,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;IACb,WAAW,EAAE,MAAM,CAAC;CACrB,CAAC;AAEF,KAAK,mBAAmB,GAAG;IACzB,SAAS,EAAE,MAAM,CAAC;IAClB,SAAS,EAAE,MAAM,CAAC;IAClB,aAAa,EAAE,MAAM,CAAC;IACtB,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,aAAa,EAAE,MAAM,CAAC;IACtB,eAAe,EAAE,MAAM,CAAC;IACxB,eAAe,EAAE,MAAM,CAAC;IACxB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,sBAAsB,CAAC,EAAE,MAAM,CAAC;IAChC,sBAAsB,EAAE,MAAM,CAAC;IAC/B,sBAAsB,EAAE,MAAM,CAAC;IAC/B,eAAe,EAAE,MAAM,CAAC;IACxB,iBAAiB,EAAE,MAAM,CAAC;IAC1B,sBAAsB,EAAE,MAAM,CAAC;IAC/B,wBAAwB,EAAE,MAAM,CAAC;IACjC,wBAAwB,CAAC,EAAE,MAAM,CAAC;IAClC,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,gBAAgB,CAAC,EAAE,MAAM,CAAC;CAC3B,CAAC;AAEF,MAAM,MAAM,aAAa,GAAG;IAC1B,OAAO,EAAE,oBAAoB,CAAC;IAC9B,KAAK,EAAE,kBAAkB,CAAC;CAC3B,CAAC;AAEF,MAAM,MAAM,mBAAmB,GAAG;IAChC,OAAO,EAAE;QACP,OAAO,EAAE;YACP,EAAE,EAAE,MAAM,CAAC;YACX,EAAE,EAAE,MAAM,CAAC;YACX,MAAM,EAAE,MAAM,CAAC;SAChB,CAAC;KACH,CAAC;IACF,MAAM,EAAE;QACN,EAAE,EAAE,MAAM,CAAC;KACZ,CAAC;IACF,OAAO,EAAE;QACP,QAAQ,EAAE,GAAG,EAAE,MAAM,GAAG,MAAM,CAAC;KAChC,CAAC;IACF,UAAU,EAAE;QACV,IAAI,EAAE;YACJ,EAAE,EAAE,MAAM,CAAC;YACX,EAAE,EAAE,MAAM,CAAC;SACZ,CAAC;QACF,UAAU,EAAE;YACV,EAAE,EAAE,MAAM,CAAC;YACX,EAAE,EAAE,MAAM,CAAC;SACZ,CAAC;KACH,CAAC;CACH,CAAC;AAEF,eAAO,MAAM,mBAAmB,GAAI,+XAsBjC,mBAAmB,KAAG,aA6BZ,CAAC;AAEd,eAAO,MAAM,4BAA4B,GAAI,2CAK1C,mBAAmB,kBAclB,CAAC"}