@voxel51/voodo 1.4.0-dev.0 → 2.1.0

package/dist/theme/tokens/colors.d.ts

@@ -1,13 +1,12 @@
 /**
- * Color tokens.
+ * Color tokens — GENERATED from Figma's variable export by
+ * kb/eng/projects/design-system-tokens/tools/build_colors.py.
+ * Do not edit by hand; re-run the generator instead.
  *
- * Two-tier system mirroring the Figma variables:
- *  - `primitives`: raw color scales (neutral/orange/green/red/blue/yellow/
- *    purple/pink/teal). Not emitted as CSS vars directly.
- *  - `colors.{common,dark,light}`: semantic tokens that reference primitives.
- *    These are flattened to CSS custom properties by the theme generator.
- *
- * Values are sourced from the Figma "Theme" variable collection (both modes).
+ * Two tiers, mirroring the Figma collections:
+ *  - `primitives`: raw color scales. Not emitted as CSS vars directly.
+ *  - `colors.{dark,light}.content.*`: semantic tokens referencing them,
+ *    named exactly as the Figma variables are.
  */
 export declare const primitives: {
     readonly neutral: {
@@ -40,11 +39,11 @@ export declare const primitives: {
         readonly 1000: "#000000";
     };
     readonly orange: {
-        readonly 300: "#FFD098";
-        readonly 400: "#FF9950";
-        readonly 500: "#FF6D04";
-        readonly 600: "#D05700";
-        readonly 700: "#9B4200";
+        readonly 300: "#FFB584";
+        readonly 400: "#FF8A3D";
+        readonly 500: "#FA5300";
+        readonly 600: "#C74200";
+        readonly 700: "#943100";
     };
     readonly green: {
         readonly 300: "#7AB87C";
@@ -95,12 +94,37 @@ export declare const primitives: {
         readonly 600: "#0A766C";
         readonly 700: "#075951";
     };
+    readonly expressive: {
+        readonly "orange-default": "#FA5300";
+        readonly "pink-default": "#DA3B72";
+        readonly "purple-default": "#B84DD9";
+        readonly "orange-hover": "#D14600";
+        readonly "pink-hover": "#C62B60";
+        readonly "purple-hover": "#9E37C0";
+        readonly "orange-pressed": "#A83800";
+        readonly "pink-pressed": "#A9214F";
+        readonly "purple-pressed": "#82299F";
+    };
+    readonly lime: {
+        readonly 300: "#86C816";
+        readonly 400: "#6FA512";
+        readonly 500: "#57820E";
+        readonly 600: "#45670B";
+        readonly 700: "#334D08";
+    };
+    readonly magenta: {
+        readonly 300: "#E9A0F0";
+        readonly 400: "#DB64E6";
+        readonly 500: "#C623D5";
+        readonly 600: "#9C1CA8";
+        readonly 700: "#75157E";
+    };
 };
 export declare const colors: {
     common: {
         brand: {
-            primary: "#FF6D04";
-            accent: "#FF9950";
+            primary: "#FA5300";
+            accent: "#FF8A3D";
         };
         semantic: {
             success: "#1E7D45";
@@ -112,302 +136,348 @@ export declare const colors: {
     dark: {
         content: {
             bg: {
+                accent: "#FF8A3D";
                 background: "#18191A";
-                card: {
-                    1: "#1E1F20";
-                    2: "#232526";
-                    elevated: "#2F3234";
-                };
+                card: "#1E1F20";
+                "card-elevated": "#2F3234";
+                "card-nested": "#232526";
+                failure: "#C33636";
+                info: "#2563EB";
                 muted: "#1F2021";
                 popover: "#141618";
+                primary: "#FA5300";
                 secondary: "#1C1D1E";
                 selected: string;
-                raised: "#2F3234";
-            };
-            text: {
-                fg: "#FFF9F5";
-                primary: "#FFFFFF";
-                secondary: "#8F8D8B";
-                tertiary: "#6E6C6A";
-                muted: "#9C9896";
-                placeholder: "#6B6968";
-                success: "#7AB87C";
-                destructive: "#FF6767";
-                info: "#86B5F6";
-                warning: "#FCCB58";
-                accent: "#FF9950";
-                decorative: "#FFD098";
+                success: "#1E7D45";
+                warning: "#D97706";
             };
             border: {
+                active: "#FA5300";
                 default: "#2F3234";
-                strong: "#3E4244";
-                hover: "#4A4C4E";
+                disabled: "#1E1F20";
+                error: "#FF6767";
                 focus: "#6E6C6A";
+                hover: "#4A4C4E";
+                input: "#2F3234";
+                "input-focus": "#6E6C6A";
+                "input-hover": "#4A4C4E";
+                strong: "#3E4244";
                 subtle: "#1E1F20";
-                active: "#FF6D04";
-                error: "#FF6767";
                 success: "#7AB87C";
                 warning: "#FCCB58";
-                disabled: "#1E1F20";
-                input: "#2F3234";
-                "input-hover": "#4A4C4E";
-                "input-focus": "#6E6C6A";
             };
-            status: {
-                approved: "#7AB87C";
-                review: "#FF9950";
-                progress: "#CBA6FF";
-                default: "#8F8D8B";
-                failed: "#FF6767";
+            code: {
+                bg: "#141618";
+                border: "#2F3234";
+                text: "#FF8A3D";
+            };
+            focus: {
+                ring: string;
             };
             icon: {
+                brand: "#FA5300";
+                dark: "#18191A";
+                decorative: "#FF8A3D";
                 default: "#8F8D8B";
-                subtle: "#6E6C6A";
+                disabled: "#6B6968";
                 emphasis: "#FFFFFF";
+                failure: "#FF6767";
+                info: "#86B5F6";
                 muted: "#6B6968";
-                disabled: "#6B6968";
-                decorative: "#FF9950";
-                brand: "#FF6D04";
-                dark: "#18191A";
-                "brand-accent": "#FF9950";
+                subtle: "#6E6C6A";
                 success: "#7AB87C";
-                destructive: "#FF6767";
                 warning: "#FCCB58";
-                info: "#86B5F6";
             };
-            overlay: {
-                default: string;
-                light: string;
-                heavy: string;
-            };
-            focus: {
-                ring: string;
+            interactive: {
+                "danger-default": "#C33636";
+                "danger-hover": "#9B2727";
+                "danger-pressed": "#751D1D";
+                "expressive-default": {
+                    end: "#B84DD9";
+                    mid: "#DA3B72";
+                    start: "#FA5300";
+                };
+                "expressive-hover": {
+                    end: "#9E37C0";
+                    mid: "#C62B60";
+                    start: "#D14600";
+                };
+                "expressive-pressed": {
+                    end: "#82299F";
+                    mid: "#A9214F";
+                    start: "#A83800";
+                };
+                "primary-default": "#FA5300";
+                "primary-hover": "#C74200";
+                "primary-pressed": "#943100";
+                "secondary-default": "#232526";
+                "secondary-hover": "#2A2B2C";
+                "secondary-pressed": "#1E1F20";
+                "success-default": "#1E7D45";
+                "success-hover": "#166638";
+                "success-pressed": "#0E4E2B";
             };
             link: {
                 default: "#86B5F6";
                 hover: "#4F8BEF";
                 visited: "#AB81FB";
             };
-            palette: {
-                1: "#FF6D04";
-                2: "#2563EB";
-                3: "#1E7D45";
-                4: "#8B5CF6";
-                5: "#DB2777";
-                6: "#D97706";
-                7: "#0D9488";
-                8: "#6F42C1";
-                9: "#532E91";
-                10: "#C33636";
-                11: "#B26003";
-                12: "#166638";
-                orange: "#FF6D04";
-                blue: "#2563EB";
-                green: "#1E7D45";
-                purple: "#8B5CF6";
-                pink: "#DB2777";
-                yellow: "#D97706";
-                teal: "#0D9488";
-                red: "#C33636";
-            };
-            skeleton: {
-                base: "#232526";
-                shimmer: "#2F3234";
-            };
-            tooltip: {
-                bg: "#2A2B2C";
-                text: "#FFF9F5";
-            };
-            code: {
-                bg: "#141618";
-                text: "#FF9950";
-                border: "#2F3234";
+            scrim: {
+                default: string;
+                heavy: string;
+                light: string;
             };
             scrollbar: {
-                track: "#18191A";
                 thumb: "#3E4244";
                 "thumb-hover": "#4A4C4E";
+                track: "#18191A";
             };
             selection: {
                 bg: string;
                 text: "#FFFFFF";
             };
-        };
-        action: {
-            primary: {
-                primary: "#FF6D04";
-                secondary: "#D05700";
-                tertiary: "#9B4200";
-                text: "#FFFFFF";
+            skeleton: {
+                base: "#232526";
+                shimmer: "#2F3234";
             };
-            secondary: {
-                primary: "#232526";
-                secondary: "#2A2B2C";
-                tertiary: "#1E1F20";
-                text: "#FFFFFF";
+            status: {
+                approved: {
+                    bg: "#1E7D45";
+                    text: "#7AB87C";
+                };
+                draft: {
+                    bg: "#6B6968";
+                    text: "#8F8D8B";
+                };
+                failed: {
+                    bg: "#C33636";
+                    text: "#FF6767";
+                };
+                progress: {
+                    bg: "#8B5CF6";
+                    text: "#CBA6FF";
+                };
+                review: {
+                    bg: "#FA5300";
+                    text: "#FF8A3D";
+                };
             };
-            success: {
-                primary: "#1E7D45";
-                secondary: "#166638";
-                tertiary: "#0E4E2B";
-                text: "#FFFFFF";
+            text: {
+                accent: "#FF8A3D";
+                decorative: "#FF8A3D";
+                failure: "#FF6767";
+                foreground: "#FFF9F5";
+                info: "#86B5F6";
+                inverse: "#1C1D1E";
+                muted: "#9C9896";
+                placeholder: "#6B6968";
+                primary: "#FFFFFF";
+                secondary: "#8F8D8B";
+                success: "#7AB87C";
+                tertiary: "#6E6C6A";
+                warning: "#FCCB58";
             };
-            danger: {
-                primary: "#C33636";
-                secondary: "#9B2727";
-                tertiary: "#751D1D";
-                text: "#FFFFFF";
+            tooltip: {
+                bg: "#2A2B2C";
+                text: "#FFF9F5";
+            };
+            "viz-chart": {
+                blue: "#4F8BEF";
+                green: "#4CA05A";
+                lime: "#6FA512";
+                magenta: "#DB64E6";
+                neutral: "#9C9896";
+                pink: "#EF5793";
+                purple: "#AB81FB";
+                red: "#FF6767";
+                teal: "#32ADA0";
+                yellow: "#ECAB2E";
+            };
+            "viz-overlay": {
+                blue: "#4F8BEF";
+                green: "#4CA05A";
+                lime: "#6FA512";
+                magenta: "#DB64E6";
+                neutral: "#9C9896";
+                pink: "#EF5793";
+                purple: "#AB81FB";
+                red: "#FF6767";
+                teal: "#32ADA0";
+                yellow: "#ECAB2E";
             };
         };
     };
     light: {
         content: {
             bg: {
+                accent: "#FF8A3D";
                 background: "#F9F8F7";
-                card: {
-                    1: "#FFFFFF";
-                    2: "#F2F1F0";
-                    elevated: "#FFFFFF";
-                };
+                card: "#FFFFFF";
+                "card-elevated": "#FFFFFF";
+                "card-nested": "#F2F1F0";
+                failure: "#C33636";
+                info: "#2563EB";
                 muted: "#EEEDEC";
                 popover: "#FFFFFF";
+                primary: "#FA5300";
                 secondary: "#E8E7E6";
                 selected: string;
-                raised: "#E8E7E6";
-            };
-            text: {
-                fg: "#000000";
-                primary: "#18191A";
-                secondary: "#4A4847";
-                tertiary: "#6B6968";
-                muted: "#8F8D8B";
-                placeholder: "#B5B3B1";
-                success: "#166638";
-                destructive: "#9B2727";
-                info: "#1D4EBA";
-                warning: "#8A4A02";
-                accent: "#D97706";
-                decorative: "#FF9950";
+                success: "#1E7D45";
+                warning: "#D97706";
             };
             border: {
+                active: "#FA5300";
                 default: "#E0DEDC";
-                strong: "#D0CECC";
-                hover: "#C0BEBC";
+                disabled: "#EEEDEC";
+                error: "#C33636";
                 focus: "#A0A09E";
+                hover: "#C0BEBC";
+                input: "#D0CECC";
+                "input-focus": "#A0A09E";
+                "input-hover": "#C0BEBC";
+                strong: "#D0CECC";
                 subtle: "#EEEDEC";
-                active: "#FF6D04";
-                error: "#C33636";
                 success: "#1E7D45";
                 warning: "#D97706";
-                disabled: "#EEEDEC";
-                input: "#D0CECC";
-                "input-hover": "#C0BEBC";
-                "input-focus": "#A0A09E";
             };
-            status: {
-                approved: "#1E7D45";
-                review: "#D05700";
-                progress: "#8B5CF6";
-                default: "#6B6968";
-                failed: "#C33636";
+            code: {
+                bg: "#F2F1F0";
+                border: "#E0DEDC";
+                text: "#943100";
+            };
+            focus: {
+                ring: string;
             };
             icon: {
+                brand: "#FA5300";
+                dark: "#18191A";
+                decorative: "#FA5300";
                 default: "#6B6968";
-                subtle: "#8F8D8B";
+                disabled: "#B5B3B1";
                 emphasis: "#18191A";
+                failure: "#C33636";
+                info: "#2563EB";
                 muted: "#B5B3B1";
-                disabled: "#B5B3B1";
-                decorative: "#D05700";
-                brand: "#FF6D04";
-                dark: "#18191A";
-                "brand-accent": "#FF9950";
+                subtle: "#8F8D8B";
                 success: "#1E7D45";
-                destructive: "#C33636";
                 warning: "#D97706";
-                info: "#2563EB";
             };
-            overlay: {
-                default: string;
-                light: string;
-                heavy: string;
-            };
-            focus: {
-                ring: string;
+            interactive: {
+                "danger-default": "#C33636";
+                "danger-hover": "#9B2727";
+                "danger-pressed": "#751D1D";
+                "expressive-default": {
+                    end: "#B84DD9";
+                    mid: "#DA3B72";
+                    start: "#FA5300";
+                };
+                "expressive-hover": {
+                    end: "#9E37C0";
+                    mid: "#C62B60";
+                    start: "#D14600";
+                };
+                "expressive-pressed": {
+                    end: "#82299F";
+                    mid: "#A9214F";
+                    start: "#A83800";
+                };
+                "primary-default": "#FA5300";
+                "primary-hover": "#C74200";
+                "primary-pressed": "#943100";
+                "secondary-default": "#EEEDEC";
+                "secondary-hover": "#E0DEDC";
+                "secondary-pressed": "#D0CECC";
+                "success-default": "#1E7D45";
+                "success-hover": "#166638";
+                "success-pressed": "#0E4E2B";
             };
             link: {
                 default: "#2563EB";
                 hover: "#1D4EBA";
                 visited: "#6F42C1";
             };
-            palette: {
-                1: "#FF6D04";
-                2: "#2563EB";
-                3: "#1E7D45";
-                4: "#8B5CF6";
-                5: "#DB2777";
-                6: "#D97706";
-                7: "#0D9488";
-                8: "#6F42C1";
-                9: "#532E91";
-                10: "#C33636";
-                11: "#B26003";
-                12: "#166638";
-                orange: "#FF6D04";
-                blue: "#2563EB";
-                green: "#1E7D45";
-                purple: "#8B5CF6";
-                pink: "#DB2777";
-                yellow: "#D97706";
-                teal: "#0D9488";
-                red: "#C33636";
-            };
-            skeleton: {
-                base: "#EEEDEC";
-                shimmer: "#E0DEDC";
-            };
-            tooltip: {
-                bg: "#18191A";
-                text: "#FFF9F5";
-            };
-            code: {
-                bg: "#F2F1F0";
-                text: "#D05700";
-                border: "#E0DEDC";
+            scrim: {
+                default: string;
+                heavy: string;
+                light: string;
             };
             scrollbar: {
-                track: "#F2F1F0";
                 thumb: "#D0CECC";
                 "thumb-hover": "#C0BEBC";
+                track: "#F2F1F0";
             };
             selection: {
                 bg: string;
                 text: "#000000";
             };
-        };
-        action: {
-            primary: {
-                primary: "#FF6D04";
-                secondary: "#D05700";
-                tertiary: "#9B4200";
-                text: "#FFFFFF";
+            skeleton: {
+                base: "#EEEDEC";
+                shimmer: "#E0DEDC";
             };
-            secondary: {
-                primary: "#EEEDEC";
-                secondary: "#E0DEDC";
-                tertiary: "#D0CECC";
-                text: "#000000";
+            status: {
+                approved: {
+                    bg: "#1E7D45";
+                    text: "#166638";
+                };
+                draft: {
+                    bg: "#6B6968";
+                    text: "#4A4C4E";
+                };
+                failed: {
+                    bg: "#C33636";
+                    text: "#9B2727";
+                };
+                progress: {
+                    bg: "#8B5CF6";
+                    text: "#6F42C1";
+                };
+                review: {
+                    bg: "#FA5300";
+                    text: "#C74200";
+                };
             };
-            success: {
-                primary: "#1E7D45";
-                secondary: "#166638";
-                tertiary: "#0E4E2B";
-                text: "#FFFFFF";
+            text: {
+                accent: "#FA5300";
+                decorative: "#FA5300";
+                failure: "#9B2727";
+                foreground: "#000000";
+                info: "#1D4EBA";
+                inverse: "#FFFFFF";
+                muted: "#8F8D8B";
+                placeholder: "#B5B3B1";
+                primary: "#18191A";
+                secondary: "#4A4847";
+                success: "#166638";
+                tertiary: "#6B6968";
+                warning: "#8A4A02";
             };
-            danger: {
-                primary: "#C33636";
-                secondary: "#9B2727";
-                tertiary: "#751D1D";
-                text: "#FFFFFF";
+            tooltip: {
+                bg: "#18191A";
+                text: "#FFF9F5";
+            };
+            "viz-chart": {
+                blue: "#2563EB";
+                green: "#1E7D45";
+                lime: "#57820E";
+                magenta: "#C623D5";
+                neutral: "#6E6C6A";
+                pink: "#DB2777";
+                purple: "#8B5CF6";
+                red: "#C33636";
+                teal: "#0D9488";
+                yellow: "#D97706";
+            };
+            "viz-overlay": {
+                blue: "#4F8BEF";
+                green: "#4CA05A";
+                lime: "#6FA512";
+                magenta: "#DB64E6";
+                neutral: "#9C9896";
+                pink: "#EF5793";
+                purple: "#AB81FB";
+                red: "#FF6767";
+                teal: "#32ADA0";
+                yellow: "#ECAB2E";
             };
         };
     };

package/dist/theme/tokens/colors.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"colors.d.ts","sourceRoot":"","sources":["../../../src/theme/tokens/colors.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AACH,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAsFb,CAAC;AAEX,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA6TlB,CAAC"}
+{"version":3,"file":"colors.d.ts","sourceRoot":"","sources":["../../../src/theme/tokens/colors.ts"],"names":[],"mappings":"AAAA;;;;;;;;;GASG;AACH,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA+Gb,CAAC;AAEX,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAyWlB,CAAC"}

package/dist/theme/tokens/gradients.d.ts

@@ -0,0 +1,6 @@
+export declare const gradients: {
+    readonly action: {
+        readonly expressive: "linear-gradient(105deg, #FA5300, #DA3B72 55%, #B84DD9)";
+    };
+};
+//# sourceMappingURL=gradients.d.ts.map

package/dist/theme/tokens/gradients.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"gradients.d.ts","sourceRoot":"","sources":["../../../src/theme/tokens/gradients.ts"],"names":[],"mappings":"AAKA,eAAO,MAAM,SAAS;;;;CAIZ,CAAC"}