@onesaz/ui 0.1.0

package/dist/index.js

@@ -0,0 +1,1204 @@
+// src/theme/provider.tsx
+import * as React from "react";
+import {
+  accentColors,
+  grayColors,
+  radiusPresets,
+  lightTheme,
+  darkTheme
+} from "@onesaz/tokens";
+
+// src/theme/context.ts
+import { createContext } from "react";
+var ThemeContext = createContext(void 0);
+
+// src/theme/provider.tsx
+import { jsx } from "react/jsx-runtime";
+function getSystemTheme() {
+  if (typeof window === "undefined") return "light";
+  return window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light";
+}
+function ThemeProvider({
+  children,
+  defaultTheme = "system",
+  accentColor: defaultAccent = "purple",
+  grayColor: defaultGray = "slate",
+  radius: defaultRadius = "medium",
+  storageKey = "onesaz-theme"
+}) {
+  const [theme, setThemeState] = React.useState(() => {
+    if (typeof window === "undefined") return defaultTheme;
+    const stored = localStorage.getItem(`${storageKey}-mode`);
+    return stored || defaultTheme;
+  });
+  const [accentColor, setAccentColorState] = React.useState(() => {
+    if (typeof window === "undefined") return defaultAccent;
+    const stored = localStorage.getItem(`${storageKey}-accent`);
+    return stored || defaultAccent;
+  });
+  const [grayColor, setGrayColorState] = React.useState(() => {
+    if (typeof window === "undefined") return defaultGray;
+    const stored = localStorage.getItem(`${storageKey}-gray`);
+    return stored || defaultGray;
+  });
+  const [radius, setRadiusState] = React.useState(() => {
+    if (typeof window === "undefined") return defaultRadius;
+    const stored = localStorage.getItem(`${storageKey}-radius`);
+    return stored || defaultRadius;
+  });
+  const [resolvedTheme, setResolvedTheme] = React.useState(
+    () => theme === "system" ? getSystemTheme() : theme
+  );
+  React.useEffect(() => {
+    if (theme !== "system") {
+      setResolvedTheme(theme);
+      return;
+    }
+    const mediaQuery = window.matchMedia("(prefers-color-scheme: dark)");
+    setResolvedTheme(mediaQuery.matches ? "dark" : "light");
+    const handler = (e) => {
+      setResolvedTheme(e.matches ? "dark" : "light");
+    };
+    mediaQuery.addEventListener("change", handler);
+    return () => mediaQuery.removeEventListener("change", handler);
+  }, [theme]);
+  React.useEffect(() => {
+    const root = document.documentElement;
+    const themeTokens = resolvedTheme === "dark" ? darkTheme : lightTheme;
+    const accent = accentColors[accentColor];
+    const gray = grayColors[grayColor];
+    const radiusValues = radiusPresets[radius];
+    root.setAttribute("data-theme", resolvedTheme);
+    root.setAttribute("data-accent", accentColor);
+    root.style.setProperty("--background", gray[themeTokens.background]);
+    root.style.setProperty("--foreground", gray[themeTokens.foreground]);
+    root.style.setProperty("--card", gray[themeTokens.card]);
+    root.style.setProperty("--card-foreground", gray[themeTokens.cardForeground]);
+    root.style.setProperty("--popover", gray[themeTokens.popover]);
+    root.style.setProperty("--popover-foreground", gray[themeTokens.popoverForeground]);
+    root.style.setProperty("--muted", gray[themeTokens.muted]);
+    root.style.setProperty("--muted-foreground", gray[themeTokens.mutedForeground]);
+    root.style.setProperty("--border", gray[themeTokens.border]);
+    root.style.setProperty("--input", gray[themeTokens.input]);
+    root.style.setProperty("--accent", accent[6]);
+    root.style.setProperty("--accent-foreground", "#ffffff");
+    root.style.setProperty("--accent-hover", accent[7]);
+    root.style.setProperty("--ring", accent[6]);
+    Object.entries(accent).forEach(([step, value2]) => {
+      root.style.setProperty(`--accent-${step}`, value2);
+    });
+    root.style.setProperty("--destructive", resolvedTheme === "dark" ? "#ef4444" : "#dc2626");
+    root.style.setProperty("--destructive-foreground", "#ffffff");
+    root.style.setProperty("--radius", radiusValues.md);
+    root.style.setProperty("--radius-sm", radiusValues.sm);
+    root.style.setProperty("--radius-lg", radiusValues.lg);
+  }, [resolvedTheme, accentColor, grayColor, radius]);
+  const setTheme = React.useCallback((newTheme) => {
+    localStorage.setItem(`${storageKey}-mode`, newTheme);
+    setThemeState(newTheme);
+  }, [storageKey]);
+  const setAccentColor = React.useCallback((color) => {
+    localStorage.setItem(`${storageKey}-accent`, color);
+    setAccentColorState(color);
+  }, [storageKey]);
+  const setGrayColor = React.useCallback((color) => {
+    localStorage.setItem(`${storageKey}-gray`, color);
+    setGrayColorState(color);
+  }, [storageKey]);
+  const setRadius = React.useCallback((newRadius) => {
+    localStorage.setItem(`${storageKey}-radius`, newRadius);
+    setRadiusState(newRadius);
+  }, [storageKey]);
+  const value = React.useMemo(
+    () => ({
+      theme,
+      resolvedTheme,
+      accentColor,
+      grayColor,
+      radius,
+      setTheme,
+      setAccentColor,
+      setGrayColor,
+      setRadius
+    }),
+    [theme, resolvedTheme, accentColor, grayColor, radius, setTheme, setAccentColor, setGrayColor, setRadius]
+  );
+  return /* @__PURE__ */ jsx(ThemeContext.Provider, { value, children });
+}
+ThemeProvider.displayName = "ThemeProvider";
+
+// src/theme/use-theme.ts
+import { useContext } from "react";
+function useTheme() {
+  const context = useContext(ThemeContext);
+  if (!context) {
+    throw new Error("useTheme must be used within a ThemeProvider");
+  }
+  return context;
+}
+
+// src/utils/cn.ts
+import { clsx } from "clsx";
+import { twMerge } from "tailwind-merge";
+function cn(...inputs) {
+  return twMerge(clsx(inputs));
+}
+
+// src/components/button.tsx
+import * as React2 from "react";
+import { Slot } from "@radix-ui/react-slot";
+import { jsx as jsx2 } from "react/jsx-runtime";
+var Button = React2.forwardRef(
+  ({ className, variant = "default", size = "default", asChild = false, ...props }, ref) => {
+    const Comp = asChild ? Slot : "button";
+    return /* @__PURE__ */ jsx2(
+      Comp,
+      {
+        className: cn(
+          "inline-flex items-center justify-center whitespace-nowrap rounded-[var(--radius)] text-sm font-medium transition-colors",
+          "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ring)] focus-visible:ring-offset-2",
+          "disabled:pointer-events-none disabled:opacity-50",
+          {
+            "bg-[var(--accent)] text-[var(--accent-foreground)] hover:bg-[var(--accent-hover)]": variant === "default",
+            "bg-[var(--destructive)] text-[var(--destructive-foreground)] hover:bg-[var(--destructive)]/90": variant === "destructive",
+            "border border-[var(--input)] bg-[var(--background)] hover:bg-[var(--muted)] hover:text-[var(--foreground)]": variant === "outline",
+            "bg-[var(--muted)] text-[var(--foreground)] hover:bg-[var(--muted)]/80": variant === "secondary",
+            "hover:bg-[var(--muted)] hover:text-[var(--foreground)]": variant === "ghost",
+            "text-[var(--accent)] underline-offset-4 hover:underline": variant === "link"
+          },
+          {
+            "h-10 px-4 py-2": size === "default",
+            "h-9 rounded-[var(--radius)] px-3": size === "sm",
+            "h-11 rounded-[var(--radius)] px-8": size === "lg",
+            "h-10 w-10": size === "icon"
+          },
+          className
+        ),
+        ref,
+        ...props
+      }
+    );
+  }
+);
+Button.displayName = "Button";
+
+// src/components/input.tsx
+import * as React3 from "react";
+import { jsx as jsx3 } from "react/jsx-runtime";
+var Input = React3.forwardRef(
+  ({ className, type, ...props }, ref) => {
+    return /* @__PURE__ */ jsx3(
+      "input",
+      {
+        type,
+        className: cn(
+          "flex h-10 w-full rounded-[var(--radius)] border border-[var(--input)] bg-[var(--background)] px-3 py-2 text-sm",
+          "ring-offset-[var(--background)] file:border-0 file:bg-transparent file:text-sm file:font-medium",
+          "placeholder:text-[var(--muted-foreground)]",
+          "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ring)] focus-visible:ring-offset-2",
+          "disabled:cursor-not-allowed disabled:opacity-50",
+          className
+        ),
+        ref,
+        ...props
+      }
+    );
+  }
+);
+Input.displayName = "Input";
+
+// src/components/textarea.tsx
+import * as React4 from "react";
+import { jsx as jsx4 } from "react/jsx-runtime";
+var Textarea = React4.forwardRef(
+  ({ className, ...props }, ref) => {
+    return /* @__PURE__ */ jsx4(
+      "textarea",
+      {
+        className: cn(
+          "flex min-h-[80px] w-full rounded-[var(--radius)] border border-[var(--input)] bg-[var(--background)] px-3 py-2 text-sm",
+          "ring-offset-[var(--background)]",
+          "placeholder:text-[var(--muted-foreground)]",
+          "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ring)] focus-visible:ring-offset-2",
+          "disabled:cursor-not-allowed disabled:opacity-50",
+          className
+        ),
+        ref,
+        ...props
+      }
+    );
+  }
+);
+Textarea.displayName = "Textarea";
+
+// src/components/card.tsx
+import * as 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-[var(--radius-lg)] border border-[var(--border)] bg-[var(--card)] text-[var(--card-foreground)] shadow-sm",
+        className
+      ),
+      ...props
+    }
+  )
+);
+Card.displayName = "Card";
+var CardHeader = React5.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx5(
+    "div",
+    {
+      ref,
+      className: cn("flex flex-col space-y-1.5 p-6", className),
+      ...props
+    }
+  )
+);
+CardHeader.displayName = "CardHeader";
+var CardTitle = React5.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx5(
+    "h3",
+    {
+      ref,
+      className: cn("text-2xl font-semibold leading-none tracking-tight", className),
+      ...props
+    }
+  )
+);
+CardTitle.displayName = "CardTitle";
+var CardDescription = React5.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx5(
+    "p",
+    {
+      ref,
+      className: cn("text-sm text-[var(--muted-foreground)]", className),
+      ...props
+    }
+  )
+);
+CardDescription.displayName = "CardDescription";
+var CardContent = React5.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx5("div", { ref, className: cn("p-6 pt-0", className), ...props })
+);
+CardContent.displayName = "CardContent";
+var CardFooter = React5.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx5(
+    "div",
+    {
+      ref,
+      className: cn("flex items-center p-6 pt-0", className),
+      ...props
+    }
+  )
+);
+CardFooter.displayName = "CardFooter";
+
+// src/components/badge.tsx
+import * as React6 from "react";
+import { jsx as jsx6 } from "react/jsx-runtime";
+var Badge = React6.forwardRef(
+  ({ className, variant = "default", ...props }, ref) => {
+    return /* @__PURE__ */ jsx6(
+      "div",
+      {
+        ref,
+        className: cn(
+          "inline-flex items-center rounded-full px-2.5 py-0.5 text-xs font-semibold transition-colors",
+          "focus:outline-none focus:ring-2 focus:ring-[var(--ring)] focus:ring-offset-2",
+          {
+            "border-transparent bg-[var(--accent)] text-[var(--accent-foreground)]": variant === "default",
+            "border-transparent bg-[var(--muted)] text-[var(--foreground)]": variant === "secondary",
+            "border-transparent bg-[var(--destructive)] text-[var(--destructive-foreground)]": variant === "destructive",
+            "border border-[var(--border)] text-[var(--foreground)]": variant === "outline"
+          },
+          className
+        ),
+        ...props
+      }
+    );
+  }
+);
+Badge.displayName = "Badge";
+
+// src/components/label.tsx
+import * as React7 from "react";
+import * as LabelPrimitive from "@radix-ui/react-label";
+import { jsx as jsx7 } from "react/jsx-runtime";
+var Label = React7.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx7(
+  LabelPrimitive.Root,
+  {
+    ref,
+    className: cn(
+      "text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70",
+      className
+    ),
+    ...props
+  }
+));
+Label.displayName = LabelPrimitive.Root.displayName;
+
+// src/components/checkbox.tsx
+import * as React8 from "react";
+import * as CheckboxPrimitive from "@radix-ui/react-checkbox";
+import { jsx as jsx8 } from "react/jsx-runtime";
+var Checkbox = React8.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx8(
+  CheckboxPrimitive.Root,
+  {
+    ref,
+    className: cn(
+      "peer h-4 w-4 shrink-0 rounded-sm border border-[var(--accent)]",
+      "ring-offset-[var(--background)] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ring)] focus-visible:ring-offset-2",
+      "disabled:cursor-not-allowed disabled:opacity-50",
+      "data-[state=checked]:bg-[var(--accent)] data-[state=checked]:text-[var(--accent-foreground)]",
+      className
+    ),
+    ...props,
+    children: /* @__PURE__ */ jsx8(CheckboxPrimitive.Indicator, { className: cn("flex items-center justify-center text-current"), children: /* @__PURE__ */ jsx8(
+      "svg",
+      {
+        xmlns: "http://www.w3.org/2000/svg",
+        viewBox: "0 0 24 24",
+        fill: "none",
+        stroke: "currentColor",
+        strokeWidth: "3",
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
+        className: "h-3 w-3",
+        children: /* @__PURE__ */ jsx8("polyline", { points: "20 6 9 17 4 12" })
+      }
+    ) })
+  }
+));
+Checkbox.displayName = CheckboxPrimitive.Root.displayName;
+
+// src/components/switch.tsx
+import * as React9 from "react";
+import * as SwitchPrimitives from "@radix-ui/react-switch";
+import { jsx as jsx9 } from "react/jsx-runtime";
+var Switch = React9.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx9(
+  SwitchPrimitives.Root,
+  {
+    className: cn(
+      "peer inline-flex h-6 w-11 shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent transition-colors",
+      "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ring)] focus-visible:ring-offset-2 focus-visible:ring-offset-[var(--background)]",
+      "disabled:cursor-not-allowed disabled:opacity-50",
+      "data-[state=checked]:bg-[var(--accent)] data-[state=unchecked]:bg-[var(--input)]",
+      className
+    ),
+    ...props,
+    ref,
+    children: /* @__PURE__ */ jsx9(
+      SwitchPrimitives.Thumb,
+      {
+        className: cn(
+          "pointer-events-none block h-5 w-5 rounded-full bg-[var(--background)] shadow-lg ring-0 transition-transform",
+          "data-[state=checked]:translate-x-5 data-[state=unchecked]:translate-x-0"
+        )
+      }
+    )
+  }
+));
+Switch.displayName = SwitchPrimitives.Root.displayName;
+
+// src/components/separator.tsx
+import * as React10 from "react";
+import * as SeparatorPrimitive from "@radix-ui/react-separator";
+import { jsx as jsx10 } from "react/jsx-runtime";
+var Separator = React10.forwardRef(({ className, orientation = "horizontal", decorative = true, ...props }, ref) => /* @__PURE__ */ jsx10(
+  SeparatorPrimitive.Root,
+  {
+    ref,
+    decorative,
+    orientation,
+    className: cn(
+      "shrink-0 bg-[var(--border)]",
+      orientation === "horizontal" ? "h-[1px] w-full" : "h-full w-[1px]",
+      className
+    ),
+    ...props
+  }
+));
+Separator.displayName = SeparatorPrimitive.Root.displayName;
+
+// src/components/select/index.tsx
+import * as React11 from "react";
+import * as SelectPrimitive from "@radix-ui/react-select";
+import { jsx as jsx11, jsxs } from "react/jsx-runtime";
+var Select = SelectPrimitive.Root;
+var SelectGroup = SelectPrimitive.Group;
+var SelectValue = SelectPrimitive.Value;
+var SelectTrigger = React11.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs(
+  SelectPrimitive.Trigger,
+  {
+    ref,
+    className: cn(
+      "flex h-10 w-full items-center justify-between rounded-[var(--radius)] border border-[var(--input)] bg-[var(--background)] px-3 py-2 text-sm",
+      "ring-offset-[var(--background)] placeholder:text-[var(--muted-foreground)]",
+      "focus:outline-none focus:ring-2 focus:ring-[var(--ring)] focus:ring-offset-2",
+      "disabled:cursor-not-allowed disabled:opacity-50",
+      "[&>span]:line-clamp-1",
+      className
+    ),
+    ...props,
+    children: [
+      children,
+      /* @__PURE__ */ jsx11(SelectPrimitive.Icon, { asChild: true, children: /* @__PURE__ */ jsx11(
+        "svg",
+        {
+          xmlns: "http://www.w3.org/2000/svg",
+          width: "24",
+          height: "24",
+          viewBox: "0 0 24 24",
+          fill: "none",
+          stroke: "currentColor",
+          strokeWidth: "2",
+          strokeLinecap: "round",
+          strokeLinejoin: "round",
+          className: "h-4 w-4 opacity-50",
+          children: /* @__PURE__ */ jsx11("path", { d: "m6 9 6 6 6-6" })
+        }
+      ) })
+    ]
+  }
+));
+SelectTrigger.displayName = SelectPrimitive.Trigger.displayName;
+var SelectScrollUpButton = React11.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx11(
+  SelectPrimitive.ScrollUpButton,
+  {
+    ref,
+    className: cn("flex cursor-default items-center justify-center py-1", className),
+    ...props,
+    children: /* @__PURE__ */ jsx11(
+      "svg",
+      {
+        xmlns: "http://www.w3.org/2000/svg",
+        width: "24",
+        height: "24",
+        viewBox: "0 0 24 24",
+        fill: "none",
+        stroke: "currentColor",
+        strokeWidth: "2",
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
+        className: "h-4 w-4",
+        children: /* @__PURE__ */ jsx11("path", { d: "m18 15-6-6-6 6" })
+      }
+    )
+  }
+));
+SelectScrollUpButton.displayName = SelectPrimitive.ScrollUpButton.displayName;
+var SelectScrollDownButton = React11.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx11(
+  SelectPrimitive.ScrollDownButton,
+  {
+    ref,
+    className: cn("flex cursor-default items-center justify-center py-1", className),
+    ...props,
+    children: /* @__PURE__ */ jsx11(
+      "svg",
+      {
+        xmlns: "http://www.w3.org/2000/svg",
+        width: "24",
+        height: "24",
+        viewBox: "0 0 24 24",
+        fill: "none",
+        stroke: "currentColor",
+        strokeWidth: "2",
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
+        className: "h-4 w-4",
+        children: /* @__PURE__ */ jsx11("path", { d: "m6 9 6 6 6-6" })
+      }
+    )
+  }
+));
+SelectScrollDownButton.displayName = SelectPrimitive.ScrollDownButton.displayName;
+var SelectContent = React11.forwardRef(({ className, children, position = "popper", ...props }, ref) => /* @__PURE__ */ jsx11(SelectPrimitive.Portal, { children: /* @__PURE__ */ jsxs(
+  SelectPrimitive.Content,
+  {
+    ref,
+    className: cn(
+      "relative z-50 max-h-96 min-w-[8rem] overflow-hidden rounded-[var(--radius)] border border-[var(--border)] bg-[var(--popover)] text-[var(--popover-foreground)] shadow-md",
+      "data-[state=open]:animate-in data-[state=closed]:animate-out",
+      "data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
+      "data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95",
+      "data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2",
+      "data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
+      position === "popper" && "data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1",
+      className
+    ),
+    position,
+    ...props,
+    children: [
+      /* @__PURE__ */ jsx11(SelectScrollUpButton, {}),
+      /* @__PURE__ */ jsx11(
+        SelectPrimitive.Viewport,
+        {
+          className: cn(
+            "p-1",
+            position === "popper" && "h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)]"
+          ),
+          children
+        }
+      ),
+      /* @__PURE__ */ jsx11(SelectScrollDownButton, {})
+    ]
+  }
+) }));
+SelectContent.displayName = SelectPrimitive.Content.displayName;
+var SelectLabel = React11.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx11(
+  SelectPrimitive.Label,
+  {
+    ref,
+    className: cn("py-1.5 pl-8 pr-2 text-sm font-semibold", className),
+    ...props
+  }
+));
+SelectLabel.displayName = SelectPrimitive.Label.displayName;
+var SelectItem = React11.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs(
+  SelectPrimitive.Item,
+  {
+    ref,
+    className: cn(
+      "relative flex w-full cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none",
+      "focus:bg-[var(--muted)] focus:text-[var(--foreground)]",
+      "data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
+      className
+    ),
+    ...props,
+    children: [
+      /* @__PURE__ */ jsx11("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsx11(SelectPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx11(
+        "svg",
+        {
+          xmlns: "http://www.w3.org/2000/svg",
+          width: "24",
+          height: "24",
+          viewBox: "0 0 24 24",
+          fill: "none",
+          stroke: "currentColor",
+          strokeWidth: "2",
+          strokeLinecap: "round",
+          strokeLinejoin: "round",
+          className: "h-4 w-4",
+          children: /* @__PURE__ */ jsx11("polyline", { points: "20 6 9 17 4 12" })
+        }
+      ) }) }),
+      /* @__PURE__ */ jsx11(SelectPrimitive.ItemText, { children })
+    ]
+  }
+));
+SelectItem.displayName = SelectPrimitive.Item.displayName;
+var SelectSeparator = React11.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx11(
+  SelectPrimitive.Separator,
+  {
+    ref,
+    className: cn("-mx-1 my-1 h-px bg-[var(--muted)]", className),
+    ...props
+  }
+));
+SelectSeparator.displayName = SelectPrimitive.Separator.displayName;
+var SelectNamespace = Object.assign(Select, {
+  Group: SelectGroup,
+  Value: SelectValue,
+  Trigger: SelectTrigger,
+  Content: SelectContent,
+  Label: SelectLabel,
+  Item: SelectItem,
+  Separator: SelectSeparator,
+  ScrollUpButton: SelectScrollUpButton,
+  ScrollDownButton: SelectScrollDownButton
+});
+
+// src/components/dialog/index.tsx
+import * as React12 from "react";
+import * as DialogPrimitive from "@radix-ui/react-dialog";
+import { jsx as jsx12, jsxs as jsxs2 } from "react/jsx-runtime";
+var Dialog = DialogPrimitive.Root;
+var DialogTrigger = DialogPrimitive.Trigger;
+var DialogPortal = DialogPrimitive.Portal;
+var DialogClose = DialogPrimitive.Close;
+var DialogOverlay = React12.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx12(
+  DialogPrimitive.Overlay,
+  {
+    ref,
+    className: cn(
+      "fixed inset-0 z-50 bg-black/80",
+      "data-[state=open]:animate-in data-[state=closed]:animate-out",
+      "data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
+      className
+    ),
+    ...props
+  }
+));
+DialogOverlay.displayName = DialogPrimitive.Overlay.displayName;
+var DialogContent = React12.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs2(DialogPortal, { children: [
+  /* @__PURE__ */ jsx12(DialogOverlay, {}),
+  /* @__PURE__ */ jsxs2(
+    DialogPrimitive.Content,
+    {
+      ref,
+      className: cn(
+        "fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border border-[var(--border)] bg-[var(--background)] p-6 shadow-lg duration-200",
+        "data-[state=open]:animate-in data-[state=closed]:animate-out",
+        "data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
+        "data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95",
+        "data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%]",
+        "data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%]",
+        "sm:rounded-[var(--radius-lg)]",
+        className
+      ),
+      ...props,
+      children: [
+        children,
+        /* @__PURE__ */ jsxs2(DialogPrimitive.Close, { className: "absolute right-4 top-4 rounded-sm opacity-70 ring-offset-[var(--background)] transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-[var(--ring)] focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-[var(--accent)] data-[state=open]:text-[var(--muted-foreground)]", children: [
+          /* @__PURE__ */ jsxs2(
+            "svg",
+            {
+              xmlns: "http://www.w3.org/2000/svg",
+              width: "24",
+              height: "24",
+              viewBox: "0 0 24 24",
+              fill: "none",
+              stroke: "currentColor",
+              strokeWidth: "2",
+              strokeLinecap: "round",
+              strokeLinejoin: "round",
+              className: "h-4 w-4",
+              children: [
+                /* @__PURE__ */ jsx12("path", { d: "M18 6 6 18" }),
+                /* @__PURE__ */ jsx12("path", { d: "m6 6 12 12" })
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsx12("span", { className: "sr-only", children: "Close" })
+        ] })
+      ]
+    }
+  )
+] }));
+DialogContent.displayName = DialogPrimitive.Content.displayName;
+var DialogHeader = ({ className, ...props }) => /* @__PURE__ */ jsx12("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__ */ jsx12(
+  "div",
+  {
+    className: cn("flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2", className),
+    ...props
+  }
+);
+DialogFooter.displayName = "DialogFooter";
+var DialogTitle = React12.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx12(
+  DialogPrimitive.Title,
+  {
+    ref,
+    className: cn("text-lg font-semibold leading-none tracking-tight", className),
+    ...props
+  }
+));
+DialogTitle.displayName = DialogPrimitive.Title.displayName;
+var DialogDescription = React12.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx12(
+  DialogPrimitive.Description,
+  {
+    ref,
+    className: cn("text-sm text-[var(--muted-foreground)]", className),
+    ...props
+  }
+));
+DialogDescription.displayName = DialogPrimitive.Description.displayName;
+var DialogNamespace = Object.assign(Dialog, {
+  Portal: DialogPortal,
+  Overlay: DialogOverlay,
+  Close: DialogClose,
+  Trigger: DialogTrigger,
+  Content: DialogContent,
+  Header: DialogHeader,
+  Footer: DialogFooter,
+  Title: DialogTitle,
+  Description: DialogDescription
+});
+
+// src/components/spinner.tsx
+import * as React13 from "react";
+import { jsx as jsx13 } from "react/jsx-runtime";
+var Spinner = React13.forwardRef(
+  ({ className, size = "default", ...props }, ref) => {
+    return /* @__PURE__ */ jsx13(
+      "div",
+      {
+        ref,
+        role: "status",
+        "aria-label": "Loading",
+        className: cn(
+          "inline-block animate-spin rounded-full border-2 border-solid border-current border-r-transparent motion-reduce:animate-[spin_1.5s_linear_infinite]",
+          {
+            "h-4 w-4": size === "sm",
+            "h-6 w-6": size === "default",
+            "h-8 w-8": size === "lg"
+          },
+          "text-[var(--accent)]",
+          className
+        ),
+        ...props,
+        children: /* @__PURE__ */ jsx13("span", { className: "sr-only", children: "Loading..." })
+      }
+    );
+  }
+);
+Spinner.displayName = "Spinner";
+
+// src/components/table.tsx
+import * as React14 from "react";
+import { jsx as jsx14 } from "react/jsx-runtime";
+var Table = React14.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx14("div", { className: "relative w-full overflow-auto", children: /* @__PURE__ */ jsx14(
+  "table",
+  {
+    ref,
+    className: cn("w-full caption-bottom text-sm", className),
+    ...props
+  }
+) }));
+Table.displayName = "Table";
+var TableHeader = React14.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx14("thead", { ref, className: cn("[&_tr]:border-b", className), ...props }));
+TableHeader.displayName = "TableHeader";
+var TableBody = React14.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx14(
+  "tbody",
+  {
+    ref,
+    className: cn("[&_tr:last-child]:border-0", className),
+    ...props
+  }
+));
+TableBody.displayName = "TableBody";
+var TableFooter = React14.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx14(
+  "tfoot",
+  {
+    ref,
+    className: cn(
+      "border-t bg-[var(--muted)]/50 font-medium [&>tr]:last:border-b-0",
+      className
+    ),
+    ...props
+  }
+));
+TableFooter.displayName = "TableFooter";
+var TableRow = React14.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx14(
+  "tr",
+  {
+    ref,
+    className: cn(
+      "border-b border-[var(--border)] transition-colors",
+      "hover:bg-[var(--muted)]/50",
+      "data-[state=selected]:bg-[var(--muted)]",
+      className
+    ),
+    ...props
+  }
+));
+TableRow.displayName = "TableRow";
+var TableHead = React14.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx14(
+  "th",
+  {
+    ref,
+    className: cn(
+      "h-12 px-4 text-left align-middle font-medium text-[var(--muted-foreground)]",
+      "[&:has([role=checkbox])]:pr-0",
+      className
+    ),
+    ...props
+  }
+));
+TableHead.displayName = "TableHead";
+var TableCell = React14.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx14(
+  "td",
+  {
+    ref,
+    className: cn(
+      "p-4 align-middle [&:has([role=checkbox])]:pr-0",
+      className
+    ),
+    ...props
+  }
+));
+TableCell.displayName = "TableCell";
+var TableCaption = React14.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx14(
+  "caption",
+  {
+    ref,
+    className: cn("mt-4 text-sm text-[var(--muted-foreground)]", className),
+    ...props
+  }
+));
+TableCaption.displayName = "TableCaption";
+var TableNamespace = Object.assign(Table, {
+  Header: TableHeader,
+  Body: TableBody,
+  Footer: TableFooter,
+  Row: TableRow,
+  Head: TableHead,
+  Cell: TableCell,
+  Caption: TableCaption
+});
+
+// src/components/pagination.tsx
+import * as React15 from "react";
+import { jsx as jsx15, jsxs as jsxs3 } from "react/jsx-runtime";
+var Pagination = React15.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx15(
+    "nav",
+    {
+      ref,
+      role: "navigation",
+      "aria-label": "pagination",
+      className: cn("mx-auto flex w-full justify-center", className),
+      ...props
+    }
+  )
+);
+Pagination.displayName = "Pagination";
+var PaginationContent = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx15(
+  "ul",
+  {
+    ref,
+    className: cn("flex flex-row items-center gap-1", className),
+    ...props
+  }
+));
+PaginationContent.displayName = "PaginationContent";
+var PaginationItem = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx15("li", { ref, className: cn("", className), ...props }));
+PaginationItem.displayName = "PaginationItem";
+var PaginationLink = React15.forwardRef(
+  ({ className, isActive, ...props }, ref) => /* @__PURE__ */ jsx15(
+    Button,
+    {
+      ref,
+      variant: isActive ? "default" : "outline",
+      size: "icon",
+      className: cn("h-9 w-9", className),
+      ...props
+    }
+  )
+);
+PaginationLink.displayName = "PaginationLink";
+var PaginationPrevious = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxs3(
+  Button,
+  {
+    ref,
+    variant: "outline",
+    size: "default",
+    className: cn("gap-1 pl-2.5", className),
+    ...props,
+    children: [
+      /* @__PURE__ */ jsx15(
+        "svg",
+        {
+          xmlns: "http://www.w3.org/2000/svg",
+          width: "24",
+          height: "24",
+          viewBox: "0 0 24 24",
+          fill: "none",
+          stroke: "currentColor",
+          strokeWidth: "2",
+          strokeLinecap: "round",
+          strokeLinejoin: "round",
+          className: "h-4 w-4",
+          children: /* @__PURE__ */ jsx15("path", { d: "m15 18-6-6 6-6" })
+        }
+      ),
+      /* @__PURE__ */ jsx15("span", { children: "Previous" })
+    ]
+  }
+));
+PaginationPrevious.displayName = "PaginationPrevious";
+var PaginationNext = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxs3(
+  Button,
+  {
+    ref,
+    variant: "outline",
+    size: "default",
+    className: cn("gap-1 pr-2.5", className),
+    ...props,
+    children: [
+      /* @__PURE__ */ jsx15("span", { children: "Next" }),
+      /* @__PURE__ */ jsx15(
+        "svg",
+        {
+          xmlns: "http://www.w3.org/2000/svg",
+          width: "24",
+          height: "24",
+          viewBox: "0 0 24 24",
+          fill: "none",
+          stroke: "currentColor",
+          strokeWidth: "2",
+          strokeLinecap: "round",
+          strokeLinejoin: "round",
+          className: "h-4 w-4",
+          children: /* @__PURE__ */ jsx15("path", { d: "m9 18 6-6-6-6" })
+        }
+      )
+    ]
+  }
+));
+PaginationNext.displayName = "PaginationNext";
+var PaginationEllipsis = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxs3(
+  "span",
+  {
+    ref,
+    "aria-hidden": true,
+    className: cn("flex h-9 w-9 items-center justify-center", className),
+    ...props,
+    children: [
+      /* @__PURE__ */ jsxs3(
+        "svg",
+        {
+          xmlns: "http://www.w3.org/2000/svg",
+          width: "24",
+          height: "24",
+          viewBox: "0 0 24 24",
+          fill: "none",
+          stroke: "currentColor",
+          strokeWidth: "2",
+          strokeLinecap: "round",
+          strokeLinejoin: "round",
+          className: "h-4 w-4",
+          children: [
+            /* @__PURE__ */ jsx15("circle", { cx: "12", cy: "12", r: "1" }),
+            /* @__PURE__ */ jsx15("circle", { cx: "19", cy: "12", r: "1" }),
+            /* @__PURE__ */ jsx15("circle", { cx: "5", cy: "12", r: "1" })
+          ]
+        }
+      ),
+      /* @__PURE__ */ jsx15("span", { className: "sr-only", children: "More pages" })
+    ]
+  }
+));
+PaginationEllipsis.displayName = "PaginationEllipsis";
+var PaginationNamespace = Object.assign(Pagination, {
+  Content: PaginationContent,
+  Item: PaginationItem,
+  Link: PaginationLink,
+  Previous: PaginationPrevious,
+  Next: PaginationNext,
+  Ellipsis: PaginationEllipsis
+});
+
+// src/components/combobox/index.tsx
+import * as React16 from "react";
+import * as PopoverPrimitive from "@radix-ui/react-popover";
+import { jsx as jsx16, jsxs as jsxs4 } from "react/jsx-runtime";
+var Combobox = React16.forwardRef(
+  ({
+    options,
+    value: controlledValue,
+    defaultValue,
+    onValueChange,
+    placeholder = "Select option...",
+    searchPlaceholder = "Search...",
+    emptyMessage = "No results found.",
+    disabled = false,
+    className
+  }, ref) => {
+    const [open, setOpen] = React16.useState(false);
+    const [search, setSearch] = React16.useState("");
+    const [internalValue, setInternalValue] = React16.useState(defaultValue ?? "");
+    const value = controlledValue !== void 0 ? controlledValue : internalValue;
+    const filteredOptions = React16.useMemo(() => {
+      if (!search) return options;
+      return options.filter(
+        (option) => option.label.toLowerCase().includes(search.toLowerCase())
+      );
+    }, [options, search]);
+    const selectedOption = options.find((option) => option.value === value);
+    const handleSelect = (optionValue) => {
+      if (controlledValue === void 0) {
+        setInternalValue(optionValue);
+      }
+      onValueChange?.(optionValue);
+      setOpen(false);
+      setSearch("");
+    };
+    return /* @__PURE__ */ jsxs4(PopoverPrimitive.Root, { open, onOpenChange: setOpen, children: [
+      /* @__PURE__ */ jsx16(PopoverPrimitive.Trigger, { asChild: true, children: /* @__PURE__ */ jsxs4(
+        "button",
+        {
+          ref,
+          type: "button",
+          role: "combobox",
+          "aria-expanded": open,
+          disabled,
+          className: cn(
+            "flex h-10 w-full items-center justify-between rounded-[var(--radius)] border border-[var(--input)] bg-[var(--background)] px-3 py-2 text-sm",
+            "ring-offset-[var(--background)]",
+            "placeholder:text-[var(--muted-foreground)]",
+            "focus:outline-none focus:ring-2 focus:ring-[var(--ring)] focus:ring-offset-2",
+            "disabled:cursor-not-allowed disabled:opacity-50",
+            className
+          ),
+          children: [
+            /* @__PURE__ */ jsx16("span", { className: cn(!selectedOption && "text-[var(--muted-foreground)]"), children: selectedOption?.label ?? placeholder }),
+            /* @__PURE__ */ jsx16(
+              "svg",
+              {
+                xmlns: "http://www.w3.org/2000/svg",
+                width: "24",
+                height: "24",
+                viewBox: "0 0 24 24",
+                fill: "none",
+                stroke: "currentColor",
+                strokeWidth: "2",
+                strokeLinecap: "round",
+                strokeLinejoin: "round",
+                className: cn(
+                  "ml-2 h-4 w-4 shrink-0 opacity-50 transition-transform",
+                  open && "rotate-180"
+                ),
+                children: /* @__PURE__ */ jsx16("path", { d: "m6 9 6 6 6-6" })
+              }
+            )
+          ]
+        }
+      ) }),
+      /* @__PURE__ */ jsx16(PopoverPrimitive.Portal, { children: /* @__PURE__ */ jsxs4(
+        PopoverPrimitive.Content,
+        {
+          className: cn(
+            "z-50 w-[var(--radix-popover-trigger-width)] overflow-hidden rounded-[var(--radius)] border border-[var(--border)] bg-[var(--popover)] text-[var(--popover-foreground)] shadow-md",
+            "data-[state=open]:animate-in data-[state=closed]:animate-out",
+            "data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
+            "data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95",
+            "data-[side=bottom]:slide-in-from-top-2 data-[side=top]:slide-in-from-bottom-2"
+          ),
+          sideOffset: 4,
+          children: [
+            /* @__PURE__ */ jsxs4("div", { className: "flex items-center border-b border-[var(--border)] px-3", children: [
+              /* @__PURE__ */ jsxs4(
+                "svg",
+                {
+                  xmlns: "http://www.w3.org/2000/svg",
+                  width: "24",
+                  height: "24",
+                  viewBox: "0 0 24 24",
+                  fill: "none",
+                  stroke: "currentColor",
+                  strokeWidth: "2",
+                  strokeLinecap: "round",
+                  strokeLinejoin: "round",
+                  className: "mr-2 h-4 w-4 shrink-0 opacity-50",
+                  children: [
+                    /* @__PURE__ */ jsx16("circle", { cx: "11", cy: "11", r: "8" }),
+                    /* @__PURE__ */ jsx16("path", { d: "m21 21-4.3-4.3" })
+                  ]
+                }
+              ),
+              /* @__PURE__ */ jsx16(
+                "input",
+                {
+                  className: "flex h-10 w-full bg-transparent py-3 text-sm outline-none placeholder:text-[var(--muted-foreground)]",
+                  placeholder: searchPlaceholder,
+                  value: search,
+                  onChange: (e) => setSearch(e.target.value)
+                }
+              )
+            ] }),
+            /* @__PURE__ */ jsx16("div", { className: "max-h-[300px] overflow-y-auto p-1", children: filteredOptions.length === 0 ? /* @__PURE__ */ jsx16("div", { className: "py-6 text-center text-sm text-[var(--muted-foreground)]", children: emptyMessage }) : filteredOptions.map((option) => /* @__PURE__ */ jsxs4(
+              "button",
+              {
+                type: "button",
+                disabled: option.disabled,
+                onClick: () => handleSelect(option.value),
+                className: cn(
+                  "relative flex w-full cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none",
+                  "hover:bg-[var(--muted)] hover:text-[var(--foreground)]",
+                  "focus:bg-[var(--muted)] focus:text-[var(--foreground)]",
+                  "disabled:pointer-events-none disabled:opacity-50",
+                  option.value === value && "bg-[var(--muted)]"
+                ),
+                children: [
+                  /* @__PURE__ */ jsx16("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: option.value === value && /* @__PURE__ */ jsx16(
+                    "svg",
+                    {
+                      xmlns: "http://www.w3.org/2000/svg",
+                      width: "24",
+                      height: "24",
+                      viewBox: "0 0 24 24",
+                      fill: "none",
+                      stroke: "currentColor",
+                      strokeWidth: "2",
+                      strokeLinecap: "round",
+                      strokeLinejoin: "round",
+                      className: "h-4 w-4",
+                      children: /* @__PURE__ */ jsx16("polyline", { points: "20 6 9 17 4 12" })
+                    }
+                  ) }),
+                  option.label
+                ]
+              },
+              option.value
+            )) })
+          ]
+        }
+      ) })
+    ] });
+  }
+);
+Combobox.displayName = "Combobox";
+export {
+  Badge,
+  Button,
+  Card,
+  CardContent,
+  CardDescription,
+  CardFooter,
+  CardHeader,
+  CardTitle,
+  Checkbox,
+  Combobox,
+  DialogNamespace as Dialog,
+  DialogClose,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogOverlay,
+  DialogPortal,
+  DialogTitle,
+  DialogTrigger,
+  Input,
+  Label,
+  PaginationNamespace as Pagination,
+  PaginationContent,
+  PaginationEllipsis,
+  PaginationItem,
+  PaginationLink,
+  PaginationNext,
+  PaginationPrevious,
+  SelectNamespace as Select,
+  SelectContent,
+  SelectGroup,
+  SelectItem,
+  SelectLabel,
+  SelectScrollDownButton,
+  SelectScrollUpButton,
+  SelectSeparator,
+  SelectTrigger,
+  SelectValue,
+  Separator,
+  Spinner,
+  Switch,
+  TableNamespace as Table,
+  TableBody,
+  TableCaption,
+  TableCell,
+  TableFooter,
+  TableHead,
+  TableHeader,
+  TableRow,
+  Textarea,
+  ThemeContext,
+  ThemeProvider,
+  cn,
+  useTheme
+};
+//# sourceMappingURL=index.js.map