reaxify 0.0.97 → 1.2.0

package/dist/components/Alert/index.es.js

@@ -1,24 +1,27 @@
 "use client";
-import { jsx as a } from "react/jsx-runtime";
-import k from "../../helpers/cn.es.js";
-import d from "../../hooks/useClasses.es.js";
-import { createContext as A, useMemo as m } from "react";
-import { twMerge as l } from "../../node_modules/tailwind-merge/dist/bundle-mjs.es.js";
-import C from "../Fill/index.es.js";
-import N from "../Stack/index.es.js";
-import p from "../Typography/index.es.js";
-const v = A({});
-function g({
-  as: n,
-  variant: r = "solid",
-  color: o = "primary",
-  children: s,
-  className: i,
+import { jsx as d } from "react/jsx-runtime";
+import { useMemo as p, createContext as k, useContext as A, Children as C, isValidElement as v, cloneElement as N } from "react";
+import { twMerge as c } from "../../node_modules/tailwind-merge/dist/bundle-mjs.es.js";
+import P from "../Fill/index.es.js";
+import T from "../Stack/index.es.js";
+import y from "../Typography/index.es.js";
+import g from "../../hooks/useClasses.es.js";
+import j from "../../helpers/cn.es.js";
+const w = k({
+  variant: "solid",
+  color: "primary"
+});
+function u({
+  as: o,
+  variant: e = "solid",
+  color: n = "primary",
+  children: i,
+  className: a,
   ...t
 }) {
-  const e = d((c) => c.alert), x = m(() => {
-    var b, u, f;
-    const c = {
+  const r = g((s) => s.alert), m = p(() => {
+    var f, x, h;
+    const s = {
       primary: {
         solid: "bg-primary text-white border-primary",
         outline: "bg-transparent text-primary border-primary",
@@ -59,128 +62,141 @@ function g({
         outline: "bg-transparent text-dark border-light",
         soft: "bg-light text-dark border-light"
       }
-    }, y = (u = (b = e == null ? void 0 : e.color) == null ? void 0 : b[o]) == null ? void 0 : u[r], w = (f = c == null ? void 0 : c[o]) == null ? void 0 : f[r];
-    return l(w, y);
-  }, [o, r, e == null ? void 0 : e.color]), h = m(() => r === "solid" ? "solid" : "text", [r]);
-  return /* @__PURE__ */ a(
-    N,
+    }, b = (x = (f = r == null ? void 0 : r.color) == null ? void 0 : f[n]) == null ? void 0 : x[e], l = (h = s == null ? void 0 : s[n]) == null ? void 0 : h[e];
+    return c(l, b);
+  }, [n, e, r == null ? void 0 : r.color]);
+  return /* @__PURE__ */ d(
+    T,
     {
-      as: n,
-      className: k(
+      as: o,
+      role: "alert",
+      "data-name": "alert",
+      className: j(
         "w-full border rounded py-1.5 px-4 gap-3",
-        e == null ? void 0 : e.base,
-        x,
-        i
+        r == null ? void 0 : r.base,
+        m,
+        a
       ),
       ...t,
-      children: /* @__PURE__ */ a(v.Provider, { value: { color: o, buttonVariant: h }, children: s })
+      children: /* @__PURE__ */ d(w.Provider, { value: { variant: e, color: n }, children: i })
     }
   );
 }
-function T({
-  children: n,
-  className: r,
-  ...o
+function z({
+  children: o,
+  className: e,
+  ...n
 }) {
-  const s = d((i) => {
-    var t, e;
-    return (e = (t = i.alert) == null ? void 0 : t.icon) == null ? void 0 : e.base;
+  const i = g((a) => {
+    var t, r;
+    return (r = (t = a.alert) == null ? void 0 : t.icon) == null ? void 0 : r.base;
   });
-  return /* @__PURE__ */ a(
+  return /* @__PURE__ */ d(
     "div",
     {
-      className: l(
-        "flex flex-col py-2 items-start justify-start *:size-[1.375rem] *:text-current",
-        s,
-        r
+      "data-name": "alert-icon",
+      className: c(
+        "flex flex-col py-2 items-start justify-start *:size-5.5 *:text-current",
+        i,
+        e
       ),
-      ...o,
-      children: n
+      ...n,
+      children: o
     }
   );
 }
-function j({
-  children: n,
-  className: r,
-  ...o
+function D({
+  children: o,
+  className: e,
+  ...n
 }) {
-  const s = d((i) => {
+  const i = g((a) => {
     var t;
-    return (t = i.alert) == null ? void 0 : t.content.base;
+    return (t = a.alert) == null ? void 0 : t.content.base;
   });
-  return /* @__PURE__ */ a(
-    C,
+  return /* @__PURE__ */ d(
+    P,
     {
       as: "div",
-      className: l("py-2 space-y-0.5", s, r),
-      ...o,
-      children: n
+      "data-name": "alert-content",
+      className: c("py-2 space-y-0.5", i, e),
+      ...n,
+      children: o
     }
   );
 }
-function z({
-  children: n,
-  className: r,
-  ...o
+function E({
+  children: o,
+  className: e,
+  ...n
 }) {
-  const s = d((i) => {
+  const i = g((a) => {
     var t;
-    return (t = i.alert) == null ? void 0 : t.title.base;
+    return (t = a.alert) == null ? void 0 : t.title.base;
   });
-  return /* @__PURE__ */ a(
-    p,
+  return /* @__PURE__ */ d(
+    y,
     {
       as: "h6",
       variant: "body-1",
-      className: l("w-full -mt-px font-medium", s, r),
-      ...o,
-      children: n
+      "data-name": "alert-title",
+      className: c("w-full -mt-px font-medium", i, e),
+      ...n,
+      children: o
     }
   );
 }
-function D({
-  children: n,
-  className: r,
-  ...o
+function I({
+  children: o,
+  className: e,
+  ...n
 }) {
-  const s = d((i) => {
+  const i = g((a) => {
     var t;
-    return (t = i.alert) == null ? void 0 : t.description.base;
+    return (t = a.alert) == null ? void 0 : t.description.base;
   });
-  return /* @__PURE__ */ a(
-    p,
+  return /* @__PURE__ */ d(
+    y,
     {
       variant: "body-2",
-      className: l("w-full font-normal", s, r),
-      ...o,
-      children: n
+      "data-name": "alert-description",
+      className: c("w-full font-normal", i, e),
+      ...n,
+      children: o
     }
   );
 }
-function I({
-  children: n,
-  className: r,
-  ...o
+function M({
+  children: o,
+  className: e,
+  ...n
 }) {
-  const s = d((i) => {
-    var t, e;
-    return (e = (t = i.alert) == null ? void 0 : t.action) == null ? void 0 : e.base;
-  });
-  return /* @__PURE__ */ a(
+  const i = g((s) => {
+    var b, l;
+    return (l = (b = s.alert) == null ? void 0 : b.action) == null ? void 0 : l.base;
+  }), { variant: a, color: t } = A(w), r = p(() => a === "solid" ? "solid" : "text", [a]), m = p(() => C.map(o, (s) => {
+    if (!v(s)) return s;
+    const l = s.props;
+    return N(s, {
+      variant: l.variant ?? r,
+      color: l.color ?? t
+    });
+  }), [o, r, t]);
+  return /* @__PURE__ */ d(
     "div",
     {
-      className: l("self-center size-fit", s, r),
-      ...o,
-      children: n
+      "data-name": "alert-action",
+      className: c("self-center size-fit", i, e),
+      ...n,
+      children: m
     }
   );
 }
-g.Icon = T;
-g.Content = j;
-g.Title = z;
-g.Description = D;
-g.Action = I;
+u.Icon = z;
+u.Content = D;
+u.Title = E;
+u.Description = I;
+u.Action = M;
 export {
-  v as AlertContext,
-  g as default
+  u as default
 };

package/dist/components/Avatar/index.cjs.js

@@ -1 +1 @@
-"use client";"use strict";const c=require("react/jsx-runtime"),d=require("../../hooks/useClasses.cjs.js"),u=require("react"),g=require("../../node_modules/tailwind-merge/dist/bundle-mjs.cjs.js"),f=u.createContext({size:"md",isImageLoaded:null,setIsImageLoaded:()=>{}});function b({as:i,className:o,children:n,...e}){const t=d(a=>a.avatar.group.base),s=i||"div";return c.jsx(s,{className:g.twMerge("flex -space-x-2",t,o),...e,children:n})}function m({as:i,className:o,size:n="md",children:e,...t}){const s=d(x=>x.avatar),a=i||"div",[r,l]=u.useState(!1),v=u.useMemo(()=>{var z;if(!n)return null;const x={sm:"size-6 [&_svg]:size-3",md:"size-8 [&_svg]:size-4",lg:"size-10 [&_svg]:size-5"};return[x==null?void 0:x[n],(z=s==null?void 0:s.size)==null?void 0:z[n]]},[n,s==null?void 0:s.size]);return c.jsx(a,{className:g.twMerge("relative flex items-center justify-center bg-light ring-2 ring-light rounded-full select-none",s==null?void 0:s.base,v,o),...t,children:c.jsx(f.Provider,{value:{size:n,isImageLoaded:r,setIsImageLoaded:l},children:e})})}function j({src:i,alt:o,className:n,onLoad:e,...t}){const s=d(v=>v.avatar.image.base),{isImageLoaded:a,setIsImageLoaded:r}=u.useContext(f),l=v=>{r(!0),e==null||e(v)};return c.jsx("img",{src:i||void 0,alt:o||void 0,className:g.twMerge("aspect-square size-full rounded-full object-cover",a?"block":"hidden",s,n),onLoad:l,...t})}function C({className:i,children:o,...n}){const e=d(r=>r.avatar.fallback),{size:t,isImageLoaded:s}=u.useContext(f),a=u.useMemo(()=>{var l;if(!t)return null;const r={sm:"text-xs",md:"text-sm",lg:"text-sm"};return[r==null?void 0:r[t],(l=e==null?void 0:e.size)==null?void 0:l[t]]},[t,e==null?void 0:e.size]);return c.jsx("div",{className:g.twMerge("flex size-full items-center justify-center rounded-full text-dark",s?"hidden":"flex",e==null?void 0:e.base,a,i),...n,children:o})}function I({className:i,children:o,...n}){const e=d(a=>a.avatar.badge),{size:t}=u.useContext(f),s=u.useMemo(()=>{var r;if(!t)return null;const a={sm:"size-2 [&_svg]:hidden",md:"size-2.5 [&_svg]:size-2",lg:"size-3 [&_svg]:size-2"};return[a==null?void 0:a[t],(r=e==null?void 0:e.size)==null?void 0:r[t]]},[t,e==null?void 0:e.size]);return c.jsx("span",{className:g.twMerge("absolute right-0 bottom-0 bg-success z-10 inline-flex items-center justify-center rounded-full ring-2 ring-light",e==null?void 0:e.base,s,i),...n,children:o})}function p({className:i,children:o,...n}){const e=d(t=>t.avatar.count.base);return c.jsx("span",{className:g.twMerge("text-sm text-dark font-medium",e,i),...n,children:o})}m.Group=b;m.Image=j;m.Fallback=C;m.Badge=I;m.Count=p;module.exports=m;
+"use client";"use strict";const d=require("react/jsx-runtime"),u=require("react"),c=require("../../node_modules/tailwind-merge/dist/bundle-mjs.cjs.js"),m=require("../../hooks/useClasses.cjs.js"),x=u.createContext({size:"md",isImageLoaded:null,setIsImageLoaded:()=>{}});function z({as:r,className:o,children:n,...e}){const t=m(s=>s.avatar.group.base),a=r||"div";return d.jsx(a,{"data-name":"avatar-group",className:c.twMerge("flex -space-x-2",t,o),...e,children:n})}function g({as:r,className:o,size:n="md",children:e,...t}){const a=m(f=>f.avatar),s=r||"div",[i,l]=u.useState(!1),v=u.useMemo(()=>{var b;if(!n)return null;const f={sm:"size-6",md:"size-8",lg:"size-10"};return[f==null?void 0:f[n],(b=a==null?void 0:a.size)==null?void 0:b[n]]},[n,a==null?void 0:a.size]);return d.jsx(s,{"data-name":"avatar",className:c.twMerge("relative flex items-center justify-center bg-light ring-2 ring-light rounded-full select-none",a==null?void 0:a.base,v,o),...t,children:d.jsx(x.Provider,{value:{size:n,isImageLoaded:i,setIsImageLoaded:l},children:e})})}function j({src:r,alt:o,className:n,onLoad:e,...t}){const a=m(v=>v.avatar.image.base),{isImageLoaded:s,setIsImageLoaded:i}=u.useContext(x),l=v=>{i(!0),e==null||e(v)};return r?d.jsx("img",{src:r||void 0,alt:o||void 0,role:"img","data-name":"avatar-image",className:c.twMerge("aspect-square size-full rounded-full object-cover",s?"block":"hidden",a,n),onLoad:l,...t}):null}function C({className:r,children:o,...n}){const e=m(i=>i.avatar.fallback),{size:t,isImageLoaded:a}=u.useContext(x),s=u.useMemo(()=>{var l;if(!t)return null;const i={sm:"text-xs [&_svg]:size-3",md:"text-sm [&_svg]:size-4",lg:"text-sm [&_svg]:size-5"};return[i==null?void 0:i[t],(l=e==null?void 0:e.size)==null?void 0:l[t]]},[t,e==null?void 0:e.size]);return d.jsx("div",{"data-name":"avatar-fallback",className:c.twMerge("flex size-full items-center justify-center rounded-full text-dark",a?"hidden":"flex",e==null?void 0:e.base,s,r),...n,children:o})}function I({className:r,children:o,...n}){const e=m(s=>s.avatar.badge),{size:t}=u.useContext(x),a=u.useMemo(()=>{var i;if(!t)return null;const s={sm:"size-2 [&_svg]:hidden",md:"size-2.5 [&_svg]:size-2",lg:"size-3 [&_svg]:size-2"};return[s==null?void 0:s[t],(i=e==null?void 0:e.size)==null?void 0:i[t]]},[t,e==null?void 0:e.size]);return d.jsx("span",{"data-name":"avatar-badge",className:c.twMerge("absolute inset-e-0 bottom-0 bg-success z-10 inline-flex items-center justify-center rounded-full ring-2 ring-light",e==null?void 0:e.base,a,r),...n,children:o})}function p({className:r,children:o,...n}){const e=m(t=>t.avatar.count.base);return d.jsx("span",{"data-name":"avatar-count",className:c.twMerge("text-sm text-dark font-medium",e,r),...n,children:o})}g.Group=z;g.Image=j;g.Fallback=C;g.Badge=I;g.Count=p;module.exports=g;

package/dist/components/Avatar/index.d.ts

@@ -17,7 +17,7 @@ declare namespace Avatar {
     var Badge: typeof AvatarBadge;
     var Count: typeof AvatarCount;
 }
-declare function AvatarImage({ src, alt, className, onLoad, ...props }: ComponentPropsWithoutAs<"img", AvatarImageProps>): import("react/jsx-runtime").JSX.Element;
+declare function AvatarImage({ src, alt, className, onLoad, ...props }: ComponentPropsWithoutAs<"img", AvatarImageProps>): import("react/jsx-runtime").JSX.Element | null;
 declare function AvatarFallback({ className, children, ...props }: ComponentPropsWithoutAs<"div">): import("react/jsx-runtime").JSX.Element;
 declare function AvatarBadge({ className, children, ...props }: ComponentPropsWithoutAs<"span">): import("react/jsx-runtime").JSX.Element;
 declare function AvatarCount({ className, children, ...props }: ComponentPropsWithoutAs<"span">): import("react/jsx-runtime").JSX.Element;

package/dist/components/Avatar/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Avatar/index.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,oBAAoB,EAAE,uBAAuB,EAAE,IAAI,EAAE,MAAM,SAAS,CAAC;AAC9E,OAAO,EAGL,WAAW,EAKZ,MAAM,OAAO,CAAC;AAQf,KAAK,WAAW,GAAG;IACjB,IAAI,CAAC,EAAE,IAAI,CAAC;CACb,CAAC;AACF,KAAK,gBAAgB,GAAG;IACtB,GAAG,EAAE,MAAM,GAAG,IAAI,GAAG,SAAS,CAAC;IAC/B,GAAG,EAAE,MAAM,GAAG,IAAI,GAAG,SAAS,CAAC;IAC/B,OAAO,CAAC,EAAE,KAAK,CAAC;CACjB,CAAC;AAWF,iBAAS,WAAW,CAAC,CAAC,SAAS,WAAW,GAAG,KAAK,EAAE,EAClD,EAAE,EACF,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,oBAAoB,CAAC,CAAC,CAAC,2CAWzB;AACD,iBAAS,MAAM,CAAC,CAAC,SAAS,WAAW,GAAG,KAAK,EAAE,EAC7C,EAAE,EACF,SAAS,EACT,IAAW,EACX,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,oBAAoB,CAAC,CAAC,EAAE,WAAW,CAAC,2CA4BtC;kBAlCQ,MAAM;;;;;;;AAmCf,iBAAS,WAAW,CAAC,EACnB,GAAG,EACH,GAAG,EACH,SAAS,EACT,MAAM,EACN,GAAG,KAAK,EACT,EAAE,uBAAuB,CAAC,KAAK,EAAE,gBAAgB,CAAC,2CAqBlD;AACD,iBAAS,cAAc,CAAC,EACtB,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,uBAAuB,CAAC,KAAK,CAAC,2CA0BhC;AACD,iBAAS,WAAW,CAAC,EACnB,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,uBAAuB,CAAC,MAAM,CAAC,2CAyBjC;AACD,iBAAS,WAAW,CAAC,EACnB,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,uBAAuB,CAAC,MAAM,CAAC,2CAUjC;AAQD,eAAe,MAAM,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Avatar/index.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,oBAAoB,EAAE,uBAAuB,EAAE,IAAI,EAAE,MAAM,SAAS,CAAC;AAC9E,OAAO,EAGL,WAAW,EAKZ,MAAM,OAAO,CAAC;AAQf,KAAK,WAAW,GAAG;IACjB,IAAI,CAAC,EAAE,IAAI,CAAC;CACb,CAAC;AACF,KAAK,gBAAgB,GAAG;IACtB,GAAG,EAAE,MAAM,GAAG,IAAI,GAAG,SAAS,CAAC;IAC/B,GAAG,EAAE,MAAM,GAAG,IAAI,GAAG,SAAS,CAAC;IAC/B,OAAO,CAAC,EAAE,KAAK,CAAC;CACjB,CAAC;AAWF,iBAAS,WAAW,CAAC,CAAC,SAAS,WAAW,GAAG,KAAK,EAAE,EAClD,EAAE,EACF,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,oBAAoB,CAAC,CAAC,CAAC,2CAYzB;AACD,iBAAS,MAAM,CAAC,CAAC,SAAS,WAAW,GAAG,KAAK,EAAE,EAC7C,EAAE,EACF,SAAS,EACT,IAAW,EACX,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,oBAAoB,CAAC,CAAC,EAAE,WAAW,CAAC,2CA6BtC;kBAnCQ,MAAM;;;;;;;AAoCf,iBAAS,WAAW,CAAC,EACnB,GAAG,EACH,GAAG,EACH,SAAS,EACT,MAAM,EACN,GAAG,KAAK,EACT,EAAE,uBAAuB,CAAC,KAAK,EAAE,gBAAgB,CAAC,kDAwBlD;AACD,iBAAS,cAAc,CAAC,EACtB,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,uBAAuB,CAAC,KAAK,CAAC,2CA2BhC;AACD,iBAAS,WAAW,CAAC,EACnB,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,uBAAuB,CAAC,MAAM,CAAC,2CA0BjC;AACD,iBAAS,WAAW,CAAC,EACnB,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,uBAAuB,CAAC,MAAM,CAAC,2CAWjC;AAQD,eAAe,MAAM,CAAC"}

package/dist/components/Avatar/index.es.js

@@ -1,166 +1,173 @@
 "use client";
 import { jsx as u } from "react/jsx-runtime";
-import d from "../../hooks/useClasses.es.js";
-import { createContext as p, useState as C, useMemo as z, useContext as x } from "react";
-import { twMerge as m } from "../../node_modules/tailwind-merge/dist/bundle-mjs.es.js";
-const v = p({
+import { useState as p, useMemo as z, createContext as C, useContext as b } from "react";
+import { twMerge as d } from "../../node_modules/tailwind-merge/dist/bundle-mjs.es.js";
+import l from "../../hooks/useClasses.es.js";
+const f = C({
   size: "md",
   isImageLoaded: null,
   setIsImageLoaded: () => {
   }
 });
 function I({
-  as: o,
+  as: s,
   className: i,
-  children: a,
+  children: n,
   ...e
 }) {
-  const t = d((s) => s.avatar.group.base);
+  const t = l((r) => r.avatar.group.base);
   return /* @__PURE__ */ u(
-    o || "div",
+    s || "div",
     {
-      className: m("flex -space-x-2", t, i),
+      "data-name": "avatar-group",
+      className: d("flex -space-x-2", t, i),
       ...e,
-      children: a
+      children: n
     }
   );
 }
-function f({
-  as: o,
+function v({
+  as: s,
   className: i,
-  size: a = "md",
+  size: n = "md",
   children: e,
   ...t
 }) {
-  const n = d((g) => g.avatar), s = o || "div", [r, l] = C(!1), c = z(() => {
-    var b;
-    if (!a) return null;
+  const a = l((g) => g.avatar), r = s || "div", [o, m] = p(!1), c = z(() => {
+    var x;
+    if (!n) return null;
     const g = {
-      sm: "size-6 [&_svg]:size-3",
-      md: "size-8 [&_svg]:size-4",
-      lg: "size-10 [&_svg]:size-5"
+      sm: "size-6",
+      md: "size-8",
+      lg: "size-10"
     };
-    return [g == null ? void 0 : g[a], (b = n == null ? void 0 : n.size) == null ? void 0 : b[a]];
-  }, [a, n == null ? void 0 : n.size]);
+    return [g == null ? void 0 : g[n], (x = a == null ? void 0 : a.size) == null ? void 0 : x[n]];
+  }, [n, a == null ? void 0 : a.size]);
   return /* @__PURE__ */ u(
-    s,
+    r,
     {
-      className: m(
+      "data-name": "avatar",
+      className: d(
         "relative flex items-center justify-center bg-light ring-2 ring-light rounded-full select-none",
-        n == null ? void 0 : n.base,
+        a == null ? void 0 : a.base,
         c,
         i
       ),
       ...t,
-      children: /* @__PURE__ */ u(v.Provider, { value: { size: a, isImageLoaded: r, setIsImageLoaded: l }, children: e })
+      children: /* @__PURE__ */ u(f.Provider, { value: { size: n, isImageLoaded: o, setIsImageLoaded: m }, children: e })
     }
   );
 }
 function h({
-  src: o,
+  src: s,
   alt: i,
-  className: a,
+  className: n,
   onLoad: e,
   ...t
 }) {
-  const n = d((c) => c.avatar.image.base), { isImageLoaded: s, setIsImageLoaded: r } = x(v), l = (c) => {
-    r(!0), e == null || e(c);
+  const a = l((c) => c.avatar.image.base), { isImageLoaded: r, setIsImageLoaded: o } = b(f), m = (c) => {
+    o(!0), e == null || e(c);
   };
-  return /* @__PURE__ */ u(
+  return s ? /* @__PURE__ */ u(
     "img",
     {
-      src: o || void 0,
+      src: s || void 0,
       alt: i || void 0,
-      className: m(
+      role: "img",
+      "data-name": "avatar-image",
+      className: d(
         "aspect-square size-full rounded-full object-cover",
-        s ? "block" : "hidden",
-        n,
-        a
+        r ? "block" : "hidden",
+        a,
+        n
       ),
-      onLoad: l,
+      onLoad: m,
       ...t
     }
-  );
+  ) : null;
 }
-function A({
-  className: o,
+function k({
+  className: s,
   children: i,
-  ...a
+  ...n
 }) {
-  const e = d((r) => r.avatar.fallback), { size: t, isImageLoaded: n } = x(v), s = z(() => {
-    var l;
+  const e = l((o) => o.avatar.fallback), { size: t, isImageLoaded: a } = b(f), r = z(() => {
+    var m;
     if (!t) return null;
-    const r = {
-      sm: "text-xs",
-      md: "text-sm",
-      lg: "text-sm"
+    const o = {
+      sm: "text-xs [&_svg]:size-3",
+      md: "text-sm [&_svg]:size-4",
+      lg: "text-sm [&_svg]:size-5"
     };
-    return [r == null ? void 0 : r[t], (l = e == null ? void 0 : e.size) == null ? void 0 : l[t]];
+    return [o == null ? void 0 : o[t], (m = e == null ? void 0 : e.size) == null ? void 0 : m[t]];
   }, [t, e == null ? void 0 : e.size]);
   return /* @__PURE__ */ u(
     "div",
     {
-      className: m(
+      "data-name": "avatar-fallback",
+      className: d(
         "flex size-full items-center justify-center rounded-full text-dark",
-        n ? "hidden" : "flex",
+        a ? "hidden" : "flex",
         e == null ? void 0 : e.base,
-        s,
-        o
+        r,
+        s
       ),
-      ...a,
+      ...n,
       children: i
     }
   );
 }
-function k({
-  className: o,
+function A({
+  className: s,
   children: i,
-  ...a
+  ...n
 }) {
-  const e = d((s) => s.avatar.badge), { size: t } = x(v), n = z(() => {
-    var r;
+  const e = l((r) => r.avatar.badge), { size: t } = b(f), a = z(() => {
+    var o;
     if (!t) return null;
-    const s = {
+    const r = {
       sm: "size-2 [&_svg]:hidden",
       md: "size-2.5 [&_svg]:size-2",
       lg: "size-3 [&_svg]:size-2"
     };
-    return [s == null ? void 0 : s[t], (r = e == null ? void 0 : e.size) == null ? void 0 : r[t]];
+    return [r == null ? void 0 : r[t], (o = e == null ? void 0 : e.size) == null ? void 0 : o[t]];
   }, [t, e == null ? void 0 : e.size]);
   return /* @__PURE__ */ u(
     "span",
     {
-      className: m(
-        "absolute right-0 bottom-0 bg-success z-10 inline-flex items-center justify-center rounded-full ring-2 ring-light",
+      "data-name": "avatar-badge",
+      className: d(
+        "absolute inset-e-0 bottom-0 bg-success z-10 inline-flex items-center justify-center rounded-full ring-2 ring-light",
         e == null ? void 0 : e.base,
-        n,
-        o
+        a,
+        s
       ),
-      ...a,
+      ...n,
       children: i
     }
   );
 }
 function N({
-  className: o,
+  className: s,
   children: i,
-  ...a
+  ...n
 }) {
-  const e = d((t) => t.avatar.count.base);
+  const e = l((t) => t.avatar.count.base);
   return /* @__PURE__ */ u(
     "span",
     {
-      className: m("text-sm text-dark font-medium", e, o),
-      ...a,
+      "data-name": "avatar-count",
+      className: d("text-sm text-dark font-medium", e, s),
+      ...n,
       children: i
     }
   );
 }
-f.Group = I;
-f.Image = h;
-f.Fallback = A;
-f.Badge = k;
-f.Count = N;
+v.Group = I;
+v.Image = h;
+v.Fallback = k;
+v.Badge = A;
+v.Count = N;
 export {
-  f as default
+  v as default
 };

package/dist/components/Badge/index.cjs.js

@@ -1 +1 @@
-"use client";"use strict";const y=require("react/jsx-runtime"),a=require("../../helpers/cn.cjs.js"),w=require("../../hooks/useClasses.cjs.js"),l=require("react"),k=require("../../node_modules/tailwind-merge/dist/bundle-mjs.cjs.js");function q({as:u,variant:d="solid",color:n="primary",size:s="md",className:x,children:c,...p}){const r=w(e=>e.badge),h=u||"span",m=l.useMemo(()=>{var t,g,b;if(!n)return"border-transparent";const e={primary:{solid:"bg-primary text-white border-primary",outline:"bg-transparent text-primary border-primary",soft:"bg-light-primary text-dark-primary border-light-primary"},secondary:{solid:"bg-secondary text-white border-secondary",outline:"bg-transparent text-secondary border-secondary",soft:"bg-light-secondary text-dark-secondary border-light-secondary"},success:{solid:"bg-success text-white border-success",outline:"bg-transparent text-success border-success",soft:"bg-light-success text-dark-success border-light-success"},info:{solid:"bg-info text-white border-info",outline:"bg-transparent text-info border-info",soft:"bg-light-info text-dark-info border-light-info"},warning:{solid:"bg-warning text-white border-warning",outline:"bg-transparent text-warning border-warning",soft:"bg-light-warning text-dark-warning border-light-warning"},danger:{solid:"bg-danger text-white border-danger",outline:"bg-transparent text-danger border-danger",soft:"bg-light-danger text-dark-danger border-light-danger"},dark:{solid:"bg-dark text-white border-dark",outline:"bg-transparent text-dark border-dark",soft:"bg-dark text-white border-dark"},light:{solid:"bg-light text-dark border-light",outline:"bg-transparent text-dark border-light",soft:"bg-light text-dark border-light"}},o=(t=e==null?void 0:e[n])==null?void 0:t[d],i=(b=(g=r==null?void 0:r.color)==null?void 0:g[n])==null?void 0:b[d];return[o,i]},[n,d,r==null?void 0:r.color]),f=l.useMemo(()=>{var o,i,t;if(!s)return null;const e={sm:a("text-xs py-0.5 px-1.5",(o=r==null?void 0:r.size)==null?void 0:o.sm),md:a("text-sm py-[0.1875rem] px-2",(i=r==null?void 0:r.size)==null?void 0:i.md),lg:a("text-base py-1 px-3",(t=r==null?void 0:r.size)==null?void 0:t.lg)};return e==null?void 0:e[s]},[s,r==null?void 0:r.size]);return y.jsx(h,{className:k.twMerge("inline-flex border border-border items-center text-center font-medium align-middle whitespace-nowrap rounded",r==null?void 0:r.base,m,f,x),...p,children:c})}module.exports=q;
+"use client";"use strict";const f=require("react/jsx-runtime"),b=require("react"),y=require("../../node_modules/tailwind-merge/dist/bundle-mjs.cjs.js"),w=require("../../hooks/useClasses.cjs.js");function k({as:l,variant:o="solid",color:i="primary",size:n="md",className:c,children:u,...x}){const r=w(e=>e.badge),p=l||"span",h=b.useMemo(()=>{var t,a,g;const e={primary:{solid:"bg-primary text-white border-primary",outline:"bg-transparent text-primary border-primary",soft:"bg-light-primary text-dark-primary border-light-primary"},secondary:{solid:"bg-secondary text-white border-secondary",outline:"bg-transparent text-secondary border-secondary",soft:"bg-light-secondary text-dark-secondary border-light-secondary"},success:{solid:"bg-success text-white border-success",outline:"bg-transparent text-success border-success",soft:"bg-light-success text-dark-success border-light-success"},info:{solid:"bg-info text-white border-info",outline:"bg-transparent text-info border-info",soft:"bg-light-info text-dark-info border-light-info"},warning:{solid:"bg-warning text-white border-warning",outline:"bg-transparent text-warning border-warning",soft:"bg-light-warning text-dark-warning border-light-warning"},danger:{solid:"bg-danger text-white border-danger",outline:"bg-transparent text-danger border-danger",soft:"bg-light-danger text-dark-danger border-light-danger"},dark:{solid:"bg-dark text-white border-dark",outline:"bg-transparent text-dark border-dark",soft:"bg-dark text-white border-dark"},light:{solid:"bg-light text-dark border-light",outline:"bg-transparent text-dark border-light",soft:"bg-light text-dark border-light"}},s=(t=e==null?void 0:e[i])==null?void 0:t[o],d=(g=(a=r==null?void 0:r.color)==null?void 0:a[i])==null?void 0:g[o];return[s,d]},[i,o,r==null?void 0:r.color]),m=b.useMemo(()=>{var t;if(!n)return null;const e={sm:"text-xs py-0.5 px-1.5",md:"text-sm py-[0.1875rem] px-2",lg:"text-base py-1 px-3"},s=e==null?void 0:e[n],d=(t=r==null?void 0:r.size)==null?void 0:t[n];return[s,d]},[n,r==null?void 0:r.size]);return f.jsx(p,{"data-name":"badge",className:y.twMerge("inline-flex border border-border items-center text-center font-medium align-middle whitespace-nowrap rounded",r==null?void 0:r.base,h,m,c),...x,children:u})}module.exports=k;

package/dist/components/Badge/index.d.ts

@@ -2,7 +2,7 @@ import { BadgeVariant, Color, ComponentPropsWithAs, Size } from '../../types';
 import { ElementType } from 'react';
 type BadgeProps = {
     variant?: BadgeVariant;
-    color?: Color | null;
+    color?: Color;
     size?: Size;
 };
 export default function Badge<E extends ElementType = "span">({ as, variant, color, size, className, children, ...props }: ComponentPropsWithAs<E, BadgeProps>): import("react/jsx-runtime").JSX.Element;

package/dist/components/Badge/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Badge/index.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,YAAY,EAAE,KAAK,EAAE,oBAAoB,EAAE,IAAI,EAAE,MAAM,SAAS,CAAC;AAC1E,OAAO,EAAE,WAAW,EAAW,MAAM,OAAO,CAAC;AAG7C,KAAK,UAAU,GAAG;IAChB,OAAO,CAAC,EAAE,YAAY,CAAC;IACvB,KAAK,CAAC,EAAE,KAAK,GAAG,IAAI,CAAC;IACrB,IAAI,CAAC,EAAE,IAAI,CAAC;CACb,CAAC;AAUF,MAAM,CAAC,OAAO,UAAU,KAAK,CAAC,CAAC,SAAS,WAAW,GAAG,MAAM,EAAE,EAC5D,EAAE,EACF,OAAiB,EACjB,KAAiB,EACjB,IAAW,EACX,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,oBAAoB,CAAC,CAAC,EAAE,UAAU,CAAC,2CA0ErC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Badge/index.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAE,KAAK,EAAE,oBAAoB,EAAE,IAAI,EAAE,MAAM,SAAS,CAAC;AAC1E,OAAO,EAAE,WAAW,EAAW,MAAM,OAAO,CAAC;AAG7C,KAAK,UAAU,GAAG;IAChB,OAAO,CAAC,EAAE,YAAY,CAAC;IACvB,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,IAAI,CAAC,EAAE,IAAI,CAAC;CACb,CAAC;AAUF,MAAM,CAAC,OAAO,UAAU,KAAK,CAAC,CAAC,SAAS,WAAW,GAAG,MAAM,EAAE,EAC5D,EAAE,EACF,OAAiB,EACjB,KAAiB,EACjB,IAAW,EACX,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,oBAAoB,CAAC,CAAC,EAAE,UAAU,CAAC,2CA4ErC"}