@assassin1717/aifelib 1.0.0

package/dist/index.js

@@ -0,0 +1,1458 @@
+// src/lib/cn.ts
+import { clsx } from "clsx";
+import { twMerge } from "tailwind-merge";
+function cn(...inputs) {
+  return twMerge(clsx(inputs));
+}
+
+// src/components/button/button.tsx
+import * as React from "react";
+import { Loader2 } from "lucide-react";
+import { jsx, jsxs } from "react/jsx-runtime";
+var variantClasses = {
+  primary: "bg-blue-600 text-white hover:bg-blue-700 active:bg-blue-800 focus-visible:ring-blue-500",
+  secondary: "bg-gray-100 text-gray-900 hover:bg-gray-200 active:bg-gray-300 focus-visible:ring-gray-400",
+  ghost: "bg-transparent text-gray-700 hover:bg-gray-100 active:bg-gray-200 focus-visible:ring-gray-400",
+  destructive: "bg-red-600 text-white hover:bg-red-700 active:bg-red-800 focus-visible:ring-red-500",
+  outline: "border border-gray-300 bg-white text-gray-700 hover:bg-gray-50 active:bg-gray-100 focus-visible:ring-gray-400"
+};
+var sizeClasses = {
+  sm: "h-8 px-3 text-xs gap-1.5",
+  md: "h-10 px-4 text-sm gap-2",
+  lg: "h-12 px-5 text-base gap-2"
+};
+var Button = React.forwardRef(
+  ({
+    className,
+    variant = "primary",
+    size = "md",
+    loading = false,
+    fullWidth = false,
+    disabled,
+    children,
+    ...props
+  }, ref) => {
+    const isDisabled = disabled || loading;
+    return /* @__PURE__ */ jsxs(
+      "button",
+      {
+        ref,
+        disabled: isDisabled,
+        "aria-busy": loading,
+        className: cn(
+          // base
+          "inline-flex items-center justify-center rounded-md font-medium",
+          "transition-colors duration-150",
+          "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2",
+          // disabled
+          "disabled:pointer-events-none disabled:opacity-50",
+          // touch target — mínimo 44px em mobile
+          "min-h-[2.75rem] sm:min-h-0",
+          variantClasses[variant],
+          sizeClasses[size],
+          fullWidth && "w-full",
+          className
+        ),
+        ...props,
+        children: [
+          loading && /* @__PURE__ */ jsx(
+            Loader2,
+            {
+              className: "shrink-0 animate-spin",
+              size: size === "sm" ? 14 : size === "lg" ? 18 : 16,
+              "aria-hidden": "true"
+            }
+          ),
+          children
+        ]
+      }
+    );
+  }
+);
+Button.displayName = "Button";
+
+// src/components/input/input.tsx
+import * as React2 from "react";
+import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+var Input = React2.forwardRef(
+  ({ className, error, startIcon, endIcon, ...props }, ref) => {
+    if (startIcon || endIcon) {
+      return /* @__PURE__ */ jsxs2("div", { className: "relative flex items-center", children: [
+        startIcon && /* @__PURE__ */ jsx2("span", { className: "pointer-events-none absolute left-3 flex shrink-0 items-center text-gray-400", children: startIcon }),
+        /* @__PURE__ */ jsx2(
+          "input",
+          {
+            ref,
+            className: cn(
+              inputBase,
+              error && inputError,
+              startIcon && "pl-9",
+              endIcon && "pr-9",
+              className
+            ),
+            "aria-invalid": error ? true : void 0,
+            ...props
+          }
+        ),
+        endIcon && /* @__PURE__ */ jsx2("span", { className: "pointer-events-none absolute right-3 flex shrink-0 items-center text-gray-400", children: endIcon })
+      ] });
+    }
+    return /* @__PURE__ */ jsx2(
+      "input",
+      {
+        ref,
+        className: cn(inputBase, error && inputError, className),
+        "aria-invalid": error ? true : void 0,
+        ...props
+      }
+    );
+  }
+);
+Input.displayName = "Input";
+var inputBase = [
+  "w-full rounded-md border border-gray-300 bg-white px-3",
+  "text-sm text-gray-900 placeholder:text-gray-400",
+  // mobile-friendly height
+  "h-11 sm:h-10",
+  "transition-colors duration-150",
+  "focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent",
+  "disabled:cursor-not-allowed disabled:opacity-50 disabled:bg-gray-50"
+].join(" ");
+var inputError = "border-red-500 focus:ring-red-500";
+
+// src/components/textarea/textarea.tsx
+import * as React3 from "react";
+import { jsx as jsx3 } from "react/jsx-runtime";
+var Textarea = React3.forwardRef(
+  ({ className, error, ...props }, ref) => /* @__PURE__ */ jsx3(
+    "textarea",
+    {
+      ref,
+      className: cn(
+        "w-full rounded-md border border-gray-300 bg-white px-3 py-2",
+        "text-sm text-gray-900 placeholder:text-gray-400",
+        "min-h-[80px] resize-y",
+        "transition-colors duration-150",
+        "focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent",
+        "disabled:cursor-not-allowed disabled:opacity-50 disabled:bg-gray-50",
+        error && "border-red-500 focus:ring-red-500",
+        className
+      ),
+      "aria-invalid": error ? true : void 0,
+      ...props
+    }
+  )
+);
+Textarea.displayName = "Textarea";
+
+// src/components/select/select.tsx
+import * as React4 from "react";
+import { ChevronDown } from "lucide-react";
+import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
+var Select = React4.forwardRef(
+  ({ className, options, placeholder, error, ...props }, ref) => /* @__PURE__ */ jsxs3("div", { className: "relative", children: [
+    /* @__PURE__ */ jsxs3(
+      "select",
+      {
+        ref,
+        className: cn(
+          "w-full appearance-none rounded-md border border-gray-300 bg-white px-3 pr-9",
+          "text-sm text-gray-900",
+          // mobile-friendly height
+          "h-11 sm:h-10",
+          "transition-colors duration-150",
+          "focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent",
+          "disabled:cursor-not-allowed disabled:opacity-50 disabled:bg-gray-50",
+          error && "border-red-500 focus:ring-red-500",
+          className
+        ),
+        "aria-invalid": error ? true : void 0,
+        ...props,
+        children: [
+          placeholder && /* @__PURE__ */ jsx4("option", { value: "", disabled: true, children: placeholder }),
+          options.map((opt) => /* @__PURE__ */ jsx4("option", { value: opt.value, disabled: opt.disabled, children: opt.label }, opt.value))
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsx4(
+      ChevronDown,
+      {
+        className: "pointer-events-none absolute right-3 top-1/2 -translate-y-1/2 text-gray-400",
+        size: 16,
+        "aria-hidden": "true"
+      }
+    )
+  ] })
+);
+Select.displayName = "Select";
+
+// src/components/checkbox/checkbox.tsx
+import * as React5 from "react";
+import { jsx as jsx5, jsxs as jsxs4 } from "react/jsx-runtime";
+var Checkbox = React5.forwardRef(
+  ({ className, label, error, id, ...props }, ref) => {
+    const generatedId = React5.useId();
+    const checkboxId = id ?? generatedId;
+    return /* @__PURE__ */ jsxs4("div", { className: "flex items-start gap-3", children: [
+      /* @__PURE__ */ jsx5("span", { className: "flex min-h-[44px] min-w-[44px] items-center justify-center sm:min-h-0 sm:min-w-0", children: /* @__PURE__ */ jsx5(
+        "input",
+        {
+          ref,
+          id: checkboxId,
+          type: "checkbox",
+          className: cn(
+            "h-4 w-4 shrink-0 rounded border-gray-300 text-blue-600",
+            "focus:ring-2 focus:ring-blue-500 focus:ring-offset-2",
+            "disabled:cursor-not-allowed disabled:opacity-50",
+            "cursor-pointer",
+            error && "border-red-500",
+            className
+          ),
+          "aria-invalid": error ? true : void 0,
+          ...props
+        }
+      ) }),
+      label && /* @__PURE__ */ jsx5(
+        "label",
+        {
+          htmlFor: checkboxId,
+          className: "cursor-pointer select-none pt-0.5 text-sm text-gray-700",
+          children: label
+        }
+      )
+    ] });
+  }
+);
+Checkbox.displayName = "Checkbox";
+
+// src/components/label/label.tsx
+import * as React6 from "react";
+import { jsx as jsx6, jsxs as jsxs5 } from "react/jsx-runtime";
+var Label = React6.forwardRef(
+  ({ className, children, required, ...props }, ref) => /* @__PURE__ */ jsxs5(
+    "label",
+    {
+      ref,
+      className: cn(
+        "block text-sm font-medium text-gray-700 select-none",
+        className
+      ),
+      ...props,
+      children: [
+        children,
+        required && /* @__PURE__ */ jsx6("span", { className: "ml-1 text-red-500", "aria-hidden": "true", children: "*" })
+      ]
+    }
+  )
+);
+Label.displayName = "Label";
+
+// src/components/form-field/form-field.tsx
+import * as React7 from "react";
+import { jsx as jsx7, jsxs as jsxs6 } from "react/jsx-runtime";
+function FormField({
+  label,
+  htmlFor,
+  required,
+  hint,
+  error,
+  className,
+  children
+}) {
+  const errorId = React7.useId();
+  const hintId = React7.useId();
+  const childrenWithProps = React7.Children.map(children, (child) => {
+    if (!React7.isValidElement(child)) return child;
+    return React7.cloneElement(child, {
+      id: htmlFor ?? child.props.id,
+      error: !!error || child.props.error,
+      "aria-describedby": [error ? errorId : null, hint ? hintId : null].filter(Boolean).join(" ") || void 0
+    });
+  });
+  return /* @__PURE__ */ jsxs6("div", { className: cn("flex flex-col gap-1.5", className), children: [
+    label && /* @__PURE__ */ jsx7(Label, { ...htmlFor !== void 0 ? { htmlFor } : {}, ...required ? { required } : {}, children: label }),
+    childrenWithProps,
+    hint && !error && /* @__PURE__ */ jsx7("p", { id: hintId, className: "text-xs text-gray-500", children: hint }),
+    error && /* @__PURE__ */ jsx7("p", { id: errorId, className: "text-xs text-red-600", role: "alert", children: error })
+  ] });
+}
+
+// src/components/spinner/spinner.tsx
+import { Loader2 as Loader22 } from "lucide-react";
+import { jsx as jsx8 } from "react/jsx-runtime";
+var sizeClasses2 = { sm: 16, md: 24, lg: 36 };
+function Spinner({ size = "md", label = "Loading\u2026", className }) {
+  return /* @__PURE__ */ jsx8("span", { role: "status", "aria-label": label, className: cn("inline-flex", className), children: /* @__PURE__ */ jsx8(
+    Loader22,
+    {
+      size: sizeClasses2[size],
+      className: "animate-spin text-current",
+      "aria-hidden": "true"
+    }
+  ) });
+}
+
+// src/components/badge/badge.tsx
+import { jsx as jsx9 } from "react/jsx-runtime";
+var variantClasses2 = {
+  default: "bg-gray-100 text-gray-700",
+  success: "bg-green-100 text-green-700",
+  warning: "bg-yellow-100 text-yellow-700",
+  destructive: "bg-red-100 text-red-700",
+  info: "bg-blue-100 text-blue-700",
+  outline: "border border-gray-300 text-gray-700 bg-transparent"
+};
+function Badge({ variant = "default", className, children, ...props }) {
+  return /* @__PURE__ */ jsx9(
+    "span",
+    {
+      className: cn(
+        "inline-flex items-center rounded-full px-2.5 py-0.5 text-xs font-medium",
+        variantClasses2[variant],
+        className
+      ),
+      ...props,
+      children
+    }
+  );
+}
+
+// src/components/alert/alert.tsx
+import { CheckCircle2, AlertTriangle, XCircle, Info } from "lucide-react";
+import { jsx as jsx10, jsxs as jsxs7 } from "react/jsx-runtime";
+var config = {
+  info: { icon: Info, classes: "bg-blue-50 border-blue-200 text-blue-800" },
+  success: { icon: CheckCircle2, classes: "bg-green-50 border-green-200 text-green-800" },
+  warning: { icon: AlertTriangle, classes: "bg-yellow-50 border-yellow-200 text-yellow-800" },
+  destructive: { icon: XCircle, classes: "bg-red-50 border-red-200 text-red-800" }
+};
+function Alert({ variant = "info", title, children, className, onDismiss }) {
+  const { icon: Icon, classes } = config[variant];
+  return /* @__PURE__ */ jsxs7(
+    "div",
+    {
+      role: "alert",
+      className: cn("flex gap-3 rounded-md border p-4", classes, className),
+      children: [
+        /* @__PURE__ */ jsx10(Icon, { size: 18, className: "mt-0.5 shrink-0", "aria-hidden": "true" }),
+        /* @__PURE__ */ jsxs7("div", { className: "min-w-0 flex-1 text-sm", children: [
+          title && /* @__PURE__ */ jsx10("p", { className: "font-medium", children: title }),
+          children && /* @__PURE__ */ jsx10("p", { className: cn(title && "mt-1", "opacity-90"), children })
+        ] }),
+        onDismiss && /* @__PURE__ */ jsx10(
+          "button",
+          {
+            onClick: onDismiss,
+            "aria-label": "Dismiss",
+            className: "shrink-0 rounded p-0.5 opacity-60 hover:opacity-100 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-current",
+            children: /* @__PURE__ */ jsx10(XCircle, { size: 16, "aria-hidden": "true" })
+          }
+        )
+      ]
+    }
+  );
+}
+
+// src/components/card/card.tsx
+import { jsx as jsx11 } from "react/jsx-runtime";
+var paddingClasses = { none: "", sm: "p-3", md: "p-5", lg: "p-7" };
+function Card({ className, padding = "md", children, ...props }) {
+  return /* @__PURE__ */ jsx11(
+    "div",
+    {
+      className: cn(
+        "rounded-lg border border-gray-200 bg-white shadow-sm",
+        paddingClasses[padding],
+        className
+      ),
+      ...props,
+      children
+    }
+  );
+}
+function CardHeader({ className, ...props }) {
+  return /* @__PURE__ */ jsx11("div", { className: cn("mb-4 flex flex-col gap-1", className), ...props });
+}
+function CardTitle({ className, ...props }) {
+  return /* @__PURE__ */ jsx11("h3", { className: cn("text-base font-semibold text-gray-900", className), ...props });
+}
+function CardDescription({ className, ...props }) {
+  return /* @__PURE__ */ jsx11("p", { className: cn("text-sm text-gray-500", className), ...props });
+}
+function CardContent({ className, ...props }) {
+  return /* @__PURE__ */ jsx11("div", { className: cn("text-sm text-gray-700", className), ...props });
+}
+function CardFooter({ className, ...props }) {
+  return /* @__PURE__ */ jsx11(
+    "div",
+    {
+      className: cn("mt-4 flex flex-wrap items-center gap-2 border-t border-gray-100 pt-4", className),
+      ...props
+    }
+  );
+}
+
+// src/components/modal/modal.tsx
+import * as React8 from "react";
+import { createPortal } from "react-dom";
+import { X } from "lucide-react";
+import { jsx as jsx12, jsxs as jsxs8 } from "react/jsx-runtime";
+var sizeClasses3 = {
+  sm: "sm:max-w-sm",
+  md: "sm:max-w-md",
+  lg: "sm:max-w-lg",
+  xl: "sm:max-w-xl",
+  full: "sm:max-w-[95vw]"
+};
+function Modal({
+  open,
+  onClose,
+  title,
+  description,
+  size = "md",
+  className,
+  children,
+  footer
+}) {
+  const overlayRef = React8.useRef(null);
+  const titleId = React8.useId();
+  const descId = React8.useId();
+  React8.useEffect(() => {
+    if (!open) return;
+    const onKey = (e) => {
+      if (e.key === "Escape") onClose();
+    };
+    document.addEventListener("keydown", onKey);
+    return () => document.removeEventListener("keydown", onKey);
+  }, [open, onClose]);
+  React8.useEffect(() => {
+    if (open) {
+      document.body.style.overflow = "hidden";
+      return () => {
+        document.body.style.overflow = "";
+      };
+    }
+  }, [open]);
+  React8.useEffect(() => {
+    if (!open) return;
+    const el = overlayRef.current;
+    if (!el) return;
+    const focusable = el.querySelectorAll(
+      'button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])'
+    );
+    const first = focusable[0];
+    const last = focusable[focusable.length - 1];
+    first?.focus();
+    const trap = (e) => {
+      if (e.key !== "Tab") return;
+      if (e.shiftKey) {
+        if (document.activeElement === first) {
+          e.preventDefault();
+          last?.focus();
+        }
+      } else {
+        if (document.activeElement === last) {
+          e.preventDefault();
+          first?.focus();
+        }
+      }
+    };
+    document.addEventListener("keydown", trap);
+    return () => document.removeEventListener("keydown", trap);
+  }, [open]);
+  if (!open) return null;
+  return createPortal(
+    /* @__PURE__ */ jsxs8(
+      "div",
+      {
+        ref: overlayRef,
+        role: "dialog",
+        "aria-modal": "true",
+        "aria-labelledby": title ? titleId : void 0,
+        "aria-describedby": description ? descId : void 0,
+        className: "fixed inset-0 z-50 flex items-end justify-center sm:items-center sm:p-4",
+        children: [
+          /* @__PURE__ */ jsx12(
+            "div",
+            {
+              className: "absolute inset-0 bg-black/50 backdrop-blur-sm",
+              "aria-hidden": "true",
+              onClick: onClose
+            }
+          ),
+          /* @__PURE__ */ jsxs8(
+            "div",
+            {
+              className: cn(
+                "relative z-10 flex w-full flex-col bg-white shadow-xl",
+                // mobile: slides from bottom, rounded top only
+                "rounded-t-2xl sm:rounded-xl",
+                // desktop: constrained width
+                sizeClasses3[size],
+                // max height with scroll
+                "max-h-[90dvh] overflow-hidden",
+                className
+              ),
+              children: [
+                /* @__PURE__ */ jsxs8("div", { className: "flex items-start justify-between gap-4 border-b border-gray-100 px-5 py-4", children: [
+                  /* @__PURE__ */ jsxs8("div", { className: "min-w-0", children: [
+                    title && /* @__PURE__ */ jsx12("h2", { id: titleId, className: "text-base font-semibold text-gray-900", children: title }),
+                    description && /* @__PURE__ */ jsx12("p", { id: descId, className: "mt-0.5 text-sm text-gray-500", children: description })
+                  ] }),
+                  /* @__PURE__ */ jsx12(
+                    "button",
+                    {
+                      onClick: onClose,
+                      "aria-label": "Close",
+                      className: "shrink-0 rounded p-1 text-gray-400 hover:text-gray-600 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-blue-500",
+                      children: /* @__PURE__ */ jsx12(X, { size: 18, "aria-hidden": "true" })
+                    }
+                  )
+                ] }),
+                /* @__PURE__ */ jsx12("div", { className: "flex-1 overflow-y-auto px-5 py-4", children }),
+                footer && /* @__PURE__ */ jsx12("div", { className: "flex flex-col-reverse gap-2 border-t border-gray-100 px-5 py-4 sm:flex-row sm:justify-end", children: footer })
+              ]
+            }
+          )
+        ]
+      }
+    ),
+    document.body
+  );
+}
+
+// src/components/confirm-dialog/confirm-dialog.tsx
+import { Fragment, jsx as jsx13, jsxs as jsxs9 } from "react/jsx-runtime";
+function ConfirmDialog({
+  open,
+  onClose,
+  onConfirm,
+  title,
+  description,
+  confirmLabel = "Confirm",
+  cancelLabel = "Cancel",
+  variant = "primary",
+  loading = false
+}) {
+  return /* @__PURE__ */ jsx13(
+    Modal,
+    {
+      open,
+      onClose,
+      title,
+      ...description !== void 0 ? { description } : {},
+      size: "sm",
+      footer: /* @__PURE__ */ jsxs9(Fragment, { children: [
+        /* @__PURE__ */ jsx13(Button, { variant: "ghost", onClick: onClose, disabled: loading, fullWidth: true, children: cancelLabel }),
+        /* @__PURE__ */ jsx13(Button, { variant, onClick: onConfirm, loading, fullWidth: true, children: confirmLabel })
+      ] }),
+      children: /* @__PURE__ */ jsx13("span", {})
+    }
+  );
+}
+
+// src/components/toast/toast.tsx
+import { CheckCircle2 as CheckCircle22, AlertTriangle as AlertTriangle2, XCircle as XCircle2, Info as Info2, X as X2 } from "lucide-react";
+import { jsx as jsx14, jsxs as jsxs10 } from "react/jsx-runtime";
+var iconMap = {
+  success: CheckCircle22,
+  error: XCircle2,
+  warning: AlertTriangle2,
+  info: Info2
+};
+var styleMap = {
+  success: "border-green-200 bg-green-50 text-green-800",
+  error: "border-red-200 bg-red-50 text-red-800",
+  warning: "border-yellow-200 bg-yellow-50 text-yellow-800",
+  info: "border-blue-200 bg-blue-50 text-blue-800"
+};
+function ToastItem({ toast, onDismiss }) {
+  const Icon = iconMap[toast.type];
+  return /* @__PURE__ */ jsxs10(
+    "div",
+    {
+      role: "status",
+      "aria-live": "polite",
+      className: cn(
+        "flex w-full items-start gap-3 rounded-lg border p-4 shadow-md",
+        "animate-in slide-in-from-bottom-2 duration-200",
+        styleMap[toast.type]
+      ),
+      children: [
+        /* @__PURE__ */ jsx14(Icon, { size: 18, className: "mt-0.5 shrink-0", "aria-hidden": "true" }),
+        /* @__PURE__ */ jsxs10("div", { className: "min-w-0 flex-1 text-sm", children: [
+          /* @__PURE__ */ jsx14("p", { className: "font-medium", children: toast.title }),
+          toast.description && /* @__PURE__ */ jsx14("p", { className: "mt-0.5 opacity-80", children: toast.description })
+        ] }),
+        /* @__PURE__ */ jsx14(
+          "button",
+          {
+            onClick: () => onDismiss(toast.id),
+            "aria-label": "Dismiss",
+            className: "shrink-0 rounded p-0.5 opacity-60 hover:opacity-100 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-current",
+            children: /* @__PURE__ */ jsx14(X2, { size: 14, "aria-hidden": "true" })
+          }
+        )
+      ]
+    }
+  );
+}
+
+// src/components/toast/toast-context.tsx
+import * as React9 from "react";
+import { jsx as jsx15, jsxs as jsxs11 } from "react/jsx-runtime";
+var ToastContext = React9.createContext(null);
+function ToastProvider({ children }) {
+  const [toasts, setToasts] = React9.useState([]);
+  const removeToast = React9.useCallback((id) => {
+    setToasts((prev) => prev.filter((t) => t.id !== id));
+  }, []);
+  const addToast = React9.useCallback(
+    ({ type, title, description, duration = 4e3 }) => {
+      const id = crypto.randomUUID();
+      setToasts((prev) => [
+        ...prev,
+        {
+          id,
+          type,
+          title,
+          ...description !== void 0 ? { description } : {},
+          ...duration !== void 0 ? { duration } : {}
+        }
+      ]);
+      if (duration > 0) {
+        setTimeout(() => removeToast(id), duration);
+      }
+    },
+    [removeToast]
+  );
+  return /* @__PURE__ */ jsxs11(ToastContext.Provider, { value: { addToast, removeToast }, children: [
+    children,
+    /* @__PURE__ */ jsx15(
+      "div",
+      {
+        "aria-label": "Notifications",
+        className: "fixed bottom-0 left-0 right-0 z-50 flex flex-col gap-2 p-4 sm:bottom-4 sm:left-auto sm:right-4 sm:w-96",
+        children: toasts.map((toast) => /* @__PURE__ */ jsx15(ToastItem, { toast, onDismiss: removeToast }, toast.id))
+      }
+    )
+  ] });
+}
+
+// src/components/toast/use-toast.ts
+import * as React10 from "react";
+function useToast() {
+  const ctx = React10.useContext(ToastContext);
+  if (!ctx) {
+    throw new Error("useToast must be used inside <ToastProvider>");
+  }
+  return ctx;
+}
+
+// src/components/table/table.tsx
+import { jsx as jsx16, jsxs as jsxs12 } from "react/jsx-runtime";
+function Table({ className, children, ...props }) {
+  return /* @__PURE__ */ jsx16("div", { className: "w-full sm:overflow-x-auto sm:rounded-lg sm:border sm:border-gray-200", children: /* @__PURE__ */ jsx16(
+    "table",
+    {
+      className: cn(
+        "w-full border-collapse text-sm",
+        // desktop keeps min-width so columns never crush
+        "sm:min-w-[600px]",
+        className
+      ),
+      ...props,
+      children
+    }
+  ) });
+}
+function TableHeader({ className, ...props }) {
+  return /* @__PURE__ */ jsx16(
+    "thead",
+    {
+      className: cn(
+        "hidden sm:table-header-group",
+        "border-b border-gray-200 bg-gray-50",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function TableBody({ className, ...props }) {
+  return /* @__PURE__ */ jsx16(
+    "tbody",
+    {
+      className: cn(
+        // mobile: stack rows as cards
+        "flex flex-col gap-3",
+        // sm+: normal tbody
+        "sm:table-row-group sm:gap-0 sm:divide-y sm:divide-gray-100 sm:bg-white",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function TableRow({ className, ...props }) {
+  return /* @__PURE__ */ jsx16(
+    "tr",
+    {
+      className: cn(
+        // mobile: card
+        "block rounded-lg border border-gray-200 bg-white p-4 shadow-sm",
+        // sm+: normal row
+        "sm:table-row sm:rounded-none sm:border-0 sm:p-0 sm:shadow-none sm:transition-colors sm:hover:bg-gray-50",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function TableHead({ className, align = "left", ...props }) {
+  return /* @__PURE__ */ jsx16(
+    "th",
+    {
+      scope: "col",
+      className: cn(
+        "px-4 py-3 text-xs font-semibold uppercase tracking-wide text-gray-500 whitespace-nowrap",
+        align === "center" && "text-center",
+        align === "right" && "text-right",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function TableCell({ className, align = "left", label, children, ...props }) {
+  return /* @__PURE__ */ jsxs12(
+    "td",
+    {
+      className: cn(
+        // mobile: each cell is a flex row — "Label    value"
+        "flex items-start justify-between gap-4 py-1.5 text-gray-700",
+        "last:pb-0 first:pt-0",
+        // sm+: normal table cell
+        "sm:table-cell sm:px-4 sm:py-3",
+        align === "center" && "sm:text-center",
+        align === "right" && "sm:text-right",
+        className
+      ),
+      ...props,
+      children: [
+        label && /* @__PURE__ */ jsx16("span", { className: "shrink-0 text-xs font-semibold uppercase tracking-wide text-gray-400 sm:hidden", children: label }),
+        /* @__PURE__ */ jsx16("span", { className: cn("sm:contents", label && "text-right sm:text-left"), children })
+      ]
+    }
+  );
+}
+
+// src/components/table/table-toolbar.tsx
+import { jsx as jsx17, jsxs as jsxs13 } from "react/jsx-runtime";
+function TableToolbar({ filters, actions, className }) {
+  return /* @__PURE__ */ jsxs13(
+    "div",
+    {
+      className: cn(
+        "flex flex-col gap-3 sm:flex-row sm:items-center sm:justify-between",
+        "mb-3",
+        className
+      ),
+      children: [
+        filters && /* @__PURE__ */ jsx17("div", { className: "flex flex-wrap items-center gap-2", children: filters }),
+        actions && /* @__PURE__ */ jsx17("div", { className: "flex shrink-0 flex-wrap items-center gap-2 sm:ml-auto", children: actions })
+      ]
+    }
+  );
+}
+
+// src/components/table/table-empty-state.tsx
+import { jsx as jsx18, jsxs as jsxs14 } from "react/jsx-runtime";
+function TableEmptyState({
+  colSpan,
+  title = "No results",
+  description,
+  action,
+  icon,
+  className
+}) {
+  return /* @__PURE__ */ jsx18("tr", { className: "block sm:table-row", children: /* @__PURE__ */ jsx18("td", { colSpan, className: cn("block px-4 py-12 text-center sm:table-cell", className), children: /* @__PURE__ */ jsxs14("div", { className: "flex flex-col items-center gap-3", children: [
+    icon && /* @__PURE__ */ jsx18("span", { className: "text-gray-300", "aria-hidden": "true", children: icon }),
+    /* @__PURE__ */ jsx18("p", { className: "text-sm font-medium text-gray-600", children: title }),
+    description && /* @__PURE__ */ jsx18("p", { className: "max-w-xs text-xs text-gray-400", children: description }),
+    action && /* @__PURE__ */ jsx18("div", { className: "mt-1", children: action })
+  ] }) }) });
+}
+
+// src/components/page-header/page-header.tsx
+import { jsx as jsx19, jsxs as jsxs15 } from "react/jsx-runtime";
+function PageHeader({ title, description, prefix, actions, className }) {
+  return /* @__PURE__ */ jsxs15("div", { className: cn("mb-6", className), children: [
+    prefix && /* @__PURE__ */ jsx19("div", { className: "mb-2", children: prefix }),
+    /* @__PURE__ */ jsxs15("div", { className: "flex flex-col gap-3 sm:flex-row sm:items-start sm:justify-between", children: [
+      /* @__PURE__ */ jsxs15("div", { className: "min-w-0", children: [
+        /* @__PURE__ */ jsx19("h1", { className: "truncate text-2xl font-bold text-gray-900 sm:text-3xl", children: title }),
+        description && /* @__PURE__ */ jsx19("p", { className: "mt-1 text-sm text-gray-500", children: description })
+      ] }),
+      actions && /* @__PURE__ */ jsx19("div", { className: "flex shrink-0 flex-wrap items-center gap-2", children: actions })
+    ] })
+  ] });
+}
+
+// src/components/empty-state/empty-state.tsx
+import { jsx as jsx20, jsxs as jsxs16 } from "react/jsx-runtime";
+function EmptyState({
+  icon,
+  title,
+  description,
+  action,
+  secondaryAction,
+  className
+}) {
+  return /* @__PURE__ */ jsxs16(
+    "div",
+    {
+      className: cn(
+        "flex flex-col items-center justify-center gap-4 rounded-lg border border-dashed border-gray-200 bg-gray-50 px-6 py-16 text-center",
+        className
+      ),
+      children: [
+        icon && /* @__PURE__ */ jsx20("span", { className: "text-gray-300", "aria-hidden": "true", children: icon }),
+        /* @__PURE__ */ jsxs16("div", { className: "max-w-xs", children: [
+          /* @__PURE__ */ jsx20("p", { className: "text-sm font-semibold text-gray-700", children: title }),
+          description && /* @__PURE__ */ jsx20("p", { className: "mt-1 text-sm text-gray-400", children: description })
+        ] }),
+        (action || secondaryAction) && /* @__PURE__ */ jsxs16("div", { className: "flex flex-col items-center gap-2 sm:flex-row", children: [
+          action,
+          secondaryAction
+        ] })
+      ]
+    }
+  );
+}
+
+// src/components/app-shell/app-shell.tsx
+import * as React12 from "react";
+
+// src/components/drawer/drawer.tsx
+import * as React11 from "react";
+import { createPortal as createPortal2 } from "react-dom";
+import { X as X3 } from "lucide-react";
+import { jsx as jsx21, jsxs as jsxs17 } from "react/jsx-runtime";
+function Drawer({
+  open,
+  onClose,
+  title,
+  description,
+  side = "right",
+  widthClass = "sm:w-96",
+  className,
+  children,
+  footer
+}) {
+  const overlayRef = React11.useRef(null);
+  const titleId = React11.useId();
+  const descId = React11.useId();
+  React11.useEffect(() => {
+    if (!open) return;
+    const h = (e) => {
+      if (e.key === "Escape") onClose();
+    };
+    document.addEventListener("keydown", h);
+    return () => document.removeEventListener("keydown", h);
+  }, [open, onClose]);
+  React11.useEffect(() => {
+    if (open) {
+      document.body.style.overflow = "hidden";
+      return () => {
+        document.body.style.overflow = "";
+      };
+    }
+  }, [open]);
+  React11.useEffect(() => {
+    if (!open) return;
+    const el = overlayRef.current;
+    if (!el) return;
+    const focusable = el.querySelectorAll(
+      'button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])'
+    );
+    const first = focusable[0];
+    const last = focusable[focusable.length - 1];
+    first?.focus();
+    const trap = (e) => {
+      if (e.key !== "Tab") return;
+      if (e.shiftKey) {
+        if (document.activeElement === first) {
+          e.preventDefault();
+          last?.focus();
+        }
+      } else {
+        if (document.activeElement === last) {
+          e.preventDefault();
+          first?.focus();
+        }
+      }
+    };
+    document.addEventListener("keydown", trap);
+    return () => document.removeEventListener("keydown", trap);
+  }, [open]);
+  if (!open) return null;
+  return createPortal2(
+    /* @__PURE__ */ jsxs17(
+      "div",
+      {
+        ref: overlayRef,
+        role: "dialog",
+        "aria-modal": "true",
+        "aria-labelledby": title ? titleId : void 0,
+        "aria-describedby": description ? descId : void 0,
+        className: "fixed inset-0 z-50 flex",
+        children: [
+          /* @__PURE__ */ jsx21(
+            "div",
+            {
+              className: "absolute inset-0 bg-black/50 backdrop-blur-sm",
+              "aria-hidden": "true",
+              onClick: onClose
+            }
+          ),
+          /* @__PURE__ */ jsxs17(
+            "div",
+            {
+              className: cn(
+                "absolute bottom-0 left-0 right-0 z-10 flex flex-col bg-white shadow-xl",
+                "max-h-[90dvh] rounded-t-2xl",
+                // sm+: full height side panel
+                "sm:inset-y-0 sm:bottom-auto sm:top-0 sm:max-h-full sm:rounded-none",
+                side === "right" ? "sm:right-0 sm:left-auto" : "sm:left-0 sm:right-auto",
+                widthClass,
+                className
+              ),
+              children: [
+                /* @__PURE__ */ jsxs17("div", { className: "flex items-start justify-between gap-4 border-b border-gray-100 px-5 py-4", children: [
+                  /* @__PURE__ */ jsxs17("div", { className: "min-w-0", children: [
+                    title && /* @__PURE__ */ jsx21("h2", { id: titleId, className: "text-base font-semibold text-gray-900", children: title }),
+                    description && /* @__PURE__ */ jsx21("p", { id: descId, className: "mt-0.5 text-sm text-gray-500", children: description })
+                  ] }),
+                  /* @__PURE__ */ jsx21(
+                    "button",
+                    {
+                      onClick: onClose,
+                      "aria-label": "Close",
+                      className: "shrink-0 rounded p-1 text-gray-400 hover:text-gray-600 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-blue-500",
+                      children: /* @__PURE__ */ jsx21(X3, { size: 18, "aria-hidden": "true" })
+                    }
+                  )
+                ] }),
+                /* @__PURE__ */ jsx21("div", { className: "flex-1 overflow-y-auto px-5 py-4", children }),
+                footer && /* @__PURE__ */ jsx21("div", { className: "flex flex-col-reverse gap-2 border-t border-gray-100 px-5 py-4 sm:flex-row sm:justify-end", children: footer })
+              ]
+            }
+          )
+        ]
+      }
+    ),
+    document.body
+  );
+}
+
+// src/components/sidebar/sidebar.tsx
+import { jsx as jsx22, jsxs as jsxs18 } from "react/jsx-runtime";
+function Sidebar({ logo, groups, footer, className }) {
+  return /* @__PURE__ */ jsxs18(
+    "aside",
+    {
+      className: cn(
+        "flex h-full w-64 flex-col border-r border-gray-200 bg-white",
+        className
+      ),
+      "aria-label": "Sidebar navigation",
+      children: [
+        logo && /* @__PURE__ */ jsx22("div", { className: "flex h-16 shrink-0 items-center border-b border-gray-100 px-4", children: logo }),
+        /* @__PURE__ */ jsx22("nav", { className: "flex-1 overflow-y-auto px-3 py-4", children: groups.map((group, gi) => /* @__PURE__ */ jsxs18("div", { className: cn(gi > 0 && "mt-6"), children: [
+          group.title && /* @__PURE__ */ jsx22("p", { className: "mb-1 px-2 text-xs font-semibold uppercase tracking-wider text-gray-400", children: group.title }),
+          /* @__PURE__ */ jsx22("ul", { role: "list", className: "flex flex-col gap-0.5", children: group.items.map((item, ii) => /* @__PURE__ */ jsx22("li", { children: /* @__PURE__ */ jsx22(SidebarItem, { item }) }, ii)) })
+        ] }, gi)) }),
+        footer && /* @__PURE__ */ jsx22("div", { className: "shrink-0 border-t border-gray-100 p-3", children: footer })
+      ]
+    }
+  );
+}
+function SidebarItem({ item }) {
+  const Tag = item.href ? "a" : "button";
+  return /* @__PURE__ */ jsxs18(
+    Tag,
+    {
+      href: item.href,
+      onClick: item.onClick,
+      disabled: item.disabled,
+      "aria-current": item.active ? "page" : void 0,
+      className: cn(
+        "group flex w-full items-center gap-3 rounded-md px-3 py-2 text-sm font-medium",
+        "transition-colors duration-100",
+        "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-blue-500",
+        // mobile touch target
+        "min-h-[44px] sm:min-h-[36px]",
+        item.active ? "bg-blue-50 text-blue-700" : "text-gray-600 hover:bg-gray-100 hover:text-gray-900",
+        item.disabled && "cursor-not-allowed opacity-40 pointer-events-none"
+      ),
+      children: [
+        item.icon && /* @__PURE__ */ jsx22(
+          "span",
+          {
+            "aria-hidden": "true",
+            className: cn(
+              "shrink-0",
+              item.active ? "text-blue-600" : "text-gray-400 group-hover:text-gray-600"
+            ),
+            children: item.icon
+          }
+        ),
+        /* @__PURE__ */ jsx22("span", { className: "flex-1 truncate text-left", children: item.label }),
+        item.badge !== void 0 && /* @__PURE__ */ jsx22(
+          "span",
+          {
+            className: cn(
+              "shrink-0 rounded-full px-2 py-0.5 text-xs font-medium",
+              item.active ? "bg-blue-100 text-blue-700" : "bg-gray-100 text-gray-500"
+            ),
+            children: item.badge
+          }
+        )
+      ]
+    }
+  );
+}
+
+// src/components/topbar/topbar.tsx
+import { Menu } from "lucide-react";
+import { jsx as jsx23, jsxs as jsxs19 } from "react/jsx-runtime";
+function Topbar({
+  onMenuOpen,
+  title,
+  actions,
+  hideMenuButton = false,
+  className
+}) {
+  return /* @__PURE__ */ jsxs19(
+    "header",
+    {
+      className: cn(
+        "flex h-14 shrink-0 items-center gap-3 border-b border-gray-200 bg-white px-4",
+        className
+      ),
+      children: [
+        !hideMenuButton && onMenuOpen && /* @__PURE__ */ jsx23(
+          "button",
+          {
+            onClick: onMenuOpen,
+            "aria-label": "Open navigation menu",
+            className: cn(
+              "inline-flex h-9 w-9 items-center justify-center rounded-md text-gray-500",
+              "hover:bg-gray-100 hover:text-gray-700",
+              "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-blue-500",
+              // visible on mobile, hidden when sidebar renders on sm+
+              "sm:hidden"
+            ),
+            children: /* @__PURE__ */ jsx23(Menu, { size: 20, "aria-hidden": "true" })
+          }
+        ),
+        title && /* @__PURE__ */ jsx23("div", { className: "flex-1 truncate text-sm font-semibold text-gray-900 sm:text-base", children: title }),
+        !title && /* @__PURE__ */ jsx23("div", { className: "flex-1" }),
+        actions && /* @__PURE__ */ jsx23("div", { className: "flex shrink-0 items-center gap-2", children: actions })
+      ]
+    }
+  );
+}
+
+// src/components/app-shell/app-shell.tsx
+import { jsx as jsx24, jsxs as jsxs20 } from "react/jsx-runtime";
+function AppShell({ sidebar, topbar, children, className }) {
+  const [mobileOpen, setMobileOpen] = React12.useState(false);
+  return /* @__PURE__ */ jsxs20("div", { className: cn("flex h-dvh overflow-hidden bg-gray-50", className), children: [
+    /* @__PURE__ */ jsx24("div", { className: "hidden sm:flex sm:shrink-0", children: /* @__PURE__ */ jsx24(Sidebar, { ...sidebar }) }),
+    /* @__PURE__ */ jsx24(
+      Drawer,
+      {
+        open: mobileOpen,
+        onClose: () => setMobileOpen(false),
+        side: "left",
+        widthClass: "sm:w-64",
+        className: "p-0 sm:rounded-none",
+        children: /* @__PURE__ */ jsx24("div", { className: "-mx-5 -my-4 h-full", children: /* @__PURE__ */ jsx24(
+          Sidebar,
+          {
+            ...sidebar,
+            className: "h-full border-r-0"
+          }
+        ) })
+      }
+    ),
+    /* @__PURE__ */ jsxs20("div", { className: "flex flex-1 flex-col overflow-hidden", children: [
+      topbar !== void 0 && /* @__PURE__ */ jsx24(
+        Topbar,
+        {
+          ...topbar,
+          onMenuOpen: () => setMobileOpen(true),
+          hideMenuButton: false
+        }
+      ),
+      /* @__PURE__ */ jsx24("main", { className: "flex-1 overflow-y-auto p-4 sm:p-6", children })
+    ] })
+  ] });
+}
+
+// src/components/tabs/tabs.tsx
+import * as React13 from "react";
+import { jsx as jsx25, jsxs as jsxs21 } from "react/jsx-runtime";
+function Tabs({ tabs, value, onChange, children, className }) {
+  const tabListRef = React13.useRef(null);
+  const onKeyDown = (e, current) => {
+    const enabled = tabs.filter((t) => !t.disabled);
+    const idx = enabled.findIndex((t) => t.value === current);
+    if (e.key === "ArrowRight") {
+      e.preventDefault();
+      const next = enabled[(idx + 1) % enabled.length];
+      if (next) onChange(next.value);
+    }
+    if (e.key === "ArrowLeft") {
+      e.preventDefault();
+      const prev = enabled[(idx - 1 + enabled.length) % enabled.length];
+      if (prev) onChange(prev.value);
+    }
+  };
+  return /* @__PURE__ */ jsxs21("div", { className: cn("w-full", className), children: [
+    /* @__PURE__ */ jsx25(
+      "div",
+      {
+        ref: tabListRef,
+        role: "tablist",
+        className: "flex overflow-x-auto border-b border-gray-200 scrollbar-none",
+        style: { scrollbarWidth: "none" },
+        children: tabs.map((tab) => {
+          const isActive = tab.value === value;
+          return /* @__PURE__ */ jsx25(
+            "button",
+            {
+              role: "tab",
+              id: `tab-${tab.value}`,
+              "aria-selected": isActive,
+              "aria-controls": `panel-${tab.value}`,
+              disabled: tab.disabled,
+              tabIndex: isActive ? 0 : -1,
+              onClick: () => !tab.disabled && onChange(tab.value),
+              onKeyDown: (e) => onKeyDown(e, tab.value),
+              className: cn(
+                "inline-flex shrink-0 items-center whitespace-nowrap border-b-2 px-4 py-3 text-sm font-medium",
+                "transition-colors duration-150 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-blue-500",
+                // mobile touch target
+                "min-h-[44px]",
+                isActive ? "border-blue-600 text-blue-600" : "border-transparent text-gray-500 hover:border-gray-300 hover:text-gray-700",
+                tab.disabled && "cursor-not-allowed opacity-40"
+              ),
+              children: tab.label
+            },
+            tab.value
+          );
+        })
+      }
+    ),
+    children
+  ] });
+}
+function TabPanel({ value, activeValue, children, className }) {
+  const isActive = value === activeValue;
+  return /* @__PURE__ */ jsx25(
+    "div",
+    {
+      role: "tabpanel",
+      id: `panel-${value}`,
+      "aria-labelledby": `tab-${value}`,
+      hidden: !isActive,
+      className: cn("py-4", className),
+      children: isActive ? children : null
+    }
+  );
+}
+
+// src/components/dropdown-menu/dropdown-menu.tsx
+import * as React14 from "react";
+import { jsx as jsx26, jsxs as jsxs22 } from "react/jsx-runtime";
+function DropdownMenu({ trigger, items, align = "right", className }) {
+  const [open, setOpen] = React14.useState(false);
+  const containerRef = React14.useRef(null);
+  const menuRef = React14.useRef(null);
+  React14.useEffect(() => {
+    if (!open) return;
+    const handler = (e) => {
+      if (!containerRef.current?.contains(e.target)) setOpen(false);
+    };
+    document.addEventListener("mousedown", handler);
+    return () => document.removeEventListener("mousedown", handler);
+  }, [open]);
+  React14.useEffect(() => {
+    if (!open) return;
+    const handler = (e) => {
+      if (e.key === "Escape") {
+        setOpen(false);
+        containerRef.current?.querySelector("[data-trigger]")?.focus();
+      }
+    };
+    document.addEventListener("keydown", handler);
+    const first = menuRef.current?.querySelector("[role='menuitem']:not([disabled])");
+    first?.focus();
+    return () => document.removeEventListener("keydown", handler);
+  }, [open]);
+  return /* @__PURE__ */ jsxs22("div", { ref: containerRef, className: cn("relative inline-block", className), children: [
+    /* @__PURE__ */ jsx26(
+      "span",
+      {
+        "data-trigger": true,
+        onClick: () => setOpen((v) => !v),
+        "aria-haspopup": "menu",
+        "aria-expanded": open,
+        className: "inline-flex",
+        children: trigger
+      }
+    ),
+    open && /* @__PURE__ */ jsx26(
+      "div",
+      {
+        ref: menuRef,
+        role: "menu",
+        className: cn(
+          "absolute z-50 mt-1 min-w-[160px] overflow-hidden rounded-lg border border-gray-200 bg-white py-1 shadow-lg",
+          align === "right" ? "right-0" : "left-0"
+        ),
+        children: items.map((item, i) => /* @__PURE__ */ jsxs22(React14.Fragment, { children: [
+          item.divider && /* @__PURE__ */ jsx26("div", { className: "my-1 border-t border-gray-100" }),
+          /* @__PURE__ */ jsxs22(
+            "button",
+            {
+              role: "menuitem",
+              disabled: item.disabled,
+              onClick: () => {
+                if (item.disabled) return;
+                item.onClick?.();
+                setOpen(false);
+              },
+              className: cn(
+                "flex w-full items-center gap-2 px-4 py-2 text-left text-sm",
+                "transition-colors duration-100",
+                "focus-visible:outline-none focus-visible:bg-gray-50",
+                item.destructive ? "text-red-600 hover:bg-red-50" : "text-gray-700 hover:bg-gray-50",
+                item.disabled && "cursor-not-allowed opacity-40"
+              ),
+              children: [
+                item.icon && /* @__PURE__ */ jsx26("span", { className: "shrink-0 text-current", "aria-hidden": "true", children: item.icon }),
+                item.label
+              ]
+            }
+          )
+        ] }, i))
+      }
+    )
+  ] });
+}
+
+// src/components/pagination/pagination.tsx
+import { ChevronLeft, ChevronRight, MoreHorizontal } from "lucide-react";
+import { jsx as jsx27, jsxs as jsxs23 } from "react/jsx-runtime";
+function getPages(page, total, siblings) {
+  const delta = siblings;
+  const range = [];
+  for (let i = Math.max(2, page - delta); i <= Math.min(total - 1, page + delta); i++) range.push(i);
+  const pages = [1];
+  const rangeFirst = range[0];
+  const rangeLast = range[range.length - 1];
+  if (rangeFirst !== void 0 && rangeFirst > 2) pages.push("\u2026");
+  pages.push(...range);
+  if (rangeLast !== void 0 && rangeLast < total - 1) pages.push("\u2026");
+  if (total > 1) pages.push(total);
+  return pages;
+}
+var btnBase = "inline-flex h-9 min-w-[36px] items-center justify-center rounded-md px-2 text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-blue-500 disabled:pointer-events-none disabled:opacity-40";
+function Pagination({
+  page,
+  totalPages,
+  onChange,
+  siblingCount = 1,
+  className
+}) {
+  if (totalPages <= 1) return null;
+  const pages = getPages(page, totalPages, siblingCount);
+  return /* @__PURE__ */ jsxs23(
+    "nav",
+    {
+      "aria-label": "Pagination",
+      className: cn("flex flex-wrap items-center justify-center gap-1", className),
+      children: [
+        /* @__PURE__ */ jsxs23(
+          "button",
+          {
+            onClick: () => onChange(page - 1),
+            disabled: page === 1,
+            "aria-label": "Previous page",
+            className: cn(btnBase, "text-gray-600 hover:bg-gray-100"),
+            children: [
+              /* @__PURE__ */ jsx27(ChevronLeft, { size: 16, "aria-hidden": "true" }),
+              /* @__PURE__ */ jsx27("span", { className: "ml-1 hidden sm:inline", children: "Prev" })
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsx27("div", { className: "hidden sm:flex sm:items-center sm:gap-1", children: pages.map(
+          (p, i) => p === "\u2026" ? /* @__PURE__ */ jsx27("span", { className: "px-1 text-gray-400", children: /* @__PURE__ */ jsx27(MoreHorizontal, { size: 16, "aria-hidden": "true" }) }, `ellipsis-${i}`) : /* @__PURE__ */ jsx27(
+            "button",
+            {
+              onClick: () => onChange(p),
+              "aria-label": `Page ${p}`,
+              "aria-current": p === page ? "page" : void 0,
+              className: cn(
+                btnBase,
+                p === page ? "bg-blue-600 text-white hover:bg-blue-700" : "text-gray-600 hover:bg-gray-100"
+              ),
+              children: p
+            },
+            p
+          )
+        ) }),
+        /* @__PURE__ */ jsxs23("span", { className: "text-sm text-gray-500 sm:hidden", children: [
+          page,
+          " / ",
+          totalPages
+        ] }),
+        /* @__PURE__ */ jsxs23(
+          "button",
+          {
+            onClick: () => onChange(page + 1),
+            disabled: page === totalPages,
+            "aria-label": "Next page",
+            className: cn(btnBase, "text-gray-600 hover:bg-gray-100"),
+            children: [
+              /* @__PURE__ */ jsx27("span", { className: "mr-1 hidden sm:inline", children: "Next" }),
+              /* @__PURE__ */ jsx27(ChevronRight, { size: 16, "aria-hidden": "true" })
+            ]
+          }
+        )
+      ]
+    }
+  );
+}
+
+// src/components/tooltip/tooltip.tsx
+import * as React15 from "react";
+import { jsx as jsx28, jsxs as jsxs24 } from "react/jsx-runtime";
+var sideClasses = {
+  top: {
+    wrapper: "bottom-full left-1/2 mb-2 -translate-x-1/2",
+    tip: "top-full left-1/2 -translate-x-1/2 border-t-gray-800 border-x-transparent border-b-transparent"
+  },
+  bottom: {
+    wrapper: "top-full left-1/2 mt-2 -translate-x-1/2",
+    tip: "bottom-full left-1/2 -translate-x-1/2 border-b-gray-800 border-x-transparent border-t-transparent"
+  },
+  left: {
+    wrapper: "right-full top-1/2 mr-2 -translate-y-1/2",
+    tip: "left-full top-1/2 -translate-y-1/2 border-l-gray-800 border-y-transparent border-r-transparent"
+  },
+  right: {
+    wrapper: "left-full top-1/2 ml-2 -translate-y-1/2",
+    tip: "right-full top-1/2 -translate-y-1/2 border-r-gray-800 border-y-transparent border-l-transparent"
+  }
+};
+function Tooltip({ content, side = "top", children, className }) {
+  const id = React15.useId();
+  const [visible, setVisible] = React15.useState(false);
+  const show = () => setVisible(true);
+  const hide = () => setVisible(false);
+  const child = React15.cloneElement(children, {
+    "aria-describedby": visible ? id : void 0,
+    onMouseEnter: (e) => {
+      show();
+      children.props.onMouseEnter?.(e);
+    },
+    onMouseLeave: (e) => {
+      hide();
+      children.props.onMouseLeave?.(e);
+    },
+    onFocus: (e) => {
+      show();
+      children.props.onFocus?.(e);
+    },
+    onBlur: (e) => {
+      hide();
+      children.props.onBlur?.(e);
+    }
+  });
+  return /* @__PURE__ */ jsxs24("span", { className: "relative inline-flex", children: [
+    child,
+    visible && /* @__PURE__ */ jsxs24(
+      "span",
+      {
+        id,
+        role: "tooltip",
+        className: cn(
+          "pointer-events-none absolute z-50 whitespace-nowrap rounded bg-gray-800 px-2 py-1 text-xs text-white shadow-sm",
+          sideClasses[side].wrapper,
+          className
+        ),
+        children: [
+          content,
+          /* @__PURE__ */ jsx28(
+            "span",
+            {
+              "aria-hidden": "true",
+              className: cn(
+                "absolute h-0 w-0 border-4",
+                sideClasses[side].tip
+              )
+            }
+          )
+        ]
+      }
+    )
+  ] });
+}
+export {
+  Alert,
+  AppShell,
+  Badge,
+  Button,
+  Card,
+  CardContent,
+  CardDescription,
+  CardFooter,
+  CardHeader,
+  CardTitle,
+  Checkbox,
+  ConfirmDialog,
+  Drawer,
+  DropdownMenu,
+  EmptyState,
+  FormField,
+  Input,
+  Label,
+  Modal,
+  PageHeader,
+  Pagination,
+  Select,
+  Sidebar,
+  Spinner,
+  TabPanel,
+  Table,
+  TableBody,
+  TableCell,
+  TableEmptyState,
+  TableHead,
+  TableHeader,
+  TableRow,
+  TableToolbar,
+  Tabs,
+  Textarea,
+  ToastProvider,
+  Tooltip,
+  Topbar,
+  cn,
+  useToast
+};
+//# sourceMappingURL=index.js.map