@oneplatformdev/ui 0.1.99-beta.271 → 0.1.99-beta.273

package/Dropzone/Dropzone.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Dropzone.d.ts","sourceRoot":"","sources":["../../src/Dropzone/Dropzone.tsx"],"names":[],"mappings":"AAQA,OAAO,EAEL,eAAe,EACf,aAAa,EAEd,MAAM,kBAAkB,CAAC;AAwC1B;;;;;;;;;;;;;;;;;;GAkBG;AACH,eAAO,MAAM,QAAQ,2GAuapB,CAAC"}
+{"version":3,"file":"Dropzone.d.ts","sourceRoot":"","sources":["../../src/Dropzone/Dropzone.tsx"],"names":[],"mappings":"AAQA,OAAO,EAEL,eAAe,EACf,aAAa,EAEd,MAAM,kBAAkB,CAAC;AAkF1B;;;;;;;;;;;;;;;;;;GAkBG;AACH,eAAO,MAAM,QAAQ,2GA0bpB,CAAC"}

package/Dropzone/Dropzone.js

@@ -1,26 +1,63 @@
 import { jsxs as l, jsx as e, Fragment as Y } from "react/jsx-runtime";
-import { X as B, UploadIcon as ge, FileTextIcon as G, InfoIcon as we } from "lucide-react";
-import { forwardRef as Ne, useState as J, useEffect as ve, useImperativeHandle as Fe } from "react";
-import { useDropzone as be } from "react-dropzone";
-import { cn as m } from "@oneplatformdev/utils";
-import { Card as ye } from "../Card/Card.js";
-import { DEFAULT_FILE_TYPES as Ce } from "./Dropzone.types.js";
-import { FilePreview as ze } from "./DropzoneFilePreview.js";
-import { DropzoneSinglePickPreview as Ee } from "./DropzoneSinglePickPreview.js";
-import { isFile as v, extractName as De } from "./DropzoneUtils.js";
-import { Button as Ie } from "../Button/Button.js";
-const K = (f = 0) => `${(f / (1024 * 1024)).toFixed(0)} MB`, Me = (f, u) => {
-  if (f === u) return !0;
-  if (f.length !== u.length) return !1;
-  for (let p = 0; p < f.length; p++) {
-    const o = f[p], c = u[p];
-    if (o !== c) {
-      if (typeof o == "string" && typeof c == "string") {
-        if (o !== c) return !1;
+import { X as k, UploadIcon as Fe, FileTextIcon as Z, InfoIcon as ve } from "lucide-react";
+import { forwardRef as ye, useState as G, useEffect as Ie, useImperativeHandle as be } from "react";
+import { useDropzone as Ce } from "react-dropzone";
+import { cn as p } from "@oneplatformdev/utils";
+import { Card as ze } from "../Card/Card.js";
+import { DEFAULT_FILE_TYPES as Ee } from "./Dropzone.types.js";
+import { FilePreview as De } from "./DropzoneFilePreview.js";
+import { DropzoneSinglePickPreview as je } from "./DropzoneSinglePickPreview.js";
+import { isFile as v, isVideoUrl as Me, extractName as Se } from "./DropzoneUtils.js";
+import Be from "./icons/file-csv.svg.js";
+import ke from "./icons/file-doc.svg.js";
+import Re from "./icons/file-docx.svg.js";
+import K from "./icons/file-jpg.svg.js";
+import Ae from "./icons/file-pdf.svg.js";
+import We from "./icons/file-png.svg.js";
+import _e from "./icons/file-ppt.svg.js";
+import Pe from "./icons/file-pptx.svg.js";
+import Te from "./icons/file-rar.svg.js";
+import Xe from "./icons/file-svg.svg.js";
+import $e from "./icons/file-webp.svg.js";
+import Le from "./icons/file-xls.svg.js";
+import Oe from "./icons/file-xlsx.svg.js";
+import qe from "./icons/file-zip.svg.js";
+import { Button as He } from "../Button/Button.js";
+const Q = (r = 0) => `${(r / (1024 * 1024)).toFixed(0)} MB`, Je = {
+  csv: Be,
+  doc: ke,
+  docx: Re,
+  jpg: K,
+  jpeg: K,
+  pdf: Ae,
+  png: We,
+  ppt: _e,
+  pptx: Pe,
+  rar: Te,
+  svg: Xe,
+  webp: $e,
+  xls: Le,
+  xlsx: Oe,
+  zip: qe
+}, Ye = (r) => {
+  if (!r) return "";
+  const s = r.toLowerCase().split(".");
+  return s.length > 1 ? s[s.length - 1] : "";
+}, Ze = (r) => {
+  const s = Ye(r);
+  return Je[s] ?? null;
+}, Ge = (r, s) => {
+  if (r === s) return !0;
+  if (r.length !== s.length) return !1;
+  for (let x = 0; x < r.length; x++) {
+    const a = r[x], m = s[x];
+    if (a !== m) {
+      if (typeof a == "string" && typeof m == "string") {
+        if (a !== m) return !1;
         continue;
       }
-      if (v(o) && v(c)) {
-        if (o.name !== c.name || o.size !== c.size || o.type !== c.type || o.lastModified !== c.lastModified)
+      if (v(a) && v(m)) {
+        if (a.name !== m.name || a.size !== m.size || a.type !== m.type || a.lastModified !== m.lastModified)
           return !1;
         continue;
       }
@@ -28,113 +65,113 @@ const K = (f = 0) => `${(f / (1024 * 1024)).toFixed(0)} MB`, Me = (f, u) => {
     }
   }
   return !0;
-}, ke = Ne(
+}, Ke = ye(
   ({
-    acceptTypes: f = Ce,
-    maxSizeMB: u,
-    maxFiles: p = 1,
-    onErrors: o,
-    hideErrors: c = !1,
-    disabled: a = !1,
-    classNames: F,
-    value: g,
-    onChangeValue: S,
-    className: Q,
+    acceptTypes: r = Ee,
+    maxSizeMB: s,
+    maxFiles: x = 1,
+    onErrors: a,
+    hideErrors: m = !1,
+    disabled: d = !1,
+    classNames: y,
+    value: w,
+    onChangeValue: R,
+    className: U,
     labelDropzonePrompt: C = "Drop files here or click to select",
-    labelDropzoneSubPrompt: Z = "",
-    labelOrClickToSelect: U = "Upload file",
-    labelSelectedFiles: V = "Selected Files",
-    labelUploadErrors: ee = "Upload Errors",
-    labelFileTooLarge: j = "File is too large",
-    labelInvalidFileType: A = "Invalid file type",
-    labelVideoUploaded: te = "Uploaded",
-    labelVideoReplace: le = "Replace",
+    labelDropzoneSubPrompt: V = "",
+    labelOrClickToSelect: ee = "Upload file",
+    labelSelectedFiles: te = "Selected Files",
+    labelUploadErrors: le = "Upload Errors",
+    labelFileTooLarge: A = "File is too large",
+    labelInvalidFileType: W = "Invalid file type",
+    labelVideoUploaded: ie = "Uploaded",
+    labelVideoReplace: re = "Replace",
     singlePick: n = !1,
-    labelDropzoneClassname: ie,
-    labelDropzoneSubClassname: re,
-    isUploading: d = !1,
-    uploadProgress: R = 0,
-    uploadLoadedBytes: ne = 0,
-    uploadTotalBytes: se = 0,
-    onCancelUpload: W,
-    labelUploadingTitle: oe = "Uploading video...",
-    labelUploadingHint: ce = "Please do not close this page",
-    labelUploadingActionCancel: ae = "Cancel",
-    persistentDropzone: $ = !1,
-    previewVariant: w = "default",
+    labelDropzoneClassname: ne,
+    labelDropzoneSubClassname: oe,
+    isUploading: f = !1,
+    uploadProgress: _ = 0,
+    uploadLoadedBytes: se = 0,
+    uploadTotalBytes: ce = 0,
+    onCancelUpload: P,
+    labelUploadingTitle: ae = "Uploading video...",
+    labelUploadingHint: me = "Please do not close this page",
+    labelUploadingActionCancel: de = "Cancel",
+    persistentDropzone: T = !1,
+    previewVariant: N = "default",
     ...z
-  }, de) => {
-    const [i, b] = J(g ?? []), [x, _] = J([]), y = i[0], T = x[0]?.file, E = n && i.length > 0 && v(y), me = E && y.type.includes("image"), q = E && y.type.includes("video"), H = E && !me && !q, L = n && !i.length && !!T, h = H ? y : T, D = n && q, fe = D, I = n && i.length > 0, pe = (t, s) => {
-      _(s), o?.(s);
-      const r = n ? t.slice(0, 1) : [...i, ...t].slice(0, p);
-      b(r), S?.(r);
+  }, fe) => {
+    const [i, I] = G(w ?? []), [h, X] = G([]), g = i[0], E = h[0]?.file, pe = !!E?.type?.includes("image"), D = n && i.length > 0 && v(g), xe = D && g.type.includes("image"), $ = D && g.type.includes("video") || n && i.length > 0 && typeof g == "string" && Me(g), L = D && !xe && !$, O = n && !i.length && !!E && !pe, u = L ? g : E, b = Ze(u?.name), j = n && $, he = j, M = n && i.length > 0, ue = (t, c) => {
+      X(c), a?.(c);
+      const o = n ? t.slice(0, 1) : [...i, ...t].slice(0, x);
+      I(o), R?.(o);
     };
-    ve(() => {
-      g && !Me(i, g) && b(g);
-    }, [i, g]);
-    const M = (t, s) => {
-      if (a) return;
+    Ie(() => {
+      w && !Ge(i, w) && I(w);
+    }, [i, w]);
+    const S = (t, c) => {
+      if (d) return;
       t.stopPropagation();
-      const r = i.filter((N, k) => k !== s);
-      b(r), S?.(r);
-    }, { getRootProps: xe, getInputProps: he, isDragActive: ue, open: O } = be({
-      onDrop: pe,
-      accept: f.reduce((t, s) => (t[s] = [], t), {}),
-      maxSize: u * 1024 * 1024,
-      maxFiles: n ? 1 : p,
-      disabled: a || d,
+      const o = i.filter((F, B) => B !== c);
+      I(o), R?.(o);
+    }, { getRootProps: ge, getInputProps: we, isDragActive: Ne, open: q } = Ce({
+      onDrop: ue,
+      accept: r.reduce((t, c) => (t[c] = [], t), {}),
+      maxSize: s * 1024 * 1024,
+      maxFiles: n ? 1 : x,
+      disabled: d || f,
       noClick: !0
     });
-    Fe(de, () => ({
-      setItems: b
+    be(fe, () => ({
+      setItems: I
     }), []);
-    const P = !d && !n && $ && i.length > 0, X = !d && !n && i.length > 0 && /* @__PURE__ */ l("div", { className: m("w-full mt-2", F?.previewWrapper), children: [
-      w === "default" && /* @__PURE__ */ l("pre", { className: "font-semibold text-gray-600", children: [
-        V,
+    const H = !f && !n && T && i.length > 0, J = !f && !n && i.length > 0 && /* @__PURE__ */ l("div", { className: p("w-full mt-2", y?.previewWrapper), children: [
+      N === "default" && /* @__PURE__ */ l("pre", { className: "font-semibold text-gray-600", children: [
+        te,
         ":"
       ] }),
       /* @__PURE__ */ e(
         "ul",
         {
-          className: m(
+          className: p(
             "mt-2 text-sm text-gray-500 flex flex-wrap items-start",
-            w === "image-grid" ? "gap-2 justify-start" : "gap-4 justify-center"
+            N === "image-grid" ? "gap-2 justify-start" : "gap-4 justify-center"
           ),
-          children: i.map((t, s) => {
-            const r = v(t) ? t.name : De(t), N = v(t) ? (t.size / (1024 * 1024)).toFixed(2) + " MB" : "";
+          children: i.map((t, c) => {
+            const o = v(t) ? t.name : Se(t), F = v(t) ? (t.size / (1024 * 1024)).toFixed(2) + " MB" : "";
             return /* @__PURE__ */ l(
               "li",
               {
-                className: m(
+                className: p(
                   "relative",
-                  w === "image-grid" ? "w-[75px] h-[75px]" : "flex flex-col items-center gap-2"
+                  N === "image-grid" ? "w-[75px] h-[75px]" : "flex flex-col items-center gap-2"
                 ),
                 children: [
                   /* @__PURE__ */ l("div", { className: "relative w-full h-full", children: [
-                    /* @__PURE__ */ e(ze, { item: t, styles: F }),
+                    /* @__PURE__ */ e(De, { item: t, styles: y }),
                     /* @__PURE__ */ e(
                       "div",
                       {
-                        className: m(
+                        className: p(
                           "absolute top-0 right-0 cursor-pointer bg-gray-300 rounded-sm",
-                          w === "image-grid" && "top-1 right-1 bg-white/90 rounded-full p-0.5"
+                          N === "image-grid" && "top-1 right-1 bg-white/90 rounded-full p-0.5"
                         ),
-                        onClick: (k) => M(k, s),
-                        children: /* @__PURE__ */ e(B, { size: 16, strokeWidth: 1, color: "black" })
+                        onClick: (B) => S(B, c),
+                        children: /* @__PURE__ */ e(k, { size: 16, strokeWidth: 1, color: "black" })
                       }
                     )
                   ] }),
-                  w === "default" && /* @__PURE__ */ l("span", { className: "inline-flex flex-col items-center", children: [
-                    /* @__PURE__ */ e("span", { className: "max-w-[80px] text-ellipsis overflow-hidden whitespace-nowrap", children: r }),
-                    N && /* @__PURE__ */ l("span", { children: [
+                  N === "default" && /* @__PURE__ */ l("span", { className: "inline-flex flex-col items-center", children: [
+                    /* @__PURE__ */ e("span", { className: "max-w-[80px] text-ellipsis overflow-hidden whitespace-nowrap", children: o }),
+                    F && /* @__PURE__ */ l("span", { children: [
                       "(",
-                      N,
+                      F,
                       ")"
                     ] })
                   ] })
                 ]
               },
-              s
+              c
             );
           })
         }
@@ -142,35 +179,35 @@ const K = (f = 0) => `${(f / (1024 * 1024)).toFixed(0)} MB`, Me = (f, u) => {
     ] });
     return /* @__PURE__ */ l("div", { className: "w-full", children: [
       /* @__PURE__ */ l(
-        ye,
+        ze,
         {
           ...z,
-          ...xe({
+          ...ge({
             onClick: (t) => {
-              if (!(a || d)) {
-                if (fe) {
+              if (!(d || f)) {
+                if (he) {
                   z.onClick?.(t);
                   return;
                 }
-                O(), z.onClick?.(t);
+                q(), z.onClick?.(t);
               }
             }
           }),
-          className: m(
+          className: p(
             "w-full text-center flex flex-col items-center justify-center gap-6 cursor-pointer",
-            !I && "border border-dashed border-[#9368FF80] rounded-[8px] bg-[#FCFCFC] p-4",
-            I && "min-h-0 border-0 bg-transparent p-0",
-            a && "border-[#E4E4E7] pointer-events-none",
-            x.length > 0 && !I && "border-red-500",
-            ue && "bg-gray-100",
+            !M && "border border-dashed border-[#9368FF80] rounded-[8px] bg-[#FCFCFC] p-4",
+            M && "min-h-0 border-0 bg-transparent p-0",
+            d && "border-[#E4E4E7] pointer-events-none",
+            h.length > 0 && !M && "border-red-500",
+            Ne && "bg-gray-100",
             n && "shadow-none!",
-            n && i.length > 0 && !D && "p-0! shadow-none!",
-            D && "h-auto! max-h-none! min-h-0! p-2!",
-            Q
+            n && i.length > 0 && !j && "p-0! shadow-none!",
+            j && "h-auto! max-h-none! min-h-0! p-2!",
+            U
           ),
           children: [
-            /* @__PURE__ */ e("input", { ...he() }),
-            d && /* @__PURE__ */ l(
+            /* @__PURE__ */ e("input", { ...we() }),
+            f && /* @__PURE__ */ l(
               "div",
               {
                 className: "w-full h-full min-h-46 rounded-lg border border-[#E4E4E7] bg-[#FCFCFC] flex flex-col items-center justify-center gap-4 p-4",
@@ -179,56 +216,56 @@ const K = (f = 0) => `${(f / (1024 * 1024)).toFixed(0)} MB`, Me = (f, u) => {
                   /* @__PURE__ */ l("div", { className: "relative h-24 w-24", children: [
                     /* @__PURE__ */ e("svg", { className: "h-24 w-24", viewBox: "0 0 100 100", children: /* @__PURE__ */ e("circle", { cx: "50", cy: "50", r: "42", stroke: "#E6E1F5", strokeWidth: "8", fill: "none" }) }),
                     /* @__PURE__ */ l("span", { className: "absolute inset-0 flex items-center justify-center text-lg font-semibold text-foreground", children: [
-                      Math.max(0, Math.min(100, Math.round(R))),
+                      Math.max(0, Math.min(100, Math.round(_))),
                       "%"
                     ] })
                   ] }),
                   /* @__PURE__ */ l("div", { className: "text-center", children: [
-                    /* @__PURE__ */ e("p", { className: "text-xl font-semibold text-foreground", children: oe }),
+                    /* @__PURE__ */ e("p", { className: "text-xl font-semibold text-foreground", children: ae }),
                     /* @__PURE__ */ l("p", { className: "text-sm text-[#666A78]", children: [
-                      K(ne),
+                      Q(se),
                       " of ",
-                      K(se)
+                      Q(ce)
                     ] }),
-                    /* @__PURE__ */ e("p", { className: "mt-2 text-sm text-[#666A78]", children: ce })
+                    /* @__PURE__ */ e("p", { className: "mt-2 text-sm text-[#666A78]", children: me })
                   ] }),
                   /* @__PURE__ */ e("div", { className: "w-full max-w-[520px] h-2 rounded-full bg-[#E6E1F5] overflow-hidden", children: /* @__PURE__ */ e(
                     "div",
                     {
                       className: "h-full bg-[#9368FF] transition-[width] duration-150 ease-linear",
-                      style: { width: `${Math.max(0, Math.min(100, R))}%` }
+                      style: { width: `${Math.max(0, Math.min(100, _))}%` }
                     }
                   ) }),
-                  W && /* @__PURE__ */ e(
+                  P && /* @__PURE__ */ e(
                     "button",
                     {
                       type: "button",
                       className: "mt-1 h-10 min-w-36 rounded-md border border-[#E4E4E7] bg-white px-6 text-base font-medium text-foreground cursor-pointer",
                       onClick: (t) => {
-                        t.stopPropagation(), W();
+                        t.stopPropagation(), P();
                       },
-                      children: ae
+                      children: de
                     }
                   )
                 ]
               }
             ),
-            !d && (i.length === 0 || !n && $) && x.length === 0 && /* @__PURE__ */ l(
+            !f && (i.length === 0 || !n && T) && h.length === 0 && /* @__PURE__ */ l(
               "div",
               {
-                className: m(
+                className: p(
                   "flex flex-col items-center gap-2 w-full",
-                  F?.idleWrapper
+                  y?.idleWrapper
                 ),
                 children: [
-                  /* @__PURE__ */ e("div", { className: "flex size-12 items-center justify-center rounded-full bg-[#9368FF1F]", children: /* @__PURE__ */ e(ge, { className: "size-6 text-[#9368FF]" }) }),
-                  /* @__PURE__ */ e("div", { className: "flex flex-col items-center gap-1 w-full", children: !a && /* @__PURE__ */ l(Y, { children: [
+                  /* @__PURE__ */ e("div", { className: "flex size-12 items-center justify-center rounded-full bg-[#9368FF1F]", children: /* @__PURE__ */ e(Fe, { className: "size-6 text-[#9368FF]" }) }),
+                  /* @__PURE__ */ e("div", { className: "flex flex-col items-center gap-1 w-full", children: !d && /* @__PURE__ */ l(Y, { children: [
                     /* @__PURE__ */ e(
                       "span",
                       {
-                        className: m(
+                        className: p(
                           "font-semibold text-[14px] leading-[125%] text-[#06080D] text-center w-full whitespace-pre-line",
-                          ie
+                          ne
                         ),
                         children: C
                       }
@@ -236,43 +273,43 @@ const K = (f = 0) => `${(f / (1024 * 1024)).toFixed(0)} MB`, Me = (f, u) => {
                     /* @__PURE__ */ e(
                       "span",
                       {
-                        className: m(
+                        className: p(
                           "font-medium text-[12px] leading-[120%] text-[#666A78] text-center w-full whitespace-pre-line",
-                          re
+                          oe
                         ),
-                        children: Z
+                        children: V
                       }
                     )
                   ] }) }),
-                  !a && /* @__PURE__ */ e(
-                    Ie,
+                  !d && /* @__PURE__ */ e(
+                    He,
                     {
                       type: "button",
                       size: "md",
-                      children: U
+                      children: ee
                     }
                   )
                 ]
               }
             ),
-            !d && x.length > 0 && !L && /* @__PURE__ */ l("div", { className: m("w-full mt-4", F?.errorWrapper), children: [
+            !f && h.length > 0 && !O && /* @__PURE__ */ l("div", { className: p("w-full mt-4", y?.errorWrapper), children: [
               /* @__PURE__ */ l("span", { className: "font-semibold text-red-500", children: [
-                ee,
+                le,
                 ":"
               ] }),
-              /* @__PURE__ */ e("ul", { className: "mt-2 text-sm text-red-500 list-disc list-inside", children: x.map((t, s) => /* @__PURE__ */ l("li", { children: [
+              /* @__PURE__ */ e("ul", { className: "mt-2 text-sm text-red-500 list-disc list-inside", children: h.map((t, c) => /* @__PURE__ */ l("li", { children: [
                 t.file.name,
                 " (",
                 (t.file.size / (1024 * 1024)).toFixed(2),
                 " MB)",
-                !c && /* @__PURE__ */ e("ul", { className: "ml-4 list-disc list-inside", children: t.errors.map((r, N) => /* @__PURE__ */ l("li", { children: [
-                  r.code === "file-too-large" && j,
-                  r.code === "file-invalid-type" && A,
-                  r.code !== "file-too-large" && r.code !== "file-invalid-type" && r.message
-                ] }, N)) })
-              ] }, s)) })
+                !m && /* @__PURE__ */ e("ul", { className: "ml-4 list-disc list-inside", children: t.errors.map((o, F) => /* @__PURE__ */ l("li", { children: [
+                  o.code === "file-too-large" && A,
+                  o.code === "file-invalid-type" && W,
+                  o.code !== "file-too-large" && o.code !== "file-invalid-type" && o.message
+                ] }, F)) })
+              ] }, c)) })
             ] }),
-            !d && !!(n && i.length) && /* @__PURE__ */ e(Y, { children: H ? /* @__PURE__ */ l(
+            !f && !!(n && i.length) && /* @__PURE__ */ e(Y, { children: L ? /* @__PURE__ */ l(
               "div",
               {
                 className: "w-full max-w-[502px] flex flex-col items-center gap-4",
@@ -280,36 +317,43 @@ const K = (f = 0) => `${(f / (1024 * 1024)).toFixed(0)} MB`, Me = (f, u) => {
                 children: [
                   /* @__PURE__ */ e("p", { className: "w-full text-center text-[16px] leading-[130%] font-semibold text-[#06080D]", children: C }),
                   /* @__PURE__ */ l("div", { className: "w-full min-h-[72px] rounded-[8px] bg-[#F5F5F5] p-4 flex items-center gap-4", children: [
-                    /* @__PURE__ */ e("div", { className: "size-10 rounded-[8px] bg-[#DC2626] text-white flex items-center justify-center shrink-0", children: /* @__PURE__ */ e(G, { size: 20 }) }),
+                    b ? /* @__PURE__ */ e(
+                      "img",
+                      {
+                        src: b,
+                        alt: "",
+                        className: "size-10 shrink-0"
+                      }
+                    ) : /* @__PURE__ */ e("div", { className: "size-10 rounded-[8px] bg-[#DC2626] text-white flex items-center justify-center shrink-0", children: /* @__PURE__ */ e(Z, { size: 20 }) }),
                     /* @__PURE__ */ l("div", { className: "flex flex-col items-start text-left gap-1 min-w-0 flex-1", children: [
-                      /* @__PURE__ */ e("span", { className: "w-full text-[14px] font-semibold leading-[125%] text-[#06080D] truncate", children: h?.name }),
-                      /* @__PURE__ */ e("span", { className: "w-full text-[12px] font-medium leading-[120%] text-[#666A78]", children: h ? `${(h.size / (1024 * 1024)).toFixed(0)} MB` : "" })
+                      /* @__PURE__ */ e("span", { className: "w-full text-[14px] font-semibold leading-[125%] text-[#06080D] truncate", children: u?.name }),
+                      /* @__PURE__ */ e("span", { className: "w-full text-[12px] font-medium leading-[120%] text-[#666A78]", children: u ? `${(u.size / (1024 * 1024)).toFixed(0)} MB` : "" })
                     ] }),
-                    !a && /* @__PURE__ */ e(
+                    !d && /* @__PURE__ */ e(
                       "div",
                       {
                         className: "size-6 flex items-center justify-center cursor-pointer",
-                        onClick: (t) => M(t, 0),
-                        children: /* @__PURE__ */ e(B, { size: 24, color: "#06080D" })
+                        onClick: (t) => S(t, 0),
+                        children: /* @__PURE__ */ e(k, { size: 24, color: "#06080D" })
                       }
                     )
                   ] })
                 ]
               }
             ) : /* @__PURE__ */ e(
-              Ee,
+              je,
               {
                 item: i[0],
-                onRemoveClick: (t) => M(t, 0),
+                onRemoveClick: (t) => S(t, 0),
                 onReplaceClick: (t) => {
-                  t.stopPropagation(), !a && O();
+                  t.stopPropagation(), !d && q();
                 },
-                labelUploaded: te,
-                labelReplace: le,
-                disabled: a
+                labelUploaded: ie,
+                labelReplace: re,
+                disabled: d
               }
             ) }),
-            !d && L && /* @__PURE__ */ l(
+            !f && O && /* @__PURE__ */ l(
               "div",
               {
                 className: "w-full max-w-[502px] flex flex-col items-center gap-4",
@@ -317,39 +361,46 @@ const K = (f = 0) => `${(f / (1024 * 1024)).toFixed(0)} MB`, Me = (f, u) => {
                 children: [
                   /* @__PURE__ */ e("p", { className: "w-full text-center text-[16px] leading-[130%] font-semibold text-[#06080D]", children: C }),
                   /* @__PURE__ */ l("div", { className: "w-full min-h-[72px] rounded-[8px] bg-[#F5F5F5] p-4 flex items-center gap-4", children: [
-                    /* @__PURE__ */ e("div", { className: "size-10 rounded-[8px] bg-[#DC2626] text-white flex items-center justify-center shrink-0", children: /* @__PURE__ */ e(G, { size: 20 }) }),
+                    b ? /* @__PURE__ */ e(
+                      "img",
+                      {
+                        src: b,
+                        alt: "",
+                        className: "size-10 shrink-0"
+                      }
+                    ) : /* @__PURE__ */ e("div", { className: "size-10 rounded-[8px] bg-[#DC2626] text-white flex items-center justify-center shrink-0", children: /* @__PURE__ */ e(Z, { size: 20 }) }),
                     /* @__PURE__ */ l("div", { className: "flex flex-col items-start text-left gap-1 min-w-0 flex-1", children: [
-                      /* @__PURE__ */ e("span", { className: "w-full text-[14px] font-semibold leading-[125%] text-[#06080D] truncate", children: h?.name }),
-                      /* @__PURE__ */ e("span", { className: "w-full text-[12px] font-medium leading-[120%] text-[#666A78]", children: h ? `${(h.size / (1024 * 1024)).toFixed(0)} MB` : "" })
+                      /* @__PURE__ */ e("span", { className: "w-full text-[14px] font-semibold leading-[125%] text-[#06080D] truncate", children: u?.name }),
+                      /* @__PURE__ */ e("span", { className: "w-full text-[12px] font-medium leading-[120%] text-[#666A78]", children: u ? `${(u.size / (1024 * 1024)).toFixed(0)} MB` : "" })
                     ] }),
-                    !a && /* @__PURE__ */ e(
+                    !d && /* @__PURE__ */ e(
                       "div",
                       {
                         className: "size-6 flex items-center justify-center cursor-pointer",
                         onClick: (t) => {
-                          t.stopPropagation(), _([]);
+                          t.stopPropagation(), X([]);
                         },
-                        children: /* @__PURE__ */ e(B, { size: 24, color: "#06080D" })
+                        children: /* @__PURE__ */ e(k, { size: 24, color: "#06080D" })
                       }
                     )
                   ] }),
                   /* @__PURE__ */ l("div", { className: "w-full bg-[#DC26260F] p-4 flex items-start gap-4", children: [
-                    /* @__PURE__ */ e(we, { size: 20, color: "#DC2626" }),
-                    /* @__PURE__ */ e("p", { className: "text-[12px] leading-[120%] font-medium text-[#DC2626] text-left", children: x[0]?.errors?.[0]?.code === "file-too-large" ? j : x[0]?.errors?.[0]?.message || A })
+                    /* @__PURE__ */ e(ve, { size: 20, color: "#DC2626" }),
+                    /* @__PURE__ */ e("p", { className: "text-[12px] leading-[120%] font-medium text-[#DC2626] text-left", children: h[0]?.errors?.[0]?.code === "file-too-large" ? A : h[0]?.errors?.[0]?.message || W })
                   ] })
                 ]
               }
             ),
-            !P && X
+            !H && J
           ]
         }
       ),
-      P && /* @__PURE__ */ e("div", { className: "w-full", children: X })
+      H && /* @__PURE__ */ e("div", { className: "w-full", children: J })
     ] });
   }
 );
-ke.displayName = "Dropzone";
+Ke.displayName = "Dropzone";
 export {
-  ke as Dropzone
+  Ke as Dropzone
 };
 //# sourceMappingURL=Dropzone.js.map