@trinityui/design-system 2.2.1 → 2.2.3

package/dist/forms.js

@@ -1,22 +1,22 @@
-import { jsxs as m, jsx as e, Fragment as Pe } from "react/jsx-runtime";
-import * as F from "react";
-import Le, { createElement as Re, useState as ie, useRef as Oe, useCallback as S } from "react";
-import { useTheme as Fe, Paper as ce, Box as k, ListItem as de, alpha as me, ListItemIcon as ee, Checkbox as fe, ListItemText as pe, Divider as he, Button as ue, Autocomplete as Se, Typography as _, Popper as Me, Chip as xe, TextField as Te, Alert as ge, Stack as Be, List as Ee, LinearProgress as Ae, ListItemSecondaryAction as We, IconButton as ze } from "@mui/material";
-import { Check as ae, Add as $e, Close as ye } from "@mui/icons-material";
-import le from "@mui/icons-material/CloudUpload";
-import je from "@mui/icons-material/InsertDriveFile";
-import Ue from "@mui/icons-material/Delete";
-import we from "@mui/icons-material/CheckCircle";
-import _e from "@mui/icons-material/Error";
+import { jsxs as f, jsx as e, Fragment as Re } from "react/jsx-runtime";
+import * as O from "react";
+import Fe, { createElement as Oe, useState as ae, useRef as Se, useCallback as S } from "react";
+import { useTheme as Me, Paper as de, Box as C, ListItem as pe, alpha as he, ListItemIcon as re, Checkbox as ge, ListItemText as ue, Divider as ye, Button as me, Autocomplete as Ae, Typography as _, Popper as Be, Chip as Ie, TextField as Ee, Alert as ve, Stack as ze, List as We, LinearProgress as je, ListItemSecondaryAction as Te, IconButton as $e } from "@mui/material";
+import { Check as le, Add as Ue, Close as be } from "@mui/icons-material";
+import ce from "@mui/icons-material/CloudUpload";
+import Ve from "@mui/icons-material/InsertDriveFile";
+import _e from "@mui/icons-material/Delete";
+import ke from "@mui/icons-material/CheckCircle";
+import Ge from "@mui/icons-material/Error";
 import Ke from "@mui/icons-material/PictureAsPdf";
-import Ve from "@mui/icons-material/Image";
-import qe from "@mui/icons-material/VideoLibrary";
-import Ge from "@mui/icons-material/Description";
-import { s as Ie } from "./app-shell.js";
-const ve = () => `new-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`, Ne = (d) => /* @__PURE__ */ e(
-  Me,
+import qe from "@mui/icons-material/Image";
+import Ne from "@mui/icons-material/VideoLibrary";
+import He from "@mui/icons-material/Description";
+import { s as Ce } from "./app-shell.js";
+const xe = () => `new-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`, Je = (c) => /* @__PURE__ */ e(
+  Be,
   {
-    ...d,
+    ...c,
     placement: "bottom-start",
     modifiers: [
       {
@@ -27,146 +27,141 @@ const ve = () => `new-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`,
       }
     ]
   }
-), cr = F.forwardRef(function({
-  options: p,
-  value: s,
+), pr = O.forwardRef(function({
+  options: d,
+  value: n,
   defaultValue: D,
-  onChange: v,
-  creatable: b = !1,
-  onCreate: x,
+  onChange: b,
+  creatable: x = !1,
+  onCreate: w,
   createText: M = 'Create "{value}"',
-  multiple: u = !1,
-  placeholder: Q = "Select...",
-  label: K,
+  multiple: p = !1,
+  placeholder: X = "Select...",
+  label: G,
   helperText: a,
-  error: V = !1,
-  errorMessage: re,
-  disabled: X = !1,
-  fullWidth: j = !1,
-  size: A = "medium",
+  error: K = !1,
+  errorMessage: te,
+  disabled: Y = !1,
+  fullWidth: U = !1,
+  size: W = "medium",
   limitTags: q = 3,
-  showCheckbox: W = !0,
-  groupBy: Y = !1,
-  loading: U = !1,
-  noOptionsText: G = "No options",
-  filterOptions: N,
-  renderOption: H,
-  renderTag: z,
-  freeSolo: h = !1,
-  autoHighlight: w = !0,
-  clearOnEscape: te = !0,
-  showSelectAll: T = !1,
-  selectAllText: Z = "Select All",
-  className: oe,
-  sx: ne
-}, se) {
-  const J = Fe(), [g, $] = F.useState(""), [P, B] = F.useState(
+  showCheckbox: j = !0,
+  groupBy: Z = !1,
+  loading: V = !1,
+  noOptionsText: N = "No options",
+  filterOptions: H,
+  renderOption: J,
+  renderTag: T,
+  freeSolo: g = !1,
+  autoHighlight: I = !0,
+  clearOnEscape: oe = !0,
+  showSelectAll: A = !1,
+  selectAllText: ee = "Select All",
+  className: ne,
+  sx: se
+}, ie) {
+  const Q = Me(), [y, $] = O.useState(""), [P, B] = O.useState(
     D || []
-  ), L = s !== void 0 ? s : P, r = F.useCallback(
+  ), L = n !== void 0 ? n : P, r = O.useCallback(
     (t, o) => {
-      if (N)
-        return N(t, o);
-      const n = o.inputValue.toLowerCase();
+      if (H)
+        return H(t, o);
+      const s = o.inputValue.toLowerCase();
       return t.filter(
-        (c) => c.label.toLowerCase().includes(n) || c.secondary?.toLowerCase().includes(n)
+        (u) => u.label.toLowerCase().includes(s) || u.secondary?.toLowerCase().includes(s)
       );
     },
-    [N]
-  ), l = F.useMemo(() => !b || !g.trim() ? !1 : !p.some(
-    (o) => o.label.toLowerCase() === g.toLowerCase()
-  ), [b, g, p]), I = async (t, o) => {
-    let n;
-    if (u) {
-      const c = o || [];
-      n = await Promise.all(
-        c.map(async (C) => typeof C == "string" ? b && x ? await x(C) : { id: ve(), label: C } : C)
+    [H]
+  ), l = O.useMemo(() => !x || !y.trim() ? !1 : !d.some(
+    (o) => o.label.toLowerCase() === y.toLowerCase()
+  ), [x, y, d]), k = async (t, o) => {
+    let s;
+    if (p) {
+      const u = o || [];
+      s = await Promise.all(
+        u.map(async (m) => typeof m == "string" ? x && w ? await w(m) : { id: xe(), label: m } : m)
       );
     } else
-      o === null ? n = [] : typeof o == "string" ? b && x ? n = [await x(o)] : n = [{ id: ve(), label: o }] : n = [o];
-    B(n), v?.(n);
-  }, R = F.useMemo(() => {
-    const t = p.filter((o) => !o.disabled);
+      o === null ? s = [] : typeof o == "string" ? x && w ? s = [await w(o)] : s = [{ id: xe(), label: o }] : s = [o];
+    B(s), b?.(s);
+  }, R = O.useMemo(() => {
+    const t = d.filter((o) => !o.disabled);
     return t.length > 0 && t.every(
-      (o) => L.some((n) => n.id === o.id)
+      (o) => L.some((s) => s.id === o.id)
     );
-  }, [p, L]), y = F.useCallback(() => {
+  }, [d, L]), v = O.useCallback(() => {
     if (R)
-      B([]), v?.([]);
+      B([]), b?.([]);
     else {
-      const t = p.filter((o) => !o.disabled);
-      B(t), v?.(t);
+      const t = d.filter((o) => !o.disabled);
+      B(t), b?.(t);
     }
-  }, [R, p, v]), f = F.useCallback(async () => {
-    if (!l || !x) return;
-    const t = await x(g), o = u ? [...L, t] : [t];
-    B(o), v?.(o), $("");
-  }, [l, x, g, u, L, v]), E = (t) => /* @__PURE__ */ e(
-    Te,
+  }, [R, d, b]), h = O.useCallback(async () => {
+    if (!l || !w) return;
+    const t = await w(y), o = p ? [...L, t] : [t];
+    B(o), b?.(o), $("");
+  }, [l, w, y, p, L, b]), E = (t) => /* @__PURE__ */ e(
+    Ee,
     {
       ...t,
-      label: K,
-      placeholder: L.length === 0 ? Q : void 0,
-      error: V,
-      helperText: V ? re : a,
-      size: A,
-      InputProps: {
-        ...t.InputProps,
-        sx: {
-          "& .MuiAutocomplete-input": {
-            minWidth: "60px !important"
-          }
-        }
-      }
+      label: G,
+      placeholder: L.length === 0 ? X : void 0,
+      error: K,
+      helperText: K ? te : a,
+      size: W
     }
-  ), O = (t, o) => t.map((n, c) => {
-    const C = o({ index: c });
-    return z ? z(n, C.onDelete) : /* @__PURE__ */ Re(
-      xe,
-      {
-        ...C,
-        key: n.id,
-        label: n.label,
-        size: A,
-        deleteIcon: /* @__PURE__ */ e(ye, { fontSize: "small" }),
-        sx: {
-          maxWidth: 150,
-          "& .MuiChip-label": {
-            overflow: "hidden",
-            textOverflow: "ellipsis"
+  ), F = (t, o) => {
+    const s = o;
+    return (Array.isArray(t) ? t : []).map((m, z) => {
+      const fe = s({ index: z });
+      return T ? T(m, fe.onDelete) : /* @__PURE__ */ Oe(
+        Ie,
+        {
+          ...fe,
+          key: typeof m == "object" ? m.id : z,
+          label: typeof m == "object" ? m.label : String(m),
+          size: W,
+          deleteIcon: /* @__PURE__ */ e(be, { fontSize: "small" }),
+          sx: {
+            maxWidth: 150,
+            "& .MuiChip-label": {
+              overflow: "hidden",
+              textOverflow: "ellipsis"
+            }
           }
         }
-      }
-    );
-  }), i = F.useCallback(
+      );
+    });
+  }, i = O.useCallback(
     (t) => {
-      const { children: o, ...n } = t;
-      return /* @__PURE__ */ m(ce, { ...n, elevation: 8, children: [
-        u && T && /* @__PURE__ */ m(
-          k,
+      const { children: o, ...s } = t;
+      return /* @__PURE__ */ f(de, { ...s, elevation: 8, children: [
+        p && A && /* @__PURE__ */ f(
+          C,
           {
-            onMouseDown: (c) => {
-              c.preventDefault(), c.stopPropagation();
+            onMouseDown: (u) => {
+              u.preventDefault(), u.stopPropagation();
             },
-            onClick: (c) => {
-              c.preventDefault(), c.stopPropagation(), y();
+            onClick: (u) => {
+              u.preventDefault(), u.stopPropagation(), v();
             },
             children: [
-              /* @__PURE__ */ m(
-                de,
+              /* @__PURE__ */ f(
+                pe,
                 {
                   dense: !0,
                   sx: {
                     cursor: "pointer",
                     "&:hover": {
-                      backgroundColor: me(J.palette.primary.main, 0.08)
+                      backgroundColor: he(Q.palette.primary.main, 0.08)
                     }
                   },
                   children: [
-                    W && /* @__PURE__ */ e(ee, { sx: { minWidth: 36, pointerEvents: "none" }, children: /* @__PURE__ */ e(
-                      fe,
+                    j && /* @__PURE__ */ e(re, { sx: { minWidth: 36, pointerEvents: "none" }, children: /* @__PURE__ */ e(
+                      ge,
                       {
                         icon: /* @__PURE__ */ e(
-                          k,
+                          C,
                           {
                             sx: {
                               width: 18,
@@ -179,7 +174,7 @@ const ve = () => `new-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`,
                           }
                         ),
                         checkedIcon: /* @__PURE__ */ e(
-                          k,
+                          C,
                           {
                             sx: {
                               width: 18,
@@ -193,7 +188,7 @@ const ve = () => `new-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`,
                               justifyContent: "center"
                             },
                             children: /* @__PURE__ */ e(
-                              ae,
+                              le,
                               {
                                 sx: {
                                   width: 14,
@@ -211,31 +206,31 @@ const ve = () => `new-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`,
                       }
                     ) }),
                     /* @__PURE__ */ e(
-                      pe,
+                      ue,
                       {
-                        primary: R ? "Deselect All" : Z,
-                        primaryTypographyProps: {
+                        primary: R ? "Deselect All" : ee,
+                        slotProps: { primary: {
                           variant: "body2",
-                          fontWeight: 500
-                        }
+                          sx: { fontWeight: 500 }
+                        } }
                       }
                     )
                   ]
                 }
               ),
-              /* @__PURE__ */ e(he, {})
+              /* @__PURE__ */ e(ye, {})
             ]
           }
         ),
         o,
-        l && /* @__PURE__ */ m(Pe, { children: [
-          /* @__PURE__ */ e(he, {}),
+        l && /* @__PURE__ */ f(Re, { children: [
+          /* @__PURE__ */ e(ye, {}),
           /* @__PURE__ */ e(
-            ue,
+            me,
             {
               fullWidth: !0,
-              startIcon: /* @__PURE__ */ e($e, {}),
-              onClick: f,
+              startIcon: /* @__PURE__ */ e(Ue, {}),
+              onClick: h,
               sx: {
                 justifyContent: "flex-start",
                 py: 1.5,
@@ -244,188 +239,146 @@ const ve = () => `new-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`,
                 color: "primary.main",
                 borderRadius: 0,
                 "&:hover": {
-                  backgroundColor: me(J.palette.primary.main, 0.08)
+                  backgroundColor: he(Q.palette.primary.main, 0.08)
                 }
               },
-              children: M.replace("{value}", g)
+              children: M.replace("{value}", y)
             }
           )
         ] })
       ] });
     },
-    [l, M, g, J.palette.primary.main, f, u, T, W, y, R, Z]
-  ), De = p;
+    [l, M, y, Q.palette.primary.main, h, p, A, j, v, R, ee]
+  ), Le = d;
   return /* @__PURE__ */ e(
-    Se,
+    Ae,
     {
-      ref: se,
-      className: oe,
-      sx: {
-        width: j ? "100%" : 300,
-        ...ne
-      },
-      multiple: u,
-      options: De,
-      value: u ? L : L[0] || null,
-      onChange: I,
-      inputValue: g,
+      ref: ie,
+      className: ne,
+      sx: { width: U ? "100%" : 300, ...se },
+      multiple: p,
+      options: Le,
+      value: p ? L : L[0] || null,
+      onChange: k,
+      inputValue: y,
       onInputChange: (t, o) => $(o),
       getOptionLabel: (t) => typeof t == "string" ? t : t.label,
       isOptionEqualToValue: (t, o) => t.id === o.id,
       getOptionDisabled: (t) => typeof t == "object" && t.disabled === !0,
-      groupBy: Y ? (t) => t.group || "" : void 0,
+      groupBy: Z ? (t) => t.group || "" : void 0,
       filterOptions: r,
       renderInput: E,
-      renderTags: u ? O : void 0,
-      renderOption: (t, o, { selected: n }) => {
-        const { key: c, ...C } = t;
-        return H ? /* @__PURE__ */ e("li", { ...C, children: H(o, { selected: n }) }, c) : /* @__PURE__ */ m(de, { ...C, dense: !0, children: [
-          u && W && /* @__PURE__ */ e(ee, { sx: { minWidth: 36 }, children: /* @__PURE__ */ e(
-            fe,
+      renderValue: p ? F : void 0,
+      renderOption: (t, o, { selected: s }) => {
+        const { key: u, ...m } = t, z = o;
+        return J ? /* @__PURE__ */ e("li", { ...m, children: J(z, { selected: s }) }, u) : /* @__PURE__ */ f(pe, { ...m, dense: !0, children: [
+          p && j && /* @__PURE__ */ e(re, { sx: { minWidth: 36 }, children: /* @__PURE__ */ e(
+            ge,
             {
-              icon: /* @__PURE__ */ e(
-                k,
-                {
-                  sx: {
-                    width: 18,
-                    height: 18,
-                    border: "2px solid",
-                    borderColor: "action.active",
-                    borderRadius: 0.5,
-                    backgroundColor: "transparent"
-                  }
-                }
-              ),
-              checkedIcon: /* @__PURE__ */ e(
-                k,
-                {
-                  sx: {
-                    width: 18,
-                    height: 18,
-                    border: "2px solid",
-                    borderColor: "primary.main",
-                    borderRadius: 0.5,
-                    backgroundColor: "primary.main",
-                    display: "flex",
-                    alignItems: "center",
-                    justifyContent: "center"
-                  },
-                  children: /* @__PURE__ */ e(
-                    ae,
-                    {
-                      sx: {
-                        width: 14,
-                        height: 14,
-                        color: "primary.contrastText"
-                      }
-                    }
-                  )
-                }
-              ),
-              checked: n,
+              icon: /* @__PURE__ */ e(C, { sx: { width: 18, height: 18, border: "2px solid", borderColor: "action.active", borderRadius: 0.5, backgroundColor: "transparent" } }),
+              checkedIcon: /* @__PURE__ */ e(C, { sx: { width: 18, height: 18, border: "2px solid", borderColor: "primary.main", borderRadius: 0.5, backgroundColor: "primary.main", display: "flex", alignItems: "center", justifyContent: "center" }, children: /* @__PURE__ */ e(le, { sx: { width: 14, height: 14, color: "primary.contrastText" } }) }),
+              checked: s,
               size: "small"
             }
           ) }),
-          o.icon && /* @__PURE__ */ e(ee, { sx: { minWidth: 36 }, children: o.icon }),
+          z.icon && /* @__PURE__ */ e(re, { sx: { minWidth: 36 }, children: z.icon }),
           /* @__PURE__ */ e(
-            pe,
+            ue,
             {
-              primary: o.label,
-              secondary: o.secondary,
-              primaryTypographyProps: { variant: "body2" },
-              secondaryTypographyProps: { variant: "caption" }
+              primary: z.label,
+              secondary: z.secondary,
+              slotProps: { primary: { variant: "body2" }, secondary: { variant: "caption" } }
             }
           ),
-          !u && n && /* @__PURE__ */ e(ae, { sx: { ml: 1, color: "primary.main" }, fontSize: "small" })
-        ] }, c);
+          !p && s && /* @__PURE__ */ e(le, { sx: { ml: 1, color: "primary.main" }, fontSize: "small" })
+        ] }, u);
+      },
+      slots: {
+        paper: x || p && A ? i : de,
+        popper: Je
       },
-      PaperComponent: b || u && T ? i : ce,
-      PopperComponent: Ne,
       limitTags: q,
-      disabled: X,
-      loading: U,
-      noOptionsText: l ? /* @__PURE__ */ e(_, { variant: "body2", color: "text.secondary", children: "Press Enter or click below to create" }) : G,
-      freeSolo: h || b,
-      autoHighlight: w,
-      clearOnEscape: te,
-      disableCloseOnSelect: u,
-      ChipProps: {
-        size: A,
-        deleteIcon: /* @__PURE__ */ e(ye, { fontSize: "small" })
-      }
+      disabled: Y,
+      loading: V,
+      noOptionsText: l ? /* @__PURE__ */ e(_, { variant: "body2", color: "text.secondary", children: "Press Enter or click below to create" }) : N,
+      freeSolo: g || x,
+      autoHighlight: I,
+      clearOnEscape: oe,
+      disableCloseOnSelect: p,
+      slotProps: { chip: { size: W, deleteIcon: /* @__PURE__ */ e(be, { fontSize: "small" }) } }
     }
   );
-}), Ce = (d) => {
-  if (d === 0) return "0 Bytes";
-  const p = 1024, s = ["Bytes", "KB", "MB", "GB"], D = Math.floor(Math.log(d) / Math.log(p));
-  return parseFloat((d / Math.pow(p, D)).toFixed(2)) + " " + s[D];
-}, ke = (d) => d.startsWith("image/") ? /* @__PURE__ */ e(Ve, {}) : d.startsWith("video/") ? /* @__PURE__ */ e(qe, {}) : d === "application/pdf" ? /* @__PURE__ */ e(Ke, {}) : d.includes("document") || d.includes("text") ? /* @__PURE__ */ e(Ge, {}) : /* @__PURE__ */ e(je, {}), He = () => `file-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`, dr = Le.forwardRef(function({
-  variant: p = "dropzone",
-  accept: s,
+}), De = (c) => {
+  if (c === 0) return "0 Bytes";
+  const d = 1024, n = ["Bytes", "KB", "MB", "GB"], D = Math.floor(Math.log(c) / Math.log(d));
+  return parseFloat((c / Math.pow(d, D)).toFixed(2)) + " " + n[D];
+}, Pe = (c) => c.startsWith("image/") ? /* @__PURE__ */ e(qe, {}) : c.startsWith("video/") ? /* @__PURE__ */ e(Ne, {}) : c === "application/pdf" ? /* @__PURE__ */ e(Ke, {}) : c.includes("document") || c.includes("text") ? /* @__PURE__ */ e(He, {}) : /* @__PURE__ */ e(Ve, {}), Qe = () => `file-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`, ur = Fe.forwardRef(function({
+  variant: d = "dropzone",
+  accept: n,
   multiple: D = !1,
-  maxSize: v,
-  maxFiles: b,
-  files: x,
+  maxSize: b,
+  maxFiles: x,
+  files: w,
   onFilesChange: M,
-  onFileSelect: u,
-  onFileRemove: Q,
-  onUpload: K,
+  onFileSelect: p,
+  onFileRemove: X,
+  onUpload: G,
   disabled: a = !1,
-  helperText: V,
-  error: re,
-  showFileList: X = !0,
-  size: j = "medium",
-  sx: A
+  helperText: K,
+  error: te,
+  showFileList: Y = !0,
+  size: U = "medium",
+  sx: W
 }, q) {
-  const [W, Y] = ie([]), [U, G] = ie(!1), [N, H] = ie(null), z = Oe(null), h = x ?? W, w = S((r) => {
-    typeof r == "function" ? M ? M(r(x ?? W)) : Y(r) : M ? M(r) : Y(r);
-  }, [x, W, M]), te = (r) => v && r.size > v ? `File "${r.name}" exceeds maximum size of ${Ce(v)}` : b && h.length >= b ? `Maximum ${b} files allowed` : null, T = S(
+  const [j, Z] = ae([]), [V, N] = ae(!1), [H, J] = ae(null), T = Se(null), g = w ?? j, I = S((r) => {
+    typeof r == "function" ? M ? M(r(w ?? j)) : Z(r) : M ? M(r) : Z(r);
+  }, [w, j, M]), oe = (r) => b && r.size > b ? `File "${r.name}" exceeds maximum size of ${De(b)}` : x && g.length >= x ? `Maximum ${x} files allowed` : null, A = S(
     async (r) => {
-      const l = Array.from(r), I = [], R = [];
-      for (const y of l) {
-        const f = te(y);
-        if (f) {
-          R.push(f);
+      const l = Array.from(r), k = [], R = [];
+      for (const v of l) {
+        const h = oe(v);
+        if (h) {
+          R.push(h);
           continue;
         }
         const E = {
-          id: He(),
-          file: y,
-          name: y.name,
-          size: y.size,
-          type: y.type,
+          id: Qe(),
+          file: v,
+          name: v.name,
+          size: v.size,
+          type: v.type,
           progress: 0,
           status: "pending",
-          preview: y.type.startsWith("image/") ? URL.createObjectURL(y) : void 0
+          preview: v.type.startsWith("image/") ? URL.createObjectURL(v) : void 0
         };
-        I.push(E);
+        k.push(E);
       }
-      if (R.length > 0 ? H(R[0]) : H(null), I.length > 0) {
-        const y = D ? [...h, ...I] : I;
-        if (w(y), u?.(I.map((f) => f.file)), K)
-          for (const f of I)
+      if (R.length > 0 ? J(R[0]) : J(null), k.length > 0) {
+        const v = D ? [...g, ...k] : k;
+        if (I(v), p?.(k.map((h) => h.file)), G)
+          for (const h of k)
             try {
-              w(
-                (O) => O.map(
-                  (i) => i.id === f.id ? { ...i, status: "uploading" } : i
+              I(
+                (F) => F.map(
+                  (i) => i.id === h.id ? { ...i, status: "uploading" } : i
                 )
               );
               const E = setInterval(() => {
-                w(
-                  (O) => O.map(
-                    (i) => i.id === f.id && i.progress < 90 ? { ...i, progress: i.progress + 10 } : i
+                I(
+                  (F) => F.map(
+                    (i) => i.id === h.id && i.progress < 90 ? { ...i, progress: i.progress + 10 } : i
                   )
                 );
               }, 200);
-              await K(f.file), clearInterval(E), w(
-                (O) => O.map(
-                  (i) => i.id === f.id ? { ...i, status: "complete", progress: 100 } : i
+              await G(h.file), clearInterval(E), I(
+                (F) => F.map(
+                  (i) => i.id === h.id ? { ...i, status: "complete", progress: 100 } : i
                 )
               );
             } catch (E) {
-              w(
-                (O) => O.map(
-                  (i) => i.id === f.id ? {
+              I(
+                (F) => F.map(
+                  (i) => i.id === h.id ? {
                     ...i,
                     status: "error",
                     error: E instanceof Error ? E.message : "Upload failed"
@@ -435,43 +388,43 @@ const ve = () => `new-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`,
             }
       }
     },
-    [h, w, v, b, D, u, K]
-  ), Z = S((r) => {
-    r.preventDefault(), r.stopPropagation(), a || G(!0);
-  }, [a]), oe = S((r) => {
-    r.preventDefault(), r.stopPropagation(), G(!1);
-  }, []), ne = S((r) => {
+    [g, I, b, x, D, p, G]
+  ), ee = S((r) => {
+    r.preventDefault(), r.stopPropagation(), a || N(!0);
+  }, [a]), ne = S((r) => {
+    r.preventDefault(), r.stopPropagation(), N(!1);
+  }, []), se = S((r) => {
     r.preventDefault(), r.stopPropagation();
-  }, []), se = S(
+  }, []), ie = S(
     (r) => {
-      if (r.preventDefault(), r.stopPropagation(), G(!1), a) return;
+      if (r.preventDefault(), r.stopPropagation(), N(!1), a) return;
       const l = r.dataTransfer.files;
-      l.length > 0 && T(l);
+      l.length > 0 && A(l);
     },
-    [a, T]
-  ), J = S(
+    [a, A]
+  ), Q = S(
     (r) => {
       const l = r.target.files;
-      l && l.length > 0 && T(l), z.current && (z.current.value = "");
+      l && l.length > 0 && A(l), T.current && (T.current.value = "");
     },
-    [T]
-  ), g = S(
+    [A]
+  ), y = S(
     (r) => {
       r.preview && URL.revokeObjectURL(r.preview);
-      const l = h.filter((I) => I.id !== r.id);
-      w(l), Q?.(r);
+      const l = g.filter((k) => k.id !== r.id);
+      I(l), X?.(r);
     },
-    [h, w, Q]
+    [g, I, X]
   ), $ = () => {
-    z.current?.click();
-  }, P = re || N, B = /* @__PURE__ */ e(
+    T.current?.click();
+  }, P = te || H, B = /* @__PURE__ */ e(
     "input",
     {
-      ref: z,
+      ref: T,
       type: "file",
-      accept: s,
+      accept: n,
       multiple: D,
-      onChange: J,
+      onChange: Q,
       style: { display: "none" },
       disabled: a
     }
@@ -481,27 +434,27 @@ const ve = () => `new-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`,
     },
     [a]
   );
-  return p === "dropzone" ? /* @__PURE__ */ m(k, { ref: q, sx: A, children: [
+  return d === "dropzone" ? /* @__PURE__ */ f(C, { ref: q, sx: W, children: [
     B,
-    /* @__PURE__ */ m(
-      ce,
+    /* @__PURE__ */ f(
+      de,
       {
         role: "button",
         tabIndex: a ? -1 : 0,
-        "aria-label": `Upload files${s ? `. Accepted formats: ${s}` : ""}. Drag and drop or press Enter to browse`,
+        "aria-label": `Upload files${n ? `. Accepted formats: ${n}` : ""}. Drag and drop or press Enter to browse`,
         "aria-disabled": a,
-        onDragEnter: Z,
-        onDragLeave: oe,
-        onDragOver: ne,
-        onDrop: se,
+        onDragEnter: ee,
+        onDragLeave: ne,
+        onDragOver: se,
+        onDrop: ie,
         onClick: $,
         onKeyDown: L,
         sx: {
-          p: j === "small" ? 3 : 4,
+          p: U === "small" ? 3 : 4,
           border: "2px dashed",
-          borderColor: P ? "error.main" : U ? "primary.main" : "divider",
-          borderRadius: Ie.borders.radiusPx.lg,
-          bgcolor: U ? "action.hover" : a ? "action.disabledBackground" : "background.paper",
+          borderColor: P ? "error.main" : V ? "primary.main" : "divider",
+          borderRadius: Ce.borders.radiusPx.lg,
+          bgcolor: V ? "action.hover" : a ? "action.disabledBackground" : "background.paper",
           textAlign: "center",
           cursor: a ? "not-allowed" : "pointer",
           transition: "all 0.2s ease",
@@ -512,61 +465,61 @@ const ve = () => `new-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`,
         },
         children: [
           /* @__PURE__ */ e(
-            le,
+            ce,
             {
               sx: {
-                fontSize: j === "small" ? 40 : 56,
-                color: U ? "primary.main" : "action.active",
+                fontSize: U === "small" ? 40 : 56,
+                color: V ? "primary.main" : "action.active",
                 mb: 2
               }
             }
           ),
-          /* @__PURE__ */ e(_, { variant: j === "small" ? "body1" : "h6", gutterBottom: !0, children: U ? "Drop files here" : "Drag & drop files here" }),
+          /* @__PURE__ */ e(_, { variant: U === "small" ? "body1" : "h6", gutterBottom: !0, children: V ? "Drop files here" : "Drag & drop files here" }),
           /* @__PURE__ */ e(_, { variant: "body2", color: "text.secondary", gutterBottom: !0, children: "or click to browse" }),
-          V && /* @__PURE__ */ e(_, { variant: "caption", color: "text.secondary", children: V })
+          K && /* @__PURE__ */ e(_, { variant: "caption", color: "text.secondary", children: K })
         ]
       }
     ),
-    P && /* @__PURE__ */ e(ge, { severity: "error", sx: { mt: 2 }, children: P }),
-    X && h.length > 0 && /* @__PURE__ */ e(be, { files: h, onRemove: g })
-  ] }) : p === "button" ? /* @__PURE__ */ m(k, { ref: q, sx: A, children: [
+    P && /* @__PURE__ */ e(ve, { severity: "error", sx: { mt: 2 }, children: P }),
+    Y && g.length > 0 && /* @__PURE__ */ e(we, { files: g, onRemove: y })
+  ] }) : d === "button" ? /* @__PURE__ */ f(C, { ref: q, sx: W, children: [
     B,
-    /* @__PURE__ */ m(
-      ue,
+    /* @__PURE__ */ f(
+      me,
       {
         variant: "contained",
-        startIcon: /* @__PURE__ */ e(le, {}),
+        startIcon: /* @__PURE__ */ e(ce, {}),
         onClick: $,
         disabled: a,
-        size: j,
+        size: U,
         children: [
           "Upload ",
           D ? "Files" : "File"
         ]
       }
     ),
-    P && /* @__PURE__ */ e(ge, { severity: "error", sx: { mt: 2 }, children: P }),
-    X && h.length > 0 && /* @__PURE__ */ e(be, { files: h, onRemove: g })
-  ] }) : /* @__PURE__ */ m(k, { ref: q, sx: A, children: [
+    P && /* @__PURE__ */ e(ve, { severity: "error", sx: { mt: 2 }, children: P }),
+    Y && g.length > 0 && /* @__PURE__ */ e(we, { files: g, onRemove: y })
+  ] }) : /* @__PURE__ */ f(C, { ref: q, sx: W, children: [
     B,
-    /* @__PURE__ */ m(Be, { direction: "row", spacing: 1, alignItems: "center", flexWrap: "wrap", useFlexGap: !0, children: [
+    /* @__PURE__ */ f(ze, { direction: "row", spacing: 1, useFlexGap: !0, sx: { alignItems: "center", flexWrap: "wrap" }, children: [
       /* @__PURE__ */ e(
-        ue,
+        me,
         {
           variant: "outlined",
           size: "small",
-          startIcon: /* @__PURE__ */ e(le, {}),
+          startIcon: /* @__PURE__ */ e(ce, {}),
           onClick: $,
           disabled: a,
           children: "Browse"
         }
       ),
-      h.map((r) => /* @__PURE__ */ e(
-        xe,
+      g.map((r) => /* @__PURE__ */ e(
+        Ie,
         {
-          icon: r.status === "complete" ? /* @__PURE__ */ e(we, {}) : ke(r.type),
+          icon: r.status === "complete" ? /* @__PURE__ */ e(ke, {}) : Pe(r.type),
           label: r.name,
-          onDelete: () => g(r),
+          onDelete: () => y(r),
           color: r.status === "error" ? "error" : r.status === "complete" ? "success" : "default",
           size: "small",
           sx: {
@@ -582,27 +535,27 @@ const ve = () => `new-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`,
     ] }),
     P && /* @__PURE__ */ e(_, { variant: "caption", color: "error", sx: { mt: 0.5, display: "block" }, children: P })
   ] });
-}), be = ({ files: d, onRemove: p }) => /* @__PURE__ */ e(Ee, { dense: !0, sx: { mt: 2 }, children: d.map((s) => /* @__PURE__ */ m(
-  de,
+}), we = ({ files: c, onRemove: d }) => /* @__PURE__ */ e(We, { dense: !0, sx: { mt: 2 }, children: c.map((n) => /* @__PURE__ */ f(
+  pe,
   {
     sx: {
       bgcolor: "background.paper",
-      borderRadius: Ie.borders.radiusPx.md,
+      borderRadius: Ce.borders.radiusPx.md,
       mb: 1,
       border: "1px solid",
-      borderColor: s.status === "error" ? "error.light" : "divider"
+      borderColor: n.status === "error" ? "error.light" : "divider"
     },
     children: [
-      /* @__PURE__ */ e(ee, { children: s.status === "complete" ? /* @__PURE__ */ e(we, { color: "success" }) : s.status === "error" ? /* @__PURE__ */ e(_e, { color: "error" }) : ke(s.type) }),
+      /* @__PURE__ */ e(re, { children: n.status === "complete" ? /* @__PURE__ */ e(ke, { color: "success" }) : n.status === "error" ? /* @__PURE__ */ e(Ge, { color: "error" }) : Pe(n.type) }),
       /* @__PURE__ */ e(
-        pe,
+        ue,
         {
-          primary: s.name,
-          secondary: /* @__PURE__ */ m(k, { component: "span", children: [
-            Ce(s.size),
-            s.error && /* @__PURE__ */ m(_, { component: "span", color: "error", sx: { ml: 1 }, children: [
+          primary: n.name,
+          secondary: /* @__PURE__ */ f(C, { component: "span", children: [
+            De(n.size),
+            n.error && /* @__PURE__ */ f(_, { component: "span", color: "error", sx: { ml: 1 }, children: [
               "• ",
-              s.error
+              n.error
             ] })
           ] }),
           sx: {
@@ -614,13 +567,13 @@ const ve = () => `new-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`,
           }
         }
       ),
-      s.status === "uploading" && /* @__PURE__ */ e(k, { sx: { width: 100, mr: 2 }, children: /* @__PURE__ */ e(Ae, { variant: "determinate", value: s.progress }) }),
-      /* @__PURE__ */ e(We, { children: /* @__PURE__ */ e(ze, { edge: "end", onClick: () => p(s), size: "small", children: /* @__PURE__ */ e(Ue, { fontSize: "small" }) }) })
+      n.status === "uploading" && /* @__PURE__ */ e(C, { sx: { width: 100, mr: 2 }, children: /* @__PURE__ */ e(je, { variant: "determinate", value: n.progress }) }),
+      /* @__PURE__ */ e(Te, { children: /* @__PURE__ */ e($e, { edge: "end", onClick: () => d(n), size: "small", children: /* @__PURE__ */ e(_e, { fontSize: "small" }) }) })
     ]
   },
-  s.id
+  n.id
 )) });
 export {
-  cr as C,
-  dr as F
+  pr as C,
+  ur as F
 };