mada-design-system 0.2.6 → 0.2.7

package/index.es43.js

@@ -1,14 +1,14 @@
-import { jsxs as c, jsx as a } from "react/jsx-runtime";
-import C from "./index.es3.js";
+import { jsxs as p, jsx as a } from "react/jsx-runtime";
+import z from "./index.es3.js";
 import { Button as N } from "./index.es22.js";
 import { useState as O, useRef as V, useCallback as l, useReducer as $ } from "react";
 import { strings as o } from "./index.es91.js";
 import { ShouldRender as S } from "./index.es14.js";
-import M from "./index.es130.js";
-import G from "./index.es131.js";
-import B from "./index.es132.js";
-import Z from "./index.es103.js";
-import { cn as u } from "./index.es79.js";
+import M from "./index.es129.js";
+import G from "./index.es130.js";
+import B from "./index.es131.js";
+import Z from "./index.es102.js";
+import { cn as m } from "./index.es79.js";
 const q = {
   "image/png": [".png"],
   "image/jpeg": [".jpg", ".jpeg"],
@@ -37,35 +37,35 @@ function H(e, t) {
 function J() {
   const [e, t] = $(H, []), s = l((n) => {
     t({ type: "ADD_FILES", payload: n });
-  }, []), i = l((n, p) => {
-    t({ type: "UPDATE_PROGRESS", payload: { id: n, progress: p } });
-  }, []), m = l((n, p, v) => {
-    t({ type: "UPDATE_STATUS", payload: { id: n, status: p, error: v } });
+  }, []), d = l((n, u) => {
+    t({ type: "UPDATE_PROGRESS", payload: { id: n, progress: u } });
+  }, []), i = l((n, u, h) => {
+    t({ type: "UPDATE_STATUS", payload: { id: n, status: u, error: h } });
   }, []), g = l((n) => {
     t({ type: "REMOVE_FILE", payload: n });
   }, []);
   return {
     files: e,
     addFiles: s,
-    updateProgress: i,
-    updateStatus: m,
+    updateProgress: d,
+    updateStatus: i,
     removeFile: g
   };
 }
 function K({ file: e, onRemove: t }) {
-  return /* @__PURE__ */ c(
+  return /* @__PURE__ */ p(
     "li",
     {
-      className: u("flex flex-col rounded border border-border-neutral-primary bg-background-neutral-100", {
+      className: m("flex flex-col rounded border border-border-neutral-primary bg-background-neutral-100", {
         "border-border-error": e.status === "error"
       }),
       children: [
-        /* @__PURE__ */ c("div", { className: "flex items-center justify-between p-space-02", children: [
-          /* @__PURE__ */ c("div", { className: "flex gap-space-02", children: [
-            e.status === "uploading" && /* @__PURE__ */ a(C, {}),
+        /* @__PURE__ */ p("div", { className: "flex items-center justify-between truncate p-space-02", children: [
+          /* @__PURE__ */ p("div", { className: "flex gap-space-02", children: [
+            e.status === "uploading" && /* @__PURE__ */ a(z, {}),
             e.status === "success" && /* @__PURE__ */ a(G, { className: "text-icon-success" }),
             e.status === "error" && /* @__PURE__ */ a(B, { className: "text-icon-error" }),
-            /* @__PURE__ */ a("span", { className: "truncate text-body-01 font-medium text-text-default", children: e.file.name })
+            /* @__PURE__ */ a("span", { className: "text-body-01 font-medium text-text-default", children: e.file.name })
           ] }),
           /* @__PURE__ */ a(
             N,
@@ -93,17 +93,18 @@ function W({
   isDragging: e,
   disabled: t,
   acceptedExtensions: s,
+  maxSize: d,
   onDragEnter: i,
-  onDragLeave: m,
-  onDragOver: g,
-  onDrop: n,
-  onSelectFiles: p
+  onDragLeave: g,
+  onDragOver: n,
+  onDrop: u,
+  onSelectFiles: h
 }) {
   return /* @__PURE__ */ a(
     "div",
     {
       role: "button",
-      className: u(
+      className: m(
         "group rounded border border-dashed bg-background-neutral-100 p-space-05 text-center hover:border-border-success hover:bg-background-success-25",
         {
           "border-border-success bg-background-success-25": e,
@@ -111,29 +112,29 @@ function W({
         }
       ),
       onDragEnter: i,
-      onDragLeave: m,
-      onDragOver: g,
-      onDrop: n,
-      children: /* @__PURE__ */ c("label", { htmlFor: "fileInput", className: "flex cursor-pointer flex-col items-center gap-space-05", children: [
-        /* @__PURE__ */ a(M, { className: u("size-space-05 text-icon-default group-hover:text-icon-success", { "text-disabled": t }) }),
+      onDragLeave: g,
+      onDragOver: n,
+      onDrop: u,
+      children: /* @__PURE__ */ p("label", { htmlFor: "fileInput", className: "flex cursor-pointer flex-col items-center gap-space-05", children: [
+        /* @__PURE__ */ a(M, { className: m("size-space-05 text-icon-default group-hover:text-icon-success", { "text-disabled": t }) }),
         /* @__PURE__ */ a(
           "span",
           {
             id: "dragDropLabel",
-            className: u("text-body-02 font-medium text-text-display group-hover:text-text-success", {
+            className: m("text-body-02 font-medium text-text-display group-hover:text-text-success", {
               "text-disabled-text-default-disabled": t
             }),
             children: o.Attachments.dragFiles
           }
         ),
-        /* @__PURE__ */ c(
+        /* @__PURE__ */ p(
           "span",
           {
-            className: u("text-caption-01 text-text-paragraph-primary group-hover:text-text-success", {
+            className: m("text-caption-01 text-text-paragraph-primary group-hover:text-text-success", {
               "text-disabled-text-default-disabled": t
             }),
             children: [
-              o.formatString(o.Attachments.maxSize, 5),
+              o.formatString(o.Attachments.maxSize, d),
               o.Shared.comma,
               " ",
               o.formatString(o.Attachments.allowedFormats, s.join(", "))
@@ -148,7 +149,7 @@ function W({
             size: "sm",
             rounded: "default",
             disabled: e || t,
-            onClick: p,
+            onClick: h,
             "aria-label": "browse files",
             children: o.Attachments.browseFile
           }
@@ -161,35 +162,35 @@ function ce({
   acceptedFormats: e = q,
   onFileSelect: t,
   multiple: s,
-  disabled: i,
-  maxSize: m = 1,
+  disabled: d,
+  maxSize: i = 1,
   maxFiles: g = 1 / 0
 }) {
-  const { files: n, addFiles: p, removeFile: v, updateProgress: E, updateStatus: R } = J(), [I, F] = O(!1), h = V(null), x = n.length >= g, D = Object.values(e).flat(), P = D.join(","), A = l(
-    (r) => r.size > m * 1024 * 1024 || !e[r.type] ? {
+  const { files: n, addFiles: u, removeFile: h, updateProgress: E, updateStatus: R } = J(), [I, F] = O(!1), x = V(null), b = n.length >= g, D = Object.values(e).flat(), P = D.join(","), A = l(
+    (r) => r.size > i * 1024 * 1024 || !e[r.type] ? {
       isValid: !1,
       error: o.Attachments.error
     } : { isValid: !0 },
-    [e, m]
-  ), y = l(
+    [e, i]
+  ), v = l(
     (r) => {
-      const f = r.map((d) => {
-        const b = d.name.replace(/[^a-zA-Z0-9_.-]/g, "_"), T = new File([d], b, { type: d.type });
+      const f = r.map((c) => {
+        const y = c.name.replace(/[^a-zA-Z0-9_.-]/g, "_"), C = new File([c], y, { type: c.type });
         return {
-          id: `${d.name}-${Date.now()}-${window.crypto.getRandomValues(new Uint32Array(1))[0].toString(36).substring(2, 9)}`,
-          file: T,
+          id: `${c.name}-${Date.now()}-${window.crypto.getRandomValues(new Uint32Array(1))[0].toString(36).substring(2, 9)}`,
+          file: C,
           progress: 0,
           status: "uploading"
         };
       });
-      p(f), f.forEach((d) => {
-        const b = A(d.file);
-        b.isValid || R(d.id, "error", b.error);
+      u(f), f.forEach((c) => {
+        const y = A(c.file);
+        y.isValid || R(c.id, "error", y.error);
       });
-      const L = f.filter((d) => A(d.file).isValid);
-      t && t(L, E), h.current && (h.current.value = "");
+      const T = f.filter((c) => A(c.file).isValid);
+      t && t(T, E), x.current && (x.current.value = "");
     },
-    [p, t, E, R, A]
+    [u, t, E, R, A]
   ), U = l((r) => {
     r.preventDefault(), r.stopPropagation(), F(!0);
   }, []), j = l((r) => {
@@ -198,39 +199,41 @@ function ce({
     r.preventDefault(), r.stopPropagation();
   }, []), _ = l(
     (r) => {
-      r.preventDefault(), r.stopPropagation(), F(!1), y(Array.from(r.dataTransfer.files));
+      r.preventDefault(), r.stopPropagation(), F(!1), v(Array.from(r.dataTransfer.files));
     },
-    [y]
-  ), z = l(
+    [v]
+  ), L = l(
     (r) => {
-      r.target.files && y(Array.from(r.target.files));
+      r.target.files && v(Array.from(r.target.files));
     },
-    [y]
+    [v]
   ), w = l(() => {
     var r, f;
-    x || ((r = h.current) == null || r.click(), (f = h.current) == null || f.focus());
-  }, [x]);
-  return /* @__PURE__ */ c("div", { className: "mx-auto flex w-full flex-col gap-space-02", children: [
+    b || ((r = x.current) == null || r.click(), (f = x.current) == null || f.focus());
+  }, [b]);
+  return /* @__PURE__ */ p("div", { className: "mx-auto flex w-full flex-col gap-space-02", children: [
     /* @__PURE__ */ a(S, { shouldRender: s, children: /* @__PURE__ */ a(
       W,
       {
         isDragging: I,
-        disabled: i || x,
+        disabled: d || b,
         acceptedExtensions: D,
         onDragEnter: U,
         onDragLeave: j,
         onDragOver: k,
         onDrop: _,
-        onSelectFiles: w
+        onSelectFiles: w,
+        maxSize: i
       }
     ) }),
     /* @__PURE__ */ a(S, { shouldRender: !s, children: /* @__PURE__ */ a(
       X,
       {
-        disabled: i || x,
+        disabled: d || b,
         acceptedExtensions: D,
         onSelectFiles: w,
-        isSelectedFile: !!n.length
+        isSelectedFile: !!n.length,
+        maxSize: i
       }
     ) }),
     /* @__PURE__ */ a(
@@ -238,36 +241,36 @@ function ce({
       {
         type: "file",
         accept: P,
-        ref: h,
-        onChange: z,
+        ref: x,
+        onChange: L,
         className: "hidden",
         id: "fileInput",
-        disabled: i || x,
+        disabled: d || b,
         "aria-describedby": "fileInputDescription"
       }
     ),
-    /* @__PURE__ */ a(Q, { files: n, onRemove: v })
+    /* @__PURE__ */ a(Q, { files: n, onRemove: h })
   ] });
 }
-const X = ({ disabled: e, acceptedExtensions: t, isSelectedFile: s, onSelectFiles: i }) => /* @__PURE__ */ c("div", { className: "space-y-space-04", children: [
-  /* @__PURE__ */ c("div", { className: "space-y-space-02", children: [
+const X = ({ disabled: e, acceptedExtensions: t, isSelectedFile: s, onSelectFiles: d, maxSize: i }) => /* @__PURE__ */ p("div", { className: "space-y-space-04", children: [
+  /* @__PURE__ */ p("div", { className: "space-y-space-02", children: [
     /* @__PURE__ */ a(
       "p",
       {
-        className: u("text-body-02 text-form-field-text-label", {
+        className: m("text-body-02 text-form-field-text-label", {
           "text-disabled-text-default-disabled": e
         }),
         children: o.Attachments.uploadFiles
       }
     ),
-    /* @__PURE__ */ c(
+    /* @__PURE__ */ p(
       "p",
       {
-        className: u("text-caption-01 text-text-paragraph-primary group-hover:text-text-success", {
+        className: m("text-caption-01 text-text-paragraph-primary group-hover:text-text-success", {
           "text-disabled-text-default-disabled": e
         }),
         children: [
-          o.formatString(o.Attachments.maxSize, 5),
+          o.formatString(o.Attachments.maxSize, i),
           o.Shared.comma,
           " ",
           o.formatString(o.Attachments.allowedFormats, t.join(", "))
@@ -275,7 +278,7 @@ const X = ({ disabled: e, acceptedExtensions: t, isSelectedFile: s, onSelectFile
       }
     )
   ] }),
-  /* @__PURE__ */ a(S, { shouldRender: !s, children: /* @__PURE__ */ a(N, { onClick: i, colors: "neutral", rounded: "default", size: "sm", disabled: e, children: o.Attachments.browseFile }) })
+  /* @__PURE__ */ a(S, { shouldRender: !s, children: /* @__PURE__ */ a(N, { onClick: d, colors: "neutral", rounded: "default", type: "button", size: "sm", disabled: e, children: o.Attachments.browseFile }) })
 ] });
 export {
   ce as FileUpload