@vjdesigns/vjdesigns-ui 2.4.0 → 3.0.0

package/dist/components/data-display/Accordion/Accordion.cjs.js

@@ -1 +1 @@
-const e=require("../../../hooks/useControllableState.cjs.js"),t=require("../../../hooks/useMergedRef.cjs.js"),n=require("../../../utils/cx.cjs.js"),r=require("../../primitives/Icon/icons.cjs.js"),i=require("./Accordion.module.css.cjs.js");let a=require("react"),o=require("react/jsx-runtime"),s=require("react-dom");var c=6,l={separated:i.default.separated,contained:i.default.contained,flush:i.default.flush},u={sm:i.default.sm,md:i.default.md,lg:i.default.lg},d={start:i.default.iconStart,end:i.default.iconEnd},f={sm:`sm`,md:`md`,lg:`md`},p=(0,a.createContext)(null);function m(e){let t=(0,a.useContext)(p);if(!t)throw Error(`<${e}> must be used inside <Accordion>.`);return t}var h=(0,a.createContext)(null);function g(e){let t=(0,a.useContext)(h);if(!t)throw Error(`<${e}> must be used inside <Accordion.Item>.`);return t}var _=e=>Array.isArray(e)?e:e==null?[]:[e],v=r=>{let{type:s=`single`,collapsible:c=!0,value:f,defaultValue:m,onValueChange:h,variant:g=`separated`,size:v=`md`,headingLevel:y=3,icon:b=`chevron`,iconPosition:x=`end`,keyboardNavigation:S=!0,regionRole:C=`auto`,forceMount:w=!1,hiddenUntilFound:T=!1,disabled:E=!1,className:D,children:O,ref:k,...A}=r,j=s===`multiple`,[M,N]=e.useControllableState({value:f,defaultValue:m??(j?[]:null),onChange:h}),P=(0,a.useMemo)(()=>_(M),[M]),F=(0,a.useCallback)((e,t)=>{N(n=>{let r=_(n);return t===r.includes(e)?n:j?t?[...r,e]:r.filter(t=>t!==e):t?e:c?null:n})},[N,j,c]),I=(0,a.useCallback)(e=>F(e,!P.includes(e)),[F,P]),[L,R]=(0,a.useState)(0),z=(0,a.useCallback)(()=>(R(e=>e+1),()=>R(e=>e-1)),[]),B=C===`auto`?L<=6:C,V=(0,a.useRef)(null),H=t.useMergedRef(k,V),U=(0,a.useMemo)(()=>({rootRef:V,openValues:P,multiple:j,collapsible:j?!0:c,disabled:E,headingLevel:y,size:v,icon:b,iconPosition:x,keyboardNavigation:S,isRegion:B,forceMount:w,hiddenUntilFound:T,toggle:I,setItemOpen:F,registerItem:z}),[P,j,c,E,y,v,b,x,S,B,w,T,I,F,z]);return(0,o.jsx)(p.Provider,{value:U,children:(0,o.jsx)(`div`,{...A,ref:H,"data-accordion-root":``,"data-orientation":`vertical`,className:n.cx(i.default.root,l[g],u[v],d[x],D),children:O})})},y=({value:e,disabled:t=!1,headingLevel:r,className:s,children:c,...l})=>{let u=m(`Accordion.Item`),d=(0,a.useId)(),[f,p]=(0,a.useState)(),[g,_]=(0,a.useState)(),{registerItem:v}=u;(0,a.useLayoutEffect)(()=>v(),[v]);let y=u.openValues.includes(e),b=u.disabled||t,x=(0,a.useMemo)(()=>({value:e,open:y,disabled:b,headingLevel:r??u.headingLevel,triggerId:f??`${d}-trigger`,contentId:g??`${d}-content`,setTriggerId:p,setContentId:_}),[e,y,b,r,u.headingLevel,f,g,d]);return(0,o.jsx)(h.Provider,{value:x,children:(0,o.jsx)(`div`,{...l,"data-state":y?`open`:`closed`,"data-disabled":b?``:void 0,className:n.cx(i.default.item,s),children:c})})},b=({size:e})=>(0,o.jsx)(r.ChevronDownIcon,{size:e,className:i.default.rotating}),x=({size:e})=>(0,o.jsxs)(`span`,{className:i.default.plusMinus,children:[(0,o.jsx)(r.PlusIcon,{size:e,className:i.default.plus}),(0,o.jsx)(r.MinusIcon,{size:e,className:i.default.minus})]}),S=({children:e,description:t,startIcon:r,badge:s,headingClassName:c,className:l,id:u,onClick:d,onKeyDown:p,disabled:h,..._})=>{let v=m(`Accordion.Trigger`),y=g(`Accordion.Trigger`),S=(0,a.useId)(),C=`${S}-title`,w=`${S}-description`,T=`${S}-badge`,{setTriggerId:E}=y;(0,a.useLayoutEffect)(()=>{E(u)},[u,E]);let D=y.disabled||!!h,O=y.open&&!v.collapsible,k=e=>{d?.(e),!(e.defaultPrevented||D||O)&&v.toggle(y.value)},A=e=>{if(p?.(e),e.defaultPrevented||!v.keyboardNavigation||e.altKey||e.ctrlKey||e.metaKey||e.shiftKey)return;let t=v.rootRef.current;if(!t)return;let n=Array.from(t.querySelectorAll(`[data-accordion-trigger]`)).filter(e=>e.closest(`[data-accordion-root]`)===t&&!e.disabled),r=n.indexOf(e.currentTarget);if(r===-1||n.length===0)return;let i=null;switch(e.key){case`ArrowDown`:i=(r+1)%n.length;break;case`ArrowUp`:i=(r-1+n.length)%n.length;break;case`Home`:i=0;break;case`End`:i=n.length-1;break;default:return}e.preventDefault(),n[i]?.focus()},j=f[v.size],{icon:M}=v,N=null;M===`chevron`?N=(0,o.jsx)(b,{size:j}):M===`plus-minus`?N=(0,o.jsx)(x,{size:j}):typeof M==`function`?N=M({open:y.open,disabled:D}):(0,a.isValidElement)(M)&&(N=(0,o.jsx)(`span`,{className:i.default.rotating,children:M}));let P=M===`none`||N==null?null:(0,o.jsx)(`span`,{className:i.default.indicator,"aria-hidden":`true`,children:N}),F=s!=null&&s!==!1,I=t!=null&&t!==!1&&t!==``,L=`h${y.headingLevel}`;return(0,o.jsx)(L,{className:n.cx(i.default.heading,c),children:(0,o.jsxs)(`button`,{"aria-labelledby":F?`${C} ${T}`:C,"aria-describedby":I?w:void 0,..._,type:`button`,id:y.triggerId,"data-accordion-trigger":``,"data-state":y.open?`open`:`closed`,"data-disabled":D?``:void 0,"aria-expanded":y.open,"aria-controls":y.contentId,"aria-disabled":O&&!D?!0:void 0,disabled:D,className:n.cx(i.default.trigger,O&&i.default.locked,l),onClick:k,onKeyDown:A,children:[v.iconPosition===`start`&&P,r!=null&&(0,o.jsx)(`span`,{className:i.default.startIcon,"aria-hidden":`true`,children:r}),(0,o.jsxs)(`span`,{className:i.default.text,children:[(0,o.jsx)(`span`,{id:C,className:i.default.title,children:e}),I&&(0,o.jsx)(`span`,{id:w,className:i.default.description,children:t})]}),F&&(0,o.jsx)(`span`,{id:T,className:i.default.badge,children:s}),v.iconPosition===`end`&&P]})})};function C(e){let t=getComputedStyle(e),n=e=>e.split(`,`).map(e=>{let t=parseFloat(e);return Number.isNaN(t)?0:e.trim().endsWith(`ms`)?t:t*1e3}),r=n(t.transitionDuration),i=n(t.transitionDelay);return Math.max(0,...r.map((e,t)=>e+(i[t]??i[0]??0)))}var w=()=>typeof document<`u`&&!!document.body&&`onbeforematch`in document.body,T=({forceMount:e,hiddenUntilFound:r,bodyClassName:c,className:l,children:u,id:d,ref:f,...p})=>{let h=m(`Accordion.Content`),_=g(`Accordion.Content`),v=e??h.forceMount,y=r??h.hiddenUntilFound,{setContentId:b}=_;(0,a.useLayoutEffect)(()=>{b(d)},[d,b]);let x=_.open,S=(0,a.useRef)(null),T=t.useMergedRef(f,S),[E,D]=(0,a.useState)(x),[O,k]=(0,a.useState)(x),[A,j]=(0,a.useState)(!1),M=(0,a.useRef)(!1);(0,a.useLayoutEffect)(()=>{if(x){if(M.current){M.current=!1,j(!0),D(!0),k(!0);return}if(!E){D(!0);return}O||(S.current?.getBoundingClientRect(),k(!0))}else O&&k(!1)},[x,E,O]),(0,a.useEffect)(()=>{if(x||O||!E)return;let e=S.current,t=e?C(e):0;if(!e||t===0){D(!1);return}let n=()=>D(!1),r=t=>{t.target===e&&n()};e.addEventListener(`transitionend`,r);let i=window.setTimeout(n,t+50);return()=>{e.removeEventListener(`transitionend`,r),window.clearTimeout(i)}},[x,O,E]),(0,a.useEffect)(()=>{if(!A)return;let e=requestAnimationFrame(()=>j(!1));return()=>cancelAnimationFrame(e)},[A]);let[N,P]=(0,a.useState)(!1);(0,a.useEffect)(()=>{P(y&&w())},[y]),(0,a.useLayoutEffect)(()=>{let e=S.current;e&&N&&!E&&e.setAttribute(`hidden`,`until-found`)},[N,E]);let{setItemOpen:F}=h,I=_.value,L=_.disabled;(0,a.useEffect)(()=>{let e=S.current;if(!e||!N)return;let t=()=>{L||(M.current=!0,(0,s.flushSync)(()=>F(I,!0)))};return e.addEventListener(`beforematch`,t),()=>e.removeEventListener(`beforematch`,t)},[N,F,I,L]);let R=v||y||E;return(0,o.jsx)(`div`,{role:h.isRegion?`region`:void 0,"aria-labelledby":_.triggerId,...p,ref:T,id:_.contentId,"data-state":O?`open`:`closed`,"data-instant":A?``:void 0,hidden:!E,inert:E&&!O?!0:void 0,className:n.cx(i.default.content,l),children:(0,o.jsx)(`div`,{className:i.default.clip,children:(0,o.jsx)(`div`,{className:n.cx(i.default.body,c),children:R?u:null})})})},E=v;E.Item=y,E.Trigger=S,E.Content=T,exports.ACCORDION_AUTO_REGION_MAX=c,exports.Accordion=E,exports.AccordionContent=T,exports.AccordionItem=y,exports.AccordionTrigger=S;
+"use client";const e=require("../../../hooks/useMergedRef.cjs.js"),t=require("../../../utils/cx.cjs.js"),n=require("../../../hooks/useControllableState.cjs.js"),r=require("../../primitives/Icon/icons.cjs.js"),i=require("./Accordion.module.css.cjs.js");let a=require("react"),o=require("react/jsx-runtime"),s=require("react-dom");var c=6,l={separated:i.default.separated,contained:i.default.contained,flush:i.default.flush},u={sm:i.default.sm,md:i.default.md,lg:i.default.lg},d={start:i.default.iconStart,end:i.default.iconEnd},f={sm:`sm`,md:`md`,lg:`md`},p=(0,a.createContext)(null);function m(e){let t=(0,a.useContext)(p);if(!t)throw Error(`<${e}> must be used inside <Accordion>.`);return t}var h=(0,a.createContext)(null);function g(e){let t=(0,a.useContext)(h);if(!t)throw Error(`<${e}> must be used inside <Accordion.Item>.`);return t}var _=e=>Array.isArray(e)?e:e==null?[]:[e],v=r=>{let{type:s=`single`,collapsible:c=!0,value:f,defaultValue:m,onValueChange:h,variant:g=`separated`,size:v=`md`,headingLevel:y=3,icon:b=`chevron`,iconPosition:x=`end`,keyboardNavigation:S=!0,regionRole:C=`auto`,forceMount:w=!1,hiddenUntilFound:T=!1,disabled:E=!1,className:D,children:O,ref:k,...A}=r,j=s===`multiple`,[M,N]=n.useControllableState({value:f,defaultValue:m??(j?[]:null),onChange:h}),P=(0,a.useMemo)(()=>_(M),[M]),F=(0,a.useCallback)((e,t)=>{N(n=>{let r=_(n);return t===r.includes(e)?n:j?t?[...r,e]:r.filter(t=>t!==e):t?e:c?null:n})},[N,j,c]),I=(0,a.useCallback)(e=>F(e,!P.includes(e)),[F,P]),[L,R]=(0,a.useState)(0),z=(0,a.useCallback)(()=>(R(e=>e+1),()=>R(e=>e-1)),[]),B=C===`auto`?L<=6:C,V=(0,a.useRef)(null),H=e.useMergedRef(k,V),U=(0,a.useMemo)(()=>({rootRef:V,openValues:P,multiple:j,collapsible:j?!0:c,disabled:E,headingLevel:y,size:v,icon:b,iconPosition:x,keyboardNavigation:S,isRegion:B,forceMount:w,hiddenUntilFound:T,toggle:I,setItemOpen:F,registerItem:z}),[P,j,c,E,y,v,b,x,S,B,w,T,I,F,z]);return(0,o.jsx)(p.Provider,{value:U,children:(0,o.jsx)(`div`,{...A,ref:H,"data-accordion-root":``,"data-orientation":`vertical`,className:t.cx(i.default.root,l[g],u[v],d[x],D),children:O})})},y=({value:e,disabled:n=!1,headingLevel:r,className:s,children:c,...l})=>{let u=m(`Accordion.Item`),d=(0,a.useId)(),[f,p]=(0,a.useState)(),[g,_]=(0,a.useState)(),{registerItem:v}=u;(0,a.useLayoutEffect)(()=>v(),[v]);let y=u.openValues.includes(e),b=u.disabled||n,x=(0,a.useMemo)(()=>({value:e,open:y,disabled:b,headingLevel:r??u.headingLevel,triggerId:f??`${d}-trigger`,contentId:g??`${d}-content`,setTriggerId:p,setContentId:_}),[e,y,b,r,u.headingLevel,f,g,d]);return(0,o.jsx)(h.Provider,{value:x,children:(0,o.jsx)(`div`,{...l,"data-state":y?`open`:`closed`,"data-disabled":b?``:void 0,className:t.cx(i.default.item,s),children:c})})},b=({size:e})=>(0,o.jsx)(r.ChevronDownIcon,{size:e,className:i.default.rotating}),x=({size:e})=>(0,o.jsxs)(`span`,{className:i.default.plusMinus,children:[(0,o.jsx)(r.PlusIcon,{size:e,className:i.default.plus}),(0,o.jsx)(r.MinusIcon,{size:e,className:i.default.minus})]}),S=({children:e,description:n,startIcon:r,badge:s,headingClassName:c,className:l,id:u,onClick:d,onKeyDown:p,disabled:h,..._})=>{let v=m(`Accordion.Trigger`),y=g(`Accordion.Trigger`),S=(0,a.useId)(),C=`${S}-title`,w=`${S}-description`,T=`${S}-badge`,{setTriggerId:E}=y;(0,a.useLayoutEffect)(()=>{E(u)},[u,E]);let D=y.disabled||!!h,O=y.open&&!v.collapsible,k=e=>{d?.(e),e.defaultPrevented||D||O||v.toggle(y.value)},A=e=>{if(p?.(e),e.defaultPrevented||!v.keyboardNavigation||e.altKey||e.ctrlKey||e.metaKey||e.shiftKey)return;let t=v.rootRef.current;if(!t)return;let n=Array.from(t.querySelectorAll(`[data-accordion-trigger]`)).filter(e=>e.closest(`[data-accordion-root]`)===t&&!e.disabled),r=n.indexOf(e.currentTarget);if(r===-1||n.length===0)return;let i=null;switch(e.key){case`ArrowDown`:i=(r+1)%n.length;break;case`ArrowUp`:i=(r-1+n.length)%n.length;break;case`Home`:i=0;break;case`End`:i=n.length-1;break;default:return}e.preventDefault(),n[i]?.focus()},j=f[v.size],{icon:M}=v,N=null;M===`chevron`?N=(0,o.jsx)(b,{size:j}):M===`plus-minus`?N=(0,o.jsx)(x,{size:j}):typeof M==`function`?N=M({open:y.open,disabled:D}):(0,a.isValidElement)(M)&&(N=(0,o.jsx)(`span`,{className:i.default.rotating,children:M}));let P=M===`none`||N==null?null:(0,o.jsx)(`span`,{className:i.default.indicator,"aria-hidden":`true`,children:N}),F=s!=null&&s!==!1,I=n!=null&&n!==!1&&n!==``,L=`h${y.headingLevel}`;return(0,o.jsx)(L,{className:t.cx(i.default.heading,c),children:(0,o.jsxs)(`button`,{"aria-labelledby":F?`${C} ${T}`:C,"aria-describedby":I?w:void 0,..._,type:`button`,id:y.triggerId,"data-accordion-trigger":``,"data-state":y.open?`open`:`closed`,"data-disabled":D?``:void 0,"aria-expanded":y.open,"aria-controls":y.contentId,"aria-disabled":O&&!D?!0:void 0,disabled:D,className:t.cx(i.default.trigger,O&&i.default.locked,l),onClick:k,onKeyDown:A,children:[v.iconPosition===`start`&&P,r!=null&&(0,o.jsx)(`span`,{className:i.default.startIcon,"aria-hidden":`true`,children:r}),(0,o.jsxs)(`span`,{className:i.default.text,children:[(0,o.jsx)(`span`,{id:C,className:i.default.title,children:e}),I&&(0,o.jsx)(`span`,{id:w,className:i.default.description,children:n})]}),F&&(0,o.jsx)(`span`,{id:T,className:i.default.badge,children:s}),v.iconPosition===`end`&&P]})})};function C(e){let t=getComputedStyle(e),n=e=>e.split(`,`).map(e=>{let t=parseFloat(e);return Number.isNaN(t)?0:e.trim().endsWith(`ms`)?t:t*1e3}),r=n(t.transitionDuration),i=n(t.transitionDelay);return Math.max(0,...r.map((e,t)=>e+(i[t]??i[0]??0)))}var w=()=>typeof document<`u`&&!!document.body&&`onbeforematch`in document.body,T=({forceMount:n,hiddenUntilFound:r,bodyClassName:c,className:l,children:u,id:d,ref:f,...p})=>{let h=m(`Accordion.Content`),_=g(`Accordion.Content`),v=n??h.forceMount,y=r??h.hiddenUntilFound,{setContentId:b}=_;(0,a.useLayoutEffect)(()=>{b(d)},[d,b]);let x=_.open,S=(0,a.useRef)(null),T=e.useMergedRef(f,S),[E,D]=(0,a.useState)(x),[O,k]=(0,a.useState)(x),[A,j]=(0,a.useState)(!1),M=(0,a.useRef)(!1);(0,a.useLayoutEffect)(()=>{if(x){if(M.current){M.current=!1,j(!0),D(!0),k(!0);return}if(!E){D(!0);return}O||(S.current?.getBoundingClientRect(),k(!0))}else O&&k(!1)},[x,E,O]),(0,a.useEffect)(()=>{if(x||O||!E)return;let e=S.current,t=e?C(e):0;if(!e||t===0){D(!1);return}let n=()=>D(!1),r=t=>{t.target===e&&n()};e.addEventListener(`transitionend`,r);let i=window.setTimeout(n,t+50);return()=>{e.removeEventListener(`transitionend`,r),window.clearTimeout(i)}},[x,O,E]),(0,a.useEffect)(()=>{if(!A)return;let e=requestAnimationFrame(()=>j(!1));return()=>cancelAnimationFrame(e)},[A]);let[N,P]=(0,a.useState)(!1);(0,a.useEffect)(()=>{P(y&&w())},[y]),(0,a.useLayoutEffect)(()=>{let e=S.current;e&&N&&!E&&e.setAttribute(`hidden`,`until-found`)},[N,E]);let{setItemOpen:F}=h,I=_.value,L=_.disabled;(0,a.useEffect)(()=>{let e=S.current;if(!e||!N)return;let t=()=>{L||(M.current=!0,(0,s.flushSync)(()=>F(I,!0)))};return e.addEventListener(`beforematch`,t),()=>e.removeEventListener(`beforematch`,t)},[N,F,I,L]);let R=v||y||E;return(0,o.jsx)(`div`,{role:h.isRegion?`region`:void 0,"aria-labelledby":_.triggerId,...p,ref:T,id:_.contentId,"data-state":O?`open`:`closed`,"data-instant":A?``:void 0,hidden:!E,inert:E&&!O?!0:void 0,className:t.cx(i.default.content,l),children:(0,o.jsx)(`div`,{className:i.default.clip,children:(0,o.jsx)(`div`,{className:t.cx(i.default.body,c),children:R?u:null})})})},E=v;E.Item=y,E.Trigger=S,E.Content=T,exports.ACCORDION_AUTO_REGION_MAX=c,exports.Accordion=E,exports.AccordionContent=T,exports.AccordionItem=y,exports.AccordionTrigger=S;

package/dist/components/data-display/Accordion/Accordion.mjs

@@ -1,12 +1,13 @@
-import { useControllableState as e } from "../../../hooks/useControllableState.mjs";
-import { useMergedRef as t } from "../../../hooks/useMergedRef.mjs";
-import { cx as n } from "../../../utils/cx.mjs";
+"use client";
+import { useMergedRef as e } from "../../../hooks/useMergedRef.mjs";
+import { cx as t } from "../../../utils/cx.mjs";
+import { useControllableState as n } from "../../../hooks/useControllableState.mjs";
 import { ChevronDownIcon as r, MinusIcon as i, PlusIcon as a } from "../../primitives/Icon/icons.mjs";
 import o from "./Accordion.module.css.mjs";
 import { createContext as s, isValidElement as c, useCallback as l, useContext as u, useEffect as d, useId as f, useLayoutEffect as p, useMemo as m, useRef as h, useState as g } from "react";
 import { jsx as _, jsxs as v } from "react/jsx-runtime";
 import { flushSync as y } from "react-dom";
-//#region src/components/data-display/Accordion/Accordion.tsx
+// src/components/data-display/Accordion/Accordion.tsx
 var b = 6, x = {
 	separated: o.separated,
 	contained: o.contained,
@@ -35,7 +36,7 @@ function O(e) {
 	return t;
 }
 var k = (e) => Array.isArray(e) ? e : e == null ? [] : [e], A = (r) => {
-	let { type: i = "single", collapsible: a = !0, value: s, defaultValue: c, onValueChange: u, variant: d = "separated", size: f = "md", headingLevel: p = 3, icon: v = "chevron", iconPosition: y = "end", keyboardNavigation: b = !0, regionRole: w = "auto", forceMount: E = !1, hiddenUntilFound: D = !1, disabled: O = !1, className: A, children: j, ref: M, ...N } = r, P = i === "multiple", [F, I] = e({
+	let { type: i = "single", collapsible: a = !0, value: s, defaultValue: c, onValueChange: u, variant: d = "separated", size: f = "md", headingLevel: p = 3, icon: v = "chevron", iconPosition: y = "end", keyboardNavigation: b = !0, regionRole: w = "auto", forceMount: E = !1, hiddenUntilFound: D = !1, disabled: O = !1, className: A, children: j, ref: M, ...N } = r, P = i === "multiple", [F, I] = n({
 		value: s,
 		defaultValue: c ?? (P ? [] : null),
 		onChange: u
@@ -48,7 +49,7 @@ var k = (e) => Array.isArray(e) ? e : e == null ? [] : [e], A = (r) => {
 		I,
 		P,
 		a
-	]), z = l((e) => R(e, !L.includes(e)), [R, L]), [B, V] = g(0), H = l(() => (V((e) => e + 1), () => V((e) => e - 1)), []), U = w === "auto" ? B <= 6 : w, W = h(null), G = t(M, W), K = m(() => ({
+	]), z = l((e) => R(e, !L.includes(e)), [R, L]), [B, V] = g(0), H = l(() => (V((e) => e + 1), () => V((e) => e - 1)), []), U = w === "auto" ? B <= 6 : w, W = h(null), G = e(M, W), K = m(() => ({
 		rootRef: W,
 		openValues: L,
 		multiple: P,
@@ -89,14 +90,14 @@ var k = (e) => Array.isArray(e) ? e : e == null ? [] : [e], A = (r) => {
 			ref: G,
 			"data-accordion-root": "",
 			"data-orientation": "vertical",
-			className: n(o.root, x[d], S[f], C[y], A),
+			className: t(o.root, x[d], S[f], C[y], A),
 			children: j
 		})
 	});
-}, j = ({ value: e, disabled: t = !1, headingLevel: r, className: i, children: a, ...s }) => {
+}, j = ({ value: e, disabled: n = !1, headingLevel: r, className: i, children: a, ...s }) => {
 	let c = E("Accordion.Item"), l = f(), [u, d] = g(), [h, v] = g(), { registerItem: y } = c;
 	p(() => y(), [y]);
-	let b = c.openValues.includes(e), x = c.disabled || t, S = m(() => ({
+	let b = c.openValues.includes(e), x = c.disabled || n, S = m(() => ({
 		value: e,
 		open: b,
 		disabled: x,
@@ -121,7 +122,7 @@ var k = (e) => Array.isArray(e) ? e : e == null ? [] : [e], A = (r) => {
 			...s,
 			"data-state": b ? "open" : "closed",
 			"data-disabled": x ? "" : void 0,
-			className: n(o.item, i),
+			className: t(o.item, i),
 			children: a
 		})
 	});
@@ -137,13 +138,13 @@ var k = (e) => Array.isArray(e) ? e : e == null ? [] : [e], A = (r) => {
 		size: e,
 		className: o.minus
 	})]
-}), P = ({ children: e, description: t, startIcon: r, badge: i, headingClassName: a, className: s, id: l, onClick: u, onKeyDown: d, disabled: m, ...h }) => {
+}), P = ({ children: e, description: n, startIcon: r, badge: i, headingClassName: a, className: s, id: l, onClick: u, onKeyDown: d, disabled: m, ...h }) => {
 	let g = E("Accordion.Trigger"), y = O("Accordion.Trigger"), b = f(), x = `${b}-title`, S = `${b}-description`, C = `${b}-badge`, { setTriggerId: T } = y;
 	p(() => {
 		T(l);
 	}, [l, T]);
 	let D = y.disabled || !!m, k = y.open && !g.collapsible, A = (e) => {
-		u?.(e), !(e.defaultPrevented || D || k) && g.toggle(y.value);
+		u?.(e), e.defaultPrevented || D || k || g.toggle(y.value);
 	}, j = (e) => {
 		if (d?.(e), e.defaultPrevented || !g.keyboardNavigation || e.altKey || e.ctrlKey || e.metaKey || e.shiftKey) return;
 		let t = g.rootRef.current;
@@ -179,9 +180,9 @@ var k = (e) => Array.isArray(e) ? e : e == null ? [] : [e], A = (r) => {
 		className: o.indicator,
 		"aria-hidden": "true",
 		children: I
-	}), R = i != null && i !== !1, z = t != null && t !== !1 && t !== "", B = `h${y.headingLevel}`;
+	}), R = i != null && i !== !1, z = n != null && n !== !1 && n !== "", B = `h${y.headingLevel}`;
 	return /* @__PURE__ */ _(B, {
-		className: n(o.heading, a),
+		className: t(o.heading, a),
 		children: /* @__PURE__ */ v("button", {
 			"aria-labelledby": R ? `${x} ${C}` : x,
 			"aria-describedby": z ? S : void 0,
@@ -195,7 +196,7 @@ var k = (e) => Array.isArray(e) ? e : e == null ? [] : [e], A = (r) => {
 			"aria-controls": y.contentId,
 			"aria-disabled": k && !D ? !0 : void 0,
 			disabled: D,
-			className: n(o.trigger, k && o.locked, s),
+			className: t(o.trigger, k && o.locked, s),
 			onClick: A,
 			onKeyDown: j,
 			children: [
@@ -214,7 +215,7 @@ var k = (e) => Array.isArray(e) ? e : e == null ? [] : [e], A = (r) => {
 					}), z && /* @__PURE__ */ _("span", {
 						id: S,
 						className: o.description,
-						children: t
+						children: n
 					})]
 				}),
 				R && /* @__PURE__ */ _("span", {
@@ -234,12 +235,12 @@ function F(e) {
 	}), r = n(t.transitionDuration), i = n(t.transitionDelay);
 	return Math.max(0, ...r.map((e, t) => e + (i[t] ?? i[0] ?? 0)));
 }
-var I = () => typeof document < "u" && !!document.body && "onbeforematch" in document.body, L = ({ forceMount: e, hiddenUntilFound: r, bodyClassName: i, className: a, children: s, id: c, ref: l, ...u }) => {
-	let f = E("Accordion.Content"), m = O("Accordion.Content"), v = e ?? f.forceMount, b = r ?? f.hiddenUntilFound, { setContentId: x } = m;
+var I = () => typeof document < "u" && !!document.body && "onbeforematch" in document.body, L = ({ forceMount: n, hiddenUntilFound: r, bodyClassName: i, className: a, children: s, id: c, ref: l, ...u }) => {
+	let f = E("Accordion.Content"), m = O("Accordion.Content"), v = n ?? f.forceMount, b = r ?? f.hiddenUntilFound, { setContentId: x } = m;
 	p(() => {
 		x(c);
 	}, [c, x]);
-	let S = m.open, C = h(null), w = t(l, C), [T, D] = g(S), [k, A] = g(S), [j, M] = g(!1), N = h(!1);
+	let S = m.open, C = h(null), w = e(l, C), [T, D] = g(S), [k, A] = g(S), [j, M] = g(!1), N = h(!1);
 	p(() => {
 		if (S) {
 			if (N.current) {
@@ -312,16 +313,15 @@ var I = () => typeof document < "u" && !!document.body && "onbeforematch" in doc
 		"data-instant": j ? "" : void 0,
 		hidden: !T,
 		inert: T && !k ? !0 : void 0,
-		className: n(o.content, a),
+		className: t(o.content, a),
 		children: /* @__PURE__ */ _("div", {
 			className: o.clip,
 			children: /* @__PURE__ */ _("div", {
-				className: n(o.body, i),
+				className: t(o.body, i),
 				children: V ? s : null
 			})
 		})
 	});
 }, R = A;
 R.Item = j, R.Trigger = P, R.Content = L;
-//#endregion
 export { b as ACCORDION_AUTO_REGION_MAX, R as Accordion, L as AccordionContent, j as AccordionItem, P as AccordionTrigger };

package/dist/components/data-display/Accordion/Accordion.module.css.mjs

@@ -1,4 +1,4 @@
-//#region src/components/data-display/Accordion/Accordion.module.css
+// src/components/data-display/Accordion/Accordion.module.css
 var e = "_root_aanju_11", t = "_sm_aanju_45", n = "_md_aanju_67", r = "_lg_aanju_75", i = "_iconEnd_aanju_97", a = "_iconStart_aanju_105", o = "_separated_aanju_123", s = "_item_aanju_131", c = "_trigger_aanju_155", l = "_contained_aanju_175", u = "_flush_aanju_189", d = "_heading_aanju_251", f = "_locked_aanju_301", p = "_text_aanju_341", m = "_title_aanju_357", h = "_description_aanju_373", g = "_startIcon_aanju_397", _ = "_badge_aanju_399", v = "_indicator_aanju_429", y = "_rotating_aanju_489", b = "_plusMinus_aanju_507", x = "_plus_aanju_507", S = "_minus_aanju_517", C = "_content_aanju_569", w = "_clip_aanju_609", T = "_body_aanju_619", E = {
 	root: e,
 	sm: t,
@@ -27,5 +27,4 @@ var e = "_root_aanju_11", t = "_sm_aanju_45", n = "_md_aanju_67", r = "_lg_aanju
 	clip: w,
 	body: T
 };
-//#endregion
 export { _ as badge, T as body, w as clip, l as contained, C as content, E as default, h as description, u as flush, d as heading, i as iconEnd, a as iconStart, v as indicator, s as item, r as lg, f as locked, n as md, S as minus, x as plus, b as plusMinus, e as root, y as rotating, o as separated, t as sm, g as startIcon, p as text, m as title, c as trigger };

package/dist/components/data-display/Avatar/Avatar.cjs.js

@@ -1 +1 @@
-const e=require("../../utilities/LocaleProvider/LocaleProvider.cjs.js"),t=require("../../../utils/cx.cjs.js"),n=require("../../primitives/Icon/icons.cjs.js"),r=require("./Avatar.module.css.cjs.js");let i=require("react"),a=require("react/jsx-runtime");function o(e){let t=Intl.Segmenter;return t?Array.from(new t(void 0,{granularity:`grapheme`}).segment(e),e=>e.segment):Array.from(e)}var s=/[\p{L}\p{N}]/u;function c(e){let t=o(e).find(e=>s.test(e));return t?t.toLocaleUpperCase():``}function l(e){if(!e)return``;let t=e.trim().split(/\s+/u).filter(e=>s.test(e));if(t.length===0)return``;let n=c(t[0]);return t.length===1?n:n+c(t[t.length-1])}var u=Object.freeze([`primary`,`accent`,`success`,`info`,`neutral`]);function d(e){let t=5381;for(let n of e.trim().toLocaleLowerCase())t=(t<<5)+t+(n.codePointAt(0)??0)|0;return u[Math.abs(t)%u.length]}var f={xs:r.default.xs,sm:r.default.sm,md:r.default.md,lg:r.default.lg,xl:r.default.xl,"2xl":r.default.size2xl},p={circle:r.default.circle,rounded:r.default.rounded,square:r.default.square},m={soft:r.default.soft,solid:r.default.solid},h={neutral:r.default.toneNeutral,primary:r.default.tonePrimary,accent:r.default.toneAccent,success:r.default.toneSuccess,warning:r.default.toneWarning,danger:r.default.toneDanger,info:r.default.toneInfo},g={neutral:r.default.ringNeutral,primary:r.default.ringPrimary,accent:r.default.ringAccent,success:r.default.ringSuccess,warning:r.default.ringWarning,danger:r.default.ringDanger,info:r.default.ringInfo},_={online:r.default.statusOnline,away:r.default.statusAway,busy:r.default.statusBusy,offline:r.default.statusOffline},v={sm:r.default.spacingSm,md:r.default.spacingMd,lg:r.default.spacingLg},y=(0,i.createContext)(null);function b({src:o,alt:s,name:c,size:u,shape:v,tone:b=`neutral`,variant:x=`soft`,colorFromName:S=!1,status:C,statusLabel:w,bordered:T=!1,ring:E=!1,ringTone:D=`accent`,decorative:ee=!1,icon:te,imgProps:O,onImageStatusChange:k,className:A,"aria-label":j,"aria-labelledby":M,...N}){let P=e.useMessages(),F=(0,i.useContext)(y),ne=F?.size??u??`md`,re=v??F?.shape??`circle`,[I,L]=(0,i.useState)(null),R=o?I?.src===o?I.status:`loading`:void 0,z=e=>{!o||I?.src===o&&I.status===e||(L({src:o,status:e}),k?.(e))},{onLoad:B,onError:V,className:H,ref:U,...W}=O??{},G=e=>{e&&e.complete&&I?.src!==o&&z(e.naturalWidth>0?`loaded`:`error`),typeof U==`function`?U(e):U&&(U.current=e)},K=e=>{z(`loaded`),B?.(e)},q=e=>{z(`error`),V?.(e)},J=l(c),Y=S&&c?.trim()?d(c):b,ie=!!o&&R!==`error`,X=ee||s===``&&!c,Z=s||c?.trim()||P.avatar.fallbackName,Q=C?w??P.avatar.status[C]:void 0,ae=Q?`${Z} (${Q})`:Z,oe=X&&!Q?{"aria-hidden":!0}:X?{role:`img`,"aria-label":Q}:{role:`img`,"aria-label":M?j:j===void 0?ae:(e=>Q?`${e} (${Q})`:e)(j),"aria-labelledby":M},$;return $=ie?(0,a.jsx)(`img`,{...W,ref:G,src:o,alt:``,className:t.cx(r.default.image,R===`loaded`&&r.default.imageLoaded,H),onLoad:K,onError:q}):J?(0,a.jsx)(`span`,{className:r.default.initials,children:J}):te??(0,a.jsx)(n.UserIcon,{className:r.default.icon}),(0,a.jsxs)(`span`,{...N,...oe,"data-status":C,"data-image-status":R,className:t.cx(r.default.root,f[ne],p[re],m[x],h[Y],F&&r.default.inGroup,T&&r.default.bordered,E&&r.default.ring,E&&g[D],A),children:[(0,a.jsx)(`span`,{className:r.default.face,children:$}),C&&(0,a.jsx)(`span`,{className:t.cx(r.default.status,_[C]),"aria-hidden":`true`})]})}function x({size:n=`md`,shape:o,max:s,spacing:c=`md`,surplusLabel:l,renderSurplus:u,className:d,children:m,...h}){let g=e.useMessages(),_=l??g.avatar.surplus,b=i.Children.toArray(m).filter(i.isValidElement),x=s!==void 0&&s>=0&&s<b.length?Math.floor(s):b.length,S=b.slice(0,x),C=b.slice(x),w=C.length;return(0,a.jsx)(y.Provider,{value:{size:n,shape:o},children:(0,a.jsxs)(`div`,{role:`group`,...h,className:t.cx(r.default.group,f[n],v[c],d),children:[S,w>0&&(u?u(w,C):(0,a.jsx)(`span`,{role:`img`,"aria-label":_(w),className:t.cx(r.default.root,f[n],p[o??`circle`],r.default.soft,r.default.toneNeutral,r.default.inGroup),children:(0,a.jsx)(`span`,{className:r.default.face,children:(0,a.jsxs)(`span`,{className:t.cx(r.default.initials,r.default.surplus),"aria-hidden":`true`,children:[`+`,w]})})}))]})})}exports.Avatar=b,exports.AvatarGroup=x,exports.avatarNameTones=u,exports.avatarToneFromName=d,exports.getInitials=l;
+"use client";const e=require("../../../utils/cx.cjs.js"),t=require("../../primitives/Icon/icons.cjs.js"),n=require("./Avatar.module.css.cjs.js"),r=require("../../utilities/LocaleProvider/LocaleProvider.cjs.js");let i=require("react"),a=require("react/jsx-runtime");function o(e){let t=Intl.Segmenter;return t?Array.from(new t(void 0,{granularity:`grapheme`}).segment(e),e=>e.segment):Array.from(e)}var s=/[\p{L}\p{N}]/u;function c(e){let t=o(e).find(e=>s.test(e));return t?t.toLocaleUpperCase():``}function l(e){if(!e)return``;let t=e.trim().split(/\s+/u).filter(e=>s.test(e));if(t.length===0)return``;let n=c(t[0]);return t.length===1?n:n+c(t[t.length-1])}var u=Object.freeze([`primary`,`accent`,`success`,`info`,`neutral`]);function d(e){let t=5381;for(let n of e.trim().toLocaleLowerCase())t=(t<<5)+t+(n.codePointAt(0)??0)|0;return u[Math.abs(t)%u.length]}var f={xs:n.default.xs,sm:n.default.sm,md:n.default.md,lg:n.default.lg,xl:n.default.xl,"2xl":n.default.size2xl},p={circle:n.default.circle,rounded:n.default.rounded,square:n.default.square},m={soft:n.default.soft,solid:n.default.solid},h={neutral:n.default.toneNeutral,primary:n.default.tonePrimary,accent:n.default.toneAccent,success:n.default.toneSuccess,warning:n.default.toneWarning,danger:n.default.toneDanger,info:n.default.toneInfo},g={neutral:n.default.ringNeutral,primary:n.default.ringPrimary,accent:n.default.ringAccent,success:n.default.ringSuccess,warning:n.default.ringWarning,danger:n.default.ringDanger,info:n.default.ringInfo},_={online:n.default.statusOnline,away:n.default.statusAway,busy:n.default.statusBusy,offline:n.default.statusOffline},v={sm:n.default.spacingSm,md:n.default.spacingMd,lg:n.default.spacingLg},y=(0,i.createContext)(null);function b({src:o,alt:s,name:c,size:u,shape:v,tone:b=`neutral`,variant:x=`soft`,colorFromName:S=!1,status:C,statusLabel:w,bordered:T=!1,ring:E=!1,ringTone:D=`accent`,decorative:O=!1,icon:k,imgProps:ee,onImageStatusChange:te,className:A,"aria-label":j,"aria-labelledby":M,...N}){let P=r.useMessages(),F=(0,i.useContext)(y),ne=F?.size??u??`md`,re=v??F?.shape??`circle`,[I,L]=(0,i.useState)(null),R=o?I?.src===o?I.status:`loading`:void 0,z=e=>{!o||I?.src===o&&I.status===e||(L({src:o,status:e}),te?.(e))},{onLoad:B,onError:V,className:H,ref:U,...W}=ee??{},G=e=>{e&&e.complete&&I?.src!==o&&z(e.naturalWidth>0?`loaded`:`error`),typeof U==`function`?U(e):U&&(U.current=e)},K=e=>{z(`loaded`),B?.(e)},q=e=>{z(`error`),V?.(e)},J=l(c),Y=S&&c?.trim()?d(c):b,ie=!!o&&R!==`error`,X=O||s===``&&!c,Z=s||c?.trim()||P.avatar.fallbackName,Q=C?w??P.avatar.status[C]:void 0,ae=Q?`${Z} (${Q})`:Z,oe=X&&!Q?{"aria-hidden":!0}:X?{role:`img`,"aria-label":Q}:{role:`img`,"aria-label":M?j:j===void 0?ae:(e=>Q?`${e} (${Q})`:e)(j),"aria-labelledby":M},$;return $=ie?(0,a.jsx)(`img`,{...W,ref:G,src:o,alt:``,className:e.cx(n.default.image,R===`loaded`&&n.default.imageLoaded,H),onLoad:K,onError:q}):J?(0,a.jsx)(`span`,{className:n.default.initials,children:J}):k??(0,a.jsx)(t.UserIcon,{className:n.default.icon}),(0,a.jsxs)(`span`,{...N,...oe,"data-status":C,"data-image-status":R,className:e.cx(n.default.root,f[ne],p[re],m[x],h[Y],F&&n.default.inGroup,T&&n.default.bordered,E&&n.default.ring,E&&g[D],A),children:[(0,a.jsx)(`span`,{className:n.default.face,children:$}),C&&(0,a.jsx)(`span`,{className:e.cx(n.default.status,_[C]),"aria-hidden":`true`})]})}function x({size:t=`md`,shape:o,max:s,spacing:c=`md`,surplusLabel:l,renderSurplus:u,className:d,children:m,...h}){let g=r.useMessages(),_=l??g.avatar.surplus,b=i.Children.toArray(m).filter(i.isValidElement),x=s!==void 0&&s>=0&&s<b.length?Math.floor(s):b.length,S=b.slice(0,x),C=b.slice(x),w=C.length,T=(0,i.useMemo)(()=>({size:t,shape:o}),[t,o]);return(0,a.jsx)(y.Provider,{value:T,children:(0,a.jsxs)(`div`,{role:`group`,...h,className:e.cx(n.default.group,f[t],v[c],d),children:[S,w>0&&(u?u(w,C):(0,a.jsx)(`span`,{role:`img`,"aria-label":_(w),className:e.cx(n.default.root,f[t],p[o??`circle`],n.default.soft,n.default.toneNeutral,n.default.inGroup),children:(0,a.jsx)(`span`,{className:n.default.face,children:(0,a.jsxs)(`span`,{className:e.cx(n.default.initials,n.default.surplus),"aria-hidden":`true`,children:[`+`,w]})})}))]})})}exports.Avatar=b,exports.AvatarGroup=x,exports.avatarNameTones=u,exports.avatarToneFromName=d,exports.getInitials=l;

package/dist/components/data-display/Avatar/Avatar.mjs

@@ -1,91 +1,92 @@
-import { useMessages as e } from "../../utilities/LocaleProvider/LocaleProvider.mjs";
-import { cx as t } from "../../../utils/cx.mjs";
-import { UserIcon as n } from "../../primitives/Icon/icons.mjs";
-import r from "./Avatar.module.css.mjs";
-import { Children as i, createContext as a, isValidElement as o, useContext as s, useState as c } from "react";
-import { jsx as l, jsxs as u } from "react/jsx-runtime";
-//#region src/components/data-display/Avatar/Avatar.tsx
-function d(e) {
+"use client";
+import { cx as e } from "../../../utils/cx.mjs";
+import { UserIcon as t } from "../../primitives/Icon/icons.mjs";
+import n from "./Avatar.module.css.mjs";
+import { useMessages as r } from "../../utilities/LocaleProvider/LocaleProvider.mjs";
+import { Children as i, createContext as a, isValidElement as o, useContext as s, useMemo as c, useState as l } from "react";
+import { jsx as u, jsxs as d } from "react/jsx-runtime";
+// src/components/data-display/Avatar/Avatar.tsx
+function f(e) {
 	let t = Intl.Segmenter;
 	return t ? Array.from(new t(void 0, { granularity: "grapheme" }).segment(e), (e) => e.segment) : Array.from(e);
 }
-var f = /[\p{L}\p{N}]/u;
-function p(e) {
-	let t = d(e).find((e) => f.test(e));
+var p = /[\p{L}\p{N}]/u;
+function m(e) {
+	let t = f(e).find((e) => p.test(e));
 	return t ? t.toLocaleUpperCase() : "";
 }
-function m(e) {
+function h(e) {
 	if (!e) return "";
-	let t = e.trim().split(/\s+/u).filter((e) => f.test(e));
+	let t = e.trim().split(/\s+/u).filter((e) => p.test(e));
 	if (t.length === 0) return "";
-	let n = p(t[0]);
-	return t.length === 1 ? n : n + p(t[t.length - 1]);
+	let n = m(t[0]);
+	return t.length === 1 ? n : n + m(t[t.length - 1]);
 }
-var h = Object.freeze([
+var g = Object.freeze([
 	"primary",
 	"accent",
 	"success",
 	"info",
 	"neutral"
 ]);
-function g(e) {
+function _(e) {
 	let t = 5381;
 	for (let n of e.trim().toLocaleLowerCase()) t = (t << 5) + t + (n.codePointAt(0) ?? 0) | 0;
-	return h[Math.abs(t) % h.length];
+	return g[Math.abs(t) % g.length];
 }
-var _ = {
-	xs: r.xs,
-	sm: r.sm,
-	md: r.md,
-	lg: r.lg,
-	xl: r.xl,
-	"2xl": r.size2xl
-}, v = {
-	circle: r.circle,
-	rounded: r.rounded,
-	square: r.square
+var v = {
+	xs: n.xs,
+	sm: n.sm,
+	md: n.md,
+	lg: n.lg,
+	xl: n.xl,
+	"2xl": n.size2xl
 }, y = {
-	soft: r.soft,
-	solid: r.solid
+	circle: n.circle,
+	rounded: n.rounded,
+	square: n.square
 }, b = {
-	neutral: r.toneNeutral,
-	primary: r.tonePrimary,
-	accent: r.toneAccent,
-	success: r.toneSuccess,
-	warning: r.toneWarning,
-	danger: r.toneDanger,
-	info: r.toneInfo
+	soft: n.soft,
+	solid: n.solid
 }, x = {
-	neutral: r.ringNeutral,
-	primary: r.ringPrimary,
-	accent: r.ringAccent,
-	success: r.ringSuccess,
-	warning: r.ringWarning,
-	danger: r.ringDanger,
-	info: r.ringInfo
+	neutral: n.toneNeutral,
+	primary: n.tonePrimary,
+	accent: n.toneAccent,
+	success: n.toneSuccess,
+	warning: n.toneWarning,
+	danger: n.toneDanger,
+	info: n.toneInfo
 }, S = {
-	online: r.statusOnline,
-	away: r.statusAway,
-	busy: r.statusBusy,
-	offline: r.statusOffline
+	neutral: n.ringNeutral,
+	primary: n.ringPrimary,
+	accent: n.ringAccent,
+	success: n.ringSuccess,
+	warning: n.ringWarning,
+	danger: n.ringDanger,
+	info: n.ringInfo
 }, C = {
-	sm: r.spacingSm,
-	md: r.spacingMd,
-	lg: r.spacingLg
-}, w = a(null);
-function T({ src: i, alt: a, name: o, size: d, shape: f, tone: p = "neutral", variant: h = "soft", colorFromName: C = !1, status: T, statusLabel: E, bordered: D = !1, ring: O = !1, ringTone: k = "accent", decorative: ee = !1, icon: te, imgProps: A, onImageStatusChange: j, className: M, "aria-label": N, "aria-labelledby": P, ...ne }) {
-	let F = e(), I = s(w), re = I?.size ?? d ?? "md", ie = f ?? I?.shape ?? "circle", [L, R] = c(null), z = i ? L?.src === i ? L.status : "loading" : void 0, B = (e) => {
-		!i || L?.src === i && L.status === e || (R({
+	online: n.statusOnline,
+	away: n.statusAway,
+	busy: n.statusBusy,
+	offline: n.statusOffline
+}, w = {
+	sm: n.spacingSm,
+	md: n.spacingMd,
+	lg: n.spacingLg
+}, T = a(null);
+function E({ src: i, alt: a, name: o, size: c, shape: f, tone: p = "neutral", variant: m = "soft", colorFromName: g = !1, status: w, statusLabel: E, bordered: D = !1, ring: O = !1, ringTone: ee = "accent", decorative: k = !1, icon: A, imgProps: j, onImageStatusChange: te, className: M, "aria-label": N, "aria-labelledby": P, ...F }) {
+	let I = r(), L = s(T), ne = L?.size ?? c ?? "md", re = f ?? L?.shape ?? "circle", [R, ie] = l(null), z = i ? R?.src === i ? R.status : "loading" : void 0, B = (e) => {
+		!i || R?.src === i && R.status === e || (ie({
 			src: i,
 			status: e
-		}), j?.(e));
-	}, { onLoad: V, onError: H, className: U, ref: W, ...G } = A ?? {}, K = (e) => {
-		e && e.complete && L?.src !== i && B(e.naturalWidth > 0 ? "loaded" : "error"), typeof W == "function" ? W(e) : W && (W.current = e);
+		}), te?.(e));
+	}, { onLoad: V, onError: H, className: U, ref: W, ...G } = j ?? {}, K = (e) => {
+		e && e.complete && R?.src !== i && B(e.naturalWidth > 0 ? "loaded" : "error"), typeof W == "function" ? W(e) : W && (W.current = e);
 	}, q = (e) => {
 		B("loaded"), V?.(e);
 	}, J = (e) => {
 		B("error"), H?.(e);
-	}, Y = m(o), ae = C && o?.trim() ? g(o) : p, oe = !!i && z !== "error", X = ee || a === "" && !o, Z = a || o?.trim() || F.avatar.fallbackName, Q = T ? E ?? F.avatar.status[T] : void 0, se = Q ? `${Z} (${Q})` : Z, ce = X && !Q ? { "aria-hidden": !0 } : X ? {
+	}, Y = h(o), ae = g && o?.trim() ? _(o) : p, oe = !!i && z !== "error", X = k || a === "" && !o, Z = a || o?.trim() || I.avatar.fallbackName, Q = w ? E ?? I.avatar.status[w] : void 0, se = Q ? `${Z} (${Q})` : Z, ce = X && !Q ? { "aria-hidden": !0 } : X ? {
 		role: "img",
 		"aria-label": Q
 	} : {
@@ -93,58 +94,57 @@ function T({ src: i, alt: a, name: o, size: d, shape: f, tone: p = "neutral", va
 		"aria-label": P ? N : N === void 0 ? se : ((e) => Q ? `${e} (${Q})` : e)(N),
 		"aria-labelledby": P
 	}, $;
-	return $ = oe ? /* @__PURE__ */ l("img", {
+	return $ = oe ? /* @__PURE__ */ u("img", {
 		...G,
 		ref: K,
 		src: i,
 		alt: "",
-		className: t(r.image, z === "loaded" && r.imageLoaded, U),
+		className: e(n.image, z === "loaded" && n.imageLoaded, U),
 		onLoad: q,
 		onError: J
-	}) : Y ? /* @__PURE__ */ l("span", {
-		className: r.initials,
+	}) : Y ? /* @__PURE__ */ u("span", {
+		className: n.initials,
 		children: Y
-	}) : te ?? /* @__PURE__ */ l(n, { className: r.icon }), /* @__PURE__ */ u("span", {
-		...ne,
+	}) : A ?? /* @__PURE__ */ u(t, { className: n.icon }), /* @__PURE__ */ d("span", {
+		...F,
 		...ce,
-		"data-status": T,
+		"data-status": w,
 		"data-image-status": z,
-		className: t(r.root, _[re], v[ie], y[h], b[ae], I && r.inGroup, D && r.bordered, O && r.ring, O && x[k], M),
-		children: [/* @__PURE__ */ l("span", {
-			className: r.face,
+		className: e(n.root, v[ne], y[re], b[m], x[ae], L && n.inGroup, D && n.bordered, O && n.ring, O && S[ee], M),
+		children: [/* @__PURE__ */ u("span", {
+			className: n.face,
 			children: $
-		}), T && /* @__PURE__ */ l("span", {
-			className: t(r.status, S[T]),
+		}), w && /* @__PURE__ */ u("span", {
+			className: e(n.status, C[w]),
 			"aria-hidden": "true"
 		})]
 	});
 }
-function E({ size: n = "md", shape: a, max: s, spacing: c = "md", surplusLabel: d, renderSurplus: f, className: p, children: m, ...h }) {
-	let g = e(), y = d ?? g.avatar.surplus, b = i.toArray(m).filter(o), x = s !== void 0 && s >= 0 && s < b.length ? Math.floor(s) : b.length, S = b.slice(0, x), T = b.slice(x), E = T.length;
-	return /* @__PURE__ */ l(w.Provider, {
-		value: {
-			size: n,
-			shape: a
-		},
-		children: /* @__PURE__ */ u("div", {
+function D({ size: t = "md", shape: a, max: s, spacing: l = "md", surplusLabel: f, renderSurplus: p, className: m, children: h, ...g }) {
+	let _ = r(), b = f ?? _.avatar.surplus, x = i.toArray(h).filter(o), S = s !== void 0 && s >= 0 && s < x.length ? Math.floor(s) : x.length, C = x.slice(0, S), E = x.slice(S), D = E.length, O = c(() => ({
+		size: t,
+		shape: a
+	}), [t, a]);
+	return /* @__PURE__ */ u(T.Provider, {
+		value: O,
+		children: /* @__PURE__ */ d("div", {
 			role: "group",
-			...h,
-			className: t(r.group, _[n], C[c], p),
-			children: [S, E > 0 && (f ? f(E, T) : /* @__PURE__ */ l("span", {
+			...g,
+			className: e(n.group, v[t], w[l], m),
+			children: [C, D > 0 && (p ? p(D, E) : /* @__PURE__ */ u("span", {
 				role: "img",
-				"aria-label": y(E),
-				className: t(r.root, _[n], v[a ?? "circle"], r.soft, r.toneNeutral, r.inGroup),
-				children: /* @__PURE__ */ l("span", {
-					className: r.face,
-					children: /* @__PURE__ */ u("span", {
-						className: t(r.initials, r.surplus),
+				"aria-label": b(D),
+				className: e(n.root, v[t], y[a ?? "circle"], n.soft, n.toneNeutral, n.inGroup),
+				children: /* @__PURE__ */ u("span", {
+					className: n.face,
+					children: /* @__PURE__ */ d("span", {
+						className: e(n.initials, n.surplus),
 						"aria-hidden": "true",
-						children: ["+", E]
+						children: ["+", D]
 					})
 				})
 			}))]
 		})
 	});
 }
-//#endregion
-export { T as Avatar, E as AvatarGroup, h as avatarNameTones, g as avatarToneFromName, m as getInitials };
+export { E as Avatar, D as AvatarGroup, g as avatarNameTones, _ as avatarToneFromName, h as getInitials };

package/dist/components/data-display/Avatar/Avatar.module.css.mjs

@@ -1,4 +1,4 @@
-//#region src/components/data-display/Avatar/Avatar.module.css
+// src/components/data-display/Avatar/Avatar.module.css
 var e = "_root_1mppz_29", t = "_face_1mppz_65", n = "_xs_1mppz_93", r = "_sm_1mppz_101", i = "_md_1mppz_109", a = "_lg_1mppz_117", o = "_xl_1mppz_125", s = "_size2xl_1mppz_133", c = "_circle_1mppz_145", l = "_rounded_1mppz_151", u = "_square_1mppz_157", d = "_soft_1mppz_169", f = "_toneNeutral_1mppz_169", p = "_tonePrimary_1mppz_171", m = "_toneAccent_1mppz_173", h = "_toneSuccess_1mppz_175", g = "_toneWarning_1mppz_177", _ = "_toneDanger_1mppz_179", v = "_toneInfo_1mppz_181", y = "_solid_1mppz_185", b = "_image_1mppz_217", x = "_imageLoaded_1mppz_237", S = "_initials_1mppz_245", C = "_surplus_1mppz_263", w = "_icon_1mppz_273", T = "_inGroup_1mppz_287", E = "_ring_1mppz_295", D = "_bordered_1mppz_313", O = "_ringNeutral_1mppz_349", k = "_ringPrimary_1mppz_351", A = "_ringAccent_1mppz_353", j = "_ringSuccess_1mppz_355", M = "_ringWarning_1mppz_357", N = "_ringDanger_1mppz_359", P = "_ringInfo_1mppz_361", F = "_status_1mppz_379", I = "_statusOnline_1mppz_421", L = "_statusAway_1mppz_429", R = "_statusBusy_1mppz_461", z = "_statusOffline_1mppz_491", B = "_group_1mppz_511", V = "_spacingSm_1mppz_539", H = "_spacingMd_1mppz_545", U = "_spacingLg_1mppz_551", W = {
 	root: e,
 	face: t,
@@ -45,5 +45,4 @@ var e = "_root_1mppz_29", t = "_face_1mppz_65", n = "_xs_1mppz_93", r = "_sm_1mp
 	spacingMd: H,
 	spacingLg: U
 };
-//#endregion
 export { D as bordered, c as circle, W as default, t as face, B as group, w as icon, b as image, x as imageLoaded, T as inGroup, S as initials, a as lg, i as md, E as ring, A as ringAccent, N as ringDanger, P as ringInfo, O as ringNeutral, k as ringPrimary, j as ringSuccess, M as ringWarning, e as root, l as rounded, s as size2xl, r as sm, d as soft, y as solid, U as spacingLg, H as spacingMd, V as spacingSm, u as square, F as status, L as statusAway, R as statusBusy, z as statusOffline, I as statusOnline, C as surplus, m as toneAccent, _ as toneDanger, v as toneInfo, f as toneNeutral, p as tonePrimary, h as toneSuccess, g as toneWarning, o as xl, n as xs };

package/dist/components/data-display/Badge/Badge.cjs.js

@@ -1 +1 @@
-const e=require("../../../utils/cx.cjs.js"),t=require("../../utilities/VisuallyHidden/VisuallyHidden.cjs.js"),n=require("./Badge.module.css.cjs.js");let r=require("react"),i=require("react/jsx-runtime");var a=globalThis.process?.env?.NODE_ENV!==`production`,o={solid:n.default.solid,soft:n.default.soft,outline:n.default.outline,inverse:n.default.inverse},s={neutral:n.default.neutral,primary:n.default.primary,accent:n.default.accent,success:n.default.success,warning:n.default.warning,danger:n.default.danger,info:n.default.info},c={sm:n.default.sm,md:n.default.md,lg:n.default.lg},l={none:n.default.radiusNone,xs:n.default.radiusXs,sm:n.default.radiusSm,md:n.default.radiusMd,lg:n.default.radiusLg,xl:n.default.radiusXl,"2xl":n.default.radius2xl,pill:n.default.radiusPill},u={"top-end":n.default.topEnd,"top-start":n.default.topStart,"bottom-end":n.default.bottomEnd,"bottom-start":n.default.bottomStart},d={rectangle:n.default.overlapRectangle,circle:n.default.overlapCircle};function f(e,t=99){return e>t?`${t}+`:String(e)}var p=e=>typeof e==`number`?`${e}px`:e,m=({variant:r=`soft`,tone:a=`neutral`,size:u=`md`,radius:d=`pill`,count:p,max:m=99,showZero:h=!1,label:g,startIcon:_,dot:v=!1,caps:y=!1,className:b,children:x,...S})=>{let C=p!==void 0;if(C&&p===0&&!h)return null;let w=C?f(p,m):x,T=g!==void 0&&g!==``;return(0,i.jsxs)(`span`,{...S,className:e.cx(n.default.root,o[r],s[a],c[u],l[d],C&&n.default.count,y&&n.default.caps,b),children:[(0,i.jsxs)(`span`,{className:n.default.content,"aria-hidden":T?!0:void 0,children:[v&&(0,i.jsx)(`span`,{className:n.default.dot,"aria-hidden":`true`}),_!=null&&(0,i.jsx)(`span`,{className:n.default.icon,"aria-hidden":`true`,children:_}),w!=null&&w!==``&&(0,i.jsx)(`span`,{className:n.default.label,children:w})]}),T&&(0,i.jsx)(t.VisuallyHidden,{children:g})]})},h=({children:l,variant:m=`solid`,tone:h=`accent`,size:g=`md`,count:_,max:v=99,showZero:y=!1,label:b,dot:x=!1,content:S,placement:C=`top-end`,overlap:w=`rectangle`,offset:T,invisible:E=!1,badgeClassName:D,className:O,style:k,...A})=>{let j=!x&&_!==void 0,M=E||j&&_===0&&!y,N=x?null:j?f(_,v):S,P=b!==void 0&&b!==``&&!M,F=!M&&(x||N!=null)&&(b===void 0||b===``);(0,r.useEffect)(()=>{a&&F&&console.warn('[BadgeAnchor] Pass a `label` (e.g. "3 unread messages") so screen readers get the badge\'s meaning; the visual dot or count is hidden from them.')},[F]);let[I,L]=T===void 0?[void 0,void 0]:Array.isArray(T)?T:[T,T],R=T===void 0?k:{"--badge-offset-x":p(I),"--badge-offset-y":p(L),...k};return(0,i.jsxs)(`span`,{...A,className:e.cx(n.default.anchor,O),style:R,children:[l,(0,i.jsxs)(`span`,{className:e.cx(n.default.root,n.default.anchored,o[m],s[h],c[g],n.default.radiusPill,u[C],d[w],x?n.default.anchoredDot:n.default.count,M&&n.default.invisible,D),"data-state":M?`hidden`:`visible`,children:[!x&&(0,i.jsx)(`span`,{className:n.default.content,"aria-hidden":`true`,children:N!=null&&N!==``&&(0,i.jsx)(`span`,{className:n.default.label,children:N})}),P&&(0,i.jsx)(t.VisuallyHidden,{children:b})]})]})};exports.Badge=m,exports.BadgeAnchor=h,exports.formatBadgeCount=f;
+"use client";const e=require("../../../utils/cx.cjs.js"),t=require("../../utilities/VisuallyHidden/VisuallyHidden.cjs.js"),n=require("./Badge.module.css.cjs.js");let r=require("react"),i=require("react/jsx-runtime");var a=globalThis.process?.env?.NODE_ENV!==`production`,o={solid:n.default.solid,soft:n.default.soft,outline:n.default.outline,inverse:n.default.inverse},s={neutral:n.default.neutral,primary:n.default.primary,accent:n.default.accent,success:n.default.success,warning:n.default.warning,danger:n.default.danger,info:n.default.info},c={sm:n.default.sm,md:n.default.md,lg:n.default.lg},l={none:n.default.radiusNone,xs:n.default.radiusXs,sm:n.default.radiusSm,md:n.default.radiusMd,lg:n.default.radiusLg,xl:n.default.radiusXl,"2xl":n.default.radius2xl,pill:n.default.radiusPill},u={"top-end":n.default.topEnd,"top-start":n.default.topStart,"bottom-end":n.default.bottomEnd,"bottom-start":n.default.bottomStart},d={rectangle:n.default.overlapRectangle,circle:n.default.overlapCircle};function f(e,t=99){return e>t?`${t}+`:String(e)}var p=e=>typeof e==`number`?`${e}px`:e,m=({variant:r=`soft`,tone:a=`neutral`,size:u=`md`,radius:d=`pill`,count:p,max:m=99,showZero:h=!1,label:g,startIcon:_,dot:v=!1,caps:y=!1,className:b,children:x,...S})=>{let C=p!==void 0;if(C&&p===0&&!h)return null;let w=C?f(p,m):x,T=g!==void 0&&g!==``;return(0,i.jsxs)(`span`,{...S,className:e.cx(n.default.root,o[r],s[a],c[u],l[d],C&&n.default.count,y&&n.default.caps,b),children:[(0,i.jsxs)(`span`,{className:n.default.content,"aria-hidden":T?!0:void 0,children:[v&&(0,i.jsx)(`span`,{className:n.default.dot,"aria-hidden":`true`}),_!=null&&(0,i.jsx)(`span`,{className:n.default.icon,"aria-hidden":`true`,children:_}),w!=null&&w!==``&&(0,i.jsx)(`span`,{className:n.default.label,children:w})]}),T&&(0,i.jsx)(t.VisuallyHidden,{children:g})]})},h=({children:l,variant:m=`solid`,tone:h=`accent`,size:g=`md`,count:_,max:v=99,showZero:y=!1,label:b,dot:x=!1,content:S,placement:C=`top-end`,overlap:w=`rectangle`,offset:T,invisible:E=!1,badgeClassName:D,className:O,style:k,...A})=>{let j=!x&&_!==void 0,M=E||j&&_===0&&!y,N=x?null:j?f(_,v):S,P=b!==void 0&&b!==``&&!M,F=!M&&(x||N!=null)&&(b===void 0||b===``);(0,r.useEffect)(()=>{a&&F&&console.warn('[BadgeAnchor] Pass a `label` (e.g. "3 unread messages") so screen readers get the badge\'s meaning; the visual dot or count is hidden from them.')},[F]);let[I,L]=T===void 0?[void 0,void 0]:Array.isArray(T)?T:[T,T],R=T===void 0?k:{"--badge-offset-x":p(I),"--badge-offset-y":p(L),...k};return(0,i.jsxs)(`span`,{...A,className:e.cx(n.default.anchor,O),style:R,children:[l,(0,i.jsxs)(`span`,{className:e.cx(n.default.root,n.default.anchored,o[m],s[h],c[g],n.default.radiusPill,u[C],d[w],x?n.default.anchoredDot:n.default.count,M&&n.default.invisible,D),"data-state":M?`hidden`:`visible`,children:[!x&&(0,i.jsx)(`span`,{className:n.default.content,"aria-hidden":`true`,children:N!=null&&N!==``&&(0,i.jsx)(`span`,{className:n.default.label,children:N})}),P&&(0,i.jsx)(t.VisuallyHidden,{children:b})]})]})};exports.Badge=m,exports.BadgeAnchor=h,exports.formatBadgeCount=f;

package/dist/components/data-display/Badge/Badge.mjs

@@ -1,9 +1,10 @@
+"use client";
 import { cx as e } from "../../../utils/cx.mjs";
 import { VisuallyHidden as t } from "../../utilities/VisuallyHidden/VisuallyHidden.mjs";
 import n from "./Badge.module.css.mjs";
 import { useEffect as r } from "react";
 import { jsx as i, jsxs as a } from "react/jsx-runtime";
-//#region src/components/data-display/Badge/Badge.tsx
+// src/components/data-display/Badge/Badge.tsx
 var o = globalThis.process?.env?.NODE_ENV !== "production", s = {
 	solid: n.solid,
 	soft: n.soft,
@@ -97,5 +98,4 @@ var m = (e) => typeof e == "number" ? `${e}px` : e, h = ({ variant: r = "soft",
 		})]
 	});
 };
-//#endregion
 export { h as Badge, g as BadgeAnchor, p as formatBadgeCount };

package/dist/components/data-display/Badge/Badge.module.css.mjs

@@ -1,4 +1,4 @@
-//#region src/components/data-display/Badge/Badge.module.css
+// src/components/data-display/Badge/Badge.module.css
 var e = "_root_54g55_23", t = "_content_54g55_95", n = "_label_54g55_107", r = "_icon_54g55_115", i = "_dot_54g55_141", a = "_solid_54g55_163", o = "_soft_54g55_173", s = "_outline_54g55_183", c = "_inverse_54g55_199", l = "_neutral_54g55_213", u = "_primary_54g55_229", d = "_accent_54g55_245", f = "_success_54g55_261", p = "_warning_54g55_277", m = "_danger_54g55_293", h = "_info_54g55_309", g = "_sm_54g55_329", _ = "_md_54g55_347", v = "_lg_54g55_365", y = "_radiusNone_54g55_387", b = "_radiusXs_54g55_393", x = "_radiusSm_54g55_399", S = "_radiusMd_54g55_405", C = "_radiusLg_54g55_411", w = "_radiusXl_54g55_417", T = "_radius2xl_54g55_423", E = "_radiusPill_54g55_429", D = "_count_54g55_443", O = "_caps_54g55_457", k = "_anchor_54g55_477", A = "_anchored_54g55_491", j = "_anchoredDot_54g55_573", M = "_overlapRectangle_54g55_647", N = "_overlapCircle_54g55_653", P = "_topEnd_54g55_661", F = "_topStart_54g55_673", I = "_bottomEnd_54g55_685", L = "_bottomStart_54g55_697", R = "_invisible_54g55_733", z = {
 	root: e,
 	content: t,
@@ -40,5 +40,4 @@ var e = "_root_54g55_23", t = "_content_54g55_95", n = "_label_54g55_107", r = "
 	bottomStart: L,
 	invisible: R
 };
-//#endregion
 export { d as accent, k as anchor, A as anchored, j as anchoredDot, I as bottomEnd, L as bottomStart, O as caps, t as content, D as count, m as danger, z as default, i as dot, r as icon, h as info, c as inverse, R as invisible, n as label, v as lg, _ as md, l as neutral, s as outline, N as overlapCircle, M as overlapRectangle, u as primary, T as radius2xl, C as radiusLg, S as radiusMd, y as radiusNone, E as radiusPill, x as radiusSm, w as radiusXl, b as radiusXs, e as root, g as sm, o as soft, a as solid, f as success, P as topEnd, F as topStart, p as warning };

package/dist/components/data-display/Card/Card.cjs.js

@@ -1 +1 @@
-const e=require("../../../utils/cx.cjs.js"),t=require("../../../utils/fillSlot.cjs.js"),n=require("../../primitives/Icon/Icon.cjs.js"),r=require("../../primitives/Typography/Typography.cjs.js"),i=require("./Card.module.css.cjs.js");let a=require("react"),o=require("react/jsx-runtime");var s={elevated:i.default.elevated,outline:i.default.outline,filled:i.default.filled,soft:i.default.soft},c={neutral:i.default.toneNeutral,primary:i.default.tonePrimary,accent:i.default.toneAccent,success:i.default.toneSuccess,warning:i.default.toneWarning,danger:i.default.toneDanger,info:i.default.toneInfo},l={none:i.default.radiusNone,xs:i.default.radiusXs,sm:i.default.radiusSm,md:i.default.radiusMd,lg:i.default.radiusLg,xl:i.default.radiusXl,"2xl":i.default.radius2xl,pill:i.default.radiusPill},u={none:i.default.paddingNone,sm:i.default.paddingSm,md:i.default.paddingMd,lg:i.default.paddingLg},d={vertical:i.default.vertical,horizontal:i.default.horizontal},f={"16/9":i.default.aspect16x9,"4/3":i.default.aspect4x3,"3/2":i.default.aspect3x2,"1/1":i.default.aspect1x1,"21/9":i.default.aspect21x9,auto:i.default.aspectAuto},p={top:i.default.mediaTop,bottom:i.default.mediaBottom,start:i.default.mediaStart},m={start:i.default.justifyStart,center:i.default.justifyCenter,end:i.default.justifyEnd,between:i.default.justifyBetween,stretch:i.default.justifyStretch},h=(0,a.createContext)(null);function g(t){let{as:r,variant:f=`elevated`,tone:p,radius:m=`xl`,padding:g=`md`,orientation:_=`vertical`,interactive:v=!1,selected:y=!1,className:b,children:x,...S}=t,w=r??`article`,T=p??(f===`soft`?`primary`:void 0),[E,D]=(0,a.useState)([]),O=(0,a.useCallback)(e=>(D(t=>t.includes(e)?t:[...t,e]),()=>D(t=>t.filter(t=>t!==e))),[]),k=E[0]??null,A={orientation:_,registerTitle:O},j=x;if(_===`horizontal`){let e=[],t=[];a.Children.forEach(x,n=>{(0,a.isValidElement)(n)&&n.type===C?e.push(n):n!=null&&typeof n!=`boolean`&&t.push(n)}),j=(0,o.jsxs)(`div`,{className:i.default.layout,children:[e,(0,o.jsx)(`div`,{className:i.default.content,children:t})]})}let M=(r??`article`)===`article`&&k!==null&&S[`aria-label`]===void 0&&S[`aria-labelledby`]===void 0;return(0,o.jsx)(h.Provider,{value:A,children:(0,o.jsxs)(w,{"aria-labelledby":M?k:void 0,...S,"data-selected":y||void 0,className:e.cx(i.default.root,s[f],T&&c[T],l[m],u[g],d[_],v&&i.default.interactive,y&&i.default.selected,b),children:[j,y&&(0,o.jsx)(`span`,{className:i.default.selectedBadge,"aria-hidden":`true`,children:(0,o.jsx)(n.Icon,{name:`check`,size:`sm`,strokeWidth:3})})]})})}var _=e=>typeof e==`string`||typeof e==`number`;function v({title:t,description:n,action:r,className:a,children:s,...c}){let l=t!=null||n!=null||s!=null&&s!==!1;return(0,o.jsxs)(`div`,{...c,className:e.cx(i.default.header,a),children:[l&&(0,o.jsxs)(`div`,{className:i.default.headerText,children:[_(t)?(0,o.jsx)(y,{children:t}):t,_(n)?(0,o.jsx)(b,{children:n}):n,s]}),r!=null&&(0,o.jsx)(`div`,{className:i.default.action,children:r})]})}function y({level:t=3,size:n=`xl`,href:s,id:c,className:l,children:u,...d}){let f=(0,a.useContext)(h),p=(0,a.useId)(),m=c??`${p}-title`,g=f?.registerTitle;return(0,a.useEffect)(()=>{if(g)return g(m)},[g,m]),(0,o.jsx)(r.Heading,{...d,id:m,level:t,size:n,tone:`inherit`,className:e.cx(i.default.title,l),children:s===void 0?u:(0,o.jsx)(w,{href:s,children:u})})}function b({className:t,...n}){return(0,o.jsx)(r.Text,{...n,size:`sm`,tone:`inherit`,className:e.cx(i.default.description,t)})}function x({className:t,...n}){return(0,o.jsx)(`div`,{...n,className:e.cx(i.default.body,t)})}function S({justify:t=`end`,className:n,...r}){return(0,o.jsx)(`div`,{...r,className:e.cx(i.default.footer,m[t],n)})}function C({aspectRatio:n=`16/9`,position:r,className:s,...c}){let l=(0,a.useContext)(h),u=r??(l?.orientation===`horizontal`?`start`:`top`);return(0,o.jsx)(t.FillSlotContext.Provider,{value:!0,children:(0,o.jsx)(`div`,{...c,className:e.cx(i.default.media,f[n],p[u],s)})})}function w(t){let{as:n,className:r,...a}=t;return(0,o.jsx)(n??`a`,{type:n===`button`?`button`:void 0,...a,className:e.cx(i.default.overlay,r)})}var T=Object.assign(g,{Header:v,Title:y,Description:b,Body:x,Footer:S,Media:C,LinkOverlay:w});exports.Card=T,exports.CardBody=x,exports.CardDescription=b,exports.CardFooter=S,exports.CardHeader=v,exports.CardLinkOverlay=w,exports.CardMedia=C,exports.CardTitle=y;
+"use client";const e=require("../../../utils/cx.cjs.js"),t=require("../../../utils/fillSlot.cjs.js"),n=require("../../primitives/Icon/Icon.cjs.js"),r=require("../../primitives/Typography/Typography.cjs.js"),i=require("./Card.module.css.cjs.js");let a=require("react"),o=require("react/jsx-runtime");var s={elevated:i.default.elevated,outline:i.default.outline,filled:i.default.filled,soft:i.default.soft},c={neutral:i.default.toneNeutral,primary:i.default.tonePrimary,accent:i.default.toneAccent,success:i.default.toneSuccess,warning:i.default.toneWarning,danger:i.default.toneDanger,info:i.default.toneInfo},l={none:i.default.radiusNone,xs:i.default.radiusXs,sm:i.default.radiusSm,md:i.default.radiusMd,lg:i.default.radiusLg,xl:i.default.radiusXl,"2xl":i.default.radius2xl,pill:i.default.radiusPill},u={none:i.default.paddingNone,sm:i.default.paddingSm,md:i.default.paddingMd,lg:i.default.paddingLg},d={vertical:i.default.vertical,horizontal:i.default.horizontal},f={"16/9":i.default.aspect16x9,"4/3":i.default.aspect4x3,"3/2":i.default.aspect3x2,"1/1":i.default.aspect1x1,"21/9":i.default.aspect21x9,auto:i.default.aspectAuto},p={top:i.default.mediaTop,bottom:i.default.mediaBottom,start:i.default.mediaStart},m={start:i.default.justifyStart,center:i.default.justifyCenter,end:i.default.justifyEnd,between:i.default.justifyBetween,stretch:i.default.justifyStretch},h=(0,a.createContext)(null);function g(t){let{as:r,variant:f=`elevated`,tone:p,radius:m=`xl`,padding:g=`md`,orientation:_=`vertical`,interactive:v=!1,selected:y=!1,className:b,children:x,...S}=t,w=r??`article`,T=p??(f===`soft`?`primary`:void 0),[E,D]=(0,a.useState)([]),O=(0,a.useCallback)(e=>(D(t=>t.includes(e)?t:[...t,e]),()=>D(t=>t.filter(t=>t!==e))),[]),k=E[0]??null,A={orientation:_,registerTitle:O},j=x;if(_===`horizontal`){let e=[],t=[];a.Children.forEach(x,n=>{(0,a.isValidElement)(n)&&n.type===C?e.push(n):n!=null&&typeof n!=`boolean`&&t.push(n)}),j=(0,o.jsxs)(`div`,{className:i.default.layout,children:[e,(0,o.jsx)(`div`,{className:i.default.content,children:t})]})}let M=(r??`article`)===`article`&&k!==null&&S[`aria-label`]===void 0&&S[`aria-labelledby`]===void 0;return(0,o.jsx)(h.Provider,{value:A,children:(0,o.jsxs)(w,{"aria-labelledby":M?k:void 0,...S,"data-selected":y||void 0,className:e.cx(i.default.root,s[f],T&&c[T],l[m],u[g],d[_],v&&i.default.interactive,y&&i.default.selected,b),children:[j,y&&(0,o.jsx)(`span`,{className:i.default.selectedBadge,"aria-hidden":`true`,children:(0,o.jsx)(n.Icon,{name:`check`,size:`sm`,strokeWidth:3})})]})})}var _=e=>typeof e==`string`||typeof e==`number`;function v({title:t,description:n,action:r,className:a,children:s,...c}){let l=t!=null||n!=null||s!=null&&s!==!1;return(0,o.jsxs)(`div`,{...c,className:e.cx(i.default.header,a),children:[l&&(0,o.jsxs)(`div`,{className:i.default.headerText,children:[_(t)?(0,o.jsx)(y,{children:t}):t,_(n)?(0,o.jsx)(b,{children:n}):n,s]}),r!=null&&(0,o.jsx)(`div`,{className:i.default.action,children:r})]})}function y({level:t=3,size:n=`xl`,href:s,id:c,className:l,children:u,...d}){let f=(0,a.useContext)(h),p=(0,a.useId)(),m=c??`${p}-title`,g=f?.registerTitle;return(0,a.useEffect)(()=>{if(g)return g(m)},[g,m]),(0,o.jsx)(r.Heading,{...d,id:m,level:t,size:n,tone:`inherit`,className:e.cx(i.default.title,l),children:s===void 0?u:(0,o.jsx)(w,{href:s,children:u})})}function b({className:t,...n}){return(0,o.jsx)(r.Text,{...n,size:`sm`,tone:`inherit`,className:e.cx(i.default.description,t)})}function x({className:t,...n}){return(0,o.jsx)(`div`,{...n,className:e.cx(i.default.body,t)})}function S({justify:t=`end`,className:n,...r}){return(0,o.jsx)(`div`,{...r,className:e.cx(i.default.footer,m[t],n)})}function C({aspectRatio:n=`16/9`,position:r,className:s,...c}){let l=(0,a.useContext)(h),u=r??(l?.orientation===`horizontal`?`start`:`top`);return(0,o.jsx)(t.FillSlotContext.Provider,{value:!0,children:(0,o.jsx)(`div`,{...c,className:e.cx(i.default.media,f[n],p[u],s)})})}function w(t){let{as:n,className:r,...a}=t;return(0,o.jsx)(n??`a`,{type:n===`button`?`button`:void 0,...a,className:e.cx(i.default.overlay,r)})}var T=Object.assign(g,{Header:v,Title:y,Description:b,Body:x,Footer:S,Media:C,LinkOverlay:w});exports.Card=T,exports.CardBody=x,exports.CardDescription=b,exports.CardFooter=S,exports.CardHeader=v,exports.CardLinkOverlay=w,exports.CardMedia=C,exports.CardTitle=y;

package/dist/components/data-display/Card/Card.mjs

@@ -1,3 +1,4 @@
+"use client";
 import { cx as e } from "../../../utils/cx.mjs";
 import { FillSlotContext as t } from "../../../utils/fillSlot.mjs";
 import { Icon as n } from "../../primitives/Icon/Icon.mjs";
@@ -5,7 +6,7 @@ import { Heading as r, Text as i } from "../../primitives/Typography/Typography.
 import a from "./Card.module.css.mjs";
 import { Children as o, createContext as s, isValidElement as c, useCallback as l, useContext as u, useEffect as d, useId as f, useState as p } from "react";
 import { jsx as m, jsxs as h } from "react/jsx-runtime";
-//#region src/components/data-display/Card/Card.tsx
+// src/components/data-display/Card/Card.tsx
 var g = {
 	elevated: a.elevated,
 	outline: a.outline,
@@ -174,5 +175,4 @@ var P = Object.assign(T, {
 	Media: M,
 	LinkOverlay: N
 });
-//#endregion
 export { P as Card, A as CardBody, k as CardDescription, j as CardFooter, D as CardHeader, N as CardLinkOverlay, M as CardMedia, O as CardTitle };

package/dist/components/data-display/Card/Card.module.css.mjs

@@ -1,4 +1,4 @@
-//#region src/components/data-display/Card/Card.module.css
+// src/components/data-display/Card/Card.module.css
 var e = "_root_txzt6_33", t = "_elevated_txzt6_113", n = "_outline_txzt6_123", r = "_toneNeutral_txzt6_137", i = "_tonePrimary_txzt6_137", a = "_toneAccent_txzt6_137", o = "_toneSuccess_txzt6_137", s = "_toneWarning_txzt6_137", c = "_toneDanger_txzt6_137", l = "_toneInfo_txzt6_137", u = "_filled_txzt6_145", d = "_soft_txzt6_159", f = "_radiusNone_txzt6_249", p = "_radiusXs_txzt6_255", m = "_radiusSm_txzt6_261", h = "_radiusMd_txzt6_267", g = "_radiusLg_txzt6_273", _ = "_radiusXl_txzt6_279", v = "_radius2xl_txzt6_285", y = "_radiusPill_txzt6_293", b = "_paddingNone_txzt6_303", x = "_paddingSm_txzt6_311", S = "_paddingMd_txzt6_319", C = "_paddingLg_txzt6_327", w = "_vertical_txzt6_341", T = "_horizontal_txzt6_353", E = "_layout_txzt6_365", D = "_content_txzt6_379", O = "_mediaStart_txzt6_409", k = "_header_txzt6_449", A = "_headerText_txzt6_465", j = "_action_txzt6_481", M = "_title_txzt6_497", N = "_description_txzt6_507", P = "_body_txzt6_521", F = "_footer_txzt6_547", I = "_justifyStart_txzt6_565", L = "_justifyCenter_txzt6_571", R = "_justifyEnd_txzt6_577", z = "_justifyBetween_txzt6_583", B = "_justifyStretch_txzt6_589", V = "_media_txzt6_409", H = "_aspect16x9_txzt6_651", U = "_aspect4x3_txzt6_657", W = "_aspect3x2_txzt6_663", G = "_aspect1x1_txzt6_669", K = "_aspect21x9_txzt6_675", q = "_aspectAuto_txzt6_681", J = "_mediaTop_txzt6_699", Y = "_mediaBottom_txzt6_715", X = "_overlay_txzt6_729", Z = "_interactive_txzt6_831", Q = "_selected_txzt6_883", $ = "_selectedBadge_txzt6_895", ee = {
 	root: e,
 	elevated: t,
@@ -55,5 +55,4 @@ var e = "_root_txzt6_33", t = "_elevated_txzt6_113", n = "_outline_txzt6_123", r
 	selected: Q,
 	selectedBadge: $
 };
-//#endregion
 export { j as action, H as aspect16x9, G as aspect1x1, K as aspect21x9, W as aspect3x2, U as aspect4x3, q as aspectAuto, P as body, D as content, ee as default, N as description, t as elevated, u as filled, F as footer, k as header, A as headerText, T as horizontal, Z as interactive, z as justifyBetween, L as justifyCenter, R as justifyEnd, I as justifyStart, B as justifyStretch, E as layout, V as media, Y as mediaBottom, O as mediaStart, J as mediaTop, n as outline, X as overlay, C as paddingLg, S as paddingMd, b as paddingNone, x as paddingSm, v as radius2xl, g as radiusLg, h as radiusMd, f as radiusNone, y as radiusPill, m as radiusSm, _ as radiusXl, p as radiusXs, e as root, Q as selected, $ as selectedBadge, d as soft, M as title, a as toneAccent, c as toneDanger, l as toneInfo, r as toneNeutral, i as tonePrimary, o as toneSuccess, s as toneWarning, w as vertical };