@devalok/shilp-sutra 0.1.0

package/dist/ui/dropdown-menu.d.ts

@@ -0,0 +1,88 @@
+import * as React from 'react';
+import * as DropdownMenuPrimitive from '@primitives/react-dropdown-menu';
+/**
+ * DropdownMenu compound component — accessible floating menu triggered by a button, with full
+ * keyboard navigation and focus management.
+ *
+ * **Parts (in composition order):**
+ * - `DropdownMenu` — manages open/closed state (this root)
+ * - `DropdownMenuTrigger` — element that opens the menu (use `asChild` to render your own button)
+ * - `DropdownMenuContent` — the floating menu panel (renders in a portal automatically)
+ * - `DropdownMenuItem` — clickable menu item (use `onSelect` for actions)
+ * - `DropdownMenuCheckboxItem` — item with a checkbox indicator
+ * - `DropdownMenuRadioGroup` — wraps radio items for exclusive selection
+ * - `DropdownMenuRadioItem` — item with a radio indicator (must be inside `DropdownMenuRadioGroup`)
+ * - `DropdownMenuSub` — root for a nested submenu
+ * - `DropdownMenuSubTrigger` — item that reveals a submenu on hover/focus
+ * - `DropdownMenuSubContent` — the nested submenu panel
+ * - `DropdownMenuLabel` — non-interactive group label (not selectable)
+ * - `DropdownMenuSeparator` — horizontal divider between sections
+ * - `DropdownMenuShortcut` — right-aligned keyboard shortcut hint text (display only)
+ * - `DropdownMenuGroup` — semantic grouping wrapper (no visual output)
+ * - `DropdownMenuPortal` — low-level portal wrapper (exported for custom positioning; used internally by DropdownMenuContent)
+ *
+ * @compound
+ * @example
+ * // Standard action menu:
+ * <DropdownMenu>
+ *   <DropdownMenuTrigger asChild>
+ *     <Button variant="ghost" size="icon"><IconDotsVertical /></Button>
+ *   </DropdownMenuTrigger>
+ *   <DropdownMenuContent align="end">
+ *     <DropdownMenuLabel>My account</DropdownMenuLabel>
+ *     <DropdownMenuSeparator />
+ *     <DropdownMenuItem>
+ *       <IconUser className="mr-ds-03" />Profile
+ *       <DropdownMenuShortcut>⌘P</DropdownMenuShortcut>
+ *     </DropdownMenuItem>
+ *     <DropdownMenuItem>Settings</DropdownMenuItem>
+ *     <DropdownMenuSeparator />
+ *     <DropdownMenuItem className="text-error">Sign out</DropdownMenuItem>
+ *   </DropdownMenuContent>
+ * </DropdownMenu>
+ *
+ * @example
+ * // Menu with checkbox items and a nested submenu:
+ * <DropdownMenu>
+ *   <DropdownMenuTrigger asChild><Button>View options</Button></DropdownMenuTrigger>
+ *   <DropdownMenuContent>
+ *     <DropdownMenuCheckboxItem checked={showPanel} onCheckedChange={setShowPanel}>
+ *       Show side panel
+ *     </DropdownMenuCheckboxItem>
+ *     <DropdownMenuSeparator />
+ *     <DropdownMenuSub>
+ *       <DropdownMenuSubTrigger>More tools</DropdownMenuSubTrigger>
+ *       <DropdownMenuSubContent>
+ *         <DropdownMenuItem>Export CSV</DropdownMenuItem>
+ *         <DropdownMenuItem>Export PDF</DropdownMenuItem>
+ *       </DropdownMenuSubContent>
+ *     </DropdownMenuSub>
+ *   </DropdownMenuContent>
+ * </DropdownMenu>
+ */
+declare const DropdownMenu: React.FC<DropdownMenuPrimitive.DropdownMenuProps>;
+declare const DropdownMenuTrigger: React.ForwardRefExoticComponent<DropdownMenuPrimitive.DropdownMenuTriggerProps & React.RefAttributes<HTMLButtonElement>>;
+declare const DropdownMenuGroup: React.ForwardRefExoticComponent<DropdownMenuPrimitive.DropdownMenuGroupProps & React.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuPortal: React.FC<DropdownMenuPrimitive.DropdownMenuPortalProps>;
+declare const DropdownMenuSub: React.FC<DropdownMenuPrimitive.DropdownMenuSubProps>;
+declare const DropdownMenuRadioGroup: React.ForwardRefExoticComponent<DropdownMenuPrimitive.DropdownMenuRadioGroupProps & React.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuSubTrigger: React.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuSubTriggerProps & React.RefAttributes<HTMLDivElement>, "ref"> & {
+    inset?: boolean;
+} & React.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuSubContent: React.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuSubContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuContent: React.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuItem: React.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuItemProps & React.RefAttributes<HTMLDivElement>, "ref"> & {
+    inset?: boolean;
+} & React.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuCheckboxItem: React.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuCheckboxItemProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuRadioItem: React.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuRadioItemProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuLabel: React.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuLabelProps & React.RefAttributes<HTMLDivElement>, "ref"> & {
+    inset?: boolean;
+} & React.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuSeparator: React.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuSeparatorProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuShortcut: {
+    ({ className, ...props }: React.HTMLAttributes<HTMLSpanElement>): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuItem, DropdownMenuCheckboxItem, DropdownMenuRadioItem, DropdownMenuLabel, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuGroup, DropdownMenuPortal, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuRadioGroup, };
+//# sourceMappingURL=dropdown-menu.d.ts.map

package/dist/ui/dropdown-menu.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"dropdown-menu.d.ts","sourceRoot":"","sources":["../../src/ui/dropdown-menu.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,qBAAqB,MAAM,iCAAiC,CAAA;AAKxE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2DG;AACH,QAAA,MAAM,YAAY,mDAA6B,CAAA;AAE/C,QAAA,MAAM,mBAAmB,0HAAgC,CAAA;AAEzD,QAAA,MAAM,iBAAiB,qHAA8B,CAAA;AAErD,QAAA,MAAM,kBAAkB,yDAA+B,CAAA;AAEvD,QAAA,MAAM,eAAe,sDAA4B,CAAA;AAEjD,QAAA,MAAM,sBAAsB,0HAAmC,CAAA;AAE/D,QAAA,MAAM,sBAAsB;YAGhB,OAAO;wCAejB,CAAA;AAIF,QAAA,MAAM,sBAAsB,6KAY1B,CAAA;AAIF,QAAA,MAAM,mBAAmB,0KAgBvB,CAAA;AAGF,QAAA,MAAM,gBAAgB;YAGV,OAAO;wCAYjB,CAAA;AAGF,QAAA,MAAM,wBAAwB,+KAoB5B,CAAA;AAIF,QAAA,MAAM,qBAAqB,4KAmBzB,CAAA;AAGF,QAAA,MAAM,iBAAiB;YAGX,OAAO;wCAYjB,CAAA;AAGF,QAAA,MAAM,qBAAqB,4KASzB,CAAA;AAGF,QAAA,MAAM,oBAAoB;8BAGvB,KAAK,CAAC,cAAc,CAAC,eAAe,CAAC;;CAOvC,CAAA;AAGD,OAAO,EACL,YAAY,EACZ,mBAAmB,EACnB,mBAAmB,EACnB,gBAAgB,EAChB,wBAAwB,EACxB,qBAAqB,EACrB,iBAAiB,EACjB,qBAAqB,EACrB,oBAAoB,EACpB,iBAAiB,EACjB,kBAAkB,EAClB,eAAe,EACf,sBAAsB,EACtB,sBAAsB,EACtB,sBAAsB,GACvB,CAAA"}

package/dist/ui/dropdown-menu.js

@@ -0,0 +1,144 @@
+import { jsxs as i, jsx as a } from "react/jsx-runtime";
+import * as r from "react";
+import { Root as g, Group as h, Portal as l, RadioGroup as N, Sub as R, Trigger as D, CheckboxItem as m, ItemIndicator as p, Content as c, Item as u, Label as f, RadioItem as b, Separator as y, SubContent as w, SubTrigger as x } from "../primitives/react-dropdown-menu.js";
+import { IconCheck as I, IconCircle as M, IconChevronRight as v } from "@tabler/icons-react";
+import { cn as d } from "./lib/utils.js";
+const E = g, F = D, H = h, J = l, K = R, O = N, S = r.forwardRef(({ className: e, inset: t, children: o, ...s }, n) => /* @__PURE__ */ i(
+  x,
+  {
+    ref: n,
+    className: d(
+      "flex cursor-default select-none items-center gap-ds-03 rounded-ds-md px-ds-03 py-ds-02b text-ds-md outline-none focus:bg-layer-02 data-[state=open]:bg-layer-02 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0",
+      t && "pl-ds-07",
+      e
+    ),
+    ...s,
+    children: [
+      o,
+      /* @__PURE__ */ a(v, { className: "ml-auto" })
+    ]
+  }
+));
+S.displayName = x.displayName;
+const C = r.forwardRef(({ className: e, ...t }, o) => /* @__PURE__ */ a(
+  w,
+  {
+    ref: o,
+    className: d(
+      "z-dropdown min-w-[8rem] overflow-hidden rounded-ds-lg border border-border bg-layer-01 p-ds-02 text-text-primary shadow-03 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",
+      e
+    ),
+    ...t
+  }
+));
+C.displayName = w.displayName;
+const z = r.forwardRef(({ className: e, sideOffset: t = 4, ...o }, s) => /* @__PURE__ */ a(l, { children: /* @__PURE__ */ a(
+  c,
+  {
+    ref: s,
+    sideOffset: t,
+    className: d(
+      "z-dropdown min-w-[8rem] overflow-hidden rounded-ds-lg border border-border bg-layer-01 p-ds-02 text-text-primary shadow-03",
+      "duration-moderate-01 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",
+      e
+    ),
+    ...o
+  }
+) }));
+z.displayName = c.displayName;
+const k = r.forwardRef(({ className: e, inset: t, ...o }, s) => /* @__PURE__ */ a(
+  u,
+  {
+    ref: s,
+    className: d(
+      "relative flex cursor-default select-none items-center gap-ds-03 rounded-ds-md px-ds-03 py-ds-02b text-ds-md outline-none transition-colors focus:bg-layer-02 focus:text-text-primary data-[disabled]:pointer-events-none data-[disabled]:opacity-[0.38] [&>svg]:size-4 [&>svg]:shrink-0",
+      t && "pl-ds-07",
+      e
+    ),
+    ...o
+  }
+));
+k.displayName = u.displayName;
+const G = r.forwardRef(({ className: e, children: t, checked: o, ...s }, n) => /* @__PURE__ */ i(
+  m,
+  {
+    ref: n,
+    className: d(
+      "relative flex cursor-default select-none items-center rounded-ds-md py-ds-02b pl-ds-07 pr-ds-03 text-ds-md outline-none transition-colors focus:bg-layer-02 focus:text-text-primary data-[disabled]:pointer-events-none data-[disabled]:opacity-[0.38]",
+      e
+    ),
+    checked: o,
+    ...s,
+    children: [
+      /* @__PURE__ */ a("span", { className: "absolute left-ds-03 flex h-ico-sm w-ico-sm items-center justify-center", children: /* @__PURE__ */ a(p, { children: /* @__PURE__ */ a(I, { className: "h-ico-sm w-ico-sm" }) }) }),
+      t
+    ]
+  }
+));
+G.displayName = m.displayName;
+const T = r.forwardRef(({ className: e, children: t, ...o }, s) => /* @__PURE__ */ i(
+  b,
+  {
+    ref: s,
+    className: d(
+      "relative flex cursor-default select-none items-center rounded-ds-md py-ds-02b pl-ds-07 pr-ds-03 text-ds-md outline-none transition-colors focus:bg-layer-02 focus:text-text-primary data-[disabled]:pointer-events-none data-[disabled]:opacity-[0.38]",
+      e
+    ),
+    ...o,
+    children: [
+      /* @__PURE__ */ a("span", { className: "absolute left-ds-03 flex h-ico-sm w-ico-sm items-center justify-center", children: /* @__PURE__ */ a(p, { children: /* @__PURE__ */ a(M, { className: "h-2 w-2 fill-current" }) }) }),
+      t
+    ]
+  }
+));
+T.displayName = b.displayName;
+const j = r.forwardRef(({ className: e, inset: t, ...o }, s) => /* @__PURE__ */ a(
+  f,
+  {
+    ref: s,
+    className: d(
+      "px-ds-03 py-ds-02b text-ds-md font-semibold",
+      t && "pl-ds-07",
+      e
+    ),
+    ...o
+  }
+));
+j.displayName = f.displayName;
+const L = r.forwardRef(({ className: e, ...t }, o) => /* @__PURE__ */ a(
+  y,
+  {
+    ref: o,
+    className: d("-mx-1 my-ds-02 h-px bg-border-subtle", e),
+    ...t
+  }
+));
+L.displayName = y.displayName;
+const P = ({
+  className: e,
+  ...t
+}) => /* @__PURE__ */ a(
+  "span",
+  {
+    className: d("ml-auto text-ds-sm text-text-placeholder", e),
+    ...t
+  }
+);
+P.displayName = "DropdownMenuShortcut";
+export {
+  E as DropdownMenu,
+  G as DropdownMenuCheckboxItem,
+  z as DropdownMenuContent,
+  H as DropdownMenuGroup,
+  k as DropdownMenuItem,
+  j as DropdownMenuLabel,
+  J as DropdownMenuPortal,
+  O as DropdownMenuRadioGroup,
+  T as DropdownMenuRadioItem,
+  L as DropdownMenuSeparator,
+  P as DropdownMenuShortcut,
+  K as DropdownMenuSub,
+  C as DropdownMenuSubContent,
+  S as DropdownMenuSubTrigger,
+  F as DropdownMenuTrigger
+};

package/dist/ui/file-upload.d.ts

@@ -0,0 +1,67 @@
+import * as React from 'react';
+/**
+ * Props for FileUpload — a drag-and-drop file picker with client-side validation (type + size),
+ * an upload progress bar, and a compact inline mode.
+ *
+ * **Two modes:**
+ * - Default: large drop zone with an upload icon, label, and sublabel — good for primary upload areas.
+ * - `compact={true}`: a small inline button with an attachment icon — good for secondary/inline uploads.
+ *
+ * **Validation:** Pass `accept` (MIME or extension) and `maxSize` (bytes). Errors are shown inline.
+ * The `onFiles` callback only fires with valid files — invalid files are rejected with an error message.
+ *
+ * **`onFiles` required:** This is the only required prop. Integrating with a real uploader means
+ * calling your upload API from this callback and driving `uploading` + `progress` externally.
+ *
+ * @example
+ * // Avatar upload with image-only restriction:
+ * <FileUpload
+ *   accept="image/*"
+ *   maxSize={2 * 1024 * 1024}
+ *   onFiles={(files) => uploadAvatar(files[0])}
+ *   label="Upload profile photo"
+ *   sublabel="PNG, JPG up to 2MB"
+ * />
+ *
+ * @example
+ * // Document multi-upload with progress:
+ * <FileUpload
+ *   multiple
+ *   accept=".pdf,.doc,.docx"
+ *   uploading={isUploading}
+ *   progress={uploadPercent}
+ *   onFiles={handleFiles}
+ * />
+ *
+ * @example
+ * // Compact inline attachment button in a comment form:
+ * <FileUpload compact onFiles={(files) => attachFiles(files)} label="Attach files" />
+ * // These are just a few ways — feel free to combine props creatively!
+ */
+export interface FileUploadProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onError'> {
+    /** Accepted file types (e.g., "image/*", ".pdf,.doc") */
+    accept?: string;
+    /** Max file size in bytes (default: 10MB) */
+    maxSize?: number;
+    /** Allow multiple files */
+    multiple?: boolean;
+    /** Currently uploading */
+    uploading?: boolean;
+    /** Upload progress (0-100) */
+    progress?: number;
+    /** Callback when files are selected/dropped */
+    onFiles: (files: File[]) => void;
+    /** Error message to display */
+    error?: string;
+    /** Compact mode (inline button instead of drop zone) */
+    compact?: boolean;
+    /** Disabled */
+    disabled?: boolean;
+    /** Custom label */
+    label?: string;
+    /** Custom sublabel */
+    sublabel?: string;
+}
+declare const FileUpload: React.ForwardRefExoticComponent<FileUploadProps & React.RefAttributes<HTMLDivElement>>;
+export { FileUpload };
+//# sourceMappingURL=file-upload.d.ts.map

package/dist/ui/file-upload.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"file-upload.d.ts","sourceRoot":"","sources":["../../src/ui/file-upload.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAI9B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAsCG;AACH,MAAM,WAAW,eACf,SAAQ,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,SAAS,CAAC;IAC7D,yDAAyD;IACzD,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,6CAA6C;IAC7C,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,2BAA2B;IAC3B,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,0BAA0B;IAC1B,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,8BAA8B;IAC9B,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,+CAA+C;IAC/C,OAAO,EAAE,CAAC,KAAK,EAAE,IAAI,EAAE,KAAK,IAAI,CAAA;IAChC,+BAA+B;IAC/B,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,wDAAwD;IACxD,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,eAAe;IACf,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,mBAAmB;IACnB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,sBAAsB;IACtB,QAAQ,CAAC,EAAE,MAAM,CAAA;CAClB;AAuBD,QAAA,MAAM,UAAU,wFAyRf,CAAA;AAGD,OAAO,EAAE,UAAU,EAAE,CAAA"}

package/dist/ui/file-upload.js

@@ -0,0 +1,226 @@
+import { jsxs as m, jsx as n } from "react/jsx-runtime";
+import * as r from "react";
+import { IconLoader2 as R, IconPaperclip as T, IconUpload as _ } from "@tabler/icons-react";
+import { cn as h } from "./lib/utils.js";
+const S = 10 * 1024 * 1024;
+function V(t, i) {
+  return i.split(",").map((o) => o.trim()).some((o) => o.startsWith(".") ? t.name.toLowerCase().endsWith(o.toLowerCase()) : o.endsWith("/*") ? t.type.startsWith(o.slice(0, o.indexOf("/") + 1)) : t.type === o);
+}
+function $(t) {
+  return t < 1024 ? `${t} B` : t < 1024 * 1024 ? `${(t / 1024).toFixed(1)} KB` : `${(t / (1024 * 1024)).toFixed(1)} MB`;
+}
+const X = r.forwardRef(
+  ({
+    accept: t,
+    maxSize: i = S,
+    multiple: o = !1,
+    uploading: l = !1,
+    progress: k = 0,
+    onFiles: C,
+    error: P,
+    compact: z = !1,
+    disabled: a = !1,
+    className: D,
+    label: p,
+    sublabel: B,
+    ...w
+  }, N) => {
+    const v = r.useRef(null), [I, c] = r.useState(!1), [M, f] = r.useState(
+      null
+    ), x = r.useRef(!1), b = r.useRef(!1), d = P || M, g = r.useCallback(() => {
+      var e;
+      a || l || (e = v.current) == null || e.click();
+    }, [a, l]), u = r.useCallback(
+      (e) => {
+        f(null);
+        for (const s of e) {
+          if (s.size > i) {
+            f(
+              `File "${s.name}" exceeds the maximum size of ${$(i)}`
+            );
+            return;
+          }
+          if (t && !V(s, t)) {
+            f(
+              `File "${s.name}" is not an accepted file type`
+            );
+            return;
+          }
+        }
+        C(e);
+      },
+      [i, t, C]
+    ), A = r.useCallback(
+      (e) => {
+        b.current = !0;
+        const s = e.target.files;
+        !s || s.length === 0 || (u(Array.from(s)), e.target.value = "");
+      },
+      [u]
+    ), F = r.useCallback(() => {
+      x.current = !0, b.current = !1;
+    }, []), E = r.useCallback(() => {
+      x.current && !b.current && t && f("File type is not accepted"), x.current = !1;
+    }, [t]), O = r.useCallback(
+      (e) => {
+        e.preventDefault(), e.stopPropagation(), !a && !l && c(!0);
+      },
+      [a, l]
+    ), U = r.useCallback(
+      (e) => {
+        e.preventDefault(), e.stopPropagation(), !a && !l && c(!0);
+      },
+      [a, l]
+    ), W = r.useCallback(
+      (e) => {
+        e.preventDefault(), e.stopPropagation(), c(!1);
+      },
+      []
+    ), j = r.useCallback(
+      (e) => {
+        if (e.preventDefault(), e.stopPropagation(), c(!1), a || l) return;
+        const s = e.dataTransfer.files;
+        !s || s.length === 0 || u(Array.from(s));
+      },
+      [a, l, u]
+    ), L = p ?? "Drop files here or click to browse", K = B ?? `Max file size: ${$(i)}`, y = r.useId();
+    return z ? /* @__PURE__ */ m("div", { ref: N, className: h("inline-flex flex-col", D), ...w, children: [
+      /* @__PURE__ */ m(
+        "button",
+        {
+          type: "button",
+          onClick: g,
+          disabled: a,
+          className: h(
+            "inline-flex items-center gap-ds-02 rounded-ds-md px-ds-03 py-ds-02",
+            "text-[length:var(--font-size-sm)] font-medium",
+            "border border-border",
+            "bg-field text-text-secondary",
+            "hover:bg-interactive-subtle",
+            "disabled:opacity-[0.38] disabled:cursor-not-allowed",
+            "transition-colors"
+          ),
+          children: [
+            l ? /* @__PURE__ */ n(R, { className: "h-ico-sm w-ico-sm animate-spin" }) : /* @__PURE__ */ n(T, { className: "h-ico-sm w-ico-sm" }),
+            p ?? "Attach files"
+          ]
+        }
+      ),
+      /* @__PURE__ */ n(
+        "input",
+        {
+          ref: v,
+          id: y,
+          type: "file",
+          className: "sr-only",
+          style: { visibility: "hidden" },
+          "aria-hidden": "true",
+          "aria-label": p ?? "Attach files",
+          accept: t,
+          multiple: o,
+          disabled: a,
+          onChange: A,
+          onClick: F,
+          onFocus: E,
+          tabIndex: -1
+        }
+      ),
+      d && /* @__PURE__ */ n(
+        "p",
+        {
+          role: "alert",
+          "aria-live": "polite",
+          className: "mt-ds-02 text-[length:var(--font-size-xs)] text-error",
+          children: d
+        }
+      )
+    ] }) : /* @__PURE__ */ m(
+      "div",
+      {
+        ref: N,
+        ...w,
+        role: "presentation",
+        className: h("flex flex-col", D),
+        "data-drag-active": I ? "true" : void 0,
+        onDragEnter: O,
+        onDragOver: U,
+        onDragLeave: W,
+        onDrop: j,
+        children: [
+          /* @__PURE__ */ m(
+            "div",
+            {
+              role: "button",
+              tabIndex: 0,
+              "aria-disabled": a || void 0,
+              onClick: a ? void 0 : g,
+              onKeyDown: (e) => {
+                !a && (e.key === "Enter" || e.key === " ") && (e.preventDefault(), g());
+              },
+              className: h(
+                "flex flex-col items-center justify-center gap-ds-03 rounded-ds-lg",
+                "border-2 border-dashed p-ds-08",
+                "transition-colors cursor-pointer",
+                "border-border bg-field",
+                I && "border-interactive bg-interactive-subtle",
+                a && "opacity-[0.38] cursor-not-allowed"
+              ),
+              children: [
+                l ? /* @__PURE__ */ n(R, { className: "h-ds-sm w-ds-sm animate-spin text-icon-secondary" }) : /* @__PURE__ */ n(_, { className: "h-ds-sm w-ds-sm text-icon-secondary" }),
+                /* @__PURE__ */ n("span", { id: y + "-label", className: "text-ds-sm text-text-secondary", children: L }),
+                l ? /* @__PURE__ */ n("div", { className: "w-full max-w-xs", children: /* @__PURE__ */ n(
+                  "div",
+                  {
+                    role: "progressbar",
+                    "aria-valuenow": k,
+                    "aria-valuemin": 0,
+                    "aria-valuemax": 100,
+                    className: "h-2 w-full overflow-hidden rounded-ds-full bg-field",
+                    children: /* @__PURE__ */ n(
+                      "div",
+                      {
+                        className: "h-full rounded-ds-full bg-interactive transition-all",
+                        style: { width: `${k}%` }
+                      }
+                    )
+                  }
+                ) }) : /* @__PURE__ */ n("span", { className: "text-[length:var(--font-size-xs)] text-text-tertiary", children: K })
+              ]
+            }
+          ),
+          /* @__PURE__ */ n(
+            "input",
+            {
+              ref: v,
+              id: y,
+              type: "file",
+              className: "sr-only",
+              style: { visibility: "hidden" },
+              "aria-hidden": "true",
+              "aria-label": L,
+              accept: t,
+              multiple: o,
+              disabled: a,
+              onChange: A,
+              onClick: F,
+              onFocus: E,
+              tabIndex: -1
+            }
+          ),
+          d && /* @__PURE__ */ n(
+            "p",
+            {
+              role: "alert",
+              className: "mt-ds-02 text-[length:var(--font-size-xs)] text-error",
+              children: d
+            }
+          )
+        ]
+      }
+    );
+  }
+);
+X.displayName = "FileUpload";
+export {
+  X as FileUpload
+};

package/dist/ui/form.d.ts

@@ -0,0 +1,56 @@
+import * as React from 'react';
+export type FormHelperState = 'helper' | 'error' | 'warning' | 'success';
+type FormFieldContextValue = {
+    state: FormHelperState;
+};
+declare const FormFieldContext: React.Context<FormFieldContextValue>;
+/**
+ * FormField — vertical flex container that provides validation state to children via React context.
+ *
+ * **Accessibility wiring:** The `helperTextId` prop is informational only — it is NOT automatically
+ * propagated to inputs. Use `getFormFieldA11y(id, state)` to wire `aria-describedby` manually.
+ *
+ * @example
+ * const helperTextId = 'email-error'
+ *
+ * <FormField state="error">
+ *   <Label htmlFor="email">Email</Label>
+ *   <Input
+ *     id="email"
+ *     state="error"
+ *     {...getFormFieldA11y(helperTextId, 'error')}
+ *   />
+ *   <FormHelperText id={helperTextId} state="error">
+ *     Please enter a valid email address.
+ *   </FormHelperText>
+ * </FormField>
+ */
+export interface FormFieldProps extends React.HTMLAttributes<HTMLDivElement> {
+    /**
+     * ID that will be placed on the `FormHelperText` element.
+     * Informational only — does NOT auto-wire `aria-describedby`.
+     * Use `getFormFieldA11y(helperTextId, state)` spread onto the Input instead.
+     */
+    helperTextId?: string;
+    /** Current validation state — propagated to child `FormHelperText` via context */
+    state?: FormHelperState;
+}
+declare const FormField: React.ForwardRefExoticComponent<FormFieldProps & React.RefAttributes<HTMLDivElement>>;
+export interface FormHelperTextProps extends React.HTMLAttributes<HTMLParagraphElement> {
+    state?: FormHelperState;
+}
+declare const FormHelperText: React.ForwardRefExoticComponent<FormHelperTextProps & React.RefAttributes<HTMLParagraphElement>>;
+/**
+ * Helper to compute a11y attributes for form inputs.
+ *
+ * @example
+ *   const a11y = getFormFieldA11y('email-error', 'error')
+ *   <Input {...a11y} />
+ *   // => { "aria-describedby": "email-error", "aria-invalid": true }
+ */
+declare function getFormFieldA11y(helperTextId?: string, state?: FormHelperState): {
+    'aria-describedby'?: string;
+    'aria-invalid'?: boolean;
+};
+export { FormField, FormFieldContext, FormHelperText, getFormFieldA11y };
+//# sourceMappingURL=form.d.ts.map

package/dist/ui/form.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"form.d.ts","sourceRoot":"","sources":["../../src/ui/form.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAG9B,MAAM,MAAM,eAAe,GAAG,QAAQ,GAAG,OAAO,GAAG,SAAS,GAAG,SAAS,CAAA;AAExE,KAAK,qBAAqB,GAAG;IAAE,KAAK,EAAE,eAAe,CAAA;CAAE,CAAA;AACvD,QAAA,MAAM,gBAAgB,sCAAkE,CAAA;AAExF;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,MAAM,WAAW,cAAe,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IAC1E;;;;OAIG;IACH,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,kFAAkF;IAClF,KAAK,CAAC,EAAE,eAAe,CAAA;CACxB;AAED,QAAA,MAAM,SAAS,uFAUd,CAAA;AAMD,MAAM,WAAW,mBAAoB,SAAQ,KAAK,CAAC,cAAc,CAAC,oBAAoB,CAAC;IACrF,KAAK,CAAC,EAAE,eAAe,CAAA;CACxB;AASD,QAAA,MAAM,cAAc,kGAcnB,CAAA;AAGD;;;;;;;GAOG;AACH,iBAAS,gBAAgB,CACvB,YAAY,CAAC,EAAE,MAAM,EACrB,KAAK,CAAC,EAAE,eAAe,GACtB;IAAE,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAAC,cAAc,CAAC,EAAE,OAAO,CAAA;CAAE,CAK3D;AAED,OAAO,EAAE,SAAS,EAAE,gBAAgB,EAAE,cAAc,EAAE,gBAAgB,EAAE,CAAA"}

package/dist/ui/form.js

@@ -0,0 +1,46 @@
+import { jsx as l } from "react/jsx-runtime";
+import * as r from "react";
+import { cn as n } from "./lib/utils.js";
+const c = r.createContext({ state: "helper" }), x = r.forwardRef(
+  ({ className: e, helperTextId: t, state: o = "helper", ...s }, a) => /* @__PURE__ */ l(c.Provider, { value: { state: o }, children: /* @__PURE__ */ l(
+    "div",
+    {
+      ref: a,
+      className: n("flex flex-col gap-ds-02", e),
+      ...s
+    }
+  ) })
+);
+x.displayName = "FormField";
+const d = {
+  helper: "text-text-helper",
+  error: "text-text-error",
+  warning: "text-text-warning",
+  success: "text-text-success"
+}, m = r.forwardRef(
+  ({ className: e, state: t, ...o }, s) => {
+    const a = r.useContext(c), i = t ?? a.state;
+    return /* @__PURE__ */ l(
+      "p",
+      {
+        ref: s,
+        role: i === "error" ? "alert" : void 0,
+        className: n("text-ds-sm", d[i], e),
+        ...o
+      }
+    );
+  }
+);
+m.displayName = "FormHelperText";
+function F(e, t) {
+  return {
+    ...e ? { "aria-describedby": e } : {},
+    ...t === "error" ? { "aria-invalid": !0 } : {}
+  };
+}
+export {
+  x as FormField,
+  c as FormFieldContext,
+  m as FormHelperText,
+  F as getFormFieldA11y
+};

package/dist/ui/hover-card.d.ts

@@ -0,0 +1,7 @@
+import * as React from 'react';
+import * as HoverCardPrimitive from '@primitives/react-hover-card';
+declare const HoverCard: React.FC<HoverCardPrimitive.HoverCardProps>;
+declare const HoverCardTrigger: React.ForwardRefExoticComponent<HoverCardPrimitive.HoverCardTriggerProps & React.RefAttributes<HTMLAnchorElement>>;
+declare const HoverCardContent: React.ForwardRefExoticComponent<Omit<HoverCardPrimitive.HoverCardContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export { HoverCard, HoverCardTrigger, HoverCardContent };
+//# sourceMappingURL=hover-card.d.ts.map

package/dist/ui/hover-card.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"hover-card.d.ts","sourceRoot":"","sources":["../../src/ui/hover-card.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,kBAAkB,MAAM,8BAA8B,CAAA;AAIlE,QAAA,MAAM,SAAS,6CAA0B,CAAA;AAEzC,QAAA,MAAM,gBAAgB,oHAA6B,CAAA;AAEnD,QAAA,MAAM,gBAAgB,oKAgBpB,CAAA;AAGF,OAAO,EAAE,SAAS,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,CAAA"}