@alfadocs/ui-kit 0.1.9 → 0.2.0

package/dist/_chunks/file-upload-C947ACDK.js

@@ -0,0 +1,829 @@
+import { jsxs as m, jsx as i } from "react/jsx-runtime";
+import { forwardRef as Ne, useId as Ue, useState as ie, useRef as V, useCallback as y, useMemo as q, useEffect as ze } from "react";
+import { u as je } from "./index-CeY1nNvd.js";
+import { c as _ } from "./index-D2ZczOXr.js";
+import { useTranslation as Me } from "react-i18next";
+import { u as Ce } from "./form-field-context-B3APVHKx.js";
+import { u as Le } from "./registry-C9nwlNyL.js";
+import { C as le } from "./circle-alert-ChA9opNA.js";
+import { c as w } from "./createLucideIcon-CrFbzy84.js";
+import { X as re } from "./x-CCcI3eJp.js";
+import { F as Fe } from "./file-text-DSNuv2B8.js";
+import { C as Ae } from "./circle-check-9AeSgJD_.js";
+/**
+ * @license lucide-react v1.8.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const Re = [
+  ["path", { d: "M12 13v8", key: "1l5pq0" }],
+  ["path", { d: "M4 14.899A7 7 0 1 1 15.71 8h1.79a4.5 4.5 0 0 1 2.5 8.242", key: "1pljnt" }],
+  ["path", { d: "m8 17 4-4 4 4", key: "1quai1" }]
+], De = w("cloud-upload", Re);
+/**
+ * @license lucide-react v1.8.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const Ie = [
+  [
+    "path",
+    {
+      d: "M13.659 22H18a2 2 0 0 0 2-2V8a2.4 2.4 0 0 0-.706-1.706l-3.588-3.588A2.4 2.4 0 0 0 14 2H6a2 2 0 0 0-2 2v11.5",
+      key: "4pqfef"
+    }
+  ],
+  ["path", { d: "M14 2v5a1 1 0 0 0 1 1h5", key: "wfsgrz" }],
+  ["path", { d: "M8 12v-1", key: "1ej8lb" }],
+  ["path", { d: "M8 18v-2", key: "qcmpov" }],
+  ["path", { d: "M8 7V6", key: "1nbb54" }],
+  ["circle", { cx: "8", cy: "20", r: "2", key: "ckkr5m" }]
+], _e = w("file-archive", Ie);
+/**
+ * @license lucide-react v1.8.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const Be = [
+  [
+    "path",
+    {
+      d: "M6 22a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h8a2.4 2.4 0 0 1 1.704.706l3.588 3.588A2.4 2.4 0 0 1 20 8v12a2 2 0 0 1-2 2z",
+      key: "1oefj6"
+    }
+  ],
+  ["path", { d: "M14 2v5a1 1 0 0 0 1 1h5", key: "wfsgrz" }],
+  ["circle", { cx: "10", cy: "12", r: "2", key: "737tya" }],
+  ["path", { d: "m20 17-1.296-1.296a2.41 2.41 0 0 0-3.408 0L9 22", key: "wt3hpn" }]
+], He = w("file-image", Be);
+/**
+ * @license lucide-react v1.8.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const Oe = [
+  [
+    "path",
+    {
+      d: "M6 22a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h8a2.4 2.4 0 0 1 1.704.706l3.588 3.588A2.4 2.4 0 0 1 20 8v12a2 2 0 0 1-2 2z",
+      key: "1oefj6"
+    }
+  ],
+  ["path", { d: "M14 2v5a1 1 0 0 0 1 1h5", key: "wfsgrz" }],
+  ["path", { d: "M8 13h2", key: "yr2amv" }],
+  ["path", { d: "M14 13h2", key: "un5t4a" }],
+  ["path", { d: "M8 17h2", key: "2yhykz" }],
+  ["path", { d: "M14 17h2", key: "10kma7" }]
+], $e = w("file-spreadsheet", Oe);
+/**
+ * @license lucide-react v1.8.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const Ee = [
+  [
+    "path",
+    {
+      d: "M6 22a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h8a2.4 2.4 0 0 1 1.704.706l3.588 3.588A2.4 2.4 0 0 1 20 8v12a2 2 0 0 1-2 2z",
+      key: "1oefj6"
+    }
+  ],
+  ["path", { d: "M14 2v5a1 1 0 0 0 1 1h5", key: "wfsgrz" }]
+], Ve = w("file", Ee);
+/**
+ * @license lucide-react v1.8.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const qe = [["path", { d: "M21 12a9 9 0 1 1-6.219-8.56", key: "13zald" }]], Te = w("loader-circle", qe);
+/**
+ * @license lucide-react v1.8.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const We = [
+  ["path", { d: "M12 3v12", key: "1x0j5s" }],
+  ["path", { d: "m17 8-5-5-5 5", key: "7q97r8" }],
+  ["path", { d: "M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4", key: "ih7n3h" }]
+], T = w("upload", We), Pe = {
+  id: "file-upload",
+  capabilities: ["submit", "dismiss"],
+  state: {
+    files: {
+      type: "Array<{ id, name, size, status }>",
+      description: "Files currently tracked by the uploader. Identifiers and metadata only — never file content.",
+      read: (d) => d.getFiles()
+    }
+  },
+  actions: {
+    remove_file: {
+      safety: "destructive",
+      argsType: "{ id: string }",
+      description: "Remove the file with the given id from the upload list.",
+      invoke: (d, n) => {
+        d.removeFile(n.id);
+      }
+    },
+    clear: {
+      safety: "destructive",
+      description: "Remove all files from the upload list.",
+      invoke: (d) => {
+        d.clear();
+      }
+    }
+  },
+  domHooks: {
+    root: { attr: "data-component", value: "file-upload" },
+    instanceId: {
+      attr: "data-component-id",
+      sourceProp: "id",
+      description: "Sourced from the id prop."
+    },
+    item: {
+      attr: "data-file-id",
+      description: "Each tracked file emits its id as data-file-id."
+    }
+  }
+}, Ke = _(
+  [
+    "ds:relative ds:flex ds:flex-col ds:items-center ds:justify-center",
+    "ds:min-h-48 ds:px-[var(--spacing-lg)] ds:py-[var(--spacing-xl)]",
+    "ds:rounded-[var(--radius-lg)] ds:border-2 ds:border-dashed",
+    "ds:bg-background",
+    "ds:transition-all ds:duration-[var(--animation-duration)] ds:motion-reduce:transition-none",
+    "ds:focus-visible:outline-[length:var(--focus-ring-width)] ds:focus-visible:outline-solid",
+    "ds:focus-visible:outline-ring ds:focus-visible:outline-offset-[length:var(--focus-ring-offset)]",
+    "ds:cursor-pointer",
+    "ds:group"
+  ].join(" "),
+  {
+    variants: {
+      isDragActive: {
+        true: "ds:border-primary ds:bg-primary/10 ds:scale-[1.01]",
+        false: "ds:border-border ds:hover:border-muted-foreground/40 ds:hover:bg-muted/5"
+      },
+      hasError: {
+        true: "ds:border-destructive ds:bg-destructive/5 ds:hover:border-destructive",
+        false: ""
+      },
+      isDisabled: {
+        true: "ds:cursor-not-allowed ds:opacity-50 ds:hover:border-border ds:hover:bg-background",
+        false: ""
+      }
+    },
+    defaultVariants: {
+      isDragActive: !1,
+      hasError: !1,
+      isDisabled: !1
+    }
+  }
+), ae = _(
+  [
+    "ds:inline-flex ds:items-center ds:justify-center ds:gap-[var(--spacing-xs)]",
+    "ds:min-h-[var(--min-target-size)] ds:min-w-[var(--min-target-size)]",
+    "ds:rounded-[var(--radius-md)] ds:border ds:border-primary/30 ds:bg-primary/5",
+    "ds:ps-[var(--spacing-md)] ds:pe-[var(--spacing-md)] ds:py-[var(--spacing-sm)]",
+    "ds:text-primary ds:text-[length:var(--font-size-sm)] ds:font-medium",
+    "ds:transition-all ds:duration-[var(--animation-duration)] ds:motion-reduce:transition-none",
+    "ds:hover:bg-primary/10 ds:hover:border-primary/50",
+    "ds:focus-visible:outline-[length:var(--focus-ring-width)] ds:focus-visible:outline-solid",
+    "ds:focus-visible:outline-ring ds:focus-visible:outline-offset-[length:var(--focus-ring-offset)]",
+    "ds:disabled:cursor-not-allowed ds:disabled:opacity-50"
+  ].join(" ")
+), Ge = _(
+  [
+    "ds:flex ds:items-center ds:gap-[var(--spacing-md)]",
+    "ds:rounded-[var(--radius-md)] ds:border ds:bg-background",
+    "ds:p-[var(--spacing-md)]",
+    "ds:text-[length:var(--font-size-sm)] ds:text-foreground",
+    "ds:transition-all ds:duration-[var(--animation-duration)] ds:motion-reduce:transition-none"
+  ].join(" "),
+  {
+    variants: {
+      status: {
+        pending: "ds:border-border",
+        uploading: "ds:border-primary/30 ds:bg-primary/[0.02]",
+        complete: "ds:border-[var(--success)]/30 ds:bg-[var(--success)]/[0.02]",
+        error: "ds:border-destructive/30 ds:bg-destructive/[0.02]"
+      }
+    },
+    defaultVariants: {
+      status: "pending"
+    }
+  }
+), oe = _(
+  [
+    "ds:inline-flex ds:items-center ds:justify-center",
+    "ds:min-h-[var(--min-target-size)] ds:min-w-[var(--min-target-size)]",
+    "ds:rounded-[var(--radius-sm)]",
+    "ds:text-muted-foreground",
+    "ds:transition-colors ds:duration-[var(--animation-duration)] ds:motion-reduce:transition-none",
+    "ds:hover:text-foreground ds:hover:bg-muted/40",
+    "ds:focus-visible:outline-[length:var(--focus-ring-width)] ds:focus-visible:outline-solid",
+    "ds:focus-visible:outline-ring ds:focus-visible:outline-offset-[length:var(--focus-ring-offset)]"
+  ].join(" ")
+);
+function Xe() {
+  return typeof crypto < "u" && crypto.randomUUID ? crypto.randomUUID() : `${Date.now()}-${Math.random().toString(36).slice(2, 11)}`;
+}
+function Ye(d) {
+  return d.type.startsWith("image/");
+}
+function Je(d) {
+  var c;
+  const n = ((c = d.name.split(".").pop()) == null ? void 0 : c.toLowerCase()) ?? "";
+  return ["pdf", "doc", "docx", "txt", "rtf"].includes(n) ? /* @__PURE__ */ i(
+    Fe,
+    {
+      "aria-hidden": "true",
+      className: "ds:size-10 ds:shrink-0 ds:text-muted-foreground"
+    }
+  ) : ["zip", "rar", "7z", "tar", "gz"].includes(n) ? /* @__PURE__ */ i(
+    _e,
+    {
+      "aria-hidden": "true",
+      className: "ds:size-10 ds:shrink-0 ds:text-muted-foreground"
+    }
+  ) : ["xls", "xlsx", "csv"].includes(n) ? /* @__PURE__ */ i(
+    $e,
+    {
+      "aria-hidden": "true",
+      className: "ds:size-10 ds:shrink-0 ds:text-muted-foreground"
+    }
+  ) : ["png", "jpg", "jpeg", "gif", "webp", "svg", "bmp"].includes(n) ? /* @__PURE__ */ i(
+    He,
+    {
+      "aria-hidden": "true",
+      className: "ds:size-10 ds:shrink-0 ds:text-muted-foreground"
+    }
+  ) : /* @__PURE__ */ i(
+    Ve,
+    {
+      "aria-hidden": "true",
+      className: "ds:size-10 ds:shrink-0 ds:text-muted-foreground"
+    }
+  );
+}
+function Qe(d) {
+  switch (d) {
+    case "uploading":
+      return /* @__PURE__ */ i(
+        Te,
+        {
+          "aria-hidden": "true",
+          className: "ds:size-4 ds:shrink-0 ds:text-primary ds:animate-spin"
+        }
+      );
+    case "complete":
+      return /* @__PURE__ */ i(
+        Ae,
+        {
+          "aria-hidden": "true",
+          className: "ds:size-4 ds:shrink-0 ds:text-[var(--success)]"
+        }
+      );
+    case "error":
+      return /* @__PURE__ */ i(
+        le,
+        {
+          "aria-hidden": "true",
+          className: "ds:size-4 ds:shrink-0 ds:text-destructive"
+        }
+      );
+    default:
+      return null;
+  }
+}
+const Ze = [
+  "ui.inputs.fileUpload.units.bytes",
+  "ui.inputs.fileUpload.units.kilobytes",
+  "ui.inputs.fileUpload.units.megabytes",
+  "ui.inputs.fileUpload.units.gigabytes"
+], ne = ["B", "KB", "MB", "GB"];
+function I(d, n, c) {
+  let u = d, p = 0;
+  for (; u >= 1024 && p < ne.length - 1; )
+    u /= 1024, p++;
+  const h = new Intl.NumberFormat(n, {
+    maximumFractionDigits: p === 0 ? 0 : 1
+  }).format(u), B = c(Ze[p], ne[p]);
+  return `${h} ${B}`;
+}
+function Se(d) {
+  switch (d) {
+    case "file-too-large":
+      return "file-too-large";
+    case "file-too-small":
+      return "file-too-small";
+    case "file-invalid-type":
+      return "file-invalid-type";
+    case "too-many-files":
+      return "too-many-files";
+    default:
+      return "file-invalid-type";
+  }
+}
+function de(d) {
+  const n = d.split(".");
+  return n.length > 1 ? `.${n.pop().toLowerCase()}` : "";
+}
+function es(d) {
+  const n = [];
+  for (const u of Object.values(d))
+    for (const p of u)
+      n.push(p.toUpperCase().replace(".", ""));
+  if (n.length > 0) return n.join(", ");
+  const c = [];
+  for (const u of Object.keys(d))
+    u.endsWith("/*") ? c.push(u.replace("/*", "").split("/").pop() ?? u) : c.push(u.split("/").pop() ?? u);
+  return c.join(", ");
+}
+const ss = Ne(
+  ({
+    id: d,
+    accept: n,
+    maxSize: c,
+    minSize: u,
+    maxFiles: p = 1,
+    multiple: h = !1,
+    disabled: B,
+    strictAccept: W = !1,
+    onDrop: L,
+    onUpload: H,
+    onRemove: F,
+    onReject: A,
+    variant: g = "both",
+    showPreview: ce = !0,
+    className: P
+  }, j) => {
+    const { t: o, i18n: N } = Me(), v = Ce(), ue = Ue(), x = v.disabled || B, pe = v.invalid, K = v.id || ue, [R, b] = ie([]), [G, fe] = ie([]), D = V(/* @__PURE__ */ new Map()), O = V(null), M = V(R);
+    M.current = R;
+    const U = y((e) => {
+      O.current && (O.current.textContent = e);
+    }, []), X = y(
+      (e) => {
+        if (!W || !n) return !0;
+        for (const [s, a] of Object.entries(n)) {
+          const t = s === "*/*" || s.endsWith("/*") && e.type.startsWith(s.replace("/*", "/")) || e.type === s, r = de(e.name), f = a.length === 0 || a.some((z) => z.toLowerCase() === r);
+          if (t && f) return !0;
+        }
+        return !1;
+      },
+      [W, n]
+    ), Y = y(
+      async (e) => {
+        if (!H) return;
+        const s = new AbortController();
+        D.current.set(e.id, s), b(
+          (a) => a.map(
+            (t) => t.id === e.id ? { ...t, status: "uploading", progress: 0 } : t
+          )
+        ), U(o("ui.inputs.fileUpload.uploading", "Uploading…"));
+        try {
+          await H(e.file, {
+            signal: s.signal,
+            onProgress: (a) => {
+              b(
+                (t) => t.map(
+                  (r) => r.id === e.id ? { ...r, progress: a } : r
+                )
+              ), U(
+                o("ui.inputs.fileUpload.progress", "{{percent}}% uploaded", {
+                  percent: a
+                })
+              );
+            }
+          }), b(
+            (a) => a.map(
+              (t) => t.id === e.id ? { ...t, status: "complete", progress: 100 } : t
+            )
+          ), U(o("ui.inputs.fileUpload.complete", "Upload complete"));
+        } catch (a) {
+          if (s.signal.aborted) {
+            b((r) => r.filter((f) => f.id !== e.id));
+            return;
+          }
+          const t = a instanceof Error ? a.message : o("ui.inputs.fileUpload.errors.uploadFailed", "Upload failed");
+          b(
+            (r) => r.map(
+              (f) => f.id === e.id ? { ...f, status: "error", error: t } : f
+            )
+          );
+        } finally {
+          D.current.delete(e.id);
+        }
+      },
+      [H, U, o]
+    ), $ = y(
+      (e, s) => {
+        const a = s.flatMap(
+          (l) => l.errors.map((k) => ({
+            file: l.file,
+            reason: Se(k.code)
+          }))
+        ), t = [], r = [];
+        for (const l of e)
+          X(l) ? r.push(l) : t.push({ file: l, reason: "file-invalid-type" });
+        const f = [...a, ...t];
+        fe(f), f.length > 0 && (A == null || A(f));
+        const z = r.map((l) => ({
+          file: l,
+          id: Xe(),
+          status: "pending",
+          progress: 0,
+          preview: Ye(l) ? URL.createObjectURL(l) : void 0
+        }));
+        b((l) => {
+          if (!h && p === 1) {
+            for (const k of l)
+              k.preview && URL.revokeObjectURL(k.preview);
+            return z;
+          }
+          return [...l, ...z];
+        }), L == null || L(r, f), U(
+          o(
+            "ui.inputs.fileUpload.filesSelected",
+            "{{count}} file(s) selected",
+            {
+              count: r.length
+            }
+          )
+        );
+        for (const l of z)
+          Y(l);
+      },
+      [
+        h,
+        p,
+        L,
+        A,
+        X,
+        U,
+        Y,
+        o
+      ]
+    ), { getRootProps: me, getInputProps: J, isDragActive: C, open: Q } = je({
+      accept: n,
+      maxSize: c,
+      minSize: u,
+      maxFiles: h ? p : 1,
+      multiple: h,
+      disabled: x,
+      onDrop: $,
+      noClick: g === "button",
+      noKeyboard: g === "button"
+    }), he = y((e) => {
+      const s = D.current.get(e);
+      s == null || s.abort(), b((a) => {
+        const t = a.find((r) => r.id === e);
+        return t != null && t.preview && URL.revokeObjectURL(t.preview), a.filter((r) => r.id !== e);
+      });
+    }, []), E = y(
+      (e) => {
+        const s = M.current.find((a) => a.id === e);
+        s != null && s.preview && URL.revokeObjectURL(s.preview), b((a) => a.filter((t) => t.id !== e)), s && (F == null || F(s));
+      },
+      [F]
+    ), Z = y(() => {
+      for (const e of M.current) {
+        const s = D.current.get(e.id);
+        s == null || s.abort(), e.preview && URL.revokeObjectURL(e.preview);
+      }
+      b([]);
+    }, []), ge = q(
+      () => ({
+        getFiles: () => M.current.map((e) => ({
+          id: e.id,
+          name: e.file.name,
+          size: e.file.size,
+          status: e.status
+        })),
+        removeFile: (e) => E(e),
+        clear: () => Z()
+      }),
+      [E, Z]
+    );
+    Le(Pe, ge, d);
+    const S = y(
+      (e) => {
+        const s = [], a = [], t = h ? p : 1;
+        for (const r of e) {
+          if (s.length >= t) {
+            a.push({ file: r, reason: "too-many-files" });
+            continue;
+          }
+          if (c !== void 0 && r.size > c) {
+            a.push({ file: r, reason: "file-too-large" });
+            continue;
+          }
+          if (u !== void 0 && r.size < u) {
+            a.push({ file: r, reason: "file-too-small" });
+            continue;
+          }
+          if (n) {
+            const f = de(r.name);
+            if (!Object.entries(n).some(
+              ([l, k]) => {
+                const xe = l === "*/*" || l.endsWith("/*") && r.type.startsWith(l.replace("/*", "/")) || r.type === l, ke = k.length > 0 && k.some((we) => we.toLowerCase() === f);
+                return xe || ke;
+              }
+            )) {
+              a.push({ file: r, reason: "file-invalid-type" });
+              continue;
+            }
+          }
+          s.push(r);
+        }
+        return { accepted: s, rejected: a };
+      },
+      [n, c, u, p, h]
+    ), ee = y(
+      (e) => {
+        if (x) return;
+        const s = Array.from(e.clipboardData.files);
+        if (s.length > 0) {
+          e.preventDefault();
+          const { accepted: a, rejected: t } = S(s), r = t.map((f) => ({
+            file: f.file,
+            errors: [{ code: f.reason, message: f.reason }]
+          }));
+          $(a, r);
+        }
+      },
+      [x, $, S]
+    );
+    ze(() => () => {
+      for (const e of M.current)
+        e.preview && URL.revokeObjectURL(e.preview);
+    }, []);
+    const se = q(() => {
+      const e = [];
+      return n && e.push(es(n)), c && e.push(
+        o("ui.inputs.fileUpload.maxSizeHint", "Max {{size}}", {
+          size: I(c, N.language, o)
+        })
+      ), h && p > 1 && e.push(
+        o("ui.inputs.fileUpload.maxFilesHint", "Up to {{count}} files", {
+          count: p
+        })
+      ), e;
+    }, [n, c, h, p, o, N.language]), te = q(() => G.map((e) => {
+      switch (e.reason) {
+        case "file-too-large":
+          return o(
+            "ui.inputs.fileUpload.errors.fileTooLarge",
+            "File exceeds {{maxSize}}",
+            {
+              maxSize: c ? I(c, N.language, o) : ""
+            }
+          );
+        case "file-too-small":
+          return o(
+            "ui.inputs.fileUpload.errors.fileTooSmall",
+            "File is smaller than {{minSize}}",
+            {
+              minSize: u ? I(u, N.language, o) : ""
+            }
+          );
+        case "file-invalid-type":
+          return o(
+            "ui.inputs.fileUpload.errors.fileInvalidType",
+            "File type not accepted"
+          );
+        case "too-many-files":
+          return o(
+            "ui.inputs.fileUpload.errors.tooManyFiles",
+            "Maximum {{maxFiles}} files allowed",
+            {
+              maxFiles: p
+            }
+          );
+      }
+    }), [G, o, c, u, p, N.language]), ve = () => R.length === 0 ? null : /* @__PURE__ */ i("ul", { className: "ds:mt-[var(--spacing-md)] ds:flex ds:flex-col ds:gap-[var(--spacing-sm)] ds:list-none ds:p-0 ds:m-0", children: R.map((e) => /* @__PURE__ */ m(
+      "li",
+      {
+        "data-file-id": e.id,
+        className: Ge({ status: e.status }),
+        children: [
+          ce && e.preview ? /* @__PURE__ */ i(
+            "img",
+            {
+              src: e.preview,
+              alt: "",
+              "aria-hidden": "true",
+              className: "ds:size-12 ds:shrink-0 ds:rounded-[var(--radius-md)] ds:object-cover ds:border ds:border-border"
+            }
+          ) : Je(e.file),
+          /* @__PURE__ */ m("div", { className: "ds:flex-1 ds:min-w-0", children: [
+            /* @__PURE__ */ m("div", { className: "ds:flex ds:items-center ds:gap-[var(--spacing-xs)]", children: [
+              /* @__PURE__ */ i("p", { className: "ds:truncate type-label ds:m-0", children: e.file.name }),
+              Qe(e.status)
+            ] }),
+            /* @__PURE__ */ m("p", { className: "type-meta ds:text-muted-foreground ds:m-0 ds:mt-0.5", children: [
+              I(e.file.size, N.language, o),
+              e.status === "uploading" && /* @__PURE__ */ m("span", { className: "ds:ms-[var(--spacing-sm)] ds:text-primary ds:font-medium", children: [
+                e.progress,
+                "%"
+              ] }),
+              e.status === "complete" && /* @__PURE__ */ i("span", { className: "ds:ms-[var(--spacing-sm)] ds:text-[var(--success)] ds:font-medium", children: o("ui.inputs.fileUpload.complete", "Complete") })
+            ] }),
+            e.status === "uploading" && /* @__PURE__ */ i(
+              "div",
+              {
+                role: "progressbar",
+                "aria-label": e.file.name,
+                "aria-valuenow": e.progress,
+                "aria-valuemin": 0,
+                "aria-valuemax": 100,
+                className: "ds:mt-[var(--spacing-sm)] ds:h-1.5 ds:w-full ds:rounded-[var(--radius-full)] ds:bg-muted ds:overflow-hidden",
+                children: /* @__PURE__ */ i(
+                  "div",
+                  {
+                    className: "ds:h-full ds:rounded-[var(--radius-full)] ds:bg-primary ds:transition-[inline-size] ds:duration-[var(--animation-duration)] ds:motion-reduce:transition-none",
+                    style: { inlineSize: `${e.progress}%` }
+                  }
+                )
+              }
+            ),
+            e.status === "error" && e.error && /* @__PURE__ */ i(
+              "p",
+              {
+                role: "alert",
+                className: "type-meta ds:text-destructive ds:m-0 ds:mt-[var(--spacing-xs)]",
+                children: e.error
+              }
+            )
+          ] }),
+          e.status === "uploading" && /* @__PURE__ */ i(
+            "button",
+            {
+              type: "button",
+              onClick: () => he(e.id),
+              "aria-label": o("ui.inputs.fileUpload.cancel", "Cancel upload"),
+              className: oe(),
+              children: /* @__PURE__ */ i(re, { "aria-hidden": "true", className: "ds:size-4" })
+            }
+          ),
+          (e.status === "complete" || e.status === "pending" || e.status === "error") && /* @__PURE__ */ i(
+            "button",
+            {
+              type: "button",
+              onClick: () => E(e.id),
+              "aria-label": o("ui.inputs.fileUpload.remove", "Remove file"),
+              className: oe(),
+              children: /* @__PURE__ */ i(re, { "aria-hidden": "true", className: "ds:size-4" })
+            }
+          )
+        ]
+      },
+      e.id
+    )) }), be = () => {
+      if (g === "button") return null;
+      const e = me({
+        className: Ke({
+          isDragActive: C,
+          hasError: pe ?? !1,
+          isDisabled: x ?? !1,
+          className: P
+        }),
+        tabIndex: x ? -1 : 0
+      }), s = e.ref;
+      return /* @__PURE__ */ m(
+        "div",
+        {
+          ...e,
+          ref: (t) => {
+            typeof s == "function" ? s(t) : s && (s.current = t), typeof j == "function" ? j(t) : j && (j.current = t);
+          },
+          onPaste: ee,
+          id: K,
+          "aria-label": o(
+            "ui.inputs.fileUpload.dropHere",
+            "Drop files here or click to browse"
+          ),
+          "aria-describedby": v.describedBy || void 0,
+          "aria-invalid": v.invalid || void 0,
+          "aria-required": v.required || void 0,
+          "data-testid": "file-upload-dropzone",
+          children: [
+            /* @__PURE__ */ i(
+              "input",
+              {
+                ...J({
+                  "aria-label": o(
+                    "ui.inputs.fileUpload.dropHere",
+                    "Drop files here or click to browse"
+                  )
+                })
+              }
+            ),
+            /* @__PURE__ */ m("div", { className: "ds:flex ds:flex-col ds:items-center ds:gap-[var(--spacing-sm)]", children: [
+              /* @__PURE__ */ i("div", { className: "ds:flex ds:items-center ds:justify-center ds:size-14 ds:rounded-[var(--radius-full)] ds:bg-primary/10 ds:text-primary ds:transition-colors ds:duration-[var(--animation-duration)] ds:group-hover:bg-primary/15 ds:motion-reduce:transition-none", children: C ? /* @__PURE__ */ i(De, { "aria-hidden": "true", className: "ds:size-7" }) : /* @__PURE__ */ i(T, { "aria-hidden": "true", className: "ds:size-7" }) }),
+              /* @__PURE__ */ m("div", { className: "ds:flex ds:flex-col ds:items-center ds:gap-[var(--spacing-xs)]", children: [
+                /* @__PURE__ */ i("p", { className: "type-label ds:text-foreground ds:text-center ds:m-0", children: C ? o("ui.inputs.fileUpload.dropActive", "Drop files here") : o(
+                  "ui.inputs.fileUpload.dropHere",
+                  "Drop files here or click to browse"
+                ) }),
+                se.length > 0 && !C && /* @__PURE__ */ i("p", { className: "type-meta ds:text-muted-foreground ds:text-center ds:m-0", children: se.join(" · ") })
+              ] }),
+              g === "both" && !C && /* @__PURE__ */ m(
+                "button",
+                {
+                  type: "button",
+                  onClick: (t) => {
+                    t.stopPropagation(), Q();
+                  },
+                  disabled: x,
+                  className: ae({
+                    className: "ds:mt-[var(--spacing-xs)]"
+                  }),
+                  children: [
+                    /* @__PURE__ */ i(T, { "aria-hidden": "true", className: "ds:size-4" }),
+                    o("ui.inputs.fileUpload.browse", "Browse files")
+                  ]
+                }
+              )
+            ] })
+          ]
+        }
+      );
+    }, ye = () => g === "dropzone" ? null : g === "button" ? /* @__PURE__ */ m("div", { onPaste: ee, ref: j, children: [
+      /* @__PURE__ */ i(
+        "input",
+        {
+          ...J({
+            "aria-label": o("ui.inputs.fileUpload.browse", "Browse files")
+          })
+        }
+      ),
+      /* @__PURE__ */ m(
+        "button",
+        {
+          type: "button",
+          onClick: Q,
+          disabled: x,
+          className: ae({ className: P }),
+          id: g === "button" ? K : void 0,
+          "aria-describedby": g === "button" && v.describedBy || void 0,
+          "aria-invalid": g === "button" && v.invalid || void 0,
+          "aria-required": g === "button" && v.required || void 0,
+          children: [
+            /* @__PURE__ */ i(T, { "aria-hidden": "true", className: "ds:size-4" }),
+            o("ui.inputs.fileUpload.browse", "Browse files")
+          ]
+        }
+      )
+    ] }) : null;
+    return /* @__PURE__ */ m("div", { "data-component": "file-upload", "data-component-id": d, children: [
+      be(),
+      ye(),
+      ve(),
+      te.length > 0 && /* @__PURE__ */ i(
+        "div",
+        {
+          role: "alert",
+          className: "ds:mt-[var(--spacing-sm)] ds:flex ds:flex-col ds:gap-[var(--spacing-xs)]",
+          children: te.map((e, s) => /* @__PURE__ */ m(
+            "div",
+            {
+              className: "ds:flex ds:items-center ds:gap-[var(--spacing-xs)]",
+              children: [
+                /* @__PURE__ */ i(
+                  le,
+                  {
+                    "aria-hidden": "true",
+                    className: "ds:size-3.5 ds:shrink-0 ds:text-destructive"
+                  }
+                ),
+                /* @__PURE__ */ i("p", { className: "type-meta ds:text-destructive ds:m-0", children: e })
+              ]
+            },
+            s
+          ))
+        }
+      ),
+      /* @__PURE__ */ i(
+        "span",
+        {
+          ref: O,
+          role: "status",
+          "aria-live": "polite",
+          className: "ds:sr-only"
+        }
+      )
+    ] });
+  }
+);
+ss.displayName = "FileUpload";
+export {
+  ss as F,
+  Pe as f
+};
+//# sourceMappingURL=file-upload-C947ACDK.js.map