@vjdesigns/vjdesigns-ui 2.4.0 → 2.5.0

package/dist/components/navigation/Sidebar/Sidebar.mjs

@@ -1,59 +1,60 @@
-import { useControllableState as e } from "../../../hooks/useControllableState.mjs";
-import { getFocusable as t } from "../../../hooks/useFocusTrap.mjs";
-import { useMessages as n } from "../../utilities/LocaleProvider/LocaleProvider.mjs";
-import { useMergedRef as r } from "../../../hooks/useMergedRef.mjs";
-import { cx as i } from "../../../utils/cx.mjs";
-import { Drawer as a } from "../../overlays/Drawer/Drawer.mjs";
-import { SidebarContext as o, useSidebar as s } from "./SidebarContext.mjs";
-import c from "./Sidebar.module.css.mjs";
-import { SidebarBody as l, SidebarFooter as u, SidebarGroup as d, SidebarHeader as f, SidebarItem as p, SidebarSection as m, SidebarToggle as h } from "./SidebarParts.mjs";
+"use client";
+import { getFocusable as e } from "../../../hooks/useFocusTrap.mjs";
+import { useMergedRef as t } from "../../../hooks/useMergedRef.mjs";
+import { useControllableState as n } from "../../../hooks/useControllableState.mjs";
+import { cx as r } from "../../../utils/cx.mjs";
+import { Drawer as i } from "../../overlays/Drawer/Drawer.mjs";
+import { SidebarContext as a, useSidebar as o } from "./SidebarContext.mjs";
+import { SidebarBody as s, SidebarFooter as c, SidebarGroup as l, SidebarHeader as u, SidebarItem as d, SidebarSection as f, SidebarToggle as p } from "./SidebarParts.mjs";
+import m from "./Sidebar.module.css.mjs";
+import { useMessages as h } from "../../utilities/LocaleProvider/LocaleProvider.mjs";
 import { useCallback as g, useEffect as _, useId as v, useLayoutEffect as y, useMemo as b, useRef as x, useState as S } from "react";
-import { jsx as C, jsxs as w } from "react/jsx-runtime";
-//#region src/components/navigation/Sidebar/Sidebar.tsx
-var ee = {
-	sm: c.sm,
-	md: c.md,
-	lg: c.lg
+import { jsx as C, jsxs as ee } from "react/jsx-runtime";
+// src/components/navigation/Sidebar/Sidebar.tsx
+var w = {
+	sm: m.sm,
+	md: m.md,
+	lg: m.lg
 };
-function T({ memory: e }) {
+function T({ memory: t }) {
 	let n = x(null);
 	return y(() => {
 		let r = n.current?.parentElement;
 		return () => {
 			let n = document.activeElement;
-			r && n instanceof HTMLElement && r.contains(n) && (e.current = t(r).indexOf(n));
+			r && n instanceof HTMLElement && r.contains(n) && (t.current = e(r).indexOf(n));
 		};
-	}, [e]), /* @__PURE__ */ C("span", {
+	}, [t]), /* @__PURE__ */ C("span", {
 		ref: n,
 		hidden: !0
 	});
 }
-var E = ({ children: s, mode: l = "static", collapsed: u, defaultCollapsed: d = !1, onCollapsedChange: f, open: p, defaultOpen: m = !1, onOpenChange: h, closeOnNavigate: y = !0, overlayLabel: E, size: D = "md", tooltipPlacement: O = "end", id: k, className: A, "aria-label": j, "aria-labelledby": M, ref: N, ...P }) => {
-	let F = x(null), I = r(F, N), [L] = S(() => /* @__PURE__ */ new Map()), R = x(null);
+var E = ({ children: o, mode: s = "static", collapsed: c, defaultCollapsed: l = !1, onCollapsedChange: u, open: d, defaultOpen: f = !1, onOpenChange: p, closeOnNavigate: y = !0, overlayLabel: E, size: D = "md", tooltipPlacement: O = "end", id: k, className: A, "aria-label": j, "aria-labelledby": M, ref: N, ...P }) => {
+	let F = x(null), I = t(F, N), [L] = S(() => /* @__PURE__ */ new Map()), R = x(null);
 	_(() => {
-		let e = R.current;
+		let t = R.current;
 		R.current = null;
 		let n = F.current;
-		if (e === null || e < 0 || !n) return;
-		let r = t(n);
-		(r[e] ?? r[0])?.focus();
-	}, [l]);
-	let z = n(), B = v(), V = k ?? `sidebar-${B}`, H = M ? void 0 : j ?? z.sidebar.nav, [U, W] = e({
-		value: u,
-		defaultValue: d,
-		onChange: f
-	}), [G, K] = e({
-		value: p,
-		defaultValue: m,
-		onChange: h
-	}), q = l === "overlay", J = !q && U, Y = q && G, X = g((e) => W(e), [W]), Z = g((e) => K(e), [K]), Q = g(() => {
+		if (t === null || t < 0 || !n) return;
+		let r = e(n);
+		(r[t] ?? r[0])?.focus();
+	}, [s]);
+	let z = h(), B = v(), V = k ?? `sidebar-${B}`, H = M ? void 0 : j ?? z.sidebar.nav, [U, W] = n({
+		value: c,
+		defaultValue: l,
+		onChange: u
+	}), [G, K] = n({
+		value: d,
+		defaultValue: f,
+		onChange: p
+	}), q = s === "overlay", J = !q && U, Y = q && G, X = g((e) => W(e), [W]), Z = g((e) => K(e), [K]), Q = g(() => {
 		q && y && K(!1);
 	}, [
 		q,
 		y,
 		K
 	]), te = b(() => ({
-		mode: l,
+		mode: s,
 		collapsed: J,
 		setCollapsed: X,
 		open: Y,
@@ -64,7 +65,7 @@ var E = ({ children: s, mode: l = "static", collapsed: u, defaultCollapsed: d =
 		onNavigate: Q,
 		groupOpen: L
 	}), [
-		l,
+		s,
 		J,
 		X,
 		Y,
@@ -74,25 +75,25 @@ var E = ({ children: s, mode: l = "static", collapsed: u, defaultCollapsed: d =
 		O,
 		Q,
 		L
-	]), $ = /* @__PURE__ */ w("nav", {
+	]), $ = /* @__PURE__ */ ee("nav", {
 		...P,
 		ref: I,
 		id: V,
 		"aria-label": H,
 		"aria-labelledby": M,
-		"data-mode": l,
+		"data-mode": s,
 		"data-collapsed": J || void 0,
-		className: i(c.root, ee[D], q ? c.overlay : c.static, J && c.collapsed, A),
-		children: [/* @__PURE__ */ C(T, { memory: R }), s]
+		className: r(m.root, w[D], q ? m.overlay : m.static, J && m.collapsed, A),
+		children: [/* @__PURE__ */ C(T, { memory: R }), o]
 	});
-	return /* @__PURE__ */ C(o.Provider, {
+	return /* @__PURE__ */ C(a.Provider, {
 		value: te,
-		children: q ? /* @__PURE__ */ C(a, {
+		children: q ? /* @__PURE__ */ C(i, {
 			open: Y,
 			onOpenChange: Z,
 			side: "start",
 			size: "sm",
-			children: /* @__PURE__ */ C(a.Content, {
+			children: /* @__PURE__ */ C(i.Content, {
 				"aria-label": E ?? j ?? z.sidebar.nav,
 				children: $
 			})
@@ -101,13 +102,12 @@ var E = ({ children: s, mode: l = "static", collapsed: u, defaultCollapsed: d =
 };
 E.displayName = "Sidebar";
 var D = Object.assign(E, {
-	Header: f,
-	Body: l,
-	Section: m,
-	Item: p,
-	Group: d,
-	Footer: u,
-	Toggle: h
+	Header: u,
+	Body: s,
+	Section: f,
+	Item: d,
+	Group: l,
+	Footer: c,
+	Toggle: p
 });
-//#endregion
-export { D as Sidebar, l as SidebarBody, u as SidebarFooter, d as SidebarGroup, f as SidebarHeader, p as SidebarItem, m as SidebarSection, h as SidebarToggle, s as useSidebar };
+export { D as Sidebar, s as SidebarBody, c as SidebarFooter, l as SidebarGroup, u as SidebarHeader, d as SidebarItem, f as SidebarSection, p as SidebarToggle, o as useSidebar };

package/dist/components/navigation/Sidebar/Sidebar.module.css.mjs

@@ -1,4 +1,4 @@
-//#region src/components/navigation/Sidebar/Sidebar.module.css
+// src/components/navigation/Sidebar/Sidebar.module.css
 var e = "_root_1yk86_19", t = "_sm_1yk86_73", n = "_md_1yk86_93", r = "_lg_1yk86_101", i = "_collapsed_1yk86_141", a = "_overlay_1yk86_151", o = "_header_1yk86_169", s = "_body_1yk86_209", c = "_footer_1yk86_235", l = "_list_1yk86_255", u = "_section_1yk86_271", d = "_sectionHeading_1yk86_281", f = "_subList_1yk86_353", p = "_listItem_1yk86_377", m = "_item_1yk86_397", h = "_disabled_1yk86_467", g = "_icon_1yk86_485", _ = "_label_1yk86_515", v = "_badge_1yk86_533", y = "_chevron_1yk86_545", b = "_groupTrigger_1yk86_563", x = "_railDot_1yk86_573", S = "_active_1yk86_583", C = "_groupContent_1yk86_711", w = "_groupClip_1yk86_745", T = "_nested_1yk86_771", E = "_toggle_1yk86_805", D = "_toggleIcon_1yk86_823", O = {
 	root: e,
 	sm: t,
@@ -30,5 +30,4 @@ var e = "_root_1yk86_19", t = "_sm_1yk86_73", n = "_md_1yk86_93", r = "_lg_1yk86
 	toggle: E,
 	toggleIcon: D
 };
-//#endregion
 export { S as active, v as badge, s as body, y as chevron, i as collapsed, O as default, h as disabled, c as footer, w as groupClip, C as groupContent, b as groupTrigger, o as header, g as icon, m as item, _ as label, r as lg, l as list, p as listItem, n as md, T as nested, a as overlay, x as railDot, e as root, u as section, d as sectionHeading, t as sm, f as subList, E as toggle, D as toggleIcon };

package/dist/components/navigation/Sidebar/SidebarContext.cjs.js

@@ -1 +1 @@
-let e=require("react");var t=(0,e.createContext)(null);function n(n){let r=(0,e.useContext)(t);if(!r)throw Error(`${n} must be used inside <Sidebar>.`);return r}function r(){let{mode:e,collapsed:t,setCollapsed:r,open:i,setOpen:a}=n(`useSidebar`);return{mode:e,collapsed:t,setCollapsed:r,open:i,setOpen:a}}var i=(0,e.createContext)(0);exports.SidebarContext=t,exports.SidebarDepthContext=i,exports.useSidebar=r,exports.useSidebarContext=n;
+"use client";let e=require("react");var t=(0,e.createContext)(null);function n(n){let r=(0,e.useContext)(t);if(!r)throw Error(`${n} must be used inside <Sidebar>.`);return r}function r(){let{mode:e,collapsed:t,setCollapsed:r,open:i,setOpen:a}=n(`useSidebar`);return{mode:e,collapsed:t,setCollapsed:r,open:i,setOpen:a}}var i=(0,e.createContext)(0);exports.SidebarContext=t,exports.SidebarDepthContext=i,exports.useSidebar=r,exports.useSidebarContext=n;

package/dist/components/navigation/Sidebar/SidebarContext.mjs

@@ -1,5 +1,6 @@
+"use client";
 import { createContext as e, useContext as t } from "react";
-//#region src/components/navigation/Sidebar/SidebarContext.ts
+// src/components/navigation/Sidebar/SidebarContext.ts
 var n = e(null);
 function r(e) {
 	let r = t(n);
@@ -17,5 +18,4 @@ function i() {
 	};
 }
 var a = e(0);
-//#endregion
 export { n as SidebarContext, a as SidebarDepthContext, i as useSidebar, r as useSidebarContext };

package/dist/components/navigation/Sidebar/SidebarParts.cjs.js

@@ -1 +1 @@
-const e=require("../../../hooks/useControllableState.cjs.js"),t=require("../../utilities/LocaleProvider/LocaleProvider.cjs.js"),n=require("../../../utils/cx.cjs.js"),r=require("../../primitives/Button/Button.cjs.js"),i=require("../../primitives/Icon/icons.cjs.js"),a=require("../../data-display/Badge/Badge.cjs.js"),o=require("../../overlays/Tooltip/Tooltip.cjs.js"),s=require("./SidebarContext.cjs.js"),c=require("./Sidebar.module.css.cjs.js");let l=require("react"),u=require("react/jsx-runtime");var d=e=>e!==void 0&&e!==``&&e!==0;function f({badge:e,badgeLabel:t,badgeTone:n}){return d(e)?typeof e==`number`?(0,u.jsx)(a.Badge,{variant:`solid`,tone:n,size:`sm`,count:e,label:t}):(0,u.jsx)(a.Badge,{variant:`solid`,tone:n,size:`sm`,label:t,children:e}):null}function p({icon:e,label:t,badge:n,trailing:r}){return(0,u.jsxs)(u.Fragment,{children:[e!=null&&(0,u.jsx)(`span`,{className:c.default.icon,"aria-hidden":`true`,children:e}),(0,u.jsx)(`span`,{className:c.default.label,children:t}),n!=null&&(0,u.jsxs)(u.Fragment,{children:[` `,(0,u.jsx)(`span`,{className:c.default.badge,children:n}),(0,u.jsx)(`span`,{className:c.default.railDot,"aria-hidden":`true`})]}),r]})}function m(e,{badge:t,badgeLabel:n}){let r=d(t)?n||(typeof t==`number`?a.formatBadgeCount(t):t):null;return typeof e==`string`||typeof e==`number`?r==null?String(e):`${e} ${r}`:r==null?e:(0,u.jsxs)(u.Fragment,{children:[e,` `,r]})}var h=({className:e,children:t,...r})=>(0,u.jsx)(`div`,{...r,className:n.cx(c.default.header,e),children:t});h.displayName=`Sidebar.Header`;var g=({className:e,children:t,...r})=>(0,u.jsx)(`div`,{...r,className:n.cx(c.default.body,e),children:t});g.displayName=`Sidebar.Body`;var _=({className:e,children:t,...r})=>(0,u.jsx)(`div`,{...r,className:n.cx(c.default.footer,e),children:t});_.displayName=`Sidebar.Footer`;var v=({heading:e,headingLevel:t,className:r,children:i,...a})=>{let o=(0,l.useId)(),s=e!=null&&e!==!1&&e!==``,d=t?`h${t}`:`div`;return(0,u.jsxs)(`div`,{role:s?`group`:void 0,"aria-labelledby":s?o:void 0,...a,className:n.cx(c.default.section,r),children:[s&&(0,u.jsx)(d,{id:o,className:c.default.sectionHeading,children:e}),(0,u.jsx)(`ul`,{className:c.default.list,children:i})]})};v.displayName=`Sidebar.Section`;var y=e=>{let{children:t,icon:r,active:i=!1,badge:a,badgeLabel:d,badgeTone:h=`accent`,disabled:g=!1,className:_,href:v,role:y,onClick:b,"aria-current":x,...S}=e,{collapsed:C,tooltipPlacement:w,onNavigate:T}=s.useSidebarContext(`Sidebar.Item`),E=(0,l.useContext)(s.SidebarDepthContext),D=C&&E===0,O=f({badge:a,badgeLabel:d,badgeTone:h}),k=e=>{if(g){e.preventDefault();return}b?.(e),T()},A={...S,className:n.cx(c.default.item,E>0&&c.default.nested,i&&c.default.active,g&&c.default.disabled,_),"aria-current":i?x??`page`:x,"data-active":i||void 0,onClick:k},j=(0,u.jsx)(p,{icon:r,label:t,badge:O}),M=v===void 0?(0,u.jsx)(`button`,{type:`button`,...A,ref:S.ref,role:y,disabled:g,children:j}):(0,u.jsx)(`a`,{...A,ref:S.ref,href:g?void 0:v,role:g?`link`:y,"aria-disabled":g||void 0,children:j});return(0,u.jsx)(`li`,{className:c.default.listItem,children:(0,u.jsx)(o.Tooltip,{content:m(t,{badge:a,badgeLabel:d,badgeTone:h}),placement:w,relationship:`label`,disabled:!D,children:M})})};y.displayName=`Sidebar.Item`;var b=({label:t,icon:r,children:a,open:d,defaultOpen:h=!1,onOpenChange:g,active:_=!1,badge:v,badgeLabel:y,badgeTone:b=`accent`,disabled:x=!1,value:S,className:C,...w})=>{let{collapsed:T,setCollapsed:E,tooltipPlacement:D,groupOpen:O}=s.useSidebarContext(`Sidebar.Group`),k=(0,l.useContext)(s.SidebarDepthContext),A=T&&k===0,j=S??(typeof t==`string`?t:void 0),[M,N]=e.useControllableState({value:d,defaultValue:(j===void 0?void 0:O.get(j))??h,onChange:e=>{j!==void 0&&O.set(j,e),g?.(e)}}),P=(0,l.useId)(),F=M&&!A,I=F?`open`:`closed`,L=f({badge:v,badgeLabel:y,badgeTone:b}),R=()=>{A?(E(!1),N(!0)):N(!M)};return(0,u.jsxs)(`li`,{...w,className:n.cx(c.default.listItem,C),"data-state":I,children:[(0,u.jsx)(o.Tooltip,{content:m(t,{badge:v,badgeLabel:y,badgeTone:b}),placement:D,relationship:`label`,disabled:!A,children:(0,u.jsx)(`button`,{type:`button`,className:n.cx(c.default.item,c.default.groupTrigger,k>0&&c.default.nested,_&&!F&&c.default.active,x&&c.default.disabled),"aria-expanded":F,"aria-controls":P,"data-state":I,disabled:x,onClick:R,children:(0,u.jsx)(p,{icon:r,label:t,badge:L,trailing:(0,u.jsx)(`span`,{className:c.default.chevron,"aria-hidden":`true`,children:(0,u.jsx)(i.ChevronDownIcon,{size:`sm`})})})})}),(0,u.jsx)(`div`,{className:c.default.groupContent,"data-state":I,children:(0,u.jsx)(`div`,{className:c.default.groupClip,children:(0,u.jsx)(`ul`,{id:P,className:c.default.subList,children:(0,u.jsx)(s.SidebarDepthContext.Provider,{value:k+1,children:a})})})})]})};b.displayName=`Sidebar.Group`;var x=({collapseLabel:e,expandLabel:a,variant:l=`ghost`,tone:d=`neutral`,size:f=`sm`,className:p,children:m,onClick:h,...g})=>{let _=t.useMessages(),v=e??_.sidebar.collapse,y=a??_.sidebar.expand,{mode:b,collapsed:x,setCollapsed:S,navId:C,tooltipPlacement:w}=s.useSidebarContext(`Sidebar.Toggle`);if(b===`overlay`)return null;let T=x?y:v;return(0,u.jsx)(o.Tooltip,{content:T,placement:w,relationship:`label`,children:(0,u.jsx)(r.IconButton,{variant:l,tone:d,size:f,"aria-controls":C,...g,"aria-label":T,className:n.cx(c.default.toggle,p),onClick:e=>{h?.(e),e.defaultPrevented||S(!x)},children:m??(0,u.jsx)(`span`,{className:c.default.toggleIcon,children:(0,u.jsx)(i.ChevronLeftIcon,{})})})})};x.displayName=`Sidebar.Toggle`,exports.SidebarBody=g,exports.SidebarFooter=_,exports.SidebarGroup=b,exports.SidebarHeader=h,exports.SidebarItem=y,exports.SidebarSection=v,exports.SidebarToggle=x;
+"use client";const e=require("../../../hooks/useControllableState.cjs.js"),t=require("../../../utils/cx.cjs.js"),n=require("../../data-display/Badge/Badge.cjs.js"),r=require("../../overlays/Tooltip/Tooltip.cjs.js"),i=require("../../primitives/Button/Button.cjs.js"),a=require("../../primitives/Icon/icons.cjs.js"),o=require("./SidebarContext.cjs.js"),s=require("./Sidebar.module.css.cjs.js"),c=require("../../utilities/LocaleProvider/LocaleProvider.cjs.js");let l=require("react"),u=require("react/jsx-runtime");var d=e=>e!==void 0&&e!==``&&e!==0;function f({badge:e,badgeLabel:t,badgeTone:r}){return d(e)?typeof e==`number`?(0,u.jsx)(n.Badge,{variant:`solid`,tone:r,size:`sm`,count:e,label:t}):(0,u.jsx)(n.Badge,{variant:`solid`,tone:r,size:`sm`,label:t,children:e}):null}function p({icon:e,label:t,badge:n,trailing:r}){return(0,u.jsxs)(u.Fragment,{children:[e!=null&&(0,u.jsx)(`span`,{className:s.default.icon,"aria-hidden":`true`,children:e}),(0,u.jsx)(`span`,{className:s.default.label,children:t}),n!=null&&(0,u.jsxs)(u.Fragment,{children:[` `,(0,u.jsx)(`span`,{className:s.default.badge,children:n}),(0,u.jsx)(`span`,{className:s.default.railDot,"aria-hidden":`true`})]}),r]})}function m(e,{badge:t,badgeLabel:r}){let i=d(t)?r||(typeof t==`number`?n.formatBadgeCount(t):t):null;return typeof e==`string`||typeof e==`number`?i==null?String(e):`${e} ${i}`:i==null?e:(0,u.jsxs)(u.Fragment,{children:[e,` `,i]})}var h=({className:e,children:n,...r})=>(0,u.jsx)(`div`,{...r,className:t.cx(s.default.header,e),children:n});h.displayName=`Sidebar.Header`;var g=({className:e,children:n,...r})=>(0,u.jsx)(`div`,{...r,className:t.cx(s.default.body,e),children:n});g.displayName=`Sidebar.Body`;var _=({className:e,children:n,...r})=>(0,u.jsx)(`div`,{...r,className:t.cx(s.default.footer,e),children:n});_.displayName=`Sidebar.Footer`;var v=({heading:e,headingLevel:n,className:r,children:i,...a})=>{let o=(0,l.useId)(),c=e!=null&&e!==!1&&e!==``,d=n?`h${n}`:`div`;return(0,u.jsxs)(`div`,{role:c?`group`:void 0,"aria-labelledby":c?o:void 0,...a,className:t.cx(s.default.section,r),children:[c&&(0,u.jsx)(d,{id:o,className:s.default.sectionHeading,children:e}),(0,u.jsx)(`ul`,{className:s.default.list,children:i})]})};v.displayName=`Sidebar.Section`;var y=e=>{let{children:n,icon:i,active:a=!1,badge:c,badgeLabel:d,badgeTone:h=`accent`,disabled:g=!1,className:_,href:v,role:y,onClick:b,"aria-current":x,...S}=e,{collapsed:C,tooltipPlacement:w,onNavigate:T}=o.useSidebarContext(`Sidebar.Item`),E=(0,l.useContext)(o.SidebarDepthContext),D=C&&E===0,O=f({badge:c,badgeLabel:d,badgeTone:h}),k=e=>{g?e.preventDefault():(b?.(e),T())},A={...S,className:t.cx(s.default.item,E>0&&s.default.nested,a&&s.default.active,g&&s.default.disabled,_),"aria-current":a?x??`page`:x,"data-active":a||void 0,onClick:k},j=(0,u.jsx)(p,{icon:i,label:n,badge:O}),M=v===void 0?(0,u.jsx)(`button`,{type:`button`,...A,ref:S.ref,role:y,disabled:g,children:j}):(0,u.jsx)(`a`,{...A,ref:S.ref,href:g?void 0:v,role:g?`link`:y,"aria-disabled":g||void 0,children:j});return(0,u.jsx)(`li`,{className:s.default.listItem,children:(0,u.jsx)(r.Tooltip,{content:m(n,{badge:c,badgeLabel:d,badgeTone:h}),placement:w,relationship:`label`,disabled:!D,children:M})})};y.displayName=`Sidebar.Item`;var b=({label:n,icon:i,children:c,open:d,defaultOpen:h=!1,onOpenChange:g,active:_=!1,badge:v,badgeLabel:y,badgeTone:b=`accent`,disabled:x=!1,value:S,className:C,...w})=>{let{collapsed:T,setCollapsed:E,tooltipPlacement:D,groupOpen:O}=o.useSidebarContext(`Sidebar.Group`),k=(0,l.useContext)(o.SidebarDepthContext),A=T&&k===0,j=S??(typeof n==`string`?n:void 0),[M,N]=e.useControllableState({value:d,defaultValue:(j===void 0?void 0:O.get(j))??h,onChange:e=>{j!==void 0&&O.set(j,e),g?.(e)}}),P=(0,l.useId)(),F=M&&!A,I=F?`open`:`closed`,L=f({badge:v,badgeLabel:y,badgeTone:b}),R=()=>{A?(E(!1),N(!0)):N(!M)};return(0,u.jsxs)(`li`,{...w,className:t.cx(s.default.listItem,C),"data-state":I,children:[(0,u.jsx)(r.Tooltip,{content:m(n,{badge:v,badgeLabel:y,badgeTone:b}),placement:D,relationship:`label`,disabled:!A,children:(0,u.jsx)(`button`,{type:`button`,className:t.cx(s.default.item,s.default.groupTrigger,k>0&&s.default.nested,_&&!F&&s.default.active,x&&s.default.disabled),"aria-expanded":F,"aria-controls":P,"data-state":I,disabled:x,onClick:R,children:(0,u.jsx)(p,{icon:i,label:n,badge:L,trailing:(0,u.jsx)(`span`,{className:s.default.chevron,"aria-hidden":`true`,children:(0,u.jsx)(a.ChevronDownIcon,{size:`sm`})})})})}),(0,u.jsx)(`div`,{className:s.default.groupContent,"data-state":I,children:(0,u.jsx)(`div`,{className:s.default.groupClip,children:(0,u.jsx)(`ul`,{id:P,className:s.default.subList,children:(0,u.jsx)(o.SidebarDepthContext.Provider,{value:k+1,children:c})})})})]})};b.displayName=`Sidebar.Group`;var x=({collapseLabel:e,expandLabel:n,variant:l=`ghost`,tone:d=`neutral`,size:f=`sm`,className:p,children:m,onClick:h,...g})=>{let _=c.useMessages(),v=e??_.sidebar.collapse,y=n??_.sidebar.expand,{mode:b,collapsed:x,setCollapsed:S,navId:C,tooltipPlacement:w}=o.useSidebarContext(`Sidebar.Toggle`);if(b===`overlay`)return null;let T=x?y:v;return(0,u.jsx)(r.Tooltip,{content:T,placement:w,relationship:`label`,children:(0,u.jsx)(i.IconButton,{variant:l,tone:d,size:f,"aria-controls":C,...g,"aria-label":T,className:t.cx(s.default.toggle,p),onClick:e=>{h?.(e),e.defaultPrevented||S(!x)},children:m??(0,u.jsx)(`span`,{className:s.default.toggleIcon,children:(0,u.jsx)(a.ChevronLeftIcon,{})})})})};x.displayName=`Sidebar.Toggle`,exports.SidebarBody=g,exports.SidebarFooter=_,exports.SidebarGroup=b,exports.SidebarHeader=h,exports.SidebarItem=y,exports.SidebarSection=v,exports.SidebarToggle=x;

package/dist/components/navigation/Sidebar/SidebarParts.mjs

@@ -1,26 +1,27 @@
+"use client";
 import { useControllableState as e } from "../../../hooks/useControllableState.mjs";
-import { useMessages as t } from "../../utilities/LocaleProvider/LocaleProvider.mjs";
-import { cx as n } from "../../../utils/cx.mjs";
-import { IconButton as r } from "../../primitives/Button/Button.mjs";
-import { ChevronDownIcon as i, ChevronLeftIcon as a } from "../../primitives/Icon/icons.mjs";
-import { Badge as o, formatBadgeCount as s } from "../../data-display/Badge/Badge.mjs";
-import { Tooltip as c } from "../../overlays/Tooltip/Tooltip.mjs";
-import { SidebarDepthContext as l, useSidebarContext as u } from "./SidebarContext.mjs";
-import d from "./Sidebar.module.css.mjs";
+import { cx as t } from "../../../utils/cx.mjs";
+import { Badge as n, formatBadgeCount as r } from "../../data-display/Badge/Badge.mjs";
+import { Tooltip as i } from "../../overlays/Tooltip/Tooltip.mjs";
+import { IconButton as a } from "../../primitives/Button/Button.mjs";
+import { ChevronDownIcon as o, ChevronLeftIcon as s } from "../../primitives/Icon/icons.mjs";
+import { SidebarDepthContext as c, useSidebarContext as l } from "./SidebarContext.mjs";
+import u from "./Sidebar.module.css.mjs";
+import { useMessages as d } from "../../utilities/LocaleProvider/LocaleProvider.mjs";
 import { useContext as f, useId as p } from "react";
 import { Fragment as m, jsx as h, jsxs as g } from "react/jsx-runtime";
-//#region src/components/navigation/Sidebar/SidebarParts.tsx
+// src/components/navigation/Sidebar/SidebarParts.tsx
 var _ = (e) => e !== void 0 && e !== "" && e !== 0;
-function v({ badge: e, badgeLabel: t, badgeTone: n }) {
-	return _(e) ? typeof e == "number" ? /* @__PURE__ */ h(o, {
+function v({ badge: e, badgeLabel: t, badgeTone: r }) {
+	return _(e) ? typeof e == "number" ? /* @__PURE__ */ h(n, {
 		variant: "solid",
-		tone: n,
+		tone: r,
 		size: "sm",
 		count: e,
 		label: t
-	}) : /* @__PURE__ */ h(o, {
+	}) : /* @__PURE__ */ h(n, {
 		variant: "solid",
-		tone: n,
+		tone: r,
 		size: "sm",
 		label: t,
 		children: e
@@ -29,22 +30,22 @@ function v({ badge: e, badgeLabel: t, badgeTone: n }) {
 function y({ icon: e, label: t, badge: n, trailing: r }) {
 	return /* @__PURE__ */ g(m, { children: [
 		e != null && /* @__PURE__ */ h("span", {
-			className: d.icon,
+			className: u.icon,
 			"aria-hidden": "true",
 			children: e
 		}),
 		/* @__PURE__ */ h("span", {
-			className: d.label,
+			className: u.label,
 			children: t
 		}),
 		n != null && /* @__PURE__ */ g(m, { children: [
 			" ",
 			/* @__PURE__ */ h("span", {
-				className: d.badge,
+				className: u.badge,
 				children: n
 			}),
 			/* @__PURE__ */ h("span", {
-				className: d.railDot,
+				className: u.railDot,
 				"aria-hidden": "true"
 			})
 		] }),
@@ -52,69 +53,65 @@ function y({ icon: e, label: t, badge: n, trailing: r }) {
 	] });
 }
 function b(e, { badge: t, badgeLabel: n }) {
-	let r = _(t) ? n || (typeof t == "number" ? s(t) : t) : null;
-	return typeof e == "string" || typeof e == "number" ? r == null ? String(e) : `${e} ${r}` : r == null ? e : /* @__PURE__ */ g(m, { children: [
+	let i = _(t) ? n || (typeof t == "number" ? r(t) : t) : null;
+	return typeof e == "string" || typeof e == "number" ? i == null ? String(e) : `${e} ${i}` : i == null ? e : /* @__PURE__ */ g(m, { children: [
 		e,
 		" ",
-		r
+		i
 	] });
 }
-var x = ({ className: e, children: t, ...r }) => /* @__PURE__ */ h("div", {
+var x = ({ className: e, children: n, ...r }) => /* @__PURE__ */ h("div", {
 	...r,
-	className: n(d.header, e),
-	children: t
+	className: t(u.header, e),
+	children: n
 });
 x.displayName = "Sidebar.Header";
-var S = ({ className: e, children: t, ...r }) => /* @__PURE__ */ h("div", {
+var S = ({ className: e, children: n, ...r }) => /* @__PURE__ */ h("div", {
 	...r,
-	className: n(d.body, e),
-	children: t
+	className: t(u.body, e),
+	children: n
 });
 S.displayName = "Sidebar.Body";
-var C = ({ className: e, children: t, ...r }) => /* @__PURE__ */ h("div", {
+var C = ({ className: e, children: n, ...r }) => /* @__PURE__ */ h("div", {
 	...r,
-	className: n(d.footer, e),
-	children: t
+	className: t(u.footer, e),
+	children: n
 });
 C.displayName = "Sidebar.Footer";
-var w = ({ heading: e, headingLevel: t, className: r, children: i, ...a }) => {
-	let o = p(), s = e != null && e !== !1 && e !== "", c = t ? `h${t}` : "div";
+var w = ({ heading: e, headingLevel: n, className: r, children: i, ...a }) => {
+	let o = p(), s = e != null && e !== !1 && e !== "", c = n ? `h${n}` : "div";
 	return /* @__PURE__ */ g("div", {
 		role: s ? "group" : void 0,
 		"aria-labelledby": s ? o : void 0,
 		...a,
-		className: n(d.section, r),
+		className: t(u.section, r),
 		children: [s && /* @__PURE__ */ h(c, {
 			id: o,
-			className: d.sectionHeading,
+			className: u.sectionHeading,
 			children: e
 		}), /* @__PURE__ */ h("ul", {
-			className: d.list,
+			className: u.list,
 			children: i
 		})]
 	});
 };
 w.displayName = "Sidebar.Section";
 var T = (e) => {
-	let { children: t, icon: r, active: i = !1, badge: a, badgeLabel: o, badgeTone: s = "accent", disabled: p = !1, className: m, href: g, role: _, onClick: x, "aria-current": S, ...C } = e, { collapsed: w, tooltipPlacement: T, onNavigate: E } = u("Sidebar.Item"), D = f(l), O = w && D === 0, k = v({
-		badge: a,
-		badgeLabel: o,
-		badgeTone: s
+	let { children: n, icon: r, active: a = !1, badge: o, badgeLabel: s, badgeTone: d = "accent", disabled: p = !1, className: m, href: g, role: _, onClick: x, "aria-current": S, ...C } = e, { collapsed: w, tooltipPlacement: T, onNavigate: E } = l("Sidebar.Item"), D = f(c), O = w && D === 0, k = v({
+		badge: o,
+		badgeLabel: s,
+		badgeTone: d
 	}), A = (e) => {
-		if (p) {
-			e.preventDefault();
-			return;
-		}
-		x?.(e), E();
+		p ? e.preventDefault() : (x?.(e), E());
 	}, j = {
 		...C,
-		className: n(d.item, D > 0 && d.nested, i && d.active, p && d.disabled, m),
-		"aria-current": i ? S ?? "page" : S,
-		"data-active": i || void 0,
+		className: t(u.item, D > 0 && u.nested, a && u.active, p && u.disabled, m),
+		"aria-current": a ? S ?? "page" : S,
+		"data-active": a || void 0,
 		onClick: A
 	}, M = /* @__PURE__ */ h(y, {
 		icon: r,
-		label: t,
+		label: n,
 		badge: k
 	}), N = g === void 0 ? /* @__PURE__ */ h("button", {
 		type: "button",
@@ -132,12 +129,12 @@ var T = (e) => {
 		children: M
 	});
 	return /* @__PURE__ */ h("li", {
-		className: d.listItem,
-		children: /* @__PURE__ */ h(c, {
-			content: b(t, {
-				badge: a,
-				badgeLabel: o,
-				badgeTone: s
+		className: u.listItem,
+		children: /* @__PURE__ */ h(i, {
+			content: b(n, {
+				badge: o,
+				badgeLabel: s,
+				badgeTone: d
 			}),
 			placement: T,
 			relationship: "label",
@@ -147,10 +144,10 @@ var T = (e) => {
 	});
 };
 T.displayName = "Sidebar.Item";
-var E = ({ label: t, icon: r, children: a, open: o, defaultOpen: s = !1, onOpenChange: m, active: _ = !1, badge: x, badgeLabel: S, badgeTone: C = "accent", disabled: w = !1, value: T, className: E, ...D }) => {
-	let { collapsed: O, setCollapsed: k, tooltipPlacement: A, groupOpen: j } = u("Sidebar.Group"), M = f(l), N = O && M === 0, P = T ?? (typeof t == "string" ? t : void 0), [F, I] = e({
-		value: o,
-		defaultValue: (P === void 0 ? void 0 : j.get(P)) ?? s,
+var E = ({ label: n, icon: r, children: a, open: s, defaultOpen: d = !1, onOpenChange: m, active: _ = !1, badge: x, badgeLabel: S, badgeTone: C = "accent", disabled: w = !1, value: T, className: E, ...D }) => {
+	let { collapsed: O, setCollapsed: k, tooltipPlacement: A, groupOpen: j } = l("Sidebar.Group"), M = f(c), N = O && M === 0, P = T ?? (typeof n == "string" ? n : void 0), [F, I] = e({
+		value: s,
+		defaultValue: (P === void 0 ? void 0 : j.get(P)) ?? d,
 		onChange: (e) => {
 			P !== void 0 && j.set(P, e), m?.(e);
 		}
@@ -163,10 +160,10 @@ var E = ({ label: t, icon: r, children: a, open: o, defaultOpen: s = !1, onOpenC
 	};
 	return /* @__PURE__ */ g("li", {
 		...D,
-		className: n(d.listItem, E),
+		className: t(u.listItem, E),
 		"data-state": z,
-		children: [/* @__PURE__ */ h(c, {
-			content: b(t, {
+		children: [/* @__PURE__ */ h(i, {
+			content: b(n, {
 				badge: x,
 				badgeLabel: S,
 				badgeTone: C
@@ -176,7 +173,7 @@ var E = ({ label: t, icon: r, children: a, open: o, defaultOpen: s = !1, onOpenC
 			disabled: !N,
 			children: /* @__PURE__ */ h("button", {
 				type: "button",
-				className: n(d.item, d.groupTrigger, M > 0 && d.nested, _ && !R && d.active, w && d.disabled),
+				className: t(u.item, u.groupTrigger, M > 0 && u.nested, _ && !R && u.active, w && u.disabled),
 				"aria-expanded": R,
 				"aria-controls": L,
 				"data-state": z,
@@ -184,24 +181,24 @@ var E = ({ label: t, icon: r, children: a, open: o, defaultOpen: s = !1, onOpenC
 				onClick: V,
 				children: /* @__PURE__ */ h(y, {
 					icon: r,
-					label: t,
+					label: n,
 					badge: B,
 					trailing: /* @__PURE__ */ h("span", {
-						className: d.chevron,
+						className: u.chevron,
 						"aria-hidden": "true",
-						children: /* @__PURE__ */ h(i, { size: "sm" })
+						children: /* @__PURE__ */ h(o, { size: "sm" })
 					})
 				})
 			})
 		}), /* @__PURE__ */ h("div", {
-			className: d.groupContent,
+			className: u.groupContent,
 			"data-state": z,
 			children: /* @__PURE__ */ h("div", {
-				className: d.groupClip,
+				className: u.groupClip,
 				children: /* @__PURE__ */ h("ul", {
 					id: L,
-					className: d.subList,
-					children: /* @__PURE__ */ h(l.Provider, {
+					className: u.subList,
+					children: /* @__PURE__ */ h(c.Provider, {
 						value: M + 1,
 						children: a
 					})
@@ -211,32 +208,31 @@ var E = ({ label: t, icon: r, children: a, open: o, defaultOpen: s = !1, onOpenC
 	});
 };
 E.displayName = "Sidebar.Group";
-var D = ({ collapseLabel: e, expandLabel: i, variant: o = "ghost", tone: s = "neutral", size: l = "sm", className: f, children: p, onClick: m, ...g }) => {
-	let _ = t(), v = e ?? _.sidebar.collapse, y = i ?? _.sidebar.expand, { mode: b, collapsed: x, setCollapsed: S, navId: C, tooltipPlacement: w } = u("Sidebar.Toggle");
+var D = ({ collapseLabel: e, expandLabel: n, variant: r = "ghost", tone: o = "neutral", size: c = "sm", className: f, children: p, onClick: m, ...g }) => {
+	let _ = d(), v = e ?? _.sidebar.collapse, y = n ?? _.sidebar.expand, { mode: b, collapsed: x, setCollapsed: S, navId: C, tooltipPlacement: w } = l("Sidebar.Toggle");
 	if (b === "overlay") return null;
 	let T = x ? y : v;
-	return /* @__PURE__ */ h(c, {
+	return /* @__PURE__ */ h(i, {
 		content: T,
 		placement: w,
 		relationship: "label",
-		children: /* @__PURE__ */ h(r, {
-			variant: o,
-			tone: s,
-			size: l,
+		children: /* @__PURE__ */ h(a, {
+			variant: r,
+			tone: o,
+			size: c,
 			"aria-controls": C,
 			...g,
 			"aria-label": T,
-			className: n(d.toggle, f),
+			className: t(u.toggle, f),
 			onClick: (e) => {
 				m?.(e), e.defaultPrevented || S(!x);
 			},
 			children: p ?? /* @__PURE__ */ h("span", {
-				className: d.toggleIcon,
-				children: /* @__PURE__ */ h(a, {})
+				className: u.toggleIcon,
+				children: /* @__PURE__ */ h(s, {})
 			})
 		})
 	});
 };
 D.displayName = "Sidebar.Toggle";
-//#endregion
 export { S as SidebarBody, C as SidebarFooter, E as SidebarGroup, x as SidebarHeader, T as SidebarItem, w as SidebarSection, D as SidebarToggle };

package/dist/components/navigation/SkipLink/SkipLink.cjs.js

@@ -1 +1 @@
-const e=require("../../utilities/LocaleProvider/LocaleProvider.cjs.js"),t=require("../../../utils/cx.cjs.js"),n=require("./SkipLink.module.css.cjs.js");let r=require("react"),i=require("react/jsx-runtime");var a=`a[href], area[href], button, input, select, textarea, iframe, summary, [contenteditable=''], [contenteditable='true'], [tabindex]`,o=e=>{if(!e||!e.startsWith(`#`)||e.length<2)return null;let t=e.slice(1);try{t=decodeURIComponent(t)}catch{}return document.getElementById(t)},s=null,c=e=>{s?.(),s=null;let t=!e.matches(a)&&!e.hasAttribute(`tabindex`),n=()=>{e.removeEventListener(`blur`,n),t&&e.getAttribute(`tabindex`)===`-1`&&e.removeAttribute(`tabindex`),s===n&&(s=null)};return t&&(e.setAttribute(`tabindex`,`-1`),e.addEventListener(`blur`,n),s=n),e.focus({preventScroll:!0}),document.activeElement===e?(e.scrollIntoView?.({block:`start`}),!0):(n(),!1)};function l({href:r=`#main`,children:a,className:s,onClick:l,...u}){let d=e.useMessages(),f=a??d.skipLink.label,p=e=>{if(l?.(e),e.defaultPrevented||e.button!==0||e.metaKey||e.ctrlKey||e.shiftKey||e.altKey)return;let t=o(r);if(t&&c(t)){e.preventDefault();try{window.location.hash!==r&&window.history.pushState(null,``,r)}catch{}}};return(0,i.jsx)(`a`,{...u,href:r,onClick:p,className:t.cx(n.default.root,s),children:f})}function u({className:e,children:a,...o}){return(0,i.jsx)(`ul`,{role:`list`,...o,className:t.cx(n.default.group,e),children:r.Children.map(a,(e,t)=>(0,r.isValidElement)(e)?(0,i.jsx)(`li`,{className:n.default.item,children:e},e.key??t):e)})}exports.SkipLink=l,exports.SkipLinks=u;
+"use client";const e=require("../../../utils/cx.cjs.js"),t=require("./SkipLink.module.css.cjs.js"),n=require("../../utilities/LocaleProvider/LocaleProvider.cjs.js");let r=require("react"),i=require("react/jsx-runtime");var a=`a[href], area[href], button, input, select, textarea, iframe, summary, [contenteditable=''], [contenteditable='true'], [tabindex]`,o=e=>{if(!e||!e.startsWith(`#`)||e.length<2)return null;let t=e.slice(1);try{t=decodeURIComponent(t)}catch{}return document.getElementById(t)},s=null,c=e=>{s?.(),s=null;let t=!e.matches(a)&&!e.hasAttribute(`tabindex`),n=()=>{e.removeEventListener(`blur`,n),t&&e.getAttribute(`tabindex`)===`-1`&&e.removeAttribute(`tabindex`),s===n&&(s=null)};return t&&(e.setAttribute(`tabindex`,`-1`),e.addEventListener(`blur`,n),s=n),e.focus({preventScroll:!0}),document.activeElement===e?(e.scrollIntoView?.({block:`start`}),!0):(n(),!1)};function l({href:r=`#main`,children:a,className:s,onClick:l,...u}){let d=n.useMessages(),f=a??d.skipLink.label,p=e=>{if(l?.(e),e.defaultPrevented||e.button!==0||e.metaKey||e.ctrlKey||e.shiftKey||e.altKey)return;let t=o(r);if(t&&c(t)){e.preventDefault();try{window.location.hash!==r&&window.history.pushState(null,``,r)}catch{}}};return(0,i.jsx)(`a`,{...u,href:r,onClick:p,className:e.cx(t.default.root,s),children:f})}function u({className:n,children:a,...o}){return(0,i.jsx)(`ul`,{role:`list`,...o,className:e.cx(t.default.group,n),children:r.Children.map(a,(e,n)=>(0,r.isValidElement)(e)?(0,i.jsx)(`li`,{className:t.default.item,children:e},e.key??n):e)})}exports.SkipLink=l,exports.SkipLinks=u;

package/dist/components/navigation/SkipLink/SkipLink.mjs

@@ -1,9 +1,10 @@
-import { useMessages as e } from "../../utilities/LocaleProvider/LocaleProvider.mjs";
-import { cx as t } from "../../../utils/cx.mjs";
-import n from "./SkipLink.module.css.mjs";
+"use client";
+import { cx as e } from "../../../utils/cx.mjs";
+import t from "./SkipLink.module.css.mjs";
+import { useMessages as n } from "../../utilities/LocaleProvider/LocaleProvider.mjs";
 import { Children as r, isValidElement as i } from "react";
 import { jsx as a } from "react/jsx-runtime";
-//#region src/components/navigation/SkipLink/SkipLink.tsx
+// src/components/navigation/SkipLink/SkipLink.tsx
 var o = "a[href], area[href], button, input, select, textarea, iframe, summary, [contenteditable=''], [contenteditable='true'], [tabindex]", s = (e) => {
 	if (!e || !e.startsWith("#") || e.length < 2) return null;
 	let t = e.slice(1);
@@ -19,7 +20,7 @@ var o = "a[href], area[href], button, input, select, textarea, iframe, summary,
 	return t && (e.setAttribute("tabindex", "-1"), e.addEventListener("blur", n), c = n), e.focus({ preventScroll: !0 }), document.activeElement === e ? (e.scrollIntoView?.({ block: "start" }), !0) : (n(), !1);
 };
 function u({ href: r = "#main", children: i, className: o, onClick: c, ...u }) {
-	let d = e(), f = i ?? d.skipLink.label, p = (e) => {
+	let d = n(), f = i ?? d.skipLink.label, p = (e) => {
 		if (c?.(e), e.defaultPrevented || e.button !== 0 || e.metaKey || e.ctrlKey || e.shiftKey || e.altKey) return;
 		let t = s(r);
 		if (t && l(t)) {
@@ -33,20 +34,19 @@ function u({ href: r = "#main", children: i, className: o, onClick: c, ...u }) {
 		...u,
 		href: r,
 		onClick: p,
-		className: t(n.root, o),
+		className: e(t.root, o),
 		children: f
 	});
 }
-function d({ className: e, children: o, ...s }) {
+function d({ className: n, children: o, ...s }) {
 	return /* @__PURE__ */ a("ul", {
 		role: "list",
 		...s,
-		className: t(n.group, e),
-		children: r.map(o, (e, t) => i(e) ? /* @__PURE__ */ a("li", {
-			className: n.item,
+		className: e(t.group, n),
+		children: r.map(o, (e, n) => i(e) ? /* @__PURE__ */ a("li", {
+			className: t.item,
 			children: e
-		}, e.key ?? t) : e)
+		}, e.key ?? n) : e)
 	});
 }
-//#endregion
 export { u as SkipLink, d as SkipLinks };

package/dist/components/navigation/SkipLink/SkipLink.module.css.mjs

@@ -1,8 +1,7 @@
-//#region src/components/navigation/SkipLink/SkipLink.module.css
+// src/components/navigation/SkipLink/SkipLink.module.css
 var e = "_root_1f8gq_17", t = "_group_1f8gq_165", n = "_item_1f8gq_177", r = {
 	root: e,
 	group: t,
 	item: n
 };
-//#endregion
 export { r as default, t as group, n as item, e as root };

package/dist/components/navigation/Stepper/Stepper.cjs.js

@@ -1 +1 @@
-const e=require("../../../i18n/en.cjs.js"),t=require("../../../hooks/useControllableState.cjs.js"),n=require("../../utilities/LocaleProvider/LocaleProvider.cjs.js"),r=require("../../../utils/refs.cjs.js"),i=require("../../../hooks/useResponsiveValue.cjs.js"),a=require("../../../utils/cx.cjs.js"),o=require("../../../utils/flattenChildren.cjs.js"),s=require("../../utilities/VisuallyHidden/VisuallyHidden.cjs.js"),c=require("../../primitives/Icon/icons.cjs.js"),l=require("../../primitives/Icon/Icon.cjs.js"),u=require("./Stepper.module.css.cjs.js");let d=require("react"),f=require("react/jsx-runtime");var p=e.en.stepper.status,m=e=>({step:t,total:n,title:r})=>t>n?e.allComplete(n):r?e.stepTitled(t,n,r):e.step(t,n),h={sm:u.default.sm,md:u.default.md,lg:u.default.lg},g={horizontal:u.default.horizontal,vertical:u.default.vertical},_={complete:u.default.statusComplete,current:u.default.statusCurrent,upcoming:u.default.statusUpcoming,error:u.default.statusError},v=6,y=(0,d.createContext)(null),b=(0,d.createContext)(0);function x(){let e=(0,d.useContext)(y);if(!e)throw Error(`Stepper.Step must be used inside a Stepper.`);return e}function S(e,t){return e<t?`complete`:e===t?`current`:`upcoming`}function C({activeStep:e,defaultActiveStep:c=0,onActiveStepChange:l,orientation:p=`horizontal`,size:_=`md`,clickable:x=!1,linear:C=!0,compact:w=`auto`,announce:T=!1,announcement:E,statusLabels:D,"aria-label":O,className:k,children:A,ref:j,...M}){let N=n.useMessages(),P=E??m(N.stepper),F=O??N.stepper.nav,[I,L]=t.useControllableState({value:e,defaultValue:c,onChange:l}),R=i.useResponsiveValue(p,`horizontal`),z=R===`horizontal`,B=x||!C,V=o.flattenChildren(A),H=V.length,U=(0,d.useRef)(null),W=(0,d.useCallback)(e=>{U.current=e,r.assignRef(j,e)},[j]),[G,K]=(0,d.useState)(!1);(0,d.useLayoutEffect)(()=>{if(!z||w!==`auto`)return;let e=U.current;if(!e)return;let t=()=>{let t=parseFloat(getComputedStyle(e).fontSize)||16,n=e.clientWidth/Math.max(H,1);K(n<v*t)};if(t(),typeof ResizeObserver>`u`)return;let n=new ResizeObserver(t);return n.observe(e),()=>n.disconnect()},[z,w,H]);let q=z&&(w===`auto`?G:w),[J,Y]=(0,d.useState)(``),X=(0,d.useRef)(!0);(0,d.useEffect)(()=>{if(X.current){X.current=!1;return}if(!T)return;let e=U.current?.querySelector(`[data-step-index="${I}"] [data-step-title]`),t=V[I];Y(P({step:I+1,total:H,title:e?.textContent?.trim()??``,status:t?t.props.status??S(I,I):void 0}))},[I]);let Z={activeStep:I,setActiveStep:L,interactive:B,linear:C,statusLabels:{...N.stepper.status,...D}},Q=V[I],$=B?`nav`:`div`;return(0,f.jsx)(y.Provider,{value:Z,children:(0,f.jsxs)($,{role:B?void 0:`group`,"aria-label":F,...M,ref:W,className:a.cx(u.default.root,g[R],h[_],q&&u.default.compact,B&&u.default.interactive,k),"data-orientation":R,children:[(0,f.jsx)(`ol`,{role:`list`,className:u.default.list,children:V.map((e,t)=>(0,f.jsx)(b.Provider,{value:t,children:e},e.key??t))}),q&&(0,f.jsxs)(`div`,{className:u.default.caption,"aria-hidden":`true`,children:[(0,f.jsx)(`span`,{className:u.default.captionCount,children:I>=H?N.stepper.count(H,H):N.stepper.step(I+1,H)}),Q&&(0,f.jsx)(`span`,{className:u.default.captionTitle,children:Q.props.title})]}),T&&(0,f.jsx)(s.VisuallyHidden,{role:`status`,"aria-live":`polite`,"aria-atomic":`true`,children:J})]})})}var w=()=>(0,f.jsxs)(l.Icon,{strokeWidth:3,children:[(0,f.jsx)(`path`,{d:`M12 6v7.5`}),(0,f.jsx)(`circle`,{cx:`12`,cy:`18`,r:`1.6`,fill:`currentColor`,stroke:`none`})]});function T({title:e,description:t,icon:r,status:i,disabled:o=!1,statusLabel:l,className:p,...m}){let h=n.useMessages(),{activeStep:g,setActiveStep:v,interactive:y,linear:C,statusLabels:T}=x(),E=(0,d.useContext)(b),D=i??S(E,g),O=E===g,k=l??T[D],A=y&&(!C||E<=g||D===`complete`),j;j=D===`complete`?(0,f.jsx)(c.CheckIcon,{strokeWidth:3}):D===`error`?(0,f.jsx)(w,{}):r??(0,f.jsx)(`span`,{className:u.default.number,children:E+1});let M=(0,f.jsxs)(f.Fragment,{children:[(0,f.jsx)(`span`,{className:u.default.marker,"aria-hidden":`true`,children:j}),(0,f.jsxs)(`span`,{className:u.default.text,children:[(0,f.jsx)(s.VisuallyHidden,{children:h.stepper.prefix(E+1)}),(0,f.jsx)(`span`,{className:u.default.title,"data-step-title":``,children:e}),(0,f.jsx)(s.VisuallyHidden,{children:`, ${k}`}),t!=null&&(0,f.jsx)(`span`,{className:u.default.description,children:t})]})]});return(0,f.jsxs)(`li`,{"aria-current":O&&!A?`step`:void 0,...m,className:a.cx(u.default.item,_[D],o&&A&&u.default.disabled,p),"data-status":D,"data-step-index":E,children:[A?(0,f.jsx)(`button`,{type:`button`,className:a.cx(u.default.trigger,u.default.button),"aria-current":O?`step`:void 0,disabled:o,onClick:()=>v(E),children:M}):(0,f.jsx)(`div`,{className:u.default.trigger,children:M}),(0,f.jsx)(`span`,{className:u.default.connector,"aria-hidden":`true`,children:(0,f.jsx)(`span`,{className:u.default.fill})})]})}var E=Object.assign(C,{Step:T});exports.Step=T,exports.Stepper=E,exports.defaultStepperStatusLabels=p;
+"use client";const e=require("../../../hooks/useControllableState.cjs.js"),t=require("../../../hooks/useResponsiveValue.cjs.js"),n=require("../../../utils/cx.cjs.js"),r=require("../../../utils/refs.cjs.js"),i=require("../../../utils/flattenChildren.cjs.js"),a=require("../../primitives/Icon/icons.cjs.js"),o=require("../../primitives/Icon/Icon.cjs.js"),s=require("../../utilities/VisuallyHidden/VisuallyHidden.cjs.js"),c=require("./Stepper.module.css.cjs.js"),l=require("../../utilities/LocaleProvider/LocaleProvider.cjs.js"),u=require("../../../i18n/en.cjs.js");let d=require("react"),f=require("react/jsx-runtime");var p=u.en.stepper.status,m=e=>({step:t,total:n,title:r})=>t>n?e.allComplete(n):r?e.stepTitled(t,n,r):e.step(t,n),h={sm:c.default.sm,md:c.default.md,lg:c.default.lg},g={horizontal:c.default.horizontal,vertical:c.default.vertical},_={complete:c.default.statusComplete,current:c.default.statusCurrent,upcoming:c.default.statusUpcoming,error:c.default.statusError},v=6,y=(0,d.createContext)(null),b=(0,d.createContext)(0);function x(){let e=(0,d.useContext)(y);if(!e)throw Error(`Stepper.Step must be used inside a Stepper.`);return e}function S(e,t){return e<t?`complete`:e===t?`current`:`upcoming`}function C({activeStep:a,defaultActiveStep:o=0,onActiveStepChange:u,orientation:p=`horizontal`,size:_=`md`,clickable:x=!1,linear:C=!0,compact:w=`auto`,announce:T=!1,announcement:E,statusLabels:D,"aria-label":O,className:k,children:A,ref:j,...M}){let N=l.useMessages(),P=E??m(N.stepper),F=O??N.stepper.nav,[I,L]=e.useControllableState({value:a,defaultValue:o,onChange:u}),R=t.useResponsiveValue(p,`horizontal`),z=R===`horizontal`,B=x||!C,V=i.flattenChildren(A),H=V.length,U=(0,d.useRef)(null),W=(0,d.useCallback)(e=>{U.current=e,r.assignRef(j,e)},[j]),[G,K]=(0,d.useState)(!1);(0,d.useLayoutEffect)(()=>{if(!z||w!==`auto`)return;let e=U.current;if(!e)return;let t=()=>{let t=parseFloat(getComputedStyle(e).fontSize)||16,n=e.clientWidth/Math.max(H,1);K(n<v*t)};if(t(),typeof ResizeObserver>`u`)return;let n=new ResizeObserver(t);return n.observe(e),()=>n.disconnect()},[z,w,H]);let q=z&&(w===`auto`?G:w),[J,Y]=(0,d.useState)(``),X=(0,d.useRef)(!0);(0,d.useEffect)(()=>{if(X.current){X.current=!1;return}if(!T)return;let e=U.current?.querySelector(`[data-step-index="${I}"] [data-step-title]`),t=V[I];Y(P({step:I+1,total:H,title:e?.textContent?.trim()??``,status:t?t.props.status??S(I,I):void 0}))},[I]);let Z={activeStep:I,setActiveStep:L,interactive:B,linear:C,statusLabels:{...N.stepper.status,...D}},Q=V[I],$=B?`nav`:`div`;return(0,f.jsx)(y.Provider,{value:Z,children:(0,f.jsxs)($,{role:B?void 0:`group`,"aria-label":F,...M,ref:W,className:n.cx(c.default.root,g[R],h[_],q&&c.default.compact,B&&c.default.interactive,k),"data-orientation":R,children:[(0,f.jsx)(`ol`,{role:`list`,className:c.default.list,children:V.map((e,t)=>(0,f.jsx)(b.Provider,{value:t,children:e},e.key??t))}),q&&(0,f.jsxs)(`div`,{className:c.default.caption,"aria-hidden":`true`,children:[(0,f.jsx)(`span`,{className:c.default.captionCount,children:I>=H?N.stepper.count(H,H):N.stepper.step(I+1,H)}),Q&&(0,f.jsx)(`span`,{className:c.default.captionTitle,children:Q.props.title})]}),T&&(0,f.jsx)(s.VisuallyHidden,{role:`status`,"aria-live":`polite`,"aria-atomic":`true`,children:J})]})})}var w=()=>(0,f.jsxs)(o.Icon,{strokeWidth:3,children:[(0,f.jsx)(`path`,{d:`M12 6v7.5`}),(0,f.jsx)(`circle`,{cx:`12`,cy:`18`,r:`1.6`,fill:`currentColor`,stroke:`none`})]});function T({title:e,description:t,icon:r,status:i,disabled:o=!1,statusLabel:u,className:p,...m}){let h=l.useMessages(),{activeStep:g,setActiveStep:v,interactive:y,linear:C,statusLabels:T}=x(),E=(0,d.useContext)(b),D=i??S(E,g),O=E===g,k=u??T[D],A=y&&(!C||E<=g||D===`complete`),j;j=D===`complete`?(0,f.jsx)(a.CheckIcon,{strokeWidth:3}):D===`error`?(0,f.jsx)(w,{}):r??(0,f.jsx)(`span`,{className:c.default.number,children:E+1});let M=(0,f.jsxs)(f.Fragment,{children:[(0,f.jsx)(`span`,{className:c.default.marker,"aria-hidden":`true`,children:j}),(0,f.jsxs)(`span`,{className:c.default.text,children:[(0,f.jsx)(s.VisuallyHidden,{children:h.stepper.prefix(E+1)}),(0,f.jsx)(`span`,{className:c.default.title,"data-step-title":``,children:e}),(0,f.jsx)(s.VisuallyHidden,{children:`, ${k}`}),t!=null&&(0,f.jsx)(`span`,{className:c.default.description,children:t})]})]});return(0,f.jsxs)(`li`,{"aria-current":O&&!A?`step`:void 0,...m,className:n.cx(c.default.item,_[D],o&&A&&c.default.disabled,p),"data-status":D,"data-step-index":E,children:[A?(0,f.jsx)(`button`,{type:`button`,className:n.cx(c.default.trigger,c.default.button),"aria-current":O?`step`:void 0,disabled:o,onClick:()=>v(E),children:M}):(0,f.jsx)(`div`,{className:c.default.trigger,children:M}),(0,f.jsx)(`span`,{className:c.default.connector,"aria-hidden":`true`,children:(0,f.jsx)(`span`,{className:c.default.fill})})]})}var E=Object.assign(C,{Step:T});exports.Step=T,exports.Stepper=E,exports.defaultStepperStatusLabels=p;