@devalok/shilp-sutra 0.22.0 → 0.22.1

package/dist/composed/avatar-group.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"avatar-group.d.ts","sourceRoot":"","sources":["../../src/composed/avatar-group.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAOjE,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,cAAc,CAAA;AAS9C,QAAA,MAAM,kBAAkB;;8EAgBvB,CAAA;AAED,MAAM,WAAW,UAAU;IACzB,IAAI,EAAE,MAAM,CAAA;IACZ,KAAK,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IACrB,IAAI,CAAC,EAAE,UAAU,CAAA;CAClB;AAED,MAAM,WAAW,gBACf,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EAC1C,YAAY,CAAC,OAAO,kBAAkB,CAAC;IACzC,KAAK,EAAE,UAAU,EAAE,CAAA;IACnB,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,+DAA+D;IAC/D,WAAW,CAAC,EAAE,WAAW,GAAG,WAAW,CAAA;IACvC,uDAAuD;IACvD,eAAe,CAAC,EAAE,MAAM,IAAI,CAAA;IAC5B,6CAA6C;IAC7C,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,UAAU,EAAE,KAAK,EAAE,MAAM,KAAK,KAAK,CAAC,SAAS,CAAA;IACnE,0DAA0D;IAC1D,eAAe,CAAC,EAAE,MAAM,GAAG,OAAO,CAAA;IAClC,iEAAiE;IACjE,YAAY,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,MAAM,CAAA;CAC9C;AAED,QAAA,MAAM,WAAW,yFAkLhB,CAAA;AAGD,OAAO,EAAE,WAAW,EAAE,CAAA"}
+{"version":3,"file":"avatar-group.d.ts","sourceRoot":"","sources":["../../src/composed/avatar-group.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAOjE,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,cAAc,CAAA;AAgB9C,QAAA,MAAM,kBAAkB;;8EAgBvB,CAAA;AAED,MAAM,WAAW,UAAU;IACzB,IAAI,EAAE,MAAM,CAAA;IACZ,KAAK,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IACrB,IAAI,CAAC,EAAE,UAAU,CAAA;CAClB;AAED,MAAM,WAAW,gBACf,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EAC1C,YAAY,CAAC,OAAO,kBAAkB,CAAC;IACzC,KAAK,EAAE,UAAU,EAAE,CAAA;IACnB,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,+DAA+D;IAC/D,WAAW,CAAC,EAAE,WAAW,GAAG,WAAW,CAAA;IACvC,uDAAuD;IACvD,eAAe,CAAC,EAAE,MAAM,IAAI,CAAA;IAC5B,6CAA6C;IAC7C,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,UAAU,EAAE,KAAK,EAAE,MAAM,KAAK,KAAK,CAAC,SAAS,CAAA;IACnE,0DAA0D;IAC1D,eAAe,CAAC,EAAE,MAAM,GAAG,OAAO,CAAA;IAClC,iEAAiE;IACjE,YAAY,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,MAAM,CAAA;CAC9C;AAED,QAAA,MAAM,WAAW,yFAmLhB,CAAA;AAGD,OAAO,EAAE,WAAW,EAAE,CAAA"}

package/dist/composed/avatar-group.js

@@ -1,12 +1,16 @@
 "use client";
-import { jsx as r, jsxs as o } from "react/jsx-runtime";
+import { jsx as r, jsxs as n } from "react/jsx-runtime";
 import * as b from "react";
 import { ag as $ } from "../_chunks/vendor-utils.js";
-import { cn as n } from "../ui/lib/utils.js";
+import { cn as o } from "../ui/lib/utils.js";
 import { Avatar as E, AvatarImage as F, AvatarFallback as G } from "../ui/avatar.js";
 import { TooltipProvider as H, Tooltip as y, TooltipTrigger as N, TooltipContent as w } from "../ui/tooltip.js";
-import { getInitials as R } from "./lib/string-utils.js";
-const p = $(
+import { getInitials as B } from "./lib/string-utils.js";
+const I = {
+  lead: "ring-2 ring-accent-7 ring-offset-1 ring-offset-surface-2",
+  admin: "ring-2 ring-warning-7 ring-offset-1 ring-offset-surface-2",
+  client: "ring-2 ring-info-7 ring-offset-1 ring-offset-surface-2"
+}, g = $(
   "shrink-0 overflow-hidden rounded-ds-full border-2",
   {
     variants: {
@@ -15,90 +19,91 @@ const p = $(
         sm: "h-ds-xs w-ds-xs text-ds-xs",
         md: "h-ds-sm w-ds-sm text-ds-sm",
         lg: "h-ds-md w-ds-md text-ds-md",
-        xl: "h-ds-lg w-ds-lg text-ds-lg"
+        xl: "h-ds-lg w-ds-lg text-ds-md"
       }
     },
     defaultVariants: {
       size: "md"
     }
   }
-), B = b.forwardRef(
+), L = b.forwardRef(
   ({
     users: l,
-    max: g = 4,
-    size: s,
-    showTooltip: I = !0,
+    max: p = 4,
+    size: a,
+    showTooltip: M = !0,
     borderColor: T = "surface-2",
     onOverflowClick: h,
     renderAvatar: u,
-    expandDirection: M = "right",
-    expandAmount: C = "default",
-    className: z,
-    ...S
-  }, j) => {
-    const a = l.slice(0, g), c = l.length - g, d = {
+    expandDirection: C = "right",
+    expandAmount: z = "default",
+    className: S,
+    ...j
+  }, A) => {
+    const s = l.slice(0, p), i = l.length - p, c = {
       xs: "-ml-ds-02",
       sm: "-ml-ds-02b",
       md: "-ml-ds-03",
       lg: "-ml-ds-04",
       xl: "-ml-ds-05"
-    }[s ?? "md"], i = T === "surface-1" ? "border-surface-1" : "border-surface-2", [A, m] = b.useState(!1), P = {
+    }[a ?? "md"], d = T === "surface-1" ? "border-surface-1" : "border-surface-2", [P, f] = b.useState(!1), k = {
       xs: 8,
       sm: 10,
       md: 12,
       lg: 16,
       xl: 20
-    }[s ?? "md"], k = { compact: 0.5, default: 1, wide: 1.5 }[C], V = a.length + (c > 0 ? 1 : 0);
-    function f(e) {
-      if (!A) return "translateX(0)";
-      const t = P * k;
-      return M === "left" ? `translateX(-${(V - 1 - e) * t}px)` : `translateX(${e * t}px)`;
+    }[a ?? "md"], R = { compact: 0.5, default: 1, wide: 1.5 }[z], V = s.length + (i > 0 ? 1 : 0);
+    function m(e) {
+      if (!P) return "translateX(0)";
+      const t = k * R;
+      return C === "left" ? `translateX(-${(V - 1 - e) * t}px)` : `translateX(${e * t}px)`;
     }
     const x = "transition-[transform,opacity] duration-300 ease-out hover:z-50 hover:scale-105 group-hover:[&:not(:hover)]:opacity-85";
-    return /* @__PURE__ */ r(H, { children: /* @__PURE__ */ o(
+    return /* @__PURE__ */ r(H, { children: /* @__PURE__ */ n(
       "div",
       {
-        ref: j,
+        ref: A,
         role: "group",
         "aria-label": `${l.length} team members`,
         tabIndex: 0,
-        className: n("group flex items-center", z),
-        onMouseEnter: () => m(!0),
-        onMouseLeave: () => m(!1),
-        onFocus: () => m(!0),
+        className: o("group flex items-center", S),
+        onMouseEnter: () => f(!0),
+        onMouseLeave: () => f(!1),
+        onFocus: () => f(!0),
         onBlur: (e) => {
-          e.currentTarget.contains(e.relatedTarget) || m(!1);
+          e.currentTarget.contains(e.relatedTarget) || f(!1);
         },
-        ...S,
+        ...j,
         children: [
-          a.map((e, t) => {
-            const X = R(e.name);
+          s.map((e, t) => {
+            const X = B(e.name);
             if (u)
               return /* @__PURE__ */ r(
                 "div",
                 {
-                  className: n(
-                    p({ size: s }),
-                    i,
-                    t > 0 && d,
-                    x
+                  className: o(
+                    g({ size: a }),
+                    d,
+                    t > 0 && c,
+                    x,
+                    e.ring && e.ring !== "none" && I[e.ring]
                   ),
-                  style: { zIndex: a.length - t, transform: f(t) },
+                  style: { zIndex: s.length - t, transform: m(t) },
                   children: u(e, t)
                 },
                 e.name
               );
-            const v = /* @__PURE__ */ o(
+            const v = /* @__PURE__ */ n(
               E,
               {
-                ring: e.ring,
-                className: n(
-                  p({ size: s }),
-                  i,
-                  t > 0 && d,
-                  x
+                className: o(
+                  g({ size: a }),
+                  d,
+                  t > 0 && c,
+                  x,
+                  e.ring && e.ring !== "none" && I[e.ring]
                 ),
-                style: { zIndex: a.length - t, transform: f(t) },
+                style: { zIndex: s.length - t, transform: m(t) },
                 children: [
                   e.image && /* @__PURE__ */ r(F, { src: e.image, alt: e.name }),
                   /* @__PURE__ */ r(
@@ -113,7 +118,7 @@ const p = $(
               },
               e.name
             );
-            return I ? /* @__PURE__ */ o(y, { children: [
+            return M ? /* @__PURE__ */ n(y, { children: [
               /* @__PURE__ */ r(N, { asChild: !0, children: v }),
               /* @__PURE__ */ r(
                 w,
@@ -125,39 +130,39 @@ const p = $(
               )
             ] }, e.name) : v;
           }),
-          c > 0 && /* @__PURE__ */ o(y, { children: [
-            /* @__PURE__ */ r(N, { asChild: !0, children: h ? /* @__PURE__ */ o(
+          i > 0 && /* @__PURE__ */ n(y, { children: [
+            /* @__PURE__ */ r(N, { asChild: !0, children: h ? /* @__PURE__ */ n(
               "button",
               {
                 type: "button",
                 onClick: h,
-                className: n(
-                  p({ size: s }),
-                  i,
+                className: o(
+                  g({ size: a }),
                   d,
+                  c,
                   "flex cursor-pointer items-center justify-center bg-accent-2 font-body font-semibold text-accent-11",
                   "hover:scale-105 hover:bg-accent-3 transition-[transform,background-color] duration-300 ease-out"
                 ),
-                style: { zIndex: 0, transform: f(a.length) },
+                style: { zIndex: 0, transform: m(s.length) },
                 children: [
                   "+",
-                  c
+                  i
                 ]
               }
-            ) : /* @__PURE__ */ o(
+            ) : /* @__PURE__ */ n(
               "div",
               {
-                className: n(
-                  p({ size: s }),
-                  i,
+                className: o(
+                  g({ size: a }),
                   d,
+                  c,
                   "flex cursor-default items-center justify-center bg-accent-2 font-body font-semibold text-accent-11",
                   "transition-[transform,opacity] duration-300 ease-out"
                 ),
-                style: { zIndex: 0, transform: f(a.length) },
+                style: { zIndex: 0, transform: m(s.length) },
                 children: [
                   "+",
-                  c
+                  i
                 ]
               }
             ) }),
@@ -166,7 +171,7 @@ const p = $(
               {
                 className: "border-surface-border-strong bg-surface-1 text-surface-fg",
                 sideOffset: 6,
-                children: /* @__PURE__ */ r("div", { className: "flex flex-col gap-ds-01", children: l.slice(g).map((e, t) => /* @__PURE__ */ r("p", { className: "text-ds-sm", children: e.name }, t)) })
+                children: /* @__PURE__ */ r("div", { className: "flex flex-col gap-ds-01", children: l.slice(p).map((e, t) => /* @__PURE__ */ r("p", { className: "text-ds-sm", children: e.name }, t)) })
               }
             )
           ] })
@@ -175,7 +180,7 @@ const p = $(
     ) });
   }
 );
-B.displayName = "AvatarGroup";
+L.displayName = "AvatarGroup";
 export {
-  B as AvatarGroup
+  L as AvatarGroup
 };

package/llms-full.txt

@@ -5,7 +5,7 @@
 > All variant values and props verified from source CVA definitions.
 >
 > Package: @devalok/shilp-sutra
-> Version: 0.22.0
+> Version: 0.22.1
 
 ---
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@devalok/shilp-sutra",
-  "version": "0.22.0",
+  "version": "0.22.1",
   "description": "Devalok Design System — tokens, components, and patterns for Next.js",
   "license": "MIT",
   "type": "module",