impact-nova 2.0.9 → 2.1.0-alpha.10

package/dist/components/forms/date-picker/week-range-picker.js

@@ -0,0 +1,248 @@
+import { jsx as a, jsxs as S } from "react/jsx-runtime";
+import * as f from "react";
+import { Cross as Pe, CalendarMonth as We } from "impact-nova-icons";
+import { format as l, isValid as E, parse as P } from "date-fns";
+import { cn as A, padValidDateString as U, maskDate as X } from "../../../lib/utils.js";
+import { useFieldChrome as Ie } from "../../../lib/primitives/use-field-chrome.js";
+import { Popover as ve, PopoverAnchor as Ne, PopoverContent as Ve } from "../../feedback/popover/popover.js";
+import { Calendar as Ae } from "../../data-display/calendar/calendar.js";
+import { buildDateBoundsMatcher as Te } from "../../../lib/date-bounds-matcher.js";
+import { Tooltip as Z, TooltipTrigger as _, TooltipContent as $ } from "../../feedback/tooltip/tooltip.js";
+import { resolveWeekSelection as je } from "../../../lib/fiscal-calendar.js";
+import { useImpactNovaI18n as Le } from "../../../i18n/use-impact-nova-i18n.js";
+import { getDateFnsLocale as Me } from "../../../i18n/getDateFnsLocale.js";
+import { coerceWeekRangeApply as Be, isWeekRangeSelection as Ke } from "./calendar-selection-adapters.js";
+const i = (e) => e?.from ? e.to ? e.to.endDate : e.from.endDate : void 0, I = (e) => e?.from ? { from: e.from, to: e.to } : void 0, ze = f.forwardRef(
+  ({
+    value: e,
+    onChange: D,
+    format: n = "MM/dd/yyyy",
+    placeholder: Y,
+    minDate: F,
+    maxDate: ee,
+    startMonth: te,
+    endMonth: ne,
+    showFooter: b = !0,
+    calendarType: T = "calendar",
+    fiscalMode: j = "basic",
+    selectionMode: L = "week",
+    fiscalMonthPattern: M,
+    fiscalYearStartMonth: B = 1,
+    weekStartsOn: K = 1,
+    disabled: c,
+    className: oe,
+    error: re,
+    isError: le,
+    size: z,
+    label: se,
+    helperText: ce,
+    helperTextPosition: ae = "absolute",
+    required: ie,
+    prefix: Oe,
+    prefixClick: He,
+    ...de
+  }, fe) => {
+    const O = re ?? le, pe = Ie({
+      label: se,
+      helperText: ce,
+      helperTextPosition: ae,
+      error: O,
+      required: ie,
+      disabled: c ?? void 0,
+      rootClassName: "w-full min-w-[240px]"
+    }), { locale: H, t: x } = Le(), o = f.useMemo(() => Me(H), [H]), q = Y ?? x("datePicker.selectWeekRange"), G = f.useRef(null), me = f.useRef(null);
+    f.useImperativeHandle(fe, () => G.current);
+    const [s, p] = f.useState(!1), W = f.useRef(!1), [w, m] = f.useState(e), [R, u] = f.useState(e?.from ? l(e.from.startDate, n, { locale: o }) : ""), [C, h] = f.useState(i(e) ? l(i(e), n, { locale: o }) : ""), [ue, N] = f.useState(e?.from?.startDate || /* @__PURE__ */ new Date());
+    f.useEffect(() => {
+      s || (u(e?.from ? l(e.from.startDate, n, { locale: o }) : ""), h(i(e) ? l(i(e), n, { locale: o }) : ""), m(e));
+    }, [e, n, s, o]), f.useEffect(() => {
+      s && (m(e), u(e?.from ? l(e.from.startDate, n, { locale: o }) : ""), h(i(e) ? l(i(e), n, { locale: o }) : ""), N(e?.from?.startDate || /* @__PURE__ */ new Date()));
+    }, [s, e, n, o]);
+    const he = (t) => {
+      const r = Ke(t) ? t : void 0;
+      m(r), r?.from ? (u(l(r.from.startDate, n, { locale: o })), h(l(i(r), n, { locale: o }))) : (u(""), h("")), !b && r?.from && r?.to && r.from.startDate.getTime() !== r.to.startDate.getTime() && (D?.(r), p(!1));
+    }, ge = (t) => {
+      const r = Be(t, I(w));
+      D?.(r), p(!1);
+    }, V = () => {
+      m(e), u(e?.from ? l(e.from.startDate, n, { locale: o }) : ""), h(i(e) ? l(i(e), n, { locale: o }) : ""), p(!1);
+    }, J = () => {
+      m(void 0), u(""), h(""), D?.(void 0), b || p(!1);
+    }, v = (t) => je(t, {
+      calendarType: T,
+      fiscalMode: j,
+      selectionMode: L,
+      fiscalMonthPattern: M,
+      fiscalYearStartMonth: B,
+      weekStartsOn: K
+    }), ke = (t) => {
+      const r = t.target.value, d = X(r, n, R);
+      if (u(d), d === "") {
+        const k = { to: w?.to };
+        m(k), b || D?.(void 0);
+        return;
+      }
+      const g = P(d, n, /* @__PURE__ */ new Date(), { locale: o });
+      if (E(g) && d.length === n.length) {
+        const y = { from: v(g), to: w?.to };
+        m(y), h(l(i(y), n, { locale: o })), b || D?.(I(y));
+      }
+    }, De = (t) => {
+      const r = t.target.value, d = X(r, n, C);
+      if (h(d), d === "") {
+        const k = { from: w?.from };
+        m(k), b || D?.(I(k));
+        return;
+      }
+      const g = P(d, n, /* @__PURE__ */ new Date(), { locale: o });
+      if (E(g) && d.length === n.length) {
+        const k = v(g), y = { from: w?.from, to: k };
+        m(y), w?.from && u(l(w.from.startDate, n, { locale: o })), g && N(g), b || D?.(I(y));
+      }
+    }, Q = () => {
+      if (s) return;
+      const t = U(R, n), r = U(C, n), d = P(t, n, /* @__PURE__ */ new Date(), { locale: o }), g = P(r, n, /* @__PURE__ */ new Date(), { locale: o }), k = E(d) && t.length === n.length, y = E(g) && r.length === n.length;
+      if (!k || !y)
+        u(e?.from ? l(e.from.startDate, n, { locale: o }) : ""), h(i(e) ? l(i(e), n, { locale: o }) : ""), m(e);
+      else if (u(t), h(r), !b) {
+        const Se = v(d), Ee = v(g);
+        D?.({ from: Se, to: Ee });
+      }
+    }, be = e?.from ? l(e.from.startDate, n, { locale: o }) : "", we = i(e) ? l(i(e), n, { locale: o }) : "", ye = be !== R, xe = we !== C, Re = R.length === n.length && !E(P(R, n, /* @__PURE__ */ new Date(), { locale: o })), Ce = C.length === n.length && !E(P(C, n, /* @__PURE__ */ new Date(), { locale: o }));
+    return /* @__PURE__ */ a("div", { "data-component": "week-range-picker", "data-disabled": c || void 0, children: pe.wrapControl(
+      /* @__PURE__ */ S(ve, { open: c ? !1 : s, onOpenChange: (t) => {
+        c || p(t);
+      }, children: [
+        /* @__PURE__ */ a(Ne, { asChild: !0, children: /* @__PURE__ */ S(
+          "div",
+          {
+            "data-state": s ? "open" : "closed",
+            className: A(
+              "flex w-full items-center justify-between gap-2 rounded-md border bg-canvas-elevated px-3 text-sm shadow-sm transition-colors hover:border-brand disabled:cursor-not-allowed disabled:bg-disabled-surface disabled:text-disabled-foreground disabled:border-stroke",
+              O ? "border-destructive hover:border-destructive" : "border-field",
+              z === "sm" ? "h-6" : z === "md" ? "h-[28px]" : "h-8",
+              c && "pointer-events-none opacity-100 bg-disabled-surface border-stroke text-disabled-foreground hover:border-stroke",
+              "cursor-pointer",
+              oe
+            ),
+            children: [
+              /* @__PURE__ */ S("div", { className: "flex items-center gap-4 flex-1 min-w-0", children: [
+                /* @__PURE__ */ a(
+                  "input",
+                  {
+                    ref: G,
+                    type: "text",
+                    value: R,
+                    onChange: ke,
+                    onBlur: Q,
+                    onClick: () => !c && p(!0),
+                    onKeyDown: (t) => {
+                      (t.key === "Enter" || t.key === "ArrowDown") && !s && !c && (t.preventDefault(), W.current = !0, p(!0)), t.key === "Escape" && s && (t.preventDefault(), V());
+                    },
+                    placeholder: s ? n : q,
+                    disabled: !!c,
+                    "aria-label": "Start Date",
+                    "data-field": "start",
+                    className: A(
+                      "flex-1 min-w-0 bg-transparent p-0 text-sm font-medium outline-none placeholder:font-medium placeholder:text-content-empty disabled:cursor-not-allowed disabled:opacity-50",
+                      Re ? "text-destructive" : ye ? "text-content-placeholder" : ""
+                    ),
+                    ...de
+                  }
+                ),
+                /* @__PURE__ */ a(
+                  "input",
+                  {
+                    ref: me,
+                    type: "text",
+                    value: C,
+                    onChange: De,
+                    onBlur: Q,
+                    onClick: () => !c && p(!0),
+                    onKeyDown: (t) => {
+                      (t.key === "Enter" || t.key === "ArrowDown") && !s && !c && (t.preventDefault(), W.current = !0, p(!0)), t.key === "Escape" && s && (t.preventDefault(), V());
+                    },
+                    placeholder: s ? n : q,
+                    disabled: !!c,
+                    "aria-label": "End Date",
+                    "data-field": "end",
+                    className: A(
+                      "flex-1 min-w-0 bg-transparent p-0 text-sm font-medium outline-none placeholder:font-medium placeholder:text-content-empty disabled:cursor-not-allowed disabled:opacity-50",
+                      Ce ? "text-destructive" : xe ? "text-content-placeholder" : ""
+                    )
+                  }
+                )
+              ] }),
+              /* @__PURE__ */ S("div", { className: "flex items-center gap-1 shrink-0", children: [
+                e?.from && !c && /* @__PURE__ */ S(Z, { children: [
+                  /* @__PURE__ */ a(_, { asChild: !0, children: /* @__PURE__ */ a(
+                    "button",
+                    {
+                      type: "button",
+                      tabIndex: 0,
+                      "aria-label": x("calendar.clear"),
+                      onClick: (t) => {
+                        t.stopPropagation(), J();
+                      },
+                      className: "inline-flex size-4 items-center justify-center bg-transparent border-none p-0 cursor-pointer",
+                      children: /* @__PURE__ */ a(Pe, { className: "size-3 hover:text-content text-content-icon" })
+                    }
+                  ) }),
+                  /* @__PURE__ */ a($, { variant: "tertiary", side: "top", children: x("calendar.clear") })
+                ] }),
+                /* @__PURE__ */ S(Z, { children: [
+                  /* @__PURE__ */ a(_, { asChild: !0, children: /* @__PURE__ */ a("button", { type: "button", tabIndex: 0, "aria-label": x("datePicker.selectWeekRange"), onClick: (t) => {
+                    t.stopPropagation(), c || p(!s);
+                  }, onKeyDown: (t) => {
+                    (t.key === "Enter" || t.key === " ") && (t.preventDefault(), t.stopPropagation(), c || (W.current = !0, p(!s)));
+                  }, className: "inline-flex items-center justify-center bg-transparent border-none p-0 cursor-pointer", children: /* @__PURE__ */ a(We, { className: "h-4 w-4 text-secondary-foreground" }) }) }),
+                  /* @__PURE__ */ a($, { variant: "tertiary", side: "top", children: x("datePicker.selectWeekRange") })
+                ] })
+              ] })
+            ]
+          }
+        ) }),
+        /* @__PURE__ */ a(
+          Ve,
+          {
+            className: "w-auto p-0",
+            align: "start",
+            "aria-label": x("datePicker.selectWeekRange"),
+            onOpenAutoFocus: (t) => {
+              W.current || t.preventDefault(), W.current = !1;
+            },
+            children: /* @__PURE__ */ a(
+              Ae,
+              {
+                pickerType: "week",
+                weekMode: "range",
+                selectedWeeks: I(w),
+                onWeekSelect: he,
+                month: ue,
+                onMonthChange: N,
+                disabled: Te(F, ee),
+                startMonth: te,
+                endMonth: ne,
+                showFooter: b,
+                calendarType: T,
+                fiscalMode: j,
+                selectionMode: L,
+                fiscalMonthPattern: M,
+                fiscalYearStartMonth: B,
+                weekStartsOn: K,
+                onApply: ge,
+                onCancel: V,
+                onClear: J,
+                captionLayout: "dropdown"
+              }
+            )
+          }
+        )
+      ] })
+    ) });
+  }
+);
+ze.displayName = "WeekRangePicker";
+export {
+  ze as WeekRangePicker
+};

package/dist/components/forms/file-upload/file-upload.d.ts

@@ -0,0 +1,13 @@
+import { FileUploadProps, FileUploadDropZoneProps, FileUploadItemProps } from './file-upload.types';
+import * as React from "react";
+declare const FileUpload: React.ForwardRefExoticComponent<FileUploadProps & React.RefAttributes<HTMLDivElement>>;
+declare const FileUploadContent: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+declare const FileUploadHeader: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+declare const FileUploadTitle: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLHeadingElement> & React.RefAttributes<HTMLHeadingElement>>;
+declare const FileUploadDescription: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLParagraphElement> & React.RefAttributes<HTMLParagraphElement>>;
+declare const FileUploadClose: React.ForwardRefExoticComponent<React.ButtonHTMLAttributes<HTMLButtonElement> & React.RefAttributes<HTMLButtonElement>>;
+declare const FileUploadDropZone: React.ForwardRefExoticComponent<FileUploadDropZoneProps & React.RefAttributes<HTMLDivElement>>;
+declare const FileUploadList: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+declare const FileUploadItem: React.ForwardRefExoticComponent<FileUploadItemProps & React.RefAttributes<HTMLDivElement>>;
+declare const FileUploadFooter: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+export { FileUpload, FileUploadContent, FileUploadHeader, FileUploadTitle, FileUploadDescription, FileUploadClose, FileUploadDropZone, FileUploadList, FileUploadItem, FileUploadFooter, };

package/dist/components/forms/file-upload/file-upload.js

@@ -0,0 +1,414 @@
+import { jsx as e, jsxs as c, Fragment as K } from "react/jsx-runtime";
+import * as g from "react";
+import { createComponent as j } from "../../../lib/primitives/create-component.js";
+import { createCompoundPart as A } from "../../../lib/primitives/create-compound.js";
+import { cn as y } from "../../../lib/utils.js";
+import { Cross as P, Delete as Y, Reset as _, Download as q, Document as H } from "impact-nova-icons";
+import { FileUploadError as J, FileUpload as Q, ExcelErrorIcon as V, Text as W, Csv as X, Excel as ee } from "../../ui/local-raster-icons/rasterIcons.js";
+import { Tooltip as z, TooltipTrigger as D, TooltipContent as T } from "../../feedback/tooltip/tooltip.js";
+import { useImpactNovaI18n as M } from "../../../i18n/use-impact-nova-i18n.js";
+import { Progress as te } from "../../primitives/progress/progress.js";
+import { Show as f } from "../../ui/show.js";
+function Z(i, l) {
+  const r = i.name.split(".").pop()?.toLowerCase();
+  return !!(r && l.includes(r));
+}
+const $ = g.createContext(void 0), le = [], G = () => {
+  const i = g.useContext($);
+  if (!i)
+    throw new Error("useFileUpload must be used within a FileUpload component");
+  return i;
+}, ue = j(
+  "FileUpload",
+  ({
+    className: i,
+    children: l,
+    onFilesChange: r,
+    maxFiles: p = 1,
+    accept: d = [],
+    disabled: u = !1,
+    value: h = le,
+    ...b
+  }, m) => {
+    const [U, s] = g.useState(h);
+    g.useEffect(() => {
+      s(h);
+    }, [h]);
+    const x = (t) => {
+      if (u) return;
+      let o = t;
+      if (d.length > 0 && (o = o.filter(
+        (N) => Z(N, d)
+      )), o.length === 0) return;
+      const F = p - U.length;
+      if (F <= 0) return;
+      const C = o.slice(0, F);
+      if (C.length > 0) {
+        const N = [...U, ...C];
+        s(N), r?.(N);
+      }
+    }, w = (t) => {
+      if (u) return;
+      const o = U.filter((F) => F !== t);
+      s(o), r?.(o);
+    };
+    return /* @__PURE__ */ e(
+      $.Provider,
+      {
+        value: { files: U, addFiles: x, removeFile: w, maxFiles: p, accept: d, disabled: u },
+        children: /* @__PURE__ */ e(
+          "div",
+          {
+            ref: m,
+            className: y("w-full max-w-[550px]", i),
+            "data-component": "file-upload",
+            "data-disabled": u || void 0,
+            ...b,
+            children: l
+          }
+        )
+      }
+    );
+  }
+), he = A("file-upload", {
+  part: "content",
+  displayName: "FileUploadContent",
+  className: "flex flex-col gap-4 p-4 min-h-[274px] bg-canvas-elevated rounded-2xl shadow-elevation-header"
+}), me = j("FileUploadHeader", ({ className: i, children: l, ...r }, p) => /* @__PURE__ */ e(
+  "div",
+  {
+    ref: p,
+    className: y("flex justify-between items-center w-full", i),
+    ...r,
+    children: /* @__PURE__ */ e("div", { className: "flex flex-col gap-[2px] w-full", children: l })
+  }
+)), xe = j("FileUploadTitle", ({ className: i, children: l, ...r }, p) => /* @__PURE__ */ e(
+  "h3",
+  {
+    ref: p,
+    className: y("text-base font-extrabold text-content leading-6", i),
+    ...r,
+    children: l
+  }
+)), ve = j("FileUploadDescription", ({ className: i, children: l, ...r }, p) => /* @__PURE__ */ e(
+  "p",
+  {
+    ref: p,
+    className: y(
+      "text-sm font-medium text-navigation-muted leading-5",
+      i
+    ),
+    ...r,
+    children: l
+  }
+)), ge = j("FileUploadClose", ({ className: i, ...l }, r) => {
+  const { t: p } = M(), d = p("aria.close");
+  return /* @__PURE__ */ c(z, { children: [
+    /* @__PURE__ */ e(D, { asChild: !0, children: /* @__PURE__ */ e(
+      "button",
+      {
+        ref: r,
+        className: y(
+          "text-content-tertiary hover:text-content transition-colors",
+          i
+        ),
+        type: "button",
+        "aria-label": d,
+        ...l,
+        children: /* @__PURE__ */ e(P, { size: 16 })
+      }
+    ) }),
+    /* @__PURE__ */ e(T, { side: "top", variant: "tertiary", children: d })
+  ] });
+}), be = g.forwardRef(({ className: i, label: l, subLabel: r, ...p }, d) => {
+  const { t: u } = M(), { addFiles: h, accept: b, disabled: m, files: U, maxFiles: s } = G(), [x, w] = g.useState(!1), [t, o] = g.useState(!1), F = g.useRef(null);
+  if (U.length >= s)
+    return null;
+  const C = (n) => {
+    if (!(m || n.length === 0)) {
+      if (b.length > 0) {
+        const a = n.filter(
+          (R) => Z(R, b)
+        ), v = a.length < n.length;
+        if (a.length === 0) {
+          o(!0);
+          return;
+        }
+        o(v), h(a);
+        return;
+      }
+      o(!1), h(n);
+    }
+  }, N = (n) => {
+    n.preventDefault(), m || (w(!0), o(!1));
+  }, k = (n) => {
+    n.preventDefault(), !n.currentTarget.contains(n.relatedTarget) && w(!1);
+  }, B = (n) => {
+    n.preventDefault(), w(!1), !m && n.dataTransfer.files?.length && C(Array.from(n.dataTransfer.files));
+  }, L = () => {
+    m || (o(!1), F.current?.click());
+  }, S = (n) => {
+    n.target.files?.length && (h(Array.from(n.target.files)), n.target.value = "");
+  }, I = b.length > 0 ? b.map((n) => `.${n}`).join(",") : void 0, E = x ? "drag-over" : t ? "invalid-type" : "idle";
+  return /* @__PURE__ */ c(
+    "div",
+    {
+      ref: d,
+      onClick: L,
+      onDragOver: N,
+      onDragLeave: k,
+      onDrop: B,
+      className: y(
+        "relative flex flex-col items-center p-4 pt-6 pb-6 gap-2 h-[148px] cursor-pointer transition-colors",
+        x && "justify-center rounded-lg border border-solid border-brand shadow-file-upload-drag bg-file-upload-drag",
+        !x && t && "justify-end rounded-2xl border border-solid border-destructive shadow-file-upload-error bg-file-upload-error",
+        !x && !t && "justify-end rounded-lg border border-dashed border-stroke-accent bg-transparent",
+        m && "opacity-50 cursor-not-allowed",
+        i
+      ),
+      "data-component": "file-upload-dropzone",
+      "data-state": E,
+      ...p,
+      children: [
+        /* @__PURE__ */ e(
+          "input",
+          {
+            ref: F,
+            type: "file",
+            multiple: s > 1,
+            className: "hidden",
+            accept: I,
+            onChange: S,
+            disabled: m
+          }
+        ),
+        /* @__PURE__ */ e(f, { when: x, children: /* @__PURE__ */ e("p", { className: "absolute inset-0 flex items-center justify-center text-center text-sm font-bold leading-[21px] text-content z-10 pointer-events-none", children: u("fileUpload.dropInProgress") }) }),
+        /* @__PURE__ */ c(f, { when: !x, children: [
+          /* @__PURE__ */ c("div", { className: "absolute top-[24px] left-1/2 -translate-x-1/2 pointer-events-none size-14", children: [
+            /* @__PURE__ */ e(f, { when: t, children: /* @__PURE__ */ e(J, { size: 56 }) }),
+            /* @__PURE__ */ e(f, { when: !t, children: /* @__PURE__ */ e(Q, { size: 56 }) })
+          ] }),
+          /* @__PURE__ */ c("div", { className: "text-center space-y-1 z-10 mt-auto", children: [
+            /* @__PURE__ */ c(
+              "p",
+              {
+                className: y(
+                  "text-sm font-medium leading-5",
+                  t && "text-destructive",
+                  !t && "text-content"
+                ),
+                ...t ? { role: "alert", "aria-live": "assertive" } : {},
+                children: [
+                  /* @__PURE__ */ c(f, { when: t, children: [
+                    u("fileUpload.fileTypeNotSupported"),
+                    " ",
+                    /* @__PURE__ */ e("span", { className: "text-brand text-sm font-medium hover:underline", children: u("fileUpload.chooseFile") })
+                  ] }),
+                  /* @__PURE__ */ e(f, { when: !t, children: l || /* @__PURE__ */ c(K, { children: [
+                    u("fileUpload.dragDropLabel"),
+                    " ",
+                    /* @__PURE__ */ e("span", { className: "text-brand text-sm font-medium hover:underline", children: u("fileUpload.chooseFile") })
+                  ] }) })
+                ]
+              }
+            ),
+            /* @__PURE__ */ e(f, { when: !!r, children: /* @__PURE__ */ e("p", { className: "text-xs font-medium text-navigation-muted", children: r }) })
+          ] })
+        ] })
+      ]
+    }
+  );
+}), we = A("file-upload", {
+  part: "list",
+  displayName: "FileUploadList",
+  className: "flex flex-col gap-3"
+}), Fe = g.forwardRef(
+  ({
+    className: i,
+    file: l,
+    onRemove: r,
+    onClick: p,
+    loadingProgress: d,
+    errorMessage: u,
+    onReset: h,
+    onDownload: b,
+    ...m
+  }, U) => {
+    const { t: s } = M(), { removeFile: x, disabled: w } = G(), t = !!d, o = !!u, F = !w && !t && o && !!h, C = !w && !t && !o && !!b, N = (a) => {
+      a.stopPropagation(), r ? r() : x(l);
+    }, k = (a) => {
+      a.stopPropagation(), d?.onAbort?.();
+    }, B = (a) => {
+      a.stopPropagation(), h?.();
+    }, L = (a) => {
+      a.stopPropagation(), b?.();
+    }, S = (a) => {
+      if (a === 0) return "0 B";
+      const v = 1024, R = ["B", "KB", "MB", "GB"], O = Math.floor(Math.log(a) / Math.log(v));
+      return parseFloat((a / Math.pow(v, O)).toFixed(2)) + " " + R[O];
+    }, I = g.useMemo(() => {
+      if (!d) return null;
+      const a = Math.round(d.value), v = d.timeRemainingSeconds;
+      return v == null ? s("fileUpload.progressPercent", { percent: a }) : s(
+        v === 1 ? "fileUpload.progressTimeRemainingSingular" : "fileUpload.progressTimeRemaining",
+        { percent: a, count: v }
+      );
+    }, [d, s]), E = (a) => {
+      switch (a.split(".").pop()?.toLowerCase()) {
+        case "xls":
+        case "xlsx":
+          return /* @__PURE__ */ e(ee, { size: 36 });
+        case "csv":
+          return /* @__PURE__ */ e(X, { size: 36 });
+        case "txt":
+          return /* @__PURE__ */ e(W, { size: 36 });
+        default:
+          return /* @__PURE__ */ e(H, { size: 36, className: "text-content-icon" });
+      }
+    }, n = (a) => {
+      switch (a.split(".").pop()?.toLowerCase()) {
+        case "xls":
+        case "xlsx":
+          return /* @__PURE__ */ e(V, { size: 36 });
+        default:
+          return /* @__PURE__ */ e(H, { size: 36 });
+      }
+    };
+    return /* @__PURE__ */ e(
+      "div",
+      {
+        ref: U,
+        onClick: p,
+        className: y(
+          "flex flex-col justify-between items-stretch gap-2 p-4 border border-stroke-hairline rounded-xl bg-canvas-elevated",
+          p && "cursor-pointer",
+          i
+        ),
+        "data-component": "file-upload-item",
+        "data-file-name": l.name,
+        "data-file-size": l.size,
+        "data-loading": t || void 0,
+        ...m,
+        children: /* @__PURE__ */ c("div", { className: "flex justify-between items-center gap-2 z-10", children: [
+          /* @__PURE__ */ c("div", { className: "flex gap-2 min-w-0 flex-1", children: [
+            /* @__PURE__ */ e("div", { className: "w-9 h-9 shrink-0", children: o ? n(l.name) : E(l.name) }),
+            /* @__PURE__ */ c("div", { className: "flex flex-col justify-between gap-[2px] min-w-0 flex-1", children: [
+              /* @__PURE__ */ c(z, { children: [
+                /* @__PURE__ */ e(D, { asChild: !0, children: /* @__PURE__ */ e(
+                  "span",
+                  {
+                    className: y(
+                      "text-xs font-bold leading-[18px] line-clamp-1 break-all cursor-default",
+                      o ? "text-content-icon" : "text-content"
+                    ),
+                    children: l.name
+                  }
+                ) }),
+                /* @__PURE__ */ e(T, { side: "top", variant: "tertiary", children: l.name })
+              ] }),
+              /* @__PURE__ */ e(f, { when: t, children: /* @__PURE__ */ c("div", { className: "flex flex-col gap-1 w-full min-w-0", children: [
+                /* @__PURE__ */ e(
+                  te,
+                  {
+                    value: d?.value ?? 0,
+                    label: !1,
+                    className: "h-1.5"
+                  }
+                ),
+                /* @__PURE__ */ e(f, { when: !!I, children: /* @__PURE__ */ e(
+                  "span",
+                  {
+                    className: "text-xs font-medium text-content-tertiary leading-[16px]",
+                    "data-component": "file-upload-item-progress-label",
+                    children: I
+                  }
+                ) })
+              ] }) }),
+              /* @__PURE__ */ e(f, { when: !t && o, children: /* @__PURE__ */ e(
+                "span",
+                {
+                  className: "text-xs font-medium text-destructive leading-[16px]",
+                  "data-component": "file-upload-item-error",
+                  role: "alert",
+                  "aria-live": "polite",
+                  children: u
+                }
+              ) }),
+              /* @__PURE__ */ e(f, { when: !t && !o, children: /* @__PURE__ */ e("span", { className: "text-xs font-medium text-secondary-foreground leading-[16px]", children: S(l.size) }) })
+            ] })
+          ] }),
+          /* @__PURE__ */ c("div", { className: "flex items-center gap-4 shrink-0", children: [
+            /* @__PURE__ */ e(f, { when: t && !!d?.onAbort, children: /* @__PURE__ */ c(z, { children: [
+              /* @__PURE__ */ e(D, { asChild: !0, children: /* @__PURE__ */ e(
+                "button",
+                {
+                  onClick: k,
+                  className: "flex items-center justify-center text-content-tertiary hover:text-destructive transition-colors",
+                  type: "button",
+                  "aria-label": s("fileUpload.cancelUpload"),
+                  children: /* @__PURE__ */ e(P, { size: 16 })
+                }
+              ) }),
+              /* @__PURE__ */ e(T, { side: "top", variant: "tertiary", children: s("fileUpload.cancelUpload") })
+            ] }) }),
+            /* @__PURE__ */ e(f, { when: !w && !t, children: /* @__PURE__ */ c(z, { children: [
+              /* @__PURE__ */ e(D, { asChild: !0, children: /* @__PURE__ */ e(
+                "button",
+                {
+                  onClick: N,
+                  className: "flex items-center justify-center text-content-tertiary hover:text-destructive transition-colors",
+                  type: "button",
+                  "aria-label": s("aria.removeFile"),
+                  children: /* @__PURE__ */ e(Y, { size: 14 })
+                }
+              ) }),
+              /* @__PURE__ */ e(T, { side: "top", variant: "tertiary", children: s("aria.removeFile") })
+            ] }) }),
+            /* @__PURE__ */ e(f, { when: F, children: /* @__PURE__ */ c(z, { children: [
+              /* @__PURE__ */ e(D, { asChild: !0, children: /* @__PURE__ */ e(
+                "button",
+                {
+                  onClick: B,
+                  className: "flex items-center justify-center text-content-tertiary hover:text-content transition-colors",
+                  type: "button",
+                  "aria-label": s("fileUpload.retryUpload"),
+                  children: /* @__PURE__ */ e(_, { size: 14 })
+                }
+              ) }),
+              /* @__PURE__ */ e(T, { side: "top", variant: "tertiary", children: s("fileUpload.retryUpload") })
+            ] }) }),
+            /* @__PURE__ */ e(f, { when: C, children: /* @__PURE__ */ c(z, { children: [
+              /* @__PURE__ */ e(D, { asChild: !0, children: /* @__PURE__ */ e(
+                "button",
+                {
+                  onClick: L,
+                  className: "flex items-center justify-center text-content-tertiary hover:text-content transition-colors",
+                  type: "button",
+                  "aria-label": s("fileUpload.downloadFile"),
+                  children: /* @__PURE__ */ e(q, { size: 14 })
+                }
+              ) }),
+              /* @__PURE__ */ e(T, { side: "top", variant: "tertiary", children: s("fileUpload.downloadFile") })
+            ] }) })
+          ] })
+        ] })
+      }
+    );
+  }
+), ye = A("file-upload", {
+  part: "footer",
+  displayName: "FileUploadFooter",
+  className: "flex items-center justify-end gap-4 mt-auto"
+});
+export {
+  ue as FileUpload,
+  ge as FileUploadClose,
+  he as FileUploadContent,
+  ve as FileUploadDescription,
+  be as FileUploadDropZone,
+  ye as FileUploadFooter,
+  me as FileUploadHeader,
+  Fe as FileUploadItem,
+  we as FileUploadList,
+  xe as FileUploadTitle
+};