@trinityui/design-system 1.0.11 → 1.0.12

package/dist/forms.js

@@ -1,21 +1,21 @@
-import { jsxs as L, Fragment as Se, jsx as e } from "react/jsx-runtime";
-import * as a from "react";
-import { createElement as Le, useState as ie, useRef as Ie, useCallback as K } from "react";
-import { useTheme as ce, Paper as oe, Divider as ge, Button as ae, alpha as de, Autocomplete as ze, Typography as te, ListItem as ye, ListItemIcon as se, Checkbox as we, Box as J, ListItemText as ve, Popper as Fe, Chip as Ce, TextField as De, Alert as ue, Stack as Be, List as Re, LinearProgress as Te, ListItemSecondaryAction as Ee, IconButton as V, Tooltip as g, ToggleButtonGroup as Pe, ToggleButton as q, FormControl as Ue, Select as Ae, MenuItem as X } from "@mui/material";
-import { Add as qe, Close as me, Check as he, FullscreenExit as Me, Fullscreen as Oe, FormatClear as je, Redo as He, Undo as We, FormatAlignLeft as $e, FormatAlignCenter as Ke, FormatAlignRight as Ve, FormatAlignJustify as Ge, Image as Ne, Link as _e, Code as Je, FormatQuote as Qe, FormatListNumbered as Ye, FormatListBulleted as Ze, StrikethroughS as Xe, FormatUnderlined as et, FormatItalic as tt, FormatBold as rt } from "@mui/icons-material";
-import le from "@mui/icons-material/CloudUpload";
-import nt from "@mui/icons-material/InsertDriveFile";
-import ot from "@mui/icons-material/Delete";
-import xe from "@mui/icons-material/CheckCircle";
-import it from "@mui/icons-material/Error";
-import lt from "@mui/icons-material/PictureAsPdf";
-import at from "@mui/icons-material/Image";
-import st from "@mui/icons-material/VideoLibrary";
-import ct from "@mui/icons-material/Description";
-const fe = () => `new-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`, dt = (l) => /* @__PURE__ */ e(
-  Fe,
+import { jsxs as k, jsx as e, Fragment as Fe } from "react/jsx-runtime";
+import * as l from "react";
+import { createElement as De, useState as de, useRef as Re, useCallback as Q } from "react";
+import { useTheme as ye, Paper as se, Box as E, ListItem as he, alpha as ce, ListItemIcon as ae, Checkbox as ve, ListItemText as pe, Divider as fe, Button as ge, Autocomplete as Be, Typography as oe, Popper as Te, Chip as Se, TextField as Pe, Alert as Ce, Stack as Ee, List as Ae, LinearProgress as Ue, ListItemSecondaryAction as Me, IconButton as Y, Tooltip as x, ToggleButtonGroup as Oe, ToggleButton as V, FormControl as je, Select as qe, MenuItem as ne } from "@mui/material";
+import { Check as ue, Add as We, Close as xe, FullscreenExit as He, Fullscreen as $e, FormatClear as Ke, Redo as Ve, Undo as Ge, FormatAlignLeft as Ne, FormatAlignCenter as _e, FormatAlignRight as Je, FormatAlignJustify as Qe, Image as Ye, Link as Ze, Code as Xe, FormatQuote as et, FormatListNumbered as tt, FormatListBulleted as rt, StrikethroughS as nt, FormatUnderlined as ot, FormatItalic as it, FormatBold as lt } from "@mui/icons-material";
+import me from "@mui/icons-material/CloudUpload";
+import at from "@mui/icons-material/InsertDriveFile";
+import st from "@mui/icons-material/Delete";
+import Le from "@mui/icons-material/CheckCircle";
+import ct from "@mui/icons-material/Error";
+import dt from "@mui/icons-material/PictureAsPdf";
+import ut from "@mui/icons-material/Image";
+import mt from "@mui/icons-material/VideoLibrary";
+import ht from "@mui/icons-material/Description";
+const be = () => `new-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`, pt = (i) => /* @__PURE__ */ e(
+  Te,
   {
-    ...l,
+    ...i,
     placement: "bottom-start",
     modifiers: [
       {
@@ -26,76 +26,90 @@ const fe = () => `new-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`,
       }
     ]
   }
-), wt = ({
-  options: l,
-  value: h,
-  defaultValue: s,
+), Bt = ({
+  options: i,
+  value: f,
+  defaultValue: a,
   onChange: v,
-  creatable: m = !1,
-  onCreate: C,
-  createText: I = 'Create "{value}"',
-  multiple: f = !1,
-  placeholder: G = "Select...",
-  label: M,
-  helperText: u,
-  error: T = !1,
-  errorMessage: Q,
-  disabled: O = !1,
-  fullWidth: p = !1,
-  size: c = "medium",
-  limitTags: d = 3,
-  showCheckbox: j = !0,
-  groupBy: E = !1,
-  loading: w = !1,
-  noOptionsText: H = "No options",
-  filterOptions: x,
-  renderOption: y,
-  renderTag: k,
-  freeSolo: F = !1,
-  autoHighlight: re = !0,
-  clearOnEscape: N = !0,
-  className: ne,
-  sx: ee
+  creatable: u = !1,
+  onCreate: L,
+  createText: D = 'Create "{value}"',
+  multiple: m = !1,
+  placeholder: Z = "Select...",
+  label: G,
+  helperText: d,
+  error: W = !1,
+  errorMessage: ee,
+  disabled: N = !1,
+  fullWidth: g = !1,
+  size: s = "medium",
+  limitTags: c = 3,
+  showCheckbox: A = !0,
+  groupBy: H = !1,
+  loading: B = !1,
+  noOptionsText: _ = "No options",
+  filterOptions: I,
+  renderOption: b,
+  renderTag: z,
+  freeSolo: T = !1,
+  autoHighlight: ie = !0,
+  clearOnEscape: X = !0,
+  showSelectAll: te = !1,
+  selectAllText: re = "Select All",
+  className: $,
+  sx: le
 }) => {
-  const R = ce(), [D, P] = a.useState(""), [Y, W] = a.useState(
-    s || []
-  ), b = h !== void 0 ? h : Y, _ = a.useCallback(
-    (t, o) => {
-      if (x)
-        return x(t, o);
-      const i = o.inputValue.toLowerCase();
-      return t.filter(
-        (U) => U.label.toLowerCase().includes(i) || U.secondary?.toLowerCase().includes(i)
+  const U = ye(), [w, J] = l.useState(""), [M, O] = l.useState(
+    a || []
+  ), j = f !== void 0 ? f : M, r = l.useCallback(
+    (n, o) => {
+      if (I)
+        return I(n, o);
+      const p = o.inputValue.toLowerCase();
+      return n.filter(
+        (S) => S.label.toLowerCase().includes(p) || S.secondary?.toLowerCase().includes(p)
       );
     },
-    [x]
-  ), $ = a.useMemo(() => !m || !D.trim() ? !1 : !l.some(
-    (o) => o.label.toLowerCase() === D.toLowerCase()
-  ), [m, D, l]), n = async (t, o) => {
-    let i;
-    if (f) {
-      const U = o || [];
-      i = await Promise.all(
-        U.map(async (A) => typeof A == "string" ? m && C ? await C(A) : { id: fe(), label: A } : A)
+    [I]
+  ), C = l.useMemo(() => !u || !w.trim() ? !1 : !i.some(
+    (o) => o.label.toLowerCase() === w.toLowerCase()
+  ), [u, w, i]), P = async (n, o) => {
+    let p;
+    if (m) {
+      const S = o || [];
+      p = await Promise.all(
+        S.map(async (K) => typeof K == "string" ? u && L ? await L(K) : { id: be(), label: K } : K)
       );
     } else
-      o === null ? i = [] : typeof o == "string" ? m && C ? i = [await C(o)] : i = [{ id: fe(), label: o }] : i = [o];
-    W(i), v?.(i);
-  }, S = a.useCallback(async () => {
-    if (!$ || !C) return;
-    const t = await C(D), o = f ? [...b, t] : [t];
-    W(o), v?.(o), P("");
-  }, [$, C, D, f, b, v]), B = (t) => /* @__PURE__ */ e(
-    De,
+      o === null ? p = [] : typeof o == "string" ? u && L ? p = [await L(o)] : p = [{ id: be(), label: o }] : p = [o];
+    O(p), v?.(p);
+  }, q = l.useMemo(() => {
+    const n = i.filter((o) => !o.disabled);
+    return n.length > 0 && n.every(
+      (o) => j.some((p) => p.id === o.id)
+    );
+  }, [i, j]), F = l.useCallback(() => {
+    if (q)
+      O([]), v?.([]);
+    else {
+      const n = i.filter((o) => !o.disabled);
+      O(n), v?.(n);
+    }
+  }, [q, i, v]), t = l.useCallback(async () => {
+    if (!C || !L) return;
+    const n = await L(w), o = m ? [...j, n] : [n];
+    O(o), v?.(o), J("");
+  }, [C, L, w, m, j, v]), h = (n) => /* @__PURE__ */ e(
+    Pe,
     {
-      ...t,
-      label: M,
-      placeholder: b.length === 0 ? G : void 0,
-      error: T,
-      helperText: T ? Q : u,
-      size: c,
+      ...n,
+      label: G,
+      placeholder: j.length === 0 ? Z : void 0,
+      error: W,
+      helperText: W ? ee : d,
+      size: s,
       InputProps: {
-        ...t.InputProps,
+        ...n.InputProps,
         sx: {
           "& .MuiAutocomplete-input": {
             minWidth: "60px !important"
@@ -103,16 +117,16 @@ const fe = () => `new-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`,
         }
       }
     }
-  ), Z = (t, o) => t.map((i, U) => {
-    const A = o({ index: U });
-    return k ? k(i, A.onDelete) : /* @__PURE__ */ Le(
-      Ce,
+  ), R = (n, o) => n.map((p, S) => {
+    const K = o({ index: S });
+    return z ? z(p, K.onDelete) : /* @__PURE__ */ De(
+      Se,
       {
-        ...A,
-        key: i.id,
-        label: i.label,
-        size: c,
-        deleteIcon: /* @__PURE__ */ e(me, { fontSize: "small" }),
+        ...K,
+        key: p.id,
+        label: p.label,
+        size: s,
+        deleteIcon: /* @__PURE__ */ e(xe, { fontSize: "small" }),
         sx: {
           maxWidth: 150,
           "& .MuiChip-label": {
@@ -122,80 +136,197 @@ const fe = () => `new-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`,
         }
       }
     );
-  }), z = a.useCallback(
-    (t) => /* @__PURE__ */ L(oe, { ...t, elevation: 8, children: [
-      t.children,
-      $ && /* @__PURE__ */ L(Se, { children: [
-        /* @__PURE__ */ e(ge, {}),
-        /* @__PURE__ */ e(
-          ae,
+  }), y = l.useCallback(
+    (n) => {
+      const { children: o, ...p } = n;
+      return /* @__PURE__ */ k(se, { ...p, elevation: 8, children: [
+        m && te && /* @__PURE__ */ k(
+          E,
           {
-            fullWidth: !0,
-            startIcon: /* @__PURE__ */ e(qe, {}),
-            onClick: S,
-            sx: {
-              justifyContent: "flex-start",
-              py: 1.5,
-              px: 2,
-              textTransform: "none",
-              color: "primary.main",
-              borderRadius: 0,
-              "&:hover": {
-                backgroundColor: de(R.palette.primary.main, 0.08)
-              }
+            onMouseDown: (S) => {
+              S.preventDefault(), S.stopPropagation();
+            },
+            onClick: (S) => {
+              S.preventDefault(), S.stopPropagation(), F();
             },
-            children: I.replace("{value}", D)
+            children: [
+              /* @__PURE__ */ k(
+                he,
+                {
+                  dense: !0,
+                  sx: {
+                    cursor: "pointer",
+                    "&:hover": {
+                      backgroundColor: ce(U.palette.primary.main, 0.08)
+                    }
+                  },
+                  children: [
+                    A && /* @__PURE__ */ e(ae, { sx: { minWidth: 36, pointerEvents: "none" }, children: /* @__PURE__ */ e(
+                      ve,
+                      {
+                        icon: /* @__PURE__ */ e(
+                          E,
+                          {
+                            sx: {
+                              width: 18,
+                              height: 18,
+                              border: "2px solid",
+                              borderColor: "action.active",
+                              borderRadius: 0.5,
+                              backgroundColor: "transparent"
+                            }
+                          }
+                        ),
+                        checkedIcon: /* @__PURE__ */ e(
+                          E,
+                          {
+                            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(
+                              ue,
+                              {
+                                sx: {
+                                  width: 14,
+                                  height: 14,
+                                  color: "primary.contrastText"
+                                }
+                              }
+                            )
+                          }
+                        ),
+                        checked: q,
+                        size: "small",
+                        disableRipple: !0,
+                        tabIndex: -1
+                      }
+                    ) }),
+                    /* @__PURE__ */ e(
+                      pe,
+                      {
+                        primary: q ? "Deselect All" : re,
+                        primaryTypographyProps: {
+                          variant: "body2",
+                          fontWeight: 500
+                        }
+                      }
+                    )
+                  ]
+                }
+              ),
+              /* @__PURE__ */ e(fe, {})
+            ]
           }
-        )
-      ] })
-    ] }),
-    [$, I, D, R.palette.primary.main, S]
-  ), r = l;
+        ),
+        o,
+        C && /* @__PURE__ */ k(Fe, { children: [
+          /* @__PURE__ */ e(fe, {}),
+          /* @__PURE__ */ e(
+            ge,
+            {
+              fullWidth: !0,
+              startIcon: /* @__PURE__ */ e(We, {}),
+              onClick: t,
+              sx: {
+                justifyContent: "flex-start",
+                py: 1.5,
+                px: 2,
+                textTransform: "none",
+                color: "primary.main",
+                borderRadius: 0,
+                "&:hover": {
+                  backgroundColor: ce(U.palette.primary.main, 0.08)
+                }
+              },
+              children: D.replace("{value}", w)
+            }
+          )
+        ] })
+      ] });
+    },
+    [C, D, w, U.palette.primary.main, t, m, te, A, F, q, re]
+  ), we = i;
   return /* @__PURE__ */ e(
-    ze,
+    Be,
     {
-      className: ne,
+      className: $,
       sx: {
-        width: p ? "100%" : 300,
-        ...ee
+        width: g ? "100%" : 300,
+        ...le
       },
-      multiple: f,
-      options: r,
-      value: f ? b : b[0] || null,
-      onChange: n,
-      inputValue: D,
-      onInputChange: (t, o) => P(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: E ? (t) => t.group || "" : void 0,
-      filterOptions: _,
-      renderInput: B,
-      renderTags: f ? Z : void 0,
-      renderOption: (t, o, { selected: i }) => {
-        const { key: U, ...A } = t;
-        return y ? /* @__PURE__ */ e("li", { ...A, children: y(o, { selected: i }) }, U) : /* @__PURE__ */ L(ye, { ...A, dense: !0, children: [
-          f && j && /* @__PURE__ */ e(se, { sx: { minWidth: 36 }, children: /* @__PURE__ */ e(
-            we,
+      multiple: m,
+      options: we,
+      value: m ? j : j[0] || null,
+      onChange: P,
+      inputValue: w,
+      onInputChange: (n, o) => J(o),
+      getOptionLabel: (n) => typeof n == "string" ? n : n.label,
+      isOptionEqualToValue: (n, o) => n.id === o.id,
+      getOptionDisabled: (n) => typeof n == "object" && n.disabled === !0,
+      groupBy: H ? (n) => n.group || "" : void 0,
+      filterOptions: r,
+      renderInput: h,
+      renderTags: m ? R : void 0,
+      renderOption: (n, o, { selected: p }) => {
+        const { key: S, ...K } = n;
+        return b ? /* @__PURE__ */ e("li", { ...K, children: b(o, { selected: p }) }, S) : /* @__PURE__ */ k(he, { ...K, dense: !0, children: [
+          m && A && /* @__PURE__ */ e(ae, { sx: { minWidth: 36 }, children: /* @__PURE__ */ e(
+            ve,
             {
-              icon: /* @__PURE__ */ e(J, { sx: { width: 18, height: 18 } }),
-              checkedIcon: /* @__PURE__ */ e(
-                he,
+              icon: /* @__PURE__ */ e(
+                E,
                 {
                   sx: {
                     width: 18,
                     height: 18,
-                    color: "primary.main"
+                    border: "2px solid",
+                    borderColor: "action.active",
+                    borderRadius: 0.5,
+                    backgroundColor: "transparent"
                   }
                 }
               ),
-              checked: i,
+              checkedIcon: /* @__PURE__ */ e(
+                E,
+                {
+                  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(
+                    ue,
+                    {
+                      sx: {
+                        width: 14,
+                        height: 14,
+                        color: "primary.contrastText"
+                      }
+                    }
+                  )
+                }
+              ),
+              checked: p,
               size: "small"
             }
           ) }),
-          o.icon && /* @__PURE__ */ e(se, { sx: { minWidth: 36 }, children: o.icon }),
+          o.icon && /* @__PURE__ */ e(ae, { sx: { minWidth: 36 }, children: o.icon }),
           /* @__PURE__ */ e(
-            ve,
+            pe,
             {
               primary: o.label,
               secondary: o.secondary,
@@ -203,238 +334,238 @@ const fe = () => `new-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`,
               secondaryTypographyProps: { variant: "caption" }
             }
           ),
-          !f && i && /* @__PURE__ */ e(he, { sx: { ml: 1, color: "primary.main" }, fontSize: "small" })
-        ] }, U);
+          !m && p && /* @__PURE__ */ e(ue, { sx: { ml: 1, color: "primary.main" }, fontSize: "small" })
+        ] }, S);
       },
-      PaperComponent: m ? z : oe,
-      PopperComponent: dt,
-      limitTags: d,
-      disabled: O,
-      loading: w,
-      noOptionsText: $ ? /* @__PURE__ */ e(te, { variant: "body2", color: "text.secondary", children: "Press Enter or click below to create" }) : H,
-      freeSolo: F || m,
-      autoHighlight: re,
-      clearOnEscape: N,
-      disableCloseOnSelect: f,
+      PaperComponent: u || m && te ? y : se,
+      PopperComponent: pt,
+      limitTags: c,
+      disabled: N,
+      loading: B,
+      noOptionsText: C ? /* @__PURE__ */ e(oe, { variant: "body2", color: "text.secondary", children: "Press Enter or click below to create" }) : _,
+      freeSolo: T || u,
+      autoHighlight: ie,
+      clearOnEscape: X,
+      disableCloseOnSelect: m,
       ChipProps: {
-        size: c,
-        deleteIcon: /* @__PURE__ */ e(me, { fontSize: "small" })
+        size: s,
+        deleteIcon: /* @__PURE__ */ e(xe, { fontSize: "small" })
       }
     }
   );
-}, ke = (l) => {
-  if (l === 0) return "0 Bytes";
-  const h = 1024, s = ["Bytes", "KB", "MB", "GB"], v = Math.floor(Math.log(l) / Math.log(h));
-  return parseFloat((l / Math.pow(h, v)).toFixed(2)) + " " + s[v];
-}, be = (l) => l.startsWith("image/") ? /* @__PURE__ */ e(at, {}) : l.startsWith("video/") ? /* @__PURE__ */ e(st, {}) : l === "application/pdf" ? /* @__PURE__ */ e(lt, {}) : l.includes("document") || l.includes("text") ? /* @__PURE__ */ e(ct, {}) : /* @__PURE__ */ e(nt, {}), ut = () => `file-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`, Ft = ({
-  variant: l = "dropzone",
-  accept: h,
-  multiple: s = !1,
+}, Ie = (i) => {
+  if (i === 0) return "0 Bytes";
+  const f = 1024, a = ["Bytes", "KB", "MB", "GB"], v = Math.floor(Math.log(i) / Math.log(f));
+  return parseFloat((i / Math.pow(f, v)).toFixed(2)) + " " + a[v];
+}, ze = (i) => i.startsWith("image/") ? /* @__PURE__ */ e(ut, {}) : i.startsWith("video/") ? /* @__PURE__ */ e(mt, {}) : i === "application/pdf" ? /* @__PURE__ */ e(dt, {}) : i.includes("document") || i.includes("text") ? /* @__PURE__ */ e(ht, {}) : /* @__PURE__ */ e(at, {}), ft = () => `file-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`, Tt = ({
+  variant: i = "dropzone",
+  accept: f,
+  multiple: a = !1,
   maxSize: v,
-  maxFiles: m,
-  files: C,
-  onFilesChange: I,
-  onFileSelect: f,
-  onFileRemove: G,
-  onUpload: M,
-  disabled: u = !1,
-  helperText: T,
-  error: Q,
-  showFileList: O = !0,
-  size: p = "medium",
-  sx: c
+  maxFiles: u,
+  files: L,
+  onFilesChange: D,
+  onFileSelect: m,
+  onFileRemove: Z,
+  onUpload: G,
+  disabled: d = !1,
+  helperText: W,
+  error: ee,
+  showFileList: N = !0,
+  size: g = "medium",
+  sx: s
 }) => {
-  const [d, j] = ie([]), [E, w] = ie(!1), [H, x] = ie(null), y = Ie(null), k = C ?? d, F = K((n) => {
-    typeof n == "function" ? I ? I(n(C ?? d)) : j(n) : I ? I(n) : j(n);
-  }, [C, d, I]), re = (n) => v && n.size > v ? `File "${n.name}" exceeds maximum size of ${ke(v)}` : m && k.length >= m ? `Maximum ${m} files allowed` : null, N = K(
-    async (n) => {
-      const S = Array.from(n), B = [], Z = [];
-      for (const z of S) {
-        const r = re(z);
-        if (r) {
-          Z.push(r);
+  const [c, A] = de([]), [H, B] = de(!1), [_, I] = de(null), b = Re(null), z = L ?? c, T = Q((r) => {
+    typeof r == "function" ? D ? D(r(L ?? c)) : A(r) : D ? D(r) : A(r);
+  }, [L, c, D]), ie = (r) => v && r.size > v ? `File "${r.name}" exceeds maximum size of ${Ie(v)}` : u && z.length >= u ? `Maximum ${u} files allowed` : null, X = Q(
+    async (r) => {
+      const C = Array.from(r), P = [], q = [];
+      for (const F of C) {
+        const t = ie(F);
+        if (t) {
+          q.push(t);
           continue;
         }
-        const t = {
-          id: ut(),
-          file: z,
-          name: z.name,
-          size: z.size,
-          type: z.type,
+        const h = {
+          id: ft(),
+          file: F,
+          name: F.name,
+          size: F.size,
+          type: F.type,
           progress: 0,
           status: "pending",
-          preview: z.type.startsWith("image/") ? URL.createObjectURL(z) : void 0
+          preview: F.type.startsWith("image/") ? URL.createObjectURL(F) : void 0
         };
-        B.push(t);
+        P.push(h);
       }
-      if (Z.length > 0 ? x(Z[0]) : x(null), B.length > 0) {
-        const z = s ? [...k, ...B] : B;
-        if (F(z), f?.(B.map((r) => r.file)), M)
-          for (const r of B)
+      if (q.length > 0 ? I(q[0]) : I(null), P.length > 0) {
+        const F = a ? [...z, ...P] : P;
+        if (T(F), m?.(P.map((t) => t.file)), G)
+          for (const t of P)
             try {
-              F(
-                (o) => o.map(
-                  (i) => i.id === r.id ? { ...i, status: "uploading" } : i
+              T(
+                (R) => R.map(
+                  (y) => y.id === t.id ? { ...y, status: "uploading" } : y
                 )
               );
-              const t = setInterval(() => {
-                F(
-                  (o) => o.map(
-                    (i) => i.id === r.id && i.progress < 90 ? { ...i, progress: i.progress + 10 } : i
+              const h = setInterval(() => {
+                T(
+                  (R) => R.map(
+                    (y) => y.id === t.id && y.progress < 90 ? { ...y, progress: y.progress + 10 } : y
                   )
                 );
               }, 200);
-              await M(r.file), clearInterval(t), F(
-                (o) => o.map(
-                  (i) => i.id === r.id ? { ...i, status: "complete", progress: 100 } : i
+              await G(t.file), clearInterval(h), T(
+                (R) => R.map(
+                  (y) => y.id === t.id ? { ...y, status: "complete", progress: 100 } : y
                 )
               );
-            } catch (t) {
-              F(
-                (o) => o.map(
-                  (i) => i.id === r.id ? {
-                    ...i,
+            } catch (h) {
+              T(
+                (R) => R.map(
+                  (y) => y.id === t.id ? {
+                    ...y,
                     status: "error",
-                    error: t instanceof Error ? t.message : "Upload failed"
-                  } : i
+                    error: h instanceof Error ? h.message : "Upload failed"
+                  } : y
                 )
               );
             }
       }
     },
-    [k, F, v, m, s, f, M]
-  ), ne = K((n) => {
-    n.preventDefault(), n.stopPropagation(), u || w(!0);
-  }, [u]), ee = K((n) => {
-    n.preventDefault(), n.stopPropagation(), w(!1);
-  }, []), R = K((n) => {
-    n.preventDefault(), n.stopPropagation();
-  }, []), D = K(
-    (n) => {
-      if (n.preventDefault(), n.stopPropagation(), w(!1), u) return;
-      const S = n.dataTransfer.files;
-      S.length > 0 && N(S);
+    [z, T, v, u, a, m, G]
+  ), te = Q((r) => {
+    r.preventDefault(), r.stopPropagation(), d || B(!0);
+  }, [d]), re = Q((r) => {
+    r.preventDefault(), r.stopPropagation(), B(!1);
+  }, []), $ = Q((r) => {
+    r.preventDefault(), r.stopPropagation();
+  }, []), le = Q(
+    (r) => {
+      if (r.preventDefault(), r.stopPropagation(), B(!1), d) return;
+      const C = r.dataTransfer.files;
+      C.length > 0 && X(C);
     },
-    [u, N]
-  ), P = K(
-    (n) => {
-      const S = n.target.files;
-      S && S.length > 0 && N(S), y.current && (y.current.value = "");
+    [d, X]
+  ), U = Q(
+    (r) => {
+      const C = r.target.files;
+      C && C.length > 0 && X(C), b.current && (b.current.value = "");
     },
-    [N]
-  ), Y = K(
-    (n) => {
-      n.preview && URL.revokeObjectURL(n.preview);
-      const S = k.filter((B) => B.id !== n.id);
-      F(S), G?.(n);
+    [X]
+  ), w = Q(
+    (r) => {
+      r.preview && URL.revokeObjectURL(r.preview);
+      const C = z.filter((P) => P.id !== r.id);
+      T(C), Z?.(r);
     },
-    [k, F, G]
-  ), W = () => {
-    y.current?.click();
-  }, b = Q || H, _ = /* @__PURE__ */ e(
+    [z, T, Z]
+  ), J = () => {
+    b.current?.click();
+  }, M = ee || _, O = /* @__PURE__ */ e(
     "input",
     {
-      ref: y,
+      ref: b,
       type: "file",
-      accept: h,
-      multiple: s,
-      onChange: P,
+      accept: f,
+      multiple: a,
+      onChange: U,
       style: { display: "none" },
-      disabled: u
+      disabled: d
     }
-  ), $ = K(
-    (n) => {
-      (n.key === "Enter" || n.key === " ") && !u && (n.preventDefault(), W());
+  ), j = Q(
+    (r) => {
+      (r.key === "Enter" || r.key === " ") && !d && (r.preventDefault(), J());
     },
-    [u]
+    [d]
   );
-  return l === "dropzone" ? /* @__PURE__ */ L(J, { sx: c, children: [
-    _,
-    /* @__PURE__ */ L(
-      oe,
+  return i === "dropzone" ? /* @__PURE__ */ k(E, { sx: s, children: [
+    O,
+    /* @__PURE__ */ k(
+      se,
       {
         role: "button",
-        tabIndex: u ? -1 : 0,
-        "aria-label": `Upload files${h ? `. Accepted formats: ${h}` : ""}. Drag and drop or press Enter to browse`,
-        "aria-disabled": u,
-        onDragEnter: ne,
-        onDragLeave: ee,
-        onDragOver: R,
-        onDrop: D,
-        onClick: W,
-        onKeyDown: $,
+        tabIndex: d ? -1 : 0,
+        "aria-label": `Upload files${f ? `. Accepted formats: ${f}` : ""}. Drag and drop or press Enter to browse`,
+        "aria-disabled": d,
+        onDragEnter: te,
+        onDragLeave: re,
+        onDragOver: $,
+        onDrop: le,
+        onClick: J,
+        onKeyDown: j,
         sx: {
-          p: p === "small" ? 3 : 4,
+          p: g === "small" ? 3 : 4,
           border: "2px dashed",
-          borderColor: b ? "error.main" : E ? "primary.main" : "divider",
+          borderColor: M ? "error.main" : H ? "primary.main" : "divider",
           borderRadius: "12px",
-          bgcolor: E ? "action.hover" : u ? "action.disabledBackground" : "background.paper",
+          bgcolor: H ? "action.hover" : d ? "action.disabledBackground" : "background.paper",
           textAlign: "center",
-          cursor: u ? "not-allowed" : "pointer",
+          cursor: d ? "not-allowed" : "pointer",
           transition: "all 0.2s ease",
           "&:hover": {
-            bgcolor: u ? void 0 : "action.hover",
-            borderColor: u ? void 0 : "primary.main"
+            bgcolor: d ? void 0 : "action.hover",
+            borderColor: d ? void 0 : "primary.main"
           }
         },
         children: [
           /* @__PURE__ */ e(
-            le,
+            me,
             {
               sx: {
-                fontSize: p === "small" ? 40 : 56,
-                color: E ? "primary.main" : "action.active",
+                fontSize: g === "small" ? 40 : 56,
+                color: H ? "primary.main" : "action.active",
                 mb: 2
               }
             }
           ),
-          /* @__PURE__ */ e(te, { variant: p === "small" ? "body1" : "h6", gutterBottom: !0, children: E ? "Drop files here" : "Drag & drop files here" }),
-          /* @__PURE__ */ e(te, { variant: "body2", color: "text.secondary", gutterBottom: !0, children: "or click to browse" }),
-          T && /* @__PURE__ */ e(te, { variant: "caption", color: "text.secondary", children: T })
+          /* @__PURE__ */ e(oe, { variant: g === "small" ? "body1" : "h6", gutterBottom: !0, children: H ? "Drop files here" : "Drag & drop files here" }),
+          /* @__PURE__ */ e(oe, { variant: "body2", color: "text.secondary", gutterBottom: !0, children: "or click to browse" }),
+          W && /* @__PURE__ */ e(oe, { variant: "caption", color: "text.secondary", children: W })
         ]
       }
     ),
-    b && /* @__PURE__ */ e(ue, { severity: "error", sx: { mt: 2 }, children: b }),
-    O && k.length > 0 && /* @__PURE__ */ e(pe, { files: k, onRemove: Y })
-  ] }) : l === "button" ? /* @__PURE__ */ L(J, { sx: c, children: [
-    _,
-    /* @__PURE__ */ L(
-      ae,
+    M && /* @__PURE__ */ e(Ce, { severity: "error", sx: { mt: 2 }, children: M }),
+    N && z.length > 0 && /* @__PURE__ */ e(ke, { files: z, onRemove: w })
+  ] }) : i === "button" ? /* @__PURE__ */ k(E, { sx: s, children: [
+    O,
+    /* @__PURE__ */ k(
+      ge,
       {
         variant: "contained",
-        startIcon: /* @__PURE__ */ e(le, {}),
-        onClick: W,
-        disabled: u,
-        size: p,
+        startIcon: /* @__PURE__ */ e(me, {}),
+        onClick: J,
+        disabled: d,
+        size: g,
         children: [
           "Upload ",
-          s ? "Files" : "File"
+          a ? "Files" : "File"
         ]
       }
     ),
-    b && /* @__PURE__ */ e(ue, { severity: "error", sx: { mt: 2 }, children: b }),
-    O && k.length > 0 && /* @__PURE__ */ e(pe, { files: k, onRemove: Y })
-  ] }) : /* @__PURE__ */ L(J, { sx: c, children: [
-    _,
-    /* @__PURE__ */ L(Be, { direction: "row", spacing: 1, alignItems: "center", flexWrap: "wrap", useFlexGap: !0, children: [
+    M && /* @__PURE__ */ e(Ce, { severity: "error", sx: { mt: 2 }, children: M }),
+    N && z.length > 0 && /* @__PURE__ */ e(ke, { files: z, onRemove: w })
+  ] }) : /* @__PURE__ */ k(E, { sx: s, children: [
+    O,
+    /* @__PURE__ */ k(Ee, { direction: "row", spacing: 1, alignItems: "center", flexWrap: "wrap", useFlexGap: !0, children: [
       /* @__PURE__ */ e(
-        ae,
+        ge,
         {
           variant: "outlined",
           size: "small",
-          startIcon: /* @__PURE__ */ e(le, {}),
-          onClick: W,
-          disabled: u,
+          startIcon: /* @__PURE__ */ e(me, {}),
+          onClick: J,
+          disabled: d,
           children: "Browse"
         }
       ),
-      k.map((n) => /* @__PURE__ */ e(
-        Ce,
+      z.map((r) => /* @__PURE__ */ e(
+        Se,
         {
-          icon: n.status === "complete" ? /* @__PURE__ */ e(xe, {}) : be(n.type),
-          label: n.name,
-          onDelete: () => Y(n),
-          color: n.status === "error" ? "error" : n.status === "complete" ? "success" : "default",
+          icon: r.status === "complete" ? /* @__PURE__ */ e(Le, {}) : ze(r.type),
+          label: r.name,
+          onDelete: () => w(r),
+          color: r.status === "error" ? "error" : r.status === "complete" ? "success" : "default",
           size: "small",
           sx: {
             maxWidth: 200,
@@ -444,32 +575,32 @@ const fe = () => `new-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`,
             }
           }
         },
-        n.id
+        r.id
       ))
     ] }),
-    b && /* @__PURE__ */ e(te, { variant: "caption", color: "error", sx: { mt: 0.5, display: "block" }, children: b })
+    M && /* @__PURE__ */ e(oe, { variant: "caption", color: "error", sx: { mt: 0.5, display: "block" }, children: M })
   ] });
-}, pe = ({ files: l, onRemove: h }) => /* @__PURE__ */ e(Re, { dense: !0, sx: { mt: 2 }, children: l.map((s) => /* @__PURE__ */ L(
-  ye,
+}, ke = ({ files: i, onRemove: f }) => /* @__PURE__ */ e(Ae, { dense: !0, sx: { mt: 2 }, children: i.map((a) => /* @__PURE__ */ k(
+  he,
   {
     sx: {
       bgcolor: "background.paper",
       borderRadius: "8px",
       mb: 1,
       border: "1px solid",
-      borderColor: s.status === "error" ? "error.light" : "divider"
+      borderColor: a.status === "error" ? "error.light" : "divider"
     },
     children: [
-      /* @__PURE__ */ e(se, { children: s.status === "complete" ? /* @__PURE__ */ e(xe, { color: "success" }) : s.status === "error" ? /* @__PURE__ */ e(it, { color: "error" }) : be(s.type) }),
+      /* @__PURE__ */ e(ae, { children: a.status === "complete" ? /* @__PURE__ */ e(Le, { color: "success" }) : a.status === "error" ? /* @__PURE__ */ e(ct, { color: "error" }) : ze(a.type) }),
       /* @__PURE__ */ e(
-        ve,
+        pe,
         {
-          primary: s.name,
-          secondary: /* @__PURE__ */ L(J, { component: "span", children: [
-            ke(s.size),
-            s.error && /* @__PURE__ */ L(te, { component: "span", color: "error", sx: { ml: 1 }, children: [
+          primary: a.name,
+          secondary: /* @__PURE__ */ k(E, { component: "span", children: [
+            Ie(a.size),
+            a.error && /* @__PURE__ */ k(oe, { component: "span", color: "error", sx: { ml: 1 }, children: [
               "• ",
-              s.error
+              a.error
             ] })
           ] }),
           sx: {
@@ -481,12 +612,12 @@ const fe = () => `new-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`,
           }
         }
       ),
-      s.status === "uploading" && /* @__PURE__ */ e(J, { sx: { width: 100, mr: 2 }, children: /* @__PURE__ */ e(Te, { variant: "determinate", value: s.progress }) }),
-      /* @__PURE__ */ e(Ee, { children: /* @__PURE__ */ e(V, { edge: "end", onClick: () => h(s), size: "small", children: /* @__PURE__ */ e(ot, { fontSize: "small" }) }) })
+      a.status === "uploading" && /* @__PURE__ */ e(E, { sx: { width: 100, mr: 2 }, children: /* @__PURE__ */ e(Ue, { variant: "determinate", value: a.progress }) }),
+      /* @__PURE__ */ e(Me, { children: /* @__PURE__ */ e(Y, { edge: "end", onClick: () => f(a), size: "small", children: /* @__PURE__ */ e(st, { fontSize: "small" }) }) })
     ]
   },
-  s.id
-)) }), mt = [
+  a.id
+)) }), gt = [
   "heading",
   "divider",
   "bold",
@@ -509,44 +640,44 @@ const fe = () => `new-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`,
   "clearFormat",
   "divider",
   "fullscreen"
-], ht = ({
-  items: l,
-  formats: h,
-  headingLevel: s,
+], yt = ({
+  items: i,
+  formats: f,
+  headingLevel: a,
   textAlign: v,
-  onFormat: m,
-  onHeadingChange: C,
-  onAlignChange: I,
-  onUndo: f,
-  onRedo: G,
-  onClearFormat: M,
-  onLinkInsert: u,
-  onImageInsert: T,
-  onFullscreen: Q,
-  isFullscreen: O,
-  canUndo: p,
-  canRedo: c,
-  disabled: d
+  onFormat: u,
+  onHeadingChange: L,
+  onAlignChange: D,
+  onUndo: m,
+  onRedo: Z,
+  onClearFormat: G,
+  onLinkInsert: d,
+  onImageInsert: W,
+  onFullscreen: ee,
+  isFullscreen: N,
+  canUndo: g,
+  canRedo: s,
+  disabled: c
 }) => {
-  const j = ce(), E = (w, H) => {
-    switch (w) {
+  const A = ye(), H = (B, _) => {
+    switch (B) {
       case "divider":
         return /* @__PURE__ */ e(
-          ge,
+          fe,
           {
             orientation: "vertical",
             flexItem: !0,
             sx: { mx: 0.5 }
           },
-          `divider-${H}`
+          `divider-${_}`
         );
       case "heading":
-        return /* @__PURE__ */ e(Ue, { size: "small", sx: { minWidth: 100, mr: 1 }, children: /* @__PURE__ */ L(
-          Ae,
+        return /* @__PURE__ */ e(je, { size: "small", sx: { minWidth: 100, mr: 1 }, children: /* @__PURE__ */ k(
+          qe,
           {
-            value: s,
-            onChange: (x) => C(x.target.value),
-            disabled: d,
+            value: a,
+            onChange: (I) => L(I.target.value),
+            disabled: c,
             sx: {
               "& .MuiSelect-select": {
                 py: 0.5,
@@ -554,184 +685,184 @@ const fe = () => `new-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`,
               }
             },
             children: [
-              /* @__PURE__ */ e(X, { value: "p", children: "Paragraph" }),
-              /* @__PURE__ */ e(X, { value: "h1", children: "Heading 1" }),
-              /* @__PURE__ */ e(X, { value: "h2", children: "Heading 2" }),
-              /* @__PURE__ */ e(X, { value: "h3", children: "Heading 3" }),
-              /* @__PURE__ */ e(X, { value: "h4", children: "Heading 4" }),
-              /* @__PURE__ */ e(X, { value: "h5", children: "Heading 5" }),
-              /* @__PURE__ */ e(X, { value: "h6", children: "Heading 6" })
+              /* @__PURE__ */ e(ne, { value: "p", children: "Paragraph" }),
+              /* @__PURE__ */ e(ne, { value: "h1", children: "Heading 1" }),
+              /* @__PURE__ */ e(ne, { value: "h2", children: "Heading 2" }),
+              /* @__PURE__ */ e(ne, { value: "h3", children: "Heading 3" }),
+              /* @__PURE__ */ e(ne, { value: "h4", children: "Heading 4" }),
+              /* @__PURE__ */ e(ne, { value: "h5", children: "Heading 5" }),
+              /* @__PURE__ */ e(ne, { value: "h6", children: "Heading 6" })
             ]
           }
         ) }, "heading");
       case "bold":
-        return /* @__PURE__ */ e(g, { title: "Bold (Ctrl+B)", children: /* @__PURE__ */ e(
-          q,
+        return /* @__PURE__ */ e(x, { title: "Bold (Ctrl+B)", children: /* @__PURE__ */ e(
+          V,
           {
             value: "bold",
-            selected: h.has("bold"),
-            onChange: () => m("bold"),
-            disabled: d,
+            selected: f.has("bold"),
+            onChange: () => u("bold"),
+            disabled: c,
             size: "small",
-            children: /* @__PURE__ */ e(rt, { fontSize: "small" })
+            children: /* @__PURE__ */ e(lt, { fontSize: "small" })
           }
         ) }, "bold");
       case "italic":
-        return /* @__PURE__ */ e(g, { title: "Italic (Ctrl+I)", children: /* @__PURE__ */ e(
-          q,
+        return /* @__PURE__ */ e(x, { title: "Italic (Ctrl+I)", children: /* @__PURE__ */ e(
+          V,
           {
             value: "italic",
-            selected: h.has("italic"),
-            onChange: () => m("italic"),
-            disabled: d,
+            selected: f.has("italic"),
+            onChange: () => u("italic"),
+            disabled: c,
             size: "small",
-            children: /* @__PURE__ */ e(tt, { fontSize: "small" })
+            children: /* @__PURE__ */ e(it, { fontSize: "small" })
           }
         ) }, "italic");
       case "underline":
-        return /* @__PURE__ */ e(g, { title: "Underline (Ctrl+U)", children: /* @__PURE__ */ e(
-          q,
+        return /* @__PURE__ */ e(x, { title: "Underline (Ctrl+U)", children: /* @__PURE__ */ e(
+          V,
           {
             value: "underline",
-            selected: h.has("underline"),
-            onChange: () => m("underline"),
-            disabled: d,
+            selected: f.has("underline"),
+            onChange: () => u("underline"),
+            disabled: c,
             size: "small",
-            children: /* @__PURE__ */ e(et, { fontSize: "small" })
+            children: /* @__PURE__ */ e(ot, { fontSize: "small" })
           }
         ) }, "underline");
       case "strike":
-        return /* @__PURE__ */ e(g, { title: "Strikethrough", children: /* @__PURE__ */ e(
-          q,
+        return /* @__PURE__ */ e(x, { title: "Strikethrough", children: /* @__PURE__ */ e(
+          V,
           {
             value: "strikeThrough",
-            selected: h.has("strikeThrough"),
-            onChange: () => m("strikeThrough"),
-            disabled: d,
+            selected: f.has("strikeThrough"),
+            onChange: () => u("strikeThrough"),
+            disabled: c,
             size: "small",
-            children: /* @__PURE__ */ e(Xe, { fontSize: "small" })
+            children: /* @__PURE__ */ e(nt, { fontSize: "small" })
           }
         ) }, "strike");
       case "bulletList":
-        return /* @__PURE__ */ e(g, { title: "Bullet List", children: /* @__PURE__ */ e(
-          q,
+        return /* @__PURE__ */ e(x, { title: "Bullet List", children: /* @__PURE__ */ e(
+          V,
           {
             value: "insertUnorderedList",
-            selected: h.has("insertUnorderedList"),
-            onChange: () => m("insertUnorderedList"),
-            disabled: d,
+            selected: f.has("insertUnorderedList"),
+            onChange: () => u("insertUnorderedList"),
+            disabled: c,
             size: "small",
-            children: /* @__PURE__ */ e(Ze, { fontSize: "small" })
+            children: /* @__PURE__ */ e(rt, { fontSize: "small" })
           }
         ) }, "bulletList");
       case "numberList":
-        return /* @__PURE__ */ e(g, { title: "Numbered List", children: /* @__PURE__ */ e(
-          q,
+        return /* @__PURE__ */ e(x, { title: "Numbered List", children: /* @__PURE__ */ e(
+          V,
           {
             value: "insertOrderedList",
-            selected: h.has("insertOrderedList"),
-            onChange: () => m("insertOrderedList"),
-            disabled: d,
+            selected: f.has("insertOrderedList"),
+            onChange: () => u("insertOrderedList"),
+            disabled: c,
             size: "small",
-            children: /* @__PURE__ */ e(Ye, { fontSize: "small" })
+            children: /* @__PURE__ */ e(tt, { fontSize: "small" })
           }
         ) }, "numberList");
       case "quote":
-        return /* @__PURE__ */ e(g, { title: "Block Quote", children: /* @__PURE__ */ e(
-          V,
+        return /* @__PURE__ */ e(x, { title: "Block Quote", children: /* @__PURE__ */ e(
+          Y,
           {
-            onClick: () => m("formatBlock"),
-            disabled: d,
+            onClick: () => u("formatBlock"),
+            disabled: c,
             size: "small",
-            children: /* @__PURE__ */ e(Qe, { fontSize: "small" })
+            children: /* @__PURE__ */ e(et, { fontSize: "small" })
           }
         ) }, "quote");
       case "code":
-        return /* @__PURE__ */ e(g, { title: "Code Block", children: /* @__PURE__ */ e(
-          V,
+        return /* @__PURE__ */ e(x, { title: "Code Block", children: /* @__PURE__ */ e(
+          Y,
           {
-            onClick: () => m("code"),
-            disabled: d,
+            onClick: () => u("code"),
+            disabled: c,
             size: "small",
-            children: /* @__PURE__ */ e(Je, { fontSize: "small" })
+            children: /* @__PURE__ */ e(Xe, { fontSize: "small" })
           }
         ) }, "code");
       case "link":
-        return /* @__PURE__ */ e(g, { title: "Insert Link", children: /* @__PURE__ */ e(
-          V,
+        return /* @__PURE__ */ e(x, { title: "Insert Link", children: /* @__PURE__ */ e(
+          Y,
           {
-            onClick: u,
-            disabled: d,
+            onClick: d,
+            disabled: c,
             size: "small",
-            children: /* @__PURE__ */ e(_e, { fontSize: "small" })
+            children: /* @__PURE__ */ e(Ze, { fontSize: "small" })
           }
         ) }, "link");
       case "image":
-        return /* @__PURE__ */ e(g, { title: "Insert Image", children: /* @__PURE__ */ e(
-          V,
+        return /* @__PURE__ */ e(x, { title: "Insert Image", children: /* @__PURE__ */ e(
+          Y,
           {
-            onClick: T,
-            disabled: d,
+            onClick: W,
+            disabled: c,
             size: "small",
-            children: /* @__PURE__ */ e(Ne, { fontSize: "small" })
+            children: /* @__PURE__ */ e(Ye, { fontSize: "small" })
           }
         ) }, "image");
       case "align":
-        return /* @__PURE__ */ L(
-          Pe,
+        return /* @__PURE__ */ k(
+          Oe,
           {
             value: v,
             exclusive: !0,
-            onChange: (x, y) => y && I(y),
+            onChange: (I, b) => b && D(b),
             size: "small",
-            disabled: d,
+            disabled: c,
             children: [
-              /* @__PURE__ */ e(q, { value: "left", children: /* @__PURE__ */ e(g, { title: "Align Left", children: /* @__PURE__ */ e($e, { fontSize: "small" }) }) }),
-              /* @__PURE__ */ e(q, { value: "center", children: /* @__PURE__ */ e(g, { title: "Align Center", children: /* @__PURE__ */ e(Ke, { fontSize: "small" }) }) }),
-              /* @__PURE__ */ e(q, { value: "right", children: /* @__PURE__ */ e(g, { title: "Align Right", children: /* @__PURE__ */ e(Ve, { fontSize: "small" }) }) }),
-              /* @__PURE__ */ e(q, { value: "justify", children: /* @__PURE__ */ e(g, { title: "Justify", children: /* @__PURE__ */ e(Ge, { fontSize: "small" }) }) })
+              /* @__PURE__ */ e(V, { value: "left", children: /* @__PURE__ */ e(x, { title: "Align Left", children: /* @__PURE__ */ e(Ne, { fontSize: "small" }) }) }),
+              /* @__PURE__ */ e(V, { value: "center", children: /* @__PURE__ */ e(x, { title: "Align Center", children: /* @__PURE__ */ e(_e, { fontSize: "small" }) }) }),
+              /* @__PURE__ */ e(V, { value: "right", children: /* @__PURE__ */ e(x, { title: "Align Right", children: /* @__PURE__ */ e(Je, { fontSize: "small" }) }) }),
+              /* @__PURE__ */ e(V, { value: "justify", children: /* @__PURE__ */ e(x, { title: "Justify", children: /* @__PURE__ */ e(Qe, { fontSize: "small" }) }) })
             ]
           },
           "align"
         );
       case "undo":
-        return /* @__PURE__ */ e(g, { title: "Undo (Ctrl+Z)", children: /* @__PURE__ */ e("span", { children: /* @__PURE__ */ e(
-          V,
+        return /* @__PURE__ */ e(x, { title: "Undo (Ctrl+Z)", children: /* @__PURE__ */ e("span", { children: /* @__PURE__ */ e(
+          Y,
           {
-            onClick: f,
-            disabled: d || !p,
+            onClick: m,
+            disabled: c || !g,
             size: "small",
-            children: /* @__PURE__ */ e(We, { fontSize: "small" })
+            children: /* @__PURE__ */ e(Ge, { fontSize: "small" })
           }
         ) }) }, "undo");
       case "redo":
-        return /* @__PURE__ */ e(g, { title: "Redo (Ctrl+Y)", children: /* @__PURE__ */ e("span", { children: /* @__PURE__ */ e(
-          V,
+        return /* @__PURE__ */ e(x, { title: "Redo (Ctrl+Y)", children: /* @__PURE__ */ e("span", { children: /* @__PURE__ */ e(
+          Y,
           {
-            onClick: G,
-            disabled: d || !c,
+            onClick: Z,
+            disabled: c || !s,
             size: "small",
-            children: /* @__PURE__ */ e(He, { fontSize: "small" })
+            children: /* @__PURE__ */ e(Ve, { fontSize: "small" })
           }
         ) }) }, "redo");
       case "clearFormat":
-        return /* @__PURE__ */ e(g, { title: "Clear Formatting", children: /* @__PURE__ */ e(
-          V,
+        return /* @__PURE__ */ e(x, { title: "Clear Formatting", children: /* @__PURE__ */ e(
+          Y,
           {
-            onClick: M,
-            disabled: d,
+            onClick: G,
+            disabled: c,
             size: "small",
-            children: /* @__PURE__ */ e(je, { fontSize: "small" })
+            children: /* @__PURE__ */ e(Ke, { fontSize: "small" })
           }
         ) }, "clearFormat");
       case "fullscreen":
-        return /* @__PURE__ */ e(g, { title: O ? "Exit Fullscreen" : "Fullscreen", children: /* @__PURE__ */ e(
-          V,
+        return /* @__PURE__ */ e(x, { title: N ? "Exit Fullscreen" : "Fullscreen", children: /* @__PURE__ */ e(
+          Y,
           {
-            onClick: Q,
-            disabled: d,
+            onClick: ee,
+            disabled: c,
             size: "small",
-            children: O ? /* @__PURE__ */ e(Me, { fontSize: "small" }) : /* @__PURE__ */ e(Oe, { fontSize: "small" })
+            children: N ? /* @__PURE__ */ e(He, { fontSize: "small" }) : /* @__PURE__ */ e($e, { fontSize: "small" })
           }
         ) }, "fullscreen");
       default:
@@ -739,7 +870,7 @@ const fe = () => `new-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`,
     }
   };
   return /* @__PURE__ */ e(
-    J,
+    E,
     {
       sx: {
         display: "flex",
@@ -747,8 +878,8 @@ const fe = () => `new-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`,
         gap: 0.5,
         px: 1,
         py: 0.5,
-        borderBottom: `1px solid ${j.palette.divider}`,
-        backgroundColor: de(j.palette.background.default, 0.5),
+        borderBottom: `1px solid ${A.palette.divider}`,
+        backgroundColor: ce(A.palette.background.default, 0.5),
         flexWrap: "wrap",
         "& .MuiToggleButton-root": {
           border: "none",
@@ -759,154 +890,154 @@ const fe = () => `new-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`,
           p: 0.5
         }
       },
-      children: l.map((w, H) => E(w, H))
+      children: i.map((B, _) => H(B, _))
     }
   );
-}, Dt = ({
-  value: l = "",
-  onChange: h,
-  placeholder: s = "Start typing...",
+}, Pt = ({
+  value: i = "",
+  onChange: f,
+  placeholder: a = "Start typing...",
   height: v = 300,
-  minHeight: m = 150,
-  maxHeight: C,
-  readOnly: I = !1,
-  disabled: f = !1,
-  showToolbar: G = !0,
-  toolbarItems: M = mt,
-  onImageUpload: u,
-  autoFocus: T = !1,
-  className: Q,
-  sx: O
+  minHeight: u = 150,
+  maxHeight: L,
+  readOnly: D = !1,
+  disabled: m = !1,
+  showToolbar: Z = !0,
+  toolbarItems: G = gt,
+  onImageUpload: d,
+  autoFocus: W = !1,
+  className: ee,
+  sx: N
 }) => {
-  const p = ce(), c = a.useRef(null), [d, j] = a.useState(/* @__PURE__ */ new Set()), [E, w] = a.useState("p"), [H, x] = a.useState("left"), [y, k] = a.useState(!1), [F, re] = a.useState(!1), [N, ne] = a.useState(!1), ee = a.useRef(null);
-  a.useEffect(() => {
-    c.current && l !== c.current.innerHTML && (c.current.innerHTML = l);
-  }, [l]), a.useEffect(() => {
-    T && c.current && c.current.focus();
-  }, [T]);
-  const R = a.useCallback(() => {
-    const r = /* @__PURE__ */ new Set();
-    document.queryCommandState("bold") && r.add("bold"), document.queryCommandState("italic") && r.add("italic"), document.queryCommandState("underline") && r.add("underline"), document.queryCommandState("strikeThrough") && r.add("strikeThrough"), document.queryCommandState("insertUnorderedList") && r.add("insertUnorderedList"), document.queryCommandState("insertOrderedList") && r.add("insertOrderedList"), j(r);
-    const t = document.queryCommandValue("formatBlock");
-    t && ["h1", "h2", "h3", "h4", "h5", "h6", "p"].includes(t.toLowerCase()) && w(t.toLowerCase()), document.queryCommandState("justifyLeft") ? x("left") : document.queryCommandState("justifyCenter") ? x("center") : document.queryCommandState("justifyRight") ? x("right") : document.queryCommandState("justifyFull") && x("justify");
-  }, []), D = a.useCallback(() => {
-    c.current && (h?.(c.current.innerHTML), R());
-  }, [h, R]), P = a.useCallback((r) => {
-    r === "code" ? document.execCommand("formatBlock", !1, "pre") : r === "formatBlock" ? document.execCommand("formatBlock", !1, "blockquote") : document.execCommand(r, !1), R(), c.current?.focus();
-  }, [R]), Y = a.useCallback((r) => {
-    document.execCommand("formatBlock", !1, r), w(r), c.current?.focus();
-  }, []), W = a.useCallback((r) => {
-    const t = {
+  const g = ye(), s = l.useRef(null), [c, A] = l.useState(/* @__PURE__ */ new Set()), [H, B] = l.useState("p"), [_, I] = l.useState("left"), [b, z] = l.useState(!1), [T, ie] = l.useState(!1), [X, te] = l.useState(!1), re = l.useRef(null);
+  l.useEffect(() => {
+    s.current && i !== s.current.innerHTML && (s.current.innerHTML = i);
+  }, [i]), l.useEffect(() => {
+    W && s.current && s.current.focus();
+  }, [W]);
+  const $ = l.useCallback(() => {
+    const t = /* @__PURE__ */ new Set();
+    document.queryCommandState("bold") && t.add("bold"), document.queryCommandState("italic") && t.add("italic"), document.queryCommandState("underline") && t.add("underline"), document.queryCommandState("strikeThrough") && t.add("strikeThrough"), document.queryCommandState("insertUnorderedList") && t.add("insertUnorderedList"), document.queryCommandState("insertOrderedList") && t.add("insertOrderedList"), A(t);
+    const h = document.queryCommandValue("formatBlock");
+    h && ["h1", "h2", "h3", "h4", "h5", "h6", "p"].includes(h.toLowerCase()) && B(h.toLowerCase()), document.queryCommandState("justifyLeft") ? I("left") : document.queryCommandState("justifyCenter") ? I("center") : document.queryCommandState("justifyRight") ? I("right") : document.queryCommandState("justifyFull") && I("justify");
+  }, []), le = l.useCallback(() => {
+    s.current && (f?.(s.current.innerHTML), $());
+  }, [f, $]), U = l.useCallback((t) => {
+    t === "code" ? document.execCommand("formatBlock", !1, "pre") : t === "formatBlock" ? document.execCommand("formatBlock", !1, "blockquote") : document.execCommand(t, !1), $(), s.current?.focus();
+  }, [$]), w = l.useCallback((t) => {
+    document.execCommand("formatBlock", !1, t), B(t), s.current?.focus();
+  }, []), J = l.useCallback((t) => {
+    const h = {
       left: "justifyLeft",
       center: "justifyCenter",
       right: "justifyRight",
       justify: "justifyFull"
     };
-    document.execCommand(t[r], !1), x(r), c.current?.focus();
-  }, []), b = () => document.execCommand("undo"), _ = () => document.execCommand("redo"), $ = () => {
-    document.execCommand("removeFormat"), R();
-  }, n = a.useCallback(() => {
-    const r = window.prompt("Enter URL:");
-    r && document.execCommand("createLink", !1, r), c.current?.focus();
-  }, []), S = a.useCallback(() => {
-    ee.current?.click();
-  }, []), B = a.useCallback(async (r) => {
-    const t = r.target.files?.[0];
-    if (!t) return;
-    let o;
-    u ? o = await u(t) : o = URL.createObjectURL(t), document.execCommand("insertImage", !1, o), r.target.value = "", c.current?.focus();
-  }, [u]), Z = () => {
-    k(!y);
-  }, z = a.useCallback((r) => {
-    if (r.ctrlKey || r.metaKey)
-      switch (r.key.toLowerCase()) {
+    document.execCommand(h[t], !1), I(t), s.current?.focus();
+  }, []), M = () => document.execCommand("undo"), O = () => document.execCommand("redo"), j = () => {
+    document.execCommand("removeFormat"), $();
+  }, r = l.useCallback(() => {
+    const t = window.prompt("Enter URL:");
+    t && document.execCommand("createLink", !1, t), s.current?.focus();
+  }, []), C = l.useCallback(() => {
+    re.current?.click();
+  }, []), P = l.useCallback(async (t) => {
+    const h = t.target.files?.[0];
+    if (!h) return;
+    let R;
+    d ? R = await d(h) : R = URL.createObjectURL(h), document.execCommand("insertImage", !1, R), t.target.value = "", s.current?.focus();
+  }, [d]), q = () => {
+    z(!b);
+  }, F = l.useCallback((t) => {
+    if (t.ctrlKey || t.metaKey)
+      switch (t.key.toLowerCase()) {
         case "b":
-          r.preventDefault(), P("bold");
+          t.preventDefault(), U("bold");
           break;
         case "i":
-          r.preventDefault(), P("italic");
+          t.preventDefault(), U("italic");
           break;
         case "u":
-          r.preventDefault(), P("underline");
+          t.preventDefault(), U("underline");
           break;
         case "z":
-          r.shiftKey && (r.preventDefault(), _());
+          t.shiftKey && (t.preventDefault(), O());
           break;
       }
-  }, [P]);
-  return a.useEffect(() => {
-    const r = () => {
-      re(document.queryCommandEnabled("undo")), ne(document.queryCommandEnabled("redo"));
-    }, t = c.current;
-    if (t)
-      return t.addEventListener("input", r), () => t.removeEventListener("input", r);
-  }, []), /* @__PURE__ */ L(
-    oe,
+  }, [U]);
+  return l.useEffect(() => {
+    const t = () => {
+      ie(document.queryCommandEnabled("undo")), te(document.queryCommandEnabled("redo"));
+    }, h = s.current;
+    if (h)
+      return h.addEventListener("input", t), () => h.removeEventListener("input", t);
+  }, []), /* @__PURE__ */ k(
+    se,
     {
-      className: Q,
+      className: ee,
       variant: "outlined",
       sx: {
         display: "flex",
         flexDirection: "column",
         overflow: "hidden",
-        ...y && {
+        ...b && {
           position: "fixed",
           top: 0,
           left: 0,
           right: 0,
           bottom: 0,
-          zIndex: p.zIndex.modal,
+          zIndex: g.zIndex.modal,
           borderRadius: 0
         },
-        ...O
+        ...N
       },
       children: [
-        G && !I && /* @__PURE__ */ e(
-          ht,
+        Z && !D && /* @__PURE__ */ e(
+          yt,
           {
-            items: M,
-            formats: d,
-            headingLevel: E,
-            textAlign: H,
-            onFormat: P,
-            onHeadingChange: Y,
-            onAlignChange: W,
-            onUndo: b,
-            onRedo: _,
-            onClearFormat: $,
-            onLinkInsert: n,
-            onImageInsert: S,
-            onFullscreen: Z,
-            isFullscreen: y,
-            canUndo: F,
-            canRedo: N,
-            disabled: f
+            items: G,
+            formats: c,
+            headingLevel: H,
+            textAlign: _,
+            onFormat: U,
+            onHeadingChange: w,
+            onAlignChange: J,
+            onUndo: M,
+            onRedo: O,
+            onClearFormat: j,
+            onLinkInsert: r,
+            onImageInsert: C,
+            onFullscreen: q,
+            isFullscreen: b,
+            canUndo: T,
+            canRedo: X,
+            disabled: m
           }
         ),
         /* @__PURE__ */ e(
-          J,
+          E,
           {
-            ref: c,
-            contentEditable: !I && !f,
-            onInput: D,
-            onKeyDown: z,
-            onSelect: R,
+            ref: s,
+            contentEditable: !D && !m,
+            onInput: le,
+            onKeyDown: F,
+            onSelect: $,
             sx: {
               flex: 1,
               p: 2,
               overflow: "auto",
               outline: "none",
-              height: y ? "auto" : v,
-              minHeight: y ? "auto" : m,
-              maxHeight: y ? "none" : C,
-              fontFamily: p.typography.fontFamily,
-              fontSize: p.typography.body1.fontSize,
+              height: b ? "auto" : v,
+              minHeight: b ? "auto" : u,
+              maxHeight: b ? "none" : L,
+              fontFamily: g.typography.fontFamily,
+              fontSize: g.typography.body1.fontSize,
               lineHeight: 1.6,
-              color: f ? p.palette.text.disabled : p.palette.text.primary,
-              cursor: f ? "not-allowed" : "text",
+              color: m ? g.palette.text.disabled : g.palette.text.primary,
+              cursor: m ? "not-allowed" : "text",
               "&:empty::before": {
-                content: `"${s}"`,
-                color: p.palette.text.secondary,
+                content: `"${a}"`,
+                color: g.palette.text.secondary,
                 fontStyle: "italic"
               },
               "& h1, & h2, & h3, & h4, & h5, & h6": {
@@ -924,21 +1055,21 @@ const fe = () => `new-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`,
                 marginBottom: "1em"
               },
               "& blockquote": {
-                borderLeft: `4px solid ${p.palette.divider}`,
+                borderLeft: `4px solid ${g.palette.divider}`,
                 paddingLeft: 2,
                 marginLeft: 0,
-                color: p.palette.text.secondary,
+                color: g.palette.text.secondary,
                 fontStyle: "italic"
               },
               "& pre": {
-                backgroundColor: de(p.palette.text.primary, 0.05),
+                backgroundColor: ce(g.palette.text.primary, 0.05),
                 padding: 2,
                 borderRadius: 1,
                 fontFamily: "monospace",
                 overflow: "auto"
               },
               "& a": {
-                color: p.palette.primary.main,
+                color: g.palette.primary.main,
                 textDecoration: "underline"
               },
               "& img": {
@@ -953,10 +1084,10 @@ const fe = () => `new-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`,
         /* @__PURE__ */ e(
           "input",
           {
-            ref: ee,
+            ref: re,
             type: "file",
             accept: "image/*",
-            onChange: B,
+            onChange: P,
             style: { display: "none" }
           }
         )
@@ -965,7 +1096,7 @@ const fe = () => `new-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`,
   );
 };
 export {
-  wt as C,
-  Ft as F,
-  Dt as R
+  Bt as C,
+  Tt as F,
+  Pt as R
 };