@tenerife.music/ui 1.0.3 → 1.0.6

package/dist/theme/loader.d.ts

@@ -61,4 +61,3 @@ export declare function getAvailableThemeIds(): string[];
  * @returns Whether theme can be loaded
  */
 export declare function canLoadTheme(themeId: string): Promise<boolean>;
-//# sourceMappingURL=loader.d.ts.map

package/dist/theme/motion/gestures.d.ts

@@ -0,0 +1,76 @@
+/**
+ * Gesture System
+ *
+ * SSR-safe gesture detection using pointer events.
+ * Supports swipe gestures for dismissible components (Toast, NotificationPanel, Drawer).
+ */
+/**
+ * Swipe direction type
+ */
+export type SwipeDirection = "left" | "right" | "up" | "down";
+/**
+ * Swipe event data
+ */
+export interface SwipeEvent {
+    direction: SwipeDirection;
+    distance: number;
+    velocity: number;
+}
+/**
+ * useSwipe hook options
+ */
+export interface UseSwipeOptions {
+    /**
+     * Minimum distance (in pixels) to trigger a swipe
+     * @default 50
+     */
+    threshold?: number;
+    /**
+     * Minimum velocity (pixels per ms) to trigger a swipe
+     * @default 0.1
+     */
+    velocityThreshold?: number;
+    /**
+     * Allowed swipe directions
+     * @default ['left', 'right', 'up', 'down']
+     */
+    directions?: SwipeDirection[];
+    /**
+     * Callback when swipe is detected
+     */
+    onSwipe?: (event: SwipeEvent) => void;
+    /**
+     * Whether swipe detection is enabled
+     * @default true
+     */
+    enabled?: boolean;
+}
+/**
+ * useSwipe hook return type
+ */
+export interface UseSwipeReturn {
+    /**
+     * Whether a swipe is currently in progress
+     */
+    isSwiping: boolean;
+    /**
+     * Current swipe distance
+     */
+    distance: number;
+    /**
+     * Current swipe direction (if swiping)
+     */
+    direction: SwipeDirection | null;
+}
+/**
+ * Hook to detect swipe gestures using pointer events
+ * SSR-safe: only uses DOM APIs inside useEffect
+ *
+ * @param options - Swipe detection options
+ * @returns Swipe state and handlers
+ */
+export declare function useSwipe(options?: UseSwipeOptions): UseSwipeReturn & {
+    handlers: {
+        ref: React.RefCallback<HTMLElement>;
+    } & Omit<React.HTMLAttributes<HTMLElement>, "ref">;
+};

package/dist/theme/motion/useReducedMotion.d.ts

@@ -0,0 +1,11 @@
+/**
+ * useReducedMotion Hook
+ *
+ * SSR-safe hook to detect prefers-reduced-motion media query.
+ * Returns boolean indicating if user prefers reduced motion.
+ */
+/**
+ * Hook to detect prefers-reduced-motion preference
+ * @returns boolean - true if user prefers reduced motion
+ */
+export declare function useReducedMotion(): boolean;

package/dist/theme/motion.d.ts

@@ -125,4 +125,3 @@ export declare const animations: {
         };
     };
 };
-//# sourceMappingURL=motion.d.ts.map

package/dist/theme/registry.d.ts

@@ -68,4 +68,3 @@ export declare function loadTheme(id: string): Promise<ThemeSchema>;
  * Registers built-in themes (default, dark, brand)
  */
 export declare function initializeDefaultThemes(): void;
-//# sourceMappingURL=registry.d.ts.map

package/dist/theme/schema.d.ts

@@ -122,4 +122,3 @@ export declare function isThemeSchema(obj: unknown): obj is ThemeSchema;
  * Useful for CLI scaffolding
  */
 export declare function createMinimalThemeSchema(id: string, name: string): ThemeSchema;
-//# sourceMappingURL=schema.d.ts.map

package/dist/theme/spacing.d.ts

@@ -32,4 +32,3 @@ export declare const shadows: {
     "2xl": string;
     inner: string;
 };
-//# sourceMappingURL=spacing.d.ts.map

package/dist/theme/typography.d.ts

@@ -43,4 +43,3 @@ export declare const letterSpacings: {
     wider: string;
     widest: string;
 };
-//# sourceMappingURL=typography.d.ts.map

package/dist/themes/brand.d.ts

@@ -4,4 +4,3 @@ import { ThemeOverride } from './types';
  * Overrides color scales for brand-specific styling
  */
 export declare const brandTheme: ThemeOverride;
-//# sourceMappingURL=brand.d.ts.map

package/dist/themes/brand_engine.d.ts

@@ -76,6 +76,13 @@ export declare function setActiveBrand(brand: BrandPackage | null): void;
  * Clear active brand
  */
 export declare function clearActiveBrand(): void;
+/**
+ * Clear brand registry
+ * This function is primarily for testing purposes to reset the brand registry between tests
+ *
+ * @internal
+ */
+export declare function clearBrandRegistry(): void;
 /**
  * Get brand theme for a specific mode
  *
@@ -99,4 +106,3 @@ export declare function applyBrandOverrides(brand: BrandPackage, mode: Mode): vo
  * @param namespace - Brand namespace to remove
  */
 export declare function removeBrandOverrides(namespace: string): void;
-//# sourceMappingURL=brand_engine.d.ts.map

package/dist/themes/dark.d.ts

@@ -4,4 +4,3 @@ import { ThemeOverride } from './types';
  * Overrides surface colors for a darker, more immersive experience
  */
 export declare const darkTheme: ThemeOverride;
-//# sourceMappingURL=dark.d.ts.map

package/dist/themes/default.d.ts

@@ -4,4 +4,3 @@ import { ThemeOverride } from './types';
  * No overrides - uses all default tokens
  */
 export declare const defaultTheme: ThemeOverride;
-//# sourceMappingURL=default.d.ts.map

package/dist/themes/index.d.ts

@@ -22,4 +22,3 @@ export declare const themes: {
  * Get theme by name
  */
 export declare function getTheme(name: "default" | "dark" | "brand"): Promise<import('./types').ThemeOverride>;
-//# sourceMappingURL=index.d.ts.map

package/dist/themes/minimal.d.ts

@@ -4,4 +4,3 @@ import { BrandPackage } from './types';
  * Contains day and night theme variants with clean, minimal styling
  */
 export declare const minimalBrand: BrandPackage;
-//# sourceMappingURL=minimal.d.ts.map

package/dist/themes/neon.d.ts

@@ -4,4 +4,3 @@ import { BrandPackage } from './types';
  * Contains day and night theme variants with vibrant neon styling
  */
 export declare const neonBrand: BrandPackage;
-//# sourceMappingURL=neon.d.ts.map

package/dist/themes/types.d.ts

@@ -276,4 +276,3 @@ export interface BrandValidationResult {
  * Theme name type
  */
 export type ThemeName = "default" | "dark" | "brand";
-//# sourceMappingURL=types.d.ts.map

package/dist/tokens/colors.d.ts

@@ -68,6 +68,18 @@ export type SemanticColors = {
     infoForeground: string;
 };
 export declare const semanticColors: Record<Mode, SemanticColors>;
+/**
+ * Chart color tokens
+ * Used for data visualization (charts, graphs)
+ */
+export type ChartColors = {
+    chart1: string;
+    chart2: string;
+    chart3: string;
+    chart4: string;
+    chart5: string;
+};
+export declare const chartColors: Record<Mode, ChartColors>;
 /**
  * Text color tokens
  * Primary, secondary, tertiary, muted text
@@ -160,25 +172,6 @@ export declare const colorCSSVariables: {
     readonly "--secondary-800": string;
     readonly "--secondary-900": string;
     readonly "--secondary-950": string;
-    readonly "--surface-base": string;
-    readonly "--surface-elevated1": string;
-    readonly "--surface-elevated2": string;
-    readonly "--surface-elevated3": string;
-    readonly "--surface-overlay": string;
-    readonly "--surface-glass": string;
-    readonly "--semantic-success": string;
-    readonly "--semantic-success-foreground": string;
-    readonly "--semantic-error": string;
-    readonly "--semantic-error-foreground": string;
-    readonly "--semantic-warning": string;
-    readonly "--semantic-warning-foreground": string;
-    readonly "--semantic-info": string;
-    readonly "--semantic-info-foreground": string;
-    readonly "--text-primary": string;
-    readonly "--text-secondary": string;
-    readonly "--text-tertiary": string;
-    readonly "--text-muted": string;
-    readonly "--text-inverse": string;
 };
 /**
  * Tailwind theme colors
@@ -277,6 +270,8 @@ export declare const tailwindThemeColors: {
         readonly secondary: "hsl(var(--text-secondary))";
         readonly tertiary: "hsl(var(--text-tertiary))";
         readonly muted: "hsl(var(--text-muted))";
+        readonly destructive: "hsl(var(--destructive))";
+        readonly accent: "hsl(var(--tm-accent))";
         readonly inverse: "hsl(var(--text-inverse))";
     };
     readonly border: "hsl(var(--border))";
@@ -290,4 +285,3 @@ export declare const tailwindThemeColors: {
         readonly 5: "hsl(var(--chart-5))";
     };
 };
-//# sourceMappingURL=colors.d.ts.map

package/dist/tokens/components/alert.d.ts

@@ -0,0 +1,74 @@
+/**
+ * Alert Component Tokens
+ *
+ * Component-level design tokens for Alert component.
+ * Maps foundation tokens (spacing, radius) to alert-specific usage.
+ *
+ * Includes variant-based token structure for future extensibility.
+ */
+/**
+ * Alert Component Tokens
+ *
+ * Defines spacing, sizing, and visual tokens for Alert component.
+ * Values are mapped to Tailwind utility classes for direct use.
+ */
+export declare const ALERT_TOKENS: {
+    /**
+     * Padding for alert content
+     */
+    readonly padding: "p-md";
+    /**
+     * Border radius for alerts
+     */
+    readonly radius: "rounded-lg";
+    /**
+     * Icon size within alerts
+     */
+    readonly iconSize: "size-4";
+    /**
+     * Variant-based token structure
+     * Organized by variant for future extensibility
+     */
+    readonly variant: {
+        readonly default: {
+            readonly padding: "p-md";
+            readonly radius: "rounded-lg";
+        };
+        readonly primary: {
+            readonly padding: "p-md";
+            readonly radius: "rounded-lg";
+        };
+        readonly secondary: {
+            readonly padding: "p-md";
+            readonly radius: "rounded-lg";
+        };
+        readonly accent: {
+            readonly padding: "p-md";
+            readonly radius: "rounded-lg";
+        };
+        readonly destructive: {
+            readonly padding: "p-md";
+            readonly radius: "rounded-lg";
+        };
+        readonly success: {
+            readonly padding: "p-md";
+            readonly radius: "rounded-lg";
+        };
+        readonly warning: {
+            readonly padding: "p-md";
+            readonly radius: "rounded-lg";
+        };
+        readonly danger: {
+            readonly padding: "p-md";
+            readonly radius: "rounded-lg";
+        };
+        readonly info: {
+            readonly padding: "p-md";
+            readonly radius: "rounded-lg";
+        };
+    };
+};
+/**
+ * Type exports for Alert tokens
+ */
+export type AlertVariant = keyof typeof ALERT_TOKENS.variant;

package/dist/tokens/components/button.d.ts

@@ -0,0 +1,130 @@
+/**
+ * Button Component Tokens
+ *
+ * Component-level design tokens for Button component.
+ * Maps foundation tokens (spacing, typography, radius, shadows) to button-specific usage.
+ *
+ * All values reference foundation tokens to ensure consistency across the design system.
+ */
+/**
+ * Button Component Tokens
+ *
+ * Defines all spacing, sizing, typography, and visual tokens for Button component.
+ * Values are mapped to Tailwind utility classes for direct use in component variants.
+ */
+export declare const BUTTON_TOKENS: {
+    /**
+     * Button heights by size
+     * Maps to Tailwind height utilities: h-8, h-9, h-10
+     */
+    readonly height: {
+        readonly sm: "h-8";
+        readonly md: "h-9";
+        readonly lg: "h-10";
+        readonly icon: "h-9";
+    };
+    /**
+     * Button padding by size
+     * Horizontal and vertical padding values
+     */
+    readonly padding: {
+        readonly horizontal: {
+            readonly sm: "px-sm";
+            readonly md: "px-md";
+            readonly lg: "px-lg";
+        };
+        readonly vertical: {
+            readonly sm: "py-xs";
+            readonly md: "py-sm";
+        };
+    };
+    /**
+     * Gap between icon and text
+     */
+    readonly gap: "gap-sm";
+    /**
+     * Border radius for all button sizes
+     */
+    readonly radius: "rounded-md";
+    /**
+     * Icon size within buttons
+     */
+    readonly iconSize: "size-4";
+    /**
+     * Width tokens
+     */
+    readonly width: {
+        readonly icon: "w-9";
+    };
+    /**
+     * Font sizes by button size
+     * Maps to foundation typography fontSize tokens
+     */
+    readonly fontSize: {
+        readonly sm: "text-xs";
+        readonly md: "text-sm";
+        readonly lg: "text-sm";
+    };
+    /**
+     * Shadow tokens by variant
+     * Maps to foundation elevation shadow tokens
+     */
+    readonly shadow: {
+        readonly default: "shadow-sm";
+        readonly primary: "shadow";
+    };
+    /**
+     * Color tokens for button variants
+     * Uses semantic color tokens that map to CSS variables
+     */
+    readonly variant: {
+        readonly primary: {
+            readonly background: "bg-primary";
+            readonly text: "text-primary-foreground";
+            readonly hover: "hover:bg-primary/90";
+        };
+        readonly secondary: {
+            readonly background: "bg-secondary";
+            readonly text: "text-secondary-foreground";
+            readonly hover: "hover:bg-secondary/80";
+        };
+        readonly accent: {
+            readonly background: "bg-accent";
+            readonly text: "text-accent-foreground";
+            readonly hover: "hover:bg-accent/90";
+        };
+        readonly outline: {
+            readonly border: "border border-input";
+            readonly background: "bg-background";
+            readonly hover: {
+                readonly background: "hover:bg-accent";
+                readonly text: "hover:text-accent-foreground";
+            };
+        };
+        readonly ghost: {
+            readonly hover: {
+                readonly background: "hover:bg-accent";
+                readonly text: "hover:text-accent-foreground";
+            };
+        };
+        readonly destructive: {
+            readonly background: "bg-destructive";
+            readonly text: "text-destructive-foreground";
+            readonly hover: "hover:bg-destructive/90";
+        };
+    };
+    /**
+     * Transition tokens
+     */
+    readonly transition: {
+        readonly colors: "transition-colors";
+    };
+};
+/**
+ * Type exports for Button tokens
+ */
+export type ButtonHeight = keyof typeof BUTTON_TOKENS.height;
+export type ButtonPaddingHorizontal = keyof typeof BUTTON_TOKENS.padding.horizontal;
+export type ButtonPaddingVertical = keyof typeof BUTTON_TOKENS.padding.vertical;
+export type ButtonFontSize = keyof typeof BUTTON_TOKENS.fontSize;
+export type ButtonShadow = keyof typeof BUTTON_TOKENS.shadow;

package/dist/tokens/components/card.d.ts

@@ -0,0 +1,91 @@
+/**
+ * Card Component Tokens
+ *
+ * Component-level design tokens for Card component.
+ * Maps foundation tokens (spacing, radius, shadows) to card-specific usage.
+ *
+ * Prepared for future size variants (sm, md, lg).
+ */
+/**
+ * Card Component Tokens
+ *
+ * Defines spacing, radius, and shadow tokens for Card component.
+ * Values are mapped to Tailwind utility classes for direct use.
+ */
+export declare const CARD_TOKENS: {
+    /**
+     * Padding for card sections (CardHeader, CardContent, CardFooter)
+     */
+    readonly padding: {
+        readonly sm: "p-sm";
+        readonly md: "p-lg";
+        readonly lg: "p-xl";
+    };
+    /**
+     * Border radius for cards
+     */
+    readonly radius: {
+        readonly sm: "rounded-md";
+        readonly md: "rounded-xl";
+        readonly lg: "rounded-2xl";
+    };
+    /**
+     * Vertical spacing within card sections
+     * Used for CardHeader spacing
+     */
+    readonly spacing: {
+        readonly vertical: {
+            readonly xs: "space-y-xs";
+            readonly sm: "space-y-sm";
+            readonly md: "space-y-md";
+        };
+    };
+    /**
+     * Shadow (elevation) for cards
+     * Maps to foundation elevation shadow tokens
+     */
+    readonly shadow: {
+        readonly default: "shadow";
+        readonly sm: "shadow-sm";
+        readonly md: "shadow-md";
+        readonly lg: "shadow-lg";
+    };
+    /**
+     * Size-based token structure
+     * Organized by size for easy access
+     */
+    readonly size: {
+        readonly sm: {
+            readonly padding: "p-sm";
+            readonly radius: "rounded-md";
+            readonly shadow: "shadow-sm";
+            readonly spacing: {
+                readonly vertical: "space-y-xs";
+            };
+        };
+        readonly md: {
+            readonly padding: "p-lg";
+            readonly radius: "rounded-xl";
+            readonly shadow: "shadow";
+            readonly spacing: {
+                readonly vertical: "space-y-xs";
+            };
+        };
+        readonly lg: {
+            readonly padding: "p-xl";
+            readonly radius: "rounded-2xl";
+            readonly shadow: "shadow-md";
+            readonly spacing: {
+                readonly vertical: "space-y-sm";
+            };
+        };
+    };
+};
+/**
+ * Type exports for Card tokens
+ */
+export type CardPadding = keyof typeof CARD_TOKENS.padding;
+export type CardRadius = keyof typeof CARD_TOKENS.radius;
+export type CardSpacingVertical = keyof typeof CARD_TOKENS.spacing.vertical;
+export type CardShadow = keyof typeof CARD_TOKENS.shadow;
+export type CardSize = keyof typeof CARD_TOKENS.size;