@vellira-ui/tokens 2.98.6 → 2.98.7

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 (112) hide show
  1. package/dist/css/tokens.css +141 -189
  2. package/dist/dark/components/dropdown.d.ts +9 -9
  3. package/dist/dark/components/dropdown.d.ts.map +1 -1
  4. package/dist/dark/components/dropdown.js +4 -3
  5. package/dist/dark/components/input.d.ts +1 -1
  6. package/dist/dark/components/input.js +4 -4
  7. package/dist/dark/components/modal.js +1 -1
  8. package/dist/dark/components/radio.js +1 -1
  9. package/dist/dark/components/select.js +2 -2
  10. package/dist/dark/semantic/action.d.ts +2 -2
  11. package/dist/dark/semantic/action.js +2 -2
  12. package/dist/dark/semantic/border.d.ts +1 -1
  13. package/dist/dark/semantic/border.js +1 -1
  14. package/dist/dark/semantic/control.js +1 -1
  15. package/dist/dark/semantic/focus.d.ts +1 -1
  16. package/dist/dark/semantic/focus.js +1 -1
  17. package/dist/dark/semantic/icons.d.ts +2 -2
  18. package/dist/dark/semantic/icons.js +2 -2
  19. package/dist/dark/semantic/index.d.ts +0 -1
  20. package/dist/dark/semantic/index.d.ts.map +1 -1
  21. package/dist/dark/semantic/index.js +0 -1
  22. package/dist/dark/semantic/overlay.d.ts +2 -2
  23. package/dist/dark/semantic/overlay.js +2 -2
  24. package/dist/dark/semantic/status.d.ts +6 -6
  25. package/dist/dark/semantic/status.js +6 -6
  26. package/dist/dark/semantic/surface.d.ts +0 -1
  27. package/dist/dark/semantic/surface.d.ts.map +1 -1
  28. package/dist/dark/semantic/surface.js +0 -1
  29. package/dist/dark/semantic/text.d.ts +2 -2
  30. package/dist/dark/semantic/text.js +2 -2
  31. package/dist/factories/componentFocusRing.d.ts +13 -0
  32. package/dist/factories/componentFocusRing.d.ts.map +1 -0
  33. package/dist/factories/componentFocusRing.js +6 -0
  34. package/dist/factories/createContextMenuTokens.d.ts +2 -1
  35. package/dist/factories/createContextMenuTokens.d.ts.map +1 -1
  36. package/dist/factories/createContextMenuTokens.js +3 -2
  37. package/dist/factories/createModalTokens.d.ts +3 -2
  38. package/dist/factories/createModalTokens.d.ts.map +1 -1
  39. package/dist/factories/createModalTokens.js +4 -3
  40. package/dist/factories/createPopoverTokens.d.ts +1 -1
  41. package/dist/factories/createPopoverTokens.d.ts.map +1 -1
  42. package/dist/factories/createPopoverTokens.js +2 -2
  43. package/dist/generated/token-types.d.ts +4 -4
  44. package/dist/generated/token-types.d.ts.map +1 -1
  45. package/dist/generated/token-types.js +168 -232
  46. package/dist/highContrast/components/dropdown.d.ts +8 -8
  47. package/dist/highContrast/components/dropdown.d.ts.map +1 -1
  48. package/dist/highContrast/components/dropdown.js +4 -3
  49. package/dist/highContrast/components/input.d.ts +4 -4
  50. package/dist/highContrast/components/input.js +4 -4
  51. package/dist/highContrast/components/radio.js +1 -1
  52. package/dist/highContrast/components/select.d.ts +1 -1
  53. package/dist/highContrast/components/select.js +2 -2
  54. package/dist/highContrast/semantic/action.d.ts +2 -2
  55. package/dist/highContrast/semantic/action.js +2 -2
  56. package/dist/highContrast/semantic/border.d.ts +1 -1
  57. package/dist/highContrast/semantic/border.js +1 -1
  58. package/dist/highContrast/semantic/focus.d.ts +1 -1
  59. package/dist/highContrast/semantic/focus.js +1 -1
  60. package/dist/highContrast/semantic/icons.d.ts +4 -4
  61. package/dist/highContrast/semantic/icons.js +4 -4
  62. package/dist/highContrast/semantic/index.d.ts +0 -1
  63. package/dist/highContrast/semantic/index.d.ts.map +1 -1
  64. package/dist/highContrast/semantic/index.js +0 -1
  65. package/dist/highContrast/semantic/overlay.d.ts +2 -2
  66. package/dist/highContrast/semantic/overlay.js +2 -2
  67. package/dist/highContrast/semantic/status.d.ts +4 -4
  68. package/dist/highContrast/semantic/status.js +4 -4
  69. package/dist/highContrast/semantic/surface.d.ts +0 -1
  70. package/dist/highContrast/semantic/surface.d.ts.map +1 -1
  71. package/dist/highContrast/semantic/surface.js +0 -1
  72. package/dist/light/components/dropdown.d.ts +8 -8
  73. package/dist/light/components/dropdown.d.ts.map +1 -1
  74. package/dist/light/components/dropdown.js +4 -3
  75. package/dist/light/components/input.js +4 -4
  76. package/dist/light/components/radio.js +1 -1
  77. package/dist/light/components/select.js +2 -2
  78. package/dist/light/semantic/action.d.ts +2 -2
  79. package/dist/light/semantic/action.js +2 -2
  80. package/dist/light/semantic/border.d.ts +1 -1
  81. package/dist/light/semantic/border.js +1 -1
  82. package/dist/light/semantic/focus.d.ts +1 -1
  83. package/dist/light/semantic/focus.js +1 -1
  84. package/dist/light/semantic/icons.d.ts +2 -2
  85. package/dist/light/semantic/icons.js +2 -2
  86. package/dist/light/semantic/index.d.ts +0 -1
  87. package/dist/light/semantic/index.d.ts.map +1 -1
  88. package/dist/light/semantic/index.js +0 -1
  89. package/dist/light/semantic/menu.js +1 -1
  90. package/dist/light/semantic/overlay.d.ts +2 -2
  91. package/dist/light/semantic/overlay.js +2 -2
  92. package/dist/light/semantic/status.d.ts +4 -4
  93. package/dist/light/semantic/status.js +4 -4
  94. package/dist/light/semantic/surface.d.ts +0 -1
  95. package/dist/light/semantic/surface.d.ts.map +1 -1
  96. package/dist/light/semantic/surface.js +0 -1
  97. package/dist/preservation/token-migrations.d.ts +169 -13
  98. package/dist/preservation/token-migrations.d.ts.map +1 -1
  99. package/dist/preservation/token-migrations.js +260 -30
  100. package/dist/token-architecture.d.ts +55 -9
  101. package/dist/token-architecture.d.ts.map +1 -1
  102. package/dist/token-architecture.js +126 -20
  103. package/package.json +1 -1
  104. package/dist/dark/semantic/navigation.d.ts +0 -34
  105. package/dist/dark/semantic/navigation.d.ts.map +0 -1
  106. package/dist/dark/semantic/navigation.js +0 -37
  107. package/dist/highContrast/semantic/navigation.d.ts +0 -34
  108. package/dist/highContrast/semantic/navigation.d.ts.map +0 -1
  109. package/dist/highContrast/semantic/navigation.js +0 -36
  110. package/dist/light/semantic/navigation.d.ts +0 -34
  111. package/dist/light/semantic/navigation.d.ts.map +0 -1
  112. package/dist/light/semantic/navigation.js +0 -37
@@ -271,10 +271,10 @@ export declare const dropdown: {
271
271
  readonly fg: "#FBBF24";
272
272
  readonly border: "#FCD34D";
273
273
  readonly ring: {
274
- readonly color: "#FCD34D";
275
- readonly width: "2px";
276
- readonly shadow: "0 0 0 1px rgba(255, 255, 255, 0.28)";
277
- readonly offset: "#000000";
274
+ readonly color: string;
275
+ readonly width: string;
276
+ readonly shadow: string;
277
+ readonly offset: string;
278
278
  };
279
279
  };
280
280
  readonly disabled: {
@@ -309,10 +309,10 @@ export declare const dropdown: {
309
309
  };
310
310
  readonly focus: {
311
311
  readonly ring: {
312
- readonly color: "#FCD34D";
313
- readonly width: "2px";
314
- readonly shadow: "0 0 0 1px rgba(255, 255, 255, 0.28)";
315
- readonly offset: "#000000";
312
+ readonly color: string;
313
+ readonly width: string;
314
+ readonly shadow: string;
315
+ readonly offset: string;
316
316
  };
317
317
  };
318
318
  readonly disabled: {
@@ -1 +1 @@
1
- {"version":3,"file":"dropdown.d.ts","sourceRoot":"","sources":["../../../src/highContrast/components/dropdown.ts"],"names":[],"mappings":"AAwEA,eAAO,MAAM,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA+FX,CAAC"}
1
+ {"version":3,"file":"dropdown.d.ts","sourceRoot":"","sources":["../../../src/highContrast/components/dropdown.ts"],"names":[],"mappings":"AAyEA,eAAO,MAAM,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA+FX,CAAC"}
@@ -1,3 +1,4 @@
1
+ import { createComponentFocusRing } from '../../factories/componentFocusRing.js';
1
2
  import { createDropdownPalette } from '../../factories/createDropdownPalette.js';
2
3
  import { createInputColorPalette } from '../../factories/createInputPalette.js';
3
4
  import { colors } from '../../primitives/colors.js';
@@ -99,8 +100,8 @@ export const dropdown = {
99
100
  focus: {
100
101
  bg: 'transparent',
101
102
  fg: text.interactive,
102
- border: border.focus,
103
- ring: focus.ring,
103
+ border: border.interactive,
104
+ ring: createComponentFocusRing(focus.ring),
104
105
  },
105
106
  disabled: {
106
107
  bg: surface.disabled,
@@ -123,7 +124,7 @@ export const dropdown = {
123
124
  },
124
125
  pressed: menu.item.pressed,
125
126
  focus: {
126
- ring: focus.ring,
127
+ ring: createComponentFocusRing(focus.ring),
127
128
  },
128
129
  disabled: menu.item.disabled,
129
130
  danger: {
@@ -127,7 +127,7 @@ export declare const input: {
127
127
  readonly fg: "#EEE8FA";
128
128
  readonly border: "#6B7280";
129
129
  readonly placeholder: "#D1D5DB";
130
- readonly icon: "#9CA3AF";
130
+ readonly icon: "#D1D5DB";
131
131
  };
132
132
  readonly icon: {
133
133
  readonly default: "#FFFFFF";
@@ -135,12 +135,12 @@ export declare const input: {
135
135
  readonly secondary: "#E5E7EB";
136
136
  readonly success: "#5EEAD4";
137
137
  readonly danger: "#FDA4AF";
138
- readonly muted: "#9CA3AF";
138
+ readonly muted: "#D1D5DB";
139
139
  readonly inverse: "#000000";
140
140
  readonly brand: "#FCD34D";
141
141
  };
142
142
  readonly clearButton: {
143
- readonly fg: "#9CA3AF";
143
+ readonly fg: "#D1D5DB";
144
144
  readonly hoverFg: "#FB7185";
145
145
  readonly hoverBg: "#4C0519";
146
146
  readonly focusBg: "#1F2937";
@@ -163,7 +163,7 @@ export declare const input: {
163
163
  readonly fg: "#EEE8FA";
164
164
  };
165
165
  readonly spinner: {
166
- readonly fg: "#9CA3AF";
166
+ readonly fg: "#D1D5DB";
167
167
  };
168
168
  };
169
169
  //# sourceMappingURL=input.d.ts.map
@@ -97,14 +97,14 @@ export const input = {
97
97
  hover: {
98
98
  bg: surface.hover,
99
99
  fg: text.primary,
100
- border: border.focus,
100
+ border: border.interactive,
101
101
  placeholder: text.secondary,
102
- icon: icons.hover,
102
+ icon: icons.interactiveHover,
103
103
  },
104
104
  focus: {
105
105
  bg: 'transparent',
106
106
  fg: text.primary,
107
- border: border.focus,
107
+ border: border.interactive,
108
108
  ring: focus.ring.color,
109
109
  placeholder: text.secondary,
110
110
  icon: icons.brand,
@@ -129,7 +129,7 @@ export const input = {
129
129
  },
130
130
  icon: {
131
131
  default: icons.default,
132
- primary: icons.primary,
132
+ primary: icons.interactive,
133
133
  secondary: icons.secondary,
134
134
  success: icons.success,
135
135
  danger: icons.danger,
@@ -123,7 +123,7 @@ export const radio = {
123
123
  danger,
124
124
  focus: {
125
125
  ring: focus.ring.color,
126
- border: border.focus,
126
+ border: border.interactive,
127
127
  },
128
128
  invalid: {
129
129
  ...control.default,
@@ -2430,7 +2430,7 @@ export declare const select: {
2430
2430
  };
2431
2431
  };
2432
2432
  readonly clearButton: {
2433
- readonly fg: "#9CA3AF";
2433
+ readonly fg: "#D1D5DB";
2434
2434
  readonly hoverFg: "#FB7185";
2435
2435
  readonly hoverBg: "#4C0519";
2436
2436
  readonly focusBg: "#1F2937";
@@ -186,13 +186,13 @@ export const select = {
186
186
  },
187
187
  hover: {
188
188
  ...control.hover,
189
- icon: icons.hover,
189
+ icon: icons.interactiveHover,
190
190
  placeholder: text.secondary,
191
191
  },
192
192
  focus: {
193
193
  bg: 'transparent',
194
194
  fg: text.primary,
195
- border: border.focus,
195
+ border: border.interactive,
196
196
  ring: focus.ring.color,
197
197
  icon: icons.brand,
198
198
  placeholder: text.secondary,
@@ -26,7 +26,7 @@ export declare const action: {
26
26
  readonly border: "transparent";
27
27
  };
28
28
  };
29
- readonly secondary: {
29
+ readonly accent: {
30
30
  readonly default: {
31
31
  readonly bg: "#79E8F8";
32
32
  readonly fg: "#000000";
@@ -53,7 +53,7 @@ export declare const action: {
53
53
  readonly border: "transparent";
54
54
  };
55
55
  };
56
- readonly close: {
56
+ readonly neutral: {
57
57
  readonly default: {
58
58
  readonly bg: "#FFFFFF";
59
59
  readonly fg: "#000000";
@@ -27,7 +27,7 @@ export const action = {
27
27
  border: 'transparent',
28
28
  },
29
29
  },
30
- secondary: {
30
+ accent: {
31
31
  default: {
32
32
  bg: colors.secondary[300],
33
33
  fg: colors.mono[950],
@@ -54,7 +54,7 @@ export const action = {
54
54
  border: 'transparent',
55
55
  },
56
56
  },
57
- close: {
57
+ neutral: {
58
58
  default: {
59
59
  bg: colors.mono[50],
60
60
  fg: colors.mono[950],
@@ -5,6 +5,6 @@ export declare const border: {
5
5
  readonly strong: "#FCD34D";
6
6
  readonly elevated: "#D1D5DB";
7
7
  readonly disabled: "#4B5563";
8
- readonly focus: "#FCD34D";
8
+ readonly interactive: "#FCD34D";
9
9
  };
10
10
  //# sourceMappingURL=border.d.ts.map
@@ -6,5 +6,5 @@ export const border = {
6
6
  strong: colors.warning[300],
7
7
  elevated: colors.gray[300],
8
8
  disabled: colors.gray[600],
9
- focus: colors.warning[300],
9
+ interactive: colors.warning[300],
10
10
  };
@@ -3,7 +3,7 @@ export declare const focus: {
3
3
  readonly color: "#FCD34D";
4
4
  readonly width: "2px";
5
5
  readonly shadow: "0 0 0 1px rgba(255, 255, 255, 0.28)";
6
- readonly offset: "#000000";
6
+ readonly offsetColor: "#000000";
7
7
  };
8
8
  };
9
9
  //# sourceMappingURL=focus.d.ts.map
@@ -4,6 +4,6 @@ export const focus = {
4
4
  color: colors.warning[300],
5
5
  width: '2px',
6
6
  shadow: '0 0 0 1px rgba(255, 255, 255, 0.28)',
7
- offset: colors.mono[950],
7
+ offsetColor: colors.mono[950],
8
8
  },
9
9
  };
@@ -1,12 +1,12 @@
1
1
  export declare const icons: {
2
2
  readonly default: "#FFFFFF";
3
3
  readonly secondary: "#E5E7EB";
4
- readonly muted: "#9CA3AF";
5
- readonly subtle: "#D1D5DB";
4
+ readonly muted: "#D1D5DB";
5
+ readonly subtle: "#9CA3AF";
6
6
  readonly disabled: "#6B7280";
7
- readonly primary: "#FCD34D";
7
+ readonly interactive: "#FCD34D";
8
8
  readonly brand: "#FCD34D";
9
- readonly hover: "#FDE68A";
9
+ readonly interactiveHover: "#FDE68A";
10
10
  readonly success: "#5EEAD4";
11
11
  readonly danger: "#FDA4AF";
12
12
  readonly inverse: "#000000";
@@ -2,12 +2,12 @@ import { colors } from '../../primitives/colors.js';
2
2
  export const icons = {
3
3
  default: colors.mono[50],
4
4
  secondary: colors.gray[200],
5
- muted: colors.gray[400],
6
- subtle: colors.gray[300],
5
+ muted: colors.gray[300],
6
+ subtle: colors.gray[400],
7
7
  disabled: colors.gray[500],
8
- primary: colors.warning[300],
8
+ interactive: colors.warning[300],
9
9
  brand: colors.warning[300],
10
- hover: colors.warning[200],
10
+ interactiveHover: colors.warning[200],
11
11
  success: colors.success[300],
12
12
  danger: colors.error[300],
13
13
  inverse: colors.mono[950],
@@ -5,7 +5,6 @@ export { divider } from './divider.js';
5
5
  export { focus } from './focus.js';
6
6
  export { icons } from './icons.js';
7
7
  export { menu } from './menu.js';
8
- export { navigation } from './navigation.js';
9
8
  export { overlay } from './overlay.js';
10
9
  export { shadow } from './shadow.js';
11
10
  export { skeleton } from './skeleton.js';
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/highContrast/semantic/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AACrC,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AACrC,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;AACvC,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;AACvC,OAAO,EAAE,KAAK,EAAE,MAAM,YAAY,CAAC;AACnC,OAAO,EAAE,KAAK,EAAE,MAAM,YAAY,CAAC;AACnC,OAAO,EAAE,IAAI,EAAE,MAAM,WAAW,CAAC;AACjC,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAC7C,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;AACvC,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AACrC,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AACzC,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AACrC,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;AACvC,OAAO,EAAE,IAAI,EAAE,MAAM,WAAW,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/highContrast/semantic/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AACrC,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AACrC,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;AACvC,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;AACvC,OAAO,EAAE,KAAK,EAAE,MAAM,YAAY,CAAC;AACnC,OAAO,EAAE,KAAK,EAAE,MAAM,YAAY,CAAC;AACnC,OAAO,EAAE,IAAI,EAAE,MAAM,WAAW,CAAC;AACjC,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;AACvC,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AACrC,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AACzC,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AACrC,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;AACvC,OAAO,EAAE,IAAI,EAAE,MAAM,WAAW,CAAC"}
@@ -5,7 +5,6 @@ export { divider } from './divider.js';
5
5
  export { focus } from './focus.js';
6
6
  export { icons } from './icons.js';
7
7
  export { menu } from './menu.js';
8
- export { navigation } from './navigation.js';
9
8
  export { overlay } from './overlay.js';
10
9
  export { shadow } from './shadow.js';
11
10
  export { skeleton } from './skeleton.js';
@@ -5,11 +5,11 @@ export declare const overlay: {
5
5
  readonly fg: "#000000";
6
6
  readonly border: "#FCD34D";
7
7
  };
8
- readonly popover: {
8
+ readonly floating: {
9
9
  readonly bg: "#111827";
10
10
  readonly border: "#9CA3AF";
11
11
  };
12
- readonly modal: {
12
+ readonly dialog: {
13
13
  readonly bg: "#111827";
14
14
  readonly border: "#9CA3AF";
15
15
  };
@@ -9,11 +9,11 @@ export const overlay = {
9
9
  fg: colors.mono[950],
10
10
  border: colors.warning[300],
11
11
  },
12
- popover: {
12
+ floating: {
13
13
  bg: surface.muted,
14
14
  border: border.default,
15
15
  },
16
- modal: {
16
+ dialog: {
17
17
  bg: surface.muted,
18
18
  border: border.default,
19
19
  },
@@ -4,28 +4,28 @@ export declare const status: {
4
4
  readonly bg: "#042F2E";
5
5
  readonly border: "#5EEAD4";
6
6
  readonly ring: "#5EEAD4";
7
- readonly strong: "#99F6E4";
7
+ readonly emphasisFg: "#99F6E4";
8
8
  };
9
9
  readonly error: {
10
10
  readonly fg: "#FB7185";
11
11
  readonly bg: "#4C0519";
12
12
  readonly border: "#FB7185";
13
13
  readonly ring: "#FB7185";
14
- readonly strong: "#FECDD3";
14
+ readonly emphasisFg: "#FECDD3";
15
15
  };
16
16
  readonly warning: {
17
17
  readonly fg: "#FCD34D";
18
18
  readonly bg: "#451A03";
19
19
  readonly border: "#FCD34D";
20
20
  readonly ring: "#FCD34D";
21
- readonly strong: "#FDE68A";
21
+ readonly emphasisFg: "#FDE68A";
22
22
  };
23
23
  readonly info: {
24
24
  readonly fg: "#7DD3FC";
25
25
  readonly bg: "#071927";
26
26
  readonly border: "#7DD3FC";
27
27
  readonly ring: "#7DD3FC";
28
- readonly strong: "#BAE6FD";
28
+ readonly emphasisFg: "#BAE6FD";
29
29
  };
30
30
  };
31
31
  //# sourceMappingURL=status.d.ts.map
@@ -5,27 +5,27 @@ export const status = {
5
5
  bg: colors.success[950],
6
6
  border: colors.success[300],
7
7
  ring: colors.success[300],
8
- strong: colors.success[200],
8
+ emphasisFg: colors.success[200],
9
9
  },
10
10
  error: {
11
11
  fg: colors.error[400],
12
12
  bg: colors.error[950],
13
13
  border: colors.error[400],
14
14
  ring: colors.error[400],
15
- strong: colors.error[200],
15
+ emphasisFg: colors.error[200],
16
16
  },
17
17
  warning: {
18
18
  fg: colors.warning[300],
19
19
  bg: colors.warning[950],
20
20
  border: colors.warning[300],
21
21
  ring: colors.warning[300],
22
- strong: colors.warning[200],
22
+ emphasisFg: colors.warning[200],
23
23
  },
24
24
  info: {
25
25
  fg: colors.info[200],
26
26
  bg: colors.info[950],
27
27
  border: colors.info[200],
28
28
  ring: colors.info[200],
29
- strong: colors.info[150],
29
+ emphasisFg: colors.info[150],
30
30
  },
31
31
  };
@@ -4,7 +4,6 @@ export declare const surface: {
4
4
  readonly muted: "#111827";
5
5
  readonly subtle: "#1F2937";
6
6
  readonly elevated: "#374151";
7
- readonly background: "#0B1120";
8
7
  readonly hover: "#374151";
9
8
  readonly active: "#374151";
10
9
  readonly pressed: "#4B5563";
@@ -1 +1 @@
1
- {"version":3,"file":"surface.d.ts","sourceRoot":"","sources":["../../../src/highContrast/semantic/surface.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,OAAO;;;;;;;;;;;;;CAgBV,CAAC"}
1
+ {"version":3,"file":"surface.d.ts","sourceRoot":"","sources":["../../../src/highContrast/semantic/surface.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,OAAO;;;;;;;;;;;;CAeV,CAAC"}
@@ -6,7 +6,6 @@ export const surface = {
6
6
  muted: colors.gray[900],
7
7
  subtle: colors.gray[800],
8
8
  elevated: colors.gray[700],
9
- background: colors.grayBlue[950],
10
9
  hover: colors.gray[700],
11
10
  active: colors.gray[700],
12
11
  pressed: colors.gray[600],
@@ -271,10 +271,10 @@ export declare const dropdown: {
271
271
  readonly fg: "#5037C8";
272
272
  readonly border: "#5037C8";
273
273
  readonly ring: {
274
- readonly color: "#5037C8";
275
- readonly width: "2px";
276
- readonly shadow: "0 0 8px rgba(99, 70, 232, 0.14)";
277
- readonly offset: "#FFFFFF";
274
+ readonly color: string;
275
+ readonly width: string;
276
+ readonly shadow: string;
277
+ readonly offset: string;
278
278
  };
279
279
  };
280
280
  readonly disabled: {
@@ -309,10 +309,10 @@ export declare const dropdown: {
309
309
  };
310
310
  readonly focus: {
311
311
  readonly ring: {
312
- readonly color: "#5037C8";
313
- readonly width: "2px";
314
- readonly shadow: "0 0 8px rgba(99, 70, 232, 0.14)";
315
- readonly offset: "#FFFFFF";
312
+ readonly color: string;
313
+ readonly width: string;
314
+ readonly shadow: string;
315
+ readonly offset: string;
316
316
  };
317
317
  };
318
318
  readonly disabled: {
@@ -1 +1 @@
1
- {"version":3,"file":"dropdown.d.ts","sourceRoot":"","sources":["../../../src/light/components/dropdown.ts"],"names":[],"mappings":"AAwEA,eAAO,MAAM,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAuHX,CAAC"}
1
+ {"version":3,"file":"dropdown.d.ts","sourceRoot":"","sources":["../../../src/light/components/dropdown.ts"],"names":[],"mappings":"AAyEA,eAAO,MAAM,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAuHX,CAAC"}
@@ -1,3 +1,4 @@
1
+ import { createComponentFocusRing } from '../../factories/componentFocusRing.js';
1
2
  import { createDropdownPalette } from '../../factories/createDropdownPalette.js';
2
3
  import { createInputColorPalette } from '../../factories/createInputPalette.js';
3
4
  import { colors } from '../../primitives/colors.js';
@@ -123,8 +124,8 @@ export const dropdown = {
123
124
  focus: {
124
125
  bg: 'transparent',
125
126
  fg: text.interactive,
126
- border: border.focus,
127
- ring: focus.ring,
127
+ border: border.interactive,
128
+ ring: createComponentFocusRing(focus.ring),
128
129
  },
129
130
  disabled: {
130
131
  bg: surface.disabled,
@@ -147,7 +148,7 @@ export const dropdown = {
147
148
  },
148
149
  pressed: menu.item.pressed,
149
150
  focus: {
150
- ring: focus.ring,
151
+ ring: createComponentFocusRing(focus.ring),
151
152
  },
152
153
  disabled: menu.item.disabled,
153
154
  danger: {
@@ -77,14 +77,14 @@ export const input = {
77
77
  hover: {
78
78
  bg: surface.hover,
79
79
  fg: text.primary,
80
- border: border.focus,
80
+ border: border.interactive,
81
81
  placeholder: text.secondary,
82
- icon: icons.hover,
82
+ icon: icons.interactiveHover,
83
83
  },
84
84
  focus: {
85
85
  bg: 'transparent',
86
86
  fg: text.primary,
87
- border: border.focus,
87
+ border: border.interactive,
88
88
  ring: focus.ring.color,
89
89
  placeholder: text.secondary,
90
90
  icon: icons.brand,
@@ -109,7 +109,7 @@ export const input = {
109
109
  },
110
110
  icon: {
111
111
  default: icons.default,
112
- primary: icons.primary,
112
+ primary: icons.interactive,
113
113
  secondary: icons.secondary,
114
114
  success: icons.success,
115
115
  danger: icons.danger,
@@ -128,7 +128,7 @@ export const radio = {
128
128
  },
129
129
  focus: {
130
130
  ring: focus.ring.color,
131
- border: border.focus,
131
+ border: border.interactive,
132
132
  },
133
133
  disabled: control.disabled,
134
134
  selectedDisabled: {
@@ -137,13 +137,13 @@ export const select = {
137
137
  },
138
138
  hover: {
139
139
  ...control.hover,
140
- icon: icons.hover,
140
+ icon: icons.interactiveHover,
141
141
  placeholder: text.secondary,
142
142
  },
143
143
  focus: {
144
144
  bg: 'transparent',
145
145
  fg: text.primary,
146
- border: border.focus,
146
+ border: border.interactive,
147
147
  ring: focus.ring.color,
148
148
  icon: icons.brand,
149
149
  placeholder: text.secondary,
@@ -26,7 +26,7 @@ export declare const action: {
26
26
  readonly border: "transparent";
27
27
  };
28
28
  };
29
- readonly secondary: {
29
+ readonly accent: {
30
30
  readonly default: {
31
31
  readonly bg: "#0B7D95";
32
32
  readonly fg: "#FFFFFF";
@@ -53,7 +53,7 @@ export declare const action: {
53
53
  readonly border: "transparent";
54
54
  };
55
55
  };
56
- readonly close: {
56
+ readonly neutral: {
57
57
  readonly default: {
58
58
  readonly bg: "#D4CEE8";
59
59
  readonly fg: "#231F31";
@@ -28,7 +28,7 @@ export const action = {
28
28
  border: 'transparent',
29
29
  },
30
30
  },
31
- secondary: {
31
+ accent: {
32
32
  default: {
33
33
  bg: colors.secondary[700],
34
34
  fg: text.inverse,
@@ -55,7 +55,7 @@ export const action = {
55
55
  border: 'transparent',
56
56
  },
57
57
  },
58
- close: {
58
+ neutral: {
59
59
  default: {
60
60
  bg: colors.vellira[250],
61
61
  fg: colors.vellira[900],
@@ -5,6 +5,6 @@ export declare const border: {
5
5
  readonly strong: "#6B6386";
6
6
  readonly elevated: "#D4CEE8";
7
7
  readonly disabled: "#E4DDF4";
8
- readonly focus: "#5037C8";
8
+ readonly interactive: "#5037C8";
9
9
  };
10
10
  //# sourceMappingURL=border.d.ts.map
@@ -6,5 +6,5 @@ export const border = {
6
6
  strong: colors.vellira[500],
7
7
  elevated: colors.vellira[250],
8
8
  disabled: colors.vellira[200],
9
- focus: colors.primary[700],
9
+ interactive: colors.primary[700],
10
10
  };
@@ -3,7 +3,7 @@ export declare const focus: {
3
3
  readonly color: "#5037C8";
4
4
  readonly width: "2px";
5
5
  readonly shadow: "0 0 8px rgba(99, 70, 232, 0.14)";
6
- readonly offset: "#FFFFFF";
6
+ readonly offsetColor: "#FFFFFF";
7
7
  };
8
8
  };
9
9
  //# sourceMappingURL=focus.d.ts.map
@@ -4,6 +4,6 @@ export const focus = {
4
4
  color: colors.primary[700],
5
5
  width: '2px',
6
6
  shadow: '0 0 8px rgba(99, 70, 232, 0.14)',
7
- offset: colors.mono[50],
7
+ offsetColor: colors.mono[50],
8
8
  },
9
9
  };
@@ -4,9 +4,9 @@ export declare const icons: {
4
4
  readonly muted: "#958CB0";
5
5
  readonly subtle: "#958CB0";
6
6
  readonly disabled: "#958CB0";
7
- readonly primary: "#5037C8";
7
+ readonly interactive: "#5037C8";
8
8
  readonly brand: "#5037C8";
9
- readonly hover: "#402C9F";
9
+ readonly interactiveHover: "#402C9F";
10
10
  readonly success: "#14B8A6";
11
11
  readonly danger: "#BE123C";
12
12
  readonly inverse: "#FFFFFF";
@@ -5,9 +5,9 @@ export const icons = {
5
5
  muted: colors.vellira[400],
6
6
  subtle: colors.vellira[400],
7
7
  disabled: colors.vellira[400],
8
- primary: colors.primary[700],
8
+ interactive: colors.primary[700],
9
9
  brand: colors.primary[700],
10
- hover: colors.primary[800],
10
+ interactiveHover: colors.primary[800],
11
11
  success: colors.success[500],
12
12
  danger: colors.error[700],
13
13
  inverse: colors.mono[50],
@@ -5,7 +5,6 @@ export { divider } from './divider.js';
5
5
  export { focus } from './focus.js';
6
6
  export { icons } from './icons.js';
7
7
  export { menu } from './menu.js';
8
- export { navigation } from './navigation.js';
9
8
  export { overlay } from './overlay.js';
10
9
  export { shadow } from './shadow.js';
11
10
  export { skeleton } from './skeleton.js';