@techzyapp/ui-library 1.0.0

package/dist/FileUploader-VtmmwUFE.js

@@ -0,0 +1,684 @@
+import { jsx as n, jsxs as g, Fragment as Ee } from "react/jsx-runtime";
+import { useRef as J, useState as w, forwardRef as Dt, useId as Ct, useEffect as fe } from "react";
+import { clsx as K } from "clsx";
+import { useSensors as Ft, useSensor as qe, PointerSensor as Mt, KeyboardSensor as Rt, DndContext as Pt, closestCenter as $t } from "@dnd-kit/core";
+import { sortableKeyboardCoordinates as Bt, SortableContext as Ot, rectSortingStrategy as Lt, arrayMove as jt, useSortable as At } from "@dnd-kit/sortable";
+import { CSS as Wt } from "@dnd-kit/utilities";
+import { useAutoAnimate as Ht } from "@formkit/auto-animate/react";
+import { useDropzone as Kt } from "react-dropzone";
+import { u as Vt } from "./formContext-B7ln1Miy.js";
+import { t as Ge } from "./toastStore-Cx_JOKwS.js";
+import { I as R } from "./Icon-CophpkHo.js";
+import { T as se } from "./Typography-Cta6Rg4L.js";
+import qt from "react-image-crop";
+import { B as Ye } from "./Button-DhEv0YFk.js";
+import { M as Gt, O as Yt } from "./Modal-BuaPDlKV.js";
+import { T as Jt } from "./TextField-DMI1X09n.js";
+import { a as me, h as Qt } from "./ConfigProvider-2c94kUOk.js";
+import { f as xe } from "./TextField.module-QePvGeJ3.js";
+const Xt = "_cropSection_1j2zs_4", Zt = "_cropHead_1j2zs_10", eo = "_cropStage_1j2zs_16", to = "_crop_1j2zs_4", oo = "_cropImg_1j2zs_30", no = "_altFields_1j2zs_35", Y = {
+  cropSection: Xt,
+  cropHead: Zt,
+  cropStage: eo,
+  crop: to,
+  cropImg: oo,
+  altFields: no
+};
+function ro({
+  mode: o,
+  name: t,
+  imageUrl: d,
+  mimeType: p,
+  editLocales: S,
+  initialDraft: E,
+  onClose: I,
+  onSave: P
+}) {
+  const m = me(), D = J(null), [_, $] = w(), [s, B] = w(null), [O, V] = w(null), [q, L] = w(E), [j, Q] = w(null), [k, U] = w(!1), X = (i, T) => {
+    $(T);
+    const u = D.current;
+    if (u && u.width > 0 && i.width >= 1 && i.height >= 1) {
+      const A = u.naturalWidth / u.width, G = u.naturalHeight / u.height;
+      B({
+        x: Math.round(i.x * A),
+        y: Math.round(i.y * G),
+        width: Math.round(i.width * A),
+        height: Math.round(i.height * G)
+      });
+    } else
+      B(null);
+  }, x = async () => {
+    const i = D.current;
+    if (!i || !s || s.width < 1 || s.height < 1) return;
+    const T = document.createElement("canvas");
+    T.width = s.width, T.height = s.height;
+    const u = T.getContext("2d");
+    if (!u) return;
+    u.imageSmoothingEnabled = !1, u.drawImage(
+      i,
+      s.x,
+      s.y,
+      s.width,
+      s.height,
+      0,
+      0,
+      s.width,
+      s.height
+    );
+    const A = await new Promise((G) => T.toBlob(G, p, 1));
+    if (!A) throw new Error("canvas.toBlob returned null");
+    return new File([A], t, { type: p, lastModified: Date.now() });
+  }, Z = async () => {
+    if (o === "altText") {
+      P({ draft: q });
+      return;
+    }
+    U(!0);
+    try {
+      const i = s && s.width >= 1 && s.height >= 1 ? await x() : void 0;
+      P({ croppedFile: i });
+    } catch {
+      Q(m("fileUploader.cropError")), U(!1);
+    }
+  };
+  return /* @__PURE__ */ n(
+    Gt,
+    {
+      open: !0,
+      onClose: I,
+      size: o === "crop" ? "lg" : "sm",
+      icon: o === "crop" ? "Crop" : "Text",
+      title: m(o === "crop" ? "fileUploader.cropTitle" : "fileUploader.altTitle"),
+      description: t,
+      footer: /* @__PURE__ */ g(Ee, { children: [
+        /* @__PURE__ */ n(Ye, { variant: "text", color: "accent", onClick: I, disabled: k, children: m("common.cancel") }),
+        /* @__PURE__ */ n(Ye, { onClick: Z, loading: k, children: m("common.save") })
+      ] }),
+      children: o === "crop" ? /* @__PURE__ */ g("div", { className: Y.cropSection, children: [
+        /* @__PURE__ */ g("div", { className: Y.cropHead, children: [
+          /* @__PURE__ */ n(se, { variant: "bodySmall", color: "muted", children: m("fileUploader.cropHint") }),
+          /* @__PURE__ */ n(se, { variant: "bodySmall", color: s ? "text" : "muted", children: s ? `${s.width} × ${s.height} px` : O ? `${O.w} × ${O.h} px` : "" })
+        ] }),
+        /* @__PURE__ */ n("div", { className: Y.cropStage, children: /* @__PURE__ */ n(qt, { crop: _, onChange: X, className: Y.crop, children: /* @__PURE__ */ n(
+          "img",
+          {
+            ref: D,
+            src: d ?? void 0,
+            alt: "",
+            className: Y.cropImg,
+            onLoad: (i) => V({
+              w: i.currentTarget.naturalWidth,
+              h: i.currentTarget.naturalHeight
+            })
+          }
+        ) }) }),
+        j && /* @__PURE__ */ n(se, { variant: "bodySmall", color: "error", children: j })
+      ] }) : /* @__PURE__ */ n("div", { className: Y.altFields, children: S.map((i) => /* @__PURE__ */ n(
+        Jt,
+        {
+          label: i.label ?? (i.code || m("fileUploader.altTitle")),
+          placeholder: m("fileUploader.altPlaceholder"),
+          value: q[i.code] ?? "",
+          onChange: (T) => L((u) => ({ ...u, [i.code]: T.target.value }))
+        },
+        i.code
+      )) })
+    }
+  );
+}
+const ao = "_backdrop_1c3fg_5", lo = "_media_1c3fg_9", so = "_mediaSvg_1c3fg_19", io = "_close_1c3fg_27", ae = {
+  backdrop: ao,
+  media: lo,
+  mediaSvg: so,
+  close: io
+};
+function co({
+  url: o,
+  isVideo: t,
+  isSvg: d,
+  name: p,
+  onClose: S
+}) {
+  const E = me();
+  return /* @__PURE__ */ g(
+    Yt,
+    {
+      open: !0,
+      onClose: S,
+      dim: 0.85,
+      className: ae.backdrop,
+      role: "dialog",
+      "aria-modal": "true",
+      "aria-label": E("fileUploader.preview", { name: p }),
+      children: [
+        /* @__PURE__ */ n(
+          "button",
+          {
+            type: "button",
+            className: ae.close,
+            "aria-label": E("fileUploader.closePreview"),
+            onClick: S,
+            autoFocus: !0,
+            children: /* @__PURE__ */ n(R, { name: "Close", size: "lg" })
+          }
+        ),
+        t ? /* @__PURE__ */ n("video", { src: o, className: ae.media, controls: !0, playsInline: !0 }) : (
+          // an SVG's natural size is unreliable, so it always gets the floored box (`.mediaSvg`); a raster
+          // keeps its natural size, only capped to the viewport (`.media`)
+          /* @__PURE__ */ n("img", { src: o, alt: p, className: K(ae.media, d && ae.mediaSvg) })
+        )
+      ]
+    }
+  );
+}
+const uo = "_root_1ed4u_4", fo = "_fullWidth_1ed4u_9", po = "_disabled_1ed4u_14", mo = "_dropzone_1ed4u_17", ho = "_dropText_1ed4u_41", go = "_dropping_1ed4u_56", _o = "_error_1ed4u_61", bo = "_dropIcon_1ed4u_65", vo = "_prompt_1ed4u_77", yo = "_accent_1ed4u_82", wo = "_hint_1ed4u_87", So = "_list_1ed4u_93", Uo = "_populated_1ed4u_102", xo = "_tile_1ed4u_120", To = "_grabbable_1ed4u_129", No = "_entering_1ed4u_138", Eo = "_dragging_1ed4u_141", Io = "_tileError_1ed4u_147", ko = "_tileImg_1ed4u_152", zo = "_tileFallback_1ed4u_159", Do = "_tilePlay_1ed4u_169", Co = "_tileTop_1ed4u_188", Fo = "_tileBottom_1ed4u_198", Mo = "_tileRemove_1ed4u_208", Ro = "_tileAction_1ed4u_209", Po = "_tileActionEnd_1ed4u_244", $o = "_tileText_1ed4u_247", Bo = "_name_1ed4u_254", Oo = "_nameBase_1ed4u_261", Lo = "_nameExt_1ed4u_267", jo = "_tileMeta_1ed4u_271", Ao = "_metaError_1ed4u_275", a = {
+  root: uo,
+  fullWidth: fo,
+  disabled: po,
+  dropzone: mo,
+  dropText: ho,
+  dropping: go,
+  error: _o,
+  dropIcon: bo,
+  prompt: vo,
+  accent: yo,
+  hint: wo,
+  list: So,
+  populated: Uo,
+  tile: xo,
+  grabbable: To,
+  entering: No,
+  dragging: Eo,
+  tileError: Io,
+  tileImg: ko,
+  tileFallback: zo,
+  tilePlay: Do,
+  tileTop: Co,
+  tileBottom: Fo,
+  tileRemove: Mo,
+  tileAction: Ro,
+  tileActionEnd: Po,
+  tileText: $o,
+  name: Bo,
+  nameBase: Oo,
+  nameExt: Lo,
+  tileMeta: jo,
+  metaError: Ao
+}, Je = () => typeof URL < "u" && typeof URL.createObjectURL == "function", Wo = 300, Ho = (o, t, d, p) => {
+  let S = [{}, {}], E = Wo;
+  if (t === "add")
+    E = 0;
+  else if (t === "remove")
+    S = [
+      { opacity: 1, transform: "translateY(0)" },
+      { opacity: 0, transform: "translateY(-8px)" }
+    ];
+  else if (d && p) {
+    const I = d.left - p.left, P = d.top - p.top;
+    S = [{ transform: `translate(${I}px, ${P}px)` }, { transform: "translate(0, 0)" }];
+  }
+  return new KeyframeEffect(o, S, { duration: E, easing: "ease-out" });
+}, le = (o) => {
+  if (o < 1024) return `${o} B`;
+  const t = ["KB", "MB", "GB", "TB"];
+  let d = o / 1024, p = 0;
+  for (; d >= 1024 && p < t.length - 1; )
+    d /= 1024, p += 1;
+  return `${d.toFixed(d < 10 ? 1 : 0)} ${t[p]}`;
+}, Ko = (o) => {
+  if (typeof o == "number") return o;
+  const t = /^\s*([\d.]+)\s*(b|kb|mb|gb|tb)?\s*$/i.exec(o);
+  if (!t) return;
+  const d = {
+    b: 1,
+    kb: 1024,
+    mb: 1024 ** 2,
+    gb: 1024 ** 3,
+    tb: 1024 ** 4
+  };
+  return parseFloat(t[1]) * (d[(t[2] || "b").toLowerCase()] ?? 1);
+}, Qe = (o) => `f:${o.name}:${o.size}:${o.lastModified}`, Vo = (o) => o.file ? Qe(o.file) : `s:${o.source ?? ""}`, pe = (o) => o.file ? o.file.name : o.source ? /^(data|blob):/i.test(o.source) ? "File" : o.source.split(/[?#]/)[0].split("/").pop() || "File" : "File", Te = (o) => {
+  if (o.file) return o.file.type.startsWith("image/");
+  const t = o.source;
+  return t ? /^data:image\//i.test(t) ? !0 : /^data:/i.test(t) ? !1 : /\.(png|jpe?g|gif|webp|avif|svg|bmp|ico|heic|heif)(?:[?#]|$)/i.test(t) || !/\.[a-z0-9]{1,8}(?:[?#]|$)/i.test(t) : !1;
+}, Ne = (o) => {
+  if (o.file) return o.file.type.startsWith("video/");
+  const t = o.source;
+  return t ? /^data:video\//i.test(t) || /\.(mp4|webm|ogg|ogv|mov|m4v|avi|mkv)(?:[?#]|$)/i.test(t) : !1;
+}, qo = (o) => {
+  if (typeof document > "u") return;
+  const t = document.createElement("a");
+  if (t.style.display = "none", o.file) {
+    if (!Je()) return;
+    const d = URL.createObjectURL(o.file);
+    t.href = d, t.download = o.file.name, document.body.appendChild(t), t.click(), t.remove(), setTimeout(() => URL.revokeObjectURL(d), 1e3);
+  } else o.source && (t.href = o.source, t.download = pe(o), t.target = "_blank", t.rel = "noopener", document.body.appendChild(t), t.click(), t.remove());
+}, Go = (o) => {
+  const t = o.lastIndexOf(".");
+  return t > 0 && o.length - t <= 7 ? { base: o.slice(0, t), ext: o.slice(t) } : { base: o, ext: "" };
+};
+function Yo({
+  id: o,
+  item: t,
+  preview: d,
+  sortable: p,
+  entering: S,
+  disabled: E,
+  error: I,
+  onRemove: P,
+  onCrop: m,
+  onAltText: D,
+  onDownload: _,
+  onView: $,
+  onPreviewError: s
+}) {
+  const { attributes: B, listeners: O, setNodeRef: V, transform: q, transition: L, isDragging: j } = At({
+    id: o,
+    disabled: !p
+  }), Q = {
+    transform: Wt.Transform.toString(q),
+    transition: L
+  }, k = me(), U = pe(t), { base: X, ext: x } = Go(U), Z = t.file ? le(t.file.size) : k("fileUploader.uploaded"), i = Ne(t), T = _ ? /* @__PURE__ */ n(
+    "button",
+    {
+      type: "button",
+      className: a.tileAction,
+      "aria-label": k("fileUploader.download", { name: U }),
+      onClick: _,
+      onPointerDown: (u) => u.stopPropagation(),
+      children: /* @__PURE__ */ n(R, { name: "DocumentDownload", size: "sm" })
+    }
+  ) : null;
+  return /* @__PURE__ */ g(
+    "div",
+    {
+      ref: V,
+      style: Q,
+      className: K(
+        a.tile,
+        p && a.grabbable,
+        S && a.entering,
+        j && a.dragging,
+        I && a.tileError
+      ),
+      ...B,
+      ...O,
+      children: [
+        d ? i ? /* @__PURE__ */ g(Ee, { children: [
+          /* @__PURE__ */ n(
+            "video",
+            {
+              src: d,
+              className: a.tileImg,
+              muted: !0,
+              playsInline: !0,
+              preload: "metadata",
+              draggable: !1,
+              onError: s
+            }
+          ),
+          /* @__PURE__ */ n("span", { className: a.tilePlay, "aria-hidden": "true", children: /* @__PURE__ */ n(R, { name: "Play", size: "lg" }) })
+        ] }) : /* @__PURE__ */ n(
+          "img",
+          {
+            src: d,
+            alt: "",
+            className: a.tileImg,
+            draggable: !1,
+            onError: s
+          }
+        ) : /* @__PURE__ */ n("span", { className: a.tileFallback, "aria-hidden": "true", children: /* @__PURE__ */ n(R, { name: "Document", size: "lg" }) }),
+        /* @__PURE__ */ g("div", { className: a.tileTop, children: [
+          /* @__PURE__ */ g("span", { className: a.tileText, children: [
+            /* @__PURE__ */ g("span", { className: a.name, title: U, children: [
+              /* @__PURE__ */ n("span", { className: a.nameBase, children: X }),
+              x && /* @__PURE__ */ n("span", { className: a.nameExt, children: x })
+            ] }),
+            /* @__PURE__ */ n("span", { className: K(a.tileMeta, I && a.metaError), children: I ?? Z })
+          ] }),
+          !E && /* @__PURE__ */ n(
+            "button",
+            {
+              type: "button",
+              className: a.tileRemove,
+              "aria-label": k("fileUploader.remove", { name: U }),
+              onClick: P,
+              onPointerDown: (u) => u.stopPropagation(),
+              children: /* @__PURE__ */ n(R, { name: "Close", size: "sm" })
+            }
+          )
+        ] }),
+        (m || D || _ || $) && /* @__PURE__ */ g("div", { className: a.tileBottom, children: [
+          m && /* @__PURE__ */ n(
+            "button",
+            {
+              type: "button",
+              className: a.tileAction,
+              "aria-label": k("fileUploader.crop", { name: U }),
+              onClick: m,
+              onPointerDown: (u) => u.stopPropagation(),
+              children: /* @__PURE__ */ n(R, { name: "Crop", size: "sm" })
+            }
+          ),
+          D && /* @__PURE__ */ n(
+            "button",
+            {
+              type: "button",
+              className: a.tileAction,
+              "aria-label": k("fileUploader.editAlt", { name: U }),
+              onClick: D,
+              onPointerDown: (u) => u.stopPropagation(),
+              children: /* @__PURE__ */ n(R, { name: "Text", size: "sm" })
+            }
+          ),
+          T,
+          $ && /* @__PURE__ */ n(
+            "button",
+            {
+              type: "button",
+              className: K(a.tileAction, a.tileActionEnd),
+              "aria-label": k("fileUploader.preview", { name: U }),
+              onClick: $,
+              onPointerDown: (u) => u.stopPropagation(),
+              children: /* @__PURE__ */ n(R, { name: "Eye", size: "sm" })
+            }
+          )
+        ] })
+      ]
+    }
+  );
+}
+const hn = Dt(function({
+  multiple: t = !1,
+  allowDrop: d = !0,
+  allowReorder: p = !0,
+  allowDownload: S = !0,
+  allowPreview: E = !0,
+  allowAltText: I = !0,
+  altTextLocales: P,
+  localizedAltText: m = !0,
+  allowDuplicates: D = !1,
+  disabled: _ = !1,
+  accept: $,
+  maxFiles: s,
+  maxFileSize: B,
+  itemInsertLocation: O = "end",
+  value: V,
+  defaultValue: q,
+  onChange: L,
+  label: j,
+  error: Q,
+  helperText: k,
+  required: U = !1,
+  fullWidth: X = !0,
+  name: x,
+  id: Z,
+  onBlur: i,
+  className: T,
+  style: u,
+  ...A
+}, G) {
+  var He;
+  const Xe = Ct(), Ie = Z ?? Xe, ke = `${Ie}-helper`, C = B != null ? Ko(B) : void 0, [ie, he] = w(null);
+  fe(() => {
+    if (!ie) return;
+    const e = window.setTimeout(() => he(null), 4e3);
+    return () => window.clearTimeout(e);
+  }, [ie]);
+  const ee = Vt(), ze = !!(ee && x), F = ee && x ? ee.field(x) : void 0, De = t ? [] : null, Ce = V !== void 0 ? V : ze ? ee.values[x] ?? De : void 0, Fe = Ce !== void 0, [Ze, et] = w(q ?? De), te = Fe ? Ce : Ze, h = te == null ? [] : Array.isArray(te) ? te : [te], ge = Q ?? (F == null ? void 0 : F.error) ?? !1, tt = k ?? (F == null ? void 0 : F.helperText), _e = ie ?? tt, ot = !!ie || ge, ce = p && t && !_, Me = J(/* @__PURE__ */ new WeakMap()), Re = J(0), nt = (e, r) => {
+    if (e.file) {
+      let l = Me.current.get(e.file);
+      return l || (Re.current += 1, l = `f${Re.current}`, Me.current.set(e.file, l)), l;
+    }
+    return e.source ? `s:${e.source}` : `i:${r}`;
+  }, N = h.map((e, r) => nt(e, r)), Pe = J(/* @__PURE__ */ new Set()), rt = new Set(N.filter((e) => !Pe.current.has(e)));
+  fe(() => {
+    Pe.current = new Set(N);
+  });
+  const [at, $e] = w(() => /* @__PURE__ */ new Set()), lt = (e) => $e((r) => r.has(e) ? r : new Set(r).add(e)), [st, it] = w(() => /* @__PURE__ */ new Set()), ct = (e) => it((r) => r.has(e) ? r : new Set(r).add(e)), de = J(/* @__PURE__ */ new Map()), ue = (e) => {
+    if (e.file) {
+      const r = e.file.type;
+      if (!r.startsWith("image/") && !r.startsWith("video/") || !Je() || st.has(e.file))
+        return null;
+      let l = de.current.get(e.file);
+      return l || (l = URL.createObjectURL(e.file), de.current.set(e.file, l)), l;
+    }
+    return e.source && !at.has(e.source) ? e.source : null;
+  }, [M, Be] = w(null);
+  fe(() => {
+    const e = de.current, r = new Set(h.map((c) => c.file).filter(Boolean)), l = new Set(h.filter((c) => !c.file && c.source).map((c) => c.source));
+    for (const [c, f] of e)
+      !r.has(c) && f !== (M == null ? void 0 : M.url) && (URL.revokeObjectURL(f), e.delete(c));
+    $e((c) => {
+      if (c.size === 0) return c;
+      const f = new Set([...c].filter((v) => l.has(v)));
+      return f.size === c.size ? c : f;
+    });
+  }, [te, M]), fe(() => {
+    const e = de.current;
+    return () => {
+      for (const r of e.values()) URL.revokeObjectURL(r);
+      e.clear();
+    };
+  }, []);
+  const dt = (e) => e.map((r, l) => r.sortIndex === l ? r : { ...r, sortIndex: l }), oe = (e) => {
+    const r = dt(e), l = t ? r : r[0] ?? null;
+    Fe || et(l), ze && ee.setValue(x, l), L == null || L(l);
+  }, be = () => F == null ? void 0 : F.onBlur({}), b = me(), ut = Qt(), Oe = P ?? ut, ft = m && Oe.length > 0 ? Oe : [{ code: "" }], [ne, ve] = w(null), [Le, je] = w("altText"), ye = ne != null ? N.indexOf(ne) : -1, z = ye !== -1 ? h[ye] : null, pt = (e) => {
+    je("crop"), ve(N[e] ?? null);
+  }, mt = (e) => {
+    je("altText"), ve(N[e] ?? null);
+  }, we = () => ve(null), ht = (e) => {
+    const r = ue(e);
+    if (!r) return;
+    const l = e.file ? e.file.type === "image/svg+xml" : /^data:image\/svg/i.test(e.source ?? "") || /\.svg(?:[?#]|$)/i.test(e.source ?? "");
+    Be({ url: r, isVideo: Ne(e), isSvg: l, name: pe(e) });
+  }, gt = z ? m ? z.altText && typeof z.altText == "object" ? { ...z.altText } : {} : { "": typeof z.altText == "string" ? z.altText : "" } : {}, _t = ({ draft: e, croppedFile: r }) => {
+    if (ye === -1) return we();
+    oe(
+      h.map((l, c) => {
+        if (N[c] !== ne) return l;
+        const f = { ...l };
+        if (e !== void 0)
+          if (m) {
+            const v = Object.fromEntries(
+              Object.entries(e).map(([W, y]) => [W, y.trim()]).filter(([, W]) => W !== "")
+            );
+            f.altText = Object.keys(v).length > 0 ? v : void 0;
+          } else
+            f.altText = (e[""] ?? "").trim() || void 0;
+        return r && (f.file = r, f.source = ""), f;
+      })
+    ), we();
+  }, bt = (e, r = []) => {
+    const l = r.filter((y) => y.errors.some((H) => H.code === "file-invalid-type")), c = r.filter((y) => y.errors.some((H) => H.code === "file-too-large"));
+    l.length > 0 && Ge.error(
+      l.length === 1 ? b("fileUploader.wrongTypeOne", { name: l[0].file.name }) : b("fileUploader.wrongTypeMany", { count: l.length })
+    ), c.length > 0 && C != null && Ge.error(
+      c.length === 1 ? b("fileUploader.tooLargeOne", {
+        name: c[0].file.name,
+        size: le(C)
+      }) : b("fileUploader.tooLargeMany", { count: c.length, size: le(C) })
+    );
+    const f = [];
+    let v = e;
+    if (t && !D) {
+      const y = new Set(h.map(Vo)), H = [];
+      for (const Ke of v) {
+        const Ve = Qe(Ke);
+        y.has(Ve) || (y.add(Ve), H.push(Ke));
+      }
+      H.length < v.length && f.push(b("fileUploader.duplicate")), v = H;
+    }
+    if (t && s != null) {
+      const y = Math.max(0, s - h.length);
+      v.length > y && (v = v.slice(0, y), f.push(
+        s === 1 ? b("fileUploader.hintUpToOne", { count: s }) : b("fileUploader.hintUpToMany", { count: s })
+      ));
+    }
+    if (he(f.length > 0 ? f.join(" · ") : null), v.length === 0) return;
+    const W = v.map((y) => ({ file: y, source: "", sortIndex: 0 }));
+    if (!t) {
+      oe([W[0]]);
+      return;
+    }
+    oe(O === "start" ? [...W, ...h] : [...h, ...W]);
+  }, vt = (e) => {
+    he(null), oe(h.filter((r, l) => l !== e)), be();
+  }, [yt, Se] = Ht(Ho), Ae = () => {
+    typeof requestAnimationFrame == "function" ? requestAnimationFrame(() => Se(!0)) : Se(!0);
+  }, wt = () => Se(!1), St = () => Ae(), Ut = (e) => {
+    const { active: r, over: l } = e;
+    if (l && r.id !== l.id) {
+      const c = N.indexOf(String(r.id)), f = N.indexOf(String(l.id));
+      c !== -1 && f !== -1 && oe(jt(h, c, f));
+    }
+    Ae();
+  }, xt = Ft(
+    qe(Mt, { activationConstraint: { distance: 5 } }),
+    qe(Rt, { coordinateGetter: Bt })
+  ), re = J(!1), { getRootProps: Tt, getInputProps: Nt, isDragActive: Et } = Kt({
+    multiple: t,
+    accept: $,
+    // reject oversized picks here so they never get added; the rejection surfaces as a Toast in addFiles
+    maxSize: C,
+    disabled: _,
+    noKeyboard: !1,
+    noDrag: !d,
+    onFileDialogOpen: () => {
+      re.current = !0;
+    },
+    onFileDialogCancel: () => {
+      re.current = !1, be();
+    },
+    onDrop: (e, r) => {
+      re.current = !1, bt(e, r);
+    }
+  }), It = t || h.length === 0, Ue = [];
+  t && s != null && Ue.push(
+    s === 1 ? b("fileUploader.hintUpToOne", { count: s }) : b("fileUploader.hintUpToMany", { count: s })
+  ), C != null && Ue.push(b("fileUploader.hintMax", { size: le(C) }));
+  const We = Ue.join(" · "), kt = d ? /* @__PURE__ */ g(Ee, { children: [
+    /* @__PURE__ */ n("span", { className: a.accent, children: b("fileUploader.choose") }),
+    " ",
+    b("fileUploader.dropSuffix")
+  ] }) : /* @__PURE__ */ n("span", { className: a.accent, children: b("fileUploader.choose") }), zt = (e) => {
+    if (i == null || i(e), !e.currentTarget.contains(e.relatedTarget) && ne == null) {
+      if (re.current) {
+        re.current = !1;
+        return;
+      }
+      be();
+    }
+  };
+  return /* @__PURE__ */ g(
+    "div",
+    {
+      ref: G,
+      id: Ie,
+      className: K(
+        a.root,
+        X && a.fullWidth,
+        ge && a.error,
+        _ && a.disabled,
+        T
+      ),
+      style: u,
+      "aria-invalid": ge || void 0,
+      "aria-describedby": _e != null ? ke : void 0,
+      onBlur: zt,
+      ...A,
+      ...x ? { name: x, tabIndex: -1 } : {},
+      children: [
+        j != null && /* @__PURE__ */ g("label", { className: xe.label, children: [
+          /* @__PURE__ */ n(se, { as: "span", variant: "bodySmall", color: "muted", children: j }),
+          U && /* @__PURE__ */ n("span", { className: xe.required, "aria-hidden": "true", children: "*" })
+        ] }),
+        It && /* @__PURE__ */ g(
+          "div",
+          {
+            ...Tt({ className: K(a.dropzone, Et && a.dropping) }),
+            children: [
+              /* @__PURE__ */ n("input", { ...Nt() }),
+              /* @__PURE__ */ n("span", { className: a.dropIcon, "aria-hidden": "true", children: /* @__PURE__ */ n(R, { name: "DocumentUpload", size: "lg" }) }),
+              /* @__PURE__ */ g("span", { className: a.dropText, children: [
+                /* @__PURE__ */ n("span", { className: a.prompt, children: kt }),
+                We && /* @__PURE__ */ n("span", { className: a.hint, children: We })
+              ] })
+            ]
+          }
+        ),
+        /* @__PURE__ */ n(
+          Pt,
+          {
+            sensors: xt,
+            collisionDetection: $t,
+            onDragStart: ce ? wt : void 0,
+            onDragEnd: ce ? Ut : void 0,
+            onDragCancel: ce ? St : void 0,
+            children: /* @__PURE__ */ n(Ot, { items: N, strategy: Lt, children: /* @__PURE__ */ n("div", { ref: yt, className: K(a.list, h.length > 0 && a.populated), children: h.map((e, r) => /* @__PURE__ */ n(
+              Yo,
+              {
+                id: N[r],
+                item: e,
+                preview: ue(e),
+                sortable: ce && h.length > 1,
+                entering: rt.has(N[r]),
+                disabled: _,
+                error: e.file && C != null && e.file.size > C ? b("fileUploader.exceedsLimit", { size: le(C) }) : void 0,
+                onRemove: () => vt(r),
+                onCrop: I && !_ && Te(e) ? () => pt(r) : void 0,
+                onAltText: I && !_ && Te(e) ? () => mt(r) : void 0,
+                onDownload: S && !_ ? () => qo(e) : void 0,
+                onView: E && !_ && ue(e) != null && (Te(e) || Ne(e)) ? () => ht(e) : void 0,
+                onPreviewError: e.file ? () => ct(e.file) : e.source ? () => lt(e.source) : void 0
+              },
+              N[r]
+            )) }) })
+          }
+        ),
+        _e != null && /* @__PURE__ */ n(
+          se,
+          {
+            as: "span",
+            id: ke,
+            variant: "bodySmall",
+            color: ot ? "error" : "muted",
+            className: xe.helper,
+            role: "status",
+            "aria-live": "polite",
+            children: _e
+          }
+        ),
+        z && /* @__PURE__ */ n(
+          ro,
+          {
+            mode: Le,
+            name: pe(z),
+            imageUrl: ue(z),
+            mimeType: ((He = z.file) == null ? void 0 : He.type) || "image/png",
+            editLocales: ft,
+            initialDraft: gt,
+            onClose: we,
+            onSave: _t
+          },
+          `${ne}:${Le}`
+        ),
+        M && /* @__PURE__ */ n(
+          co,
+          {
+            url: M.url,
+            isVideo: M.isVideo,
+            isSvg: M.isSvg,
+            name: M.name,
+            onClose: () => Be(null)
+          }
+        )
+      ]
+    }
+  );
+});
+export {
+  hn as F
+};
+//# sourceMappingURL=FileUploader-VtmmwUFE.js.map