@j3m-quantum/ui 0.1.0 → 0.2.0

package/dist/index.js

@@ -1,4 +1,4 @@
-import * as React7 from 'react';
+import * as React10 from 'react';
 import { useMemo } from 'react';
 import { Slot } from '@radix-ui/react-slot';
 import { cva } from 'class-variance-authority';
@@ -7,7 +7,7 @@ import { twMerge } from 'tailwind-merge';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import * as SeparatorPrimitive from '@radix-ui/react-separator';
 import * as CheckboxPrimitive from '@radix-ui/react-checkbox';
-import { CheckIcon, CircleIcon, ChevronDownIcon, ChevronUpIcon, MinusIcon, ChevronLeftIcon, ChevronRightIcon, ArrowLeft, ArrowRight, Loader2Icon, OctagonXIcon, TriangleAlertIcon, InfoIcon, CircleCheckIcon, ChevronRight, MoreHorizontal, MoreHorizontalIcon, XIcon, SearchIcon, GripVerticalIcon, PanelLeftIcon } from 'lucide-react';
+import { X, CheckIcon, CircleIcon, ChevronDownIcon, ChevronUpIcon, MinusIcon, ChevronLeftIcon, ChevronRightIcon, ArrowLeft, ArrowRight, Loader2Icon, OctagonXIcon, TriangleAlertIcon, InfoIcon, CircleCheckIcon, ChevronRight, MoreHorizontal, MoreHorizontalIcon, SearchIcon, XIcon, GripVerticalIcon, PanelLeftIcon } from 'lucide-react';
 import * as RadioGroupPrimitive from '@radix-ui/react-radio-group';
 import * as SwitchPrimitive from '@radix-ui/react-switch';
 import * as SliderPrimitive from '@radix-ui/react-slider';
@@ -44,8 +44,8 @@ import * as ResizablePrimitive from 'react-resizable-panels';
 // src/hooks/use-mobile.ts
 var MOBILE_BREAKPOINT = 768;
 function useIsMobile() {
-  const [isMobile, setIsMobile] = React7.useState(void 0);
-  React7.useEffect(() => {
+  const [isMobile, setIsMobile] = React10.useState(void 0);
+  React10.useEffect(() => {
     const mql = window.matchMedia(`(max-width: ${MOBILE_BREAKPOINT - 1}px)`);
     const onChange = () => {
       setIsMobile(window.innerWidth < MOBILE_BREAKPOINT);
@@ -60,24 +60,73 @@ function cn(...inputs) {
   return twMerge(clsx(inputs));
 }
 var buttonVariants = cva(
-  "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive",
+  // Base styles - shared across all variants
+  "inline-flex items-center justify-center gap-2 whitespace-nowrap font-medium transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0",
   {
     variants: {
       variant: {
-        default: "bg-primary text-primary-foreground hover:bg-primary/90",
-        destructive: "bg-destructive text-white hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60",
-        outline: "border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50",
-        secondary: "bg-secondary text-secondary-foreground hover:bg-secondary/80",
-        ghost: "hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50",
-        link: "text-primary underline-offset-4 hover:underline"
+        // Primary CTA - J3M Orange
+        default: [
+          "text-[var(--color-text-on-accent)]",
+          "bg-[var(--j3m-primary-300)]",
+          "hover:bg-[var(--j3m-primary-400)]",
+          "active:bg-[var(--j3m-primary-500)]",
+          "focus-visible:ring-[var(--j3m-primary-300)]",
+          "rounded-[var(--j3m-radius-2xs)]",
+          "shadow-sm"
+        ].join(" "),
+        // Secondary - Neutral surface
+        secondary: [
+          "text-[var(--color-text-main)]",
+          "bg-[var(--j3m-neutral-200)]",
+          "hover:bg-[var(--j3m-neutral-300)]",
+          "active:bg-[var(--j3m-neutral-400)]",
+          "focus-visible:ring-[var(--j3m-neutral-400)]",
+          "rounded-[var(--j3m-radius-2xs)]"
+        ].join(" "),
+        // Outline - Border only
+        outline: [
+          "text-[var(--color-text-main)]",
+          "bg-transparent",
+          "border border-[var(--color-border-strong)]",
+          "hover:bg-[var(--j3m-neutral-200)]",
+          "active:bg-[var(--j3m-neutral-300)]",
+          "focus-visible:ring-[var(--j3m-neutral-400)]",
+          "rounded-[var(--j3m-radius-2xs)]"
+        ].join(" "),
+        // Ghost - Minimal
+        ghost: [
+          "text-[var(--color-text-muted)]",
+          "bg-transparent",
+          "hover:bg-[var(--j3m-neutral-200)]",
+          "hover:text-[var(--color-text-main)]",
+          "active:bg-[var(--j3m-neutral-300)]",
+          "focus-visible:ring-[var(--j3m-neutral-400)]",
+          "rounded-[var(--j3m-radius-2xs)]"
+        ].join(" "),
+        // Destructive - Error/danger actions
+        destructive: [
+          "text-[var(--color-text-on-accent)]",
+          "bg-[var(--j3m-red-100)]",
+          "hover:bg-[var(--j3m-red-200)]",
+          "active:bg-[var(--j3m-red-200)]",
+          "focus-visible:ring-[var(--j3m-red-100)]",
+          "rounded-[var(--j3m-radius-2xs)]",
+          "shadow-sm"
+        ].join(" "),
+        // Link - Text only
+        link: [
+          "text-[var(--j3m-primary-300)]",
+          "underline-offset-4",
+          "hover:underline",
+          "hover:text-[var(--j3m-primary-400)]"
+        ].join(" ")
       },
       size: {
-        default: "h-9 px-4 py-2 has-[>svg]:px-3",
-        sm: "h-8 rounded-md gap-1.5 px-3 has-[>svg]:px-2.5",
-        lg: "h-10 rounded-md px-6 has-[>svg]:px-4",
-        icon: "size-9",
-        "icon-sm": "size-8",
-        "icon-lg": "size-10"
+        sm: "h-8 px-[var(--j3m-spacing-s)] text-xs",
+        default: "h-10 px-[var(--j3m-spacing-m)] py-[var(--j3m-spacing-xs)] text-sm",
+        lg: "h-12 px-[var(--j3m-spacing-xl)] text-base",
+        icon: "h-10 w-10"
       }
     },
     defaultVariants: {
@@ -86,23 +135,20 @@ var buttonVariants = cva(
     }
   }
 );
-function Button({
-  className,
-  variant,
-  size,
-  asChild = false,
-  ...props
-}) {
-  const Comp = asChild ? Slot : "button";
-  return /* @__PURE__ */ jsx(
-    Comp,
-    {
-      "data-slot": "button",
-      className: cn(buttonVariants({ variant, size, className })),
-      ...props
-    }
-  );
-}
+var Button = React10.forwardRef(
+  ({ className, variant, size, asChild = false, ...props }, ref) => {
+    const Comp = asChild ? Slot : "button";
+    return /* @__PURE__ */ jsx(
+      Comp,
+      {
+        className: cn(buttonVariants({ variant, size, className })),
+        ref,
+        ...props
+      }
+    );
+  }
+);
+Button.displayName = "Button";
 function Separator({
   className,
   orientation = "horizontal",
@@ -188,22 +234,59 @@ function ButtonGroupSeparator({
     }
   );
 }
-function Input({ className, type, ...props }) {
-  return /* @__PURE__ */ jsx(
-    "input",
-    {
-      type,
-      "data-slot": "input",
-      className: cn(
-        "file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
-        "focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]",
-        "aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive",
-        className
-      ),
-      ...props
-    }
-  );
-}
+var Input = React10.forwardRef(
+  ({ className, type, ...props }, ref) => {
+    return /* @__PURE__ */ jsx(
+      "input",
+      {
+        type,
+        "data-slot": "input",
+        className: cn(
+          // Base
+          "flex h-10 w-full min-w-0 text-sm",
+          "px-[var(--j3m-spacing-s)] py-[var(--j3m-spacing-xs)]",
+          "rounded-[var(--j3m-radius-2xs)]",
+          // Colors
+          "bg-[var(--color-bg-surface)]",
+          "text-[var(--color-text-main)]",
+          "border border-[var(--color-border-subtle)]",
+          // Placeholder
+          "placeholder:text-[var(--color-text-soft)]",
+          // Focus state
+          "focus-visible:outline-none",
+          "focus-visible:ring-2",
+          "focus-visible:ring-[var(--j3m-primary-300)]",
+          "focus-visible:ring-offset-1",
+          "focus-visible:border-[var(--j3m-primary-300)]",
+          // Hover state
+          "hover:border-[var(--color-border-strong)]",
+          // Disabled state
+          "disabled:cursor-not-allowed",
+          "disabled:opacity-50",
+          "disabled:bg-[var(--color-bg-subtle)]",
+          // Error state (via aria-invalid)
+          "aria-invalid:border-[var(--j3m-red-100)]",
+          "aria-invalid:focus-visible:ring-[var(--j3m-red-100)]",
+          // File input
+          "file:border-0",
+          "file:bg-transparent",
+          "file:text-sm",
+          "file:font-medium",
+          "file:text-[var(--color-text-main)]",
+          // Selection
+          "selection:bg-[var(--j3m-primary-100)]",
+          "selection:text-[var(--color-text-main)]",
+          // Transition
+          "transition-colors duration-150",
+          className
+        ),
+        ref,
+        ...props
+      }
+    );
+  }
+);
+Input.displayName = "Input";
 function Textarea({ className, ...props }) {
   return /* @__PURE__ */ jsx(
     "textarea",
@@ -451,7 +534,7 @@ function Slider({
   max = 100,
   ...props
 }) {
-  const _values = React7.useMemo(
+  const _values = React10.useMemo(
     () => Array.isArray(value) ? value : Array.isArray(defaultValue) ? defaultValue : [min, max],
     [value, defaultValue, min, max]
   );
@@ -737,7 +820,7 @@ function Toggle({
     }
   );
 }
-var ToggleGroupContext = React7.createContext({
+var ToggleGroupContext = React10.createContext({
   size: "default",
   variant: "default",
   spacing: 0
@@ -774,7 +857,7 @@ function ToggleGroupItem({
   size,
   ...props
 }) {
-  const context = React7.useContext(ToggleGroupContext);
+  const context = React10.useContext(ToggleGroupContext);
   return /* @__PURE__ */ jsx(
     ToggleGroupPrimitive.Item,
     {
@@ -829,7 +912,7 @@ function InputOTPSlot({
   className,
   ...props
 }) {
-  const inputOTPContext = React7.useContext(OTPInputContext);
+  const inputOTPContext = React10.useContext(OTPInputContext);
   const { char, hasFakeCaret, isActive } = inputOTPContext?.slots[index] ?? {};
   return /* @__PURE__ */ jsxs(
     "div",
@@ -868,7 +951,7 @@ function Label2({
   );
 }
 var Form = FormProvider;
-var FormFieldContext = React7.createContext(
+var FormFieldContext = React10.createContext(
   {}
 );
 var FormField = ({
@@ -877,8 +960,8 @@ var FormField = ({
   return /* @__PURE__ */ jsx(FormFieldContext.Provider, { value: { name: props.name }, children: /* @__PURE__ */ jsx(Controller, { ...props }) });
 };
 var useFormField = () => {
-  const fieldContext = React7.useContext(FormFieldContext);
-  const itemContext = React7.useContext(FormItemContext);
+  const fieldContext = React10.useContext(FormFieldContext);
+  const itemContext = React10.useContext(FormItemContext);
   const { getFieldState } = useFormContext();
   const formState = useFormState({ name: fieldContext.name });
   const fieldState = getFieldState(fieldContext.name, formState);
@@ -895,11 +978,11 @@ var useFormField = () => {
     ...fieldState
   };
 };
-var FormItemContext = React7.createContext(
+var FormItemContext = React10.createContext(
   {}
 );
 function FormItem({ className, ...props }) {
-  const id = React7.useId();
+  const id = React10.useId();
   return /* @__PURE__ */ jsx(FormItemContext.Provider, { value: { id }, children: /* @__PURE__ */ jsx(
     "div",
     {
@@ -1178,85 +1261,148 @@ function FieldError({
     }
   );
 }
-function Card({ className, ...props }) {
-  return /* @__PURE__ */ jsx(
+var cardVariants = cva(
+  // Base styles
+  "flex flex-col rounded-[var(--j3m-radius-2xs)]",
+  {
+    variants: {
+      variant: {
+        // Default solid card
+        default: [
+          "bg-[var(--color-bg-surface)]",
+          "border border-[var(--color-border-subtle)]",
+          "text-[var(--color-text-main)]",
+          "shadow-sm"
+        ].join(" "),
+        // Glass Light - for light backgrounds or over images
+        "glass-light": [
+          "bg-[var(--j3m-glass-light)]",
+          "backdrop-blur-[var(--j3m-blur-md)]",
+          "border border-[var(--j3m-glass-border-light)]",
+          "text-[var(--color-text-main)]",
+          "shadow-[var(--j3m-glass-shadow-md)]"
+        ].join(" "),
+        // Glass Dark - for light backgrounds, dark card
+        "glass-dark": [
+          "bg-[var(--j3m-glass-dark)]",
+          "backdrop-blur-[var(--j3m-blur-md)]",
+          "border border-[var(--j3m-glass-border-dark)]",
+          "text-white",
+          "shadow-[var(--j3m-glass-shadow-lg)]"
+        ].join(" "),
+        // Glass Neutral - subtle frosted effect
+        "glass-neutral": [
+          "bg-[var(--j3m-glass-neutral)]",
+          "backdrop-blur-[var(--j3m-blur-lg)]",
+          "border border-[var(--j3m-glass-border-subtle)]",
+          "text-[var(--color-text-main)]",
+          "shadow-[var(--j3m-glass-shadow-sm)]"
+        ].join(" "),
+        // Glass Primary - with orange tint
+        "glass-primary": [
+          "bg-[var(--j3m-glass-primary)]",
+          "backdrop-blur-[var(--j3m-blur-lg)]",
+          "border border-[var(--j3m-glass-border-light)]",
+          "text-[var(--color-text-main)]",
+          "shadow-[var(--j3m-glass-shadow-glow)]"
+        ].join(" ")
+      }
+    },
+    defaultVariants: {
+      variant: "default"
+    }
+  }
+);
+var Card = React10.forwardRef(
+  ({ className, variant, ...props }, ref) => /* @__PURE__ */ jsx(
     "div",
     {
+      ref,
       "data-slot": "card",
-      className: cn(
-        "bg-card text-card-foreground flex flex-col gap-6 rounded-xl border py-6 shadow-sm",
-        className
-      ),
+      className: cn(cardVariants({ variant, className })),
       ...props
     }
-  );
-}
-function CardHeader({ className, ...props }) {
-  return /* @__PURE__ */ jsx(
+  )
+);
+Card.displayName = "Card";
+var CardHeader = React10.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx(
     "div",
     {
+      ref,
       "data-slot": "card-header",
       className: cn(
-        "@container/card-header grid auto-rows-min grid-rows-[auto_auto] items-start gap-2 px-6 has-data-[slot=card-action]:grid-cols-[1fr_auto] [.border-b]:pb-6",
+        "flex flex-col gap-[var(--j3m-spacing-2xs)]",
+        "px-[var(--j3m-spacing-l)] py-[var(--j3m-spacing-m)]",
         className
       ),
       ...props
     }
-  );
-}
-function CardTitle({ className, ...props }) {
-  return /* @__PURE__ */ jsx(
-    "div",
+  )
+);
+CardHeader.displayName = "CardHeader";
+var CardTitle = React10.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+    "h3",
     {
+      ref,
       "data-slot": "card-title",
-      className: cn("leading-none font-semibold", className),
+      className: cn(
+        "text-lg font-semibold leading-none tracking-tight",
+        className
+      ),
       ...props
     }
-  );
-}
-function CardDescription({ className, ...props }) {
-  return /* @__PURE__ */ jsx(
-    "div",
+  )
+);
+CardTitle.displayName = "CardTitle";
+var CardDescription = React10.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+    "p",
     {
+      ref,
       "data-slot": "card-description",
-      className: cn("text-muted-foreground text-sm", className),
-      ...props
-    }
-  );
-}
-function CardAction({ className, ...props }) {
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      "data-slot": "card-action",
       className: cn(
-        "col-start-2 row-span-2 row-start-1 self-start justify-self-end",
+        "text-sm opacity-80",
         className
       ),
       ...props
     }
-  );
-}
-function CardContent({ className, ...props }) {
-  return /* @__PURE__ */ jsx(
+  )
+);
+CardDescription.displayName = "CardDescription";
+var CardContent = React10.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx(
     "div",
     {
+      ref,
       "data-slot": "card-content",
-      className: cn("px-6", className),
+      className: cn(
+        "px-[var(--j3m-spacing-l)] pb-[var(--j3m-spacing-m)]",
+        className
+      ),
       ...props
     }
-  );
-}
-function CardFooter({ className, ...props }) {
-  return /* @__PURE__ */ jsx(
+  )
+);
+CardContent.displayName = "CardContent";
+var CardFooter = React10.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx(
     "div",
     {
+      ref,
       "data-slot": "card-footer",
-      className: cn("flex items-center px-6 [.border-t]:pt-6", className),
+      className: cn(
+        "flex items-center",
+        "px-[var(--j3m-spacing-l)] py-[var(--j3m-spacing-m)]",
+        "border-t border-[inherit]",
+        className
+      ),
       ...props
     }
-  );
-}
+  )
+);
+CardFooter.displayName = "CardFooter";
 function Table({ className, ...props }) {
   return /* @__PURE__ */ jsx(
     "div",
@@ -1711,8 +1857,8 @@ function CalendarDayButton({
   ...props
 }) {
   const defaultClassNames = getDefaultClassNames();
-  const ref = React7.useRef(null);
-  React7.useEffect(() => {
+  const ref = React10.useRef(null);
+  React10.useEffect(() => {
     if (modifiers.focused) ref.current?.focus();
   }, [modifiers.focused]);
   return /* @__PURE__ */ jsx(
@@ -1735,9 +1881,9 @@ function CalendarDayButton({
     }
   );
 }
-var CarouselContext = React7.createContext(null);
+var CarouselContext = React10.createContext(null);
 function useCarousel() {
-  const context = React7.useContext(CarouselContext);
+  const context = React10.useContext(CarouselContext);
   if (!context) {
     throw new Error("useCarousel must be used within a <Carousel />");
   }
@@ -1759,20 +1905,20 @@ function Carousel({
     },
     plugins
   );
-  const [canScrollPrev, setCanScrollPrev] = React7.useState(false);
-  const [canScrollNext, setCanScrollNext] = React7.useState(false);
-  const onSelect = React7.useCallback((api2) => {
+  const [canScrollPrev, setCanScrollPrev] = React10.useState(false);
+  const [canScrollNext, setCanScrollNext] = React10.useState(false);
+  const onSelect = React10.useCallback((api2) => {
     if (!api2) return;
     setCanScrollPrev(api2.canScrollPrev());
     setCanScrollNext(api2.canScrollNext());
   }, []);
-  const scrollPrev = React7.useCallback(() => {
+  const scrollPrev = React10.useCallback(() => {
     api?.scrollPrev();
   }, [api]);
-  const scrollNext = React7.useCallback(() => {
+  const scrollNext = React10.useCallback(() => {
     api?.scrollNext();
   }, [api]);
-  const handleKeyDown = React7.useCallback(
+  const handleKeyDown = React10.useCallback(
     (event) => {
       if (event.key === "ArrowLeft") {
         event.preventDefault();
@@ -1784,11 +1930,11 @@ function Carousel({
     },
     [scrollPrev, scrollNext]
   );
-  React7.useEffect(() => {
+  React10.useEffect(() => {
     if (!api || !setApi) return;
     setApi(api);
   }, [api, setApi]);
-  React7.useEffect(() => {
+  React10.useEffect(() => {
     if (!api) return;
     onSelect(api);
     api.on("reInit", onSelect);
@@ -1921,9 +2067,9 @@ function CarouselNext({
   );
 }
 var THEMES = { light: "", dark: ".dark" };
-var ChartContext = React7.createContext(null);
+var ChartContext = React10.createContext(null);
 function useChart() {
-  const context = React7.useContext(ChartContext);
+  const context = React10.useContext(ChartContext);
   if (!context) {
     throw new Error("useChart must be used within a <ChartContainer />");
   }
@@ -1936,7 +2082,7 @@ function ChartContainer({
   config,
   ...props
 }) {
-  const uniqueId = React7.useId();
+  const uniqueId = React10.useId();
   const chartId = `chart-${id || uniqueId.replace(/:/g, "")}`;
   return /* @__PURE__ */ jsx(ChartContext.Provider, { value: { config }, children: /* @__PURE__ */ jsxs(
     "div",
@@ -1997,7 +2143,7 @@ function ChartTooltipContent({
   labelKey
 }) {
   const { config } = useChart();
-  const tooltipLabel = React7.useMemo(() => {
+  const tooltipLabel = React10.useMemo(() => {
     if (hideLabel || !payload?.length) {
       return null;
     }
@@ -2720,16 +2866,16 @@ var M = (e, i, s, u, m, a, l, h) => {
   } catch (n) {
   }
 };
-var x = React7.createContext(void 0);
+var x = React10.createContext(void 0);
 var U = { setTheme: (e) => {
 }, themes: [] };
 var z = () => {
   var e;
-  return (e = React7.useContext(x)) != null ? e : U;
+  return (e = React10.useContext(x)) != null ? e : U;
 };
-React7.memo(({ forcedTheme: e, storageKey: i, attribute: s, enableSystem: u, enableColorScheme: m, defaultTheme: a, value: l, themes: h, nonce: d, scriptProps: w }) => {
+React10.memo(({ forcedTheme: e, storageKey: i, attribute: s, enableSystem: u, enableColorScheme: m, defaultTheme: a, value: l, themes: h, nonce: d, scriptProps: w }) => {
   let p = JSON.stringify([s, i, a, e, h, l, u, m]).slice(1, -1);
-  return React7.createElement("script", { ...w, suppressHydrationWarning: true, nonce: typeof window == "undefined" ? d : "", dangerouslySetInnerHTML: { __html: `(${M.toString()})(${p})` } });
+  return React10.createElement("script", { ...w, suppressHydrationWarning: true, nonce: typeof window == "undefined" ? d : "", dangerouslySetInnerHTML: { __html: `(${M.toString()})(${p})` } });
 });
 var Toaster = ({ ...props }) => {
   const { theme = "system" } = z();
@@ -2961,126 +3107,153 @@ function PaginationEllipsis({
     }
   );
 }
-function Dialog({
-  ...props
-}) {
-  return /* @__PURE__ */ jsx(DialogPrimitive.Root, { "data-slot": "dialog", ...props });
-}
-function DialogTrigger({
-  ...props
-}) {
-  return /* @__PURE__ */ jsx(DialogPrimitive.Trigger, { "data-slot": "dialog-trigger", ...props });
-}
-function DialogPortal({
-  ...props
-}) {
-  return /* @__PURE__ */ jsx(DialogPrimitive.Portal, { "data-slot": "dialog-portal", ...props });
-}
-function DialogClose({
-  ...props
-}) {
-  return /* @__PURE__ */ jsx(DialogPrimitive.Close, { "data-slot": "dialog-close", ...props });
-}
-function DialogOverlay({
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ jsx(
-    DialogPrimitive.Overlay,
-    {
-      "data-slot": "dialog-overlay",
-      className: cn(
-        "data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/50",
-        className
-      ),
-      ...props
-    }
-  );
-}
-function DialogContent({
-  className,
-  children,
-  showCloseButton = true,
-  ...props
-}) {
-  return /* @__PURE__ */ jsxs(DialogPortal, { "data-slot": "dialog-portal", children: [
-    /* @__PURE__ */ jsx(DialogOverlay, {}),
-    /* @__PURE__ */ jsxs(
-      DialogPrimitive.Content,
-      {
-        "data-slot": "dialog-content",
-        className: cn(
-          "bg-background data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 fixed top-[50%] left-[50%] z-50 grid w-full max-w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%] gap-4 rounded-lg border p-6 shadow-lg duration-200 sm:max-w-lg",
-          className
-        ),
-        ...props,
-        children: [
-          children,
-          showCloseButton && /* @__PURE__ */ jsxs(
-            DialogPrimitive.Close,
-            {
-              "data-slot": "dialog-close",
-              className: "ring-offset-background focus:ring-ring data-[state=open]:bg-accent data-[state=open]:text-muted-foreground absolute top-4 right-4 rounded-xs opacity-70 transition-opacity hover:opacity-100 focus:ring-2 focus:ring-offset-2 focus:outline-hidden disabled:pointer-events-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
-              children: [
-                /* @__PURE__ */ jsx(XIcon, {}),
-                /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Close" })
-              ]
-            }
-          )
-        ]
-      }
-    )
-  ] });
-}
-function DialogHeader({ className, ...props }) {
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      "data-slot": "dialog-header",
-      className: cn("flex flex-col gap-2 text-center sm:text-left", className),
-      ...props
-    }
-  );
-}
-function DialogFooter({ className, ...props }) {
-  return /* @__PURE__ */ jsx(
-    "div",
+var Dialog = DialogPrimitive.Root;
+var DialogTrigger = DialogPrimitive.Trigger;
+var DialogPortal = DialogPrimitive.Portal;
+var DialogClose = DialogPrimitive.Close;
+var DialogOverlay = React10.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  DialogPrimitive.Overlay,
+  {
+    ref,
+    className: cn(
+      "fixed inset-0 z-50",
+      "bg-[var(--j3m-neutral-1000)]/50",
+      "backdrop-blur-sm",
+      // Animations
+      "data-[state=open]:animate-in",
+      "data-[state=closed]:animate-out",
+      "data-[state=closed]:fade-out-0",
+      "data-[state=open]:fade-in-0",
+      className
+    ),
+    ...props
+  }
+));
+DialogOverlay.displayName = DialogPrimitive.Overlay.displayName;
+var DialogContent = React10.forwardRef(({ className, children, showCloseButton = true, ...props }, ref) => /* @__PURE__ */ jsxs(DialogPortal, { children: [
+  /* @__PURE__ */ jsx(DialogOverlay, {}),
+  /* @__PURE__ */ jsxs(
+    DialogPrimitive.Content,
     {
-      "data-slot": "dialog-footer",
+      ref,
       className: cn(
-        "flex flex-col-reverse gap-2 sm:flex-row sm:justify-end",
+        // Positioning
+        "fixed left-[50%] top-[50%] z-50",
+        "translate-x-[-50%] translate-y-[-50%]",
+        "w-full max-w-lg",
+        "max-h-[90vh] overflow-y-auto",
+        // Card-like styling
+        "rounded-[var(--j3m-radius-2xs)]",
+        "border border-[var(--color-border-subtle)]",
+        "bg-[var(--color-bg-surface)]",
+        "shadow-lg",
+        // Padding
+        "p-[var(--j3m-spacing-l)]",
+        // Animations
+        "duration-200",
+        "data-[state=open]:animate-in",
+        "data-[state=closed]:animate-out",
+        "data-[state=closed]:fade-out-0",
+        "data-[state=open]:fade-in-0",
+        "data-[state=closed]:zoom-out-95",
+        "data-[state=open]:zoom-in-95",
+        "data-[state=closed]:slide-out-to-left-1/2",
+        "data-[state=closed]:slide-out-to-top-[48%]",
+        "data-[state=open]:slide-in-from-left-1/2",
+        "data-[state=open]:slide-in-from-top-[48%]",
         className
       ),
-      ...props
+      ...props,
+      children: [
+        children,
+        showCloseButton && /* @__PURE__ */ jsxs(
+          DialogPrimitive.Close,
+          {
+            className: cn(
+              "absolute right-[var(--j3m-spacing-m)] top-[var(--j3m-spacing-m)]",
+              "rounded-[var(--j3m-radius-2xs)]",
+              "p-1",
+              "text-[var(--color-text-muted)]",
+              "opacity-70",
+              "ring-offset-background",
+              "transition-opacity",
+              "hover:opacity-100",
+              "hover:bg-[var(--j3m-neutral-200)]",
+              "focus:outline-none",
+              "focus:ring-2",
+              "focus:ring-[var(--j3m-primary-300)]",
+              "focus:ring-offset-2",
+              "disabled:pointer-events-none"
+            ),
+            children: [
+              /* @__PURE__ */ jsx(X, { className: "h-4 w-4" }),
+              /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Close" })
+            ]
+          }
+        )
+      ]
     }
-  );
-}
-function DialogTitle({
+  )
+] }));
+DialogContent.displayName = DialogPrimitive.Content.displayName;
+var DialogHeader = ({
   className,
   ...props
-}) {
-  return /* @__PURE__ */ jsx(
-    DialogPrimitive.Title,
-    {
-      "data-slot": "dialog-title",
-      className: cn("text-lg leading-none font-semibold", className),
-      ...props
-    }
-  );
-}
-function DialogDescription({
+}) => /* @__PURE__ */ jsx(
+  "div",
+  {
+    className: cn(
+      "flex flex-col gap-[var(--j3m-spacing-2xs)]",
+      "mb-[var(--j3m-spacing-m)]",
+      "text-center sm:text-left",
+      className
+    ),
+    ...props
+  }
+);
+DialogHeader.displayName = "DialogHeader";
+var DialogFooter = ({
   className,
   ...props
-}) {
-  return /* @__PURE__ */ jsx(
-    DialogPrimitive.Description,
-    {
-      "data-slot": "dialog-description",
-      className: cn("text-muted-foreground text-sm", className),
-      ...props
-    }
-  );
-}
+}) => /* @__PURE__ */ jsx(
+  "div",
+  {
+    className: cn(
+      "flex flex-col-reverse sm:flex-row sm:justify-end",
+      "gap-[var(--j3m-spacing-s)]",
+      "mt-[var(--j3m-spacing-l)]",
+      className
+    ),
+    ...props
+  }
+);
+DialogFooter.displayName = "DialogFooter";
+var DialogTitle = React10.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  DialogPrimitive.Title,
+  {
+    ref,
+    className: cn(
+      "text-lg font-semibold leading-none tracking-tight",
+      "text-[var(--color-text-main)]",
+      className
+    ),
+    ...props
+  }
+));
+DialogTitle.displayName = DialogPrimitive.Title.displayName;
+var DialogDescription = React10.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  DialogPrimitive.Description,
+  {
+    ref,
+    className: cn(
+      "text-sm",
+      "text-[var(--color-text-muted)]",
+      className
+    ),
+    ...props
+  }
+));
+DialogDescription.displayName = DialogPrimitive.Description.displayName;
 function Command({
   className,
   ...props
@@ -4445,9 +4618,9 @@ var SIDEBAR_WIDTH = "16rem";
 var SIDEBAR_WIDTH_MOBILE = "18rem";
 var SIDEBAR_WIDTH_ICON = "3rem";
 var SIDEBAR_KEYBOARD_SHORTCUT = "b";
-var SidebarContext = React7.createContext(null);
+var SidebarContext = React10.createContext(null);
 function useSidebar() {
-  const context = React7.useContext(SidebarContext);
+  const context = React10.useContext(SidebarContext);
   if (!context) {
     throw new Error("useSidebar must be used within a SidebarProvider.");
   }
@@ -4463,10 +4636,10 @@ function SidebarProvider({
   ...props
 }) {
   const isMobile = useIsMobile();
-  const [openMobile, setOpenMobile] = React7.useState(false);
-  const [_open, _setOpen] = React7.useState(defaultOpen);
+  const [openMobile, setOpenMobile] = React10.useState(false);
+  const [_open, _setOpen] = React10.useState(defaultOpen);
   const open = openProp ?? _open;
-  const setOpen = React7.useCallback(
+  const setOpen = React10.useCallback(
     (value) => {
       const openState = typeof value === "function" ? value(open) : value;
       if (setOpenProp) {
@@ -4478,10 +4651,10 @@ function SidebarProvider({
     },
     [setOpenProp, open]
   );
-  const toggleSidebar = React7.useCallback(() => {
+  const toggleSidebar = React10.useCallback(() => {
     return isMobile ? setOpenMobile((open2) => !open2) : setOpen((open2) => !open2);
   }, [isMobile, setOpen, setOpenMobile]);
-  React7.useEffect(() => {
+  React10.useEffect(() => {
     const handleKeyDown = (event) => {
       if (event.key === SIDEBAR_KEYBOARD_SHORTCUT && (event.metaKey || event.ctrlKey)) {
         event.preventDefault();
@@ -4492,7 +4665,7 @@ function SidebarProvider({
     return () => window.removeEventListener("keydown", handleKeyDown);
   }, [toggleSidebar]);
   const state = open ? "expanded" : "collapsed";
-  const contextValue = React7.useMemo(
+  const contextValue = React10.useMemo(
     () => ({
       state,
       open,
@@ -4950,7 +5123,7 @@ function SidebarMenuSkeleton({
   showIcon = false,
   ...props
 }) {
-  const width = React7.useMemo(() => {
+  const width = React10.useMemo(() => {
     return `${Math.floor(Math.random() * 40) + 50}%`;
   }, []);
   return /* @__PURE__ */ jsxs(
@@ -5038,7 +5211,147 @@ function SidebarMenuSubButton({
     }
   );
 }
+var sectionVariants = cva(
+  // Base styles - larger padding than Card for section grouping
+  "flex flex-col rounded-[var(--j3m-radius-l)]",
+  {
+    variants: {
+      variant: {
+        // Default solid section
+        default: [
+          "bg-[var(--color-bg-surface)]",
+          "border border-[var(--color-border-subtle)]",
+          "text-[var(--color-text-main)]",
+          "shadow-sm"
+        ].join(" "),
+        // Glass Light - for dark or image backgrounds
+        "glass-light": [
+          "glass-context",
+          // Enables glass semantic token overrides
+          "bg-[var(--j3m-glass-light-20)]",
+          "backdrop-blur-[var(--j3m-blur-2xl)]",
+          "border border-[var(--j3m-glass-border-light)]",
+          "text-[var(--color-text-main)]",
+          "shadow-[var(--j3m-glass-shadow-md)]"
+        ].join(" "),
+        // Glass Dark - dark frosted glass
+        "glass-dark": [
+          "bg-[var(--j3m-glass-dark)]",
+          "backdrop-blur-[var(--j3m-blur-md)]",
+          "border border-[var(--j3m-glass-border-dark)]",
+          "text-white",
+          "shadow-[var(--j3m-glass-shadow-lg)]"
+        ].join(" "),
+        // Glass Neutral - subtle frosted effect (most common)
+        "glass-neutral": [
+          "bg-[var(--j3m-glass-neutral)]",
+          "backdrop-blur-[var(--j3m-blur-lg)]",
+          "border border-[var(--j3m-glass-border-subtle)]",
+          "text-[var(--color-text-main)]",
+          "shadow-[var(--j3m-glass-shadow-sm)]"
+        ].join(" "),
+        // Glass Primary - with orange tint
+        "glass-primary": [
+          "bg-[var(--j3m-glass-primary)]",
+          "backdrop-blur-[var(--j3m-blur-lg)]",
+          "border border-[var(--j3m-glass-border-light)]",
+          "text-[var(--color-text-main)]",
+          "shadow-[var(--j3m-glass-shadow-glow)]"
+        ].join(" ")
+      }
+    },
+    defaultVariants: {
+      variant: "default"
+    }
+  }
+);
+var isGlassVariant = (variant) => variant?.startsWith("glass-") ?? false;
+var Section = React10.forwardRef(
+  ({ className, variant, ...props }, ref) => /* @__PURE__ */ jsx(
+    "section",
+    {
+      ref,
+      className: cn(sectionVariants({ variant, className })),
+      "data-glass-context": isGlassVariant(variant) ? "true" : void 0,
+      ...props
+    }
+  )
+);
+Section.displayName = "Section";
+var SectionHeader = React10.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+    "div",
+    {
+      ref,
+      className: cn(
+        "flex flex-col gap-[var(--j3m-spacing-xs)]",
+        "px-[var(--j3m-spacing-xl)] pt-[var(--j3m-spacing-xl)] pb-[var(--j3m-spacing-m)]",
+        className
+      ),
+      ...props
+    }
+  )
+);
+SectionHeader.displayName = "SectionHeader";
+var SectionTitle = React10.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+    "h2",
+    {
+      ref,
+      className: cn(
+        "text-xl font-semibold leading-none tracking-tight",
+        className
+      ),
+      ...props
+    }
+  )
+);
+SectionTitle.displayName = "SectionTitle";
+var SectionDescription = React10.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+    "p",
+    {
+      ref,
+      className: cn(
+        "text-sm opacity-70",
+        className
+      ),
+      ...props
+    }
+  )
+);
+SectionDescription.displayName = "SectionDescription";
+var SectionContent = React10.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+    "div",
+    {
+      ref,
+      className: cn(
+        "px-[var(--j3m-spacing-xl)] py-[var(--j3m-spacing-l)]",
+        className
+      ),
+      ...props
+    }
+  )
+);
+SectionContent.displayName = "SectionContent";
+var SectionFooter = React10.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+    "div",
+    {
+      ref,
+      className: cn(
+        "flex items-center",
+        "px-[var(--j3m-spacing-xl)] py-[var(--j3m-spacing-l)]",
+        "border-t border-[inherit]",
+        className
+      ),
+      ...props
+    }
+  )
+);
+SectionFooter.displayName = "SectionFooter";
 
-export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, Alert, AlertDescription, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, AlertTitle, AspectRatio, Avatar, AvatarFallback, AvatarImage, Badge, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, Button, ButtonGroup, ButtonGroupSeparator, ButtonGroupText, Calendar, CalendarDayButton, Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Carousel, CarouselContent, CarouselItem, CarouselNext, CarouselPrevious, ChartContainer, ChartLegend, ChartLegendContent, ChartStyle, ChartTooltip, ChartTooltipContent, Checkbox, Collapsible, CollapsibleContent2 as CollapsibleContent, CollapsibleTrigger2 as CollapsibleTrigger, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut, ContextMenu, ContextMenuCheckboxItem, ContextMenuContent, ContextMenuGroup, ContextMenuItem, ContextMenuLabel, ContextMenuPortal, ContextMenuRadioGroup, ContextMenuRadioItem, ContextMenuSeparator, ContextMenuShortcut, ContextMenuSub, ContextMenuSubContent, ContextMenuSubTrigger, ContextMenuTrigger, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerOverlay, DrawerPortal, DrawerTitle, DrawerTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, Empty, EmptyContent, EmptyDescription, EmptyHeader, EmptyMedia, EmptyTitle, Field, FieldContent, FieldDescription, FieldError, FieldGroup, FieldLabel, FieldLegend, FieldSeparator, FieldSet, FieldTitle, Form, FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage, HoverCard, HoverCardContent, HoverCardTrigger, Input, InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, InputGroupText, InputGroupTextarea, InputOTP, InputOTPGroup, InputOTPSeparator, InputOTPSlot, Item5 as Item, ItemActions, ItemContent, ItemDescription, ItemFooter, ItemGroup, ItemHeader, ItemMedia, ItemSeparator, ItemTitle, Kbd, KbdGroup, Label2 as Label, Menubar, MenubarCheckboxItem, MenubarContent, MenubarGroup, MenubarItem, MenubarLabel, MenubarMenu, MenubarPortal, MenubarRadioGroup, MenubarRadioItem, MenubarSeparator, MenubarShortcut, MenubarSub, MenubarSubContent, MenubarSubTrigger, MenubarTrigger, NativeSelect, NativeSelectOptGroup, NativeSelectOption, NavigationMenu, NavigationMenuContent, NavigationMenuIndicator, NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuTrigger, NavigationMenuViewport, Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, Progress, RadioGroup, RadioGroupItem, ResizableHandle, ResizablePanel, ResizablePanelGroup, ScrollArea, ScrollBar, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger, Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupAction, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarInput, SidebarInset, SidebarMenu, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuItem, SidebarMenuSkeleton, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarProvider, SidebarRail, SidebarSeparator, SidebarTrigger, Skeleton, Slider, Spinner, Switch, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, Toaster, Toggle, ToggleGroup, ToggleGroupItem, Tooltip2 as Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, badgeVariants, buttonGroupVariants, buttonVariants, navigationMenuTriggerStyle, toggleVariants, useFormField, useIsMobile, useSidebar };
+export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, Alert, AlertDescription, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, AlertTitle, AspectRatio, Avatar, AvatarFallback, AvatarImage, Badge, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, Button, ButtonGroup, ButtonGroupSeparator, ButtonGroupText, Calendar, CalendarDayButton, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Carousel, CarouselContent, CarouselItem, CarouselNext, CarouselPrevious, ChartContainer, ChartLegend, ChartLegendContent, ChartStyle, ChartTooltip, ChartTooltipContent, Checkbox, Collapsible, CollapsibleContent2 as CollapsibleContent, CollapsibleTrigger2 as CollapsibleTrigger, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut, ContextMenu, ContextMenuCheckboxItem, ContextMenuContent, ContextMenuGroup, ContextMenuItem, ContextMenuLabel, ContextMenuPortal, ContextMenuRadioGroup, ContextMenuRadioItem, ContextMenuSeparator, ContextMenuShortcut, ContextMenuSub, ContextMenuSubContent, ContextMenuSubTrigger, ContextMenuTrigger, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerOverlay, DrawerPortal, DrawerTitle, DrawerTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, Empty, EmptyContent, EmptyDescription, EmptyHeader, EmptyMedia, EmptyTitle, Field, FieldContent, FieldDescription, FieldError, FieldGroup, FieldLabel, FieldLegend, FieldSeparator, FieldSet, FieldTitle, Form, FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage, HoverCard, HoverCardContent, HoverCardTrigger, Input, InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, InputGroupText, InputGroupTextarea, InputOTP, InputOTPGroup, InputOTPSeparator, InputOTPSlot, Item5 as Item, ItemActions, ItemContent, ItemDescription, ItemFooter, ItemGroup, ItemHeader, ItemMedia, ItemSeparator, ItemTitle, Kbd, KbdGroup, Label2 as Label, Menubar, MenubarCheckboxItem, MenubarContent, MenubarGroup, MenubarItem, MenubarLabel, MenubarMenu, MenubarPortal, MenubarRadioGroup, MenubarRadioItem, MenubarSeparator, MenubarShortcut, MenubarSub, MenubarSubContent, MenubarSubTrigger, MenubarTrigger, NativeSelect, NativeSelectOptGroup, NativeSelectOption, NavigationMenu, NavigationMenuContent, NavigationMenuIndicator, NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuTrigger, NavigationMenuViewport, Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, Progress, RadioGroup, RadioGroupItem, ResizableHandle, ResizablePanel, ResizablePanelGroup, ScrollArea, ScrollBar, Section, SectionContent, SectionDescription, SectionFooter, SectionHeader, SectionTitle, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger, Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupAction, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarInput, SidebarInset, SidebarMenu, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuItem, SidebarMenuSkeleton, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarProvider, SidebarRail, SidebarSeparator, SidebarTrigger, Skeleton, Slider, Spinner, Switch, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, Toaster, Toggle, ToggleGroup, ToggleGroupItem, Tooltip2 as Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, badgeVariants, buttonGroupVariants, buttonVariants, cardVariants, navigationMenuTriggerStyle, sectionVariants, toggleVariants, useFormField, useIsMobile, useSidebar };
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map