@blinkdotnew/ui 0.1.0

package/dist/index.js

@@ -0,0 +1,4036 @@
+'use strict';
+
+var React14 = require('react');
+var jsxRuntime = require('react/jsx-runtime');
+var clsx = require('clsx');
+var tailwindMerge = require('tailwind-merge');
+var reactSlot = require('@radix-ui/react-slot');
+var classVarianceAuthority = require('class-variance-authority');
+var SelectPrimitive = require('@radix-ui/react-select');
+var lucideReact = require('lucide-react');
+var CheckboxPrimitive = require('@radix-ui/react-checkbox');
+var RadioGroupPrimitive = require('@radix-ui/react-radio-group');
+var SwitchPrimitive = require('@radix-ui/react-switch');
+var SliderPrimitive = require('@radix-ui/react-slider');
+var DialogPrimitive = require('@radix-ui/react-dialog');
+var PopoverPrimitive = require('@radix-ui/react-popover');
+var TooltipPrimitive = require('@radix-ui/react-tooltip');
+var DropdownMenuPrimitive = require('@radix-ui/react-dropdown-menu');
+var ContextMenuPrimitive = require('@radix-ui/react-context-menu');
+var AvatarPrimitive = require('@radix-ui/react-avatar');
+var SeparatorPrimitive = require('@radix-ui/react-separator');
+var ProgressPrimitive = require('@radix-ui/react-progress');
+var TabsPrimitive = require('@radix-ui/react-tabs');
+var reactHookForm = require('react-hook-form');
+var zod = require('@hookform/resolvers/zod');
+var z = require('zod');
+var reactTable = require('@tanstack/react-table');
+var sonner = require('sonner');
+var core = require('@dnd-kit/core');
+var sortable = require('@dnd-kit/sortable');
+var utilities = require('@dnd-kit/utilities');
+var recharts = require('recharts');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+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 React14__default = /*#__PURE__*/_interopDefault(React14);
+var SelectPrimitive__namespace = /*#__PURE__*/_interopNamespace(SelectPrimitive);
+var CheckboxPrimitive__namespace = /*#__PURE__*/_interopNamespace(CheckboxPrimitive);
+var RadioGroupPrimitive__namespace = /*#__PURE__*/_interopNamespace(RadioGroupPrimitive);
+var SwitchPrimitive__namespace = /*#__PURE__*/_interopNamespace(SwitchPrimitive);
+var SliderPrimitive__namespace = /*#__PURE__*/_interopNamespace(SliderPrimitive);
+var DialogPrimitive__namespace = /*#__PURE__*/_interopNamespace(DialogPrimitive);
+var PopoverPrimitive__namespace = /*#__PURE__*/_interopNamespace(PopoverPrimitive);
+var TooltipPrimitive__namespace = /*#__PURE__*/_interopNamespace(TooltipPrimitive);
+var DropdownMenuPrimitive__namespace = /*#__PURE__*/_interopNamespace(DropdownMenuPrimitive);
+var ContextMenuPrimitive__namespace = /*#__PURE__*/_interopNamespace(ContextMenuPrimitive);
+var AvatarPrimitive__namespace = /*#__PURE__*/_interopNamespace(AvatarPrimitive);
+var SeparatorPrimitive__namespace = /*#__PURE__*/_interopNamespace(SeparatorPrimitive);
+var ProgressPrimitive__namespace = /*#__PURE__*/_interopNamespace(ProgressPrimitive);
+var TabsPrimitive__namespace = /*#__PURE__*/_interopNamespace(TabsPrimitive);
+var z__namespace = /*#__PURE__*/_interopNamespace(z);
+
+// src/provider/blink-ui-provider.tsx
+var BlinkUIContext = React14.createContext(null);
+function useBlinkUI() {
+  const ctx = React14.useContext(BlinkUIContext);
+  if (!ctx)
+    throw new Error("useBlinkUI must be used within <BlinkUIProvider>");
+  return ctx;
+}
+function BlinkUIProvider({
+  children,
+  theme: initialTheme = "linear",
+  darkMode: initialDarkMode = "system"
+}) {
+  const [theme, setTheme] = React14.useState(initialTheme);
+  const [darkMode, setDarkMode] = React14.useState(initialDarkMode);
+  const [resolvedDark, setResolvedDark] = React14.useState(false);
+  React14.useEffect(() => {
+    const update = () => {
+      const isDark = darkMode === "dark" || darkMode === "system" && window.matchMedia("(prefers-color-scheme: dark)").matches;
+      setResolvedDark(isDark);
+    };
+    update();
+    const mq = window.matchMedia("(prefers-color-scheme: dark)");
+    mq.addEventListener("change", update);
+    return () => mq.removeEventListener("change", update);
+  }, [darkMode]);
+  React14.useEffect(() => {
+    const root = document.documentElement;
+    root.classList.remove("theme-linear", "theme-glass", "theme-midnight", "theme-minimal");
+    root.classList.remove("dark", "light");
+    root.classList.add(`theme-${theme}`);
+    root.classList.add(resolvedDark ? "dark" : "light");
+  }, [theme, resolvedDark]);
+  return /* @__PURE__ */ jsxRuntime.jsx(BlinkUIContext.Provider, { value: { theme, darkMode, resolvedDark, setTheme, setDarkMode }, children });
+}
+function cn(...inputs) {
+  return tailwindMerge.twMerge(clsx.clsx(inputs));
+}
+var buttonVariants = classVarianceAuthority.cva(
+  "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-[var(--radius)] text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[hsl(var(--ring))] focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50",
+  {
+    variants: {
+      variant: {
+        default: "bg-[hsl(var(--primary))] text-[hsl(var(--primary-foreground))] hover:bg-[hsl(var(--primary)/0.9)]",
+        secondary: "bg-[hsl(var(--secondary))] text-[hsl(var(--secondary-foreground))] hover:bg-[hsl(var(--secondary)/0.8)]",
+        outline: "border border-[hsl(var(--border))] bg-transparent hover:bg-[hsl(var(--accent))] hover:text-[hsl(var(--accent-foreground))]",
+        ghost: "hover:bg-[hsl(var(--accent))] hover:text-[hsl(var(--accent-foreground))]",
+        destructive: "bg-[hsl(var(--destructive))] text-[hsl(var(--destructive-foreground))] hover:bg-[hsl(var(--destructive)/0.9)]",
+        link: "text-[hsl(var(--primary))] underline-offset-4 hover:underline"
+      },
+      size: {
+        sm: "h-8 px-3 text-xs",
+        default: "h-9 px-4 py-2",
+        lg: "h-11 px-6 text-base",
+        icon: "h-9 w-9"
+      }
+    },
+    defaultVariants: { variant: "default", size: "default" }
+  }
+);
+var Button = React14__default.default.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 Input = React14__default.default.forwardRef(
+  ({ className, type, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+    "input",
+    {
+      type,
+      className: cn(
+        "flex h-9 w-full rounded-[var(--radius)] border border-[hsl(var(--input))] bg-transparent px-3 py-1 text-sm shadow-sm transition-colors",
+        "placeholder:text-[hsl(var(--muted-foreground))]",
+        "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[hsl(var(--ring))]",
+        "disabled:cursor-not-allowed disabled:opacity-50",
+        "file:border-0 file:bg-transparent file:text-sm file:font-medium",
+        className
+      ),
+      ref,
+      ...props
+    }
+  )
+);
+Input.displayName = "Input";
+var Textarea = React14__default.default.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+    "textarea",
+    {
+      className: cn(
+        "flex min-h-[80px] w-full rounded-[var(--radius)] border border-[hsl(var(--input))] bg-transparent px-3 py-2 text-sm shadow-sm",
+        "placeholder:text-[hsl(var(--muted-foreground))]",
+        "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[hsl(var(--ring))]",
+        "disabled:cursor-not-allowed disabled:opacity-50",
+        "resize-none",
+        className
+      ),
+      ref,
+      ...props
+    }
+  )
+);
+Textarea.displayName = "Textarea";
+var Select = SelectPrimitive__namespace.Root;
+var SelectGroup = SelectPrimitive__namespace.Group;
+var SelectValue = SelectPrimitive__namespace.Value;
+var SelectTrigger = React14__default.default.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(
+  SelectPrimitive__namespace.Trigger,
+  {
+    ref,
+    className: cn(
+      "flex h-9 w-full items-center justify-between rounded-[var(--radius)] border border-[hsl(var(--input))] bg-transparent px-3 py-2 text-sm shadow-sm",
+      "placeholder:text-[hsl(var(--muted-foreground))]",
+      "focus:outline-none focus:ring-2 focus:ring-[hsl(var(--ring))]",
+      "disabled:cursor-not-allowed disabled:opacity-50",
+      "[&>span]:truncate",
+      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 shrink-0" }) })
+    ]
+  }
+));
+SelectTrigger.displayName = SelectPrimitive__namespace.Trigger.displayName;
+var SelectScrollUpButton = React14__default.default.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 = React14__default.default.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 = React14__default.default.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-96 min-w-[8rem] overflow-hidden rounded-[var(--radius)] border border-[hsl(var(--border))] bg-[hsl(var(--popover))] text-[hsl(var(--popover-foreground))] shadow-md",
+      "data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95",
+      "data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95",
+      position === "popper" && "data-[side=bottom]:translate-y-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 = React14__default.default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+  SelectPrimitive__namespace.Label,
+  {
+    ref,
+    className: cn("px-2 py-1.5 text-xs font-semibold text-[hsl(var(--muted-foreground))]", className),
+    ...props
+  }
+));
+SelectLabel.displayName = SelectPrimitive__namespace.Label.displayName;
+var SelectItem = React14__default.default.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-[hsl(var(--accent))] focus:text-[hsl(var(--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 = React14__default.default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+  SelectPrimitive__namespace.Separator,
+  {
+    ref,
+    className: cn("-mx-1 my-1 h-px bg-[hsl(var(--muted))]", className),
+    ...props
+  }
+));
+SelectSeparator.displayName = SelectPrimitive__namespace.Separator.displayName;
+var Checkbox = React14__default.default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+  CheckboxPrimitive__namespace.Root,
+  {
+    ref,
+    className: cn(
+      "peer h-4 w-4 shrink-0 rounded-sm border border-[hsl(var(--primary))] shadow",
+      "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[hsl(var(--ring))]",
+      "disabled:cursor-not-allowed disabled:opacity-50",
+      "data-[state=checked]:bg-[hsl(var(--primary))] data-[state=checked]:text-[hsl(var(--primary-foreground))]",
+      className
+    ),
+    ...props,
+    children: /* @__PURE__ */ jsxRuntime.jsx(CheckboxPrimitive__namespace.Indicator, { className: "flex items-center justify-center text-current", children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Check, { className: "h-3.5 w-3.5" }) })
+  }
+));
+Checkbox.displayName = CheckboxPrimitive__namespace.Root.displayName;
+var RadioGroup = React14__default.default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(RadioGroupPrimitive__namespace.Root, { className: cn("grid gap-2", className), ref, ...props }));
+RadioGroup.displayName = RadioGroupPrimitive__namespace.Root.displayName;
+var RadioGroupItem = React14__default.default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+  RadioGroupPrimitive__namespace.Item,
+  {
+    ref,
+    className: cn(
+      "aspect-square h-4 w-4 rounded-full border border-[hsl(var(--primary))] text-[hsl(var(--primary))] shadow",
+      "focus:outline-none focus-visible:ring-2 focus-visible:ring-[hsl(var(--ring))]",
+      "disabled:cursor-not-allowed disabled:opacity-50",
+      className
+    ),
+    ...props,
+    children: /* @__PURE__ */ jsxRuntime.jsx(RadioGroupPrimitive__namespace.Indicator, { className: "flex items-center justify-center", children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Circle, { className: "h-2.5 w-2.5 fill-current" }) })
+  }
+));
+RadioGroupItem.displayName = RadioGroupPrimitive__namespace.Item.displayName;
+var Switch = React14__default.default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+  SwitchPrimitive__namespace.Root,
+  {
+    ref,
+    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-[hsl(var(--ring))] focus-visible:ring-offset-2 focus-visible:ring-offset-[hsl(var(--background))]",
+      "disabled:cursor-not-allowed disabled:opacity-50",
+      "data-[state=unchecked]:bg-[hsl(var(--input))]",
+      "data-[state=checked]:bg-[hsl(var(--primary))]",
+      className
+    ),
+    ...props,
+    children: /* @__PURE__ */ jsxRuntime.jsx(
+      SwitchPrimitive__namespace.Thumb,
+      {
+        className: cn(
+          "pointer-events-none block h-4 w-4 rounded-full bg-white shadow-lg ring-0 transition-transform",
+          "data-[state=unchecked]:translate-x-0",
+          "data-[state=checked]:translate-x-4"
+        )
+      }
+    )
+  }
+));
+Switch.displayName = SwitchPrimitive__namespace.Root.displayName;
+var Slider = React14__default.default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(
+  SliderPrimitive__namespace.Root,
+  {
+    ref,
+    className: cn("relative flex w-full touch-none select-none items-center", className),
+    ...props,
+    children: [
+      /* @__PURE__ */ jsxRuntime.jsx(SliderPrimitive__namespace.Track, { className: "relative h-1.5 w-full grow overflow-hidden rounded-full bg-[hsl(var(--secondary))]", children: /* @__PURE__ */ jsxRuntime.jsx(SliderPrimitive__namespace.Range, { className: "absolute h-full bg-[hsl(var(--primary))]" }) }),
+      /* @__PURE__ */ jsxRuntime.jsx(SliderPrimitive__namespace.Thumb, { className: "block h-4 w-4 rounded-full border border-[hsl(var(--primary)/0.5)] bg-[hsl(var(--background))] shadow transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[hsl(var(--ring))] disabled:pointer-events-none disabled:opacity-50" })
+    ]
+  }
+));
+Slider.displayName = SliderPrimitive__namespace.Root.displayName;
+var Dialog = DialogPrimitive__namespace.Root;
+var DialogTrigger = DialogPrimitive__namespace.Trigger;
+var DialogPortal = DialogPrimitive__namespace.Portal;
+var DialogClose = DialogPrimitive__namespace.Close;
+var DialogOverlay = React14__default.default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+  DialogPrimitive__namespace.Overlay,
+  {
+    ref,
+    className: cn(
+      "fixed inset-0 z-50 bg-black/80",
+      "data-[state=open]:animate-in data-[state=open]:fade-in-0",
+      "data-[state=closed]:animate-out data-[state=closed]:fade-out-0",
+      className
+    ),
+    ...props
+  }
+));
+DialogOverlay.displayName = DialogPrimitive__namespace.Overlay.displayName;
+var DialogContent = React14__default.default.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(DialogPortal, { children: [
+  /* @__PURE__ */ jsxRuntime.jsx(DialogOverlay, {}),
+  /* @__PURE__ */ jsxRuntime.jsxs(
+    DialogPrimitive__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",
+        "bg-[hsl(var(--background))] p-6 shadow-lg duration-200 rounded-[var(--radius)]",
+        "border border-[hsl(var(--border))]",
+        "data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95 data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%]",
+        "data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%]",
+        className
+      ),
+      ...props,
+      children: [
+        children,
+        /* @__PURE__ */ jsxRuntime.jsxs(DialogPrimitive__namespace.Close, { className: "absolute right-4 top-4 rounded-sm opacity-70 ring-offset-[hsl(var(--background))] transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-[hsl(var(--ring))] focus:ring-offset-2 disabled:pointer-events-none", children: [
+          /* @__PURE__ */ jsxRuntime.jsx(lucideReact.X, { className: "h-4 w-4" }),
+          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Close" })
+        ] })
+      ]
+    }
+  )
+] }));
+DialogContent.displayName = DialogPrimitive__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 = React14__default.default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+  DialogPrimitive__namespace.Title,
+  {
+    ref,
+    className: cn("text-lg font-semibold leading-none tracking-tight", className),
+    ...props
+  }
+));
+DialogTitle.displayName = DialogPrimitive__namespace.Title.displayName;
+var DialogDescription = React14__default.default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+  DialogPrimitive__namespace.Description,
+  {
+    ref,
+    className: cn("text-sm text-[hsl(var(--muted-foreground))]", className),
+    ...props
+  }
+));
+DialogDescription.displayName = DialogPrimitive__namespace.Description.displayName;
+var Sheet = DialogPrimitive__namespace.Root;
+var SheetTrigger = DialogPrimitive__namespace.Trigger;
+var SheetClose = DialogPrimitive__namespace.Close;
+var SheetPortal = DialogPrimitive__namespace.Portal;
+var SheetOverlay = React14__default.default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+  DialogPrimitive__namespace.Overlay,
+  {
+    ref,
+    className: cn(
+      "fixed inset-0 z-50 bg-black/80",
+      "data-[state=open]:animate-in data-[state=open]:fade-in-0",
+      "data-[state=closed]:animate-out data-[state=closed]:fade-out-0",
+      className
+    ),
+    ...props
+  }
+));
+SheetOverlay.displayName = DialogPrimitive__namespace.Overlay.displayName;
+var sheetVariants = classVarianceAuthority.cva(
+  "fixed z-50 gap-4 bg-[hsl(var(--background))] p-6 shadow-lg transition ease-in-out border-[hsl(var(--border))]",
+  {
+    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 = React14__default.default.forwardRef(({ side = "right", className, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(SheetPortal, { children: [
+  /* @__PURE__ */ jsxRuntime.jsx(SheetOverlay, {}),
+  /* @__PURE__ */ jsxRuntime.jsxs(DialogPrimitive__namespace.Content, { ref, className: cn(sheetVariants({ side }), className), ...props, children: [
+    /* @__PURE__ */ jsxRuntime.jsxs(DialogPrimitive__namespace.Close, { className: "absolute right-4 top-4 rounded-sm opacity-70 hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-[hsl(var(--ring))]", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(lucideReact.X, { className: "h-4 w-4" }),
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Close" })
+    ] }),
+    children
+  ] })
+] }));
+SheetContent.displayName = DialogPrimitive__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 });
+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 });
+var SheetTitle = React14__default.default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(DialogPrimitive__namespace.Title, { ref, className: cn("text-lg font-semibold", className), ...props }));
+SheetTitle.displayName = DialogPrimitive__namespace.Title.displayName;
+var SheetDescription = React14__default.default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(DialogPrimitive__namespace.Description, { ref, className: cn("text-sm text-[hsl(var(--muted-foreground))]", className), ...props }));
+SheetDescription.displayName = DialogPrimitive__namespace.Description.displayName;
+var Popover = PopoverPrimitive__namespace.Root;
+var PopoverTrigger = PopoverPrimitive__namespace.Trigger;
+var PopoverAnchor = PopoverPrimitive__namespace.Anchor;
+var PopoverContent = React14__default.default.forwardRef(({ className, align = "center", sideOffset = 4, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(PopoverPrimitive__namespace.Portal, { children: /* @__PURE__ */ jsxRuntime.jsx(
+  PopoverPrimitive__namespace.Content,
+  {
+    ref,
+    align,
+    sideOffset,
+    className: cn(
+      "z-50 w-72 rounded-[var(--radius)] border border-[hsl(var(--border))] bg-[hsl(var(--popover))] p-4 text-[hsl(var(--popover-foreground))] shadow-md outline-none",
+      "data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]: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=top]:slide-in-from-bottom-2",
+      className
+    ),
+    ...props
+  }
+) }));
+PopoverContent.displayName = PopoverPrimitive__namespace.Content.displayName;
+var TooltipProvider = TooltipPrimitive__namespace.Provider;
+var Tooltip = TooltipPrimitive__namespace.Root;
+var TooltipTrigger = TooltipPrimitive__namespace.Trigger;
+var TooltipContent = React14__default.default.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-[var(--radius)] bg-[hsl(var(--primary))] px-3 py-1.5 text-xs text-[hsl(var(--primary-foreground))] shadow-md",
+      "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=top]:slide-in-from-bottom-2",
+      className
+    ),
+    ...props
+  }
+) }));
+TooltipContent.displayName = TooltipPrimitive__namespace.Content.displayName;
+var DropdownMenu = DropdownMenuPrimitive__namespace.Root;
+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 contentStyle = cn(
+  "z-50 min-w-[8rem] overflow-hidden rounded-[var(--radius)] border border-[hsl(var(--border))] bg-[hsl(var(--popover))] p-1 text-[hsl(var(--popover-foreground))] shadow-md",
+  "data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95",
+  "data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95"
+);
+var itemStyle = 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-[hsl(var(--accent))] focus:text-[hsl(var(--accent-foreground))]",
+  "data-[disabled]:pointer-events-none data-[disabled]:opacity-50"
+);
+var DropdownMenuContent = React14__default.default.forwardRef(({ className, sideOffset = 4, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(DropdownMenuPrimitive__namespace.Portal, { children: /* @__PURE__ */ jsxRuntime.jsx(DropdownMenuPrimitive__namespace.Content, { ref, sideOffset, className: cn(contentStyle, className), ...props }) }));
+DropdownMenuContent.displayName = DropdownMenuPrimitive__namespace.Content.displayName;
+var DropdownMenuItem = React14__default.default.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(DropdownMenuPrimitive__namespace.Item, { ref, className: cn(itemStyle, inset && "pl-8", className), ...props }));
+DropdownMenuItem.displayName = DropdownMenuPrimitive__namespace.Item.displayName;
+var DropdownMenuCheckboxItem = React14__default.default.forwardRef(({ className, children, checked, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(DropdownMenuPrimitive__namespace.CheckboxItem, { ref, className: cn(itemStyle, "pl-8", 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 = React14__default.default.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(DropdownMenuPrimitive__namespace.RadioItem, { ref, className: cn(itemStyle, "pl-8", 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 = React14__default.default.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(DropdownMenuPrimitive__namespace.Label, { ref, className: cn("px-2 py-1.5 text-xs font-semibold text-[hsl(var(--muted-foreground))]", inset && "pl-8", className), ...props }));
+DropdownMenuLabel.displayName = DropdownMenuPrimitive__namespace.Label.displayName;
+var DropdownMenuSeparator = React14__default.default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(DropdownMenuPrimitive__namespace.Separator, { ref, className: cn("-mx-1 my-1 h-px bg-[hsl(var(--muted))]", className), ...props }));
+DropdownMenuSeparator.displayName = DropdownMenuPrimitive__namespace.Separator.displayName;
+var DropdownMenuSubTrigger = React14__default.default.forwardRef(({ className, inset, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(DropdownMenuPrimitive__namespace.SubTrigger, { ref, className: cn(itemStyle, inset && "pl-8", "data-[state=open]:bg-[hsl(var(--accent))]", className), ...props, children: [
+  children,
+  /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronRight, { className: "ml-auto h-4 w-4" })
+] }));
+DropdownMenuSubTrigger.displayName = DropdownMenuPrimitive__namespace.SubTrigger.displayName;
+var DropdownMenuSubContent = React14__default.default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(DropdownMenuPrimitive__namespace.SubContent, { ref, className: cn(contentStyle, className), ...props }));
+DropdownMenuSubContent.displayName = DropdownMenuPrimitive__namespace.SubContent.displayName;
+var DropdownMenuShortcut = ({ className, ...props }) => /* @__PURE__ */ jsxRuntime.jsx("span", { className: cn("ml-auto text-xs tracking-widest opacity-60", className), ...props });
+DropdownMenuShortcut.displayName = "DropdownMenuShortcut";
+var ContextMenu = ContextMenuPrimitive__namespace.Root;
+var ContextMenuTrigger = ContextMenuPrimitive__namespace.Trigger;
+var ContextMenuGroup = ContextMenuPrimitive__namespace.Group;
+var ContextMenuPortal = ContextMenuPrimitive__namespace.Portal;
+var ContextMenuSub = ContextMenuPrimitive__namespace.Sub;
+var ContextMenuRadioGroup = ContextMenuPrimitive__namespace.RadioGroup;
+var contentStyle2 = "z-50 min-w-[8rem] overflow-hidden rounded-[var(--radius)] border border-[hsl(var(--border))] bg-[hsl(var(--popover))] p-1 text-[hsl(var(--popover-foreground))] shadow-md animate-in fade-in-80";
+var itemStyle2 = "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-[hsl(var(--accent))] focus:text-[hsl(var(--accent-foreground))] data-[disabled]:pointer-events-none data-[disabled]:opacity-50";
+var ContextMenuContent = React14__default.default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(ContextMenuPrimitive__namespace.Portal, { children: /* @__PURE__ */ jsxRuntime.jsx(ContextMenuPrimitive__namespace.Content, { ref, className: cn(contentStyle2, className), ...props }) }));
+ContextMenuContent.displayName = ContextMenuPrimitive__namespace.Content.displayName;
+var ContextMenuItem = React14__default.default.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(ContextMenuPrimitive__namespace.Item, { ref, className: cn(itemStyle2, inset && "pl-8", className), ...props }));
+ContextMenuItem.displayName = ContextMenuPrimitive__namespace.Item.displayName;
+var ContextMenuCheckboxItem = React14__default.default.forwardRef(({ className, children, checked, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(ContextMenuPrimitive__namespace.CheckboxItem, { ref, className: cn(itemStyle2, "pl-8", 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(ContextMenuPrimitive__namespace.ItemIndicator, { children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Check, { className: "h-4 w-4" }) }) }),
+  children
+] }));
+ContextMenuCheckboxItem.displayName = ContextMenuPrimitive__namespace.CheckboxItem.displayName;
+var ContextMenuRadioItem = React14__default.default.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(ContextMenuPrimitive__namespace.RadioItem, { ref, className: cn(itemStyle2, "pl-8", 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(ContextMenuPrimitive__namespace.ItemIndicator, { children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Circle, { className: "h-2 w-2 fill-current" }) }) }),
+  children
+] }));
+ContextMenuRadioItem.displayName = ContextMenuPrimitive__namespace.RadioItem.displayName;
+var ContextMenuLabel = React14__default.default.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(ContextMenuPrimitive__namespace.Label, { ref, className: cn("px-2 py-1.5 text-xs font-semibold text-[hsl(var(--muted-foreground))]", inset && "pl-8", className), ...props }));
+ContextMenuLabel.displayName = ContextMenuPrimitive__namespace.Label.displayName;
+var ContextMenuSeparator = React14__default.default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(ContextMenuPrimitive__namespace.Separator, { ref, className: cn("-mx-1 my-1 h-px bg-[hsl(var(--muted))]", className), ...props }));
+ContextMenuSeparator.displayName = ContextMenuPrimitive__namespace.Separator.displayName;
+var ContextMenuSubTrigger = React14__default.default.forwardRef(({ className, inset, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(ContextMenuPrimitive__namespace.SubTrigger, { ref, className: cn(itemStyle2, inset && "pl-8", className), ...props, children: [
+  children,
+  /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronRight, { className: "ml-auto h-4 w-4" })
+] }));
+ContextMenuSubTrigger.displayName = ContextMenuPrimitive__namespace.SubTrigger.displayName;
+var ContextMenuSubContent = React14__default.default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(ContextMenuPrimitive__namespace.SubContent, { ref, className: cn(contentStyle2, className), ...props }));
+ContextMenuSubContent.displayName = ContextMenuPrimitive__namespace.SubContent.displayName;
+var ContextMenuShortcut = ({ className, ...props }) => /* @__PURE__ */ jsxRuntime.jsx("span", { className: cn("ml-auto text-xs tracking-widest opacity-60", className), ...props });
+var Card = React14__default.default.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      ref,
+      className: cn("rounded-[var(--radius)] border border-[hsl(var(--border))] bg-[hsl(var(--card))] text-[hsl(var(--card-foreground))] shadow-sm", className),
+      ...props
+    }
+  )
+);
+Card.displayName = "Card";
+var CardHeader = React14__default.default.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 = React14__default.default.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: cn("font-semibold leading-none tracking-tight", className), ...props })
+);
+CardTitle.displayName = "CardTitle";
+var CardDescription = React14__default.default.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: cn("text-sm text-[hsl(var(--muted-foreground))]", className), ...props })
+);
+CardDescription.displayName = "CardDescription";
+var CardContent = React14__default.default.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: cn("p-6 pt-0", className), ...props })
+);
+CardContent.displayName = "CardContent";
+var CardFooter = React14__default.default.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: cn("flex items-center p-6 pt-0", className), ...props })
+);
+CardFooter.displayName = "CardFooter";
+var badgeVariants = classVarianceAuthority.cva(
+  "inline-flex items-center rounded-full border px-2.5 py-0.5 text-xs font-semibold transition-colors focus:outline-none focus:ring-2 focus:ring-[hsl(var(--ring))] focus:ring-offset-2",
+  {
+    variants: {
+      variant: {
+        default: "border-transparent bg-[hsl(var(--primary))] text-[hsl(var(--primary-foreground))] hover:bg-[hsl(var(--primary)/0.8)]",
+        secondary: "border-transparent bg-[hsl(var(--secondary))] text-[hsl(var(--secondary-foreground))] hover:bg-[hsl(var(--secondary)/0.8)]",
+        destructive: "border-transparent bg-[hsl(var(--destructive))] text-[hsl(var(--destructive-foreground))] hover:bg-[hsl(var(--destructive)/0.8)]",
+        outline: "text-[hsl(var(--foreground))]"
+      }
+    },
+    defaultVariants: { variant: "default" }
+  }
+);
+function Badge({ className, variant, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn(badgeVariants({ variant }), className), ...props });
+}
+var Avatar = React14__default.default.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 = React14__default.default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(AvatarPrimitive__namespace.Image, { ref, className: cn("aspect-square h-full w-full object-cover", className), ...props }));
+AvatarImage.displayName = AvatarPrimitive__namespace.Image.displayName;
+var AvatarFallback = React14__default.default.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-[hsl(var(--muted))] text-sm font-medium text-[hsl(var(--muted-foreground))]", className),
+    ...props
+  }
+));
+AvatarFallback.displayName = AvatarPrimitive__namespace.Fallback.displayName;
+var Separator4 = React14__default.default.forwardRef(({ className, orientation = "horizontal", decorative = true, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+  SeparatorPrimitive__namespace.Root,
+  {
+    ref,
+    decorative,
+    orientation,
+    className: cn(
+      "shrink-0 bg-[hsl(var(--border))]",
+      orientation === "horizontal" ? "h-[1px] w-full" : "h-full w-[1px]",
+      className
+    ),
+    ...props
+  }
+));
+Separator4.displayName = SeparatorPrimitive__namespace.Root.displayName;
+function Skeleton({ className, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      className: cn("animate-pulse rounded-[var(--radius)] bg-[hsl(var(--muted))]", className),
+      ...props
+    }
+  );
+}
+var Progress = React14__default.default.forwardRef(({ className, value, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+  ProgressPrimitive__namespace.Root,
+  {
+    ref,
+    className: cn("relative h-2 w-full overflow-hidden rounded-full bg-[hsl(var(--secondary))]", className),
+    ...props,
+    children: /* @__PURE__ */ jsxRuntime.jsx(
+      ProgressPrimitive__namespace.Indicator,
+      {
+        className: "h-full w-full flex-1 bg-[hsl(var(--primary))] transition-all",
+        style: { transform: `translateX(-${100 - (value ?? 0)}%)` }
+      }
+    )
+  }
+));
+Progress.displayName = ProgressPrimitive__namespace.Root.displayName;
+var Tabs = TabsPrimitive__namespace.Root;
+var TabsList = React14__default.default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+  TabsPrimitive__namespace.List,
+  {
+    ref,
+    className: cn(
+      "inline-flex h-9 items-center justify-center rounded-lg bg-[hsl(var(--muted))] p-1 text-[hsl(var(--muted-foreground))]",
+      className
+    ),
+    ...props
+  }
+));
+TabsList.displayName = TabsPrimitive__namespace.List.displayName;
+var TabsTrigger = React14__default.default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+  TabsPrimitive__namespace.Trigger,
+  {
+    ref,
+    className: cn(
+      "inline-flex items-center justify-center whitespace-nowrap rounded-md px-3 py-1 text-sm font-medium ring-offset-[hsl(var(--background))] transition-all",
+      "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[hsl(var(--ring))] focus-visible:ring-offset-2",
+      "disabled:pointer-events-none disabled:opacity-50",
+      "data-[state=active]:bg-[hsl(var(--background))] data-[state=active]:text-[hsl(var(--foreground))] data-[state=active]:shadow",
+      className
+    ),
+    ...props
+  }
+));
+TabsTrigger.displayName = TabsPrimitive__namespace.Trigger.displayName;
+var TabsContent = React14__default.default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+  TabsPrimitive__namespace.Content,
+  {
+    ref,
+    className: cn(
+      "mt-2 ring-offset-[hsl(var(--background))] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[hsl(var(--ring))] focus-visible:ring-offset-2",
+      className
+    ),
+    ...props
+  }
+));
+TabsContent.displayName = TabsPrimitive__namespace.Content.displayName;
+var dirMap = {
+  row: "flex-row",
+  col: "flex-col",
+  "row-reverse": "flex-row-reverse",
+  "col-reverse": "flex-col-reverse"
+};
+var alignMap = {
+  start: "items-start",
+  center: "items-center",
+  end: "items-end",
+  stretch: "items-stretch",
+  baseline: "items-baseline"
+};
+var justifyMap = {
+  start: "justify-start",
+  center: "justify-center",
+  end: "justify-end",
+  between: "justify-between",
+  around: "justify-around",
+  evenly: "justify-evenly"
+};
+var Stack = React14__default.default.forwardRef(
+  ({ className, gap, direction = "col", align, justify, wrap, style, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      ref,
+      className: cn(
+        "flex",
+        dirMap[direction],
+        align && alignMap[align],
+        justify && justifyMap[justify],
+        wrap && "flex-wrap",
+        className
+      ),
+      style: { ...gap !== void 0 ? { gap: `${gap * 4}px` } : {}, ...style },
+      ...props
+    }
+  )
+);
+Stack.displayName = "Stack";
+var HStack = React14__default.default.forwardRef(
+  (props, ref) => /* @__PURE__ */ jsxRuntime.jsx(Stack, { ref, direction: "row", ...props })
+);
+HStack.displayName = "HStack";
+var VStack = React14__default.default.forwardRef(
+  (props, ref) => /* @__PURE__ */ jsxRuntime.jsx(Stack, { ref, direction: "col", ...props })
+);
+VStack.displayName = "VStack";
+var sizeMap = {
+  sm: "max-w-screen-sm",
+  md: "max-w-screen-md",
+  lg: "max-w-screen-lg",
+  xl: "max-w-screen-xl",
+  full: "max-w-full"
+};
+var Container = React14__default.default.forwardRef(
+  ({ className, size = "lg", noPadding = false, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      ref,
+      className: cn(
+        "mx-auto w-full",
+        sizeMap[size],
+        !noPadding && "px-4 sm:px-6 lg:px-8",
+        className
+      ),
+      ...props
+    }
+  )
+);
+Container.displayName = "Container";
+var Page = React14__default.default.forwardRef(
+  ({ className, maxWidth, style, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      ref,
+      className: cn("flex flex-col min-h-full w-full", className),
+      style: { maxWidth, ...style },
+      ...props
+    }
+  )
+);
+Page.displayName = "Page";
+var PageHeader = React14__default.default.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      ref,
+      className: cn("flex items-start justify-between gap-4 px-6 py-4 border-b border-[hsl(var(--border))]", className),
+      ...props
+    }
+  )
+);
+PageHeader.displayName = "PageHeader";
+var PageTitle = React14__default.default.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+    "h1",
+    {
+      ref,
+      className: cn("text-2xl font-semibold tracking-tight text-[hsl(var(--foreground))]", className),
+      ...props
+    }
+  )
+);
+PageTitle.displayName = "PageTitle";
+var PageDescription = React14__default.default.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("p", { ref, className: cn("text-sm text-[hsl(var(--muted-foreground))] mt-1", className), ...props })
+);
+PageDescription.displayName = "PageDescription";
+var PageActions = React14__default.default.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: cn("flex items-center gap-2 shrink-0", className), ...props })
+);
+PageActions.displayName = "PageActions";
+var PageBody = React14__default.default.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: cn("flex-1 p-6", className), ...props })
+);
+PageBody.displayName = "PageBody";
+var SidebarCtx = React14__default.default.createContext({ collapsed: false });
+var useSidebarCtx = () => React14__default.default.useContext(SidebarCtx);
+var makeSlot = (name, cls) => {
+  const C = React14__default.default.forwardRef(
+    ({ className, ...p }, ref) => /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: cn(cls, className), ...p })
+  );
+  C.displayName = name;
+  return C;
+};
+var Sidebar = React14__default.default.forwardRef(
+  ({ className, collapsed = false, onCollapse, width = "240px", style, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(SidebarCtx.Provider, { value: { collapsed }, children: /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      ref,
+      className: cn("flex flex-col h-full bg-[hsl(var(--card))] border-r border-[hsl(var(--border))] transition-all duration-200 overflow-hidden", className),
+      style: { width: collapsed ? "48px" : width, ...style },
+      ...props,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-1 overflow-y-auto overflow-x-hidden", children }),
+        onCollapse && /* @__PURE__ */ jsxRuntime.jsx(
+          "button",
+          {
+            onClick: onCollapse,
+            className: "flex items-center justify-center h-10 w-full border-t border-[hsl(var(--border))] hover:bg-[hsl(var(--accent))] text-[hsl(var(--muted-foreground))] hover:text-[hsl(var(--foreground))] transition-colors shrink-0",
+            children: collapsed ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronRight, { className: "h-4 w-4" }) : /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronLeft, { className: "h-4 w-4" })
+          }
+        )
+      ]
+    }
+  ) })
+);
+Sidebar.displayName = "Sidebar";
+var SidebarHeader = makeSlot("SidebarHeader", "px-3 py-4 border-b border-[hsl(var(--border))] shrink-0");
+var SidebarContent = makeSlot("SidebarContent", "flex-1 overflow-y-auto py-2");
+var SidebarFooter = makeSlot("SidebarFooter", "px-3 py-3 border-t border-[hsl(var(--border))] shrink-0");
+var SidebarGroup = makeSlot("SidebarGroup", "mb-2");
+var SidebarSeparator = makeSlot("SidebarSeparator", "h-px bg-[hsl(var(--border))] mx-3 my-2");
+var SidebarGroupLabel = React14__default.default.forwardRef(
+  ({ className, ...props }, ref) => {
+    const { collapsed } = useSidebarCtx();
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      "div",
+      {
+        ref,
+        className: cn("px-3 py-1 text-xs font-semibold text-[hsl(var(--muted-foreground))] uppercase tracking-wider", collapsed && "sr-only", className),
+        ...props
+      }
+    );
+  }
+);
+SidebarGroupLabel.displayName = "SidebarGroupLabel";
+var SidebarItem = React14__default.default.forwardRef(
+  ({ className, icon, label, active, href, badge, onClick, ...props }, ref) => {
+    const { collapsed } = useSidebarCtx();
+    const cls = cn(
+      "flex items-center gap-2.5 px-3 py-2 rounded-md cursor-pointer transition-colors mx-1 text-sm",
+      active ? "bg-[hsl(var(--accent))] text-[hsl(var(--foreground))] font-medium" : "text-[hsl(var(--muted-foreground))] hover:bg-[hsl(var(--accent))] hover:text-[hsl(var(--foreground))]",
+      collapsed && "justify-center px-0 mx-2",
+      className
+    );
+    const inner = /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+      icon && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "shrink-0 flex items-center justify-center w-4 h-4", children: icon }),
+      !collapsed && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex-1 min-w-0 truncate", children: label }),
+      !collapsed && badge !== void 0 && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[10px] px-1.5 py-0.5 rounded-full bg-[hsl(var(--primary))] bg-opacity-10 text-[hsl(var(--primary))] shrink-0 font-medium", children: badge })
+    ] });
+    if (href)
+      return /* @__PURE__ */ jsxRuntime.jsx("a", { href, className: cls, onClick, children: inner });
+    return /* @__PURE__ */ jsxRuntime.jsx("div", { ref, role: "button", tabIndex: 0, className: cls, onClick, ...props, children: inner });
+  }
+);
+SidebarItem.displayName = "SidebarItem";
+var Navbar = React14__default.default.forwardRef(
+  ({ className, sticky = false, border = true, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+    "nav",
+    {
+      ref,
+      className: cn(
+        "z-40 w-full h-14 flex items-center bg-[hsl(var(--background))]",
+        sticky && "sticky top-0",
+        border && "border-b border-[hsl(var(--border))]",
+        className
+      ),
+      ...props
+    }
+  )
+);
+Navbar.displayName = "Navbar";
+var NavbarBrand = React14__default.default.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: cn("flex items-center gap-2 px-4 shrink-0", className), ...props })
+);
+NavbarBrand.displayName = "NavbarBrand";
+var alignMap2 = {
+  start: "justify-start",
+  center: "justify-center flex-1",
+  end: "justify-end ml-auto"
+};
+var NavbarContent = React14__default.default.forwardRef(
+  ({ className, align = "start", ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      ref,
+      className: cn("flex items-center gap-1 px-2", alignMap2[align], className),
+      ...props
+    }
+  )
+);
+NavbarContent.displayName = "NavbarContent";
+var NavbarItem = React14__default.default.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: cn("flex items-center", className), ...props })
+);
+NavbarItem.displayName = "NavbarItem";
+var AppShellCtx = React14__default.default.createContext({
+  collapsed: false,
+  setCollapsed: () => {
+  }
+});
+var useAppShell = () => React14__default.default.useContext(AppShellCtx);
+var AppShell = React14__default.default.forwardRef(
+  ({ className, defaultCollapsed = false, children, ...props }, ref) => {
+    const [collapsed, setCollapsed] = React14__default.default.useState(defaultCollapsed);
+    return /* @__PURE__ */ jsxRuntime.jsx(AppShellCtx.Provider, { value: { collapsed, setCollapsed }, children: /* @__PURE__ */ jsxRuntime.jsx(
+      "div",
+      {
+        ref,
+        className: cn("flex h-screen w-full overflow-hidden bg-[hsl(var(--background))]", className),
+        ...props,
+        children
+      }
+    ) });
+  }
+);
+AppShell.displayName = "AppShell";
+var AppShellSidebar = React14__default.default.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: cn("shrink-0 h-full", className), ...props })
+);
+AppShellSidebar.displayName = "AppShellSidebar";
+var AppShellMain = React14__default.default.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: cn("flex-1 min-w-0 flex flex-col overflow-auto", className), ...props })
+);
+AppShellMain.displayName = "AppShellMain";
+var SplitPage = React14__default.default.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: cn("flex h-full w-full overflow-hidden", className), ...props })
+);
+SplitPage.displayName = "SplitPage";
+var SplitPageList = React14__default.default.forwardRef(
+  ({ className, width = "320px", style, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      ref,
+      className: cn("shrink-0 h-full overflow-auto border-r border-[hsl(var(--border))]", className),
+      style: { width, ...style },
+      ...props
+    }
+  )
+);
+SplitPageList.displayName = "SplitPageList";
+var SplitPageDetail = React14__default.default.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: cn("flex-1 min-w-0 h-full overflow-auto", className), ...props })
+);
+SplitPageDetail.displayName = "SplitPageDetail";
+var ResizeBox = React14__default.default.forwardRef(
+  ({ className, resize = "both", minWidth = 100, minHeight = 100, style, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      ref,
+      className: cn("overflow-auto relative", className),
+      style: { resize, minWidth, minHeight, ...style },
+      ...props
+    }
+  )
+);
+ResizeBox.displayName = "ResizeBox";
+var HandleIcon = () => /* @__PURE__ */ jsxRuntime.jsxs("svg", { width: "10", height: "10", viewBox: "0 0 10 10", fill: "none", "aria-hidden": true, children: [
+  /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M8 2L2 8", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" }),
+  /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M8 5L5 8", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" }),
+  /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M8 8L8 8", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" })
+] });
+var ResizeHandle = React14__default.default.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      ref,
+      className: cn(
+        "absolute bottom-0 right-0 w-5 h-5 flex items-center justify-center",
+        "cursor-se-resize text-[hsl(var(--muted-foreground))] opacity-50 hover:opacity-100 transition-opacity",
+        className
+      ),
+      ...props,
+      children: /* @__PURE__ */ jsxRuntime.jsx(HandleIcon, {})
+    }
+  )
+);
+ResizeHandle.displayName = "ResizeHandle";
+function Field({ label, description, error, required, children, className }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("flex flex-col gap-1.5", className), children: [
+    label && /* @__PURE__ */ jsxRuntime.jsx(FieldLabel, { required, children: label }),
+    children,
+    description && !error && /* @__PURE__ */ jsxRuntime.jsx(FieldDescription, { children: description }),
+    error && /* @__PURE__ */ jsxRuntime.jsx(FieldError, { children: error })
+  ] });
+}
+var FieldLabel = React14__default.default.forwardRef(
+  ({ className, required, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(
+    "label",
+    {
+      ref,
+      className: cn("text-sm font-medium leading-none text-[hsl(var(--foreground))]", className),
+      ...props,
+      children: [
+        children,
+        required && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "ml-1 text-[hsl(var(--destructive))]", children: "*" })
+      ]
+    }
+  )
+);
+FieldLabel.displayName = "FieldLabel";
+var FieldDescription = React14__default.default.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+    "p",
+    {
+      ref,
+      className: cn("text-xs text-[hsl(var(--muted-foreground))]", className),
+      ...props
+    }
+  )
+);
+FieldDescription.displayName = "FieldDescription";
+var FieldError = React14__default.default.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+    "p",
+    {
+      ref,
+      className: cn("text-xs text-[hsl(var(--destructive))]", className),
+      ...props
+    }
+  )
+);
+FieldError.displayName = "FieldError";
+function getStrength(value) {
+  const has = (re) => re.test(value);
+  const score = [value.length >= 8, has(/[A-Z]/), has(/[0-9]/), has(/[^A-Za-z0-9]/)].filter(Boolean).length;
+  if (score <= 1)
+    return { level: "weak", width: "w-1/3", color: "bg-[hsl(var(--destructive))]" };
+  if (score <= 3)
+    return { level: "medium", width: "w-2/3", color: "bg-yellow-500" };
+  return { level: "strong", width: "w-full", color: "bg-green-500" };
+}
+var PasswordInput = React14__default.default.forwardRef(
+  ({ className, strength, ...props }, ref) => {
+    const [show, setShow] = React14.useState(false);
+    const value = String(props.value ?? "");
+    const str = getStrength(value);
+    return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-1.5", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          Input,
+          {
+            ref,
+            type: show ? "text" : "password",
+            className: cn("pr-9", className),
+            ...props
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "button",
+          {
+            type: "button",
+            onClick: () => setShow((s) => !s),
+            className: "absolute right-2.5 top-1/2 -translate-y-1/2 text-[hsl(var(--muted-foreground))] hover:text-[hsl(var(--foreground))] transition-colors",
+            tabIndex: -1,
+            children: show ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.EyeOff, { className: "h-4 w-4" }) : /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Eye, { className: "h-4 w-4" })
+          }
+        )
+      ] }),
+      strength && value.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-1", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-1 w-full rounded-full bg-[hsl(var(--muted))]", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("h-full rounded-full transition-all", str.width, str.color) }) }),
+        /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-[hsl(var(--muted-foreground))] capitalize", children: str.level })
+      ] })
+    ] });
+  }
+);
+PasswordInput.displayName = "PasswordInput";
+var SearchInput = React14__default.default.forwardRef(
+  ({ className, shortcut, onClear, onChange, value: valueProp, defaultValue, ...props }, ref) => {
+    const [internalValue, setInternalValue] = React14.useState(defaultValue ?? "");
+    const isControlled = valueProp !== void 0;
+    const value = isControlled ? String(valueProp) : String(internalValue);
+    function handleChange(e) {
+      if (!isControlled)
+        setInternalValue(e.target.value);
+      onChange?.(e.target.value);
+    }
+    function handleClear() {
+      if (!isControlled)
+        setInternalValue("");
+      onChange?.("");
+      onClear?.();
+    }
+    return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative flex items-center", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Search, { className: "pointer-events-none absolute left-2.5 h-4 w-4 text-[hsl(var(--muted-foreground))]" }),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "input",
+        {
+          ref,
+          value,
+          onChange: handleChange,
+          className: cn(
+            "flex h-9 w-full rounded-[var(--radius)] border border-[hsl(var(--input))] bg-transparent pl-8 pr-8 text-sm shadow-sm transition-colors",
+            "placeholder:text-[hsl(var(--muted-foreground))]",
+            "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[hsl(var(--ring))]",
+            "disabled:cursor-not-allowed disabled:opacity-50",
+            className
+          ),
+          ...props
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute right-2.5 flex items-center", children: value ? /* @__PURE__ */ jsxRuntime.jsx(
+        "button",
+        {
+          type: "button",
+          onClick: handleClear,
+          className: "text-[hsl(var(--muted-foreground))] hover:text-[hsl(var(--foreground))] transition-colors",
+          children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.X, { className: "h-4 w-4" })
+        }
+      ) : shortcut ? /* @__PURE__ */ jsxRuntime.jsx("kbd", { className: "pointer-events-none rounded border border-[hsl(var(--border))] px-1.5 py-0.5 text-[10px] text-[hsl(var(--muted-foreground))]", children: shortcut }) : null })
+    ] });
+  }
+);
+SearchInput.displayName = "SearchInput";
+function formatBytes(bytes) {
+  if (bytes < 1024)
+    return `${bytes} B`;
+  if (bytes < 1024 * 1024)
+    return `${(bytes / 1024).toFixed(1)} KB`;
+  return `${(bytes / 1024 / 1024).toFixed(1)} MB`;
+}
+function filterBySize(files, maxSize) {
+  return maxSize ? files.filter((f) => f.size <= maxSize) : files;
+}
+function FileUpload({ accept, multiple, maxSize, onFiles, className, disabled }) {
+  const inputRef = React14.useRef(null);
+  const [dragging, setDragging] = React14.useState(false);
+  function handleFiles(raw) {
+    if (!raw)
+      return;
+    const files = filterBySize(Array.from(raw), maxSize);
+    onFiles?.(files);
+  }
+  function handleDrop(e) {
+    e.preventDefault();
+    setDragging(false);
+    if (!disabled)
+      handleFiles(e.dataTransfer.files);
+  }
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      role: "button",
+      tabIndex: disabled ? -1 : 0,
+      onClick: () => !disabled && inputRef.current?.click(),
+      onKeyDown: (e) => e.key === "Enter" && !disabled && inputRef.current?.click(),
+      onDragOver: (e) => {
+        e.preventDefault();
+        if (!disabled)
+          setDragging(true);
+      },
+      onDragLeave: () => setDragging(false),
+      onDrop: handleDrop,
+      className: cn(
+        "flex flex-col items-center justify-center gap-2 rounded-[var(--radius)] border-2 border-dashed border-[hsl(var(--border))] p-8 text-center transition-colors cursor-pointer",
+        dragging && "border-[hsl(var(--primary))] bg-[hsl(var(--accent))]",
+        disabled && "cursor-not-allowed opacity-50",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Upload, { className: "h-8 w-8 text-[hsl(var(--muted-foreground))]" }),
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+          /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm font-medium", children: "Drag files here or click to upload" }),
+          maxSize && /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "text-xs text-[hsl(var(--muted-foreground))]", children: [
+            "Max size: ",
+            formatBytes(maxSize)
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "input",
+          {
+            ref: inputRef,
+            type: "file",
+            accept,
+            multiple,
+            className: "hidden",
+            onChange: (e) => handleFiles(e.target.files),
+            disabled
+          }
+        )
+      ]
+    }
+  );
+}
+function FileUploadPreview({ files, onRemove, className }) {
+  if (!files.length)
+    return null;
+  return /* @__PURE__ */ jsxRuntime.jsx("ul", { className: cn("flex flex-col gap-1", className), children: files.map((file, i) => /* @__PURE__ */ jsxRuntime.jsxs("li", { className: "flex items-center justify-between rounded-[var(--radius)] border border-[hsl(var(--border))] px-3 py-2 text-sm", children: [
+    /* @__PURE__ */ jsxRuntime.jsx("span", { className: "min-w-0 truncate text-[hsl(var(--foreground))]", children: file.name }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "ml-2 flex shrink-0 items-center gap-2", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs text-[hsl(var(--muted-foreground))]", children: formatBytes(file.size) }),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "button",
+        {
+          type: "button",
+          onClick: () => onRemove(i),
+          className: "text-[hsl(var(--muted-foreground))] hover:text-[hsl(var(--destructive))] transition-colors",
+          children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.X, { className: "h-4 w-4" })
+        }
+      )
+    ] })
+  ] }, i)) });
+}
+var DAYS = ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"];
+var MONTHS = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"];
+function isSameDay(a, b) {
+  return a.getFullYear() === b.getFullYear() && a.getMonth() === b.getMonth() && a.getDate() === b.getDate();
+}
+function getDaysInMonth(year, month) {
+  return new Date(year, month + 1, 0).getDate();
+}
+function getFirstDayOfWeek(year, month) {
+  return new Date(year, month, 1).getDay();
+}
+function CalendarGrid({ year, month, selected, onSelect }) {
+  const today = /* @__PURE__ */ new Date();
+  const daysInMonth = getDaysInMonth(year, month);
+  const firstDay = getFirstDayOfWeek(year, month);
+  const cells = Array.from({ length: firstDay + daysInMonth }, (_, i) => i < firstDay ? null : i - firstDay + 1);
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-7 gap-0.5", children: [
+    DAYS.map((d) => /* @__PURE__ */ jsxRuntime.jsx("div", { className: "py-1 text-center text-xs font-medium text-[hsl(var(--muted-foreground))]", children: d }, d)),
+    cells.map((day, i) => {
+      if (!day)
+        return /* @__PURE__ */ jsxRuntime.jsx("div", {}, i);
+      const date = new Date(year, month, day);
+      const isToday = isSameDay(date, today);
+      const isSelected = selected && isSameDay(date, selected);
+      return /* @__PURE__ */ jsxRuntime.jsx(
+        "button",
+        {
+          type: "button",
+          onClick: () => onSelect(date),
+          className: cn(
+            "flex h-8 w-8 items-center justify-center rounded-[var(--radius)] text-sm transition-colors",
+            isSelected && "bg-[hsl(var(--primary))] text-[hsl(var(--primary-foreground))]",
+            !isSelected && isToday && "border border-[hsl(var(--primary))] text-[hsl(var(--primary))]",
+            !isSelected && !isToday && "hover:bg-[hsl(var(--accent))]"
+          ),
+          children: day
+        },
+        i
+      );
+    })
+  ] });
+}
+function DatePicker({ value, onChange, placeholder = "Pick a date", disabled, className }) {
+  const [open, setOpen] = React14.useState(false);
+  const now = value ?? /* @__PURE__ */ new Date();
+  const [view, setView] = React14.useState({ year: now.getFullYear(), month: now.getMonth() });
+  function navigate(delta) {
+    setView((v) => {
+      const date = new Date(v.year, v.month + delta);
+      return { year: date.getFullYear(), month: date.getMonth() };
+    });
+  }
+  function handleSelect(date) {
+    onChange?.(date);
+    setOpen(false);
+  }
+  return /* @__PURE__ */ jsxRuntime.jsxs(Popover, { open, onOpenChange: setOpen, children: [
+    /* @__PURE__ */ jsxRuntime.jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsxs(
+      Button,
+      {
+        variant: "outline",
+        disabled,
+        className: cn("w-full justify-start font-normal", !value && "text-[hsl(var(--muted-foreground))]", className),
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Calendar, { className: "mr-2 h-4 w-4 shrink-0" }),
+          value ? value.toLocaleDateString() : placeholder
+        ]
+      }
+    ) }),
+    /* @__PURE__ */ jsxRuntime.jsxs(PopoverContent, { className: "w-auto p-3", align: "start", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between mb-2", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("button", { type: "button", onClick: () => navigate(-1), className: "rounded p-1 hover:bg-[hsl(var(--accent))]", children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronLeft, { className: "h-4 w-4" }) }),
+        /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-sm font-medium", children: [
+          MONTHS[view.month],
+          " ",
+          view.year
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsx("button", { type: "button", onClick: () => navigate(1), className: "rounded p-1 hover:bg-[hsl(var(--accent))]", children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronRight, { className: "h-4 w-4" }) })
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsx(CalendarGrid, { year: view.year, month: view.month, selected: value, onSelect: handleSelect })
+    ] })
+  ] });
+}
+function FormField(props) {
+  return /* @__PURE__ */ jsxRuntime.jsx(reactHookForm.Controller, { ...props });
+}
+function FormItem({ className, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("flex flex-col gap-1.5", className), ...props });
+}
+var FormLabel = React14__default.default.forwardRef(
+  ({ className, error, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+    "label",
+    {
+      ref,
+      className: cn(
+        "text-sm font-medium leading-none",
+        error ? "text-[hsl(var(--destructive))]" : "text-[hsl(var(--foreground))]",
+        className
+      ),
+      ...props
+    }
+  )
+);
+FormLabel.displayName = "FormLabel";
+var FormControl = React14__default.default.forwardRef(
+  ({ ...props }, ref) => {
+    const id = React14.useId();
+    return /* @__PURE__ */ jsxRuntime.jsx("div", { ref, id, ...props });
+  }
+);
+FormControl.displayName = "FormControl";
+function FormDescription({ className, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("text-xs text-[hsl(var(--muted-foreground))]", className), ...props });
+}
+function FormMessage({ className, children, name }) {
+  const { formState } = reactHookForm.useFormContext();
+  const error = name ? formState.errors[name] : void 0;
+  const message = error?.message ? String(error.message) : children;
+  if (!message)
+    return null;
+  return /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("text-xs text-[hsl(var(--destructive))]", className), children: message });
+}
+var StepFormContext = React14.createContext(null);
+function useStepForm() {
+  const ctx = React14.useContext(StepFormContext);
+  if (!ctx)
+    throw new Error("useStepForm must be used within StepForm");
+  return ctx;
+}
+function StepForm({ steps, onSubmit, children, className }) {
+  const [currentStep, setCurrentStep] = React14.useState(0);
+  const totalSteps = steps.length;
+  const ctx = {
+    currentStep,
+    totalSteps,
+    steps,
+    next: () => setCurrentStep((s) => Math.min(s + 1, totalSteps - 1)),
+    prev: () => setCurrentStep((s) => Math.max(s - 1, 0)),
+    isFirst: currentStep === 0,
+    isLast: currentStep === totalSteps - 1
+  };
+  const childArray = React14__default.default.Children.toArray(children);
+  const currentChild = childArray[currentStep];
+  return /* @__PURE__ */ jsxRuntime.jsx(StepFormContext.Provider, { value: ctx, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("flex flex-col gap-6", className), children: [
+    /* @__PURE__ */ jsxRuntime.jsx(StepIndicator, { steps, currentStep }),
+    /* @__PURE__ */ jsxRuntime.jsx("div", { children: currentChild }),
+    /* @__PURE__ */ jsxRuntime.jsx(StepFormNavigation, { onSubmit })
+  ] }) });
+}
+function StepIndicator({ steps, currentStep }) {
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center gap-2", children: steps.map((label, i) => /* @__PURE__ */ jsxRuntime.jsxs(React14__default.default.Fragment, { children: [
+    i > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("h-px flex-1 bg-[hsl(var(--border))]", i <= currentStep && "bg-[hsl(var(--primary))]") }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-center gap-1", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn(
+        "flex h-7 w-7 items-center justify-center rounded-full text-xs font-medium border transition-colors",
+        i < currentStep && "bg-[hsl(var(--primary))] border-[hsl(var(--primary))] text-[hsl(var(--primary-foreground))]",
+        i === currentStep && "border-[hsl(var(--primary))] text-[hsl(var(--primary))]",
+        i > currentStep && "border-[hsl(var(--border))] text-[hsl(var(--muted-foreground))]"
+      ), children: i + 1 }),
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "hidden text-[10px] text-[hsl(var(--muted-foreground))] sm:block", children: label })
+    ] })
+  ] }, i)) });
+}
+function StepFormStep({ title, description, children }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-4", children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+      /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-base font-semibold text-[hsl(var(--foreground))]", children: title }),
+      description && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-[hsl(var(--muted-foreground))]", children: description })
+    ] }),
+    children
+  ] });
+}
+function StepFormNavigation({ onSubmit, submitLabel = "Submit" }) {
+  const { prev, next, isFirst, isLast } = useStepForm();
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-between", children: [
+    /* @__PURE__ */ jsxRuntime.jsx(Button, { type: "button", variant: "outline", onClick: prev, disabled: isFirst, children: "Previous" }),
+    isLast ? /* @__PURE__ */ jsxRuntime.jsx(Button, { type: "button", onClick: onSubmit, children: submitLabel }) : /* @__PURE__ */ jsxRuntime.jsx(Button, { type: "button", onClick: next, children: "Next" })
+  ] });
+}
+function ArrayField({
+  value,
+  onChange,
+  renderItem,
+  addLabel = "Add item",
+  maxItems,
+  defaultItem,
+  className
+}) {
+  function add() {
+    if (maxItems && value.length >= maxItems)
+      return;
+    onChange([...value, defaultItem]);
+  }
+  function remove(index) {
+    onChange(value.filter((_, i) => i !== index));
+  }
+  const atMax = maxItems !== void 0 && value.length >= maxItems;
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("flex flex-col gap-2", className), children: [
+    value.map((item, i) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-start gap-2", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-1 min-w-0", children: renderItem(item, i, () => remove(i)) }),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "button",
+        {
+          type: "button",
+          onClick: () => remove(i),
+          className: "mt-2 shrink-0 text-[hsl(var(--muted-foreground))] hover:text-[hsl(var(--destructive))] transition-colors",
+          children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.X, { className: "h-4 w-4" })
+        }
+      )
+    ] }, i)),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs(Button, { type: "button", variant: "outline", size: "sm", onClick: add, disabled: atMax, children: [
+        /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Plus, { className: "h-4 w-4" }),
+        addLabel
+      ] }),
+      maxItems && /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-xs text-[hsl(var(--muted-foreground))]", children: [
+        value.length,
+        "/",
+        maxItems
+      ] })
+    ] })
+  ] });
+}
+function ObjectField({
+  title,
+  description,
+  collapsible = false,
+  defaultOpen = true,
+  children,
+  className
+}) {
+  const [open, setOpen] = React14.useState(defaultOpen);
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("rounded-[var(--radius)] border border-[hsl(var(--border))] overflow-hidden", className), children: [
+    /* @__PURE__ */ jsxRuntime.jsxs(
+      "div",
+      {
+        className: cn(
+          "flex items-center justify-between px-4 py-3 bg-[hsl(var(--muted)/0.4)]",
+          collapsible && "cursor-pointer hover:bg-[hsl(var(--accent))] transition-colors"
+        ),
+        onClick: () => collapsible && setOpen((o) => !o),
+        role: collapsible ? "button" : void 0,
+        tabIndex: collapsible ? 0 : void 0,
+        onKeyDown: (e) => collapsible && e.key === "Enter" && setOpen((o) => !o),
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+            /* @__PURE__ */ jsxRuntime.jsx("h4", { className: "text-sm font-semibold text-[hsl(var(--foreground))]", children: title }),
+            description && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-[hsl(var(--muted-foreground))]", children: description })
+          ] }),
+          collapsible && (open ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronDown, { className: "h-4 w-4 text-[hsl(var(--muted-foreground))]" }) : /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronRight, { className: "h-4 w-4 text-[hsl(var(--muted-foreground))]" }))
+        ]
+      }
+    ),
+    (!collapsible || open) && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "p-4 flex flex-col gap-4", children })
+  ] });
+}
+function toLabel(key) {
+  return key.replace(/([A-Z])/g, " $1").replace(/^./, (s) => s.toUpperCase());
+}
+function getInputType(field) {
+  if (field instanceof z__namespace.ZodEmail)
+    return "email";
+  if (field instanceof z__namespace.ZodURL)
+    return "url";
+  return "text";
+}
+function unwrapOptional(field) {
+  if (field instanceof z__namespace.ZodOptional || field instanceof z__namespace.ZodNullable) {
+    return unwrapOptional(field.unwrap());
+  }
+  return field;
+}
+function FieldRenderer({ name, field, register, setValue, watch, error }) {
+  const inner = unwrapOptional(field);
+  const label = toLabel(name);
+  const isOptional = field instanceof z__namespace.ZodOptional;
+  if (inner instanceof z__namespace.ZodBoolean) {
+    const checked = Boolean(watch(name));
+    return /* @__PURE__ */ jsxRuntime.jsx(Field, { label, error, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
+        Checkbox,
+        {
+          id: name,
+          checked,
+          onCheckedChange: (v) => setValue(name, v)
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx("label", { htmlFor: name, className: "text-sm text-[hsl(var(--foreground))]", children: label })
+    ] }) });
+  }
+  if (inner instanceof z__namespace.ZodEnum) {
+    const options = inner.options ?? [];
+    const value = watch(name);
+    return /* @__PURE__ */ jsxRuntime.jsx(Field, { label, required: !isOptional, error, children: /* @__PURE__ */ jsxRuntime.jsxs(Select, { value, onValueChange: (v) => setValue(name, v), children: [
+      /* @__PURE__ */ jsxRuntime.jsx(SelectTrigger, { children: /* @__PURE__ */ jsxRuntime.jsx(SelectValue, { placeholder: `Select ${label.toLowerCase()}` }) }),
+      /* @__PURE__ */ jsxRuntime.jsx(SelectContent, { children: options.map((opt) => /* @__PURE__ */ jsxRuntime.jsx(SelectItem, { value: opt, children: opt }, opt)) })
+    ] }) });
+  }
+  if (inner instanceof z__namespace.ZodDate) {
+    const value = watch(name);
+    return /* @__PURE__ */ jsxRuntime.jsx(Field, { label, required: !isOptional, error, children: /* @__PURE__ */ jsxRuntime.jsx(DatePicker, { value, onChange: (d) => setValue(name, d), placeholder: `Select ${label.toLowerCase()}` }) });
+  }
+  if (inner instanceof z__namespace.ZodNumber) {
+    return /* @__PURE__ */ jsxRuntime.jsx(Field, { label, required: !isOptional, error, children: /* @__PURE__ */ jsxRuntime.jsx(Input, { type: "number", ...register(name, { valueAsNumber: true }) }) });
+  }
+  const inputType = getInputType(inner);
+  return /* @__PURE__ */ jsxRuntime.jsx(Field, { label, required: !isOptional, error, children: /* @__PURE__ */ jsxRuntime.jsx(Input, { type: inputType, ...register(name) }) });
+}
+function AutoForm({ schema, onSubmit, defaultValues, submitLabel = "Submit" }) {
+  const { register, handleSubmit, setValue, watch, formState } = reactHookForm.useForm({
+    resolver: zod.zodResolver(schema),
+    defaultValues
+  });
+  const shape = schema.shape;
+  return /* @__PURE__ */ jsxRuntime.jsxs("form", { onSubmit: handleSubmit((d) => onSubmit(d)), className: "flex flex-col gap-4", children: [
+    Object.entries(shape).map(([name, field]) => /* @__PURE__ */ jsxRuntime.jsx(
+      FieldRenderer,
+      {
+        name,
+        field,
+        register,
+        setValue,
+        watch,
+        error: formState.errors[name]?.message
+      },
+      name
+    )),
+    /* @__PURE__ */ jsxRuntime.jsx(Button, { type: "submit", children: submitLabel })
+  ] });
+}
+function DataTableColumnHeader({ column, title }) {
+  if (!column.getCanSort())
+    return /* @__PURE__ */ jsxRuntime.jsx("span", { children: title });
+  const sorted = column.getIsSorted();
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "button",
+    {
+      onClick: () => column.toggleSorting(sorted === "asc"),
+      className: "flex items-center gap-1 hover:text-[hsl(var(--foreground))]",
+      children: [
+        title,
+        sorted === "asc" ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ArrowUp, { className: "h-3 w-3" }) : sorted === "desc" ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ArrowDown, { className: "h-3 w-3" }) : /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ArrowUpDown, { className: "h-3 w-3 opacity-50" })
+      ]
+    }
+  );
+}
+function DataTablePagination({ table }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between px-2 py-3", children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-sm text-[hsl(var(--muted-foreground))]", children: [
+      "Page ",
+      table.getState().pagination.pageIndex + 1,
+      " of ",
+      table.getPageCount()
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs(
+        Select,
+        {
+          value: String(table.getState().pagination.pageSize),
+          onValueChange: (v) => table.setPageSize(Number(v)),
+          children: [
+            /* @__PURE__ */ jsxRuntime.jsx(SelectTrigger, { className: "h-8 w-[70px]", children: /* @__PURE__ */ jsxRuntime.jsx(SelectValue, {}) }),
+            /* @__PURE__ */ jsxRuntime.jsx(SelectContent, { children: [10, 20, 50].map((n) => /* @__PURE__ */ jsxRuntime.jsx(SelectItem, { value: String(n), children: n }, n)) })
+          ]
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx(Button, { variant: "outline", size: "icon", className: "h-8 w-8", onClick: () => table.previousPage(), disabled: !table.getCanPreviousPage(), children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronLeft, { className: "h-4 w-4" }) }),
+      /* @__PURE__ */ jsxRuntime.jsx(Button, { variant: "outline", size: "icon", className: "h-8 w-8", onClick: () => table.nextPage(), disabled: !table.getCanNextPage(), children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronRight, { className: "h-4 w-4" }) })
+    ] })
+  ] });
+}
+function DataTableToolbar({ table, searchColumn }) {
+  if (!searchColumn)
+    return null;
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "py-3", children: /* @__PURE__ */ jsxRuntime.jsx(
+    Input,
+    {
+      placeholder: "Search...",
+      value: table.getColumn(searchColumn)?.getFilterValue() ?? "",
+      onChange: (e) => table.getColumn(searchColumn)?.setFilterValue(e.target.value),
+      className: "max-w-sm h-8"
+    }
+  ) });
+}
+function DataTable({ columns, data, pageSize = 10, searchable, searchColumn, loading }) {
+  const [sorting, setSorting] = React14__default.default.useState([]);
+  const table = reactTable.useReactTable({
+    data,
+    columns,
+    getCoreRowModel: reactTable.getCoreRowModel(),
+    getPaginationRowModel: reactTable.getPaginationRowModel(),
+    getSortedRowModel: reactTable.getSortedRowModel(),
+    getFilteredRowModel: reactTable.getFilteredRowModel(),
+    onSortingChange: setSorting,
+    initialState: { pagination: { pageSize } },
+    state: { sorting }
+  });
+  if (loading)
+    return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "space-y-2", children: Array.from({ length: 5 }).map((_, i) => /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { className: "h-10 w-full" }, i)) });
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "w-full", children: [
+    searchable && /* @__PURE__ */ jsxRuntime.jsx(DataTableToolbar, { table, searchColumn }),
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "rounded-[var(--radius)] border border-[hsl(var(--border))] overflow-hidden", children: /* @__PURE__ */ jsxRuntime.jsxs("table", { className: "w-full text-sm", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("thead", { className: "bg-[hsl(var(--muted)/0.4)]", children: table.getHeaderGroups().map((hg) => /* @__PURE__ */ jsxRuntime.jsx("tr", { children: hg.headers.map((h) => /* @__PURE__ */ jsxRuntime.jsx("th", { className: "px-4 py-3 text-left font-medium text-[hsl(var(--muted-foreground))]", children: h.isPlaceholder ? null : reactTable.flexRender(h.column.columnDef.header, h.getContext()) }, h.id)) }, hg.id)) }),
+      /* @__PURE__ */ jsxRuntime.jsxs("tbody", { children: [
+        table.getRowModel().rows.map((row, i) => /* @__PURE__ */ jsxRuntime.jsx("tr", { className: cn("border-t border-[hsl(var(--border))] hover:bg-[hsl(var(--muted)/0.3)] transition-colors", i % 2 === 0 ? "" : "bg-[hsl(var(--muted)/0.1)]"), children: row.getVisibleCells().map((cell) => /* @__PURE__ */ jsxRuntime.jsx("td", { className: "px-4 py-3", children: reactTable.flexRender(cell.column.columnDef.cell, cell.getContext()) }, cell.id)) }, row.id)),
+        table.getRowModel().rows.length === 0 && /* @__PURE__ */ jsxRuntime.jsx("tr", { children: /* @__PURE__ */ jsxRuntime.jsx("td", { colSpan: columns.length, className: "px-4 py-8 text-center text-[hsl(var(--muted-foreground))]", children: "No results." }) })
+      ] })
+    ] }) }),
+    /* @__PURE__ */ jsxRuntime.jsx(DataTablePagination, { table })
+  ] });
+}
+function EditableCell({ value: initial, onSave }) {
+  const [editing, setEditing] = React14__default.default.useState(false);
+  const [val, setVal] = React14__default.default.useState(String(initial ?? ""));
+  const commit = () => {
+    onSave(val);
+    setEditing(false);
+  };
+  if (editing) {
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      "input",
+      {
+        autoFocus: true,
+        className: "w-full bg-transparent outline outline-1 outline-[hsl(var(--ring))] rounded px-1 text-sm",
+        value: val,
+        onChange: (e) => setVal(e.target.value),
+        onBlur: commit,
+        onKeyDown: (e) => {
+          if (e.key === "Enter")
+            commit();
+          if (e.key === "Escape")
+            setEditing(false);
+        }
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cursor-pointer w-full block", onDoubleClick: () => setEditing(true), children: String(initial ?? "") });
+}
+var selectionCol = () => ({
+  id: "_select",
+  header: ({ table }) => /* @__PURE__ */ jsxRuntime.jsx(Checkbox, { checked: table.getIsAllRowsSelected(), onCheckedChange: (v) => table.toggleAllRowsSelected(!!v) }),
+  cell: ({ row }) => /* @__PURE__ */ jsxRuntime.jsx(Checkbox, { checked: row.getIsSelected(), onCheckedChange: (v) => row.toggleSelected(!!v) }),
+  size: 40,
+  enableResizing: false
+});
+function DataGrid({ columns, data: initialData, onDataChange, editable, className }) {
+  const [data, setData] = React14__default.default.useState(initialData);
+  const [rowSelection, setRowSelection] = React14__default.default.useState({});
+  const columnResizeMode = "onChange";
+  const editableColumns = React14__default.default.useMemo(() => {
+    if (!editable)
+      return columns;
+    return columns.map((col) => ({
+      ...col,
+      cell: (info) => /* @__PURE__ */ jsxRuntime.jsx(
+        EditableCell,
+        {
+          value: info.getValue(),
+          onSave: (v) => {
+            const updated = data.map(
+              (row, i) => i === info.row.index ? { ...row, [info.column.id]: v } : row
+            );
+            setData(updated);
+            onDataChange?.(updated);
+          }
+        }
+      )
+    }));
+  }, [columns, data, editable, onDataChange]);
+  const allColumns = React14__default.default.useMemo(() => [selectionCol(), ...editableColumns], [editableColumns]);
+  const table = reactTable.useReactTable({
+    data,
+    columns: allColumns,
+    columnResizeMode,
+    getCoreRowModel: reactTable.getCoreRowModel(),
+    onRowSelectionChange: setRowSelection,
+    state: { rowSelection },
+    enableColumnResizing: true
+  });
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("overflow-auto rounded-[var(--radius)] border border-[hsl(var(--border))]", className), children: /* @__PURE__ */ jsxRuntime.jsxs("table", { className: "w-full text-sm", style: { width: table.getCenterTotalSize() }, children: [
+    /* @__PURE__ */ jsxRuntime.jsx("thead", { className: "bg-[hsl(var(--muted)/0.4)]", children: table.getHeaderGroups().map((hg) => /* @__PURE__ */ jsxRuntime.jsx("tr", { children: hg.headers.map((h) => /* @__PURE__ */ jsxRuntime.jsxs("th", { style: { width: h.getSize() }, className: "relative px-3 py-2 text-left font-medium text-[hsl(var(--muted-foreground))] border-r border-[hsl(var(--border))] last:border-r-0", children: [
+      h.isPlaceholder ? null : reactTable.flexRender(h.column.columnDef.header, h.getContext()),
+      h.column.getCanResize() && /* @__PURE__ */ jsxRuntime.jsx("div", { onMouseDown: h.getResizeHandler(), className: "absolute right-0 top-0 h-full w-1 cursor-col-resize hover:bg-[hsl(var(--primary)/0.4)]" })
+    ] }, h.id)) }, hg.id)) }),
+    /* @__PURE__ */ jsxRuntime.jsx("tbody", { children: table.getRowModel().rows.map((row) => /* @__PURE__ */ jsxRuntime.jsx("tr", { className: cn("border-t border-[hsl(var(--border))] hover:bg-[hsl(var(--muted)/0.3)] transition-colors", row.getIsSelected() && "bg-[hsl(var(--primary)/0.06)]"), children: row.getVisibleCells().map((cell) => /* @__PURE__ */ jsxRuntime.jsx("td", { style: { width: cell.column.getSize() }, className: "px-3 py-2 border-r border-[hsl(var(--border))] last:border-r-0", children: reactTable.flexRender(cell.column.columnDef.cell, cell.getContext()) }, cell.id)) }, row.id)) })
+  ] }) });
+}
+var EmptyStateIcon = React14__default.default.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: cn("flex h-12 w-12 items-center justify-center rounded-full bg-[hsl(var(--muted))] text-[hsl(var(--muted-foreground))]", className), ...props })
+);
+EmptyStateIcon.displayName = "EmptyStateIcon";
+function EmptyState({ icon, title, description, action, className }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("flex flex-col items-center justify-center gap-3 py-12 text-center", className), children: [
+    icon && /* @__PURE__ */ jsxRuntime.jsx(EmptyStateIcon, { children: icon }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-1", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "font-semibold text-[hsl(var(--foreground))]", children: title }),
+      description && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-[hsl(var(--muted-foreground))]", children: description })
+    ] }),
+    action && /* @__PURE__ */ jsxRuntime.jsx(Button, { onClick: action.onClick, className: "mt-1", children: action.label })
+  ] });
+}
+var PropertyList = React14__default.default.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("dl", { ref, className: cn("divide-y divide-[hsl(var(--border))]", className), ...props })
+);
+PropertyList.displayName = "PropertyList";
+function PropertyItem({ label, value, orientation = "horizontal", className }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("py-3", orientation === "horizontal" ? "flex gap-4" : "space-y-1", className), children: [
+    /* @__PURE__ */ jsxRuntime.jsx("dt", { className: cn("text-sm font-medium text-[hsl(var(--muted-foreground))] shrink-0", orientation === "horizontal" && "w-[40%]"), children: label }),
+    /* @__PURE__ */ jsxRuntime.jsx("dd", { className: "text-sm text-[hsl(var(--foreground))] min-w-0", children: value })
+  ] });
+}
+var dotColors = {
+  default: "bg-[hsl(var(--primary))]",
+  success: "bg-green-500",
+  error: "bg-red-500",
+  warning: "bg-yellow-500"
+};
+var TimelineContent = React14__default.default.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: cn("pb-1", className), ...props })
+);
+TimelineContent.displayName = "TimelineContent";
+function TimelineConnector({ className }) {
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("absolute left-[7px] top-5 bottom-0 w-0.5 bg-[hsl(var(--border))]", className) });
+}
+function TimelineItem({ icon, title, description, timestamp, variant = "default", isLast, className }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("relative flex gap-4", !isLast && "pb-6", className), children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative flex-none", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("h-4 w-4 rounded-full border-2 border-[hsl(var(--background))] flex items-center justify-center mt-0.5", dotColors[variant]), children: icon && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-white text-[8px]", children: icon }) }),
+      !isLast && /* @__PURE__ */ jsxRuntime.jsx(TimelineConnector, {})
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsxs(TimelineContent, { children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-baseline justify-between gap-2", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm font-medium text-[hsl(var(--foreground))]", children: title }),
+        timestamp && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs text-[hsl(var(--muted-foreground))] shrink-0", children: timestamp })
+      ] }),
+      description && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-[hsl(var(--muted-foreground))] mt-0.5", children: description })
+    ] })
+  ] });
+}
+function Timeline({ children, className }) {
+  const items = React14__default.default.Children.toArray(children);
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("", className), children: items.map(
+    (child, i) => React14__default.default.isValidElement(child) ? React14__default.default.cloneElement(child, { isLast: i === items.length - 1 }) : child
+  ) });
+}
+function Stat({ label, value, trend, trendLabel, icon, description, className }) {
+  const isPositive = trend !== void 0 && trend >= 0;
+  return /* @__PURE__ */ jsxRuntime.jsx(Card, { className: cn("", className), children: /* @__PURE__ */ jsxRuntime.jsxs(CardContent, { className: "p-5", children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-start justify-between", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-1 min-w-0", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm font-medium text-[hsl(var(--muted-foreground))] truncate", children: label }),
+        /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-2xl font-bold text-[hsl(var(--foreground))]", children: value })
+      ] }),
+      icon && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-[hsl(var(--muted-foreground))] shrink-0 ml-2", children: icon })
+    ] }),
+    (trend !== void 0 || description) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-2 flex items-center gap-1", children: [
+      trend !== void 0 && /* @__PURE__ */ jsxRuntime.jsxs("span", { className: cn("flex items-center gap-0.5 text-xs font-medium", isPositive ? "text-green-600" : "text-red-600"), children: [
+        isPositive ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.TrendingUp, { className: "h-3 w-3" }) : /* @__PURE__ */ jsxRuntime.jsx(lucideReact.TrendingDown, { className: "h-3 w-3" }),
+        Math.abs(trend),
+        "%"
+      ] }),
+      trendLabel && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs text-[hsl(var(--muted-foreground))]", children: trendLabel }),
+      description && !trendLabel && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs text-[hsl(var(--muted-foreground))]", children: description })
+    ] })
+  ] }) });
+}
+function StatGroup({ className, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("grid gap-4", className), style: { gridTemplateColumns: "repeat(auto-fill, minmax(min(100%, 200px), 1fr))" }, ...props });
+}
+var sizeMap2 = {
+  sm: { avatar: "h-7 w-7", name: "text-sm", subtitle: "text-xs" },
+  md: { avatar: "h-9 w-9", name: "text-sm font-medium", subtitle: "text-xs" },
+  lg: { avatar: "h-12 w-12", name: "text-base font-medium", subtitle: "text-sm" }
+};
+function Persona({ name, subtitle, src, size = "md", badge, className }) {
+  const s = sizeMap2[size];
+  const initials = name.split(" ").map((w) => w[0]).slice(0, 2).join("").toUpperCase();
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("flex items-center gap-2.5", className), children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative shrink-0", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs(Avatar, { className: s.avatar, children: [
+        src && /* @__PURE__ */ jsxRuntime.jsx(AvatarImage, { src, alt: name }),
+        /* @__PURE__ */ jsxRuntime.jsx(AvatarFallback, { className: "text-xs", children: initials })
+      ] }),
+      badge && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute -bottom-0.5 -right-0.5", children: badge })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "min-w-0", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("truncate text-[hsl(var(--foreground))]", s.name), children: name }),
+      subtitle && /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("truncate text-[hsl(var(--muted-foreground))]", s.subtitle), children: subtitle })
+    ] })
+  ] });
+}
+var colorMap = {
+  default: "bg-[hsl(var(--muted))] text-[hsl(var(--muted-foreground))]",
+  primary: "bg-[hsl(var(--primary)/0.12)] text-[hsl(var(--primary))]",
+  success: "bg-green-100 text-green-700 dark:bg-green-900/30 dark:text-green-400",
+  warning: "bg-yellow-100 text-yellow-700 dark:bg-yellow-900/30 dark:text-yellow-400",
+  error: "bg-red-100 text-red-700 dark:bg-red-900/30 dark:text-red-400",
+  purple: "bg-purple-100 text-purple-700 dark:bg-purple-900/30 dark:text-purple-400"
+};
+var sizeMap3 = {
+  sm: "h-7 w-7 [&>*]:h-3.5 [&>*]:w-3.5",
+  md: "h-10 w-10 [&>*]:h-5 [&>*]:w-5",
+  lg: "h-14 w-14 [&>*]:h-7 [&>*]:w-7"
+};
+function IconBadge({ icon, color = "default", size = "md", className }) {
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("inline-flex items-center justify-center rounded-full shrink-0", colorMap[color], sizeMap3[size], className), children: icon });
+}
+function StructuredListSection({ title, children, className }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("", className), children: [
+    title && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "px-4 pb-1 pt-4 text-xs font-semibold uppercase tracking-wider text-[hsl(var(--muted-foreground))]", children: title }),
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "rounded-[var(--radius)] border border-[hsl(var(--border))] overflow-hidden divide-y divide-[hsl(var(--border))]", children })
+  ] });
+}
+function StructuredListItem({ left, title, description, right, onClick, className }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      onClick,
+      className: cn("flex items-center gap-3 px-4 py-3 bg-[hsl(var(--card))]", onClick && "cursor-pointer hover:bg-[hsl(var(--muted)/0.5)] transition-colors", className),
+      children: [
+        left && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "shrink-0", children: left }),
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "min-w-0 flex-1", children: [
+          /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm font-medium text-[hsl(var(--foreground))] truncate", children: title }),
+          description && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-[hsl(var(--muted-foreground))] truncate", children: description })
+        ] }),
+        right && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "shrink-0 text-[hsl(var(--muted-foreground))]", children: right })
+      ]
+    }
+  );
+}
+var StructuredList = React14__default.default.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: cn("space-y-4", className), ...props })
+);
+StructuredList.displayName = "StructuredList";
+function CommandItem({ icon, label, description, shortcut, active, onClick, className }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      onClick,
+      className: cn(
+        "flex items-center gap-3 rounded-[var(--radius)] px-3 py-2 cursor-pointer transition-colors",
+        active ? "bg-[hsl(var(--accent))] text-[hsl(var(--accent-foreground))]" : "hover:bg-[hsl(var(--accent)/0.6)]",
+        className
+      ),
+      children: [
+        icon && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "shrink-0 text-[hsl(var(--muted-foreground))] h-4 w-4 flex items-center justify-center", children: icon }),
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "min-w-0 flex-1", children: [
+          /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm font-medium truncate", children: label }),
+          description && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-[hsl(var(--muted-foreground))] truncate", children: description })
+        ] }),
+        shortcut && /* @__PURE__ */ jsxRuntime.jsx("kbd", { className: "shrink-0 pointer-events-none inline-flex h-5 items-center gap-1 rounded border border-[hsl(var(--border))] bg-[hsl(var(--muted))] px-1.5 text-[10px] font-medium text-[hsl(var(--muted-foreground))]", children: shortcut })
+      ]
+    }
+  );
+}
+var bannerVariants = classVarianceAuthority.cva(
+  "relative flex items-start gap-3 rounded-lg border px-4 py-3.5 text-sm transition-all",
+  {
+    variants: {
+      variant: {
+        info: "border-blue-200/80   bg-blue-50/60   dark:border-blue-800/60  dark:bg-blue-950/30",
+        success: "border-green-200/80  bg-green-50/60  dark:border-green-800/60 dark:bg-green-950/30",
+        warning: "border-yellow-200/80 bg-yellow-50/60 dark:border-yellow-800/60 dark:bg-yellow-950/30",
+        error: "border-red-200/80    bg-red-50/60    dark:border-red-800/60   dark:bg-red-950/30",
+        neutral: "border-[hsl(var(--border))] bg-[hsl(var(--muted)/0.5)]"
+      }
+    },
+    defaultVariants: { variant: "info" }
+  }
+);
+var accentVariants = classVarianceAuthority.cva("absolute left-0 top-[12%] bottom-[12%] w-[3px] rounded-full", {
+  variants: {
+    variant: {
+      info: "bg-blue-500",
+      success: "bg-green-500",
+      warning: "bg-yellow-500",
+      error: "bg-red-500",
+      neutral: "bg-[hsl(var(--foreground)/0.3)]"
+    }
+  },
+  defaultVariants: { variant: "info" }
+});
+var iconVariants = classVarianceAuthority.cva("mt-0.5 h-4 w-4 shrink-0", {
+  variants: {
+    variant: {
+      info: "text-blue-500   dark:text-blue-400",
+      success: "text-green-500  dark:text-green-400",
+      warning: "text-yellow-500 dark:text-yellow-400",
+      error: "text-red-500    dark:text-red-400",
+      neutral: "text-[hsl(var(--muted-foreground))]"
+    }
+  },
+  defaultVariants: { variant: "info" }
+});
+var titleVariants = classVarianceAuthority.cva("font-semibold leading-snug", {
+  variants: {
+    variant: {
+      info: "text-blue-900   dark:text-blue-100",
+      success: "text-green-900  dark:text-green-100",
+      warning: "text-yellow-900 dark:text-yellow-100",
+      error: "text-red-900    dark:text-red-100",
+      neutral: "text-[hsl(var(--foreground))]"
+    }
+  },
+  defaultVariants: { variant: "info" }
+});
+var descriptionVariants = classVarianceAuthority.cva("mt-0.5 leading-snug opacity-80", {
+  variants: {
+    variant: {
+      info: "text-blue-800   dark:text-blue-200",
+      success: "text-green-800  dark:text-green-200",
+      warning: "text-yellow-800 dark:text-yellow-200",
+      error: "text-red-800    dark:text-red-200",
+      neutral: "text-[hsl(var(--muted-foreground))]"
+    }
+  },
+  defaultVariants: { variant: "info" }
+});
+var actionVariants = classVarianceAuthority.cva(
+  "inline-flex items-center gap-1 text-xs font-medium underline-offset-2 hover:underline transition-opacity hover:opacity-80",
+  {
+    variants: {
+      variant: {
+        info: "text-blue-700   dark:text-blue-300",
+        success: "text-green-700  dark:text-green-300",
+        warning: "text-yellow-700 dark:text-yellow-300",
+        error: "text-red-700    dark:text-red-300",
+        neutral: "text-[hsl(var(--foreground))]"
+      }
+    },
+    defaultVariants: { variant: "info" }
+  }
+);
+var ICONS = {
+  info: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Info, { className: "h-4 w-4" }),
+  success: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.CheckCircle2, { className: "h-4 w-4" }),
+  warning: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.AlertTriangle, { className: "h-4 w-4" }),
+  error: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.XCircle, { className: "h-4 w-4" }),
+  neutral: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Info, { className: "h-4 w-4" })
+};
+function Banner({
+  variant = "info",
+  title,
+  description,
+  dismissible,
+  onDismiss,
+  action,
+  icon = true,
+  className,
+  children
+}) {
+  const [dismissed, setDismissed] = React14__default.default.useState(false);
+  const [exiting, setExiting] = React14__default.default.useState(false);
+  const handleDismiss = () => {
+    setExiting(true);
+    setTimeout(() => {
+      setDismissed(true);
+      onDismiss?.();
+    }, 200);
+  };
+  if (dismissed)
+    return null;
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      className: cn(
+        bannerVariants({ variant }),
+        "pl-[18px]",
+        exiting && "opacity-0 translate-x-1 scale-[0.98]",
+        "transition-all duration-200",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: accentVariants({ variant }), "aria-hidden": true }),
+        icon && /* @__PURE__ */ jsxRuntime.jsx("span", { className: iconVariants({ variant }), children: ICONS[variant] }),
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "min-w-0 flex-1 space-y-1", children: [
+          title && /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn(titleVariants({ variant }), "text-sm"), children: title }),
+          description && /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn(descriptionVariants({ variant }), "text-sm"), children: description }),
+          children && /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn(descriptionVariants({ variant }), "text-sm"), children }),
+          action && /* @__PURE__ */ jsxRuntime.jsxs(
+            "button",
+            {
+              onClick: action.onClick,
+              className: cn(actionVariants({ variant }), "mt-1.5"),
+              children: [
+                action.label,
+                action.icon !== false && /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ArrowRight, { className: "h-3 w-3" })
+              ]
+            }
+          )
+        ] }),
+        dismissible && /* @__PURE__ */ jsxRuntime.jsx(
+          "button",
+          {
+            onClick: handleDismiss,
+            "aria-label": "Dismiss",
+            className: "shrink-0 rounded-md p-0.5 text-[hsl(var(--muted-foreground))] opacity-60 transition-opacity hover:opacity-100 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[hsl(var(--ring))]",
+            children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.X, { className: "h-4 w-4" })
+          }
+        )
+      ]
+    }
+  );
+}
+function Toaster(props) {
+  const ctx = useBlinkUI?.();
+  const dark = ctx?.darkMode === "dark";
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    sonner.Toaster,
+    {
+      theme: dark ? "dark" : "light",
+      position: "bottom-right",
+      toastOptions: {
+        classNames: {
+          toast: [
+            "group flex items-start gap-3 rounded-lg border px-4 py-3.5 text-sm shadow-md",
+            "border-[hsl(var(--border))] bg-[hsl(var(--card))] text-[hsl(var(--card-foreground))]"
+          ].join(" "),
+          title: "font-semibold text-sm leading-snug",
+          description: "text-xs text-[hsl(var(--muted-foreground))] mt-0.5 leading-snug",
+          actionButton: [
+            "mt-2 inline-flex items-center gap-1 text-xs font-medium",
+            "text-[hsl(var(--primary))] underline-offset-2 hover:underline"
+          ].join(" "),
+          cancelButton: "mt-2 text-xs text-[hsl(var(--muted-foreground))] hover:opacity-80",
+          closeButton: "text-[hsl(var(--muted-foreground))] opacity-60 hover:opacity-100 transition-opacity",
+          error: "border-red-200/80 bg-red-50/60 dark:border-red-800/60 dark:bg-red-950/30",
+          success: "border-green-200/80 bg-green-50/60 dark:border-green-800/60 dark:bg-green-950/30",
+          warning: "border-yellow-200/80 bg-yellow-50/60 dark:border-yellow-800/60 dark:bg-yellow-950/30",
+          info: "border-blue-200/80 bg-blue-50/60 dark:border-blue-800/60 dark:bg-blue-950/30"
+        }
+      },
+      ...props
+    }
+  );
+}
+function LoadingOverlay({ loading, text, fullPage, children, className }) {
+  if (fullPage) {
+    return loading ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("fixed inset-0 z-50 flex items-center justify-center bg-background/80 backdrop-blur-sm", className), children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-center gap-2", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Loader2, { className: "h-8 w-8 animate-spin text-[hsl(var(--primary))]" }),
+      text && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-[hsl(var(--muted-foreground))]", children: text })
+    ] }) }) : null;
+  }
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("relative", className), children: [
+    children,
+    loading && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute inset-0 z-10 flex items-center justify-center rounded-[var(--radius)] bg-[hsl(var(--background)/0.8)] backdrop-blur-[2px]", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-center gap-2", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Loader2, { className: "h-6 w-6 animate-spin text-[hsl(var(--primary))]" }),
+      text && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-[hsl(var(--muted-foreground))]", children: text })
+    ] }) })
+  ] });
+}
+function StepperStep({ index, current, total, title, description }) {
+  const done = index < current;
+  const active = index === current;
+  const isLast = index === total - 1;
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-start gap-3 flex-1 min-w-0", children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-center shrink-0", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn(
+        "h-8 w-8 rounded-full flex items-center justify-center border-2 text-sm font-semibold transition-colors",
+        done && "bg-[hsl(var(--primary))] border-[hsl(var(--primary))] text-[hsl(var(--primary-foreground))]",
+        active && "border-[hsl(var(--primary))] text-[hsl(var(--primary))] bg-transparent",
+        !done && !active && "border-[hsl(var(--muted-foreground)/0.4)] text-[hsl(var(--muted-foreground))] bg-transparent"
+      ), children: done ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Check, { className: "h-4 w-4" }) : index + 1 }),
+      !isLast && /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("w-0.5 flex-1 min-h-[16px] mt-1", done ? "bg-[hsl(var(--primary))]" : "bg-[hsl(var(--border))]") })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "min-w-0 pb-4", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("text-sm font-medium", active ? "text-[hsl(var(--foreground))]" : "text-[hsl(var(--muted-foreground))]"), children: title }),
+      description && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-[hsl(var(--muted-foreground))] mt-0.5", children: description })
+    ] })
+  ] });
+}
+function Stepper({ currentStep, steps, className }) {
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("flex gap-0", className), children: steps.map((step, i) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("flex items-start", i < steps.length - 1 && "flex-1"), children: [
+    /* @__PURE__ */ jsxRuntime.jsx(StepperStep, { ...step, index: i, current: currentStep, total: steps.length }),
+    i < steps.length - 1 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("flex-1 h-0.5 mt-4 mx-2", i < currentStep ? "bg-[hsl(var(--primary))]" : "bg-[hsl(var(--border))]") })
+  ] }, i)) });
+}
+function BreadcrumbItem({ href, label, active, className }) {
+  return /* @__PURE__ */ jsxRuntime.jsx("li", { className: cn("flex items-center", className), children: href && !active ? /* @__PURE__ */ jsxRuntime.jsx("a", { href, className: "text-sm text-[hsl(var(--muted-foreground))] hover:text-[hsl(var(--foreground))] transition-colors", children: label }) : /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm text-[hsl(var(--foreground))] font-medium", children: label }) });
+}
+function BreadcrumbPage({ children, className }) {
+  return /* @__PURE__ */ jsxRuntime.jsx("li", { "aria-current": "page", className: cn("flex items-center text-sm font-medium text-[hsl(var(--foreground))]", className), children });
+}
+function BreadcrumbSeparator({ className }) {
+  return /* @__PURE__ */ jsxRuntime.jsx("li", { role: "presentation", "aria-hidden": "true", className: cn("flex items-center text-[hsl(var(--muted-foreground))]", className), children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronRight, { className: "h-3.5 w-3.5" }) });
+}
+function Breadcrumb({ children, className }) {
+  const items = React14__default.default.Children.toArray(children);
+  const withSeparators = [];
+  items.forEach((item, i) => {
+    withSeparators.push(item);
+    if (i < items.length - 1)
+      withSeparators.push(/* @__PURE__ */ jsxRuntime.jsx(BreadcrumbSeparator, {}, `sep-${i}`));
+  });
+  return /* @__PURE__ */ jsxRuntime.jsx("nav", { "aria-label": "breadcrumb", children: /* @__PURE__ */ jsxRuntime.jsx("ol", { className: cn("flex flex-wrap items-center gap-1", className), children: withSeparators }) });
+}
+function HotkeyBadge({ children, className }) {
+  return /* @__PURE__ */ jsxRuntime.jsx("kbd", { className: cn(
+    "inline-flex items-center justify-center rounded border border-[hsl(var(--border))] bg-[hsl(var(--muted))] px-1.5 py-0.5 text-[11px] font-medium text-[hsl(var(--muted-foreground))] shadow-[0_1px_0_rgba(0,0,0,0.1)] min-w-[20px] h-5",
+    className
+  ), children });
+}
+function Hotkeys({ keys, className }) {
+  return /* @__PURE__ */ jsxRuntime.jsx("span", { className: cn("inline-flex items-center gap-0.5", className), children: keys.map((key, i) => /* @__PURE__ */ jsxRuntime.jsx(HotkeyBadge, { children: key }, i)) });
+}
+var textOps = ["contains", "equals", "starts with"];
+var numOps = ["=", ">", "<", ">=", "<="];
+function AddFilterPopover({ filters, onAdd }) {
+  const [open, setOpen] = React14__default.default.useState(false);
+  const [key, setKey] = React14__default.default.useState("");
+  const [op, setOp] = React14__default.default.useState("");
+  const [val, setVal] = React14__default.default.useState("");
+  const def = filters.find((f) => f.key === key);
+  const ops = def?.type === "number" ? numOps : textOps;
+  const handleAdd = () => {
+    if (!key || !val)
+      return;
+    onAdd({ key, operator: op || ops[0], value: val });
+    setKey("");
+    setOp("");
+    setVal("");
+    setOpen(false);
+  };
+  return /* @__PURE__ */ jsxRuntime.jsxs(Popover, { open, onOpenChange: setOpen, children: [
+    /* @__PURE__ */ jsxRuntime.jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsxs(Button, { variant: "outline", size: "sm", className: "h-7 gap-1 text-xs", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Plus, { className: "h-3.5 w-3.5" }),
+      "Add Filter"
+    ] }) }),
+    /* @__PURE__ */ jsxRuntime.jsxs(PopoverContent, { className: "w-72 p-3 space-y-2", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs(Select, { value: key, onValueChange: setKey, children: [
+        /* @__PURE__ */ jsxRuntime.jsx(SelectTrigger, { className: "h-8 text-xs", children: /* @__PURE__ */ jsxRuntime.jsx(SelectValue, { placeholder: "Field" }) }),
+        /* @__PURE__ */ jsxRuntime.jsx(SelectContent, { children: filters.map((f) => /* @__PURE__ */ jsxRuntime.jsx(SelectItem, { value: f.key, children: f.label }, f.key)) })
+      ] }),
+      key && /* @__PURE__ */ jsxRuntime.jsxs(Select, { value: op || ops[0], onValueChange: setOp, children: [
+        /* @__PURE__ */ jsxRuntime.jsx(SelectTrigger, { className: "h-8 text-xs", children: /* @__PURE__ */ jsxRuntime.jsx(SelectValue, {}) }),
+        /* @__PURE__ */ jsxRuntime.jsx(SelectContent, { children: ops.map((o) => /* @__PURE__ */ jsxRuntime.jsx(SelectItem, { value: o, children: o }, o)) })
+      ] }),
+      key && def?.type === "select" ? /* @__PURE__ */ jsxRuntime.jsxs(Select, { value: val, onValueChange: setVal, children: [
+        /* @__PURE__ */ jsxRuntime.jsx(SelectTrigger, { className: "h-8 text-xs", children: /* @__PURE__ */ jsxRuntime.jsx(SelectValue, { placeholder: "Value" }) }),
+        /* @__PURE__ */ jsxRuntime.jsx(SelectContent, { children: def.options?.map((o) => /* @__PURE__ */ jsxRuntime.jsx(SelectItem, { value: o.value, children: o.label }, o.value)) })
+      ] }) : key && /* @__PURE__ */ jsxRuntime.jsx(Input, { type: def?.type === "number" ? "number" : def?.type === "date" ? "date" : "text", className: "h-8 text-xs", value: val, onChange: (e) => setVal(e.target.value), placeholder: "Value" }),
+      /* @__PURE__ */ jsxRuntime.jsx(Button, { size: "sm", className: "w-full h-7 text-xs", onClick: handleAdd, disabled: !key || !val, children: "Apply" })
+    ] })
+  ] });
+}
+function FilterBadge({ filter, def, onRemove }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "inline-flex items-center gap-1 rounded-full border border-[hsl(var(--border))] bg-[hsl(var(--muted))] px-2.5 py-0.5 text-xs font-medium text-[hsl(var(--foreground))]", children: [
+    /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[hsl(var(--muted-foreground))]", children: def?.label ?? filter.key }),
+    /* @__PURE__ */ jsxRuntime.jsx("span", { children: filter.operator }),
+    /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-semibold", children: filter.value }),
+    /* @__PURE__ */ jsxRuntime.jsx("button", { onClick: onRemove, className: "ml-0.5 rounded-full hover:text-[hsl(var(--destructive))]", children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.X, { className: "h-3 w-3" }) })
+  ] });
+}
+function Filters({ filters, value, onChange, className }) {
+  const remove = (i) => onChange(value.filter((_, idx) => idx !== i));
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("flex flex-wrap items-center gap-2", className), children: [
+    value.map((fv, i) => /* @__PURE__ */ jsxRuntime.jsx(FilterBadge, { filter: fv, def: filters.find((f) => f.key === fv.key), onRemove: () => remove(i) }, i)),
+    /* @__PURE__ */ jsxRuntime.jsx(AddFilterPopover, { filters, onAdd: (fv) => onChange([...value, fv]) })
+  ] });
+}
+function BulkActions({ count, actions, onClear, className }) {
+  if (count === 0)
+    return null;
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("fixed bottom-6 left-1/2 -translate-x-1/2 z-50 flex items-center gap-2 rounded-full border border-[hsl(var(--border))] bg-[hsl(var(--card))] px-4 py-2 shadow-lg", className), children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-sm font-medium text-[hsl(var(--foreground))] pr-2 border-r border-[hsl(var(--border))]", children: [
+      count,
+      " selected"
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center gap-1", children: actions.map((action, i) => /* @__PURE__ */ jsxRuntime.jsxs(
+      Button,
+      {
+        variant: action.variant === "destructive" ? "destructive" : "ghost",
+        size: "sm",
+        className: "h-7 gap-1.5 text-xs rounded-full px-3",
+        onClick: action.onClick,
+        children: [
+          action.icon,
+          action.label
+        ]
+      },
+      i
+    )) }),
+    /* @__PURE__ */ jsxRuntime.jsx("button", { onClick: onClear, className: "ml-1 rounded-full p-0.5 text-[hsl(var(--muted-foreground))] hover:text-[hsl(var(--foreground))] transition-colors", children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.X, { className: "h-4 w-4" }) })
+  ] });
+}
+function ToggleButton({ pressed, onClick, disabled, children, className }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "button",
+    {
+      type: "button",
+      "aria-pressed": pressed,
+      disabled,
+      onClick,
+      className: cn(
+        "inline-flex items-center justify-center gap-1.5 rounded-[var(--radius)] px-3 py-1.5 text-sm font-medium transition-colors border",
+        "disabled:pointer-events-none disabled:opacity-50",
+        pressed ? "bg-[hsl(var(--primary))] text-[hsl(var(--primary-foreground))] border-[hsl(var(--primary))]" : "bg-transparent text-[hsl(var(--foreground))] border-[hsl(var(--border))] hover:bg-[hsl(var(--accent))] hover:text-[hsl(var(--accent-foreground))]",
+        className
+      ),
+      children
+    }
+  );
+}
+function ToggleButtonGroup(props) {
+  const { children, className } = props;
+  const isPressed = (val) => props.type === "multiple" ? props.value.includes(val) : props.value === val;
+  const handleClick = (val) => {
+    if (props.type === "multiple") {
+      const current = props.value;
+      props.onChange(current.includes(val) ? current.filter((v) => v !== val) : [...current, val]);
+    } else {
+      props.onChange(val);
+    }
+  };
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("inline-flex items-center gap-1 rounded-[var(--radius)] border border-[hsl(var(--border))] bg-[hsl(var(--muted)/0.4)] p-0.5", className), children: React14__default.default.Children.map(children, (child) => {
+    if (!React14__default.default.isValidElement(child))
+      return child;
+    const tb = child;
+    return React14__default.default.cloneElement(tb, {
+      pressed: isPressed(tb.props.value),
+      onClick: () => handleClick(tb.props.value)
+    });
+  }) });
+}
+function useCommandBar() {
+  const [open, setOpen] = React14__default.default.useState(false);
+  React14__default.default.useEffect(() => {
+    const handler = (e) => {
+      if ((e.metaKey || e.ctrlKey) && e.key === "k") {
+        e.preventDefault();
+        setOpen((o) => !o);
+      }
+    };
+    window.addEventListener("keydown", handler);
+    return () => window.removeEventListener("keydown", handler);
+  }, []);
+  return { open, setOpen };
+}
+function CommandBarEmpty({ children = "No results found." }) {
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "py-6 text-center text-sm text-[hsl(var(--muted-foreground))]", children });
+}
+function CommandBarGroup({ heading, children }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "px-2 py-1", children: [
+    /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mb-1 px-2 text-xs font-semibold text-[hsl(var(--muted-foreground))]", children: heading }),
+    children
+  ] });
+}
+function CommandBarItem({ icon, label, shortcut, onSelect, active, className }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "button",
+    {
+      onClick: onSelect,
+      className: cn(
+        "flex w-full items-center gap-2.5 rounded-[var(--radius)] px-3 py-2 text-sm transition-colors",
+        active ? "bg-[hsl(var(--accent))] text-[hsl(var(--accent-foreground))]" : "hover:bg-[hsl(var(--accent)/0.6)]",
+        className
+      ),
+      children: [
+        icon && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "h-4 w-4 shrink-0 text-[hsl(var(--muted-foreground))]", children: icon }),
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex-1 text-left truncate", children: label }),
+        shortcut && /* @__PURE__ */ jsxRuntime.jsx("kbd", { className: "pointer-events-none shrink-0 inline-flex h-5 items-center rounded border border-[hsl(var(--border))] bg-[hsl(var(--muted))] px-1.5 text-[10px] font-medium text-[hsl(var(--muted-foreground))]", children: shortcut })
+      ]
+    }
+  );
+}
+function CommandBar({ open, onOpenChange, children, placeholder = "Search commands...", onSearch }) {
+  const [query, setQuery] = React14__default.default.useState("");
+  const handleSearch = (v) => {
+    setQuery(v);
+    onSearch?.(v);
+  };
+  const items = React14__default.default.useRef(null);
+  const handleKeyDown = (e) => {
+    if (e.key === "Escape") {
+      onOpenChange(false);
+      return;
+    }
+    const focusable = items.current?.querySelectorAll("button");
+    if (!focusable?.length)
+      return;
+    const arr = Array.from(focusable);
+    const idx = arr.indexOf(document.activeElement);
+    if (e.key === "ArrowDown") {
+      e.preventDefault();
+      arr[(idx + 1) % arr.length]?.focus();
+    }
+    if (e.key === "ArrowUp") {
+      e.preventDefault();
+      arr[(idx - 1 + arr.length) % arr.length]?.focus();
+    }
+  };
+  return /* @__PURE__ */ jsxRuntime.jsx(Dialog, { open, onOpenChange, children: /* @__PURE__ */ jsxRuntime.jsxs(DialogContent, { className: "p-0 gap-0 max-w-lg overflow-hidden", onKeyDown: handleKeyDown, children: [
+    /* @__PURE__ */ jsxRuntime.jsx(DialogTitle, { className: "sr-only", children: "Command Bar" }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 border-b border-[hsl(var(--border))] px-4 py-3", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Search, { className: "h-4 w-4 shrink-0 text-[hsl(var(--muted-foreground))]" }),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "input",
+        {
+          autoFocus: true,
+          className: "flex-1 bg-transparent text-sm outline-none placeholder:text-[hsl(var(--muted-foreground))]",
+          placeholder,
+          value: query,
+          onChange: (e) => handleSearch(e.target.value)
+        }
+      ),
+      query && /* @__PURE__ */ jsxRuntime.jsx("button", { onClick: () => handleSearch(""), className: "text-[hsl(var(--muted-foreground))] hover:text-[hsl(var(--foreground))]", children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.X, { className: "h-4 w-4" }) })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsx("div", { ref: items, className: "max-h-80 overflow-y-auto py-2", children })
+  ] }) });
+}
+function KanbanCard({ card, isDragging }) {
+  const { attributes, listeners, setNodeRef, transform, transition } = sortable.useSortable({ id: card.id });
+  const style = { transform: utilities.CSS.Transform.toString(transform), transition };
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      ref: setNodeRef,
+      style,
+      ...attributes,
+      ...listeners,
+      className: cn("rounded-[var(--radius)] border border-[hsl(var(--border))] bg-[hsl(var(--card))] p-3 cursor-grab active:cursor-grabbing select-none", isDragging && "shadow-lg opacity-80"),
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-start justify-between gap-2", children: [
+          /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm font-medium text-[hsl(var(--foreground))] leading-tight", children: card.title }),
+          card.badge && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "shrink-0 text-[10px] px-1.5 py-0.5 rounded-full bg-[hsl(var(--primary)/0.1)] text-[hsl(var(--primary))] font-medium", children: card.badge })
+        ] }),
+        card.description && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-1 text-xs text-[hsl(var(--muted-foreground))] line-clamp-2", children: card.description })
+      ]
+    }
+  );
+}
+function KanbanColumn({ column, isOver }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("flex w-64 shrink-0 flex-col gap-2 rounded-[var(--radius)] bg-[hsl(var(--muted)/0.4)] p-3 transition-colors", isOver && "bg-[hsl(var(--muted)/0.7)]"), children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-sm font-semibold text-[hsl(var(--foreground))]", children: column.title }),
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs text-[hsl(var(--muted-foreground))] bg-[hsl(var(--muted))] rounded-full px-2 py-0.5", children: column.cards.length })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsx(sortable.SortableContext, { items: column.cards.map((c) => c.id), strategy: sortable.verticalListSortingStrategy, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col gap-2 min-h-[60px]", children: column.cards.map((card) => /* @__PURE__ */ jsxRuntime.jsx(KanbanCard, { card }, card.id)) }) })
+  ] });
+}
+function Kanban({ columns: initialColumns, onMoveCard, className }) {
+  const [cols, setCols] = React14__default.default.useState(initialColumns);
+  const [activeCard, setActiveCard] = React14__default.default.useState(null);
+  const [overColId, setOverColId] = React14__default.default.useState(null);
+  const sensors = core.useSensors(core.useSensor(core.PointerSensor, { activationConstraint: { distance: 5 } }));
+  const findColByCard = (cardId) => cols.find((c) => c.cards.some((card) => card.id === cardId));
+  const onDragStart = ({ active }) => {
+    const col = findColByCard(active.id);
+    setActiveCard(col?.cards.find((c) => c.id === active.id) ?? null);
+  };
+  const onDragOver = ({ over }) => {
+    if (!over) {
+      setOverColId(null);
+      return;
+    }
+    const colId = cols.find((c) => c.id === over.id)?.id ?? findColByCard(over.id)?.id ?? null;
+    setOverColId(colId);
+  };
+  const onDragEnd = ({ active, over }) => {
+    setActiveCard(null);
+    setOverColId(null);
+    if (!over || active.id === over.id)
+      return;
+    const fromCol = findColByCard(active.id);
+    const toCol = cols.find((c) => c.id === over.id) ?? findColByCard(over.id);
+    if (!fromCol || !toCol || fromCol.id === toCol.id)
+      return;
+    const card = fromCol.cards.find((c) => c.id === active.id);
+    setCols((prev) => prev.map((c) => {
+      if (c.id === fromCol.id)
+        return { ...c, cards: c.cards.filter((card2) => card2.id !== active.id) };
+      if (c.id === toCol.id)
+        return { ...c, cards: [...c.cards, card] };
+      return c;
+    }));
+    onMoveCard?.(active.id, fromCol.id, toCol.id);
+  };
+  return /* @__PURE__ */ jsxRuntime.jsxs(core.DndContext, { sensors, onDragStart, onDragOver, onDragEnd, children: [
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("flex gap-4 overflow-x-auto pb-4", className), children: cols.map((col) => /* @__PURE__ */ jsxRuntime.jsx(KanbanColumn, { column: col, isOver: overColId === col.id }, col.id)) }),
+    /* @__PURE__ */ jsxRuntime.jsx(core.DragOverlay, { children: activeCard && /* @__PURE__ */ jsxRuntime.jsx(KanbanCard, { card: activeCard, isDragging: true }) })
+  ] });
+}
+var DEFAULT_COLORS = [
+  "hsl(var(--primary))",
+  "hsl(217 91% 60%)",
+  "hsl(142 71% 45%)",
+  "hsl(38 92% 50%)",
+  "hsl(280 65% 60%)"
+];
+function AreaChart({
+  data,
+  dataKey,
+  xAxisKey = "name",
+  height = 300,
+  colors = DEFAULT_COLORS,
+  showGrid = true,
+  showTooltip = true,
+  showLegend = false,
+  curved = true,
+  className
+}) {
+  const keys = Array.isArray(dataKey) ? dataKey : [dataKey];
+  const curve = curved ? "monotone" : "linear";
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("w-full", className), children: /* @__PURE__ */ jsxRuntime.jsx(recharts.ResponsiveContainer, { width: "100%", height, children: /* @__PURE__ */ jsxRuntime.jsxs(recharts.AreaChart, { data, margin: { top: 4, right: 4, left: -20, bottom: 0 }, children: [
+    showGrid && /* @__PURE__ */ jsxRuntime.jsx(recharts.CartesianGrid, { strokeDasharray: "3 3", stroke: "hsl(var(--border))" }),
+    /* @__PURE__ */ jsxRuntime.jsx(recharts.XAxis, { dataKey: xAxisKey, tick: { fontSize: 12, fill: "hsl(var(--muted-foreground))" }, axisLine: false, tickLine: false }),
+    /* @__PURE__ */ jsxRuntime.jsx(recharts.YAxis, { tick: { fontSize: 12, fill: "hsl(var(--muted-foreground))" }, axisLine: false, tickLine: false }),
+    showTooltip && /* @__PURE__ */ jsxRuntime.jsx(
+      recharts.Tooltip,
+      {
+        contentStyle: {
+          background: "hsl(var(--card))",
+          border: "1px solid hsl(var(--border))",
+          borderRadius: "var(--radius)",
+          fontSize: 12
+        }
+      }
+    ),
+    showLegend && /* @__PURE__ */ jsxRuntime.jsx(recharts.Legend, { wrapperStyle: { fontSize: 12 } }),
+    keys.map((key, i) => /* @__PURE__ */ jsxRuntime.jsx(
+      recharts.Area,
+      {
+        type: curve,
+        dataKey: key,
+        stroke: colors[i % colors.length],
+        fill: colors[i % colors.length],
+        fillOpacity: 0.15,
+        strokeWidth: 2
+      },
+      key
+    ))
+  ] }) }) });
+}
+var DEFAULT_COLORS2 = [
+  "hsl(var(--primary))",
+  "hsl(217 91% 60%)",
+  "hsl(142 71% 45%)",
+  "hsl(38 92% 50%)",
+  "hsl(280 65% 60%)"
+];
+function BarChart({
+  data,
+  dataKey,
+  xAxisKey = "name",
+  height = 300,
+  colors = DEFAULT_COLORS2,
+  showGrid = true,
+  showTooltip = true,
+  showLegend = false,
+  layout = "horizontal",
+  stacked = false,
+  className
+}) {
+  const keys = Array.isArray(dataKey) ? dataKey : [dataKey];
+  const isVertical = layout === "vertical";
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("w-full", className), children: /* @__PURE__ */ jsxRuntime.jsx(recharts.ResponsiveContainer, { width: "100%", height, children: /* @__PURE__ */ jsxRuntime.jsxs(recharts.BarChart, { data, layout, margin: { top: 4, right: 4, left: -20, bottom: 0 }, children: [
+    showGrid && /* @__PURE__ */ jsxRuntime.jsx(recharts.CartesianGrid, { strokeDasharray: "3 3", stroke: "hsl(var(--border))" }),
+    isVertical ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+      /* @__PURE__ */ jsxRuntime.jsx(recharts.XAxis, { type: "number", tick: { fontSize: 12, fill: "hsl(var(--muted-foreground))" }, axisLine: false, tickLine: false }),
+      /* @__PURE__ */ jsxRuntime.jsx(recharts.YAxis, { type: "category", dataKey: xAxisKey, tick: { fontSize: 12, fill: "hsl(var(--muted-foreground))" }, axisLine: false, tickLine: false })
+    ] }) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+      /* @__PURE__ */ jsxRuntime.jsx(recharts.XAxis, { dataKey: xAxisKey, tick: { fontSize: 12, fill: "hsl(var(--muted-foreground))" }, axisLine: false, tickLine: false }),
+      /* @__PURE__ */ jsxRuntime.jsx(recharts.YAxis, { tick: { fontSize: 12, fill: "hsl(var(--muted-foreground))" }, axisLine: false, tickLine: false })
+    ] }),
+    showTooltip && /* @__PURE__ */ jsxRuntime.jsx(
+      recharts.Tooltip,
+      {
+        contentStyle: {
+          background: "hsl(var(--card))",
+          border: "1px solid hsl(var(--border))",
+          borderRadius: "var(--radius)",
+          fontSize: 12
+        }
+      }
+    ),
+    showLegend && /* @__PURE__ */ jsxRuntime.jsx(recharts.Legend, { wrapperStyle: { fontSize: 12 } }),
+    keys.map((key, i) => /* @__PURE__ */ jsxRuntime.jsx(
+      recharts.Bar,
+      {
+        dataKey: key,
+        fill: colors[i % colors.length],
+        radius: isVertical ? [0, 4, 4, 0] : [4, 4, 0, 0],
+        stackId: stacked ? "stack" : void 0
+      },
+      key
+    ))
+  ] }) }) });
+}
+var DEFAULT_COLORS3 = [
+  "hsl(var(--primary))",
+  "hsl(217 91% 60%)",
+  "hsl(142 71% 45%)",
+  "hsl(38 92% 50%)",
+  "hsl(280 65% 60%)"
+];
+function LineChart({
+  data,
+  dataKey,
+  xAxisKey = "name",
+  height = 300,
+  colors = DEFAULT_COLORS3,
+  showGrid = true,
+  showTooltip = true,
+  showLegend = false,
+  curved = true,
+  dotted = false,
+  strokeWidth = 2,
+  className
+}) {
+  const keys = Array.isArray(dataKey) ? dataKey : [dataKey];
+  const curve = curved ? "monotone" : "linear";
+  const dash = dotted ? "4 4" : void 0;
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("w-full", className), children: /* @__PURE__ */ jsxRuntime.jsx(recharts.ResponsiveContainer, { width: "100%", height, children: /* @__PURE__ */ jsxRuntime.jsxs(recharts.LineChart, { data, margin: { top: 4, right: 4, left: -20, bottom: 0 }, children: [
+    showGrid && /* @__PURE__ */ jsxRuntime.jsx(recharts.CartesianGrid, { strokeDasharray: "3 3", stroke: "hsl(var(--border))" }),
+    /* @__PURE__ */ jsxRuntime.jsx(recharts.XAxis, { dataKey: xAxisKey, tick: { fontSize: 12, fill: "hsl(var(--muted-foreground))" }, axisLine: false, tickLine: false }),
+    /* @__PURE__ */ jsxRuntime.jsx(recharts.YAxis, { tick: { fontSize: 12, fill: "hsl(var(--muted-foreground))" }, axisLine: false, tickLine: false }),
+    showTooltip && /* @__PURE__ */ jsxRuntime.jsx(
+      recharts.Tooltip,
+      {
+        contentStyle: {
+          background: "hsl(var(--card))",
+          border: "1px solid hsl(var(--border))",
+          borderRadius: "var(--radius)",
+          fontSize: 12
+        }
+      }
+    ),
+    showLegend && /* @__PURE__ */ jsxRuntime.jsx(recharts.Legend, { wrapperStyle: { fontSize: 12 } }),
+    keys.map((key, i) => /* @__PURE__ */ jsxRuntime.jsx(
+      recharts.Line,
+      {
+        type: curve,
+        dataKey: key,
+        stroke: colors[i % colors.length],
+        strokeWidth,
+        strokeDasharray: dash,
+        dot: false,
+        activeDot: { r: 4 }
+      },
+      key
+    ))
+  ] }) }) });
+}
+function buildPath(data, w, h) {
+  if (data.length < 2)
+    return "";
+  const min = Math.min(...data);
+  const max = Math.max(...data);
+  const range = max - min || 1;
+  const pad = 2;
+  const points = data.map((v, i) => {
+    const x = pad + i / (data.length - 1) * (w - pad * 2);
+    const y = pad + (1 - (v - min) / range) * (h - pad * 2);
+    return `${x},${y}`;
+  });
+  return `M ${points.join(" L ")}`;
+}
+function Sparkline({
+  data,
+  type = "line",
+  color = "hsl(var(--primary))",
+  height = 32,
+  width = 100,
+  className
+}) {
+  const path = buildPath(data, width, height);
+  if (!path)
+    return null;
+  const min = Math.min(...data);
+  const max = Math.max(...data);
+  const range = max - min || 1;
+  const pad = 2;
+  const lastY = pad + (1 - (data[data.length - 1] - min) / range) * (height - pad * 2);
+  const areaPath = type === "area" ? `${path} L ${width - pad},${height - pad} L ${pad},${height - pad} Z` : void 0;
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "svg",
+    {
+      width,
+      height,
+      viewBox: `0 0 ${width} ${height}`,
+      className,
+      style: { display: "inline-block", verticalAlign: "middle" },
+      children: [
+        type === "area" && areaPath && /* @__PURE__ */ jsxRuntime.jsx("path", { d: areaPath, fill: color, fillOpacity: 0.15, stroke: "none" }),
+        /* @__PURE__ */ jsxRuntime.jsx("path", { d: path, fill: "none", stroke: color, strokeWidth: 1.5, strokeLinecap: "round", strokeLinejoin: "round" }),
+        /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: width - pad, cy: lastY, r: 2, fill: color })
+      ]
+    }
+  );
+}
+var colorMap2 = {
+  primary: "bg-[hsl(var(--primary))]",
+  success: "bg-green-500",
+  warning: "bg-yellow-500",
+  error: "bg-red-500"
+};
+var sizeMap4 = {
+  sm: "h-1.5 w-1.5",
+  md: "h-2.5 w-2.5",
+  lg: "h-3.5 w-3.5"
+};
+function BeaconDot({ color = "primary", size = "md" }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "relative flex", children: [
+    /* @__PURE__ */ jsxRuntime.jsx("span", { className: cn("animate-ping absolute inline-flex h-full w-full rounded-full opacity-75", colorMap2[color]) }),
+    /* @__PURE__ */ jsxRuntime.jsx("span", { className: cn("relative inline-flex rounded-full", sizeMap4[size], colorMap2[color]) })
+  ] });
+}
+function Beacon({ color = "primary", size = "md", children, className }) {
+  if (!children) {
+    return /* @__PURE__ */ jsxRuntime.jsx("span", { className: cn("inline-flex", className), children: /* @__PURE__ */ jsxRuntime.jsx(BeaconDot, { color, size }) });
+  }
+  return /* @__PURE__ */ jsxRuntime.jsxs("span", { className: cn("relative inline-flex", className), children: [
+    children,
+    /* @__PURE__ */ jsxRuntime.jsx("span", { className: "absolute -top-1 -right-1 flex", children: /* @__PURE__ */ jsxRuntime.jsx(BeaconDot, { color, size }) })
+  ] });
+}
+var TourContext = React14.createContext(null);
+function useTour() {
+  const ctx = React14.useContext(TourContext);
+  if (!ctx)
+    throw new Error("useTour must be used within <Tour>");
+  return ctx;
+}
+function Tour({ totalSteps, children }) {
+  const [currentStep, setCurrentStep] = React14.useState(0);
+  const [isActive, setIsActive] = React14.useState(false);
+  const stop = React14.useCallback(() => setIsActive(false), []);
+  const start = React14.useCallback(() => {
+    setCurrentStep(0);
+    setIsActive(true);
+  }, []);
+  const next = React14.useCallback(() => setCurrentStep((s) => Math.min(s + 1, totalSteps - 1)), [totalSteps]);
+  const prev = React14.useCallback(() => setCurrentStep((s) => Math.max(s - 1, 0)), []);
+  const goTo = React14.useCallback((step) => setCurrentStep(Math.max(0, Math.min(step, totalSteps - 1))), [totalSteps]);
+  React14.useEffect(() => {
+    if (!isActive)
+      return;
+    const onKey = (e) => {
+      if (e.key === "Escape")
+        stop();
+      if (e.key === "ArrowRight")
+        next();
+      if (e.key === "ArrowLeft")
+        prev();
+    };
+    window.addEventListener("keydown", onKey);
+    return () => window.removeEventListener("keydown", onKey);
+  }, [isActive, stop, next, prev]);
+  return /* @__PURE__ */ jsxRuntime.jsx(TourContext.Provider, { value: { currentStep, totalSteps, isActive, start, stop, next, prev, goTo }, children });
+}
+var placementClasses = {
+  top: "bottom-full left-1/2 -translate-x-1/2 mb-2",
+  bottom: "top-full left-1/2 -translate-x-1/2 mt-2",
+  left: "right-full top-1/2 -translate-y-1/2 mr-2",
+  right: "left-full top-1/2 -translate-y-1/2 ml-2"
+};
+function TourStep({ step, title, description, placement = "bottom", children }) {
+  const { currentStep, isActive, stop, next, prev, totalSteps } = useTour();
+  const active = isActive && currentStep === step;
+  const isLast = step === totalSteps - 1;
+  return /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "relative inline-block", children: [
+    active && /* @__PURE__ */ jsxRuntime.jsx(
+      "span",
+      {
+        className: "fixed inset-0 z-40 pointer-events-none",
+        style: { boxShadow: "0 0 0 9999px rgba(0,0,0,0.5)" }
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsx("span", { className: cn("relative", active && "z-50 ring-2 ring-[hsl(var(--primary))] ring-offset-2 rounded-[var(--radius)]"), children }),
+    active && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("absolute z-50 w-64 rounded-[var(--radius)] border border-[hsl(var(--border))] bg-[hsl(var(--card))] p-4 shadow-lg", placementClasses[placement]), children: [
+      /* @__PURE__ */ jsxRuntime.jsx("p", { className: "font-semibold text-sm mb-1", children: title }),
+      /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-[hsl(var(--muted-foreground))] mb-3", children: description }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between gap-2", children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-xs text-[hsl(var(--muted-foreground))]", children: [
+          step + 1,
+          " / ",
+          totalSteps
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex gap-1.5", children: [
+          step > 0 && /* @__PURE__ */ jsxRuntime.jsx(Button, { size: "sm", variant: "outline", onClick: prev, children: "Back" }),
+          isLast ? /* @__PURE__ */ jsxRuntime.jsx(Button, { size: "sm", onClick: stop, children: "Done" }) : /* @__PURE__ */ jsxRuntime.jsx(Button, { size: "sm", onClick: next, children: "Next" })
+        ] })
+      ] })
+    ] })
+  ] });
+}
+var NAV_ITEMS = [
+  { icon: lucideReact.LayoutDashboard, label: "Dashboard", active: true },
+  { icon: lucideReact.FolderOpen, label: "Projects" },
+  { icon: lucideReact.Users, label: "Team" },
+  { icon: lucideReact.Settings, label: "Settings" }
+];
+function NavItem({ icon: Icon2, label, active }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs("button", { className: cn(
+    "flex w-full items-center gap-3 rounded-md px-3 py-2 text-sm transition-colors",
+    active ? "bg-[hsl(var(--accent))] text-[hsl(var(--accent-foreground))] font-medium" : "text-[hsl(var(--muted-foreground))] hover:bg-[hsl(var(--accent))] hover:text-[hsl(var(--accent-foreground))]"
+  ), children: [
+    /* @__PURE__ */ jsxRuntime.jsx(Icon2, { className: "h-4 w-4 shrink-0" }),
+    label
+  ] });
+}
+function SidebarLayoutMinimal({
+  brandName = "Acme Inc",
+  pageTitle = "Dashboard",
+  children,
+  className
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("flex h-[600px] overflow-hidden rounded-[var(--radius)] border border-[hsl(var(--border))] bg-[hsl(var(--background))]", className), children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("aside", { className: "flex w-60 flex-col border-r border-[hsl(var(--border))] bg-[hsl(var(--card))]", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex h-14 items-center px-4 font-semibold text-sm", children: brandName }),
+      /* @__PURE__ */ jsxRuntime.jsx(Separator4, {}),
+      /* @__PURE__ */ jsxRuntime.jsx("nav", { className: "flex-1 space-y-0.5 p-2", children: NAV_ITEMS.map((item) => /* @__PURE__ */ jsxRuntime.jsx(NavItem, { ...item }, item.label)) }),
+      /* @__PURE__ */ jsxRuntime.jsx(Separator4, {}),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3 p-4", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(Avatar, { className: "h-8 w-8", children: /* @__PURE__ */ jsxRuntime.jsx(AvatarFallback, { className: "text-xs", children: "JD" }) }),
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "min-w-0", children: [
+          /* @__PURE__ */ jsxRuntime.jsx("p", { className: "truncate text-sm font-medium", children: "Jane Doe" }),
+          /* @__PURE__ */ jsxRuntime.jsx("p", { className: "truncate text-xs text-[hsl(var(--muted-foreground))]", children: "jane@acme.com" })
+        ] })
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsxs("main", { className: "flex flex-1 flex-col overflow-auto", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("header", { className: "flex h-14 items-center border-b border-[hsl(var(--border))] px-6", children: /* @__PURE__ */ jsxRuntime.jsx("h1", { className: "text-sm font-semibold", children: pageTitle }) }),
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-1 p-6 text-sm text-[hsl(var(--muted-foreground))]", children: children ?? "Page content goes here." })
+    ] })
+  ] });
+}
+var NAV_GROUPS = [
+  {
+    label: "Main",
+    items: [{ icon: lucideReact.LayoutDashboard, label: "Dashboard", active: true }, { icon: lucideReact.BarChart2, label: "Analytics" }]
+  },
+  {
+    label: "Management",
+    items: [{ icon: lucideReact.FolderOpen, label: "Projects" }, { icon: lucideReact.Users, label: "Team" }, { icon: lucideReact.CreditCard, label: "Billing" }]
+  },
+  {
+    label: "Account",
+    items: [{ icon: lucideReact.Settings, label: "Settings" }, { icon: lucideReact.HelpCircle, label: "Help" }]
+  }
+];
+function NavItem2({ icon: Icon2, label, active }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs("button", { className: cn(
+    "flex w-full items-center gap-3 rounded-md px-3 py-2 text-sm transition-colors",
+    active ? "bg-[hsl(var(--accent))] text-[hsl(var(--accent-foreground))] font-medium" : "text-[hsl(var(--muted-foreground))] hover:bg-[hsl(var(--accent))] hover:text-[hsl(var(--accent-foreground))]"
+  ), children: [
+    /* @__PURE__ */ jsxRuntime.jsx(Icon2, { className: "h-4 w-4 shrink-0" }),
+    label
+  ] });
+}
+function SidebarLayoutGroups({
+  brandName = "Acme Inc",
+  pageTitle = "Dashboard",
+  children,
+  className
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("flex h-[600px] overflow-hidden rounded-[var(--radius)] border border-[hsl(var(--border))] bg-[hsl(var(--background))]", className), children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("aside", { className: "flex w-60 flex-col border-r border-[hsl(var(--border))] bg-[hsl(var(--card))]", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex h-14 items-center px-4 font-semibold text-sm", children: brandName }),
+      /* @__PURE__ */ jsxRuntime.jsx(Separator4, {}),
+      /* @__PURE__ */ jsxRuntime.jsx("nav", { className: "flex-1 overflow-auto p-2 space-y-4", children: NAV_GROUPS.map((group) => /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+        /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mb-1 px-3 text-[10px] font-semibold uppercase tracking-wider text-[hsl(var(--muted-foreground))]", children: group.label }),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "space-y-0.5", children: group.items.map((item) => /* @__PURE__ */ jsxRuntime.jsx(NavItem2, { ...item }, item.label)) })
+      ] }, group.label)) })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsxs("main", { className: "flex flex-1 flex-col overflow-auto", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("header", { className: "flex h-14 items-center border-b border-[hsl(var(--border))] px-6", children: /* @__PURE__ */ jsxRuntime.jsx("h1", { className: "text-sm font-semibold", children: pageTitle }) }),
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-1 p-6 text-sm text-[hsl(var(--muted-foreground))]", children: children ?? "Page content goes here." })
+    ] })
+  ] });
+}
+var NAV_ITEMS2 = [
+  { icon: lucideReact.LayoutDashboard, label: "Dashboard", active: true },
+  { icon: lucideReact.FolderOpen, label: "Projects" },
+  { icon: lucideReact.Users, label: "Team" },
+  { icon: lucideReact.Bell, label: "Notifications", badge: "3" },
+  { icon: lucideReact.Settings, label: "Settings" }
+];
+function NavItem3({ icon: Icon2, label, active, badge }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs("button", { className: cn(
+    "flex w-full items-center gap-3 rounded-md px-3 py-2 text-sm transition-colors",
+    active ? "bg-[hsl(var(--accent))] text-[hsl(var(--accent-foreground))] font-medium" : "text-[hsl(var(--muted-foreground))] hover:bg-[hsl(var(--accent))] hover:text-[hsl(var(--accent-foreground))]"
+  ), children: [
+    /* @__PURE__ */ jsxRuntime.jsx(Icon2, { className: "h-4 w-4 shrink-0" }),
+    /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex-1 text-left", children: label }),
+    badge && /* @__PURE__ */ jsxRuntime.jsx(Badge, { className: "text-[10px] px-1.5 py-0.5 shrink-0", children: badge })
+  ] });
+}
+function SidebarLayoutUser({
+  userName = "Jane Doe",
+  userEmail = "jane@acme.com",
+  userRole = "Admin",
+  pageTitle = "Dashboard",
+  children,
+  className
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("flex h-[600px] overflow-hidden rounded-[var(--radius)] border border-[hsl(var(--border))] bg-[hsl(var(--background))]", className), children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("aside", { className: "flex w-60 flex-col border-r border-[hsl(var(--border))] bg-[hsl(var(--card))]", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "p-4", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3 rounded-[var(--radius)] bg-[hsl(var(--accent))] p-3", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(Avatar, { className: "h-9 w-9", children: /* @__PURE__ */ jsxRuntime.jsx(AvatarFallback, { className: "text-xs", children: userName.slice(0, 2).toUpperCase() }) }),
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "min-w-0", children: [
+          /* @__PURE__ */ jsxRuntime.jsx("p", { className: "truncate text-sm font-semibold", children: userName }),
+          /* @__PURE__ */ jsxRuntime.jsx("p", { className: "truncate text-xs text-[hsl(var(--muted-foreground))]", children: userRole })
+        ] })
+      ] }) }),
+      /* @__PURE__ */ jsxRuntime.jsx(Separator4, {}),
+      /* @__PURE__ */ jsxRuntime.jsx("nav", { className: "flex-1 space-y-0.5 p-2", children: NAV_ITEMS2.map((item) => /* @__PURE__ */ jsxRuntime.jsx(NavItem3, { ...item }, item.label)) }),
+      /* @__PURE__ */ jsxRuntime.jsx(Separator4, {}),
+      /* @__PURE__ */ jsxRuntime.jsx("p", { className: "p-4 text-xs text-[hsl(var(--muted-foreground))] truncate", children: userEmail })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsxs("main", { className: "flex flex-1 flex-col overflow-auto", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("header", { className: "flex h-14 items-center border-b border-[hsl(var(--border))] px-6", children: /* @__PURE__ */ jsxRuntime.jsx("h1", { className: "text-sm font-semibold", children: pageTitle }) }),
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-1 p-6 text-sm text-[hsl(var(--muted-foreground))]", children: children ?? "Page content goes here." })
+    ] })
+  ] });
+}
+var ALL_ITEMS = [
+  { icon: lucideReact.LayoutDashboard, label: "Dashboard", active: true },
+  { icon: lucideReact.BarChart2, label: "Analytics" },
+  { icon: lucideReact.FolderOpen, label: "Projects" },
+  { icon: lucideReact.Users, label: "Team" },
+  { icon: lucideReact.Bell, label: "Notifications" },
+  { icon: lucideReact.Settings, label: "Settings" }
+];
+function NavItem4({ icon: Icon2, label, active }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs("button", { className: cn(
+    "flex w-full items-center gap-3 rounded-md px-3 py-2 text-sm transition-colors",
+    active ? "bg-[hsl(var(--accent))] text-[hsl(var(--accent-foreground))] font-medium" : "text-[hsl(var(--muted-foreground))] hover:bg-[hsl(var(--accent))] hover:text-[hsl(var(--accent-foreground))]"
+  ), children: [
+    /* @__PURE__ */ jsxRuntime.jsx(Icon2, { className: "h-4 w-4 shrink-0" }),
+    label
+  ] });
+}
+function SidebarLayoutSearch({
+  brandName = "Acme Inc",
+  pageTitle = "Dashboard",
+  children,
+  className
+}) {
+  const [query, setQuery] = React14.useState("");
+  const filtered = ALL_ITEMS.filter((i) => i.label.toLowerCase().includes(query.toLowerCase()));
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("flex h-[600px] overflow-hidden rounded-[var(--radius)] border border-[hsl(var(--border))] bg-[hsl(var(--background))]", className), children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("aside", { className: "flex w-60 flex-col border-r border-[hsl(var(--border))] bg-[hsl(var(--card))]", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex h-14 items-center px-4 font-semibold text-sm", children: brandName }),
+      /* @__PURE__ */ jsxRuntime.jsx(Separator4, {}),
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "p-2", children: /* @__PURE__ */ jsxRuntime.jsx(
+        Input,
+        {
+          placeholder: "Search...",
+          value: query,
+          onChange: (e) => setQuery(e.target.value),
+          className: "h-8 text-sm"
+        }
+      ) }),
+      /* @__PURE__ */ jsxRuntime.jsx("nav", { className: "flex-1 space-y-0.5 overflow-auto p-2", children: filtered.length > 0 ? filtered.map((item) => /* @__PURE__ */ jsxRuntime.jsx(NavItem4, { ...item }, item.label)) : /* @__PURE__ */ jsxRuntime.jsx("p", { className: "px-3 py-2 text-xs text-[hsl(var(--muted-foreground))]", children: "No results" }) })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsxs("main", { className: "flex flex-1 flex-col overflow-auto", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("header", { className: "flex h-14 items-center border-b border-[hsl(var(--border))] px-6", children: /* @__PURE__ */ jsxRuntime.jsx("h1", { className: "text-sm font-semibold", children: pageTitle }) }),
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-1 p-6 text-sm text-[hsl(var(--muted-foreground))]", children: children ?? "Page content goes here." })
+    ] })
+  ] });
+}
+var NAV_ITEMS3 = [
+  { icon: lucideReact.LayoutDashboard, label: "Dashboard", active: true },
+  { icon: lucideReact.FolderOpen, label: "Projects" },
+  { icon: lucideReact.Users, label: "Team" },
+  { icon: lucideReact.Settings, label: "Settings" }
+];
+var KPIS = [
+  { label: "Total Revenue", value: "$48,295", change: "+12.5%" },
+  { label: "Active Users", value: "2,847", change: "+8.3%" },
+  { label: "New Orders", value: "384", change: "+3.1%" },
+  { label: "Conversion", value: "3.24%", change: "-0.4%" }
+];
+var TABLE_ROWS = [
+  { name: "Alpha Project", status: "Active", team: "Design", progress: 72 },
+  { name: "Beta Launch", status: "Review", team: "Engineering", progress: 45 },
+  { name: "Gamma Research", status: "Active", team: "Product", progress: 89 }
+];
+function NavItem5({ icon: Icon2, label, active }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs("button", { className: cn(
+    "flex w-full items-center gap-3 rounded-md px-3 py-2 text-sm transition-colors",
+    active ? "bg-[hsl(var(--accent))] font-medium" : "text-[hsl(var(--muted-foreground))] hover:bg-[hsl(var(--accent))]"
+  ), children: [
+    /* @__PURE__ */ jsxRuntime.jsx(Icon2, { className: "h-4 w-4 shrink-0" }),
+    label
+  ] });
+}
+function SidebarLayoutDashboard({ className }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("flex h-[600px] overflow-hidden rounded-[var(--radius)] border border-[hsl(var(--border))] bg-[hsl(var(--background))]", className), children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("aside", { className: "flex w-56 flex-col border-r border-[hsl(var(--border))] bg-[hsl(var(--card))]", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex h-12 items-center px-4 font-semibold text-sm", children: "Acme Inc" }),
+      /* @__PURE__ */ jsxRuntime.jsx(Separator4, {}),
+      /* @__PURE__ */ jsxRuntime.jsx("nav", { className: "flex-1 space-y-0.5 p-2", children: NAV_ITEMS3.map((i) => /* @__PURE__ */ jsxRuntime.jsx(NavItem5, { ...i }, i.label)) }),
+      /* @__PURE__ */ jsxRuntime.jsx(Separator4, {}),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 p-3", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(Avatar, { className: "h-7 w-7", children: /* @__PURE__ */ jsxRuntime.jsx(AvatarFallback, { className: "text-xs", children: "JD" }) }),
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "truncate text-xs font-medium", children: "Jane Doe" })
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-1 flex-col overflow-hidden", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("header", { className: "flex h-12 items-center justify-between border-b border-[hsl(var(--border))] px-4", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("h1", { className: "text-sm font-semibold", children: "Dashboard" }),
+        /* @__PURE__ */ jsxRuntime.jsxs("button", { className: "relative", children: [
+          /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Bell, { className: "h-4 w-4" }),
+          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "absolute -top-1 -right-1 h-2 w-2 rounded-full bg-[hsl(var(--primary))]" })
+        ] })
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex-1 overflow-auto p-4 space-y-4", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid gap-3", style: { gridTemplateColumns: "repeat(auto-fill, minmax(min(100%,130px),1fr))" }, children: KPIS.map((k) => /* @__PURE__ */ jsxRuntime.jsx(Card, { children: /* @__PURE__ */ jsxRuntime.jsxs(CardContent, { className: "p-3", children: [
+          /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-[hsl(var(--muted-foreground))]", children: k.label }),
+          /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-lg font-bold mt-0.5", children: k.value }),
+          /* @__PURE__ */ jsxRuntime.jsxs("p", { className: cn("text-xs flex items-center gap-0.5 mt-0.5", k.change.startsWith("+") ? "text-green-600" : "text-red-500"), children: [
+            /* @__PURE__ */ jsxRuntime.jsx(lucideReact.TrendingUp, { className: "h-3 w-3" }),
+            k.change
+          ] })
+        ] }) }, k.label)) }),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "rounded-[var(--radius)] border border-[hsl(var(--border))]", children: /* @__PURE__ */ jsxRuntime.jsxs("table", { className: "w-full text-xs", children: [
+          /* @__PURE__ */ jsxRuntime.jsx("thead", { children: /* @__PURE__ */ jsxRuntime.jsx("tr", { className: "border-b border-[hsl(var(--border))]", children: ["Project", "Status", "Team", "Progress"].map((h) => /* @__PURE__ */ jsxRuntime.jsx("th", { className: "px-3 py-2 text-left font-medium text-[hsl(var(--muted-foreground))]", children: h }, h)) }) }),
+          /* @__PURE__ */ jsxRuntime.jsx("tbody", { children: TABLE_ROWS.map((r) => /* @__PURE__ */ jsxRuntime.jsxs("tr", { className: "border-b border-[hsl(var(--border))] last:border-0", children: [
+            /* @__PURE__ */ jsxRuntime.jsx("td", { className: "px-3 py-2 font-medium", children: r.name }),
+            /* @__PURE__ */ jsxRuntime.jsx("td", { className: "px-3 py-2", children: /* @__PURE__ */ jsxRuntime.jsx(Badge, { variant: "secondary", className: "text-[10px]", children: r.status }) }),
+            /* @__PURE__ */ jsxRuntime.jsx("td", { className: "px-3 py-2 text-[hsl(var(--muted-foreground))]", children: r.team }),
+            /* @__PURE__ */ jsxRuntime.jsx("td", { className: "px-3 py-2", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-1.5 w-20 rounded-full bg-[hsl(var(--muted))]", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-full rounded-full bg-[hsl(var(--primary))]", style: { width: `${r.progress}%` } }) }) })
+          ] }, r.name)) })
+        ] }) })
+      ] })
+    ] })
+  ] });
+}
+var NAV_LINKS = ["Home", "Projects", "Analytics", "Team"];
+var TABS = ["Overview", "Activity", "Settings", "Billing"];
+function StackedLayoutTabs({
+  brandName = "Acme Inc",
+  children,
+  className
+}) {
+  const [activeTab, setActiveTab] = React14.useState(0);
+  const [activeNav, setActiveNav] = React14.useState(0);
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("flex h-[600px] flex-col overflow-hidden rounded-[var(--radius)] border border-[hsl(var(--border))] bg-[hsl(var(--background))]", className), children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("nav", { className: "flex h-14 items-center gap-6 border-b border-[hsl(var(--border))] bg-[hsl(var(--card))] px-4", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-semibold text-sm shrink-0", children: brandName }),
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-1 items-center gap-1", children: NAV_LINKS.map((link, i) => /* @__PURE__ */ jsxRuntime.jsx(
+        "button",
+        {
+          onClick: () => setActiveNav(i),
+          className: cn(
+            "px-3 py-1.5 text-sm rounded-md transition-colors",
+            i === activeNav ? "bg-[hsl(var(--accent))] font-medium" : "text-[hsl(var(--muted-foreground))] hover:bg-[hsl(var(--accent))]"
+          ),
+          children: link
+        },
+        link
+      )) }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Bell, { className: "h-4 w-4 text-[hsl(var(--muted-foreground))]" }),
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-1.5 cursor-pointer", children: [
+          /* @__PURE__ */ jsxRuntime.jsx(Avatar, { className: "h-7 w-7", children: /* @__PURE__ */ jsxRuntime.jsx(AvatarFallback, { className: "text-xs", children: "JD" }) }),
+          /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronDown, { className: "h-3 w-3 text-[hsl(var(--muted-foreground))]" })
+        ] })
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "border-b border-[hsl(var(--border))] bg-[hsl(var(--card))] px-4", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex gap-4", children: TABS.map((tab, i) => /* @__PURE__ */ jsxRuntime.jsx(
+      "button",
+      {
+        onClick: () => setActiveTab(i),
+        className: cn(
+          "py-3 text-sm transition-colors border-b-2",
+          i === activeTab ? "border-[hsl(var(--primary))] font-medium" : "border-transparent text-[hsl(var(--muted-foreground))] hover:text-[hsl(var(--foreground))]"
+        ),
+        children: tab
+      },
+      tab
+    )) }) }),
+    /* @__PURE__ */ jsxRuntime.jsx("main", { className: "flex-1 overflow-auto p-6", children: children ?? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-sm text-[hsl(var(--muted-foreground))]", children: [
+      "Content for ",
+      /* @__PURE__ */ jsxRuntime.jsx("strong", { children: TABS[activeTab] }),
+      " tab"
+    ] }) })
+  ] });
+}
+var NAV_LINKS2 = ["Features", "Pricing", "Docs", "Blog"];
+function StackedLayoutBranded({
+  brandName = "Acme",
+  children,
+  className
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("flex h-[600px] flex-col overflow-hidden rounded-[var(--radius)] border border-[hsl(var(--border))] bg-[hsl(var(--background))]", className), children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("nav", { className: "flex h-14 items-center gap-6 bg-[hsl(var(--primary))] px-6", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-bold text-sm text-[hsl(var(--primary-foreground))] shrink-0", children: brandName }),
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-1 items-center gap-1", children: NAV_LINKS2.map((link) => /* @__PURE__ */ jsxRuntime.jsx("button", { className: "px-3 py-1.5 text-sm text-[hsl(var(--primary-foreground)/0.8)] hover:text-[hsl(var(--primary-foreground))] transition-colors rounded-md hover:bg-white/10", children: link }, link)) }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Bell, { className: "h-4 w-4 text-[hsl(var(--primary-foreground)/0.8)]" }),
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-1.5 cursor-pointer", children: [
+          /* @__PURE__ */ jsxRuntime.jsx(Avatar, { className: "h-7 w-7 ring-2 ring-white/30", children: /* @__PURE__ */ jsxRuntime.jsx(AvatarFallback, { className: "bg-white/20 text-[hsl(var(--primary-foreground))] text-xs", children: "JD" }) }),
+          /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronDown, { className: "h-3 w-3 text-[hsl(var(--primary-foreground)/0.8)]" })
+        ] })
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsx("main", { className: "flex-1 overflow-auto", children: children ?? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "p-6 space-y-6", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+        /* @__PURE__ */ jsxRuntime.jsx("h1", { className: "text-xl font-bold", children: "Welcome back, Jane" }),
+        /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-[hsl(var(--muted-foreground))] mt-1", children: "Here's what's happening today." })
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid gap-4", style: { gridTemplateColumns: "repeat(auto-fill, minmax(min(100%,200px),1fr))" }, children: ["Get Started", "View Analytics", "Manage Team"].map((action) => /* @__PURE__ */ jsxRuntime.jsx(Card, { className: "cursor-pointer hover:shadow-md transition-shadow", children: /* @__PURE__ */ jsxRuntime.jsxs(CardContent, { className: "p-4 flex items-center justify-between", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm font-medium", children: action }),
+        /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ArrowRight, { className: "h-4 w-4 text-[hsl(var(--muted-foreground))]" })
+      ] }) }, action)) })
+    ] }) })
+  ] });
+}
+var NOTIFICATIONS = [
+  { id: "comments", label: "Comments", description: "Get notified when someone comments on your post", default: true },
+  { id: "mentions", label: "Mentions", description: "Get notified when you are mentioned", default: true },
+  { id: "followers", label: "New followers", description: "Get notified when someone follows you", default: false },
+  { id: "updates", label: "Product updates", description: "Receive emails about new features and improvements", default: true },
+  { id: "digest", label: "Weekly digest", description: "A summary of activity from the past week", default: false },
+  { id: "security", label: "Security alerts", description: "Important alerts about your account security", default: true }
+];
+function NotifRow({ label, description, checked, onChange }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between gap-4 py-4", children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+      /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm font-medium", children: label }),
+      /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-[hsl(var(--muted-foreground))] mt-0.5", children: description })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsx(Switch, { checked, onCheckedChange: onChange })
+  ] });
+}
+function NotificationSettings({ className }) {
+  const [states, setStates] = React14.useState(
+    Object.fromEntries(NOTIFICATIONS.map((n) => [n.id, n.default]))
+  );
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("rounded-[var(--radius)] border border-[hsl(var(--border))] bg-[hsl(var(--card))] p-6", className), children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mb-4", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "text-base font-semibold", children: "Email Notifications" }),
+      /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-[hsl(var(--muted-foreground))] mt-0.5", children: "Choose what you want to be notified about." })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsx(Separator4, {}),
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "divide-y divide-[hsl(var(--border))]", children: NOTIFICATIONS.map((n) => /* @__PURE__ */ jsxRuntime.jsx(
+      NotifRow,
+      {
+        ...n,
+        checked: states[n.id],
+        onChange: (val) => setStates((s) => ({ ...s, [n.id]: val }))
+      },
+      n.id
+    )) })
+  ] });
+}
+var MEMBERS = [
+  { id: "1", name: "Jane Doe", email: "jane@acme.com", role: "Owner", initials: "JD" },
+  { id: "2", name: "Bob Smith", email: "bob@acme.com", role: "Admin", initials: "BS" },
+  { id: "3", name: "Alice Chen", email: "alice@acme.com", role: "Member", initials: "AC" },
+  { id: "4", name: "Tom Ray", email: "tom@acme.com", role: "Member", initials: "TR" },
+  { id: "5", name: "Sara Kim", email: "sara@acme.com", role: "Viewer", initials: "SK" }
+];
+var roleVariant = (role) => role === "Owner" ? "default" : role === "Admin" ? "secondary" : "outline";
+function WorkspaceMembers({ className }) {
+  const [query, setQuery] = React14.useState("");
+  const [members, setMembers] = React14.useState(MEMBERS);
+  const filtered = members.filter(
+    (m) => m.name.toLowerCase().includes(query.toLowerCase()) || m.email.toLowerCase().includes(query.toLowerCase())
+  );
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("rounded-[var(--radius)] border border-[hsl(var(--border))] bg-[hsl(var(--card))]", className), children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between p-4 border-b border-[hsl(var(--border))]", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+        /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "text-sm font-semibold", children: "Members" }),
+        /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "text-xs text-[hsl(var(--muted-foreground))]", children: [
+          members.length,
+          " members"
+        ] })
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Search, { className: "absolute left-2.5 top-1/2 -translate-y-1/2 h-3.5 w-3.5 text-[hsl(var(--muted-foreground))]" }),
+        /* @__PURE__ */ jsxRuntime.jsx(Input, { className: "h-8 pl-8 text-xs w-48", placeholder: "Search members...", value: query, onChange: (e) => setQuery(e.target.value) })
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "divide-y divide-[hsl(var(--border))]", children: filtered.map((m) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3 px-4 py-3", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(Avatar, { className: "h-8 w-8", children: /* @__PURE__ */ jsxRuntime.jsx(AvatarFallback, { className: "text-xs", children: m.initials }) }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex-1 min-w-0", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm font-medium truncate", children: m.name }),
+        /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-[hsl(var(--muted-foreground))] truncate", children: m.email })
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsx(Badge, { variant: roleVariant(m.role), className: "text-[10px] px-1.5 py-0.5 shrink-0", children: m.role }),
+      m.role !== "Owner" && /* @__PURE__ */ jsxRuntime.jsx(Button, { size: "icon", variant: "ghost", className: "h-7 w-7 shrink-0", onClick: () => setMembers((ms) => ms.filter((x) => x.id !== m.id)), children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.X, { className: "h-3.5 w-3.5" }) })
+    ] }, m.id)) })
+  ] });
+}
+function IntegrationCard({
+  icon,
+  name = "Slack",
+  description = "Send notifications and updates to your Slack workspace.",
+  connected = false,
+  className
+}) {
+  const [isConnected, setIsConnected] = React14.useState(connected);
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("flex items-center gap-4 rounded-[var(--radius)] border border-[hsl(var(--border))] bg-[hsl(var(--card))] p-4", className), children: [
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex h-10 w-10 shrink-0 items-center justify-center rounded-[var(--radius)] bg-[hsl(var(--muted))] text-[hsl(var(--muted-foreground))]", children: icon ?? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-base font-bold", children: name[0] }) }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex-1 min-w-0", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm font-semibold", children: name }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          Badge,
+          {
+            variant: isConnected ? "default" : "outline",
+            className: "text-[10px] px-1.5 py-0.5 shrink-0",
+            children: isConnected ? "Connected" : "Not connected"
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-[hsl(var(--muted-foreground))] mt-0.5 truncate", children: description })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      Button,
+      {
+        size: "sm",
+        variant: isConnected ? "outline" : "default",
+        className: "shrink-0",
+        onClick: () => setIsConnected((v) => !v),
+        children: isConnected ? "Disconnect" : "Connect"
+      }
+    )
+  ] });
+}
+var REACTIONS = ["\u{1F60A}", "\u{1F610}", "\u{1F615}", "\u{1F621}", "\u{1F929}"];
+function FeedbackModal({ onSubmit, className }) {
+  const [reaction, setReaction] = React14.useState("");
+  const [text, setText] = React14.useState("");
+  const [submitted, setSubmitted] = React14.useState(false);
+  const handleSubmit = () => {
+    onSubmit?.({ reaction, text });
+    setSubmitted(true);
+  };
+  if (submitted) {
+    return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("flex flex-col items-center gap-3 py-8 px-6 text-center", className), children: [
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-4xl", children: "\u{1F389}" }),
+      /* @__PURE__ */ jsxRuntime.jsx("p", { className: "font-semibold", children: "Thanks for your feedback!" }),
+      /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-[hsl(var(--muted-foreground))]", children: "We'll use it to improve your experience." })
+    ] });
+  }
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("flex flex-col gap-4 p-6", className), children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+      /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "text-base font-semibold", children: "Send Feedback" }),
+      /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-[hsl(var(--muted-foreground))] mt-0.5", children: "How are you feeling about the product?" })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex gap-2", children: REACTIONS.map((r) => /* @__PURE__ */ jsxRuntime.jsx(
+      "button",
+      {
+        onClick: () => setReaction(r),
+        className: cn(
+          "flex h-10 w-10 items-center justify-center rounded-[var(--radius)] border text-xl transition-colors",
+          reaction === r ? "border-[hsl(var(--primary))] bg-[hsl(var(--primary)/0.1)]" : "border-[hsl(var(--border))] hover:bg-[hsl(var(--accent))]"
+        ),
+        children: r
+      },
+      r
+    )) }),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      Textarea,
+      {
+        placeholder: "Tell us more (optional)...",
+        value: text,
+        onChange: (e) => setText(e.target.value),
+        className: "resize-none",
+        rows: 4
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(Button, { variant: "outline", size: "sm", children: "Cancel" }),
+      /* @__PURE__ */ jsxRuntime.jsx(Button, { size: "sm", onClick: handleSubmit, disabled: !reaction, children: "Submit" })
+    ] })
+  ] });
+}
+var PENDING = [
+  { email: "alex@startup.io", role: "Member" },
+  { email: "sam@startup.io", role: "Viewer" }
+];
+function InviteModal({ className }) {
+  const [email, setEmail] = React14.useState("");
+  const [role, setRole] = React14.useState("Member");
+  const [pending, setPending] = React14.useState(PENDING);
+  const invite = () => {
+    if (!email.trim())
+      return;
+    setPending((p) => [...p, { email: email.trim(), role }]);
+    setEmail("");
+  };
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("flex flex-col gap-4 p-6", className), children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+      /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "text-base font-semibold", children: "Invite People" }),
+      /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-[hsl(var(--muted-foreground))] mt-0.5", children: "Invite team members to collaborate." })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex gap-2", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
+        Input,
+        {
+          className: "flex-1 h-9 text-sm",
+          placeholder: "colleague@company.com",
+          value: email,
+          onChange: (e) => setEmail(e.target.value),
+          onKeyDown: (e) => e.key === "Enter" && invite()
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsxs(Select, { value: role, onValueChange: setRole, children: [
+        /* @__PURE__ */ jsxRuntime.jsx(SelectTrigger, { className: "h-9 w-28 text-sm", children: /* @__PURE__ */ jsxRuntime.jsx(SelectValue, {}) }),
+        /* @__PURE__ */ jsxRuntime.jsx(SelectContent, { children: ["Admin", "Member", "Viewer"].map((r) => /* @__PURE__ */ jsxRuntime.jsx(SelectItem, { value: r, children: r }, r)) })
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsx(Button, { size: "sm", className: "h-9", onClick: invite, children: "Send" })
+    ] }),
+    pending.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-1", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs font-medium text-[hsl(var(--muted-foreground))]", children: "Pending invites" }),
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "divide-y divide-[hsl(var(--border))] rounded-[var(--radius)] border border-[hsl(var(--border))]", children: pending.map((p, i) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 px-3 py-2", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(Avatar, { className: "h-6 w-6", children: /* @__PURE__ */ jsxRuntime.jsx(AvatarFallback, { className: "text-[10px]", children: p.email[0].toUpperCase() }) }),
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex-1 text-sm truncate", children: p.email }),
+        /* @__PURE__ */ jsxRuntime.jsx(Badge, { variant: "outline", className: "text-[10px] px-1.5 py-0.5 shrink-0", children: p.role }),
+        /* @__PURE__ */ jsxRuntime.jsx("button", { onClick: () => setPending((ps) => ps.filter((_, j) => j !== i)), children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.X, { className: "h-3.5 w-3.5 text-[hsl(var(--muted-foreground))] hover:text-[hsl(var(--foreground))]" }) })
+      ] }, i)) })
+    ] })
+  ] });
+}
+var COLORS = ["bg-blue-500", "bg-green-500", "bg-yellow-500", "bg-purple-500", "bg-red-500", "bg-pink-500"];
+var INITIAL_TAGS = [
+  { id: "1", name: "Design", color: "bg-blue-500" },
+  { id: "2", name: "Engineering", color: "bg-green-500" },
+  { id: "3", name: "Marketing", color: "bg-yellow-500" },
+  { id: "4", name: "Research", color: "bg-purple-500" }
+];
+function ManageTagsModal({ className }) {
+  const [tags, setTags] = React14.useState(INITIAL_TAGS);
+  const [newTag, setNewTag] = React14.useState("");
+  const [colorIdx, setColorIdx] = React14.useState(0);
+  const addTag = () => {
+    if (!newTag.trim())
+      return;
+    const id = `tag-${Date.now()}`;
+    setTags((t) => [...t, { id, name: newTag.trim(), color: COLORS[colorIdx % COLORS.length] }]);
+    setNewTag("");
+    setColorIdx((i) => i + 1);
+  };
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("flex flex-col gap-4 p-6", className), children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+      /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "text-base font-semibold", children: "Manage Tags" }),
+      /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-[hsl(var(--muted-foreground))] mt-0.5", children: "Create and organize your tags." })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex gap-2", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "div",
+        {
+          className: cn("h-9 w-9 shrink-0 rounded-md cursor-pointer transition-opacity", COLORS[colorIdx % COLORS.length]),
+          onClick: () => setColorIdx((i) => i + 1),
+          title: "Click to change color"
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        Input,
+        {
+          className: "flex-1 h-9 text-sm",
+          placeholder: "New tag name...",
+          value: newTag,
+          onChange: (e) => setNewTag(e.target.value),
+          onKeyDown: (e) => e.key === "Enter" && addTag()
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx(Button, { size: "sm", className: "h-9", onClick: addTag, children: "Add" })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "space-y-1.5", children: tags.map((tag) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 rounded-[var(--radius)] border border-[hsl(var(--border))] px-3 py-2", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: cn("h-3 w-3 rounded-full shrink-0", tag.color) }),
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex-1 text-sm", children: tag.name }),
+      /* @__PURE__ */ jsxRuntime.jsx("button", { className: "text-[hsl(var(--muted-foreground))] hover:text-[hsl(var(--foreground))] transition-colors", children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Pencil, { className: "h-3.5 w-3.5" }) }),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "button",
+        {
+          onClick: () => setTags((ts) => ts.filter((t) => t.id !== tag.id)),
+          className: "text-[hsl(var(--muted-foreground))] hover:text-[hsl(var(--foreground))] transition-colors",
+          children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.X, { className: "h-3.5 w-3.5" })
+        }
+      )
+    ] }, tag.id)) })
+  ] });
+}
+var USERS = [
+  { id: "1", name: "Jane Doe", email: "jane@acme.com", initials: "JD" },
+  { id: "2", name: "Bob Smith", email: "bob@acme.com", initials: "BS" },
+  { id: "3", name: "Alice Chen", email: "alice@acme.com", initials: "AC" },
+  { id: "4", name: "Tom Ray", email: "tom@acme.com", initials: "TR" },
+  { id: "5", name: "Sara Kim", email: "sara@acme.com", initials: "SK" },
+  { id: "6", name: "Mike Liu", email: "mike@acme.com", initials: "ML" }
+];
+function SelectUsersModal({ onConfirm, className }) {
+  const [query, setQuery] = React14.useState("");
+  const [selected, setSelected] = React14.useState(/* @__PURE__ */ new Set());
+  const filtered = USERS.filter(
+    (u) => u.name.toLowerCase().includes(query.toLowerCase()) || u.email.toLowerCase().includes(query.toLowerCase())
+  );
+  const toggle = (id) => setSelected((s) => {
+    const n = new Set(s);
+    n.has(id) ? n.delete(id) : n.add(id);
+    return n;
+  });
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("flex flex-col", className), children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "p-4 border-b border-[hsl(var(--border))]", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "text-sm font-semibold mb-3", children: "Select Users" }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Search, { className: "absolute left-2.5 top-1/2 -translate-y-1/2 h-3.5 w-3.5 text-[hsl(var(--muted-foreground))]" }),
+        /* @__PURE__ */ jsxRuntime.jsx(Input, { className: "pl-8 h-8 text-sm", placeholder: "Search users...", value: query, onChange: (e) => setQuery(e.target.value) })
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "overflow-auto max-h-64 divide-y divide-[hsl(var(--border))]", children: filtered.map((u) => /* @__PURE__ */ jsxRuntime.jsxs("label", { className: "flex cursor-pointer items-center gap-3 px-4 py-3 hover:bg-[hsl(var(--accent))] transition-colors", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(Checkbox, { checked: selected.has(u.id), onCheckedChange: () => toggle(u.id) }),
+      /* @__PURE__ */ jsxRuntime.jsx(Avatar, { className: "h-7 w-7", children: /* @__PURE__ */ jsxRuntime.jsx(AvatarFallback, { className: "text-xs", children: u.initials }) }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex-1 min-w-0", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm font-medium truncate", children: u.name }),
+        /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-[hsl(var(--muted-foreground))] truncate", children: u.email })
+      ] })
+    ] }, u.id)) }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between p-4 border-t border-[hsl(var(--border))]", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-sm text-[hsl(var(--muted-foreground))]", children: [
+        selected.size,
+        " selected"
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsx(Button, { size: "sm", disabled: selected.size === 0, onClick: () => onConfirm?.(Array.from(selected)), children: "Confirm" })
+    ] })
+  ] });
+}
+function UserMenu({
+  name = "Jane Doe",
+  email = "jane@acme.com",
+  initials = "JD",
+  onProfile,
+  onSettings,
+  onBilling,
+  onSignOut,
+  className
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(DropdownMenu, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsxs("button", { className: cn("flex items-center gap-2 rounded-[var(--radius)] px-2 py-1.5 text-sm transition-colors hover:bg-[hsl(var(--accent))] focus:outline-none", className), children: [
+      /* @__PURE__ */ jsxRuntime.jsx(Avatar, { className: "h-7 w-7", children: /* @__PURE__ */ jsxRuntime.jsx(AvatarFallback, { className: "text-xs", children: initials }) }),
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-medium max-w-[120px] truncate", children: name }),
+      /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronDown, { className: "h-3.5 w-3.5 text-[hsl(var(--muted-foreground))]" })
+    ] }) }),
+    /* @__PURE__ */ jsxRuntime.jsxs(DropdownMenuContent, { align: "end", className: "w-52", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs(DropdownMenuLabel, { className: "font-normal", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm font-medium", children: name }),
+        /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-[hsl(var(--muted-foreground))]", children: email })
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsx(DropdownMenuSeparator, {}),
+      /* @__PURE__ */ jsxRuntime.jsxs(DropdownMenuItem, { onClick: onProfile, children: [
+        /* @__PURE__ */ jsxRuntime.jsx(lucideReact.User, { className: "h-4 w-4" }),
+        "Profile"
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsxs(DropdownMenuItem, { onClick: onSettings, children: [
+        /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Settings, { className: "h-4 w-4" }),
+        "Account Settings"
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsxs(DropdownMenuItem, { onClick: onBilling, children: [
+        /* @__PURE__ */ jsxRuntime.jsx(lucideReact.CreditCard, { className: "h-4 w-4" }),
+        "Billing"
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsx(DropdownMenuSeparator, {}),
+      /* @__PURE__ */ jsxRuntime.jsxs(DropdownMenuItem, { onClick: onSignOut, className: "text-[hsl(var(--destructive))] focus:text-[hsl(var(--destructive))]", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(lucideReact.LogOut, { className: "h-4 w-4" }),
+        "Sign out"
+      ] })
+    ] })
+  ] });
+}
+var ORGS = [
+  { id: "1", name: "Acme Corp", slug: "acme", plan: "Pro" },
+  { id: "2", name: "Beta Labs", slug: "beta-labs", plan: "Starter" },
+  { id: "3", name: "Gamma Inc", slug: "gamma", plan: "Free" }
+];
+function OrgMenu({
+  currentOrgId = "1",
+  onSwitch,
+  onCreateOrg,
+  className
+}) {
+  const current = ORGS.find((o) => o.id === currentOrgId) ?? ORGS[0];
+  return /* @__PURE__ */ jsxRuntime.jsxs(DropdownMenu, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsxs("button", { className: cn("flex items-center gap-2 rounded-[var(--radius)] px-2 py-1.5 text-sm transition-colors hover:bg-[hsl(var(--accent))] focus:outline-none", className), children: [
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex h-6 w-6 items-center justify-center rounded bg-[hsl(var(--primary))] text-[10px] font-bold text-[hsl(var(--primary-foreground))]", children: current.name[0] }),
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-medium max-w-[120px] truncate", children: current.name }),
+      /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronDown, { className: "h-3.5 w-3.5 text-[hsl(var(--muted-foreground))]" })
+    ] }) }),
+    /* @__PURE__ */ jsxRuntime.jsxs(DropdownMenuContent, { align: "start", className: "w-52", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(DropdownMenuLabel, { children: "Organizations" }),
+      /* @__PURE__ */ jsxRuntime.jsx(DropdownMenuSeparator, {}),
+      ORGS.map((org) => /* @__PURE__ */ jsxRuntime.jsxs(DropdownMenuItem, { onClick: () => onSwitch?.(org.id), className: "justify-between", children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [
+          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex h-5 w-5 items-center justify-center rounded bg-[hsl(var(--muted))] text-[10px] font-bold", children: org.name[0] }),
+          /* @__PURE__ */ jsxRuntime.jsx("span", { children: org.name })
+        ] }),
+        org.id === currentOrgId && /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Check, { className: "h-3.5 w-3.5 text-[hsl(var(--primary))]" })
+      ] }, org.id)),
+      /* @__PURE__ */ jsxRuntime.jsx(DropdownMenuSeparator, {}),
+      /* @__PURE__ */ jsxRuntime.jsxs(DropdownMenuItem, { onClick: onCreateOrg, children: [
+        /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Plus, { className: "h-4 w-4" }),
+        "Create organization"
+      ] })
+    ] })
+  ] });
+}
+var ROLES = [
+  { value: "owner", label: "Owner", description: "Full control over the workspace" },
+  { value: "admin", label: "Admin", description: "Manage members and settings" },
+  { value: "member", label: "Member", description: "Can create and edit content" },
+  { value: "viewer", label: "Viewer", description: "Read-only access" }
+];
+function RolesMenu({ value = "member", onChange, className }) {
+  const [role, setRole] = React14.useState(value);
+  const current = ROLES.find((r) => r.value === role) ?? ROLES[2];
+  const handleChange = (v) => {
+    setRole(v);
+    onChange?.(v);
+  };
+  return /* @__PURE__ */ jsxRuntime.jsxs(DropdownMenu, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsxs(Button, { variant: "outline", size: "sm", className: cn("gap-1.5", className), children: [
+      current.label,
+      /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronDown, { className: "h-3.5 w-3.5 opacity-60" })
+    ] }) }),
+    /* @__PURE__ */ jsxRuntime.jsxs(DropdownMenuContent, { align: "end", className: "w-56", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(DropdownMenuLabel, { children: "Change role" }),
+      /* @__PURE__ */ jsxRuntime.jsx(DropdownMenuSeparator, {}),
+      /* @__PURE__ */ jsxRuntime.jsx(DropdownMenuRadioGroup, { value: role, onValueChange: handleChange, children: ROLES.map((r) => /* @__PURE__ */ jsxRuntime.jsx(DropdownMenuRadioItem, { value: r.value, className: "items-start py-2.5", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "ml-1", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm font-medium leading-none", children: r.label }),
+        /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-[hsl(var(--muted-foreground))] mt-0.5", children: r.description })
+      ] }) }, r.value)) })
+    ] })
+  ] });
+}
+function MetricCard({ label = "Total Revenue", value = "$48,295", change = "+12.5%", trend = "up", className }) {
+  const TrendIcon = trend === "up" ? lucideReact.TrendingUp : lucideReact.TrendingDown;
+  const trendColor = trend === "up" ? "text-green-600" : "text-red-500";
+  return /* @__PURE__ */ jsxRuntime.jsx(Card, { className: cn("", className), children: /* @__PURE__ */ jsxRuntime.jsxs(CardContent, { className: "p-4", children: [
+    /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-[hsl(var(--muted-foreground))]", children: label }),
+    /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-2xl font-bold mt-1", children: value }),
+    /* @__PURE__ */ jsxRuntime.jsxs("p", { className: cn("flex items-center gap-1 text-sm mt-1", trendColor), children: [
+      /* @__PURE__ */ jsxRuntime.jsx(TrendIcon, { className: "h-4 w-4" }),
+      change,
+      " from last month"
+    ] })
+  ] }) });
+}
+function MetricCardWithIcon({ icon, iconColor = "bg-[hsl(var(--primary)/0.1)] text-[hsl(var(--primary))]", ...props }) {
+  const TrendIcon = (props.trend ?? "up") === "up" ? lucideReact.TrendingUp : lucideReact.TrendingDown;
+  const trendColor = (props.trend ?? "up") === "up" ? "text-green-600" : "text-red-500";
+  return /* @__PURE__ */ jsxRuntime.jsx(Card, { className: cn("", props.className), children: /* @__PURE__ */ jsxRuntime.jsx(CardContent, { className: "p-4", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-start justify-between", children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+      /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-[hsl(var(--muted-foreground))]", children: props.label ?? "Total Revenue" }),
+      /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-2xl font-bold mt-1", children: props.value ?? "$48,295" }),
+      /* @__PURE__ */ jsxRuntime.jsxs("p", { className: cn("flex items-center gap-1 text-sm mt-1", trendColor), children: [
+        /* @__PURE__ */ jsxRuntime.jsx(TrendIcon, { className: "h-4 w-4" }),
+        props.change ?? "+12.5%"
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("flex h-10 w-10 items-center justify-center rounded-[var(--radius)]", iconColor), children: icon ?? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.TrendingUp, { className: "h-5 w-5" }) })
+  ] }) }) });
+}
+function MetricCardWithButton({ actionLabel = "View details", onAction, ...props }) {
+  const TrendIcon = (props.trend ?? "up") === "up" ? lucideReact.TrendingUp : lucideReact.TrendingDown;
+  const trendColor = (props.trend ?? "up") === "up" ? "text-green-600" : "text-red-500";
+  return /* @__PURE__ */ jsxRuntime.jsx(Card, { className: cn("", props.className), children: /* @__PURE__ */ jsxRuntime.jsxs(CardContent, { className: "p-4", children: [
+    /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-[hsl(var(--muted-foreground))]", children: props.label ?? "Total Revenue" }),
+    /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-2xl font-bold mt-1", children: props.value ?? "$48,295" }),
+    /* @__PURE__ */ jsxRuntime.jsxs("p", { className: cn("flex items-center gap-1 text-sm mt-1 mb-3", trendColor), children: [
+      /* @__PURE__ */ jsxRuntime.jsx(TrendIcon, { className: "h-4 w-4" }),
+      props.change ?? "+12.5%"
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsx(Button, { size: "sm", variant: "outline", className: "w-full", onClick: onAction, children: actionLabel })
+  ] }) });
+}
+var INITIAL_MESSAGES = [
+  { id: "1", author: "Alice Chen", initials: "AC", text: "Hey team, just pushed the new design files to Figma.", time: "9:41 AM" },
+  { id: "2", author: "Bob Smith", initials: "BS", text: "Awesome! I'll take a look and share feedback by EOD.", time: "9:43 AM" },
+  { id: "3", author: "You", initials: "JD", text: "Looks great, the new color palette really pops!", time: "9:45 AM", self: true },
+  { id: "4", author: "Alice Chen", initials: "AC", text: "Thanks! Let's sync tomorrow to go through the comments.", time: "9:47 AM" }
+];
+function ChatBubble({ msg }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("flex gap-2.5", msg.self && "flex-row-reverse"), children: [
+    /* @__PURE__ */ jsxRuntime.jsx(Avatar, { className: "h-7 w-7 shrink-0 mt-0.5", children: /* @__PURE__ */ jsxRuntime.jsx(AvatarFallback, { className: "text-xs", children: msg.initials }) }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("max-w-[70%]", msg.self && "items-end flex flex-col"), children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-baseline gap-2 mb-0.5", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs font-medium", children: msg.author }),
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[10px] text-[hsl(var(--muted-foreground))]", children: msg.time })
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn(
+        "rounded-[var(--radius)] px-3 py-2 text-sm",
+        msg.self ? "bg-[hsl(var(--primary))] text-[hsl(var(--primary-foreground))]" : "bg-[hsl(var(--muted))]"
+      ), children: msg.text })
+    ] })
+  ] });
+}
+function ChatDetail({ className }) {
+  const [messages, setMessages] = React14.useState(INITIAL_MESSAGES);
+  const [input, setInput] = React14.useState("");
+  const send = () => {
+    if (!input.trim())
+      return;
+    const now = (/* @__PURE__ */ new Date()).toLocaleTimeString([], { hour: "2-digit", minute: "2-digit" });
+    setMessages((m) => [...m, { id: `${Date.now()}`, author: "You", initials: "JD", text: input.trim(), time: now, self: true }]);
+    setInput("");
+  };
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("flex h-[480px] flex-col overflow-hidden rounded-[var(--radius)] border border-[hsl(var(--border))] bg-[hsl(var(--card))]", className), children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("header", { className: "flex items-center gap-3 border-b border-[hsl(var(--border))] px-4 py-3", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(Avatar, { className: "h-8 w-8", children: /* @__PURE__ */ jsxRuntime.jsx(AvatarFallback, { className: "text-xs", children: "AC" }) }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+        /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm font-semibold", children: "Design Team" }),
+        /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-[hsl(var(--muted-foreground))]", children: "4 members" })
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-1 overflow-auto p-4 space-y-4", children: messages.map((m) => /* @__PURE__ */ jsxRuntime.jsx(ChatBubble, { msg: m }, m.id)) }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 border-t border-[hsl(var(--border))] p-3", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
+        Input,
+        {
+          className: "flex-1 h-9 text-sm",
+          placeholder: "Type a message...",
+          value: input,
+          onChange: (e) => setInput(e.target.value),
+          onKeyDown: (e) => e.key === "Enter" && send()
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx(Button, { size: "icon", className: "h-9 w-9 shrink-0", onClick: send, children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Send, { className: "h-4 w-4" }) })
+    ] })
+  ] });
+}
+var MESSAGES = [
+  { id: "1", name: "Alice Chen", initials: "AC", preview: "Just pushed the new design files to Figma.", time: "9:41 AM", unread: true },
+  { id: "2", name: "Bob Smith", initials: "BS", preview: "I'll take a look and share feedback by EOD.", time: "9:43 AM", unread: true },
+  { id: "3", name: "Tom Ray", initials: "TR", preview: "Can we reschedule the standup to 10am?", time: "Yesterday" },
+  { id: "4", name: "Sara Kim", initials: "SK", preview: "Shipped the new auth flow. Ready for QA.", time: "Yesterday" },
+  { id: "5", name: "Mike Liu", initials: "ML", preview: "The latest metrics look promising \u{1F4C8}", time: "Mon" }
+];
+function MessageRow({ msg }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3 px-4 py-3 hover:bg-[hsl(var(--accent))] cursor-pointer transition-colors", children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative shrink-0", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(Avatar, { className: "h-9 w-9", children: /* @__PURE__ */ jsxRuntime.jsx(AvatarFallback, { className: "text-xs", children: msg.initials }) }),
+      msg.unread && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "absolute -top-0.5 -right-0.5 h-2.5 w-2.5 rounded-full bg-[hsl(var(--primary))] ring-2 ring-[hsl(var(--card))]" })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex-1 min-w-0", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between gap-2", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("text-sm truncate", msg.unread ? "font-semibold" : "font-medium"), children: msg.name }),
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs text-[hsl(var(--muted-foreground))] shrink-0", children: msg.time })
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("text-xs mt-0.5 truncate", msg.unread ? "text-[hsl(var(--foreground))]" : "text-[hsl(var(--muted-foreground))]"), children: msg.preview })
+    ] })
+  ] });
+}
+function MessagesCard({ className }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(Card, { className: cn("overflow-hidden", className), children: [
+    /* @__PURE__ */ jsxRuntime.jsx(CardHeader, { className: "px-4 py-3 border-b border-[hsl(var(--border))]", children: /* @__PURE__ */ jsxRuntime.jsxs(CardTitle, { className: "text-sm font-semibold flex items-center justify-between", children: [
+      "Messages",
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[10px] px-1.5 py-0.5 rounded-full bg-[hsl(var(--primary)/0.1)] text-[hsl(var(--primary))] font-medium", children: "2 new" })
+    ] }) }),
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "divide-y divide-[hsl(var(--border))]", children: MESSAGES.map((m) => /* @__PURE__ */ jsxRuntime.jsx(MessageRow, { msg: m }, m.id)) })
+  ] });
+}
+var FILES = [
+  { id: "1", name: "design-system.fig", type: "figma", size: "14.2 MB", modified: "Mar 12" },
+  { id: "2", name: "hero-banner.png", type: "image", size: "3.8 MB", modified: "Mar 11" },
+  { id: "3", name: "api-spec.yaml", type: "code", size: "42 KB", modified: "Mar 10" },
+  { id: "4", name: "demo-video.mp4", type: "video", size: "128 MB", modified: "Mar 9" },
+  { id: "5", name: "assets.zip", type: "archive", size: "56 MB", modified: "Mar 8" },
+  { id: "6", name: "meeting-notes.pdf", type: "pdf", size: "1.1 MB", modified: "Mar 7" }
+];
+var TYPE_ICON = {
+  figma: lucideReact.FileText,
+  image: lucideReact.Image,
+  code: lucideReact.FileCode,
+  video: lucideReact.Film,
+  archive: lucideReact.Archive,
+  pdf: lucideReact.FileText
+};
+var TYPE_COLOR = {
+  figma: "text-purple-500",
+  image: "text-green-500",
+  code: "text-blue-500",
+  video: "text-red-500",
+  archive: "text-yellow-500",
+  pdf: "text-orange-500"
+};
+function FileCard({ file }) {
+  const Icon2 = TYPE_ICON[file.type] ?? lucideReact.File;
+  return /* @__PURE__ */ jsxRuntime.jsx(Card, { className: "cursor-pointer hover:shadow-md transition-shadow", children: /* @__PURE__ */ jsxRuntime.jsxs(CardContent, { className: "p-4", children: [
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("flex h-10 w-10 items-center justify-center rounded-[var(--radius)] bg-[hsl(var(--muted))] mb-3", TYPE_COLOR[file.type]), children: /* @__PURE__ */ jsxRuntime.jsx(Icon2, { className: "h-5 w-5" }) }),
+    /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm font-medium truncate", children: file.name }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between mt-1", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs text-[hsl(var(--muted-foreground))]", children: file.size }),
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs text-[hsl(var(--muted-foreground))]", children: file.modified })
+    ] })
+  ] }) });
+}
+function FileCards({ files = FILES, className }) {
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("grid gap-3", className), style: { gridTemplateColumns: "repeat(auto-fill, minmax(min(100%,160px),1fr))" }, children: files.map((f) => /* @__PURE__ */ jsxRuntime.jsx(FileCard, { file: f }, f.id)) });
+}
+var FILES2 = [
+  { id: "1", name: "design-system.fig", type: "Figma", size: "14.2 MB", modified: "Mar 12, 2024" },
+  { id: "2", name: "hero-banner.png", type: "PNG Image", size: "3.8 MB", modified: "Mar 11, 2024" },
+  { id: "3", name: "api-spec.yaml", type: "YAML", size: "42 KB", modified: "Mar 10, 2024" },
+  { id: "4", name: "demo-video.mp4", type: "MP4 Video", size: "128 MB", modified: "Mar 9, 2024" },
+  { id: "5", name: "assets.zip", type: "ZIP Archive", size: "56 MB", modified: "Mar 8, 2024" }
+];
+var TYPE_ICON2 = {
+  Figma: lucideReact.FileText,
+  "PNG Image": lucideReact.Image,
+  YAML: lucideReact.FileCode,
+  "MP4 Video": lucideReact.Film,
+  "ZIP Archive": lucideReact.Archive
+};
+function FileRow({ file, onDelete }) {
+  const Icon2 = TYPE_ICON2[file.type] ?? lucideReact.FileText;
+  return /* @__PURE__ */ jsxRuntime.jsxs("tr", { className: "border-b border-[hsl(var(--border))] last:border-0 hover:bg-[hsl(var(--accent)/0.5)] transition-colors", children: [
+    /* @__PURE__ */ jsxRuntime.jsx("td", { className: "px-4 py-3", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2.5", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(Icon2, { className: "h-4 w-4 shrink-0 text-[hsl(var(--muted-foreground))]" }),
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm font-medium", children: file.name })
+    ] }) }),
+    /* @__PURE__ */ jsxRuntime.jsx("td", { className: "px-4 py-3 text-sm text-[hsl(var(--muted-foreground))]", children: file.type }),
+    /* @__PURE__ */ jsxRuntime.jsx("td", { className: "px-4 py-3 text-sm text-[hsl(var(--muted-foreground))]", children: file.size }),
+    /* @__PURE__ */ jsxRuntime.jsx("td", { className: "px-4 py-3 text-sm text-[hsl(var(--muted-foreground))]", children: file.modified }),
+    /* @__PURE__ */ jsxRuntime.jsx("td", { className: "px-4 py-3 text-right", children: /* @__PURE__ */ jsxRuntime.jsxs(DropdownMenu, { children: [
+      /* @__PURE__ */ jsxRuntime.jsx(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(Button, { size: "icon", variant: "ghost", className: "h-7 w-7", children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.MoreHorizontal, { className: "h-4 w-4" }) }) }),
+      /* @__PURE__ */ jsxRuntime.jsxs(DropdownMenuContent, { align: "end", children: [
+        /* @__PURE__ */ jsxRuntime.jsxs(DropdownMenuItem, { children: [
+          /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Download, { className: "h-4 w-4" }),
+          "Download"
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsxs(DropdownMenuItem, { onClick: onDelete, className: "text-[hsl(var(--destructive))]", children: [
+          /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Trash2, { className: "h-4 w-4" }),
+          "Delete"
+        ] })
+      ] })
+    ] }) })
+  ] });
+}
+function FilesList({ className }) {
+  const [files, setFiles] = React14__default.default.useState(FILES2);
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("rounded-[var(--radius)] border border-[hsl(var(--border))] overflow-hidden", className), children: /* @__PURE__ */ jsxRuntime.jsxs("table", { className: "w-full", children: [
+    /* @__PURE__ */ jsxRuntime.jsx("thead", { className: "bg-[hsl(var(--muted)/0.5)]", children: /* @__PURE__ */ jsxRuntime.jsx("tr", { children: ["Name", "Type", "Size", "Modified", ""].map((h) => /* @__PURE__ */ jsxRuntime.jsx("th", { className: "px-4 py-2.5 text-left text-xs font-medium text-[hsl(var(--muted-foreground))]", children: h }, h)) }) }),
+    /* @__PURE__ */ jsxRuntime.jsx("tbody", { children: files.map((f) => /* @__PURE__ */ jsxRuntime.jsx(FileRow, { file: f, onDelete: () => setFiles((fs) => fs.filter((x) => x.id !== f.id)) }, f.id)) })
+  ] }) });
+}
+var PRIORITY_COLOR = {
+  High: "bg-red-500/10 text-red-600 border-red-200",
+  Medium: "bg-yellow-500/10 text-yellow-600 border-yellow-200",
+  Low: "bg-green-500/10 text-green-600 border-green-200"
+};
+function TaskCard({
+  title = "Redesign onboarding flow",
+  description = "Update the user onboarding experience with the new design language.",
+  assigneeInitials = "AC",
+  dueDate = "Mar 20",
+  priority = "High",
+  className
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(Card, { className: cn("cursor-pointer hover:shadow-md transition-shadow", className), children: /* @__PURE__ */ jsxRuntime.jsxs(CardContent, { className: "p-4 space-y-3", children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-start justify-between gap-2", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm font-semibold leading-tight", children: title }),
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: cn("text-[10px] px-1.5 py-0.5 rounded-full border font-medium shrink-0", PRIORITY_COLOR[priority]), children: priority })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-[hsl(var(--muted-foreground))] leading-relaxed line-clamp-2", children: description }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(Avatar, { className: "h-6 w-6", children: /* @__PURE__ */ jsxRuntime.jsx(AvatarFallback, { className: "text-[10px]", children: assigneeInitials }) }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-1 text-xs text-[hsl(var(--muted-foreground))]", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Calendar, { className: "h-3 w-3" }),
+        dueDate
+      ] })
+    ] })
+  ] }) });
+}
+var LABEL_COLORS = ["bg-blue-100 text-blue-700", "bg-purple-100 text-purple-700", "bg-green-100 text-green-700"];
+function TaskCardWithLabels({
+  labels = ["Design", "Frontend"],
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(Card, { className: cn("cursor-pointer hover:shadow-md transition-shadow", props.className), children: /* @__PURE__ */ jsxRuntime.jsxs(CardContent, { className: "p-4 space-y-3", children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-start justify-between gap-2", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm font-semibold leading-tight", children: props.title ?? "Redesign onboarding flow" }),
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: cn("text-[10px] px-1.5 py-0.5 rounded-full border font-medium shrink-0", PRIORITY_COLOR[props.priority ?? "High"]), children: props.priority ?? "High" })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-[hsl(var(--muted-foreground))] leading-relaxed line-clamp-2", children: props.description ?? "Update the user onboarding experience with the new design language." }),
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-wrap gap-1", children: labels.map((l, i) => /* @__PURE__ */ jsxRuntime.jsx("span", { className: cn("text-[10px] px-1.5 py-0.5 rounded-full font-medium", LABEL_COLORS[i % LABEL_COLORS.length]), children: l }, l)) }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(Avatar, { className: "h-6 w-6", children: /* @__PURE__ */ jsxRuntime.jsx(AvatarFallback, { className: "text-[10px]", children: props.assigneeInitials ?? "AC" }) }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-1 text-xs text-[hsl(var(--muted-foreground))]", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Calendar, { className: "h-3 w-3" }),
+        props.dueDate ?? "Mar 20"
+      ] })
+    ] })
+  ] }) });
+}
+var TASKS = [
+  { id: "1", title: "Redesign onboarding flow", assignee: "AC", priority: "High", status: "In Progress", done: false },
+  { id: "2", title: "Fix authentication bug", assignee: "BS", priority: "High", status: "In Progress", done: false },
+  { id: "3", title: "Write API documentation", assignee: "JD", priority: "Medium", status: "Todo", done: false },
+  { id: "4", title: "Add dark mode support", assignee: "TR", priority: "Low", status: "Todo", done: false },
+  { id: "5", title: "Setup CI/CD pipeline", assignee: "SK", priority: "Medium", status: "Done", done: true },
+  { id: "6", title: "Deploy to staging", assignee: "ML", priority: "Low", status: "Done", done: true }
+];
+var PRIORITY_DOT = {
+  High: "bg-red-500",
+  Medium: "bg-yellow-500",
+  Low: "bg-green-500"
+};
+var SECTIONS = ["In Progress", "Todo", "Done"];
+function TaskRow({ task, onToggle }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3 px-3 py-2.5 hover:bg-[hsl(var(--accent)/0.5)] rounded-md transition-colors", children: [
+    /* @__PURE__ */ jsxRuntime.jsx(Checkbox, { checked: task.done, onCheckedChange: onToggle }),
+    /* @__PURE__ */ jsxRuntime.jsx("span", { className: cn("flex-1 text-sm", task.done && "line-through text-[hsl(var(--muted-foreground))]"), children: task.title }),
+    /* @__PURE__ */ jsxRuntime.jsx("span", { className: cn("h-2 w-2 rounded-full shrink-0", PRIORITY_DOT[task.priority]), title: task.priority }),
+    /* @__PURE__ */ jsxRuntime.jsx(Avatar, { className: "h-6 w-6 shrink-0", children: /* @__PURE__ */ jsxRuntime.jsx(AvatarFallback, { className: "text-[10px]", children: task.assignee }) })
+  ] });
+}
+function SortableTaskList({ className }) {
+  const [tasks, setTasks] = React14.useState(TASKS);
+  const toggle = (id) => setTasks((ts) => ts.map((t) => t.id === id ? { ...t, done: !t.done } : t));
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("rounded-[var(--radius)] border border-[hsl(var(--border))] bg-[hsl(var(--card))] p-4 space-y-4", className), children: SECTIONS.map((section) => {
+    const items = tasks.filter((t) => t.status === section);
+    return /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 mb-1.5", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs font-semibold text-[hsl(var(--muted-foreground))] uppercase tracking-wide", children: section }),
+        /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-xs text-[hsl(var(--muted-foreground))]", children: [
+          "(",
+          items.length,
+          ")"
+        ] })
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "space-y-0.5", children: items.map((task) => /* @__PURE__ */ jsxRuntime.jsx(TaskRow, { task, onToggle: () => toggle(task.id) }, task.id)) })
+    ] }, section);
+  }) });
+}
+
+Object.defineProperty(exports, "Form", {
+  enumerable: true,
+  get: function () { return reactHookForm.FormProvider; }
+});
+Object.defineProperty(exports, "toast", {
+  enumerable: true,
+  get: function () { return sonner.toast; }
+});
+exports.AppShell = AppShell;
+exports.AppShellMain = AppShellMain;
+exports.AppShellSidebar = AppShellSidebar;
+exports.AreaChart = AreaChart;
+exports.ArrayField = ArrayField;
+exports.AutoForm = AutoForm;
+exports.Avatar = Avatar;
+exports.AvatarFallback = AvatarFallback;
+exports.AvatarImage = AvatarImage;
+exports.Badge = Badge;
+exports.Banner = Banner;
+exports.BarChart = BarChart;
+exports.Beacon = Beacon;
+exports.BlinkUIProvider = BlinkUIProvider;
+exports.Breadcrumb = Breadcrumb;
+exports.BreadcrumbItem = BreadcrumbItem;
+exports.BreadcrumbPage = BreadcrumbPage;
+exports.BreadcrumbSeparator = BreadcrumbSeparator;
+exports.BulkActions = BulkActions;
+exports.Button = Button;
+exports.Card = Card;
+exports.CardContent = CardContent;
+exports.CardDescription = CardDescription;
+exports.CardFooter = CardFooter;
+exports.CardHeader = CardHeader;
+exports.CardTitle = CardTitle;
+exports.ChatDetail = ChatDetail;
+exports.Checkbox = Checkbox;
+exports.CommandBar = CommandBar;
+exports.CommandBarEmpty = CommandBarEmpty;
+exports.CommandBarGroup = CommandBarGroup;
+exports.CommandBarItem = CommandBarItem;
+exports.CommandItem = CommandItem;
+exports.Container = Container;
+exports.ContextMenu = ContextMenu;
+exports.ContextMenuCheckboxItem = ContextMenuCheckboxItem;
+exports.ContextMenuContent = ContextMenuContent;
+exports.ContextMenuGroup = ContextMenuGroup;
+exports.ContextMenuItem = ContextMenuItem;
+exports.ContextMenuLabel = ContextMenuLabel;
+exports.ContextMenuPortal = ContextMenuPortal;
+exports.ContextMenuRadioGroup = ContextMenuRadioGroup;
+exports.ContextMenuRadioItem = ContextMenuRadioItem;
+exports.ContextMenuSeparator = ContextMenuSeparator;
+exports.ContextMenuShortcut = ContextMenuShortcut;
+exports.ContextMenuSub = ContextMenuSub;
+exports.ContextMenuSubContent = ContextMenuSubContent;
+exports.ContextMenuSubTrigger = ContextMenuSubTrigger;
+exports.ContextMenuTrigger = ContextMenuTrigger;
+exports.DataGrid = DataGrid;
+exports.DataTable = DataTable;
+exports.DataTableColumnHeader = DataTableColumnHeader;
+exports.DataTablePagination = DataTablePagination;
+exports.DataTableToolbar = DataTableToolbar;
+exports.DatePicker = DatePicker;
+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.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.EmptyState = EmptyState;
+exports.EmptyStateIcon = EmptyStateIcon;
+exports.FeedbackModal = FeedbackModal;
+exports.Field = Field;
+exports.FieldDescription = FieldDescription;
+exports.FieldError = FieldError;
+exports.FieldLabel = FieldLabel;
+exports.FileCards = FileCards;
+exports.FileUpload = FileUpload;
+exports.FileUploadPreview = FileUploadPreview;
+exports.FilesList = FilesList;
+exports.FilterBadge = FilterBadge;
+exports.Filters = Filters;
+exports.FormControl = FormControl;
+exports.FormDescription = FormDescription;
+exports.FormField = FormField;
+exports.FormItem = FormItem;
+exports.FormLabel = FormLabel;
+exports.FormMessage = FormMessage;
+exports.HStack = HStack;
+exports.HotkeyBadge = HotkeyBadge;
+exports.Hotkeys = Hotkeys;
+exports.IconBadge = IconBadge;
+exports.Input = Input;
+exports.IntegrationCard = IntegrationCard;
+exports.InviteModal = InviteModal;
+exports.Kanban = Kanban;
+exports.KanbanCard = KanbanCard;
+exports.KanbanColumn = KanbanColumn;
+exports.LineChart = LineChart;
+exports.LoadingOverlay = LoadingOverlay;
+exports.ManageTagsModal = ManageTagsModal;
+exports.MessagesCard = MessagesCard;
+exports.MetricCard = MetricCard;
+exports.MetricCardWithButton = MetricCardWithButton;
+exports.MetricCardWithIcon = MetricCardWithIcon;
+exports.Navbar = Navbar;
+exports.NavbarBrand = NavbarBrand;
+exports.NavbarContent = NavbarContent;
+exports.NavbarItem = NavbarItem;
+exports.NotificationSettings = NotificationSettings;
+exports.ObjectField = ObjectField;
+exports.OrgMenu = OrgMenu;
+exports.Page = Page;
+exports.PageActions = PageActions;
+exports.PageBody = PageBody;
+exports.PageDescription = PageDescription;
+exports.PageHeader = PageHeader;
+exports.PageTitle = PageTitle;
+exports.PasswordInput = PasswordInput;
+exports.Persona = Persona;
+exports.Popover = Popover;
+exports.PopoverAnchor = PopoverAnchor;
+exports.PopoverContent = PopoverContent;
+exports.PopoverTrigger = PopoverTrigger;
+exports.Progress = Progress;
+exports.PropertyItem = PropertyItem;
+exports.PropertyList = PropertyList;
+exports.RadioGroup = RadioGroup;
+exports.RadioGroupItem = RadioGroupItem;
+exports.ResizeBox = ResizeBox;
+exports.ResizeHandle = ResizeHandle;
+exports.RolesMenu = RolesMenu;
+exports.SearchInput = SearchInput;
+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.SelectUsersModal = SelectUsersModal;
+exports.SelectValue = SelectValue;
+exports.Separator = Separator4;
+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.SidebarFooter = SidebarFooter;
+exports.SidebarGroup = SidebarGroup;
+exports.SidebarGroupLabel = SidebarGroupLabel;
+exports.SidebarHeader = SidebarHeader;
+exports.SidebarItem = SidebarItem;
+exports.SidebarLayoutDashboard = SidebarLayoutDashboard;
+exports.SidebarLayoutGroups = SidebarLayoutGroups;
+exports.SidebarLayoutMinimal = SidebarLayoutMinimal;
+exports.SidebarLayoutSearch = SidebarLayoutSearch;
+exports.SidebarLayoutUser = SidebarLayoutUser;
+exports.SidebarSeparator = SidebarSeparator;
+exports.Skeleton = Skeleton;
+exports.Slider = Slider;
+exports.SortableTaskList = SortableTaskList;
+exports.Sparkline = Sparkline;
+exports.SplitPage = SplitPage;
+exports.SplitPageDetail = SplitPageDetail;
+exports.SplitPageList = SplitPageList;
+exports.Stack = Stack;
+exports.StackedLayoutBranded = StackedLayoutBranded;
+exports.StackedLayoutTabs = StackedLayoutTabs;
+exports.Stat = Stat;
+exports.StatGroup = StatGroup;
+exports.StepForm = StepForm;
+exports.StepFormNavigation = StepFormNavigation;
+exports.StepFormStep = StepFormStep;
+exports.Stepper = Stepper;
+exports.StructuredList = StructuredList;
+exports.StructuredListItem = StructuredListItem;
+exports.StructuredListSection = StructuredListSection;
+exports.Switch = Switch;
+exports.Tabs = Tabs;
+exports.TabsContent = TabsContent;
+exports.TabsList = TabsList;
+exports.TabsTrigger = TabsTrigger;
+exports.TaskCard = TaskCard;
+exports.TaskCardWithLabels = TaskCardWithLabels;
+exports.Textarea = Textarea;
+exports.Timeline = Timeline;
+exports.TimelineConnector = TimelineConnector;
+exports.TimelineContent = TimelineContent;
+exports.TimelineItem = TimelineItem;
+exports.Toaster = Toaster;
+exports.ToggleButton = ToggleButton;
+exports.ToggleButtonGroup = ToggleButtonGroup;
+exports.Tooltip = Tooltip;
+exports.TooltipContent = TooltipContent;
+exports.TooltipProvider = TooltipProvider;
+exports.TooltipTrigger = TooltipTrigger;
+exports.Tour = Tour;
+exports.TourStep = TourStep;
+exports.UserMenu = UserMenu;
+exports.VStack = VStack;
+exports.WorkspaceMembers = WorkspaceMembers;
+exports.badgeVariants = badgeVariants;
+exports.buttonVariants = buttonVariants;
+exports.cn = cn;
+exports.useAppShell = useAppShell;
+exports.useBlinkUI = useBlinkUI;
+exports.useCommandBar = useCommandBar;
+exports.useTour = useTour;
+//# sourceMappingURL=out.js.map
+//# sourceMappingURL=index.js.map