@reinvented/design 0.1.0

package/dist/index.js

@@ -0,0 +1,1721 @@
+"use client";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
+
+// src/lib/utils.ts
+import { clsx } from "clsx";
+import { twMerge } from "tailwind-merge";
+function cn(...inputs) {
+  return twMerge(clsx(inputs));
+}
+
+// src/hooks/useMediaQuery.ts
+import { useCallback, useEffect, useState } from "react";
+function useMediaQuery(query) {
+  const getMatches = useCallback(() => {
+    if (typeof window === "undefined") return false;
+    return window.matchMedia(query).matches;
+  }, [query]);
+  const [matches, setMatches] = useState(getMatches);
+  useEffect(() => {
+    if (typeof window === "undefined") return;
+    const mql = window.matchMedia(query);
+    const handler = (e) => setMatches(e.matches);
+    setMatches(mql.matches);
+    mql.addEventListener("change", handler);
+    return () => mql.removeEventListener("change", handler);
+  }, [query]);
+  return matches;
+}
+
+// src/hooks/useTheme.ts
+import { useCallback as useCallback2, useEffect as useEffect2, useState as useState2 } from "react";
+function useTheme() {
+  const [theme, setThemeState] = useState2(() => {
+    if (typeof window === "undefined") return "dark";
+    return document.documentElement.getAttribute("data-theme") || "dark";
+  });
+  const setTheme = useCallback2((next) => {
+    document.documentElement.setAttribute("data-theme", next);
+    setThemeState(next);
+    try {
+      localStorage.setItem("ri-theme", next);
+    } catch {
+    }
+  }, []);
+  const toggleTheme = useCallback2(() => {
+    setTheme(theme === "dark" ? "light" : "dark");
+  }, [theme, setTheme]);
+  useEffect2(() => {
+    if (typeof window === "undefined") return;
+    const stored = localStorage.getItem("ri-theme");
+    if (stored) {
+      setTheme(stored);
+      return;
+    }
+    const prefersDark = window.matchMedia(
+      "(prefers-color-scheme: dark)"
+    ).matches;
+    setTheme(prefersDark ? "dark" : "light");
+  }, [setTheme]);
+  return { theme, setTheme, toggleTheme, isDark: theme === "dark" };
+}
+
+// src/icons/index.ts
+var icons_exports = {};
+__export(icons_exports, {
+  DynamicIcon: () => DynamicIcon,
+  icons: () => icons2
+});
+__reExport(icons_exports, lucide_react_star);
+import React from "react";
+import { icons } from "lucide-react";
+import { icons as icons2 } from "lucide-react";
+import * as lucide_react_star from "lucide-react";
+function DynamicIcon({ name, ...props }) {
+  const Icon2 = icons[name];
+  if (!Icon2) return null;
+  return React.createElement(Icon2, props);
+}
+
+// src/components/Button.tsx
+import React2 from "react";
+import { Slot } from "@radix-ui/react-slot";
+import { cva } from "class-variance-authority";
+import { jsx } from "react/jsx-runtime";
+var buttonVariants = cva(
+  [
+    "inline-flex items-center justify-center gap-2",
+    "whitespace-nowrap rounded-md font-medium",
+    "transition-all duration-fast ease-default",
+    "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accent/50 focus-visible:ring-offset-2 focus-visible:ring-offset-bg-base",
+    "disabled:pointer-events-none disabled:opacity-40",
+    "select-none cursor-pointer"
+  ].join(" "),
+  {
+    variants: {
+      variant: {
+        primary: "bg-accent text-accent-foreground hover:bg-accent-hover active:brightness-90",
+        secondary: "bg-bg-elevated text-fg-primary border border-border hover:bg-bg-surface hover:border-border-strong",
+        ghost: "text-fg-secondary hover:text-fg-primary hover:bg-bg-elevated",
+        destructive: "bg-semantic-error text-white hover:bg-semantic-error/90 active:brightness-90",
+        link: "text-accent underline-offset-4 hover:underline p-0 h-auto"
+      },
+      size: {
+        sm: "h-7 px-3 text-xs rounded-md",
+        md: "h-8 px-4 text-sm rounded-md",
+        lg: "h-10 px-5 text-base rounded-lg",
+        icon: "h-8 w-8 rounded-md"
+      }
+    },
+    defaultVariants: {
+      variant: "primary",
+      size: "md"
+    }
+  }
+);
+var Button = React2.forwardRef(
+  ({ className, variant, size, asChild = false, ...props }, ref) => {
+    const Comp = asChild ? Slot : "button";
+    return /* @__PURE__ */ jsx(
+      Comp,
+      {
+        className: cn(buttonVariants({ variant, size, className })),
+        ref,
+        ...props
+      }
+    );
+  }
+);
+Button.displayName = "Button";
+
+// src/components/Input.tsx
+import React3 from "react";
+import { jsx as jsx2, jsxs } from "react/jsx-runtime";
+var Input = React3.forwardRef(
+  ({ className, label, helperText, error, id, ...props }, ref) => {
+    const inputId = id || label?.toLowerCase().replace(/\s+/g, "-");
+    return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1.5", children: [
+      label && /* @__PURE__ */ jsx2(
+        "label",
+        {
+          htmlFor: inputId,
+          className: "text-sm font-medium text-fg-secondary",
+          children: label
+        }
+      ),
+      /* @__PURE__ */ jsx2(
+        "input",
+        {
+          id: inputId,
+          className: cn(
+            "flex h-8 w-full rounded-md border bg-bg-surface px-3 text-sm text-fg-primary",
+            "placeholder:text-fg-muted",
+            "transition-colors duration-fast ease-default",
+            "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accent/50 focus-visible:border-accent",
+            "disabled:cursor-not-allowed disabled:opacity-40",
+            error ? "border-semantic-error focus-visible:ring-semantic-error/50" : "border-border hover:border-border-strong",
+            className
+          ),
+          ref,
+          ...props
+        }
+      ),
+      error && /* @__PURE__ */ jsx2("p", { className: "text-xs text-semantic-error", children: error }),
+      !error && helperText && /* @__PURE__ */ jsx2("p", { className: "text-xs text-fg-muted", children: helperText })
+    ] });
+  }
+);
+Input.displayName = "Input";
+
+// src/components/Badge.tsx
+import { cva as cva2 } from "class-variance-authority";
+import { jsx as jsx3 } from "react/jsx-runtime";
+var badgeVariants = cva2(
+  "inline-flex items-center rounded-full px-2 py-0.5 text-xs font-medium transition-colors select-none",
+  {
+    variants: {
+      variant: {
+        default: "bg-bg-elevated text-fg-secondary border border-border",
+        accent: "bg-accent-muted text-accent border border-accent/20",
+        success: "bg-semantic-success-muted text-semantic-success border border-semantic-success/20",
+        warning: "bg-semantic-warning-muted text-semantic-warning border border-semantic-warning/20",
+        error: "bg-semantic-error-muted text-semantic-error border border-semantic-error/20",
+        info: "bg-semantic-info-muted text-semantic-info border border-semantic-info/20"
+      }
+    },
+    defaultVariants: {
+      variant: "default"
+    }
+  }
+);
+function Badge({ className, variant, ...props }) {
+  return /* @__PURE__ */ jsx3("span", { className: cn(badgeVariants({ variant, className })), ...props });
+}
+
+// src/components/Avatar.tsx
+import React4 from "react";
+import * as AvatarPrimitive from "@radix-ui/react-avatar";
+import { jsx as jsx4 } from "react/jsx-runtime";
+var Avatar = React4.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx4(
+  AvatarPrimitive.Root,
+  {
+    ref,
+    className: cn(
+      "relative flex h-8 w-8 shrink-0 overflow-hidden rounded-full",
+      className
+    ),
+    ...props
+  }
+));
+Avatar.displayName = "Avatar";
+var AvatarImage = React4.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx4(
+  AvatarPrimitive.Image,
+  {
+    ref,
+    className: cn("aspect-square h-full w-full object-cover", className),
+    ...props
+  }
+));
+AvatarImage.displayName = "AvatarImage";
+var AvatarFallback = React4.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx4(
+  AvatarPrimitive.Fallback,
+  {
+    ref,
+    className: cn(
+      "flex h-full w-full items-center justify-center rounded-full bg-bg-elevated text-xs font-medium text-fg-secondary",
+      className
+    ),
+    ...props
+  }
+));
+AvatarFallback.displayName = "AvatarFallback";
+
+// src/components/Card.tsx
+import React5 from "react";
+import { jsx as jsx5 } from "react/jsx-runtime";
+var Card = React5.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx5(
+  "div",
+  {
+    ref,
+    className: cn(
+      "rounded-lg border border-border-subtle bg-bg-surface",
+      "transition-colors duration-fast ease-default",
+      className
+    ),
+    ...props
+  }
+));
+Card.displayName = "Card";
+var CardHeader = React5.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx5(
+  "div",
+  {
+    ref,
+    className: cn("flex flex-col gap-1 px-4 pt-4", className),
+    ...props
+  }
+));
+CardHeader.displayName = "CardHeader";
+var CardTitle = React5.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx5(
+  "h3",
+  {
+    ref,
+    className: cn("text-sm font-semibold text-fg-primary tracking-tight", className),
+    ...props
+  }
+));
+CardTitle.displayName = "CardTitle";
+var CardDescription = React5.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx5(
+  "p",
+  {
+    ref,
+    className: cn("text-xs text-fg-muted", className),
+    ...props
+  }
+));
+CardDescription.displayName = "CardDescription";
+var CardContent = React5.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx5("div", { ref, className: cn("px-4 py-3", className), ...props }));
+CardContent.displayName = "CardContent";
+var CardFooter = React5.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx5(
+  "div",
+  {
+    ref,
+    className: cn("flex items-center px-4 pb-4 pt-0", className),
+    ...props
+  }
+));
+CardFooter.displayName = "CardFooter";
+
+// src/components/Label.tsx
+import React6 from "react";
+import * as LabelPrimitive from "@radix-ui/react-label";
+import { jsx as jsx6 } from "react/jsx-runtime";
+var Label = React6.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx6(
+  LabelPrimitive.Root,
+  {
+    ref,
+    className: cn(
+      "text-sm font-medium text-fg-secondary leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-40",
+      className
+    ),
+    ...props
+  }
+));
+Label.displayName = "Label";
+
+// src/components/Dialog.tsx
+import React7 from "react";
+import * as DialogPrimitive from "@radix-ui/react-dialog";
+import { X } from "lucide-react";
+import { jsx as jsx7, jsxs as jsxs2 } from "react/jsx-runtime";
+var Dialog = DialogPrimitive.Root;
+var DialogTrigger = DialogPrimitive.Trigger;
+var DialogClose = DialogPrimitive.Close;
+var DialogPortal = DialogPrimitive.Portal;
+var DialogOverlay = React7.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx7(
+  DialogPrimitive.Overlay,
+  {
+    ref,
+    className: cn(
+      "fixed inset-0 z-overlay bg-bg-overlay backdrop-blur-sm",
+      "data-[state=open]:animate-fade-in data-[state=closed]:animate-fade-out",
+      className
+    ),
+    ...props
+  }
+));
+DialogOverlay.displayName = "DialogOverlay";
+var DialogContent = React7.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs2(DialogPortal, { children: [
+  /* @__PURE__ */ jsx7(DialogOverlay, {}),
+  /* @__PURE__ */ jsxs2(
+    DialogPrimitive.Content,
+    {
+      ref,
+      className: cn(
+        "fixed left-1/2 top-1/2 z-modal -translate-x-1/2 -translate-y-1/2",
+        "w-full max-w-lg rounded-lg border border-border-subtle bg-bg-surface p-6 shadow-xl",
+        "data-[state=open]:animate-scale-in data-[state=closed]:animate-fade-out",
+        "focus:outline-none",
+        className
+      ),
+      ...props,
+      children: [
+        children,
+        /* @__PURE__ */ jsxs2(DialogPrimitive.Close, { className: "absolute right-4 top-4 rounded-sm text-fg-muted hover:text-fg-primary transition-colors duration-fast", children: [
+          /* @__PURE__ */ jsx7(X, { className: "h-4 w-4" }),
+          /* @__PURE__ */ jsx7("span", { className: "sr-only", children: "Close" })
+        ] })
+      ]
+    }
+  )
+] }));
+DialogContent.displayName = "DialogContent";
+var DialogHeader = ({
+  className,
+  ...props
+}) => /* @__PURE__ */ jsx7(
+  "div",
+  {
+    className: cn("flex flex-col gap-1 text-left", className),
+    ...props
+  }
+);
+var DialogTitle = React7.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx7(
+  DialogPrimitive.Title,
+  {
+    ref,
+    className: cn("text-lg font-semibold text-fg-primary tracking-tight", className),
+    ...props
+  }
+));
+DialogTitle.displayName = "DialogTitle";
+var DialogDescription = React7.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx7(
+  DialogPrimitive.Description,
+  {
+    ref,
+    className: cn("text-sm text-fg-muted", className),
+    ...props
+  }
+));
+DialogDescription.displayName = "DialogDescription";
+var DialogFooter = ({
+  className,
+  ...props
+}) => /* @__PURE__ */ jsx7(
+  "div",
+  {
+    className: cn("flex justify-end gap-2 pt-4", className),
+    ...props
+  }
+);
+
+// src/components/DropdownMenu.tsx
+import React8 from "react";
+import * as DropdownMenuPrimitive from "@radix-ui/react-dropdown-menu";
+import { jsx as jsx8 } from "react/jsx-runtime";
+var DropdownMenu = DropdownMenuPrimitive.Root;
+var DropdownMenuTrigger = DropdownMenuPrimitive.Trigger;
+var DropdownMenuGroup = DropdownMenuPrimitive.Group;
+var DropdownMenuSub = DropdownMenuPrimitive.Sub;
+var DropdownMenuRadioGroup = DropdownMenuPrimitive.RadioGroup;
+var DropdownMenuContent = React8.forwardRef(({ className, sideOffset = 4, ...props }, ref) => /* @__PURE__ */ jsx8(DropdownMenuPrimitive.Portal, { children: /* @__PURE__ */ jsx8(
+  DropdownMenuPrimitive.Content,
+  {
+    ref,
+    sideOffset,
+    className: cn(
+      "z-dropdown min-w-[8rem] overflow-hidden rounded-md border border-border-subtle bg-bg-elevated p-1 shadow-lg",
+      "data-[state=open]:animate-scale-in data-[state=closed]:animate-fade-out",
+      className
+    ),
+    ...props
+  }
+) }));
+DropdownMenuContent.displayName = "DropdownMenuContent";
+var DropdownMenuItem = React8.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsx8(
+  DropdownMenuPrimitive.Item,
+  {
+    ref,
+    className: cn(
+      "relative flex cursor-pointer select-none items-center gap-2 rounded-sm px-2 py-1.5 text-sm text-fg-secondary outline-none",
+      "hover:bg-bg-surface hover:text-fg-primary",
+      "focus:bg-bg-surface focus:text-fg-primary",
+      "data-[disabled]:pointer-events-none data-[disabled]:opacity-40",
+      "transition-colors duration-fast",
+      inset && "pl-8",
+      className
+    ),
+    ...props
+  }
+));
+DropdownMenuItem.displayName = "DropdownMenuItem";
+var DropdownMenuSeparator = React8.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx8(
+  DropdownMenuPrimitive.Separator,
+  {
+    ref,
+    className: cn("-mx-1 my-1 h-px bg-border", className),
+    ...props
+  }
+));
+DropdownMenuSeparator.displayName = "DropdownMenuSeparator";
+var DropdownMenuLabel = React8.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsx8(
+  DropdownMenuPrimitive.Label,
+  {
+    ref,
+    className: cn(
+      "px-2 py-1.5 text-xs font-medium text-fg-muted",
+      inset && "pl-8",
+      className
+    ),
+    ...props
+  }
+));
+DropdownMenuLabel.displayName = "DropdownMenuLabel";
+
+// src/components/Toast.tsx
+import React9 from "react";
+import * as ToastPrimitive from "@radix-ui/react-toast";
+import { cva as cva3 } from "class-variance-authority";
+import { X as X2 } from "lucide-react";
+import { jsx as jsx9 } from "react/jsx-runtime";
+var ToastProvider = ToastPrimitive.Provider;
+var ToastViewport = React9.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx9(
+  ToastPrimitive.Viewport,
+  {
+    ref,
+    className: cn(
+      "fixed bottom-0 right-0 z-toast flex max-h-screen w-full flex-col-reverse gap-2 p-4 sm:max-w-[420px]",
+      className
+    ),
+    ...props
+  }
+));
+ToastViewport.displayName = "ToastViewport";
+var toastVariants = cva3(
+  [
+    "group pointer-events-auto relative flex w-full items-center gap-3 overflow-hidden rounded-lg border px-4 py-3 shadow-lg",
+    "transition-all duration-normal ease-default",
+    "data-[state=open]:animate-slide-up data-[state=closed]:animate-fade-out",
+    "data-[swipe=cancel]:translate-x-0 data-[swipe=end]:translate-x-[var(--radix-toast-swipe-end-x)]",
+    "data-[swipe=move]:translate-x-[var(--radix-toast-swipe-move-x)] data-[swipe=move]:transition-none"
+  ].join(" "),
+  {
+    variants: {
+      variant: {
+        default: "border-border-subtle bg-bg-elevated text-fg-primary",
+        success: "border-semantic-success/20 bg-semantic-success-muted text-fg-primary",
+        error: "border-semantic-error/20 bg-semantic-error-muted text-fg-primary",
+        info: "border-semantic-info/20 bg-semantic-info-muted text-fg-primary"
+      }
+    },
+    defaultVariants: {
+      variant: "default"
+    }
+  }
+);
+var Toast = React9.forwardRef(({ className, variant, ...props }, ref) => /* @__PURE__ */ jsx9(
+  ToastPrimitive.Root,
+  {
+    ref,
+    className: cn(toastVariants({ variant }), className),
+    ...props
+  }
+));
+Toast.displayName = "Toast";
+var ToastAction = React9.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx9(
+  ToastPrimitive.Action,
+  {
+    ref,
+    className: cn(
+      "inline-flex h-7 shrink-0 items-center justify-center rounded-md border border-border bg-transparent px-3 text-xs font-medium",
+      "hover:bg-bg-surface transition-colors duration-fast",
+      "focus:outline-none focus:ring-2 focus:ring-accent/50",
+      "disabled:pointer-events-none disabled:opacity-40",
+      className
+    ),
+    ...props
+  }
+));
+ToastAction.displayName = "ToastAction";
+var ToastClose = React9.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx9(
+  ToastPrimitive.Close,
+  {
+    ref,
+    className: cn(
+      "absolute right-2 top-2 rounded-sm text-fg-muted hover:text-fg-primary transition-colors duration-fast",
+      className
+    ),
+    ...props,
+    children: /* @__PURE__ */ jsx9(X2, { className: "h-3.5 w-3.5" })
+  }
+));
+ToastClose.displayName = "ToastClose";
+var ToastTitle = React9.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx9(
+  ToastPrimitive.Title,
+  {
+    ref,
+    className: cn("text-sm font-semibold", className),
+    ...props
+  }
+));
+ToastTitle.displayName = "ToastTitle";
+var ToastDescription = React9.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx9(
+  ToastPrimitive.Description,
+  {
+    ref,
+    className: cn("text-xs text-fg-secondary", className),
+    ...props
+  }
+));
+ToastDescription.displayName = "ToastDescription";
+
+// src/components/Separator.tsx
+import React10 from "react";
+import * as SeparatorPrimitive from "@radix-ui/react-separator";
+import { jsx as jsx10 } from "react/jsx-runtime";
+var Separator2 = React10.forwardRef(
+  ({ className, orientation = "horizontal", decorative = true, ...props }, ref) => /* @__PURE__ */ jsx10(
+    SeparatorPrimitive.Root,
+    {
+      ref,
+      decorative,
+      orientation,
+      className: cn(
+        "shrink-0 bg-border",
+        orientation === "horizontal" ? "h-px w-full" : "h-full w-px",
+        className
+      ),
+      ...props
+    }
+  )
+);
+Separator2.displayName = "Separator";
+
+// src/components/ScrollArea.tsx
+import React11 from "react";
+import * as ScrollAreaPrimitive from "@radix-ui/react-scroll-area";
+import { jsx as jsx11, jsxs as jsxs3 } from "react/jsx-runtime";
+var ScrollArea = React11.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs3(
+  ScrollAreaPrimitive.Root,
+  {
+    ref,
+    className: cn("relative overflow-hidden", className),
+    ...props,
+    children: [
+      /* @__PURE__ */ jsx11(ScrollAreaPrimitive.Viewport, { className: "h-full w-full rounded-[inherit]", children }),
+      /* @__PURE__ */ jsx11(ScrollBar, {}),
+      /* @__PURE__ */ jsx11(ScrollAreaPrimitive.Corner, {})
+    ]
+  }
+));
+ScrollArea.displayName = "ScrollArea";
+var ScrollBar = React11.forwardRef(({ className, orientation = "vertical", ...props }, ref) => /* @__PURE__ */ jsx11(
+  ScrollAreaPrimitive.ScrollAreaScrollbar,
+  {
+    ref,
+    orientation,
+    className: cn(
+      "flex touch-none select-none transition-colors duration-fast",
+      orientation === "vertical" && "h-full w-1.5 border-l border-l-transparent p-px",
+      orientation === "horizontal" && "h-1.5 flex-col border-t border-t-transparent p-px",
+      className
+    ),
+    ...props,
+    children: /* @__PURE__ */ jsx11(ScrollAreaPrimitive.ScrollAreaThumb, { className: "relative flex-1 rounded-full bg-border-strong" })
+  }
+));
+ScrollBar.displayName = "ScrollBar";
+
+// src/components/Select.tsx
+import React12 from "react";
+import * as SelectPrimitive from "@radix-ui/react-select";
+import { ChevronDown, Check } from "lucide-react";
+import { jsx as jsx12, jsxs as jsxs4 } from "react/jsx-runtime";
+var Select = SelectPrimitive.Root;
+var SelectGroup = SelectPrimitive.Group;
+var SelectValue = SelectPrimitive.Value;
+var SelectTrigger = React12.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs4(
+  SelectPrimitive.Trigger,
+  {
+    ref,
+    className: cn(
+      "flex h-8 w-full items-center justify-between rounded-md border border-border bg-bg-surface px-3 text-sm text-fg-primary",
+      "placeholder:text-fg-muted",
+      "hover:border-border-strong",
+      "focus:outline-none focus:ring-2 focus:ring-accent/50 focus:border-accent",
+      "disabled:cursor-not-allowed disabled:opacity-40",
+      "transition-colors duration-fast",
+      className
+    ),
+    ...props,
+    children: [
+      children,
+      /* @__PURE__ */ jsx12(SelectPrimitive.Icon, { asChild: true, children: /* @__PURE__ */ jsx12(ChevronDown, { className: "h-3.5 w-3.5 text-fg-muted" }) })
+    ]
+  }
+));
+SelectTrigger.displayName = "SelectTrigger";
+var SelectContent = React12.forwardRef(({ className, children, position = "popper", ...props }, ref) => /* @__PURE__ */ jsx12(SelectPrimitive.Portal, { children: /* @__PURE__ */ jsx12(
+  SelectPrimitive.Content,
+  {
+    ref,
+    className: cn(
+      "relative z-dropdown max-h-60 min-w-[8rem] overflow-hidden rounded-md border border-border-subtle bg-bg-elevated shadow-lg",
+      "data-[state=open]:animate-scale-in data-[state=closed]:animate-fade-out",
+      position === "popper" && "data-[side=bottom]:translate-y-1 data-[side=top]:-translate-y-1",
+      className
+    ),
+    position,
+    ...props,
+    children: /* @__PURE__ */ jsx12(
+      SelectPrimitive.Viewport,
+      {
+        className: cn(
+          "p-1",
+          position === "popper" && "h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)]"
+        ),
+        children
+      }
+    )
+  }
+) }));
+SelectContent.displayName = "SelectContent";
+var SelectItem = React12.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs4(
+  SelectPrimitive.Item,
+  {
+    ref,
+    className: cn(
+      "relative flex w-full cursor-pointer select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm text-fg-secondary outline-none",
+      "hover:bg-bg-surface hover:text-fg-primary",
+      "focus:bg-bg-surface focus:text-fg-primary",
+      "data-[disabled]:pointer-events-none data-[disabled]:opacity-40",
+      "transition-colors duration-fast",
+      className
+    ),
+    ...props,
+    children: [
+      /* @__PURE__ */ jsx12("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsx12(SelectPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx12(Check, { className: "h-3.5 w-3.5 text-accent" }) }) }),
+      /* @__PURE__ */ jsx12(SelectPrimitive.ItemText, { children })
+    ]
+  }
+));
+SelectItem.displayName = "SelectItem";
+var SelectLabel = React12.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx12(
+  SelectPrimitive.Label,
+  {
+    ref,
+    className: cn("py-1.5 pl-8 pr-2 text-xs font-medium text-fg-muted", className),
+    ...props
+  }
+));
+SelectLabel.displayName = "SelectLabel";
+var SelectSeparator = React12.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx12(
+  SelectPrimitive.Separator,
+  {
+    ref,
+    className: cn("-mx-1 my-1 h-px bg-border", className),
+    ...props
+  }
+));
+SelectSeparator.displayName = "SelectSeparator";
+
+// src/components/Switch.tsx
+import React13 from "react";
+import * as SwitchPrimitive from "@radix-ui/react-switch";
+import { jsx as jsx13 } from "react/jsx-runtime";
+var Switch = React13.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx13(
+  SwitchPrimitive.Root,
+  {
+    className: cn(
+      "peer inline-flex h-5 w-9 shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent",
+      "transition-colors duration-fast ease-default",
+      "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accent/50 focus-visible:ring-offset-2 focus-visible:ring-offset-bg-base",
+      "disabled:cursor-not-allowed disabled:opacity-40",
+      "data-[state=checked]:bg-accent data-[state=unchecked]:bg-bg-elevated",
+      className
+    ),
+    ...props,
+    ref,
+    children: /* @__PURE__ */ jsx13(
+      SwitchPrimitive.Thumb,
+      {
+        className: cn(
+          "pointer-events-none block h-4 w-4 rounded-full bg-white shadow-sm",
+          "transition-transform duration-fast ease-default",
+          "data-[state=checked]:translate-x-4 data-[state=unchecked]:translate-x-0"
+        )
+      }
+    )
+  }
+));
+Switch.displayName = "Switch";
+
+// src/components/Checkbox.tsx
+import React14 from "react";
+import * as CheckboxPrimitive from "@radix-ui/react-checkbox";
+import { Check as Check2 } from "lucide-react";
+import { jsx as jsx14 } from "react/jsx-runtime";
+var Checkbox = React14.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx14(
+  CheckboxPrimitive.Root,
+  {
+    ref,
+    className: cn(
+      "peer h-4 w-4 shrink-0 rounded-sm border border-border bg-bg-surface",
+      "transition-colors duration-fast ease-default",
+      "hover:border-border-strong",
+      "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accent/50 focus-visible:ring-offset-2 focus-visible:ring-offset-bg-base",
+      "disabled:cursor-not-allowed disabled:opacity-40",
+      "data-[state=checked]:bg-accent data-[state=checked]:border-accent data-[state=checked]:text-accent-foreground",
+      className
+    ),
+    ...props,
+    children: /* @__PURE__ */ jsx14(CheckboxPrimitive.Indicator, { className: "flex items-center justify-center text-current", children: /* @__PURE__ */ jsx14(Check2, { className: "h-3 w-3" }) })
+  }
+));
+Checkbox.displayName = "Checkbox";
+
+// src/components/Tabs.tsx
+import React15 from "react";
+import * as TabsPrimitive from "@radix-ui/react-tabs";
+import { jsx as jsx15 } from "react/jsx-runtime";
+var Tabs = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx15(TabsPrimitive.Root, { ref, className: cn("", className), ...props }));
+Tabs.displayName = "Tabs";
+var TabsList = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx15(
+  TabsPrimitive.List,
+  {
+    ref,
+    className: cn(
+      "inline-flex h-8 items-center gap-1 rounded-md bg-bg-surface p-0.5",
+      className
+    ),
+    ...props
+  }
+));
+TabsList.displayName = "TabsList";
+var TabsTrigger = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx15(
+  TabsPrimitive.Trigger,
+  {
+    ref,
+    className: cn(
+      "inline-flex items-center justify-center whitespace-nowrap rounded-sm px-3 py-1 text-xs font-medium text-fg-muted",
+      "ring-offset-bg-base transition-all duration-fast",
+      "hover:text-fg-secondary",
+      "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accent/50 focus-visible:ring-offset-2",
+      "disabled:pointer-events-none disabled:opacity-40",
+      "data-[state=active]:bg-bg-elevated data-[state=active]:text-fg-primary data-[state=active]:shadow-sm",
+      className
+    ),
+    ...props
+  }
+));
+TabsTrigger.displayName = "TabsTrigger";
+var TabsContent = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx15(
+  TabsPrimitive.Content,
+  {
+    ref,
+    className: cn(
+      "mt-2 ring-offset-bg-base",
+      "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accent/50 focus-visible:ring-offset-2",
+      "data-[state=active]:animate-fade-in",
+      className
+    ),
+    ...props
+  }
+));
+TabsContent.displayName = "TabsContent";
+
+// src/components/Tooltip.tsx
+import React16 from "react";
+import * as TooltipPrimitive from "@radix-ui/react-tooltip";
+import { jsx as jsx16 } from "react/jsx-runtime";
+var TooltipProvider = TooltipPrimitive.Provider;
+var Tooltip = TooltipPrimitive.Root;
+var TooltipTrigger = TooltipPrimitive.Trigger;
+var TooltipContent = React16.forwardRef(({ className, sideOffset = 4, ...props }, ref) => /* @__PURE__ */ jsx16(
+  TooltipPrimitive.Content,
+  {
+    ref,
+    sideOffset,
+    className: cn(
+      "z-tooltip overflow-hidden rounded-md border border-border-subtle bg-bg-elevated px-3 py-1.5 text-xs text-fg-secondary shadow-md",
+      "animate-scale-in",
+      className
+    ),
+    ...props
+  }
+));
+TooltipContent.displayName = "TooltipContent";
+
+// src/components/Skeleton.tsx
+import { jsx as jsx17 } from "react/jsx-runtime";
+function Skeleton({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx17(
+    "div",
+    {
+      className: cn(
+        "animate-pulse-subtle rounded-md bg-bg-elevated",
+        className
+      ),
+      ...props
+    }
+  );
+}
+
+// src/components/Sheet.tsx
+import React17 from "react";
+import * as DialogPrimitive2 from "@radix-ui/react-dialog";
+import { cva as cva4 } from "class-variance-authority";
+import { X as X3 } from "lucide-react";
+import { jsx as jsx18, jsxs as jsxs5 } from "react/jsx-runtime";
+var Sheet = DialogPrimitive2.Root;
+var SheetTrigger = DialogPrimitive2.Trigger;
+var SheetClose = DialogPrimitive2.Close;
+var SheetPortal = DialogPrimitive2.Portal;
+var SheetOverlay = React17.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx18(
+  DialogPrimitive2.Overlay,
+  {
+    className: cn(
+      "fixed inset-0 z-overlay bg-bg-overlay backdrop-blur-sm",
+      "data-[state=open]:animate-fade-in data-[state=closed]:animate-fade-out",
+      className
+    ),
+    ...props,
+    ref
+  }
+));
+SheetOverlay.displayName = "SheetOverlay";
+var sheetVariants = cva4(
+  "fixed z-modal bg-bg-surface border-border-subtle shadow-xl transition-transform duration-slow ease-default focus:outline-none",
+  {
+    variants: {
+      side: {
+        top: "inset-x-0 top-0 border-b",
+        bottom: "inset-x-0 bottom-0 border-t",
+        left: "inset-y-0 left-0 h-full w-3/4 border-r sm:max-w-sm",
+        right: "inset-y-0 right-0 h-full w-3/4 border-l sm:max-w-sm"
+      }
+    },
+    defaultVariants: {
+      side: "right"
+    }
+  }
+);
+var SheetContent = React17.forwardRef(({ side = "right", className, children, ...props }, ref) => /* @__PURE__ */ jsxs5(SheetPortal, { children: [
+  /* @__PURE__ */ jsx18(SheetOverlay, {}),
+  /* @__PURE__ */ jsxs5(
+    DialogPrimitive2.Content,
+    {
+      ref,
+      className: cn(sheetVariants({ side }), className),
+      ...props,
+      children: [
+        children,
+        /* @__PURE__ */ jsxs5(DialogPrimitive2.Close, { className: "absolute right-4 top-4 rounded-sm text-fg-muted hover:text-fg-primary transition-colors duration-fast", children: [
+          /* @__PURE__ */ jsx18(X3, { className: "h-4 w-4" }),
+          /* @__PURE__ */ jsx18("span", { className: "sr-only", children: "Close" })
+        ] })
+      ]
+    }
+  )
+] }));
+SheetContent.displayName = "SheetContent";
+var SheetHeader = ({
+  className,
+  ...props
+}) => /* @__PURE__ */ jsx18(
+  "div",
+  {
+    className: cn("flex flex-col gap-1 p-4", className),
+    ...props
+  }
+);
+var SheetTitle = React17.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx18(
+  DialogPrimitive2.Title,
+  {
+    ref,
+    className: cn("text-lg font-semibold text-fg-primary", className),
+    ...props
+  }
+));
+SheetTitle.displayName = "SheetTitle";
+var SheetDescription = React17.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx18(
+  DialogPrimitive2.Description,
+  {
+    ref,
+    className: cn("text-sm text-fg-muted", className),
+    ...props
+  }
+));
+SheetDescription.displayName = "SheetDescription";
+
+// src/components/Spinner.tsx
+import { jsx as jsx19, jsxs as jsxs6 } from "react/jsx-runtime";
+function Spinner({ size = 16, className }) {
+  return /* @__PURE__ */ jsxs6(
+    "svg",
+    {
+      className: cn("animate-spin-slow text-fg-muted", className),
+      xmlns: "http://www.w3.org/2000/svg",
+      fill: "none",
+      viewBox: "0 0 24 24",
+      width: size,
+      height: size,
+      children: [
+        /* @__PURE__ */ jsx19(
+          "circle",
+          {
+            className: "opacity-25",
+            cx: "12",
+            cy: "12",
+            r: "10",
+            stroke: "currentColor",
+            strokeWidth: "3"
+          }
+        ),
+        /* @__PURE__ */ jsx19(
+          "path",
+          {
+            className: "opacity-75",
+            fill: "currentColor",
+            d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"
+          }
+        )
+      ]
+    }
+  );
+}
+
+// src/components/ErrorBoundary.tsx
+import React18 from "react";
+var ErrorBoundary = class extends React18.Component {
+  constructor(props) {
+    super(props);
+    this.state = { hasError: false, error: null };
+  }
+  static getDerivedStateFromError(error) {
+    return { hasError: true, error };
+  }
+  componentDidCatch(error, errorInfo) {
+    console.error("[ErrorBoundary]", error, errorInfo);
+  }
+  render() {
+    if (this.state.hasError) {
+      if (this.props.fallback) {
+        return this.props.fallback;
+      }
+      return React18.createElement(
+        "div",
+        {
+          style: {
+            display: "flex",
+            flexDirection: "column",
+            alignItems: "center",
+            justifyContent: "center",
+            gap: "8px",
+            padding: "32px",
+            textAlign: "center"
+          }
+        },
+        React18.createElement(
+          "p",
+          {
+            style: {
+              fontSize: "14px",
+              fontWeight: 500,
+              color: "var(--fg-primary)"
+            }
+          },
+          "Something went wrong"
+        ),
+        React18.createElement(
+          "p",
+          {
+            style: {
+              fontSize: "13px",
+              color: "var(--fg-muted)"
+            }
+          },
+          this.state.error?.message || "An unexpected error occurred"
+        ),
+        React18.createElement(
+          "button",
+          {
+            onClick: () => this.setState({ hasError: false, error: null }),
+            style: {
+              marginTop: "8px",
+              padding: "4px 12px",
+              fontSize: "13px",
+              fontWeight: 500,
+              color: "var(--accent-foreground)",
+              background: "var(--accent)",
+              border: "none",
+              borderRadius: "6px",
+              cursor: "pointer"
+            }
+          },
+          "Try again"
+        )
+      );
+    }
+    return this.props.children;
+  }
+};
+
+// src/components/CommandPalette.tsx
+import React19, { useCallback as useCallback3, useEffect as useEffect3, useState as useState3 } from "react";
+import { Command as CommandPrimitive } from "cmdk";
+import { Search } from "lucide-react";
+import { jsx as jsx20, jsxs as jsxs7 } from "react/jsx-runtime";
+var Command = React19.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx20(
+  CommandPrimitive,
+  {
+    ref,
+    className: cn(
+      "flex h-full w-full flex-col overflow-hidden rounded-lg bg-bg-elevated text-fg-primary",
+      className
+    ),
+    ...props
+  }
+));
+Command.displayName = "Command";
+var CommandInput = React19.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxs7("div", { className: "flex items-center gap-2 border-b border-border px-3", children: [
+  /* @__PURE__ */ jsx20(Search, { className: "h-4 w-4 shrink-0 text-fg-muted" }),
+  /* @__PURE__ */ jsx20(
+    CommandPrimitive.Input,
+    {
+      ref,
+      className: cn(
+        "flex h-10 w-full bg-transparent text-sm text-fg-primary outline-none",
+        "placeholder:text-fg-muted",
+        "disabled:cursor-not-allowed disabled:opacity-40",
+        className
+      ),
+      ...props
+    }
+  )
+] }));
+CommandInput.displayName = "CommandInput";
+var CommandList = React19.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx20(
+  CommandPrimitive.List,
+  {
+    ref,
+    className: cn(
+      "max-h-[300px] overflow-y-auto overflow-x-hidden p-1",
+      className
+    ),
+    ...props
+  }
+));
+CommandList.displayName = "CommandList";
+var CommandEmpty = React19.forwardRef((props, ref) => /* @__PURE__ */ jsx20(
+  CommandPrimitive.Empty,
+  {
+    ref,
+    className: "py-6 text-center text-sm text-fg-muted",
+    ...props
+  }
+));
+CommandEmpty.displayName = "CommandEmpty";
+var CommandGroup = React19.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx20(
+  CommandPrimitive.Group,
+  {
+    ref,
+    className: cn(
+      "overflow-hidden py-1 text-fg-primary [&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:py-1.5 [&_[cmdk-group-heading]]:text-xs [&_[cmdk-group-heading]]:font-medium [&_[cmdk-group-heading]]:text-fg-muted",
+      className
+    ),
+    ...props
+  }
+));
+CommandGroup.displayName = "CommandGroup";
+var CommandItem = React19.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx20(
+  CommandPrimitive.Item,
+  {
+    ref,
+    className: cn(
+      "relative flex cursor-pointer select-none items-center gap-2 rounded-sm px-2 py-1.5 text-sm text-fg-secondary outline-none",
+      "data-[selected=true]:bg-bg-surface data-[selected=true]:text-fg-primary",
+      "data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-40",
+      "transition-colors duration-fast",
+      className
+    ),
+    ...props
+  }
+));
+CommandItem.displayName = "CommandItem";
+var CommandSeparator = React19.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx20(
+  CommandPrimitive.Separator,
+  {
+    ref,
+    className: cn("-mx-1 h-px bg-border", className),
+    ...props
+  }
+));
+CommandSeparator.displayName = "CommandSeparator";
+var CommandShortcut = ({
+  className,
+  ...props
+}) => /* @__PURE__ */ jsx20(
+  "span",
+  {
+    className: cn("ml-auto text-xs tracking-wide text-fg-muted", className),
+    ...props
+  }
+);
+function CommandPalette({
+  open: controlledOpen,
+  onOpenChange,
+  placeholder = "Type a command or search\u2026",
+  children
+}) {
+  const [internalOpen, setInternalOpen] = useState3(false);
+  const isOpen = controlledOpen ?? internalOpen;
+  const handleOpenChange = useCallback3(
+    (next) => {
+      setInternalOpen(next);
+      onOpenChange?.(next);
+    },
+    [onOpenChange]
+  );
+  useEffect3(() => {
+    const handleKeyDown = (e) => {
+      if ((e.metaKey || e.ctrlKey) && e.key === "k") {
+        e.preventDefault();
+        handleOpenChange(!isOpen);
+      }
+    };
+    document.addEventListener("keydown", handleKeyDown);
+    return () => document.removeEventListener("keydown", handleKeyDown);
+  }, [isOpen, handleOpenChange]);
+  if (!isOpen) return null;
+  return /* @__PURE__ */ jsxs7("div", { className: "fixed inset-0 z-modal", children: [
+    /* @__PURE__ */ jsx20(
+      "div",
+      {
+        className: "fixed inset-0 bg-bg-overlay backdrop-blur-sm animate-fade-in",
+        onClick: () => handleOpenChange(false)
+      }
+    ),
+    /* @__PURE__ */ jsx20("div", { className: "fixed left-1/2 top-[20%] z-modal w-full max-w-lg -translate-x-1/2 animate-scale-in", children: /* @__PURE__ */ jsxs7(
+      Command,
+      {
+        className: "rounded-lg border border-border-subtle shadow-xl",
+        onKeyDown: (e) => {
+          if (e.key === "Escape") {
+            handleOpenChange(false);
+          }
+        },
+        children: [
+          /* @__PURE__ */ jsx20(CommandInput, { placeholder }),
+          /* @__PURE__ */ jsx20(CommandList, { children })
+        ]
+      }
+    ) })
+  ] });
+}
+
+// src/components/ContentCard.tsx
+import { jsx as jsx21, jsxs as jsxs8 } from "react/jsx-runtime";
+function ContentCard({ title, description, children }) {
+  return /* @__PURE__ */ jsxs8(
+    "div",
+    {
+      style: {
+        borderRadius: "var(--radius-lg)",
+        border: "1px solid var(--border-subtle)",
+        background: "var(--bg-surface)",
+        padding: "var(--space-4)",
+        display: "flex",
+        flexDirection: "column",
+        gap: "var(--space-3)"
+      },
+      children: [
+        (title || description) && /* @__PURE__ */ jsxs8("div", { style: { display: "flex", flexDirection: "column", gap: "var(--space-1)" }, children: [
+          title && /* @__PURE__ */ jsx21(
+            "h3",
+            {
+              style: {
+                fontSize: "var(--text-sm)",
+                fontWeight: "var(--font-semibold)",
+                color: "var(--fg-primary)",
+                letterSpacing: "var(--tracking-tight)",
+                lineHeight: "var(--leading-tight)",
+                margin: 0
+              },
+              children: title
+            }
+          ),
+          description && /* @__PURE__ */ jsx21(
+            "p",
+            {
+              style: {
+                fontSize: "var(--text-xs)",
+                color: "var(--fg-muted)",
+                lineHeight: "var(--leading-normal)",
+                margin: 0
+              },
+              children: description
+            }
+          )
+        ] }),
+        children
+      ]
+    }
+  );
+}
+
+// src/components/PageHeader.tsx
+import { jsx as jsx22, jsxs as jsxs9 } from "react/jsx-runtime";
+function PageHeader({ title, description, actions }) {
+  return /* @__PURE__ */ jsxs9(
+    "div",
+    {
+      style: {
+        display: "flex",
+        alignItems: "flex-start",
+        justifyContent: "space-between",
+        gap: "var(--space-4)",
+        paddingBottom: "var(--space-6)"
+      },
+      children: [
+        /* @__PURE__ */ jsxs9("div", { style: { display: "flex", flexDirection: "column", gap: "var(--space-1)" }, children: [
+          /* @__PURE__ */ jsx22(
+            "h1",
+            {
+              style: {
+                fontSize: "var(--text-2xl)",
+                fontWeight: "var(--font-semibold)",
+                color: "var(--fg-primary)",
+                letterSpacing: "var(--tracking-tight)",
+                lineHeight: "var(--leading-tight)",
+                margin: 0
+              },
+              children: title
+            }
+          ),
+          description && /* @__PURE__ */ jsx22(
+            "p",
+            {
+              style: {
+                fontSize: "var(--text-sm)",
+                color: "var(--fg-muted)",
+                lineHeight: "var(--leading-normal)",
+                margin: 0
+              },
+              children: description
+            }
+          )
+        ] }),
+        actions && /* @__PURE__ */ jsx22("div", { style: { display: "flex", alignItems: "center", gap: "var(--space-2)", flexShrink: 0 }, children: actions })
+      ]
+    }
+  );
+}
+
+// src/components/ListItem.tsx
+import { jsx as jsx23, jsxs as jsxs10 } from "react/jsx-runtime";
+function ListItem({
+  leading,
+  title,
+  description,
+  trailing,
+  onClick
+}) {
+  const interactive = !!onClick;
+  return /* @__PURE__ */ jsxs10(
+    "div",
+    {
+      role: interactive ? "button" : void 0,
+      tabIndex: interactive ? 0 : void 0,
+      onClick,
+      onKeyDown: interactive ? (e) => {
+        if (e.key === "Enter" || e.key === " ") {
+          e.preventDefault();
+          onClick?.();
+        }
+      } : void 0,
+      style: {
+        display: "flex",
+        alignItems: "center",
+        gap: "var(--space-3)",
+        padding: "var(--space-2) var(--space-3)",
+        borderRadius: "var(--radius-md)",
+        cursor: interactive ? "pointer" : "default",
+        transition: "background var(--duration-fast) var(--ease-default)"
+      },
+      onMouseEnter: (e) => {
+        if (interactive) {
+          e.currentTarget.style.background = "var(--bg-elevated)";
+        }
+      },
+      onMouseLeave: (e) => {
+        if (interactive) {
+          e.currentTarget.style.background = "transparent";
+        }
+      },
+      children: [
+        leading && /* @__PURE__ */ jsx23(
+          "div",
+          {
+            style: {
+              flexShrink: 0,
+              display: "flex",
+              alignItems: "center",
+              justifyContent: "center",
+              color: "var(--fg-muted)"
+            },
+            children: leading
+          }
+        ),
+        /* @__PURE__ */ jsxs10("div", { style: { flex: 1, minWidth: 0 }, children: [
+          /* @__PURE__ */ jsx23(
+            "div",
+            {
+              style: {
+                fontSize: "var(--text-sm)",
+                fontWeight: "var(--font-medium)",
+                color: "var(--fg-primary)",
+                lineHeight: "var(--leading-tight)",
+                whiteSpace: "nowrap",
+                overflow: "hidden",
+                textOverflow: "ellipsis"
+              },
+              children: title
+            }
+          ),
+          description && /* @__PURE__ */ jsx23(
+            "div",
+            {
+              style: {
+                fontSize: "var(--text-xs)",
+                color: "var(--fg-muted)",
+                lineHeight: "var(--leading-normal)",
+                whiteSpace: "nowrap",
+                overflow: "hidden",
+                textOverflow: "ellipsis"
+              },
+              children: description
+            }
+          )
+        ] }),
+        trailing && /* @__PURE__ */ jsx23("div", { style: { flexShrink: 0, display: "flex", alignItems: "center" }, children: trailing })
+      ]
+    }
+  );
+}
+
+// src/components/FormSection.tsx
+import { jsx as jsx24, jsxs as jsxs11 } from "react/jsx-runtime";
+function FormSection({ title, description, children }) {
+  return /* @__PURE__ */ jsxs11(
+    "div",
+    {
+      style: {
+        display: "flex",
+        flexDirection: "column",
+        gap: "var(--space-4)",
+        paddingBottom: "var(--space-6)",
+        borderBottom: "1px solid var(--border-subtle)"
+      },
+      children: [
+        /* @__PURE__ */ jsxs11("div", { style: { display: "flex", flexDirection: "column", gap: "var(--space-1)" }, children: [
+          /* @__PURE__ */ jsx24(
+            "h2",
+            {
+              style: {
+                fontSize: "var(--text-base)",
+                fontWeight: "var(--font-semibold)",
+                color: "var(--fg-primary)",
+                letterSpacing: "var(--tracking-tight)",
+                margin: 0
+              },
+              children: title
+            }
+          ),
+          description && /* @__PURE__ */ jsx24(
+            "p",
+            {
+              style: {
+                fontSize: "var(--text-sm)",
+                color: "var(--fg-muted)",
+                lineHeight: "var(--leading-normal)",
+                margin: 0
+              },
+              children: description
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsx24("div", { style: { display: "flex", flexDirection: "column", gap: "var(--space-4)" }, children })
+      ]
+    }
+  );
+}
+
+// src/components/ActionBar.tsx
+import { jsx as jsx25, jsxs as jsxs12 } from "react/jsx-runtime";
+function ActionBar({ primaryAction, secondaryAction }) {
+  return /* @__PURE__ */ jsxs12(
+    "div",
+    {
+      style: {
+        position: "sticky",
+        bottom: 0,
+        display: "flex",
+        alignItems: "center",
+        justifyContent: "space-between",
+        gap: "var(--space-3)",
+        padding: "var(--space-3) var(--space-4)",
+        borderTop: "1px solid var(--border-subtle)",
+        background: "var(--bg-surface)"
+      },
+      children: [
+        /* @__PURE__ */ jsx25("div", { style: { display: "flex", alignItems: "center", gap: "var(--space-2)" }, children: secondaryAction }),
+        /* @__PURE__ */ jsx25("div", { style: { display: "flex", alignItems: "center", gap: "var(--space-2)" }, children: primaryAction })
+      ]
+    }
+  );
+}
+
+// src/components/EmptyState.tsx
+import { jsx as jsx26, jsxs as jsxs13 } from "react/jsx-runtime";
+function EmptyState({ icon, title, description, action }) {
+  return /* @__PURE__ */ jsxs13(
+    "div",
+    {
+      style: {
+        display: "flex",
+        flexDirection: "column",
+        alignItems: "center",
+        justifyContent: "center",
+        textAlign: "center",
+        padding: "var(--space-12) var(--space-6)",
+        gap: "var(--space-3)"
+      },
+      children: [
+        icon && /* @__PURE__ */ jsx26("div", { style: { color: "var(--fg-disabled)", marginBottom: "var(--space-1)" }, children: icon }),
+        /* @__PURE__ */ jsx26(
+          "h3",
+          {
+            style: {
+              fontSize: "var(--text-base)",
+              fontWeight: "var(--font-semibold)",
+              color: "var(--fg-primary)",
+              margin: 0
+            },
+            children: title
+          }
+        ),
+        description && /* @__PURE__ */ jsx26(
+          "p",
+          {
+            style: {
+              fontSize: "var(--text-sm)",
+              color: "var(--fg-muted)",
+              lineHeight: "var(--leading-normal)",
+              maxWidth: "320px",
+              margin: 0
+            },
+            children: description
+          }
+        ),
+        action && /* @__PURE__ */ jsx26("div", { style: { marginTop: "var(--space-2)" }, children: action })
+      ]
+    }
+  );
+}
+
+// src/components/Layout.tsx
+import { jsx as jsx27, jsxs as jsxs14 } from "react/jsx-runtime";
+function AppShell({ topBar, sideRail, bottomBar, children, className }) {
+  return /* @__PURE__ */ jsxs14("div", { className: cn("flex h-screen w-screen flex-col bg-bg-base text-fg-primary overflow-hidden", className), children: [
+    topBar,
+    /* @__PURE__ */ jsxs14("div", { className: "flex flex-1 overflow-hidden", children: [
+      sideRail,
+      /* @__PURE__ */ jsx27("main", { className: "flex-1 overflow-y-auto", children })
+    ] }),
+    bottomBar
+  ] });
+}
+function TopBar({ brand, center, actions, className }) {
+  return /* @__PURE__ */ jsxs14(
+    "header",
+    {
+      className: cn(
+        "flex h-12 shrink-0 items-center justify-between gap-4 border-b border-border-subtle bg-bg-base px-4",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsx27("div", { className: "flex items-center gap-3", children: brand }),
+        /* @__PURE__ */ jsx27("div", { className: "flex flex-1 items-center justify-center", children: center }),
+        /* @__PURE__ */ jsx27("div", { className: "flex items-center gap-2", children: actions })
+      ]
+    }
+  );
+}
+function SideRail({ children, className }) {
+  return /* @__PURE__ */ jsx27(
+    "nav",
+    {
+      className: cn(
+        "flex w-12 shrink-0 flex-col items-center gap-1 border-r border-border-subtle bg-bg-base py-2",
+        className
+      ),
+      children
+    }
+  );
+}
+function SideRailItem({ children, active, onClick, tooltip }) {
+  return /* @__PURE__ */ jsx27(
+    "button",
+    {
+      title: tooltip,
+      onClick,
+      className: cn(
+        "flex h-8 w-8 items-center justify-center rounded-md transition-colors duration-fast",
+        active ? "bg-accent-muted text-accent" : "text-fg-muted hover:text-fg-secondary hover:bg-bg-elevated"
+      ),
+      children
+    }
+  );
+}
+function BottomBar({ children, className }) {
+  return /* @__PURE__ */ jsx27(
+    "nav",
+    {
+      className: cn(
+        "flex shrink-0 items-center justify-around border-t border-border-subtle bg-bg-base px-2 py-1 md:hidden",
+        className
+      ),
+      children
+    }
+  );
+}
+function BottomBarItem({ children, label, active, onClick }) {
+  return /* @__PURE__ */ jsxs14(
+    "button",
+    {
+      onClick,
+      className: cn(
+        "flex flex-col items-center gap-0.5 px-3 py-1 text-xs transition-colors duration-fast",
+        active ? "text-accent" : "text-fg-muted"
+      ),
+      children: [
+        children,
+        label && /* @__PURE__ */ jsx27("span", { children: label })
+      ]
+    }
+  );
+}
+function PageContainer({ children, className }) {
+  return /* @__PURE__ */ jsx27(
+    "div",
+    {
+      className: cn(
+        "mx-auto w-full max-w-5xl px-4 py-6 sm:px-6 lg:px-8",
+        className
+      ),
+      children
+    }
+  );
+}
+export {
+  ActionBar,
+  AppShell,
+  Avatar,
+  AvatarFallback,
+  AvatarImage,
+  Badge,
+  BottomBar,
+  BottomBarItem,
+  Button,
+  Card,
+  CardContent,
+  CardDescription,
+  CardFooter,
+  CardHeader,
+  CardTitle,
+  Checkbox,
+  Command,
+  CommandEmpty,
+  CommandGroup,
+  CommandInput,
+  CommandItem,
+  CommandList,
+  CommandPalette,
+  CommandSeparator,
+  CommandShortcut,
+  ContentCard,
+  Dialog,
+  DialogClose,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogOverlay,
+  DialogPortal,
+  DialogTitle,
+  DialogTrigger,
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuGroup,
+  DropdownMenuItem,
+  DropdownMenuLabel,
+  DropdownMenuRadioGroup,
+  DropdownMenuSeparator,
+  DropdownMenuSub,
+  DropdownMenuTrigger,
+  DynamicIcon,
+  EmptyState,
+  ErrorBoundary,
+  FormSection,
+  Input,
+  Label,
+  ListItem,
+  PageContainer,
+  PageHeader,
+  ScrollArea,
+  ScrollBar,
+  Select,
+  SelectContent,
+  SelectGroup,
+  SelectItem,
+  SelectLabel,
+  SelectSeparator,
+  SelectTrigger,
+  SelectValue,
+  Separator2 as Separator,
+  Sheet,
+  SheetClose,
+  SheetContent,
+  SheetDescription,
+  SheetHeader,
+  SheetTitle,
+  SheetTrigger,
+  SideRail,
+  SideRailItem,
+  Skeleton,
+  Spinner,
+  Switch,
+  Tabs,
+  TabsContent,
+  TabsList,
+  TabsTrigger,
+  Toast,
+  ToastAction,
+  ToastClose,
+  ToastDescription,
+  ToastProvider,
+  ToastTitle,
+  ToastViewport,
+  Tooltip,
+  TooltipContent,
+  TooltipProvider,
+  TooltipTrigger,
+  TopBar,
+  badgeVariants,
+  buttonVariants,
+  cn,
+  icons2 as icons,
+  toastVariants,
+  useMediaQuery,
+  useTheme
+};
+//# sourceMappingURL=index.js.map