npm - @classic-homes/theme-tokens - Versions diffs - 0.1.0 - Mend

@classic-homes/theme-tokens 0.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (6) hide show

package/dist/index.d.mts ADDED Viewed

@@ -0,0 +1,903 @@
+/**
+ * Design Tokens for Classic Theme
+ *
+ * Based on Classic Homes Brand Guidelines
+ * These tokens define the core design system values including colors,
+ * typography, spacing, and other design primitives.
+ */
+declare const colors: {
+    readonly white: "#ffffff";
+    readonly black: "#000000";
+    readonly gray: {
+        readonly 50: "#f9fafb";
+        readonly 100: "#f3f4f6";
+        readonly 200: "#e5e7eb";
+        readonly 300: "#d1d5db";
+        readonly 400: "#9ca3af";
+        readonly 500: "#7a7a7a";
+        readonly 600: "#4f4f4f";
+        readonly 700: "#3d3d3d";
+        readonly 800: "#2a2a2a";
+        readonly 900: "#1a1a1a";
+        readonly 950: "#0a0a0a";
+    };
+    readonly red: {
+        readonly 50: "#fef2f2";
+        readonly 100: "#fee2e2";
+        readonly 200: "#fecaca";
+        readonly 300: "#fca5a5";
+        readonly 400: "#f87171";
+        readonly 500: "#e02726";
+        readonly 600: "#c81f1e";
+        readonly 700: "#a91c22";
+        readonly 800: "#7f1d1d";
+        readonly 900: "#5c1010";
+        readonly 950: "#3d0a0a";
+    };
+    readonly teal: {
+        readonly 50: "#f0fafa";
+        readonly 100: "#d9f2f3";
+        readonly 200: "#b3e6e7";
+        readonly 300: "#8dd9db";
+        readonly 400: "#67cccf";
+        readonly 500: "#3ba4a7";
+        readonly 600: "#2f8386";
+        readonly 700: "#236265";
+        readonly 800: "#184144";
+        readonly 900: "#0c2123";
+        readonly 950: "#061012";
+    };
+    readonly navy: {
+        readonly 50: "#f0f4f6";
+        readonly 100: "#d9e4ea";
+        readonly 200: "#b3c9d5";
+        readonly 300: "#8daebf";
+        readonly 400: "#6793aa";
+        readonly 500: "#417895";
+        readonly 600: "#2d5467";
+        readonly 700: "#002e3f";
+        readonly 800: "#00242f";
+        readonly 900: "#001a20";
+        readonly 950: "#000d10";
+    };
+    readonly plum: {
+        readonly 50: "#f8f4f6";
+        readonly 100: "#ede2e8";
+        readonly 200: "#dbc5d1";
+        readonly 300: "#c9a8ba";
+        readonly 400: "#b78ba3";
+        readonly 500: "#a56e8c";
+        readonly 600: "#7f4968";
+        readonly 700: "#5e2c41";
+        readonly 800: "#4b2334";
+        readonly 900: "#381a27";
+        readonly 950: "#1c0d13";
+    };
+    readonly sage: {
+        readonly 50: "#f7f7f5";
+        readonly 100: "#eaebe6";
+        readonly 200: "#dddfd5";
+        readonly 300: "#d0d3c5";
+        readonly 400: "#c3c7b5";
+        readonly 500: "#b6baa4";
+        readonly 600: "#969a82";
+        readonly 700: "#757968";
+        readonly 800: "#54574e";
+        readonly 900: "#333634";
+        readonly 950: "#1a1b1a";
+    };
+    readonly stone: {
+        readonly 50: "#f7f7f7";
+        readonly 100: "#ebebeb";
+        readonly 200: "#d7d8d7";
+        readonly 300: "#c3c5c3";
+        readonly 400: "#afb2af";
+        readonly 500: "#9b9f9b";
+        readonly 600: "#878c87";
+        readonly 700: "#676d69";
+        readonly 800: "#4d524f";
+        readonly 900: "#333735";
+        readonly 950: "#1a1b1b";
+    };
+    readonly forest: {
+        readonly 50: "#f4f7f5";
+        readonly 100: "#e1ebe4";
+        readonly 200: "#c3d7c9";
+        readonly 300: "#a5c3ae";
+        readonly 400: "#87af93";
+        readonly 500: "#6aa275";
+        readonly 600: "#55825d";
+        readonly 700: "#406146";
+        readonly 800: "#2b412e";
+        readonly 900: "#162017";
+        readonly 950: "#0b100c";
+    };
+    readonly lavender: {
+        readonly 50: "#f7f6f8";
+        readonly 100: "#ece9ed";
+        readonly 200: "#d9d3db";
+        readonly 300: "#c6bdc9";
+        readonly 400: "#b3a7b7";
+        readonly 500: "#a091a5";
+        readonly 600: "#8d7b93";
+        readonly 700: "#695a75";
+        readonly 800: "#51445a";
+        readonly 900: "#392e3f";
+        readonly 950: "#1d1720";
+    };
+    readonly sky: {
+        readonly 50: "#f4f8fb";
+        readonly 100: "#e2ecf3";
+        readonly 200: "#c5d9e7";
+        readonly 300: "#a8c6db";
+        readonly 400: "#8bb3cf";
+        readonly 500: "#6ea0c3";
+        readonly 600: "#5f91b8";
+        readonly 700: "#4c7493";
+        readonly 800: "#39576e";
+        readonly 900: "#263a49";
+        readonly 950: "#131d25";
+    };
+    readonly deepTeal: {
+        readonly 50: "#f2f5f5";
+        readonly 100: "#dce5e4";
+        readonly 200: "#b9cbc9";
+        readonly 300: "#96b1ae";
+        readonly 400: "#739793";
+        readonly 500: "#507d78";
+        readonly 600: "#306966";
+        readonly 800: "#18332f";
+        readonly 900: "#0c1918";
+        readonly 950: "#060c0c";
+    };
+    readonly charcoal: {
+        readonly 50: "#f5f5f5";
+        readonly 100: "#e6e6e6";
+        readonly 200: "#cccccc";
+        readonly 300: "#b3b3b3";
+        readonly 400: "#999999";
+        readonly 500: "#808080";
+        readonly 600: "#666666";
+        readonly 700: "#4d4d4d";
+        readonly 800: "#333333";
+        readonly 900: "#292424";
+        readonly 950: "#141212";
+    };
+};
+/**
+ * Brand Colors - Direct mapping for brand-specific use
+ * Use these when exact brand color matching is required
+ */
+declare const brandColors: {
+    readonly red: {
+        readonly logo: "#e02726";
+        readonly primary: "#a91c22";
+    };
+    readonly grey: {
+        readonly 1: "#4f4f4f";
+        readonly 2: "#7a7a7a";
+    };
+    readonly core: {
+        readonly 1: "#3ba4a7";
+        readonly 2: "#002e3f";
+        readonly 3: "#5e2c41";
+        readonly 4: "#969a82";
+        readonly '4tint': "#eaebe6";
+    };
+    readonly collection: {
+        readonly 1: "#676d69";
+        readonly 2: "#6aa275";
+        readonly 3: "#695a75";
+        readonly 4: "#5f91b8";
+        readonly 5: "#306966";
+        readonly 6: "#292424";
+    };
+};
+/**
+ * System Status Colors
+ * Used for alerts, notifications, and feedback states
+ */
+declare const statusColors: {
+    readonly success: "#10b981";
+    readonly warning: "#f59e0b";
+    readonly error: "#ef4444";
+    readonly info: "#3b82f6";
+};
+/**
+ * Layout Tokens
+ * Used for app-level layout and surfaces
+ */
+declare const layoutColors: {
+    readonly contentBg: "#f5f5f5";
+    readonly surfaceBorder: "#000000";
+};
+/**
+ * Semantic color mappings for UI components
+ * These follow the shadcn/ui pattern and map to brand colors
+ */
+declare const semanticColors: {
+    readonly light: {
+        readonly background: "#ffffff";
+        readonly foreground: "#4f4f4f";
+        readonly card: "#ffffff";
+        readonly cardForeground: "#4f4f4f";
+        readonly popover: "#ffffff";
+        readonly popoverForeground: "#4f4f4f";
+        readonly primary: "#a91c22";
+        readonly primaryForeground: "#ffffff";
+        readonly secondary: "#eaebe6";
+        readonly secondaryForeground: "#4f4f4f";
+        readonly muted: "#eaebe6";
+        readonly mutedForeground: "#7a7a7a";
+        readonly accent: "#3ba4a7";
+        readonly accentForeground: "#ffffff";
+        readonly destructive: "#e02726";
+        readonly destructiveForeground: "#ffffff";
+        readonly border: "#000000";
+        readonly input: "#000000";
+        readonly ring: "#a91c22";
+        readonly success: "#10b981";
+        readonly successForeground: "#ffffff";
+        readonly warning: "#f59e0b";
+        readonly warningForeground: "#ffffff";
+        readonly info: "#3b82f6";
+        readonly infoForeground: "#ffffff";
+        readonly contentBg: "#f5f5f5";
+        readonly surfaceBorder: "#000000";
+        readonly sidebar: {
+            readonly background: "#f7f7f5";
+            readonly foreground: "#7a7a7a";
+            readonly primary: "#a91c22";
+            readonly primaryForeground: "#ffffff";
+            readonly accent: "#dddfd5";
+            readonly accentForeground: "#4f4f4f";
+            readonly border: "#000000";
+            readonly ring: "#a91c22";
+        };
+        readonly chart: {
+            readonly 1: "#3ba4a7";
+            readonly 2: "#002e3f";
+            readonly 3: "#5e2c41";
+            readonly 4: "#6aa275";
+            readonly 5: "#5f91b8";
+        };
+    };
+    readonly dark: {
+        readonly background: "#292424";
+        readonly foreground: "#f3f4f6";
+        readonly card: "#333333";
+        readonly cardForeground: "#f3f4f6";
+        readonly popover: "#333333";
+        readonly popoverForeground: "#f3f4f6";
+        readonly primary: "#f87171";
+        readonly primaryForeground: "#292424";
+        readonly secondary: "#54574e";
+        readonly secondaryForeground: "#f3f4f6";
+        readonly muted: "#4d4d4d";
+        readonly mutedForeground: "#9ca3af";
+        readonly accent: "#67cccf";
+        readonly accentForeground: "#292424";
+        readonly destructive: "#e02726";
+        readonly destructiveForeground: "#ffffff";
+        readonly border: "#9ca3af";
+        readonly input: "#9ca3af";
+        readonly ring: "#f87171";
+        readonly success: "#34d399";
+        readonly successForeground: "#292424";
+        readonly warning: "#fbbf24";
+        readonly warningForeground: "#292424";
+        readonly info: "#60a5fa";
+        readonly infoForeground: "#292424";
+        readonly contentBg: "#333333";
+        readonly surfaceBorder: "#9ca3af";
+        readonly sidebar: {
+            readonly background: "#000000";
+            readonly foreground: "#9ca3af";
+            readonly primary: "#f87171";
+            readonly primaryForeground: "#292424";
+            readonly accent: "#4d4d4d";
+            readonly accentForeground: "#f3f4f6";
+            readonly border: "#9ca3af";
+            readonly ring: "#f87171";
+        };
+        readonly chart: {
+            readonly 1: "#67cccf";
+            readonly 2: "#6793aa";
+            readonly 3: "#b78ba3";
+            readonly 4: "#87af93";
+            readonly 5: "#8bb3cf";
+        };
+    };
+};
+declare const spacing: {
+    readonly 0: "0";
+    readonly px: "1px";
+    readonly 0.5: "0.125rem";
+    readonly 1: "0.25rem";
+    readonly 1.5: "0.375rem";
+    readonly 2: "0.5rem";
+    readonly 2.5: "0.625rem";
+    readonly 3: "0.75rem";
+    readonly 3.5: "0.875rem";
+    readonly 4: "1rem";
+    readonly 5: "1.25rem";
+    readonly 6: "1.5rem";
+    readonly 7: "1.75rem";
+    readonly 8: "2rem";
+    readonly 9: "2.25rem";
+    readonly 10: "2.5rem";
+    readonly 11: "2.75rem";
+    readonly 12: "3rem";
+    readonly 14: "3.5rem";
+    readonly 16: "4rem";
+    readonly 20: "5rem";
+    readonly 24: "6rem";
+    readonly 28: "7rem";
+    readonly 32: "8rem";
+    readonly 36: "9rem";
+    readonly 40: "10rem";
+    readonly 44: "11rem";
+    readonly 48: "12rem";
+    readonly 52: "13rem";
+    readonly 56: "14rem";
+    readonly 60: "15rem";
+    readonly 64: "16rem";
+    readonly 72: "18rem";
+    readonly 80: "20rem";
+    readonly 96: "24rem";
+};
+/**
+ * Typography tokens based on Classic Homes brand guidelines
+ * Web fonts: Figtree (sans) and Source Serif Variable (serif)
+ */
+declare const fontFamily: {
+    readonly sans: readonly ["Figtree", "ui-sans-serif", "system-ui", "-apple-system", "BlinkMacSystemFont", "\"Segoe UI\"", "Roboto", "\"Helvetica Neue\"", "Arial", "sans-serif"];
+    readonly serif: readonly ["\"Source Serif Variable\"", "\"Source Serif Pro\"", "ui-serif", "Georgia", "Cambria", "\"Times New Roman\"", "Times", "serif"];
+    readonly mono: readonly ["ui-monospace", "SFMono-Regular", "Menlo", "Monaco", "Consolas", "\"Liberation Mono\"", "\"Courier New\"", "monospace"];
+};
+declare const fontSize: {
+    readonly xs: readonly ["0.75rem", {
+        readonly lineHeight: "1rem";
+    }];
+    readonly sm: readonly ["0.875rem", {
+        readonly lineHeight: "1.25rem";
+    }];
+    readonly base: readonly ["1rem", {
+        readonly lineHeight: "1.5rem";
+    }];
+    readonly lg: readonly ["1.125rem", {
+        readonly lineHeight: "1.75rem";
+    }];
+    readonly xl: readonly ["1.25rem", {
+        readonly lineHeight: "1.75rem";
+    }];
+    readonly '2xl': readonly ["1.5rem", {
+        readonly lineHeight: "2rem";
+    }];
+    readonly '3xl': readonly ["1.875rem", {
+        readonly lineHeight: "2.25rem";
+    }];
+    readonly '4xl': readonly ["2.25rem", {
+        readonly lineHeight: "2.5rem";
+    }];
+    readonly '5xl': readonly ["3rem", {
+        readonly lineHeight: "1";
+    }];
+    readonly '6xl': readonly ["3.75rem", {
+        readonly lineHeight: "1";
+    }];
+    readonly '7xl': readonly ["4.5rem", {
+        readonly lineHeight: "1";
+    }];
+    readonly '8xl': readonly ["6rem", {
+        readonly lineHeight: "1";
+    }];
+    readonly '9xl': readonly ["8rem", {
+        readonly lineHeight: "1";
+    }];
+};
+/**
+ * Font weights matching Figtree variants
+ * Light (300), Regular (400), Bold (700), Black (900 for uppercase)
+ */
+declare const fontWeight: {
+    readonly thin: "100";
+    readonly extralight: "200";
+    readonly light: "300";
+    readonly normal: "400";
+    readonly medium: "500";
+    readonly semibold: "600";
+    readonly bold: "700";
+    readonly extrabold: "800";
+    readonly black: "900";
+};
+declare const borderRadius: {
+    readonly none: "0";
+    readonly sm: "0.125rem";
+    readonly DEFAULT: "0.5rem";
+    readonly md: "0.5rem";
+    readonly lg: "0.75rem";
+    readonly xl: "1rem";
+    readonly '2xl': "1.5rem";
+    readonly '3xl': "2rem";
+    readonly full: "9999px";
+};
+declare const boxShadow: {
+    readonly sm: "0 1px 2px 0 rgb(0 0 0 / 0.05)";
+    readonly DEFAULT: "0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1)";
+    readonly md: "0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1)";
+    readonly lg: "0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1)";
+    readonly xl: "0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1)";
+    readonly '2xl': "0 25px 50px -12px rgb(0 0 0 / 0.25)";
+    readonly inner: "inset 0 2px 4px 0 rgb(0 0 0 / 0.05)";
+    readonly none: "none";
+};
+declare const zIndex: {
+    readonly 0: "0";
+    readonly 10: "10";
+    readonly 20: "20";
+    readonly 30: "30";
+    readonly 40: "40";
+    readonly 50: "50";
+    readonly auto: "auto";
+};
+declare const breakpoints: {
+    readonly sm: "640px";
+    readonly md: "768px";
+    readonly lg: "1024px";
+    readonly xl: "1280px";
+    readonly '2xl': "1536px";
+};
+declare const transition: {
+    readonly duration: {
+        readonly fast: "150ms";
+        readonly base: "200ms";
+        readonly slow: "300ms";
+        readonly slower: "500ms";
+    };
+    readonly timing: {
+        readonly ease: "ease";
+        readonly easeIn: "ease-in";
+        readonly easeOut: "ease-out";
+        readonly easeInOut: "ease-in-out";
+        readonly linear: "linear";
+    };
+};
+declare const tokens: {
+    readonly colors: {
+        readonly white: "#ffffff";
+        readonly black: "#000000";
+        readonly gray: {
+            readonly 50: "#f9fafb";
+            readonly 100: "#f3f4f6";
+            readonly 200: "#e5e7eb";
+            readonly 300: "#d1d5db";
+            readonly 400: "#9ca3af";
+            readonly 500: "#7a7a7a";
+            readonly 600: "#4f4f4f";
+            readonly 700: "#3d3d3d";
+            readonly 800: "#2a2a2a";
+            readonly 900: "#1a1a1a";
+            readonly 950: "#0a0a0a";
+        };
+        readonly red: {
+            readonly 50: "#fef2f2";
+            readonly 100: "#fee2e2";
+            readonly 200: "#fecaca";
+            readonly 300: "#fca5a5";
+            readonly 400: "#f87171";
+            readonly 500: "#e02726";
+            readonly 600: "#c81f1e";
+            readonly 700: "#a91c22";
+            readonly 800: "#7f1d1d";
+            readonly 900: "#5c1010";
+            readonly 950: "#3d0a0a";
+        };
+        readonly teal: {
+            readonly 50: "#f0fafa";
+            readonly 100: "#d9f2f3";
+            readonly 200: "#b3e6e7";
+            readonly 300: "#8dd9db";
+            readonly 400: "#67cccf";
+            readonly 500: "#3ba4a7";
+            readonly 600: "#2f8386";
+            readonly 700: "#236265";
+            readonly 800: "#184144";
+            readonly 900: "#0c2123";
+            readonly 950: "#061012";
+        };
+        readonly navy: {
+            readonly 50: "#f0f4f6";
+            readonly 100: "#d9e4ea";
+            readonly 200: "#b3c9d5";
+            readonly 300: "#8daebf";
+            readonly 400: "#6793aa";
+            readonly 500: "#417895";
+            readonly 600: "#2d5467";
+            readonly 700: "#002e3f";
+            readonly 800: "#00242f";
+            readonly 900: "#001a20";
+            readonly 950: "#000d10";
+        };
+        readonly plum: {
+            readonly 50: "#f8f4f6";
+            readonly 100: "#ede2e8";
+            readonly 200: "#dbc5d1";
+            readonly 300: "#c9a8ba";
+            readonly 400: "#b78ba3";
+            readonly 500: "#a56e8c";
+            readonly 600: "#7f4968";
+            readonly 700: "#5e2c41";
+            readonly 800: "#4b2334";
+            readonly 900: "#381a27";
+            readonly 950: "#1c0d13";
+        };
+        readonly sage: {
+            readonly 50: "#f7f7f5";
+            readonly 100: "#eaebe6";
+            readonly 200: "#dddfd5";
+            readonly 300: "#d0d3c5";
+            readonly 400: "#c3c7b5";
+            readonly 500: "#b6baa4";
+            readonly 600: "#969a82";
+            readonly 700: "#757968";
+            readonly 800: "#54574e";
+            readonly 900: "#333634";
+            readonly 950: "#1a1b1a";
+        };
+        readonly stone: {
+            readonly 50: "#f7f7f7";
+            readonly 100: "#ebebeb";
+            readonly 200: "#d7d8d7";
+            readonly 300: "#c3c5c3";
+            readonly 400: "#afb2af";
+            readonly 500: "#9b9f9b";
+            readonly 600: "#878c87";
+            readonly 700: "#676d69";
+            readonly 800: "#4d524f";
+            readonly 900: "#333735";
+            readonly 950: "#1a1b1b";
+        };
+        readonly forest: {
+            readonly 50: "#f4f7f5";
+            readonly 100: "#e1ebe4";
+            readonly 200: "#c3d7c9";
+            readonly 300: "#a5c3ae";
+            readonly 400: "#87af93";
+            readonly 500: "#6aa275";
+            readonly 600: "#55825d";
+            readonly 700: "#406146";
+            readonly 800: "#2b412e";
+            readonly 900: "#162017";
+            readonly 950: "#0b100c";
+        };
+        readonly lavender: {
+            readonly 50: "#f7f6f8";
+            readonly 100: "#ece9ed";
+            readonly 200: "#d9d3db";
+            readonly 300: "#c6bdc9";
+            readonly 400: "#b3a7b7";
+            readonly 500: "#a091a5";
+            readonly 600: "#8d7b93";
+            readonly 700: "#695a75";
+            readonly 800: "#51445a";
+            readonly 900: "#392e3f";
+            readonly 950: "#1d1720";
+        };
+        readonly sky: {
+            readonly 50: "#f4f8fb";
+            readonly 100: "#e2ecf3";
+            readonly 200: "#c5d9e7";
+            readonly 300: "#a8c6db";
+            readonly 400: "#8bb3cf";
+            readonly 500: "#6ea0c3";
+            readonly 600: "#5f91b8";
+            readonly 700: "#4c7493";
+            readonly 800: "#39576e";
+            readonly 900: "#263a49";
+            readonly 950: "#131d25";
+        };
+        readonly deepTeal: {
+            readonly 50: "#f2f5f5";
+            readonly 100: "#dce5e4";
+            readonly 200: "#b9cbc9";
+            readonly 300: "#96b1ae";
+            readonly 400: "#739793";
+            readonly 500: "#507d78";
+            readonly 600: "#306966";
+            readonly 800: "#18332f";
+            readonly 900: "#0c1918";
+            readonly 950: "#060c0c";
+        };
+        readonly charcoal: {
+            readonly 50: "#f5f5f5";
+            readonly 100: "#e6e6e6";
+            readonly 200: "#cccccc";
+            readonly 300: "#b3b3b3";
+            readonly 400: "#999999";
+            readonly 500: "#808080";
+            readonly 600: "#666666";
+            readonly 700: "#4d4d4d";
+            readonly 800: "#333333";
+            readonly 900: "#292424";
+            readonly 950: "#141212";
+        };
+    };
+    readonly brandColors: {
+        readonly red: {
+            readonly logo: "#e02726";
+            readonly primary: "#a91c22";
+        };
+        readonly grey: {
+            readonly 1: "#4f4f4f";
+            readonly 2: "#7a7a7a";
+        };
+        readonly core: {
+            readonly 1: "#3ba4a7";
+            readonly 2: "#002e3f";
+            readonly 3: "#5e2c41";
+            readonly 4: "#969a82";
+            readonly '4tint': "#eaebe6";
+        };
+        readonly collection: {
+            readonly 1: "#676d69";
+            readonly 2: "#6aa275";
+            readonly 3: "#695a75";
+            readonly 4: "#5f91b8";
+            readonly 5: "#306966";
+            readonly 6: "#292424";
+        };
+    };
+    readonly statusColors: {
+        readonly success: "#10b981";
+        readonly warning: "#f59e0b";
+        readonly error: "#ef4444";
+        readonly info: "#3b82f6";
+    };
+    readonly layoutColors: {
+        readonly contentBg: "#f5f5f5";
+        readonly surfaceBorder: "#000000";
+    };
+    readonly semanticColors: {
+        readonly light: {
+            readonly background: "#ffffff";
+            readonly foreground: "#4f4f4f";
+            readonly card: "#ffffff";
+            readonly cardForeground: "#4f4f4f";
+            readonly popover: "#ffffff";
+            readonly popoverForeground: "#4f4f4f";
+            readonly primary: "#a91c22";
+            readonly primaryForeground: "#ffffff";
+            readonly secondary: "#eaebe6";
+            readonly secondaryForeground: "#4f4f4f";
+            readonly muted: "#eaebe6";
+            readonly mutedForeground: "#7a7a7a";
+            readonly accent: "#3ba4a7";
+            readonly accentForeground: "#ffffff";
+            readonly destructive: "#e02726";
+            readonly destructiveForeground: "#ffffff";
+            readonly border: "#000000";
+            readonly input: "#000000";
+            readonly ring: "#a91c22";
+            readonly success: "#10b981";
+            readonly successForeground: "#ffffff";
+            readonly warning: "#f59e0b";
+            readonly warningForeground: "#ffffff";
+            readonly info: "#3b82f6";
+            readonly infoForeground: "#ffffff";
+            readonly contentBg: "#f5f5f5";
+            readonly surfaceBorder: "#000000";
+            readonly sidebar: {
+                readonly background: "#f7f7f5";
+                readonly foreground: "#7a7a7a";
+                readonly primary: "#a91c22";
+                readonly primaryForeground: "#ffffff";
+                readonly accent: "#dddfd5";
+                readonly accentForeground: "#4f4f4f";
+                readonly border: "#000000";
+                readonly ring: "#a91c22";
+            };
+            readonly chart: {
+                readonly 1: "#3ba4a7";
+                readonly 2: "#002e3f";
+                readonly 3: "#5e2c41";
+                readonly 4: "#6aa275";
+                readonly 5: "#5f91b8";
+            };
+        };
+        readonly dark: {
+            readonly background: "#292424";
+            readonly foreground: "#f3f4f6";
+            readonly card: "#333333";
+            readonly cardForeground: "#f3f4f6";
+            readonly popover: "#333333";
+            readonly popoverForeground: "#f3f4f6";
+            readonly primary: "#f87171";
+            readonly primaryForeground: "#292424";
+            readonly secondary: "#54574e";
+            readonly secondaryForeground: "#f3f4f6";
+            readonly muted: "#4d4d4d";
+            readonly mutedForeground: "#9ca3af";
+            readonly accent: "#67cccf";
+            readonly accentForeground: "#292424";
+            readonly destructive: "#e02726";
+            readonly destructiveForeground: "#ffffff";
+            readonly border: "#9ca3af";
+            readonly input: "#9ca3af";
+            readonly ring: "#f87171";
+            readonly success: "#34d399";
+            readonly successForeground: "#292424";
+            readonly warning: "#fbbf24";
+            readonly warningForeground: "#292424";
+            readonly info: "#60a5fa";
+            readonly infoForeground: "#292424";
+            readonly contentBg: "#333333";
+            readonly surfaceBorder: "#9ca3af";
+            readonly sidebar: {
+                readonly background: "#000000";
+                readonly foreground: "#9ca3af";
+                readonly primary: "#f87171";
+                readonly primaryForeground: "#292424";
+                readonly accent: "#4d4d4d";
+                readonly accentForeground: "#f3f4f6";
+                readonly border: "#9ca3af";
+                readonly ring: "#f87171";
+            };
+            readonly chart: {
+                readonly 1: "#67cccf";
+                readonly 2: "#6793aa";
+                readonly 3: "#b78ba3";
+                readonly 4: "#87af93";
+                readonly 5: "#8bb3cf";
+            };
+        };
+    };
+    readonly spacing: {
+        readonly 0: "0";
+        readonly px: "1px";
+        readonly 0.5: "0.125rem";
+        readonly 1: "0.25rem";
+        readonly 1.5: "0.375rem";
+        readonly 2: "0.5rem";
+        readonly 2.5: "0.625rem";
+        readonly 3: "0.75rem";
+        readonly 3.5: "0.875rem";
+        readonly 4: "1rem";
+        readonly 5: "1.25rem";
+        readonly 6: "1.5rem";
+        readonly 7: "1.75rem";
+        readonly 8: "2rem";
+        readonly 9: "2.25rem";
+        readonly 10: "2.5rem";
+        readonly 11: "2.75rem";
+        readonly 12: "3rem";
+        readonly 14: "3.5rem";
+        readonly 16: "4rem";
+        readonly 20: "5rem";
+        readonly 24: "6rem";
+        readonly 28: "7rem";
+        readonly 32: "8rem";
+        readonly 36: "9rem";
+        readonly 40: "10rem";
+        readonly 44: "11rem";
+        readonly 48: "12rem";
+        readonly 52: "13rem";
+        readonly 56: "14rem";
+        readonly 60: "15rem";
+        readonly 64: "16rem";
+        readonly 72: "18rem";
+        readonly 80: "20rem";
+        readonly 96: "24rem";
+    };
+    readonly fontFamily: {
+        readonly sans: readonly ["Figtree", "ui-sans-serif", "system-ui", "-apple-system", "BlinkMacSystemFont", "\"Segoe UI\"", "Roboto", "\"Helvetica Neue\"", "Arial", "sans-serif"];
+        readonly serif: readonly ["\"Source Serif Variable\"", "\"Source Serif Pro\"", "ui-serif", "Georgia", "Cambria", "\"Times New Roman\"", "Times", "serif"];
+        readonly mono: readonly ["ui-monospace", "SFMono-Regular", "Menlo", "Monaco", "Consolas", "\"Liberation Mono\"", "\"Courier New\"", "monospace"];
+    };
+    readonly fontSize: {
+        readonly xs: readonly ["0.75rem", {
+            readonly lineHeight: "1rem";
+        }];
+        readonly sm: readonly ["0.875rem", {
+            readonly lineHeight: "1.25rem";
+        }];
+        readonly base: readonly ["1rem", {
+            readonly lineHeight: "1.5rem";
+        }];
+        readonly lg: readonly ["1.125rem", {
+            readonly lineHeight: "1.75rem";
+        }];
+        readonly xl: readonly ["1.25rem", {
+            readonly lineHeight: "1.75rem";
+        }];
+        readonly '2xl': readonly ["1.5rem", {
+            readonly lineHeight: "2rem";
+        }];
+        readonly '3xl': readonly ["1.875rem", {
+            readonly lineHeight: "2.25rem";
+        }];
+        readonly '4xl': readonly ["2.25rem", {
+            readonly lineHeight: "2.5rem";
+        }];
+        readonly '5xl': readonly ["3rem", {
+            readonly lineHeight: "1";
+        }];
+        readonly '6xl': readonly ["3.75rem", {
+            readonly lineHeight: "1";
+        }];
+        readonly '7xl': readonly ["4.5rem", {
+            readonly lineHeight: "1";
+        }];
+        readonly '8xl': readonly ["6rem", {
+            readonly lineHeight: "1";
+        }];
+        readonly '9xl': readonly ["8rem", {
+            readonly lineHeight: "1";
+        }];
+    };
+    readonly fontWeight: {
+        readonly thin: "100";
+        readonly extralight: "200";
+        readonly light: "300";
+        readonly normal: "400";
+        readonly medium: "500";
+        readonly semibold: "600";
+        readonly bold: "700";
+        readonly extrabold: "800";
+        readonly black: "900";
+    };
+    readonly borderRadius: {
+        readonly none: "0";
+        readonly sm: "0.125rem";
+        readonly DEFAULT: "0.5rem";
+        readonly md: "0.5rem";
+        readonly lg: "0.75rem";
+        readonly xl: "1rem";
+        readonly '2xl': "1.5rem";
+        readonly '3xl': "2rem";
+        readonly full: "9999px";
+    };
+    readonly boxShadow: {
+        readonly sm: "0 1px 2px 0 rgb(0 0 0 / 0.05)";
+        readonly DEFAULT: "0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1)";
+        readonly md: "0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1)";
+        readonly lg: "0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1)";
+        readonly xl: "0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1)";
+        readonly '2xl': "0 25px 50px -12px rgb(0 0 0 / 0.25)";
+        readonly inner: "inset 0 2px 4px 0 rgb(0 0 0 / 0.05)";
+        readonly none: "none";
+    };
+    readonly zIndex: {
+        readonly 0: "0";
+        readonly 10: "10";
+        readonly 20: "20";
+        readonly 30: "30";
+        readonly 40: "40";
+        readonly 50: "50";
+        readonly auto: "auto";
+    };
+    readonly breakpoints: {
+        readonly sm: "640px";
+        readonly md: "768px";
+        readonly lg: "1024px";
+        readonly xl: "1280px";
+        readonly '2xl': "1536px";
+    };
+    readonly transition: {
+        readonly duration: {
+            readonly fast: "150ms";
+            readonly base: "200ms";
+            readonly slow: "300ms";
+            readonly slower: "500ms";
+        };
+        readonly timing: {
+            readonly ease: "ease";
+            readonly easeIn: "ease-in";
+            readonly easeOut: "ease-out";
+            readonly easeInOut: "ease-in-out";
+            readonly linear: "linear";
+        };
+    };
+};
+export { borderRadius, boxShadow, brandColors, breakpoints, colors, tokens as default, fontFamily, fontSize, fontWeight, layoutColors, semanticColors, spacing, statusColors, tokens, transition, zIndex };