@vellira-ui/tokens 2.20.0 → 2.22.0

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

@@ -2,35 +2,62 @@ export declare const input: {
     readonly default: {
         readonly bg: "transparent";
         readonly fg: "#F4F1FB";
-        readonly border: "#E8E2F3";
-        readonly placeholder: "#A8A1BA";
+        readonly border: "#6B6386";
+        readonly placeholder: "#BBB2D2";
+        readonly icon: "#9B7CFF";
     };
     readonly hover: {
-        readonly bg: "#29253A";
+        readonly bg: "#3D3754";
         readonly fg: "#F4F1FB";
-        readonly border: "#A78BFA";
-        readonly placeholder: "#413957";
+        readonly border: "#B8A8FF";
+        readonly placeholder: "#6B6386";
+        readonly icon: "#9B7CFF";
     };
     readonly focus: {
         readonly bg: "transparent";
         readonly fg: "#F4F1FB";
-        readonly border: "#A78BFA";
-        readonly ring: "#A78BFA";
-        readonly placeholder: "#413957";
+        readonly border: "#B8A8FF";
+        readonly ring: "#B8A8FF";
+        readonly placeholder: "#6B6386";
+        readonly icon: "#FFFFFF";
     };
     readonly disabled: {
-        readonly bg: "#29253A";
-        readonly fg: "#746F86";
-        readonly border: "#3A334D";
-        readonly placeholder: "#746F86";
+        readonly bg: "#3D3754";
+        readonly fg: "#958CB0";
+        readonly border: "#4F4867";
+        readonly placeholder: "#958CB0";
+        readonly icon: "#D1D5DB";
     };
     readonly error: {
-        readonly border: "#FF8A8A";
+        readonly border: "#FB7185";
         readonly ring: "#FB7185";
     };
     readonly success: {
-        readonly border: "#22C55E";
-        readonly ring: "#4ADE80";
+        readonly border: "#059669";
+        readonly ring: "#34D399";
+    };
+    readonly readOnly: {
+        readonly bg: "#2F2A42";
+        readonly fg: "#BBB2D2";
+        readonly border: "#4F4867";
+        readonly placeholder: "#6B6386";
+        readonly icon: "#9CA3AF";
+    };
+    readonly icon: {
+        readonly default: "#0F0F0F";
+        readonly primary: "#B8A8FF";
+        readonly secondary: "#9CA3AF";
+        readonly success: "#10B981";
+        readonly danger: "#F43F5E";
+        readonly muted: "#9CA3AF";
+        readonly inverse: "#1A1A1A";
+    };
+    readonly clearButton: {
+        readonly fg: "#FB7185";
+        readonly hoverFg: "#FB7185";
+        readonly hoverBg: string;
+        readonly focusBg: "#FFFFFF";
+        readonly pressedBg: "#6B6386";
     };
 };
 //# sourceMappingURL=input.d.ts.map

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

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

package/dist/dark/components/input.js

@@ -1,5 +1,6 @@
 import { border } from '../semantic/border.js';
 import { focus } from '../semantic/focus.js';
+import { icons } from '../semantic/icons.js';
 import { status } from '../semantic/status.js';
 import { surface } from '../semantic/surface.js';
 import { text } from '../semantic/text.js';
@@ -9,12 +10,14 @@ export const input = {
         fg: text.primary,
         border: border.elevated,
         placeholder: text.secondary,
+        icon: icons.brand,
     },
     hover: {
         bg: surface.hover,
         fg: text.primary,
         border: border.focus,
         placeholder: text.muted,
+        icon: icons.hover,
     },
     focus: {
         bg: 'transparent',
@@ -22,12 +25,14 @@ export const input = {
         border: border.focus,
         ring: focus.ring,
         placeholder: text.muted,
+        icon: icons.subtle,
     },
     disabled: {
-        bg: surface.subtle,
+        bg: surface.elevated,
         fg: text.disabled,
         border: border.default,
         placeholder: text.disabled,
+        icon: icons.disabled,
     },
     error: {
         border: status.error.border,
@@ -37,4 +42,27 @@ export const input = {
         border: status.success.strong,
         ring: status.success.fg,
     },
+    readOnly: {
+        bg: surface.subtle,
+        fg: text.secondary,
+        border: border.default,
+        placeholder: text.muted,
+        icon: icons.muted,
+    },
+    icon: {
+        default: icons.default,
+        primary: icons.primary,
+        secondary: icons.secondary,
+        success: icons.success,
+        danger: icons.danger,
+        muted: icons.muted,
+        inverse: icons.inverse,
+    },
+    clearButton: {
+        fg: status.error.fg,
+        hoverFg: status.error.fg,
+        hoverBg: surface.danger,
+        focusBg: surface.inverse,
+        pressedBg: surface.active,
+    },
 };

package/dist/dark/components/menu.d.ts

@@ -5,19 +5,19 @@ export declare const menu: {
             readonly fg: "#F4F1FB";
         };
         readonly hover: {
-            readonly bg: "#413957";
+            readonly bg: "#6B6386";
             readonly fg: "#F4F1FB";
         };
         readonly active: {
-            readonly bg: "#413957";
+            readonly bg: "#6B6386";
             readonly fg: "#F4F1FB";
         };
         readonly focus: {
             readonly ring: "transparent";
         };
         readonly disabled: {
-            readonly bg: "#29253A";
-            readonly fg: "#746F86";
+            readonly bg: "#2F2A42";
+            readonly fg: "#958CB0";
         };
         readonly danger: {
             readonly default: {
@@ -28,23 +28,23 @@ export declare const menu: {
                 readonly fg: "#FB7185";
             };
             readonly active: {
-                readonly bg: "#FF8A8A";
+                readonly bg: "#FB7185";
                 readonly fg: "#FB7185";
             };
         };
     };
     readonly trigger: {
         readonly default: {
-            readonly fg: "#A78BFA";
+            readonly fg: "#B8A8FF";
         };
         readonly hover: {
-            readonly bg: "#29253A";
+            readonly bg: "#3D3754";
             readonly fg: "#FAF8FF";
             readonly ring: "transparent";
         };
     };
     readonly groupLabel: {
-        readonly fg: "#413957";
+        readonly fg: "#6B6386";
     };
 };
 //# sourceMappingURL=menu.d.ts.map

package/dist/dark/components/modal.d.ts

@@ -3,28 +3,28 @@ export declare const modal: {
         readonly bg: "rgba(0, 0, 0, 0.72)";
     };
     readonly content: {
-        readonly bg: "#312C44";
+        readonly bg: "#3D3754";
         readonly fg: "#F4F1FB";
-        readonly border: "#3A334D";
+        readonly border: "#4F4867";
     };
     readonly title: {
         readonly fg: "#F4F1FB";
     };
     readonly description: {
-        readonly fg: "#413957";
+        readonly fg: "#6B6386";
     };
     readonly closeButton: {
         readonly default: {
             readonly bg: "transparent";
-            readonly fg: "#A8A1BA";
+            readonly fg: "#BBB2D2";
         };
         readonly hover: {
-            readonly bg: "#29253A";
+            readonly bg: "#2F2A42";
             readonly fg: "#F4F1FB";
         };
         readonly disabled: {
             readonly bg: "transparent";
-            readonly fg: "#746F86";
+            readonly fg: "#958CB0";
         };
     };
 };

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

@@ -1,38 +1,38 @@
 export declare const radio: {
     readonly default: {
-        readonly bg: "#312C44";
+        readonly bg: "#3D3754";
         readonly fg: "#F4F1FB";
-        readonly border: "#746F86";
+        readonly border: "#231F31";
     };
     readonly hover: {
-        readonly bg: "#29253A";
-        readonly fg: "#A78BFA";
-        readonly border: "#A78BFA";
+        readonly bg: "#3D3754";
+        readonly fg: "#B8A8FF";
+        readonly border: "#B8A8FF";
     };
     readonly checked: {
         readonly default: {
-            readonly fg: "#A78BFA";
-            readonly bg: "#6D5BD0";
-            readonly border: "#6D5BD0";
+            readonly fg: "#B8A8FF";
+            readonly bg: "#6346E8";
+            readonly border: "#6346E8";
         };
         readonly hover: {
-            readonly fg: "#A78BFA";
-            readonly bg: "#5B4BEA";
-            readonly border: "#5B4BEA";
+            readonly fg: "#B8A8FF";
+            readonly bg: "#5037C8";
+            readonly border: "#5037C8";
         };
         readonly pressed: {
-            readonly bg: "#4936D9";
+            readonly bg: "#402C9F";
             readonly fg: "#FFFFFF";
-            readonly border: "#4936D9";
+            readonly border: "#402C9F";
         };
     };
     readonly focus: {
-        readonly ring: "#A78BFA";
+        readonly ring: "#B8A8FF";
     };
     readonly disabled: {
-        readonly bg: "#29253A";
-        readonly fg: "#746F86";
-        readonly border: "#3A334D";
+        readonly bg: "#2F2A42";
+        readonly fg: "#958CB0";
+        readonly border: "#4F4867";
     };
 };
 //# sourceMappingURL=radio.d.ts.map

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

@@ -3,26 +3,26 @@ export declare const select: {
         readonly default: {
             readonly bg: "transparent";
             readonly fg: "#FFFFFF";
-            readonly border: "#746F86";
+            readonly border: "#231F31";
         };
         readonly hover: {
-            readonly bg: "#29253A";
-            readonly fg: "#A78BFA";
-            readonly border: "#A78BFA";
+            readonly bg: "#3D3754";
+            readonly fg: "#B8A8FF";
+            readonly border: "#B8A8FF";
         };
         readonly focus: {
-            readonly bg: "#1B1726";
+            readonly bg: "#181521";
             readonly fg: "#F4F1FB";
-            readonly border: "#A78BFA";
-            readonly ring: "#A78BFA";
+            readonly border: "#B8A8FF";
+            readonly ring: "#B8A8FF";
         };
         readonly disabled: {
-            readonly bg: "#29253A";
-            readonly fg: "#746F86";
-            readonly border: "#3A334D";
+            readonly bg: "#2F2A42";
+            readonly fg: "#958CB0";
+            readonly border: "#4F4867";
         };
         readonly placeholder: {
-            readonly fg: "#A8A1BA";
+            readonly fg: "#BBB2D2";
         };
         readonly error: {
             readonly border: "#FB7185";
@@ -30,33 +30,33 @@ export declare const select: {
         };
     };
     readonly dropdown: {
-        readonly bg: "#312C44";
+        readonly bg: "#3D3754";
         readonly fg: "#F4F1FB";
-        readonly border: "#3A334D";
+        readonly border: "#4F4867";
     };
     readonly option: {
         readonly default: {
             readonly bg: "transparent";
             readonly fg: "#F4F1FB";
-            readonly border: "#3A334D";
+            readonly border: "#4F4867";
         };
         readonly hover: {
-            readonly bg: "#413957";
+            readonly bg: "#6B6386";
             readonly fg: "#F4F1FB";
         };
         readonly active: {
-            readonly bg: "#413957";
+            readonly bg: "#6B6386";
             readonly fg: "#F4F1FB";
             readonly ring: "transparent";
         };
         readonly selected: {
-            readonly bg: "#5B4BEA";
+            readonly bg: "#5037C8";
             readonly fg: "#FFFFFF";
         };
         readonly disabled: {
             readonly bg: "transparent";
-            readonly fg: "#746F86";
-            readonly border: "#3A334D";
+            readonly fg: "#958CB0";
+            readonly border: "#4F4867";
         };
     };
 };

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

@@ -1,6 +1,6 @@
 export declare const tabs: {
     readonly list: {
-        readonly border: "#3A334D";
+        readonly border: "#4F4867";
     };
     readonly trigger: {
         readonly default: {
@@ -10,20 +10,20 @@ export declare const tabs: {
         };
         readonly hover: {
             readonly bg: "transparent";
-            readonly fg: "#413957";
-            readonly border: "#413957";
+            readonly fg: "#6B6386";
+            readonly border: "#6B6386";
         };
         readonly active: {
             readonly bg: "transparent";
-            readonly fg: "#A78BFA";
-            readonly border: "#6D5BD0";
+            readonly fg: "#B8A8FF";
+            readonly border: "#6346E8";
         };
         readonly focus: {
-            readonly ring: "#413957";
+            readonly ring: "#6B6386";
         };
         readonly disabled: {
             readonly bg: "transparent";
-            readonly fg: "#746F86";
+            readonly fg: "#958CB0";
             readonly border: "transparent";
         };
     };
@@ -34,30 +34,30 @@ export declare const tabs: {
             readonly border: "transparent";
         };
         readonly hover: {
-            readonly bg: "#29253A";
+            readonly bg: "#3D3754";
             readonly fg: "#F4F1FB";
             readonly border: "transparent";
         };
         readonly active: {
-            readonly bg: "#5B4BEA";
+            readonly bg: "#5037C8";
             readonly fg: "#FFFFFF";
-            readonly border: "#7C6CF2";
+            readonly border: "#7C5CFF";
         };
         readonly disabled: {
             readonly bg: "transparent";
-            readonly fg: "#746F86";
+            readonly fg: "#958CB0";
             readonly border: "transparent";
         };
     };
     readonly indicator: {
         readonly default: {
-            readonly bg: "#A78BFA";
+            readonly bg: "#B8A8FF";
         };
         readonly hover: {
-            readonly bg: "#5B4BEA";
+            readonly bg: "#5037C8";
         };
         readonly active: {
-            readonly bg: "#A78BFA";
+            readonly bg: "#B8A8FF";
         };
     };
     readonly panel: {

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

@@ -2,7 +2,7 @@ export declare const tooltip: {
     readonly content: {
         readonly bg: "#FFFFFF";
         readonly fg: "#000000";
-        readonly border: "#3A334D";
+        readonly border: "#4F4867";
     };
     readonly arrow: {
         readonly bg: "#FFFFFF";

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

@@ -1,63 +1,83 @@
 export declare const action: {
     readonly primary: {
         readonly default: {
-            readonly bg: "#6D5BD0";
+            readonly bg: "#6346E8";
             readonly fg: "#FFFFFF";
-            readonly border: "#6D5BD0";
+            readonly border: "#6346E8";
         };
         readonly hover: {
-            readonly bg: "#8B7CF6";
+            readonly bg: "#7C5CFF";
             readonly fg: "#FFFFFF";
-            readonly border: "#8B7CF6";
+            readonly border: "#7C5CFF";
         };
         readonly active: {
-            readonly bg: "#6D5BD0";
+            readonly bg: "#9B7CFF";
             readonly fg: "#FFFFFF";
-            readonly border: "#6D5BD0";
+            readonly border: "#9B7CFF";
         };
         readonly muted: {
-            readonly bg: "#A78BFA";
+            readonly bg: "#B8A8FF";
             readonly fg: "#FFFFFF";
-            readonly border: "#A78BFA";
+            readonly border: "#B8A8FF";
         };
         readonly subtle: {
-            readonly bg: "#C4B5FD";
-            readonly fg: "#A78BFA";
-            readonly border: "#C4B5FD";
+            readonly bg: "#D4CCFF";
+            readonly fg: "#B8A8FF";
+            readonly border: "#D4CCFF";
         };
     };
     readonly secondary: {
         readonly default: {
-            readonly bg: "#9EA2EA";
+            readonly bg: "#1FBEDB";
             readonly fg: "#000000";
-            readonly border: "#9EA2EA";
+            readonly border: "#1FBEDB";
         };
         readonly hover: {
-            readonly bg: "#7B80D8";
+            readonly bg: "#3ED5EE";
             readonly fg: "#000000";
-            readonly border: "#7B80D8";
+            readonly border: "#3ED5EE";
         };
         readonly active: {
-            readonly bg: "#4C4F8F";
+            readonly bg: "#79E8F8";
             readonly fg: "#000000";
-            readonly border: "#4C4F8F";
+            readonly border: "#79E8F8";
+        };
+        readonly muted: {
+            readonly bg: "#79E8F8";
+            readonly fg: "#FFFFFF";
+            readonly border: "#79E8F8";
+        };
+        readonly subtle: {
+            readonly bg: "#B4F4FD";
+            readonly fg: "#B8A8FF";
+            readonly border: "#B4F4FD";
         };
     };
     readonly close: {
         readonly default: {
-            readonly bg: "#E8E2F3";
+            readonly bg: "#BBB2D2";
             readonly fg: "#000000";
-            readonly border: "#E8E2F3";
+            readonly border: "#BBB2D2";
         };
         readonly hover: {
-            readonly bg: "#C4D0DD";
+            readonly bg: "#D4CEE8";
             readonly fg: "#000000";
-            readonly border: "#C4D0DD";
+            readonly border: "#D4CEE8";
         };
         readonly active: {
-            readonly bg: "#D8E4F2";
+            readonly bg: "#E4DDF4";
             readonly fg: "#000000";
-            readonly border: "#D8E4F2";
+            readonly border: "#E4DDF4";
+        };
+        readonly muted: {
+            readonly bg: "#958CB0";
+            readonly fg: "#FFFFFF";
+            readonly border: "#958CB0";
+        };
+        readonly subtle: {
+            readonly bg: "#E4DDF4";
+            readonly fg: "#B8A8FF";
+            readonly border: "#E4DDF4";
         };
     };
     readonly danger: {
@@ -67,23 +87,24 @@ export declare const action: {
             readonly border: "#E11D48";
         };
         readonly hover: {
-            readonly bg: "#DC2626";
+            readonly bg: "#F43F5E";
             readonly fg: "#FFFFFF";
-            readonly border: "#DC2626";
+            readonly border: "#F43F5E";
         };
         readonly active: {
-            readonly bg: "#B91C1C";
+            readonly bg: "#FB7185";
             readonly fg: "#FFFFFF";
-            readonly border: "#B91C1C";
+            readonly border: "#FB7185";
         };
-        readonly subtle: {
+        readonly muted: {
             readonly bg: "#FB7185";
             readonly fg: "#FB7185";
             readonly border: "#FB7185";
         };
-        readonly muted: {
-            readonly bg: "#9F1239";
-            readonly fg: "#FDA4AF";
+        readonly subtle: {
+            readonly bg: "#F43F5E";
+            readonly fg: "#F43F5E";
+            readonly border: "#F43F5E";
         };
     };
 };

package/dist/dark/semantic/action.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"action.d.ts","sourceRoot":"","sources":["../../../src/dark/semantic/action.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2FT,CAAC"}
+{"version":3,"file":"action.d.ts","sourceRoot":"","sources":["../../../src/dark/semantic/action.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAgHT,CAAC"}