@tenerife.music/ui 0.0.7 → 1.0.0

package/dist/tokens/motion.d.ts

@@ -0,0 +1,358 @@
+/**
+ * Motion System Tokens
+ *
+ * Complete motion system for Tenerife UI based on design system specifications.
+ * Includes: durations, easing functions, transitions, keyframe animations,
+ * and reduced motion support for accessibility.
+ *
+ * All motion respects user preferences for reduced motion (prefers-reduced-motion).
+ * Base duration unit: 100ms
+ */
+/**
+ * Animation Duration Tokens
+ * Values: instant, fast, normal, slow, slower, slowest
+ * Base unit: 100ms
+ */
+export declare const durations: {
+    readonly instant: "0ms";
+    readonly fast: "150ms";
+    readonly normal: "300ms";
+    readonly slow: "500ms";
+    readonly slower: "700ms";
+    readonly slowest: "1000ms";
+    readonly "75": "75ms";
+    readonly "100": "100ms";
+    readonly "200": "200ms";
+    readonly "250": "250ms";
+    readonly "400": "400ms";
+    readonly "600": "600ms";
+    readonly "800": "800ms";
+};
+/**
+ * Easing Function Tokens
+ * Cubic-bezier functions for natural motion
+ */
+export declare const easings: {
+    readonly linear: "linear";
+    readonly "ease-in": "cubic-bezier(0.4, 0, 1, 1)";
+    readonly "ease-out": "cubic-bezier(0, 0, 0.2, 1)";
+    readonly "ease-in-out": "cubic-bezier(0.4, 0, 0.2, 1)";
+    readonly ease: "ease";
+    readonly bounce: "cubic-bezier(0.68, -0.55, 0.265, 1.55)";
+    readonly elastic: "cubic-bezier(0.175, 0.885, 0.32, 1.275)";
+    readonly "ease-out-cubic": "cubic-bezier(0.215, 0.61, 0.355, 1)";
+    readonly "ease-in-cubic": "cubic-bezier(0.55, 0.055, 0.675, 0.19)";
+    readonly "ease-in-out-cubic": "cubic-bezier(0.645, 0.045, 0.355, 1)";
+};
+/**
+ * Transition Tokens
+ * Pre-configured transitions combining duration and easing
+ */
+export declare const transitions: {
+    readonly fast: "150ms cubic-bezier(0, 0, 0.2, 1)";
+    readonly "fast-in": "150ms cubic-bezier(0.4, 0, 1, 1)";
+    readonly "fast-out": "150ms cubic-bezier(0, 0, 0.2, 1)";
+    readonly "fast-in-out": "150ms cubic-bezier(0.4, 0, 0.2, 1)";
+    readonly normal: "300ms cubic-bezier(0.4, 0, 0.2, 1)";
+    readonly "normal-in": "300ms cubic-bezier(0.4, 0, 1, 1)";
+    readonly "normal-out": "300ms cubic-bezier(0, 0, 0.2, 1)";
+    readonly "normal-in-out": "300ms cubic-bezier(0.4, 0, 0.2, 1)";
+    readonly slow: "500ms cubic-bezier(0.4, 0, 0.2, 1)";
+    readonly "slow-in": "500ms cubic-bezier(0.4, 0, 1, 1)";
+    readonly "slow-out": "500ms cubic-bezier(0, 0, 0.2, 1)";
+    readonly "slow-in-out": "500ms cubic-bezier(0.4, 0, 0.2, 1)";
+    readonly bounce: "300ms cubic-bezier(0.68, -0.55, 0.265, 1.55)";
+    readonly elastic: "500ms cubic-bezier(0.175, 0.885, 0.32, 1.275)";
+    readonly DEFAULT: "300ms cubic-bezier(0.4, 0, 0.2, 1)";
+};
+/**
+ * Keyframe Animation Tokens
+ * Pre-defined animations for common UI patterns
+ */
+export declare const keyframes: {
+    readonly fadeIn: {
+        readonly from: {
+            readonly opacity: 0;
+        };
+        readonly to: {
+            readonly opacity: 1;
+        };
+    };
+    readonly fadeOut: {
+        readonly from: {
+            readonly opacity: 1;
+        };
+        readonly to: {
+            readonly opacity: 0;
+        };
+    };
+    readonly slideInUp: {
+        readonly from: {
+            readonly transform: "translateY(100%)";
+            readonly opacity: 0;
+        };
+        readonly to: {
+            readonly transform: "translateY(0)";
+            readonly opacity: 1;
+        };
+    };
+    readonly slideInDown: {
+        readonly from: {
+            readonly transform: "translateY(-100%)";
+            readonly opacity: 0;
+        };
+        readonly to: {
+            readonly transform: "translateY(0)";
+            readonly opacity: 1;
+        };
+    };
+    readonly slideInLeft: {
+        readonly from: {
+            readonly transform: "translateX(-100%)";
+            readonly opacity: 0;
+        };
+        readonly to: {
+            readonly transform: "translateX(0)";
+            readonly opacity: 1;
+        };
+    };
+    readonly slideInRight: {
+        readonly from: {
+            readonly transform: "translateX(100%)";
+            readonly opacity: 0;
+        };
+        readonly to: {
+            readonly transform: "translateX(0)";
+            readonly opacity: 1;
+        };
+    };
+    readonly slideOutUp: {
+        readonly from: {
+            readonly transform: "translateY(0)";
+            readonly opacity: 1;
+        };
+        readonly to: {
+            readonly transform: "translateY(-100%)";
+            readonly opacity: 0;
+        };
+    };
+    readonly slideOutDown: {
+        readonly from: {
+            readonly transform: "translateY(0)";
+            readonly opacity: 1;
+        };
+        readonly to: {
+            readonly transform: "translateY(100%)";
+            readonly opacity: 0;
+        };
+    };
+    readonly slideOutLeft: {
+        readonly from: {
+            readonly transform: "translateX(0)";
+            readonly opacity: 1;
+        };
+        readonly to: {
+            readonly transform: "translateX(-100%)";
+            readonly opacity: 0;
+        };
+    };
+    readonly slideOutRight: {
+        readonly from: {
+            readonly transform: "translateX(0)";
+            readonly opacity: 1;
+        };
+        readonly to: {
+            readonly transform: "translateX(100%)";
+            readonly opacity: 0;
+        };
+    };
+    readonly scaleIn: {
+        readonly from: {
+            readonly transform: "scale(0.95)";
+            readonly opacity: 0;
+        };
+        readonly to: {
+            readonly transform: "scale(1)";
+            readonly opacity: 1;
+        };
+    };
+    readonly scaleOut: {
+        readonly from: {
+            readonly transform: "scale(1)";
+            readonly opacity: 1;
+        };
+        readonly to: {
+            readonly transform: "scale(0.95)";
+            readonly opacity: 0;
+        };
+    };
+    readonly scaleUp: {
+        readonly from: {
+            readonly transform: "scale(1)";
+        };
+        readonly to: {
+            readonly transform: "scale(1.05)";
+        };
+    };
+    readonly scaleDown: {
+        readonly from: {
+            readonly transform: "scale(1.05)";
+        };
+        readonly to: {
+            readonly transform: "scale(1)";
+        };
+    };
+    readonly spin: {
+        readonly from: {
+            readonly transform: "rotate(0deg)";
+        };
+        readonly to: {
+            readonly transform: "rotate(360deg)";
+        };
+    };
+    readonly spinReverse: {
+        readonly from: {
+            readonly transform: "rotate(360deg)";
+        };
+        readonly to: {
+            readonly transform: "rotate(0deg)";
+        };
+    };
+    readonly pulse: {
+        readonly "0%, 100%": {
+            readonly opacity: 1;
+        };
+        readonly "50%": {
+            readonly opacity: 0.5;
+        };
+    };
+    readonly bounce: {
+        readonly "0%, 100%": {
+            readonly transform: "translateY(-25%)";
+            readonly animationTimingFunction: "cubic-bezier(0.8, 0, 1, 1)";
+        };
+        readonly "50%": {
+            readonly transform: "translateY(0)";
+            readonly animationTimingFunction: "cubic-bezier(0, 0, 0.2, 1)";
+        };
+    };
+    readonly shake: {
+        readonly "0%, 100%": {
+            readonly transform: "translateX(0)";
+        };
+        readonly "10%, 30%, 50%, 70%, 90%": {
+            readonly transform: "translateX(-4px)";
+        };
+        readonly "20%, 40%, 60%, 80%": {
+            readonly transform: "translateX(4px)";
+        };
+    };
+    readonly ping: {
+        readonly "75%, 100%": {
+            readonly transform: "scale(2)";
+            readonly opacity: 0;
+        };
+    };
+    readonly "accordion-down": {
+        readonly from: {
+            readonly height: "0";
+        };
+        readonly to: {
+            readonly height: "var(--radix-accordion-content-height)";
+        };
+    };
+    readonly "accordion-up": {
+        readonly from: {
+            readonly height: "var(--radix-accordion-content-height)";
+        };
+        readonly to: {
+            readonly height: "0";
+        };
+    };
+};
+/**
+ * Animation Tokens
+ * Pre-configured animations combining keyframes, duration, and easing
+ */
+export declare const animations: {
+    readonly fadeIn: "fadeIn 300ms cubic-bezier(0, 0, 0.2, 1)";
+    readonly fadeOut: "fadeOut 150ms cubic-bezier(0.4, 0, 1, 1)";
+    readonly slideInUp: "slideInUp 300ms cubic-bezier(0, 0, 0.2, 1)";
+    readonly slideInDown: "slideInDown 300ms cubic-bezier(0, 0, 0.2, 1)";
+    readonly slideInLeft: "slideInLeft 300ms cubic-bezier(0, 0, 0.2, 1)";
+    readonly slideInRight: "slideInRight 300ms cubic-bezier(0, 0, 0.2, 1)";
+    readonly slideOutUp: "slideOutUp 150ms cubic-bezier(0.4, 0, 1, 1)";
+    readonly slideOutDown: "slideOutDown 150ms cubic-bezier(0.4, 0, 1, 1)";
+    readonly slideOutLeft: "slideOutLeft 150ms cubic-bezier(0.4, 0, 1, 1)";
+    readonly slideOutRight: "slideOutRight 150ms cubic-bezier(0.4, 0, 1, 1)";
+    readonly scaleIn: "scaleIn 300ms cubic-bezier(0, 0, 0.2, 1)";
+    readonly scaleOut: "scaleOut 150ms cubic-bezier(0.4, 0, 1, 1)";
+    readonly spin: "spin 1s linear infinite";
+    readonly pulse: "pulse 2s cubic-bezier(0.4, 0, 0.2, 1) infinite";
+    readonly bounce: "bounce 1s linear infinite";
+    readonly ping: "ping 1s cubic-bezier(0, 0, 0.2, 1) cubic-bezier(0, 0, 0.2, 1) infinite";
+    readonly shake: "shake 0.5s cubic-bezier(0.4, 0, 0.2, 1)";
+    readonly "accordion-down": "accordion-down 300ms cubic-bezier(0, 0, 0.2, 1)";
+    readonly "accordion-up": "accordion-up 300ms cubic-bezier(0, 0, 0.2, 1)";
+};
+/**
+ * Reduced Motion Support
+ * Respects prefers-reduced-motion media query
+ */
+export declare const reducedMotion: {
+    readonly duration: "0ms";
+    readonly easing: "linear";
+    readonly transition: "0ms linear";
+    readonly mediaQuery: "@media (prefers-reduced-motion: reduce)";
+    readonly disableAnimations: "animation: none !important; transition: none !important;";
+};
+/**
+ * CSS Custom Properties for Motion
+ * These will be injected into the theme system
+ */
+export declare const motionCSSVariables: {
+    readonly "--duration-instant": "0ms";
+    readonly "--duration-fast": "150ms";
+    readonly "--duration-normal": "300ms";
+    readonly "--duration-slow": "500ms";
+    readonly "--duration-slower": "700ms";
+    readonly "--duration-slowest": "1000ms";
+    readonly "--ease-linear": "linear";
+    readonly "--ease-in": "cubic-bezier(0.4, 0, 1, 1)";
+    readonly "--ease-out": "cubic-bezier(0, 0, 0.2, 1)";
+    readonly "--ease-in-out": "cubic-bezier(0.4, 0, 0.2, 1)";
+    readonly "--ease-bounce": "cubic-bezier(0.68, -0.55, 0.265, 1.55)";
+    readonly "--ease-elastic": "cubic-bezier(0.175, 0.885, 0.32, 1.275)";
+    readonly "--transition-fast": "150ms cubic-bezier(0, 0, 0.2, 1)";
+    readonly "--transition-normal": "300ms cubic-bezier(0.4, 0, 0.2, 1)";
+    readonly "--transition-slow": "500ms cubic-bezier(0.4, 0, 0.2, 1)";
+    readonly "--transition-default": "300ms cubic-bezier(0.4, 0, 0.2, 1)";
+};
+/**
+ * Tailwind Motion Config
+ * Maps to Tailwind theme.extend for durations, transitions, keyframes, animations
+ */
+export declare const tailwindMotionConfig: {
+    readonly transitionDuration: Record<string, string>;
+    readonly transitionTimingFunction: Record<string, string>;
+    readonly transitionProperty: {
+        readonly DEFAULT: "color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter";
+        readonly colors: "color, background-color, border-color, text-decoration-color, fill, stroke";
+        readonly opacity: "opacity";
+        readonly shadow: "box-shadow";
+        readonly transform: "transform";
+        readonly all: "all";
+        readonly none: "none";
+    };
+    readonly keyframes: Record<string, any>;
+    readonly animation: Record<string, string>;
+};
+/**
+ * Type Exports
+ */
+export type Duration = keyof typeof durations;
+export type Easing = keyof typeof easings;
+export type Transition = keyof typeof transitions;
+export type Keyframe = keyof typeof keyframes;
+export type Animation = keyof typeof animations;
+//# sourceMappingURL=motion.d.ts.map

package/dist/tokens/motion.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"motion.d.ts","sourceRoot":"","sources":["../../src/tokens/motion.ts"],"names":[],"mappings":"AAAA;;;;;;;;;GASG;AAEH;;;;GAIG;AACH,eAAO,MAAM,SAAS;;;;;;;;;;;;;;CAgBZ,CAAC;AAEX;;;GAGG;AACH,eAAO,MAAM,OAAO;;;;;;;;;;;CAwBV,CAAC;AAEX;;;GAGG;AACH,eAAO,MAAM,WAAW;;;;;;;;;;;;;;;;CAyBd,CAAC;AAEX;;;GAGG;AACH,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAiHZ,CAAC;AAEX;;;GAGG;AACH,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;CA6Bb,CAAC;AAEX;;;GAGG;AACH,eAAO,MAAM,aAAa;;;;;;CAehB,CAAC;AAEX;;;GAGG;AACH,eAAO,MAAM,kBAAkB;;;;;;;;;;;;;;;;;CAsBrB,CAAC;AAEX;;;GAGG;AACH,eAAO,MAAM,oBAAoB;iCAG1B,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC;uCAItB,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC;;;;;;;;;;wBAetB,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC;wBAWnB,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC;CACnB,CAAC;AAEX;;GAEG;AACH,MAAM,MAAM,QAAQ,GAAG,MAAM,OAAO,SAAS,CAAC;AAC9C,MAAM,MAAM,MAAM,GAAG,MAAM,OAAO,OAAO,CAAC;AAC1C,MAAM,MAAM,UAAU,GAAG,MAAM,OAAO,WAAW,CAAC;AAClD,MAAM,MAAM,QAAQ,GAAG,MAAM,OAAO,SAAS,CAAC;AAC9C,MAAM,MAAM,SAAS,GAAG,MAAM,OAAO,UAAU,CAAC"}

package/dist/tokens/radius.d.ts

@@ -1,7 +1,23 @@
+/**
+ * Border Radius System Tokens
+ *
+ * Complete border radius system for Tenerife UI based on design system specifications.
+ * Includes: radius scale (none..3xl, full), component-specific radius standards,
+ * and CSS variable definitions.
+ *
+ * Base unit: 4px (0.25rem)
+ * All radius values follow a consistent scale for visual harmony.
+ */
+/**
+ * Border Radius Scale
+ * Values: none, xs, sm, md, lg, xl, 2xl, 3xl, full
+ */
 export declare const borderRadius: {
-    readonly none: "0px";
-    readonly sm: "0.125rem";
+    readonly none: "0";
+    readonly xs: "0.125rem";
+    readonly sm: "0.25rem";
     readonly DEFAULT: "0.25rem";
+    readonly base: "0.25rem";
     readonly md: "0.375rem";
     readonly lg: "0.5rem";
     readonly xl: "0.75rem";
@@ -9,5 +25,117 @@ export declare const borderRadius: {
     readonly "3xl": "1.5rem";
     readonly full: "9999px";
 };
+/**
+ * Component-Specific Radius Standards
+ * Defines recommended radius values for different component types
+ */
+export declare const componentRadius: {
+    readonly button: {
+        readonly sm: "0.25rem";
+        readonly md: "0.375rem";
+        readonly lg: "0.5rem";
+        readonly pill: "9999px";
+    };
+    readonly card: {
+        readonly sm: "0.25rem";
+        readonly md: "0.375rem";
+        readonly lg: "0.5rem";
+        readonly xl: "0.75rem";
+    };
+    readonly input: {
+        readonly sm: "0.25rem";
+        readonly md: "0.375rem";
+        readonly lg: "0.5rem";
+    };
+    readonly badge: {
+        readonly sm: "0.125rem";
+        readonly md: "0.25rem";
+        readonly lg: "0.375rem";
+        readonly pill: "9999px";
+    };
+    readonly avatar: {
+        readonly sm: "9999px";
+        readonly md: "9999px";
+        readonly lg: "9999px";
+        readonly square: "0.375rem";
+    };
+    readonly modal: {
+        readonly sm: "0.375rem";
+        readonly md: "0.5rem";
+        readonly lg: "0.75rem";
+        readonly xl: "1rem";
+    };
+    readonly tooltip: {
+        readonly sm: "0.25rem";
+        readonly md: "0.375rem";
+    };
+    readonly toast: {
+        readonly sm: "0.375rem";
+        readonly md: "0.5rem";
+        readonly lg: "0.75rem";
+    };
+    readonly chip: {
+        readonly sm: "0.125rem";
+        readonly md: "0.25rem";
+        readonly lg: "0.375rem";
+        readonly pill: "9999px";
+    };
+    readonly image: {
+        readonly none: "0";
+        readonly sm: "0.25rem";
+        readonly md: "0.375rem";
+        readonly lg: "0.5rem";
+        readonly xl: "0.75rem";
+        readonly full: "9999px";
+    };
+};
+/**
+ * CSS Custom Properties for Border Radius
+ * These will be injected into the theme system
+ */
+export declare const radiusCSSVariables: {
+    readonly "--radius-none": "0";
+    readonly "--radius-xs": "0.125rem";
+    readonly "--radius-sm": "0.25rem";
+    readonly "--radius-base": "0.25rem";
+    readonly "--radius-md": "0.375rem";
+    readonly "--radius-lg": "0.5rem";
+    readonly "--radius-xl": "0.75rem";
+    readonly "--radius-2xl": "1rem";
+    readonly "--radius-3xl": "1.5rem";
+    readonly "--radius-full": "9999px";
+    readonly "--radius": "0.375rem";
+    readonly "--radius-button": "0.375rem";
+    readonly "--radius-card": "0.375rem";
+    readonly "--radius-input": "0.375rem";
+    readonly "--radius-badge": "0.25rem";
+    readonly "--radius-modal": "0.5rem";
+    readonly "--radius-tooltip": "0.25rem";
+    readonly "--radius-toast": "0.5rem";
+    readonly "--radius-chip": "0.25rem";
+    readonly "--radius-image": "0.375rem";
+};
+/**
+ * Tailwind Border Radius Config
+ * Maps to Tailwind theme.extend.borderRadius
+ */
+export declare const tailwindRadiusConfig: {
+    readonly borderRadius: Record<string, string>;
+};
+/**
+ * Type Exports
+ */
 export type BorderRadius = keyof typeof borderRadius;
+export type ComponentRadius = {
+    button: keyof typeof componentRadius.button;
+    card: keyof typeof componentRadius.card;
+    input: keyof typeof componentRadius.input;
+    badge: keyof typeof componentRadius.badge;
+    avatar: keyof typeof componentRadius.avatar;
+    modal: keyof typeof componentRadius.modal;
+    tooltip: keyof typeof componentRadius.tooltip;
+    toast: keyof typeof componentRadius.toast;
+    chip: keyof typeof componentRadius.chip;
+    image: keyof typeof componentRadius.image;
+};
 //# sourceMappingURL=radius.d.ts.map

package/dist/tokens/radius.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"radius.d.ts","sourceRoot":"","sources":["../../src/tokens/radius.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,YAAY;;;;;;;;;;CAUf,CAAC;AAEX,MAAM,MAAM,YAAY,GAAG,MAAM,OAAO,YAAY,CAAC"}
+{"version":3,"file":"radius.d.ts","sourceRoot":"","sources":["../../src/tokens/radius.ts"],"names":[],"mappings":"AAAA;;;;;;;;;GASG;AAEH;;;GAGG;AACH,eAAO,MAAM,YAAY;;;;;;;;;;;;CA+Bf,CAAC;AAEX;;;GAGG;AACH,eAAO,MAAM,eAAe;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA8ElB,CAAC;AAEX;;;GAGG;AACH,eAAO,MAAM,kBAAkB;;;;;;;;;;;;;;;;;;;;;CA0BrB,CAAC;AAEX;;;GAGG;AACH,eAAO,MAAM,oBAAoB;2BAa1B,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC;CACnB,CAAC;AAEX;;GAEG;AACH,MAAM,MAAM,YAAY,GAAG,MAAM,OAAO,YAAY,CAAC;AACrD,MAAM,MAAM,eAAe,GAAG;IAC5B,MAAM,EAAE,MAAM,OAAO,eAAe,CAAC,MAAM,CAAC;IAC5C,IAAI,EAAE,MAAM,OAAO,eAAe,CAAC,IAAI,CAAC;IACxC,KAAK,EAAE,MAAM,OAAO,eAAe,CAAC,KAAK,CAAC;IAC1C,KAAK,EAAE,MAAM,OAAO,eAAe,CAAC,KAAK,CAAC;IAC1C,MAAM,EAAE,MAAM,OAAO,eAAe,CAAC,MAAM,CAAC;IAC5C,KAAK,EAAE,MAAM,OAAO,eAAe,CAAC,KAAK,CAAC;IAC1C,OAAO,EAAE,MAAM,OAAO,eAAe,CAAC,OAAO,CAAC;IAC9C,KAAK,EAAE,MAAM,OAAO,eAAe,CAAC,KAAK,CAAC;IAC1C,IAAI,EAAE,MAAM,OAAO,eAAe,CAAC,IAAI,CAAC;IACxC,KAAK,EAAE,MAAM,OAAO,eAAe,CAAC,KAAK,CAAC;CAC3C,CAAC"}

package/dist/tokens/shadows.d.ts

@@ -0,0 +1,172 @@
+/**
+ * Shadow and Glow System Tokens
+ *
+ * Complete shadow system for Tenerife UI based on design system specifications.
+ * Includes: elevation shadows, colored shadows (primary/accent), glow effects,
+ * and focus ring tokens for accessibility.
+ *
+ * @see docs/tenerife_audit/design_system.md - shadow system section
+ */
+/**
+ * Elevation Shadow Tokens
+ * Used for component depth and elevation hierarchy
+ * Values: none, xs, sm, md, lg, xl, 2xl
+ */
+export declare const elevationShadows: {
+    readonly none: "none";
+    readonly xs: "0 1px 2px 0 rgb(0 0 0 / 0.05)";
+    readonly sm: "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)";
+};
+/**
+ * Primary Colored Shadow Tokens
+ * Used for interactive elements and brand emphasis with primary color
+ */
+export declare const primaryColoredShadows: {
+    readonly xs: "0 1px 2px 0 hsl(var(--primary-500) / 0.15)";
+    readonly sm: "0 2px 4px 0 hsl(var(--primary-500) / 0.2)";
+    readonly md: "0 4px 8px 0 hsl(var(--primary-500) / 0.3)";
+    readonly lg: "0 8px 16px 0 hsl(var(--primary-500) / 0.4)";
+    readonly xl: "0 12px 24px 0 hsl(var(--primary-500) / 0.5)";
+    readonly "2xl": "0 16px 32px 0 hsl(var(--primary-500) / 0.6)";
+};
+/**
+ * Accent Colored Shadow Tokens
+ * Used for accent elements and highlights with accent color
+ */
+export declare const accentColoredShadows: {
+    readonly xs: "0 1px 2px 0 hsl(var(--accent-500) / 0.15)";
+    readonly sm: "0 2px 4px 0 hsl(var(--accent-500) / 0.2)";
+    readonly md: "0 4px 8px 0 hsl(var(--accent-500) / 0.3)";
+    readonly lg: "0 8px 16px 0 hsl(var(--accent-500) / 0.4)";
+    readonly xl: "0 12px 24px 0 hsl(var(--accent-500) / 0.5)";
+    readonly "2xl": "0 16px 32px 0 hsl(var(--accent-500) / 0.6)";
+};
+/**
+ * Glow Effect Tokens
+ * Used for focus states, brand emphasis, and interactive feedback
+ */
+export declare const glowEffects: {
+    readonly "glow-primary": "0 0 20px 0 hsl(var(--primary-500) / 0.5), 0 0 40px 0 hsl(var(--primary-500) / 0.3)";
+    readonly "glow-primary-subtle": "0 0 8px 0 hsl(var(--primary-500) / 0.3)";
+    readonly "glow-primary-medium": "0 0 16px 0 hsl(var(--primary-500) / 0.5)";
+    readonly "glow-primary-strong": "0 0 24px 0 hsl(var(--primary-500) / 0.6)";
+    readonly "glow-accent": "0 0 20px 0 hsl(var(--accent-500) / 0.5), 0 0 40px 0 hsl(var(--accent-500) / 0.3)";
+    readonly "glow-accent-subtle": "0 0 8px 0 hsl(var(--accent-500) / 0.3)";
+    readonly "glow-accent-medium": "0 0 16px 0 hsl(var(--accent-500) / 0.5)";
+    readonly "glow-accent-strong": "0 0 24px 0 hsl(var(--accent-500) / 0.6)";
+};
+/**
+ * Focus Ring Tokens
+ * Used for keyboard focus indicators (accessibility)
+ */
+export declare const focusRings: {
+    readonly default: "0 0 0 3px hsl(var(--ring) / 0.5)";
+    readonly primary: "0 0 0 3px hsl(var(--primary-500) / 0.3)";
+    readonly accent: "0 0 0 3px hsl(var(--accent-500) / 0.3)";
+    readonly "focus-primary": "0 0 0 3px hsl(var(--primary-500) / 0.3)";
+    readonly "focus-accent": "0 0 0 3px hsl(var(--accent-500) / 0.3)";
+};
+/**
+ * CSS Custom Properties for Shadows
+ * These will be injected into the theme system
+ */
+export declare const shadowCSSVariables: {
+    readonly "--shadow-none": "none";
+    readonly "--shadow-xs": "0 1px 2px 0 rgb(0 0 0 / 0.05)";
+    readonly "--shadow-sm": "0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1)";
+    readonly "--shadow-md": "0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1)";
+    readonly "--shadow-lg": "0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1)";
+    readonly "--shadow-xl": "0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1)";
+    readonly "--shadow-2xl": "0 25px 50px -12px rgb(0 0 0 / 0.25)";
+    readonly "--shadow-primary-xs": "0 1px 2px 0 hsl(var(--primary-500) / 0.15)";
+    readonly "--shadow-primary-sm": "0 2px 4px 0 hsl(var(--primary-500) / 0.2)";
+    readonly "--shadow-primary-md": "0 4px 8px 0 hsl(var(--primary-500) / 0.3)";
+    readonly "--shadow-primary-lg": "0 8px 16px 0 hsl(var(--primary-500) / 0.4)";
+    readonly "--shadow-primary-xl": "0 12px 24px 0 hsl(var(--primary-500) / 0.5)";
+    readonly "--shadow-primary-2xl": "0 16px 32px 0 hsl(var(--primary-500) / 0.6)";
+    readonly "--shadow-accent-xs": "0 1px 2px 0 hsl(var(--accent-500) / 0.15)";
+    readonly "--shadow-accent-sm": "0 2px 4px 0 hsl(var(--accent-500) / 0.2)";
+    readonly "--shadow-accent-md": "0 4px 8px 0 hsl(var(--accent-500) / 0.3)";
+    readonly "--shadow-accent-lg": "0 8px 16px 0 hsl(var(--accent-500) / 0.4)";
+    readonly "--shadow-accent-xl": "0 12px 24px 0 hsl(var(--accent-500) / 0.5)";
+    readonly "--shadow-accent-2xl": "0 16px 32px 0 hsl(var(--accent-500) / 0.6)";
+    readonly "--glow-primary": "0 0 20px 0 hsl(var(--primary-500) / 0.5), 0 0 40px 0 hsl(var(--primary-500) / 0.3)";
+    readonly "--glow-primary-subtle": "0 0 8px 0 hsl(var(--primary-500) / 0.3)";
+    readonly "--glow-primary-medium": "0 0 16px 0 hsl(var(--primary-500) / 0.5)";
+    readonly "--glow-primary-strong": "0 0 24px 0 hsl(var(--primary-500) / 0.6)";
+    readonly "--glow-accent": "0 0 20px 0 hsl(var(--accent-500) / 0.5), 0 0 40px 0 hsl(var(--accent-500) / 0.3)";
+    readonly "--glow-accent-subtle": "0 0 8px 0 hsl(var(--accent-500) / 0.3)";
+    readonly "--glow-accent-medium": "0 0 16px 0 hsl(var(--accent-500) / 0.5)";
+    readonly "--glow-accent-strong": "0 0 24px 0 hsl(var(--accent-500) / 0.6)";
+    readonly "--focus-ring-default": "0 0 0 3px hsl(var(--ring) / 0.5)";
+    readonly "--focus-ring-primary": "0 0 0 3px hsl(var(--primary-500) / 0.3)";
+    readonly "--focus-ring-accent": "0 0 0 3px hsl(var(--accent-500) / 0.3)";
+    readonly "--focus-primary": "0 0 0 3px hsl(var(--primary-500) / 0.3)";
+    readonly "--focus-accent": "0 0 0 3px hsl(var(--accent-500) / 0.3)";
+};
+/**
+ * Component Shadow Mapping
+ * Defines which shadow level to use for different component states
+ */
+export declare const componentShadowMapping: {
+    readonly card: {
+        readonly default: "0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1)";
+        readonly hover: "0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1)";
+        readonly active: "0 1px 2px 0 rgb(0 0 0 / 0.05)";
+        readonly selected: "0 2px 4px 0 hsl(var(--primary-500) / 0.2)";
+    };
+    readonly button: {
+        readonly default: "0 1px 2px 0 rgb(0 0 0 / 0.05)";
+        readonly hover: "0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1)";
+        readonly active: "none";
+        readonly focus: "0 0 0 3px hsl(var(--primary-500) / 0.3)";
+    };
+    readonly "button-accent": {
+        readonly default: "0 1px 2px 0 hsl(var(--accent-500) / 0.15)";
+        readonly hover: "0 2px 4px 0 hsl(var(--accent-500) / 0.2)";
+        readonly active: "none";
+        readonly focus: "0 0 0 3px hsl(var(--accent-500) / 0.3)";
+    };
+    readonly modal: {
+        readonly default: "0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1)";
+        readonly backdrop: "rgba(0, 0, 0, 0.5)";
+    };
+    readonly dropdown: {
+        readonly default: "0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1)";
+        readonly hover: "0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1)";
+    };
+    readonly tooltip: {
+        readonly default: "0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1)";
+    };
+    readonly toast: {
+        readonly default: "0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1)";
+        readonly success: "0 10px 15px -3px hsl(var(--success) / 0.3)";
+        readonly error: "0 10px 15px -3px hsl(var(--error) / 0.3)";
+    };
+};
+/**
+ * Tailwind Shadow Config
+ * Maps to Tailwind theme.extend.boxShadow
+ */
+export declare const tailwindShadowConfig: {
+    readonly boxShadow: Record<string, string>;
+    readonly ringWidth: {
+        readonly DEFAULT: "3px";
+        readonly sm: "2px";
+        readonly md: "3px";
+        readonly lg: "4px";
+    };
+    readonly ringColor: Record<string, string>;
+};
+/**
+ * Type Exports
+ */
+export type ElevationShadow = keyof typeof elevationShadows;
+export type ColoredShadow = keyof typeof primaryColoredShadows | keyof typeof accentColoredShadows;
+export type GlowEffect = keyof typeof glowEffects;
+export type FocusRing = keyof typeof focusRings;
+//# sourceMappingURL=shadows.d.ts.map

package/dist/tokens/shadows.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"shadows.d.ts","sourceRoot":"","sources":["../../src/tokens/shadows.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAEH;;;;GAIG;AACH,eAAO,MAAM,gBAAgB;;;;;;;;CAQnB,CAAC;AAEX;;;GAGG;AACH,eAAO,MAAM,qBAAqB;;;;;;;CAOxB,CAAC;AAEX;;;GAGG;AACH,eAAO,MAAM,oBAAoB;;;;;;;CAOvB,CAAC;AAEX;;;GAGG;AACH,eAAO,MAAM,WAAW;;;;;;;;;CAad,CAAC;AAEX;;;GAGG;AACH,eAAO,MAAM,UAAU;;;;;;CAMb,CAAC;AAEX;;;GAGG;AACH,eAAO,MAAM,kBAAkB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA0CrB,CAAC;AAEX;;;GAGG;AACH,eAAO,MAAM,sBAAsB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAmCzB,CAAC;AAEX;;;GAGG;AACH,eAAO,MAAM,oBAAoB;wBAyC1B,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC;;;;;;;wBAiBtB,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC;CACnB,CAAC;AAEX;;GAEG;AACH,MAAM,MAAM,eAAe,GAAG,MAAM,OAAO,gBAAgB,CAAC;AAC5D,MAAM,MAAM,aAAa,GAAG,MAAM,OAAO,qBAAqB,GAAG,MAAM,OAAO,oBAAoB,CAAC;AACnG,MAAM,MAAM,UAAU,GAAG,MAAM,OAAO,WAAW,CAAC;AAClD,MAAM,MAAM,SAAS,GAAG,MAAM,OAAO,UAAU,CAAC"}