@esprydi/ui 0.0.0-stage → 0.1.0

package/dist/index.mjs

@@ -0,0 +1,694 @@
+import {
+  esprydiPreset
+} from "./chunk-3GSLHHK2.mjs";
+
+// src/lib/utils.ts
+import { clsx } from "clsx";
+import { twMerge } from "tailwind-merge";
+function cn(...inputs) {
+  return twMerge(clsx(inputs));
+}
+
+// src/components/ui/button.tsx
+import * as React from "react";
+import { Slot } from "@radix-ui/react-slot";
+import { cva } from "class-variance-authority";
+import { jsx } from "react/jsx-runtime";
+var buttonVariants = cva(
+  "inline-flex items-center justify-center whitespace-nowrap rounded-lg text-sm font-medium transition-all duration-200 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 active:scale-[0.98]",
+  {
+    variants: {
+      variant: {
+        default: "bg-primary text-primary-foreground shadow hover:bg-primary/90",
+        destructive: "bg-destructive text-destructive-foreground shadow-sm hover:bg-destructive/90",
+        outline: "border border-border bg-background shadow-sm hover:bg-accent hover:text-accent-foreground",
+        secondary: "bg-secondary text-secondary-foreground shadow-sm hover:bg-secondary/80",
+        ghost: "hover:bg-accent hover:text-accent-foreground",
+        link: "text-primary underline-offset-4 hover:underline",
+        /* Esprydi Signature Ocean Variants (Tanpa Warna Neon) */
+        glow: "bg-[#086288] text-[#FFFEFC] font-semibold shadow-sm hover:bg-[#064e6d] active:scale-[0.98]",
+        coastal: "bg-[#4D8DBA] text-[#FFFEFC] font-semibold shadow-sm hover:bg-[#3d779f] active:scale-[0.98]",
+        ice: "bg-[#97D7FF] text-[#086288] font-semibold border border-[#97D7FF] hover:bg-[#86cdfc] active:scale-[0.98]",
+        glass: "bg-white/80 backdrop-blur-md border border-[#086288]/20 text-[#086288] hover:bg-[#086288]/10 shadow-sm",
+        subtle: "bg-[#4D8DBA]/10 border border-[#4D8DBA]/20 text-[#086288] hover:bg-[#4D8DBA]/20"
+      },
+      size: {
+        default: "h-9 px-4 py-2",
+        sm: "h-8 rounded-md px-3 text-xs",
+        lg: "h-11 rounded-lg px-8 text-base",
+        icon: "h-9 w-9"
+      }
+    },
+    defaultVariants: {
+      variant: "default",
+      size: "default"
+    }
+  }
+);
+var Button = React.forwardRef(
+  ({ className, variant, size, asChild = false, ...props }, ref) => {
+    const Comp = asChild ? Slot : "button";
+    return /* @__PURE__ */ jsx(
+      Comp,
+      {
+        className: cn(buttonVariants({ variant, size, className })),
+        ref,
+        ...props
+      }
+    );
+  }
+);
+Button.displayName = "Button";
+
+// src/components/ui/card.tsx
+import * as React2 from "react";
+import { cva as cva2 } from "class-variance-authority";
+import { jsx as jsx2 } from "react/jsx-runtime";
+var cardVariants = cva2(
+  "rounded-xl transition-all duration-300 text-card-foreground",
+  {
+    variants: {
+      variant: {
+        default: "border border-border bg-card shadow-sm",
+        glass: "bg-white/90 backdrop-blur-md border border-[#4D8DBA]/20 shadow-sm hover:border-[#086288]/40 hover:shadow-md",
+        elevated: "bg-white border border-[#086288]/20 shadow-md hover:shadow-lg",
+        glow: "border-t-4 border-t-[#086288] border-x border-b border-border bg-white shadow-sm hover:shadow-md",
+        coastal: "border-t-4 border-t-[#4D8DBA] border-x border-b border-border bg-white shadow-sm hover:shadow-md",
+        ice: "border-t-4 border-t-[#97D7FF] border-x border-b border-border bg-white shadow-sm hover:shadow-md"
+      }
+    },
+    defaultVariants: {
+      variant: "default"
+    }
+  }
+);
+var Card = React2.forwardRef(
+  ({ className, variant, ...props }, ref) => /* @__PURE__ */ jsx2(
+    "div",
+    {
+      ref,
+      className: cn(cardVariants({ variant }), className),
+      ...props
+    }
+  )
+);
+Card.displayName = "Card";
+var CardHeader = React2.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx2(
+  "div",
+  {
+    ref,
+    className: cn("flex flex-col space-y-1.5 p-6", className),
+    ...props
+  }
+));
+CardHeader.displayName = "CardHeader";
+var CardTitle = React2.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx2(
+  "h3",
+  {
+    ref,
+    className: cn("font-semibold leading-none tracking-tight", className),
+    ...props
+  }
+));
+CardTitle.displayName = "CardTitle";
+var CardDescription = React2.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx2(
+  "p",
+  {
+    ref,
+    className: cn("text-sm text-muted-foreground", className),
+    ...props
+  }
+));
+CardDescription.displayName = "CardDescription";
+var CardContent = React2.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx2("div", { ref, className: cn("p-6 pt-0", className), ...props }));
+CardContent.displayName = "CardContent";
+var CardFooter = React2.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx2(
+  "div",
+  {
+    ref,
+    className: cn("flex items-center p-6 pt-0", className),
+    ...props
+  }
+));
+CardFooter.displayName = "CardFooter";
+
+// src/components/ui/badge.tsx
+import { cva as cva3 } from "class-variance-authority";
+import { jsx as jsx3, jsxs } from "react/jsx-runtime";
+var badgeVariants = cva3(
+  "inline-flex items-center rounded-full border px-2.5 py-0.5 text-xs font-semibold transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2",
+  {
+    variants: {
+      variant: {
+        default: "border-transparent bg-primary text-primary-foreground hover:bg-primary/80",
+        secondary: "border-transparent bg-secondary text-secondary-foreground hover:bg-secondary/80",
+        destructive: "border-transparent bg-destructive text-destructive-foreground hover:bg-destructive/80",
+        outline: "text-foreground border-border",
+        /* Esprydi Signature Ocean Badges (Tanpa Warna Neon) */
+        ocean: "border-[#086288]/30 bg-[#086288]/10 text-[#086288] font-semibold",
+        coastal: "border-[#4D8DBA]/30 bg-[#4D8DBA]/10 text-[#086288] font-semibold",
+        ice: "border-[#97D7FF] bg-[#97D7FF]/30 text-[#086288] font-semibold",
+        subtle: "border-border/60 bg-surface-2 text-muted-foreground"
+      }
+    },
+    defaultVariants: {
+      variant: "default"
+    }
+  }
+);
+function Badge({ className, variant, dot = false, children, ...props }) {
+  return /* @__PURE__ */ jsxs("div", { className: cn(badgeVariants({ variant }), className), ...props, children: [
+    dot && /* @__PURE__ */ jsx3("span", { className: "mr-1.5 h-1.5 w-1.5 rounded-full bg-current animate-pulse" }),
+    children
+  ] });
+}
+
+// src/components/ui/input.tsx
+import * as React3 from "react";
+import { jsx as jsx4 } from "react/jsx-runtime";
+var Input = React3.forwardRef(
+  ({ className, type, glow = true, ...props }, ref) => {
+    return /* @__PURE__ */ jsx4(
+      "input",
+      {
+        type,
+        className: cn(
+          "flex h-9 w-full rounded-lg border border-input bg-surface-1 px-3 py-1 text-sm shadow-sm transition-all duration-200 file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50",
+          glow && "focus-visible:border-primary/50 focus-visible:ring-primary/20",
+          className
+        ),
+        ref,
+        ...props
+      }
+    );
+  }
+);
+Input.displayName = "Input";
+
+// src/components/ui/textarea.tsx
+import * as React4 from "react";
+import { jsx as jsx5 } from "react/jsx-runtime";
+var Textarea = React4.forwardRef(
+  ({ className, glow = true, ...props }, ref) => {
+    return /* @__PURE__ */ jsx5(
+      "textarea",
+      {
+        className: cn(
+          "flex min-h-[80px] w-full rounded-lg border border-input bg-surface-1 px-3 py-2 text-sm shadow-sm transition-all duration-200 placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50",
+          glow && "focus-visible:border-primary/50 focus-visible:ring-primary/20",
+          className
+        ),
+        ref,
+        ...props
+      }
+    );
+  }
+);
+Textarea.displayName = "Textarea";
+
+// src/components/ui/dialog.tsx
+import * as React5 from "react";
+import * as DialogPrimitive from "@radix-ui/react-dialog";
+import { X } from "lucide-react";
+import { jsx as jsx6, 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 = React5.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx6(
+  DialogPrimitive.Overlay,
+  {
+    ref,
+    className: cn(
+      "fixed inset-0 z-50 bg-black/70 backdrop-blur-sm 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 = React5.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs2(DialogPortal, { children: [
+  /* @__PURE__ */ jsx6(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-border/80 bg-card/95 p-6 shadow-2xl backdrop-blur-xl duration-200 rounded-xl",
+        "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%]",
+        className
+      ),
+      ...props,
+      children: [
+        children,
+        /* @__PURE__ */ jsxs2(DialogPrimitive.Close, { className: "absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none", children: [
+          /* @__PURE__ */ jsx6(X, { className: "h-4 w-4 text-muted-foreground hover:text-foreground" }),
+          /* @__PURE__ */ jsx6("span", { className: "sr-only", children: "Close" })
+        ] })
+      ]
+    }
+  )
+] }));
+DialogContent.displayName = DialogPrimitive.Content.displayName;
+var DialogHeader = ({
+  className,
+  ...props
+}) => /* @__PURE__ */ jsx6(
+  "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__ */ jsx6(
+  "div",
+  {
+    className: cn(
+      "flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2",
+      className
+    ),
+    ...props
+  }
+);
+DialogFooter.displayName = "DialogFooter";
+var DialogTitle = React5.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx6(
+  DialogPrimitive.Title,
+  {
+    ref,
+    className: cn(
+      "text-lg font-semibold leading-none tracking-tight text-foreground",
+      className
+    ),
+    ...props
+  }
+));
+DialogTitle.displayName = DialogPrimitive.Title.displayName;
+var DialogDescription = React5.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx6(
+  DialogPrimitive.Description,
+  {
+    ref,
+    className: cn("text-sm text-muted-foreground", className),
+    ...props
+  }
+));
+DialogDescription.displayName = DialogPrimitive.Description.displayName;
+
+// src/components/ui/dropdown-menu.tsx
+import * as React6 from "react";
+import * as DropdownMenuPrimitive from "@radix-ui/react-dropdown-menu";
+import { Check, ChevronRight, Circle } from "lucide-react";
+import { jsx as jsx7, jsxs as jsxs3 } from "react/jsx-runtime";
+var DropdownMenu = DropdownMenuPrimitive.Root;
+var DropdownMenuTrigger = DropdownMenuPrimitive.Trigger;
+var DropdownMenuGroup = DropdownMenuPrimitive.Group;
+var DropdownMenuPortal = DropdownMenuPrimitive.Portal;
+var DropdownMenuSub = DropdownMenuPrimitive.Sub;
+var DropdownMenuRadioGroup = DropdownMenuPrimitive.RadioGroup;
+var DropdownMenuSubTrigger = React6.forwardRef(({ className, inset, children, ...props }, ref) => /* @__PURE__ */ jsxs3(
+  DropdownMenuPrimitive.SubTrigger,
+  {
+    ref,
+    className: cn(
+      "flex cursor-default select-none items-center rounded-md px-2 py-1.5 text-sm outline-none focus:bg-accent data-[state=open]:bg-accent",
+      inset && "pl-8",
+      className
+    ),
+    ...props,
+    children: [
+      children,
+      /* @__PURE__ */ jsx7(ChevronRight, { className: "ml-auto h-4 w-4" })
+    ]
+  }
+));
+DropdownMenuSubTrigger.displayName = DropdownMenuPrimitive.SubTrigger.displayName;
+var DropdownMenuSubContent = React6.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx7(
+  DropdownMenuPrimitive.SubContent,
+  {
+    ref,
+    className: cn(
+      "z-50 min-w-[8rem] overflow-hidden rounded-lg border border-border/70 bg-popover/95 p-1 text-popover-foreground shadow-xl backdrop-blur-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",
+      className
+    ),
+    ...props
+  }
+));
+DropdownMenuSubContent.displayName = DropdownMenuPrimitive.SubContent.displayName;
+var DropdownMenuContent = React6.forwardRef(({ className, sideOffset = 4, ...props }, ref) => /* @__PURE__ */ jsx7(DropdownMenuPrimitive.Portal, { children: /* @__PURE__ */ jsx7(
+  DropdownMenuPrimitive.Content,
+  {
+    ref,
+    sideOffset,
+    className: cn(
+      "z-50 min-w-[10rem] overflow-hidden rounded-lg border border-border/70 bg-popover/95 p-1 text-popover-foreground shadow-xl backdrop-blur-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",
+      className
+    ),
+    ...props
+  }
+) }));
+DropdownMenuContent.displayName = DropdownMenuPrimitive.Content.displayName;
+var DropdownMenuItem = React6.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsx7(
+  DropdownMenuPrimitive.Item,
+  {
+    ref,
+    className: cn(
+      "relative flex cursor-pointer select-none items-center rounded-md px-2 py-1.5 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
+      inset && "pl-8",
+      className
+    ),
+    ...props
+  }
+));
+DropdownMenuItem.displayName = DropdownMenuPrimitive.Item.displayName;
+var DropdownMenuCheckboxItem = React6.forwardRef(({ className, children, checked, ...props }, ref) => /* @__PURE__ */ jsxs3(
+  DropdownMenuPrimitive.CheckboxItem,
+  {
+    ref,
+    className: cn(
+      "relative flex cursor-default select-none items-center rounded-md py-1.5 pl-8 pr-2 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
+      className
+    ),
+    checked,
+    ...props,
+    children: [
+      /* @__PURE__ */ jsx7("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsx7(DropdownMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx7(Check, { className: "h-4 w-4 text-primary" }) }) }),
+      children
+    ]
+  }
+));
+DropdownMenuCheckboxItem.displayName = DropdownMenuPrimitive.CheckboxItem.displayName;
+var DropdownMenuRadioItem = React6.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs3(
+  DropdownMenuPrimitive.RadioItem,
+  {
+    ref,
+    className: cn(
+      "relative flex cursor-default select-none items-center rounded-md py-1.5 pl-8 pr-2 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
+      className
+    ),
+    ...props,
+    children: [
+      /* @__PURE__ */ jsx7("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsx7(DropdownMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx7(Circle, { className: "h-2 w-2 fill-current text-primary" }) }) }),
+      children
+    ]
+  }
+));
+DropdownMenuRadioItem.displayName = DropdownMenuPrimitive.RadioItem.displayName;
+var DropdownMenuLabel = React6.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsx7(
+  DropdownMenuPrimitive.Label,
+  {
+    ref,
+    className: cn(
+      "px-2 py-1.5 text-xs font-semibold text-muted-foreground",
+      inset && "pl-8",
+      className
+    ),
+    ...props
+  }
+));
+DropdownMenuLabel.displayName = DropdownMenuPrimitive.Label.displayName;
+var DropdownMenuSeparator = React6.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx7(
+  DropdownMenuPrimitive.Separator,
+  {
+    ref,
+    className: cn("-mx-1 my-1 h-px bg-border/60", className),
+    ...props
+  }
+));
+DropdownMenuSeparator.displayName = DropdownMenuPrimitive.Separator.displayName;
+
+// src/components/ui/tooltip.tsx
+import * as React7 from "react";
+import * as TooltipPrimitive from "@radix-ui/react-tooltip";
+import { jsx as jsx8 } from "react/jsx-runtime";
+var TooltipProvider = TooltipPrimitive.Provider;
+var Tooltip = TooltipPrimitive.Root;
+var TooltipTrigger = TooltipPrimitive.Trigger;
+var TooltipContent = React7.forwardRef(({ className, sideOffset = 4, ...props }, ref) => /* @__PURE__ */ jsx8(
+  TooltipPrimitive.Content,
+  {
+    ref,
+    sideOffset,
+    className: cn(
+      "z-50 overflow-hidden rounded-md border border-border/80 bg-popover/90 px-3 py-1.5 text-xs text-popover-foreground shadow-md backdrop-blur-md animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
+      className
+    ),
+    ...props
+  }
+));
+TooltipContent.displayName = TooltipPrimitive.Content.displayName;
+
+// src/components/ui/table.tsx
+import * as React8 from "react";
+import { jsx as jsx9 } from "react/jsx-runtime";
+var Table = React8.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx9("div", { className: "relative w-full overflow-auto rounded-xl border border-border/60 bg-surface-1/40 backdrop-blur-sm", children: /* @__PURE__ */ jsx9(
+  "table",
+  {
+    ref,
+    className: cn("w-full caption-bottom text-sm", className),
+    ...props
+  }
+) }));
+Table.displayName = "Table";
+var TableHeader = React8.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx9(
+  "thead",
+  {
+    ref,
+    className: cn(
+      "border-b border-[#086288]/20 bg-[#97D7FF]/35 text-slate-900 font-bold [&_th]:text-slate-900 [&_th]:font-bold [&_tr]:border-b-0",
+      className
+    ),
+    ...props
+  }
+));
+TableHeader.displayName = "TableHeader";
+var TableBody = React8.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx9(
+  "tbody",
+  {
+    ref,
+    className: cn("[&_tr:last-child]:border-0", className),
+    ...props
+  }
+));
+TableBody.displayName = "TableBody";
+var TableFooter = React8.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx9(
+  "tfoot",
+  {
+    ref,
+    className: cn(
+      "border-t border-border bg-muted/50 font-medium [&>tr]:last:border-b-0",
+      className
+    ),
+    ...props
+  }
+));
+TableFooter.displayName = "TableFooter";
+var TableRow = React8.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx9(
+  "tr",
+  {
+    ref,
+    className: cn(
+      "border-b border-border/40 transition-colors hover:bg-surface-2/50 data-[state=selected]:bg-muted",
+      className
+    ),
+    ...props
+  }
+));
+TableRow.displayName = "TableRow";
+var TableHead = React8.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx9(
+  "th",
+  {
+    ref,
+    className: cn(
+      "h-10 px-4 text-left align-middle font-medium text-muted-foreground [&:has([role=checkbox])]:pr-0",
+      className
+    ),
+    ...props
+  }
+));
+TableHead.displayName = "TableHead";
+var TableCell = React8.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx9(
+  "td",
+  {
+    ref,
+    className: cn("p-4 align-middle [&:has([role=checkbox])]:pr-0", className),
+    ...props
+  }
+));
+TableCell.displayName = "TableCell";
+var TableCaption = React8.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx9(
+  "caption",
+  {
+    ref,
+    className: cn("mt-4 text-sm text-muted-foreground", className),
+    ...props
+  }
+));
+TableCaption.displayName = "TableCaption";
+
+// src/components/ui/avatar.tsx
+import * as React9 from "react";
+import { jsx as jsx10 } from "react/jsx-runtime";
+function Avatar({
+  src,
+  alt = "Avatar",
+  fallback = "U",
+  glow = false,
+  className,
+  ...props
+}) {
+  const [hasError, setHasError] = React9.useState(!src);
+  return /* @__PURE__ */ jsx10(
+    "div",
+    {
+      className: cn(
+        "relative flex h-10 w-10 shrink-0 overflow-hidden rounded-full border border-border/80 bg-surface-2",
+        glow && "ring-2 ring-primary/40 shadow-[0_0_12px_rgba(59,130,246,0.25)]",
+        className
+      ),
+      ...props,
+      children: src && !hasError ? /* @__PURE__ */ jsx10(
+        "img",
+        {
+          src,
+          alt,
+          onError: () => setHasError(true),
+          className: "aspect-square h-full w-full object-cover"
+        }
+      ) : /* @__PURE__ */ jsx10("div", { className: "flex h-full w-full items-center justify-center font-medium text-xs text-muted-foreground uppercase", children: fallback })
+    }
+  );
+}
+
+// src/components/ui/skeleton.tsx
+import { jsx as jsx11 } from "react/jsx-runtime";
+function Skeleton({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx11(
+    "div",
+    {
+      className: cn(
+        "animate-pulse rounded-md bg-surface-2/80",
+        className
+      ),
+      ...props
+    }
+  );
+}
+
+// src/components/layout/shell.tsx
+import { jsx as jsx12, jsxs as jsxs4 } from "react/jsx-runtime";
+function AppShell({
+  sidebar,
+  header,
+  children,
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxs4(
+    "div",
+    {
+      className: cn(
+        "min-h-screen bg-background text-foreground flex antialiased selection:bg-primary/20",
+        className
+      ),
+      ...props,
+      children: [
+        sidebar && /* @__PURE__ */ jsx12("aside", { className: "w-64 border-r border-border/70 bg-surface-1/70 backdrop-blur-md hidden md:flex flex-col shrink-0", children: sidebar }),
+        /* @__PURE__ */ jsxs4("div", { className: "flex-1 flex flex-col min-w-0", children: [
+          header && /* @__PURE__ */ jsx12("header", { className: "h-16 border-b border-border/60 bg-background/80 backdrop-blur-md sticky top-0 z-40 flex items-center px-6 justify-between", children: header }),
+          /* @__PURE__ */ jsx12("main", { className: "flex-1 p-6 overflow-y-auto", children })
+        ] })
+      ]
+    }
+  );
+}
+function PageHeader({
+  title,
+  description,
+  actions,
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxs4(
+    "div",
+    {
+      className: cn(
+        "flex flex-col md:flex-row md:items-center md:justify-between gap-4 pb-6 border-b border-border/40 mb-6",
+        className
+      ),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsxs4("div", { children: [
+          /* @__PURE__ */ jsx12("h1", { className: "text-2xl font-bold tracking-tight text-foreground", children: title }),
+          description && /* @__PURE__ */ jsx12("p", { className: "text-sm text-muted-foreground mt-1", children: description })
+        ] }),
+        actions && /* @__PURE__ */ jsx12("div", { className: "flex items-center gap-3", children: actions })
+      ]
+    }
+  );
+}
+export {
+  AppShell,
+  Avatar,
+  Badge,
+  Button,
+  Card,
+  CardContent,
+  CardDescription,
+  CardFooter,
+  CardHeader,
+  CardTitle,
+  Dialog,
+  DialogClose,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogOverlay,
+  DialogPortal,
+  DialogTitle,
+  DialogTrigger,
+  DropdownMenu,
+  DropdownMenuCheckboxItem,
+  DropdownMenuContent,
+  DropdownMenuGroup,
+  DropdownMenuItem,
+  DropdownMenuLabel,
+  DropdownMenuPortal,
+  DropdownMenuRadioGroup,
+  DropdownMenuRadioItem,
+  DropdownMenuSeparator,
+  DropdownMenuSub,
+  DropdownMenuSubContent,
+  DropdownMenuSubTrigger,
+  DropdownMenuTrigger,
+  Input,
+  PageHeader,
+  Skeleton,
+  Table,
+  TableBody,
+  TableCaption,
+  TableCell,
+  TableFooter,
+  TableHead,
+  TableHeader,
+  TableRow,
+  Textarea,
+  Tooltip,
+  TooltipContent,
+  TooltipProvider,
+  TooltipTrigger,
+  badgeVariants,
+  buttonVariants,
+  cn,
+  esprydiPreset
+};
+//# sourceMappingURL=index.mjs.map