obeyaka-ui 0.1.26 → 0.1.28

package/dist/index.es.js

@@ -1,7 +1,7 @@
 import { jsx as e, jsxs as v, Fragment as me } from "react/jsx-runtime";
-import be, { useState as C, useCallback as j, useMemo as K, memo as bn, useRef as Z, useEffect as Y, useLayoutEffect as Gn, Suspense as Yt, forwardRef as Zt, useImperativeHandle as qt, createContext as Qn, useContext as Yn } from "react";
-import { ActionIcon as le, Tooltip as Ue, Box as b, Skeleton as Xt, Loader as Se, Text as T, Group as A, InputWrapper as Zn, Input as Kt, Textarea as Mn, TextInput as Sn, useCombobox as rn, Combobox as re, Indicator as qn, MenuItem as Xn, Menu as pe, Stack as W, Pill as vn, Popover as je, LoadingOverlay as Jt, Button as ce, Table as we, Badge as Ke, Tabs as fe, ScrollArea as ke, Flex as Kn, Avatar as Jn, TagsInput as er, Radio as nr, Space as Ee, Modal as kn, FocusTrap as et, Drawer as Cn, Alert as tr, Anchor as nt, PillsInput as jn, Collapse as rr, AppShell as We, createTheme as or, MantineProvider as ir } from "@mantine/core";
-import { IconQuestionMark as He, IconSearch as On, IconX as tt, IconFilter as rt, IconFilterOff as ar, IconChevronDown as Ce, IconChevronRight as Je, IconPlus as Te, IconDots as Pe, IconCheck as on, IconChevronUp as Ve, IconClock as ot, IconMoodSmile as qe, IconFlag as cr, IconHeart as sr, IconBulb as lr, IconPlane as Fn, IconBallBasketball as dr, IconApple as ur, IconTrees as it, IconUser as zn, IconBriefcase as fr, IconDeviceDesktop as hr, IconCircle as pr, IconTool as mr, IconMessage as gr, IconPhoto as Un, IconArchive as xn, IconBell as Ir, IconInbox as yr, IconChecklist as gn, IconChevronsLeft as at, IconPointFilled as vr, IconPoint as xr, IconChevronLeft as Nn, IconMaximize as Dn, IconStar as wr, IconChevronsRight as Ne, IconMoodSmileFilled as Rn, IconAlignLeft as ct, IconUserCircle as st, IconUsers as lt, IconMenu2 as Wn } from "@tabler/icons-react";
+import be, { useState as O, useCallback as j, useMemo as K, memo as Mn, useRef as Z, useEffect as Y, useLayoutEffect as Qn, Suspense as Zt, forwardRef as qt, useImperativeHandle as Xt, createContext as Yn, useContext as Zn } from "react";
+import { ActionIcon as le, Tooltip as Ue, Box as b, Skeleton as vn, Loader as Se, Text as T, Group as A, InputWrapper as qn, Input as Kt, Textarea as Sn, TextInput as kn, useCombobox as rn, Combobox as re, Indicator as Xn, MenuItem as Kn, Menu as pe, Stack as W, Pill as xn, Popover as je, LoadingOverlay as Jt, Button as ce, Table as we, Badge as Ke, Tabs as fe, ScrollArea as ke, Flex as Jn, Avatar as et, TagsInput as er, Radio as nr, Space as Ee, Modal as Cn, FocusTrap as nt, Drawer as On, Alert as tr, Anchor as tt, PillsInput as Fn, Collapse as rr, AppShell as We, createTheme as or, MantineProvider as ir } from "@mantine/core";
+import { IconQuestionMark as He, IconSearch as zn, IconX as rt, IconFilter as ot, IconFilterOff as ar, IconChevronDown as Ce, IconChevronRight as Je, IconPlus as Te, IconDots as Pe, IconCheck as on, IconChevronUp as Ve, IconClock as it, IconMoodSmile as qe, IconFlag as cr, IconHeart as sr, IconBulb as lr, IconPlane as Un, IconBallBasketball as dr, IconApple as ur, IconTrees as at, IconUser as Dn, IconBriefcase as fr, IconDeviceDesktop as hr, IconCircle as pr, IconTool as mr, IconMessage as gr, IconPhoto as Nn, IconArchive as wn, IconBell as Ir, IconInbox as yr, IconChecklist as gn, IconChevronsLeft as ct, IconPointFilled as vr, IconPoint as xr, IconChevronLeft as Wn, IconMaximize as Rn, IconStar as wr, IconChevronsRight as Ne, IconMoodSmileFilled as Tn, IconAlignLeft as st, IconUserCircle as lt, IconUsers as dt, IconMenu2 as $n } from "@tabler/icons-react";
 import en from "@emoji-mart/data";
 import { init as br, SearchIndex as Mr } from "emoji-mart";
 import { useDisclosure as Xe, useMediaQuery as Sr } from "@mantine/hooks";
@@ -28,7 +28,7 @@ const he = be.memo(
     onMouseLeave: g,
     ...m
   }) => {
-    const [w, y] = C(!1), S = j(() => {
+    const [w, y] = O(!1), S = j(() => {
       l || d || (n == null || n(), console.log("Clicked"));
     }, [l, d, n]), M = K(() => ({
       xs: 14,
@@ -36,18 +36,18 @@ const he = be.memo(
       md: 20,
       lg: 24,
       xl: 28
-    })[a] || 20, [a]), D = K(() => ({
+    })[a] || 20, [a]), z = K(() => ({
       xs: 2,
       sm: 2,
       md: 2,
       lg: 2,
       xl: 2.5
-    })[a] || 2, [a]), O = j(
+    })[a] || 2, [a]), k = j(
       (F) => {
         y(!0), h == null || h(F);
       },
       [h]
-    ), k = j(
+    ), C = j(
       (F) => {
         y(!1), g == null || g(F);
       },
@@ -62,11 +62,11 @@ const he = be.memo(
         B,
         {
           size: M,
-          strokeWidth: D,
+          strokeWidth: z,
           color: i
         }
       ),
-      [B, M, D, i]
+      [B, M, z, i]
     ), R = /* @__PURE__ */ e(
       le,
       {
@@ -78,8 +78,8 @@ const he = be.memo(
         size: a,
         disabled: l || d,
         loading: d,
-        onMouseEnter: O,
-        onMouseLeave: k,
+        onMouseEnter: k,
+        onMouseLeave: C,
         "aria-label": p || u,
         className: f,
         style: I,
@@ -232,9 +232,9 @@ const Er = async (n) => {
   } catch {
     return Me.set(n, He), He;
   }
-}, Br = (n) => n.replace(/^Icon/, "").replace(/([A-Z])/g, " $1").trim().toLowerCase().replace(/^./, (t) => t.toUpperCase()), dt = bn(
+}, Br = (n) => n.replace(/^Icon/, "").replace(/([A-Z])/g, " $1").trim().toLowerCase().replace(/^./, (t) => t.toUpperCase()), ut = Mn(
   ({ iconName: n, onClick: o, size: t = 20 }) => {
-    const [r, i] = C(null), [a, c] = C(!0), s = Z(null), l = Z(!0);
+    const [r, i] = O(null), [a, c] = O(!0), s = Z(null), l = Z(!0);
     Y(() => (l.current = !0, (async () => {
       try {
         const f = (await import("@tabler/icons-react"))[n];
@@ -262,7 +262,7 @@ const Er = async (n) => {
           border: "none",
           borderRadius: "var(--mantine-radius-sm)"
         },
-        children: /* @__PURE__ */ e(Xt, { width: t, height: t })
+        children: /* @__PURE__ */ e(vn, { width: t, height: t })
       }
     ) : /* @__PURE__ */ e(
       Ue,
@@ -311,8 +311,8 @@ const Er = async (n) => {
     );
   }
 );
-dt.displayName = "IconButton";
-const ut = bn(
+ut.displayName = "IconButton";
+const ft = Mn(
   ({
     iconName: n,
     size: o = "lg",
@@ -323,7 +323,7 @@ const ut = bn(
     onMouseEnter: c,
     onMouseLeave: s
   }) => {
-    const [l, d] = C(!1), [u, p] = C(() => Me.get(n) || null), f = Re(o), I = Math.round(f * 0.9);
+    const [l, d] = O(!1), [u, p] = O(() => Me.get(n) || null), f = Re(o), I = Math.round(f * 0.9);
     Y(() => {
       if (Me.has(n)) {
         p(() => Me.get(n));
@@ -401,7 +401,7 @@ const ut = bn(
     );
   }
 );
-ut.displayName = "IconAvatar";
+ft.displayName = "IconAvatar";
 const Ar = (n) => {
   const o = {
     xs: { width: 28, height: 28 },
@@ -461,7 +461,7 @@ const Ar = (n) => {
             // Disable all pointer events on the icon wrapper
           },
           children: /* @__PURE__ */ e(
-            ut,
+            ft,
             {
               iconName: n,
               size: c.width,
@@ -495,7 +495,7 @@ const Ar = (n) => {
   loading: c = !1,
   alt: s = "Avatar"
 }) => {
-  const [l, d] = C(!1), u = jr(o), p = t && r, f = () => {
+  const [l, d] = O(!1), u = jr(o), p = t && r, f = () => {
     d(!0);
   }, I = () => {
     d(!1);
@@ -572,7 +572,7 @@ const Ar = (n) => {
     height: n,
     fontSize: n * 0.5
   } : o[n];
-}, wn = ({
+}, bn = ({
   text: n = "?",
   size: o = "lg",
   editable: t = !1,
@@ -701,7 +701,7 @@ const Ar = (n) => {
     if (c) {
       const p = s ? Nr(s) : "?";
       return /* @__PURE__ */ e(
-        wn,
+        bn,
         {
           text: p,
           size: o,
@@ -714,7 +714,7 @@ const Ar = (n) => {
   };
   if (t)
     return /* @__PURE__ */ e(
-      wn,
+      bn,
       {
         size: o,
         loading: !0,
@@ -724,12 +724,12 @@ const Ar = (n) => {
     );
   const u = d();
   return u ? /* @__PURE__ */ e("div", { className: i, style: a, children: u }) : null;
-}, Tn = ({
+}, En = ({
   label: n,
   onClick: o,
   isActive: t = !1
 }) => {
-  const [r, i] = C(!1);
+  const [r, i] = O(!1);
   return /* @__PURE__ */ e(
     b,
     {
@@ -838,11 +838,11 @@ const Ar = (n) => {
   },
   ...m
 }) => {
-  const [w, y] = C(!1), [S, M] = C(n), [D, O] = C(!1);
+  const [w, y] = O(!1), [S, M] = O(n), [z, k] = O(!1);
   Y(() => {
-    g(D);
-  }, [D, g]);
-  const k = Z(null), x = {
+    g(z);
+  }, [z, g]);
+  const C = Z(null), x = {
     fontSize: "40px",
     fontWeight: 700,
     color: "var(--mantine-color-gray-9)",
@@ -856,14 +856,14 @@ const Ar = (n) => {
     M(n);
   }, [n]);
   const B = () => {
-    a || (y(!0), I && k.current && k.current.select());
+    a || (y(!0), I && C.current && C.current.select());
   }, L = () => {
     y(!1), S !== n && t(S);
   }, R = (N) => {
     M(N.target.value), r == null || r(N.target.value);
   }, F = (N) => {
     var $, H;
-    N.key === "Enter" ? (y(!1), t(S), ($ = k.current) == null || $.blur()) : N.key === "Escape" && (M(n), y(!1), (H = k.current) == null || H.blur());
+    N.key === "Enter" ? (y(!1), t(S), ($ = C.current) == null || $.blur()) : N.key === "Escape" && (M(n), y(!1), (H = C.current) == null || H.blur());
   }, Q = {
     cursor: a ? "not-allowed" : "text"
   }, _ = {
@@ -873,14 +873,14 @@ const Ar = (n) => {
     transition: "border-color 0.2s ease-in-out, border-width 0.2s ease-in-out",
     color: "var(--mantine-color-gray-9)"
   }, V = () => h ? { ..._, ...x } : _;
-  return /* @__PURE__ */ e(Zn, { label: o, size: s, children: /* @__PURE__ */ e(
+  return /* @__PURE__ */ e(qn, { label: o, size: s, children: /* @__PURE__ */ e(
     Kt,
     {
-      ref: k,
+      ref: C,
       value: S,
       onChange: R,
-      onMouseEnter: () => O(!0),
-      onMouseLeave: () => O(!1),
+      onMouseEnter: () => k(!0),
+      onMouseLeave: () => k(!1),
       onFocus: B,
       onBlur: L,
       onKeyDown: F,
@@ -922,13 +922,13 @@ const Ar = (n) => {
   pageTitle: y = !1,
   ...S
 }) => {
-  const [M, D] = C(!1), [O, k] = C(n), [x, B] = C(!1);
+  const [M, z] = O(!1), [k, C] = O(n), [x, B] = O(!1);
   Y(() => {
     w(x);
   }, [x, w]);
   const L = Z(null);
   Y(() => {
-    k(n);
+    C(n);
   }, [n]);
   const R = () => {
     const J = L.current;
@@ -938,16 +938,16 @@ const Ar = (n) => {
     m && R();
   }, [m]), Y(() => {
     m && R();
-  }, [O, m]);
+  }, [k, m]);
   const F = () => {
-    a || (D(!0), m && requestAnimationFrame(() => R()), I && L.current && L.current.select());
+    a || (z(!0), m && requestAnimationFrame(() => R()), I && L.current && L.current.select());
   }, Q = () => {
-    D(!1), O !== n && t(O);
+    z(!1), k !== n && t(k);
   }, _ = (J) => {
-    k(J.target.value), r == null || r(J.target.value);
+    C(J.target.value), r == null || r(J.target.value);
   }, V = (J) => {
     var q;
-    J.key === "Escape" && (k(n), D(!1), (q = L.current) == null || q.blur());
+    J.key === "Escape" && (C(n), z(!1), (q = L.current) == null || q.blur());
   }, N = {
     cursor: a ? "not-allowed" : "text"
   }, $ = {
@@ -969,18 +969,18 @@ const Ar = (n) => {
     lineHeight: "3rem"
   }, oe = () => y ? { ...$, ...H } : $;
   return /* @__PURE__ */ e(
-    Zn,
+    qn,
     {
       label: o,
       c: "var(--mantine-color-gray-9)",
       size: s,
       children: /* @__PURE__ */ e(
-        Mn,
+        Sn,
         {
           w: "100%",
           radius: "var(--mantine-radius-md)",
           ref: L,
-          value: O,
+          value: k,
           onChange: _,
           onMouseEnter: () => B(!0),
           onMouseLeave: () => B(!1),
@@ -1028,7 +1028,7 @@ const Ar = (n) => {
     } : {
       height: 28,
       iconSize: 20
-    }, [p, f] = C(!1), I = p && o && !a ? /* @__PURE__ */ e(
+    }, [p, f] = O(!1), I = p && o && !a ? /* @__PURE__ */ e(
       o,
       {
         size: u(t).iconSize,
@@ -1072,7 +1072,7 @@ const Ar = (n) => {
   disabled: s = !1,
   className: l
 }) => {
-  const [d, u] = C(!1), [p, f] = C(!1), [I, h] = C(t), g = Z(null), m = Z(null);
+  const [d, u] = O(!1), [p, f] = O(!1), [I, h] = O(t), g = Z(null), m = Z(null);
   Y(() => {
     h(t);
   }, [t]), Y(() => {
@@ -1097,9 +1097,9 @@ const Ar = (n) => {
     h(B), r == null || r(B);
   }, M = (x) => {
     x.key === "Enter" && (i == null || i(I)), x.key === "Escape" && w();
-  }, D = () => {
+  }, z = () => {
     h(""), r == null || r(""), a == null || a(), w();
-  }, k = (() => {
+  }, C = (() => {
     switch (c) {
       case "sm":
         return {
@@ -1150,8 +1150,8 @@ const Ar = (n) => {
                     display: "flex",
                     alignItems: "center",
                     justifyContent: "center",
-                    width: k.inputHeight,
-                    height: k.inputHeight,
+                    width: C.inputHeight,
+                    height: C.inputHeight,
                     cursor: s ? "not-allowed" : "pointer",
                     borderRadius: "var(--mantine-radius-md)",
                     transition: "background-color 0.2s ease",
@@ -1164,9 +1164,9 @@ const Ar = (n) => {
                     x.currentTarget.style.backgroundColor = "transparent";
                   },
                   children: /* @__PURE__ */ e(
-                    On,
+                    zn,
                     {
-                      size: k.iconSize,
+                      size: C.iconSize,
                       color: "var(--mantine-color-gray-6)",
                       strokeWidth: 2.3
                     }
@@ -1174,7 +1174,7 @@ const Ar = (n) => {
                 }
               ),
               d && /* @__PURE__ */ e(
-                Sn,
+                kn,
                 {
                   ref: g,
                   value: I,
@@ -1182,7 +1182,7 @@ const Ar = (n) => {
                   onKeyDown: M,
                   placeholder: o,
                   disabled: s,
-                  height: k.inputHeight,
+                  height: C.inputHeight,
                   fw: 500,
                   styles: {
                     root: {
@@ -1194,9 +1194,9 @@ const Ar = (n) => {
                       outline: "none",
                       backgroundColor: "transparent",
                       padding: "0 8px",
-                      height: k.inputHeight,
-                      minHeight: k.inputHeight,
-                      fontSize: k.fontSize,
+                      height: C.inputHeight,
+                      minHeight: C.inputHeight,
+                      fontSize: C.fontSize,
                       color: "var(--mantine-color-gray-8)",
                       borderRadius: "var(--mantine-radius-md)",
                       transition: "background-color 0.2s ease",
@@ -1216,7 +1216,7 @@ const Ar = (n) => {
                   rightSection: I && /* @__PURE__ */ e(
                     b,
                     {
-                      onClick: D,
+                      onClick: z,
                       style: {
                         display: "flex",
                         alignItems: "center",
@@ -1233,7 +1233,7 @@ const Ar = (n) => {
                         x.currentTarget.style.backgroundColor = "transparent";
                       },
                       children: /* @__PURE__ */ e(
-                        tt,
+                        rt,
                         {
                           size: 14,
                           color: "var(--mantine-color-gray-6)",
@@ -1269,7 +1269,7 @@ const Ar = (n) => {
       ]
     }
   );
-}, En = ({
+}, Bn = ({
   activeFilters: n,
   onFiltersChange: o,
   availableFilters: t,
@@ -1279,7 +1279,7 @@ const Ar = (n) => {
   const a = rn({
     onDropdownClose: () => a.resetSelectedOption(),
     onDropdownOpen: () => a.updateSelectedOptionIndex("active")
-  }), [c, s] = C(!1), l = n.length > 0, d = (g) => {
+  }), [c, s] = O(!1), l = n.length > 0, d = (g) => {
     if (g === "remove-filters")
       o([]);
     else {
@@ -1342,7 +1342,7 @@ const Ar = (n) => {
       onMouseEnter: () => s(!0),
       onMouseLeave: () => s(!1),
       onClick: () => a.toggleDropdown(),
-      children: /* @__PURE__ */ e(rt, { size: 20, stroke: 2.3 })
+      children: /* @__PURE__ */ e(ot, { size: 20, stroke: 2.3 })
     }
   );
   return /* @__PURE__ */ v(
@@ -1355,7 +1355,7 @@ const Ar = (n) => {
       position: i,
       children: [
         /* @__PURE__ */ e(re.Target, { children: l ? /* @__PURE__ */ e(
-          qn,
+          Xn,
           {
             offset: 2,
             position: "top-end",
@@ -1560,7 +1560,7 @@ const Ar = (n) => {
   const i = rn({
     onDropdownClose: () => i.resetSelectedOption(),
     onDropdownOpen: () => i.updateSelectedOptionIndex("active")
-  }), [a, c] = C(!1), s = (f) => {
+  }), [a, c] = O(!1), s = (f) => {
     const I = t == null ? void 0 : t.find(
       (h) => h.value === f
     );
@@ -1663,7 +1663,7 @@ const Ar = (n) => {
       ]
     }
   );
-}, Bn = ({
+}, An = ({
   activeFilters: n,
   onFiltersChange: o,
   availableFilters: t,
@@ -1721,7 +1721,7 @@ const Ar = (n) => {
   filterTagDropdownPosition: a = "bottom-start"
 }) => /* @__PURE__ */ v("div", { style: { display: "flex", flexDirection: "column", gap: "12px" }, children: [
   /* @__PURE__ */ e(
-    En,
+    Bn,
     {
       activeFilters: n,
       onFiltersChange: o,
@@ -1730,7 +1730,7 @@ const Ar = (n) => {
     }
   ),
   /* @__PURE__ */ e(
-    Bn,
+    An,
     {
       activeFilters: n,
       onFiltersChange: o,
@@ -1741,15 +1741,15 @@ const Ar = (n) => {
     }
   )
 ] }), Ri = Object.assign(Gr, {
-  Button: En,
-  Filters: Bn
+  Button: Bn,
+  Filters: An
 }), Qr = ({
   children: n,
   danger: o,
   active: t,
   ...r
 }) => /* @__PURE__ */ e(
-  Xn,
+  Kn,
   {
     ...r,
     style: {
@@ -1766,7 +1766,7 @@ const Ar = (n) => {
   children: t,
   ...r
 }) => {
-  const i = Z(null), [a, c] = C(0);
+  const i = Z(null), [a, c] = O(0);
   return Y(() => {
     i.current && c(i.current.offsetWidth);
   }, [n]), /* @__PURE__ */ v(pe, { ...r, children: [
@@ -1802,7 +1802,7 @@ const Ar = (n) => {
       }
     )
   ] });
-}, ft = ({
+}, ht = ({
   label: n,
   icon: o,
   onClick: t,
@@ -1814,7 +1814,7 @@ const Ar = (n) => {
   isActive: l = !1,
   ...d
 }) => {
-  const [u, p] = C(!1);
+  const [u, p] = O(!1);
   return /* @__PURE__ */ e(
     b,
     {
@@ -1887,7 +1887,7 @@ const Ar = (n) => {
       ] })
     }
   );
-}, $n = ({
+}, Hn = ({
   label: n,
   rightLabel: o,
   children: t,
@@ -1907,7 +1907,7 @@ const Ar = (n) => {
   "aria-label": m,
   ...w
 }) => {
-  const [y, S] = C(!1), [M, D] = C(!1), O = be.Children.count(t) > 0, k = !u && O && (f ? M : !0), x = j(() => {
+  const [y, S] = O(!1), [M, z] = O(!1), k = be.Children.count(t) > 0, C = !u && k && (f ? M : !0), x = j(() => {
     d || g == null || g();
   }, [g, d]), B = j(
     ($) => {
@@ -1916,9 +1916,9 @@ const Ar = (n) => {
     [r, d]
   ), L = j(
     ($) => {
-      $ == null || $.stopPropagation(), !d && O && !u && S((H) => !H);
+      $ == null || $.stopPropagation(), !d && k && !u && S((H) => !H);
     },
-    [d, O, u]
+    [d, k, u]
   ), R = j(() => {
     d || r == null || r();
   }, [r, d]), F = j(
@@ -1926,10 +1926,10 @@ const Ar = (n) => {
       d || i == null || i($);
     },
     [i, d, n]
-  ), Q = j(() => O ? be.Children.map(t, ($) => be.isValidElement($) ? be.cloneElement($, {
+  ), Q = j(() => k ? be.Children.map(t, ($) => be.isValidElement($) ? be.cloneElement($, {
     ...$.props,
     level: l + 1
-  }) : $) : null, [t, O, l]), _ = (a == null ? void 0 : a.map(($) => ({
+  }) : $) : null, [t, k, l]), _ = (a == null ? void 0 : a.map(($) => ({
     children: /* @__PURE__ */ v(A, { gap: "xs", wrap: "nowrap", children: [
       $.icon && /* @__PURE__ */ e($.icon, { size: 16 }),
       /* @__PURE__ */ e(T, { size: "sm", children: $.label })
@@ -1961,8 +1961,8 @@ const Ar = (n) => {
         w: "100%",
         px: 6,
         h: 40,
-        onMouseEnter: () => !d && D(!0),
-        onMouseLeave: () => D(!1),
+        onMouseEnter: () => !d && z(!0),
+        onMouseLeave: () => z(!1),
         onClick: x,
         bg: p || M ? "var(--mantine-color-gray-1)" : "transparent",
         "aria-expanded": y,
@@ -1976,10 +1976,10 @@ const Ar = (n) => {
             gap: 8,
             onClick: x,
             style: {
-              paddingLeft: u && !k ? `${(l + 1) * 32}px` : l > 0 ? `${l * 32}px` : "0px"
+              paddingLeft: u && !C ? `${(l + 1) * 32}px` : l > 0 ? `${l * 32}px` : "0px"
             },
             children: [
-              k ? /* @__PURE__ */ e(
+              C ? /* @__PURE__ */ e(
                 Be,
                 {
                   icon: y ? Ce : Je,
@@ -2045,7 +2045,7 @@ const Ar = (n) => {
         )
       }
     ),
-    y && !u && /* @__PURE__ */ e(W, { gap: 0, style: { width: "100%" }, children: O ? Q() : /* @__PURE__ */ e(b, { style: { marginLeft: l > 0 ? `${l * 16}px` : "0px" }, children: /* @__PURE__ */ e(T, { size: "sm", c: "dimmed", ta: "left", p: "sm", fw: 500, children: s }) }) })
+    y && !u && /* @__PURE__ */ e(W, { gap: 0, style: { width: "100%" }, children: k ? Q() : /* @__PURE__ */ e(b, { style: { marginLeft: l > 0 ? `${l * 16}px` : "0px" }, children: /* @__PURE__ */ e(T, { size: "sm", c: "dimmed", ta: "left", p: "sm", fw: 500, children: s }) }) })
   ] });
 }, Yr = "userChip-module__pill___DgFME", Zr = {
   pill: Yr
@@ -2055,7 +2055,7 @@ const Ar = (n) => {
   withRemoveButton: t = !1,
   onRemove: r
 }) => /* @__PURE__ */ e(
-  vn,
+  xn,
   {
     withRemoveButton: t,
     onRemove: r,
@@ -2084,7 +2084,7 @@ const Ar = (n) => {
   onClick: r,
   selected: i = !1
 }) => {
-  const [a, c] = C(!1);
+  const [a, c] = O(!1);
   return /* @__PURE__ */ e(
     b,
     {
@@ -2159,7 +2159,7 @@ const Ar = (n) => {
       )
     }
   );
-}, to = "bottom-end", ro = 1e4, oo = "24px", io = "0 8px", ao = "6px", Hn = "var(--mantine-radius-md)", co = "46px", An = ({
+}, to = "bottom-end", ro = 1e4, oo = "24px", io = "0 8px", ao = "6px", Pn = "var(--mantine-radius-md)", co = "46px", Ln = ({
   value: n,
   onChange: o,
   data: t,
@@ -2174,7 +2174,7 @@ const Ar = (n) => {
   triggerStyles: p,
   textStyles: f
 }) => {
-  const [I, h] = C(!1), g = (t || []).find((x) => x.value === n) || l, [m, w] = C(!1), [y, S] = C(!1), [M, D] = C(!1), O = r ? /* @__PURE__ */ e(
+  const [I, h] = O(!1), g = (t || []).find((x) => x.value === n) || l, [m, w] = O(!1), [y, S] = O(!1), [M, z] = O(!1), k = r ? /* @__PURE__ */ e(
     A,
     {
       p: "sm",
@@ -2186,7 +2186,7 @@ const Ar = (n) => {
         height: co,
         display: "flex",
         alignItems: "center",
-        borderRadius: Hn,
+        borderRadius: Pn,
         backgroundColor: y ? "var(--mantine-color-red-0)" : "transparent",
         transition: "background-color 0.2s ease"
       },
@@ -2194,20 +2194,20 @@ const Ar = (n) => {
       onMouseLeave: () => S(!1),
       children: /* @__PURE__ */ e(T, { size: "sm", c: "var(--mantine-color-red-6)", fw: 500, children: "Remove user" })
     }
-  ) : null, k = /* @__PURE__ */ v(
+  ) : null, C = /* @__PURE__ */ v(
     b,
     {
       onMouseEnter: () => !s && w(!0),
       onMouseLeave: () => !s && w(!1),
       onClick: () => {
-        s || (h(!0), D(!0));
+        s || (h(!0), z(!0));
       },
       style: {
         height: oo,
         cursor: s ? "not-allowed" : "pointer",
         display: "inline-flex",
         alignItems: "center",
-        borderRadius: Hn,
+        borderRadius: Pn,
         backgroundColor: s ? "transparent" : m || M ? "var(--mantine-color-gray-1)" : "transparent",
         transition: "background-color 0.2s ease",
         padding: io,
@@ -2249,7 +2249,7 @@ const Ar = (n) => {
     {
       opened: I,
       onChange: (x) => {
-        h(x), x || D(!1);
+        h(x), x || z(!1);
       },
       position: to,
       shadow: "md",
@@ -2257,7 +2257,7 @@ const Ar = (n) => {
       zIndex: ro,
       styles: d,
       children: [
-        /* @__PURE__ */ e(je.Target, { children: k }),
+        /* @__PURE__ */ e(je.Target, { children: C }),
         /* @__PURE__ */ e(
           je.Dropdown,
           {
@@ -2287,13 +2287,13 @@ const Ar = (n) => {
                         disabled: B,
                         selected: L,
                         onClick: (R) => {
-                          o == null || o(R), h(!1), D(!1);
+                          o == null || o(R), h(!1), z(!1);
                         }
                       },
                       x.value
                     );
                   }),
-                  O
+                  k
                 ]
               }
             )
@@ -2351,24 +2351,24 @@ const Ar = (n) => {
   striped: y = !1,
   highlightOnHover: S = !0,
   enableInfiniteScroll: M = !1,
-  isLoadingMore: D = !1,
-  hasMore: O = !1,
-  onLoadMore: k
+  isLoadingMore: z = !1,
+  hasMore: k = !1,
+  onLoadMore: C
 }) => {
-  const [x, B] = C(""), [L, R] = C([]), { loadMoreRef: F } = so(
+  const [x, B] = O(""), [L, R] = O([]), { loadMoreRef: F } = so(
     M,
-    k || (() => {
+    C || (() => {
     }),
-    O,
-    D
+    k,
+    z
   ), Q = K(() => [...d ? t.filter((E) => E.type === "select" && E.options).map((E) => ({
     value: E.key,
     label: E.label
   })) : [], ...u], [t, d, u]), _ = K(() => {
-    let z = o || [];
+    let D = o || [];
     if (x) {
       const E = x.toLowerCase();
-      z = z.filter((U) => t.some((P) => {
+      D = D.filter((U) => t.some((P) => {
         if (!P.searchable)
           return !1;
         const X = U[P.key];
@@ -2380,23 +2380,23 @@ const Ar = (n) => {
         const U = t.find(
           (P) => P.key === E.filterTag.filterOption.value
         );
-        U && (z = z.filter((P) => {
+        U && (D = D.filter((P) => {
           var de;
           const X = P[U.key];
           return String(X) === ((de = E.filterTag.selectedOption) == null ? void 0 : de.value);
         }));
       }
-    }), z;
-  }, [o, x, L, t]), V = (z) => {
-    B(z), g == null || g(z);
-  }, N = (z) => {
-    const E = t.find((P) => P.key === z);
+    }), D;
+  }, [o, x, L, t]), V = (D) => {
+    B(D), g == null || g(D);
+  }, N = (D) => {
+    const E = t.find((P) => P.key === D);
     if (!(E != null && E.sortable))
       return;
-    const U = I === z && h === "asc" ? "desc" : "asc";
-    f == null || f(z, U);
-  }, $ = (z) => {
-    const E = t.find((U) => U.key === z);
+    const U = I === D && h === "asc" ? "desc" : "asc";
+    f == null || f(D, U);
+  }, $ = (D) => {
+    const E = t.find((U) => U.key === D);
     return (E == null ? void 0 : E.type) === "select" && E.options ? E.options.map((U) => ({
       value: U.value,
       label: U.label
@@ -2411,37 +2411,37 @@ const Ar = (n) => {
       value: String(P),
       label: String(P).charAt(0).toUpperCase() + String(P).slice(1)
     })) : [];
-  }, H = (z, E) => {
+  }, H = (D, E) => {
     var P, X, de, G, ge;
-    const U = E[z.key];
-    switch (z.type) {
+    const U = E[D.key];
+    switch (D.type) {
       case "text":
         return /* @__PURE__ */ e(T, { size: "sm", c: U ? void 0 : "dimmed", children: U || "—" });
       case "date":
         if (!U)
           return /* @__PURE__ */ e(T, { size: "sm", c: "dimmed", children: "—" });
-        const ie = new Date(U), ze = z.format ? ie.toLocaleDateString("en-US", {
+        const ie = new Date(U), ze = D.format ? ie.toLocaleDateString("en-US", {
           year: "numeric",
           month: "2-digit",
           day: "2-digit"
         }) : ie.toLocaleDateString();
         return /* @__PURE__ */ e(T, { size: "sm", c: "dimmed", children: ze });
       case "select":
-        return z.options ? /* @__PURE__ */ e(
-          An,
+        return D.options ? /* @__PURE__ */ e(
+          Ln,
           {
             value: U,
-            data: z.options,
-            placeholder: z.label,
+            data: D.options,
+            placeholder: D.label,
             onChange: (Ie) => {
               var Le;
-              return (Le = z.onSelectChange) == null ? void 0 : Le.call(z, Ie, E);
+              return (Le = D.onSelectChange) == null ? void 0 : Le.call(D, Ie, E);
             },
-            disabled: (P = z.disabled) == null ? void 0 : P.call(z, E)
+            disabled: (P = D.disabled) == null ? void 0 : P.call(D, E)
           }
         ) : /* @__PURE__ */ e(T, { size: "sm", c: "dimmed", children: "—" });
       case "badge":
-        const cn = ((X = z.badgeColors) == null ? void 0 : X[U]) || "gray";
+        const cn = ((X = D.badgeColors) == null ? void 0 : X[U]) || "gray";
         return /* @__PURE__ */ e(
           Ke,
           {
@@ -2454,7 +2454,7 @@ const Ar = (n) => {
           }
         );
       case "avatar":
-        const sn = ((de = z.fallbackText) == null ? void 0 : de.call(z, E)) || String(U).charAt(0).toUpperCase();
+        const sn = ((de = D.fallbackText) == null ? void 0 : de.call(D, E)) || String(U).charAt(0).toUpperCase();
         return /* @__PURE__ */ e(
           Oe,
           {
@@ -2465,9 +2465,9 @@ const Ar = (n) => {
           }
         );
       case "custom":
-        return ((G = z.render) == null ? void 0 : G.call(z, U, E)) || /* @__PURE__ */ e(T, { size: "sm", c: "dimmed", children: "—" });
+        return ((G = D.render) == null ? void 0 : G.call(D, U, E)) || /* @__PURE__ */ e(T, { size: "sm", c: "dimmed", children: "—" });
       case "actions":
-        return (ge = z.actions) != null && ge.length ? /* @__PURE__ */ v(
+        return (ge = D.actions) != null && ge.length ? /* @__PURE__ */ v(
           pe,
           {
             shadow: "md",
@@ -2480,7 +2480,7 @@ const Ar = (n) => {
             },
             children: [
               /* @__PURE__ */ e(pe.Target, { children: /* @__PURE__ */ e(le, { variant: "subtle", size: "md", color: "gray", radius: "md", children: /* @__PURE__ */ e(Pe, { size: 16 }) }) }),
-              /* @__PURE__ */ e(pe.Dropdown, { children: z.actions.map((Ie, Le) => {
+              /* @__PURE__ */ e(pe.Dropdown, { children: D.actions.map((Ie, Le) => {
                 var _e;
                 return /* @__PURE__ */ e(
                   pe.Item,
@@ -2505,9 +2505,9 @@ const Ar = (n) => {
       default:
         return /* @__PURE__ */ e(T, { size: "sm", c: "dimmed", children: "—" });
     }
-  }, oe = (z) => {
+  }, oe = (D) => {
     var E;
-    return (E = t.find((U) => U.key === z)) != null && E.sortable ? I === z ? h === "asc" ? /* @__PURE__ */ e(Ve, { size: 14 }) : /* @__PURE__ */ e(Ce, { size: 14 }) : /* @__PURE__ */ e(Ve, { size: 14, style: { opacity: 0.3 } }) : null;
+    return (E = t.find((U) => U.key === D)) != null && E.sortable ? I === D ? h === "asc" ? /* @__PURE__ */ e(Ve, { size: 14 }) : /* @__PURE__ */ e(Ce, { size: 14 }) : /* @__PURE__ */ e(Ve, { size: 14, style: { opacity: 0.3 } }) : null;
   }, q = (() => {
     switch (w) {
       case "sm":
@@ -2537,19 +2537,19 @@ const Ar = (n) => {
               }
             ),
             Q.length > 0 && /* @__PURE__ */ e(
-              En,
+              Bn,
               {
-                activeFilters: L.map((z) => z.filterTag),
-                onFiltersChange: (z) => {
+                activeFilters: L.map((D) => D.filterTag),
+                onFiltersChange: (D) => {
                   R(
-                    z.map((E) => ({
+                    D.map((E) => ({
                       filterTag: E,
                       onUpdate: () => {
                       },
                       onRemove: () => {
                       }
                     }))
-                  ), p == null || p(z);
+                  ), p == null || p(D);
                 },
                 availableFilters: Q,
                 size: q.buttonSize
@@ -2573,19 +2573,19 @@ const Ar = (n) => {
         ] })
       ] }),
       Q.length > 0 && /* @__PURE__ */ e(
-        Bn,
+        An,
         {
-          activeFilters: L.map((z) => z.filterTag),
-          onFiltersChange: (z) => {
+          activeFilters: L.map((D) => D.filterTag),
+          onFiltersChange: (D) => {
             R(
-              z.map((E) => ({
+              D.map((E) => ({
                 filterTag: E,
                 onUpdate: () => {
                 },
                 onRemove: () => {
                 }
               }))
-            ), p == null || p(z);
+            ), p == null || p(D);
           },
           availableFilters: Q,
           size: "md",
@@ -2602,39 +2602,39 @@ const Ar = (n) => {
         highlightOnHoverColor: "var(--mantine-color-gray-0)",
         mt: "xs",
         children: [
-          /* @__PURE__ */ e(we.Thead, { children: /* @__PURE__ */ e(we.Tr, { children: t.map((z) => /* @__PURE__ */ e(
+          /* @__PURE__ */ e(we.Thead, { children: /* @__PURE__ */ e(we.Tr, { children: t.map((D) => /* @__PURE__ */ e(
             we.Th,
             {
               c: "var(--mantine-color-gray-6)",
               style: {
-                width: z.width,
-                textAlign: z.align || "left",
-                cursor: z.sortable ? "pointer" : "default"
+                width: D.width,
+                textAlign: D.align || "left",
+                cursor: D.sortable ? "pointer" : "default"
               },
-              onClick: () => z.sortable && N(z.key),
+              onClick: () => D.sortable && N(D.key),
               children: /* @__PURE__ */ v(A, { gap: "xs", wrap: "nowrap", children: [
-                z.icon && /* @__PURE__ */ e(b, { style: { display: "flex", alignItems: "center" }, children: z.icon }),
-                /* @__PURE__ */ e(T, { size: q.textSize, fw: 500, children: z.label }),
-                oe(z.key)
+                D.icon && /* @__PURE__ */ e(b, { style: { display: "flex", alignItems: "center" }, children: D.icon }),
+                /* @__PURE__ */ e(T, { size: q.textSize, fw: 500, children: D.label }),
+                oe(D.key)
               ] })
             },
-            String(z.key)
+            String(D.key)
           )) }) }),
-          /* @__PURE__ */ e(we.Tbody, { children: _.length === 0 ? /* @__PURE__ */ e(we.Tr, { children: /* @__PURE__ */ e(we.Td, { colSpan: t.length, ta: "center", py: "xl", children: /* @__PURE__ */ e(T, { c: "dimmed", children: s }) }) }) : _.map((z, E) => /* @__PURE__ */ e(
+          /* @__PURE__ */ e(we.Tbody, { children: _.length === 0 ? /* @__PURE__ */ e(we.Tr, { children: /* @__PURE__ */ e(we.Td, { colSpan: t.length, ta: "center", py: "xl", children: /* @__PURE__ */ e(T, { c: "dimmed", children: s }) }) }) : _.map((D, E) => /* @__PURE__ */ e(
             we.Tr,
             {
               style: { cursor: m ? "pointer" : "default" },
-              onClick: () => m == null ? void 0 : m(z),
+              onClick: () => m == null ? void 0 : m(D),
               children: t.map((U) => /* @__PURE__ */ e(
                 we.Td,
                 {
                   style: { textAlign: U.align || "left" },
-                  children: H(U, z)
+                  children: H(U, D)
                 },
                 String(U.key)
               ))
             },
-            z.id || E
+            D.id || E
           )) })
         ]
       }
@@ -2650,7 +2650,7 @@ const Ar = (n) => {
           alignItems: "center",
           minHeight: "60px"
         },
-        children: D && /* @__PURE__ */ v(A, { display: "flex", ta: "center", gap: "xs", children: [
+        children: z && /* @__PURE__ */ v(A, { display: "flex", ta: "center", gap: "xs", children: [
           /* @__PURE__ */ e(Se, { size: "sm", color: "gray.5" }),
           /* @__PURE__ */ e(T, { size: "sm", c: "dimmed", fw: 500, children: "Loading more..." })
         ] })
@@ -2667,9 +2667,9 @@ const uo = ({
   onImageSelect: t,
   onIconSelect: r
 } = {}) => {
-  const [i, a] = C(
+  const [i, a] = O(
     "emoji"
-  ), [c, s] = C(null), [l, d] = C(null), [u, p] = C(null), [f, I] = C(null), [h, g] = C(null), m = j((x) => {
+  ), [c, s] = O(null), [l, d] = O(null), [u, p] = O(null), [f, I] = O(null), [h, g] = O(null), m = j((x) => {
     a(x);
   }, []), w = j(
     (x) => {
@@ -2694,7 +2694,7 @@ const uo = ({
       I(x), d(null), g(null), p(null), n == null || n({ type: "icon", value: x }), r == null || r(x);
     },
     [n, r]
-  ), D = j(() => {
+  ), z = j(() => {
     if (h && l) {
       const x = URL.createObjectURL(h);
       n == null || n({
@@ -2702,9 +2702,9 @@ const uo = ({
         value: x
       }), t == null || t(h);
     }
-  }, [h, l, n, t]), O = j(() => {
+  }, [h, l, n, t]), k = j(() => {
     d(null), g(null), p(null), I(null);
-  }, []), k = j(() => {
+  }, []), C = j(() => {
     d(null), p(null), I(null), g(null), a("emoji"), s(null);
   }, []);
   return {
@@ -2717,11 +2717,11 @@ const uo = ({
     handleTabChange: m,
     handleTabHover: w,
     handleImagePreview: y,
-    handleImageAccept: D,
+    handleImageAccept: z,
     handleEmojiSelect: S,
     handleIconSelect: M,
-    clearImagePreview: O,
-    resetState: k
+    clearImagePreview: k,
+    resetState: C
   };
 }, fo = ({
   opened: n,
@@ -2757,7 +2757,7 @@ const uo = ({
   hasAvatar: a = !1,
   children: c
 }) => {
-  const [s, l] = C(!1);
+  const [s, l] = O(!1);
   return /* @__PURE__ */ v(
     fe,
     {
@@ -2904,14 +2904,14 @@ const uo = ({
     }
   );
 };
-let Pn = !1;
-Pn || (br({ data: en }), Pn = !0);
+let Vn = !1;
+Vn || (br({ data: en }), Vn = !0);
 const po = () => {
   const n = [
     {
       id: "frequent",
       name: "Frequently Used",
-      icon: /* @__PURE__ */ e(ot, { size: 20, strokeWidth: 2.5 })
+      icon: /* @__PURE__ */ e(it, { size: 20, strokeWidth: 2.5 })
     }
   ];
   return en.categories.forEach((o) => {
@@ -2922,7 +2922,7 @@ const po = () => {
           t = /* @__PURE__ */ e(qe, { size: 20, strokeWidth: 2 }), r = "Smileys & People";
           break;
         case "nature":
-          t = /* @__PURE__ */ e(it, { size: 20, strokeWidth: 2 }), r = "Animals & Nature";
+          t = /* @__PURE__ */ e(at, { size: 20, strokeWidth: 2 }), r = "Animals & Nature";
           break;
         case "foods":
           t = /* @__PURE__ */ e(ur, { size: 20, strokeWidth: 2 }), r = "Food & Drink";
@@ -2931,10 +2931,10 @@ const po = () => {
           t = /* @__PURE__ */ e(dr, { size: 20, strokeWidth: 2 }), r = "Activities";
           break;
         case "travel":
-          t = /* @__PURE__ */ e(Fn, { size: 20, strokeWidth: 2 }), r = "Travel & Places";
+          t = /* @__PURE__ */ e(Un, { size: 20, strokeWidth: 2 }), r = "Travel & Places";
           break;
         case "places":
-          t = /* @__PURE__ */ e(Fn, { size: 20, strokeWidth: 2 }), r = "Travel & Places";
+          t = /* @__PURE__ */ e(Un, { size: 20, strokeWidth: 2 }), r = "Travel & Places";
           break;
         case "objects":
           t = /* @__PURE__ */ e(lr, { size: 20, strokeWidth: 2 }), r = "Objects";
@@ -2962,13 +2962,13 @@ const po = () => {
   onEmojiSelect: n,
   height: o = 200
 }) => {
-  const [t, r] = C(""), [i, a] = C("people"), [c, s] = C(() => {
+  const [t, r] = O(""), [i, a] = O("people"), [c, s] = O(() => {
     if (typeof window < "u") {
       const m = localStorage.getItem("emoji-frequent");
       return m ? JSON.parse(m) : [];
     }
     return [];
-  }), [l, d] = C([]), [u, p] = C(!1), f = po();
+  }), [l, d] = O([]), [u, p] = O(!1), f = po();
   Y(() => {
     t.trim() ? (p(!0), Mr.search(t).then((m) => {
       d(
@@ -3012,12 +3012,12 @@ const po = () => {
   return /* @__PURE__ */ v(W, { gap: 0, style: { height: o, width: "100%" }, children: [
     /* @__PURE__ */ e(b, { p: "sm", pb: "xs", children: /* @__PURE__ */ v(W, { gap: "xs", children: [
       /* @__PURE__ */ e(
-        Sn,
+        kn,
         {
           placeholder: "Search emojis...",
           value: t,
           onChange: (m) => r(m.target.value),
-          leftSection: /* @__PURE__ */ e(On, { size: 16, strokeWidth: 2.5 }),
+          leftSection: /* @__PURE__ */ e(zn, { size: 16, strokeWidth: 2.5 }),
           fw: 500,
           size: "sm",
           radius: "md",
@@ -3113,7 +3113,7 @@ const po = () => {
         px: "sm",
         py: "xs",
         style: { borderTop: "1px solid var(--mantine-color-gray-3)" },
-        children: /* @__PURE__ */ e(Kn, { gap: "0px", justify: "center", wrap: "wrap", children: f.map((m) => /* @__PURE__ */ e(
+        children: /* @__PURE__ */ e(Jn, { gap: "0px", justify: "center", wrap: "wrap", children: f.map((m) => /* @__PURE__ */ e(
           Ue,
           {
             label: m.name,
@@ -3159,7 +3159,7 @@ const po = () => {
       }
     )
   ] });
-}, ht = [
+}, pt = [
   "IconUser",
   "IconUserCircle",
   "IconUserCheck",
@@ -3190,7 +3190,7 @@ const po = () => {
   "IconUserUp",
   "IconUserVoice",
   "IconUserWrench"
-], pt = [
+], mt = [
   "IconBriefcase",
   "IconBuilding",
   "IconBuildingStore",
@@ -3317,7 +3317,7 @@ const po = () => {
   "IconEdit",
   "IconEditCircle",
   "IconEditCircleOff"
-], mt = [
+], gt = [
   "IconDeviceDesktop",
   "IconDeviceLaptop",
   "IconDeviceMobile",
@@ -3448,7 +3448,7 @@ const po = () => {
   "IconCloudStar",
   "IconCloudUp",
   "IconCloudX"
-], gt = [
+], It = [
   "IconMoodSmile",
   "IconMoodHappy",
   "IconMoodWink",
@@ -3488,7 +3488,7 @@ const po = () => {
   "IconTongue",
   "IconGrin",
   "IconSmirk"
-], It = [
+], yt = [
   "IconTrees",
   "IconLeaf",
   "IconFlower",
@@ -3616,7 +3616,7 @@ const po = () => {
   "IconNestOff",
   "IconNestEggs",
   "IconNestEggsOff"
-], yt = [
+], vt = [
   "IconCircle",
   "IconSquare",
   "IconTriangle",
@@ -3714,7 +3714,7 @@ const po = () => {
   "IconZoomScan",
   "IconZoomScanFilled",
   "IconZoomX"
-], vt = [
+], xt = [
   "IconEdit",
   "IconDelete",
   "IconSave",
@@ -3958,7 +3958,7 @@ const po = () => {
   "IconPopOff",
   "IconSolus",
   "IconSolusOff"
-], xt = [
+], wt = [
   "IconMessage",
   "IconMessageCircle",
   "IconMessageDots",
@@ -4100,14 +4100,14 @@ const po = () => {
   "IconReceiptZloty"
 ];
 [
-  ...ht,
   ...pt,
   ...mt,
   ...gt,
   ...It,
   ...yt,
   ...vt,
-  ...xt
+  ...xt,
+  ...wt
 ];
 const $e = [
   {
@@ -4120,57 +4120,57 @@ const $e = [
   {
     id: "user",
     name: "User & Profile",
-    icons: ht
+    icons: pt
   },
   {
     id: "business",
     name: "Business & Work",
-    icons: pt
+    icons: mt
   },
   {
     id: "tech",
     name: "Technology",
-    icons: mt
+    icons: gt
   },
   {
     id: "expressions",
     name: "Expressions",
-    icons: gt
+    icons: It
   },
   {
     id: "nature",
     name: "Nature & Animals",
-    icons: It
+    icons: yt
   },
   {
     id: "shapes",
     name: "Shapes & Symbols",
-    icons: yt
+    icons: vt
   },
   {
     id: "actions",
     name: "Actions & Tools",
-    icons: vt
+    icons: xt
   },
   {
     id: "communication",
     name: "Communication",
-    icons: xt
+    icons: wt
   }
 ], go = {
-  recent: /* @__PURE__ */ e(ot, { size: 20, strokeWidth: 2.5 }),
-  user: /* @__PURE__ */ e(zn, { size: 20, strokeWidth: 2.5 }),
+  recent: /* @__PURE__ */ e(it, { size: 20, strokeWidth: 2.5 }),
+  user: /* @__PURE__ */ e(Dn, { size: 20, strokeWidth: 2.5 }),
   business: /* @__PURE__ */ e(fr, { size: 20, strokeWidth: 2.5 }),
   tech: /* @__PURE__ */ e(hr, { size: 20, strokeWidth: 2.5 }),
   expressions: /* @__PURE__ */ e(qe, { size: 20, strokeWidth: 2.5 }),
-  nature: /* @__PURE__ */ e(it, { size: 20, strokeWidth: 2.5 }),
+  nature: /* @__PURE__ */ e(at, { size: 20, strokeWidth: 2.5 }),
   shapes: /* @__PURE__ */ e(pr, { size: 20, strokeWidth: 2.5 }),
   actions: /* @__PURE__ */ e(mr, { size: 20, strokeWidth: 2.5 }),
   communication: /* @__PURE__ */ e(gr, { size: 20, strokeWidth: 2.5 })
 }, Io = ({
   selectedCategory: n,
   onCategoryChange: o
-}) => /* @__PURE__ */ e(Kn, { gap: "0px", justify: "center", wrap: "wrap", children: $e.map((t) => {
+}) => /* @__PURE__ */ e(Jn, { gap: "0px", justify: "center", wrap: "wrap", children: $e.map((t) => {
   const r = go[t.id];
   return /* @__PURE__ */ e(
     Ue,
@@ -4210,11 +4210,11 @@ const $e = [
     },
     t.id
   );
-}) }), wt = bn(
+}) }), bt = Mn(
   ({ onIconSelect: n, height: o = 358 }) => {
     var m, w;
-    const [t, r] = C(""), [i, a] = C("recent"), [c, s] = C(!1), [l, d] = C([]);
-    Gn(() => {
+    const [t, r] = O(""), [i, a] = O("recent"), [c, s] = O(!1), [l, d] = O([]);
+    Qn(() => {
       if (typeof window < "u") {
         const y = localStorage.getItem("avatar-icon-recent");
         if (y)
@@ -4245,14 +4245,14 @@ const $e = [
       (y, S) => {
         if (!y.trim())
           return S;
-        const M = y.toLowerCase().trim(), D = M.split(/\s+/);
-        return S.filter((O) => {
-          const x = O.replace(/^Icon/, "").split(/(?=[A-Z])/).map((B) => B.toLowerCase().trim()).filter((B) => B.length > 0);
-          return !!(x.some((B) => D.some((L) => B === L)) || M.length > 2 && x.some(
-            (B) => D.some((L) => B.startsWith(L))
+        const M = y.toLowerCase().trim(), z = M.split(/\s+/);
+        return S.filter((k) => {
+          const x = k.replace(/^Icon/, "").split(/(?=[A-Z])/).map((B) => B.toLowerCase().trim()).filter((B) => B.length > 0);
+          return !!(x.some((B) => z.some((L) => B === L)) || M.length > 2 && x.some(
+            (B) => z.some((L) => B.startsWith(L))
           ) || M.length <= 2 && x.some(
-            (B) => D.some((L) => B.includes(L))
-          ) || D.length > 1 && D.every(
+            (B) => z.some((L) => B.includes(L))
+          ) || z.length > 1 && z.every(
             (B) => x.some((L) => L === B || L.startsWith(B))
           ));
         });
@@ -4261,14 +4261,14 @@ const $e = [
     ), I = K(() => t.trim() ? f(t, u) : p, [t, p, u, f]), h = j(
       (y) => {
         u.includes(y) && d((M) => {
-          const D = [
+          const z = [
             y,
-            ...M.filter((O) => O !== y)
+            ...M.filter((k) => k !== y)
           ].slice(0, 20);
           return typeof window < "u" && localStorage.setItem(
             "avatar-icon-recent",
-            JSON.stringify(D)
-          ), D;
+            JSON.stringify(z)
+          ), z;
         }), n(y);
       },
       [n, u]
@@ -4283,12 +4283,12 @@ const $e = [
     return /* @__PURE__ */ v(W, { gap: 0, style: { height: o, width: "100%" }, children: [
       /* @__PURE__ */ e(b, { p: "sm", pb: "xs", children: /* @__PURE__ */ v(W, { gap: "xs", children: [
         /* @__PURE__ */ e(
-          Sn,
+          kn,
           {
             placeholder: t.trim() ? "Search all icons..." : `Search in ${(m = $e.find((y) => y.id === i)) == null ? void 0 : m.name}...`,
             value: t,
             onChange: (y) => r(y.target.value),
-            leftSection: /* @__PURE__ */ e(On, { size: 16 }),
+            leftSection: /* @__PURE__ */ e(zn, { size: 16 }),
             fw: 500,
             size: "sm",
             radius: "md",
@@ -4314,7 +4314,7 @@ const $e = [
             transition: "opacity 0.05s ease"
           },
           children: I.map((y) => /* @__PURE__ */ e(
-            dt,
+            ut,
             {
               iconName: y,
               onClick: () => h(y),
@@ -4343,7 +4343,7 @@ const $e = [
     ] });
   }
 );
-wt.displayName = "IconGrid";
+bt.displayName = "IconGrid";
 const yo = ({
   previewImage: n,
   fileInputRef: o,
@@ -4358,7 +4358,7 @@ const yo = ({
   n || t ? /* @__PURE__ */ v(b, { children: [
     /* @__PURE__ */ e(T, { size: "sm", fw: 500, mb: "xs", children: "Preview" }),
     /* @__PURE__ */ e(
-      Jn,
+      et,
       {
         src: n,
         radius: "md",
@@ -4386,7 +4386,7 @@ const yo = ({
           height: "64px"
         }
       },
-      leftSection: /* @__PURE__ */ e(Un, { size: 20 }),
+      leftSection: /* @__PURE__ */ e(Nn, { size: 20 }),
       onClick: a,
       loading: i,
       disabled: i,
@@ -4398,7 +4398,7 @@ const yo = ({
     ce,
     {
       variant: "outline",
-      leftSection: /* @__PURE__ */ e(Un, { size: 16 }),
+      leftSection: /* @__PURE__ */ e(Nn, { size: 16 }),
       onClick: a,
       loading: i,
       disabled: i,
@@ -4444,7 +4444,7 @@ const yo = ({
     )
   ] }),
   /* @__PURE__ */ e(T, { size: "xs", c: "var(--mantine-color-gray-6)", ta: "center", children: "Supported formats: JPG, PNG, GIF, WebP" })
-] }) }), vo = ({ onEmojiSelect: n }) => /* @__PURE__ */ e(mo, { onEmojiSelect: n, height: 358 }), xo = ({ onIconSelect: n }) => /* @__PURE__ */ e(wt, { onIconSelect: n, height: 358 }), wo = ({
+] }) }), vo = ({ onEmojiSelect: n }) => /* @__PURE__ */ e(mo, { onEmojiSelect: n, height: 358 }), xo = ({ onIconSelect: n }) => /* @__PURE__ */ e(bt, { onIconSelect: n, height: 358 }), wo = ({
   previewImage: n,
   selectedEmoji: o,
   size: t,
@@ -4482,7 +4482,7 @@ const yo = ({
       /* @__PURE__ */ e(T, { size: "sm", c: "gray.6", children: "Loading avatar options..." })
     ] })
   }
-), Ln = ({
+), jn = ({
   editable: n = !0,
   opened: o,
   onOpen: t,
@@ -4506,9 +4506,9 @@ const yo = ({
     tabHovered: y,
     previewImage: S,
     selectedEmoji: M,
-    selectedIcon: D,
-    selectedFile: O,
-    handleTabChange: k,
+    selectedIcon: z,
+    selectedFile: k,
+    handleTabChange: C,
     handleTabHover: x,
     handleImagePreview: B,
     handleImageAccept: L,
@@ -4533,14 +4533,14 @@ const yo = ({
   }, $ = (ie) => {
     ie && B(ie);
   }, H = () => {
-    O ? (L(), r()) : (M || D) && r();
+    k ? (L(), r()) : (M || z) && r();
   }, oe = () => {
     h.current && h.current.click();
   }, J = () => {
     Q();
   }, q = () => {
     console.log("Avatar removed"), c == null || c(), r();
-  }, z = () => !!i, E = () => l ? /* @__PURE__ */ e(wn, { size: s, loading: !0 }) : /* @__PURE__ */ e(
+  }, D = () => !!i, E = () => l ? /* @__PURE__ */ e(bn, { size: s, loading: !0 }) : /* @__PURE__ */ e(
     Oe,
     {
       avatar: i,
@@ -4570,10 +4570,10 @@ const yo = ({
     {
       selectedTab: w,
       tabHovered: y,
-      onTabChange: k,
+      onTabChange: C,
       onTabHover: x,
       onRemove: q,
-      hasAvatar: z(),
+      hasAvatar: D(),
       children: w === "emoji" ? U : w === "icons" ? P : X
     }
   ) }), G = /* @__PURE__ */ e("div", { style: { position: "relative", display: "inline-block" }, children: /* @__PURE__ */ v(
@@ -4599,7 +4599,7 @@ const yo = ({
             ref: g,
             p: 0,
             style: { width: "auto", overflow: "hidden", zIndex: I },
-            children: /* @__PURE__ */ e(Yt, { fallback: /* @__PURE__ */ e(bo, {}), children: de })
+            children: /* @__PURE__ */ e(Zt, { fallback: /* @__PURE__ */ e(bo, {}), children: de })
           }
         )
       ]
@@ -4652,7 +4652,7 @@ const yo = ({
   suggestedUsers: r = [],
   tagDisplayMap: i = {}
 }) => {
-  const [a, c] = C(""), [s, l] = C(
+  const [a, c] = O(""), [s, l] = O(
     []
   ), d = Z(null), u = n.map((g) => {
     if (i[g])
@@ -4694,8 +4694,8 @@ const yo = ({
         );
         return S ? S.email : y;
       }).filter((y) => y.includes("@") ? !0 : !m.some((M) => {
-        const D = M.name.toLowerCase(), O = y.toLowerCase();
-        return D.startsWith(O) && O !== D;
+        const z = M.name.toLowerCase(), k = y.toLowerCase();
+        return z.startsWith(k) && k !== z;
       }));
       o(w), c("");
     },
@@ -4718,7 +4718,7 @@ const yo = ({
     clearInput: f,
     handleInvite: h
   };
-}, bt = ({
+}, Mt = ({
   onInvite: n,
   onUpdateRole: o,
   onRemoveUser: t,
@@ -4726,9 +4726,9 @@ const yo = ({
   suggestedUsers: i = [],
   roleOptions: a = []
 }) => {
-  const [c, s] = C([]), [l, d] = C([]), [u, p] = C(""), [f, I] = C(
+  const [c, s] = O([]), [l, d] = O([]), [u, p] = O(""), [f, I] = O(
     {}
-  ), h = a.length > 0 ? a[0].value : void 0, [g, m] = C(
+  ), h = a.length > 0 ? a[0].value : void 0, [g, m] = O(
     h
   );
   Y(() => {
@@ -4739,15 +4739,15 @@ const yo = ({
       (F) => F.filter((Q) => R.includes(Q))
     );
   }, [c, i.length]);
-  const [w, y] = C(
+  const [w, y] = O(
     "invite"
-  ), [S, M] = C(
+  ), [S, M] = O(
     null
-  ), D = (R, F, Q) => {
+  ), z = (R, F, Q) => {
     n && n(R, F, Q), s([]), p("");
-  }, O = (R, F) => {
+  }, k = (R, F) => {
     o && o(R, F);
-  }, k = (R) => {
+  }, C = (R) => {
     t && t(R);
   }, x = (R) => {
     d(
@@ -4779,13 +4779,13 @@ const yo = ({
     tabHovered: S,
     setTabHovered: M,
     filteredUsers: L,
-    handleInvite: D,
-    handleUpdateRole: O,
-    handleRemoveUser: k,
+    handleInvite: z,
+    handleUpdateRole: k,
+    handleRemoveUser: C,
     handleToggleUser: x,
     handleAddSuggestedUser: B
   };
-}, Mt = Zt(
+}, St = qt(
   ({
     value: n,
     onChange: o,
@@ -4798,7 +4798,7 @@ const yo = ({
     suggestedUsers: l = [],
     tagDisplayMap: d = {}
   }, u) => {
-    const [p, f] = C(
+    const [p, f] = O(
       "Hello, I would like to invite you to join my workspace"
     ), {
       tagsInputRef: I,
@@ -4817,14 +4817,14 @@ const yo = ({
     }), M = () => {
       S(r, a, p), f("");
     };
-    qt(
+    Xt(
       u,
       () => ({
         clearInput: y
       }),
       [y]
     );
-    const D = h.length > 0, O = c && i.length > 0, k = g.length > 0;
+    const z = h.length > 0, k = c && i.length > 0, C = g.length > 0;
     return /* @__PURE__ */ v(W, { gap: "md", children: [
       /* @__PURE__ */ v(b, { children: [
         /* @__PURE__ */ e(
@@ -4843,9 +4843,9 @@ const yo = ({
                 ref: I,
                 value: h,
                 onChange: w,
-                placeholder: D ? "" : t,
+                placeholder: z ? "" : t,
                 radius: "md",
-                rightSection: O ? /* @__PURE__ */ e(
+                rightSection: k ? /* @__PURE__ */ e(
                   b,
                   {
                     style: {
@@ -4858,7 +4858,7 @@ const yo = ({
                       alignItems: "center"
                     },
                     children: /* @__PURE__ */ e(
-                      An,
+                      Ln,
                       {
                         value: a || "",
                         onChange: (x) => c(x),
@@ -4872,7 +4872,7 @@ const yo = ({
                 ) : null,
                 rightSectionProps: {
                   style: {
-                    width: O ? "120px" : "0px",
+                    width: k ? "120px" : "0px",
                     position: "absolute",
                     height: "32px",
                     right: "8px"
@@ -4880,14 +4880,14 @@ const yo = ({
                 },
                 styles: {
                   input: {
-                    paddingRight: O ? "130px" : "12px",
+                    paddingRight: k ? "130px" : "12px",
                     minHeight: "36px",
                     display: "flex",
                     flexWrap: "wrap",
                     alignItems: "center",
                     gap: "4px",
                     borderRadius: "var(--mantine-radius-md)",
-                    border: k ? "2px solid var(--mantine-color-red-6)" : "2px solid var(--mantine-color-blue-7)",
+                    border: C ? "2px solid var(--mantine-color-red-6)" : "2px solid var(--mantine-color-blue-7)",
                     backgroundColor: "var(--mantine-color-gray-0)"
                   },
                   pillsList: {
@@ -4897,8 +4897,8 @@ const yo = ({
                   pill: {
                     height: "24px !important",
                     borderRadius: "var(--mantine-radius-md) !important",
-                    backgroundColor: k ? "var(--mantine-color-red-1) !important" : "var(--mantine-color-orange-1) !important",
-                    color: k ? "var(--mantine-color-red-7) !important" : "var(--mantine-color-gray-7) !important",
+                    backgroundColor: C ? "var(--mantine-color-red-1) !important" : "var(--mantine-color-orange-1) !important",
+                    color: C ? "var(--mantine-color-red-7) !important" : "var(--mantine-color-gray-7) !important",
                     fontSize: "var(--mantine-font-size-sm)"
                   }
                 }
@@ -4906,15 +4906,15 @@ const yo = ({
             )
           }
         ),
-        k && /* @__PURE__ */ e(W, { gap: "xs", mt: "xs", children: g.map((x, B) => /* @__PURE__ */ v(T, { size: "xs", c: "red", children: [
+        C && /* @__PURE__ */ e(W, { gap: "xs", mt: "xs", children: g.map((x, B) => /* @__PURE__ */ v(T, { size: "xs", c: "red", children: [
           x.email,
           ": ",
           x.error
         ] }, B)) })
       ] }),
-      D && /* @__PURE__ */ v(W, { gap: "sm", children: [
+      z && /* @__PURE__ */ v(W, { gap: "sm", children: [
         /* @__PURE__ */ e(
-          Mn,
+          Sn,
           {
             size: "sm",
             value: p,
@@ -4994,7 +4994,7 @@ const yo = ({
       const y = w;
       r(n.id, y);
     }
-  }, p = c === "suggested" || c === "read-only", f = c === "invited" && a.length > 0, [I, h] = C(!1);
+  }, p = c === "suggested" || c === "read-only", f = c === "invited" && a.length > 0, [I, h] = O(!1);
   return /* @__PURE__ */ v(
     A,
     {
@@ -5056,7 +5056,7 @@ const yo = ({
             }
           ),
           f && !n.isCurrentUser && /* @__PURE__ */ e(
-            An,
+            Ln,
             {
               value: n.role,
               onChange: u,
@@ -5094,14 +5094,14 @@ const yo = ({
     selectedTab: y,
     setSelectedTab: S,
     tabHovered: M,
-    setTabHovered: D,
-    filteredUsers: O,
-    handleInvite: k,
+    setTabHovered: z,
+    filteredUsers: k,
+    handleInvite: C,
     handleUpdateRole: x,
     handleRemoveUser: B,
     handleToggleUser: L,
     handleAddSuggestedUser: R
-  } = bt({
+  } = Mt({
     onInvite: t,
     onUpdateRole: r,
     onRemoveUser: i,
@@ -5112,12 +5112,12 @@ const yo = ({
     R(N), d.current && d.current.clearInput();
   }, Q = /* @__PURE__ */ v(me, { children: [
     /* @__PURE__ */ e(
-      Mt,
+      St,
       {
         ref: d,
         value: u,
         onChange: p,
-        onInvite: k,
+        onInvite: C,
         roleOptions: s,
         selectedRole: m,
         onRoleChange: w,
@@ -5144,20 +5144,20 @@ const yo = ({
         N.id
       )) })
     ] }) }) }),
-    O.length > 0 && /* @__PURE__ */ e(
+    k.length > 0 && /* @__PURE__ */ e(
       ke,
       {
         pt: "sm",
         mah: 200,
         type: "auto",
         style: { overflow: "visible" },
-        children: /* @__PURE__ */ e(b, { children: O.length > 0 ? /* @__PURE__ */ v(me, { children: [
+        children: /* @__PURE__ */ e(b, { children: k.length > 0 ? /* @__PURE__ */ v(me, { children: [
           /* @__PURE__ */ v(T, { size: "sm", fw: 500, children: [
             "Suggested ",
             I.trim() && `(filtered by "${I}")`
           ] }),
           /* @__PURE__ */ e(Ee, { h: "sm" }),
-          /* @__PURE__ */ e(W, { gap: "sm", children: O.map((N) => /* @__PURE__ */ e(
+          /* @__PURE__ */ e(W, { gap: "sm", children: k.map((N) => /* @__PURE__ */ e(
             tn,
             {
               user: N,
@@ -5221,8 +5221,8 @@ const yo = ({
               onClick: () => {
                 S("invite");
               },
-              onMouseEnter: () => D("invite"),
-              onMouseLeave: () => D(null),
+              onMouseEnter: () => z("invite"),
+              onMouseLeave: () => z(null),
               style: {
                 backgroundColor: "transparent"
               },
@@ -5257,8 +5257,8 @@ const yo = ({
               onClick: () => {
                 S("publish");
               },
-              onMouseEnter: () => D("publish"),
-              onMouseLeave: () => D(null),
+              onMouseEnter: () => z("publish"),
+              onMouseLeave: () => z(null),
               style: {
                 backgroundColor: "transparent"
               },
@@ -5316,7 +5316,7 @@ const yo = ({
   suggestedUsers: c,
   label: s = "Share"
 }) => {
-  const [l, d] = C(!1);
+  const [l, d] = O(!1);
   return /* @__PURE__ */ e(
     To,
     {
@@ -5330,7 +5330,7 @@ const yo = ({
       roleOptions: a,
       suggestedUsers: c,
       children: /* @__PURE__ */ e(
-        Tn,
+        En,
         {
           label: s,
           onClick: () => d(!0),
@@ -5362,20 +5362,20 @@ const yo = ({
     handleInvite: y,
     handleUpdateRole: S,
     handleRemoveUser: M,
-    handleToggleUser: D,
-    handleAddSuggestedUser: O
-  } = bt({
+    handleToggleUser: z,
+    handleAddSuggestedUser: k
+  } = Mt({
     onInvite: t,
     onUpdateRole: r,
     onRemoveUser: i,
     invitedUsers: a,
     suggestedUsers: s,
     roleOptions: c
-  }), k = (x) => {
-    O(x), l.current && l.current.clearInput();
+  }), C = (x) => {
+    k(x), l.current && l.current.clearInput();
   };
   return /* @__PURE__ */ e(
-    kn,
+    Cn,
     {
       opened: n,
       onClose: o,
@@ -5393,7 +5393,7 @@ const yo = ({
           /* @__PURE__ */ e(
             he,
             {
-              icon: tt,
+              icon: rt,
               size: "md",
               onClick: o,
               color: "var(--mantine-color-gray-8)"
@@ -5401,7 +5401,7 @@ const yo = ({
           )
         ] }),
         /* @__PURE__ */ e(
-          Mt,
+          St,
           {
             ref: l,
             value: d,
@@ -5434,7 +5434,7 @@ const yo = ({
                 {
                   user: x,
                   isSelected: p.includes(x.id),
-                  onToggle: D,
+                  onToggle: z,
                   onUpdateRole: S,
                   onRemoveUser: M,
                   roleOptions: c,
@@ -5467,12 +5467,12 @@ const yo = ({
                 {
                   user: x,
                   isSelected: p.includes(x.id),
-                  onToggle: D,
+                  onToggle: z,
                   onUpdateRole: S,
                   onRemoveUser: M,
                   roleOptions: c,
                   variant: "suggested",
-                  onClick: () => k(x)
+                  onClick: () => C(x)
                 },
                 x.id
               )) })
@@ -5491,7 +5491,7 @@ const yo = ({
   groups: a = [],
   styles: c
 }) => {
-  const [s, l] = C("");
+  const [s, l] = O("");
   Y(() => {
     n && t.length > 0 ? l(t[0].id) : n || l("");
   }, [n, t]);
@@ -5505,7 +5505,7 @@ const yo = ({
     (I) => I.id === s
   );
   return /* @__PURE__ */ v(
-    kn,
+    Cn,
     {
       opened: n,
       onClose: p,
@@ -5524,7 +5524,7 @@ const yo = ({
       },
       radius: "md",
       children: [
-        /* @__PURE__ */ e(et.InitialFocus, {}),
+        /* @__PURE__ */ e(nt.InitialFocus, {}),
         /* @__PURE__ */ v(b, { style: { display: "flex", height: "100%", ...c == null ? void 0 : c.body }, children: [
           /* @__PURE__ */ e(
             b,
@@ -5536,7 +5536,7 @@ const yo = ({
               children: /* @__PURE__ */ e(ke, { h: "100%", children: /* @__PURE__ */ e(W, { gap: 0, p: "sm", children: a.map((I) => /* @__PURE__ */ e(b, { mb: "md", children: /* @__PURE__ */ v(be.Fragment, { children: [
                 /* @__PURE__ */ e(T, { size: "xs", fw: 600, c: "dimmed", m: 4, children: I }),
                 t.filter((h) => h.group === I).map((h) => /* @__PURE__ */ e(
-                  ft,
+                  ht,
                   {
                     label: h.label,
                     icon: h.icon,
@@ -5657,7 +5657,7 @@ const yo = ({
   actions: a
 }) => {
   var u, p, f, I, h;
-  const c = (/* @__PURE__ */ new Date()).getTime() - new Date(n.timestamp).getTime() < 6048e5 ? jo(n.timestamp, "en") : Bo(n.timestamp, "en"), [s, l] = C(!1), d = /* @__PURE__ */ v(
+  const c = (/* @__PURE__ */ new Date()).getTime() - new Date(n.timestamp).getTime() < 6048e5 ? jo(n.timestamp, "en") : Bo(n.timestamp, "en"), [s, l] = O(!1), d = /* @__PURE__ */ v(
     A,
     {
       bg: "var(--mantine-color-gray-1)",
@@ -5678,7 +5678,7 @@ const yo = ({
           he,
           {
             onClick: () => r(n.id),
-            icon: xn
+            icon: wn
           }
         )
       ]
@@ -5708,7 +5708,7 @@ const yo = ({
             },
             children: [
               (u = n.metadata) != null && u.avatar_url ? /* @__PURE__ */ e(
-                Jn,
+                et,
                 {
                   name: (p = n.metadata) == null ? void 0 : p.fullname,
                   size: "sm",
@@ -5745,7 +5745,7 @@ const yo = ({
                 ] })
               ] }),
               s ? d : !n.isRead && /* @__PURE__ */ e(
-                qn,
+                Xn,
                 {
                   color: "var(--mantine-color-blue-6)",
                   size: 10,
@@ -5772,7 +5772,7 @@ const yo = ({
     }
   );
 }, Uo = (n, o, t, r, i) => {
-  const [a, c] = C(!1), s = Z(null), l = Z(null), d = Z(null);
+  const [a, c] = O(!1), s = Z(null), l = Z(null), d = Z(null);
   Y(() => {
     c(n);
   }, [n]);
@@ -5845,7 +5845,7 @@ const yo = ({
     },
     {
       children: "Archive all",
-      leftSection: /* @__PURE__ */ e(xn, { size: 16 }),
+      leftSection: /* @__PURE__ */ e(wn, { size: 16 }),
       onClick: () => c()
     }
   ], y = [
@@ -5863,21 +5863,21 @@ const yo = ({
     },
     {
       children: "Archived",
-      leftSection: /* @__PURE__ */ e(xn, { size: 16 }),
+      leftSection: /* @__PURE__ */ e(wn, { size: 16 }),
       onClick: () => u == null ? void 0 : u("archived"),
       active: p === "archived"
     }
-  ], S = (O) => f && O.category && ["welcome", "upgrade"].includes(O.category) ? f(O, s, l) : /* @__PURE__ */ e(
+  ], S = (k) => f && k.category && ["welcome", "upgrade"].includes(k.category) ? f(k, s, l) : /* @__PURE__ */ e(
     Fo,
     {
-      notification: O,
+      notification: k,
       markAsRead: s,
       archiveNotification: l,
-      message: O.message,
-      actions: O.actions
+      message: k.message,
+      actions: k.actions
     },
-    O.id
-  ), { isActive: M, loadMoreRef: D } = Uo(
+    k.id
+  ), { isActive: M, loadMoreRef: z } = Uo(
     I,
     m,
     d || (() => {
@@ -5887,7 +5887,7 @@ const yo = ({
   );
   return /* @__PURE__ */ v(me, { children: [
     /* @__PURE__ */ e(
-      ft,
+      ht,
       {
         isActive: M,
         icon: /* @__PURE__ */ e(
@@ -5914,7 +5914,7 @@ const yo = ({
       }
     ),
     /* @__PURE__ */ v(
-      Cn,
+      On,
       {
         opened: I,
         onClose: g,
@@ -5936,7 +5936,7 @@ const yo = ({
           blur: 0
         },
         children: [
-          /* @__PURE__ */ e(et.InitialFocus, {}),
+          /* @__PURE__ */ e(nt.InitialFocus, {}),
           /* @__PURE__ */ v(
             b,
             {
@@ -5973,7 +5973,7 @@ const yo = ({
                               {
                                 position: "bottom-end",
                                 menuItems: y,
-                                trigger: /* @__PURE__ */ e(he, { icon: rt })
+                                trigger: /* @__PURE__ */ e(he, { icon: ot })
                               }
                             ),
                             /* @__PURE__ */ e(
@@ -6012,7 +6012,7 @@ const yo = ({
                       children: /* @__PURE__ */ e(Se, {})
                     }
                   ) : n.length > 0 ? /* @__PURE__ */ e(W, { gap: 0, children: n.map(
-                    (O) => S(O)
+                    (k) => S(k)
                   ) }) : /* @__PURE__ */ v(
                     W,
                     {
@@ -6031,7 +6031,7 @@ const yo = ({
                   /* @__PURE__ */ e(
                     b,
                     {
-                      ref: D,
+                      ref: z,
                       style: {
                         padding: "16px",
                         display: m ? "flex" : "none",
@@ -6069,7 +6069,7 @@ const yo = ({
       }
     )
   ] });
-}, Vn = ({
+}, _n = ({
   header: n,
   body: o,
   footer: t,
@@ -6077,7 +6077,7 @@ const yo = ({
   position: i = "left",
   bg: a = "var(--mantine-color-gray-0)"
 }) => {
-  const [c, s] = C(!1);
+  const [c, s] = O(!1);
   return /* @__PURE__ */ v(
     W,
     {
@@ -6106,7 +6106,7 @@ const yo = ({
       ]
     }
   );
-}, St = Qn(void 0), Li = ({
+}, kt = Yn(void 0), Li = ({
   children: n
 }) => {
   const [
@@ -6117,9 +6117,9 @@ const yo = ({
     openNotificationSidebar: t,
     closeNotificationSidebar: r
   };
-  return /* @__PURE__ */ e(St.Provider, { value: i, children: n });
+  return /* @__PURE__ */ e(kt.Provider, { value: i, children: n });
 }, ji = () => {
-  const n = Yn(St);
+  const n = Zn(kt);
   if (n === void 0)
     throw new Error("useNavbar must be used within an NavbarProvider");
   return n;
@@ -6216,13 +6216,13 @@ const yo = ({
   children: I,
   menuItems: h
 }) => {
-  const [g, m] = C(!1), [w, y] = C(""), S = K(() => w ? n.filter(
-    (k) => {
+  const [g, m] = O(!1), [w, y] = O(""), S = K(() => w ? n.filter(
+    (C) => {
       var x;
-      return k.name.toLowerCase().includes(w.toLowerCase()) || ((x = k.ownerEmail) == null ? void 0 : x.toLowerCase().includes(w.toLowerCase()));
+      return C.name.toLowerCase().includes(w.toLowerCase()) || ((x = C.ownerEmail) == null ? void 0 : x.toLowerCase().includes(w.toLowerCase()));
     }
-  ) : n, [n, w]), M = (k) => {
-    a == null || a(k.id), m(!1), y("");
+  ) : n, [n, w]), M = (C) => {
+    a == null || a(C.id), m(!1), y("");
   };
   if (r)
     return /* @__PURE__ */ v(A, { gap: "xs", children: [
@@ -6231,7 +6231,7 @@ const yo = ({
     ] });
   if (i)
     return /* @__PURE__ */ e(tr, { color: "red", title: "Error", children: d });
-  const [D, O] = C(f);
+  const [z, k] = O(f);
   return n.length === 0 && !r && !i ? /* @__PURE__ */ e(b, { children: /* @__PURE__ */ e(T, { size: "sm", c: "dimmed", children: s }) }) : /* @__PURE__ */ v(
     pe,
     {
@@ -6260,9 +6260,9 @@ const yo = ({
               cursor: "pointer"
             },
             className: `${yn.workspaceButton} ${u || ""}`,
-            bg: D || g ? "var(--mantine-color-gray-1)" : "transparent",
-            onMouseEnter: () => O(!0),
-            onMouseLeave: () => O(!1),
+            bg: z || g ? "var(--mantine-color-gray-1)" : "transparent",
+            onMouseEnter: () => k(!0),
+            onMouseLeave: () => k(!1),
             children: /* @__PURE__ */ e(
               A,
               {
@@ -6298,18 +6298,18 @@ const yo = ({
                         icon: Ce,
                         size: "md",
                         onClick: () => m(!g),
-                        grayScaleBaseColor: D ? 1 : 0
+                        grayScaleBaseColor: z ? 1 : 0
                       }
                     ),
-                    (D || f) && /* @__PURE__ */ e(
+                    (z || f) && /* @__PURE__ */ e(
                       Be,
                       {
-                        icon: at,
+                        icon: ct,
                         size: "md",
                         onClick: () => {
                           p == null || p();
                         },
-                        grayScaleBaseColor: D ? 1 : 0
+                        grayScaleBaseColor: z ? 1 : 0
                       }
                     )
                   ] })
@@ -6332,7 +6332,7 @@ const yo = ({
                 /* @__PURE__ */ v(A, { justify: "space-between", align: "center", p: 4, children: [
                   /* @__PURE__ */ e(T, { size: "xs", c: "dimmed", fw: 500, p: 4, truncate: !0, children: "Workspaces" }),
                   c && /* @__PURE__ */ e(
-                    nt,
+                    tt,
                     {
                       onClick: () => {
                         c(), m(!1);
@@ -6351,10 +6351,10 @@ const yo = ({
                     }
                   )
                 ] }),
-                /* @__PURE__ */ e("div", { className: yn.scrollWrapper, children: /* @__PURE__ */ e(ke, { mah: 150, scrollbarSize: 6, scrollHideDelay: 0, children: /* @__PURE__ */ e(W, { gap: 0, mb: 6, children: S.map((k) => /* @__PURE__ */ e(
+                /* @__PURE__ */ e("div", { className: yn.scrollWrapper, children: /* @__PURE__ */ e(ke, { mah: 150, scrollbarSize: 6, scrollHideDelay: 0, children: /* @__PURE__ */ e(W, { gap: 0, mb: 6, children: S.map((C) => /* @__PURE__ */ e(
                   b,
                   {
-                    onClick: () => M(k),
+                    onClick: () => M(C),
                     className: yn.menuItem,
                     style: {
                       padding: 0,
@@ -6371,25 +6371,25 @@ const yo = ({
                     children: /* @__PURE__ */ e(
                       No,
                       {
-                        workspace: k,
+                        workspace: C,
                         currentUserId: t,
                         currentWorkspaceId: o == null ? void 0 : o.id,
-                        onClick: () => M(k)
+                        onClick: () => M(C)
                       }
                     )
                   },
-                  k.id
+                  C.id
                 )) }) }) })
               ] }) }),
               h && /* @__PURE__ */ e(pe.Divider, { style: { margin: "1px 0px" } }),
-              h && /* @__PURE__ */ e(b, { p: 4, children: h == null ? void 0 : h.map((k) => /* @__PURE__ */ e(
-                Xn,
+              h && /* @__PURE__ */ e(b, { p: 4, children: h == null ? void 0 : h.map((C) => /* @__PURE__ */ e(
+                Kn,
                 {
-                  onClick: k.onClick,
-                  leftSection: k.icon,
-                  children: k.label,
-                  color: k.color,
-                  "data-danger": k.color,
+                  onClick: C.onClick,
+                  leftSection: C.icon,
+                  children: C.label,
+                  color: C.color,
+                  "data-danger": C.color,
                   fw: 500,
                   style: {
                     height: "40px",
@@ -6397,7 +6397,7 @@ const yo = ({
                     padding: "6px"
                   }
                 },
-                k.label
+                C.label
               )) })
             ] })
           }
@@ -6405,7 +6405,7 @@ const yo = ({
       ]
     }
   );
-}, kt = ({
+}, Ct = ({
   children: n,
   style: o,
   ...t
@@ -6431,8 +6431,8 @@ const yo = ({
     children: n
   }
 );
-kt.displayName = "MatrixCenter";
-const Ct = ({
+Ct.displayName = "MatrixCenter";
+const Ot = ({
   children: n,
   style: o,
   size: t = "50px",
@@ -6441,7 +6441,7 @@ const Ct = ({
   interactive: a = !0,
   ...c
 }) => {
-  const [s, l] = C(r), [d, u] = C(!1), p = i ? r : a ? s : r, f = () => {
+  const [s, l] = O(r), [d, u] = O(!1), p = i ? r : a ? s : r, f = () => {
     if (!a)
       return;
     const g = ["empty", "outline", "filled"], w = (g.indexOf(p) + 1) % g.length, y = g[w];
@@ -6509,8 +6509,8 @@ const Ct = ({
     }
   );
 };
-Ct.displayName = "MatrixCell";
-const Ot = ({
+Ot.displayName = "MatrixCell";
+const zt = ({
   children: n,
   style: o,
   size: t = "50px",
@@ -6522,7 +6522,7 @@ const Ot = ({
   onBlockPress: l,
   ...d
 }) => {
-  const [u, p] = C(!1), f = Z(null), I = Z(!1), h = () => {
+  const [u, p] = O(!1), f = Z(null), I = Z(!1), h = () => {
     !r || !l || (p(!0), I.current = !1, f.current = setTimeout(() => {
       I.current = !0, l(r);
     }, 500));
@@ -6559,8 +6559,8 @@ const Ot = ({
     }
   );
 };
-Ot.displayName = "MatrixBlockLeft";
-const zt = ({
+zt.displayName = "MatrixBlockLeft";
+const Dt = ({
   children: n,
   style: o,
   size: t = "50px",
@@ -6572,7 +6572,7 @@ const zt = ({
   onBlockPress: l,
   ...d
 }) => {
-  const [u, p] = C(!1), f = Z(null), I = Z(!1), h = () => {
+  const [u, p] = O(!1), f = Z(null), I = Z(!1), h = () => {
     !r || !l || (p(!0), I.current = !1, f.current = setTimeout(() => {
       I.current = !0, l(r);
     }, 500));
@@ -6609,8 +6609,8 @@ const zt = ({
     }
   );
 };
-zt.displayName = "MatrixBlockRight";
-const Dt = ({
+Dt.displayName = "MatrixBlockRight";
+const Rt = ({
   children: n,
   style: o,
   size: t = "50px",
@@ -6622,7 +6622,7 @@ const Dt = ({
   onBlockPress: l,
   ...d
 }) => {
-  const [u, p] = C(!1), f = Z(null), I = Z(!1), h = () => {
+  const [u, p] = O(!1), f = Z(null), I = Z(!1), h = () => {
     !r || !l || (p(!0), I.current = !1, f.current = setTimeout(() => {
       I.current = !0, l(r);
     }, 500));
@@ -6659,8 +6659,8 @@ const Dt = ({
     }
   );
 };
-Dt.displayName = "MatrixBlockUp";
-const Rt = ({
+Rt.displayName = "MatrixBlockUp";
+const Tt = ({
   children: n,
   style: o,
   size: t = "50px",
@@ -6672,7 +6672,7 @@ const Rt = ({
   onBlockPress: l,
   ...d
 }) => {
-  const [u, p] = C(!1), f = Z(null), I = Z(!1), h = () => {
+  const [u, p] = O(!1), f = Z(null), I = Z(!1), h = () => {
     !r || !l || (p(!0), I.current = !1, f.current = setTimeout(() => {
       I.current = !0, l(r);
     }, 500));
@@ -6709,8 +6709,8 @@ const Rt = ({
     }
   );
 };
-Rt.displayName = "MatrixBlockDown";
-const Tt = ({
+Tt.displayName = "MatrixBlockDown";
+const Et = ({
   onLeftHover: n,
   onRightHover: o,
   onUpHover: t,
@@ -6720,7 +6720,7 @@ const Tt = ({
   showUpControls: c = !1,
   showDownControls: s = !1
 }) => {
-  const [l, d] = C(!1), [u, p] = C(!1), [f, I] = C(!1), [h, g] = C(!1), m = (M) => {
+  const [l, d] = O(!1), [u, p] = O(!1), [f, I] = O(!1), [h, g] = O(!1), m = (M) => {
     d(M), n == null || n(M);
   }, w = (M) => {
     p(M), o == null || o(M);
@@ -6804,8 +6804,8 @@ const Tt = ({
     )
   ] });
 };
-Tt.displayName = "HoverZones";
-const Et = ({
+Et.displayName = "HoverZones";
+const Bt = ({
   onLeftPrevious: n,
   onLeftNext: o,
   leftCurrentPage: t = 1,
@@ -6827,9 +6827,9 @@ const Et = ({
   upDisabled: y = !1,
   upVisible: S = !1,
   onUpHover: M,
-  onDownPrevious: D,
-  onDownNext: O,
-  downCurrentPage: k = 1,
+  onDownPrevious: z,
+  onDownNext: k,
+  downCurrentPage: C = 1,
   downTotalPages: x = 1,
   downDisabled: B = !1,
   downVisible: L = !1,
@@ -6877,7 +6877,7 @@ const Et = ({
         color: "gray",
         radius: "md",
         "aria-label": "Next left blocks",
-        children: /* @__PURE__ */ e(Nn, { size: 16, stroke: 2 })
+        children: /* @__PURE__ */ e(Wn, { size: 16, stroke: 2 })
       }
     )
   ] }), oe = () => u <= 1 || p ? null : /* @__PURE__ */ v(W, { gap: "xs", align: "center", children: [
@@ -6891,7 +6891,7 @@ const Et = ({
         color: "gray",
         radius: "md",
         "aria-label": "Previous right blocks",
-        children: /* @__PURE__ */ e(Nn, { size: 16, stroke: 2 })
+        children: /* @__PURE__ */ e(Wn, { size: 16, stroke: 2 })
       }
     ),
     /* @__PURE__ */ e(
@@ -6964,8 +6964,8 @@ const Et = ({
       {
         size: N,
         variant: "subtle",
-        onClick: D,
-        disabled: k <= 1,
+        onClick: z,
+        disabled: C <= 1,
         color: "gray",
         radius: "md",
         "aria-label": "Previous down blocks",
@@ -6989,17 +6989,17 @@ const Et = ({
       {
         size: N,
         variant: "subtle",
-        onClick: O,
-        disabled: k >= x,
+        onClick: k,
+        disabled: C >= x,
         color: "gray",
         radius: "md",
         "aria-label": "Next down blocks",
         children: /* @__PURE__ */ e(Ve, { size: 16, stroke: 2 })
       }
     )
-  ] }), z = r > 1 && !i, E = u > 1 && !p, U = w > 1 && !y, P = x > 1 && !B;
-  return !z && !E && !U && !P ? null : $ ? /* @__PURE__ */ v(me, { children: [
-    z && a && n && o && /* @__PURE__ */ e(
+  ] }), D = r > 1 && !i, E = u > 1 && !p, U = w > 1 && !y, P = x > 1 && !B;
+  return !D && !E && !U && !P ? null : $ ? /* @__PURE__ */ v(me, { children: [
+    D && a && n && o && /* @__PURE__ */ e(
       "div",
       {
         onMouseEnter: () => c == null ? void 0 : c(!0),
@@ -7023,7 +7023,7 @@ const Et = ({
         children: J()
       }
     ),
-    P && L && D && O && /* @__PURE__ */ e(
+    P && L && z && k && /* @__PURE__ */ e(
       "div",
       {
         onMouseEnter: () => R == null ? void 0 : R(!0),
@@ -7032,7 +7032,7 @@ const Et = ({
       }
     )
   ] }) : /* @__PURE__ */ v(me, { children: [
-    z && a && n && o && /* @__PURE__ */ e(
+    D && a && n && o && /* @__PURE__ */ e(
       b,
       {
         style: {
@@ -7101,12 +7101,12 @@ const Et = ({
         },
         onMouseEnter: () => R == null ? void 0 : R(!0),
         onMouseLeave: () => R == null ? void 0 : R(!1),
-        children: P && L && D && O && q()
+        children: P && L && z && k && q()
       }
     )
   ] });
 };
-Et.displayName = "NavigationControls";
+Bt.displayName = "NavigationControls";
 const Ze = ({
   direction: n,
   text: o,
@@ -7217,7 +7217,7 @@ const Ze = ({
             onMouseEnter: () => l(!0),
             onMouseLeave: () => l(!1),
             children: /* @__PURE__ */ e(
-              Et,
+              Bt,
               {
                 ...u[n],
                 size: "sm",
@@ -7277,7 +7277,7 @@ const Ze = ({
     c,
     s,
     l
-  ]), [u, p] = C(
+  ]), [u, p] = O(
     {
       leftStartIndex: 0,
       rightStartIndex: 0,
@@ -7294,13 +7294,13 @@ const Ze = ({
     ), M = Math.min(
       u.rightStartIndex,
       Math.max(0, t - c)
-    ), D = Math.min(
+    ), z = Math.min(
       M + c,
       t
-    ), O = Math.min(
+    ), k = Math.min(
       u.upStartIndex,
       Math.max(0, r - s)
-    ), k = Math.min(O + s, r), x = Math.min(
+    ), C = Math.min(k + s, r), x = Math.min(
       u.downStartIndex,
       Math.max(0, i - l)
     ), B = Math.min(
@@ -7315,9 +7315,9 @@ const Ze = ({
       leftStartIndex: y,
       leftEndIndex: S,
       rightStartIndex: M,
-      rightEndIndex: D,
-      upStartIndex: O,
-      upEndIndex: k,
+      rightEndIndex: z,
+      upStartIndex: k,
+      upEndIndex: C,
       downStartIndex: x,
       downEndIndex: B
     };
@@ -7449,7 +7449,7 @@ const Ze = ({
   };
   return [u, I, f];
 }, _o = (n, o = 0, t = 0, r = 0, i = 0) => {
-  const [a, c] = C({
+  const [a, c] = O({
     width: typeof window < "u" ? window.innerWidth : 1920,
     height: typeof window < "u" ? window.innerHeight : 1080
   });
@@ -7478,11 +7478,11 @@ const Ze = ({
       minBlocksDown: y = 1,
       maxBlocksDown: S = 8,
       responsiveCellSize: M = !1,
-      minCellSize: D = "30px",
-      maxCellSize: O = "80px"
-    } = n, k = parseFloat(l.replace("px", "")), x = parseFloat(d.replace("px", "")), B = a.width - k * 4, L = a.height - k * 4, R = x + k, F = Math.floor(
+      minCellSize: z = "30px",
+      maxCellSize: k = "80px"
+    } = n, C = parseFloat(l.replace("px", "")), x = parseFloat(d.replace("px", "")), B = a.width - C * 4, L = a.height - C * 4, R = x + C, F = Math.floor(
       B / (2 * R)
-    ), Q = x + k, _ = Math.floor(L / Q) + 2, V = Math.min(F, _), N = Math.max(
+    ), Q = x + C, _ = Math.floor(L / Q) + 2, V = Math.min(F, _), N = Math.max(
       u,
       Math.min(p, V)
     ), $ = Math.max(
@@ -7494,7 +7494,7 @@ const Ze = ({
     );
     let oe = d;
     if (M) {
-      const U = parseFloat(D.replace("px", "")), P = parseFloat(O.replace("px", "")), X = Math.min(
+      const U = parseFloat(z.replace("px", "")), P = parseFloat(k.replace("px", "")), X = Math.min(
         B / (a.width * 0.8),
         // Max 80% of screen width
         L / (a.height * 0.8)
@@ -7509,13 +7509,13 @@ const Ze = ({
       a.width / 1920,
       a.height / 1080
     );
-    let q, z;
+    let q, D;
     if (r > 0 && i > 0) {
       const U = Math.max(r, i);
       q = Math.max(
         m,
         Math.min(w, U)
-      ), z = q;
+      ), D = q;
     } else {
       const U = Math.max(m, y), P = Math.min(w, S), X = Math.max(
         U,
@@ -7526,16 +7526,16 @@ const Ze = ({
           )
         )
       );
-      q = X, z = X;
+      q = X, D = X;
     }
-    if (q + z + 1 > _) {
+    if (q + D + 1 > _) {
       const U = Math.max(2, _ - 1);
       if (Math.max(m, y) * 2 > U) {
         const X = Math.max(1, Math.floor(U / 2));
-        q = X, z = X;
+        q = X, D = X;
       } else {
         const X = Math.max(m, y);
-        q = X, z = X;
+        q = X, D = X;
       }
     }
     return console.log("Responsive Matrix Debug:", {
@@ -7548,9 +7548,9 @@ const Ze = ({
       blocksUp: r,
       blocksDown: i,
       calculatedBlocksUp: q,
-      calculatedBlocksDown: z,
-      totalVerticalBlocks: q + z + 1,
-      isSymmetric: q === z,
+      calculatedBlocksDown: D,
+      totalVerticalBlocks: q + D + 1,
+      isSymmetric: q === D,
       availableHeight: L,
       maxBlocksVertical: _
     }), {
@@ -7559,7 +7559,7 @@ const Ze = ({
       blocksRight: H,
       cellSize: oe,
       blocksUp: q,
-      blocksDown: z
+      blocksDown: D
     };
   }, [a, n, o, t, r, i]);
 }, Go = ({
@@ -7584,9 +7584,9 @@ const Ze = ({
   maxBlocksUp: y,
   minBlocksDown: S,
   maxBlocksDown: M,
-  responsiveCellSize: D,
-  minCellSize: O,
-  maxCellSize: k
+  responsiveCellSize: z,
+  minCellSize: k,
+  maxCellSize: C
 }) => {
   const x = K(
     () => c !== void 0 || s !== void 0 || l !== void 0 || d !== void 0,
@@ -7605,9 +7605,9 @@ const Ze = ({
       maxBlocksUp: y,
       minBlocksDown: S,
       maxBlocksDown: M,
-      responsiveCellSize: D,
-      minCellSize: O,
-      maxCellSize: k
+      responsiveCellSize: z,
+      minCellSize: k,
+      maxCellSize: C
     },
     t ?? 0,
     r ?? 0,
@@ -7616,10 +7616,10 @@ const Ze = ({
   ), L = K(() => {
     let _ = u ? B.blocksLeft : t ?? 0, V = u ? B.blocksRight : r ?? 0, N = u ? B.blocksUp : i ?? 0, $ = u ? B.blocksDown : a ?? 0;
     if (!u) {
-      const H = parseFloat(n.replace("px", "")), oe = parseFloat(o.replace("px", "")), J = typeof window < "u" ? window.innerWidth - H * 4 : 1920, q = typeof window < "u" ? window.innerHeight - H * 4 : 1080, z = oe + H, E = Math.floor(
-        J / (2 * z)
+      const H = parseFloat(n.replace("px", "")), oe = parseFloat(o.replace("px", "")), J = typeof window < "u" ? window.innerWidth - H * 4 : 1920, q = typeof window < "u" ? window.innerHeight - H * 4 : 1080, D = oe + H, E = Math.floor(
+        J / (2 * D)
       ), U = Math.floor(
-        q / (2 * z)
+        q / (2 * D)
       );
       _ = Math.min(_, E), V = Math.min(V, E), N = Math.min(N, U), $ = Math.min($, U);
     }
@@ -7735,7 +7735,7 @@ const Ze = ({
   paginationState: c,
   paginationInfo: s
 }) => {
-  const [l, d] = C({
+  const [l, d] = O({
     left: !1,
     right: !1,
     up: !1,
@@ -7784,7 +7784,7 @@ const Ze = ({
   blockItems: n,
   blockConnections: o
 }) => {
-  const [t, r] = C(null), [i, a] = C(!1), c = K(() => {
+  const [t, r] = O(null), [i, a] = O(!1), c = K(() => {
     const g = /* @__PURE__ */ new Map();
     return o.forEach((m) => {
       const w = `${m.source}-${m.target}`, y = `${m.target}-${m.source}`;
@@ -7810,37 +7810,37 @@ const Ze = ({
       switch (m.type) {
         case "up":
           w.forEach((S) => {
-            const M = n.find((D) => D.id === S);
-            M && (M.type === "left" || M.type === "right") && (y.push(S), s(S).forEach((O) => {
-              const k = n.find((x) => x.id === O);
-              k && k.type === "down" && y.push(O);
+            const M = n.find((z) => z.id === S);
+            M && (M.type === "left" || M.type === "right") && (y.push(S), s(S).forEach((k) => {
+              const C = n.find((x) => x.id === k);
+              C && C.type === "down" && y.push(k);
             }));
           });
           break;
         case "down":
           w.forEach((S) => {
-            const M = n.find((D) => D.id === S);
-            M && (M.type === "left" || M.type === "right") && (y.push(S), s(S).forEach((O) => {
-              const k = n.find((x) => x.id === O);
-              k && k.type === "up" && y.push(O);
+            const M = n.find((z) => z.id === S);
+            M && (M.type === "left" || M.type === "right") && (y.push(S), s(S).forEach((k) => {
+              const C = n.find((x) => x.id === k);
+              C && C.type === "up" && y.push(k);
             }));
           });
           break;
         case "left":
           w.forEach((S) => {
-            const M = n.find((D) => D.id === S);
-            M && (M.type === "up" || M.type === "down") && (y.push(S), s(S).forEach((O) => {
-              const k = n.find((x) => x.id === O);
-              k && k.type === "right" && y.push(O);
+            const M = n.find((z) => z.id === S);
+            M && (M.type === "up" || M.type === "down") && (y.push(S), s(S).forEach((k) => {
+              const C = n.find((x) => x.id === k);
+              C && C.type === "right" && y.push(k);
             }));
           });
           break;
         case "right":
           w.forEach((S) => {
-            const M = n.find((D) => D.id === S);
-            M && (M.type === "up" || M.type === "down") && (y.push(S), s(S).forEach((O) => {
-              const k = n.find((x) => x.id === O);
-              k && k.type === "left" && y.push(O);
+            const M = n.find((z) => z.id === S);
+            M && (M.type === "up" || M.type === "down") && (y.push(S), s(S).forEach((k) => {
+              const C = n.find((x) => x.id === k);
+              C && C.type === "left" && y.push(k);
             }));
           });
           break;
@@ -7875,8 +7875,8 @@ const Ze = ({
     clearFiltering: h,
     getFilteredBlockIds: l
   };
-}, _n = (n) => parseInt(n.replace(/[^\d]/g, ""), 10) || 0, Xo = (n, o) => {
-  const [t, r] = C({ width: 0, height: 0 }), i = j(() => {
+}, Gn = (n) => parseInt(n.replace(/[^\d]/g, ""), 10) || 0, Xo = (n, o) => {
+  const [t, r] = O({ width: 0, height: 0 }), i = j(() => {
     const { width: a, height: c } = t;
     if (a === 0 || c === 0)
       return {
@@ -7887,7 +7887,7 @@ const Ze = ({
         containerWidth: a,
         containerHeight: c
       };
-    const s = _n(o.cellSize), l = _n(o.gap), d = s + l, u = a - l * 2, p = c - l * 2, f = Math.floor(
+    const s = Gn(o.cellSize), l = Gn(o.gap), d = s + l, u = a - l * 2, p = c - l * 2, f = Math.floor(
       p * o.verticalMaxPercent / 100 / d
     ), I = Math.floor(
       u * o.horizontalMaxPercent / 100 / d
@@ -7901,12 +7901,12 @@ const Ze = ({
     ), w = Math.max(
       o.minHorizontalBlocks,
       g
-    ), y = Math.max(m, f), S = Math.max(w, I), M = Math.floor(y / 2), D = Math.floor(y / 2), O = Math.floor(S / 2), k = Math.floor(S / 2);
+    ), y = Math.max(m, f), S = Math.max(w, I), M = Math.floor(y / 2), z = Math.floor(y / 2), k = Math.floor(S / 2), C = Math.floor(S / 2);
     return {
       blocksUp: M,
-      blocksDown: D,
-      blocksLeft: O,
-      blocksRight: k,
+      blocksDown: z,
+      blocksLeft: k,
+      blocksRight: C,
       containerWidth: a,
       containerHeight: c
     };
@@ -7968,9 +7968,9 @@ const Ze = ({
   totalBlocksDown: S,
   usePagination: M = !1,
   // DEPRECATED RESPONSIVE PROPS - Keep for backward compatibility
-  responsive: D = !1,
-  minBlocksPerSide: O = 2,
-  maxBlocksPerSide: k = 15,
+  responsive: z = !1,
+  minBlocksPerSide: k = 2,
+  maxBlocksPerSide: C = 15,
   minBlocksHorizontal: x = 2,
   maxBlocksHorizontal: B = 16,
   minBlocksVertical: L = 2,
@@ -7986,7 +7986,7 @@ const Ze = ({
   maxBlocksDown: oe = 8,
   responsiveCellSize: J = !1,
   minCellSize: q = "30px",
-  maxCellSize: z = "80px",
+  maxCellSize: D = "80px",
   directionTexts: E,
   ...U
 }) => {
@@ -7998,8 +7998,8 @@ const Ze = ({
   });
   let de = l, G = d, ge = u, ie = p;
   s ? (de = Math.floor(X.blocksLeft), G = Math.floor(X.blocksRight), ge = Math.floor(X.blocksUp), ie = Math.floor(X.blocksDown)) : (i !== void 0 || a !== void 0) && (i !== void 0 && (ge = Math.floor(i / 2), ie = Math.floor(i / 2)), a !== void 0 && (de = Math.floor(a / 2), G = Math.floor(a / 2)));
-  const ze = F !== 1 ? F : Math.floor(x / 2), cn = Q !== 8 ? Q : Math.floor(B / 2), sn = _ !== 1 ? _ : Math.ceil(x / 2), Ie = V !== 8 ? V : Math.ceil(B / 2), Le = N !== 1 ? N : Math.floor(L / 2), _e = $ !== 8 ? $ : Math.floor(R / 2), Ft = H !== 1 ? H : Math.ceil(L / 2), Ut = oe !== 8 ? oe : Math.ceil(R / 2), {
-    usePagination: Nt,
+  const ze = F !== 1 ? F : Math.floor(x / 2), cn = Q !== 8 ? Q : Math.floor(B / 2), sn = _ !== 1 ? _ : Math.ceil(x / 2), Ie = V !== 8 ? V : Math.ceil(B / 2), Le = N !== 1 ? N : Math.floor(L / 2), _e = $ !== 8 ? $ : Math.floor(R / 2), Ut = H !== 1 ? H : Math.ceil(L / 2), Nt = oe !== 8 ? oe : Math.ceil(R / 2), {
+    usePagination: Wt,
     finalBlocks: ee,
     finalCellSize: ye,
     gridDimensions: Ge
@@ -8014,23 +8014,23 @@ const Ze = ({
     totalBlocksRight: w,
     totalBlocksUp: y,
     totalBlocksDown: S,
-    responsive: D,
-    minBlocksPerSide: O,
-    maxBlocksPerSide: k,
+    responsive: z,
+    minBlocksPerSide: k,
+    maxBlocksPerSide: C,
     minBlocksLeft: ze,
     maxBlocksLeft: cn,
     minBlocksRight: sn,
     maxBlocksRight: Ie,
     minBlocksUp: Le,
     maxBlocksUp: _e,
-    minBlocksDown: Ft,
-    maxBlocksDown: Ut,
+    minBlocksDown: Ut,
+    maxBlocksDown: Nt,
     responsiveCellSize: J,
     minCellSize: q,
-    maxCellSize: z
-  }), { getBlockContent: Qe, getIntersectionText: Wt } = Qo({
+    maxCellSize: D
+  }), { getBlockContent: Qe, getIntersectionText: $t } = Qo({
     blockItems: f
-  }), { getConnectionStateFromText: $t } = Yo({
+  }), { getConnectionStateFromText: Ht } = Yo({
     blockConnections: I
   }), ne = qo({
     blockItems: f,
@@ -8044,7 +8044,7 @@ const Ze = ({
     };
     return window.addEventListener("keydown", ln), () => window.removeEventListener("keydown", ln);
   }, [h, ne]);
-  const [ve, Ht, Pt] = Vo({
+  const [ve, Pt, Vt] = Vo({
     totalBlocksLeft: m ?? 0,
     totalBlocksRight: w ?? 0,
     totalBlocksUp: y ?? 0,
@@ -8054,14 +8054,14 @@ const Ze = ({
     visibleBlocksUp: ee.up,
     visibleBlocksDown: ee.down
   }), { getNavigationControlProps: De } = Zo({
-    usePagination: Nt,
+    usePagination: Wt,
     totalBlocksLeft: m,
     totalBlocksRight: w,
     totalBlocksUp: y,
     totalBlocksDown: S,
-    paginationActions: Ht,
+    paginationActions: Pt,
     paginationState: ve,
-    paginationInfo: Pt
+    paginationInfo: Vt
   });
   return /* @__PURE__ */ v(
     b,
@@ -8089,7 +8089,7 @@ const Ze = ({
             const dn = ee.up > 0 ? ae === ee.up : ae === 0, un = ue === ee.left;
             if (dn && un)
               return /* @__PURE__ */ v(
-                kt,
+                Ct,
                 {
                   style: {
                     width: "100%",
@@ -8133,7 +8133,7 @@ const Ze = ({
                       }
                     ),
                     M && /* @__PURE__ */ e(
-                      Tt,
+                      Et,
                       {
                         showLeftControls: !!m,
                         showRightControls: !!w,
@@ -8152,7 +8152,7 @@ const Ze = ({
             if (dn && ue < ee.left) {
               const te = M && m ? ve.leftStartIndex + ue : ue, se = `left-${te}`;
               return /* @__PURE__ */ e(
-                Ot,
+                zt,
                 {
                   size: ye,
                   blockId: h ? se : void 0,
@@ -8169,7 +8169,7 @@ const Ze = ({
             if (dn && ue > ee.left) {
               const te = ue - ee.left - 1, se = M && w ? ve.rightStartIndex + (ee.right - 1 - te) : ee.right - 1 - te, xe = `right-${se}`;
               return /* @__PURE__ */ e(
-                zt,
+                Dt,
                 {
                   size: ye,
                   blockId: h ? xe : void 0,
@@ -8186,7 +8186,7 @@ const Ze = ({
             if (un && ae < ee.up) {
               const te = M && y ? ve.upStartIndex + ae : ae, se = `up-${te}`;
               return /* @__PURE__ */ e(
-                Dt,
+                Rt,
                 {
                   size: ye,
                   blockId: h ? se : void 0,
@@ -8203,7 +8203,7 @@ const Ze = ({
             if (un && ae > ee.up) {
               const te = ae - ee.up - 1, se = M && S ? ve.downStartIndex + te : te, xe = `down-${se}`;
               return /* @__PURE__ */ e(
-                Rt,
+                Tt,
                 {
                   size: ye,
                   blockId: h ? xe : void 0,
@@ -8217,16 +8217,16 @@ const Ze = ({
                 `down-${te}`
               );
             }
-            const fn = ue < ee.left ? ue : null, Ye = ue > ee.left ? ue - ee.left - 1 : null, hn = ae < ee.up ? ae : null, pn = ae > ee.up ? ae - ee.up - 1 : null, Vt = M && m && fn !== null ? ve.leftStartIndex + fn : fn, _t = M && w && Ye !== null ? ve.rightStartIndex + (ee.right - 1 - Ye) : Ye !== null ? ee.right - 1 - Ye : null, Gt = M && y && hn !== null ? ve.upStartIndex + hn : hn, Qt = M && S && pn !== null ? ve.downStartIndex + pn : pn, mn = Wt(
-              Vt,
+            const fn = ue < ee.left ? ue : null, Ye = ue > ee.left ? ue - ee.left - 1 : null, hn = ae < ee.up ? ae : null, pn = ae > ee.up ? ae - ee.up - 1 : null, _t = M && m && fn !== null ? ve.leftStartIndex + fn : fn, Gt = M && w && Ye !== null ? ve.rightStartIndex + (ee.right - 1 - Ye) : Ye !== null ? ee.right - 1 - Ye : null, Qt = M && y && hn !== null ? ve.upStartIndex + hn : hn, Yt = M && S && pn !== null ? ve.downStartIndex + pn : pn, mn = $t(
               _t,
               Gt,
-              Qt
+              Qt,
+              Yt
             );
             if (mn && mn.length > 0) {
-              const te = $t(mn);
+              const te = Ht(mn);
               return /* @__PURE__ */ e(
-                Ct,
+                Ot,
                 {
                   size: ye,
                   state: te,
@@ -8377,7 +8377,7 @@ const Ae = ({
   {
     label: n,
     icon: o,
-    value: /* @__PURE__ */ e(nt, { href: t, target: i, size: "sm", underline: "hover", children: r || t })
+    value: /* @__PURE__ */ e(tt, { href: t, target: i, size: "sm", underline: "hover", children: r || t })
   }
 ), Wi = ({
   label: n,
@@ -8428,7 +8428,7 @@ const Ae = ({
   debounceSearch: t = !0,
   debounceDelay: r = ei
 }) => {
-  const [i, a] = C(""), [c, s] = C(n), [l, d] = C(!1), u = Z(null);
+  const [i, a] = O(""), [c, s] = O(n), [l, d] = O(!1), u = Z(null);
   return Y(() => {
     if (!o) {
       s(n);
@@ -8493,7 +8493,7 @@ const Ae = ({
   isFocused: n,
   dropdownRef: o
 }) => {
-  const [t, r] = C("bottom"), i = j(
+  const [t, r] = O("bottom"), i = j(
     (a) => {
       if (o.current = a, a) {
         const c = a.dataset.position;
@@ -8507,7 +8507,7 @@ const Ae = ({
     },
     [o]
   );
-  return Gn(() => {
+  return Qn(() => {
     if (!n || !o.current)
       return;
     const a = () => {
@@ -8558,7 +8558,7 @@ const Ae = ({
   combobox: n,
   dropdownRef: o
 }) => {
-  const [t, r] = C(!1), [i, a] = C(!1), c = j(() => {
+  const [t, r] = O(!1), [i, a] = O(!1), c = j(() => {
     r(!0), n.openDropdown();
   }, [n]), s = j(
     (u) => {
@@ -8632,19 +8632,19 @@ const Ae = ({
     searchQuery: y,
     setSearchQuery: S,
     displayedUsers: M,
-    setDisplayedUsers: D,
-    isSearching: O
+    setDisplayedUsers: z,
+    isSearching: k
   } = ni({
     users: i,
     onSearch: d,
     debounceSearch: u,
     debounceDelay: p
-  }), k = rn({
+  }), C = rn({
     onDropdownClose: () => {
-      k.resetSelectedOption(), S(""), B(!1);
+      C.resetSelectedOption(), S(""), B(!1);
     },
     onDropdownOpen: () => {
-      k.updateSelectedOptionIndex("active"), B(!0);
+      C.updateSelectedOptionIndex("active"), B(!0);
     }
   }), {
     isFocused: x,
@@ -8655,7 +8655,7 @@ const Ae = ({
     handleMouseEnter: Q,
     handleMouseLeave: _
   } = ii({
-    combobox: k,
+    combobox: C,
     dropdownRef: w
   }), { placement: V, dropdownRefCallback: N } = ri({
     isFocused: x,
@@ -8671,12 +8671,12 @@ const Ae = ({
     onLoadMore: f,
     hasMore: I,
     loading: h,
-    setDisplayedUsers: D
-  }), { handleSelect: q, handleRemove: z } = ai({
+    setDisplayedUsers: z
+  }), { handleSelect: q, handleRemove: D } = ai({
     multiple: s,
     value: r,
     onChange: a,
-    combobox: k
+    combobox: C
   }), E = () => {
     if (!s)
       return null;
@@ -8688,11 +8688,11 @@ const Ae = ({
           avatar: ze.avatar,
           name: ze.name,
           withRemoveButton: x,
-          onRemove: () => z(ze.id)
+          onRemove: () => D(ze.id)
         },
         ze.id
       )),
-      ie > 0 && /* @__PURE__ */ e(vn, { ml: "xs", radius: "md", size: "md", bg: "transparent", children: /* @__PURE__ */ v(
+      ie > 0 && /* @__PURE__ */ e(xn, { ml: "xs", radius: "md", size: "md", bg: "transparent", children: /* @__PURE__ */ v(
         A,
         {
           gap: "2px",
@@ -8770,7 +8770,7 @@ const Ae = ({
               avatar: G.avatar,
               name: G.name,
               withRemoveButton: x,
-              onRemove: () => z(G.id)
+              onRemove: () => D(G.id)
             },
             G.id
           ))
@@ -8779,15 +8779,15 @@ const Ae = ({
       children: /* @__PURE__ */ v(
         re,
         {
-          store: k,
+          store: C,
           onOptionSubmit: q,
           withinPortal: !1,
           offset: -2,
           children: [
             /* @__PURE__ */ e(re.DropdownTarget, { children: /* @__PURE__ */ e(
-              jn,
+              Fn,
               {
-                onClick: () => !l && k.openDropdown(),
+                onClick: () => !l && C.openDropdown(),
                 radius: "md",
                 disabled: l,
                 styles: X,
@@ -8797,13 +8797,13 @@ const Ae = ({
                 onMouseLeave: _,
                 w: "100%",
                 children: /* @__PURE__ */ v(
-                  vn.Group,
+                  xn.Group,
                   {
                     styles: de,
                     children: [
                       s ? E() : U(),
                       /* @__PURE__ */ e(re.EventsTarget, { children: /* @__PURE__ */ e(
-                        jn.Field,
+                        Fn.Field,
                         {
                           ref: g,
                           onFocus: R,
@@ -8811,15 +8811,15 @@ const Ae = ({
                           placeholder: H.length === 0 || x || y.length > 0 ? c : "",
                           value: y,
                           onChange: (G) => {
-                            k.updateSelectedOptionIndex(), S(G.currentTarget.value);
+                            C.updateSelectedOptionIndex(), S(G.currentTarget.value);
                           },
                           onMouseDown: (G) => {
                             G.stopPropagation();
                           },
                           onKeyDown: (G) => {
-                            G.key === "Backspace" && y.length === 0 && (G.preventDefault(), s && H.length > 0 ? z(
+                            G.key === "Backspace" && y.length === 0 && (G.preventDefault(), s && H.length > 0 ? D(
                               H[H.length - 1].id
-                            ) : !s && H.length > 0 && z(H[0].id));
+                            ) : !s && H.length > 0 && D(H[0].id));
                           },
                           pointer: !0,
                           disabled: l,
@@ -8926,7 +8926,7 @@ const Ae = ({
                           G.id
                         );
                       }),
-                      (O || h) && /* @__PURE__ */ e(
+                      (k || h) && /* @__PURE__ */ e(
                         b,
                         {
                           style: {
@@ -8938,7 +8938,7 @@ const Ae = ({
                         }
                       ),
                       f && I && !h && /* @__PURE__ */ e("div", { ref: J, style: { height: "20px" } }),
-                      oe.length === 0 && !O && !h && /* @__PURE__ */ e(
+                      oe.length === 0 && !k && !h && /* @__PURE__ */ e(
                         b,
                         {
                           style: {
@@ -8958,21 +8958,23 @@ const Ae = ({
       )
     }
   );
-}, Bt = ({
+}, At = ({
   label: n,
   icon: o,
   value: t,
   onChange: r,
-  editable: i = !1,
-  placeholder: a,
-  disabled: c = !1,
-  minRows: s = 1,
-  maxRows: l,
-  autosize: d = !0
+  onDraftChange: i,
+  onFocusChange: a,
+  editable: c = !1,
+  placeholder: s,
+  disabled: l = !1,
+  minRows: d = 1,
+  maxRows: u,
+  autosize: p = !0
 }) => {
-  const [u, p] = C(!1), [f, I] = C(!1), h = {
+  const [f, I] = O(!1), [h, g] = O(!1), m = {
     wrapper: {
-      ...!d && {
+      ...!p && {
         height: "40px",
         minHeight: "40px",
         boxSizing: "border-box"
@@ -8980,26 +8982,26 @@ const Ae = ({
       borderRadius: "var(--mantine-radius-md)"
     },
     input: {
-      backgroundColor: u || f ? "var(--mantine-color-gray-0)" : "transparent",
+      backgroundColor: f || h ? "var(--mantine-color-gray-0)" : "transparent",
       color: "var(--mantine-color-gray-9)",
-      border: u ? "1px solid var(--mantine-color-gray-2)" : "1px solid transparent",
+      border: f ? "1px solid var(--mantine-color-gray-2)" : "1px solid transparent",
       borderRadius: "var(--mantine-radius-md)",
       width: "100%",
       cursor: "pointer",
-      ...!d && {
+      ...!p && {
         height: "40px",
         minHeight: "40px",
         boxSizing: "border-box"
       },
       padding: "8px 14px",
-      lineHeight: d ? "1.5" : "24px",
+      lineHeight: p ? "1.5" : "24px",
       fontWeight: 450
     }
   };
   return /* @__PURE__ */ e(
     Ae,
     {
-      editable: i,
+      editable: c,
       label: n,
       icon: o,
       value: /* @__PURE__ */ e(
@@ -9016,7 +9018,7 @@ const Ae = ({
               c: t ? void 0 : "dimmed",
               fw: 400,
               style: { whiteSpace: "pre-wrap", wordBreak: "break-word" },
-              children: t || a || "—"
+              children: t || s || "—"
             }
           )
         }
@@ -9026,27 +9028,33 @@ const Ae = ({
         {
           w: "100%",
           style: {
-            boxShadow: u ? "var(--mantine-shadow-sm)" : "none",
+            boxShadow: f ? "var(--mantine-shadow-sm)" : "none",
             borderRadius: "var(--mantine-radius-md)"
           },
           children: /* @__PURE__ */ e(
-            Mn,
+            Sn,
             {
               value: t,
-              onChange: (g) => r == null ? void 0 : r(g.target.value),
-              onFocus: () => p(!0),
-              onBlur: () => p(!1),
-              onMouseEnter: () => I(!0),
-              onMouseLeave: () => I(!1),
-              placeholder: a,
-              disabled: c,
+              onChange: (M) => {
+                i == null || i(M.target.value);
+              },
+              onFocus: () => {
+                I(!0), a == null || a(!0);
+              },
+              onBlur: (M) => {
+                I(!1), a == null || a(!1), r == null || r(M.target.value);
+              },
+              onMouseEnter: () => g(!0),
+              onMouseLeave: () => g(!1),
+              placeholder: s,
+              disabled: l,
               size: "sm",
               radius: "md",
               fw: 400,
-              minRows: u ? 1 : s,
-              maxRows: l,
-              autosize: d,
-              styles: { ...h }
+              minRows: f ? 1 : d,
+              maxRows: u,
+              autosize: p,
+              styles: { ...m }
             }
           )
         }
@@ -9059,7 +9067,7 @@ const Ae = ({
   children: t,
   ...r
 }) => /* @__PURE__ */ v(
-  kn,
+  Cn,
   {
     withCloseButton: !1,
     opened: n,
@@ -9078,7 +9086,7 @@ const Ae = ({
     ...r,
     children: [
       /* @__PURE__ */ v(A, { justify: "space-between", wrap: "nowrap", children: [
-        /* @__PURE__ */ e(A, { justify: "space-between", wrap: "nowrap", gap: "xs", children: /* @__PURE__ */ e(he, { icon: Dn, size: "md", onClick: () => {
+        /* @__PURE__ */ e(A, { justify: "space-between", wrap: "nowrap", gap: "xs", children: /* @__PURE__ */ e(he, { icon: Rn, size: "md", onClick: () => {
         } }) }),
         /* @__PURE__ */ v(A, { justify: "space-between", gap: "xs", children: [
           /* @__PURE__ */ e(he, { icon: wr, size: "md", onClick: () => {
@@ -9102,14 +9110,14 @@ const Ae = ({
   headerProps: l,
   propertiesProps: d
 }) => {
-  var M, D;
-  const [u, p] = C(!1), f = (d == null ? void 0 : d.hiddenProperties) && d.hiddenProperties.length > 0, [I, h] = C(!1), [g, m] = C(
+  var M, z;
+  const [u, p] = O(!1), f = (d == null ? void 0 : d.hiddenProperties) && d.hiddenProperties.length > 0, [I, h] = O(!1), [g, m] = O(
     l == null ? void 0 : l.avatar
-  ), [w, y] = C(!1);
+  ), [w, y] = O(!1);
   return Y(() => {
     m(l == null ? void 0 : l.avatar);
   }, [l == null ? void 0 : l.avatar]), /* @__PURE__ */ v(
-    Cn,
+    On,
     {
       opened: n,
       onClose: o,
@@ -9128,7 +9136,7 @@ const Ae = ({
             /* @__PURE__ */ e(
               he,
               {
-                icon: Dn,
+                icon: Rn,
                 size: "md",
                 onClick: () => c()
               }
@@ -9144,7 +9152,7 @@ const Ae = ({
                 onMouseEnter: () => h(!0),
                 onMouseLeave: () => h(!1),
                 children: g ? /* @__PURE__ */ e(
-                  Ln,
+                  jn,
                   {
                     editable: t,
                     avatar: g,
@@ -9152,9 +9160,9 @@ const Ae = ({
                     opened: w,
                     onOpen: () => y(!0),
                     onClose: () => y(!1),
-                    onAvatarSelect: (O) => {
-                      var k;
-                      m(O), (k = l == null ? void 0 : l.onAvatarChange) == null || k.call(l, O);
+                    onAvatarSelect: (k) => {
+                      var C;
+                      m(k), (C = l == null ? void 0 : l.onAvatarChange) == null || C.call(l, k);
                     },
                     onRemove: () => {
                       m(void 0);
@@ -9171,9 +9179,9 @@ const Ae = ({
                     color: "gray",
                     mb: "md",
                     onClick: () => {
-                      var k;
-                      const O = { type: "emoji", value: "😊" };
-                      m(O), (k = l == null ? void 0 : l.onAvatarChange) == null || k.call(l, O);
+                      var C;
+                      const k = { type: "emoji", value: "😊" };
+                      m(k), (C = l == null ? void 0 : l.onAvatarChange) == null || C.call(l, k);
                     },
                     children: /* @__PURE__ */ v(
                       b,
@@ -9185,7 +9193,7 @@ const Ae = ({
                           gap: 6
                         },
                         children: [
-                          /* @__PURE__ */ e(Rn, { size: 16 }),
+                          /* @__PURE__ */ e(Tn, { size: 16 }),
                           /* @__PURE__ */ e(T, { size: "sm", fw: 500, children: "Add avatar" })
                         ]
                       }
@@ -9198,9 +9206,9 @@ const Ae = ({
               an,
               {
                 value: l.title || "",
-                onChange: (O) => {
-                  var k;
-                  return (k = l.onTitleChange) == null ? void 0 : k.call(l, O);
+                onChange: (k) => {
+                  var C;
+                  return (C = l.onTitleChange) == null ? void 0 : C.call(l, k);
                 },
                 onDraftChange: l.onTitleDraftChange,
                 pageTitle: !0,
@@ -9218,7 +9226,7 @@ const Ae = ({
               }
             )
           ] }),
-          /* @__PURE__ */ e(W, { gap: "sm", children: (M = d == null ? void 0 : d.visibleProperties) == null ? void 0 : M.map((O, k) => /* @__PURE__ */ e(b, { children: O }, k)) }),
+          /* @__PURE__ */ e(W, { gap: "sm", children: (M = d == null ? void 0 : d.visibleProperties) == null ? void 0 : M.map((k, C) => /* @__PURE__ */ e(b, { children: k }, C)) }),
           f && !u && /* @__PURE__ */ e(b, { w: "100%", style: { display: "flex", justifyContent: "center" }, children: /* @__PURE__ */ e(
             ce,
             {
@@ -9252,7 +9260,7 @@ const Ae = ({
               )
             }
           ) }),
-          /* @__PURE__ */ e(rr, { in: u, children: /* @__PURE__ */ e(W, { gap: "sm", mt: "sm", children: (D = d == null ? void 0 : d.hiddenProperties) == null ? void 0 : D.map((O, k) => /* @__PURE__ */ e(b, { children: O }, k)) }) }),
+          /* @__PURE__ */ e(rr, { in: u, children: /* @__PURE__ */ e(W, { gap: "sm", mt: "sm", children: (z = d == null ? void 0 : d.hiddenProperties) == null ? void 0 : z.map((k, C) => /* @__PURE__ */ e(b, { children: k }, C)) }) }),
           f && u && /* @__PURE__ */ e(
             b,
             {
@@ -9307,7 +9315,7 @@ const Ae = ({
     id: "full-page",
     children: n
   }
-), At = Qn(
+), Lt = Yn(
   void 0
 ), di = ({
   children: n
@@ -9318,7 +9326,7 @@ const Ae = ({
   ] = Xe(!1), [
     d,
     { open: u, close: p }
-  ] = Xe(!1), [f, I] = C(300), [h, g] = C(500), m = {
+  ] = Xe(!1), [f, I] = O(300), [h, g] = O(500), m = {
     opened: o,
     toggle: t,
     open: r,
@@ -9335,9 +9343,9 @@ const Ae = ({
     openNotificationSidebar: u,
     closeNotificationSidebar: p
   };
-  return /* @__PURE__ */ e(At.Provider, { value: m, children: n });
-}, Lt = () => {
-  const n = Yn(At);
+  return /* @__PURE__ */ e(Lt.Provider, { value: m, children: n });
+}, jt = () => {
+  const n = Zn(Lt);
   if (n === void 0)
     throw new Error("useAppLayout must be used within an AppLayoutProvider");
   return n;
@@ -9353,7 +9361,7 @@ const Ae = ({
     asideOpened: c,
     sidebarWidth: s,
     asideWidth: l
-  } = Lt();
+  } = jt();
   return /* @__PURE__ */ v(
     We,
     {
@@ -9402,14 +9410,14 @@ const Ae = ({
 }, fi = ({ items: n, selectedId: o, onSelect: t }) => /* @__PURE__ */ e(W, { gap: 0, children: n.map((r) => {
   var i;
   return /* @__PURE__ */ e(
-    $n,
+    Hn,
     {
       label: r.label,
       isActive: o === r.id,
       noChild: !r.children || r.children.length === 0,
       onClick: () => (!r.children || r.children.length === 0) && (t == null ? void 0 : t(r.id)),
       children: (i = r.children) == null ? void 0 : i.map((a) => /* @__PURE__ */ e(
-        $n,
+        Hn,
         {
           label: a.label,
           noChild: !0,
@@ -9435,12 +9443,12 @@ const Ae = ({
   selectedTopNavId: d,
   onTopNavSelect: u
 }) => {
-  const { opened: p, toggle: f } = Lt(), [I, h] = C(o), g = o ?? I;
+  const { opened: p, toggle: f } = jt(), [I, h] = O(o), g = o ?? I;
   return /* @__PURE__ */ e(
     ui,
     {
       header: l ? /* @__PURE__ */ e(
-        Vn,
+        _n,
         {
           withBorder: !0,
           bg: "transparent",
@@ -9449,7 +9457,7 @@ const Ae = ({
         }
       ) : void 0,
       navbar: /* @__PURE__ */ e(
-        Vn,
+        _n,
         {
           withBorder: !0,
           bg: "transparent",
@@ -9459,7 +9467,7 @@ const Ae = ({
             /* @__PURE__ */ e(
               he,
               {
-                icon: p ? at : Ne,
+                icon: p ? ct : Ne,
                 size: "md",
                 onClick: f
               }
@@ -9523,7 +9531,7 @@ const Ae = ({
                   }
                 ),
                 r ?? /* @__PURE__ */ e(
-                  Tn,
+                  En,
                   {
                     label: g || "Select a topic",
                     onClick: () => {
@@ -9558,7 +9566,7 @@ const Ae = ({
       )
     }
   );
-}, Pi = (n) => /* @__PURE__ */ e(di, { children: /* @__PURE__ */ e(hi, { ...n }) }), jt = (n, o) => {
+}, Pi = (n) => /* @__PURE__ */ e(di, { children: /* @__PURE__ */ e(hi, { ...n }) }), Ft = (n, o) => {
   const t = j(
     (a) => {
       const c = Array.isArray(a) ? a : [a];
@@ -9609,13 +9617,13 @@ const Ae = ({
     availableMembersUsers: f,
     handleResponsibleChange: I,
     handleMembersChange: h
-  } = jt(d, u), g = K(
+  } = Ft(d, u), g = K(
     () => [
       /* @__PURE__ */ e(
-        Bt,
+        At,
         {
           label: "Description",
-          icon: ct,
+          icon: st,
           value: p.description,
           onChange: p.onDescriptionChange,
           editable: r
@@ -9627,7 +9635,7 @@ const Ae = ({
         {
           editable: !1,
           label: "Team Owner",
-          icon: st,
+          icon: lt,
           value: l.id,
           users: [l]
         },
@@ -9639,7 +9647,7 @@ const Ae = ({
           multiple: !1,
           editable: r,
           label: "Team Leader",
-          icon: zn,
+          icon: Dn,
           value: d.userIds.length > 0 ? d.userIds[0] : void 0,
           users: d.users,
           onChange: I,
@@ -9655,7 +9663,7 @@ const Ae = ({
           multiple: !0,
           editable: r,
           label: "Team Members",
-          icon: lt,
+          icon: dt,
           value: u.members.map((m) => m.id),
           users: f,
           onChange: h,
@@ -9714,15 +9722,15 @@ const Ae = ({
   children: c,
   footer: s
 }) => {
-  const [l, d] = C(
+  const [l, d] = O(
     i == null ? void 0 : i.avatar
-  ), [u, p] = C(!1), [f, I] = C(!1), h = o ? "0" : {
+  ), [u, p] = O(!1), [f, I] = O(!1), h = o ? "0" : {
     base: "1rem",
     sm: "2rem",
     md: "4rem",
     lg: "8rem",
     xl: "10rem"
-  }, [g, m] = C(n);
+  }, [g, m] = O(n);
   return Y(() => {
     m(n);
   }, [n]), /* @__PURE__ */ v(W, { gap: "md", p: "md", children: [
@@ -9731,11 +9739,11 @@ const Ae = ({
         /* @__PURE__ */ e(
           he,
           {
-            icon: g ? Ne : Wn,
+            icon: g ? Ne : $n,
             size: "md",
             color: "gray",
             changeIconOnHover: !0,
-            iconHovered: g ? Wn : Ne,
+            iconHovered: g ? $n : Ne,
             variant: "subtle",
             onClick: () => {
               m((y) => !y);
@@ -9743,7 +9751,7 @@ const Ae = ({
             "aria-pressed": g
           }
         ),
-        /* @__PURE__ */ e(Tn, { label: i.title, onClick: () => {
+        /* @__PURE__ */ e(En, { label: i.title, onClick: () => {
         } })
       ] }),
       /* @__PURE__ */ e(b, { children: r })
@@ -9757,7 +9765,7 @@ const Ae = ({
             onMouseLeave: () => I(!1),
             h: l ? 64 : 24,
             children: l ? /* @__PURE__ */ e(
-              Ln,
+              jn,
               {
                 editable: t,
                 avatar: l,
@@ -9801,7 +9809,7 @@ const Ae = ({
                       gap: 6
                     },
                     children: [
-                      /* @__PURE__ */ e(Rn, { size: 16 }),
+                      /* @__PURE__ */ e(Tn, { size: 16 }),
                       /* @__PURE__ */ e(T, { size: "sm", fw: 500, children: "Add avatar" })
                     ]
                   }
@@ -9849,13 +9857,13 @@ const Ae = ({
     availableMembersUsers: a,
     handleResponsibleChange: c,
     handleMembersChange: s
-  } = jt(r, i);
+  } = Ft(r, i);
   return /* @__PURE__ */ v(W, { gap: "sm", children: [
     /* @__PURE__ */ e(
-      Bt,
+      At,
       {
         label: "Description",
-        icon: ct,
+        icon: st,
         value: t.description,
         onChange: t.onDescriptionChange,
         editable: n
@@ -9867,7 +9875,7 @@ const Ae = ({
       {
         editable: !1,
         label: "Team Owner",
-        icon: st,
+        icon: lt,
         value: o.id,
         users: [o]
       },
@@ -9879,7 +9887,7 @@ const Ae = ({
         multiple: !1,
         editable: n,
         label: "Team Leader",
-        icon: zn,
+        icon: Dn,
         value: r.userIds.length > 0 ? r.userIds[0] : void 0,
         users: r.users,
         onChange: c,
@@ -9895,7 +9903,7 @@ const Ae = ({
         multiple: !0,
         editable: n,
         label: "Team Members",
-        icon: lt,
+        icon: dt,
         value: i.members.map((l) => l.id),
         users: a,
         onChange: s,
@@ -9947,11 +9955,16 @@ const Ae = ({
   children: d,
   footer: u
 }) => {
-  const [p, f] = C(
+  var S, M;
+  const [p, f] = O(
     s == null ? void 0 : s.avatar
-  ), [I, h] = C(!1), [g, m] = C(!1);
+  ), [I, h] = O(!1), [g, m] = O(!1);
+  Y(() => {
+    f(s == null ? void 0 : s.avatar);
+  }, [s == null ? void 0 : s.avatar]);
+  const w = (S = s == null ? void 0 : s.loading) == null ? void 0 : S.avatar, y = (M = s == null ? void 0 : s.loading) == null ? void 0 : M.title;
   return /* @__PURE__ */ e(
-    Cn,
+    On,
     {
       opened: n,
       onClose: o,
@@ -9968,7 +9981,7 @@ const Ae = ({
         /* @__PURE__ */ v(A, { justify: "space-between", children: [
           /* @__PURE__ */ v(A, { gap: "xs", wrap: "nowrap", children: [
             /* @__PURE__ */ e(Be, { icon: Ne, onClick: o }),
-            /* @__PURE__ */ e(Be, { icon: Dn, onClick: () => i() })
+            /* @__PURE__ */ e(Be, { icon: Rn, onClick: () => i() })
           ] }),
           " ",
           /* @__PURE__ */ e(b, { children: c })
@@ -9981,9 +9994,9 @@ const Ae = ({
               {
                 onMouseEnter: () => m(!0),
                 onMouseLeave: () => m(!1),
-                h: p ? 64 : 24,
-                children: p ? /* @__PURE__ */ e(
-                  Ln,
+                h: w || p ? 64 : 24,
+                children: w ? /* @__PURE__ */ e(vn, { height: 64, width: 64, radius: "md" }) : p ? /* @__PURE__ */ e(
+                  jn,
                   {
                     editable: a,
                     avatar: p,
@@ -9991,9 +10004,9 @@ const Ae = ({
                     opened: I,
                     onOpen: () => h(!0),
                     onClose: () => h(!1),
-                    onAvatarSelect: (w) => {
-                      var y;
-                      f(w), (y = s == null ? void 0 : s.onAvatarChange) == null || y.call(s, w);
+                    onAvatarSelect: (z) => {
+                      var k;
+                      f(z), (k = s == null ? void 0 : s.onAvatarChange) == null || k.call(s, z);
                     },
                     onRemove: () => {
                       f(void 0);
@@ -10010,12 +10023,12 @@ const Ae = ({
                     color: "gray",
                     mb: "md",
                     onClick: () => {
-                      var y;
-                      const w = {
+                      var k;
+                      const z = {
                         type: "emoji",
                         value: "😊"
                       };
-                      f(w), (y = s == null ? void 0 : s.onAvatarChange) == null || y.call(s, w);
+                      f(z), (k = s == null ? void 0 : s.onAvatarChange) == null || k.call(s, z);
                     },
                     children: /* @__PURE__ */ v(
                       b,
@@ -10027,7 +10040,7 @@ const Ae = ({
                           gap: 6
                         },
                         children: [
-                          /* @__PURE__ */ e(Rn, { size: 16 }),
+                          /* @__PURE__ */ e(Tn, { size: 16 }),
                           /* @__PURE__ */ e(T, { size: "sm", fw: 500, children: "Add avatar" })
                         ]
                       }
@@ -10036,13 +10049,13 @@ const Ae = ({
                 ) })
               }
             ),
-            a ? /* @__PURE__ */ e(
+            y ? /* @__PURE__ */ e(vn, { height: 64, width: "100%", radius: "md", mt: "md" }) : a ? /* @__PURE__ */ e(
               an,
               {
                 value: s.title || "",
-                onChange: (w) => {
-                  var y;
-                  return (y = s.onTitleChange) == null ? void 0 : y.call(s, w);
+                onChange: (z) => {
+                  var k;
+                  return (k = s.onTitleChange) == null ? void 0 : k.call(s, z);
                 },
                 onDraftChange: s.onTitleDraftChange,
                 pageTitle: !0,
@@ -10120,7 +10133,7 @@ export {
   Be as ActionIcon,
   ui as AppLayout,
   di as AppLayoutProvider,
-  Ln as AvatarSelector,
+  jn as AvatarSelector,
   Gi as BaseLayout,
   Oe as BoxAvatar,
   $i as CenterPeek,
@@ -10130,8 +10143,8 @@ export {
   Dr as EmojiAvatar,
   Pr as ExpandableSearch,
   Ri as FilterDropdown,
-  En as FilterDropdownButton,
-  Bn as FilterDropdownFilters,
+  Bn as FilterDropdownButton,
+  An as FilterDropdownFilters,
   Hi as FullPage,
   lo as GenericTable,
   Lr as IconAvatar,
@@ -10142,17 +10155,17 @@ export {
   Jo as Matrix,
   nn as Menu,
   Bi as ModalSettings,
-  ft as NavButton,
-  $n as NavLink,
-  Vn as Navbar,
+  ht as NavButton,
+  Hn as NavLink,
+  _n as Navbar,
   Li as NavbarProvider,
   Ai as NotificationSidebar,
   Wi as NumberProperty,
   pi as PageLayout,
   Ae as PageProperty,
-  wn as PlaceholderAvatar,
+  bn as PlaceholderAvatar,
   no as PopoverItem,
-  An as PopoverSelector,
+  Ln as PopoverSelector,
   Fe as SelectUserProperty,
   Ti as ShareButton,
   To as ShareMenu,
@@ -10162,16 +10175,16 @@ export {
   _i as TeamPage,
   mi as TeamProperties,
   Vi as TeamSidePeek,
-  Tn as TextButton,
+  En as TextButton,
   Ui as TextProperty,
-  Bt as TextareaProperty,
+  At as TextareaProperty,
   Yi as ThemeProvider,
   In as UserChip,
   Fi as WorkspaceSelector,
   No as WorkspaceSelectorItem,
   Nr as getInitialsFromName,
   gi as theme,
-  Lt as useAppLayout,
+  jt as useAppLayout,
   ji as useNavbar,
-  jt as useTeamProperties
+  Ft as useTeamProperties
 };