@lax-wp/design-system 0.5.1 → 0.5.3

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",
@@ -14353,14 +14361,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 +15700,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 +15741,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 +15909,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 +16073,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 +17784,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 +18041,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))
                         }
                       )
                     ]