@vellira-ui/tokens 2.23.0 → 2.25.0

package/dist/generated/token-types.js

@@ -107,6 +107,7 @@ export const colorTokenPaths = [
     'colors.vellira.600',
     'colors.vellira.700',
     'colors.vellira.800',
+    'colors.vellira.850',
     'colors.vellira.900',
     'colors.vellira.950',
     'colors.warning.50',
@@ -189,6 +190,9 @@ export const semanticTokenPaths = [
     'semantic.border.muted',
     'semantic.border.strong',
     'semantic.border.subtle',
+    'semantic.control.active.bg',
+    'semantic.control.active.border',
+    'semantic.control.active.fg',
     'semantic.control.default.bg',
     'semantic.control.default.border',
     'semantic.control.default.fg',
@@ -270,6 +274,7 @@ export const semanticTokenPaths = [
     'semantic.surface.subtle',
     'semantic.text.brand',
     'semantic.text.disabled',
+    'semantic.text.elevated',
     'semantic.text.hover',
     'semantic.text.inverse',
     'semantic.text.muted',
@@ -486,6 +491,7 @@ export const componentTokenPaths = [
     'components.input.hover.fg',
     'components.input.hover.icon',
     'components.input.hover.placeholder',
+    'components.input.icon.brand',
     'components.input.icon.danger',
     'components.input.icon.default',
     'components.input.icon.inverse',
@@ -534,6 +540,9 @@ export const componentTokenPaths = [
     'components.radio.checked.default.bg',
     'components.radio.checked.default.border',
     'components.radio.checked.default.fg',
+    'components.radio.checked.disabled.bg',
+    'components.radio.checked.disabled.border',
+    'components.radio.checked.disabled.fg',
     'components.radio.checked.hover.bg',
     'components.radio.checked.hover.border',
     'components.radio.checked.hover.fg',
@@ -546,10 +555,17 @@ export const componentTokenPaths = [
     'components.radio.disabled.bg',
     'components.radio.disabled.border',
     'components.radio.disabled.fg',
+    'components.radio.focus.border',
     'components.radio.focus.ring',
     'components.radio.hover.bg',
     'components.radio.hover.border',
     'components.radio.hover.fg',
+    'components.radio.invalid.bg',
+    'components.radio.invalid.border',
+    'components.radio.invalid.fg',
+    'components.radio.pressed.bg',
+    'components.radio.pressed.border',
+    'components.radio.pressed.fg',
     'components.select.dropdown.bg',
     'components.select.dropdown.border',
     'components.select.dropdown.fg',
@@ -662,6 +678,8 @@ export const baseTokenPaths = [
     'tokens.typography.lineHeight.md',
     'tokens.typography.lineHeight.sm',
     'tokens.typography.lineHeight.xl',
+    'tokens.typography.lineHeight.xs',
+    'tokens.typography.lineHeight.xxl',
     'tokens.typography.size.lg',
     'tokens.typography.size.md',
     'tokens.typography.size.sm',
@@ -782,6 +800,7 @@ export const tokenPaths = [
     'colors.vellira.600',
     'colors.vellira.700',
     'colors.vellira.800',
+    'colors.vellira.850',
     'colors.vellira.900',
     'colors.vellira.950',
     'colors.warning.50',
@@ -1002,6 +1021,7 @@ export const tokenPaths = [
     'components.input.hover.fg',
     'components.input.hover.icon',
     'components.input.hover.placeholder',
+    'components.input.icon.brand',
     'components.input.icon.danger',
     'components.input.icon.default',
     'components.input.icon.inverse',
@@ -1050,6 +1070,9 @@ export const tokenPaths = [
     'components.radio.checked.default.bg',
     'components.radio.checked.default.border',
     'components.radio.checked.default.fg',
+    'components.radio.checked.disabled.bg',
+    'components.radio.checked.disabled.border',
+    'components.radio.checked.disabled.fg',
     'components.radio.checked.hover.bg',
     'components.radio.checked.hover.border',
     'components.radio.checked.hover.fg',
@@ -1062,10 +1085,17 @@ export const tokenPaths = [
     'components.radio.disabled.bg',
     'components.radio.disabled.border',
     'components.radio.disabled.fg',
+    'components.radio.focus.border',
     'components.radio.focus.ring',
     'components.radio.hover.bg',
     'components.radio.hover.border',
     'components.radio.hover.fg',
+    'components.radio.invalid.bg',
+    'components.radio.invalid.border',
+    'components.radio.invalid.fg',
+    'components.radio.pressed.bg',
+    'components.radio.pressed.border',
+    'components.radio.pressed.fg',
     'components.select.dropdown.bg',
     'components.select.dropdown.border',
     'components.select.dropdown.fg',
@@ -1199,6 +1229,9 @@ export const tokenPaths = [
     'semantic.border.muted',
     'semantic.border.strong',
     'semantic.border.subtle',
+    'semantic.control.active.bg',
+    'semantic.control.active.border',
+    'semantic.control.active.fg',
     'semantic.control.default.bg',
     'semantic.control.default.border',
     'semantic.control.default.fg',
@@ -1280,6 +1313,7 @@ export const tokenPaths = [
     'semantic.surface.subtle',
     'semantic.text.brand',
     'semantic.text.disabled',
+    'semantic.text.elevated',
     'semantic.text.hover',
     'semantic.text.inverse',
     'semantic.text.muted',
@@ -1331,6 +1365,8 @@ export const tokenPaths = [
     'tokens.typography.lineHeight.md',
     'tokens.typography.lineHeight.sm',
     'tokens.typography.lineHeight.xl',
+    'tokens.typography.lineHeight.xs',
+    'tokens.typography.lineHeight.xxl',
     'tokens.typography.size.lg',
     'tokens.typography.size.md',
     'tokens.typography.size.sm',
@@ -1368,6 +1404,8 @@ export const baseCssVariableNames = [
     '--line-height-md',
     '--line-height-sm',
     '--line-height-xl',
+    '--line-height-xs',
+    '--line-height-xxl',
     '--radius-full',
     '--radius-lg',
     '--radius-md',
@@ -1697,6 +1735,7 @@ export const themeCssVariableNames = [
     '--color-vellira-600',
     '--color-vellira-700',
     '--color-vellira-800',
+    '--color-vellira-850',
     '--color-vellira-900',
     '--color-vellira-950',
     '--color-warning-50',
@@ -1710,6 +1749,9 @@ export const themeCssVariableNames = [
     '--color-warning-800',
     '--color-warning-900',
     '--color-warning-950',
+    '--control-active-bg',
+    '--control-active-border',
+    '--control-active-fg',
     '--control-default-bg',
     '--control-default-border',
     '--control-default-fg',
@@ -1814,6 +1856,7 @@ export const themeCssVariableNames = [
     '--input-hover-fg',
     '--input-hover-icon',
     '--input-hover-placeholder',
+    '--input-icon-brand',
     '--input-icon-danger',
     '--input-icon-default',
     '--input-icon-inverse',
@@ -1884,6 +1927,9 @@ export const themeCssVariableNames = [
     '--radio-checked-default-bg',
     '--radio-checked-default-border',
     '--radio-checked-default-fg',
+    '--radio-checked-disabled-bg',
+    '--radio-checked-disabled-border',
+    '--radio-checked-disabled-fg',
     '--radio-checked-hover-bg',
     '--radio-checked-hover-border',
     '--radio-checked-hover-fg',
@@ -1896,10 +1942,17 @@ export const themeCssVariableNames = [
     '--radio-disabled-bg',
     '--radio-disabled-border',
     '--radio-disabled-fg',
+    '--radio-focus-border',
     '--radio-focus-ring',
     '--radio-hover-bg',
     '--radio-hover-border',
     '--radio-hover-fg',
+    '--radio-invalid-bg',
+    '--radio-invalid-border',
+    '--radio-invalid-fg',
+    '--radio-pressed-bg',
+    '--radio-pressed-border',
+    '--radio-pressed-fg',
     '--select-dropdown-bg',
     '--select-dropdown-border',
     '--select-dropdown-fg',
@@ -1992,6 +2045,7 @@ export const themeCssVariableNames = [
     '--tabs-trigger-hover-fg',
     '--text-brand',
     '--text-disabled',
+    '--text-elevated',
     '--text-hover',
     '--text-inverse',
     '--text-muted',
@@ -2306,6 +2360,7 @@ export const cssVariableNames = [
     '--color-vellira-600',
     '--color-vellira-700',
     '--color-vellira-800',
+    '--color-vellira-850',
     '--color-vellira-900',
     '--color-vellira-950',
     '--color-warning-50',
@@ -2319,6 +2374,9 @@ export const cssVariableNames = [
     '--color-warning-800',
     '--color-warning-900',
     '--color-warning-950',
+    '--control-active-bg',
+    '--control-active-border',
+    '--control-active-fg',
     '--control-default-bg',
     '--control-default-border',
     '--control-default-fg',
@@ -2438,6 +2496,7 @@ export const cssVariableNames = [
     '--input-hover-fg',
     '--input-hover-icon',
     '--input-hover-placeholder',
+    '--input-icon-brand',
     '--input-icon-danger',
     '--input-icon-default',
     '--input-icon-inverse',
@@ -2456,6 +2515,8 @@ export const cssVariableNames = [
     '--line-height-md',
     '--line-height-sm',
     '--line-height-xl',
+    '--line-height-xs',
+    '--line-height-xxl',
     '--menu-group-label-fg',
     '--menu-item-active-bg',
     '--menu-item-active-fg',
@@ -2512,6 +2573,9 @@ export const cssVariableNames = [
     '--radio-checked-default-bg',
     '--radio-checked-default-border',
     '--radio-checked-default-fg',
+    '--radio-checked-disabled-bg',
+    '--radio-checked-disabled-border',
+    '--radio-checked-disabled-fg',
     '--radio-checked-hover-bg',
     '--radio-checked-hover-border',
     '--radio-checked-hover-fg',
@@ -2524,10 +2588,17 @@ export const cssVariableNames = [
     '--radio-disabled-bg',
     '--radio-disabled-border',
     '--radio-disabled-fg',
+    '--radio-focus-border',
     '--radio-focus-ring',
     '--radio-hover-bg',
     '--radio-hover-border',
     '--radio-hover-fg',
+    '--radio-invalid-bg',
+    '--radio-invalid-border',
+    '--radio-invalid-fg',
+    '--radio-pressed-bg',
+    '--radio-pressed-border',
+    '--radio-pressed-fg',
     '--radius-full',
     '--radius-lg',
     '--radius-md',
@@ -2640,6 +2711,7 @@ export const cssVariableNames = [
     '--tabs-trigger-hover-fg',
     '--text-brand',
     '--text-disabled',
+    '--text-elevated',
     '--text-hover',
     '--text-inverse',
     '--text-muted',

package/dist/highContrast/components/button.d.ts

@@ -183,12 +183,12 @@ export declare const button: {
                 readonly bg: string;
             };
             readonly hover: {
-                readonly bg: "#111827";
+                readonly bg: string;
                 readonly fg: "#FDA4AF";
                 readonly border: "#FDA4AF";
             };
             readonly pressed: {
-                readonly bg: "#111827";
+                readonly bg: string;
                 readonly fg: "#9F1239";
                 readonly border: "#9F1239";
             };
@@ -200,12 +200,12 @@ export declare const button: {
                 readonly bg: string;
             };
             readonly hover: {
-                readonly bg: "#111827";
+                readonly bg: string;
                 readonly fg: "#FDA4AF";
                 readonly border: "transparent";
             };
             readonly pressed: {
-                readonly bg: "#111827";
+                readonly bg: string;
                 readonly fg: "#9F1239";
                 readonly border: "transparent";
             };

package/dist/highContrast/components/button.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../../src/highContrast/components/button.ts"],"names":[],"mappings":"AAUA,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA8KT,CAAC"}
+{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../../src/highContrast/components/button.ts"],"names":[],"mappings":"AASA,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA8KT,CAAC"}

package/dist/highContrast/components/button.js

@@ -1,6 +1,5 @@
 import { action } from '../semantic/action.js';
 import { border } from '../semantic/border.js';
-import { status } from '../semantic/status.js';
 import { surface } from '../semantic/surface.js';
 import { text } from '../semantic/text.js';
 const transparent = {
@@ -143,12 +142,12 @@ export const button = {
                 border: action.danger.muted.border,
             },
             hover: {
-                bg: status.error.bg,
+                bg: surface.danger,
                 fg: action.danger.subtle.bg,
                 border: action.danger.subtle.border,
             },
             pressed: {
-                bg: status.error.bg,
+                bg: surface.danger,
                 fg: action.danger.active.bg,
                 border: action.danger.active.border,
             },
@@ -160,12 +159,12 @@ export const button = {
                 border: 'transparent',
             },
             hover: {
-                bg: status.error.bg,
+                bg: surface.danger,
                 fg: action.danger.subtle.bg,
                 border: 'transparent',
             },
             pressed: {
-                bg: status.error.bg,
+                bg: surface.danger,
                 fg: action.danger.active.bg,
                 border: 'transparent',
             },

package/dist/highContrast/components/checkbox.d.ts

@@ -1,28 +1,28 @@
 export declare const checkbox: {
     readonly default: {
-        readonly bg: "#000000";
+        readonly bg: "#1F2937";
         readonly fg: "#FFFFFF";
         readonly border: "#4B5563";
     };
     readonly hover: {
         readonly bg: "#111827";
-        readonly fg: "#000000";
+        readonly fg: "#B8A8FF";
         readonly border: "#7C5CFF";
     };
     readonly checked: {
         readonly default: {
-            readonly bg: "#7C5CFF";
+            readonly bg: "#9B7CFF";
             readonly fg: "#FFFFFF";
-            readonly border: "#7C5CFF";
+            readonly border: "#9B7CFF";
         };
         readonly hover: {
             readonly bg: "#0369A1";
-            readonly fg: "#000000";
+            readonly fg: "#F9FAFB";
             readonly border: "#0369A1";
         };
         readonly pressed: {
             readonly bg: "#402C9F";
-            readonly fg: "#000000";
+            readonly fg: "#F9FAFB";
             readonly border: "#402C9F";
         };
     };

package/dist/highContrast/components/formField.d.ts

@@ -3,7 +3,7 @@ export declare const formField: {
         readonly fg: "#EEE8FA";
     };
     readonly description: {
-        readonly fg: "#E5E7EB";
+        readonly fg: "#9CA3AF";
     };
     readonly helperText: {
         readonly default: {

package/dist/highContrast/components/formField.js

@@ -5,7 +5,7 @@ export const formField = {
         fg: text.secondary,
     },
     description: {
-        fg: text.muted,
+        fg: text.elevated,
     },
     helperText: {
         default: {

package/dist/highContrast/components/input.d.ts

@@ -29,7 +29,7 @@ export declare const input: {
         readonly icon: "#D1D5DB";
     };
     readonly error: {
-        readonly border: "#FB7185";
+        readonly border: "#F43F5E";
         readonly ring: "#FB7185";
     };
     readonly success: {
@@ -51,13 +51,14 @@ export declare const input: {
         readonly danger: "#F43F5E";
         readonly muted: "#9CA3AF";
         readonly inverse: "#1A1A1A";
+        readonly brand: "#9B7CFF";
     };
     readonly clearButton: {
         readonly fg: "#FB7185";
         readonly hoverFg: "#FB7185";
         readonly hoverBg: string;
         readonly focusBg: "#FFFFFF";
-        readonly pressedBg: "#111827";
+        readonly pressedBg: "#6B7280";
     };
 };
 //# sourceMappingURL=input.d.ts.map

package/dist/highContrast/components/input.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"input.d.ts","sourceRoot":"","sources":["../../../src/highContrast/components/input.ts"],"names":[],"mappings":"AAQA,eAAO,MAAM,KAAK;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAqER,CAAC"}
+{"version":3,"file":"input.d.ts","sourceRoot":"","sources":["../../../src/highContrast/components/input.ts"],"names":[],"mappings":"AAQA,eAAO,MAAM,KAAK;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAsER,CAAC"}

package/dist/highContrast/components/input.js

@@ -58,6 +58,7 @@ export const input = {
         danger: icons.danger,
         muted: icons.muted,
         inverse: icons.inverse,
+        brand: icons.brand,
     },
     clearButton: {
         fg: status.error.fg,

package/dist/highContrast/components/radio.d.ts

@@ -1,38 +1,54 @@
 export declare const radio: {
     readonly default: {
-        readonly bg: "#000000";
-        readonly fg: "#FFFFFF";
+        readonly bg: "#1F2937";
+        readonly fg: "#F9FAFB";
         readonly border: "#FFFFFF";
     };
     readonly hover: {
         readonly bg: "#111827";
         readonly fg: "#B8A8FF";
-        readonly border: "#B8A8FF";
+        readonly border: "#7C5CFF";
+    };
+    readonly pressed: {
+        readonly bg: "#E9E6FF";
+        readonly fg: "#342580";
+        readonly border: "#402C9F";
     };
     readonly checked: {
         readonly default: {
+            readonly fg: "#B8A8FF";
             readonly bg: "#9B7CFF";
-            readonly fg: "#7C5CFF";
-            readonly border: "#B8A8FF";
+            readonly border: "#9B7CFF";
         };
         readonly hover: {
-            readonly fg: "#FFFFFF";
+            readonly fg: "#B8A8FF";
             readonly bg: "#0369A1";
             readonly border: "#0369A1";
         };
         readonly pressed: {
-            readonly fg: "#FFFFFF";
+            readonly fg: "#B8A8FF";
             readonly bg: "#402C9F";
             readonly border: "#402C9F";
         };
+        readonly disabled: {
+            readonly bg: "#111827";
+            readonly fg: "#6B7280";
+            readonly border: "#4B5563";
+        };
     };
     readonly focus: {
         readonly ring: "#F59E0B";
+        readonly border: "#FBBF24";
+    };
+    readonly invalid: {
+        readonly bg: "#000000";
+        readonly fg: "#F9FAFB";
+        readonly border: "#F43F5E";
     };
     readonly disabled: {
         readonly bg: "#111827";
         readonly fg: "#6B7280";
-        readonly border: "#FFFFFF";
+        readonly border: "#4B5563";
     };
 };
 //# sourceMappingURL=radio.d.ts.map

package/dist/highContrast/components/radio.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"radio.d.ts","sourceRoot":"","sources":["../../../src/highContrast/components/radio.ts"],"names":[],"mappings":"AAMA,eAAO,MAAM,KAAK;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA8BR,CAAC"}
+{"version":3,"file":"radio.d.ts","sourceRoot":"","sources":["../../../src/highContrast/components/radio.ts"],"names":[],"mappings":"AAOA,eAAO,MAAM,KAAK;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAkDR,CAAC"}

package/dist/highContrast/components/radio.js

@@ -1,32 +1,48 @@
 import { border } from '../semantic/border.js';
 import { control } from '../semantic/control.js';
 import { focus } from '../semantic/focus.js';
+import { status } from '../semantic/status.js';
 import { surface } from '../semantic/surface.js';
 import { text } from '../semantic/text.js';
 export const radio = {
     default: {
-        bg: surface.default,
-        fg: text.primary,
+        bg: surface.muted,
+        fg: text.inverse,
         border: border.default,
     },
-    hover: control.radioHover,
+    hover: control.hover,
+    pressed: control.active,
     checked: {
-        default: control.selected.radioDefault,
+        default: {
+            ...control.selected.default,
+            fg: text.brand,
+        },
         hover: {
             ...control.selected.hover,
-            fg: text.primary,
+            fg: text.brand,
         },
         pressed: {
             ...control.selected.active,
-            fg: text.primary,
+            fg: text.brand,
+        },
+        disabled: {
+            bg: surface.subtle,
+            fg: text.disabled,
+            border: border.disabled,
         },
     },
     focus: {
         ring: focus.ring,
+        border: border.focus,
+    },
+    invalid: {
+        bg: surface.default,
+        fg: text.inverse,
+        border: status.error.border,
     },
     disabled: {
         bg: surface.subtle,
         fg: text.disabled,
-        border: border.default,
+        border: border.disabled,
     },
 };

package/dist/highContrast/components/select.d.ts

@@ -17,7 +17,7 @@ export declare const select: {
             readonly ring: "#F59E0B";
         };
         readonly disabled: {
-            readonly bg: "#111827";
+            readonly bg: "#1F2937";
             readonly fg: "#6B7280";
             readonly border: "#4B5563";
         };
@@ -26,7 +26,7 @@ export declare const select: {
         };
         readonly error: {
             readonly border: "#FB7185";
-            readonly ring: "#111827";
+            readonly ring: "#E11D48";
         };
     };
     readonly dropdown: {
@@ -50,7 +50,7 @@ export declare const select: {
             readonly fg: "#000000";
         };
         readonly selected: {
-            readonly bg: "#7C5CFF";
+            readonly bg: "#9B7CFF";
             readonly fg: "#FFFFFF";
         };
         readonly disabled: {

package/dist/highContrast/components/select.js

@@ -24,7 +24,7 @@ export const select = {
             ring: focus.ring,
         },
         disabled: {
-            bg: surface.subtle,
+            bg: surface.disabled,
             fg: text.disabled,
             border: border.disabled,
         },

package/dist/highContrast/components/tabs.d.ts

@@ -35,7 +35,7 @@ export declare const tabs: {
         };
         readonly hover: {
             readonly bg: "#FBBF24";
-            readonly fg: "#000000";
+            readonly fg: "#F9FAFB";
             readonly border: "transparent";
         };
         readonly active: {

package/dist/highContrast/components/tooltip.d.ts

@@ -1,7 +1,7 @@
 export declare const tooltip: {
     readonly content: {
         readonly bg: "#FFFFFF";
-        readonly fg: "#000000";
+        readonly fg: "#F9FAFB";
         readonly border: "#FFFFFF";
     };
     readonly arrow: {

package/dist/highContrast/semantic/action.d.ts

@@ -22,7 +22,7 @@ export declare const action: {
         };
         readonly subtle: {
             readonly bg: "#D4CCFF";
-            readonly fg: "#000000";
+            readonly fg: "#F9FAFB";
             readonly border: "#D4CCFF";
         };
     };