@adamosuiteservices/ui 2.17.1 → 2.18.1

package/dist/file-upload.js

@@ -1,32 +1,32 @@
-import { j as e } from "./jsx-runtime-BzflLqGi.js";
-import { B as O } from "./button-BnUlAtuD.js";
-import { I as L } from "./icon-BFQz1tQC.js";
-import { T as y } from "./typography-MnY0LQoZ.js";
+import { j as t } from "./jsx-runtime-BzflLqGi.js";
+import { B } from "./button-BnUlAtuD.js";
+import { I as A } from "./icon-BFQz1tQC.js";
+import { T as $ } from "./typography-MnY0LQoZ.js";
 import { c as v } from "./index-CRiPKpXj.js";
-import { useState as B, useRef as W, useEffect as X } from "react";
-function Y({
-  isDragging: n,
+import { useState as U, useRef as P, useEffect as F } from "react";
+function S({
+  isDragging: i,
   isMultiple: d,
   invalid: a,
   disabled: r,
   accept: m,
-  acceptedExtensions: l,
-  maxSizeInMB: c,
-  maxFiles: x,
-  labels: f,
-  input: b,
-  onDragOver: D,
+  acceptedExtensions: c,
+  maxSizeInMB: h,
+  maxFiles: f,
+  labels: l,
+  input: p,
+  onDragOver: g,
   onDragLeave: w,
-  onDrop: C,
-  onFileChange: A
+  onDrop: j,
+  onFileChange: T
 }) {
-  const p = b?.id || `file-upload-${Math.random().toString(36).substring(2, 11)}`;
-  return /* @__PURE__ */ e.jsxs(
+  const y = p?.id || `file-upload-${Math.random().toString(36).substring(2, 11)}`;
+  return /* @__PURE__ */ t.jsxs(
     "div",
     {
-      onDragOver: r ? void 0 : D,
+      onDragOver: r ? void 0 : g,
       onDragLeave: r ? void 0 : w,
-      onDrop: r ? void 0 : C,
+      onDrop: r ? void 0 : j,
       className: v(
         `
           adm:flex adm:flex-col adm:items-center adm:gap-6 adm:rounded-2xl
@@ -34,22 +34,22 @@ function Y({
         `,
         "adm:border-dashed adm:bg-background adm:p-6 adm:transition-colors",
         {
-          "adm:border-primary": n && !a && !r,
+          "adm:border-primary": i && !a && !r,
           "adm:border-destructive": a && !r,
-          "adm:border-input": !n && !a,
+          "adm:border-input": !i && !a,
           "adm:cursor-not-allowed adm:opacity-50": r
         }
       ),
       children: [
-        /* @__PURE__ */ e.jsx(
+        /* @__PURE__ */ t.jsx(
           "div",
           {
             className: v(
               "adm:flex adm:items-center adm:justify-center adm:rounded-xl adm:p-2.5",
               a && !r ? "adm:bg-destructive/10" : "adm:bg-primary-50"
             ),
-            children: /* @__PURE__ */ e.jsx(
-              L,
+            children: /* @__PURE__ */ t.jsx(
+              A,
               {
                 symbol: "text_snippet",
                 className: a && !r ? "adm:text-destructive" : "adm:text-primary"
@@ -57,24 +57,24 @@ function Y({
             )
           }
         ),
-        /* @__PURE__ */ e.jsxs("div", { className: "adm:flex adm:flex-col adm:items-center adm:gap-2", children: [
-          /* @__PURE__ */ e.jsx(y, { color: a && !r ? "destructive" : void 0, children: f?.dragDrop || (d ? "Drag and drop your files here or" : "Drag and drop your file here or") }),
-          /* @__PURE__ */ e.jsxs("label", { htmlFor: p, children: [
-            /* @__PURE__ */ e.jsx(
+        /* @__PURE__ */ t.jsxs("div", { className: "adm:flex adm:flex-col adm:items-center adm:gap-2", children: [
+          /* @__PURE__ */ t.jsx($, { color: a && !r ? "destructive" : void 0, children: l?.dragDrop || (d ? "Drag and drop your files here or" : "Drag and drop your file here or") }),
+          /* @__PURE__ */ t.jsxs("label", { htmlFor: y, children: [
+            /* @__PURE__ */ t.jsx(
               "input",
               {
-                ...b,
-                id: p,
+                ...p,
+                id: y,
                 type: "file",
                 accept: m,
                 multiple: d,
-                onChange: A,
+                onChange: T,
                 disabled: r,
                 className: "adm:hidden"
               }
             ),
-            /* @__PURE__ */ e.jsx(
-              O,
+            /* @__PURE__ */ t.jsx(
+              B,
               {
                 asChild: !0,
                 type: "button",
@@ -83,18 +83,18 @@ function Y({
               adm:pointer-events-none
             `),
                 disabled: r,
-                children: /* @__PURE__ */ e.jsx("span", { children: f?.selectFile || (d ? "Select files" : "Select the file") })
+                children: /* @__PURE__ */ t.jsx("span", { children: l?.selectFile || (d ? "Select files" : "Select the file") })
               }
             )
           ] })
         ] }),
-        /* @__PURE__ */ e.jsx(y, { className: "adm:text-center", color: a && !r ? "destructive" : "muted", children: f?.fileRequirements || (l && l.length > 0 ? `Allowed files: ${l.join(", ")}. Maximum size ${c} MB${d ? `. Up to ${x} files` : ""}.` : `Maximum size ${c} MB${d ? `. Up to ${x} files` : ""}.`) })
+        /* @__PURE__ */ t.jsx($, { className: "adm:text-center", color: a && !r ? "destructive" : "muted", children: l?.fileRequirements || (c && c.length > 0 ? `Allowed files: ${c.join(", ")}. Maximum size ${h} MB${d ? `. Up to ${f} files` : ""}.` : `Maximum size ${h} MB${d ? `. Up to ${f} files` : ""}.`) })
       ]
     }
   );
 }
-function Z({ file: n, invalid: d, disabled: a, onRemove: r }) {
-  return /* @__PURE__ */ e.jsxs(
+function ee({ file: i, invalid: d, disabled: a, onRemove: r }) {
+  return /* @__PURE__ */ t.jsxs(
     "div",
     {
       className: v(
@@ -103,15 +103,15 @@ function Z({ file: n, invalid: d, disabled: a, onRemove: r }) {
         a && "adm:cursor-not-allowed adm:opacity-50"
       ),
       children: [
-        /* @__PURE__ */ e.jsx(
+        /* @__PURE__ */ t.jsx(
           "div",
           {
             className: v(
               "adm:flex adm:items-center adm:justify-center adm:rounded-xl adm:p-2.5",
               d && !a ? "adm:bg-destructive/10" : "adm:bg-primary-50"
             ),
-            children: /* @__PURE__ */ e.jsx(
-              L,
+            children: /* @__PURE__ */ t.jsx(
+              A,
               {
                 symbol: "text_snippet",
                 className: d && !a ? "adm:text-destructive" : "adm:text-primary"
@@ -119,199 +119,206 @@ function Z({ file: n, invalid: d, disabled: a, onRemove: r }) {
             )
           }
         ),
-        /* @__PURE__ */ e.jsxs(
+        /* @__PURE__ */ t.jsxs(
           "div",
           {
             className: `
         adm:flex adm:min-w-0 adm:flex-1 adm:items-start adm:gap-3
       `,
             children: [
-              /* @__PURE__ */ e.jsx("div", { className: "adm:min-w-0 adm:flex-1", children: /* @__PURE__ */ e.jsx(y, { className: "adm:truncate adm:font-semibold", children: n.name }) }),
-              /* @__PURE__ */ e.jsxs(y, { className: "adm:shrink-0", color: "muted", children: [
-                (n.size / 1024 / 1024).toFixed(1),
+              /* @__PURE__ */ t.jsx("div", { className: "adm:min-w-0 adm:flex-1", children: /* @__PURE__ */ t.jsx($, { className: "adm:truncate adm:font-semibold", children: i.name }) }),
+              /* @__PURE__ */ t.jsxs($, { className: "adm:shrink-0", color: "muted", children: [
+                (i.size / 1024 / 1024).toFixed(1),
                 " MB"
               ] })
             ]
           }
         ),
-        /* @__PURE__ */ e.jsx(
-          O,
+        /* @__PURE__ */ t.jsx(
+          B,
           {
             variant: "destructive-medium",
             onClick: r,
             type: "button",
             disabled: a,
-            children: /* @__PURE__ */ e.jsx(L, { symbol: "delete", className: "adm:text-destructive" })
+            children: /* @__PURE__ */ t.jsx(A, { symbol: "delete", className: "adm:text-destructive" })
           }
         )
       ]
     }
   );
 }
-function I({ files: n, isMultiple: d, invalid: a, disabled: r, labels: m, onRemoveFile: l, onClearAll: c }) {
-  return n.length === 0 ? null : /* @__PURE__ */ e.jsxs("div", { className: "adm:flex adm:flex-col adm:gap-3", children: [
-    d && n.length > 1 && /* @__PURE__ */ e.jsxs("div", { className: "adm:flex adm:items-center adm:justify-between", children: [
-      /* @__PURE__ */ e.jsx(y, { className: "adm:text-sm adm:font-medium", color: a && !r ? "destructive" : void 0, children: m?.filesSelected?.(n.length) || `${n.length} file${n.length !== 1 ? "s" : ""} selected` }),
-      /* @__PURE__ */ e.jsx(
-        O,
+function R({ files: i, isMultiple: d, invalid: a, disabled: r, labels: m, onRemoveFile: c, onClearAll: h }) {
+  return i.length === 0 ? null : /* @__PURE__ */ t.jsxs("div", { className: "adm:flex adm:flex-col adm:gap-3", children: [
+    d && i.length > 1 && /* @__PURE__ */ t.jsxs("div", { className: "adm:flex adm:items-center adm:justify-between", children: [
+      /* @__PURE__ */ t.jsx($, { className: "adm:text-sm adm:font-medium", color: a && !r ? "destructive" : void 0, children: m?.filesSelected?.(i.length) || `${i.length} file${i.length !== 1 ? "s" : ""} selected` }),
+      /* @__PURE__ */ t.jsx(
+        B,
         {
           variant: "ghost",
           size: "sm",
-          onClick: c,
+          onClick: h,
           type: "button",
           disabled: r,
           children: "Clear all"
         }
       )
     ] }),
-    n.map((x, f) => /* @__PURE__ */ e.jsx(
-      Z,
+    i.map((f, l) => /* @__PURE__ */ t.jsx(
+      ee,
       {
-        file: x,
+        file: f,
         invalid: a,
         disabled: r,
-        onRemove: () => l(f)
+        onRemove: () => c(l)
       },
-      `${x.name}-${f}`
+      `${f.name}-${l}`
     ))
   ] });
 }
-function ae({
-  className: n,
+function de({
+  className: i,
   selectedFile: d,
   selectedFiles: a,
   onFileSelect: r,
   onFilesSelect: m,
-  onInvalidFile: l,
-  acceptedExtensions: c,
-  maxSizeInMB: x = 50,
-  maxFiles: f = 10,
-  multiple: b = !1,
-  filesPosition: D = "below",
-  invalid: w = !1,
-  disabled: C = !1,
-  "aria-invalid": A,
-  labels: p,
-  input: T,
-  ...U
+  onFileAdd: c,
+  onFileRemove: h,
+  onFilesAdd: f,
+  onFilesRemove: l,
+  onInvalidFile: p,
+  acceptedExtensions: g,
+  maxSizeInMB: w = 50,
+  maxFiles: j = 10,
+  multiple: T = !1,
+  filesPosition: y = "below",
+  invalid: V = !1,
+  disabled: _ = !1,
+  "aria-invalid": M,
+  labels: C,
+  input: q,
+  ...G
 }) {
-  const [V, R] = B(!1), [_, M] = B(!1), j = W(null);
-  X(() => {
-    const t = () => {
-      if (j.current) {
-        const i = j.current.closest("fieldset");
-        M(i?.disabled ?? !1);
+  const [H, I] = U(!1), [J, K] = U(!1), b = P(null);
+  F(() => {
+    const e = () => {
+      if (b.current) {
+        const n = b.current.closest("fieldset");
+        K(n?.disabled ?? !1);
       }
     };
-    t();
-    const s = new MutationObserver(t);
-    if (j.current) {
-      const i = j.current.closest("fieldset");
-      i && s.observe(i, { attributes: !0, attributeFilter: ["disabled"] });
+    e();
+    const s = new MutationObserver(e);
+    if (b.current) {
+      const n = b.current.closest("fieldset");
+      n && s.observe(n, { attributes: !0, attributeFilter: ["disabled"] });
     }
     return () => s.disconnect();
   }, []);
-  const q = c?.join(",") || "", G = x * 1024 * 1024, o = b || a !== void 0 || m !== void 0, h = o ? a || [] : d ? [d] : [], N = w || A, u = C || _, H = (t) => {
-    u || (t.preventDefault(), R(!0));
-  }, J = (t) => {
-    u || (t.preventDefault(), R(!1));
-  }, K = (t) => {
+  const Q = g?.join(",") || "", W = w * 1024 * 1024, o = T || a !== void 0 || m !== void 0, x = o ? a || [] : d ? [d] : [], k = V || M, u = _ || J, X = (e) => {
+    u || (e.preventDefault(), I(!0));
+  }, Y = (e) => {
+    u || (e.preventDefault(), I(!1));
+  }, Z = (e) => {
     if (!u)
-      if (t.preventDefault(), R(!1), o) {
-        const i = Array.from(t.dataTransfer.files).filter($);
-        if (i.length > 0) {
-          const F = [...a || [], ...i].slice(0, f);
-          m && m(F);
+      if (e.preventDefault(), I(!1), o) {
+        const n = Array.from(e.dataTransfer.files).filter(z);
+        if (n.length > 0) {
+          const N = [...a || [], ...n].slice(0, j);
+          m && m(N), f && f(n);
         }
       } else {
-        const s = t.dataTransfer.files[0];
-        s && $(s) && r && r(s);
+        const s = e.dataTransfer.files[0];
+        s && z(s) && (r && r(s), c && c(s));
       }
-  }, Q = (t) => {
+  }, E = (e) => {
     if (!u) {
       if (o) {
-        const i = (t.target.files ? Array.from(t.target.files) : []).filter($);
-        if (i.length > 0) {
-          const F = [...a || [], ...i].slice(0, f);
-          m && m(F);
+        const n = (e.target.files ? Array.from(e.target.files) : []).filter(z);
+        if (n.length > 0) {
+          const N = [...a || [], ...n].slice(0, j);
+          m && m(N), f && f(n);
         }
       } else {
-        const s = t.target.files?.[0];
-        s && $(s) && r && r(s);
+        const s = e.target.files?.[0];
+        s && z(s) && (r && r(s), c && c(s));
       }
-      t.target.value = "";
+      e.target.value = "";
     }
-  }, k = (t) => {
-    if (!u)
-      if (o) {
-        const s = h.filter((i, g) => g !== t);
-        m && m(s);
-      } else
-        r && r(null);
-  }, $ = (t) => {
-    const s = t.name.substring(t.name.lastIndexOf(".")), i = !c || c.length === 0 || c.includes(s.toLowerCase()), g = t.size <= G;
-    return !i && l ? l(t, "extension") : !g && l && l(t, "size"), i && g;
-  }, z = () => {
-    u || (o ? m && m([]) : r && r(null));
+  }, L = (e) => {
+    if (u) return;
+    const s = x[e];
+    if (o) {
+      const n = x.filter((D, N) => N !== e);
+      m && m(n), l && s && l([s]);
+    } else
+      r && r(null), h && s && h(s);
+  }, z = (e) => {
+    const s = e.name.substring(e.name.lastIndexOf(".")), n = !g || g.length === 0 || g.includes(s.toLowerCase()), D = e.size <= W;
+    return !n && p ? p(e, "extension") : !D && p && p(e, "size"), n && D;
+  }, O = () => {
+    if (u) return;
+    const e = [...x];
+    o ? (m && m([]), l && e.length > 0 && l(e)) : (r && r(null), h && e.length > 0 && h(e[0]));
   };
-  return /* @__PURE__ */ e.jsxs("div", { ref: j, className: v("adm:flex adm:flex-col adm:gap-4", n), ...U, children: [
-    o && D === "above" && /* @__PURE__ */ e.jsx(
-      I,
+  return /* @__PURE__ */ t.jsxs("div", { ref: b, className: v("adm:flex adm:flex-col adm:gap-4", i), ...G, children: [
+    o && y === "above" && /* @__PURE__ */ t.jsx(
+      R,
       {
-        files: h,
+        files: x,
         isMultiple: o,
-        invalid: N,
+        invalid: k,
         disabled: u,
-        labels: p,
-        onRemoveFile: k,
-        onClearAll: z
+        labels: C,
+        onRemoveFile: L,
+        onClearAll: O
       }
     ),
-    (o || h.length === 0) && /* @__PURE__ */ e.jsx(
-      Y,
+    (o || x.length === 0) && /* @__PURE__ */ t.jsx(
+      S,
       {
-        isDragging: V,
+        isDragging: H,
         isMultiple: o,
-        invalid: N,
+        invalid: k,
         disabled: u,
-        accept: q,
-        acceptedExtensions: c,
-        maxSizeInMB: x,
-        maxFiles: f,
-        labels: p,
-        input: T,
-        onDragOver: H,
-        onDragLeave: J,
-        onDrop: K,
-        onFileChange: Q
+        accept: Q,
+        acceptedExtensions: g,
+        maxSizeInMB: w,
+        maxFiles: j,
+        labels: C,
+        input: q,
+        onDragOver: X,
+        onDragLeave: Y,
+        onDrop: Z,
+        onFileChange: E
       }
     ),
-    !o && h.length > 0 && /* @__PURE__ */ e.jsx(
-      I,
+    !o && x.length > 0 && /* @__PURE__ */ t.jsx(
+      R,
       {
-        files: h,
+        files: x,
         isMultiple: o,
-        invalid: N,
+        invalid: k,
         disabled: u,
-        labels: p,
-        onRemoveFile: k,
-        onClearAll: z
+        labels: C,
+        onRemoveFile: L,
+        onClearAll: O
       }
     ),
-    o && D === "below" && /* @__PURE__ */ e.jsx(
-      I,
+    o && y === "below" && /* @__PURE__ */ t.jsx(
+      R,
       {
-        files: h,
+        files: x,
         isMultiple: o,
-        invalid: N,
+        invalid: k,
         disabled: u,
-        labels: p,
-        onRemoveFile: k,
-        onClearAll: z
+        labels: C,
+        onRemoveFile: L,
+        onClearAll: O
       }
     )
   ] });
 }
 export {
-  ae as FileUpload
+  de as FileUpload
 };