@hai3/uikit 0.1.0-alpha.0

package/dist/index.js

@@ -0,0 +1,1664 @@
+'use strict';
+
+var React16 = require('react');
+var AvatarPrimitive = require('@radix-ui/react-avatar');
+var clsx = require('clsx');
+var tailwindMerge = require('tailwind-merge');
+var jsxRuntime = require('react/jsx-runtime');
+var reactSlot = require('@radix-ui/react-slot');
+var classVarianceAuthority = require('class-variance-authority');
+var uikitContracts = require('@hai3/uikit-contracts');
+var SwitchPrimitives = require('@radix-ui/react-switch');
+var lucideReact = require('lucide-react');
+var lodash = require('lodash');
+var SliderPrimitive = require('@radix-ui/react-slider');
+var ProgressPrimitive = require('@radix-ui/react-progress');
+var TooltipPrimitive = require('@radix-ui/react-tooltip');
+var NavigationMenuPrimitive = require('@radix-ui/react-navigation-menu');
+var SheetPrimitive = require('@radix-ui/react-dialog');
+var SelectPrimitive = require('@radix-ui/react-select');
+var DropdownMenuPrimitive = require('@radix-ui/react-dropdown-menu');
+
+function _interopNamespace(e) {
+  if (e && e.__esModule) return e;
+  var n = Object.create(null);
+  if (e) {
+    Object.keys(e).forEach(function (k) {
+      if (k !== 'default') {
+        var d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: function () { return e[k]; }
+        });
+      }
+    });
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+
+var React16__namespace = /*#__PURE__*/_interopNamespace(React16);
+var AvatarPrimitive__namespace = /*#__PURE__*/_interopNamespace(AvatarPrimitive);
+var SwitchPrimitives__namespace = /*#__PURE__*/_interopNamespace(SwitchPrimitives);
+var SliderPrimitive__namespace = /*#__PURE__*/_interopNamespace(SliderPrimitive);
+var ProgressPrimitive__namespace = /*#__PURE__*/_interopNamespace(ProgressPrimitive);
+var TooltipPrimitive__namespace = /*#__PURE__*/_interopNamespace(TooltipPrimitive);
+var NavigationMenuPrimitive__namespace = /*#__PURE__*/_interopNamespace(NavigationMenuPrimitive);
+var SheetPrimitive__namespace = /*#__PURE__*/_interopNamespace(SheetPrimitive);
+var SelectPrimitive__namespace = /*#__PURE__*/_interopNamespace(SelectPrimitive);
+var DropdownMenuPrimitive__namespace = /*#__PURE__*/_interopNamespace(DropdownMenuPrimitive);
+
+// src/base/avatar.tsx
+function cn(...inputs) {
+  return tailwindMerge.twMerge(clsx.clsx(inputs));
+}
+var Avatar = React16__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+  AvatarPrimitive__namespace.Root,
+  {
+    ref,
+    className: cn(
+      "relative flex h-10 w-10 shrink-0 overflow-hidden rounded-full",
+      className
+    ),
+    ...props
+  }
+));
+Avatar.displayName = AvatarPrimitive__namespace.Root.displayName;
+var AvatarImage = React16__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+  AvatarPrimitive__namespace.Image,
+  {
+    ref,
+    className: cn("aspect-square h-full w-full", className),
+    ...props
+  }
+));
+AvatarImage.displayName = AvatarPrimitive__namespace.Image.displayName;
+var AvatarFallback = React16__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+  AvatarPrimitive__namespace.Fallback,
+  {
+    ref,
+    className: cn(
+      "flex h-full w-full items-center justify-center rounded-full bg-muted",
+      className
+    ),
+    ...props
+  }
+));
+AvatarFallback.displayName = AvatarPrimitive__namespace.Fallback.displayName;
+var buttonVariants = classVarianceAuthority.cva(
+  "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0",
+  {
+    variants: {
+      variant: {
+        [uikitContracts.ButtonVariant.Default]: "bg-primary text-primary-foreground shadow hover:bg-primary/90",
+        [uikitContracts.ButtonVariant.Destructive]: "bg-destructive text-destructive-foreground shadow-sm hover:bg-destructive/90",
+        [uikitContracts.ButtonVariant.Outline]: "border border-input bg-background shadow-sm hover:bg-accent data-[state=open]:bg-accent",
+        [uikitContracts.ButtonVariant.Secondary]: "bg-secondary text-secondary-foreground shadow-sm hover:bg-secondary/80",
+        [uikitContracts.ButtonVariant.Ghost]: "hover:bg-accent data-[state=open]:bg-accent",
+        [uikitContracts.ButtonVariant.Link]: "text-primary underline-offset-4 hover:underline"
+      },
+      size: {
+        [uikitContracts.ButtonSize.Default]: "h-9 px-4 py-2",
+        [uikitContracts.ButtonSize.Sm]: "h-8 rounded-md px-3 text-xs",
+        [uikitContracts.ButtonSize.Lg]: "h-10 rounded-md px-8",
+        [uikitContracts.ButtonSize.Icon]: "h-9 w-9"
+      }
+    },
+    defaultVariants: {
+      variant: uikitContracts.ButtonVariant.Default,
+      size: uikitContracts.ButtonSize.Default
+    }
+  }
+);
+var Button = React16__namespace.forwardRef(
+  ({ className, variant, size, asChild = false, ...props }, ref) => {
+    const Comp = asChild ? reactSlot.Slot : "button";
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      Comp,
+      {
+        className: cn(buttonVariants({ variant, size, className })),
+        ref,
+        ...props
+      }
+    );
+  }
+);
+Button.displayName = "Button";
+var badgeVariants = classVarianceAuthority.cva(
+  "inline-flex items-center justify-center rounded-full border px-2 py-0.5 text-xs font-medium w-fit whitespace-nowrap shrink-0 [&>svg]:size-3 gap-1 [&>svg]:pointer-events-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 transition-[color,box-shadow] overflow-hidden",
+  {
+    variants: {
+      variant: {
+        default: "border-transparent bg-primary text-primary-foreground [a&]:hover:bg-primary/90",
+        secondary: "border-transparent bg-secondary text-secondary-foreground [a&]:hover:bg-secondary/90",
+        destructive: "border-transparent bg-destructive text-white [a&]:hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60",
+        outline: "text-foreground [a&]:hover:bg-accent [a&]:hover:text-accent-foreground"
+      }
+    },
+    defaultVariants: {
+      variant: "default"
+    }
+  }
+);
+function Badge({
+  className,
+  variant,
+  asChild = false,
+  ...props
+}) {
+  const Comp = asChild ? reactSlot.Slot : "span";
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    Comp,
+    {
+      className: cn(badgeVariants({ variant }), className),
+      ...props
+    }
+  );
+}
+var Input = React16__namespace.forwardRef(
+  ({ className, type, ...props }, ref) => {
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      "input",
+      {
+        type,
+        className: cn(
+          "flex h-9 w-full rounded-md border border-input bg-transparent px-3 py-1 text-base shadow-sm transition-colors file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
+          className
+        ),
+        ref,
+        ...props
+      }
+    );
+  }
+);
+Input.displayName = "Input";
+var Textarea = React16__namespace.forwardRef(
+  ({ className, autoResize = false, minHeight = 50, maxHeight = 350, size = "default", onChange, ...props }, ref) => {
+    const internalRef = React16__namespace.useRef(null);
+    React16__namespace.useImperativeHandle(ref, () => internalRef.current);
+    const sizeClasses = {
+      sm: "min-h-11 h-11",
+      // 44px / 2.75rem - exact height
+      default: "min-h-[60px]",
+      // 60px / 3.75rem
+      lg: "min-h-20"
+      // 80px / 5rem
+    };
+    const paddingClasses = {
+      sm: "py-3",
+      // 12px top + 12px bottom + 20px line-height = 44px
+      default: "py-2",
+      // 8px top + 8px bottom (default)
+      lg: "py-2"
+      // 8px top + 8px bottom (default)
+    };
+    const handleResize = React16__namespace.useCallback(() => {
+      if (autoResize && size !== "sm" && internalRef.current) {
+        const textarea = internalRef.current;
+        textarea.style.height = "auto";
+        const scrollHeight = textarea.scrollHeight;
+        textarea.style.height = `${Math.min(Math.max(scrollHeight, minHeight), maxHeight)}px`;
+      }
+    }, [autoResize, size, minHeight, maxHeight]);
+    React16__namespace.useEffect(() => {
+      handleResize();
+    }, [handleResize, props.value]);
+    const handleChange = React16__namespace.useCallback(
+      (e) => {
+        handleResize();
+        onChange?.(e);
+      },
+      [onChange, handleResize]
+    );
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      "textarea",
+      {
+        className: cn(
+          "flex w-full rounded-md border border-input bg-transparent px-3 text-base shadow-sm placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
+          sizeClasses[size],
+          paddingClasses[size],
+          className
+        ),
+        ref: internalRef,
+        onChange: handleChange,
+        ...props
+      }
+    );
+  }
+);
+Textarea.displayName = "Textarea";
+var Switch = React16__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+  SwitchPrimitives__namespace.Root,
+  {
+    className: cn(
+      "peer inline-flex h-5 w-9 shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent shadow-sm transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-primary data-[state=unchecked]:bg-input",
+      className
+    ),
+    ...props,
+    ref,
+    children: /* @__PURE__ */ jsxRuntime.jsx(
+      SwitchPrimitives__namespace.Thumb,
+      {
+        className: cn(
+          "pointer-events-none block h-4 w-4 rounded-full bg-background shadow-lg ring-0 transition-transform",
+          "data-[state=checked]:ltr:translate-x-4 data-[state=checked]:rtl:-translate-x-4",
+          "data-[state=unchecked]:translate-x-0"
+        )
+      }
+    )
+  }
+));
+Switch.displayName = SwitchPrimitives__namespace.Root.displayName;
+function Skeleton({
+  className,
+  inheritColor = false,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      className: cn(
+        "animate-pulse rounded-md",
+        inheritColor ? "bg-current opacity-20" : "bg-muted",
+        className
+      ),
+      ...props
+    }
+  );
+}
+var Spinner = React16__namespace.forwardRef(
+  ({ className, icon: Icon2 = lucideReact.Loader2, size = "size-4", ...props }, ref) => {
+    const textColorClasses = className?.match(/\btext-\S+/g)?.join(" ") || "";
+    const wrapperClasses = lodash.trim(className?.replace(/\btext-\S+/g, "") || "");
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      "div",
+      {
+        ref,
+        className: cn("inline-flex items-center justify-center", wrapperClasses),
+        ...props,
+        children: /* @__PURE__ */ jsxRuntime.jsx(Icon2, { className: cn("animate-spin", size, textColorClasses) })
+      }
+    );
+  }
+);
+Spinner.displayName = "Spinner";
+var Slider = React16__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+  SliderPrimitive__namespace.Root,
+  {
+    ref,
+    className: cn(
+      "relative flex w-full touch-none select-none items-center",
+      className
+    ),
+    ...props
+  }
+));
+Slider.displayName = SliderPrimitive__namespace.Root.displayName;
+var SliderTrack = React16__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+  SliderPrimitive__namespace.Track,
+  {
+    ref,
+    className: cn(
+      "relative h-1.5 w-full grow overflow-hidden rounded-full bg-primary/20",
+      className
+    ),
+    ...props
+  }
+));
+SliderTrack.displayName = SliderPrimitive__namespace.Track.displayName;
+var SliderRange = React16__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+  SliderPrimitive__namespace.Range,
+  {
+    ref,
+    className: cn("absolute h-full bg-primary", className),
+    ...props
+  }
+));
+SliderRange.displayName = SliderPrimitive__namespace.Range.displayName;
+var SliderThumb = React16__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+  SliderPrimitive__namespace.Thumb,
+  {
+    ref,
+    className: cn(
+      "block h-4 w-4 rounded-full border border-primary/50 bg-background shadow transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50",
+      className
+    ),
+    ...props
+  }
+));
+SliderThumb.displayName = SliderPrimitive__namespace.Thumb.displayName;
+var Progress = React16__namespace.forwardRef(({ className, value, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+  ProgressPrimitive__namespace.Root,
+  {
+    ref,
+    className: cn(
+      "relative h-2 w-full overflow-hidden rounded-full bg-primary/20",
+      className
+    ),
+    ...props,
+    children: /* @__PURE__ */ jsxRuntime.jsx(
+      ProgressPrimitive__namespace.Indicator,
+      {
+        className: "h-full w-full flex-1 bg-primary transition-all",
+        style: { transform: `translateX(-${100 - (value || 0)}%)` }
+      }
+    )
+  }
+));
+Progress.displayName = ProgressPrimitive__namespace.Root.displayName;
+var TooltipProvider = ({
+  delayDuration = 0,
+  ...props
+}) => /* @__PURE__ */ jsxRuntime.jsx(
+  TooltipPrimitive__namespace.Provider,
+  {
+    delayDuration,
+    ...props
+  }
+);
+TooltipProvider.displayName = TooltipPrimitive__namespace.Provider.displayName;
+var Tooltip = ({
+  ...props
+}) => /* @__PURE__ */ jsxRuntime.jsx(TooltipProvider, { children: /* @__PURE__ */ jsxRuntime.jsx(TooltipPrimitive__namespace.Root, { ...props }) });
+Tooltip.displayName = TooltipPrimitive__namespace.Root.displayName;
+var TooltipTrigger = React16__namespace.forwardRef(({ ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(TooltipPrimitive__namespace.Trigger, { ref, ...props }));
+TooltipTrigger.displayName = TooltipPrimitive__namespace.Trigger.displayName;
+var TooltipContent = React16__namespace.forwardRef(({ className, sideOffset = 4, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(TooltipPrimitive__namespace.Portal, { children: /* @__PURE__ */ jsxRuntime.jsx(
+  TooltipPrimitive__namespace.Content,
+  {
+    ref,
+    sideOffset,
+    className: cn(
+      "z-50 overflow-hidden rounded-md bg-primary px-3 py-1.5 text-xs text-primary-foreground animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
+      className
+    ),
+    ...props
+  }
+) }));
+TooltipContent.displayName = TooltipPrimitive__namespace.Content.displayName;
+var Card = React16__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+  "div",
+  {
+    ref,
+    className: cn(
+      "rounded-xl border bg-card text-card-foreground shadow",
+      className
+    ),
+    ...props
+  }
+));
+Card.displayName = "Card";
+var CardHeader = React16__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+  "div",
+  {
+    ref,
+    className: cn("flex flex-col space-y-1.5 p-6", className),
+    ...props
+  }
+));
+CardHeader.displayName = "CardHeader";
+var CardTitle = React16__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+  "div",
+  {
+    ref,
+    className: cn("font-semibold leading-none tracking-tight", className),
+    ...props
+  }
+));
+CardTitle.displayName = "CardTitle";
+var CardDescription = React16__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+  "div",
+  {
+    ref,
+    className: cn("text-sm text-muted-foreground", className),
+    ...props
+  }
+));
+CardDescription.displayName = "CardDescription";
+var CardContent = React16__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: cn("p-6 pt-0", className), ...props }));
+CardContent.displayName = "CardContent";
+var CardFooter = React16__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+  "div",
+  {
+    ref,
+    className: cn("flex items-center p-6 pt-0", className),
+    ...props
+  }
+));
+CardFooter.displayName = "CardFooter";
+var Header = React16__namespace.default.forwardRef(
+  ({ children, className }, ref) => {
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      "header",
+      {
+        ref,
+        className: cn(
+          "flex items-center justify-end px-6 py-4 bg-background border-b border-border h-16 w-full",
+          className
+        ),
+        children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center gap-4", children })
+      }
+    );
+  }
+);
+Header.displayName = "Header";
+var NavigationMenu = React16__namespace.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(
+  NavigationMenuPrimitive__namespace.Root,
+  {
+    ref,
+    className: cn(
+      "relative z-10 flex max-w-max flex-1 items-center justify-center",
+      className
+    ),
+    ...props,
+    children: [
+      children,
+      /* @__PURE__ */ jsxRuntime.jsx(NavigationMenuViewport, {})
+    ]
+  }
+));
+NavigationMenu.displayName = NavigationMenuPrimitive__namespace.Root.displayName;
+var NavigationMenuList = React16__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+  NavigationMenuPrimitive__namespace.List,
+  {
+    ref,
+    className: cn(
+      "group flex flex-1 list-none items-center justify-center space-x-1",
+      className
+    ),
+    ...props
+  }
+));
+NavigationMenuList.displayName = NavigationMenuPrimitive__namespace.List.displayName;
+var NavigationMenuItem = NavigationMenuPrimitive__namespace.Item;
+var navigationMenuTriggerStyle = classVarianceAuthority.cva(
+  "group inline-flex h-9 w-max items-center justify-center rounded-md bg-background px-4 py-2 text-sm font-medium transition-colors hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground focus:outline-none disabled:pointer-events-none disabled:opacity-50 data-[state=open]:text-accent-foreground data-[state=open]:bg-accent/50 data-[state=open]:hover:bg-accent data-[state=open]:focus:bg-accent"
+);
+var NavigationMenuTrigger = React16__namespace.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(
+  NavigationMenuPrimitive__namespace.Trigger,
+  {
+    ref,
+    className: cn(navigationMenuTriggerStyle(), "group", className),
+    ...props,
+    children: [
+      children,
+      " ",
+      /* @__PURE__ */ jsxRuntime.jsx(
+        lucideReact.ChevronDown,
+        {
+          className: "relative top-[1px] ml-1 h-3 w-3 transition duration-300 group-data-[state=open]:rotate-180",
+          "aria-hidden": "true"
+        }
+      )
+    ]
+  }
+));
+NavigationMenuTrigger.displayName = NavigationMenuPrimitive__namespace.Trigger.displayName;
+var NavigationMenuContent = React16__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+  NavigationMenuPrimitive__namespace.Content,
+  {
+    ref,
+    className: cn(
+      "left-0 top-0 w-full data-[motion^=from-]:animate-in data-[motion^=to-]:animate-out data-[motion^=from-]:fade-in data-[motion^=to-]:fade-out data-[motion=from-end]:slide-in-from-right-52 data-[motion=from-start]:slide-in-from-left-52 data-[motion=to-end]:slide-out-to-right-52 data-[motion=to-start]:slide-out-to-left-52 md:absolute md:w-auto ",
+      className
+    ),
+    ...props
+  }
+));
+NavigationMenuContent.displayName = NavigationMenuPrimitive__namespace.Content.displayName;
+var NavigationMenuLink = NavigationMenuPrimitive__namespace.Link;
+var NavigationMenuViewport = React16__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("absolute left-0 top-full flex justify-center"), children: /* @__PURE__ */ jsxRuntime.jsx(
+  NavigationMenuPrimitive__namespace.Viewport,
+  {
+    className: cn(
+      "origin-top-center relative mt-1.5 h-[var(--radix-navigation-menu-viewport-height)] w-full overflow-hidden rounded-md border bg-popover text-popover-foreground shadow data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-90 md:w-[var(--radix-navigation-menu-viewport-width)]",
+      className
+    ),
+    ref,
+    ...props
+  }
+) }));
+NavigationMenuViewport.displayName = NavigationMenuPrimitive__namespace.Viewport.displayName;
+var NavigationMenuIndicator = React16__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+  NavigationMenuPrimitive__namespace.Indicator,
+  {
+    ref,
+    className: cn(
+      "top-full z-[1] flex h-1.5 items-end justify-center overflow-hidden data-[state=visible]:animate-in data-[state=hidden]:animate-out data-[state=hidden]:fade-out data-[state=visible]:fade-in",
+      className
+    ),
+    ...props,
+    children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "relative top-[60%] h-2 w-2 rotate-45 rounded-tl-sm bg-border shadow-md" })
+  }
+));
+NavigationMenuIndicator.displayName = NavigationMenuPrimitive__namespace.Indicator.displayName;
+var Sheet = SheetPrimitive__namespace.Root;
+var SheetTrigger = SheetPrimitive__namespace.Trigger;
+var SheetClose = SheetPrimitive__namespace.Close;
+var SheetPortal = SheetPrimitive__namespace.Portal;
+var SheetOverlay = React16__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+  SheetPrimitive__namespace.Overlay,
+  {
+    className: cn(
+      "fixed inset-0 z-50 bg-black/80  data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
+      className
+    ),
+    ...props,
+    ref
+  }
+));
+SheetOverlay.displayName = SheetPrimitive__namespace.Overlay.displayName;
+var sheetVariants = classVarianceAuthority.cva(
+  "fixed z-50 gap-4 bg-background p-6 shadow-lg transition ease-in-out data-[state=closed]:duration-300 data-[state=open]:duration-500 data-[state=open]:animate-in data-[state=closed]:animate-out",
+  {
+    variants: {
+      side: {
+        top: "inset-x-0 top-0 border-b data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top",
+        bottom: "inset-x-0 bottom-0 border-t data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom",
+        left: "inset-y-0 left-0 h-full w-3/4 border-r data-[state=closed]:slide-out-to-left data-[state=open]:slide-in-from-left sm:max-w-sm",
+        right: "inset-y-0 right-0 h-full w-3/4 border-l data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right sm:max-w-sm"
+      }
+    },
+    defaultVariants: {
+      side: "right"
+    }
+  }
+);
+var SheetContent = React16__namespace.forwardRef(({ side = "right", className, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(SheetPortal, { children: [
+  /* @__PURE__ */ jsxRuntime.jsx(SheetOverlay, {}),
+  /* @__PURE__ */ jsxRuntime.jsxs(
+    SheetPrimitive__namespace.Content,
+    {
+      ref,
+      className: cn(sheetVariants({ side }), className),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsxs(SheetPrimitive__namespace.Close, { className: "absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-secondary", children: [
+          /* @__PURE__ */ jsxRuntime.jsx(lucideReact.X, { className: "h-4 w-4" }),
+          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Close" })
+        ] }),
+        children
+      ]
+    }
+  )
+] }));
+SheetContent.displayName = SheetPrimitive__namespace.Content.displayName;
+var SheetHeader = ({
+  className,
+  ...props
+}) => /* @__PURE__ */ jsxRuntime.jsx(
+  "div",
+  {
+    className: cn(
+      "flex flex-col space-y-2 text-center sm:text-left",
+      className
+    ),
+    ...props
+  }
+);
+SheetHeader.displayName = "SheetHeader";
+var SheetFooter = ({
+  className,
+  ...props
+}) => /* @__PURE__ */ jsxRuntime.jsx(
+  "div",
+  {
+    className: cn(
+      "flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2",
+      className
+    ),
+    ...props
+  }
+);
+SheetFooter.displayName = "SheetFooter";
+var SheetTitle = React16__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+  SheetPrimitive__namespace.Title,
+  {
+    ref,
+    className: cn("text-lg font-semibold text-foreground", className),
+    ...props
+  }
+));
+SheetTitle.displayName = SheetPrimitive__namespace.Title.displayName;
+var SheetDescription = React16__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+  SheetPrimitive__namespace.Description,
+  {
+    ref,
+    className: cn("text-sm text-muted-foreground", className),
+    ...props
+  }
+));
+SheetDescription.displayName = SheetPrimitive__namespace.Description.displayName;
+var Dialog = SheetPrimitive__namespace.Root;
+var DialogTrigger = SheetPrimitive__namespace.Trigger;
+var DialogPortal = SheetPrimitive__namespace.Portal;
+var DialogClose = SheetPrimitive__namespace.Close;
+var DialogOverlay = React16__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+  SheetPrimitive__namespace.Overlay,
+  {
+    ref,
+    className: cn(
+      "fixed inset-0 z-50 bg-black/80  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 = SheetPrimitive__namespace.Overlay.displayName;
+var DialogContent = React16__namespace.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(DialogPortal, { children: [
+  /* @__PURE__ */ jsxRuntime.jsx(DialogOverlay, {}),
+  /* @__PURE__ */ jsxRuntime.jsxs(
+    SheetPrimitive__namespace.Content,
+    {
+      ref,
+      className: cn(
+        "fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border bg-background p-6 shadow-lg 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%] sm:rounded-lg",
+        className
+      ),
+      ...props,
+      children: [
+        children,
+        /* @__PURE__ */ jsxRuntime.jsxs(SheetPrimitive__namespace.Close, { className: "absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-accent data-[state=open]:text-muted-foreground", children: [
+          /* @__PURE__ */ jsxRuntime.jsx(lucideReact.X, { className: "h-4 w-4" }),
+          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Close" })
+        ] })
+      ]
+    }
+  )
+] }));
+DialogContent.displayName = SheetPrimitive__namespace.Content.displayName;
+var DialogHeader = ({
+  className,
+  ...props
+}) => /* @__PURE__ */ jsxRuntime.jsx(
+  "div",
+  {
+    className: cn(
+      "flex flex-col space-y-1.5 text-center sm:text-left",
+      className
+    ),
+    ...props
+  }
+);
+DialogHeader.displayName = "DialogHeader";
+var DialogFooter = ({
+  className,
+  ...props
+}) => /* @__PURE__ */ jsxRuntime.jsx(
+  "div",
+  {
+    className: cn(
+      "flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2",
+      className
+    ),
+    ...props
+  }
+);
+DialogFooter.displayName = "DialogFooter";
+var DialogTitle = React16__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+  SheetPrimitive__namespace.Title,
+  {
+    ref,
+    className: cn(
+      "text-lg font-semibold leading-none tracking-tight",
+      className
+    ),
+    ...props
+  }
+));
+DialogTitle.displayName = SheetPrimitive__namespace.Title.displayName;
+var DialogDescription = React16__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+  SheetPrimitive__namespace.Description,
+  {
+    ref,
+    className: cn("text-sm text-muted-foreground", className),
+    ...props
+  }
+));
+DialogDescription.displayName = SheetPrimitive__namespace.Description.displayName;
+var Select = SelectPrimitive__namespace.Root;
+var SelectGroup = SelectPrimitive__namespace.Group;
+var SelectValue = SelectPrimitive__namespace.Value;
+var SelectTrigger = React16__namespace.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(
+  SelectPrimitive__namespace.Trigger,
+  {
+    ref,
+    className: cn(
+      // HAI3 customization: bg-background and hover states for consistency with Button Outline
+      "flex h-9 w-full items-center justify-between whitespace-nowrap rounded-md border border-input bg-background px-3 py-2 text-sm shadow-sm ring-offset-background hover:bg-accent hover:text-bg-accent-foreground data-[placeholder]:text-muted-foreground focus:outline-none focus:ring-1 focus:ring-ring disabled:cursor-not-allowed disabled:opacity-50 [&>span]:line-clamp-1",
+      className
+    ),
+    ...props,
+    children: [
+      children,
+      /* @__PURE__ */ jsxRuntime.jsx(SelectPrimitive__namespace.Icon, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronDown, { className: "h-4 w-4 opacity-50" }) })
+    ]
+  }
+));
+SelectTrigger.displayName = SelectPrimitive__namespace.Trigger.displayName;
+var SelectScrollUpButton = React16__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+  SelectPrimitive__namespace.ScrollUpButton,
+  {
+    ref,
+    className: cn(
+      "flex cursor-default items-center justify-center py-1",
+      className
+    ),
+    ...props,
+    children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronUp, { className: "h-4 w-4" })
+  }
+));
+SelectScrollUpButton.displayName = SelectPrimitive__namespace.ScrollUpButton.displayName;
+var SelectScrollDownButton = React16__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+  SelectPrimitive__namespace.ScrollDownButton,
+  {
+    ref,
+    className: cn(
+      "flex cursor-default items-center justify-center py-1",
+      className
+    ),
+    ...props,
+    children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronDown, { className: "h-4 w-4" })
+  }
+));
+SelectScrollDownButton.displayName = SelectPrimitive__namespace.ScrollDownButton.displayName;
+var SelectContent = React16__namespace.forwardRef(({ className, children, position = "popper", ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(SelectPrimitive__namespace.Portal, { children: /* @__PURE__ */ jsxRuntime.jsxs(
+  SelectPrimitive__namespace.Content,
+  {
+    ref,
+    className: cn(
+      "relative z-50 max-h-[--radix-select-content-available-height] min-w-[8rem] overflow-y-auto overflow-x-hidden rounded-md border bg-popover text-popover-foreground shadow-md 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-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 origin-[--radix-select-content-transform-origin]",
+      position === "popper" && "data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1",
+      className
+    ),
+    position,
+    ...props,
+    children: [
+      /* @__PURE__ */ jsxRuntime.jsx(SelectScrollUpButton, {}),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        SelectPrimitive__namespace.Viewport,
+        {
+          className: cn(
+            "p-1",
+            position === "popper" && "h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)]"
+          ),
+          children
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx(SelectScrollDownButton, {})
+    ]
+  }
+) }));
+SelectContent.displayName = SelectPrimitive__namespace.Content.displayName;
+var SelectLabel = React16__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+  SelectPrimitive__namespace.Label,
+  {
+    ref,
+    className: cn("px-2 py-1.5 text-sm font-semibold", className),
+    ...props
+  }
+));
+SelectLabel.displayName = SelectPrimitive__namespace.Label.displayName;
+var SelectItem = React16__namespace.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(
+  SelectPrimitive__namespace.Item,
+  {
+    ref,
+    className: cn(
+      "relative flex w-full cursor-default select-none items-center rounded-sm py-1.5 pl-2 pr-8 text-sm outline-none focus:bg-accent focus:text-bg-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
+      className
+    ),
+    ...props,
+    children: [
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "absolute right-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsxRuntime.jsx(SelectPrimitive__namespace.ItemIndicator, { children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Check, { className: "h-4 w-4" }) }) }),
+      /* @__PURE__ */ jsxRuntime.jsx(SelectPrimitive__namespace.ItemText, { children })
+    ]
+  }
+));
+SelectItem.displayName = SelectPrimitive__namespace.Item.displayName;
+var SelectSeparator = React16__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+  SelectPrimitive__namespace.Separator,
+  {
+    ref,
+    className: cn("-mx-1 my-1 h-px bg-muted", className),
+    ...props
+  }
+));
+SelectSeparator.displayName = SelectPrimitive__namespace.Separator.displayName;
+var DropdownMenu = ({ dir, ...props }) => /* @__PURE__ */ jsxRuntime.jsx(
+  DropdownMenuPrimitive__namespace.Root,
+  {
+    ...props,
+    dir
+  }
+);
+DropdownMenu.displayName = "DropdownMenu";
+var DropdownMenuTrigger = DropdownMenuPrimitive__namespace.Trigger;
+var DropdownMenuGroup = DropdownMenuPrimitive__namespace.Group;
+var DropdownMenuPortal = DropdownMenuPrimitive__namespace.Portal;
+var DropdownMenuSub = DropdownMenuPrimitive__namespace.Sub;
+var DropdownMenuRadioGroup = DropdownMenuPrimitive__namespace.RadioGroup;
+var DropdownMenuSubTrigger = React16__namespace.forwardRef(({ className, inset, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(
+  DropdownMenuPrimitive__namespace.SubTrigger,
+  {
+    ref,
+    className: cn(
+      "flex cursor-default select-none items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-none transition-colors focus:bg-accent data-[state=open]:bg-accent [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0",
+      inset && "pl-8",
+      className
+    ),
+    ...props,
+    children: [
+      children,
+      /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronRight, { className: "ms-auto rtl:rotate-180" })
+    ]
+  }
+));
+DropdownMenuSubTrigger.displayName = DropdownMenuPrimitive__namespace.SubTrigger.displayName;
+var DropdownMenuSubContent = React16__namespace.forwardRef(({ className, container, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(DropdownMenuPrimitive__namespace.Portal, { container: container ?? void 0, children: /* @__PURE__ */ jsxRuntime.jsx(
+  DropdownMenuPrimitive__namespace.SubContent,
+  {
+    ref,
+    className: cn(
+      "z-50 min-w-[8rem] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-lg 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-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 origin-[--radix-dropdown-menu-content-transform-origin]",
+      className
+    ),
+    ...props
+  }
+) }));
+DropdownMenuSubContent.displayName = DropdownMenuPrimitive__namespace.SubContent.displayName;
+var DropdownMenuContent = React16__namespace.forwardRef(({ className, sideOffset = 4, container, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(DropdownMenuPrimitive__namespace.Portal, { container: container ?? void 0, children: /* @__PURE__ */ jsxRuntime.jsx(
+  DropdownMenuPrimitive__namespace.Content,
+  {
+    ref,
+    sideOffset,
+    className: cn(
+      "z-50 max-h-[var(--radix-dropdown-menu-content-available-height)] min-w-[8rem] overflow-y-auto overflow-x-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-md",
+      "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-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 origin-[--radix-dropdown-menu-content-transform-origin]",
+      className
+    ),
+    ...props
+  }
+) }));
+DropdownMenuContent.displayName = DropdownMenuPrimitive__namespace.Content.displayName;
+var DropdownMenuItem = React16__namespace.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+  DropdownMenuPrimitive__namespace.Item,
+  {
+    ref,
+    className: cn(
+      "relative flex cursor-default select-none items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-none transition-colors focus:bg-accent data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&>svg]:size-4 [&>svg]:shrink-0",
+      inset && "pl-8",
+      className
+    ),
+    ...props
+  }
+));
+DropdownMenuItem.displayName = DropdownMenuPrimitive__namespace.Item.displayName;
+var DropdownMenuCheckboxItem = React16__namespace.forwardRef(({ className, children, checked, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(
+  DropdownMenuPrimitive__namespace.CheckboxItem,
+  {
+    ref,
+    className: cn(
+      "relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none transition-colors focus:bg-accent data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
+      className
+    ),
+    checked,
+    ...props,
+    children: [
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsxRuntime.jsx(DropdownMenuPrimitive__namespace.ItemIndicator, { children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Check, { className: "h-4 w-4" }) }) }),
+      children
+    ]
+  }
+));
+DropdownMenuCheckboxItem.displayName = DropdownMenuPrimitive__namespace.CheckboxItem.displayName;
+var DropdownMenuRadioItem = React16__namespace.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(
+  DropdownMenuPrimitive__namespace.RadioItem,
+  {
+    ref,
+    className: cn(
+      "relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none transition-colors focus:bg-accent data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
+      className
+    ),
+    ...props,
+    children: [
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsxRuntime.jsx(DropdownMenuPrimitive__namespace.ItemIndicator, { children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Circle, { className: "h-2 w-2 fill-current" }) }) }),
+      children
+    ]
+  }
+));
+DropdownMenuRadioItem.displayName = DropdownMenuPrimitive__namespace.RadioItem.displayName;
+var DropdownMenuLabel = React16__namespace.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+  DropdownMenuPrimitive__namespace.Label,
+  {
+    ref,
+    className: cn(
+      "px-2 py-1.5 text-sm font-semibold",
+      inset && "pl-8",
+      className
+    ),
+    ...props
+  }
+));
+DropdownMenuLabel.displayName = DropdownMenuPrimitive__namespace.Label.displayName;
+var DropdownMenuSeparator = React16__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+  DropdownMenuPrimitive__namespace.Separator,
+  {
+    ref,
+    className: cn("-mx-1 my-1 h-px bg-muted", className),
+    ...props
+  }
+));
+DropdownMenuSeparator.displayName = DropdownMenuPrimitive__namespace.Separator.displayName;
+var DropdownMenuShortcut = ({
+  className,
+  ...props
+}) => {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "span",
+    {
+      className: cn("ml-auto text-xs tracking-widest opacity-60", className),
+      ...props
+    }
+  );
+};
+DropdownMenuShortcut.displayName = "DropdownMenuShortcut";
+var IconButton = React16__namespace.default.forwardRef(
+  ({ variant = uikitContracts.ButtonVariant.Ghost, size = uikitContracts.IconButtonSize.Default, className, ...props }, ref) => {
+    const sizeStyles = {
+      [uikitContracts.IconButtonSize.Small]: "h-8 w-8",
+      [uikitContracts.IconButtonSize.Default]: "h-9 w-9",
+      [uikitContracts.IconButtonSize.Large]: "h-11 w-11"
+    };
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      Button,
+      {
+        ref,
+        variant,
+        size: uikitContracts.ButtonSize.Icon,
+        className: cn(sizeStyles[size], className),
+        ...props
+      }
+    );
+  }
+);
+IconButton.displayName = "IconButton";
+var DropdownButton = React16__namespace.default.forwardRef(({ children, variant = uikitContracts.ButtonVariant.Outline, className, ...props }, ref) => {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    Button,
+    {
+      ref,
+      variant,
+      className: cn("min-w-40 justify-between rtl:flex-row-reverse", className),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx("span", { children }),
+        /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronDown, { className: "h-4 w-4" })
+      ]
+    }
+  );
+});
+DropdownButton.displayName = "DropdownButton";
+var Sidebar = React16__namespace.forwardRef(({ collapsed = false, className, children, ...props }, ref) => {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "aside",
+    {
+      ref,
+      "data-state": collapsed ? "collapsed" : "expanded",
+      "data-collapsible": collapsed ? "icon" : "",
+      className: cn(
+        "group flex flex-col border-r border-mainMenu-border transition-[width] duration-200 ease-linear",
+        "bg-mainMenu text-mainMenu-foreground",
+        collapsed ? "w-14" : "w-64",
+        className
+      ),
+      ...props,
+      children
+    }
+  );
+});
+Sidebar.displayName = "Sidebar";
+var SidebarContent = React16__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+  "div",
+  {
+    ref,
+    "data-sidebar": "content",
+    className: cn(
+      // HAI3 customization: gap and padding use rem-based spacing for theme scaling
+      "flex min-h-0 flex-1 flex-col gap-2 overflow-auto group-data-[collapsible=icon]:overflow-hidden p-2",
+      className
+    ),
+    ...props
+  }
+));
+SidebarContent.displayName = "SidebarContent";
+var SidebarMenu = React16__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+  "ul",
+  {
+    ref,
+    "data-sidebar": "menu",
+    className: cn("flex w-full min-w-0 flex-col gap-1", className),
+    ...props
+  }
+));
+SidebarMenu.displayName = "SidebarMenu";
+var SidebarMenuItem = React16__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+  "li",
+  {
+    ref,
+    "data-sidebar": "menu-item",
+    className: cn("group/menu-item relative", className),
+    ...props
+  }
+));
+SidebarMenuItem.displayName = "SidebarMenuItem";
+var sidebarMenuButtonVariants = classVarianceAuthority.cva(
+  // HAI3 customization: All sizing uses rem-based Tailwind classes for theme responsiveness
+  "peer/menu-button flex w-full items-center gap-2 rounded-md p-2 text-left text-sm outline-none ring-sidebar-ring transition-[width,height,padding] focus-visible:ring-2 disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 group-data-[collapsible=icon]:!p-2 [&>span:last-child]:truncate [&>span:last-child]:overflow-hidden [&>svg]:size-5 [&>svg]:shrink-0 text-mainMenu-foreground hover:bg-mainMenu-hover data-[active=true]:bg-mainMenu-selected data-[active=true]:text-white data-[active=true]:font-medium",
+  {
+    variants: {
+      variant: {
+        default: "",
+        outline: "bg-background shadow-[0_0_0_1px_hsl(var(--border))] hover:bg-mainMenu-hover"
+      },
+      size: {
+        // HAI3 customization: All heights use rem-based Tailwind classes (h-10=2.5rem, h-7=1.75rem, h-12=3rem)
+        default: "h-10 text-sm",
+        sm: "h-7 text-xs",
+        lg: "h-12 text-sm group-data-[collapsible=icon]:!p-0"
+      }
+    },
+    defaultVariants: {
+      variant: "default",
+      size: "default"
+    }
+  }
+);
+var SidebarMenuButton = React16__namespace.forwardRef(
+  ({
+    asChild = false,
+    isActive = false,
+    variant = "default",
+    size = "default",
+    tooltip,
+    className,
+    ...props
+  }, ref) => {
+    const Comp = asChild ? reactSlot.Slot : "button";
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      Comp,
+      {
+        ref,
+        "data-sidebar": "menu-button",
+        "data-size": size,
+        "data-active": isActive,
+        title: tooltip,
+        className: cn(sidebarMenuButtonVariants({ variant, size }), className),
+        ...props
+      }
+    );
+  }
+);
+SidebarMenuButton.displayName = "SidebarMenuButton";
+var SidebarMenuIcon = React16__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+  "span",
+  {
+    ref,
+    className: cn("size-5 min-w-[1.5rem] flex-shrink-0 [&>svg]:w-full [&>svg]:h-full", className),
+    ...props
+  }
+));
+SidebarMenuIcon.displayName = "SidebarMenuIcon";
+var SidebarMenuLabel = React16__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+  "span",
+  {
+    ref,
+    className: cn(className),
+    ...props
+  }
+));
+SidebarMenuLabel.displayName = "SidebarMenuLabel";
+var SidebarHeader = React16__namespace.forwardRef(
+  ({ logo, logoText, collapsed = false, onClick, className, ...props }, ref) => {
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      "div",
+      {
+        ref,
+        className: cn(
+          "flex flex-col h-16",
+          className
+        ),
+        ...props,
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center flex-1 px-2", children: /* @__PURE__ */ jsxRuntime.jsxs(SidebarMenuButton, { onClick, tooltip: collapsed ? "Expand menu" : "Collapse menu", children: [
+            logo && /* @__PURE__ */ jsxRuntime.jsx(SidebarMenuIcon, { children: logo }),
+            logoText && /* @__PURE__ */ jsxRuntime.jsx(SidebarMenuLabel, { className: "[&>svg]:h-5 [&>svg]:w-auto", children: logoText })
+          ] }) }),
+          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "border-b border-mainMenu-border mx-4" })
+        ]
+      }
+    );
+  }
+);
+SidebarHeader.displayName = "SidebarHeader";
+var UserInfo = React16__namespace.default.forwardRef(
+  ({ displayName, email, avatarUrl, className, loading }, ref) => {
+    const getInitials = () => {
+      if (!displayName) return lodash.toUpper(email?.[0] || "") || "?";
+      const parts = lodash.trim(displayName).split(/\s+/);
+      if (parts.length >= 2) {
+        return lodash.toUpper(`${parts[0][0]}${parts[parts.length - 1][0]}`);
+      }
+      return lodash.toUpper(displayName.slice(0, 2));
+    };
+    const initials = getInitials();
+    const displayText = displayName || email || "User";
+    if (loading) {
+      return /* @__PURE__ */ jsxRuntime.jsxs("div", { ref, className: cn("flex items-center gap-2 text-sm", className), children: [
+        /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { className: "h-8 w-8 rounded-full" }),
+        /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { className: "h-4 w-24" })
+      ] });
+    }
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      "div",
+      {
+        ref,
+        className: cn(
+          "flex items-center gap-2 text-sm text-muted-foreground",
+          className
+        ),
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsxs(Avatar, { className: "h-8 w-8", children: [
+            avatarUrl && /* @__PURE__ */ jsxRuntime.jsx(AvatarImage, { src: avatarUrl, alt: displayText }),
+            /* @__PURE__ */ jsxRuntime.jsx(AvatarFallback, { children: initials })
+          ] }),
+          /* @__PURE__ */ jsxRuntime.jsx("span", { children: displayText })
+        ]
+      }
+    );
+  }
+);
+UserInfo.displayName = "UserInfo";
+var MessageType = /* @__PURE__ */ ((MessageType2) => {
+  MessageType2["User"] = "user";
+  MessageType2["Assistant"] = "assistant";
+  return MessageType2;
+})(MessageType || {});
+var MessageBubble = ({
+  type,
+  content,
+  className = "",
+  onCopy,
+  onEdit,
+  onDelete
+}) => {
+  const isUser = type === "user" /* User */;
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `flex gap-4 group ${className}`, children: [
+    /* @__PURE__ */ jsxRuntime.jsx(Avatar, { className: "h-8 w-8 flex-shrink-0", children: /* @__PURE__ */ jsxRuntime.jsx(
+      AvatarFallback,
+      {
+        className: isUser ? "bg-blue-500 text-white" : "bg-green-500 text-white",
+        children: isUser ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.User, { size: 16 }) : /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Bot, { size: 16 })
+      }
+    ) }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex-1 min-w-0", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "prose prose-sm max-w-none", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "leading-relaxed whitespace-pre-wrap", children: content }) }),
+      (onCopy || onEdit || onDelete) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-1 mt-2 opacity-0 group-hover:opacity-100 transition-opacity", children: [
+        onCopy && /* @__PURE__ */ jsxRuntime.jsx(
+          "button",
+          {
+            onClick: onCopy,
+            className: "p-1.5 hover:bg-muted rounded-lg transition-colors text-muted-foreground hover:text-foreground",
+            title: "Copy message",
+            children: /* @__PURE__ */ jsxRuntime.jsxs(
+              "svg",
+              {
+                width: "14",
+                height: "14",
+                viewBox: "0 0 24 24",
+                fill: "none",
+                stroke: "currentColor",
+                strokeWidth: "2",
+                strokeLinecap: "round",
+                strokeLinejoin: "round",
+                children: [
+                  /* @__PURE__ */ jsxRuntime.jsx("rect", { x: "9", y: "9", width: "13", height: "13", rx: "2", ry: "2" }),
+                  /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1" })
+                ]
+              }
+            )
+          }
+        ),
+        onEdit && /* @__PURE__ */ jsxRuntime.jsx(
+          "button",
+          {
+            onClick: onEdit,
+            className: "p-1.5 hover:bg-muted rounded-lg transition-colors text-muted-foreground hover:text-foreground",
+            title: "Edit message",
+            children: /* @__PURE__ */ jsxRuntime.jsxs(
+              "svg",
+              {
+                width: "14",
+                height: "14",
+                viewBox: "0 0 24 24",
+                fill: "none",
+                stroke: "currentColor",
+                strokeWidth: "2",
+                strokeLinecap: "round",
+                strokeLinejoin: "round",
+                children: [
+                  /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7" }),
+                  /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z" })
+                ]
+              }
+            )
+          }
+        ),
+        onDelete && /* @__PURE__ */ jsxRuntime.jsx(
+          "button",
+          {
+            onClick: onDelete,
+            className: "p-1.5 hover:bg-destructive/10 rounded-lg transition-colors text-muted-foreground hover:text-destructive",
+            title: "Delete message",
+            children: /* @__PURE__ */ jsxRuntime.jsxs(
+              "svg",
+              {
+                width: "14",
+                height: "14",
+                viewBox: "0 0 24 24",
+                fill: "none",
+                stroke: "currentColor",
+                strokeWidth: "2",
+                strokeLinecap: "round",
+                strokeLinejoin: "round",
+                children: [
+                  /* @__PURE__ */ jsxRuntime.jsx("polyline", { points: "3 6 5 6 21 6" }),
+                  /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2" })
+                ]
+              }
+            )
+          }
+        )
+      ] })
+    ] })
+  ] });
+};
+var ChatInput = ({
+  value,
+  onChange,
+  onSend,
+  onAttachFile,
+  placeholder = "Type a message...",
+  disabled = false,
+  maxRows = 14,
+  className = ""
+}) => {
+  const handleKeyDown = (e) => {
+    if (e.key === "Enter" && !e.shiftKey) {
+      e.preventDefault();
+      if (!disabled && lodash.trim(value)) {
+        onSend();
+      }
+    }
+  };
+  const rows = Math.min(
+    Math.max(value.split("\n").length, 1),
+    maxRows
+  );
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `flex items-end gap-2 ${className}`, children: [
+    onAttachFile && /* @__PURE__ */ jsxRuntime.jsx(
+      Button,
+      {
+        variant: uikitContracts.ButtonVariant.Ghost,
+        size: uikitContracts.ButtonSize.Icon,
+        onClick: onAttachFile,
+        disabled,
+        className: "flex-shrink-0",
+        "aria-label": "Attach file",
+        children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Paperclip, { size: 20 })
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      "textarea",
+      {
+        value,
+        onChange: (e) => onChange(e.target.value),
+        onKeyDown: handleKeyDown,
+        placeholder,
+        disabled,
+        rows,
+        className: "flex-1 resize-none rounded-lg border border-input bg-background px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50"
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      Button,
+      {
+        onClick: onSend,
+        disabled: disabled || !lodash.trim(value),
+        className: "flex-shrink-0",
+        "aria-label": "Send message",
+        children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Send, { size: 20 })
+      }
+    )
+  ] });
+};
+var ThreadList = ({
+  threads,
+  selectedThreadId,
+  onThreadSelect,
+  onNewThread,
+  onDeleteThread,
+  searchQuery = "",
+  onSearchChange,
+  loading = false,
+  className = ""
+}) => {
+  if (loading) {
+    return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `flex flex-col h-full ${className}`, children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "p-4 border-b", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { className: "h-8 w-full mb-3" }),
+        /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { className: "h-10 w-full" })
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-1 overflow-y-auto p-2", children: [1, 2, 3, 4, 5].map((i) => /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { className: "h-16 w-full mb-2" }, i)) })
+    ] });
+  }
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `flex flex-col h-full ${className}`, children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "p-4 border-b", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between mb-3", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "text-lg font-semibold", children: "Recent Chats" }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          Button,
+          {
+            variant: uikitContracts.ButtonVariant.Ghost,
+            size: uikitContracts.ButtonSize.Icon,
+            onClick: onNewThread,
+            "aria-label": "New chat",
+            children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Plus, { size: 16 })
+          }
+        )
+      ] }),
+      onSearchChange && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          lucideReact.Search,
+          {
+            size: 16,
+            className: "absolute left-3 top-1/2 transform -translate-y-1/2 text-muted-foreground"
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "input",
+          {
+            type: "text",
+            placeholder: "Search chats...",
+            value: searchQuery,
+            onChange: (e) => onSearchChange(e.target.value),
+            className: "w-full pl-9 pr-3 py-2 border border-input rounded-lg text-sm bg-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"
+          }
+        )
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-1 overflow-y-auto", children: threads.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "p-4 text-center text-muted-foreground text-sm", children: "No chats yet. Start a new conversation!" }) : threads.map((thread) => /* @__PURE__ */ jsxRuntime.jsx(
+      "div",
+      {
+        onClick: () => onThreadSelect(thread.id),
+        className: `p-3 border-b cursor-pointer transition-colors hover:bg-muted/50 ${selectedThreadId === thread.id ? "bg-muted" : ""}`,
+        children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-start justify-between gap-2", children: [
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex-1 min-w-0", children: [
+            /* @__PURE__ */ jsxRuntime.jsxs("h3", { className: "font-medium text-sm truncate mb-1", children: [
+              thread.title,
+              thread.isTemporary && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "ml-2 text-xs text-muted-foreground", children: "(Temporary)" })
+            ] }),
+            /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-muted-foreground truncate", children: thread.preview })
+          ] }),
+          onDeleteThread && /* @__PURE__ */ jsxRuntime.jsx(
+            "button",
+            {
+              onClick: (e) => {
+                e.stopPropagation();
+                onDeleteThread(thread.id);
+              },
+              className: "p-1 opacity-0 group-hover:opacity-100 hover:bg-destructive/10 rounded transition-opacity text-muted-foreground hover:text-destructive",
+              "aria-label": "Delete thread",
+              children: /* @__PURE__ */ jsxRuntime.jsxs(
+                "svg",
+                {
+                  width: "14",
+                  height: "14",
+                  viewBox: "0 0 24 24",
+                  fill: "none",
+                  stroke: "currentColor",
+                  strokeWidth: "2",
+                  strokeLinecap: "round",
+                  strokeLinejoin: "round",
+                  children: [
+                    /* @__PURE__ */ jsxRuntime.jsx("polyline", { points: "3 6 5 6 21 6" }),
+                    /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2" })
+                  ]
+                }
+              )
+            }
+          )
+        ] })
+      },
+      thread.id
+    )) })
+  ] });
+};
+var MENU_ICON_ID = "menu";
+var MenuIcon = ({ className = "" }) => {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "svg",
+    {
+      className,
+      width: "20",
+      height: "20",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "2",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx("line", { x1: "3", y1: "12", x2: "21", y2: "12" }),
+        /* @__PURE__ */ jsxRuntime.jsx("line", { x1: "3", y1: "6", x2: "21", y2: "6" }),
+        /* @__PURE__ */ jsxRuntime.jsx("line", { x1: "3", y1: "18", x2: "21", y2: "18" })
+      ]
+    }
+  );
+};
+var CLOSE_ICON_ID = "close";
+var CloseIcon = ({ className = "" }) => {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "svg",
+    {
+      className,
+      width: "20",
+      height: "20",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "2",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx("line", { x1: "18", y1: "6", x2: "6", y2: "18" }),
+        /* @__PURE__ */ jsxRuntime.jsx("line", { x1: "6", y1: "6", x2: "18", y2: "18" })
+      ]
+    }
+  );
+};
+
+// src/styles/applyTheme.ts
+var hslToVar = (color) => {
+  if (color === "transparent") {
+    return "transparent";
+  }
+  if (color.startsWith("hsl(")) {
+    return color.replace("hsl(", "").replace(")", "");
+  }
+  return color;
+};
+var applyTheme = (theme, themeName) => {
+  const root = document.documentElement;
+  if (themeName) {
+    root.setAttribute("data-theme", themeName);
+  }
+  root.style.setProperty("--background", hslToVar(theme.colors.background));
+  root.style.setProperty("--foreground", hslToVar(theme.colors.foreground));
+  root.style.setProperty("--card", hslToVar(theme.colors.background));
+  root.style.setProperty("--card-foreground", hslToVar(theme.colors.foreground));
+  root.style.setProperty("--popover", hslToVar(theme.colors.background));
+  root.style.setProperty("--popover-foreground", hslToVar(theme.colors.foreground));
+  root.style.setProperty("--primary", hslToVar(theme.colors.primary));
+  root.style.setProperty("--primary-foreground", hslToVar(theme.colors.background));
+  root.style.setProperty("--secondary", hslToVar(theme.colors.secondary));
+  root.style.setProperty("--secondary-foreground", hslToVar(theme.colors.foreground));
+  root.style.setProperty("--muted", hslToVar(theme.colors.muted));
+  root.style.setProperty("--muted-foreground", hslToVar(theme.colors.foreground));
+  root.style.setProperty("--accent", hslToVar(theme.colors.accent));
+  root.style.setProperty("--accent-foreground", hslToVar(theme.colors.background));
+  root.style.setProperty("--destructive", hslToVar(theme.colors.error));
+  root.style.setProperty("--destructive-foreground", hslToVar(theme.colors.foreground));
+  root.style.setProperty("--border", hslToVar(theme.colors.border));
+  root.style.setProperty("--input", hslToVar(theme.colors.border));
+  root.style.setProperty("--ring", hslToVar(theme.colors.primary));
+  root.style.setProperty("--error", hslToVar(theme.colors.error));
+  root.style.setProperty("--warning", hslToVar(theme.colors.warning));
+  root.style.setProperty("--success", hslToVar(theme.colors.success));
+  root.style.setProperty("--info", hslToVar(theme.colors.info));
+  root.style.setProperty("--left-menu", hslToVar(theme.colors.mainMenu.DEFAULT));
+  root.style.setProperty("--left-menu-foreground", hslToVar(theme.colors.mainMenu.foreground));
+  root.style.setProperty("--left-menu-hover", hslToVar(theme.colors.mainMenu.hover));
+  root.style.setProperty("--left-menu-selected", hslToVar(theme.colors.mainMenu.selected));
+  root.style.setProperty("--left-menu-border", hslToVar(theme.colors.mainMenu.border));
+  Object.entries(theme.spacing).forEach(([key, value]) => {
+    root.style.setProperty(`--spacing-${key}`, value);
+  });
+  Object.entries(theme.borderRadius).forEach(([key, value]) => {
+    root.style.setProperty(`--radius-${key}`, value);
+  });
+  Object.entries(theme.shadows).forEach(([key, value]) => {
+    root.style.setProperty(`--shadow-${key}`, value);
+  });
+  Object.entries(theme.transitions).forEach(([key, value]) => {
+    root.style.setProperty(`--transition-${key}`, value);
+  });
+  if (themeName?.endsWith("-large")) {
+    root.style.fontSize = "125%";
+  } else {
+    root.style.fontSize = "";
+  }
+};
+
+Object.defineProperty(exports, "ButtonSize", {
+  enumerable: true,
+  get: function () { return uikitContracts.ButtonSize; }
+});
+Object.defineProperty(exports, "ButtonVariant", {
+  enumerable: true,
+  get: function () { return uikitContracts.ButtonVariant; }
+});
+Object.defineProperty(exports, "IconButtonSize", {
+  enumerable: true,
+  get: function () { return uikitContracts.IconButtonSize; }
+});
+exports.Avatar = Avatar;
+exports.AvatarFallback = AvatarFallback;
+exports.AvatarImage = AvatarImage;
+exports.Badge = Badge;
+exports.Button = Button;
+exports.CLOSE_ICON_ID = CLOSE_ICON_ID;
+exports.Card = Card;
+exports.CardContent = CardContent;
+exports.CardDescription = CardDescription;
+exports.CardFooter = CardFooter;
+exports.CardHeader = CardHeader;
+exports.CardTitle = CardTitle;
+exports.ChatInput = ChatInput;
+exports.CloseIcon = CloseIcon;
+exports.Dialog = Dialog;
+exports.DialogClose = DialogClose;
+exports.DialogContent = DialogContent;
+exports.DialogDescription = DialogDescription;
+exports.DialogFooter = DialogFooter;
+exports.DialogHeader = DialogHeader;
+exports.DialogOverlay = DialogOverlay;
+exports.DialogPortal = DialogPortal;
+exports.DialogTitle = DialogTitle;
+exports.DialogTrigger = DialogTrigger;
+exports.DropdownButton = DropdownButton;
+exports.DropdownMenu = DropdownMenu;
+exports.DropdownMenuCheckboxItem = DropdownMenuCheckboxItem;
+exports.DropdownMenuContent = DropdownMenuContent;
+exports.DropdownMenuGroup = DropdownMenuGroup;
+exports.DropdownMenuItem = DropdownMenuItem;
+exports.DropdownMenuLabel = DropdownMenuLabel;
+exports.DropdownMenuPortal = DropdownMenuPortal;
+exports.DropdownMenuRadioGroup = DropdownMenuRadioGroup;
+exports.DropdownMenuRadioItem = DropdownMenuRadioItem;
+exports.DropdownMenuSeparator = DropdownMenuSeparator;
+exports.DropdownMenuShortcut = DropdownMenuShortcut;
+exports.DropdownMenuSub = DropdownMenuSub;
+exports.DropdownMenuSubContent = DropdownMenuSubContent;
+exports.DropdownMenuSubTrigger = DropdownMenuSubTrigger;
+exports.DropdownMenuTrigger = DropdownMenuTrigger;
+exports.Header = Header;
+exports.IconButton = IconButton;
+exports.Input = Input;
+exports.MENU_ICON_ID = MENU_ICON_ID;
+exports.MenuIcon = MenuIcon;
+exports.MessageBubble = MessageBubble;
+exports.MessageType = MessageType;
+exports.NavigationMenu = NavigationMenu;
+exports.NavigationMenuContent = NavigationMenuContent;
+exports.NavigationMenuIndicator = NavigationMenuIndicator;
+exports.NavigationMenuItem = NavigationMenuItem;
+exports.NavigationMenuLink = NavigationMenuLink;
+exports.NavigationMenuList = NavigationMenuList;
+exports.NavigationMenuTrigger = NavigationMenuTrigger;
+exports.NavigationMenuViewport = NavigationMenuViewport;
+exports.Progress = Progress;
+exports.Select = Select;
+exports.SelectContent = SelectContent;
+exports.SelectGroup = SelectGroup;
+exports.SelectItem = SelectItem;
+exports.SelectLabel = SelectLabel;
+exports.SelectScrollDownButton = SelectScrollDownButton;
+exports.SelectScrollUpButton = SelectScrollUpButton;
+exports.SelectSeparator = SelectSeparator;
+exports.SelectTrigger = SelectTrigger;
+exports.SelectValue = SelectValue;
+exports.Sheet = Sheet;
+exports.SheetClose = SheetClose;
+exports.SheetContent = SheetContent;
+exports.SheetDescription = SheetDescription;
+exports.SheetFooter = SheetFooter;
+exports.SheetHeader = SheetHeader;
+exports.SheetOverlay = SheetOverlay;
+exports.SheetPortal = SheetPortal;
+exports.SheetTitle = SheetTitle;
+exports.SheetTrigger = SheetTrigger;
+exports.Sidebar = Sidebar;
+exports.SidebarContent = SidebarContent;
+exports.SidebarHeader = SidebarHeader;
+exports.SidebarMenu = SidebarMenu;
+exports.SidebarMenuButton = SidebarMenuButton;
+exports.SidebarMenuIcon = SidebarMenuIcon;
+exports.SidebarMenuItem = SidebarMenuItem;
+exports.SidebarMenuLabel = SidebarMenuLabel;
+exports.Skeleton = Skeleton;
+exports.Slider = Slider;
+exports.SliderRange = SliderRange;
+exports.SliderThumb = SliderThumb;
+exports.SliderTrack = SliderTrack;
+exports.Spinner = Spinner;
+exports.Switch = Switch;
+exports.Textarea = Textarea;
+exports.ThreadList = ThreadList;
+exports.Tooltip = Tooltip;
+exports.TooltipContent = TooltipContent;
+exports.TooltipProvider = TooltipProvider;
+exports.TooltipTrigger = TooltipTrigger;
+exports.UserInfo = UserInfo;
+exports.applyTheme = applyTheme;
+exports.badgeVariants = badgeVariants;
+//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map