@lax-wp/design-system 0.13.29 → 0.13.33-beta.0

package/dist/components/user-avatar/UserAvatar.es.js

@@ -3,14 +3,14 @@ import { GroupsOutlined as ee } from "@mui/icons-material";
 import re from "@mui/icons-material/EditOutlined";
 import oe from "@mui/icons-material/WarningRounded";
 import l from "../../_virtual/index.es.js";
-import { useState as H, useRef as k, useMemo as ae, useEffect as U } from "react";
+import { useState as B, useRef as k, useMemo as ae, useEffect as A } from "react";
 import { Typography as s } from "../data-display/typography/Typography.es.js";
 import { Tag as p } from "../data-display/tag/Tag.es.js";
 import { Skeleton as le } from "../data-display/skeleton/Skeleton.es.js";
 import { getFlagComponentRectangleMd as te } from "../../utils/countryFlags.es.js";
 import { UserAvatarPopper as ne } from "./UserAvatarPopper.es.js";
 import { StatusInfoRow as de } from "./StatusInfoRow.es.js";
-import { sizeClasses as B, getInitials as A } from "./constants.es.js";
+import { sizeClasses as C, getInitials as F } from "./constants.es.js";
 import { PersonIcon as ie } from "./PersonIcon.es.js";
 import { useDynamicPosition as ce } from "./useDynamicPosition.es.js";
 const v = ({ label: n, content: d }) => /* @__PURE__ */ a("div", { className: "flex justify-between items-center", children: [
@@ -19,50 +19,51 @@ const v = ({ label: n, content: d }) => /* @__PURE__ */ a("div", { className: "f
 ] }), se = ({
   firstName: n,
   lastName: d,
-  email: F,
+  email: $,
   profilePic: i,
-  size: $ = "md",
-  hoverSize: C = "lg",
+  size: z = "md",
+  hoverSize: M = "lg",
   containerClassName: G = "",
   enablePopper: P = !0,
   className: W,
-  userId: z,
+  userId: R,
   lastViewedOn: m,
   isActive: u,
   statusIndicator: q = !1,
   userDetails: r,
   isFetchingUserDetails: J = !1,
-  authToken: M,
+  authToken: j,
   onHover: K,
-  currentlyEditing: R
+  currentlyEditing: L
 }) => {
   if (n === "All" && d === "Users")
     return /* @__PURE__ */ e("div", { className: "p-1 rounded-full bg-primary-100 dark:bg-black-600 flex items-center justify-center", children: /* @__PURE__ */ e(ee, { sx: { fontSize: 16 }, className: "text-primary-600 dark:text-primary-600" }) });
-  const [Q, y] = H(!1), [j, c] = H(!1), X = B[$], {
+  const [Q, y] = B(!1), [S, c] = B(!1), X = C[z], {
     triggerRef: Y,
     dropdownRef: Z,
     position: g,
     isVisible: _,
-    show: L,
-    hide: S
-  } = ce(), w = k({}), T = ae(() => {
+    show: T,
+    hide: I
+  } = ce(), w = k({}), E = ae(() => {
     if (u || !m) return !1;
     const o = new Date(m);
     return ((/* @__PURE__ */ new Date()).getTime() - o.getTime()) / (1e3 * 60 * 60) < 24;
-  }, [u, m]), h = u ? "bg-primary-600 dark:bg-primary-600" : T ? "bg-primary-300 dark:bg-primary-300" : m ? "bg-neutral-400 dark:bg-neutral-400" : null, b = u ? "border-primary-600 dark:border-primary-600" : T ? "border-primary-300 dark:border-primary-300" : m ? "border-neutral-400 dark:border-neutral-400" : "border-primary-200 dark:border-neutral-800", O = {
+  }, [u, m]), h = u ? "bg-primary-600 dark:bg-primary-600" : E ? "bg-primary-300 dark:bg-primary-300" : m ? "bg-neutral-400 dark:bg-neutral-400" : null, b = u ? "border-primary-600 dark:border-primary-600" : E ? "border-primary-300 dark:border-primary-300" : m ? "border-neutral-400 dark:border-neutral-400" : "border-primary-200 dark:border-neutral-800", O = {
+    "2xs": "w-1.5 h-1.5",
     xs: "w-2 h-2",
     sm: "w-2.5 h-2.5",
     md: "w-3 h-3",
     lg: "w-3.5 h-3.5",
     xl: "w-4 h-4"
   };
-  U(() => {
+  A(() => {
     if (i)
       if (w.current[i])
         c(!0);
       else {
         c(!1);
-        const o = new Image(), f = M || (typeof localStorage < "u" ? localStorage.getItem("token") : null);
+        const o = new Image(), f = j || (typeof localStorage < "u" ? localStorage.getItem("token") : null);
         o.src = i + (f ? "?token=" + f : ""), o.onload = () => {
           w.current[i] = o.src, c(!0);
         }, o.onerror = () => {
@@ -71,14 +72,14 @@ const v = ({ label: n, content: d }) => /* @__PURE__ */ a("div", { className: "f
       }
     else
       c(!1);
-  }, [i, M]), U(() => () => {
+  }, [i, j]), A(() => () => {
     t.current && clearTimeout(t.current);
   }, []);
   const x = i ? w.current[i] : void 0, t = k(null), N = k(null), V = () => {
     K?.(), n && d && P && (t.current && clearTimeout(t.current), t.current = setTimeout(() => {
       y(!0);
     }, 300));
-  }, I = (o) => {
+  }, H = (o) => {
     t.current && clearTimeout(t.current), t.current = setTimeout(() => {
       N.current && !N.current.contains(o.relatedTarget) && y(!1);
     }, 200);
@@ -90,11 +91,11 @@ const v = ({ label: n, content: d }) => /* @__PURE__ */ a("div", { className: "f
       onMouseEnter: () => {
         t.current && clearTimeout(t.current);
       },
-      onMouseLeave: (o) => I(o),
+      onMouseLeave: (o) => H(o),
       children: [
         /* @__PURE__ */ a("div", { className: "flex flex-col gap-1 items-center p-5", children: [
-          /* @__PURE__ */ a("div", { className: l("relative", B[C]), children: [
-            x && j ? /* @__PURE__ */ e(
+          /* @__PURE__ */ a("div", { className: l("relative", C[M]), children: [
+            x && S ? /* @__PURE__ */ e(
               "img",
               {
                 src: x,
@@ -109,7 +110,7 @@ const v = ({ label: n, content: d }) => /* @__PURE__ */ a("div", { className: "f
                   "bg-primary-100 dark:bg-primary-950 text-primary-600 border-2 flex items-center justify-center rounded-full w-full h-full",
                   b
                 ),
-                children: A((n || "") + " " + (d || ""))
+                children: F((n || "") + " " + (d || ""))
               }
             ),
             h && /* @__PURE__ */ e(
@@ -117,7 +118,7 @@ const v = ({ label: n, content: d }) => /* @__PURE__ */ a("div", { className: "f
               {
                 className: l(
                   "absolute bottom-0 right-0 rounded-full border-2 border-white dark:border-black-800",
-                  O[C],
+                  O[M],
                   h
                 )
               }
@@ -131,9 +132,9 @@ const v = ({ label: n, content: d }) => /* @__PURE__ */ a("div", { className: "f
             ] }),
             r?.region && /* @__PURE__ */ e("span", { children: te(r?.region) })
           ] }),
-          /* @__PURE__ */ e(s, { size: "small", variant: "medium", appearance: "body", children: F || r?.email || "" })
+          /* @__PURE__ */ e(s, { size: "small", variant: "medium", appearance: "body", children: $ || r?.email || "" })
         ] }),
-        R ? /* @__PURE__ */ e("div", { className: "px-5 pb-3", children: /* @__PURE__ */ a("div", { className: "flex items-center gap-3 rounded-lg border border-primary-100 dark:border-primary-900 bg-[rgba(230,241,252,0.60)] dark:bg-primary-950/40 px-[13px] py-[7px]", children: [
+        L ? /* @__PURE__ */ e("div", { className: "px-5 pb-3", children: /* @__PURE__ */ a("div", { className: "flex items-center gap-3 rounded-lg border border-primary-100 dark:border-primary-900 bg-[rgba(230,241,252,0.60)] dark:bg-primary-950/40 px-[13px] py-[7px]", children: [
           /* @__PURE__ */ e("div", { className: "flex items-center justify-center shrink-0 w-7 h-7 rounded-[5px] border-[0.4px] border-primary-100 dark:border-primary-900 bg-primary-50 dark:bg-primary-950", children: /* @__PURE__ */ e(re, { sx: { width: 13, height: 13 }, className: "text-primary-600 dark:text-primary-500" }) }),
           /* @__PURE__ */ a("div", { className: "flex flex-col min-w-0", children: [
             /* @__PURE__ */ e(
@@ -142,14 +143,14 @@ const v = ({ label: n, content: d }) => /* @__PURE__ */ a("div", { className: "f
                 size: "extra-small",
                 variant: "semibold",
                 appearance: "custom",
-                className: "text-[10px] leading-[18px] uppercase tracking-[0.2px] text-primary-600 dark:text-primary-500",
+                className: "text-2xs leading-4 uppercase tracking-[0.2px] text-primary-600 dark:text-primary-500",
                 children: "Currently editing"
               }
             ),
-            /* @__PURE__ */ e(s, { size: "extra-small", variant: "semibold", className: "truncate", children: R })
+            /* @__PURE__ */ e(s, { size: "extra-small", variant: "semibold", className: "truncate", children: L })
           ] })
         ] }) }) : null,
-        z && (J ? /* @__PURE__ */ e("div", { className: "p-5", children: /* @__PURE__ */ e(le, {}) }) : z && (r?.teams || r?.clearanceLevel || r?.group) ? /* @__PURE__ */ a("div", { className: "flex flex-col gap-4 bg-neutral-50 border-t border-neutral-200 dark:bg-black-700 dark:border-none p-5 rounded-b-lg", children: [
+        R && (J ? /* @__PURE__ */ e("div", { className: "p-5", children: /* @__PURE__ */ e(le, {}) }) : R && (r?.teams || r?.clearanceLevel || r?.group) ? /* @__PURE__ */ a("div", { className: "flex flex-col gap-4 bg-neutral-50 border-t border-neutral-200 dark:bg-black-700 dark:border-none p-5 rounded-b-lg", children: [
           /* @__PURE__ */ e(de, { isActive: u, lastViewedOn: m }),
           r.username && /* @__PURE__ */ e(
             v,
@@ -178,8 +179,8 @@ const v = ({ label: n, content: d }) => /* @__PURE__ */ a("div", { className: "f
                   {
                     ref: Y,
                     className: "relative cursor-pointer",
-                    onMouseEnter: L,
-                    onMouseLeave: S,
+                    onMouseEnter: T,
+                    onMouseLeave: I,
                     onClick: (o) => o.stopPropagation(),
                     children: [
                       /* @__PURE__ */ e(p, { label: `+ ${r?.teams?.length - 1} More`, color: "#004f08", size: "md", isHashColor: !0 }, 1),
@@ -196,8 +197,8 @@ const v = ({ label: n, content: d }) => /* @__PURE__ */ a("div", { className: "f
                               "right-0": g.horizontal === "right"
                             }
                           ),
-                          onMouseEnter: L,
-                          onMouseLeave: S,
+                          onMouseEnter: T,
+                          onMouseLeave: I,
                           children: r?.teams?.slice(1)?.map((o, f) => /* @__PURE__ */ e("div", { className: "my-2", children: /* @__PURE__ */ e(p, { label: o?.name, color: o?.color || "#4A5568", size: "md", isHashColor: !0, className: "w-fit" }, o?.id) }, o?.id || f))
                         }
                       )
@@ -245,17 +246,17 @@ const v = ({ label: n, content: d }) => /* @__PURE__ */ a("div", { className: "f
         ] }) }))
       ]
     }
-  ), E = k(null);
+  ), U = k(null);
   return /* @__PURE__ */ a(
     "div",
     {
       onMouseEnter: V,
-      onMouseLeave: I,
+      onMouseLeave: H,
       className: l("inline-block relative cursor-pointer", W),
-      ref: E,
+      ref: U,
       children: [
         /* @__PURE__ */ a("div", { className: l("relative", G || X), children: [
-          x && j ? /* @__PURE__ */ e(
+          x && S ? /* @__PURE__ */ e(
             "img",
             {
               src: x,
@@ -267,10 +268,11 @@ const v = ({ label: n, content: d }) => /* @__PURE__ */ a("div", { className: "f
             "div",
             {
               className: l(
-                "bg-primary-100 text-primary-600 flex items-center justify-center rounded-full border dark:bg-black-700 w-full h-full",
+                "bg-primary-100 text-primary-600 flex items-center justify-center rounded-full border dark:bg-black-700",
+                C[z],
                 b
               ),
-              children: A((n || "") + " " + (d || ""))
+              children: F((n || "") + " " + (d || ""))
             }
           ) : /* @__PURE__ */ e("div", { className: l(b, "p-1 rounded-full bg-neutral-200 dark:bg-black-600 flex items-center justify-center border w-full h-full"), children: /* @__PURE__ */ e(ie, { fill: "#98A2B3" }) }),
           q && h && /* @__PURE__ */ e(
@@ -288,7 +290,7 @@ const v = ({ label: n, content: d }) => /* @__PURE__ */ a("div", { className: "f
           {
             isOpen: Q,
             onClose: () => y(!1),
-            anchorEl: E.current,
+            anchorEl: U.current,
             className: "bg-white dark:bg-black-700 shadow rounded-lg border border-neutral-200 dark:border-black-600",
             children: D
           }

package/dist/components/user-avatar/UserAvatar.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"UserAvatar.es.js","sources":["../../../src/components/user-avatar/UserAvatar.tsx"],"sourcesContent":["import { GroupsOutlined } from '@mui/icons-material';\nimport EditOutlinedIcon from '@mui/icons-material/EditOutlined';\nimport WarningRoundedIcon from '@mui/icons-material/WarningRounded';\nimport cn from 'classnames';\nimport { type FC, useEffect, useMemo, useRef, useState } from 'react';\n\nimport { Typography } from '../data-display/typography/Typography';\nimport { Tag } from '../data-display/tag/Tag';\nimport { Skeleton } from '../data-display/skeleton/Skeleton';\nimport { getFlagComponentRectangleMd } from '../../utils/countryFlags';\nimport { UserAvatarPopper } from './UserAvatarPopper';\nimport { StatusInfoRow } from './StatusInfoRow';\nimport { sizeClasses, getInitials } from './constants';\nimport { PersonIcon } from './PersonIcon';\nimport { useDynamicPosition } from './useDynamicPosition';\n\nexport type UserAvatarSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';\n\nexport type UserDetailsTeam = {\n  id?: string;\n  name: string;\n  color?: string;\n};\n\nexport type UserDetails = {\n  email?: string;\n  username?: string;\n  teams?: UserDetailsTeam[];\n  group?: string;\n  clearanceLevel?: number | string;\n  region?: string;\n};\n\nexport type UserAvatarProps = {\n  firstName?: string;\n  lastName?: string;\n  email?: string;\n  enablePopper?: boolean;\n  profilePic?: string;\n  size?: UserAvatarSize;\n  hoverSize?: UserAvatarSize;\n  containerClassName?: string;\n  className?: string;\n  userId?: string;\n  lastViewedOn?: string;\n  isActive?: boolean;\n  statusIndicator?: boolean;\n  /** User details to display in the popper - replaces the useTeamMemberFilter hook */\n  userDetails?: UserDetails | null;\n  /** Whether user details are being fetched */\n  isFetchingUserDetails?: boolean;\n  /** Optional token for authenticated image loading */\n  authToken?: string;\n  /** Callback triggered when mouse enters the avatar */\n  onHover?: () => void;\n  /** Name of the clause / line item the user is currently editing. When set, a highlighted \"Currently editing\" card is shown in the popper. */\n  currentlyEditing?: string;\n};\n\nconst InfoRow = ({ label, content }: { label: string; content: React.ReactNode }) => (\n  <div className='flex justify-between items-center'>\n    <Typography size='small' variant='medium' className='mr-5' appearance='body'>\n      {label}\n    </Typography>\n    {content}\n  </div>\n);\n\n/**\n * UserAvatar component for displaying user profile pictures with hover popper\n *\n * @example\n * ```tsx\n * <UserAvatar\n *   firstName=\"John\"\n *   lastName=\"Doe\"\n *   email=\"john@example.com\"\n *   profilePic=\"/avatar.jpg\"\n *   userDetails={{ teams: [{ name: 'Engineering', color: '#0066cc' }], group: 'Admin' }}\n * />\n * ```\n */\nexport const UserAvatar: FC<UserAvatarProps> = ({\n  firstName,\n  lastName,\n  email,\n  profilePic,\n  size = 'md',\n  hoverSize = 'lg',\n  containerClassName = '',\n  enablePopper = true,\n  className,\n  userId,\n  lastViewedOn,\n  isActive,\n  statusIndicator = false,\n  userDetails,\n  isFetchingUserDetails = false,\n  authToken,\n  onHover,\n  currentlyEditing,\n}) => {\n  if (firstName === 'All' && lastName === 'Users') {\n    return (\n      <div className='p-1 rounded-full bg-primary-100 dark:bg-black-600 flex items-center justify-center'>\n        <GroupsOutlined sx={{ fontSize: 16 }} className='text-primary-600 dark:text-primary-600' />\n      </div>\n    );\n  }\n\n  const [visible, setVisible] = useState<boolean>(false);\n  const [imageLoaded, setImageLoaded] = useState<boolean>(false);\n\n  const avatarSizeClass = sizeClasses[size];\n\n  const {\n    triggerRef: moreTagRef,\n    dropdownRef,\n    position: dropdownPosition,\n    isVisible: showMore,\n    show: handleShowMore,\n    hide: handleHideMore,\n  } = useDynamicPosition();\n\n  const imageCacheRef = useRef<{ [key: string]: string }>({});\n\n  const isRecent = useMemo(() => {\n    if (isActive || !lastViewedOn) return false;\n    const date = new Date(lastViewedOn);\n    const now = new Date();\n    const diffInHours = (now.getTime() - date.getTime()) / (1000 * 60 * 60);\n    return diffInHours < 24;\n  }, [isActive, lastViewedOn]);\n\n  const getStatusColor = () => {\n    if (isActive) return 'bg-primary-600 dark:bg-primary-600';\n    if (isRecent) return 'bg-primary-300 dark:bg-primary-300';\n    if (lastViewedOn) return 'bg-neutral-400 dark:bg-neutral-400';\n    return null;\n  };\n\n  const statusColor = getStatusColor();\n\n  const getBorderColor = () => {\n    if (isActive) return 'border-primary-600 dark:border-primary-600';\n    if (isRecent) return 'border-primary-300 dark:border-primary-300';\n    if (lastViewedOn) return 'border-neutral-400 dark:border-neutral-400';\n    return 'border-primary-200 dark:border-neutral-800';\n  };\n\n  const borderColor = getBorderColor();\n\n  const indicatorSizes = {\n    xs: 'w-2 h-2',\n    sm: 'w-2.5 h-2.5',\n    md: 'w-3 h-3',\n    lg: 'w-3.5 h-3.5',\n    xl: 'w-4 h-4',\n  };\n\n  useEffect(() => {\n    if (profilePic) {\n      if (imageCacheRef.current[profilePic]) {\n        setImageLoaded(true);\n      } else {\n        setImageLoaded(false);\n        const img = new Image();\n        const token = authToken || (typeof localStorage !== 'undefined' ? localStorage.getItem('token') : null);\n        img.src = profilePic + (token ? '?token=' + token : '');\n        img.onload = () => {\n          imageCacheRef.current[profilePic] = img.src;\n          setImageLoaded(true);\n        };\n        img.onerror = () => {\n          setImageLoaded(false);\n        };\n      }\n    } else {\n      setImageLoaded(false);\n    }\n  }, [profilePic, authToken]);\n\n  useEffect(() => {\n    return () => {\n      if (timerRef.current) {\n        clearTimeout(timerRef.current);\n      }\n    };\n  }, []);\n\n  const cachedSrc = profilePic ? imageCacheRef.current[profilePic] : undefined;\n\n  const timerRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n  const popperRef = useRef<HTMLDivElement | null>(null);\n\n  const handleMouseEnter = () => {\n    onHover?.();\n    if (firstName && lastName && enablePopper) {\n      if (timerRef.current) {\n        clearTimeout(timerRef.current);\n      }\n      timerRef.current = setTimeout(() => {\n        setVisible(true);\n      }, 300);\n    }\n  };\n\n  const handleMouseLeave = (event: React.MouseEvent) => {\n    if (timerRef.current) {\n      clearTimeout(timerRef.current);\n    }\n    timerRef.current = setTimeout(() => {\n      if (popperRef.current && !popperRef.current.contains(event.relatedTarget as Node)) {\n        setVisible(false);\n      }\n    }, 200);\n  };\n\n  const popperContent = (\n    <div\n      ref={popperRef}\n      className='bg-white dark:bg-black-800 shadow rounded-lg border border-neutral-200 dark:border-black-700 min-w-[280px]'\n      onMouseEnter={() => {\n        if (timerRef.current) {\n          clearTimeout(timerRef.current);\n        }\n      }}\n      onMouseLeave={(event) => handleMouseLeave(event)}\n    >\n      <div className='flex flex-col gap-1 items-center p-5'>\n        <div className={cn('relative', sizeClasses[hoverSize])}>\n          {cachedSrc && imageLoaded ? (\n            <img\n              src={cachedSrc}\n              alt='Profile'\n              className={cn('rounded-full border-2 object-cover w-full h-full', borderColor)}\n              onError={() => setImageLoaded(false)}\n            />\n          ) : (\n            <div\n              className={cn(\n                'bg-primary-100 dark:bg-primary-950 text-primary-600 border-2 flex items-center justify-center rounded-full w-full h-full',\n                borderColor,\n              )}\n            >\n              {getInitials((firstName || '') + ' ' + (lastName || ''))}\n            </div>\n          )}\n\n          {statusColor && (\n            <div\n              className={cn(\n                'absolute bottom-0 right-0 rounded-full border-2 border-white dark:border-black-800',\n                indicatorSizes[hoverSize],\n                statusColor,\n              )}\n            />\n          )}\n        </div>\n        <div className='flex flex-row gap-1 items-center justify-center'>\n          <Typography size='medium' variant='semibold' className='w-full text-center'>\n            {firstName || ''} {lastName || ''}\n          </Typography>\n          {userDetails?.region && <span>{getFlagComponentRectangleMd(userDetails?.region)}</span>}\n        </div>\n\n        <Typography size='small' variant='medium' appearance='body'>\n          {email || userDetails?.email || ''}\n        </Typography>\n      </div>\n\n      {currentlyEditing ? (\n        <div className='px-5 pb-3'>\n          <div className='flex items-center gap-3 rounded-lg border border-primary-100 dark:border-primary-900 bg-[rgba(230,241,252,0.60)] dark:bg-primary-950/40 px-[13px] py-[7px]'>\n            <div className='flex items-center justify-center shrink-0 w-7 h-7 rounded-[5px] border-[0.4px] border-primary-100 dark:border-primary-900 bg-primary-50 dark:bg-primary-950'>\n              <EditOutlinedIcon sx={{ width: 13, height: 13 }} className='text-primary-600 dark:text-primary-500' />\n            </div>\n            <div className='flex flex-col min-w-0'>\n              <Typography\n                size='extra-small'\n                variant='semibold'\n                appearance='custom'\n                className='text-[10px] leading-[18px] uppercase tracking-[0.2px] text-primary-600 dark:text-primary-500'\n              >\n                Currently editing\n              </Typography>\n              <Typography size='extra-small' variant='semibold' className='truncate'>\n                {currentlyEditing}\n              </Typography>\n            </div>\n          </div>\n        </div>\n      ) : null}\n\n      {userId &&\n        (isFetchingUserDetails ? (\n          <div className='p-5'>\n            <Skeleton />\n          </div>\n        ) : userId && (userDetails?.teams || userDetails?.clearanceLevel || userDetails?.group) ? (\n          <div className='flex flex-col gap-4 bg-neutral-50 border-t border-neutral-200 dark:bg-black-700 dark:border-none p-5 rounded-b-lg'>\n            <StatusInfoRow isActive={isActive} lastViewedOn={lastViewedOn} />\n            {userDetails.username && (\n              <InfoRow\n                label='Username'\n                content={\n                  <div className='flex gap-2'>\n                    <Typography size='small' variant='medium' appearance='body'>\n                      {userDetails.username}\n                    </Typography>\n                  </div>\n                }\n              />\n            )}\n\n            {userDetails?.teams && userDetails?.teams?.length > 0 && (\n              <InfoRow\n                label='Team'\n                content={\n                  <div className='flex gap-2'>\n                    {userDetails?.teams?.length > 0 && (\n                      <Tag\n                        key={userDetails?.teams[0]?.id}\n                        label={userDetails?.teams[0]?.name}\n                        color={userDetails?.teams[0]?.color || '#e38715'}\n                        size='md'\n                        isHashColor\n                      />\n                    )}\n                    {userDetails?.teams?.length >= 2 && (\n                      <div\n                        ref={moreTagRef}\n                        className='relative cursor-pointer'\n                        onMouseEnter={handleShowMore}\n                        onMouseLeave={handleHideMore}\n                        onClick={(e) => e.stopPropagation()}\n                      >\n                        <Tag key={1} label={`+ ${userDetails?.teams?.length - 1} More`} color='#004f08' size='md' isHashColor />\n\n                        {showMore && (\n                          <div\n                            ref={dropdownRef}\n                            className={cn(\n                              'absolute w-max bg-white dark:text-black-200 dark:bg-black-800 shadow-md border border-neutral-200 dark:border-black-800 rounded-md px-2 z-10 overflow-y-auto max-h-60',\n                              {\n                                'top-full': dropdownPosition.vertical === 'bottom',\n                                'bottom-full': dropdownPosition.vertical === 'top',\n                                'left-0': dropdownPosition.horizontal === 'left',\n                                'right-0': dropdownPosition.horizontal === 'right',\n                              },\n                            )}\n                            onMouseEnter={handleShowMore}\n                            onMouseLeave={handleHideMore}\n                          >\n                            {userDetails?.teams?.slice(1)?.map((team, index) => (\n                              <div key={team?.id || index} className='my-2'>\n                                <Tag key={team?.id} label={team?.name} color={team?.color || '#4A5568'} size='md' isHashColor className='w-fit' />\n                              </div>\n                            ))}\n                          </div>\n                        )}\n                      </div>\n                    )}\n                  </div>\n                }\n              />\n            )}\n\n            {userDetails?.group && (\n              <InfoRow\n                label='Role'\n                content={<Tag key={userDetails?.group} label={userDetails?.group} color='#004094' size='md' isHashColor />}\n              />\n            )}\n\n            {userDetails?.clearanceLevel && (\n              <InfoRow\n                label='Clearance Level'\n                content={\n                  <Tag\n                    key={String(userDetails?.clearanceLevel)}\n                    label={`Level ${userDetails?.clearanceLevel}`}\n                    color='#b30000'\n                    size='md'\n                    isHashColor\n                  />\n                }\n              />\n            )}\n          </div>\n        ) : (\n          <div className='flex items-center justify-center bg-neutral-50 dark:bg-black-700 border-t border-neutral-200 dark:border-black-700 p-5 rounded-b-lg'>\n            <Typography className='flex items-center justify-center gap-1' size='extra-small' variant='medium' appearance='body'>\n              <WarningRoundedIcon\n                sx={{\n                  height: '16px',\n                  width: '16px',\n                  color: '#F04438',\n                }}\n              />\n              No other information found!\n            </Typography>\n          </div>\n        ))}\n    </div>\n  );\n  const containerRef = useRef<HTMLDivElement>(null);\n  return (\n    <div\n      onMouseEnter={handleMouseEnter}\n      onMouseLeave={handleMouseLeave}\n      className={cn('inline-block relative cursor-pointer', className)}\n      ref={containerRef}\n    >\n      <div className={cn('relative', containerClassName || avatarSizeClass)}>\n        {cachedSrc && imageLoaded ? (\n          <img\n            src={cachedSrc}\n            alt='Profile'\n            className={cn('rounded-full border object-cover w-full h-full', borderColor)}\n            onError={() => setImageLoaded(false)}\n          />\n        ) : firstName && lastName ? (\n          <div\n            className={cn(\n              'bg-primary-100 text-primary-600 flex items-center justify-center rounded-full border dark:bg-black-700 w-full h-full',\n              borderColor,\n            )}\n          >\n            {getInitials((firstName || '') + ' ' + (lastName || ''))}\n          </div>\n        ) : (\n          <div className={cn(borderColor, 'p-1 rounded-full bg-neutral-200 dark:bg-black-600 flex items-center justify-center border w-full h-full')}>\n            <PersonIcon fill='#98A2B3' />\n          </div>\n        )}\n\n        {statusIndicator && statusColor && (\n          <div\n            className={cn(\n              'absolute bottom-0 right-0 rounded-full border border-white dark:border-black-800 w-2 h-2',\n\n              statusColor,\n            )}\n          />\n        )}\n      </div>\n      <UserAvatarPopper\n        isOpen={visible}\n        onClose={() => setVisible(false)}\n        anchorEl={containerRef.current}\n        className='bg-white dark:bg-black-700 shadow rounded-lg border border-neutral-200 dark:border-black-600'\n      >\n        {popperContent}\n      </UserAvatarPopper>\n    </div>\n  );\n};\n\nUserAvatar.displayName = 'UserAvatar';\n\n"],"names":["InfoRow","label","content","jsxs","jsx","Typography","UserAvatar","firstName","lastName","email","profilePic","size","hoverSize","containerClassName","enablePopper","className","userId","lastViewedOn","isActive","statusIndicator","userDetails","isFetchingUserDetails","authToken","onHover","currentlyEditing","GroupsOutlined","visible","setVisible","useState","imageLoaded","setImageLoaded","avatarSizeClass","sizeClasses","moreTagRef","dropdownRef","dropdownPosition","showMore","handleShowMore","handleHideMore","useDynamicPosition","imageCacheRef","useRef","isRecent","useMemo","date","statusColor","borderColor","indicatorSizes","useEffect","img","token","timerRef","cachedSrc","popperRef","handleMouseEnter","handleMouseLeave","event","popperContent","cn","getInitials","getFlagComponentRectangleMd","EditOutlinedIcon","Skeleton","StatusInfoRow","Tag","e","team","index","WarningRoundedIcon","containerRef","PersonIcon","UserAvatarPopper"],"mappings":"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"}
+{"version":3,"file":"UserAvatar.es.js","sources":["../../../src/components/user-avatar/UserAvatar.tsx"],"sourcesContent":["import { GroupsOutlined } from '@mui/icons-material';\nimport EditOutlinedIcon from '@mui/icons-material/EditOutlined';\nimport WarningRoundedIcon from '@mui/icons-material/WarningRounded';\nimport cn from 'classnames';\nimport { type FC, useEffect, useMemo, useRef, useState } from 'react';\n\nimport { Typography } from '../data-display/typography/Typography';\nimport { Tag } from '../data-display/tag/Tag';\nimport { Skeleton } from '../data-display/skeleton/Skeleton';\nimport { getFlagComponentRectangleMd } from '../../utils/countryFlags';\nimport { UserAvatarPopper } from './UserAvatarPopper';\nimport { StatusInfoRow } from './StatusInfoRow';\nimport { sizeClasses, getInitials } from './constants';\nimport { PersonIcon } from './PersonIcon';\nimport { useDynamicPosition } from './useDynamicPosition';\n\nexport type UserAvatarSize = '2xs' | 'xs' | 'sm' | 'md' | 'lg' | 'xl';\n\nexport type UserDetailsTeam = {\n  id?: string;\n  name: string;\n  color?: string;\n};\n\nexport type UserDetails = {\n  email?: string;\n  username?: string;\n  teams?: UserDetailsTeam[];\n  group?: string;\n  clearanceLevel?: number | string;\n  region?: string;\n};\n\nexport type UserAvatarProps = {\n  firstName?: string;\n  lastName?: string;\n  email?: string;\n  enablePopper?: boolean;\n  profilePic?: string;\n  size?: UserAvatarSize;\n  hoverSize?: UserAvatarSize;\n  containerClassName?: string;\n  className?: string;\n  userId?: string;\n  lastViewedOn?: string;\n  isActive?: boolean;\n  statusIndicator?: boolean;\n  /** User details to display in the popper - replaces the useTeamMemberFilter hook */\n  userDetails?: UserDetails | null;\n  /** Whether user details are being fetched */\n  isFetchingUserDetails?: boolean;\n  /** Optional token for authenticated image loading */\n  authToken?: string;\n  /** Callback triggered when mouse enters the avatar */\n  onHover?: () => void;\n  /** Name of the clause / line item the user is currently editing. When set, a highlighted \"Currently editing\" card is shown in the popper. */\n  currentlyEditing?: string;\n};\n\nconst InfoRow = ({ label, content }: { label: string; content: React.ReactNode }) => (\n  <div className='flex justify-between items-center'>\n    <Typography size='small' variant='medium' className='mr-5' appearance='body'>\n      {label}\n    </Typography>\n    {content}\n  </div>\n);\n\n/**\n * UserAvatar component for displaying user profile pictures with hover popper\n *\n * @example\n * ```tsx\n * <UserAvatar\n *   firstName=\"John\"\n *   lastName=\"Doe\"\n *   email=\"john@example.com\"\n *   profilePic=\"/avatar.jpg\"\n *   userDetails={{ teams: [{ name: 'Engineering', color: '#0066cc' }], group: 'Admin' }}\n * />\n * ```\n */\nexport const UserAvatar: FC<UserAvatarProps> = ({\n  firstName,\n  lastName,\n  email,\n  profilePic,\n  size = 'md',\n  hoverSize = 'lg',\n  containerClassName = '',\n  enablePopper = true,\n  className,\n  userId,\n  lastViewedOn,\n  isActive,\n  statusIndicator = false,\n  userDetails,\n  isFetchingUserDetails = false,\n  authToken,\n  onHover,\n  currentlyEditing,\n}) => {\n  if (firstName === 'All' && lastName === 'Users') {\n    return (\n      <div className='p-1 rounded-full bg-primary-100 dark:bg-black-600 flex items-center justify-center'>\n        <GroupsOutlined sx={{ fontSize: 16 }} className='text-primary-600 dark:text-primary-600' />\n      </div>\n    );\n  }\n\n  const [visible, setVisible] = useState<boolean>(false);\n  const [imageLoaded, setImageLoaded] = useState<boolean>(false);\n\n  const avatarSizeClass = sizeClasses[size];\n\n  const {\n    triggerRef: moreTagRef,\n    dropdownRef,\n    position: dropdownPosition,\n    isVisible: showMore,\n    show: handleShowMore,\n    hide: handleHideMore,\n  } = useDynamicPosition();\n\n  const imageCacheRef = useRef<{ [key: string]: string }>({});\n\n  const isRecent = useMemo(() => {\n    if (isActive || !lastViewedOn) return false;\n    const date = new Date(lastViewedOn);\n    const now = new Date();\n    const diffInHours = (now.getTime() - date.getTime()) / (1000 * 60 * 60);\n    return diffInHours < 24;\n  }, [isActive, lastViewedOn]);\n\n  const getStatusColor = () => {\n    if (isActive) return 'bg-primary-600 dark:bg-primary-600';\n    if (isRecent) return 'bg-primary-300 dark:bg-primary-300';\n    if (lastViewedOn) return 'bg-neutral-400 dark:bg-neutral-400';\n    return null;\n  };\n\n  const statusColor = getStatusColor();\n\n  const getBorderColor = () => {\n    if (isActive) return 'border-primary-600 dark:border-primary-600';\n    if (isRecent) return 'border-primary-300 dark:border-primary-300';\n    if (lastViewedOn) return 'border-neutral-400 dark:border-neutral-400';\n    return 'border-primary-200 dark:border-neutral-800';\n  };\n\n  const borderColor = getBorderColor();\n\n  const indicatorSizes = {\n    '2xs': 'w-1.5 h-1.5',\n    xs: 'w-2 h-2',\n    sm: 'w-2.5 h-2.5',\n    md: 'w-3 h-3',\n    lg: 'w-3.5 h-3.5',\n    xl: 'w-4 h-4',\n  };\n\n  useEffect(() => {\n    if (profilePic) {\n      if (imageCacheRef.current[profilePic]) {\n        setImageLoaded(true);\n      } else {\n        setImageLoaded(false);\n        const img = new Image();\n        const token = authToken || (typeof localStorage !== 'undefined' ? localStorage.getItem('token') : null);\n        img.src = profilePic + (token ? '?token=' + token : '');\n        img.onload = () => {\n          imageCacheRef.current[profilePic] = img.src;\n          setImageLoaded(true);\n        };\n        img.onerror = () => {\n          setImageLoaded(false);\n        };\n      }\n    } else {\n      setImageLoaded(false);\n    }\n  }, [profilePic, authToken]);\n\n  useEffect(() => {\n    return () => {\n      if (timerRef.current) {\n        clearTimeout(timerRef.current);\n      }\n    };\n  }, []);\n\n  const cachedSrc = profilePic ? imageCacheRef.current[profilePic] : undefined;\n\n  const timerRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n  const popperRef = useRef<HTMLDivElement | null>(null);\n\n  const handleMouseEnter = () => {\n    onHover?.();\n    if (firstName && lastName && enablePopper) {\n      if (timerRef.current) {\n        clearTimeout(timerRef.current);\n      }\n      timerRef.current = setTimeout(() => {\n        setVisible(true);\n      }, 300);\n    }\n  };\n\n  const handleMouseLeave = (event: React.MouseEvent) => {\n    if (timerRef.current) {\n      clearTimeout(timerRef.current);\n    }\n    timerRef.current = setTimeout(() => {\n      if (popperRef.current && !popperRef.current.contains(event.relatedTarget as Node)) {\n        setVisible(false);\n      }\n    }, 200);\n  };\n\n  const popperContent = (\n    <div\n      ref={popperRef}\n      className='bg-white dark:bg-black-800 shadow rounded-lg border border-neutral-200 dark:border-black-700 min-w-[280px]'\n      onMouseEnter={() => {\n        if (timerRef.current) {\n          clearTimeout(timerRef.current);\n        }\n      }}\n      onMouseLeave={(event) => handleMouseLeave(event)}\n    >\n      <div className='flex flex-col gap-1 items-center p-5'>\n        <div className={cn('relative', sizeClasses[hoverSize])}>\n          {cachedSrc && imageLoaded ? (\n            <img\n              src={cachedSrc}\n              alt='Profile'\n              className={cn('rounded-full border-2 object-cover w-full h-full', borderColor)}\n              onError={() => setImageLoaded(false)}\n            />\n          ) : (\n            <div\n              className={cn(\n                'bg-primary-100 dark:bg-primary-950 text-primary-600 border-2 flex items-center justify-center rounded-full w-full h-full',\n                borderColor,\n              )}\n            >\n              {getInitials((firstName || '') + ' ' + (lastName || ''))}\n            </div>\n          )}\n\n          {statusColor && (\n            <div\n              className={cn(\n                'absolute bottom-0 right-0 rounded-full border-2 border-white dark:border-black-800',\n                indicatorSizes[hoverSize],\n                statusColor,\n              )}\n            />\n          )}\n        </div>\n        <div className='flex flex-row gap-1 items-center justify-center'>\n          <Typography size='medium' variant='semibold' className='w-full text-center'>\n            {firstName || ''} {lastName || ''}\n          </Typography>\n          {userDetails?.region && <span>{getFlagComponentRectangleMd(userDetails?.region)}</span>}\n        </div>\n\n        <Typography size='small' variant='medium' appearance='body'>\n          {email || userDetails?.email || ''}\n        </Typography>\n      </div>\n\n      {currentlyEditing ? (\n        <div className='px-5 pb-3'>\n          <div className='flex items-center gap-3 rounded-lg border border-primary-100 dark:border-primary-900 bg-[rgba(230,241,252,0.60)] dark:bg-primary-950/40 px-[13px] py-[7px]'>\n            <div className='flex items-center justify-center shrink-0 w-7 h-7 rounded-[5px] border-[0.4px] border-primary-100 dark:border-primary-900 bg-primary-50 dark:bg-primary-950'>\n              <EditOutlinedIcon sx={{ width: 13, height: 13 }} className='text-primary-600 dark:text-primary-500' />\n            </div>\n            <div className='flex flex-col min-w-0'>\n              <Typography\n                size='extra-small'\n                variant='semibold'\n                appearance='custom'\n                className='text-2xs leading-4 uppercase tracking-[0.2px] text-primary-600 dark:text-primary-500'\n              >\n                Currently editing\n              </Typography>\n              <Typography size='extra-small' variant='semibold' className='truncate'>\n                {currentlyEditing}\n              </Typography>\n            </div>\n          </div>\n        </div>\n      ) : null}\n\n      {userId &&\n        (isFetchingUserDetails ? (\n          <div className='p-5'>\n            <Skeleton />\n          </div>\n        ) : userId && (userDetails?.teams || userDetails?.clearanceLevel || userDetails?.group) ? (\n          <div className='flex flex-col gap-4 bg-neutral-50 border-t border-neutral-200 dark:bg-black-700 dark:border-none p-5 rounded-b-lg'>\n            <StatusInfoRow isActive={isActive} lastViewedOn={lastViewedOn} />\n            {userDetails.username && (\n              <InfoRow\n                label='Username'\n                content={\n                  <div className='flex gap-2'>\n                    <Typography size='small' variant='medium' appearance='body'>\n                      {userDetails.username}\n                    </Typography>\n                  </div>\n                }\n              />\n            )}\n\n            {userDetails?.teams && userDetails?.teams?.length > 0 && (\n              <InfoRow\n                label='Team'\n                content={\n                  <div className='flex gap-2'>\n                    {userDetails?.teams?.length > 0 && (\n                      <Tag\n                        key={userDetails?.teams[0]?.id}\n                        label={userDetails?.teams[0]?.name}\n                        color={userDetails?.teams[0]?.color || '#e38715'}\n                        size='md'\n                        isHashColor\n                      />\n                    )}\n                    {userDetails?.teams?.length >= 2 && (\n                      <div\n                        ref={moreTagRef}\n                        className='relative cursor-pointer'\n                        onMouseEnter={handleShowMore}\n                        onMouseLeave={handleHideMore}\n                        onClick={(e) => e.stopPropagation()}\n                      >\n                        <Tag key={1} label={`+ ${userDetails?.teams?.length - 1} More`} color='#004f08' size='md' isHashColor />\n\n                        {showMore && (\n                          <div\n                            ref={dropdownRef}\n                            className={cn(\n                              'absolute w-max bg-white dark:text-black-200 dark:bg-black-800 shadow-md border border-neutral-200 dark:border-black-800 rounded-md px-2 z-10 overflow-y-auto max-h-60',\n                              {\n                                'top-full': dropdownPosition.vertical === 'bottom',\n                                'bottom-full': dropdownPosition.vertical === 'top',\n                                'left-0': dropdownPosition.horizontal === 'left',\n                                'right-0': dropdownPosition.horizontal === 'right',\n                              },\n                            )}\n                            onMouseEnter={handleShowMore}\n                            onMouseLeave={handleHideMore}\n                          >\n                            {userDetails?.teams?.slice(1)?.map((team, index) => (\n                              <div key={team?.id || index} className='my-2'>\n                                <Tag key={team?.id} label={team?.name} color={team?.color || '#4A5568'} size='md' isHashColor className='w-fit' />\n                              </div>\n                            ))}\n                          </div>\n                        )}\n                      </div>\n                    )}\n                  </div>\n                }\n              />\n            )}\n\n            {userDetails?.group && (\n              <InfoRow\n                label='Role'\n                content={<Tag key={userDetails?.group} label={userDetails?.group} color='#004094' size='md' isHashColor />}\n              />\n            )}\n\n            {userDetails?.clearanceLevel && (\n              <InfoRow\n                label='Clearance Level'\n                content={\n                  <Tag\n                    key={String(userDetails?.clearanceLevel)}\n                    label={`Level ${userDetails?.clearanceLevel}`}\n                    color='#b30000'\n                    size='md'\n                    isHashColor\n                  />\n                }\n              />\n            )}\n          </div>\n        ) : (\n          <div className='flex items-center justify-center bg-neutral-50 dark:bg-black-700 border-t border-neutral-200 dark:border-black-700 p-5 rounded-b-lg'>\n            <Typography className='flex items-center justify-center gap-1' size='extra-small' variant='medium' appearance='body'>\n              <WarningRoundedIcon\n                sx={{\n                  height: '16px',\n                  width: '16px',\n                  color: '#F04438',\n                }}\n              />\n              No other information found!\n            </Typography>\n          </div>\n        ))}\n    </div>\n  );\n  const containerRef = useRef<HTMLDivElement>(null);\n  return (\n    <div\n      onMouseEnter={handleMouseEnter}\n      onMouseLeave={handleMouseLeave}\n      className={cn('inline-block relative cursor-pointer', className)}\n      ref={containerRef}\n    >\n      <div className={cn('relative', containerClassName || avatarSizeClass)}>\n        {cachedSrc && imageLoaded ? (\n          <img\n            src={cachedSrc}\n            alt='Profile'\n            className={cn('rounded-full border object-cover w-full h-full', borderColor)}\n            onError={() => setImageLoaded(false)}\n          />\n        ) : firstName && lastName ? (\n          <div\n            className={cn(\n              'bg-primary-100 text-primary-600 flex items-center justify-center rounded-full border dark:bg-black-700', \n              sizeClasses[size],\n              borderColor,\n            )}\n          >\n            {getInitials((firstName || '') + ' ' + (lastName || ''))}\n          </div>\n        ) : (\n          <div className={cn(borderColor, 'p-1 rounded-full bg-neutral-200 dark:bg-black-600 flex items-center justify-center border w-full h-full')}>\n            <PersonIcon fill='#98A2B3' />\n          </div>\n        )}\n\n        {statusIndicator && statusColor && (\n          <div\n            className={cn(\n              'absolute bottom-0 right-0 rounded-full border border-white dark:border-black-800 w-2 h-2',\n\n              statusColor,\n            )}\n          />\n        )}\n      </div>\n      <UserAvatarPopper\n        isOpen={visible}\n        onClose={() => setVisible(false)}\n        anchorEl={containerRef.current}\n        className='bg-white dark:bg-black-700 shadow rounded-lg border border-neutral-200 dark:border-black-600'\n      >\n        {popperContent}\n      </UserAvatarPopper>\n    </div>\n  );\n};\n\nUserAvatar.displayName = 'UserAvatar';\n\n"],"names":["InfoRow","label","content","jsxs","jsx","Typography","UserAvatar","firstName","lastName","email","profilePic","size","hoverSize","containerClassName","enablePopper","className","userId","lastViewedOn","isActive","statusIndicator","userDetails","isFetchingUserDetails","authToken","onHover","currentlyEditing","GroupsOutlined","visible","setVisible","useState","imageLoaded","setImageLoaded","avatarSizeClass","sizeClasses","moreTagRef","dropdownRef","dropdownPosition","showMore","handleShowMore","handleHideMore","useDynamicPosition","imageCacheRef","useRef","isRecent","useMemo","date","statusColor","borderColor","indicatorSizes","useEffect","img","token","timerRef","cachedSrc","popperRef","handleMouseEnter","handleMouseLeave","event","popperContent","cn","getInitials","getFlagComponentRectangleMd","EditOutlinedIcon","Skeleton","StatusInfoRow","Tag","e","team","index","WarningRoundedIcon","containerRef","PersonIcon","UserAvatarPopper"],"mappings":"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"}

package/dist/components/user-avatar/constants.cjs.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s={xs:"w-4 h-4 text-[7px] font-bold",sm:"w-6 h-6 text-[10px] font-bold",md:"w-9 h-9 text-[14px] font-semibold",lg:"w-12 h-12 text-[18px] font-semibold",xl:"w-16 h-16 text-[24px] font-semibold"},o=e=>{if(!e)return"";const t=e?.split(" ");return t?.length===1?t[0]?.charAt(0)?.toUpperCase():t[0]?.charAt(0)?.toUpperCase()+t[t?.length-1]?.charAt(0)?.toUpperCase()};exports.getInitials=o;exports.sizeClasses=s;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s={"2xs":"w-3 h-3 text-4xs font-bold",xs:"w-4 h-4 text-3xs font-bold",sm:"w-6 h-6 text-xs font-bold",md:"w-9 h-9 text-md font-semibold",lg:"w-12 h-12 text-xl font-semibold",xl:"w-16 h-16 text-3xl font-semibold"},o=e=>{if(!e)return"";const t=e?.split(" ");return t?.length===1?t[0]?.charAt(0)?.toUpperCase():t[0]?.charAt(0)?.toUpperCase()+t[t?.length-1]?.charAt(0)?.toUpperCase()};exports.getInitials=o;exports.sizeClasses=s;
 //# sourceMappingURL=constants.cjs.js.map

package/dist/components/user-avatar/constants.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"constants.cjs.js","sources":["../../../src/components/user-avatar/constants.ts"],"sourcesContent":["export const sizeClasses = {\n  xs: 'w-4 h-4 text-[7px] font-bold',\n  sm: 'w-6 h-6 text-[10px] font-bold',\n  md: 'w-9 h-9 text-[14px] font-semibold',\n  lg: 'w-12 h-12 text-[18px] font-semibold',\n  xl: 'w-16 h-16 text-[24px] font-semibold',\n};\n\nexport const getInitials = (name: string) => {\n  if (!name) return '';\n  const nameArray = name?.split(' ');\n  const initials =\n    nameArray?.length === 1\n      ? nameArray[0]?.charAt(0)?.toUpperCase()\n      : nameArray[0]?.charAt(0)?.toUpperCase() +\n        nameArray[nameArray?.length - 1]?.charAt(0)?.toUpperCase();\n  return initials;\n};\n\n\n\n"],"names":["sizeClasses","getInitials","name","nameArray"],"mappings":"gFAAO,MAAMA,EAAc,CACzB,GAAI,+BACJ,GAAI,gCACJ,GAAI,oCACJ,GAAI,sCACJ,GAAI,qCACN,EAEaC,EAAeC,GAAiB,CAC3C,GAAI,CAACA,EAAM,MAAO,GAClB,MAAMC,EAAYD,GAAM,MAAM,GAAG,EAMjC,OAJEC,GAAW,SAAW,EAClBA,EAAU,CAAC,GAAG,OAAO,CAAC,GAAG,YAAA,EACzBA,EAAU,CAAC,GAAG,OAAO,CAAC,GAAG,YAAA,EACzBA,EAAUA,GAAW,OAAS,CAAC,GAAG,OAAO,CAAC,GAAG,YAAA,CAErD"}
+{"version":3,"file":"constants.cjs.js","sources":["../../../src/components/user-avatar/constants.ts"],"sourcesContent":["export const sizeClasses = {\n  '2xs': 'w-3 h-3 text-4xs font-bold',\n  xs: 'w-4 h-4 text-3xs font-bold',\n  sm: 'w-6 h-6 text-xs font-bold',\n  md: 'w-9 h-9 text-md font-semibold',\n  lg: 'w-12 h-12 text-xl font-semibold',\n  xl: 'w-16 h-16 text-3xl font-semibold',\n};\n\nexport const getInitials = (name: string) => {\n  if (!name) return '';\n  const nameArray = name?.split(' ');\n  const initials =\n    nameArray?.length === 1\n      ? nameArray[0]?.charAt(0)?.toUpperCase()\n      : nameArray[0]?.charAt(0)?.toUpperCase() +\n        nameArray[nameArray?.length - 1]?.charAt(0)?.toUpperCase();\n  return initials;\n};\n\n\n\n"],"names":["sizeClasses","getInitials","name","nameArray"],"mappings":"gFAAO,MAAMA,EAAc,CACzB,MAAO,6BACP,GAAI,6BACJ,GAAI,4BACJ,GAAI,gCACJ,GAAI,kCACJ,GAAI,kCACN,EAEaC,EAAeC,GAAiB,CAC3C,GAAI,CAACA,EAAM,MAAO,GAClB,MAAMC,EAAYD,GAAM,MAAM,GAAG,EAMjC,OAJEC,GAAW,SAAW,EAClBA,EAAU,CAAC,GAAG,OAAO,CAAC,GAAG,YAAA,EACzBA,EAAU,CAAC,GAAG,OAAO,CAAC,GAAG,YAAA,EACzBA,EAAUA,GAAW,OAAS,CAAC,GAAG,OAAO,CAAC,GAAG,YAAA,CAErD"}

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

@@ -1,4 +1,5 @@
 export declare const sizeClasses: {
+    '2xs': string;
     xs: string;
     sm: string;
     md: string;

package/dist/components/user-avatar/constants.es.js

@@ -1,16 +1,17 @@
 const o = {
-  xs: "w-4 h-4 text-[7px] font-bold",
-  sm: "w-6 h-6 text-[10px] font-bold",
-  md: "w-9 h-9 text-[14px] font-semibold",
-  lg: "w-12 h-12 text-[18px] font-semibold",
-  xl: "w-16 h-16 text-[24px] font-semibold"
-}, n = (e) => {
-  if (!e) return "";
-  const t = e?.split(" ");
+  "2xs": "w-3 h-3 text-4xs font-bold",
+  xs: "w-4 h-4 text-3xs font-bold",
+  sm: "w-6 h-6 text-xs font-bold",
+  md: "w-9 h-9 text-md font-semibold",
+  lg: "w-12 h-12 text-xl font-semibold",
+  xl: "w-16 h-16 text-3xl font-semibold"
+}, l = (s) => {
+  if (!s) return "";
+  const t = s?.split(" ");
   return t?.length === 1 ? t[0]?.charAt(0)?.toUpperCase() : t[0]?.charAt(0)?.toUpperCase() + t[t?.length - 1]?.charAt(0)?.toUpperCase();
 };
 export {
-  n as getInitials,
+  l as getInitials,
   o as sizeClasses
 };
 //# sourceMappingURL=constants.es.js.map

package/dist/components/user-avatar/constants.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"constants.es.js","sources":["../../../src/components/user-avatar/constants.ts"],"sourcesContent":["export const sizeClasses = {\n  xs: 'w-4 h-4 text-[7px] font-bold',\n  sm: 'w-6 h-6 text-[10px] font-bold',\n  md: 'w-9 h-9 text-[14px] font-semibold',\n  lg: 'w-12 h-12 text-[18px] font-semibold',\n  xl: 'w-16 h-16 text-[24px] font-semibold',\n};\n\nexport const getInitials = (name: string) => {\n  if (!name) return '';\n  const nameArray = name?.split(' ');\n  const initials =\n    nameArray?.length === 1\n      ? nameArray[0]?.charAt(0)?.toUpperCase()\n      : nameArray[0]?.charAt(0)?.toUpperCase() +\n        nameArray[nameArray?.length - 1]?.charAt(0)?.toUpperCase();\n  return initials;\n};\n\n\n\n"],"names":["sizeClasses","getInitials","name","nameArray"],"mappings":"AAAO,MAAMA,IAAc;AAAA,EACzB,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN,GAEaC,IAAc,CAACC,MAAiB;AAC3C,MAAI,CAACA,EAAM,QAAO;AAClB,QAAMC,IAAYD,GAAM,MAAM,GAAG;AAMjC,SAJEC,GAAW,WAAW,IAClBA,EAAU,CAAC,GAAG,OAAO,CAAC,GAAG,YAAA,IACzBA,EAAU,CAAC,GAAG,OAAO,CAAC,GAAG,YAAA,IACzBA,EAAUA,GAAW,SAAS,CAAC,GAAG,OAAO,CAAC,GAAG,YAAA;AAErD;"}
+{"version":3,"file":"constants.es.js","sources":["../../../src/components/user-avatar/constants.ts"],"sourcesContent":["export const sizeClasses = {\n  '2xs': 'w-3 h-3 text-4xs font-bold',\n  xs: 'w-4 h-4 text-3xs font-bold',\n  sm: 'w-6 h-6 text-xs font-bold',\n  md: 'w-9 h-9 text-md font-semibold',\n  lg: 'w-12 h-12 text-xl font-semibold',\n  xl: 'w-16 h-16 text-3xl font-semibold',\n};\n\nexport const getInitials = (name: string) => {\n  if (!name) return '';\n  const nameArray = name?.split(' ');\n  const initials =\n    nameArray?.length === 1\n      ? nameArray[0]?.charAt(0)?.toUpperCase()\n      : nameArray[0]?.charAt(0)?.toUpperCase() +\n        nameArray[nameArray?.length - 1]?.charAt(0)?.toUpperCase();\n  return initials;\n};\n\n\n\n"],"names":["sizeClasses","getInitials","name","nameArray"],"mappings":"AAAO,MAAMA,IAAc;AAAA,EACzB,OAAO;AAAA,EACP,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN,GAEaC,IAAc,CAACC,MAAiB;AAC3C,MAAI,CAACA,EAAM,QAAO;AAClB,QAAMC,IAAYD,GAAM,MAAM,GAAG;AAMjC,SAJEC,GAAW,WAAW,IAClBA,EAAU,CAAC,GAAG,OAAO,CAAC,GAAG,YAAA,IACzBA,EAAU,CAAC,GAAG,OAAO,CAAC,GAAG,YAAA,IACzBA,EAAUA,GAAW,SAAS,CAAC,GAAG,OAAO,CAAC,GAAG,YAAA;AAErD;"}

package/dist/design-system.css

@@ -1 +1 @@
-:root{--lax-form-focus-border: var(--color-primary-600);--lax-form-focus-shadow: 0 0 0 3px var(--color-primary-100)}.dark{--lax-form-focus-border: var(--color-primary-400);--lax-form-focus-shadow: 0 0 0 3px var(--color-primary-950)}input:where([type=text],[type=email],[type=password],[type=number],[type=search],[type=date],[type=time],[type=datetime-local],[type=url],[type=tel],[type=color]):focus,textarea:focus,select:focus,[contenteditable=true]:focus{outline:none!important;border-color:var(--lax-form-focus-border)!important;box-shadow:var(--lax-form-focus-shadow)!important}.ant-select-focused .ant-select-selector,.ant-picker-focused,.ant-input-affix-wrapper-focused,.ant-input-affix-wrapper:focus-within,.ant-input-number-focused,.ant-input-number:focus-within,.ant-input:focus{outline:none!important;border-color:var(--lax-form-focus-border)!important;box-shadow:var(--lax-form-focus-shadow)!important}.ant-checkbox-input:focus-visible+.ant-checkbox-inner{border-color:var(--lax-form-focus-border)!important;box-shadow:var(--lax-form-focus-shadow)!important}.lax-select__control--is-focused{border-color:var(--lax-form-focus-border)!important;box-shadow:var(--lax-form-focus-shadow)!important}.peer:focus-visible+.lax-toggle-track{border-color:var(--lax-form-focus-border)!important;box-shadow:var(--lax-form-focus-shadow)!important}.lax-form-trigger:focus-visible{outline:none!important;border-color:var(--lax-form-focus-border)!important;box-shadow:var(--lax-form-focus-shadow)!important}.lax-tooltip-body-important-whitespace{white-space:var(--lax-tooltip-white-space, initial)!important;overflow-wrap:break-word!important}.ant-select-selector{padding-left:6px!important}.select-field-emphasis-modified.ant-select .ant-select-selector{background-color:var(--Warning-50, #FFFAEB)!important;border-color:var(--Warning-200, #FEDF89)!important}.select-field-emphasis-modified.ant-select.ant-select-disabled .ant-select-selector{opacity:1!important;background-color:var(--Warning-50, #FFFAEB)!important;border-color:var(--Warning-200, #FEDF89)!important}.select-field-emphasis-deleted.ant-select .ant-select-selector{background-color:var(--Error-50, #FEF2F2)!important;border-color:var(--Error-200, #FECACA)!important}.select-field-emphasis-deleted.ant-select .ant-select-selector .ant-select-selection-item,.select-field-emphasis-deleted.ant-select .ant-select-selector .ant-select-selection-placeholder{color:#475467!important}.select-field-emphasis-deleted.ant-select.ant-select-disabled .ant-select-selector{opacity:1!important;background-color:var(--Error-50, #FEF2F2)!important;border-color:var(--Error-200, #FECACA)!important}.select-field-emphasis-success.ant-select .ant-select-selector{background-color:var(--Success-50, #F0FDF4)!important;border-color:var(--Success-200, #BBF7D0)!important}.select-field-emphasis-success.ant-select .ant-select-selector .ant-select-selection-item{color:#101828!important}.select-field-emphasis-success.ant-select.ant-select-disabled .ant-select-selector{opacity:1!important;background-color:var(--Success-50, #F0FDF4)!important;border-color:var(--Success-200, #BBF7D0)!important}.lax-popper-overlay.ant-popover{z-index:9999}.lax-popper-overlay .ant-popover-inner{background-color:#fff;border:1px solid #EAECF0;border-radius:8px;box-shadow:0 10px 30px #9e9e9e4d}.lax-popper-overlay .ant-popover-arrow:before{background-color:#fff;border:1px solid #EAECF0}.dark .lax-popper-overlay .ant-popover-inner{background-color:#1d2939;border-color:#344054;box-shadow:0 10px 30px #10101080}.dark .lax-popper-overlay .ant-popover-arrow:before{background-color:#1d2939;border-color:#344054}.Toastify__toast-container{z-index:100000}.Toastify__toast{min-height:64px;border-radius:4px;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f}.Toastify__toast--success,.Toastify__toast--error,.Toastify__toast--warning,.Toastify__toast--info{background:transparent}.Toastify__toast-body{padding:0;margin:0;color:inherit;font-size:14px;font-weight:500;line-height:1.5}.Toastify__close-button{color:inherit;opacity:.7;align-self:flex-start;background:transparent;border:none;padding:4px;margin:0;transition:opacity .2s ease}.Toastify__close-button:hover{opacity:1}.Toastify__progress-bar{background:linear-gradient(to right,#4caf50,#8bc34a,#cddc39,#ffeb3b,#ffc107,#ff9800,#ff5722)}.Toastify__progress-bar--success{background:#12b76a}.Toastify__progress-bar--error{background:#f04438}.Toastify__progress-bar--warning{background:#f79009}.Toastify__progress-bar--info{background:#016dcf}@media (prefers-color-scheme: dark){.Toastify__toast-container{background:transparent}.Toastify__toast{box-shadow:0 4px 6px -1px #0000004d,0 2px 4px -1px #0003}}@media screen and (max-width: 640px){.Toastify__toast-container{left:1rem;right:1rem;bottom:1rem;width:auto}.Toastify__toast{margin-bottom:.5rem}}.Toastify__slide-enter--bottom-right,.Toastify__slide-enter--bottom-left,.Toastify__slide-enter--bottom-center{animation-duration:.3s;animation-timing-function:cubic-bezier(.4,0,.2,1)}.Toastify__slide-exit--bottom-right,.Toastify__slide-exit--bottom-left,.Toastify__slide-exit--bottom-center{animation-duration:.2s;animation-timing-function:cubic-bezier(.4,0,1,1)}:root{--swiper-theme-color: #007aff}:host{position:relative;display:block;margin-left:auto;margin-right:auto;z-index:1}.swiper{margin-left:auto;margin-right:auto;position:relative;overflow:hidden;list-style:none;padding:0;z-index:1;display:block}.swiper-vertical>.swiper-wrapper{flex-direction:column}.swiper-wrapper{position:relative;width:100%;height:100%;z-index:1;display:flex;transition-property:transform;transition-timing-function:var(--swiper-wrapper-transition-timing-function, initial);box-sizing:content-box}.swiper-android .swiper-slide,.swiper-ios .swiper-slide,.swiper-wrapper{transform:translateZ(0)}.swiper-horizontal{touch-action:pan-y}.swiper-vertical{touch-action:pan-x}.swiper-slide{flex-shrink:0;width:100%;height:100%;position:relative;transition-property:transform;display:block}.swiper-slide-invisible-blank{visibility:hidden}.swiper-autoheight,.swiper-autoheight .swiper-slide{height:auto}.swiper-autoheight .swiper-wrapper{align-items:flex-start;transition-property:transform,height}.swiper-backface-hidden .swiper-slide{transform:translateZ(0);backface-visibility:hidden}.swiper-3d.swiper-css-mode .swiper-wrapper{perspective:1200px}.swiper-3d .swiper-wrapper{transform-style:preserve-3d}.swiper-3d{perspective:1200px}.swiper-3d .swiper-slide,.swiper-3d .swiper-cube-shadow{transform-style:preserve-3d}.swiper-css-mode>.swiper-wrapper{overflow:auto;scrollbar-width:none;-ms-overflow-style:none}.swiper-css-mode>.swiper-wrapper::-webkit-scrollbar{display:none}.swiper-css-mode>.swiper-wrapper>.swiper-slide{scroll-snap-align:start start}.swiper-css-mode.swiper-horizontal>.swiper-wrapper{scroll-snap-type:x mandatory}.swiper-css-mode.swiper-horizontal>.swiper-wrapper>.swiper-slide:first-child{margin-inline-start:var(--swiper-slides-offset-before);scroll-margin-inline-start:var(--swiper-slides-offset-before)}.swiper-css-mode.swiper-horizontal>.swiper-wrapper>.swiper-slide:last-child{margin-inline-end:var(--swiper-slides-offset-after)}.swiper-css-mode.swiper-vertical>.swiper-wrapper{scroll-snap-type:y mandatory}.swiper-css-mode.swiper-vertical>.swiper-wrapper>.swiper-slide:first-child{margin-block-start:var(--swiper-slides-offset-before);scroll-margin-block-start:var(--swiper-slides-offset-before)}.swiper-css-mode.swiper-vertical>.swiper-wrapper>.swiper-slide:last-child{margin-block-end:var(--swiper-slides-offset-after)}.swiper-css-mode.swiper-free-mode>.swiper-wrapper{scroll-snap-type:none}.swiper-css-mode.swiper-free-mode>.swiper-wrapper>.swiper-slide{scroll-snap-align:none}.swiper-css-mode.swiper-centered>.swiper-wrapper:before{content:"";flex-shrink:0;order:9999}.swiper-css-mode.swiper-centered>.swiper-wrapper>.swiper-slide{scroll-snap-align:center center;scroll-snap-stop:always}.swiper-css-mode.swiper-centered.swiper-horizontal>.swiper-wrapper>.swiper-slide:first-child{margin-inline-start:var(--swiper-centered-offset-before)}.swiper-css-mode.swiper-centered.swiper-horizontal>.swiper-wrapper:before{height:100%;min-height:1px;width:var(--swiper-centered-offset-after)}.swiper-css-mode.swiper-centered.swiper-vertical>.swiper-wrapper>.swiper-slide:first-child{margin-block-start:var(--swiper-centered-offset-before)}.swiper-css-mode.swiper-centered.swiper-vertical>.swiper-wrapper:before{width:100%;min-width:1px;height:var(--swiper-centered-offset-after)}.swiper-3d .swiper-slide-shadow,.swiper-3d .swiper-slide-shadow-left,.swiper-3d .swiper-slide-shadow-right,.swiper-3d .swiper-slide-shadow-top,.swiper-3d .swiper-slide-shadow-bottom{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none;z-index:10}.swiper-3d .swiper-slide-shadow{background:#00000026}.swiper-3d .swiper-slide-shadow-left{background-image:linear-gradient(to left,#00000080,#0000)}.swiper-3d .swiper-slide-shadow-right{background-image:linear-gradient(to right,#00000080,#0000)}.swiper-3d .swiper-slide-shadow-top{background-image:linear-gradient(to top,#00000080,#0000)}.swiper-3d .swiper-slide-shadow-bottom{background-image:linear-gradient(to bottom,#00000080,#0000)}.swiper-lazy-preloader{width:42px;height:42px;position:absolute;left:50%;top:50%;margin-left:-21px;margin-top:-21px;z-index:10;transform-origin:50%;box-sizing:border-box;border:4px solid var(--swiper-preloader-color, var(--swiper-theme-color));border-radius:50%;border-top-color:transparent}:is(.swiper:not(.swiper-watch-progress),.swiper-watch-progress .swiper-slide-visible) .swiper-lazy-preloader{animation:swiper-preloader-spin 1s infinite linear}.swiper-lazy-preloader-white{--swiper-preloader-color: #fff}.swiper-lazy-preloader-black{--swiper-preloader-color: #000}@keyframes swiper-preloader-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.swiper-pagination{position:absolute;text-align:center;transition:.3s opacity;transform:translateZ(0);z-index:10}.swiper-pagination.swiper-pagination-hidden{opacity:0}.swiper-pagination-disabled>.swiper-pagination,.swiper-pagination.swiper-pagination-disabled{display:none!important}.swiper-pagination-fraction,.swiper-pagination-custom,.swiper-horizontal>.swiper-pagination-bullets,.swiper-pagination-bullets.swiper-pagination-horizontal{bottom:var(--swiper-pagination-bottom, 8px);top:var(--swiper-pagination-top, auto);left:0;width:100%}.swiper-pagination-bullets-dynamic{overflow:hidden;font-size:0}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transform:scale(.33);position:relative}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active,.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main{transform:scale(1)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev{transform:scale(.66)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev{transform:scale(.33)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next{transform:scale(.66)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next{transform:scale(.33)}.swiper-pagination-bullet{width:var(--swiper-pagination-bullet-width, var(--swiper-pagination-bullet-size, 8px));height:var(--swiper-pagination-bullet-height, var(--swiper-pagination-bullet-size, 8px));display:inline-block;border-radius:var(--swiper-pagination-bullet-border-radius, 50%);background:var(--swiper-pagination-bullet-inactive-color, #000);opacity:var(--swiper-pagination-bullet-inactive-opacity, .2)}button.swiper-pagination-bullet{border:none;margin:0;padding:0;box-shadow:none;appearance:none}.swiper-pagination-clickable .swiper-pagination-bullet{cursor:pointer}.swiper-pagination-bullet:only-child{display:none!important}.swiper-pagination-bullet-active{opacity:var(--swiper-pagination-bullet-opacity, 1);background:var(--swiper-pagination-color, var(--swiper-theme-color))}.swiper-vertical>.swiper-pagination-bullets,.swiper-pagination-vertical.swiper-pagination-bullets{right:var(--swiper-pagination-right, 8px);left:var(--swiper-pagination-left, auto);top:50%;transform:translate3d(0,-50%,0)}:is(.swiper-vertical>.swiper-pagination-bullets,.swiper-pagination-vertical.swiper-pagination-bullets) .swiper-pagination-bullet{margin:var(--swiper-pagination-bullet-vertical-gap, 6px) 0;display:block}:is(.swiper-vertical>.swiper-pagination-bullets,.swiper-pagination-vertical.swiper-pagination-bullets).swiper-pagination-bullets-dynamic{top:50%;transform:translateY(-50%);width:8px}:is(.swiper-vertical>.swiper-pagination-bullets,.swiper-pagination-vertical.swiper-pagination-bullets).swiper-pagination-bullets-dynamic .swiper-pagination-bullet{display:inline-block;transition:.2s transform,.2s top}:is(.swiper-horizontal>.swiper-pagination-bullets,.swiper-pagination-horizontal.swiper-pagination-bullets) .swiper-pagination-bullet{margin:0 var(--swiper-pagination-bullet-horizontal-gap, 4px)}:is(.swiper-horizontal>.swiper-pagination-bullets,.swiper-pagination-horizontal.swiper-pagination-bullets).swiper-pagination-bullets-dynamic{left:50%;transform:translate(-50%);white-space:nowrap}:is(.swiper-horizontal>.swiper-pagination-bullets,.swiper-pagination-horizontal.swiper-pagination-bullets).swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transition:.2s transform,.2s left}.swiper-horizontal.swiper-rtl>.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transition:.2s transform,.2s right}.swiper-pagination-fraction{color:var(--swiper-pagination-fraction-color, inherit)}.swiper-pagination-progressbar{background:var(--swiper-pagination-progressbar-bg-color, rgba(0, 0, 0, .25));position:absolute}.swiper-pagination-progressbar .swiper-pagination-progressbar-fill{background:var(--swiper-pagination-color, var(--swiper-theme-color));position:absolute;left:0;top:0;width:100%;height:100%;transform:scale(0);transform-origin:left top}.swiper-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{transform-origin:right top}.swiper-horizontal>.swiper-pagination-progressbar,.swiper-pagination-progressbar.swiper-pagination-horizontal,.swiper-vertical>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite,.swiper-pagination-progressbar.swiper-pagination-vertical.swiper-pagination-progressbar-opposite{width:100%;height:var(--swiper-pagination-progressbar-size, 4px);left:0;top:0}.swiper-vertical>.swiper-pagination-progressbar,.swiper-pagination-progressbar.swiper-pagination-vertical,.swiper-horizontal>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite,.swiper-pagination-progressbar.swiper-pagination-horizontal.swiper-pagination-progressbar-opposite{width:var(--swiper-pagination-progressbar-size, 4px);height:100%;left:0;top:0}.swiper-pagination-lock{display:none}
+:root{--lax-form-focus-border: var(--color-primary-600);--lax-form-focus-shadow: 0 0 0 3px var(--color-primary-100)}.dark{--lax-form-focus-border: var(--color-primary-400);--lax-form-focus-shadow: 0 0 0 3px var(--color-primary-950)}input:where([type=text],[type=email],[type=password],[type=number],[type=search],[type=date],[type=time],[type=datetime-local],[type=url],[type=tel],[type=color]):focus,textarea:focus,select:focus,[contenteditable=true]:focus{outline:none!important;border-color:var(--lax-form-focus-border)!important;box-shadow:var(--lax-form-focus-shadow)!important}.ant-select-focused .ant-select-selector,.ant-picker-focused,.ant-input-affix-wrapper-focused,.ant-input-affix-wrapper:focus-within,.ant-input-number-focused,.ant-input-number:focus-within,.ant-input:focus{outline:none!important;border-color:var(--lax-form-focus-border)!important;box-shadow:var(--lax-form-focus-shadow)!important}.ant-checkbox-input:focus-visible+.ant-checkbox-inner{border-color:var(--lax-form-focus-border)!important;box-shadow:var(--lax-form-focus-shadow)!important}.lax-select__control--is-focused{border-color:var(--lax-form-focus-border)!important;box-shadow:var(--lax-form-focus-shadow)!important}.peer:focus-visible+.lax-toggle-track{border-color:var(--lax-form-focus-border)!important;box-shadow:var(--lax-form-focus-shadow)!important}.lax-form-trigger:focus-visible{outline:none!important;border-color:var(--lax-form-focus-border)!important;box-shadow:var(--lax-form-focus-shadow)!important}.lax-tooltip-body-important-whitespace{white-space:var(--lax-tooltip-white-space, initial)!important;overflow-wrap:break-word!important}.ant-select-selector{padding-left:6px!important}.select-field-emphasis-modified.ant-select .ant-select-selector{background-color:var(--Warning-50, #FFFAEB)!important;border-color:var(--Warning-200, #FEDF89)!important}.select-field-emphasis-modified.ant-select.ant-select-disabled .ant-select-selector{opacity:1!important;background-color:var(--Warning-50, #FFFAEB)!important;border-color:var(--Warning-200, #FEDF89)!important}.select-field-emphasis-deleted.ant-select .ant-select-selector{background-color:var(--Error-50, #FEF2F2)!important;border-color:var(--Error-200, #FECACA)!important}.select-field-emphasis-deleted.ant-select .ant-select-selector .ant-select-selection-item,.select-field-emphasis-deleted.ant-select .ant-select-selector .ant-select-selection-placeholder{color:#475467!important}.select-field-emphasis-deleted.ant-select.ant-select-disabled .ant-select-selector{opacity:1!important;background-color:var(--Error-50, #FEF2F2)!important;border-color:var(--Error-200, #FECACA)!important}.select-field-emphasis-success.ant-select .ant-select-selector{background-color:var(--Success-50, #F0FDF4)!important;border-color:var(--Success-200, #BBF7D0)!important}.select-field-emphasis-success.ant-select .ant-select-selector .ant-select-selection-item{color:#101828!important}.select-field-emphasis-success.ant-select.ant-select-disabled .ant-select-selector{opacity:1!important;background-color:var(--Success-50, #F0FDF4)!important;border-color:var(--Success-200, #BBF7D0)!important}.ant-select-selection-overflow-item-suffix,.ant-select-selection-wrap{min-height:inherit!important}.lax-popper-overlay.ant-popover{z-index:9999}.lax-popper-overlay .ant-popover-inner{background-color:#fff;border:1px solid #EAECF0;border-radius:8px;box-shadow:0 10px 30px #9e9e9e4d}.lax-popper-overlay .ant-popover-arrow:before{background-color:#fff;border:1px solid #EAECF0}.dark .lax-popper-overlay .ant-popover-inner{background-color:#1d2939;border-color:#344054;box-shadow:0 10px 30px #10101080}.dark .lax-popper-overlay .ant-popover-arrow:before{background-color:#1d2939;border-color:#344054}.Toastify__toast-container{z-index:100000}.Toastify__toast{min-height:64px;border-radius:4px;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f}.Toastify__toast--success,.Toastify__toast--error,.Toastify__toast--warning,.Toastify__toast--info{background:transparent}.Toastify__toast-body{padding:0;margin:0;color:inherit;font-size:14px;font-weight:500;line-height:1.5}.Toastify__close-button{color:inherit;opacity:.7;align-self:flex-start;background:transparent;border:none;padding:4px;margin:0;transition:opacity .2s ease}.Toastify__close-button:hover{opacity:1}.Toastify__progress-bar{background:linear-gradient(to right,#4caf50,#8bc34a,#cddc39,#ffeb3b,#ffc107,#ff9800,#ff5722)}.Toastify__progress-bar--success{background:#12b76a}.Toastify__progress-bar--error{background:#f04438}.Toastify__progress-bar--warning{background:#f79009}.Toastify__progress-bar--info{background:#016dcf}@media (prefers-color-scheme: dark){.Toastify__toast-container{background:transparent}.Toastify__toast{box-shadow:0 4px 6px -1px #0000004d,0 2px 4px -1px #0003}}@media screen and (max-width: 640px){.Toastify__toast-container{left:1rem;right:1rem;bottom:1rem;width:auto}.Toastify__toast{margin-bottom:.5rem}}.Toastify__slide-enter--bottom-right,.Toastify__slide-enter--bottom-left,.Toastify__slide-enter--bottom-center{animation-duration:.3s;animation-timing-function:cubic-bezier(.4,0,.2,1)}.Toastify__slide-exit--bottom-right,.Toastify__slide-exit--bottom-left,.Toastify__slide-exit--bottom-center{animation-duration:.2s;animation-timing-function:cubic-bezier(.4,0,1,1)}:root{--swiper-theme-color: #007aff}:host{position:relative;display:block;margin-left:auto;margin-right:auto;z-index:1}.swiper{margin-left:auto;margin-right:auto;position:relative;overflow:hidden;list-style:none;padding:0;z-index:1;display:block}.swiper-vertical>.swiper-wrapper{flex-direction:column}.swiper-wrapper{position:relative;width:100%;height:100%;z-index:1;display:flex;transition-property:transform;transition-timing-function:var(--swiper-wrapper-transition-timing-function, initial);box-sizing:content-box}.swiper-android .swiper-slide,.swiper-ios .swiper-slide,.swiper-wrapper{transform:translateZ(0)}.swiper-horizontal{touch-action:pan-y}.swiper-vertical{touch-action:pan-x}.swiper-slide{flex-shrink:0;width:100%;height:100%;position:relative;transition-property:transform;display:block}.swiper-slide-invisible-blank{visibility:hidden}.swiper-autoheight,.swiper-autoheight .swiper-slide{height:auto}.swiper-autoheight .swiper-wrapper{align-items:flex-start;transition-property:transform,height}.swiper-backface-hidden .swiper-slide{transform:translateZ(0);backface-visibility:hidden}.swiper-3d.swiper-css-mode .swiper-wrapper{perspective:1200px}.swiper-3d .swiper-wrapper{transform-style:preserve-3d}.swiper-3d{perspective:1200px}.swiper-3d .swiper-slide,.swiper-3d .swiper-cube-shadow{transform-style:preserve-3d}.swiper-css-mode>.swiper-wrapper{overflow:auto;scrollbar-width:none;-ms-overflow-style:none}.swiper-css-mode>.swiper-wrapper::-webkit-scrollbar{display:none}.swiper-css-mode>.swiper-wrapper>.swiper-slide{scroll-snap-align:start start}.swiper-css-mode.swiper-horizontal>.swiper-wrapper{scroll-snap-type:x mandatory}.swiper-css-mode.swiper-horizontal>.swiper-wrapper>.swiper-slide:first-child{margin-inline-start:var(--swiper-slides-offset-before);scroll-margin-inline-start:var(--swiper-slides-offset-before)}.swiper-css-mode.swiper-horizontal>.swiper-wrapper>.swiper-slide:last-child{margin-inline-end:var(--swiper-slides-offset-after)}.swiper-css-mode.swiper-vertical>.swiper-wrapper{scroll-snap-type:y mandatory}.swiper-css-mode.swiper-vertical>.swiper-wrapper>.swiper-slide:first-child{margin-block-start:var(--swiper-slides-offset-before);scroll-margin-block-start:var(--swiper-slides-offset-before)}.swiper-css-mode.swiper-vertical>.swiper-wrapper>.swiper-slide:last-child{margin-block-end:var(--swiper-slides-offset-after)}.swiper-css-mode.swiper-free-mode>.swiper-wrapper{scroll-snap-type:none}.swiper-css-mode.swiper-free-mode>.swiper-wrapper>.swiper-slide{scroll-snap-align:none}.swiper-css-mode.swiper-centered>.swiper-wrapper:before{content:"";flex-shrink:0;order:9999}.swiper-css-mode.swiper-centered>.swiper-wrapper>.swiper-slide{scroll-snap-align:center center;scroll-snap-stop:always}.swiper-css-mode.swiper-centered.swiper-horizontal>.swiper-wrapper>.swiper-slide:first-child{margin-inline-start:var(--swiper-centered-offset-before)}.swiper-css-mode.swiper-centered.swiper-horizontal>.swiper-wrapper:before{height:100%;min-height:1px;width:var(--swiper-centered-offset-after)}.swiper-css-mode.swiper-centered.swiper-vertical>.swiper-wrapper>.swiper-slide:first-child{margin-block-start:var(--swiper-centered-offset-before)}.swiper-css-mode.swiper-centered.swiper-vertical>.swiper-wrapper:before{width:100%;min-width:1px;height:var(--swiper-centered-offset-after)}.swiper-3d .swiper-slide-shadow,.swiper-3d .swiper-slide-shadow-left,.swiper-3d .swiper-slide-shadow-right,.swiper-3d .swiper-slide-shadow-top,.swiper-3d .swiper-slide-shadow-bottom{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none;z-index:10}.swiper-3d .swiper-slide-shadow{background:#00000026}.swiper-3d .swiper-slide-shadow-left{background-image:linear-gradient(to left,#00000080,#0000)}.swiper-3d .swiper-slide-shadow-right{background-image:linear-gradient(to right,#00000080,#0000)}.swiper-3d .swiper-slide-shadow-top{background-image:linear-gradient(to top,#00000080,#0000)}.swiper-3d .swiper-slide-shadow-bottom{background-image:linear-gradient(to bottom,#00000080,#0000)}.swiper-lazy-preloader{width:42px;height:42px;position:absolute;left:50%;top:50%;margin-left:-21px;margin-top:-21px;z-index:10;transform-origin:50%;box-sizing:border-box;border:4px solid var(--swiper-preloader-color, var(--swiper-theme-color));border-radius:50%;border-top-color:transparent}:is(.swiper:not(.swiper-watch-progress),.swiper-watch-progress .swiper-slide-visible) .swiper-lazy-preloader{animation:swiper-preloader-spin 1s infinite linear}.swiper-lazy-preloader-white{--swiper-preloader-color: #fff}.swiper-lazy-preloader-black{--swiper-preloader-color: #000}@keyframes swiper-preloader-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.swiper-pagination{position:absolute;text-align:center;transition:.3s opacity;transform:translateZ(0);z-index:10}.swiper-pagination.swiper-pagination-hidden{opacity:0}.swiper-pagination-disabled>.swiper-pagination,.swiper-pagination.swiper-pagination-disabled{display:none!important}.swiper-pagination-fraction,.swiper-pagination-custom,.swiper-horizontal>.swiper-pagination-bullets,.swiper-pagination-bullets.swiper-pagination-horizontal{bottom:var(--swiper-pagination-bottom, 8px);top:var(--swiper-pagination-top, auto);left:0;width:100%}.swiper-pagination-bullets-dynamic{overflow:hidden;font-size:0}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transform:scale(.33);position:relative}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active,.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main{transform:scale(1)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev{transform:scale(.66)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev{transform:scale(.33)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next{transform:scale(.66)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next{transform:scale(.33)}.swiper-pagination-bullet{width:var(--swiper-pagination-bullet-width, var(--swiper-pagination-bullet-size, 8px));height:var(--swiper-pagination-bullet-height, var(--swiper-pagination-bullet-size, 8px));display:inline-block;border-radius:var(--swiper-pagination-bullet-border-radius, 50%);background:var(--swiper-pagination-bullet-inactive-color, #000);opacity:var(--swiper-pagination-bullet-inactive-opacity, .2)}button.swiper-pagination-bullet{border:none;margin:0;padding:0;box-shadow:none;appearance:none}.swiper-pagination-clickable .swiper-pagination-bullet{cursor:pointer}.swiper-pagination-bullet:only-child{display:none!important}.swiper-pagination-bullet-active{opacity:var(--swiper-pagination-bullet-opacity, 1);background:var(--swiper-pagination-color, var(--swiper-theme-color))}.swiper-vertical>.swiper-pagination-bullets,.swiper-pagination-vertical.swiper-pagination-bullets{right:var(--swiper-pagination-right, 8px);left:var(--swiper-pagination-left, auto);top:50%;transform:translate3d(0,-50%,0)}:is(.swiper-vertical>.swiper-pagination-bullets,.swiper-pagination-vertical.swiper-pagination-bullets) .swiper-pagination-bullet{margin:var(--swiper-pagination-bullet-vertical-gap, 6px) 0;display:block}:is(.swiper-vertical>.swiper-pagination-bullets,.swiper-pagination-vertical.swiper-pagination-bullets).swiper-pagination-bullets-dynamic{top:50%;transform:translateY(-50%);width:8px}:is(.swiper-vertical>.swiper-pagination-bullets,.swiper-pagination-vertical.swiper-pagination-bullets).swiper-pagination-bullets-dynamic .swiper-pagination-bullet{display:inline-block;transition:.2s transform,.2s top}:is(.swiper-horizontal>.swiper-pagination-bullets,.swiper-pagination-horizontal.swiper-pagination-bullets) .swiper-pagination-bullet{margin:0 var(--swiper-pagination-bullet-horizontal-gap, 4px)}:is(.swiper-horizontal>.swiper-pagination-bullets,.swiper-pagination-horizontal.swiper-pagination-bullets).swiper-pagination-bullets-dynamic{left:50%;transform:translate(-50%);white-space:nowrap}:is(.swiper-horizontal>.swiper-pagination-bullets,.swiper-pagination-horizontal.swiper-pagination-bullets).swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transition:.2s transform,.2s left}.swiper-horizontal.swiper-rtl>.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transition:.2s transform,.2s right}.swiper-pagination-fraction{color:var(--swiper-pagination-fraction-color, inherit)}.swiper-pagination-progressbar{background:var(--swiper-pagination-progressbar-bg-color, rgba(0, 0, 0, .25));position:absolute}.swiper-pagination-progressbar .swiper-pagination-progressbar-fill{background:var(--swiper-pagination-color, var(--swiper-theme-color));position:absolute;left:0;top:0;width:100%;height:100%;transform:scale(0);transform-origin:left top}.swiper-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{transform-origin:right top}.swiper-horizontal>.swiper-pagination-progressbar,.swiper-pagination-progressbar.swiper-pagination-horizontal,.swiper-vertical>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite,.swiper-pagination-progressbar.swiper-pagination-vertical.swiper-pagination-progressbar-opposite{width:100%;height:var(--swiper-pagination-progressbar-size, 4px);left:0;top:0}.swiper-vertical>.swiper-pagination-progressbar,.swiper-pagination-progressbar.swiper-pagination-vertical,.swiper-horizontal>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite,.swiper-pagination-progressbar.swiper-pagination-horizontal.swiper-pagination-progressbar-opposite{width:var(--swiper-pagination-progressbar-size, 4px);height:100%;left:0;top:0}.swiper-pagination-lock{display:none}

package/dist/index.d.ts

@@ -253,7 +253,7 @@ export type { DesignSystemConfig, TabConfig, TableConfig, TableViewApi, MasterDa
 export { InfiniteTable } from "./components/data-display/infinite-table";
 export { TableContext } from "./components/data-display/infinite-table/context";
 export type { ITableContext } from "./components/data-display/infinite-table/context";
-export type { ITableProps, ICell, IColumn, ITableView, IMultiSelectConfig, TTableKey, TTableRow, TCheckboxUtilities, IMasterDataModalConfig, ICurrencyDropdownConfig, IPendingEdit, PendingEditsMap, ValidateAndSaveResult, THeaderInlineAction, } from "./components/data-display/infinite-table/types";
+export type { ITableProps, ICell, IColumn, ITableView, IMultiSelectConfig, TTableKey, TTableRow, TCheckboxUtilities, IMasterDataModalConfig, ICurrencyDropdownConfig, IPendingEdit, PendingEditsMap, ValidateAndSaveResult, } from "./components/data-display/infinite-table/types";
 export { useCheckbox } from "./hooks/useCheckbox";
 export { default as UserCell } from "./components/data-display/infinite-table/body/cell/UserCell";
 export { Dropdown } from "./components/dropdown/Dropdown";

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@lax-wp/design-system",
   "private": false,
-  "version": "0.13.29",
+  "version": "0.13.33-beta.0",
   "type": "module",
   "main": "dist/index.cjs.js",
   "module": "dist/index.es.js",
@@ -41,8 +41,7 @@
     "build-storybook": "storybook build",
     "format": "prettier --write \"src/**/*.{ts,tsx,js,jsx,json,css,md}\"",
     "format:check": "prettier --check \"src/**/*.{ts,tsx,js,jsx,json,css,md}\"",
-    "generate-icons": "node scripts/generate-icons.js",
-    "prepublishOnly": "npm run build"
+    "generate-icons": "node scripts/generate-icons.js"
   },
   "publishConfig": {
     "access": "public"