@rpcbase/ui 0.181.0 → 0.183.0

package/dist/index14.js

@@ -1,735 +1,79 @@
-import { j as r } from "./index28.js";
-import { useRef as A, useState as H, useEffect as T, useMemo as re } from "react";
-import { createPortal as ie } from "react-dom";
-import { useSensors as ke, useSensor as ae, DndContext as Ne, closestCenter as Ue, KeyboardSensor as Re, PointerSensor as Se, DragOverlay as Ie } from "./index33.js";
-import { SortableContext as Ce, rectSortingStrategy as Le, arrayMove as Ae, sortableKeyboardCoordinates as ze, useSortable as Ee } from "./index34.js";
-import { CSS as Me } from "./index35.js";
-import { Plus as Pe, X as ce, Maximize2 as Te, Loader2 as De } from "lucide-react";
-import { cn as Q } from "./index2.js";
-const ue = "rb-tenant-id", Ke = async (t) => {
-  if (typeof crypto > "u" || typeof crypto.subtle > "u") return null;
-  try {
-    const c = await crypto.subtle.digest("SHA-256", t);
-    return Array.from(new Uint8Array(c)).map((p) => p.toString(16).padStart(2, "0")).join("");
-  } catch {
-    return null;
-  }
-}, $e = () => {
-  if (typeof window > "u") return null;
-  const c = new URLSearchParams(window.location.search || "").get(ue)?.trim() ?? "";
-  return c || null;
-}, J = (t, c) => {
-  if (!c) return t;
-  const i = t.includes("?") ? "&" : "?";
-  return `${t}${i}${ue}=${encodeURIComponent(c)}`;
-}, le = async (t, c, i) => {
-  const p = await fetch(t, {
-    method: "POST",
-    headers: { "Content-Type": "application/json", ...i?.headers ?? {} },
-    credentials: "include",
-    body: JSON.stringify(c),
-    signal: i?.signal
-  }), u = await p.json().catch(() => ({}));
-  return { ok: p.ok, status: p.status, data: u };
-}, Oe = async (t, c) => {
-  const i = await fetch(t, {
-    credentials: "include",
-    headers: c?.headers,
-    signal: c?.signal
-  }), p = await i.json().catch(() => ({}));
-  return { ok: i.ok, status: i.status, data: p };
-}, Fe = async ({
-  url: t,
-  body: c,
-  sha256: i,
-  uploadKey: p,
-  signal: u
+import { j as a } from "./index29.js";
+import { useState as m, useRef as w, useEffect as u } from "react";
+import { decode as y } from "./index33.js";
+const D = ({
+  src: o,
+  hash: n,
+  alt: f = "",
+  className: g
 }) => {
-  const U = {
-    "Content-Type": "application/octet-stream"
-  };
-  i && (U["X-Chunk-SHA256"] = i), p && (U["X-Upload-Key"] = p);
-  const w = await fetch(t, {
-    method: "PUT",
-    credentials: "include",
-    headers: U,
-    body: c,
-    signal: u
-  });
-  return { ok: w.ok, status: w.status };
-}, Be = async (t, c, i) => {
-  const p = $e(), u = await le(
-    J("/api/rb/file-uploads", p),
-    {
-      filename: t.name,
-      mimeType: t.type || "application/octet-stream",
-      ...typeof i?.isPublic == "boolean" ? { isPublic: i.isPublic } : {},
-      totalSize: t.size
-    },
-    { signal: i?.signal }
-  );
-  if (!u.ok || !u.data?.ok)
-    throw new Error(u.data?.error ?? `Init failed (${u.status})`);
-  const U = String(u.data?.uploadId ?? ""), w = typeof u.data?.uploadKey == "string" ? String(u.data.uploadKey) : null, D = Number(u.data?.chunkSize ?? 0), z = Number(u.data?.chunksTotal ?? 0);
-  if (!U || !D || !z)
-    throw new Error("Upload init missing required fields");
-  const _ = async (v) => {
-    const R = v * D, g = Math.min(t.size, R + D), E = await t.slice(R, g).arrayBuffer(), P = await Ke(E), m = await Fe({
-      url: J(`/api/rb/file-uploads/${encodeURIComponent(U)}/chunks/${v}`, p),
-      body: E,
-      sha256: P ?? void 0,
-      uploadKey: w ?? void 0,
-      signal: i?.signal
-    });
-    if (m.status !== 204)
-      throw new Error(`Chunk ${v} failed (${m.status})`);
-  }, O = async (v, R = 0) => {
-    let g = R;
-    for (const S of v) {
-      await _(S), g += 1;
-      const E = Math.min(99, Math.floor(g / z * 99));
-      c(E);
-    }
-  }, X = Array.from({ length: z }, (v, R) => R);
-  await O(X, 0);
-  const l = async () => {
-    const v = await le(
-      J(`/api/rb/file-uploads/${encodeURIComponent(U)}/complete`, p),
-      {},
-      { headers: w ? { "X-Upload-Key": w } : void 0, signal: i?.signal }
-    );
-    if (v.ok && v.data?.ok) {
-      const m = String(v.data?.fileId ?? "");
-      if (!m) throw new Error("Upload completed without fileId");
-      return m;
+  const [i, l] = m(!1), [c, p] = m(null), s = w(null);
+  u(() => {
+    if (!n) return;
+    const [e, r, j] = n, v = y(j, e, r), t = document.createElement("canvas"), d = t.getContext("2d");
+    if (d) {
+      t.width = e, t.height = r;
+      const b = new ImageData(
+        new Uint8ClampedArray(v),
+        e,
+        r
+      );
+      d.putImageData(b, 0, 0), p(t.toDataURL());
     }
-    const R = String(v.data?.error ?? "");
-    if (v.status !== 409 || R !== "missing_chunks")
-      throw new Error(R || `Complete failed (${v.status})`);
-    const g = await Oe(
-      J(`/api/rb/file-uploads/${encodeURIComponent(U)}/status`, p),
-      { headers: w ? { "X-Upload-Key": w } : void 0, signal: i?.signal }
-    );
-    if (!g.ok || !g.data?.ok)
-      throw new Error(g.data?.error ?? `Status failed (${g.status})`);
-    const S = Array.isArray(g.data?.received) ? g.data.received : [], E = new Set(S), P = [];
-    for (let m = 0; m < z; m += 1)
-      E.has(m) || P.push(m);
-    if (!P.length)
-      throw new Error("missing_chunks");
-    return await O(P, E.size), l();
-  }, j = await l();
-  return c(100), {
-    id: j,
-    url: J(`/api/rb/files/${encodeURIComponent(j)}`, p),
-    alt: t.name,
-    ...w ? { uploadKey: w } : {}
+  }, [n]), u(() => {
+    s.current && s.current.complete && l(!0);
+  }, [o]);
+  const h = () => {
+  }, x = () => {
   };
-};
-function _e({
-  item: t,
-  isHovered: c,
-  enableImagePreview: i,
-  renderItem: p,
-  onHoverEnter: u,
-  onHoverLeave: U,
-  onRemove: w,
-  onRetry: D,
-  startFullscreen: z,
-  isUploading: _,
-  isError: O,
-  tileClasses: X,
-  disabled: l,
-  isDraggingExternal: j,
-  removeButtonAriaLabel: v
-}) {
-  const { setNodeRef: R, attributes: g, listeners: S, transform: E, transition: P, isDragging: m } = Ee({
-    id: t.id,
-    disabled: l
-  }), K = A(null), $ = A(null), [F, V] = H(null), B = () => {
-    const d = K.current;
-    if (!d) return;
-    const h = d.getBoundingClientRect();
-    V({ left: h.left + h.width / 2, top: h.top - 10 });
-  };
-  T(() => {
-    if (!i || !c) {
-      V(null);
-      return;
-    }
-    B();
-    let d = 0;
-    const h = () => {
-      d && cancelAnimationFrame(d), d = requestAnimationFrame(() => {
-        d = 0, B();
-      });
-    };
-    return window.addEventListener("resize", h), window.addEventListener("scroll", h, !0), () => {
-      d && cancelAnimationFrame(d), window.removeEventListener("resize", h), window.removeEventListener("scroll", h, !0);
-    };
-  }, [i, c]);
-  const W = {
-    transform: Me.Transform.toString(E),
-    transition: P
-  }, q = p ? p({
-    file: { id: t.id, url: t.url, alt: t.alt, uploadKey: t.uploadKey },
-    previewUrl: t.previewUrl,
-    status: t.status,
-    progress: t.progress,
-    fileName: t.fileName
-  }) : i ? /* @__PURE__ */ r.jsx(
-    "img",
-    {
-      src: t.previewUrl,
-      alt: t.alt ?? "Uploaded file",
-      className: Q(
-        "size-full rounded-md object-cover",
-        _ && "opacity-75",
-        O && "grayscale"
-      )
-    }
-  ) : /* @__PURE__ */ r.jsx("div", { className: "flex size-full items-center justify-center rounded-md bg-slate-100 px-2 text-center text-[10px] font-medium text-slate-700 dark:bg-slate-800 dark:text-slate-200", children: /* @__PURE__ */ r.jsx("span", { className: "w-full truncate", children: t.fileName ?? t.alt ?? "Fichier" }) });
-  return /* @__PURE__ */ r.jsxs(
+  return /* @__PURE__ */ a.jsxs(
     "div",
     {
-      ref: (d) => {
-        K.current = d, R(d);
-      },
-      style: W,
-      className: Q(
-        X,
-        m && "z-20 ring-2 ring-primary shadow-xl",
-        j && "opacity-0",
-        !l && "cursor-grab active:cursor-grabbing",
-        m && "cursor-grabbing",
-        l && "cursor-default"
-      ),
-      onMouseEnter: () => {
-        B(), u();
-      },
-      onMouseLeave: (d) => {
-        const h = d.relatedTarget;
-        h instanceof Node && $.current?.contains(h) || U();
-      },
-      ...g,
-      ...S,
+      style: { position: "relative", overflow: "hidden" },
+      className: g,
+      onMouseEnter: h,
+      onMouseLeave: x,
       children: [
-        q,
-        /* @__PURE__ */ r.jsx(
-          "button",
+        c && !i && /* @__PURE__ */ a.jsx(
+          "img",
           {
-            type: "button",
-            onClick: () => {
-              l || w(t.id);
-            },
-            disabled: l,
-            className: "absolute right-1 top-1 inline-flex size-6 items-center justify-center rounded-full bg-white text-slate-700 shadow-sm transition hover:scale-105 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary dark:bg-slate-900 dark:text-slate-200",
-            "aria-label": v,
-            children: /* @__PURE__ */ r.jsx(ce, { className: "h-4 w-4" })
-          }
-        ),
-        i && c && F && (() => {
-          const d = /* @__PURE__ */ r.jsx(
-            "div",
-            {
-              ref: $,
-              className: "fixed z-[60] w-52 -translate-x-1/2 -translate-y-full rounded-xl border border-slate-200 bg-white/95 p-3 shadow-2xl backdrop-blur dark:border-slate-700 dark:bg-slate-900/95",
-              style: { left: F.left, top: F.top },
-              onMouseEnter: () => {
-                B(), u();
-              },
-              onMouseLeave: (h) => {
-                const x = h.relatedTarget;
-                x instanceof Node && K.current?.contains(x) || U();
-              },
-              children: /* @__PURE__ */ r.jsxs("div", { className: "relative overflow-hidden rounded-lg", children: [
-                /* @__PURE__ */ r.jsx("img", { src: t.url, alt: t.alt ?? "Preview", className: "h-40 w-full object-cover" }),
-                /* @__PURE__ */ r.jsx(
-                  "button",
-                  {
-                    type: "button",
-                    onClick: () => z(t.id),
-                    className: "absolute right-2 top-2 inline-flex items-center justify-center rounded-full bg-black/70 p-2 text-white transition hover:bg-black",
-                    "aria-label": "Plein écran",
-                    children: /* @__PURE__ */ r.jsx(Te, { className: "h-3.5 w-3.5" })
-                  }
-                )
-              ] })
-            }
-          );
-          return typeof document > "u" ? d : ie(d, document.body);
-        })(),
-        _ && /* @__PURE__ */ r.jsxs("div", { className: "absolute inset-0 z-20 flex flex-col items-center justify-center gap-2 rounded-lg bg-black/40 text-white", children: [
-          /* @__PURE__ */ r.jsx(De, { className: "h-5 w-5 animate-spin" }),
-          /* @__PURE__ */ r.jsx("div", { className: "h-1.5 w-5/6 rounded-full bg-white/20", children: /* @__PURE__ */ r.jsx("div", { className: "h-full rounded-full bg-primary", style: { width: `${t.progress}%` } }) }),
-          /* @__PURE__ */ r.jsxs("div", { className: "text-xs font-semibold", children: [
-            t.progress,
-            "%"
-          ] })
-        ] }),
-        O && /* @__PURE__ */ r.jsxs("div", { className: "absolute inset-0 z-10 flex flex-col items-center justify-center gap-2 rounded-lg bg-red-600/70 text-white", children: [
-          /* @__PURE__ */ r.jsx("div", { className: "text-xs font-semibold", children: "Échec" }),
-          /* @__PURE__ */ r.jsx(
-            "button",
-            {
-              type: "button",
-              onClick: () => D(t.id),
-              disabled: l,
-              className: "rounded-full bg-white/90 px-3 py-1 text-xs font-semibold text-red-700 shadow-sm transition hover:bg-white focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-white",
-              children: "Réessayer"
-            }
-          )
-        ] })
-      ]
-    }
-  );
-}
-function Xe(t) {
-  return URL.createObjectURL(t);
-}
-function Ze({
-  initialFiles: t = [],
-  onChange: c,
-  upload: i = Be,
-  uploadIsPublic: p = !1,
-  disabled: u = !1,
-  onUploadingChange: U,
-  accept: w,
-  renderHeader: D,
-  renderItem: z,
-  addButtonAriaLabel: _ = "Ajouter un fichier",
-  removeButtonAriaLabel: O = "Supprimer le fichier"
-}) {
-  const X = A(null), [l, j] = H(
-    () => t.map((e) => ({ ...e, previewUrl: e.url, status: "uploaded", progress: 100 }))
-  ), [v, R] = H(!1), [g, S] = H(null), [E, P] = H(null), [m, K] = H(null), $ = A(null), F = A(!0), V = A([]), B = A(t), W = A(c), q = A(U), d = A(/* @__PURE__ */ new Map()), h = A(/* @__PURE__ */ new Map()), x = A(/* @__PURE__ */ new Map()), C = A(/* @__PURE__ */ new Map()), de = ke(
-    ae(Se, { activationConstraint: { distance: 6 } }),
-    ae(Re, { coordinateGetter: ze })
-  );
-  T(() => () => {
-    for (const e of x.current.values())
-      try {
-        e.abort();
-      } catch {
-      }
-    x.current.clear(), h.current.clear(), d.current.clear();
-    for (const e of C.current.values())
-      if (typeof URL < "u")
-        try {
-          URL.revokeObjectURL(e);
-        } catch {
-        }
-    C.current.clear();
-  }, []), T(() => {
-    if (!(typeof document > "u")) {
-      if (m)
-        return document.body.style.cursor = "grabbing", () => {
-          document.body.style.cursor = "";
-        };
-      document.body.style.cursor = "";
-    }
-  }, [m]), T(() => {
-    V.current = l;
-  }, [l]), T(() => {
-    W.current = c;
-  }, [c]), T(() => {
-    q.current = U;
-  }, [U]), T(() => {
-    const e = B.current;
-    if (e.length === t.length && e.every((n, f) => {
-      const k = t[f];
-      return k && n.id === k.id && n.url === k.url && n.alt === k.alt;
-    })) return;
-    B.current = t;
-    const a = t.map((n) => ({
-      ...n,
-      previewUrl: n.url,
-      status: "uploaded",
-      progress: 100
-    })), b = new Set(a.map((n) => n.id));
-    for (const [n, f] of d.current.entries())
-      b.has(f) && d.current.delete(n);
-    const I = new Set(V.current.map((n) => n.id));
-    if (a.some((n) => {
-      const f = d.current.get(n.id);
-      return f ? I.has(f) : !1;
-    })) return;
-    const y = new Set(a.map((n) => n.id));
-    for (const n of V.current) {
-      if (y.has(n.id)) continue;
-      const f = x.current.get(n.id);
-      if (f) {
-        x.current.delete(n.id);
-        try {
-          f.abort();
-        } catch {
-        }
-      }
-      h.current.delete(n.id);
-      const k = C.current.get(n.id);
-      if (k) {
-        C.current.delete(n.id);
-        try {
-          URL.revokeObjectURL(k);
-        } catch {
-        }
-      }
-    }
-    j((n) => n.length === a.length && n.every((L, M) => {
-      const N = a[M];
-      return N && L.id === N.id && L.url === N.url && L.alt === N.alt && L.uploadKey === N.uploadKey;
-    }) ? n : (F.current = !0, a));
-  }, [t]), T(() => {
-    if (F.current) {
-      F.current = !1;
-      return;
-    }
-    W.current?.(l.map(({ id: e, url: o, alt: a, uploadKey: b }) => ({ id: e, url: o, alt: a, uploadKey: b })));
-  }, [l]), T(() => {
-    q.current?.(l.some((e) => e.status === "uploading"));
-  }, [l]), T(() => {
-    if (g === null)
-      return;
-    const e = (o) => {
-      if (o.key === "Escape") {
-        S(null);
-        return;
-      }
-      if (o.key === "ArrowRight") {
-        S((a) => a === null ? a : (a + 1) % l.length);
-        return;
-      }
-      o.key === "ArrowLeft" && S((a) => a === null ? a : (a - 1 + l.length) % l.length);
-    };
-    return window.addEventListener("keydown", e), () => window.removeEventListener("keydown", e);
-  }, [g, l.length]);
-  const ne = async (e) => {
-    if (u) return;
-    const a = Array.from(e).map((b) => {
-      const I = Xe(b), s = crypto.randomUUID();
-      C.current.set(s, I), h.current.set(s, b);
-      const y = {
-        id: s,
-        url: I,
-        previewUrl: I,
-        alt: b.name,
-        status: "uploading",
-        progress: 0,
-        fileName: b.name
-      };
-      j((k) => [...k, y]);
-      const n = (k) => {
-        const L = Math.max(0, Math.min(99, k));
-        j(
-          (M) => M.map(
-            (N) => N.id === s ? { ...N, progress: L, status: "uploading" } : N
-          )
-        );
-      };
-      return (async () => {
-        const k = new AbortController();
-        x.current.set(s, k);
-        try {
-          const L = await i(b, n, { signal: k.signal, isPublic: p });
-          d.current.set(s, L.id);
-          const M = C.current.get(s);
-          if (M) {
-            C.current.delete(s);
-            try {
-              URL.revokeObjectURL(M);
-            } catch {
-            }
-          }
-          x.current.delete(s), h.current.delete(s), j(
-            (N) => N.map(
-              (te) => te.id === s ? {
-                ...te,
-                ...L,
-                previewUrl: L.url,
-                url: L.url,
-                status: "uploaded",
-                progress: 100
-              } : te
-            )
-          );
-        } catch (L) {
-          if (x.current.delete(s), k.signal.aborted) {
-            h.current.delete(s);
-            const M = C.current.get(s);
-            if (M) {
-              C.current.delete(s);
-              try {
-                URL.revokeObjectURL(M);
-              } catch {
-              }
+            src: c,
+            style: {
+              position: "absolute",
+              top: 0,
+              left: 0,
+              width: "100%",
+              height: "100%",
+              objectFit: "cover"
             }
-            return;
-          }
-          console.error("Upload failed", L), j(
-            (M) => M.map(
-              (N) => N.id === s ? { ...N, status: "error", progress: Math.max(0, Math.min(99, N.progress)) } : N
-            )
-          );
-        }
-      })();
-    });
-    await Promise.allSettled(a);
-  }, fe = (e) => {
-    e.target.files && (ne(e.target.files), e.target.value = "");
-  }, pe = () => {
-    u || X.current?.click();
-  }, he = (e) => {
-    const o = x.current.get(e);
-    if (o) {
-      x.current.delete(e);
-      try {
-        o.abort();
-      } catch {
-      }
-    }
-    h.current.delete(e);
-    const a = C.current.get(e);
-    if (a) {
-      C.current.delete(e);
-      try {
-        URL.revokeObjectURL(a);
-      } catch {
-      }
-    }
-    j((b) => b.filter((I) => I.id !== e));
-  }, ge = (e) => {
-    if (u) return;
-    const o = h.current.get(e);
-    if (!o) return;
-    const a = x.current.get(e);
-    if (a) {
-      try {
-        a.abort();
-      } catch {
-      }
-      x.current.delete(e);
-    }
-    j(
-      (s) => s.map((y) => y.id === e ? { ...y, status: "uploading", progress: 0 } : y)
-    );
-    const b = (s) => {
-      const y = Math.max(0, Math.min(99, s));
-      j(
-        (n) => n.map((f) => f.id === e ? { ...f, progress: y, status: "uploading" } : f)
-      );
-    }, I = new AbortController();
-    x.current.set(e, I), (async () => {
-      try {
-        const s = await i(o, b, { signal: I.signal, isPublic: p });
-        d.current.set(e, s.id);
-        const y = C.current.get(e);
-        if (y) {
-          C.current.delete(e);
-          try {
-            URL.revokeObjectURL(y);
-          } catch {
-          }
-        }
-        x.current.delete(e), h.current.delete(e), j(
-          (n) => n.map(
-            (f) => f.id === e ? { ...f, ...s, previewUrl: s.url, url: s.url, status: "uploaded", progress: 100 } : f
-          )
-        );
-      } catch (s) {
-        if (x.current.delete(e), I.signal.aborted) return;
-        console.error("Retry failed", s), j((y) => y.map((n) => n.id === e ? { ...n, status: "error" } : n));
-      }
-    })();
-  }, me = (e) => {
-    const o = l.findIndex((a) => a.id === e);
-    o !== -1 && S(o);
-  }, be = (e) => {
-    K(String(e.active.id));
-  }, we = (e) => {
-    const { active: o, over: a } = e;
-    if (!a) {
-      K(null);
-      return;
-    }
-    const b = String(o.id), I = String(a.id);
-    b !== I && j((s) => {
-      const y = s.findIndex((f) => f.id === b), n = s.findIndex((f) => f.id === I);
-      return y === -1 || n === -1 ? s : Ae(s, y, n);
-    }), K(null);
-  }, ve = () => {
-    K(null);
-  }, se = () => {
-    $.current !== null && (window.clearTimeout($.current), $.current = null);
-  }, Y = re(() => g === null ? null : l[g] ?? null, [g, l]), xe = Q(
-    "rounded-xl border border-dashed border-slate-300 bg-white/70 p-4 shadow-sm transition-colors dark:border-slate-700 dark:bg-slate-900/60",
-    v && "border-primary ring-2 ring-primary/50",
-    u && "opacity-70"
-  ), oe = "group relative size-20 overflow-visible rounded-lg border border-slate-200 bg-slate-50 shadow-inner transition hover:shadow md:size-24 dark:border-slate-700 dark:bg-slate-800", G = re(() => {
-    if (w)
-      return Array.isArray(w) ? w.join(",") : w;
-  }, [w]), Z = re(() => {
-    if (z || !G) return !1;
-    const e = G.split(",").map((o) => o.trim()).filter(Boolean);
-    return e.length ? e.every((o) => o === "image/*" || o.startsWith("image/")) : !1;
-  }, [G, z]), ye = (e) => ({
-    file: { id: e.id, url: e.url, alt: e.alt, uploadKey: e.uploadKey },
-    previewUrl: e.previewUrl,
-    status: e.status,
-    progress: e.progress,
-    fileName: e.fileName
-  }), ee = m ? (() => {
-    const e = l.find((o) => o.id === m);
-    if (!e) return null;
-    if (z) {
-      const o = z(ye(e));
-      return o == null || o === !1 ? null : /* @__PURE__ */ r.jsx("div", { className: "pointer-events-none", children: /* @__PURE__ */ r.jsx("div", { className: "h-24 w-24 overflow-hidden rounded-lg shadow-2xl", children: o }) });
-    }
-    return Z ? /* @__PURE__ */ r.jsx("div", { className: "pointer-events-none", children: /* @__PURE__ */ r.jsx(
-      "img",
-      {
-        src: e.previewUrl,
-        alt: e.alt ?? "Dragged image",
-        className: "h-24 w-24 rounded-lg object-cover shadow-2xl"
-      }
-    ) }) : null;
-  })() : null, je = ee != null;
-  return /* @__PURE__ */ r.jsxs(
-    "div",
-    {
-      onDragOver: (e) => {
-        e.preventDefault(), u || R(!0);
-      },
-      onDragLeave: () => R(!1),
-      onDrop: (e) => {
-        e.preventDefault(), R(!1), e.dataTransfer.files?.length && ne(e.dataTransfer.files);
-      },
-      className: xe,
-      children: [
-        D ? /* @__PURE__ */ r.jsx("div", { className: "mb-3", children: D() }) : null,
-        /* @__PURE__ */ r.jsxs(
-          Ne,
-          {
-            sensors: u ? void 0 : de,
-            collisionDetection: Ue,
-            onDragStart: be,
-            onDragEnd: we,
-            onDragCancel: ve,
-            children: [
-              /* @__PURE__ */ r.jsx(Ce, { items: l.map((e) => e.id), strategy: Le, children: /* @__PURE__ */ r.jsxs("div", { className: "flex flex-wrap gap-3", children: [
-                l.map((e) => {
-                  const o = e.status === "uploading", a = e.status === "error";
-                  return /* @__PURE__ */ r.jsx(
-                    _e,
-                    {
-                      item: e,
-                      isHovered: E === e.id,
-                      enableImagePreview: Z,
-                      renderItem: z,
-                      onHoverEnter: () => {
-                        se(), P(e.id);
-                      },
-                      onHoverLeave: () => {
-                        se(), $.current = window.setTimeout(() => {
-                          P((b) => b === e.id ? null : b), $.current = null;
-                        }, 120);
-                      },
-                      onRemove: he,
-                      onRetry: ge,
-                      startFullscreen: me,
-                      isUploading: o,
-                      isError: a,
-                      tileClasses: oe,
-                      disabled: u,
-                      isDraggingExternal: je && m === e.id,
-                      removeButtonAriaLabel: O
-                    },
-                    e.id
-                  );
-                }),
-                /* @__PURE__ */ r.jsx(
-                  "button",
-                  {
-                    type: "button",
-                    onClick: pe,
-                    disabled: u,
-                    className: Q(
-                      oe,
-                      "flex items-center justify-center border-dashed bg-white text-slate-500 hover:border-slate-300 dark:bg-slate-900"
-                    ),
-                    "aria-label": _,
-                    children: /* @__PURE__ */ r.jsxs("div", { className: "flex flex-col items-center gap-1", children: [
-                      /* @__PURE__ */ r.jsx("div", { className: "flex size-9 items-center justify-center rounded-full border border-slate-300 bg-slate-100 text-slate-600 shadow-inner dark:border-slate-700 dark:bg-slate-800 dark:text-slate-200", children: /* @__PURE__ */ r.jsx(Pe, { className: "h-5 w-5" }) }),
-                      /* @__PURE__ */ r.jsx("span", { className: "text-xs font-medium", children: "Ajouter" })
-                    ] })
-                  }
-                )
-              ] }) }),
-              (() => {
-                const e = /* @__PURE__ */ r.jsx(Ie, { children: ee });
-                return typeof document > "u" ? e : ie(e, document.body);
-              })()
-            ]
           }
         ),
-        /* @__PURE__ */ r.jsx(
-          "input",
+        /* @__PURE__ */ a.jsx(
+          "img",
           {
-            ref: X,
-            type: "file",
-            accept: G,
-            multiple: !0,
-            className: "hidden",
-            onChange: fe,
-            "aria-hidden": !0
+            ref: s,
+            src: o,
+            alt: f,
+            style: {
+              width: "100%",
+              height: "100%",
+              objectFit: "cover",
+              display: i ? "block" : "none",
+              position: "absolute",
+              top: 0,
+              left: 0
+            },
+            onLoad: () => {
+              l(!0);
+            },
+            onError: (e) => console.error("Image failed to load:", o, e)
           }
-        ),
-        Z && Y && /* @__PURE__ */ r.jsxs("div", { className: "fixed inset-0 z-50 flex items-center justify-center bg-black/90", children: [
-          /* @__PURE__ */ r.jsx(
-            "button",
-            {
-              type: "button",
-              className: "absolute left-6 top-1/2 -translate-y-1/2 rounded-full bg-white/10 p-3 text-white shadow-lg transition hover:bg-white/20 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-white",
-              onClick: () => S((e) => e === null ? e : (e - 1 + l.length) % l.length),
-              "aria-label": "Précédent",
-              children: /* @__PURE__ */ r.jsx("svg", { viewBox: "0 0 24 24", className: "h-6 w-6", stroke: "currentColor", strokeWidth: 2, fill: "none", children: /* @__PURE__ */ r.jsx("path", { d: "M15 18l-6-6 6-6", strokeLinecap: "round", strokeLinejoin: "round" }) })
-            }
-          ),
-          /* @__PURE__ */ r.jsxs("div", { className: "relative max-h-[80vh] max-w-4xl", children: [
-            /* @__PURE__ */ r.jsx(
-              "img",
-              {
-                src: Y.url,
-                alt: Y.alt ?? "Fullscreen",
-                className: "max-h-[80vh] max-w-full rounded-lg object-contain shadow-2xl"
-              }
-            ),
-            /* @__PURE__ */ r.jsx(
-              "button",
-              {
-                type: "button",
-                className: "absolute right-3 top-3 inline-flex size-9 items-center justify-center rounded-full bg-black/70 text-white transition hover:bg-black focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-white",
-                onClick: () => S(null),
-                "aria-label": "Fermer",
-                children: /* @__PURE__ */ r.jsx(ce, { className: "h-5 w-5" })
-              }
-            )
-          ] }),
-          /* @__PURE__ */ r.jsx(
-            "button",
-            {
-              type: "button",
-              className: "absolute right-6 top-1/2 -translate-y-1/2 rounded-full bg-white/10 p-3 text-white shadow-lg transition hover:bg-white/20 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-white",
-              onClick: () => S((e) => e === null ? e : (e + 1) % l.length),
-              "aria-label": "Suivant",
-              children: /* @__PURE__ */ r.jsx("svg", { viewBox: "0 0 24 24", className: "h-6 w-6", stroke: "currentColor", strokeWidth: 2, fill: "none", children: /* @__PURE__ */ r.jsx("path", { d: "M9 6l6 6-6 6", strokeLinecap: "round", strokeLinejoin: "round" }) })
-            }
-          )
-        ] })
+        )
       ]
     }
   );
-}
+};
 export {
-  Ze as FilesUploadField
+  D as Image
 };
 //# sourceMappingURL=index14.js.map