@7onic-ui/react 0.3.9 → 0.3.10

package/dist/chunk-BN5BEA3V.mjs

@@ -0,0 +1,195 @@
+"use client";
+import {
+  cn
+} from "./chunk-53MIUPSY.mjs";
+
+// src/components/ui/table.tsx
+import * as React from "react";
+import { cva } from "class-variance-authority";
+var TableContext = React.createContext({ size: "default", variant: "default", stickyHeader: false });
+var cellPaddingMap = {
+  sm: "px-3 py-2 text-sm",
+  default: "px-4 py-3 text-sm",
+  lg: "px-6 py-4 text-base"
+};
+var headPaddingMap = {
+  sm: "px-3 py-2 text-xs",
+  default: "px-4 py-3 text-xs",
+  lg: "px-6 py-3.5 text-sm"
+};
+var checkboxPaddingMap = {
+  sm: "[&:has([role=checkbox])]:pl-1 [&:has([role=checkbox])]:pr-0",
+  default: "[&:has([role=checkbox])]:pl-2 [&:has([role=checkbox])]:pr-0",
+  lg: "[&:has([role=checkbox])]:pl-3 [&:has([role=checkbox])]:pr-0"
+};
+var tableVariants = cva(
+  "w-full caption-bottom text-sm",
+  {
+    variants: {
+      variant: {
+        default: "",
+        bordered: "border border-border",
+        striped: ""
+      }
+    },
+    defaultVariants: {
+      variant: "default"
+    }
+  }
+);
+var Table = React.forwardRef(
+  ({ className, size = "default", variant = "default", stickyHeader = false, wrapperClassName, ...props }, ref) => /* @__PURE__ */ React.createElement(TableContext.Provider, { value: { size, variant, stickyHeader } }, /* @__PURE__ */ React.createElement("div", { className: cn("relative w-full overflow-auto", wrapperClassName) }, /* @__PURE__ */ React.createElement(
+    "table",
+    {
+      ref,
+      className: cn(tableVariants({ variant }), className),
+      ...props
+    }
+  )))
+);
+Table.displayName = "Table";
+var TableHeader = React.forwardRef(({ className, ...props }, ref) => {
+  const { stickyHeader } = React.useContext(TableContext);
+  return /* @__PURE__ */ React.createElement(
+    "thead",
+    {
+      ref,
+      className: cn(
+        "[&_tr]:border-b [&_tr]:border-border",
+        stickyHeader && "sticky top-0 z-10 bg-background",
+        className
+      ),
+      ...props
+    }
+  );
+});
+TableHeader.displayName = "TableHeader";
+var TableBody = React.forwardRef(({ className, ...props }, ref) => {
+  const { variant } = React.useContext(TableContext);
+  return /* @__PURE__ */ React.createElement(
+    "tbody",
+    {
+      ref,
+      className: cn(
+        "[&_tr:last-child]:border-b-0",
+        variant === "striped" && "[&_tr:nth-child(even)]:bg-background-muted",
+        className
+      ),
+      ...props
+    }
+  );
+});
+TableBody.displayName = "TableBody";
+var TableFooter = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React.createElement(
+  "tfoot",
+  {
+    ref,
+    className: cn(
+      "border-t border-border bg-background-muted/50 font-normal [&>tr]:last:border-b-0",
+      className
+    ),
+    ...props
+  }
+));
+TableFooter.displayName = "TableFooter";
+var TableRow = React.forwardRef(
+  ({ className, interactive = false, selected = false, ...props }, ref) => /* @__PURE__ */ React.createElement(
+    "tr",
+    {
+      ref,
+      "data-selected": selected || void 0,
+      className: cn(
+        "border-b border-border transition-colors duration-fast",
+        interactive && "hover:bg-background-muted/50 cursor-pointer",
+        className
+      ),
+      ...props
+    }
+  )
+);
+TableRow.displayName = "TableRow";
+var defaultSortIcons = {
+  asc: /* @__PURE__ */ React.createElement("svg", { className: "icon-xs", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", strokeWidth: 2, "aria-hidden": "true" }, /* @__PURE__ */ React.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M5 15l7-7 7 7" })),
+  desc: /* @__PURE__ */ React.createElement("svg", { className: "icon-xs", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", strokeWidth: 2, "aria-hidden": "true" }, /* @__PURE__ */ React.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M19 9l-7 7-7-7" })),
+  default: /* @__PURE__ */ React.createElement("svg", { className: "icon-xs", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", strokeWidth: 2, "aria-hidden": "true" }, /* @__PURE__ */ React.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M7 16V4m0 0L3 8m4-4l4 4m6 0v12m0 0l4-4m-4 4l-4-4" }))
+};
+var TableHead = React.forwardRef(
+  ({ className, align = "left", sortable = false, sortDirection = null, onSort, sortIcon, children, ...props }, ref) => {
+    const { size } = React.useContext(TableContext);
+    const icons = { ...defaultSortIcons, ...sortIcon };
+    const content = sortable ? /* @__PURE__ */ React.createElement(
+      "button",
+      {
+        type: "button",
+        className: "inline-flex items-center gap-1.5 hover:text-foreground transition-colors duration-fast group",
+        onClick: onSort
+      },
+      children,
+      /* @__PURE__ */ React.createElement("span", { className: cn(
+        "shrink-0 transition-colors duration-fast",
+        sortDirection ? "text-foreground" : "text-text-muted"
+      ) }, sortDirection === "asc" ? icons.asc : sortDirection === "desc" ? icons.desc : icons.default)
+    ) : children;
+    return /* @__PURE__ */ React.createElement(
+      "th",
+      {
+        ref,
+        className: cn(
+          "text-left align-middle font-semibold text-text-muted whitespace-nowrap",
+          headPaddingMap[size],
+          checkboxPaddingMap[size],
+          align === "center" && "text-center",
+          align === "right" && "text-right",
+          sortable && "select-none",
+          className
+        ),
+        "aria-sort": sortDirection === "asc" ? "ascending" : sortDirection === "desc" ? "descending" : void 0,
+        ...props
+      },
+      content
+    );
+  }
+);
+TableHead.displayName = "TableHead";
+var TableCell = React.forwardRef(
+  ({ className, align = "left", ...props }, ref) => {
+    const { size } = React.useContext(TableContext);
+    return /* @__PURE__ */ React.createElement(
+      "td",
+      {
+        ref,
+        className: cn(
+          "text-foreground align-middle",
+          cellPaddingMap[size],
+          checkboxPaddingMap[size],
+          align === "center" && "text-center",
+          align === "right" && "text-right",
+          className
+        ),
+        ...props
+      }
+    );
+  }
+);
+TableCell.displayName = "TableCell";
+var TableCaption = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React.createElement(
+  "caption",
+  {
+    ref,
+    className: cn("mt-4 text-sm text-text-muted", className),
+    ...props
+  }
+));
+TableCaption.displayName = "TableCaption";
+
+export {
+  Table,
+  TableHeader,
+  TableBody,
+  TableFooter,
+  TableRow,
+  TableHead,
+  TableCell,
+  TableCaption
+};
+//# sourceMappingURL=chunk-BN5BEA3V.mjs.map

package/dist/chunk-BN5BEA3V.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/ui/table.tsx"],"sourcesContent":["'use client'\n\nimport * as React from 'react'\nimport { cva, type VariantProps } from 'class-variance-authority'\nimport { cn } from '@/lib/utils'\n\n// Size variants for table density\ntype TableSize = 'sm' | 'default' | 'lg'\n\n// Visual style variants\ntype TableVariant = 'default' | 'bordered' | 'striped'\n\n// Root context — set at Root, consumed by children\nconst TableContext = React.createContext<{\n  size: TableSize\n  variant: TableVariant\n  stickyHeader: boolean\n}>({ size: 'default', variant: 'default', stickyHeader: false })\n\n// Cell padding per size\nconst cellPaddingMap: Record<TableSize, string> = {\n  sm: 'px-3 py-2 text-sm',\n  default: 'px-4 py-3 text-sm',\n  lg: 'px-6 py-4 text-base',\n}\n\n// Head cell padding per size\nconst headPaddingMap: Record<TableSize, string> = {\n  sm: 'px-3 py-2 text-xs',\n  default: 'px-4 py-3 text-xs',\n  lg: 'px-6 py-3.5 text-sm',\n}\n\n// Checkbox column padding override per size (right padding removed — next column's left padding handles the gap)\nconst checkboxPaddingMap: Record<TableSize, string> = {\n  sm: '[&:has([role=checkbox])]:pl-1 [&:has([role=checkbox])]:pr-0',\n  default: '[&:has([role=checkbox])]:pl-2 [&:has([role=checkbox])]:pr-0',\n  lg: '[&:has([role=checkbox])]:pl-3 [&:has([role=checkbox])]:pr-0',\n}\n\nconst tableVariants = cva(\n  'w-full caption-bottom text-sm',\n  {\n    variants: {\n      variant: {\n        default: '',\n        bordered: 'border border-border',\n        striped: '',\n      },\n    },\n    defaultVariants: {\n      variant: 'default',\n    },\n  }\n)\n\n// ─── Root ────────────────────────────────────────────────────────\nexport interface TableProps\n  extends React.HTMLAttributes<HTMLTableElement>,\n    VariantProps<typeof tableVariants> {\n  /** Table density */\n  size?: TableSize\n  /** Visual style */\n  variant?: TableVariant\n  /** Sticky header when scrolling */\n  stickyHeader?: boolean\n  /** Additional className for the scroll wrapper (e.g. max-h-[400px]) */\n  wrapperClassName?: string\n}\n\nconst Table = React.forwardRef<HTMLTableElement, TableProps>(\n  ({ className, size = 'default', variant = 'default', stickyHeader = false, wrapperClassName, ...props }, ref) => (\n    <TableContext.Provider value={{ size, variant, stickyHeader }}>\n      <div className={cn('relative w-full overflow-auto', wrapperClassName)}>\n        <table\n          ref={ref}\n          className={cn(tableVariants({ variant }), className)}\n          {...props}\n        />\n      </div>\n    </TableContext.Provider>\n  )\n)\nTable.displayName = 'Table'\n\n// ─── Header ──────────────────────────────────────────────────────\nconst TableHeader = React.forwardRef<\n  HTMLTableSectionElement,\n  React.HTMLAttributes<HTMLTableSectionElement>\n>(({ className, ...props }, ref) => {\n  const { stickyHeader } = React.useContext(TableContext)\n  return (\n    <thead\n      ref={ref}\n      className={cn(\n        '[&_tr]:border-b [&_tr]:border-border',\n        stickyHeader && 'sticky top-0 z-10 bg-background',\n        className\n      )}\n      {...props}\n    />\n  )\n})\nTableHeader.displayName = 'TableHeader'\n\n// ─── Body ────────────────────────────────────────────────────────\nconst TableBody = React.forwardRef<\n  HTMLTableSectionElement,\n  React.HTMLAttributes<HTMLTableSectionElement>\n>(({ className, ...props }, ref) => {\n  const { variant } = React.useContext(TableContext)\n  return (\n    <tbody\n      ref={ref}\n      className={cn(\n        '[&_tr:last-child]:border-b-0',\n        variant === 'striped' && '[&_tr:nth-child(even)]:bg-background-muted',\n        className\n      )}\n      {...props}\n    />\n  )\n})\nTableBody.displayName = 'TableBody'\n\n// ─── Footer ──────────────────────────────────────────────────────\nconst TableFooter = React.forwardRef<\n  HTMLTableSectionElement,\n  React.HTMLAttributes<HTMLTableSectionElement>\n>(({ className, ...props }, ref) => (\n  <tfoot\n    ref={ref}\n    className={cn(\n      'border-t border-border bg-background-muted/50 font-normal [&>tr]:last:border-b-0',\n      className\n    )}\n    {...props}\n  />\n))\nTableFooter.displayName = 'TableFooter'\n\n// ─── Row ─────────────────────────────────────────────────────────\nexport interface TableRowProps extends React.HTMLAttributes<HTMLTableRowElement> {\n  /** Enable hover highlight */\n  interactive?: boolean\n  /** Selected state background */\n  selected?: boolean\n}\n\nconst TableRow = React.forwardRef<HTMLTableRowElement, TableRowProps>(\n  ({ className, interactive = false, selected = false, ...props }, ref) => (\n    <tr\n      ref={ref}\n      data-selected={selected || undefined}\n      className={cn(\n        'border-b border-border transition-colors duration-fast',\n        interactive && 'hover:bg-background-muted/50 cursor-pointer',\n        className\n      )}\n      {...props}\n    />\n  )\n)\nTableRow.displayName = 'TableRow'\n\n// ─── Head Cell ───────────────────────────────────────────────────\ntype SortDirection = 'asc' | 'desc' | null\n\n// Default sort icons\nconst defaultSortIcons = {\n  asc: (\n    <svg className=\"icon-xs\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" strokeWidth={2} aria-hidden=\"true\">\n      <path strokeLinecap=\"round\" strokeLinejoin=\"round\" d=\"M5 15l7-7 7 7\" />\n    </svg>\n  ),\n  desc: (\n    <svg className=\"icon-xs\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" strokeWidth={2} aria-hidden=\"true\">\n      <path strokeLinecap=\"round\" strokeLinejoin=\"round\" d=\"M19 9l-7 7-7-7\" />\n    </svg>\n  ),\n  default: (\n    <svg className=\"icon-xs\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" strokeWidth={2} aria-hidden=\"true\">\n      <path strokeLinecap=\"round\" strokeLinejoin=\"round\" d=\"M7 16V4m0 0L3 8m4-4l4 4m6 0v12m0 0l4-4m-4 4l-4-4\" />\n    </svg>\n  ),\n}\n\nexport interface SortIconSet {\n  /** Icon for ascending state */\n  asc?: React.ReactNode\n  /** Icon for descending state */\n  desc?: React.ReactNode\n  /** Icon for unsorted (default) state */\n  default?: React.ReactNode\n}\n\nexport interface TableHeadProps extends React.ThHTMLAttributes<HTMLTableCellElement> {\n  /** Text alignment */\n  align?: 'left' | 'center' | 'right'\n  /** Enable sort indicator */\n  sortable?: boolean\n  /** Current sort direction */\n  sortDirection?: SortDirection\n  /** Sort click handler */\n  onSort?: () => void\n  /** Custom sort icons (overrides built-in icons) */\n  sortIcon?: SortIconSet\n}\n\nconst TableHead = React.forwardRef<HTMLTableCellElement, TableHeadProps>(\n  ({ className, align = 'left', sortable = false, sortDirection = null, onSort, sortIcon, children, ...props }, ref) => {\n    const { size } = React.useContext(TableContext)\n    const icons = { ...defaultSortIcons, ...sortIcon }\n\n    const content = sortable ? (\n      <button\n        type=\"button\"\n        className=\"inline-flex items-center gap-1.5 hover:text-foreground transition-colors duration-fast group\"\n        onClick={onSort}\n      >\n        {children}\n        <span className={cn(\n          'shrink-0 transition-colors duration-fast',\n          sortDirection ? 'text-foreground' : 'text-text-muted'\n        )}>\n          {sortDirection === 'asc' ? icons.asc\n            : sortDirection === 'desc' ? icons.desc\n            : icons.default}\n        </span>\n      </button>\n    ) : children\n\n    return (\n      <th\n        ref={ref}\n        className={cn(\n          'text-left align-middle font-semibold text-text-muted whitespace-nowrap',\n          headPaddingMap[size],\n          checkboxPaddingMap[size],\n          align === 'center' && 'text-center',\n          align === 'right' && 'text-right',\n          sortable && 'select-none',\n          className\n        )}\n        aria-sort={sortDirection === 'asc' ? 'ascending' : sortDirection === 'desc' ? 'descending' : undefined}\n        {...props}\n      >\n        {content}\n      </th>\n    )\n  }\n)\nTableHead.displayName = 'TableHead'\n\n// ─── Data Cell ───────────────────────────────────────────────────\nexport interface TableCellProps extends React.TdHTMLAttributes<HTMLTableCellElement> {\n  /** Text alignment */\n  align?: 'left' | 'center' | 'right'\n}\n\nconst TableCell = React.forwardRef<HTMLTableCellElement, TableCellProps>(\n  ({ className, align = 'left', ...props }, ref) => {\n    const { size } = React.useContext(TableContext)\n    return (\n      <td\n        ref={ref}\n        className={cn(\n          'text-foreground align-middle',\n          cellPaddingMap[size],\n          checkboxPaddingMap[size],\n          align === 'center' && 'text-center',\n          align === 'right' && 'text-right',\n          className\n        )}\n        {...props}\n      />\n    )\n  }\n)\nTableCell.displayName = 'TableCell'\n\n// ─── Caption ─────────────────────────────────────────────────────\nconst TableCaption = React.forwardRef<\n  HTMLTableCaptionElement,\n  React.HTMLAttributes<HTMLTableCaptionElement>\n>(({ className, ...props }, ref) => (\n  <caption\n    ref={ref}\n    className={cn('mt-4 text-sm text-text-muted', className)}\n    {...props}\n  />\n))\nTableCaption.displayName = 'TableCaption'\n\nexport type { TableSize, TableVariant, SortDirection }\n\nexport {\n  Table,\n  TableHeader,\n  TableBody,\n  TableFooter,\n  TableRow,\n  TableHead,\n  TableCell,\n  TableCaption,\n}\n"],"mappings":"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","names":[]}

package/dist/chunk-COW3B62M.mjs

@@ -0,0 +1,214 @@
+"use client";
+import {
+  cn
+} from "./chunk-53MIUPSY.mjs";
+
+// src/components/ui/tabs.tsx
+import * as React from "react";
+import * as TabsPrimitive from "@radix-ui/react-tabs";
+import { cva } from "class-variance-authority";
+var TabsStyleContext = React.createContext({});
+var useTabsStyleContext = () => React.useContext(TabsStyleContext);
+var tabsListVariants = cva(
+  "inline-flex items-center text-text-subtle",
+  {
+    variants: {
+      variant: {
+        line: "border-b border-border bg-transparent gap-0",
+        enclosed: "border-b border-border bg-transparent gap-0",
+        pill: "bg-background-muted p-1 gap-1"
+      },
+      fitted: {
+        true: "w-full",
+        false: ""
+      }
+    },
+    defaultVariants: {
+      variant: "line",
+      fitted: false
+    }
+  }
+);
+var TabsList = React.forwardRef(({ className, variant, size, fitted, color, radius, ...props }, ref) => {
+  const resolvedVariant = variant || "line";
+  return /* @__PURE__ */ React.createElement(TabsStyleContext.Provider, { value: { variant: resolvedVariant, size: size || "default", fitted: fitted ?? false, color: color || "default", radius: radius || "md" } }, /* @__PURE__ */ React.createElement(
+    TabsPrimitive.List,
+    {
+      ref,
+      className: cn(
+        tabsListVariants({ variant, fitted }),
+        resolvedVariant === "pill" && pillListRadiusClasses[radius || "md"],
+        className
+      ),
+      ...props
+    }
+  ));
+});
+TabsList.displayName = "TabsList";
+var tabsTriggerVariants = cva(
+  [
+    "inline-flex items-center justify-center gap-2 whitespace-nowrap",
+    "transition-all duration-micro ease-out cursor-pointer",
+    // Keyboard-only focus ring: see pointer tracking in TabsTrigger
+    "[&:focus-visible:not([data-pointer-focus])]:focus-ring",
+    "disabled:pointer-events-none disabled:text-text-subtle disabled:opacity-50"
+  ].join(" "),
+  {
+    variants: {
+      variant: {
+        line: [
+          "border-b-2 border-transparent -mb-px",
+          "hover:text-foreground hover:border-border",
+          "data-[state=active]:text-foreground data-[state=active]:font-semibold"
+        ].join(" "),
+        enclosed: [
+          "border border-transparent -mb-px",
+          "hover:text-foreground",
+          "data-[state=active]:text-foreground data-[state=active]:font-semibold data-[state=active]:bg-background",
+          "data-[state=active]:border-border data-[state=active]:border-b-background"
+        ].join(" "),
+        pill: [
+          "hover:text-foreground",
+          "data-[state=active]:bg-background data-[state=active]:text-foreground data-[state=active]:font-semibold data-[state=active]:shadow-sm"
+        ].join(" ")
+      },
+      size: {
+        sm: "h-8 text-sm",
+        // 32px, 13px
+        md: "h-9 text-sm",
+        // 36px, 13px
+        default: "h-10 text-md",
+        // 40px, 14px
+        lg: "h-12 text-base"
+        // 48px, 16px
+      },
+      fitted: {
+        true: "flex-1",
+        false: ""
+      }
+    },
+    compoundVariants: [
+      // Padding per variant × size
+      { variant: "line", size: "sm", className: "px-3" },
+      { variant: "line", size: "md", className: "px-3.5" },
+      { variant: "line", size: "default", className: "px-4" },
+      { variant: "line", size: "lg", className: "px-6" },
+      { variant: "enclosed", size: "sm", className: "px-3" },
+      { variant: "enclosed", size: "md", className: "px-3.5" },
+      { variant: "enclosed", size: "default", className: "px-4" },
+      { variant: "enclosed", size: "lg", className: "px-6" },
+      // Pill: reduced height + Segmented-matching font/padding
+      { variant: "pill", size: "sm", className: "h-6 text-xs px-3.5" },
+      { variant: "pill", size: "md", className: "h-7 text-sm px-3.5" },
+      { variant: "pill", size: "default", className: "h-8 text-sm px-4" },
+      { variant: "pill", size: "lg", className: "h-10 text-md px-6" }
+    ],
+    defaultVariants: {
+      variant: "line",
+      size: "default",
+      fitted: false
+    }
+  }
+);
+var triggerIconSizeClasses = {
+  sm: "[&>svg]:icon-xs",
+  // 14px
+  md: "[&>svg]:icon-sm",
+  // 16px
+  default: "[&>svg]:icon-sm",
+  // 16px
+  lg: "[&>svg]:icon-sm"
+  // 16px
+};
+var lineColorClasses = {
+  default: "data-[state=active]:border-foreground",
+  primary: "data-[state=active]:border-primary"
+};
+var enclosedRadiusClasses = {
+  none: "rounded-t-none",
+  sm: "rounded-t-sm",
+  base: "rounded-t",
+  md: "rounded-t-md",
+  lg: "rounded-t-lg",
+  xl: "rounded-t-xl"
+};
+var pillListRadiusClasses = {
+  none: "rounded-none",
+  sm: "rounded-sm",
+  base: "rounded",
+  md: "rounded-md",
+  lg: "rounded-lg",
+  xl: "rounded-xl",
+  "2xl": "rounded-2xl",
+  "3xl": "rounded-3xl",
+  full: "rounded-full"
+};
+var pillItemRadiusClasses = {
+  none: "rounded-none",
+  sm: "rounded-sm",
+  base: "rounded",
+  md: "rounded-md",
+  lg: "rounded-md",
+  xl: "rounded-lg",
+  "2xl": "rounded-xl",
+  "3xl": "rounded-2xl",
+  full: "rounded-full"
+};
+var TabsTrigger = React.forwardRef(({ className, children, onPointerDown, onKeyDown, onBlur, ...props }, ref) => {
+  const { variant, size, fitted, color, radius } = useTabsStyleContext();
+  const resolvedSize = size || "default";
+  const [pointerFocus, setPointerFocus] = React.useState(false);
+  return /* @__PURE__ */ React.createElement(
+    TabsPrimitive.Trigger,
+    {
+      ref,
+      className: cn(
+        tabsTriggerVariants({ variant, size: resolvedSize, fitted }),
+        triggerIconSizeClasses[resolvedSize],
+        variant === "line" && lineColorClasses[color || "default"],
+        variant === "enclosed" && enclosedRadiusClasses[radius || "md"],
+        variant === "pill" && pillItemRadiusClasses[radius || "md"],
+        className
+      ),
+      "data-pointer-focus": pointerFocus ? "" : void 0,
+      onPointerDown: (event) => {
+        setPointerFocus(true);
+        onPointerDown?.(event);
+      },
+      onKeyDown: (event) => {
+        setPointerFocus(false);
+        onKeyDown?.(event);
+      },
+      onBlur: (event) => {
+        setPointerFocus(false);
+        onBlur?.(event);
+      },
+      ...props
+    },
+    children
+  );
+});
+TabsTrigger.displayName = "TabsTrigger";
+var TabsContent = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React.createElement(
+  TabsPrimitive.Content,
+  {
+    ref,
+    className: cn(
+      "mt-4 focus-visible:focus-ring",
+      className
+    ),
+    ...props
+  }
+));
+TabsContent.displayName = "TabsContent";
+var Tabs = TabsPrimitive.Root;
+
+export {
+  tabsListVariants,
+  TabsList,
+  tabsTriggerVariants,
+  TabsTrigger,
+  TabsContent,
+  Tabs
+};
+//# sourceMappingURL=chunk-COW3B62M.mjs.map

package/dist/chunk-COW3B62M.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/ui/tabs.tsx"],"sourcesContent":["'use client'\n\nimport * as React from 'react'\nimport * as TabsPrimitive from '@radix-ui/react-tabs'\nimport { cva, type VariantProps } from 'class-variance-authority'\nimport { cn } from '@/lib/utils'\n\n// Context to pass style props from TabsList to TabsTrigger\ntype TabsStyleContextValue = {\n  variant?: 'line' | 'enclosed' | 'pill'\n  size?: 'sm' | 'md' | 'default' | 'lg'\n  fitted?: boolean\n  color?: 'default' | 'primary'\n  radius?: 'none' | 'sm' | 'base' | 'md' | 'lg' | 'xl' | '2xl' | '3xl' | 'full'\n}\nconst TabsStyleContext = React.createContext<TabsStyleContextValue>({})\nconst useTabsStyleContext = () => React.useContext(TabsStyleContext)\n\n// ─── TabsList ────────────────────────────────────────────────\n\nconst tabsListVariants = cva(\n  'inline-flex items-center text-text-subtle',\n  {\n    variants: {\n      variant: {\n        line: 'border-b border-border bg-transparent gap-0',\n        enclosed: 'border-b border-border bg-transparent gap-0',\n        pill: 'bg-background-muted p-1 gap-1',\n      },\n      fitted: {\n        true: 'w-full',\n        false: '',\n      },\n    },\n    defaultVariants: {\n      variant: 'line',\n      fitted: false,\n    },\n  }\n)\n\nexport interface TabsListProps\n  extends React.ComponentPropsWithoutRef<typeof TabsPrimitive.List>,\n    VariantProps<typeof tabsListVariants> {\n  size?: 'sm' | 'md' | 'default' | 'lg'\n  /** Indicator color for line variant */\n  color?: 'default' | 'primary'\n  /** Top border-radius for enclosed variant, container radius for pill variant */\n  radius?: 'none' | 'sm' | 'base' | 'md' | 'lg' | 'xl' | '2xl' | '3xl' | 'full'\n}\n\nconst TabsList = React.forwardRef<\n  React.ElementRef<typeof TabsPrimitive.List>,\n  TabsListProps\n>(({ className, variant, size, fitted, color, radius, ...props }, ref) => {\n  const resolvedVariant = variant || 'line'\n  return (\n    <TabsStyleContext.Provider value={{ variant: resolvedVariant, size: size || 'default', fitted: fitted ?? false, color: color || 'default', radius: radius || 'md' }}>\n      <TabsPrimitive.List\n        ref={ref}\n        className={cn(\n          tabsListVariants({ variant, fitted }),\n          resolvedVariant === 'pill' && pillListRadiusClasses[radius || 'md'],\n          className\n        )}\n        {...props}\n      />\n    </TabsStyleContext.Provider>\n  )\n})\nTabsList.displayName = 'TabsList'\n\n// ─── TabsTrigger ─────────────────────────────────────────────\n\nconst tabsTriggerVariants = cva(\n  [\n    'inline-flex items-center justify-center gap-2 whitespace-nowrap',\n    'transition-all duration-micro ease-out cursor-pointer',\n    // Keyboard-only focus ring: see pointer tracking in TabsTrigger\n    '[&:focus-visible:not([data-pointer-focus])]:focus-ring',\n    'disabled:pointer-events-none disabled:text-text-subtle disabled:opacity-50',\n  ].join(' '),\n  {\n    variants: {\n      variant: {\n        line: [\n          'border-b-2 border-transparent -mb-px',\n          'hover:text-foreground hover:border-border',\n          'data-[state=active]:text-foreground data-[state=active]:font-semibold',\n        ].join(' '),\n        enclosed: [\n          'border border-transparent -mb-px',\n          'hover:text-foreground',\n          'data-[state=active]:text-foreground data-[state=active]:font-semibold data-[state=active]:bg-background',\n          'data-[state=active]:border-border data-[state=active]:border-b-background',\n        ].join(' '),\n        pill: [\n          'hover:text-foreground',\n          'data-[state=active]:bg-background data-[state=active]:text-foreground data-[state=active]:font-semibold data-[state=active]:shadow-sm',\n        ].join(' '),\n      },\n      size: {\n        sm: 'h-8 text-sm',       // 32px, 13px\n        md: 'h-9 text-sm',       // 36px, 13px\n        default: 'h-10 text-md', // 40px, 14px\n        lg: 'h-12 text-base',    // 48px, 16px\n      },\n      fitted: {\n        true: 'flex-1',\n        false: '',\n      },\n    },\n    compoundVariants: [\n      // Padding per variant × size\n      { variant: 'line', size: 'sm', className: 'px-3' },\n      { variant: 'line', size: 'md', className: 'px-3.5' },\n      { variant: 'line', size: 'default', className: 'px-4' },\n      { variant: 'line', size: 'lg', className: 'px-6' },\n      { variant: 'enclosed', size: 'sm', className: 'px-3' },\n      { variant: 'enclosed', size: 'md', className: 'px-3.5' },\n      { variant: 'enclosed', size: 'default', className: 'px-4' },\n      { variant: 'enclosed', size: 'lg', className: 'px-6' },\n      // Pill: reduced height + Segmented-matching font/padding\n      { variant: 'pill', size: 'sm', className: 'h-6 text-xs px-3.5' },\n      { variant: 'pill', size: 'md', className: 'h-7 text-sm px-3.5' },\n      { variant: 'pill', size: 'default', className: 'h-8 text-sm px-4' },\n      { variant: 'pill', size: 'lg', className: 'h-10 text-md px-6' },\n    ],\n    defaultVariants: {\n      variant: 'line',\n      size: 'default',\n      fitted: false,\n    },\n  }\n)\n\n// Icon size mapping for tabs (same as Button icon+text pattern)\nconst triggerIconSizeClasses = {\n  sm: '[&>svg]:icon-xs',      // 14px\n  md: '[&>svg]:icon-sm',      // 16px\n  default: '[&>svg]:icon-sm', // 16px\n  lg: '[&>svg]:icon-sm',      // 16px\n} as const\n\nexport interface TabsTriggerProps\n  extends React.ComponentPropsWithoutRef<typeof TabsPrimitive.Trigger>,\n    Omit<VariantProps<typeof tabsTriggerVariants>, 'variant' | 'size' | 'fitted'> {}\n\n// Line variant: active indicator color\nconst lineColorClasses = {\n  default: 'data-[state=active]:border-foreground',\n  primary: 'data-[state=active]:border-primary',\n} as const\n\n// Enclosed variant: top border-radius\nconst enclosedRadiusClasses = {\n  none: 'rounded-t-none',\n  sm: 'rounded-t-sm',\n  base: 'rounded-t',\n  md: 'rounded-t-md',\n  lg: 'rounded-t-lg',\n  xl: 'rounded-t-xl',\n} as const\n\n// Pill variant: container radius (applied to TabsList, matches Segmented scale)\nconst pillListRadiusClasses = {\n  none: 'rounded-none',\n  sm: 'rounded-sm',\n  base: 'rounded',\n  md: 'rounded-md',\n  lg: 'rounded-lg',\n  xl: 'rounded-xl',\n  '2xl': 'rounded-2xl',\n  '3xl': 'rounded-3xl',\n  full: 'rounded-full',\n} as const\n\n// Pill variant: item radius (one step smaller than container, matches Segmented item scale)\nconst pillItemRadiusClasses = {\n  none: 'rounded-none',\n  sm: 'rounded-sm',\n  base: 'rounded',\n  md: 'rounded-md',\n  lg: 'rounded-md',\n  xl: 'rounded-lg',\n  '2xl': 'rounded-xl',\n  '3xl': 'rounded-2xl',\n  full: 'rounded-full',\n} as const\n\nconst TabsTrigger = React.forwardRef<\n  React.ElementRef<typeof TabsPrimitive.Trigger>,\n  TabsTriggerProps\n>(({ className, children, onPointerDown, onKeyDown, onBlur, ...props }, ref) => {\n  const { variant, size, fitted, color, radius } = useTabsStyleContext()\n  const resolvedSize = size || 'default'\n  // Radix Tabs 1.2+ calls focus() on mouse down, so :focus-visible matches after any\n  // earlier keyboard input. Mark pointer-initiated focus to keep the ring keyboard-only.\n  const [pointerFocus, setPointerFocus] = React.useState(false)\n\n  return (\n    <TabsPrimitive.Trigger\n      ref={ref}\n      className={cn(\n        tabsTriggerVariants({ variant, size: resolvedSize, fitted }),\n        triggerIconSizeClasses[resolvedSize],\n        variant === 'line' && lineColorClasses[color || 'default'],\n        variant === 'enclosed' && enclosedRadiusClasses[(radius || 'md') as keyof typeof enclosedRadiusClasses],\n        variant === 'pill' && pillItemRadiusClasses[radius || 'md'],\n        className\n      )}\n      data-pointer-focus={pointerFocus ? '' : undefined}\n      onPointerDown={(event) => {\n        setPointerFocus(true)\n        onPointerDown?.(event)\n      }}\n      onKeyDown={(event) => {\n        setPointerFocus(false)\n        onKeyDown?.(event)\n      }}\n      onBlur={(event) => {\n        setPointerFocus(false)\n        onBlur?.(event)\n      }}\n      {...props}\n    >\n      {children}\n    </TabsPrimitive.Trigger>\n  )\n})\nTabsTrigger.displayName = 'TabsTrigger'\n\n// ─── TabsContent ─────────────────────────────────────────────\n\nexport interface TabsContentProps\n  extends React.ComponentPropsWithoutRef<typeof TabsPrimitive.Content> {}\n\nconst TabsContent = React.forwardRef<\n  React.ElementRef<typeof TabsPrimitive.Content>,\n  TabsContentProps\n>(({ className, ...props }, ref) => (\n  <TabsPrimitive.Content\n    ref={ref}\n    className={cn(\n      'mt-4 focus-visible:focus-ring',\n      className\n    )}\n    {...props}\n  />\n))\nTabsContent.displayName = 'TabsContent'\n\n// ─── Tabs (Root) ─────────────────────────────────────────────\n\nconst Tabs = TabsPrimitive.Root\n\nexport {\n  Tabs,\n  TabsList,\n  TabsTrigger,\n  TabsContent,\n  tabsListVariants,\n  tabsTriggerVariants,\n}\n"],"mappings":"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","names":[]}

package/dist/chunk-CTH6SN5Y.mjs

@@ -0,0 +1,114 @@
+"use client";
+import {
+  cn
+} from "./chunk-53MIUPSY.mjs";
+
+// src/components/ui/skeleton.tsx
+import * as React from "react";
+import { cva } from "class-variance-authority";
+var PULSE_DURATION_MS = 2e3;
+var WAVE_DURATION_MS = 1800;
+var WAVE_GRADIENT = [
+  "transparent 0%",
+  "transparent 30%",
+  "var(--color-background-elevated) 50%",
+  "transparent 70%",
+  "transparent 100%"
+].join(", ");
+var MULTI_LINE_WIDTHS = ["100%", "92%", "100%", "85%", "75%"];
+var skeletonVariants = cva(
+  "bg-background-muted",
+  {
+    variants: {
+      variant: {
+        text: "rounded-md h-4 w-full",
+        circular: "rounded-full w-10 h-10",
+        rectangular: "rounded-xl w-full h-24"
+      }
+    },
+    defaultVariants: {
+      variant: "text"
+    }
+  }
+);
+var SkeletonBlock = React.forwardRef(
+  ({
+    className,
+    variant = "text",
+    animation = "pulse",
+    width,
+    height,
+    radius,
+    style,
+    ...props
+  }, ref) => {
+    return /* @__PURE__ */ React.createElement(
+      "div",
+      {
+        ref,
+        "aria-hidden": "true",
+        className: cn(
+          skeletonVariants({ variant }),
+          animation === "pulse" && "animate-skeleton-pulse",
+          animation === "wave" && "relative overflow-hidden",
+          className
+        ),
+        style: {
+          ...style,
+          ...width != null ? { width } : {},
+          ...height != null ? { height } : {},
+          ...radius != null ? { borderRadius: radius } : {},
+          ...animation === "pulse" ? { animationDuration: `${PULSE_DURATION_MS}ms` } : {}
+        },
+        ...props
+      },
+      animation === "wave" && /* @__PURE__ */ React.createElement(
+        "div",
+        {
+          className: "absolute inset-0 animate-skeleton-wave",
+          style: {
+            animationDuration: `${WAVE_DURATION_MS}ms`,
+            background: `linear-gradient(90deg, ${WAVE_GRADIENT})`
+          }
+        }
+      )
+    );
+  }
+);
+SkeletonBlock.displayName = "SkeletonBlock";
+var Skeleton = React.forwardRef(
+  ({
+    count,
+    loading,
+    children,
+    variant = "text",
+    ...rest
+  }, ref) => {
+    if (loading !== void 0) {
+      if (!loading) return /* @__PURE__ */ React.createElement(React.Fragment, null, children);
+    }
+    if (count != null && count > 1 && variant === "text") {
+      return /* @__PURE__ */ React.createElement("div", { ref, className: "space-y-2.5", "aria-hidden": "true" }, Array.from({ length: count }, (_, i) => {
+        const widthPattern = MULTI_LINE_WIDTHS[i % MULTI_LINE_WIDTHS.length];
+        const isLast = i === count - 1;
+        return /* @__PURE__ */ React.createElement(
+          SkeletonBlock,
+          {
+            key: i,
+            variant: "text",
+            style: { width: isLast ? "60%" : widthPattern },
+            ...rest
+          }
+        );
+      }));
+    }
+    return /* @__PURE__ */ React.createElement(SkeletonBlock, { ref, variant, ...rest });
+  }
+);
+Skeleton.displayName = "Skeleton";
+
+export {
+  skeletonVariants,
+  Skeleton
+};
+//# sourceMappingURL=chunk-CTH6SN5Y.mjs.map

package/dist/chunk-CTH6SN5Y.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/ui/skeleton.tsx"],"sourcesContent":["'use client'\n\nimport * as React from 'react'\nimport { cva, type VariantProps } from 'class-variance-authority'\nimport { cn } from '@/lib/utils'\n\n// ============================================================================\n// Constants\n// ============================================================================\n\n/** Pulse animation duration in ms (slower = more premium) */\nconst PULSE_DURATION_MS = 2000\n/** Wave animation duration in ms */\nconst WAVE_DURATION_MS = 1800\n\n/**\n * Wave shimmer gradient — wide sweep with soft edges.\n * 5 gradient stops create a broader, smoother light band.\n */\nconst WAVE_GRADIENT = [\n  'transparent 0%',\n  'transparent 30%',\n  'var(--color-background-elevated) 50%',\n  'transparent 70%',\n  'transparent 100%',\n].join(', ')\n\n/**\n * Multi-line text width pattern.\n * Last line is always shorter for natural appearance.\n */\nconst MULTI_LINE_WIDTHS = ['100%', '92%', '100%', '85%', '75%'] as const\n\n// ============================================================================\n// Variants (CVA)\n// ============================================================================\n\nconst skeletonVariants = cva(\n  'bg-background-muted',\n  {\n    variants: {\n      variant: {\n        text: 'rounded-md h-4 w-full',\n        circular: 'rounded-full w-10 h-10',\n        rectangular: 'rounded-xl w-full h-24',\n      },\n    },\n    defaultVariants: {\n      variant: 'text',\n    },\n  }\n)\n\n// ============================================================================\n// Types\n// ============================================================================\n\nexport interface SkeletonProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    VariantProps<typeof skeletonVariants> {\n  /** Animation style */\n  animation?: 'pulse' | 'wave' | false\n  /** Custom width */\n  width?: string | number\n  /** Custom height */\n  height?: string | number\n  /** Custom border radius */\n  radius?: string | number\n  /** Number of text lines (text variant only, generates stacked lines) */\n  count?: number\n  /** Conditional loading — true: show skeleton, false: render children */\n  loading?: boolean\n  /** Children to render when loading=false */\n  children?: React.ReactNode\n}\n\n// ============================================================================\n// Component\n// ============================================================================\n\nconst SkeletonBlock = React.forwardRef<HTMLDivElement, Omit<SkeletonProps, 'count' | 'loading' | 'children'>>(\n  ({\n    className,\n    variant = 'text',\n    animation = 'pulse',\n    width,\n    height,\n    radius,\n    style,\n    ...props\n  }, ref) => {\n    return (\n      <div\n        ref={ref}\n        aria-hidden=\"true\"\n        className={cn(\n          skeletonVariants({ variant }),\n          animation === 'pulse' && 'animate-skeleton-pulse',\n          animation === 'wave' && 'relative overflow-hidden',\n          className,\n        )}\n        style={{\n          ...style,\n          ...(width != null ? { width } : {}),\n          ...(height != null ? { height } : {}),\n          ...(radius != null ? { borderRadius: radius } : {}),\n          ...(animation === 'pulse' ? { animationDuration: `${PULSE_DURATION_MS}ms` } : {}),\n        }}\n        {...props}\n      >\n        {animation === 'wave' && (\n          <div\n            className=\"absolute inset-0 animate-skeleton-wave\"\n            style={{\n              animationDuration: `${WAVE_DURATION_MS}ms`,\n              background: `linear-gradient(90deg, ${WAVE_GRADIENT})`,\n            }}\n          />\n        )}\n      </div>\n    )\n  }\n)\nSkeletonBlock.displayName = 'SkeletonBlock'\n\nconst Skeleton = React.forwardRef<HTMLDivElement, SkeletonProps>(\n  ({\n    count,\n    loading,\n    children,\n    variant = 'text',\n    ...rest\n  }, ref) => {\n    // loading mode — show skeleton or children\n    if (loading !== undefined) {\n      if (!loading) return <>{children}</>\n      // When loading, fall through to render skeleton\n    }\n\n    // count mode — render multiple text lines\n    if (count != null && count > 1 && variant === 'text') {\n      return (\n        <div ref={ref} className=\"space-y-2.5\" aria-hidden=\"true\">\n          {Array.from({ length: count }, (_, i) => {\n            const widthPattern = MULTI_LINE_WIDTHS[i % MULTI_LINE_WIDTHS.length]\n            const isLast = i === count - 1\n            return (\n              <SkeletonBlock\n                key={i}\n                variant=\"text\"\n                style={{ width: isLast ? '60%' : widthPattern }}\n                {...rest}\n              />\n            )\n          })}\n        </div>\n      )\n    }\n\n    return <SkeletonBlock ref={ref} variant={variant} {...rest} />\n  }\n)\nSkeleton.displayName = 'Skeleton'\n\nexport { Skeleton, skeletonVariants }\n"],"mappings":";;;;;;AAEA,YAAY,WAAW;AACvB,SAAS,WAA8B;AAQvC,IAAM,oBAAoB;AAE1B,IAAM,mBAAmB;AAMzB,IAAM,gBAAgB;AAAA,EACpB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,EAAE,KAAK,IAAI;AAMX,IAAM,oBAAoB,CAAC,QAAQ,OAAO,QAAQ,OAAO,KAAK;AAM9D,IAAM,mBAAmB;AAAA,EACvB;AAAA,EACA;AAAA,IACE,UAAU;AAAA,MACR,SAAS;AAAA,QACP,MAAM;AAAA,QACN,UAAU;AAAA,QACV,aAAa;AAAA,MACf;AAAA,IACF;AAAA,IACA,iBAAiB;AAAA,MACf,SAAS;AAAA,IACX;AAAA,EACF;AACF;AA6BA,IAAM,gBAAsB;AAAA,EAC1B,CAAC;AAAA,IACC;AAAA,IACA,UAAU;AAAA,IACV,YAAY;AAAA,IACZ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL,GAAG,QAAQ;AACT,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,eAAY;AAAA,QACZ,WAAW;AAAA,UACT,iBAAiB,EAAE,QAAQ,CAAC;AAAA,UAC5B,cAAc,WAAW;AAAA,UACzB,cAAc,UAAU;AAAA,UACxB;AAAA,QACF;AAAA,QACA,OAAO;AAAA,UACL,GAAG;AAAA,UACH,GAAI,SAAS,OAAO,EAAE,MAAM,IAAI,CAAC;AAAA,UACjC,GAAI,UAAU,OAAO,EAAE,OAAO,IAAI,CAAC;AAAA,UACnC,GAAI,UAAU,OAAO,EAAE,cAAc,OAAO,IAAI,CAAC;AAAA,UACjD,GAAI,cAAc,UAAU,EAAE,mBAAmB,GAAG,iBAAiB,KAAK,IAAI,CAAC;AAAA,QACjF;AAAA,QACC,GAAG;AAAA;AAAA,MAEH,cAAc,UACb;AAAA,QAAC;AAAA;AAAA,UACC,WAAU;AAAA,UACV,OAAO;AAAA,YACL,mBAAmB,GAAG,gBAAgB;AAAA,YACtC,YAAY,0BAA0B,aAAa;AAAA,UACrD;AAAA;AAAA,MACF;AAAA,IAEJ;AAAA,EAEJ;AACF;AACA,cAAc,cAAc;AAE5B,IAAM,WAAiB;AAAA,EACrB,CAAC;AAAA,IACC;AAAA,IACA;AAAA,IACA;AAAA,IACA,UAAU;AAAA,IACV,GAAG;AAAA,EACL,GAAG,QAAQ;AAET,QAAI,YAAY,QAAW;AACzB,UAAI,CAAC,QAAS,QAAO,0DAAG,QAAS;AAAA,IAEnC;AAGA,QAAI,SAAS,QAAQ,QAAQ,KAAK,YAAY,QAAQ;AACpD,aACE,oCAAC,SAAI,KAAU,WAAU,eAAc,eAAY,UAChD,MAAM,KAAK,EAAE,QAAQ,MAAM,GAAG,CAAC,GAAG,MAAM;AACvC,cAAM,eAAe,kBAAkB,IAAI,kBAAkB,MAAM;AACnE,cAAM,SAAS,MAAM,QAAQ;AAC7B,eACE;AAAA,UAAC;AAAA;AAAA,YACC,KAAK;AAAA,YACL,SAAQ;AAAA,YACR,OAAO,EAAE,OAAO,SAAS,QAAQ,aAAa;AAAA,YAC7C,GAAG;AAAA;AAAA,QACN;AAAA,MAEJ,CAAC,CACH;AAAA,IAEJ;AAEA,WAAO,oCAAC,iBAAc,KAAU,SAAmB,GAAG,MAAM;AAAA,EAC9D;AACF;AACA,SAAS,cAAc;","names":[]}