@tenerife.music/ui 1.0.15 → 1.0.16

package/dist/{index-CP_dmFn4.d.ts → index-DPWxsWs3.d.ts}

@@ -112,9 +112,23 @@ type AlertVariant = keyof typeof ALERT_TOKENS.variant;
  * Button Component Tokens
  *
  * Component-level design tokens for Button component.
- * Maps foundation tokens (spacing, typography, radius, shadows) to button-specific usage.
+ * Maps foundation tokens (spacing, typography, radius, shadows, motion) to button-specific usage.
  *
  * All values reference foundation tokens to ensure consistency across the design system.
+ *
+ * Authority Compliance:
+ * - Motion Authority: Uses MOTION_TOKENS.transitionPreset.colors
+ * - Radius Authority: References componentRadius.button.md
+ * - Typography Authority: References fontSize tokens
+ * - Spacing Authority: References semanticSpacing tokens
+ * - State Authority: Uses State Matrix CSS variables
+ * - Interaction Authority: Follows Interaction Authority Contract
+ *
+ * @enforcement TUNG_TOKEN_AUTHORITY_EXPANSION_PLAN
+ * @see docs/architecture/MOTION_AUTHORITY_CONTRACT.md
+ * @see docs/architecture/RADIUS_AUTHORITY_CONTRACT.md
+ * @see docs/architecture/TYPOGRAPHY_AUTHORITY_CONTRACT.md
+ * @see docs/architecture/SPACING_AUTHORITY_CONTRACT.md
  */
 /**
  * Button Component Tokens
@@ -146,20 +160,37 @@ declare const BUTTON_TOKENS: {
         readonly vertical: {
             readonly sm: "py-xs";
             readonly md: "py-sm";
+            readonly lg: "py-md";
         };
     };
     /**
-     * Gap between icon and text
+     * Gap between icon and text by size
+     * Scales with button size for visual consistency
      */
-    readonly gap: "gap-sm";
+    readonly gap: {
+        readonly sm: "gap-xs";
+        readonly md: "gap-sm";
+        readonly lg: "gap-md";
+    };
     /**
      * Border radius for all button sizes
+     * Consistent radius across sizes for visual harmony
+     *
+     * @enforcement TUNG_TOKEN_AUTHORITY_EXPANSION_PLAN
+     * @rule References componentRadius.button.md (6px / 0.375rem) from Radius Authority
+     * @see docs/architecture/RADIUS_AUTHORITY_CONTRACT.md
      */
     readonly radius: "rounded-md";
     /**
-     * Icon size within buttons
+     * Icon size within buttons by button size
+     * Scales proportionally with button size for visual balance
      */
-    readonly iconSize: "size-4";
+    readonly iconSize: {
+        readonly sm: "size-3.5";
+        readonly md: "size-4";
+        readonly lg: "size-5";
+        readonly icon: "size-4";
+    };
     /**
      * Width tokens
      */
@@ -168,12 +199,16 @@ declare const BUTTON_TOKENS: {
     };
     /**
      * Font sizes by button size
-     * Maps to foundation typography fontSize tokens
+     * References foundation typography fontSize tokens from Typography Authority
+     *
+     * @enforcement TUNG_TOKEN_AUTHORITY_EXPANSION_PLAN
+     * @rule All fontSize values reference Typography Authority tokens
+     * @see docs/architecture/TYPOGRAPHY_AUTHORITY_CONTRACT.md
      */
     readonly fontSize: {
         readonly sm: "text-xs";
         readonly md: "text-sm";
-        readonly lg: "text-sm";
+        readonly lg: "text-base";
     };
     /**
      * Shadow tokens by variant
@@ -186,48 +221,181 @@ declare const BUTTON_TOKENS: {
     /**
      * Color tokens for button variants
      * Uses semantic color tokens that map to CSS variables
+     *
+     * State tokens (hover, active, disabled) use CSS variables from State Matrix.
+     * All states are injected via updateStateMatrixFromTokens() and consumed via arbitrary values.
+     * States react to Color Authority changes automatically through State Matrix.
+     *
+     * Interaction Authority Rules:
+     * - Hover (Priority 4): hover: prefix - ONLY when !disabled && !loading && pointer-events:auto
+     * - Active (Priority 3): active: prefix - ONLY when !disabled && !loading && mousedown
+     * - Focus (Priority 5): focus-visible: prefix - ONLY when !disabled && keyboard navigation
+     * - Disabled (Priority 1): disabled: prefix - Blocks ALL interactions
+     * - Loading (Priority 2): loading: prefix - Blocks hover/active (when implemented)
+     * - Base (Priority 6): No prefix - Default state, pointer-events: auto
+     *
+     * @enforcement TUNG_STATE_AUTHORITY_FOUNDATION_LOCK
+     * @enforcement TUNG_INTERACTION_AUTHORITY_FOUNDATION
+     * @rule States use CSS variables, not Tailwind variants
+     * @rule All state variables follow pattern: --{component}-{variant}-{state}-{property}
+     * @rule Visual states (colors) are SEPARATE from interaction states (pointer-events)
+     * @rule Hover MUST work with real mouse cursor, NOT just DevTools force state
+     * @rule Active MUST activate only on mousedown, NOT on hover
+     * @rule Focus MUST activate only on keyboard navigation, NOT on mouse click
+     *
+     * @see docs/architecture/INTERACTION_AUTHORITY_CONTRACT.md
      */
     readonly variant: {
         readonly primary: {
-            readonly background: "bg-primary";
+            readonly background: "bg-[hsl(var(--button-primary-base-bg))]";
             readonly text: "text-primary-foreground";
-            readonly hover: "hover:bg-primary/90";
+            readonly hover: "hover:bg-[hsl(var(--button-primary-hover-bg))]";
+            readonly active: "active:bg-[hsl(var(--button-primary-active-bg))]";
+            readonly focus: "focus-visible:bg-[hsl(var(--button-primary-focus-bg))]";
+            readonly disabled: {
+                readonly background: "disabled:bg-[hsl(var(--button-primary-disabled-bg))]";
+                readonly text: "disabled:text-[hsl(var(--button-primary-disabled-text))]";
+            };
+            readonly loading: "bg-[hsl(var(--button-primary-loading-bg))]";
         };
         readonly secondary: {
             readonly background: "bg-secondary";
             readonly text: "text-secondary-foreground";
-            readonly hover: "hover:bg-secondary/80";
+            readonly hover: "hover:bg-[hsl(var(--button-secondary-hover-bg))]";
+            readonly active: "active:bg-[hsl(var(--button-secondary-active-bg))]";
+            readonly disabled: {
+                readonly background: "disabled:bg-[hsl(var(--button-secondary-disabled-bg))]";
+                readonly text: "disabled:text-[hsl(var(--button-secondary-disabled-text))]";
+            };
         };
         readonly accent: {
             readonly background: "bg-accent";
             readonly text: "text-accent-foreground";
-            readonly hover: "hover:bg-accent/90";
+            readonly hover: "hover:bg-[hsl(var(--button-accent-hover-bg))]";
+            readonly active: "active:bg-[hsl(var(--button-accent-active-bg))]";
+            readonly disabled: {
+                readonly background: "disabled:bg-[hsl(var(--button-accent-disabled-bg))]";
+                readonly text: "disabled:text-[hsl(var(--button-accent-disabled-text))]";
+            };
         };
         readonly outline: {
             readonly border: "border border-input";
             readonly background: "bg-background";
+            readonly text: "text-foreground";
             readonly hover: {
-                readonly background: "hover:bg-accent";
-                readonly text: "hover:text-accent-foreground";
+                readonly background: "hover:bg-[hsl(var(--button-outline-hover-bg))]";
+                readonly text: "hover:text-[hsl(var(--button-outline-hover-text))]";
+                readonly border: "hover:border-[hsl(var(--button-outline-hover-border))]";
+            };
+            readonly active: {
+                readonly background: "active:bg-[hsl(var(--button-outline-active-bg))]";
+                readonly text: "active:text-[hsl(var(--button-outline-active-text))]";
+                readonly border: "active:border-[hsl(var(--button-outline-active-border))]";
+            };
+            readonly disabled: {
+                readonly background: "disabled:bg-[hsl(var(--button-outline-disabled-bg))]";
+                readonly text: "disabled:text-[hsl(var(--button-outline-disabled-text))]";
+                readonly border: "disabled:border-[hsl(var(--button-outline-disabled-border))]";
             };
         };
         readonly ghost: {
+            readonly background: "bg-transparent";
+            readonly text: "text-foreground";
             readonly hover: {
-                readonly background: "hover:bg-accent";
-                readonly text: "hover:text-accent-foreground";
+                readonly background: "hover:bg-[hsl(var(--button-ghost-hover-bg))]";
+                readonly text: "hover:text-[hsl(var(--button-ghost-hover-text))]";
+            };
+            readonly active: {
+                readonly background: "active:bg-[hsl(var(--button-ghost-active-bg))]";
+                readonly text: "active:text-[hsl(var(--button-ghost-active-text))]";
+            };
+            readonly disabled: {
+                readonly background: "disabled:bg-[hsl(var(--button-ghost-disabled-bg))]";
+                readonly text: "disabled:text-[hsl(var(--button-ghost-disabled-text))]";
             };
         };
         readonly destructive: {
             readonly background: "bg-destructive";
             readonly text: "text-destructive-foreground";
-            readonly hover: "hover:bg-destructive/90";
+            readonly hover: "hover:bg-[hsl(var(--button-destructive-hover-bg))]";
+            readonly active: "active:bg-[hsl(var(--button-destructive-active-bg))]";
+            readonly disabled: {
+                readonly background: "disabled:bg-[hsl(var(--button-destructive-disabled-bg))]";
+                readonly text: "disabled:text-[hsl(var(--button-destructive-disabled-text))]";
+            };
         };
     };
     /**
      * Transition tokens
+     * References Motion Authority tokens for consistent motion behavior
+     *
+     * @enforcement TUNG_TOKEN_AUTHORITY_EXPANSION_PLAN
+     * @rule Uses MOTION_TOKENS.transitionPreset.colors from Motion Authority
+     * @rule Motion transitions MUST use canonical motion tokens only
+     * @see docs/architecture/MOTION_AUTHORITY_CONTRACT.md
      */
     readonly transition: {
-        readonly colors: "transition-colors";
+        readonly colors: "transition-colors duration-normal ease-out";
+    };
+    /**
+     * Global state tokens
+     * Shared state tokens that apply across all variants
+     * Variant-specific states are defined in variant.*.active and variant.*.disabled
+     *
+     * @enforcement TUNG_INTERACTION_AUTHORITY_FOUNDATION
+     * @rule All interaction states MUST follow Interaction Authority Contract
+     * @rule State priority: disabled > loading > active > hover > focus-visible > base
+     * @rule Visual states (colors) are SEPARATE from interaction states (pointer-events, cursor)
+     * @rule All states MUST be browser-native (CSS pseudo-classes), NOT JavaScript-managed
+     */
+    readonly state: {
+        /**
+         * Disabled state tokens
+         * Global disabled state tokens (variant-specific overrides in variant.*.disabled)
+         *
+         * Interaction Authority Rules:
+         * - Priority: 1 (Highest) - Blocks ALL interactions
+         * - MUST block hover, active, and focus states
+         * - MUST use disabled: prefix (never in base state)
+         * - Base state MUST have pointer-events: auto (default) for hover to work
+         *
+         * @enforcement TUNG_INTERACTION_AUTHORITY_FOUNDATION
+         * @enforcement TUNG_BUTTON_INTERACTION_FIX
+         * @rule Interaction Authority: pointer-events is NOT a visual token
+         * @rule pointer-events-none MUST use disabled: prefix (never in base state)
+         * @rule Base state MUST have pointer-events: auto (default) for hover to work
+         * @rule These tokens are applied in base but only activate when element is disabled
+         * @rule Hover is FORBIDDEN when disabled={true}
+         * @rule Active is FORBIDDEN when disabled={true}
+         * @rule Focus is FORBIDDEN when disabled={true} (for interactions)
+         *
+         * @see docs/architecture/INTERACTION_AUTHORITY_CONTRACT.md
+         */
+        readonly disabled: {
+            readonly cursor: "disabled:cursor-not-allowed";
+            readonly pointerEvents: "disabled:pointer-events-none";
+        };
+        /**
+         * Focus state tokens
+         * Focus ring for keyboard navigation
+         *
+         * Interaction Authority Rules:
+         * - Priority: 5 - Lower than active and hover
+         * - MUST activate only on keyboard navigation (focus-visible: prefix)
+         * - MUST NOT activate on mouse click (use :focus-visible, not :focus)
+         * - MUST be blocked by disabled state
+         *
+         * @enforcement TUNG_INTERACTION_AUTHORITY_FOUNDATION
+         * @rule Focus MUST use focus-visible: prefix (keyboard navigation only)
+         * @rule Focus MUST be blocked when disabled={true}
+         * @rule Focus MUST NOT activate on mouse click
+         *
+         * @see docs/architecture/INTERACTION_AUTHORITY_CONTRACT.md
+         */
+        readonly focus: {
+            readonly ring: "focus-visible:ring-1 focus-visible:ring-ring";
+            readonly outline: "focus-visible:outline-none";
+        };
     };
 };
 /**
@@ -1716,6 +1884,10 @@ declare const TEXT_TOKENS: {
         readonly md: "text-base";
         readonly lg: "text-lg";
         readonly xl: "text-xl";
+        readonly "2xl": "text-2xl";
+        readonly "3xl": "text-3xl";
+        readonly "4xl": "text-4xl";
+        readonly "5xl": "text-5xl";
     };
     /**
      * Font weights by weight variant
@@ -1734,6 +1906,7 @@ declare const TEXT_TOKENS: {
     readonly lineHeight: {
         readonly none: "leading-none";
         readonly tight: "leading-tight";
+        readonly snug: "leading-snug";
         readonly normal: "leading-normal";
         readonly relaxed: "leading-relaxed";
         readonly loose: "leading-loose";
@@ -2185,8 +2358,8 @@ declare const TOAST_TOKENS: {
         readonly states: {
             readonly default: "opacity-0";
             readonly groupHover: "group-hover:opacity-100";
-            readonly focus: "focus:opacity-100";
-            readonly focusRing: "focus:outline-none focus:ring-1";
+            readonly focus: "focus-visible:opacity-100";
+            readonly focusRing: "focus-visible:outline-none focus-visible:ring-1";
         };
     };
 };
@@ -2859,11 +3032,11 @@ declare const DROPDOWN_TOKENS: {
      */
     readonly item: {
         readonly background: {
-            readonly focus: "focus:bg-[hsl(var(--accent))]";
+            readonly focus: "focus-visible:bg-[hsl(var(--accent))]";
             readonly selected: "bg-[hsl(var(--accent))]";
         };
         readonly text: {
-            readonly focus: "focus:text-[hsl(var(--accent-foreground))]";
+            readonly focus: "focus-visible:text-[hsl(var(--accent-foreground))]";
             readonly selected: "text-[hsl(var(--accent-foreground))]";
         };
         readonly padding: {
@@ -3070,8 +3243,8 @@ declare const SELECT_TOKENS: {
             readonly position: "left-sm";
         };
         readonly focus: {
-            readonly background: "focus:bg-[hsl(var(--accent))]";
-            readonly text: "focus:text-[hsl(var(--accent-foreground))]";
+            readonly background: "focus-visible:bg-[hsl(var(--accent))]";
+            readonly text: "focus-visible:text-[hsl(var(--accent-foreground))]";
         };
         readonly selected: {
             readonly background: "bg-[hsl(var(--accent))]";
@@ -5043,118 +5216,118 @@ declare const transitions: {
 declare const keyframes: {
     readonly fadeIn: {
         readonly from: {
-            readonly opacity: 0;
+            readonly opacity: "0";
         };
         readonly to: {
-            readonly opacity: 1;
+            readonly opacity: "1";
         };
     };
     readonly fadeOut: {
         readonly from: {
-            readonly opacity: 1;
+            readonly opacity: "1";
         };
         readonly to: {
-            readonly opacity: 0;
+            readonly opacity: "0";
         };
     };
     readonly slideInUp: {
         readonly from: {
             readonly transform: "translateY(100%)";
-            readonly opacity: 0;
+            readonly opacity: "0";
         };
         readonly to: {
             readonly transform: "translateY(0)";
-            readonly opacity: 1;
+            readonly opacity: "1";
         };
     };
     readonly slideInDown: {
         readonly from: {
             readonly transform: "translateY(-100%)";
-            readonly opacity: 0;
+            readonly opacity: "0";
         };
         readonly to: {
             readonly transform: "translateY(0)";
-            readonly opacity: 1;
+            readonly opacity: "1";
         };
     };
     readonly slideInLeft: {
         readonly from: {
             readonly transform: "translateX(-100%)";
-            readonly opacity: 0;
+            readonly opacity: "0";
         };
         readonly to: {
             readonly transform: "translateX(0)";
-            readonly opacity: 1;
+            readonly opacity: "1";
         };
     };
     readonly slideInRight: {
         readonly from: {
             readonly transform: "translateX(100%)";
-            readonly opacity: 0;
+            readonly opacity: "0";
         };
         readonly to: {
             readonly transform: "translateX(0)";
-            readonly opacity: 1;
+            readonly opacity: "1";
         };
     };
     readonly slideOutUp: {
         readonly from: {
             readonly transform: "translateY(0)";
-            readonly opacity: 1;
+            readonly opacity: "1";
         };
         readonly to: {
             readonly transform: "translateY(-100%)";
-            readonly opacity: 0;
+            readonly opacity: "0";
         };
     };
     readonly slideOutDown: {
         readonly from: {
             readonly transform: "translateY(0)";
-            readonly opacity: 1;
+            readonly opacity: "1";
         };
         readonly to: {
             readonly transform: "translateY(100%)";
-            readonly opacity: 0;
+            readonly opacity: "0";
         };
     };
     readonly slideOutLeft: {
         readonly from: {
             readonly transform: "translateX(0)";
-            readonly opacity: 1;
+            readonly opacity: "1";
         };
         readonly to: {
             readonly transform: "translateX(-100%)";
-            readonly opacity: 0;
+            readonly opacity: "0";
         };
     };
     readonly slideOutRight: {
         readonly from: {
             readonly transform: "translateX(0)";
-            readonly opacity: 1;
+            readonly opacity: "1";
         };
         readonly to: {
             readonly transform: "translateX(100%)";
-            readonly opacity: 0;
+            readonly opacity: "0";
         };
     };
     readonly scaleIn: {
         readonly from: {
             readonly transform: "scale(0.95)";
-            readonly opacity: 0;
+            readonly opacity: "0";
         };
         readonly to: {
             readonly transform: "scale(1)";
-            readonly opacity: 1;
+            readonly opacity: "1";
         };
     };
     readonly scaleOut: {
         readonly from: {
             readonly transform: "scale(1)";
-            readonly opacity: 1;
+            readonly opacity: "1";
         };
         readonly to: {
             readonly transform: "scale(0.95)";
-            readonly opacity: 0;
+            readonly opacity: "0";
         };
     };
     readonly scaleUp: {
@@ -5191,10 +5364,10 @@ declare const keyframes: {
     };
     readonly pulse: {
         readonly "0%, 100%": {
-            readonly opacity: 1;
+            readonly opacity: "1";
         };
         readonly "50%": {
-            readonly opacity: 0.5;
+            readonly opacity: "0.5";
         };
     };
     readonly bounce: {
@@ -5221,7 +5394,7 @@ declare const keyframes: {
     readonly ping: {
         readonly "75%, 100%": {
             readonly transform: "scale(2)";
-            readonly opacity: 0;
+            readonly opacity: "0";
         };
     };
     readonly "accordion-down": {
@@ -5416,7 +5589,207 @@ declare const tailwindMotionConfig: {
         readonly all: "all";
         readonly none: "none";
     };
-    readonly keyframes: Record<string, Record<string, Record<string, string | number>>>;
+    readonly 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";
+            };
+        };
+    };
     readonly animation: {
         readonly none: "none";
         readonly spin: "spin 1s linear infinite";
@@ -6764,8 +7137,8 @@ declare const CONTEXT_MENU_TOKENS: {
     readonly item: {
         readonly radius: "rounded-sm";
         readonly focus: {
-            readonly background: "focus:bg-[hsl(var(--accent))]";
-            readonly text: "focus:text-[hsl(var(--accent-foreground))]";
+            readonly background: "focus-visible:bg-[hsl(var(--accent))]";
+            readonly text: "focus-visible:text-[hsl(var(--accent-foreground))]";
         };
         readonly disabled: {
             readonly opacity: "opacity-50";