shadcn-glass-ui 2.3.0 → 2.3.1

package/dist/{theme-context-DmTETrFi.cjs → theme-context-7NcW0KZL.cjs}

@@ -1,4 +1,4 @@
-const require_trust_score_card_glass = require("./trust-score-card-glass-3VBi9soW.cjs");
+const require_trust_score_card_glass = require("./trust-score-card-glass-DtgFygh5.cjs");
 let react = require("react");
 let lucide_react = require("lucide-react");
 let react_jsx_runtime = require("react/jsx-runtime");
@@ -99,4 +99,4 @@ Object.defineProperty(exports, "useTheme", {
 	}
 });
 
-//# sourceMappingURL=theme-context-DmTETrFi.cjs.map
+//# sourceMappingURL=theme-context-7NcW0KZL.cjs.map

package/dist/{theme-context-DmTETrFi.cjs.map → theme-context-7NcW0KZL.cjs.map}

@@ -1 +1 @@
-{"version":3,"file":"theme-context-DmTETrFi.cjs","names":["THEMES: readonly Theme[]","THEME_CONFIG: Record<Theme, ThemeConfig>","DEFAULT_THEME: Theme","value: ThemeContextValue"],"sources":["../src/lib/theme-context.tsx"],"sourcesContent":["/**\n * Theme System for Glass UI Components\n *\n * Multi-theme support with CSS variables for glass, light, and aurora themes.\n * Provides ThemeProvider context and useTheme hook for theme management.\n *\n * @module theme-context\n *\n * @example\n * ```tsx\n * // Wrap your app with ThemeProvider\n * import { ThemeProvider } from 'shadcn-glass-ui';\n *\n * function App() {\n *   return (\n *     <ThemeProvider defaultTheme=\"glass\">\n *       <YourApp />\n *     </ThemeProvider>\n *   );\n * }\n * ```\n *\n * @example\n * ```tsx\n * // Use the theme hook in components\n * import { useTheme } from 'shadcn-glass-ui';\n *\n * function ThemeSwitcher() {\n *   const { theme, setTheme, cycleTheme } = useTheme();\n *\n *   return (\n *     <div>\n *       <p>Current theme: {theme}</p>\n *       <button onClick={cycleTheme}>Cycle Theme</button>\n *       <button onClick={() => setTheme('glass')}>Set Glass</button>\n *     </div>\n *   );\n * }\n * ```\n *\n * @see {@link docs/THEME_CREATION_GUIDE.md} for creating custom themes\n * @see {@link docs/TOKEN_ARCHITECTURE.md} for CSS variable system\n */\n\nimport { createContext, useContext, useState, useEffect, useCallback, type ReactNode } from 'react';\nimport { Sun, Moon, Palette, type LucideIcon } from 'lucide-react';\n\n// ========================================\n// TYPES\n// ========================================\n\n/**\n * Available theme options for Glass UI components.\n * - `light` - Light theme with subtle glass effects\n * - `aurora` - Gradient theme with aurora/northern lights effects\n * - `glass` - Dark glassmorphism theme (default)\n */\nexport type Theme = 'light' | 'aurora' | 'glass';\n\n/** @deprecated Use Theme instead */\nexport type ThemeName = Theme;\n\n/**\n * Configuration for a single theme including display label and icon.\n */\nexport interface ThemeConfig {\n  /** Human-readable theme name for UI display */\n  readonly label: string;\n  /** Lucide icon component for theme toggle buttons */\n  readonly icon: LucideIcon;\n}\n\n/**\n * Context value returned by useTheme hook.\n */\nexport interface ThemeContextValue {\n  /** Current active theme */\n  readonly theme: Theme;\n  /** Set a specific theme */\n  readonly setTheme: (theme: Theme) => void;\n  /** Cycle to next theme in order: light → aurora → glass → light */\n  readonly cycleTheme: () => void;\n}\n\n// ========================================\n// CONSTANTS\n// ========================================\n\n/** Array of all available themes in cycle order */\nexport const THEMES: readonly Theme[] = ['light', 'aurora', 'glass'] as const;\n\n/**\n * Theme configuration map with labels and icons.\n * Used by ThemeToggleGlass and other theme switching components.\n */\n// eslint-disable-next-line react-refresh/only-export-components\nexport const THEME_CONFIG: Record<Theme, ThemeConfig> = {\n  light: { label: 'Light', icon: Sun },\n  aurora: { label: 'Aurora', icon: Moon },\n  glass: { label: 'Glass', icon: Palette },\n} as const;\n\nconst STORAGE_KEY = 'glass-ui-theme';\nconst DEFAULT_THEME: Theme = 'glass';\n\n// ========================================\n// CONTEXT\n// ========================================\n\nconst ThemeContext = createContext<ThemeContextValue | null>(null);\n\n// ========================================\n// PROVIDER\n// ========================================\n\ninterface ThemeProviderProps {\n  /** Child components to wrap with theme context */\n  readonly children: ReactNode;\n  /** Initial theme to use (default: \"glass\") */\n  readonly defaultTheme?: Theme;\n  /** localStorage key for persistence (default: \"glass-ui-theme\") */\n  readonly storageKey?: string;\n}\n\n/**\n * Theme provider component that manages theme state and persistence.\n *\n * Wraps your application to provide theme context to all child components.\n * Theme is automatically persisted to localStorage and applied to document.\n *\n * @param props - Provider configuration\n * @param props.children - Child components to wrap\n * @param props.defaultTheme - Initial theme (default: \"glass\")\n * @param props.storageKey - localStorage key (default: \"glass-ui-theme\")\n *\n * @example\n * ```tsx\n * <ThemeProvider defaultTheme=\"glass\">\n *   <App />\n * </ThemeProvider>\n * ```\n */\nexport function ThemeProvider({\n  children,\n  defaultTheme = DEFAULT_THEME,\n  storageKey = STORAGE_KEY,\n}: ThemeProviderProps) {\n  const [theme, setThemeState] = useState<Theme>(() => {\n    if (typeof window === 'undefined') {\n      return defaultTheme;\n    }\n\n    const stored = localStorage.getItem(storageKey);\n    if (stored && THEMES.includes(stored as Theme)) {\n      return stored as Theme;\n    }\n\n    return defaultTheme;\n  });\n\n  // Apply theme to document\n  useEffect(() => {\n    const root = document.documentElement;\n    root.setAttribute('data-theme', theme);\n    localStorage.setItem(storageKey, theme);\n  }, [theme, storageKey]);\n\n  const setTheme = useCallback((newTheme: Theme) => {\n    if (THEMES.includes(newTheme)) {\n      setThemeState(newTheme);\n    }\n  }, []);\n\n  const cycleTheme = useCallback(() => {\n    setThemeState((current) => {\n      const currentIndex = THEMES.indexOf(current);\n      const nextIndex = (currentIndex + 1) % THEMES.length;\n      return THEMES[nextIndex];\n    });\n  }, []);\n\n  const value: ThemeContextValue = {\n    theme,\n    setTheme,\n    cycleTheme,\n  };\n\n  return <ThemeContext.Provider value={value}>{children}</ThemeContext.Provider>;\n}\n\n// ========================================\n// HOOK\n// ========================================\n\n/**\n * Hook to access theme context values.\n *\n * Must be used within a ThemeProvider. Returns the current theme,\n * a setter function, and a cycle function.\n *\n * @returns Theme context value with theme, setTheme, and cycleTheme\n * @throws Error if used outside of ThemeProvider\n *\n * @example\n * ```tsx\n * function MyComponent() {\n *   const { theme, setTheme, cycleTheme } = useTheme();\n *\n *   return (\n *     <button onClick={cycleTheme}>\n *       Current: {theme}\n *     </button>\n *   );\n * }\n * ```\n */\n// eslint-disable-next-line react-refresh/only-export-components\nexport function useTheme(): ThemeContextValue {\n  const context = useContext(ThemeContext);\n\n  if (!context) {\n    throw new Error('useTheme must be used within a ThemeProvider');\n  }\n\n  return context;\n}\n\n// ========================================\n// UTILITIES\n// ========================================\n\n/**\n * Get the next theme in the cycle order.\n *\n * @param current - Current theme\n * @returns Next theme in cycle (light → aurora → glass → light)\n *\n * @example\n * ```tsx\n * const next = getNextTheme('glass'); // returns 'light'\n * ```\n */\n// eslint-disable-next-line react-refresh/only-export-components\nexport function getNextTheme(current: Theme): Theme {\n  const currentIndex = THEMES.indexOf(current);\n  const nextIndex = (currentIndex + 1) % THEMES.length;\n  return THEMES[nextIndex];\n}\n\n/**\n * Get configuration for a specific theme.\n *\n * @param theme - Theme to get configuration for\n * @returns Theme configuration with label and icon\n *\n * @example\n * ```tsx\n * const config = getThemeConfig('glass');\n * // { label: 'Glass', icon: Palette }\n * ```\n */\n// eslint-disable-next-line react-refresh/only-export-components\nexport function getThemeConfig(theme: Theme): ThemeConfig {\n  return THEME_CONFIG[theme];\n}\n"],"mappings":";;;;AAyFA,MAAaA,SAA2B;CAAC;CAAS;CAAU;CAAQ;AAOpE,MAAaC,eAA2C;CACtD,OAAO;EAAE,OAAO;EAAS,MAAM,aAAA;EAAK;CACpC,QAAQ;EAAE,OAAO;EAAU,MAAM,aAAA;EAAM;CACvC,OAAO;EAAE,OAAO;EAAS,MAAM,aAAA;EAAS;CACzC;AAED,IAAM,cAAc;AACpB,IAAMC,gBAAuB;AAM7B,IAAM,gBAAA,GAAA,MAAA,eAAuD,KAAK;AAiClE,SAAgB,cAAc,EAC5B,UACA,eAAe,eACf,aAAa,eACQ;CACrB,MAAM,CAAC,OAAO,kBAAA,GAAA,MAAA,gBAAuC;AACnD,MAAI,OAAO,WAAW,YACpB,QAAO;EAGT,MAAM,SAAS,aAAa,QAAQ,WAAW;AAC/C,MAAI,UAAU,OAAO,SAAS,OAAgB,CAC5C,QAAO;AAGT,SAAO;GACP;AAGF,EAAA,GAAA,MAAA,iBAAgB;AACD,WAAS,gBACjB,aAAa,cAAc,MAAM;AACtC,eAAa,QAAQ,YAAY,MAAM;IACtC,CAAC,OAAO,WAAW,CAAC;CAgBvB,MAAMC,QAA2B;EAC/B;EACA,WAAA,GAAA,MAAA,cAhB4B,aAAoB;AAChD,OAAI,OAAO,SAAS,SAAS,CAC3B,eAAc,SAAS;KAExB,EAAE,CAAC;EAaJ,aAAA,GAAA,MAAA,mBAXmC;AACnC,kBAAe,YAAY;AAGzB,WAAO,QAFc,OAAO,QAAQ,QAAQ,GACV,KAAK,OAAO;KAE9C;KACD,EAAE,CAAC;EAML;AAED,QAAO,iBAAA,GAAA,kBAAA,KAAC,aAAa,UAAA;EAAgB;EAAQ;GAAiC;;AA8BhF,SAAgB,WAA8B;CAC5C,MAAM,WAAA,GAAA,MAAA,YAAqB,aAAa;AAExC,KAAI,CAAC,QACH,OAAM,IAAI,MAAM,+CAA+C;AAGjE,QAAO;;AAmBT,SAAgB,aAAa,SAAuB;AAGlD,QAAO,QAFc,OAAO,QAAQ,QAAQ,GACV,KAAK,OAAO;;AAiBhD,SAAgB,eAAe,OAA2B;AACxD,QAAO,aAAa"}
+{"version":3,"file":"theme-context-7NcW0KZL.cjs","names":["THEMES: readonly Theme[]","THEME_CONFIG: Record<Theme, ThemeConfig>","DEFAULT_THEME: Theme","value: ThemeContextValue"],"sources":["../src/lib/theme-context.tsx"],"sourcesContent":["/**\n * Theme System for Glass UI Components\n *\n * Multi-theme support with CSS variables for glass, light, and aurora themes.\n * Provides ThemeProvider context and useTheme hook for theme management.\n *\n * @module theme-context\n *\n * @example\n * ```tsx\n * // Wrap your app with ThemeProvider\n * import { ThemeProvider } from 'shadcn-glass-ui';\n *\n * function App() {\n *   return (\n *     <ThemeProvider defaultTheme=\"glass\">\n *       <YourApp />\n *     </ThemeProvider>\n *   );\n * }\n * ```\n *\n * @example\n * ```tsx\n * // Use the theme hook in components\n * import { useTheme } from 'shadcn-glass-ui';\n *\n * function ThemeSwitcher() {\n *   const { theme, setTheme, cycleTheme } = useTheme();\n *\n *   return (\n *     <div>\n *       <p>Current theme: {theme}</p>\n *       <button onClick={cycleTheme}>Cycle Theme</button>\n *       <button onClick={() => setTheme('glass')}>Set Glass</button>\n *     </div>\n *   );\n * }\n * ```\n *\n * @see {@link docs/THEME_CREATION_GUIDE.md} for creating custom themes\n * @see {@link docs/TOKEN_ARCHITECTURE.md} for CSS variable system\n */\n\nimport { createContext, useContext, useState, useEffect, useCallback, type ReactNode } from 'react';\nimport { Sun, Moon, Palette, type LucideIcon } from 'lucide-react';\n\n// ========================================\n// TYPES\n// ========================================\n\n/**\n * Available theme options for Glass UI components.\n * - `light` - Light theme with subtle glass effects\n * - `aurora` - Gradient theme with aurora/northern lights effects\n * - `glass` - Dark glassmorphism theme (default)\n */\nexport type Theme = 'light' | 'aurora' | 'glass';\n\n/** @deprecated Use Theme instead */\nexport type ThemeName = Theme;\n\n/**\n * Configuration for a single theme including display label and icon.\n */\nexport interface ThemeConfig {\n  /** Human-readable theme name for UI display */\n  readonly label: string;\n  /** Lucide icon component for theme toggle buttons */\n  readonly icon: LucideIcon;\n}\n\n/**\n * Context value returned by useTheme hook.\n */\nexport interface ThemeContextValue {\n  /** Current active theme */\n  readonly theme: Theme;\n  /** Set a specific theme */\n  readonly setTheme: (theme: Theme) => void;\n  /** Cycle to next theme in order: light → aurora → glass → light */\n  readonly cycleTheme: () => void;\n}\n\n// ========================================\n// CONSTANTS\n// ========================================\n\n/** Array of all available themes in cycle order */\nexport const THEMES: readonly Theme[] = ['light', 'aurora', 'glass'] as const;\n\n/**\n * Theme configuration map with labels and icons.\n * Used by ThemeToggleGlass and other theme switching components.\n */\n// eslint-disable-next-line react-refresh/only-export-components\nexport const THEME_CONFIG: Record<Theme, ThemeConfig> = {\n  light: { label: 'Light', icon: Sun },\n  aurora: { label: 'Aurora', icon: Moon },\n  glass: { label: 'Glass', icon: Palette },\n} as const;\n\nconst STORAGE_KEY = 'glass-ui-theme';\nconst DEFAULT_THEME: Theme = 'glass';\n\n// ========================================\n// CONTEXT\n// ========================================\n\nconst ThemeContext = createContext<ThemeContextValue | null>(null);\n\n// ========================================\n// PROVIDER\n// ========================================\n\ninterface ThemeProviderProps {\n  /** Child components to wrap with theme context */\n  readonly children: ReactNode;\n  /** Initial theme to use (default: \"glass\") */\n  readonly defaultTheme?: Theme;\n  /** localStorage key for persistence (default: \"glass-ui-theme\") */\n  readonly storageKey?: string;\n}\n\n/**\n * Theme provider component that manages theme state and persistence.\n *\n * Wraps your application to provide theme context to all child components.\n * Theme is automatically persisted to localStorage and applied to document.\n *\n * @param props - Provider configuration\n * @param props.children - Child components to wrap\n * @param props.defaultTheme - Initial theme (default: \"glass\")\n * @param props.storageKey - localStorage key (default: \"glass-ui-theme\")\n *\n * @example\n * ```tsx\n * <ThemeProvider defaultTheme=\"glass\">\n *   <App />\n * </ThemeProvider>\n * ```\n */\nexport function ThemeProvider({\n  children,\n  defaultTheme = DEFAULT_THEME,\n  storageKey = STORAGE_KEY,\n}: ThemeProviderProps) {\n  const [theme, setThemeState] = useState<Theme>(() => {\n    if (typeof window === 'undefined') {\n      return defaultTheme;\n    }\n\n    const stored = localStorage.getItem(storageKey);\n    if (stored && THEMES.includes(stored as Theme)) {\n      return stored as Theme;\n    }\n\n    return defaultTheme;\n  });\n\n  // Apply theme to document\n  useEffect(() => {\n    const root = document.documentElement;\n    root.setAttribute('data-theme', theme);\n    localStorage.setItem(storageKey, theme);\n  }, [theme, storageKey]);\n\n  const setTheme = useCallback((newTheme: Theme) => {\n    if (THEMES.includes(newTheme)) {\n      setThemeState(newTheme);\n    }\n  }, []);\n\n  const cycleTheme = useCallback(() => {\n    setThemeState((current) => {\n      const currentIndex = THEMES.indexOf(current);\n      const nextIndex = (currentIndex + 1) % THEMES.length;\n      return THEMES[nextIndex];\n    });\n  }, []);\n\n  const value: ThemeContextValue = {\n    theme,\n    setTheme,\n    cycleTheme,\n  };\n\n  return <ThemeContext.Provider value={value}>{children}</ThemeContext.Provider>;\n}\n\n// ========================================\n// HOOK\n// ========================================\n\n/**\n * Hook to access theme context values.\n *\n * Must be used within a ThemeProvider. Returns the current theme,\n * a setter function, and a cycle function.\n *\n * @returns Theme context value with theme, setTheme, and cycleTheme\n * @throws Error if used outside of ThemeProvider\n *\n * @example\n * ```tsx\n * function MyComponent() {\n *   const { theme, setTheme, cycleTheme } = useTheme();\n *\n *   return (\n *     <button onClick={cycleTheme}>\n *       Current: {theme}\n *     </button>\n *   );\n * }\n * ```\n */\n// eslint-disable-next-line react-refresh/only-export-components\nexport function useTheme(): ThemeContextValue {\n  const context = useContext(ThemeContext);\n\n  if (!context) {\n    throw new Error('useTheme must be used within a ThemeProvider');\n  }\n\n  return context;\n}\n\n// ========================================\n// UTILITIES\n// ========================================\n\n/**\n * Get the next theme in the cycle order.\n *\n * @param current - Current theme\n * @returns Next theme in cycle (light → aurora → glass → light)\n *\n * @example\n * ```tsx\n * const next = getNextTheme('glass'); // returns 'light'\n * ```\n */\n// eslint-disable-next-line react-refresh/only-export-components\nexport function getNextTheme(current: Theme): Theme {\n  const currentIndex = THEMES.indexOf(current);\n  const nextIndex = (currentIndex + 1) % THEMES.length;\n  return THEMES[nextIndex];\n}\n\n/**\n * Get configuration for a specific theme.\n *\n * @param theme - Theme to get configuration for\n * @returns Theme configuration with label and icon\n *\n * @example\n * ```tsx\n * const config = getThemeConfig('glass');\n * // { label: 'Glass', icon: Palette }\n * ```\n */\n// eslint-disable-next-line react-refresh/only-export-components\nexport function getThemeConfig(theme: Theme): ThemeConfig {\n  return THEME_CONFIG[theme];\n}\n"],"mappings":";;;;AAyFA,MAAaA,SAA2B;CAAC;CAAS;CAAU;CAAQ;AAOpE,MAAaC,eAA2C;CACtD,OAAO;EAAE,OAAO;EAAS,MAAM,aAAA;EAAK;CACpC,QAAQ;EAAE,OAAO;EAAU,MAAM,aAAA;EAAM;CACvC,OAAO;EAAE,OAAO;EAAS,MAAM,aAAA;EAAS;CACzC;AAED,IAAM,cAAc;AACpB,IAAMC,gBAAuB;AAM7B,IAAM,gBAAA,GAAA,MAAA,eAAuD,KAAK;AAiClE,SAAgB,cAAc,EAC5B,UACA,eAAe,eACf,aAAa,eACQ;CACrB,MAAM,CAAC,OAAO,kBAAA,GAAA,MAAA,gBAAuC;AACnD,MAAI,OAAO,WAAW,YACpB,QAAO;EAGT,MAAM,SAAS,aAAa,QAAQ,WAAW;AAC/C,MAAI,UAAU,OAAO,SAAS,OAAgB,CAC5C,QAAO;AAGT,SAAO;GACP;AAGF,EAAA,GAAA,MAAA,iBAAgB;AACD,WAAS,gBACjB,aAAa,cAAc,MAAM;AACtC,eAAa,QAAQ,YAAY,MAAM;IACtC,CAAC,OAAO,WAAW,CAAC;CAgBvB,MAAMC,QAA2B;EAC/B;EACA,WAAA,GAAA,MAAA,cAhB4B,aAAoB;AAChD,OAAI,OAAO,SAAS,SAAS,CAC3B,eAAc,SAAS;KAExB,EAAE,CAAC;EAaJ,aAAA,GAAA,MAAA,mBAXmC;AACnC,kBAAe,YAAY;AAGzB,WAAO,QAFc,OAAO,QAAQ,QAAQ,GACV,KAAK,OAAO;KAE9C;KACD,EAAE,CAAC;EAML;AAED,QAAO,iBAAA,GAAA,kBAAA,KAAC,aAAa,UAAA;EAAgB;EAAQ;GAAiC;;AA8BhF,SAAgB,WAA8B;CAC5C,MAAM,WAAA,GAAA,MAAA,YAAqB,aAAa;AAExC,KAAI,CAAC,QACH,OAAM,IAAI,MAAM,+CAA+C;AAGjE,QAAO;;AAmBT,SAAgB,aAAa,SAAuB;AAGlD,QAAO,QAFc,OAAO,QAAQ,QAAQ,GACV,KAAK,OAAO;;AAiBhD,SAAgB,eAAe,OAA2B;AACxD,QAAO,aAAa"}

package/dist/themes.cjs

@@ -1,4 +1,4 @@
-const require_theme_context = require("./theme-context-DmTETrFi.cjs");
+const require_theme_context = require("./theme-context-7NcW0KZL.cjs");
 exports.THEMES = require_theme_context.THEMES;
 exports.THEME_CONFIG = require_theme_context.THEME_CONFIG;
 exports.ThemeProvider = require_theme_context.ThemeProvider;

package/dist/{trust-score-card-glass-EfMB5l5J.mjs → trust-score-card-glass-BGqBcdyJ.mjs}

@@ -2,17 +2,19 @@ import { t as cn } from "./utils-B792GPM_.mjs";
 import { n as useHover, t as useFocus } from "./use-focus-C5kPAKr_.mjs";
 import { o as useTheme } from "./theme-context-DLS2uAgJ.mjs";
 import * as React from "react";
-import { createContext, forwardRef, useCallback, useContext, useEffect, useId, useMemo, useRef, useState } from "react";
+import { forwardRef, useCallback, useEffect, useId, useMemo, useRef, useState } from "react";
 import { AlertCircle, AlertTriangle, ArrowDown, ArrowUp, Calendar, Check, CheckCircle, CheckIcon, ChevronDown, ChevronRight, ChevronRightIcon, ChevronUp, ChevronsUpDownIcon, CircleIcon, Clock, Code, ExternalLink, FolderGit2, GitPullRequest, Github, Info, Minus, Moon, Palette, RefreshCw, Search, SearchIcon, Sparkles, Star, Sun, Target, TrendingDown, TrendingUp, User, Users, X, Zap } from "lucide-react";
 import { cva } from "class-variance-authority";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import * as AvatarPrimitive from "@radix-ui/react-avatar";
 import { Slot } from "@radix-ui/react-slot";
+import * as CheckboxPrimitive from "@radix-ui/react-checkbox";
 import * as PopoverPrimitive from "@radix-ui/react-popover";
 import { Command } from "cmdk";
 import * as DialogPrimitive from "@radix-ui/react-dialog";
 import * as DropdownMenuPrimitive from "@radix-ui/react-dropdown-menu";
 import * as SliderPrimitive from "@radix-ui/react-slider";
+import * as TabsPrimitive from "@radix-ui/react-tabs";
 import * as TooltipPrimitive from "@radix-ui/react-tooltip";
 import { Bar, BarChart, Cell, ResponsiveContainer, Tooltip } from "recharts";
 const alertVariants = cva("flex items-start gap-2 md:gap-3 p-3 md:p-4 rounded-xl transition-all duration-300 backdrop-blur-sm min-w-96 max-w-2xl", {
@@ -261,6 +263,7 @@ var AvatarGlassRoot = React.forwardRef(({ className, size = "md", status, glowin
 			glowing
 		},
 		children: /* @__PURE__ */ jsxs("div", {
+			"data-slot": "avatar",
 			className: cn("relative inline-flex", className),
 			onMouseEnter: hoverProps.onMouseEnter,
 			onMouseLeave: hoverProps.onMouseLeave,
@@ -271,6 +274,7 @@ var AvatarGlassRoot = React.forwardRef(({ className, size = "md", status, glowin
 				...props,
 				children
 			}), status && /* @__PURE__ */ jsx("span", {
+				"data-slot": "avatar-status",
 				className: cn(statusSizes({ size })),
 				style: {
 					background: getStatusVars$1(status).bg,
@@ -286,6 +290,7 @@ AvatarGlassRoot.displayName = "AvatarGlass";
 var AvatarGlassImage = React.forwardRef(({ className, ...props }, ref) => {
 	return /* @__PURE__ */ jsx(AvatarPrimitive.Image, {
 		ref,
+		"data-slot": "avatar-image",
 		className: cn("aspect-square h-full w-full object-cover", className),
 		...props
 	});
@@ -294,6 +299,7 @@ AvatarGlassImage.displayName = "AvatarGlassImage";
 var AvatarGlassFallback = React.forwardRef(({ className, ...props }, ref) => {
 	return /* @__PURE__ */ jsx(AvatarPrimitive.Fallback, {
 		ref,
+		"data-slot": "avatar-fallback",
 		className: cn("flex h-full w-full items-center justify-center font-semibold uppercase", className),
 		...props
 	});
@@ -528,78 +534,47 @@ const ButtonGlass = forwardRef(({ asChild = false, className, variant = "default
 	});
 });
 ButtonGlass.displayName = "ButtonGlass";
-const CheckboxGlass = forwardRef(({ className, checked: controlledChecked, defaultChecked, onCheckedChange, onChange, label, disabled, ...props }, ref) => {
-	const { isHovered, hoverProps } = useHover();
-	const { isFocusVisible, focusProps } = useFocus({ focusVisible: true });
-	const [uncontrolledChecked, setUncontrolledChecked] = React.useState(defaultChecked ?? false);
-	const isControlled = controlledChecked !== void 0;
-	const checked = isControlled ? controlledChecked : uncontrolledChecked;
-	const isChecked = checked === true;
-	const isIndeterminate = checked === "indeterminate";
-	const showIndicator = isChecked || isIndeterminate;
-	const handleChange = (newChecked) => {
-		if (disabled) return;
-		if (!isControlled) setUncontrolledChecked(newChecked);
+const CheckboxGlass = React.forwardRef(({ className, label, onChange, onCheckedChange, disabled, checked, ...props }, ref) => {
+	const handleCheckedChange = React.useCallback((newChecked) => {
 		onCheckedChange?.(newChecked);
 		if (onChange && typeof newChecked === "boolean") onChange(newChecked);
-	};
-	const toggleChecked = () => {
-		if (isIndeterminate) handleChange(true);
-		else handleChange(!isChecked);
-	};
+	}, [onCheckedChange, onChange]);
+	const isIndeterminate = checked === "indeterminate";
+	const showIndicator = checked === true || isIndeterminate;
 	const checkboxStyles = {
 		background: showIndicator ? "var(--checkbox-checked-bg)" : "var(--checkbox-bg)",
-		border: `2px solid ${showIndicator ? "var(--checkbox-checked-bg)" : "var(--checkbox-border)"}`,
-		boxShadow: isFocusVisible && !disabled ? "var(--focus-glow)" : isHovered && !disabled ? "var(--checkbox-glow)" : "none"
+		borderColor: showIndicator ? "var(--checkbox-checked-bg)" : "var(--checkbox-border)"
 	};
-	const ariaChecked = isIndeterminate ? "mixed" : isChecked;
 	return /* @__PURE__ */ jsxs("label", {
 		className: cn("inline-flex items-center gap-2 md:gap-2.5", disabled ? "opacity-50 cursor-not-allowed" : "cursor-pointer", className),
-		onMouseEnter: hoverProps.onMouseEnter,
-		onMouseLeave: hoverProps.onMouseLeave,
-		children: [
-			/* @__PURE__ */ jsx("input", {
+		children: [/* @__PURE__ */ jsx("span", {
+			className: "inline-flex items-center justify-center min-w-11 min-h-11",
+			children: /* @__PURE__ */ jsx(CheckboxPrimitive.Root, {
 				ref,
-				type: "checkbox",
-				checked: isChecked,
-				onChange: (e) => handleChange(e.target.checked),
+				"data-slot": "checkbox",
+				checked,
+				onCheckedChange: handleCheckedChange,
 				disabled,
-				className: "sr-only",
-				...props
-			}),
-			/* @__PURE__ */ jsx("span", {
-				className: "inline-flex items-center justify-center min-w-11 min-h-11",
-				children: /* @__PURE__ */ jsxs("div", {
-					onClick: toggleChecked,
-					onFocus: focusProps.onFocus,
-					onBlur: focusProps.onBlur,
-					className: "relative w-6 h-6 md:w-5 md:h-5 rounded-md flex items-center justify-center transition-all duration-300",
-					style: checkboxStyles,
-					role: "checkbox",
-					"aria-checked": ariaChecked,
-					"aria-label": label || "Checkbox",
-					tabIndex: disabled ? -1 : 0,
-					onKeyDown: (e) => {
-						if (!disabled && (e.key === "Enter" || e.key === " ")) {
-							e.preventDefault();
-							toggleChecked();
-						}
-					},
-					children: [isChecked && /* @__PURE__ */ jsx(Check, {
+				className: cn("peer relative w-6 h-6 md:w-5 md:h-5 shrink-0", "rounded-md border-2 transition-all duration-300", "flex items-center justify-center", "focus-visible:outline-none focus-visible:shadow-(--focus-glow)", "hover:shadow-(--checkbox-glow)", "disabled:cursor-not-allowed disabled:opacity-50 disabled:hover:shadow-none"),
+				style: checkboxStyles,
+				...props,
+				children: /* @__PURE__ */ jsx(CheckboxPrimitive.Indicator, {
+					"data-slot": "checkbox-indicator",
+					className: "flex items-center justify-center text-current",
+					children: isIndeterminate ? /* @__PURE__ */ jsx(Minus, {
 						className: "w-3.5 h-3.5 md:w-3 md:h-3",
 						style: { color: "var(--text-inverse)" }
-					}), isIndeterminate && /* @__PURE__ */ jsx(Minus, {
+					}) : /* @__PURE__ */ jsx(Check, {
 						className: "w-3.5 h-3.5 md:w-3 md:h-3",
 						style: { color: "var(--text-inverse)" }
-					})]
+					})
 				})
-			}),
-			label && /* @__PURE__ */ jsx("span", {
-				className: "text-xs md:text-sm",
-				style: { color: "var(--text-secondary)" },
-				children: label
 			})
-		]
+		}), label && /* @__PURE__ */ jsx("span", {
+			className: "text-xs md:text-sm",
+			style: { color: "var(--text-secondary)" },
+			children: label
+		})]
 	});
 });
 CheckboxGlass.displayName = "CheckboxGlass";
@@ -679,6 +654,7 @@ const CircularProgressGlass = forwardRef(({ className, size = "md", value = 0, v
 	const glowId = `circular-glow-${uniqueId}`;
 	return /* @__PURE__ */ jsxs("div", {
 		ref,
+		"data-slot": "circular-progress",
 		className: cn(circularProgressVariants({ size }), className),
 		...props,
 		children: [
@@ -952,14 +928,33 @@ function ComboBoxGlassInner({ options, value, onValueChange, placeholder = "Sele
 }
 const ComboBoxGlass = forwardRef(ComboBoxGlassInner);
 ComboBoxGlassInner.displayName = "ComboBoxGlass";
-var DropdownMenuGlass = DropdownMenuPrimitive.Root;
-var DropdownMenuGlassTrigger = DropdownMenuPrimitive.Trigger;
-var DropdownMenuGlassGroup = DropdownMenuPrimitive.Group;
+var DropdownMenuGlassRoot = (props) => /* @__PURE__ */ jsx(DropdownMenuPrimitive.Root, { ...props });
+DropdownMenuGlassRoot.displayName = "DropdownMenuGlass";
+var DropdownMenuGlass = DropdownMenuGlassRoot;
+var DropdownMenuGlassTrigger = React.forwardRef((props, ref) => /* @__PURE__ */ jsx(DropdownMenuPrimitive.Trigger, {
+	"data-slot": "dropdown-menu-trigger",
+	ref,
+	...props
+}));
+DropdownMenuGlassTrigger.displayName = "DropdownMenuGlassTrigger";
+var DropdownMenuGlassGroup = React.forwardRef((props, ref) => /* @__PURE__ */ jsx(DropdownMenuPrimitive.Group, {
+	"data-slot": "dropdown-menu-group",
+	ref,
+	...props
+}));
+DropdownMenuGlassGroup.displayName = "DropdownMenuGlassGroup";
 var DropdownMenuGlassPortal = DropdownMenuPrimitive.Portal;
-var DropdownMenuGlassSub = DropdownMenuPrimitive.Sub;
-var DropdownMenuGlassRadioGroup = DropdownMenuPrimitive.RadioGroup;
+var DropdownMenuGlassSub = (props) => /* @__PURE__ */ jsx(DropdownMenuPrimitive.Sub, { ...props });
+DropdownMenuGlassSub.displayName = "DropdownMenuGlassSub";
+var DropdownMenuGlassRadioGroup = React.forwardRef((props, ref) => /* @__PURE__ */ jsx(DropdownMenuPrimitive.RadioGroup, {
+	"data-slot": "dropdown-menu-radio-group",
+	ref,
+	...props
+}));
+DropdownMenuGlassRadioGroup.displayName = "DropdownMenuGlassRadioGroup";
 var DropdownMenuGlassSubTrigger = React.forwardRef(({ className, inset, children, ...props }, ref) => /* @__PURE__ */ jsxs(DropdownMenuPrimitive.SubTrigger, {
 	ref,
+	"data-slot": "dropdown-menu-sub-trigger",
 	className: cn(getDropdownItemClasses(), "data-[state=open]:bg-[var(--dropdown-item-hover)]", inset && "pl-8", className),
 	...props,
 	children: [children, /* @__PURE__ */ jsx(ChevronRightIcon, { className: "ml-auto h-4 w-4" })]
@@ -967,6 +962,7 @@ var DropdownMenuGlassSubTrigger = React.forwardRef(({ className, inset, children
 DropdownMenuGlassSubTrigger.displayName = "DropdownMenuGlassSubTrigger";
 var DropdownMenuGlassSubContent = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(DropdownMenuPrimitive.SubContent, {
 	ref,
+	"data-slot": "dropdown-menu-sub-content",
 	className: cn(dropdownContentClasses, "p-1.5", className),
 	style: getDropdownContentStyles(),
 	...props
@@ -974,6 +970,7 @@ var DropdownMenuGlassSubContent = React.forwardRef(({ className, ...props }, ref
 DropdownMenuGlassSubContent.displayName = "DropdownMenuGlassSubContent";
 var DropdownMenuGlassContent = React.forwardRef(({ className, sideOffset = 8, ...props }, ref) => /* @__PURE__ */ jsx(DropdownMenuPrimitive.Portal, { children: /* @__PURE__ */ jsx(DropdownMenuPrimitive.Content, {
 	ref,
+	"data-slot": "dropdown-menu-content",
 	sideOffset,
 	className: cn(dropdownContentClasses, "p-1.5", className),
 	style: getDropdownContentStyles(),
@@ -982,12 +979,14 @@ var DropdownMenuGlassContent = React.forwardRef(({ className, sideOffset = 8, ..
 DropdownMenuGlassContent.displayName = "DropdownMenuGlassContent";
 var DropdownMenuGlassItem = React.forwardRef(({ className, inset, variant = "default", ...props }, ref) => /* @__PURE__ */ jsx(DropdownMenuPrimitive.Item, {
 	ref,
+	"data-slot": "dropdown-menu-item",
 	className: cn(getDropdownItemClasses({ danger: variant === "destructive" }), inset && "pl-8", className),
 	...props
 }));
 DropdownMenuGlassItem.displayName = "DropdownMenuGlassItem";
 var DropdownMenuGlassCheckboxItem = React.forwardRef(({ className, children, checked, ...props }, ref) => /* @__PURE__ */ jsxs(DropdownMenuPrimitive.CheckboxItem, {
 	ref,
+	"data-slot": "dropdown-menu-checkbox-item",
 	className: cn(getDropdownItemClasses(), "pl-8 pr-2", className),
 	checked,
 	...props,
@@ -999,6 +998,7 @@ var DropdownMenuGlassCheckboxItem = React.forwardRef(({ className, children, che
 DropdownMenuGlassCheckboxItem.displayName = "DropdownMenuGlassCheckboxItem";
 var DropdownMenuGlassRadioItem = React.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs(DropdownMenuPrimitive.RadioItem, {
 	ref,
+	"data-slot": "dropdown-menu-radio-item",
 	className: cn(getDropdownItemClasses(), "pl-8 pr-2", className),
 	...props,
 	children: [/* @__PURE__ */ jsx("span", {
@@ -1009,18 +1009,21 @@ var DropdownMenuGlassRadioItem = React.forwardRef(({ className, children, ...pro
 DropdownMenuGlassRadioItem.displayName = "DropdownMenuGlassRadioItem";
 var DropdownMenuGlassLabel = React.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsx(DropdownMenuPrimitive.Label, {
 	ref,
+	"data-slot": "dropdown-menu-label",
 	className: cn(dropdownLabelClasses, inset && "pl-8", className),
 	...props
 }));
 DropdownMenuGlassLabel.displayName = "DropdownMenuGlassLabel";
 var DropdownMenuGlassSeparator = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(DropdownMenuPrimitive.Separator, {
 	ref,
+	"data-slot": "dropdown-menu-separator",
 	className: cn(dropdownSeparatorClasses, "-mx-1 my-1", className),
 	...props
 }));
 DropdownMenuGlassSeparator.displayName = "DropdownMenuGlassSeparator";
 var DropdownMenuGlassShortcut = ({ className, ...props }) => {
 	return /* @__PURE__ */ jsx("span", {
+		"data-slot": "dropdown-menu-shortcut",
 		className: cn("ml-auto text-xs tracking-widest text-(--text-muted)", className),
 		...props
 	});
@@ -1029,6 +1032,7 @@ DropdownMenuGlassShortcut.displayName = "DropdownMenuGlassShortcut";
 const DropdownGlass = React.forwardRef(({ trigger, items, align = "left", className }, ref) => {
 	return /* @__PURE__ */ jsx("div", {
 		ref,
+		"data-slot": "dropdown",
 		className: cn("relative inline-block", className),
 		children: /* @__PURE__ */ jsxs(DropdownMenuGlass, { children: [/* @__PURE__ */ jsx(DropdownMenuGlassTrigger, {
 			asChild: true,
@@ -1104,6 +1108,7 @@ const GlassCard = forwardRef(({ asChild = false, children, className, intensity
 	};
 	return /* @__PURE__ */ jsx(asChild ? Slot : "div", {
 		ref,
+		"data-slot": "card",
 		className: cn(cardIntensity({
 			intensity,
 			hover,
@@ -1386,6 +1391,7 @@ const NotificationGlass = forwardRef(({ variant: variantProp, type: typeProp, ti
 	};
 	return /* @__PURE__ */ jsxs("div", {
 		ref,
+		"data-slot": "notification",
 		className: cn(notificationVariants({ type: effectiveType }), className),
 		style: containerStyles,
 		role: "alert",
@@ -1426,9 +1432,20 @@ const NotificationGlass = forwardRef(({ variant: variantProp, type: typeProp, ti
 	});
 });
 NotificationGlass.displayName = "NotificationGlass";
-var PopoverGlassRoot = PopoverPrimitive.Root;
-var PopoverGlassTrigger = PopoverPrimitive.Trigger;
-var PopoverGlassAnchor = PopoverPrimitive.Anchor;
+var PopoverGlassRoot = (props) => /* @__PURE__ */ jsx(PopoverPrimitive.Root, { ...props });
+PopoverGlassRoot.displayName = "PopoverGlass";
+var PopoverGlassTrigger = React.forwardRef((props, ref) => /* @__PURE__ */ jsx(PopoverPrimitive.Trigger, {
+	"data-slot": "popover-trigger",
+	ref,
+	...props
+}));
+PopoverGlassTrigger.displayName = "PopoverGlassTrigger";
+var PopoverGlassAnchor = React.forwardRef((props, ref) => /* @__PURE__ */ jsx(PopoverPrimitive.Anchor, {
+	"data-slot": "popover-anchor",
+	ref,
+	...props
+}));
+PopoverGlassAnchor.displayName = "PopoverGlassAnchor";
 var PopoverGlassContent = React.forwardRef(({ className, align = "center", sideOffset = 8, showArrow = true, children, ...props }, ref) => {
 	const popoverStyles = {
 		background: "var(--popover-bg)",
@@ -1440,6 +1457,7 @@ var PopoverGlassContent = React.forwardRef(({ className, align = "center", sideO
 	const arrowStyles = { fill: "var(--popover-arrow-bg)" };
 	return /* @__PURE__ */ jsx(PopoverPrimitive.Portal, { children: /* @__PURE__ */ jsxs(PopoverPrimitive.Content, {
 		ref,
+		"data-slot": "popover-content",
 		align,
 		sideOffset,
 		className: cn("z-50003 rounded-2xl", "animate-in fade-in-0 zoom-in-95 duration-200", "data-[side=bottom]:slide-in-from-top-2", "data-[side=top]:slide-in-from-bottom-2", "data-[side=right]:slide-in-from-left-2", "data-[side=left]:slide-in-from-right-2", "outline-none", className),
@@ -1495,6 +1513,7 @@ const SkeletonGlass = forwardRef(({ className, variant = "text", width, height,
 	};
 	return /* @__PURE__ */ jsx("div", {
 		ref,
+		"data-slot": "skeleton",
 		className: cn(skeletonVariants({ variant }), className),
 		style: skeletonStyles,
 		"aria-hidden": "true",
@@ -1533,6 +1552,7 @@ const SliderGlass = forwardRef(({ className, value, defaultValue, onValueChange,
 		className: cn("w-full", className),
 		children: [customLabel, /* @__PURE__ */ jsxs(SliderPrimitive.Root, {
 			ref,
+			"data-slot": "slider",
 			value,
 			defaultValue,
 			onValueChange,
@@ -1545,13 +1565,16 @@ const SliderGlass = forwardRef(({ className, value, defaultValue, onValueChange,
 			className: cn("relative flex touch-none select-none", orientation === "horizontal" ? "w-full h-8 md:h-6 items-center" : "flex-col h-full w-8 md:w-6 justify-center", disabled && "opacity-50 cursor-not-allowed", "group"),
 			...props,
 			children: [/* @__PURE__ */ jsx(SliderPrimitive.Track, {
+				"data-slot": "slider-track",
 				className: cn("relative grow rounded-full", orientation === "horizontal" ? "h-2.5 md:h-2 w-full" : "w-2.5 md:w-2 h-full"),
 				style: trackStyles,
 				children: /* @__PURE__ */ jsx(SliderPrimitive.Range, {
+					"data-slot": "slider-range",
 					className: cn("absolute rounded-full transition-shadow duration-150", orientation === "horizontal" ? "h-full" : "w-full", "group-hover:shadow-(--slider-fill-glow)", "group-active:shadow-(--slider-fill-glow)"),
 					style: rangeStyles
 				})
 			}), currentValue.map((_, index) => /* @__PURE__ */ jsx(SliderPrimitive.Thumb, {
+				"data-slot": "slider-thumb",
 				className: cn("block rounded-full shadow-md transition-all duration-150", "w-6 h-6 md:w-5 md:h-5", "hover:scale-105", "focus-visible:outline-none focus-visible:shadow-(--focus-glow)", "active:scale-110", disabled && "pointer-events-none"),
 				style: thumbStyles,
 				"aria-label": label ? currentValue.length > 1 ? `${label} thumb ${index + 1}` : label : `Slider thumb ${index + 1}`
@@ -1560,118 +1583,35 @@ const SliderGlass = forwardRef(({ className, value, defaultValue, onValueChange,
 	});
 });
 SliderGlass.displayName = "SliderGlass";
-var TabsContext = createContext(null);
-var useTabsContext = () => {
-	const context = useContext(TabsContext);
-	if (!context) throw new Error("Tabs compound components must be used within TabsGlass.Root");
-	return context;
-};
-var TabsRoot = ({ value: controlledValue, defaultValue, onValueChange, children, className }) => {
-	const [uncontrolledValue, setUncontrolledValue] = useState(defaultValue ?? "");
-	const isControlled = controlledValue !== void 0;
-	const value = isControlled ? controlledValue : uncontrolledValue;
-	const handleValueChange = (newValue) => {
-		if (!isControlled) setUncontrolledValue(newValue);
-		onValueChange?.(newValue);
-	};
-	return /* @__PURE__ */ jsx(TabsContext.Provider, {
-		value: {
-			value,
-			onValueChange: handleValueChange
-		},
-		children: /* @__PURE__ */ jsx("div", {
-			className: cn("tabs-glass-root", className),
-			children
-		})
-	});
-};
-var TabsList = forwardRef(({ children, className, ...props }, ref) => {
-	return /* @__PURE__ */ jsx("div", {
-		ref,
-		className: cn("inline-flex gap-0.5 md:gap-1 p-0.5 md:p-1 rounded-xl", className),
-		style: {
-			background: "var(--tab-container-bg)",
-			border: "1px solid var(--tab-container-border)"
-		},
-		role: "tablist",
-		...props,
-		children
+function TabsRoot({ className, ...props }) {
+	return /* @__PURE__ */ jsx(TabsPrimitive.Root, {
+		"data-slot": "tabs",
+		className: cn("tabs-glass-root", className),
+		...props
 	});
-});
+}
+var TabsList = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(TabsPrimitive.List, {
+	ref,
+	"data-slot": "tabs-list",
+	className: cn("inline-flex gap-0.5 md:gap-1 p-0.5 md:p-1 rounded-xl", "bg-(--tab-container-bg) border border-(--tab-container-border)", className),
+	...props
+}));
 TabsList.displayName = "TabsList";
-var TabsTrigger = forwardRef(({ value, children, className, disabled }, ref) => {
-	const { value: activeValue, onValueChange } = useTabsContext();
-	const { isFocusVisible, focusProps } = useFocus({ focusVisible: true });
-	const isActive = activeValue === value;
-	const tabStyles = {
-		background: isActive ? "var(--tab-active-bg)" : "var(--tab-bg)",
-		color: isActive ? "var(--tab-active-text)" : "var(--text-secondary)",
-		boxShadow: isFocusVisible && !disabled ? "var(--focus-glow)" : "none"
-	};
-	const handleKeyDown = (e) => {
-		if (disabled) return;
-		const tablist = e.currentTarget.closest("[role=\"tablist\"]");
-		if (!tablist) return;
-		const tabs = Array.from(tablist.querySelectorAll("[role=\"tab\"]:not([disabled])"));
-		const currentIndex = tabs.indexOf(e.currentTarget);
-		let nextIndex = currentIndex;
-		switch (e.key) {
-			case "ArrowRight":
-				e.preventDefault();
-				nextIndex = currentIndex + 1 >= tabs.length ? 0 : currentIndex + 1;
-				break;
-			case "ArrowLeft":
-				e.preventDefault();
-				nextIndex = currentIndex - 1 < 0 ? tabs.length - 1 : currentIndex - 1;
-				break;
-			case "Home":
-				e.preventDefault();
-				nextIndex = 0;
-				break;
-			case "End":
-				e.preventDefault();
-				nextIndex = tabs.length - 1;
-				break;
-			default: return;
-		}
-		const nextTab = tabs[nextIndex];
-		if (nextTab) {
-			nextTab.focus();
-			const nextValue = nextTab.getAttribute("data-value");
-			if (nextValue && onValueChange) onValueChange(nextValue);
-		}
-	};
-	return /* @__PURE__ */ jsxs("button", {
-		ref,
-		type: "button",
-		role: "tab",
-		"aria-selected": isActive,
-		disabled,
-		"data-value": value,
-		className: cn("relative px-2.5 py-1.5 md:px-4 md:py-2 rounded-lg text-xs md:text-sm font-medium transition-[background-color,color,opacity] duration-300", disabled && "opacity-50 cursor-not-allowed", className),
-		style: tabStyles,
-		onClick: () => !disabled && onValueChange?.(value),
-		onKeyDown: handleKeyDown,
-		onFocus: focusProps.onFocus,
-		onBlur: focusProps.onBlur,
-		children: [children, isActive && /* @__PURE__ */ jsx("div", {
-			className: "absolute bottom-0 left-1/2 -translate-x-1/2 w-6 md:w-8 h-0.5 rounded-full",
-			style: { background: "var(--tab-indicator)" }
-		})]
-	});
-});
+var TabsTrigger = React.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsx(TabsPrimitive.Trigger, {
+	ref,
+	"data-slot": "tabs-trigger",
+	className: cn("relative px-2.5 py-1.5 md:px-4 md:py-2 rounded-lg", "text-xs md:text-sm font-medium", "transition-[background-color,color,opacity,box-shadow] duration-300", "bg-(--tab-bg) text-(--text-secondary)", "data-[state=active]:bg-(--tab-active-bg) data-[state=active]:text-(--tab-active-text)", "focus-visible:outline-none focus-visible:shadow-(--focus-glow)", "disabled:opacity-50 disabled:cursor-not-allowed", "after:absolute after:bottom-0 after:left-1/2 after:-translate-x-1/2", "after:w-6 md:after:w-8 after:h-0.5 after:rounded-full", "after:bg-(--tab-indicator)", "after:opacity-0 data-[state=active]:after:opacity-100", "after:transition-opacity after:duration-300", className),
+	...props,
+	children
+}));
 TabsTrigger.displayName = "TabsTrigger";
-var TabsContent = ({ value, children, className }) => {
-	const { value: activeValue } = useTabsContext();
-	const isActive = activeValue === value;
-	if (!isActive) return null;
-	return /* @__PURE__ */ jsx("div", {
-		role: "tabpanel",
-		"aria-hidden": !isActive,
-		className: cn("animate-in fade-in-0 duration-200", className),
-		children
-	});
-};
+var TabsContent = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(TabsPrimitive.Content, {
+	ref,
+	"data-slot": "tabs-content",
+	className: cn("animate-in fade-in-0 duration-200 outline-none", "focus-visible:outline-none", className),
+	...props
+}));
+TabsContent.displayName = "TabsContent";
 const TabsGlass = {
 	Root: TabsRoot,
 	List: TabsList,
@@ -1741,6 +1681,7 @@ const ToggleGlass = forwardRef(({ className, size = "default", variant = "defaul
 		className: "inline-flex items-center justify-center min-h-11",
 		children: /* @__PURE__ */ jsx("button", {
 			ref,
+			"data-slot": "toggle",
 			type: "button",
 			role: "switch",
 			"aria-pressed": isPressed,
@@ -2344,7 +2285,7 @@ const FlagAlertGlass = forwardRef(({ type = "warning", title, description, class
 	};
 	return /* @__PURE__ */ jsxs("div", {
 		ref,
-		className: cn("p-2.5 md:p-3 rounded-xl border transition-all duration-300", className),
+		className: cn("p-2.5 md:p-3 rounded-xl border transition-all duration-300 max-w-md", className),
 		style: alertStyles,
 		onMouseEnter: () => setIsHovered(true),
 		onMouseLeave: () => setIsHovered(false),
@@ -2534,6 +2475,7 @@ const ProgressGlass = forwardRef(({ className, size = "md", value = 0, gradient
 	};
 	return /* @__PURE__ */ jsxs("div", {
 		ref,
+		"data-slot": "progress",
 		className: cn("w-full", className),
 		...props,
 		children: [showLabel && /* @__PURE__ */ jsxs("div", {
@@ -2549,6 +2491,7 @@ const ProgressGlass = forwardRef(({ className, size = "md", value = 0, gradient
 			className: cn(progressSizes({ size })),
 			style: trackStyles,
 			children: /* @__PURE__ */ jsx("div", {
+				"data-slot": "progress-indicator",
 				className: "h-full rounded-full transition-all duration-700 ease-out",
 				style: fillStyles,
 				role: "progressbar",
@@ -4223,4 +4166,4 @@ const TrustScoreCardGlass = forwardRef(({ score = 72, metrics = [], className, .
 TrustScoreCardGlass.displayName = "TrustScoreCardGlass";
 export { TabsTrigger as $, FlagAlertGlass as A, DropdownMenuGlassTrigger as At, IconButtonGlass as B, AvatarGlass as Bt, sparklineContainerVariants as C, DropdownMenuGlassRadioGroup as Ct, progressSizes as D, DropdownMenuGlassSub as Dt, ProgressGlass as E, DropdownMenuGlassShortcut as Et, SortDropdownGlass as F, CheckboxGlass as Ft, TooltipGlassSimple as G, statusSizes as Gt, TooltipGlass as H, AvatarGlassImage as Ht, SearchBoxGlass as I, ButtonGlass as It, toggleSizes as J, AlertGlassTitle as Jt, TooltipGlassTrigger as K, AlertGlass as Kt, InsightCardGlass as L, buttonGlassVariants as Lt, BaseProgressGlass as M, inputVariants as Mt, ThemeToggleGlass as N, CircularProgressGlass as Nt, ProfileAvatarGlass as O, DropdownMenuGlassSubContent as Ot, StatItemGlass as P, Checkbox as Pt, TabsList as Q, alertVariants as Qt, insightCardVariants as R, BadgeGlass as Rt, sparklineBarVariants as S, DropdownMenuGlassPortal as St, RainbowProgressGlass as T, DropdownMenuGlassSeparator as Tt, TooltipGlassContent as U, AvatarGlassSimple as Ut, ExpandableHeaderGlass as V, AvatarGlassFallback as Vt, TooltipGlassProvider as W, avatarSizes as Wt, TabsContent as X, FormFieldWrapper as Xt, Tabs as Y, InteractiveCard as Yt, TabsGlass as Z, TouchTarget as Zt, ContributionMetricsGlass as _, DropdownMenuGlassCheckboxItem as _t, HeaderBrandingGlass as a, PopoverGlassContent as at, AICardGlass as b, DropdownMenuGlassItem as bt, YearCardGlass as c, NotificationGlass as ct, TrustScoreDisplayGlass as d, modalSizes as dt, SliderGlass as et, RepositoryMetadataGlass as f, InputGlass as ft, MetricCardGlass as g, DropdownMenuGlass as gt, MetricsGridGlass as h, DropdownGlass as ht, HeaderNavGlass as i, PopoverGlassAnchor as it, StatusIndicatorGlass as j, ComboBoxGlass as jt, LanguageBarGlass as k, DropdownMenuGlassSubTrigger as kt, UserStatsLineGlass as l, notificationVariants as lt, RepositoryCardGlass as m, cardIntensity as mt, ProjectsListGlass as n, skeletonVariants as nt, FlagsSectionGlass as o, PopoverGlassLegacy as ot, RepositoryHeaderGlass as p, GlassCard as pt, ToggleGlass as q, AlertGlassDescription as qt, ProfileHeaderGlass as r, PopoverGlass as rt, CareerStatsGlass as s, PopoverGlassTrigger as st, TrustScoreCardGlass as t, SkeletonGlass as tt, UserInfoGlass as u, ModalGlass as ut, CircularMetricGlass as v, DropdownMenuGlassContent as vt, SegmentedControlGlass as w, DropdownMenuGlassRadioItem as wt, SparklineGlass as x, DropdownMenuGlassLabel as xt, CareerStatsHeaderGlass as y, DropdownMenuGlassGroup as yt, insightVariantConfig as z, badgeVariants as zt };
 
-//# sourceMappingURL=trust-score-card-glass-EfMB5l5J.mjs.map
+//# sourceMappingURL=trust-score-card-glass-BGqBcdyJ.mjs.map