shadcn-glass-ui 2.2.3 → 2.2.4

package/dist/lib/hooks/use-responsive.d.ts

@@ -0,0 +1,44 @@
+/**
+ * Tailwind CSS breakpoints
+ * @see https://tailwindcss.com/docs/responsive-design
+ */
+declare const BREAKPOINTS: {
+    readonly xs: 0;
+    readonly sm: 640;
+    readonly md: 768;
+    readonly lg: 1024;
+    readonly xl: 1280;
+    readonly '2xl': 1536;
+};
+export type Breakpoint = keyof typeof BREAKPOINTS;
+export interface UseResponsiveReturn {
+    /** Window width is less than 768px (mobile) */
+    isMobile: boolean;
+    /** Window width is >= 768px and < 1024px (tablet) */
+    isTablet: boolean;
+    /** Window width is >= 1024px (desktop) */
+    isDesktop: boolean;
+    /** Current active breakpoint */
+    currentBreakpoint: Breakpoint;
+    /** Current window width in pixels */
+    width: number;
+}
+/**
+ * Hook to detect current responsive breakpoint
+ *
+ * @returns Responsive state with current breakpoint and device type flags
+ *
+ * @example
+ * ```tsx
+ * const { isMobile, isTablet, isDesktop, currentBreakpoint } = useResponsive();
+ *
+ * return (
+ *   <div className={isMobile ? 'flex-col' : 'flex-row'}>
+ *     {currentBreakpoint === 'lg' && <Sidebar />}
+ *   </div>
+ * );
+ * ```
+ */
+export declare function useResponsive(): UseResponsiveReturn;
+export {};
+//# sourceMappingURL=use-responsive.d.ts.map

package/dist/lib/hooks/use-responsive.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-responsive.d.ts","sourceRoot":"","sources":["../../../src/lib/hooks/use-responsive.ts"],"names":[],"mappings":"AAEA;;;GAGG;AACH,QAAA,MAAM,WAAW;;;;;;;CAOP,CAAC;AAEX,MAAM,MAAM,UAAU,GAAG,MAAM,OAAO,WAAW,CAAC;AAElD,MAAM,WAAW,mBAAmB;IAClC,+CAA+C;IAC/C,QAAQ,EAAE,OAAO,CAAC;IAClB,qDAAqD;IACrD,QAAQ,EAAE,OAAO,CAAC;IAClB,0CAA0C;IAC1C,SAAS,EAAE,OAAO,CAAC;IACnB,gCAAgC;IAChC,iBAAiB,EAAE,UAAU,CAAC;IAC9B,qCAAqC;IACrC,KAAK,EAAE,MAAM,CAAC;CACf;AAED;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,aAAa,IAAI,mBAAmB,CA0CnD"}

package/dist/lib/hooks/use-wallpaper-tint.d.ts

@@ -0,0 +1,57 @@
+export interface WallpaperTintOptions {
+    /**
+     * The image URL to sample for tint color
+     */
+    imageUrl?: string;
+    /**
+     * Debounce delay in milliseconds
+     * @default 300
+     */
+    debounceMs?: number;
+    /**
+     * Number of sample points to take from the image
+     * @default 10
+     */
+    sampleSize?: number;
+    /**
+     * Whether to enable the tint extraction
+     * @default true
+     */
+    enabled?: boolean;
+}
+export interface WallpaperTintResult {
+    /**
+     * The extracted tint color in RGB format
+     * Example: "120, 80, 200"
+     */
+    tintColor: string | null;
+    /**
+     * Whether the tint extraction is in progress
+     */
+    isLoading: boolean;
+    /**
+     * Error message if extraction failed
+     */
+    error: string | null;
+    /**
+     * Re-extract the tint color from the current image
+     */
+    refresh: () => void;
+}
+/**
+ * Hook to extract and use wallpaper tint color
+ *
+ * @example
+ * ```tsx
+ * const { tintColor, isLoading } = useWallpaperTint({
+ *   imageUrl: '/path/to/background.jpg',
+ * });
+ *
+ * // Use tintColor in CSS variables
+ * <div style={{ '--wallpaper-tint': tintColor }}>
+ *   <GlassCard />
+ * </div>
+ * ```
+ */
+export declare const useWallpaperTint: (options?: WallpaperTintOptions) => WallpaperTintResult;
+//# sourceMappingURL=use-wallpaper-tint.d.ts.map

package/dist/lib/hooks/use-wallpaper-tint.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-wallpaper-tint.d.ts","sourceRoot":"","sources":["../../../src/lib/hooks/use-wallpaper-tint.ts"],"names":[],"mappings":"AAOA,MAAM,WAAW,oBAAoB;IACnC;;OAEG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAElB;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IAEpB;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IAEpB;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED,MAAM,WAAW,mBAAmB;IAClC;;;OAGG;IACH,SAAS,EAAE,MAAM,GAAG,IAAI,CAAC;IAEzB;;OAEG;IACH,SAAS,EAAE,OAAO,CAAC;IAEnB;;OAEG;IACH,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IAErB;;OAEG;IACH,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB;AAuGD;;;;;;;;;;;;;;GAcG;AACH,eAAO,MAAM,gBAAgB,GAC3B,UAAS,oBAAyB,KACjC,mBAmDF,CAAC"}

package/dist/lib/hooks.d.ts

@@ -0,0 +1,92 @@
+import { RefObject } from 'react';
+/**
+ * Hook to track hover state of an element
+ * @returns Tuple of [ref, isHovered]
+ */
+export declare const useHover: <T extends HTMLElement = HTMLElement>() => [RefObject<T | null>, boolean];
+/**
+ * Hook to detect clicks outside of an element
+ * @param callback - Function to call when click outside occurs
+ */
+export declare const useClickOutside: <T extends HTMLElement = HTMLElement>(callback: () => void) => RefObject<T | null>;
+/**
+ * Hook to handle Escape key press
+ * @param callback - Function to call when Escape is pressed
+ * @param isActive - Whether the hook is active
+ */
+export declare const useEscapeKey: (callback: () => void, isActive?: boolean) => void;
+/**
+ * Hook to lock body scroll when component is mounted
+ * @param lock - Whether to lock the scroll
+ */
+export declare const useLockBodyScroll: (lock?: boolean) => void;
+/**
+ * Hook to debounce a value
+ * @param value - Value to debounce
+ * @param delay - Delay in milliseconds
+ * @returns Debounced value
+ */
+export declare const useDebounce: <T>(value: T, delay: number) => T;
+/**
+ * Hook to track media query matches
+ * @param query - Media query string
+ * @returns Boolean indicating if query matches
+ */
+export declare const useMediaQuery: (query: string) => boolean;
+/**
+ * Hook to detect if user prefers reduced motion
+ * @returns Boolean indicating preference
+ */
+export declare const usePrefersReducedMotion: () => boolean;
+/**
+ * Hook to toggle a boolean value
+ * @param initialValue - Initial boolean value
+ * @returns Tuple of [value, toggle, setValue]
+ */
+export declare const useToggle: (initialValue?: boolean) => [boolean, () => void, (value: boolean) => void];
+/**
+ * Hook to set a timeout
+ * @param callback - Function to call after timeout
+ * @param delay - Delay in milliseconds (null to clear)
+ */
+export declare const useTimeout: (callback: () => void, delay: number | null) => void;
+/**
+ * Hook to set an interval
+ * @param callback - Function to call on each interval
+ * @param delay - Delay in milliseconds (null to clear)
+ */
+export declare const useInterval: (callback: () => void, delay: number | null) => void;
+/**
+ * Hook to get previous value
+ * @param value - Current value
+ * @returns Previous value
+ */
+export declare const usePrevious: <T>(value: T) => T | undefined;
+/**
+ * Hook to check if component is mounted
+ * @returns Function that returns mount status
+ */
+export declare const useIsMounted: () => (() => boolean);
+interface WindowSize {
+    width: number;
+    height: number;
+}
+/**
+ * Hook to track window size
+ * @returns Object with width and height
+ */
+export declare const useWindowSize: () => WindowSize;
+/**
+ * Hook to trap focus within an element (useful for modals)
+ * @param isActive - Whether the focus trap is active
+ */
+export declare const useFocusTrap: <T extends HTMLElement = HTMLElement>(isActive?: boolean) => RefObject<T | null>;
+/**
+ * Hook to persist state in localStorage
+ * @param key - Storage key
+ * @param initialValue - Initial value
+ * @returns Tuple of [value, setValue]
+ */
+export declare const useLocalStorage: <T>(key: string, initialValue: T) => [T, (value: T | ((prev: T) => T)) => void];
+export {};
+//# sourceMappingURL=hooks.d.ts.map

package/dist/lib/hooks.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"hooks.d.ts","sourceRoot":"","sources":["../../src/lib/hooks.ts"],"names":[],"mappings":"AAIA,OAAO,EAA4C,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAMjF;;;GAGG;AACH,eAAO,MAAM,QAAQ,GAAI,CAAC,SAAS,WAAW,GAAG,WAAW,OAAK,CAC/D,SAAS,CAAC,CAAC,GAAG,IAAI,CAAC,EACnB,OAAO,CAsBR,CAAC;AAMF;;;GAGG;AACH,eAAO,MAAM,eAAe,GAAI,CAAC,SAAS,WAAW,GAAG,WAAW,EACjE,UAAU,MAAM,IAAI,KACnB,SAAS,CAAC,CAAC,GAAG,IAAI,CAiBpB,CAAC;AAMF;;;;GAIG;AACH,eAAO,MAAM,YAAY,GAAI,UAAU,MAAM,IAAI,EAAE,kBAAe,KAAG,IAepE,CAAC;AAMF;;;GAGG;AACH,eAAO,MAAM,iBAAiB,GAAI,cAAW,KAAG,IAW/C,CAAC;AAMF;;;;;GAKG;AACH,eAAO,MAAM,WAAW,GAAI,CAAC,EAAG,OAAO,CAAC,EAAE,OAAO,MAAM,KAAG,CAczD,CAAC;AAMF;;;;GAIG;AACH,eAAO,MAAM,aAAa,GAAI,OAAO,MAAM,KAAG,OAuB7C,CAAC;AAMF;;;GAGG;AACH,eAAO,MAAM,uBAAuB,QAAO,OAE1C,CAAC;AAMF;;;;GAIG;AACH,eAAO,MAAM,SAAS,GACpB,sBAAoB,KACnB,CAAC,OAAO,EAAE,MAAM,IAAI,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,IAAI,CAIhD,CAAC;AAMF;;;;GAIG;AACH,eAAO,MAAM,UAAU,GAAI,UAAU,MAAM,IAAI,EAAE,OAAO,MAAM,GAAG,IAAI,KAAG,IAavE,CAAC;AAMF;;;;GAIG;AACH,eAAO,MAAM,WAAW,GAAI,UAAU,MAAM,IAAI,EAAE,OAAO,MAAM,GAAG,IAAI,KAAG,IAaxE,CAAC;AAMF;;;;GAIG;AACH,eAAO,MAAM,WAAW,GAAI,CAAC,EAAG,OAAO,CAAC,KAAG,CAAC,GAAG,SAU9C,CAAC;AAMF;;;GAGG;AACH,eAAO,MAAM,YAAY,QAAO,CAAC,MAAM,OAAO,CAW7C,CAAC;AAMF,UAAU,UAAU;IAClB,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;CAChB;AAED;;;GAGG;AACH,eAAO,MAAM,aAAa,QAAO,UA0BhC,CAAC;AAMF;;;GAGG;AACH,eAAO,MAAM,YAAY,GAAI,CAAC,SAAS,WAAW,GAAG,WAAW,EAC9D,kBAAe,KACd,SAAS,CAAC,CAAC,GAAG,IAAI,CAuCpB,CAAC;AAMF;;;;;GAKG;AACH,eAAO,MAAM,eAAe,GAAI,CAAC,EAC/B,KAAK,MAAM,EACX,cAAc,CAAC,KACd,CAAC,CAAC,EAAE,CAAC,KAAK,EAAE,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,CAAC,KAAK,CAAC,CAAC,KAAK,IAAI,CA0B3C,CAAC"}

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

@@ -0,0 +1,441 @@
+/**
+ * Design Tokens for Glass UI Library
+ *
+ * Single source of truth for all design values.
+ * Replaces hardcoded rgba/hex values throughout components.
+ */
+export declare const blur: {
+    readonly xs: "4px";
+    readonly sm: "8px";
+    readonly md: "16px";
+    readonly lg: "24px";
+    readonly xl: "32px";
+};
+export declare const duration: {
+    readonly fast: 150;
+    readonly base: 200;
+    readonly slow: 300;
+    readonly slower: 400;
+    readonly slowest: 500;
+};
+export declare const easing: {
+    readonly default: "ease-out";
+    readonly smooth: "cubic-bezier(0.4, 0, 0.2, 1)";
+    readonly bounce: "cubic-bezier(0.68, -0.55, 0.265, 1.55)";
+    readonly spring: "cubic-bezier(0.175, 0.885, 0.32, 1.275)";
+};
+export declare const spacing: {
+    readonly 0: "0";
+    readonly 0.5: "2px";
+    readonly 1: "4px";
+    readonly 1.5: "6px";
+    readonly 2: "8px";
+    readonly 2.5: "10px";
+    readonly 3: "12px";
+    readonly 3.5: "14px";
+    readonly 4: "16px";
+    readonly 5: "20px";
+    readonly 6: "24px";
+    readonly 7: "28px";
+    readonly 8: "32px";
+    readonly 9: "36px";
+    readonly 10: "40px";
+    readonly 12: "48px";
+    readonly 14: "56px";
+    readonly 16: "64px";
+    readonly 20: "80px";
+    readonly 24: "96px";
+};
+export declare const radius: {
+    readonly none: "0";
+    readonly sm: "0.25rem";
+    readonly md: "0.5rem";
+    readonly lg: "0.75rem";
+    readonly xl: "1rem";
+    readonly '2xl': "1.5rem";
+    readonly full: "9999px";
+};
+export declare const fontSize: {
+    readonly xs: "0.75rem";
+    readonly sm: "0.875rem";
+    readonly base: "1rem";
+    readonly lg: "1.125rem";
+    readonly xl: "1.25rem";
+    readonly '2xl': "1.5rem";
+    readonly '3xl': "1.875rem";
+    readonly '4xl': "2.25rem";
+    readonly '5xl': "3rem";
+};
+export declare const lineHeight: {
+    readonly none: "1";
+    readonly tight: "1.25";
+    readonly snug: "1.375";
+    readonly normal: "1.5";
+    readonly relaxed: "1.625";
+    readonly loose: "2";
+};
+export declare const fontWeight: {
+    readonly normal: "400";
+    readonly medium: "500";
+    readonly semibold: "600";
+    readonly bold: "700";
+};
+export declare const zIndex: {
+    readonly behind: -1;
+    readonly base: 0;
+    readonly dropdown: 10;
+    readonly sticky: 20;
+    readonly fixed: 30;
+    readonly modalBackdrop: 40;
+    readonly modal: 50;
+    readonly popover: 60;
+    readonly tooltip: 70;
+};
+export declare const opacity: {
+    readonly 0: "0";
+    readonly 5: "0.05";
+    readonly 10: "0.1";
+    readonly 15: "0.15";
+    readonly 20: "0.2";
+    readonly 25: "0.25";
+    readonly 30: "0.3";
+    readonly 40: "0.4";
+    readonly 50: "0.5";
+    readonly 60: "0.6";
+    readonly 70: "0.7";
+    readonly 80: "0.8";
+    readonly 90: "0.9";
+    readonly 95: "0.95";
+    readonly 100: "1";
+};
+export declare const palette: {
+    readonly violet: {
+        readonly 50: "#f5f3ff";
+        readonly 100: "#ede9fe";
+        readonly 200: "#ddd6fe";
+        readonly 300: "#c4b5fd";
+        readonly 400: "#a78bfa";
+        readonly 500: "#8b5cf6";
+        readonly 600: "#7c3aed";
+        readonly 700: "#6d28d9";
+        readonly 800: "#5b21b6";
+        readonly 900: "#4c1d95";
+    };
+    readonly purple: {
+        readonly 400: "#c084fc";
+        readonly 500: "#a855f7";
+        readonly 600: "#9333ea";
+        readonly 700: "#7e22ce";
+    };
+    readonly blue: {
+        readonly 400: "#60a5fa";
+        readonly 500: "#3b82f6";
+        readonly 600: "#2563eb";
+    };
+    readonly cyan: {
+        readonly 400: "#22d3ee";
+        readonly 500: "#06b6d4";
+        readonly 600: "#0891b2";
+    };
+    readonly pink: {
+        readonly 400: "#f472b6";
+        readonly 500: "#ec4899";
+        readonly 600: "#db2777";
+    };
+    readonly emerald: {
+        readonly 300: "#6ee7b7";
+        readonly 400: "#34d399";
+        readonly 500: "#10b981";
+        readonly 600: "#059669";
+        readonly 700: "#047857";
+    };
+    readonly amber: {
+        readonly 300: "#fcd34d";
+        readonly 400: "#fbbf24";
+        readonly 500: "#f59e0b";
+        readonly 600: "#d97706";
+        readonly 700: "#b45309";
+    };
+    readonly red: {
+        readonly 300: "#fda4af";
+        readonly 400: "#fb7185";
+        readonly 500: "#f43f5e";
+        readonly 600: "#ef4444";
+        readonly 700: "#dc2626";
+        readonly 800: "#b91c1c";
+    };
+    readonly slate: {
+        readonly 50: "#f8fafc";
+        readonly 100: "#f1f5f9";
+        readonly 200: "#e2e8f0";
+        readonly 300: "#cbd5e1";
+        readonly 400: "#94a3b8";
+        readonly 500: "#64748b";
+        readonly 600: "#475569";
+        readonly 700: "#334155";
+        readonly 800: "#1e293b";
+        readonly 900: "#0f172a";
+        readonly 950: "#020617";
+    };
+    readonly white: "#ffffff";
+    readonly black: "#000000";
+};
+/**
+ * Create rgba color from hex
+ */
+export declare function hexToRgba(hex: string, alpha: number): string;
+/**
+ * Common rgba values used throughout the library
+ */
+export declare const rgba: {
+    readonly white: (alpha: number) => string;
+    readonly black: (alpha: number) => string;
+    readonly violet: (alpha: number) => string;
+    readonly purple: (alpha: number) => string;
+    readonly blue: (alpha: number) => string;
+    readonly cyan: (alpha: number) => string;
+    readonly pink: (alpha: number) => string;
+    readonly emerald: (alpha: number) => string;
+    readonly amber: (alpha: number) => string;
+    readonly red: (alpha: number) => string;
+    readonly slate: {
+        readonly 700: (alpha: number) => string;
+        readonly 800: (alpha: number) => string;
+        readonly 900: (alpha: number) => string;
+    };
+};
+export declare const glass: {
+    readonly bg: {
+        readonly subtle: string;
+        readonly light: string;
+        readonly medium: string;
+        readonly strong: string;
+        readonly intense: string;
+    };
+    readonly border: {
+        readonly subtle: string;
+        readonly light: string;
+        readonly medium: string;
+        readonly strong: string;
+        readonly intense: string;
+    };
+    readonly blur: {
+        readonly subtle: "8px";
+        readonly medium: "16px";
+        readonly strong: "24px";
+        readonly intense: "32px";
+    };
+};
+export declare const shadow: {
+    readonly sm: "0 1px 2px 0 rgba(0,0,0,0.05)";
+    readonly base: "0 4px 6px -1px rgba(0,0,0,0.1), 0 2px 4px -2px rgba(0,0,0,0.1)";
+    readonly md: "0 10px 15px -3px rgba(0,0,0,0.1), 0 4px 6px -4px rgba(0,0,0,0.1)";
+    readonly lg: "0 20px 25px -5px rgba(0,0,0,0.1), 0 8px 10px -6px rgba(0,0,0,0.1)";
+    readonly xl: "0 25px 50px -12px rgba(0,0,0,0.25)";
+    readonly glow: {
+        readonly violet: `0 0 30px ${string}, 0 0 60px ${string}`;
+        readonly violetSubtle: `0 8px 32px ${string}`;
+        readonly blue: `0 8px 32px ${string}`;
+        readonly cyan: `0 8px 32px ${string}`;
+        readonly emerald: `0 0 20px ${string}`;
+        readonly amber: `0 0 20px ${string}`;
+        readonly red: `0 0 20px ${string}`;
+    };
+    readonly button: {
+        readonly primary: `0 4px 15px ${string}`;
+        readonly primaryHover: `0 0 30px ${string}, 0 0 60px ${string}`;
+        readonly secondary: "0 4px 20px rgba(0,0,0,0.08)";
+        readonly danger: `0 0 20px ${string}`;
+        readonly success: `0 0 20px ${string}`;
+    };
+    readonly focus: {
+        readonly violet: `0 0 0 3px ${string}, 0 0 20px ${string}`;
+        readonly neutral: "0 0 0 3px rgba(0,0,0,0.05)";
+    };
+    readonly card: {
+        readonly default: "0 8px 32px rgba(0,0,0,0.12)";
+        readonly hover: `0 8px 32px ${string}`;
+    };
+    readonly overlay: {
+        readonly modal: `0 25px 80px ${string}`;
+        readonly dropdown: `0 15px 50px ${string}`;
+    };
+};
+export declare const gradient: {
+    readonly primary: "linear-gradient(135deg, #a855f7, #8b5cf6)";
+    readonly primaryHover: "linear-gradient(135deg, #c084fc, #a855f7)";
+    readonly danger: "linear-gradient(135deg, #f43f5e, #fb7185)";
+    readonly success: "linear-gradient(135deg, #10b981, #34d399)";
+    readonly background: {
+        readonly glass: "linear-gradient(135deg, #0f172a, #581c87, #0f172a)";
+        readonly aurora: "linear-gradient(135deg, #020617, #0f172a, #020617)";
+        readonly light: "linear-gradient(135deg, #f1f5f9, #eff6ff, #f5f3ff)";
+    };
+    readonly text: {
+        readonly violet: "linear-gradient(135deg, #a78bfa, #60a5fa)";
+    };
+    readonly rainbow: {
+        readonly default: "linear-gradient(90deg,\n      #34d399,\n      #22d3ee,\n      #60a5fa,\n      #a78bfa,\n      #c084fc,\n      #f472b6\n    )";
+    };
+    readonly progress: {
+        readonly violet: "linear-gradient(90deg, #8b5cf6, #a855f7)";
+    };
+};
+export declare const animation: {
+    readonly timing: {
+        readonly fadeIn: "150ms ease-out";
+        readonly slideIn: "200ms ease-out";
+        readonly scaleIn: "200ms ease-out";
+        readonly hover: "300ms cubic-bezier(0.4, 0, 0.2, 1)";
+        readonly button: "300ms ease-out";
+        readonly modal: "300ms cubic-bezier(0.4, 0, 0.2, 1)";
+        readonly dropdown: "200ms cubic-bezier(0.4, 0, 0.2, 1)";
+    };
+    readonly transition: {
+        readonly all: "all 300ms cubic-bezier(0.4, 0, 0.2, 1)";
+        readonly colors: "color 200ms ease-out, background-color 200ms ease-out, border-color 200ms ease-out";
+        readonly transform: "transform 200ms cubic-bezier(0.4, 0, 0.2, 1)";
+        readonly opacity: "opacity 150ms ease-out";
+        readonly shadow: "box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1)";
+    };
+};
+export declare const component: {
+    readonly button: {
+        readonly height: {
+            readonly sm: "32px";
+            readonly md: "40px";
+            readonly lg: "48px";
+        };
+        readonly padding: {
+            readonly sm: "8px 12px";
+            readonly md: "10px 16px";
+            readonly lg: "12px 24px";
+        };
+        readonly fontSize: {
+            readonly sm: "0.75rem";
+            readonly md: "0.875rem";
+            readonly lg: "1rem";
+        };
+        readonly iconSize: {
+            readonly sm: "14px";
+            readonly md: "16px";
+            readonly lg: "18px";
+        };
+    };
+    readonly input: {
+        readonly height: {
+            readonly sm: "32px";
+            readonly md: "40px";
+            readonly lg: "48px";
+        };
+        readonly padding: {
+            readonly sm: "8px 12px";
+            readonly md: "10px 16px";
+            readonly lg: "12px 20px";
+        };
+        readonly fontSize: {
+            readonly sm: "0.875rem";
+            readonly md: "0.875rem";
+            readonly lg: "1rem";
+        };
+    };
+    readonly badge: {
+        readonly height: {
+            readonly sm: "18px";
+            readonly md: "22px";
+            readonly lg: "26px";
+        };
+        readonly padding: {
+            readonly sm: "2px 8px";
+            readonly md: "4px 10px";
+            readonly lg: "6px 12px";
+        };
+        readonly fontSize: {
+            readonly sm: "10px";
+            readonly md: "0.75rem";
+            readonly lg: "0.875rem";
+        };
+    };
+    readonly avatar: {
+        readonly size: {
+            readonly xs: "24px";
+            readonly sm: "32px";
+            readonly md: "40px";
+            readonly lg: "56px";
+            readonly xl: "80px";
+            readonly '2xl': "96px";
+        };
+        readonly fontSize: {
+            readonly xs: "10px";
+            readonly sm: "0.75rem";
+            readonly md: "0.875rem";
+            readonly lg: "1.125rem";
+            readonly xl: "1.25rem";
+            readonly '2xl': "1.5rem";
+        };
+    };
+    readonly modal: {
+        readonly width: {
+            readonly sm: "400px";
+            readonly md: "500px";
+            readonly lg: "640px";
+            readonly xl: "800px";
+        };
+        readonly padding: "24px";
+        readonly borderRadius: "1rem";
+    };
+    readonly card: {
+        readonly padding: {
+            readonly sm: "12px";
+            readonly md: "16px";
+            readonly lg: "24px";
+        };
+        readonly borderRadius: "1rem";
+    };
+    readonly tooltip: {
+        readonly padding: "6px 12px";
+        readonly fontSize: "0.875rem";
+        readonly borderRadius: "0.5rem";
+        readonly maxWidth: "250px";
+    };
+    readonly dropdown: {
+        readonly minWidth: "160px";
+        readonly maxWidth: "320px";
+        readonly padding: "8px";
+        readonly itemPadding: "8px 12px";
+        readonly borderRadius: "0.75rem";
+    };
+    readonly toggle: {
+        readonly width: "44px";
+        readonly height: "24px";
+        readonly thumbSize: "18px";
+        readonly borderRadius: "9999px";
+    };
+    readonly checkbox: {
+        readonly size: "20px";
+        readonly borderRadius: "0.25rem";
+    };
+    readonly slider: {
+        readonly trackHeight: "6px";
+        readonly thumbSize: "18px";
+        readonly borderRadius: "9999px";
+    };
+    readonly progress: {
+        readonly height: {
+            readonly sm: "4px";
+            readonly md: "8px";
+            readonly lg: "12px";
+        };
+        readonly borderRadius: "9999px";
+    };
+};
+export type BlurToken = keyof typeof blur;
+export type DurationToken = keyof typeof duration;
+export type EasingToken = keyof typeof easing;
+export type SpacingToken = keyof typeof spacing;
+export type RadiusToken = keyof typeof radius;
+export type FontSizeToken = keyof typeof fontSize;
+export type FontWeightToken = keyof typeof fontWeight;
+export type ZIndexToken = keyof typeof zIndex;
+export type OpacityToken = keyof typeof opacity;
+//# sourceMappingURL=tokens.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"tokens.d.ts","sourceRoot":"","sources":["../../../src/lib/theme/tokens.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAMH,eAAO,MAAM,IAAI;;;;;;CAMP,CAAC;AAMX,eAAO,MAAM,QAAQ;;;;;;CAMX,CAAC;AAMX,eAAO,MAAM,MAAM;;;;;CAKT,CAAC;AAMX,eAAO,MAAM,OAAO;;;;;;;;;;;;;;;;;;;;;CAqBV,CAAC;AAMX,eAAO,MAAM,MAAM;;;;;;;;CAQT,CAAC;AAMX,eAAO,MAAM,QAAQ;;;;;;;;;;CAUX,CAAC;AAMX,eAAO,MAAM,UAAU;;;;;;;CAOb,CAAC;AAMX,eAAO,MAAM,UAAU;;;;;CAKb,CAAC;AAMX,eAAO,MAAM,MAAM;;;;;;;;;;CAUT,CAAC;AAMX,eAAO,MAAM,OAAO;;;;;;;;;;;;;;;;CAgBV,CAAC;AAMX,eAAO,MAAM,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAyFV,CAAC;AAMX;;GAEG;AACH,wBAAgB,SAAS,CAAC,GAAG,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,GAAG,MAAM,CAK5D;AAED;;GAEG;AACH,eAAO,MAAM,IAAI;4BACA,MAAM;4BACN,MAAM;6BACL,MAAM;6BACN,MAAM;2BACR,MAAM;2BACN,MAAM;2BACN,MAAM;8BACH,MAAM;4BACR,MAAM;0BACR,MAAM;;8BAEJ,MAAM;8BACN,MAAM;8BACN,MAAM;;CAEb,CAAC;AAMX,eAAO,MAAM,KAAK;;;;;;;;;;;;;;;;;;;;;CA0BR,CAAC;AAMX,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA6CT,CAAC;AAMX,eAAO,MAAM,QAAQ;;;;;;;;;;;;;;;;;;;CAmCX,CAAC;AAMX,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;CAoBZ,CAAC;AAMX,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA4IZ,CAAC;AAMX,MAAM,MAAM,SAAS,GAAG,MAAM,OAAO,IAAI,CAAC;AAC1C,MAAM,MAAM,aAAa,GAAG,MAAM,OAAO,QAAQ,CAAC;AAClD,MAAM,MAAM,WAAW,GAAG,MAAM,OAAO,MAAM,CAAC;AAC9C,MAAM,MAAM,YAAY,GAAG,MAAM,OAAO,OAAO,CAAC;AAChD,MAAM,MAAM,WAAW,GAAG,MAAM,OAAO,MAAM,CAAC;AAC9C,MAAM,MAAM,aAAa,GAAG,MAAM,OAAO,QAAQ,CAAC;AAClD,MAAM,MAAM,eAAe,GAAG,MAAM,OAAO,UAAU,CAAC;AACtD,MAAM,MAAM,WAAW,GAAG,MAAM,OAAO,MAAM,CAAC;AAC9C,MAAM,MAAM,YAAY,GAAG,MAAM,OAAO,OAAO,CAAC"}