@lax-wp/design-system 0.5.2 → 0.5.4

package/dist/components/layout/LogoLoader.d.ts

@@ -6,8 +6,8 @@ type ClassValue = string | number | boolean | undefined | null | ClassValue[];
 export interface LogoLoaderProps {
     /** Additional CSS classes for the wrapper */
     classValue?: ClassValue;
-    /** Whether dark mode is enabled */
-    isDarkMode: boolean;
+    /** Whether dark mode is enabled. If not provided, checks if document has "dark" class */
+    isDarkMode?: boolean;
 }
 /**
  * LogoLoader displays an animated LAX logo with a loading bar
@@ -16,6 +16,7 @@ export interface LogoLoaderProps {
  * ```tsx
  * <LogoLoader isDarkMode={false} />
  * <LogoLoader isDarkMode={true} classValue="h-screen" />
+ * <LogoLoader /> // Auto-detects dark mode from document "dark" class
  * ```
  */
 export declare const LogoLoader: FC<LogoLoaderProps>;

package/dist/components/user-avatar/UserAvatar.d.ts

@@ -1,4 +1,4 @@
-import { FC } from 'react';
+import { type FC } from 'react';
 export type UserAvatarSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
 export type UserDetailsTeam = {
     id?: string;

package/dist/index.es.js

@@ -1,8 +1,8 @@
 import { jsx as e, jsxs as p, Fragment as Ce } from "react/jsx-runtime";
-import { AnimatePresence as Ue, motion as Me } from "framer-motion";
+import { AnimatePresence as Ue, motion as Le } from "framer-motion";
 import ve, { forwardRef as xe, useRef as ce, useState as U, useEffect as te, useMemo as de, createElement as q1, useCallback as pe, createContext as Q1, useContext as ur, useLayoutEffect as ua, useImperativeHandle as fa, Suspense as pa, Fragment as ha, memo as en } from "react";
 import { useTranslation as De } from "react-i18next";
-import { Tooltip as Ne, Select as ma, Skeleton as $r, Checkbox as tn, Dropdown as vt, DatePicker as Hr, Modal as ba, Upload as rn, Popover as ga, Drawer as Ca } from "antd";
+import { Tooltip as Me, Select as ma, Skeleton as $r, Checkbox as tn, Dropdown as vt, DatePicker as Hr, Modal as ba, Upload as rn, Popover as ga, Drawer as Ca } from "antd";
 import * as fr from "@mui/icons-material";
 import { BoltOutlined as Ke, NoteAddOutlined as nt, CloseRounded as Ur, TableChartRounded as nn, ChevronLeftRounded as xa, ChevronRightRounded as va, OpenInFull as ya, DescriptionRounded as wa, ArrowUpwardRounded as ka, ArrowDownwardRounded as Na, Timer as La, DoDisturbRounded as Ma, Pending as Ea, PlayArrowRounded as Sa, RemoveCircleOutline as Da, ChevronLeft as Fa, Lock as Aa, Close as $a, GroupsOutlined as Ha, VpnKeyOffOutlined as Ia, VisibilityOutlined as Ra, VisibilityOffOutlined as _a } from "@mui/icons-material";
 import Ta, { createPortal as pt } from "react-dom";
@@ -278,7 +278,7 @@ const sn = xe(
         )
       ] }),
       /* @__PURE__ */ e(Ue, { children: o && /* @__PURE__ */ e(
-        Me.div,
+        Le.div,
         {
           initial: { opacity: 0, y: -10 },
           animate: { opacity: 1, y: 0 },
@@ -956,7 +956,7 @@ const ze = ({ labels: t = [] }) => {
                         ]
                       }
                     ),
-                    g?.length > 0 && g !== R.value && /* @__PURE__ */ e(Ne, { placement: "top", title: g, children: /* @__PURE__ */ e(
+                    g?.length > 0 && g !== R.value && /* @__PURE__ */ e(Me, { placement: "top", title: g, children: /* @__PURE__ */ e(
                       "button",
                       {
                         className: "cursor-pointer",
@@ -983,7 +983,7 @@ const ze = ({ labels: t = [] }) => {
                     ),
                     D && /* @__PURE__ */ e(Je, {}),
                     /* @__PURE__ */ e(ze, { labels: s }),
-                    k && /* @__PURE__ */ e(Ne, { placement: "top", title: k, children: /* @__PURE__ */ e("div", { className: "cursor-pointer", children: /* @__PURE__ */ e(Pe, {}) }) })
+                    k && /* @__PURE__ */ e(Me, { placement: "top", title: k, children: /* @__PURE__ */ e("div", { className: "cursor-pointer", children: /* @__PURE__ */ e(Pe, {}) }) })
                   ] }),
                   N && V && A ? /* @__PURE__ */ e(
                     "button",
@@ -992,7 +992,7 @@ const ze = ({ labels: t = [] }) => {
                       className: "cursor-pointer",
                       onClick: () => j(R?.value),
                       type: "button",
-                      children: /* @__PURE__ */ e(Ne, { placement: "top", title: M("Add to document"), children: /* @__PURE__ */ e(
+                      children: /* @__PURE__ */ e(Me, { placement: "top", title: M("Add to document"), children: /* @__PURE__ */ e(
                         nt,
                         {
                           className: "text-primary-600",
@@ -1068,7 +1068,7 @@ const ze = ({ labels: t = [] }) => {
               ) : C ? /* @__PURE__ */ e("div", { className: "absolute inset-y-0 flex items-center right-2", children: C }) : null
             ] }) }),
             /* @__PURE__ */ e(Ue, { children: a && /* @__PURE__ */ e(
-              Me.div,
+              Le.div,
               {
                 initial: { opacity: 0, y: -10 },
                 animate: { opacity: 1, y: 0 },
@@ -1087,7 +1087,7 @@ const ze = ({ labels: t = [] }) => {
               }
             ) }),
             /* @__PURE__ */ e(Ue, { children: o && /* @__PURE__ */ e(
-              Me.div,
+              Le.div,
               {
                 initial: { opacity: 0, y: -10 },
                 animate: { opacity: 1, y: 0 },
@@ -1238,7 +1238,7 @@ const Pd = xe(
         }
       ),
       /* @__PURE__ */ e(Ue, { children: l && /* @__PURE__ */ e(
-        Me.div,
+        Le.div,
         {
           initial: { opacity: 0, y: -10 },
           animate: { opacity: 1, y: 0 },
@@ -1344,7 +1344,7 @@ const Pd = xe(
                     ),
                     g && /* @__PURE__ */ e(Je, {}),
                     /* @__PURE__ */ e(ze, { labels: u || [] }),
-                    k && /* @__PURE__ */ e(Ne, { placement: "top", title: k, children: /* @__PURE__ */ e(
+                    k && /* @__PURE__ */ e(Me, { placement: "top", title: k, children: /* @__PURE__ */ e(
                       "div",
                       {
                         className: "cursor-pointer",
@@ -1364,7 +1364,7 @@ const Pd = xe(
                       className: "cursor-pointer",
                       onClick: M,
                       type: "button",
-                      children: /* @__PURE__ */ e(Ne, { placement: "top", title: A("Add to document"), children: /* @__PURE__ */ e(
+                      children: /* @__PURE__ */ e(Me, { placement: "top", title: A("Add to document"), children: /* @__PURE__ */ e(
                         nt,
                         {
                           className: "text-primary-600",
@@ -1624,7 +1624,7 @@ const lt = ({
                       className: "cursor-pointer",
                       onClick: () => ue(a?.toString() || ""),
                       type: "button",
-                      children: /* @__PURE__ */ e(Ne, { placement: "top", title: P("Add to document"), children: /* @__PURE__ */ e(
+                      children: /* @__PURE__ */ e(Me, { placement: "top", title: P("Add to document"), children: /* @__PURE__ */ e(
                         nt,
                         {
                           sx: {
@@ -1973,7 +1973,7 @@ const Ko = (t) => Array.isArray(t) ? t.map((r) => typeof r == "string" || typeof
                         ),
                         f && /* @__PURE__ */ e(Je, {}),
                         /* @__PURE__ */ e(ze, { labels: i }),
-                        u && /* @__PURE__ */ e(Ne, { placement: "top", title: u, children: /* @__PURE__ */ e(
+                        u && /* @__PURE__ */ e(Me, { placement: "top", title: u, children: /* @__PURE__ */ e(
                           "div",
                           {
                             className: "cursor-pointer",
@@ -1993,7 +1993,7 @@ const Ko = (t) => Array.isArray(t) ? t.map((r) => typeof r == "string" || typeof
                           className: "cursor-pointer",
                           onClick: se,
                           type: "button",
-                          children: /* @__PURE__ */ e(Ne, { placement: "top", title: B("Add to document"), children: /* @__PURE__ */ e(nt, { className: "text-primary-600", sx: { fontSize: 16 } }) })
+                          children: /* @__PURE__ */ e(Me, { placement: "top", title: B("Add to document"), children: /* @__PURE__ */ e(nt, { className: "text-primary-600", sx: { fontSize: 16 } }) })
                         }
                       ) : null
                     ] })
@@ -2080,7 +2080,7 @@ const Ko = (t) => Array.isArray(t) ? t.map((r) => typeof r == "string" || typeof
                     onClear: () => k && k(n === "tags" || n === "multiple" ? [] : null),
                     maxTagCount: n === "tags" && I ? void 0 : "responsive",
                     maxTagPlaceholder: (le) => /* @__PURE__ */ e(
-                      Ne,
+                      Me,
                       {
                         styles: {
                           root: {
@@ -2250,7 +2250,7 @@ const el = xe(
         }
       ),
       /* @__PURE__ */ e(Ue, { children: c && /* @__PURE__ */ e(
-        Me.div,
+        Le.div,
         {
           initial: { opacity: 0, y: -10 },
           animate: { opacity: 1, y: 0 },
@@ -2453,7 +2453,7 @@ const tl = ({
         ) })
       ] }),
       /* @__PURE__ */ e(Ue, { children: s && /* @__PURE__ */ e(
-        Me.div,
+        Le.div,
         {
           initial: { opacity: 0, y: -10 },
           animate: { opacity: 1, y: 0 },
@@ -2624,7 +2624,7 @@ const nl = ({
             u && /* @__PURE__ */ e(Te, {})
           ] }),
           /* @__PURE__ */ e(ze, { labels: b }),
-          m && /* @__PURE__ */ e(Ne, { placement: "top", title: m, children: /* @__PURE__ */ e("div", { className: "cursor-pointer", children: /* @__PURE__ */ e(Pe, {}) }) })
+          m && /* @__PURE__ */ e(Me, { placement: "top", title: m, children: /* @__PURE__ */ e("div", { className: "cursor-pointer", children: /* @__PURE__ */ e(Pe, {}) }) })
         ]
       }
     ),
@@ -3600,7 +3600,7 @@ const cl = (t, r, n, a = "medium") => {
                   className: "cursor-pointer",
                   onClick: Z,
                   type: "button",
-                  children: /* @__PURE__ */ e(Ne, { placement: "top", title: V("Add to document"), children: /* @__PURE__ */ e(nt, { className: "text-primary-600", sx: { fontSize: 16 } }) })
+                  children: /* @__PURE__ */ e(Me, { placement: "top", title: V("Add to document"), children: /* @__PURE__ */ e(nt, { className: "text-primary-600", sx: { fontSize: 16 } }) })
                 }
               ) : null
             ] }),
@@ -3688,7 +3688,7 @@ const cl = (t, r, n, a = "medium") => {
               )
             ] }),
             /* @__PURE__ */ e(Ue, { children: I && /* @__PURE__ */ e(
-              Me.div,
+              Le.div,
               {
                 initial: { opacity: 0, y: -10 },
                 animate: { opacity: 1, y: 0 },
@@ -4221,7 +4221,7 @@ const Ir = (t, r) => {
                       className: "cursor-pointer",
                       onClick: () => G(Y(n)),
                       type: "button",
-                      children: /* @__PURE__ */ e(Ne, { placement: "top", title: M("Add to document"), children: /* @__PURE__ */ e(
+                      children: /* @__PURE__ */ e(Me, { placement: "top", title: M("Add to document"), children: /* @__PURE__ */ e(
                         nt,
                         {
                           className: "text-primary-600",
@@ -4584,7 +4584,7 @@ const gl = xe(
         }
       ) }),
       /* @__PURE__ */ e(Ue, { children: c && /* @__PURE__ */ e(
-        Me.div,
+        Le.div,
         {
           initial: { opacity: 0, y: -10 },
           animate: { opacity: 1, y: 0 },
@@ -5675,7 +5675,7 @@ const Pl = "MM/DD/YYYY", Lr = "MM/DD/YYYY - hh:mm A", w1 = "YYYY-MM-DD", k1 = "Y
                       className: "cursor-pointer",
                       onClick: () => B(r),
                       type: "button",
-                      children: /* @__PURE__ */ e(Ne, { placement: "top", title: $("Add to document"), children: /* @__PURE__ */ e(
+                      children: /* @__PURE__ */ e(Me, { placement: "top", title: $("Add to document"), children: /* @__PURE__ */ e(
                         nt,
                         {
                           className: "text-primary-600",
@@ -5811,7 +5811,7 @@ const Yl = ({
       }
     ) }),
     /* @__PURE__ */ e(Ue, { children: a && /* @__PURE__ */ e(
-      Me.div,
+      Le.div,
       {
         initial: { opacity: 0, y: -5 },
         animate: { opacity: 1, y: 0 },
@@ -5941,7 +5941,7 @@ const Ul = xe(
                       className: "cursor-pointer",
                       onClick: () => ee(a?.toString() || ""),
                       type: "button",
-                      children: /* @__PURE__ */ e(Ne, { placement: "top", title: R("Add to document"), children: /* @__PURE__ */ e(
+                      children: /* @__PURE__ */ e(Me, { placement: "top", title: R("Add to document"), children: /* @__PURE__ */ e(
                         nt,
                         {
                           sx: {
@@ -7437,7 +7437,7 @@ const oe = {
     disabled: !1
   }));
   return r ? /* @__PURE__ */ e(
-    Me.div,
+    Le.div,
     {
       initial: { y: 20, opacity: 0 },
       animate: { y: 0, opacity: 1 },
@@ -7492,7 +7492,7 @@ const oe = {
                   c ? "bg-primary-900 dark:bg-black-800 px-[10px] rounded-[43px]" : ""
                 ),
                 children: f ? /* @__PURE__ */ p(
-                  Me.div,
+                  Le.div,
                   {
                     initial: { opacity: 0 },
                     animate: { opacity: 1 },
@@ -7608,7 +7608,7 @@ const oe = {
                     ]
                   }
                 ) : /* @__PURE__ */ p(
-                  Me.div,
+                  Le.div,
                   {
                     initial: { opacity: 0 },
                     animate: { opacity: 1 },
@@ -8675,7 +8675,7 @@ const Ti = xe(
                       className: "cursor-pointer",
                       onClick: () => V(n?.toString()),
                       type: "button",
-                      children: /* @__PURE__ */ e(Ne, { placement: "top", title: M("Add to document"), children: /* @__PURE__ */ e(
+                      children: /* @__PURE__ */ e(Me, { placement: "top", title: M("Add to document"), children: /* @__PURE__ */ e(
                         nt,
                         {
                           className: "text-primary-600",
@@ -9177,7 +9177,7 @@ const Wd = ({
         height: 240,
         children: ({ columnIndex: c, rowIndex: s, style: u }) => {
           const d = s * 5 + c, f = l?.[d];
-          return f ? /* @__PURE__ */ e("div", { style: { ...u, padding: "4px" }, children: /* @__PURE__ */ e(Ne, { title: Zi(f), children: /* @__PURE__ */ e(
+          return f ? /* @__PURE__ */ e("div", { style: { ...u, padding: "4px" }, children: /* @__PURE__ */ e(Me, { title: Zi(f), children: /* @__PURE__ */ e(
             eo,
             {
               className: T(
@@ -9766,18 +9766,26 @@ const Jd = ({ children: t, showAsModal: r, ...n }) => r ? /* @__PURE__ */ e(Xe,
                   },
                   `${Z.label}-${Z.value || Z.color}`
                 )) }),
-                i && /* @__PURE__ */ e(Ne, { placement: "top", title: i, children: /* @__PURE__ */ e(
-                  "div",
+                i && /* @__PURE__ */ e(
+                  he,
                   {
-                    className: "cursor-pointer",
-                    role: "button",
-                    tabIndex: 0,
-                    onKeyDown: (Z) => {
-                      (Z.key === "Enter" || Z.key === " ") && Z.preventDefault();
-                    },
-                    children: /* @__PURE__ */ e(Pe, { size: 14 })
+                    placement: "top",
+                    title: i,
+                    whiteSpace: "normal",
+                    children: /* @__PURE__ */ e(
+                      "div",
+                      {
+                        className: "cursor-pointer",
+                        role: "button",
+                        tabIndex: 0,
+                        onKeyDown: (Z) => {
+                          (Z.key === "Enter" || Z.key === " ") && Z.preventDefault();
+                        },
+                        children: /* @__PURE__ */ e(Pe, { size: 14 })
+                      }
+                    )
                   }
-                ) })
+                )
               ]
             }
           ),
@@ -9798,7 +9806,7 @@ const Jd = ({ children: t, showAsModal: r, ...n }) => r ? /* @__PURE__ */ e(Xe,
                   /* @__PURE__ */ e("span", { children: B() })
                 ] }) : u || f ? /* @__PURE__ */ e("mark", { className: T("rounded-md py-0.5 px-1", Q()), children: B() }) : B(),
                 o === "currency" && w !== 0 && w !== void 0 && w !== null && /* @__PURE__ */ p(
-                  Me.span,
+                  Le.span,
                   {
                     initial: { opacity: 0, y: 2 },
                     animate: { opacity: 1, y: 0 },
@@ -10114,7 +10122,7 @@ const t0 = () => /* @__PURE__ */ e("div", { className: "cursor-ew-resize flex it
   onResize: C,
   children: g
 }) => /* @__PURE__ */ e(Ue, { children: t && /* @__PURE__ */ e(
-  Me.div,
+  Le.div,
   {
     ref: a,
     id: n,
@@ -10494,7 +10502,7 @@ const s0 = xe(
       ),
       a && pt(
         /* @__PURE__ */ e(Ue, { children: /* @__PURE__ */ p(
-          Me.div,
+          Le.div,
           {
             ref: h,
             initial: { opacity: 0, scale: 0.95 },
@@ -11294,7 +11302,7 @@ function _0(t, ...r) {
     return l(R0.apply(null, arguments));
   };
 }
-const Le = (t) => {
+const Ne = (t) => {
   const r = (n) => n[t] || [];
   return r.isThemeGetter = !0, r;
 }, Sn = /^\[(?:(\w[\w-]*):)?(.+)\]$/i, Dn = /^\((?:(\w[\w-]*):)?(.+)\)$/i, T0 = /^\d+\/\d+$/, O0 = /^(\d+(\.\d+)?)?(xs|sm|md|lg|xl)$/, V0 = /\d+(%|px|r?em|[sdl]?v([hwib]|min|max)|pt|pc|in|cm|mm|cap|ch|ex|r?lh|cq(w|h|i|b|min|max))|\b(calc|min|max|clamp)\(.+\)|^0$/, P0 = /^(rgba?|hsla?|hwb|(ok)?(lab|lch)|color-mix)\(.+\)$/, z0 = /^(inset_)?-?((\d+)?\.?(\d+)[a-z]+|0)_-?((\d+)?\.?(\d+)[a-z]+|0)/, B0 = /^(url|image|image-set|cross-fade|element|(repeating-)?(linear|radial|conic)-gradient)\(.+\)$/, bt = (t) => T0.test(t), fe = (t) => !!t && !Number.isNaN(Number(t)), at = (t) => !!t && Number.isInteger(Number(t)), Dr = (t) => t.endsWith("%") && fe(t.slice(0, -1)), et = (t) => O0.test(t), Z0 = () => !0, j0 = (t) => (
@@ -11309,7 +11317,7 @@ const Le = (t) => {
   const a = Dn.exec(t);
   return a ? a[1] ? r(a[1]) : n : !1;
 }, An = (t) => t === "position" || t === "percentage", $n = (t) => t === "image" || t === "url", Hn = (t) => t === "length" || t === "size" || t === "bg-size", In = (t) => t === "length", Q0 = (t) => t === "number", es = (t) => t === "family-name", Rn = (t) => t === "shadow", ts = () => {
-  const t = Le("color"), r = Le("font"), n = Le("text"), a = Le("font-weight"), o = Le("tracking"), l = Le("leading"), i = Le("breakpoint"), c = Le("container"), s = Le("spacing"), u = Le("radius"), d = Le("shadow"), f = Le("inset-shadow"), m = Le("text-shadow"), b = Le("drop-shadow"), k = Le("blur"), C = Le("perspective"), g = Le("aspect"), h = Le("ease"), w = Le("animate"), D = () => ["auto", "avoid", "all", "avoid-page", "page", "left", "right", "column"], N = () => [
+  const t = Ne("color"), r = Ne("font"), n = Ne("text"), a = Ne("font-weight"), o = Ne("tracking"), l = Ne("leading"), i = Ne("breakpoint"), c = Ne("container"), s = Ne("spacing"), u = Ne("radius"), d = Ne("shadow"), f = Ne("inset-shadow"), m = Ne("text-shadow"), b = Ne("drop-shadow"), k = Ne("blur"), C = Ne("perspective"), g = Ne("aspect"), h = Ne("ease"), w = Ne("animate"), D = () => ["auto", "avoid", "all", "avoid-page", "page", "left", "right", "column"], N = () => [
     "center",
     "top",
     "bottom",
@@ -14274,7 +14282,10 @@ const ls = () => /* @__PURE__ */ p(
       ) })
     ]
   }
-), ss = ({ classValue: t, isDarkMode: r }) => /* @__PURE__ */ e("div", { className: `${T(t)} flex justify-center items-center`, children: r ? /* @__PURE__ */ e(is, {}) : /* @__PURE__ */ e(ls, {}) });
+), ss = ({ classValue: t, isDarkMode: r }) => {
+  const n = r ?? document.documentElement.classList.contains("dark");
+  return /* @__PURE__ */ e("div", { className: `${T(t)} flex justify-center items-center`, children: n ? /* @__PURE__ */ e(is, {}) : /* @__PURE__ */ e(ls, {}) });
+};
 ss.displayName = "LogoLoader";
 const Tn = xe(
   ({ item: t, variant: r, isLastItem: n = !1, onClick: a }, o) => {
@@ -14353,14 +14364,14 @@ const cs = ({
       }
     );
     return s?.link && a ? /* @__PURE__ */ e(
-      Ne,
+      Me,
       {
         title: l[u] ? s?.title : "",
         placement: "bottom",
         children: a(s, f, d)
       }
     ) : /* @__PURE__ */ e(
-      Ne,
+      Me,
       {
         title: l[u] ? s?.title : "",
         placement: "bottom",
@@ -15692,7 +15703,7 @@ const I1 = (t, r) => {
     }
   };
   return /* @__PURE__ */ p(
-    Me.div,
+    Le.div,
     {
       className: "rounded-lg border border-[rgba(234,236,240,0.20)] bg-white/15 shadow-[0_8px_24px_0_rgba(16,24,40,0.04)] mt-5",
       variants: r,
@@ -15733,7 +15744,7 @@ const I1 = (t, r) => {
     }
   };
   return /* @__PURE__ */ p(
-    Me.div,
+    Le.div,
     {
       className: "bg-white dark:bg-[#0A0710] rounded-lg border border-[#EAECF0] dark:border-[#14131B] shadow-[0_8px_24px_0_rgba(16,24,40,0.04)] overflow-hidden",
       variants: n,
@@ -15901,7 +15912,7 @@ const Yn = ({
     [o, n, a, i, r]
   );
   return /* @__PURE__ */ e("div", { className: s, children: k ? /* @__PURE__ */ e(
-    Ne,
+    Me,
     {
       title: C,
       placement: c,
@@ -16065,7 +16076,7 @@ const Ps = ({
       ]
     }
   ),
-  a ? /* @__PURE__ */ e(Me.div, { className: ` ${!f && "p-4"} ${D}`, children: t }) : null
+  a ? /* @__PURE__ */ e(Le.div, { className: ` ${!f && "p-4"} ${D}`, children: t }) : null
 ] });
 Ps.displayName = "Accordion";
 const zs = ({
@@ -17776,7 +17787,7 @@ const xc = ({ isOpen: t, onClose: r, anchorEl: n, placement: a = "right-start",
     };
   }, [t, o]), t ? pt(
     /* @__PURE__ */ e("div", { ref: i, className: "z-[9999]", onMouseEnter: (s) => s.stopPropagation(), onMouseLeave: r, children: /* @__PURE__ */ e(
-      Me.div,
+      Le.div,
       {
         initial: { opacity: 0, scale: 0.95 },
         animate: { opacity: 1, scale: 1 },
@@ -18033,7 +18044,7 @@ const xc = ({ isOpen: t, onClose: r, anchorEl: n, placement: a = "right-start",
                           ),
                           onMouseEnter: H,
                           onMouseLeave: v,
-                          children: b?.teams?.slice(1)?.map((Q, Z) => /* @__PURE__ */ e("div", { className: "my-2", children: /* @__PURE__ */ e(Oe, { label: Q?.name, color: Q?.color || "#4A5568", size: "sm", isHashColor: !0 }, Q?.id) }, Q?.id || Z))
+                          children: b?.teams?.slice(1)?.map((Q, Z) => /* @__PURE__ */ e("div", { className: "my-2", children: /* @__PURE__ */ e(Oe, { label: Q?.name, color: Q?.color || "#4A5568", size: "sm", isHashColor: !0, className: "w-fit" }, Q?.id) }, Q?.id || Z))
                         }
                       )
                     ]