@devalok/shilp-sutra 0.22.2 → 0.22.3

package/dist/composed/avatar-group.js

@@ -4,22 +4,22 @@ import * as b from "react";
 import { ag as $ } from "../_chunks/vendor-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 { TooltipProvider as H, Tooltip as x, TooltipTrigger as y, TooltipContent as N } from "../ui/tooltip.js";
 import { getInitials as B } from "./lib/string-utils.js";
-const I = {
+const w = {
   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 = $(
+}, I = $(
   "shrink-0 overflow-hidden rounded-ds-full border-2",
   {
     variants: {
       size: {
-        xs: "h-ds-xs w-ds-xs text-[10px]",
-        sm: "h-ds-sm w-ds-sm text-ds-xs",
-        md: "h-ds-md w-ds-md text-ds-sm",
-        lg: "h-ds-lg w-ds-lg text-ds-md",
-        xl: "h-ds-xl w-ds-xl text-ds-md"
+        xs: "h-ds-xs w-ds-xs",
+        sm: "h-ds-sm w-ds-sm",
+        md: "h-ds-md w-ds-md",
+        lg: "h-ds-lg w-ds-lg",
+        xl: "h-ds-xl w-ds-xl"
       }
     },
     defaultVariants: {
@@ -29,81 +29,80 @@ const I = {
 ), L = b.forwardRef(
   ({
     users: l,
-    max: p = 4,
-    size: a,
+    max: m = 4,
+    size: s,
     showTooltip: M = !0,
     borderColor: T = "surface-2",
-    onOverflowClick: h,
-    renderAvatar: u,
-    expandDirection: C = "right",
-    expandAmount: z = "default",
+    onOverflowClick: p,
+    renderAvatar: h,
+    expandDirection: z = "right",
+    expandAmount: C = "default",
     className: S,
     ...j
-  }, A) => {
-    const s = l.slice(0, p), i = l.length - p, c = {
+  }, k) => {
+    const a = l.slice(0, m), i = l.length - m, c = {
       xs: "-ml-ds-02",
       sm: "-ml-ds-02b",
       md: "-ml-ds-03",
       lg: "-ml-ds-04",
       xl: "-ml-ds-05"
-    }[a ?? "md"], d = T === "surface-1" ? "border-surface-1" : "border-surface-2", [P, f] = b.useState(!1), k = {
+    }[s ?? "md"], g = T === "surface-1" ? "border-surface-1" : "border-surface-2", [A, d] = b.useState(!1), P = {
       xs: 8,
       sm: 10,
       md: 12,
       lg: 16,
       xl: 20
-    }[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)`;
+    }[s ?? "md"], R = { compact: 0.5, default: 1, wide: 1.5 }[C], V = a.length + (i > 0 ? 1 : 0);
+    function f(e) {
+      if (!A) return "translateX(0)";
+      const t = P * R;
+      return z === "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";
+    const u = "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__ */ n(
       "div",
       {
-        ref: A,
+        ref: k,
         role: "group",
         "aria-label": `${l.length} team members`,
         tabIndex: 0,
         className: o("group flex items-center", S),
-        onMouseEnter: () => f(!0),
-        onMouseLeave: () => f(!1),
-        onFocus: () => f(!0),
+        onMouseEnter: () => d(!0),
+        onMouseLeave: () => d(!1),
+        onFocus: () => d(!0),
         onBlur: (e) => {
-          e.currentTarget.contains(e.relatedTarget) || f(!1);
+          e.currentTarget.contains(e.relatedTarget) || d(!1);
         },
         ...j,
         children: [
-          s.map((e, t) => {
+          a.map((e, t) => {
             const X = B(e.name);
-            if (u)
+            if (h)
               return /* @__PURE__ */ r(
                 "div",
                 {
                   className: o(
-                    g({ size: a }),
-                    d,
+                    "shrink-0",
                     t > 0 && c,
-                    x,
-                    e.ring && e.ring !== "none" && I[e.ring]
+                    u,
+                    e.ring && e.ring !== "none" && w[e.ring]
                   ),
-                  style: { zIndex: s.length - t, transform: m(t) },
-                  children: u(e, t)
+                  style: { zIndex: a.length - t, transform: f(t) },
+                  children: h(e, t)
                 },
                 e.name
               );
             const v = /* @__PURE__ */ n(
               E,
               {
+                size: s,
                 className: o(
-                  g({ size: a }),
-                  d,
+                  g,
                   t > 0 && c,
-                  x,
-                  e.ring && e.ring !== "none" && I[e.ring]
+                  u,
+                  e.ring && e.ring !== "none" && w[e.ring]
                 ),
-                style: { zIndex: s.length - t, transform: m(t) },
+                style: { zIndex: a.length - t, transform: f(t) },
                 children: [
                   e.image && /* @__PURE__ */ r(F, { src: e.image, alt: e.name }),
                   /* @__PURE__ */ r(
@@ -118,10 +117,10 @@ const I = {
               },
               e.name
             );
-            return M ? /* @__PURE__ */ n(y, { children: [
-              /* @__PURE__ */ r(N, { asChild: !0, children: v }),
+            return M ? /* @__PURE__ */ n(x, { children: [
+              /* @__PURE__ */ r(y, { asChild: !0, children: v }),
               /* @__PURE__ */ r(
-                w,
+                N,
                 {
                   className: "border-surface-border-strong bg-surface-1 text-surface-fg",
                   sideOffset: 6,
@@ -130,20 +129,20 @@ const I = {
               )
             ] }, e.name) : v;
           }),
-          i > 0 && /* @__PURE__ */ n(y, { children: [
-            /* @__PURE__ */ r(N, { asChild: !0, children: h ? /* @__PURE__ */ n(
+          i > 0 && /* @__PURE__ */ n(x, { children: [
+            /* @__PURE__ */ r(y, { asChild: !0, children: p ? /* @__PURE__ */ n(
               "button",
               {
                 type: "button",
-                onClick: h,
+                onClick: p,
                 className: o(
-                  g({ size: a }),
-                  d,
+                  I({ size: s }),
+                  g,
                   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: m(s.length) },
+                style: { zIndex: 0, transform: f(a.length) },
                 children: [
                   "+",
                   i
@@ -153,13 +152,13 @@ const I = {
               "div",
               {
                 className: o(
-                  g({ size: a }),
-                  d,
+                  I({ size: s }),
+                  g,
                   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: m(s.length) },
+                style: { zIndex: 0, transform: f(a.length) },
                 children: [
                   "+",
                   i
@@ -167,11 +166,11 @@ const I = {
               }
             ) }),
             /* @__PURE__ */ r(
-              w,
+              N,
               {
                 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(p).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(m).map((e, t) => /* @__PURE__ */ r("p", { className: "text-ds-sm", children: e.name }, t)) })
               }
             )
           ] })

package/dist/ui/avatar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"avatar.d.ts","sourceRoot":"","sources":["../../src/ui/avatar.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,eAAe,MAAM,0BAA0B,CAAA;AAC3D,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAUjE,eAAO,MAAM,cAAc;;;8EAmB1B,CAAA;AAED,MAAM,MAAM,YAAY,GAAG,QAAQ,GAAG,SAAS,GAAG,MAAM,GAAG,MAAM,CAAA;AAEjE,MAAM,MAAM,UAAU,GAAG,MAAM,GAAG,MAAM,GAAG,OAAO,GAAG,QAAQ,CAAA;AAoE7D;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAwCG;AACH,MAAM,WAAW,WACf,SAAQ,IAAI,CAAC,KAAK,CAAC,wBAAwB,CAAC,OAAO,eAAe,CAAC,IAAI,CAAC,EAAE,UAAU,CAAC,EACnF,YAAY,CAAC,OAAO,cAAc,CAAC;IACrC,8EAA8E;IAC9E,MAAM,CAAC,EAAE,YAAY,CAAA;IACrB,gCAAgC;IAChC,IAAI,CAAC,EAAE,UAAU,CAAA;IACjB,wDAAwD;IACxD,KAAK,CAAC,EAAE,MAAM,GAAG,KAAK,GAAG,KAAK,CAAC,SAAS,CAAA;IACxC,+CAA+C;IAC/C,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CAC3B;AAED,QAAA,MAAM,MAAM,qFA6EV,CAAA;AAGF,QAAA,MAAM,WAAW,gKAgBf,CAAA;AAGF,MAAM,WAAW,mBACf,SAAQ,KAAK,CAAC,wBAAwB,CAAC,OAAO,eAAe,CAAC,QAAQ,CAAC;IACvE;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED,QAAA,MAAM,cAAc,6FAiClB,CAAA;AAGF,OAAO,EAAE,MAAM,EAAE,WAAW,EAAE,cAAc,EAAE,CAAA"}
+{"version":3,"file":"avatar.d.ts","sourceRoot":"","sources":["../../src/ui/avatar.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,eAAe,MAAM,0BAA0B,CAAA;AAC3D,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAYjE,eAAO,MAAM,cAAc;;;8EAmB1B,CAAA;AAED,MAAM,MAAM,YAAY,GAAG,QAAQ,GAAG,SAAS,GAAG,MAAM,GAAG,MAAM,CAAA;AAEjE,MAAM,MAAM,UAAU,GAAG,MAAM,GAAG,MAAM,GAAG,OAAO,GAAG,QAAQ,CAAA;AA6E7D;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAwCG;AACH,MAAM,WAAW,WACf,SAAQ,IAAI,CAAC,KAAK,CAAC,wBAAwB,CAAC,OAAO,eAAe,CAAC,IAAI,CAAC,EAAE,UAAU,CAAC,EACnF,YAAY,CAAC,OAAO,cAAc,CAAC;IACrC,8EAA8E;IAC9E,MAAM,CAAC,EAAE,YAAY,CAAA;IACrB,gCAAgC;IAChC,IAAI,CAAC,EAAE,UAAU,CAAA;IACjB,wDAAwD;IACxD,KAAK,CAAC,EAAE,MAAM,GAAG,KAAK,GAAG,KAAK,CAAC,SAAS,CAAA;IACxC,+CAA+C;IAC/C,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CAC3B;AAED,QAAA,MAAM,MAAM,qFA+EV,CAAA;AAGF,QAAA,MAAM,WAAW,gKAgBf,CAAA;AAGF,MAAM,WAAW,mBACf,SAAQ,KAAK,CAAC,wBAAwB,CAAC,OAAO,eAAe,CAAC,QAAQ,CAAC;IACvE;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED,QAAA,MAAM,cAAc,6FAmClB,CAAA;AAGF,OAAO,EAAE,MAAM,EAAE,WAAW,EAAE,cAAc,EAAE,CAAA"}

package/dist/ui/avatar.js

@@ -1,12 +1,12 @@
 "use client";
-import { jsx as s, jsxs as R } from "react/jsx-runtime";
-import * as i from "react";
-import { F as y, J as N, K as k } from "../_chunks/primitives.js";
+import { jsx as a, jsxs as R } from "react/jsx-runtime";
+import * as l from "react";
+import { F as v, J as N, K as C } from "../_chunks/primitives.js";
 import { ag as F } from "../_chunks/vendor-utils.js";
-import { springs as C } from "./lib/motion.js";
+import { springs as k } from "./lib/motion.js";
 import { cn as r } from "./lib/utils.js";
 import { m as f } from "../_chunks/framer.js";
-const A = i.createContext("circle"), x = F(
+const A = l.createContext("circle"), M = l.createContext("md"), p = F(
   "relative flex shrink-0 overflow-hidden",
   {
     variants: {
@@ -35,7 +35,7 @@ const A = i.createContext("circle"), x = F(
   offline: "Offline",
   busy: "Busy",
   away: "Away"
-}, w = {
+}, y = {
   xs: "h-ds-02b w-ds-02b",
   sm: "h-[8px] w-[8px]",
   md: "h-ds-03 w-ds-03",
@@ -45,123 +45,130 @@ const A = i.createContext("circle"), x = F(
   lead: "ring-accent-7",
   admin: "ring-warning-7",
   client: "ring-info-7"
-}, S = {
+}, j = {
   circle: "rounded-ds-full",
   square: "rounded-ds-none",
   rounded: "rounded-ds-md"
-}, v = [
-  { bg: "bg-accent-2", text: "text-accent-11" },
-  { bg: "bg-success-2", text: "text-success-11" },
-  { bg: "bg-warning-2", text: "text-warning-11" },
-  { bg: "bg-error-2", text: "text-error-11" },
-  { bg: "bg-info-2", text: "text-info-11" },
-  { bg: "bg-cat-purple-2", text: "text-cat-purple-11" },
-  { bg: "bg-cat-pink-2", text: "text-cat-pink-11" },
-  { bg: "bg-cat-teal-2", text: "text-cat-teal-11" }
+}, q = {
+  xs: "text-[9px]",
+  sm: "text-ds-xs",
+  md: "text-ds-sm",
+  lg: "text-ds-md",
+  xl: "text-ds-lg"
+}, w = [
+  { bg: "bg-accent-3", text: "text-accent-11" },
+  { bg: "bg-success-3", text: "text-success-11" },
+  { bg: "bg-warning-3", text: "text-warning-11" },
+  { bg: "bg-error-3", text: "text-error-11" },
+  { bg: "bg-info-3", text: "text-info-11" },
+  { bg: "bg-category-teal-3", text: "text-category-teal-11" },
+  { bg: "bg-category-indigo-3", text: "text-category-indigo-11" },
+  { bg: "bg-category-cyan-3", text: "text-category-cyan-11" }
 ];
-function j(o) {
-  let a = 5381;
-  for (let e = 0; e < o.length; e++)
-    a = (a << 5) + a + o.charCodeAt(e) | 0;
-  const n = Math.abs(a) % v.length;
-  return v[n];
+function I(o) {
+  let e = 5381;
+  for (let t = 0; t < o.length; t++)
+    e = (e << 5) + e + o.charCodeAt(t) | 0;
+  const n = Math.abs(e) % w.length;
+  return w[n];
 }
-const q = i.forwardRef(({ className: o, size: a, shape: n, status: e, ring: l, badge: t, loading: g, children: d, ...c }, u) => {
-  const m = n ?? "circle", p = l && l !== "none" ? r("ring-2 ring-offset-2 ring-offset-surface-2", O[l], S[m]) : void 0;
-  if (g)
-    return /* @__PURE__ */ s("span", { ref: u, className: r("relative inline-flex shrink-0", p), children: /* @__PURE__ */ s(
+const L = l.forwardRef(({ className: o, size: e, shape: n, status: t, ring: i, badge: s, loading: x, children: d, ...c }, g) => {
+  const m = n ?? "circle", u = i && i !== "none" ? r("ring-2 ring-offset-2 ring-offset-surface-2", O[i], j[m]) : void 0;
+  if (x)
+    return /* @__PURE__ */ a("span", { ref: g, className: r("relative inline-flex shrink-0", u), children: /* @__PURE__ */ a(
       "span",
       {
-        className: r(x({ size: a, shape: n }), "animate-pulse bg-surface-3"),
+        className: r(p({ size: e, shape: n }), "animate-pulse bg-surface-3"),
         "data-slot": "avatar-skeleton"
       }
     ) });
-  const M = t !== void 0 && t !== 0;
-  return /* @__PURE__ */ s(A.Provider, { value: m, children: /* @__PURE__ */ R("span", { className: r("relative inline-flex shrink-0", p), children: [
-    /* @__PURE__ */ s(
-      y,
+  const S = s !== void 0 && s !== 0;
+  return /* @__PURE__ */ a(A.Provider, { value: m, children: /* @__PURE__ */ a(M.Provider, { value: e ?? "md", children: /* @__PURE__ */ R("span", { className: r("relative inline-flex shrink-0", u), children: [
+    /* @__PURE__ */ a(
+      v,
       {
-        ref: u,
-        className: r(x({ size: a, shape: n }), o),
+        ref: g,
+        className: r(p({ size: e, shape: n }), o),
         ...c,
         children: d
       }
     ),
-    e && (e === "online" ? /* @__PURE__ */ s(
+    t && (t === "online" ? /* @__PURE__ */ a(
       f.span,
       {
-        className: r("absolute bottom-0 right-0 rounded-ds-full ring-2 ring-surface-2", b[e], w[a ?? "md"]),
+        className: r("absolute bottom-0 right-0 rounded-ds-full ring-2 ring-surface-2", b[t], y[e ?? "md"]),
         animate: { opacity: [1, 0.75, 1] },
         transition: { duration: 2.5, repeat: 1 / 0, ease: "easeInOut" },
         role: "img",
-        "aria-label": h[e]
+        "aria-label": h[t]
       }
-    ) : /* @__PURE__ */ s("span", { className: r("absolute bottom-0 right-0 rounded-ds-full ring-2 ring-surface-2", b[e], w[a ?? "md"]), role: "img", "aria-label": h[e] })),
-    M && (t === "dot" ? /* @__PURE__ */ s(
+    ) : /* @__PURE__ */ a("span", { className: r("absolute bottom-0 right-0 rounded-ds-full ring-2 ring-surface-2", b[t], y[e ?? "md"]), role: "img", "aria-label": h[t] })),
+    S && (s === "dot" ? /* @__PURE__ */ a(
       "span",
       {
         className: "absolute -right-0.5 -top-0.5 h-[8px] w-[8px] rounded-ds-full bg-error-9 ring-2 ring-surface-2",
         "data-slot": "avatar-badge-dot",
         "aria-hidden": "true"
       }
-    ) : typeof t == "number" ? /* @__PURE__ */ s(
+    ) : typeof s == "number" ? /* @__PURE__ */ a(
       f.span,
       {
         initial: { scale: 0 },
         animate: { scale: 1 },
-        transition: C.bouncy,
+        transition: k.bouncy,
         className: "absolute -right-1 -top-1 flex min-w-[16px] items-center justify-center rounded-ds-full bg-error-9 px-1 text-[10px] font-bold leading-[16px] text-error-fg ring-2 ring-surface-2",
         "data-slot": "avatar-badge",
         role: "status",
-        "aria-label": `${t > 99 ? "99+" : t} notifications`,
-        children: t > 99 ? "99+" : t
+        "aria-label": `${s > 99 ? "99+" : s} notifications`,
+        children: s > 99 ? "99+" : s
       }
-    ) : /* @__PURE__ */ s("span", { className: "absolute -right-1 -top-1", "data-slot": "avatar-badge-custom", children: t }))
-  ] }) });
+    ) : /* @__PURE__ */ a("span", { className: "absolute -right-1 -top-1", "data-slot": "avatar-badge-custom", children: s }))
+  ] }) }) });
 });
-q.displayName = y.displayName;
-const I = i.forwardRef(({ className: o, ...a }, n) => /* @__PURE__ */ s(
+L.displayName = v.displayName;
+const B = l.forwardRef(({ className: o, ...e }, n) => /* @__PURE__ */ a(
   f.span,
   {
     initial: { opacity: 0, scale: 0.96 },
     animate: { opacity: 1, scale: 1 },
-    transition: C.smooth,
+    transition: k.smooth,
     className: "absolute inset-0 h-full w-full",
-    children: /* @__PURE__ */ s(
+    children: /* @__PURE__ */ a(
       N,
       {
         ref: n,
         className: r("aspect-square h-full w-full", o),
-        ...a
+        ...e
       }
     )
   }
 ));
-I.displayName = N.displayName;
-const L = i.forwardRef(({ className: o, colorSeed: a, children: n, ...e }, l) => {
-  const t = typeof n == "string" ? n : "", d = j(a ?? t), c = i.useContext(A), u = c === "square" ? "rounded-ds-none" : c === "rounded" ? "rounded-ds-md" : "rounded-ds-full", m = t.length === 1 ? "tracking-wide" : "tracking-normal";
-  return /* @__PURE__ */ s(
-    k,
+B.displayName = N.displayName;
+const z = l.forwardRef(({ className: o, colorSeed: e, children: n, ...t }, i) => {
+  const s = typeof n == "string" ? n : "", d = I(e ?? s), c = l.useContext(A), g = l.useContext(M), m = c === "square" ? "rounded-ds-none" : c === "rounded" ? "rounded-ds-md" : "rounded-ds-full", u = s.length === 1 ? "tracking-wide" : "tracking-normal";
+  return /* @__PURE__ */ a(
+    C,
     {
-      ref: l,
+      ref: i,
       "data-slot": "avatar-fallback",
       className: r(
-        "flex h-full w-full items-center justify-center",
-        u,
+        "flex h-full w-full items-center justify-center font-semibold",
+        m,
+        q[g],
         d.bg,
         d.text,
-        m,
+        u,
         o
       ),
-      ...e,
+      ...t,
       children: n
     }
   );
 });
-L.displayName = k.displayName;
+z.displayName = C.displayName;
 export {
-  q as Avatar,
-  L as AvatarFallback,
-  I as AvatarImage,
-  x as avatarVariants
+  L as Avatar,
+  z as AvatarFallback,
+  B as AvatarImage,
+  p as avatarVariants
 };

package/dist/ui/checkbox.js

@@ -30,7 +30,7 @@ const L = n.forwardRef(({ className: h, error: u, indeterminate: a, checked: s,
         "data-[state=unchecked]:hover:border-accent-7 data-[state=unchecked]:hover:bg-surface-4",
         "data-[state=checked]:bg-accent-9 data-[state=checked]:border-accent-7 data-[state=checked]:text-accent-fg",
         "data-[state=indeterminate]:bg-accent-9 data-[state=indeterminate]:border-accent-7 data-[state=indeterminate]:text-accent-fg",
-        u && "border-error-7 bg-error-2",
+        u && "border-error-7 bg-error-3",
         h
       ),
       ...m,

package/docs/components/composed/avatar-group.md

@@ -43,8 +43,13 @@
 - Missing `image` falls back to initials derived from `name`
 - Hover expand animation uses CSS `group-hover` — parent must not clip overflow
 - `borderColor` should match the surface context the group sits on (e.g., `surface-1` on cards)
+- `renderAvatar` wrapper is positioning-only — pass `size` directly to your Avatar (do NOT use `className="h-full w-full"`)
 
 ## Changes
+### v0.22.3
+- **Fixed** `renderAvatar` wrapper no longer clips consumer Avatar content (removed overflow-hidden, border, and size classes from wrapper)
+- **Fixed** Removed redundant text-size classes from wrapper — Avatar handles font scaling internally
+
 ### v0.21.0
 - **Added** `xs` and `xl` size variants
 - **Added** `borderColor` prop for overlap border matching surface context

package/docs/components/ui/avatar.md

@@ -34,11 +34,15 @@
 ## Gotchas
 - Status dot renders with role="img" and aria-label (accessible, not decorative)
 - Dot size scales automatically with avatar size
+- AvatarFallback font size scales automatically with avatar size (via AvatarSizeContext)
 - Ring offset color matches the surface context — ensure it sits on the expected background
 - Badge is hidden when value is `0` (falsy); use `"dot"` for presence without a count
 - Online status dot pulses with a CSS animation
 
 ## Changes
+### v0.22.3
+- **Fixed** AvatarFallback text now auto-scales with avatar size — xs gets `text-[9px]`, sm `text-ds-xs`, md `text-ds-sm`, lg `text-ds-md`, xl `text-ds-lg`
+
 ### v0.22.0
 - **Fixed** Fallback always rendered `rounded-ds-full` regardless of `shape` prop. Now uses `AvatarShapeContext` to inherit the correct border-radius from `shape="square"` or `shape="rounded"`.
 

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.2
+> Version: 0.22.3
 
 ---
 
@@ -353,11 +353,15 @@ Note: getFormFieldA11y() was removed in favor of useFormField() hook.
 ## Gotchas
 - Status dot renders with role="img" and aria-label (accessible, not decorative)
 - Dot size scales automatically with avatar size
+- AvatarFallback font size scales automatically with avatar size (via AvatarSizeContext)
 - Ring offset color matches the surface context — ensure it sits on the expected background
 - Badge is hidden when value is `0` (falsy); use `"dot"` for presence without a count
 - Online status dot pulses with a CSS animation
 
 ## Changes
+### v0.22.3
+- **Fixed** AvatarFallback text now auto-scales with avatar size — xs gets `text-[9px]`, sm `text-ds-xs`, md `text-ds-sm`, lg `text-ds-md`, xl `text-ds-lg`
+
 ### v0.22.0
 - **Fixed** Fallback always rendered `rounded-ds-full` regardless of `shape` prop. Now uses `AvatarShapeContext` to inherit the correct border-radius from `shape="square"` or `shape="rounded"`.
 
@@ -3042,8 +3046,13 @@ export default function RootLayout({ children }) {
 - Missing `image` falls back to initials derived from `name`
 - Hover expand animation uses CSS `group-hover` — parent must not clip overflow
 - `borderColor` should match the surface context the group sits on (e.g., `surface-1` on cards)
+- `renderAvatar` wrapper is positioning-only — pass `size` directly to your Avatar (do NOT use `className="h-full w-full"`)
 
 ## Changes
+### v0.22.3
+- **Fixed** `renderAvatar` wrapper no longer clips consumer Avatar content (removed overflow-hidden, border, and size classes from wrapper)
+- **Fixed** Removed redundant text-size classes from wrapper — Avatar handles font scaling internally
+
 ### v0.21.0
 - **Added** `xs` and `xl` size variants
 - **Added** `borderColor` prop for overlap border matching surface context

package/llms.txt

@@ -101,7 +101,9 @@
 
 **Tooltip**: Auto-wraps with `<TooltipProvider>` — no manual provider needed. Text color fixed for dark mode.
 
-**Avatar fallback**: Now respects `shape` prop (was always circle).
+**Avatar fallback**: Now respects `shape` prop (was always circle). Font size auto-scales with avatar size (v0.22.3).
+
+**AvatarGroup renderAvatar**: Wrapper is positioning-only — pass `size` directly to your Avatar, do NOT use `className="h-full w-full"` (v0.22.3).
 
 **New hover states**: Checkbox, Radio, Switch track, Select items, DropdownMenu items, Combobox trigger.
 

package/package.json

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