@ds-mo/ui 0.2.4 → 0.3.0

package/dist/index.js

@@ -1,8 +1,8 @@
-import e, { Component as t, forwardRef as n, useCallback as r, useEffect as i, useId as a, useLayoutEffect as o, useMemo as s, useRef as c, useState as l, useSyncExternalStore as u } from "react";
-import { Fragment as d, jsx as f, jsxs as p } from "react/jsx-runtime";
-import { ChevronDown as m, Cross as h } from "@ds-mo/icons";
-import g, { createPortal as _ } from "react-dom";
-var v = {
+import e, { Component as t, cloneElement as n, forwardRef as r, isValidElement as i, useCallback as a, useEffect as o, useId as s, useLayoutEffect as c, useMemo as l, useRef as u, useState as d, useSyncExternalStore as f } from "react";
+import { Fragment as p, jsx as m, jsxs as h } from "react/jsx-runtime";
+import { ChevronDown as g, Cross as _ } from "@ds-mo/icons";
+import v, { createPortal as y } from "react-dom";
+var b = {
 	text: "_text_12t2m_1",
 	truncate1Line: "_truncate1Line_12t2m_9",
 	truncate2Lines: "_truncate2Lines_12t2m_15",
@@ -32,60 +32,60 @@ var v = {
 	alignLeft: "_alignLeft_12t2m_156",
 	alignCenter: "_alignCenter_12t2m_160",
 	alignRight: "_alignRight_12t2m_164"
-}, y = {
-	primary: v.colorPrimary,
-	secondary: v.colorSecondary,
-	tertiary: v.colorTertiary,
-	brand: v.colorBrand,
-	negative: v.colorNegative,
-	positive: v.colorPositive,
-	warning: v.colorWarning,
-	caution: v.colorCaution,
-	ai: v.colorAi,
-	"on-strong": v.colorOnStrong,
-	"on-bold": v.colorOnBold,
-	inherit: v.colorInherit
-}, b = {
-	none: v.decorationNone,
-	underline: v.decorationUnderline,
-	"dotted-underline": v.decorationDottedUnderline
 }, x = {
-	left: v.alignLeft,
-	center: v.alignCenter,
-	right: v.alignRight
+	primary: b.colorPrimary,
+	secondary: b.colorSecondary,
+	tertiary: b.colorTertiary,
+	brand: b.colorBrand,
+	negative: b.colorNegative,
+	positive: b.colorPositive,
+	warning: b.colorWarning,
+	caution: b.colorCaution,
+	ai: b.colorAi,
+	"on-strong": b.colorOnStrong,
+	"on-bold": b.colorOnBold,
+	inherit: b.colorInherit
 }, S = {
-	1: v.truncate1Line,
-	2: v.truncate2Lines,
-	3: v.truncate3Lines,
-	4: v.truncate4Lines,
-	5: v.truncate5Lines,
-	none: v.noTruncation
-}, C = (e) => e.startsWith("var(--"), w = n(({ variant: e = "text-body-medium", children: t, color: n, decoration: r, italic: i, align: a, lineTruncation: o = "none", wrap: s, as: c = "p", id: l, htmlFor: u, className: d = "", style: p }, m) => {
-	let h = s === "nowrap" ? v.wrapNowrap : s === "balance" ? v.wrapBalance : s === "pretty" ? v.wrapPretty : "", g = s === "nowrap" ? "" : S[o], _ = [
+	none: b.decorationNone,
+	underline: b.decorationUnderline,
+	"dotted-underline": b.decorationDottedUnderline
+}, C = {
+	left: b.alignLeft,
+	center: b.alignCenter,
+	right: b.alignRight
+}, w = {
+	1: b.truncate1Line,
+	2: b.truncate2Lines,
+	3: b.truncate3Lines,
+	4: b.truncate4Lines,
+	5: b.truncate5Lines,
+	none: b.noTruncation
+}, T = (e) => e.startsWith("var(--"), E = r(({ variant: e = "text-body-medium", children: t, color: n, decoration: r, italic: i, align: a, lineTruncation: o = "none", wrap: s, as: c = "p", id: l, htmlFor: u, className: d = "", style: f }, p) => {
+	let h = s === "nowrap" ? b.wrapNowrap : s === "balance" ? b.wrapBalance : s === "pretty" ? b.wrapPretty : "", g = s === "nowrap" ? "" : w[o], _ = [
 		e,
-		v.text,
+		b.text,
 		h,
 		g,
-		n && !C(n) ? y[n] : "",
-		r ? b[r] : "",
-		i ? v.italic : "",
-		a ? x[a] : "",
+		n && !T(n) ? x[n] : "",
+		r ? S[r] : "",
+		i ? b.italic : "",
+		a ? C[a] : "",
 		d
-	].filter(Boolean).join(" "), w = {
-		...p,
-		...n && C(n) ? { color: n } : {}
+	].filter(Boolean).join(" "), v = {
+		...f,
+		...n && T(n) ? { color: n } : {}
 	};
-	return /* @__PURE__ */ f(c, {
-		ref: m,
+	return /* @__PURE__ */ m(c, {
+		ref: p,
 		className: _,
-		style: Object.keys(w).length > 0 ? w : void 0,
+		style: Object.keys(v).length > 0 ? v : void 0,
 		...l ? { id: l } : {},
 		...c === "label" && u ? { htmlFor: u } : {},
 		children: t
 	});
 });
-w.displayName = "Text";
-var T = {
+E.displayName = "Text";
+var D = {
 	surface: "_surface_65ypw_7",
 	bgPrimary: "_bgPrimary_65ypw_28",
 	bgSecondary: "_bgSecondary_65ypw_32",
@@ -152,63 +152,63 @@ var T = {
 	interactive: "_interactive_65ypw_172",
 	selected: "_selected_65ypw_199",
 	inactive: "_inactive_65ypw_218"
-}, E = {
-	primary: T.bgPrimary,
-	secondary: T.bgSecondary,
-	transparent: T.bgTransparent,
-	translucent: T.bgTranslucent
-}, D = {
-	none: T.elevationNone,
-	depressed: T.elevationDepressed,
-	"depressed-md": T.elevationDepressedMd,
-	flat: T.elevationFlat,
-	elevated: T.elevationElevated,
-	floating: T.elevationFloating,
-	overlayTop: T.elevationOverlayTop,
-	overlayRight: T.elevationOverlayRight,
-	overlayBottom: T.elevationOverlayBottom,
-	overlayLeft: T.elevationOverlayLeft
 }, O = {
-	top: T.edgeTop,
-	right: T.edgeRight,
-	bottom: T.edgeBottom,
-	left: T.edgeLeft
+	primary: D.bgPrimary,
+	secondary: D.bgSecondary,
+	transparent: D.bgTransparent,
+	translucent: D.bgTranslucent
 }, k = {
-	none: T.radiusNone,
-	xs: T.radiusXs,
-	sm: T.radiusSm,
-	md: T.radiusMd,
-	lg: T.radiusLg,
-	xl: T.radiusXl,
-	"2xl": T.radius2xl,
-	full: T.radiusFull
-}, A = (e, t) => T[`intent${e.charAt(0).toUpperCase() + e.slice(1)}${t.charAt(0).toUpperCase() + t.slice(1)}`] || "", j = (e) => e in k, M = n(({ children: e, background: t = "transparent", intent: n, contrast: r = "faint", elevation: i = "none", edge: a, radius: o, interactive: s = !1, selected: c = !1, inactive: l = !1, as: u = "div", className: d = "", style: p, type: m, ...h }, g) => {
+	none: D.elevationNone,
+	depressed: D.elevationDepressed,
+	"depressed-md": D.elevationDepressedMd,
+	flat: D.elevationFlat,
+	elevated: D.elevationElevated,
+	floating: D.elevationFloating,
+	overlayTop: D.elevationOverlayTop,
+	overlayRight: D.elevationOverlayRight,
+	overlayBottom: D.elevationOverlayBottom,
+	overlayLeft: D.elevationOverlayLeft
+}, ee = {
+	top: D.edgeTop,
+	right: D.edgeRight,
+	bottom: D.edgeBottom,
+	left: D.edgeLeft
+}, A = {
+	none: D.radiusNone,
+	xs: D.radiusXs,
+	sm: D.radiusSm,
+	md: D.radiusMd,
+	lg: D.radiusLg,
+	xl: D.radiusXl,
+	"2xl": D.radius2xl,
+	full: D.radiusFull
+}, j = (e, t) => D[`intent${e.charAt(0).toUpperCase() + e.slice(1)}${t.charAt(0).toUpperCase() + t.slice(1)}`] || "", M = (e) => e in A, N = r(({ children: e, background: t = "transparent", intent: n, contrast: r = "faint", elevation: i = "none", edge: a, radius: o, interactive: s = !1, selected: c = !1, inactive: l = !1, as: u = "div", className: d = "", style: f, type: p, ...h }, g) => {
 	let _ = [
-		T.surface,
-		n ? A(n, r) : E[t],
-		D[i],
-		...a && i === "none" ? Array.isArray(a) ? a.map((e) => O[e]) : [O[a]] : [],
-		o && j(o) ? k[o] : "",
-		s ? T.interactive : "",
-		c ? T.selected : "",
-		l ? T.inactive : "",
+		D.surface,
+		n ? j(n, r) : O[t],
+		k[i],
+		...a && i === "none" ? Array.isArray(a) ? a.map((e) => ee[e]) : [ee[a]] : [],
+		o && M(o) ? A[o] : "",
+		s ? D.interactive : "",
+		c ? D.selected : "",
+		l ? D.inactive : "",
 		d
 	].filter(Boolean).join(" "), v = {
-		...p,
-		...o && !j(o) ? { borderRadius: o } : {}
+		...f,
+		...o && !M(o) ? { borderRadius: o } : {}
 	};
-	return /* @__PURE__ */ f(u, {
+	return /* @__PURE__ */ m(u, {
 		ref: g,
 		className: _,
-		style: o && !j(o) || p && Object.keys(p).length > 0 ? v : void 0,
+		style: o && !M(o) || f && Object.keys(f).length > 0 ? v : void 0,
 		disabled: u === "button" ? l : void 0,
-		type: u === "button" ? m || "button" : void 0,
+		type: u === "button" ? p || "button" : void 0,
 		...h,
 		children: e
 	});
 });
-M.displayName = "Surface";
-var N = {
+N.displayName = "Surface";
+var P = {
 	card: "_card_1idsz_6",
 	elevationFlat: "_elevationFlat_1idsz_13",
 	elevationElevated: "_elevationElevated_1idsz_14",
@@ -223,72 +223,85 @@ var N = {
 };
 //#endregion
 //#region src/utils/cn.ts
-function P(...e) {
+function F(...e) {
 	return e.filter(Boolean).join(" ");
 }
 //#endregion
 //#region src/components/Card/Card.tsx
-var ee = {
-	flat: N.elevationFlat,
-	elevated: N.elevationElevated,
-	floating: N.elevationFloating
-}, F = {
-	sm: N.radiusSm,
-	md: N.radiusMd,
-	lg: N.radiusLg,
-	xl: N.radiusXl
-}, I = n(({ children: e, header: t, footer: n, elevation: r = "elevated", radius: i = "lg", className: a, style: o }, s) => /* @__PURE__ */ p("div", {
+var I = {
+	flat: P.elevationFlat,
+	elevated: P.elevationElevated,
+	floating: P.elevationFloating
+}, L = {
+	sm: P.radiusSm,
+	md: P.radiusMd,
+	lg: P.radiusLg,
+	xl: P.radiusXl
+}, R = r(({ children: e, header: t, footer: n, elevation: r = "elevated", radius: i = "lg", className: a, style: o }, s) => /* @__PURE__ */ h("div", {
 	ref: s,
-	className: P(N.card, ee[r], F[i], a),
+	className: F(P.card, I[r], L[i], a),
 	style: o,
 	children: [
-		t && /* @__PURE__ */ f("div", {
-			className: N.header,
+		t && /* @__PURE__ */ m("div", {
+			className: P.header,
 			children: t
 		}),
-		/* @__PURE__ */ f("div", {
-			className: N.body,
+		/* @__PURE__ */ m("div", {
+			className: P.body,
 			children: e
 		}),
-		n && /* @__PURE__ */ f("div", {
-			className: N.footer,
+		n && /* @__PURE__ */ m("div", {
+			className: P.footer,
 			children: n
 		})
 	]
 }));
-I.displayName = "Card";
-var L = {
+R.displayName = "Card";
+var z = {
 	labelWrap: "_labelWrap_1t38o_8",
 	sizeSm: "_sizeSm_1t38o_16",
 	sizeXs: "_sizeXs_1t38o_19",
 	truncate: "_truncate_1t38o_22"
-}, R = ({ children: e, size: t = "md", truncate: n = !1, className: r }) => /* @__PURE__ */ f("span", {
-	className: P(L.labelWrap, t === "sm" && L.sizeSm, t === "xs" && L.sizeXs, n && L.truncate, r),
+}, te = ({ children: e, size: t = "md", truncate: n = !1, className: r }) => /* @__PURE__ */ m("span", {
+	className: F(z.labelWrap, t === "sm" && z.sizeSm, t === "xs" && z.sizeXs, n && z.truncate, r),
 	children: e
 });
-R.displayName = "LabelWrap";
-var te = {
-	loader: "_loader_fz5t7_1",
-	spin: "_spin_fz5t7_1"
-}, z = ({ size: e = 20, className: t }) => /* @__PURE__ */ f("svg", {
-	width: e,
-	height: e,
-	viewBox: "0 0 16 16",
-	fill: "none",
-	className: `${te.loader}${t ? ` ${t}` : ""}`,
-	"aria-hidden": "true",
-	children: /* @__PURE__ */ f("circle", {
-		cx: "8",
-		cy: "8",
-		r: "5",
-		stroke: "currentColor",
-		strokeWidth: "1",
-		strokeLinecap: "round",
-		strokeDasharray: "23.6 7.9"
-	})
-});
-z.displayName = "Loader";
+te.displayName = "LabelWrap";
 var B = {
+	loader: "_loader_ebm28_1",
+	spin: "_spin_ebm28_1",
+	status: "_status_ebm28_6",
+	visuallyHidden: "_visuallyHidden_ebm28_11"
+}, ne = ({ size: e = 20, className: t, label: n }) => {
+	let r = /* @__PURE__ */ m("svg", {
+		width: e,
+		height: e,
+		viewBox: "0 0 16 16",
+		fill: "none",
+		className: `${B.loader}${t ? ` ${t}` : ""}`,
+		"aria-hidden": "true",
+		children: /* @__PURE__ */ m("circle", {
+			cx: "8",
+			cy: "8",
+			r: "5",
+			stroke: "currentColor",
+			strokeWidth: "1",
+			strokeLinecap: "round",
+			strokeDasharray: "23.6 7.9"
+		})
+	});
+	return n === void 0 ? r : /* @__PURE__ */ h("span", {
+		role: "status",
+		"aria-live": "polite",
+		className: B.status,
+		children: [r, /* @__PURE__ */ m("span", {
+			className: B.visuallyHidden,
+			children: n
+		})]
+	});
+};
+ne.displayName = "Loader";
+var V = {
 	button: "_button_1vroe_6",
 	inactive: "_inactive_1vroe_35",
 	onMedium: "_onMedium_1vroe_50",
@@ -322,50 +335,56 @@ var B = {
 	rounded: "_rounded_1vroe_302",
 	badge: "_badge_1vroe_324",
 	fullWidth: "_fullWidth_1vroe_340"
-}, V = {
+}, re = {
 	xs: 12,
 	sm: 16,
 	md: 20,
 	lg: 24
-}, ne = {
+}, H = {
 	xs: "text-caption-emphasis",
 	sm: "text-body-small-emphasis",
 	md: "text-body-medium-emphasis",
 	lg: "text-body-large-emphasis"
-}, re = n(({ as: e, variant: t = "primary", label: n, icon: r, intent: i = "brand", size: a = "md", rounded: o = !1, fullWidth: s = !1, width: c, contrast: l = "bold", background: u, dropdown: d = !1, badgeCount: h, elevation: g, loading: _ = !1, onClick: v, onMouseEnter: y, onMouseLeave: b, className: x, inactive: S = !1, type: C = "button", id: T, "aria-label": E, href: D, target: O, rel: k }, A) => {
-	let j = e ?? "button", M = !e || e === "button", N = !S && !_, ee = !!r, F = !!n, I = ee || _, L = I && !F, te = F && !I, re = I && F, H = V[a], ie = ne[a], ae = g ?? (t === "primary" ? "none" : "flat"), oe = ae.charAt(0).toUpperCase() + ae.slice(1), U = P(B.button, B[t], B[`intent${i.charAt(0).toUpperCase() + i.slice(1)}`], a !== "md" && B[`size${a.toUpperCase()}`], o && B.rounded, (S || _) && B.inactive, L && B.iconOnly, te && B.labelOnly, re && B.iconAndLabel, d && B.dropdown, t === "primary" && i !== "none" && l !== "bold" && B[`contrast${l.charAt(0).toUpperCase() + l.slice(1)}`], B[`elevation${oe}`], u && u !== "faint" && B[u === "always-dark" ? "onAlwaysDark" : `on${u.charAt(0).toUpperCase() + u.slice(1)}`], s && B.fullWidth, x), se = E || n || "button", W = {};
-	return M && (W.type = C, W.disabled = S || _), D && (W.href = D), O && (W.target = O), k && (W.rel = k), /* @__PURE__ */ p(j, {
-		ref: A,
-		id: T,
-		className: U,
-		style: c ? { width: c } : void 0,
-		onClick: N ? v : void 0,
-		onMouseEnter: N ? y : void 0,
-		onMouseLeave: N ? b : void 0,
-		"aria-label": se,
-		"aria-busy": _ || void 0,
-		...W,
+}, ie = r((e, t) => {
+	let { as: n, variant: r = "primary", label: i, icon: a, intent: o = "brand", size: s = "md", rounded: c = !1, fullWidth: l = !1, width: u, contrast: d = "bold", background: f, dropdown: p = !1, badgeCount: _, elevation: v, loading: y = !1, onClick: b, onMouseEnter: x, onMouseLeave: S, className: C, inactive: w = !1, type: T = "button", id: D, "aria-label": O, "aria-labelledby": k, href: ee, target: A, rel: j } = e, M = n ?? "button", N = !n || n === "button", P = !N && n !== "a", I = !w && !y, L = !!a, R = !!i, z = L || y, B = z && !R, ie = R && !z, U = z && R, W = re[s], ae = H[s], oe = v ?? (r === "primary" ? "none" : "flat"), G = oe.charAt(0).toUpperCase() + oe.slice(1), K = F(V.button, V[r], V[`intent${o.charAt(0).toUpperCase() + o.slice(1)}`], s !== "md" && V[`size${s.toUpperCase()}`], c && V.rounded, (w || y) && V.inactive, B && V.iconOnly, ie && V.labelOnly, U && V.iconAndLabel, p && V.dropdown, r === "primary" && o !== "none" && d !== "bold" && V[`contrast${d.charAt(0).toUpperCase() + d.slice(1)}`], V[`elevation${G}`], f && f !== "faint" && V[f === "always-dark" ? "onAlwaysDark" : `on${f.charAt(0).toUpperCase() + f.slice(1)}`], l && V.fullWidth, C);
+	B && !O && !k && console.warn("[@ds-mo/ui Button] Icon-only Button is missing an accessible name. Provide `label`, `aria-label`, or `aria-labelledby`.");
+	let q = {};
+	return N && (q.type = T, q.disabled = w || y), ee && (q.href = ee), A && (q.target = A), j && (q.rel = j), P && (q.role = "button", q.tabIndex = I ? 0 : -1, I && (q.onKeyDown = (e) => {
+		(e.key === "Enter" || e.key === " ") && (e.preventDefault(), e.currentTarget.click());
+	})), /* @__PURE__ */ h(M, {
+		ref: t,
+		id: D,
+		className: K,
+		style: u ? { width: u } : void 0,
+		onClick: I ? b : void 0,
+		onMouseEnter: I ? x : void 0,
+		onMouseLeave: I ? S : void 0,
+		"aria-label": O,
+		"aria-labelledby": k,
+		"aria-disabled": w || y || void 0,
+		"aria-busy": y || void 0,
+		...q,
 		children: [
-			_ ? /* @__PURE__ */ f(z, { size: H }) : r && /* @__PURE__ */ f(r, { size: H }),
-			n && /* @__PURE__ */ f(R, {
-				truncate: s,
-				children: /* @__PURE__ */ f(w, {
-					variant: ie,
+			y ? /* @__PURE__ */ m(ne, { size: W }) : a && /* @__PURE__ */ m(a, { size: W }),
+			i && /* @__PURE__ */ m(te, {
+				truncate: l,
+				children: /* @__PURE__ */ m(E, {
+					variant: ae,
 					as: "span",
 					color: "inherit",
-					children: n
+					children: i
 				})
 			}),
-			d && /* @__PURE__ */ f(m, { size: H }),
-			h != null && h > 0 && /* @__PURE__ */ f("span", {
-				className: B.badge,
-				children: h > 9 ? "+" : h
+			p && /* @__PURE__ */ m(g, { size: W }),
+			_ != null && _ > 0 && /* @__PURE__ */ m("span", {
+				className: V.badge,
+				children: _ > 9 ? "+" : _
 			})
 		]
 	});
 });
-re.displayName = "Button";
-var H = {
+ie.displayName = "Button";
+var U = {
 	toggleButton: "_toggleButton_ywix4_11",
 	inactive: "_inactive_ywix4_38",
 	onMedium: "_onMedium_ywix4_51",
@@ -383,7 +402,7 @@ var H = {
 	sizeSM: "_sizeSM_ywix4_146",
 	sizeXS: "_sizeXS_ywix4_151",
 	rounded: "_rounded_ywix4_159"
-}, ie = {
+}, W = {
 	md: 20,
 	sm: 16,
 	xs: 12
@@ -391,18 +410,18 @@ var H = {
 	md: "text-body-medium-emphasis",
 	sm: "text-body-small-emphasis",
 	xs: "text-caption-emphasis"
-}, oe = n(({ elevation: e = "elevated", label: t, icon: n, size: r = "md", rounded: i = !1, background: a, pressed: o, onPressedChange: s, inactive: c = !1, className: l, id: u, "aria-label": d }, m) => {
-	let h = !!n, g = !!t, _ = h && !g, v = g && !h, y = h && g, b = ie[r], x = ae[r], S = e.charAt(0).toUpperCase() + e.slice(1);
-	return /* @__PURE__ */ p("button", {
-		ref: m,
+}, oe = r(({ elevation: e = "elevated", label: t, icon: n, size: r = "md", rounded: i = !1, background: a, pressed: o, onPressedChange: s, inactive: c = !1, className: l, id: u, "aria-label": d }, f) => {
+	let p = !!n, g = !!t, _ = p && !g, v = g && !p, y = p && g, b = W[r], x = ae[r], S = e.charAt(0).toUpperCase() + e.slice(1);
+	return /* @__PURE__ */ h("button", {
+		ref: f,
 		id: u,
-		className: P(H.toggleButton, H[`elevation${S}`], r !== "md" && H[`size${r.toUpperCase()}`], i && H.rounded, c && H.inactive, _ && H.iconOnly, v && H.labelOnly, y && H.iconAndLabel, a && a !== "faint" && H[a === "always-dark" ? "onAlwaysDark" : `on${a.charAt(0).toUpperCase() + a.slice(1)}`], o && H.pressed, l),
+		className: F(U.toggleButton, U[`elevation${S}`], r !== "md" && U[`size${r.toUpperCase()}`], i && U.rounded, c && U.inactive, _ && U.iconOnly, v && U.labelOnly, y && U.iconAndLabel, a && a !== "faint" && U[a === "always-dark" ? "onAlwaysDark" : `on${a.charAt(0).toUpperCase() + a.slice(1)}`], o && U.pressed, l),
 		onClick: c ? void 0 : () => s(!o),
 		type: "button",
 		disabled: c,
 		"aria-label": d || t || "toggle",
 		"aria-pressed": o,
-		children: [n && /* @__PURE__ */ f(n, { size: b }), t && /* @__PURE__ */ f(R, { children: /* @__PURE__ */ f(w, {
+		children: [n && /* @__PURE__ */ m(n, { size: b }), t && /* @__PURE__ */ m(te, { children: /* @__PURE__ */ m(E, {
 			variant: x,
 			as: "span",
 			color: "inherit",
@@ -411,7 +430,7 @@ var H = {
 	});
 });
 oe.displayName = "ToggleButton";
-var U = {
+var G = {
 	group: "_group_1u9mw_5",
 	groupElevated: "_groupElevated_1u9mw_27",
 	groupFlat: "_groupFlat_1u9mw_31",
@@ -439,22 +458,22 @@ var U = {
 	roundedFirstLG: "_roundedFirstLG_1u9mw_155",
 	roundedLastLG: "_roundedLastLG_1u9mw_156",
 	roundedMidLG: "_roundedMidLG_1u9mw_157"
-}, se = ({ children: t, className: n }) => {
+}, K = ({ children: t, className: n }) => {
 	let r = e.Children.toArray(t).filter(e.isValidElement), i = r.length, a = r[0]?.props, o = a?.variant ?? "secondary", s = a?.elevation ?? (o === "primary" ? "none" : "flat"), c = !!a?.rounded, l = s.charAt(0).toUpperCase() + s.slice(1);
-	return /* @__PURE__ */ f("div", {
-		className: P(U.group, U[`group${l}`], c && U.groupRounded, n),
+	return /* @__PURE__ */ m("div", {
+		className: F(G.group, G[`group${l}`], c && G.groupRounded, n),
 		role: "group",
 		children: r.map((t, n) => {
-			let r = t, a = r.props, o = n === 0, s = n === i - 1, c = !o && !s, l = a.variant ?? "secondary", u = a.size ?? "md", d = a.contrast ?? "bold", m = a.intent ?? "brand", h = !!a.rounded, g = !!a.icon && !a.label, _ = l === "secondary" && (a.elevation ?? "flat") === "none", v = l === "primary" && m !== "none", y = d.charAt(0).toUpperCase() + d.slice(1), b = u.toUpperCase(), x = h && !g && u !== "xs", S = P(U.divider, _ && U.dividerGhost, _ && u === "xs" && U.dividerGhostXS, _ && u === "sm" && U.dividerGhostSM, _ && u === "lg" && U.dividerGhostLG, v && U[`divider${y}`]);
-			return /* @__PURE__ */ p(e.Fragment, { children: [n > 0 && /* @__PURE__ */ f("div", {
+			let r = t, a = r.props, o = n === 0, s = n === i - 1, c = !o && !s, l = a.variant ?? "secondary", u = a.size ?? "md", d = a.contrast ?? "bold", f = a.intent ?? "brand", p = !!a.rounded, g = !!a.icon && !a.label, _ = l === "secondary" && (a.elevation ?? "flat") === "none", v = l === "primary" && f !== "none", y = d.charAt(0).toUpperCase() + d.slice(1), b = u.toUpperCase(), x = p && !g && u !== "xs", S = F(G.divider, _ && G.dividerGhost, _ && u === "xs" && G.dividerGhostXS, _ && u === "sm" && G.dividerGhostSM, _ && u === "lg" && G.dividerGhostLG, v && G[`divider${y}`]);
+			return /* @__PURE__ */ h(e.Fragment, { children: [n > 0 && /* @__PURE__ */ m("div", {
 				className: S,
 				"aria-hidden": "true"
-			}), e.cloneElement(r, { className: P(a.className, U.item, o && U.first, s && U.last, c && U.middle, _ && U.itemShort, x && o && U[`roundedFirst${b}`], x && s && U[`roundedLast${b}`], x && c && U[`roundedMid${b}`]) })] }, n);
+			}), e.cloneElement(r, { className: F(a.className, G.item, o && G.first, s && G.last, c && G.middle, _ && G.itemShort, x && o && G[`roundedFirst${b}`], x && s && G[`roundedLast${b}`], x && c && G[`roundedMid${b}`]) })] }, n);
 		})
 	});
 };
-se.displayName = "ButtonGroup";
-var W = {
+K.displayName = "ButtonGroup";
+var q = {
 	group: "_group_14dyx_5",
 	groupElevated: "_groupElevated_14dyx_27",
 	groupFlat: "_groupFlat_14dyx_31",
@@ -476,22 +495,22 @@ var W = {
 	roundedFirstSM: "_roundedFirstSM_14dyx_161",
 	roundedLastSM: "_roundedLastSM_14dyx_162",
 	roundedMidSM: "_roundedMidSM_14dyx_163"
-}, ce = ({ children: t, className: n }) => {
+}, se = ({ children: t, className: n }) => {
 	let r = e.Children.toArray(t).filter(e.isValidElement), i = r.length, a = r[0]?.props, o = a?.elevation ?? "elevated", s = !!a?.rounded, c = o.charAt(0).toUpperCase() + o.slice(1);
-	return /* @__PURE__ */ f("div", {
-		className: P(W.group, W[`group${c}`], s && W.groupRounded, n),
+	return /* @__PURE__ */ m("div", {
+		className: F(q.group, q[`group${c}`], s && q.groupRounded, n),
 		role: "group",
 		children: r.map((t, n) => {
-			let r = t, a = r.props, o = n === 0, s = n === i - 1, c = !o && !s, l = a.size ?? "md", u = !!a.rounded, d = !!a.pressed, m = !!a.icon && !a.label, h = (a.elevation ?? "elevated") === "none", g = l.toUpperCase(), _ = u && !m && l !== "xs", v = P(W.divider, h && W.dividerGhost, h && l === "xs" && W.dividerGhostXS, h && l === "sm" && W.dividerGhostSM);
-			return /* @__PURE__ */ p(e.Fragment, { children: [n > 0 && /* @__PURE__ */ f("div", {
+			let r = t, a = r.props, o = n === 0, s = n === i - 1, c = !o && !s, l = a.size ?? "md", u = !!a.rounded, d = !!a.pressed, f = !!a.icon && !a.label, p = (a.elevation ?? "elevated") === "none", g = l.toUpperCase(), _ = u && !f && l !== "xs", v = F(q.divider, p && q.dividerGhost, p && l === "xs" && q.dividerGhostXS, p && l === "sm" && q.dividerGhostSM);
+			return /* @__PURE__ */ h(e.Fragment, { children: [n > 0 && /* @__PURE__ */ m("div", {
 				className: v,
 				"aria-hidden": "true"
-			}), e.cloneElement(r, { className: P(a.className, W.item, o && W.first, s && W.last, c && W.middle, h && W.itemShort, h && d && W.itemPressed, _ && o && W[`roundedFirst${g}`], _ && s && W[`roundedLast${g}`], _ && c && W[`roundedMid${g}`]) })] }, n);
+			}), e.cloneElement(r, { className: F(a.className, q.item, o && q.first, s && q.last, c && q.middle, p && q.itemShort, p && d && q.itemPressed, _ && o && q[`roundedFirst${g}`], _ && s && q[`roundedLast${g}`], _ && c && q[`roundedMid${g}`]) })] }, n);
 		})
 	});
 };
-ce.displayName = "ToggleButtonGroup";
-var G = {
+se.displayName = "ToggleButtonGroup";
+var J = {
 	tag: "_tag_1sd2v_6",
 	sizeMd: "_sizeMd_1sd2v_27",
 	sizeSm: "_sizeSm_1sd2v_28",
@@ -531,129 +550,124 @@ var G = {
 	removable: "_removable_1sd2v_236",
 	removeButton: "_removeButton_1sd2v_239",
 	inactive: "_inactive_1sd2v_270"
-}, le = {
+}, ce = {
 	md: 20,
 	sm: 16,
 	xs: 12
-}, ue = {
+}, le = {
 	md: "text-body-medium",
 	sm: "text-body-small",
 	xs: "text-caption"
-}, de = n(({ label: e, intent: t = "neutral", contrast: n = "faint", elevation: r = "none", size: i = "md", rounded: a = !1, icon: o, removable: s = !1, onRemove: c, removeIcon: l, maxWidth: u, inactive: d = !1, background: m, onClick: g, pressed: _, onPressedChange: v, className: y }, b) => {
-	let x = !!g || !!v, S = s && !!c, C = le[i], T = ue[i], E = r.charAt(0).toUpperCase() + r.slice(1), D = i.toUpperCase();
-	return /* @__PURE__ */ p("div", {
+}, ue = r(({ label: e, intent: t = "neutral", contrast: n = "faint", elevation: r = "none", size: i = "md", rounded: a = !1, icon: o, removable: s = !1, onRemove: c, removeIcon: l, maxWidth: u, inactive: d = !1, background: f, onClick: p, pressed: g, onPressedChange: v, className: y }, b) => {
+	let x = !!p || !!v, S = s && !!c, C = ce[i], w = le[i], T = r.charAt(0).toUpperCase() + r.slice(1), D = i.toUpperCase();
+	return /* @__PURE__ */ h("div", {
 		ref: b,
-		className: P(G.tag, G[`intent${t.charAt(0).toUpperCase() + t.slice(1)}`], G[`contrast${n.charAt(0).toUpperCase() + n.slice(1)}`], G[`elevation${E}`], G[`size${i.charAt(0).toUpperCase() + i.slice(1)}`], a && G.rounded, a && !o && G[`roundedLeft${D}`], a && !S && G[`roundedRight${D}`], !!o && G[`iconLeft${D}`], S && G[`iconRight${D}`], s && G.removable, x && G.interactive, m && m !== "faint" && G[m === "always-dark" ? "onAlwaysDark" : `on${m.charAt(0).toUpperCase() + m.slice(1)}`], d && G.inactive, _ && G.pressed, y),
+		className: F(J.tag, J[`intent${t.charAt(0).toUpperCase() + t.slice(1)}`], J[`contrast${n.charAt(0).toUpperCase() + n.slice(1)}`], J[`elevation${T}`], J[`size${i.charAt(0).toUpperCase() + i.slice(1)}`], a && J.rounded, a && !o && J[`roundedLeft${D}`], a && !S && J[`roundedRight${D}`], !!o && J[`iconLeft${D}`], S && J[`iconRight${D}`], s && J.removable, x && J.interactive, f && f !== "faint" && J[f === "always-dark" ? "onAlwaysDark" : `on${f.charAt(0).toUpperCase() + f.slice(1)}`], d && J.inactive, g && J.pressed, y),
 		style: u == null ? void 0 : { maxWidth: typeof u == "number" ? `${u}px` : u },
 		onClick: x && !d ? () => {
-			v?.(!_), g?.();
+			v?.(!g), p?.();
 		} : void 0,
 		onKeyDown: x && !d ? (e) => {
-			(e.key === "Enter" || e.key === " ") && (e.preventDefault(), v?.(!_), g?.());
+			(e.key === "Enter" || e.key === " ") && (e.preventDefault(), v?.(!g), p?.());
 		} : void 0,
 		role: x ? "button" : void 0,
-		tabIndex: x && !d ? 0 : void 0,
-		"aria-pressed": v == null ? void 0 : _,
+		tabIndex: x ? d ? -1 : 0 : void 0,
+		"aria-pressed": x && g !== void 0 ? !!g : void 0,
 		"aria-disabled": d || void 0,
 		children: [
-			o && /* @__PURE__ */ f(o, { size: C }),
-			/* @__PURE__ */ f(R, {
+			o && /* @__PURE__ */ m(o, { size: C }),
+			/* @__PURE__ */ m(te, {
 				size: i,
-				children: /* @__PURE__ */ f(w, {
-					variant: T,
+				children: /* @__PURE__ */ m(E, {
+					variant: w,
 					as: "span",
 					color: "inherit",
 					children: e
 				})
 			}),
-			s && c && /* @__PURE__ */ f("button", {
+			s && c && /* @__PURE__ */ m("button", {
 				type: "button",
-				className: G.removeButton,
+				className: J.removeButton,
 				onClick: (e) => {
 					e.stopPropagation(), c();
 				},
 				"aria-label": `Remove ${e}`,
 				tabIndex: -1,
-				children: f(l || h, { size: C })
+				children: m(l || _, { size: C })
 			})
 		]
 	});
 });
-de.displayName = "Tag";
-var fe = { badge: "_badge_1nscu_1" }, pe = ({ count: e, isSelected: t = !1, className: n }) => {
+ue.displayName = "Tag";
+var de = { badge: "_badge_1nscu_1" }, fe = ({ count: e, isSelected: t = !1, className: n, "aria-label": r, labelFormat: i }) => {
 	if (e === 0) return null;
-	let r = e > 9 ? "+" : e.toString();
-	return /* @__PURE__ */ f("span", {
-		className: `${fe.badge} ${n || ""}`,
-		"aria-label": `${e} unread`,
-		children: /* @__PURE__ */ f(w, {
+	let a = e > 9 ? "+" : e.toString(), o = r ?? i?.(e) ?? String(e);
+	return /* @__PURE__ */ m("span", {
+		className: `${de.badge} ${n || ""}`,
+		"aria-label": o,
+		children: /* @__PURE__ */ m(E, {
 			variant: "text-caption-emphasis",
 			as: "span",
 			color: t ? "primary" : "secondary",
-			children: r
+			children: a
 		})
 	});
 };
-pe.displayName = "Badge";
-var me = {
+fe.displayName = "Badge";
+var pe = {
 	toggle: "_toggle_1aw6v_1",
 	checked: "_checked_1aw6v_35",
 	thumb: "_thumb_1aw6v_39",
 	inactive: "_inactive_1aw6v_62"
-}, he = n(({ checked: e = !1, onChange: t, inactive: n = !1, className: r, "aria-label": i }, a) => {
-	let [o, s] = l(!1);
-	return /* @__PURE__ */ f("button", {
-		ref: a,
-		type: "button",
-		role: "switch",
-		"aria-checked": e,
-		"aria-label": i,
-		disabled: n,
-		className: P(me.toggle, e && me.checked, n && me.inactive, r),
-		onMouseDown: (e) => {
-			n || (e.preventDefault(), s(!0));
-		},
-		onMouseUp: () => {
-			n || !o || (s(!1), t?.(!e));
-		},
-		onMouseLeave: () => {
-			o && s(!1);
-		},
-		children: /* @__PURE__ */ f("span", { className: me.thumb })
-	});
-});
-he.displayName = "Toggle";
-var ge = {
+}, me = r(({ checked: e = !1, onChange: t, inactive: n = !1, className: r, "aria-label": i, "aria-labelledby": a }, o) => /* @__PURE__ */ m("button", {
+	ref: o,
+	type: "button",
+	role: "switch",
+	"aria-checked": e,
+	"aria-label": i,
+	"aria-labelledby": a,
+	disabled: n,
+	className: F(pe.toggle, e && pe.checked, n && pe.inactive, r),
+	onClick: () => {
+		n || t?.(!e);
+	},
+	children: /* @__PURE__ */ m("span", { className: pe.thumb })
+}));
+me.displayName = "Toggle";
+var he = {
 	checkbox: "_checkbox_1brbf_1",
 	inactive: "_inactive_1brbf_18",
 	box: "_box_1brbf_25",
 	boxChecked: "_boxChecked_1brbf_37",
 	checkmark: "_checkmark_1brbf_42"
-}, _e = n(({ label: e, checked: t = !1, indeterminate: n = !1, onChange: r, inactive: i = !1, className: a, checkedIcon: o, uncheckedIcon: s, indeterminateIcon: c }, l) => {
-	let u = () => {
+}, ge = r(({ label: e, checked: t = !1, indeterminate: n = !1, onChange: r, inactive: i = !1, className: a, checkedIcon: o, uncheckedIcon: c, indeterminateIcon: l }, u) => {
+	let d = s(), f = () => {
 		i || r?.(!t);
-	}, d = n || t ? "var(--color-foreground-primary)" : "var(--color-foreground-secondary)", m = n ? c : t ? o : s;
-	return /* @__PURE__ */ p("div", {
-		ref: l,
+	}, p = n || t ? "var(--color-foreground-primary)" : "var(--color-foreground-secondary)", g = n ? l : t ? o : c;
+	return /* @__PURE__ */ h("div", {
+		ref: u,
 		role: "checkbox",
 		"aria-checked": n ? "mixed" : t,
-		"aria-inactive": i,
+		"aria-disabled": i || void 0,
+		"aria-labelledby": d,
+		"data-inactive": i || void 0,
 		tabIndex: i ? -1 : 0,
-		className: P(ge.checkbox, i && ge.inactive, a),
-		onClick: u,
+		className: F(he.checkbox, i && he.inactive, a),
+		onClick: f,
 		onKeyDown: (e) => {
-			(e.key === " " || e.key === "Enter") && (e.preventDefault(), u());
+			(e.key === " " || e.key === "Enter") && (e.preventDefault(), f());
 		},
-		children: [m ? /* @__PURE__ */ f(m, {
+		children: [g ? /* @__PURE__ */ m(g, {
 			size: 20,
-			color: d
-		}) : /* @__PURE__ */ f("span", {
-			className: P(ge.box, (t || n) && ge.boxChecked),
-			children: (t || n) && /* @__PURE__ */ f("span", {
-				className: ge.checkmark,
+			color: p
+		}) : /* @__PURE__ */ m("span", {
+			className: F(he.box, (t || n) && he.boxChecked),
+			children: (t || n) && /* @__PURE__ */ m("span", {
+				className: he.checkmark,
 				children: n ? "−" : "✓"
 			})
-		}), /* @__PURE__ */ f(w, {
+		}), /* @__PURE__ */ m(E, {
+			id: d,
 			variant: "text-body-medium",
 			as: "span",
 			color: "inherit",
@@ -661,136 +675,157 @@ var ge = {
 		})]
 	});
 });
-_e.displayName = "Checkbox";
-var ve = {
-	wrapper: "_wrapper_14bd3_1",
-	row: "_row_14bd3_16",
-	input: "_input_14bd3_24",
-	clearButton: "_clearButton_14bd3_49",
-	suffix: "_suffix_14bd3_65"
-}, ye = n(({ value: e, onChange: t, id: n, placeholder: r, autoFocus: i = !1, className: a, type: o = "text", inactive: s = !1, onKeyDown: c, suffix: l, clearIcon: u, "aria-label": d }, m) => {
-	let h = o === "search" && e.length > 0 && !s;
-	return /* @__PURE__ */ f("div", {
-		ref: m,
-		className: P(ve.wrapper, a),
-		children: /* @__PURE__ */ p("div", {
-			className: ve.row,
-			children: [
-				/* @__PURE__ */ f("input", {
-					type: o,
-					id: n,
-					value: e,
-					onChange: t,
-					onKeyDown: c,
-					placeholder: r,
-					className: ve.input,
-					autoFocus: i,
-					disabled: s,
-					"aria-label": d
-				}),
-				h && /* @__PURE__ */ f("button", {
-					type: "button",
-					className: ve.clearButton,
-					onClick: () => {
-						t({ target: { value: "" } });
-					},
-					"aria-label": "Clear",
-					children: u ? /* @__PURE__ */ f(u, { size: 16 }) : /* @__PURE__ */ f("span", {
-						"aria-hidden": !0,
-						children: "×"
+ge.displayName = "Checkbox";
+var _e = {
+	container: "_container_ce0xu_1",
+	wrapper: "_wrapper_ce0xu_8",
+	wrapperError: "_wrapperError_ce0xu_23",
+	errorText: "_errorText_ce0xu_31",
+	row: "_row_ce0xu_37",
+	input: "_input_ce0xu_45",
+	clearButton: "_clearButton_ce0xu_70",
+	suffix: "_suffix_ce0xu_86"
+}, ve = () => !!import.meta.env?.DEV, ye = r(({ value: e, onChange: t, id: n, placeholder: r, autoFocus: i = !1, className: a, type: c = "text", inactive: l = !1, onKeyDown: u, suffix: d, clearIcon: f, "aria-label": p, "aria-labelledby": g, "aria-describedby": _, error: v = !1, errorMessage: y }, b) => {
+	let x = `${s()}-error`, S = c === "search" && e.length > 0 && !l, C = v && !!y, w = [_, C ? x : void 0].filter(Boolean).join(" ") || void 0;
+	return o(() => {
+		ve() && !n && !p && !g && console.warn("[@ds-mo/ui] <Input> is missing an accessible name. Provide one of: `id` (paired with a <label htmlFor>), `aria-label`, or `aria-labelledby`.");
+	}, [
+		n,
+		p,
+		g
+	]), /* @__PURE__ */ h("div", {
+		className: _e.container,
+		children: [/* @__PURE__ */ m("div", {
+			ref: b,
+			className: F(_e.wrapper, v && _e.wrapperError, a),
+			children: /* @__PURE__ */ h("div", {
+				className: _e.row,
+				children: [
+					/* @__PURE__ */ m("input", {
+						type: c,
+						id: n,
+						value: e,
+						onChange: t,
+						onKeyDown: u,
+						placeholder: r,
+						className: _e.input,
+						autoFocus: i,
+						disabled: l,
+						"aria-label": p,
+						"aria-labelledby": g,
+						"aria-describedby": w,
+						"aria-invalid": v || void 0
+					}),
+					S && /* @__PURE__ */ m("button", {
+						type: "button",
+						className: _e.clearButton,
+						onClick: () => {
+							t({ target: { value: "" } });
+						},
+						"aria-label": "Clear",
+						children: f ? /* @__PURE__ */ m(f, { size: 16 }) : /* @__PURE__ */ m("span", {
+							"aria-hidden": !0,
+							children: "×"
+						})
+					}),
+					d && /* @__PURE__ */ m("div", {
+						className: _e.suffix,
+						children: d
 					})
-				}),
-				l && /* @__PURE__ */ f("div", {
-					className: ve.suffix,
-					children: l
-				})
-			]
-		})
+				]
+			})
+		}), C && /* @__PURE__ */ m("div", {
+			id: x,
+			role: "alert",
+			className: _e.errorText,
+			children: y
+		})]
 	});
 });
 ye.displayName = "Input";
-var K = {
-	field: "_field_6azt6_1",
-	labelRow: "_labelRow_6azt6_2",
-	track: "_track_6azt6_4",
-	trackInner: "_trackInner_6azt6_10",
-	fillTrack: "_fillTrack_6azt6_16",
-	fill: "_fill_6azt6_16",
-	trackAtMin: "_trackAtMin_6azt6_27",
-	thumb: "_thumb_6azt6_29",
-	trackInactive: "_trackInactive_6azt6_49",
-	input: "_input_6azt6_54"
-}, be = n(({ value: e, onChange: t, min: n = 0, max: o = 100, step: s = 1, label: u, id: d, inactive: m = !1, className: h }, g) => {
-	let _ = a(), v = d ?? _, y = c(null), [b, x] = l(() => {
-		let t = o - n;
+var Y = {
+	field: "_field_x9zdb_1",
+	labelRow: "_labelRow_x9zdb_2",
+	track: "_track_x9zdb_4",
+	trackInner: "_trackInner_x9zdb_10",
+	fillTrack: "_fillTrack_x9zdb_16",
+	fill: "_fill_x9zdb_16",
+	trackAtMin: "_trackAtMin_x9zdb_31",
+	thumb: "_thumb_x9zdb_33",
+	trackInactive: "_trackInactive_x9zdb_53",
+	input: "_input_x9zdb_58"
+}, be = r(({ value: e, onChange: t, min: n = 0, max: r = 100, step: i = 1, label: c, id: l, inactive: f = !1, className: p, valueText: g }, _) => {
+	let v = s(), y = l ?? v, b = u(null), [x, S] = d(() => {
+		let t = r - n;
 		return t === 0 ? 0 : Math.round((e - n) / t * 100);
-	}), S = r(() => {
-		let t = o - n;
-		x(t === 0 ? 0 : Math.round((e - n) / t * 100));
+	}), C = a(() => {
+		let t = r - n;
+		S(t === 0 ? 0 : Math.round((e - n) / t * 100));
 	}, [
 		e,
 		n,
-		o
+		r
 	]);
-	return i(() => {
-		S();
-	}, [S]), /* @__PURE__ */ p("div", {
-		ref: g,
-		className: P(K.field, h),
-		children: [/* @__PURE__ */ p("div", {
-			className: K.labelRow,
-			children: [/* @__PURE__ */ f(w, {
+	return o(() => {
+		C();
+	}, [C]), /* @__PURE__ */ h("div", {
+		ref: _,
+		className: F(Y.field, p),
+		children: [/* @__PURE__ */ h("div", {
+			className: Y.labelRow,
+			children: [/* @__PURE__ */ m(E, {
 				variant: "text-body-small-emphasis",
 				as: "label",
-				htmlFor: v,
-				children: u
-			}), /* @__PURE__ */ f(w, {
+				htmlFor: y,
+				children: c
+			}), /* @__PURE__ */ m(E, {
 				variant: "text-body-small-emphasis",
 				as: "span",
 				children: e
 			})]
-		}), /* @__PURE__ */ p("div", {
-			ref: y,
-			className: P(K.track, m && K.trackInactive, b === 0 && K.trackAtMin),
-			style: { "--slider-pct": b },
-			children: [/* @__PURE__ */ p("div", {
-				className: K.trackInner,
-				children: [/* @__PURE__ */ f("div", {
-					className: K.fillTrack,
-					children: /* @__PURE__ */ f("div", { className: K.fill })
-				}), /* @__PURE__ */ f("div", { className: K.thumb })]
-			}), /* @__PURE__ */ f("input", {
+		}), /* @__PURE__ */ h("div", {
+			ref: b,
+			className: F(Y.track, f && Y.trackInactive, x === 0 && Y.trackAtMin),
+			style: { "--slider-pct": x },
+			children: [/* @__PURE__ */ h("div", {
+				className: Y.trackInner,
+				children: [/* @__PURE__ */ m("div", {
+					className: Y.fillTrack,
+					children: /* @__PURE__ */ m("div", { className: Y.fill })
+				}), /* @__PURE__ */ m("div", { className: Y.thumb })]
+			}), /* @__PURE__ */ m("input", {
 				type: "range",
-				id: v,
+				id: y,
 				min: n,
-				max: o,
-				step: s,
+				max: r,
+				step: i,
 				value: e,
 				onChange: (e) => {
 					t(Number(e.target.value));
 				},
-				disabled: m,
-				className: K.input,
-				"aria-valuemin": n,
-				"aria-valuemax": o,
-				"aria-valuenow": e
+				disabled: f,
+				className: Y.input,
+				"aria-valuetext": g
 			})]
 		})]
 	});
 });
 be.displayName = "Slider";
-var xe = { field: "_field_140we_1" }, Se = n(({ label: e, children: t, id: n, className: r }, i) => /* @__PURE__ */ p("div", {
-	ref: i,
-	className: P(xe.field, r),
-	children: [/* @__PURE__ */ f(w, {
-		variant: "text-body-small-emphasis",
-		as: "label",
-		htmlFor: n,
-		children: e
-	}), t]
-}));
+var xe = { field: "_field_140we_1" }, Se = r(({ label: e, children: t, id: r, className: a }, o) => {
+	let c = s(), l = r ?? c, u = t;
+	return i(t) && t.props.id === void 0 && (u = n(t, { id: l })), /* @__PURE__ */ h("div", {
+		ref: o,
+		className: F(xe.field, a),
+		children: [/* @__PURE__ */ m(E, {
+			variant: "text-body-small-emphasis",
+			as: "label",
+			htmlFor: l,
+			children: e
+		}), u]
+	});
+});
 Se.displayName = "Field";
-var q = {
+var Ce = {
 	backdrop: "_backdrop_k4mxw_1",
 	modalBackdropFadeIn: "_modalBackdropFadeIn_k4mxw_1",
 	closing: "_closing_k4mxw_15",
@@ -802,211 +837,303 @@ var q = {
 	subtitle: "_subtitle_k4mxw_55",
 	body: "_body_k4mxw_60",
 	footer: "_footer_k4mxw_65"
-}, Ce = {
+}, we = {
 	sm: "var(--dimension-modal-width-sm, 400px)",
 	md: "var(--dimension-modal-width-md, 560px)",
 	lg: "var(--dimension-modal-width-lg, 720px)"
-}, we = 220, Te = ({ isOpen: e, onClose: t, title: n, subtitle: r, children: o, footer: u, width: d = "md", bodyClassName: m }) => {
-	let h = c(null), g = a(), [v, y] = l(!1), [b, x] = l(e), S = s(() => d === "sm" || d === "md" || d === "lg" ? Ce[d] : d, [d]);
-	return i(() => {
-		if (e) x(!0), y(!1);
-		else if (b) {
-			y(!0);
+}, Te = 220, Ee = [
+	"a[href]",
+	"area[href]",
+	"button:not([disabled])",
+	"input:not([disabled]):not([type=\"hidden\"])",
+	"select:not([disabled])",
+	"textarea:not([disabled])",
+	"iframe",
+	"object",
+	"embed",
+	"[contenteditable=\"true\"]",
+	"[tabindex]:not([tabindex=\"-1\"])"
+].join(","), De = (e) => {
+	let t = e.querySelectorAll(Ee);
+	return Array.from(t).filter((e) => !e.hasAttribute("disabled") && e.getAttribute("aria-hidden") !== "true");
+}, Oe = ({ isOpen: e, onClose: t, title: n, subtitle: r, children: i, footer: a, width: c = "md", bodyClassName: f, initialFocus: p }) => {
+	let g = u(null), _ = u(null), v = s(), b = s(), [x, S] = d(!1), [C, w] = d(e), T = l(() => c === "sm" || c === "md" || c === "lg" ? we[c] : c, [c]);
+	o(() => {
+		if (e) w(!0), S(!1);
+		else if (C) {
+			S(!0);
 			let e = setTimeout(() => {
-				x(!1), y(!1);
-			}, we);
+				w(!1), S(!1);
+			}, Te);
 			return () => clearTimeout(e);
 		}
-	}, [e, b]), i(() => {
+	}, [e, C]), o(() => {
 		if (!e) return;
 		let n = (e) => {
 			e.key === "Escape" && t();
 		};
 		return document.addEventListener("keydown", n), () => document.removeEventListener("keydown", n);
-	}, [e, t]), i(() => {
-		if (!e || !b) return;
+	}, [e, t]), o(() => {
+		if (!e || !C) return;
+		_.current = document.activeElement instanceof HTMLElement ? document.activeElement : null;
 		let t = requestAnimationFrame(() => {
-			h.current?.focus();
+			let e = g.current;
+			if (!e) return;
+			if (p?.current) {
+				p.current.focus();
+				return;
+			}
+			let t = De(e);
+			t.length > 0 ? t[0].focus() : e.focus();
 		});
-		return () => cancelAnimationFrame(t);
-	}, [e, b]), b ? _(/* @__PURE__ */ f("div", {
-		className: `${q.backdrop} ${v ? q.closing : ""}`,
+		return () => {
+			cancelAnimationFrame(t);
+			let e = _.current;
+			e && document.contains(e) && e.focus(), _.current = null;
+		};
+	}, [
+		e,
+		C,
+		p
+	]);
+	let D = (e) => {
+		if (e.key !== "Tab") return;
+		let t = g.current;
+		if (!t) return;
+		let n = De(t);
+		if (n.length === 0) {
+			e.preventDefault(), t.focus();
+			return;
+		}
+		let r = n[0], i = n[n.length - 1], a = document.activeElement;
+		e.shiftKey ? (a === r || a === t || !t.contains(a)) && (e.preventDefault(), i.focus()) : (a === i || !t.contains(a)) && (e.preventDefault(), r.focus());
+	};
+	if (!C) return null;
+	let O = r == null ? void 0 : b;
+	return y(/* @__PURE__ */ m("div", {
+		className: `${Ce.backdrop} ${x ? Ce.closing : ""}`,
 		onMouseDown: (e) => {
 			e.target === e.currentTarget && t();
 		},
-		children: /* @__PURE__ */ p(M, {
-			ref: h,
+		onKeyDown: D,
+		children: /* @__PURE__ */ h(N, {
+			ref: g,
 			background: "primary",
 			elevation: "floating",
 			radius: "var(--dimension-radius-275, 22px)",
-			className: q.dialog,
-			style: { width: `min(${S}, calc(100vw - 32px))` },
+			className: Ce.dialog,
+			style: { width: `min(${T}, calc(100vw - 32px))` },
 			role: "dialog",
 			"aria-modal": "true",
-			"aria-labelledby": g,
+			"aria-labelledby": v,
+			"aria-describedby": O,
 			tabIndex: -1,
 			children: [
-				/* @__PURE__ */ p("div", {
-					className: q.header,
-					children: [/* @__PURE__ */ f(w, {
-						id: g,
+				/* @__PURE__ */ h("div", {
+					className: Ce.header,
+					children: [/* @__PURE__ */ m(E, {
+						id: v,
 						as: "h2",
 						variant: "text-title-small",
 						children: n
-					}), r != null && /* @__PURE__ */ f("div", {
-						className: q.subtitle,
+					}), r != null && /* @__PURE__ */ m("div", {
+						id: b,
+						className: Ce.subtitle,
 						children: r
 					})]
 				}),
-				/* @__PURE__ */ f("div", {
-					className: `${q.body} ${m ?? ""}`.trim(),
-					children: o
+				/* @__PURE__ */ m("div", {
+					className: `${Ce.body} ${f ?? ""}`.trim(),
+					children: i
 				}),
-				u != null && /* @__PURE__ */ f("div", {
-					className: q.footer,
-					children: u
+				a != null && /* @__PURE__ */ m("div", {
+					className: Ce.footer,
+					children: a
 				})
 			]
 		})
-	}), document.body) : null;
+	}), document.body);
 };
-Te.displayName = "Modal";
-var J = {
-	menuItem: "_menuItem_ozcs1_1",
-	subtext: "_subtext_ozcs1_15",
-	iconPrefix: "_iconPrefix_ozcs1_17",
-	menuItemSelected: "_menuItemSelected_ozcs1_24",
-	content: "_content_ozcs1_26",
-	label: "_label_ozcs1_34",
-	menuItemLabelTertiary: "_menuItemLabelTertiary_ozcs1_37",
-	menuItemNegative: "_menuItemNegative_ozcs1_38",
-	menuItemInactive: "_menuItemInactive_ozcs1_42",
-	toggleSuffix: "_toggleSuffix_ozcs1_44",
-	toggle: "_toggle_ozcs1_44",
-	toggleOn: "_toggleOn_ozcs1_55",
-	toggleThumb: "_toggleThumb_ozcs1_57",
-	checkSuffix: "_checkSuffix_ozcs1_70",
-	chevronSuffix: "_chevronSuffix_ozcs1_77"
-}, Ee = n(({ label: e, onClick: t, isSelected: n = !1, isInactive: r = !1, icon: i, labelColor: a, subtext: o, showToggle: s = !1, toggleValue: c = !1, intent: l, selectionStyle: u = "highlight", showTrailingChevron: d = !1, checkIcon: m, chevronIcon: h }, g) => {
-	let _ = u === "radio";
-	return /* @__PURE__ */ p(M, {
-		ref: g,
+Oe.displayName = "Modal";
+var X = {
+	menuItem: "_menuItem_1yf1s_1",
+	subtext: "_subtext_1yf1s_15",
+	iconPrefix: "_iconPrefix_1yf1s_17",
+	menuItemSelected: "_menuItemSelected_1yf1s_24",
+	content: "_content_1yf1s_26",
+	label: "_label_1yf1s_34",
+	menuItemLabelTertiary: "_menuItemLabelTertiary_1yf1s_37",
+	menuItemNegative: "_menuItemNegative_1yf1s_38",
+	menuItemInactive: "_menuItemInactive_1yf1s_42",
+	menuItemActive: "_menuItemActive_1yf1s_44",
+	toggleSuffix: "_toggleSuffix_1yf1s_46",
+	toggle: "_toggle_1yf1s_46",
+	toggleOn: "_toggleOn_1yf1s_57",
+	toggleThumb: "_toggleThumb_1yf1s_59",
+	checkSuffix: "_checkSuffix_1yf1s_72",
+	chevronSuffix: "_chevronSuffix_1yf1s_79"
+}, ke = r(({ label: e, onClick: t, isSelected: n = !1, isInactive: r = !1, icon: i, labelColor: a, subtext: o, showToggle: s = !1, toggleValue: c = !1, intent: l, selectionStyle: u = "highlight", showTrailingChevron: d = !1, checkIcon: f, chevronIcon: p, role: g, id: _, ariaSelected: v, isActive: y = !1, tabIndex: b, onKeyDown: x, onFocus: S }, C) => {
+	let w = u === "radio", T = n && !(u === "noOverlay" || w), D = g ?? (s ? "menuitemcheckbox" : w ? "menuitemradio" : "menuitem"), O = g ? void 0 : D === "menuitemcheckbox" ? !!c : D === "menuitemradio" ? !!n : void 0, k = g && v !== void 0 ? v : void 0;
+	return /* @__PURE__ */ h(N, {
+		ref: C,
 		as: "button",
 		interactive: !r,
-		selected: n && !(u === "noOverlay" || _),
+		selected: T,
 		radius: "sm",
-		className: `${J.menuItem} ${n ? J.menuItemSelected : ""} ${r ? J.menuItemInactive : ""} ${l === "negative" ? J.menuItemNegative : ""} ${a === "tertiary" ? J.menuItemLabelTertiary : ""}`,
+		className: `${X.menuItem} ${n ? X.menuItemSelected : ""} ${r ? X.menuItemInactive : ""} ${l === "negative" ? X.menuItemNegative : ""} ${a === "tertiary" ? X.menuItemLabelTertiary : ""} ${y ? X.menuItemActive : ""}`,
 		onClick: t,
 		type: "button",
 		inactive: r,
+		role: D,
+		id: _,
+		"aria-checked": O,
+		"aria-selected": k,
+		"aria-disabled": r || void 0,
+		tabIndex: b,
+		onKeyDown: x,
+		onFocus: S,
 		children: [
-			i && /* @__PURE__ */ f("div", {
-				className: J.iconPrefix,
-				children: /* @__PURE__ */ f(i, { size: 20 })
+			i && /* @__PURE__ */ m("div", {
+				className: X.iconPrefix,
+				"aria-hidden": "true",
+				children: /* @__PURE__ */ m(i, { size: 20 })
 			}),
-			/* @__PURE__ */ p("div", {
-				className: J.content,
-				children: [/* @__PURE__ */ f(w, {
+			/* @__PURE__ */ h("div", {
+				className: X.content,
+				children: [/* @__PURE__ */ m(E, {
 					variant: n ? "text-body-medium-emphasis" : "text-body-medium",
 					color: a,
 					as: "span",
-					className: J.label,
+					className: X.label,
 					children: e
-				}), o && /* @__PURE__ */ f(w, {
+				}), o && /* @__PURE__ */ m(E, {
 					variant: "text-body-small",
 					as: "span",
-					className: J.subtext,
+					className: X.subtext,
 					children: o
 				})]
 			}),
-			s && /* @__PURE__ */ f("div", {
-				className: J.toggleSuffix,
-				children: /* @__PURE__ */ f("div", {
-					className: `${J.toggle} ${c ? J.toggleOn : ""}`,
-					children: /* @__PURE__ */ f("div", { className: J.toggleThumb })
+			s && /* @__PURE__ */ m("div", {
+				className: X.toggleSuffix,
+				"aria-hidden": "true",
+				children: /* @__PURE__ */ m("div", {
+					className: `${X.toggle} ${c ? X.toggleOn : ""}`,
+					children: /* @__PURE__ */ m("div", { className: X.toggleThumb })
 				})
 			}),
-			_ && n && m && /* @__PURE__ */ f("div", {
-				className: J.checkSuffix,
-				children: /* @__PURE__ */ f(m, { size: 20 })
+			w && n && f && /* @__PURE__ */ m("div", {
+				className: X.checkSuffix,
+				"aria-hidden": "true",
+				children: /* @__PURE__ */ m(f, { size: 20 })
 			}),
-			d && h && /* @__PURE__ */ f("div", {
-				className: J.chevronSuffix,
-				children: /* @__PURE__ */ f(h, { size: 20 })
+			d && p && /* @__PURE__ */ m("div", {
+				className: X.chevronSuffix,
+				"aria-hidden": "true",
+				children: /* @__PURE__ */ m(p, { size: 20 })
 			})
 		]
 	});
 });
-Ee.displayName = "MenuItem";
-var De = {
+ke.displayName = "MenuItem";
+var Ae = {
 	destructiveMenuItem: "_destructiveMenuItem_1t03u_1",
 	subtext: "_subtext_1t03u_19",
 	progressFill: "_progressFill_1t03u_21",
 	content: "_content_1t03u_44",
 	label: "_label_1t03u_53"
-}, Oe = n(({ label: e, onClick: t, holdDuration: n = 4e3, subtext: r }, a) => {
-	let [o, s] = l(0), u = c(null), d = c(0), m = c(null), h = () => {
-		s(0), u.current &&= (clearTimeout(u.current), null), m.current &&= (cancelAnimationFrame(m.current), null);
-	};
-	return i(() => () => {
-		h();
-	}, []), /* @__PURE__ */ p("button", {
-		ref: a,
-		className: De.destructiveMenuItem,
-		onMouseDown: (e) => {
-			if (e.stopPropagation(), e.preventDefault(), n === 0) {
-				t();
+}, je = r(({ label: e, onClick: t, holdDuration: n = 4e3, subtext: r, tabIndex: i, onKeyDown: a, onFocus: s }, c) => {
+	let [l, f] = d(0), p = u(null), g = u(0), _ = u(null), v = u(!1), y = () => {
+		f(0), v.current = !1, p.current &&= (clearTimeout(p.current), null), _.current &&= (cancelAnimationFrame(_.current), null);
+	}, b = () => {
+		if (v.current) return;
+		if (v.current = !0, n === 0) {
+			t(), y();
+			return;
+		}
+		g.current = performance.now();
+		let e = () => {
+			let t = performance.now() - g.current, r = Math.min(t / n * 100, 100);
+			f(r), r < 100 && (_.current = requestAnimationFrame(e));
+		};
+		_.current = requestAnimationFrame(e), p.current = window.setTimeout(() => {
+			t(), y();
+		}, n);
+	}, x = (e) => {
+		e.stopPropagation(), e.preventDefault(), b();
+	}, S = (e) => {
+		e.stopPropagation(), y();
+	}, C = (e) => {
+		e.stopPropagation(), y();
+	}, w = (e) => e.key === " " || e.key === "Spacebar";
+	return o(() => () => {
+		y();
+	}, []), /* @__PURE__ */ h("button", {
+		ref: c,
+		className: Ae.destructiveMenuItem,
+		onMouseDown: x,
+		onMouseUp: S,
+		onMouseLeave: C,
+		onKeyDown: (e) => {
+			if (w(e)) {
+				if (e.preventDefault(), e.repeat) return;
+				e.stopPropagation(), b();
 				return;
 			}
-			d.current = performance.now();
-			let r = () => {
-				let e = performance.now() - d.current, t = Math.min(e / n * 100, 100);
-				s(t), t < 100 && (m.current = requestAnimationFrame(r));
-			};
-			m.current = requestAnimationFrame(r), u.current = window.setTimeout(() => {
-				t(), h();
-			}, n);
+			if (e.key === "Enter") {
+				e.preventDefault();
+				return;
+			}
+			a?.(e);
 		},
-		onMouseUp: (e) => {
-			e.stopPropagation(), h();
+		onKeyUp: (e) => {
+			w(e) && (e.preventDefault(), e.stopPropagation(), y());
 		},
-		onMouseLeave: (e) => {
-			e.stopPropagation(), h();
+		onBlur: () => {
+			y();
 		},
+		onFocus: s,
 		type: "button",
-		children: [/* @__PURE__ */ f("div", {
-			className: De.progressFill,
-			style: { width: `${o}%` }
-		}), /* @__PURE__ */ p("div", {
-			className: De.content,
-			children: [/* @__PURE__ */ f(w, {
+		role: "menuitem",
+		tabIndex: i ?? -1,
+		"aria-keyshortcuts": "Space",
+		children: [/* @__PURE__ */ m("div", {
+			className: Ae.progressFill,
+			style: { width: `${l}%` },
+			role: "progressbar",
+			"aria-valuenow": Math.round(l),
+			"aria-valuemin": 0,
+			"aria-valuemax": 100,
+			"aria-label": `Hold to confirm ${e}`
+		}), /* @__PURE__ */ h("div", {
+			className: Ae.content,
+			children: [/* @__PURE__ */ m(E, {
 				variant: "text-body-medium",
 				as: "span",
-				className: De.label,
+				className: Ae.label,
 				children: e
-			}), r && /* @__PURE__ */ f(w, {
+			}), r && /* @__PURE__ */ m(E, {
 				variant: "text-body-small",
 				as: "span",
-				className: De.subtext,
+				className: Ae.subtext,
 				children: r
 			})]
 		})]
 	});
 });
-Oe.displayName = "DestructiveMenuItem";
+je.displayName = "DestructiveMenuItem";
 //#endregion
 //#region src/utils/css-tokens.ts
-function ke(e, t) {
+function Me(e, t) {
 	if (typeof document > "u") return t;
 	let n = getComputedStyle(document.documentElement).getPropertyValue(e).trim(), r = parseFloat(n);
 	return Number.isNaN(r) ? t : r;
 }
-function Ae(e, t) {
+function Ne(e, t) {
 	if (typeof document > "u") return t;
 	let n = getComputedStyle(document.documentElement).getPropertyValue(e).trim();
 	return n.endsWith("ms") ? parseFloat(n) || t : n.endsWith("s") && (parseFloat(n) || 0) * 1e3 || t;
 }
-var je = {
+var Pe = {
 	menuContainer: "_menuContainer_ljt4d_1",
 	menuFadeIn: "_menuFadeIn_ljt4d_1",
 	closing: "_closing_ljt4d_21",
@@ -1014,78 +1141,83 @@ var je = {
 	menuSection: "_menuSection_ljt4d_30",
 	sectionHeader: "_sectionHeader_ljt4d_37",
 	sectionLabel: "_sectionLabel_ljt4d_46"
-}, Me = 220, Ne = ({ isOpen: e, onClose: t, anchorRef: n, items: r, sections: a, side: s = "bottom", align: u = "start", sideOffset: d = 4, alignOffset: m = 0, sideOffsetToken: h, alignOffsetToken: g, width: v, minWidth: y, maxWidth: b, matchAnchorWidth: x = !1, matchAnchorWidthOffset: S = 0, usePortal: C = !0 }) => {
-	let [T, E] = l(!1), [D, O] = l(e), [k, A] = l(!1), [j, N] = l({
+}, Fe = 220, Ie = ({ isOpen: e, onClose: t, anchorRef: n, items: r, sections: i, side: s = "bottom", align: f = "start", sideOffset: p = 4, alignOffset: g = 0, sideOffsetToken: _, alignOffsetToken: v, width: b, minWidth: x, maxWidth: S, matchAnchorWidth: C = !1, matchAnchorWidthOffset: w = 0, usePortal: T = !0, role: D = "menu", id: O, ariaLabel: k, activeIndex: ee, getOptionId: A }) => {
+	let j = D === "listbox", [M, P] = d(!1), [F, I] = d(e), [L, R] = d(!1), [z, te] = d({
 		x: 0,
 		y: 0
-	}), [P, ee] = l({
+	}), [B, ne] = d({
 		width: 0,
 		height: 0
-	}), [F, I] = l({
+	}), [V, re] = d({
 		width: 0,
 		height: 0
-	}), L = c(!1), R = c(null), te = c([]), z = a || (r ? [{ items: r }] : []), B = z.some((e) => e.items.length > 0);
-	!T && z.length > 0 && B && (te.current = z);
-	let V = T ? te.current : z;
-	if (i(() => {
-		if (e) O(!0), E(!1), A(!1), L.current = !1;
-		else if (D) {
-			E(!0);
+	}), [H, ie] = d(0), U = u(!1), W = u(null), ae = u([]), oe = u([]), G = u(!1), K = i || (r ? [{ items: r }] : []), q = K.some((e) => e.items.length > 0);
+	!M && K.length > 0 && q && (ae.current = K);
+	let se = M ? ae.current : K, J = l(() => {
+		let e = [];
+		return se.forEach((t) => {
+			t.items.forEach((t) => e.push(t));
+		}), e;
+	}, [se]);
+	o(() => {
+		if (e) I(!0), P(!1), R(!1), U.current = !1;
+		else if (F) {
+			P(!0);
 			let e = setTimeout(() => {
-				O(!1), E(!1), L.current = !1;
-			}, Me);
+				I(!1), P(!1), U.current = !1;
+			}, Fe);
 			return () => clearTimeout(e);
 		}
-	}, [e, D]), o(() => {
-		if (!e || !D || !R.current) return;
+	}, [e, F]), c(() => {
+		if (!e || !F || !W.current) return;
 		let t = () => {
-			if (!R.current) return;
-			let e = R.current.getBoundingClientRect();
-			e.width > 0 && e.height > 0 && ee({
+			if (!W.current) return;
+			let e = W.current.getBoundingClientRect();
+			e.width > 0 && e.height > 0 && ne({
 				width: e.width,
 				height: e.height
 			});
 		};
 		if (t(), requestAnimationFrame(() => requestAnimationFrame(t)), typeof ResizeObserver < "u") {
 			let e = new ResizeObserver(t);
-			return e.observe(R.current), () => e.disconnect();
+			return e.observe(W.current), () => e.disconnect();
 		}
 	}, [
 		e,
-		D,
-		z.length
-	]), o(() => {
-		if (!e || !D || !n.current || !R.current) return;
+		F,
+		K.length
+	]), c(() => {
+		if (!e || !F || !n.current || !W.current) return;
 		let t = () => {
-			let e = n.current, t = R.current;
+			let e = n.current, t = W.current;
 			if (!e || !t) return;
-			let r = e.getBoundingClientRect(), i = t.getBoundingClientRect(), a = i.width || P.width || 200, o = i.height || P.height || 160;
-			I({
+			let r = e.getBoundingClientRect(), i = t.getBoundingClientRect(), a = i.width || B.width || 200, o = i.height || B.height || 160;
+			re({
 				width: r.width,
 				height: r.height
 			});
-			let c = h == null ? d : ke(h, 12), l = g == null ? m : ke(g, 4), f = 0, p = 0;
+			let c = _ == null ? p : Me(_, 12), l = v == null ? g : Me(v, 4), u = 0, d = 0;
 			switch (s) {
 				case "top":
-					p = r.top - o - c, f = u === "start" ? r.left + l : u === "end" ? r.right - a + l : r.left + r.width / 2 - a / 2 + l;
+					d = r.top - o - c, u = f === "start" ? r.left + l : f === "end" ? r.right - a + l : r.left + r.width / 2 - a / 2 + l;
 					break;
 				case "bottom":
-					p = r.bottom + c, f = u === "start" ? r.left + l : u === "end" ? r.right - a + l : r.left + r.width / 2 - a / 2 + l;
+					d = r.bottom + c, u = f === "start" ? r.left + l : f === "end" ? r.right - a + l : r.left + r.width / 2 - a / 2 + l;
 					break;
 				case "left":
-					f = r.left - a - c, p = u === "start" ? r.top + l : u === "end" ? r.bottom - o + l : r.top + r.height / 2 - o / 2 + l;
+					u = r.left - a - c, d = f === "start" ? r.top + l : f === "end" ? r.bottom - o + l : r.top + r.height / 2 - o / 2 + l;
 					break;
 				case "right":
-					f = r.right + c, p = u === "start" ? r.top + l : u === "end" ? r.bottom - o + l : r.top + r.height / 2 - o / 2 + l;
+					u = r.right + c, d = f === "start" ? r.top + l : f === "end" ? r.bottom - o + l : r.top + r.height / 2 - o / 2 + l;
 					break;
 			}
-			N({
-				x: Math.min(Math.max(f, 4), window.innerWidth - a - 4),
-				y: Math.min(Math.max(p, 4), window.innerHeight - o - 4)
-			}), L.current = !0, A(!0);
+			te({
+				x: Math.min(Math.max(u, 4), window.innerWidth - a - 4),
+				y: Math.min(Math.max(d, 4), window.innerHeight - o - 4)
+			}), U.current = !0, R(!0);
 		};
-		L.current || (t(), requestAnimationFrame(() => {
-			L.current || t();
+		U.current || (t(), requestAnimationFrame(() => {
+			U.current || t();
 		}));
 		let r = () => t();
 		return window.addEventListener("scroll", r, !0), window.addEventListener("resize", r), () => {
@@ -1093,519 +1225,710 @@ var je = {
 		};
 	}, [
 		e,
-		D,
+		F,
 		n,
 		s,
-		u,
-		d,
-		m,
-		h,
+		f,
+		p,
 		g,
-		P.width,
-		P.height,
-		z.length,
-		S
-	]), i(() => {
-		if (!e || !D) return;
+		_,
+		v,
+		B.width,
+		B.height,
+		K.length,
+		w
+	]);
+	let ce = a(() => {
+		let e = document.activeElement;
+		e && W.current?.contains(e) && n.current && n.current.focus(), t();
+	}, [t, n]);
+	o(() => {
+		if (!e || !F) return;
 		let r = (e) => {
 			let r = e.target;
-			R.current?.contains(r) || n.current?.contains(r) || t();
+			W.current?.contains(r) || n.current?.contains(r) || t();
 		};
 		return document.addEventListener("mousedown", r, !0), () => document.removeEventListener("mousedown", r, !0);
 	}, [
 		e,
-		D,
+		F,
 		t,
 		n
-	]), i(() => {
+	]), o(() => {
 		if (!e) return;
 		let n = (e) => {
-			e.key === "Escape" && t();
+			e.key === "Escape" && (j ? t() : (e.preventDefault(), ce()));
 		};
 		return document.addEventListener("keydown", n), () => document.removeEventListener("keydown", n);
-	}, [e, t]), !D || V.length === 0) return null;
-	let ne = (e, n) => e.isDestructive ? /* @__PURE__ */ f(Oe, {
-		label: e.label,
-		subtext: e.subtext,
-		holdDuration: e.holdDuration ?? 4e3,
-		onClick: () => {
-			e.onClick(), e.keepOpenOnClick || t();
+	}, [
+		e,
+		j,
+		t,
+		ce
+	]), o(() => {
+		if (!e) {
+			G.current = !1;
+			return;
 		}
-	}, n) : /* @__PURE__ */ f(Ee, {
-		icon: e.icon,
-		label: e.label,
-		subtext: e.subtext,
-		onClick: () => {
-			e.isInactive || (e.onClick(), e.keepOpenOnClick || t());
-		},
-		isSelected: e.isSelected,
-		isInactive: e.isInactive,
-		intent: e.intent,
-		showToggle: e.showToggle,
-		toggleValue: e.toggleValue,
-		selectionStyle: e.selectionStyle
-	}, n), re = {
+		if (j || !L || G.current) return;
+		let t = J.findIndex((e) => !e.isInactive), n = t >= 0 ? t : 0;
+		ie(n), oe.current[n]?.focus(), G.current = !0;
+	}, [
+		e,
+		j,
+		L,
+		J
+	]);
+	let le = a((e) => {
+		ie(e), oe.current[e]?.focus();
+	}, []), ue = a((e) => {
+		if (j || !J.length) return;
+		let t = [];
+		if (J.forEach((e, n) => {
+			e.isInactive || t.push(n);
+		}), !t.length) return;
+		let n = t.indexOf(H), r = n < 0 ? 0 : n;
+		switch (e.key) {
+			case "ArrowDown":
+				e.preventDefault(), e.stopPropagation(), le(t[(r + 1) % t.length]);
+				break;
+			case "ArrowUp":
+				e.preventDefault(), e.stopPropagation(), le(t[(r - 1 + t.length) % t.length]);
+				break;
+			case "Home":
+				e.preventDefault(), e.stopPropagation(), le(t[0]);
+				break;
+			case "End":
+				e.preventDefault(), e.stopPropagation(), le(t[t.length - 1]);
+				break;
+			case "Tab":
+				e.preventDefault(), ce();
+				break;
+		}
+	}, [
+		j,
+		J,
+		H,
+		le,
+		ce
+	]);
+	if (!F || se.length === 0) return null;
+	let de = (e) => (t) => {
+		oe.current[e] = t;
+	}, fe = (e) => () => {
+		ie(e);
+	}, pe = (e) => {
+		e.isInactive || (e.onClick(), !e.keepOpenOnClick && (j ? t() : ce()));
+	}, me = (e, n, r) => {
+		if (e.isDestructive) {
+			let i = j ? -1 : H === r ? 0 : -1;
+			return /* @__PURE__ */ m(je, {
+				ref: de(r),
+				label: e.label,
+				subtext: e.subtext,
+				holdDuration: e.holdDuration ?? 4e3,
+				onClick: () => {
+					e.onClick(), e.keepOpenOnClick || (j ? t() : ce());
+				},
+				tabIndex: i,
+				onFocus: fe(r)
+			}, n);
+		}
+		let i = j && A ? A(r) : void 0, a = j ? -1 : H === r ? 0 : -1;
+		return /* @__PURE__ */ m(ke, {
+			ref: de(r),
+			icon: e.icon,
+			label: e.label,
+			subtext: e.subtext,
+			onClick: () => pe(e),
+			isSelected: e.isSelected,
+			isInactive: e.isInactive,
+			intent: e.intent,
+			showToggle: e.showToggle,
+			toggleValue: e.toggleValue,
+			selectionStyle: e.selectionStyle,
+			role: j ? "option" : void 0,
+			id: i,
+			ariaSelected: j ? !!e.isSelected : void 0,
+			isActive: j && ee === r,
+			tabIndex: a,
+			onFocus: fe(r)
+		}, n);
+	}, he = {
 		position: "absolute",
 		left: 0,
 		top: 0,
-		transform: `translate(${Math.round(j.x)}px, ${Math.round(j.y)}px)`,
+		transform: `translate(${Math.round(z.x)}px, ${Math.round(z.y)}px)`,
 		willChange: "transform",
 		zIndex: 9998,
-		visibility: k ? "visible" : "hidden",
-		...x && F.width > 0 ? { width: `${F.width + S}px` } : v ? { width: v } : {},
-		...y ? { minWidth: y } : {},
-		...b ? { maxWidth: b } : {}
-	}, H = /* @__PURE__ */ f("div", {
-		ref: R,
-		className: `${je.menuContainer} ${T ? je.closing : ""}`,
-		style: re,
-		role: "menu",
-		"aria-label": "Menu",
-		children: V.map((e, t) => /* @__PURE__ */ p(M, {
+		visibility: L ? "visible" : "hidden",
+		...C && V.width > 0 ? { width: `${V.width + w}px` } : b ? { width: b } : {},
+		...x ? { minWidth: x } : {},
+		...S ? { maxWidth: S } : {}
+	}, ge = 0, _e = k ?? (j ? void 0 : "Menu"), ve = /* @__PURE__ */ m("div", {
+		ref: W,
+		id: O,
+		className: `${Pe.menuContainer} ${M ? Pe.closing : ""}`,
+		style: he,
+		role: D,
+		"aria-label": _e,
+		"aria-orientation": "vertical",
+		onKeyDown: ue,
+		children: se.map((e, t) => /* @__PURE__ */ h(N, {
 			as: "div",
-			className: je.menuSection,
-			edge: t < V.length - 1 ? "bottom" : void 0,
+			className: Pe.menuSection,
+			edge: t < se.length - 1 ? "bottom" : void 0,
 			elevation: "none",
-			children: [e.header && /* @__PURE__ */ f("div", {
-				className: je.sectionHeader,
-				children: /* @__PURE__ */ f(w, {
+			role: e.header ? "group" : void 0,
+			"aria-label": e.header,
+			children: [e.header && /* @__PURE__ */ m("div", {
+				className: Pe.sectionHeader,
+				"aria-hidden": "true",
+				children: /* @__PURE__ */ m(E, {
 					variant: "text-body-small-emphasis",
 					as: "span",
-					className: je.sectionLabel,
+					className: Pe.sectionLabel,
 					children: e.header
 				})
-			}), e.items.map((e, t) => ne(e, t))]
+			}), e.items.map((e, t) => me(e, t, ge++))]
 		}, t))
 	});
-	return C ? _(H, document.body) : H;
+	return T ? y(ve, document.body) : ve;
 };
-Ne.displayName = "Menu";
-var Pe = {
+Ie.displayName = "Menu";
+var Le = {
 	tooltip: "_tooltip_3kdaq_1",
 	tooltipFadeIn: "_tooltipFadeIn_3kdaq_1",
 	tooltipInner: "_tooltipInner_3kdaq_14",
 	keyHint: "_keyHint_3kdaq_21",
 	closing: "_closing_3kdaq_33",
 	tooltipFadeOut: "_tooltipFadeOut_3kdaq_1"
-}, Fe = 1e3, Ie = 300, Le = 200, Re = 0, ze = ({ label: t, children: n, delay: a, side: s = "top", align: u = "center", sideOffset: m = 4, alignOffset: h = 0, shortcutKey: g, shortcutKeyPosition: v = "end", usePortal: y = !0 }) => {
-	let b = Ae("--effect-animation-delay-medium-3", Fe), x = a ?? b, S = c(null), C = c(null), T = r((t) => {
-		S.current = t;
+}, Re = 1e3, ze = 300, Be = 200, Ve = 0, He = ({ label: t, children: n, delay: r, side: i = "top", align: l = "center", sideOffset: f = 4, alignOffset: g = 0, shortcutKey: _, shortcutKeyPosition: v = "end", usePortal: b = !0 }) => {
+	let x = Ne("--effect-animation-delay-medium-3", Re), S = r ?? x, C = u(null), w = u(null), T = s(), D = a((t) => {
+		C.current = t;
 		let r = e.Children.only(n), i = "ref" in r ? r.ref : void 0;
 		typeof i == "function" ? i(t) : i && typeof i == "object" && (i.current = t);
-	}, [n]), [E, D] = l(!1), [O, k] = l(!1), [A, j] = l(!1), [M, N] = l({
+	}, [n]), [O, k] = d(!1), [ee, A] = d(!1), [j, M] = d(!1), [N, P] = d({
 		x: 0,
 		y: 0
-	}), [P, ee] = l({
+	}), [F, I] = d({
 		width: 0,
 		height: 0
-	}), F = c(null), I = c(null), L = () => {
-		F.current &&= (clearTimeout(F.current), null);
-	}, R = () => {
-		if (L(), Date.now() - Re < Ie) {
-			D(!0), j(!0), k(!1);
+	}), L = u(null), R = u(null), z = () => {
+		L.current &&= (clearTimeout(L.current), null);
+	}, te = () => {
+		if (z(), Date.now() - Ve < ze) {
+			k(!0), M(!0), A(!1);
 			return;
 		}
-		F.current = setTimeout(() => {
-			F.current = null, D(!0), j(!0), k(!1);
-		}, x);
-	}, te = () => {
-		L(), I.current &&= (clearTimeout(I.current), null), !(!E && !A) && (Re = Date.now(), k(!0), I.current = setTimeout(() => {
-			I.current = null, j(!1), D(!1), k(!1);
-		}, Le));
+		L.current = setTimeout(() => {
+			L.current = null, k(!0), M(!0), A(!1);
+		}, S);
+	}, B = () => {
+		z(), R.current &&= (clearTimeout(R.current), null), !(!O && !j) && (Ve = Date.now(), A(!0), R.current = setTimeout(() => {
+			R.current = null, M(!1), k(!1), A(!1);
+		}, Be));
 	};
-	i(() => () => {
-		L(), I.current && clearTimeout(I.current);
+	o(() => () => {
+		z(), R.current && clearTimeout(R.current);
 	}, []), o(() => {
-		if (!A || !C.current) return;
+		if (!j) return;
+		let e = (e) => {
+			e.key === "Escape" && B();
+		};
+		return document.addEventListener("keydown", e), () => document.removeEventListener("keydown", e);
+	}, [j]), c(() => {
+		if (!j || !w.current) return;
 		let e = () => {
-			if (!C.current) return;
-			let e = C.current.getBoundingClientRect(), t = e.width || C.current.offsetWidth, n = e.height || C.current.offsetHeight;
-			t > 0 && n > 0 && ee({
+			if (!w.current) return;
+			let e = w.current.getBoundingClientRect(), t = e.width || w.current.offsetWidth, n = e.height || w.current.offsetHeight;
+			t > 0 && n > 0 && I({
 				width: t,
 				height: n
 			});
 		};
 		if (e(), requestAnimationFrame(e), typeof ResizeObserver < "u") {
 			let t = new ResizeObserver(e);
-			return t.observe(C.current), () => t.disconnect();
+			return t.observe(w.current), () => t.disconnect();
 		}
 	}, [
-		A,
+		j,
 		t,
-		g,
+		_,
 		v
-	]), o(() => {
-		if (!A || !S.current || !C.current) return;
+	]), c(() => {
+		if (!j || !C.current || !w.current) return;
 		let e = () => {
-			if (!S.current || !C.current) return;
-			let e = S.current.getBoundingClientRect(), t = C.current.getBoundingClientRect().width || P.width || 80, n = C.current.getBoundingClientRect().height || P.height || 24, r = 0, i = 0;
-			switch (s) {
+			if (!C.current || !w.current) return;
+			let e = C.current.getBoundingClientRect(), t = w.current.getBoundingClientRect().width || F.width || 80, n = w.current.getBoundingClientRect().height || F.height || 24, r = 0, a = 0;
+			switch (i) {
 				case "top":
-					i = e.top - n - m, r = u === "start" ? e.left + h : u === "end" ? e.right - t + h : e.left + e.width / 2 - t / 2 + h;
+					a = e.top - n - f, r = l === "start" ? e.left + g : l === "end" ? e.right - t + g : e.left + e.width / 2 - t / 2 + g;
 					break;
 				case "bottom":
-					i = e.bottom + m, r = u === "start" ? e.left + h : u === "end" ? e.right - t + h : e.left + e.width / 2 - t / 2 + h;
+					a = e.bottom + f, r = l === "start" ? e.left + g : l === "end" ? e.right - t + g : e.left + e.width / 2 - t / 2 + g;
 					break;
 				case "left":
-					r = e.left - t - m, i = u === "start" ? e.top + h : u === "end" ? e.bottom - n + h : e.top + e.height / 2 - n / 2 + h;
+					r = e.left - t - f, a = l === "start" ? e.top + g : l === "end" ? e.bottom - n + g : e.top + e.height / 2 - n / 2 + g;
 					break;
 				case "right":
-					r = e.right + m, i = u === "start" ? e.top + h : u === "end" ? e.bottom - n + h : e.top + e.height / 2 - n / 2 + h;
+					r = e.right + f, a = l === "start" ? e.top + g : l === "end" ? e.bottom - n + g : e.top + e.height / 2 - n / 2 + g;
 					break;
 			}
-			N({
+			P({
 				x: Math.min(Math.max(r, 4), window.innerWidth - t - 4),
-				y: Math.min(Math.max(i, 4), window.innerHeight - n - 4)
+				y: Math.min(Math.max(a, 4), window.innerHeight - n - 4)
 			});
 		};
 		e(), requestAnimationFrame(() => requestAnimationFrame(e));
 	}, [
-		A,
-		s,
-		u,
-		m,
-		h,
-		P.width,
-		P.height,
+		j,
+		i,
+		l,
+		f,
+		g,
+		F.width,
+		F.height,
 		t
-	]), i(() => {
-		if (!A) return;
+	]), o(() => {
+		if (!j) return;
 		let e = () => {
-			if (!S.current || !C.current) return;
-			let e = S.current.getBoundingClientRect(), t = P.width || 80, n = P.height || 24, r = 0, i = 0;
-			switch (s) {
+			if (!C.current || !w.current) return;
+			let e = C.current.getBoundingClientRect(), t = F.width || 80, n = F.height || 24, r = 0, a = 0;
+			switch (i) {
 				case "top":
-					i = e.top - n - m, r = u === "start" ? e.left + h : u === "end" ? e.right - t + h : e.left + e.width / 2 - t / 2 + h;
+					a = e.top - n - f, r = l === "start" ? e.left + g : l === "end" ? e.right - t + g : e.left + e.width / 2 - t / 2 + g;
 					break;
 				case "bottom":
-					i = e.bottom + m, r = u === "start" ? e.left + h : u === "end" ? e.right - t + h : e.left + e.width / 2 - t / 2 + h;
+					a = e.bottom + f, r = l === "start" ? e.left + g : l === "end" ? e.right - t + g : e.left + e.width / 2 - t / 2 + g;
 					break;
 				case "left":
-					r = e.left - t - m, i = u === "start" ? e.top + h : u === "end" ? e.bottom - n + h : e.top + e.height / 2 - n / 2 + h;
+					r = e.left - t - f, a = l === "start" ? e.top + g : l === "end" ? e.bottom - n + g : e.top + e.height / 2 - n / 2 + g;
 					break;
 				case "right":
-					r = e.right + m, i = u === "start" ? e.top + h : u === "end" ? e.bottom - n + h : e.top + e.height / 2 - n / 2 + h;
+					r = e.right + f, a = l === "start" ? e.top + g : l === "end" ? e.bottom - n + g : e.top + e.height / 2 - n / 2 + g;
 					break;
 			}
-			N({
+			P({
 				x: Math.min(Math.max(r, 4), window.innerWidth - t - 4),
-				y: Math.min(Math.max(i, 4), window.innerHeight - n - 4)
+				y: Math.min(Math.max(a, 4), window.innerHeight - n - 4)
 			});
 		};
 		return window.addEventListener("scroll", e, !0), window.addEventListener("resize", e), () => {
 			window.removeEventListener("scroll", e, !0), window.removeEventListener("resize", e);
 		};
 	}, [
-		A,
-		s,
-		u,
-		m,
-		h,
-		P.width,
-		P.height
+		j,
+		i,
+		l,
+		f,
+		g,
+		F.width,
+		F.height
 	]);
-	let z = g ? /* @__PURE__ */ f("div", {
-		className: Pe.keyHint,
+	let ne = _ ? /* @__PURE__ */ m("div", {
+		className: Le.keyHint,
 		"aria-hidden": !0,
-		children: /* @__PURE__ */ f(w, {
+		children: /* @__PURE__ */ m(E, {
 			variant: "text-caption-emphasis",
 			as: "span",
 			color: "primary",
-			children: g
+			children: _
 		})
-	}) : null, B = A ? /* @__PURE__ */ f("div", {
-		ref: C,
-		className: `${Pe.tooltip} ${O ? Pe.closing : ""}`,
+	}) : null, V = j ? /* @__PURE__ */ m("div", {
+		ref: w,
+		id: T,
+		className: `${Le.tooltip} ${ee ? Le.closing : ""}`,
 		style: {
 			position: "fixed",
 			left: 0,
 			top: 0,
-			transform: `translate(${Math.round(M.x)}px, ${Math.round(M.y)}px)`,
+			transform: `translate(${Math.round(N.x)}px, ${Math.round(N.y)}px)`,
 			willChange: "transform",
 			zIndex: 1e4
 		},
 		role: "tooltip",
-		children: /* @__PURE__ */ p("div", {
-			className: Pe.tooltipInner,
+		onMouseEnter: te,
+		onMouseLeave: B,
+		children: /* @__PURE__ */ h("div", {
+			className: Le.tooltipInner,
 			children: [
-				g && v === "start" && z,
-				/* @__PURE__ */ f(w, {
+				_ && v === "start" && ne,
+				/* @__PURE__ */ m(E, {
 					variant: "text-body-small",
 					as: "span",
 					color: "primary",
 					children: t
 				}),
-				g && v === "end" && z
+				_ && v === "end" && ne
 			]
 		})
-	}) : null, V = e.Children.only(n);
-	return /* @__PURE__ */ p(d, { children: [e.isValidElement(V) ? e.cloneElement(V, {
-		ref: T,
+	}) : null, re = e.Children.only(n), H = e.isValidElement(re) ? re : null, ie = [H?.props["aria-describedby"], j ? T : void 0].filter(Boolean).join(" ") || void 0;
+	return /* @__PURE__ */ h(p, { children: [H ? e.cloneElement(H, {
+		ref: D,
+		"aria-describedby": ie,
 		onMouseEnter: (e) => {
-			R(), V.props.onMouseEnter?.(e);
+			te(), H.props.onMouseEnter?.(e);
 		},
 		onMouseLeave: (e) => {
-			te(), V.props.onMouseLeave?.(e);
+			B(), H.props.onMouseLeave?.(e);
+		},
+		onFocus: (e) => {
+			te(), H.props.onFocus?.(e);
+		},
+		onBlur: (e) => {
+			B(), H.props.onBlur?.(e);
 		}
-	}) : n, y ? _(B, document.body) : B] });
+	}) : n, b ? y(V, document.body) : V] });
 };
-ze.displayName = "Tooltip";
-var Be = {
+He.displayName = "Tooltip";
+var Ue = {
 	selectWrapper: "_selectWrapper_17kkf_1",
 	selectButton: "_selectButton_17kkf_6",
 	chevron: "_chevron_17kkf_26"
-}, Ve = n(({ value: e, onChange: t, options: n, placeholder: r = "Select option", className: i, inactive: a = !1, id: o, chevronIcon: s }, u) => {
-	let [d, m] = l(!1), h = c(null), g = n.find((t) => t.value === e), _ = g?.label || r, v = n.map((n) => ({
-		label: n.label,
-		onClick: () => {
-			t(n.value), m(!1);
-		},
-		isSelected: n.value === e
-	}));
-	return /* @__PURE__ */ p("div", {
-		ref: u,
-		className: `${Be.selectWrapper} ${i || ""}`,
-		children: [/* @__PURE__ */ p(M, {
-			id: o,
-			ref: h,
+}, We = r(({ value: e, onChange: t, options: n, placeholder: r = "Select option", className: i, inactive: c = !1, id: l, chevronIcon: f, "aria-label": p, "aria-labelledby": g }, _) => {
+	let [v, y] = d(!1), [b, x] = d(-1), S = u(null), C = s(), w = l ?? `select-${C}`, T = `${w}-listbox`, D = a((e) => `${w}-option-${e}`, [w]), O = n.findIndex((t) => t.value === e), k = O >= 0 ? n[O] : void 0, ee = k?.label || r, A = a((e) => {
+		let r = n[e];
+		r && (t(r.value), y(!1));
+	}, [n, t]), j = a((e) => {
+		c || n.length === 0 || (x(Math.max(0, Math.min(n.length - 1, e))), y(!0));
+	}, [c, n.length]);
+	o(() => {
+		x(v ? (e) => e >= 0 && e < n.length ? e : O >= 0 ? O : 0 : -1);
+	}, [
+		v,
+		n.length,
+		O
+	]);
+	let M = n.map((t, n) => ({
+		label: t.label,
+		onClick: () => A(n),
+		isSelected: t.value === e
+	})), P = () => {
+		c || (v ? y(!1) : j(O >= 0 ? O : 0));
+	}, F = (e) => {
+		if (c || n.length === 0) return;
+		let t = n.length - 1;
+		if (!v) switch (e.key) {
+			case "ArrowDown":
+			case "ArrowUp":
+			case "Enter":
+			case " ":
+				e.preventDefault(), j(O >= 0 ? O : 0);
+				return;
+			case "Home":
+				e.preventDefault(), j(0);
+				return;
+			case "End":
+				e.preventDefault(), j(t);
+				return;
+			default: return;
+		}
+		switch (e.key) {
+			case "ArrowDown":
+				e.preventDefault(), x((e) => Math.min(t, (e < 0 ? -1 : e) + 1));
+				break;
+			case "ArrowUp":
+				e.preventDefault(), x((e) => Math.max(0, (e < 0 ? n.length : e) - 1));
+				break;
+			case "Home":
+				e.preventDefault(), x(0);
+				break;
+			case "End":
+				e.preventDefault(), x(t);
+				break;
+			case "Enter":
+			case " ":
+				e.preventDefault(), b >= 0 && A(b);
+				break;
+			case "Escape":
+				e.preventDefault(), y(!1);
+				break;
+			case "Tab":
+				y(!1);
+				break;
+		}
+	}, I = v && b >= 0 ? D(b) : void 0;
+	return /* @__PURE__ */ h("div", {
+		ref: _,
+		className: `${Ue.selectWrapper} ${i || ""}`,
+		children: [/* @__PURE__ */ h(N, {
+			id: w,
+			ref: S,
 			as: "button",
 			type: "button",
 			elevation: "elevated",
 			radius: "sm",
 			interactive: !0,
-			selected: d,
-			className: Be.selectButton,
-			onClick: () => {
-				a || m((e) => !e);
-			},
-			inactive: a,
-			children: [/* @__PURE__ */ f(w, {
+			selected: v,
+			className: Ue.selectButton,
+			onClick: P,
+			onKeyDown: F,
+			inactive: c,
+			role: "combobox",
+			"aria-haspopup": "listbox",
+			"aria-expanded": v,
+			"aria-controls": v ? T : void 0,
+			"aria-activedescendant": I,
+			"aria-label": p,
+			"aria-labelledby": g,
+			children: [/* @__PURE__ */ m(E, {
 				variant: "text-body-medium",
 				as: "span",
-				color: g ? "primary" : "secondary",
-				children: _
-			}), s && /* @__PURE__ */ f("span", {
-				className: Be.chevron,
-				children: /* @__PURE__ */ f(s, { size: 16 })
+				color: k ? "primary" : "secondary",
+				children: ee
+			}), f && /* @__PURE__ */ m("span", {
+				className: Ue.chevron,
+				children: /* @__PURE__ */ m(f, { size: 16 })
 			})]
-		}), /* @__PURE__ */ f(Ne, {
-			isOpen: d,
-			onClose: () => m(!1),
-			anchorRef: h,
-			items: v,
+		}), /* @__PURE__ */ m(Ie, {
+			isOpen: v,
+			onClose: () => y(!1),
+			anchorRef: S,
+			items: M,
 			side: "bottom",
 			align: "start",
 			sideOffset: 4,
 			alignOffset: -4,
 			matchAnchorWidth: !0,
-			matchAnchorWidthOffset: 8
+			matchAnchorWidthOffset: 8,
+			role: "listbox",
+			id: T,
+			activeIndex: b,
+			getOptionId: D
 		})]
 	});
 });
-Ve.displayName = "Select";
-var Y = {
-	bannerWrapper: "_bannerWrapper_xz2oj_1",
-	banner: "_banner_xz2oj_1",
-	bannerHeaderSurface: "_bannerHeaderSurface_xz2oj_10",
-	bannerHeader: "_bannerHeader_xz2oj_10",
-	bannerBody: "_bannerBody_xz2oj_30",
-	message: "_message_xz2oj_35",
-	floatingPosition: "_floatingPosition_xz2oj_41",
-	floatingToast: "_floatingToast_xz2oj_49",
-	toastFadeIn: "_toastFadeIn_xz2oj_1",
-	closing: "_closing_xz2oj_55",
-	toastFadeOut: "_toastFadeOut_xz2oj_1"
-}, He = 4e3, Ue = 200, We = (e, t) => t === "bold" ? "var(--color-foreground-on-bold-background-primary)" : `var(--color-foreground-${t === "faint" ? "bold" : t === "medium" ? "strong" : "medium"}-${e})`, Ge = ({ intent: e, contrast: t, message: n, header: a = !1, className: o = "", floating: s = !1, onDismiss: u }) => {
-	let d = Ae("--effect-animation-delay-long-2", He), m = We(e, t), [h, g] = l(!1), v = c(null), y = c(null), b = r(() => {
-		v.current && clearTimeout(v.current), y.current && clearTimeout(y.current), v.current = setTimeout(() => {
-			v.current = null, g(!0), y.current = setTimeout(() => {
-				y.current = null, u?.();
-			}, Ue);
-		}, d);
-	}, [u, d]);
-	i(() => (s && n && b(), () => {
-		v.current && clearTimeout(v.current), y.current && clearTimeout(y.current);
+We.displayName = "Select";
+var Z = {
+	bannerWrapper: "_bannerWrapper_1vv8f_1",
+	banner: "_banner_1vv8f_1",
+	bannerHeaderSurface: "_bannerHeaderSurface_1vv8f_10",
+	bannerHeader: "_bannerHeader_1vv8f_10",
+	bannerBody: "_bannerBody_1vv8f_30",
+	message: "_message_1vv8f_38",
+	dismiss: "_dismiss_1vv8f_46",
+	floatingPosition: "_floatingPosition_1vv8f_79",
+	floatingToast: "_floatingToast_1vv8f_87",
+	toastFadeIn: "_toastFadeIn_1vv8f_1",
+	closing: "_closing_1vv8f_93",
+	toastFadeOut: "_toastFadeOut_1vv8f_1"
+}, Ge = 4e3, Ke = 200, qe = (e, t) => t === "bold" ? "var(--color-foreground-on-bold-background-primary)" : `var(--color-foreground-${t === "faint" ? "bold" : t === "medium" ? "strong" : "medium"}-${e})`, Je = ({ intent: e, contrast: t, message: n, header: r = !1, className: i = "", floating: s = !1, onDismiss: c, dismissLabel: l = "Dismiss" }) => {
+	let f = Ne("--effect-animation-delay-long-2", Ge), p = qe(e, t), [g, v] = d(!1), b = u(null), x = u(null), S = a(() => {
+		b.current && clearTimeout(b.current), x.current && clearTimeout(x.current), b.current = null, s ? (v(!0), x.current = setTimeout(() => {
+			x.current = null, c?.();
+		}, Ke)) : c?.();
+	}, [s, c]), C = a(() => {
+		b.current && clearTimeout(b.current), b.current = setTimeout(() => {
+			b.current = null, S();
+		}, f);
+	}, [S, f]);
+	o(() => (s && n && C(), () => {
+		b.current && clearTimeout(b.current), x.current && clearTimeout(x.current);
 	}), [
 		s,
 		n,
-		b
+		C
 	]);
-	let x = /* @__PURE__ */ f("div", {
-		className: `${Y.bannerWrapper} ${o}`.trim(),
-		style: { "--banner-content": m },
-		children: /* @__PURE__ */ p(M, {
+	let w = e === "negative", T = w ? "alert" : "status", D = w ? void 0 : "polite", O = /* @__PURE__ */ m("div", {
+		className: `${Z.bannerWrapper} ${i}`.trim(),
+		style: { "--banner-content": p },
+		role: T,
+		"aria-live": D,
+		children: /* @__PURE__ */ h(N, {
 			elevation: s ? "floating" : "elevated",
 			intent: e,
 			contrast: t,
 			radius: "sm",
-			className: Y.banner,
-			children: [a && /* @__PURE__ */ f("div", {
-				className: Y.bannerHeaderSurface,
-				children: /* @__PURE__ */ f("div", {
-					className: Y.bannerHeader,
+			className: Z.banner,
+			children: [r && /* @__PURE__ */ m("div", {
+				className: Z.bannerHeaderSurface,
+				children: /* @__PURE__ */ m("div", {
+					className: Z.bannerHeader,
 					"aria-hidden": !0
 				})
-			}), /* @__PURE__ */ f("div", {
-				className: Y.bannerBody,
-				children: /* @__PURE__ */ f(w, {
+			}), /* @__PURE__ */ h("div", {
+				className: Z.bannerBody,
+				children: [/* @__PURE__ */ m(E, {
 					variant: "text-body-medium",
 					as: "span",
-					className: Y.message,
+					className: Z.message,
 					children: n
-				})
+				}), c && /* @__PURE__ */ m("button", {
+					type: "button",
+					className: Z.dismiss,
+					onClick: S,
+					"aria-label": l,
+					children: /* @__PURE__ */ m(_, { size: 16 })
+				})]
 			})]
 		})
 	});
-	return s ? _(/* @__PURE__ */ f("div", {
-		className: Y.floatingPosition,
+	return s ? y(/* @__PURE__ */ m("div", {
+		className: Z.floatingPosition,
 		style: { zIndex: 9998 },
-		children: /* @__PURE__ */ f("div", {
-			className: `${Y.floatingToast} ${h ? Y.closing : ""}`,
-			children: x
+		children: /* @__PURE__ */ m("div", {
+			className: `${Z.floatingToast} ${g ? Z.closing : ""}`,
+			children: O
 		})
-	}), document.body) : x;
+	}), document.body) : O;
 };
-Ge.displayName = "Banner";
-var X = {
-	tableWrapper: "_tableWrapper_1xqt4_1",
-	tableScroll: "_tableScroll_1xqt4_9",
-	table: "_table_1xqt4_1",
-	headerRow: "_headerRow_1xqt4_20",
-	headerCell: "_headerCell_1xqt4_24",
-	sortable: "_sortable_1xqt4_38",
-	sortIndicator: "_sortIndicator_1xqt4_46",
-	row: "_row_1xqt4_51",
-	cell: "_cell_1xqt4_55",
-	rowSelected: "_rowSelected_1xqt4_59",
-	rowClickable: "_rowClickable_1xqt4_63",
-	alignRight: "_alignRight_1xqt4_77",
-	alignCenter: "_alignCenter_1xqt4_78",
-	emptyRow: "_emptyRow_1xqt4_80",
-	skeleton: "_skeleton_1xqt4_88",
-	shimmer: "_shimmer_1xqt4_1",
-	pagination: "_pagination_1xqt4_102",
-	pageButton: "_pageButton_1xqt4_112"
+Je.displayName = "Banner";
+var Q = {
+	tableWrapper: "_tableWrapper_b4sqy_1",
+	tableScroll: "_tableScroll_b4sqy_9",
+	table: "_table_b4sqy_1",
+	headerRow: "_headerRow_b4sqy_20",
+	headerCell: "_headerCell_b4sqy_24",
+	sortable: "_sortable_b4sqy_38",
+	sortIndicator: "_sortIndicator_b4sqy_51",
+	row: "_row_b4sqy_56",
+	cell: "_cell_b4sqy_60",
+	rowSelected: "_rowSelected_b4sqy_64",
+	rowClickable: "_rowClickable_b4sqy_68",
+	alignRight: "_alignRight_b4sqy_87",
+	alignCenter: "_alignCenter_b4sqy_88",
+	emptyRow: "_emptyRow_b4sqy_90",
+	skeleton: "_skeleton_b4sqy_98",
+	shimmer: "_shimmer_b4sqy_1",
+	pagination: "_pagination_b4sqy_112",
+	pageButton: "_pageButton_b4sqy_122"
 };
 //#endregion
 //#region src/components/Table/Table.tsx
-function Ke(e, t) {
+function Ye(e, t) {
 	if (e.accessorKey) return t[e.accessorKey];
 	if (e.accessor) return e.accessor(t);
 }
-function qe(e, t, n) {
+function Xe(e, t, n) {
 	let r = n === "asc" ? 1 : -1;
 	return e == null && t == null ? 0 : e == null ? r : t == null ? -r : typeof e == "number" && typeof t == "number" ? (e - t) * r : String(e).localeCompare(String(t)) * r;
 }
-function Je({ columns: e, data: t, sortState: n, onSort: r, className: i, onRowClick: a, selectedRows: o, loading: c = !1, pagination: l, onPaginationChange: u, emptyMessage: d = "No results found." }) {
-	let m = s(() => e.filter((e) => !e.hide), [e]), h = s(() => m.map((e) => e.width ? typeof e.width == "number" ? `${e.width}px` : e.width : "minmax(120px, 1fr)").join(" "), [m]), g = s(() => {
+function Ze({ columns: e, data: t, sortState: n, onSort: r, className: i, onRowClick: a, selectedRows: o, loading: s = !1, pagination: c, onPaginationChange: u, emptyMessage: d = "No results found." }) {
+	let f = l(() => e.filter((e) => !e.hide), [e]), p = l(() => f.map((e) => e.width ? typeof e.width == "number" ? `${e.width}px` : e.width : "minmax(120px, 1fr)").join(" "), [f]), g = l(() => {
 		if (!n) return t;
 		let r = e.find((e) => e.id === n.columnId);
-		return r ? [...t].sort((e, t) => qe(Ke(r, e), Ke(r, t), n.direction)) : t;
+		return r ? [...t].sort((e, t) => Xe(Ye(r, e), Ye(r, t), n.direction)) : t;
 	}, [
 		t,
 		e,
 		n
-	]), _ = s(() => {
-		if (!l) return g;
-		let e = l.pageIndex * l.pageSize;
-		return g.slice(e, e + l.pageSize);
-	}, [g, l]), v = l ? Math.ceil(g.length / l.pageSize) : 1, y = !c && _.length === 0, b = (e) => {
+	]), _ = l(() => {
+		if (!c) return g;
+		let e = c.pageIndex * c.pageSize;
+		return g.slice(e, e + c.pageSize);
+	}, [g, c]), v = c ? Math.ceil(g.length / c.pageSize) : 1, y = !s && _.length === 0, b = (e) => {
 		r && r(e);
 	};
-	return /* @__PURE__ */ p("div", {
-		className: P(X.tableWrapper, i),
-		children: [/* @__PURE__ */ f("div", {
-			className: X.tableScroll,
-			children: /* @__PURE__ */ p("div", {
-				className: X.table,
-				style: { gridTemplateColumns: h },
+	return /* @__PURE__ */ h("div", {
+		className: F(Q.tableWrapper, i),
+		"aria-busy": s || void 0,
+		children: [/* @__PURE__ */ m("div", {
+			className: Q.tableScroll,
+			children: /* @__PURE__ */ h("div", {
+				className: Q.table,
+				style: { gridTemplateColumns: p },
 				role: "table",
 				children: [
-					/* @__PURE__ */ f("div", {
-						className: X.headerRow,
+					/* @__PURE__ */ m("div", {
+						className: Q.headerRow,
 						role: "row",
-						children: m.map((e) => /* @__PURE__ */ p("div", {
-							className: P(X.headerCell, e.sortable && X.sortable, e.align === "right" && X.alignRight, e.align === "center" && X.alignCenter),
-							role: "columnheader",
-							onClick: () => e.sortable && b(e.id),
-							style: e.minWidth ? { minWidth: typeof e.minWidth == "number" ? `${e.minWidth}px` : e.minWidth } : void 0,
-							children: [typeof e.header == "string" ? /* @__PURE__ */ f(w, {
-								variant: "text-body-small-emphasis",
-								as: "span",
-								color: "secondary",
-								children: e.header
-							}) : e.header, n?.columnId === e.id && /* @__PURE__ */ f("span", {
-								className: X.sortIndicator,
-								"aria-hidden": !0,
-								children: n.direction === "asc" ? "↑" : "↓"
-							})]
-						}, e.id))
+						children: f.map((e) => {
+							let t = n?.columnId === e.id, r = e.sortable ? t ? n.direction === "asc" ? "ascending" : "descending" : "none" : void 0, i = () => e.sortable && b(e.id);
+							return /* @__PURE__ */ h("div", {
+								className: F(Q.headerCell, e.sortable && Q.sortable, e.align === "right" && Q.alignRight, e.align === "center" && Q.alignCenter),
+								role: "columnheader",
+								"aria-sort": r,
+								tabIndex: e.sortable ? 0 : void 0,
+								onClick: i,
+								onKeyDown: e.sortable ? (e) => {
+									(e.key === "Enter" || e.key === " ") && (e.preventDefault(), i());
+								} : void 0,
+								style: e.minWidth ? { minWidth: typeof e.minWidth == "number" ? `${e.minWidth}px` : e.minWidth } : void 0,
+								children: [typeof e.header == "string" ? /* @__PURE__ */ m(E, {
+									variant: "text-body-small-emphasis",
+									as: "span",
+									color: "secondary",
+									children: e.header
+								}) : e.header, t && /* @__PURE__ */ m("span", {
+									className: Q.sortIndicator,
+									"aria-hidden": !0,
+									children: n.direction === "asc" ? "↑" : "↓"
+								})]
+							}, e.id);
+						})
 					}),
-					c && Array.from({ length: 5 }).map((e, t) => /* @__PURE__ */ f("div", {
-						className: X.row,
-						role: "row",
-						children: m.map((e) => /* @__PURE__ */ f("div", {
-							className: X.cell,
+					s && Array.from({ length: 5 }).map((e, t) => /* @__PURE__ */ m("div", {
+						className: Q.row,
+						role: t === 0 ? "status" : "row",
+						"aria-label": t === 0 ? "Loading" : void 0,
+						children: f.map((e) => /* @__PURE__ */ m("div", {
+							className: Q.cell,
 							role: "cell",
-							children: /* @__PURE__ */ f("div", { className: X.skeleton })
+							children: /* @__PURE__ */ m("div", { className: Q.skeleton })
 						}, e.id))
 					}, `skeleton-${t}`)),
-					y && /* @__PURE__ */ f("div", {
-						className: X.emptyRow,
+					y && /* @__PURE__ */ m("div", {
+						className: Q.emptyRow,
 						style: { gridColumn: "1 / -1" },
-						children: /* @__PURE__ */ f(w, {
+						children: /* @__PURE__ */ m(E, {
 							variant: "text-body-medium",
 							as: "p",
 							color: "secondary",
 							children: d
 						})
 					}),
-					!c && _.map((e, t) => {
-						let n = o?.has(t);
-						return /* @__PURE__ */ f("div", {
-							className: P(X.row, n && X.rowSelected, a && X.rowClickable),
+					!s && _.map((e, t) => {
+						let n = o?.has(t), r = !!a;
+						return /* @__PURE__ */ m("div", {
+							className: F(Q.row, n && Q.rowSelected, r && Q.rowClickable),
 							role: "row",
+							tabIndex: r ? 0 : void 0,
+							"aria-selected": o ? !!n : void 0,
 							onClick: () => a?.(e, t),
-							children: m.map((n) => /* @__PURE__ */ f("div", {
-								className: P(X.cell, n.align === "right" && X.alignRight, n.align === "center" && X.alignCenter),
+							onKeyDown: r ? (n) => {
+								(n.key === "Enter" || n.key === " ") && (n.preventDefault(), a?.(e, t));
+							} : void 0,
+							children: f.map((n) => /* @__PURE__ */ m("div", {
+								className: F(Q.cell, n.align === "right" && Q.alignRight, n.align === "center" && Q.alignCenter),
 								role: "cell",
-								children: n.renderCell ? n.renderCell(e, t) : /* @__PURE__ */ f(w, {
+								children: n.renderCell ? n.renderCell(e, t) : /* @__PURE__ */ m(E, {
 									variant: "text-body-medium",
 									as: "span",
 									lineTruncation: 1,
-									children: String(Ke(n, e) ?? "")
+									children: String(Ye(n, e) ?? "")
 								})
 							}, n.id))
 						}, t);
 					})
 				]
 			})
-		}), l && u && v > 1 && /* @__PURE__ */ p("div", {
-			className: X.pagination,
+		}), c && u && v > 1 && /* @__PURE__ */ h("div", {
+			className: Q.pagination,
 			children: [
-				/* @__PURE__ */ f("button", {
-					className: X.pageButton,
-					disabled: l.pageIndex === 0,
-					onClick: () => u(l.pageIndex - 1, l.pageSize),
+				/* @__PURE__ */ m("button", {
+					className: Q.pageButton,
+					disabled: c.pageIndex === 0,
+					onClick: () => u(c.pageIndex - 1, c.pageSize),
 					type: "button",
-					children: /* @__PURE__ */ f(w, {
+					children: /* @__PURE__ */ m(E, {
 						variant: "text-body-small",
 						as: "span",
 						children: "Previous"
 					})
 				}),
-				/* @__PURE__ */ f(w, {
+				/* @__PURE__ */ m(E, {
 					variant: "text-body-small",
 					as: "span",
 					color: "secondary",
-					children: `Page ${l.pageIndex + 1} of ${v}`
+					children: `Page ${c.pageIndex + 1} of ${v}`
 				}),
-				/* @__PURE__ */ f("button", {
-					className: X.pageButton,
-					disabled: l.pageIndex >= v - 1,
-					onClick: () => u(l.pageIndex + 1, l.pageSize),
+				/* @__PURE__ */ m("button", {
+					className: Q.pageButton,
+					disabled: c.pageIndex >= v - 1,
+					onClick: () => u(c.pageIndex + 1, c.pageSize),
 					type: "button",
-					children: /* @__PURE__ */ f(w, {
+					children: /* @__PURE__ */ m(E, {
 						variant: "text-body-small",
 						as: "span",
 						children: "Next"
@@ -1615,62 +1938,68 @@ function Je({ columns: e, data: t, sortState: n, onSort: r, className: i, onRowC
 		})]
 	});
 }
-Je.displayName = "Table";
-var Ye = {
+Ze.displayName = "Table";
+var Qe = {
 	tab: "_tab_7ngwl_5",
 	tabSelected: "_tabSelected_7ngwl_33",
 	onMedium: "_onMedium_7ngwl_39",
 	onBold: "_onBold_7ngwl_44",
 	onStrong: "_onStrong_7ngwl_52",
 	onAlwaysDark: "_onAlwaysDark_7ngwl_60"
-}, Xe = n(({ id: e, label: t, isSelected: n = !1, background: r, onClick: i, className: a }, o) => {
-	let s = r && r !== "faint" ? Ye[r === "always-dark" ? "onAlwaysDark" : `on${r.charAt(0).toUpperCase() + r.slice(1)}`] : void 0;
-	return /* @__PURE__ */ f("button", {
-		ref: o,
+}, $e = r(({ id: e, controls: t, label: n, isSelected: r = !1, disabled: i = !1, background: a, onClick: o, onKeyDown: s, onFocus: c, tabIndex: l, className: u }, d) => {
+	let f = a && a !== "faint" ? Qe[a === "always-dark" ? "onAlwaysDark" : `on${a.charAt(0).toUpperCase() + a.slice(1)}`] : void 0, p = l ?? (r ? 0 : -1);
+	return /* @__PURE__ */ m("button", {
+		ref: d,
 		id: e,
-		className: P(Ye.tab, n && Ye.tabSelected, s, a),
-		onClick: i,
+		className: F(Qe.tab, r && Qe.tabSelected, f, u),
+		onClick: o,
+		onKeyDown: s,
+		onFocus: c,
 		type: "button",
-		"aria-selected": n,
 		role: "tab",
-		children: /* @__PURE__ */ f(w, {
-			variant: n ? "text-body-medium-emphasis" : "text-body-medium",
+		"aria-selected": r,
+		"aria-controls": t,
+		"aria-disabled": i || void 0,
+		disabled: i,
+		tabIndex: p,
+		children: /* @__PURE__ */ m(E, {
+			variant: r ? "text-body-medium-emphasis" : "text-body-medium",
 			as: "span",
-			children: t
+			children: n
 		})
 	});
 });
-Xe.displayName = "Tab";
-var Ze = { emptyState: "_emptyState_1988v_1" }, Qe = {
+$e.displayName = "Tab";
+var et = { emptyState: "_emptyState_1988v_1" }, tt = {
 	"no-content": "No page contents to display.",
 	"no-results": "No results found.",
 	"no-results-filter": "No results found. Please update search criteria.",
 	"no-access": "You don't have access to this page."
-}, $e = n(({ type: e = "no-content", message: t, className: n }, r) => /* @__PURE__ */ f("div", {
+}, nt = r(({ type: e = "no-content", message: t, className: n }, r) => /* @__PURE__ */ m("div", {
 	ref: r,
-	className: P(Ze.emptyState, n),
-	children: /* @__PURE__ */ f(w, {
+	className: F(et.emptyState, n),
+	children: /* @__PURE__ */ m(E, {
 		variant: "text-body-medium",
 		as: "p",
 		color: "secondary",
-		children: t || Qe[e]
+		children: t || tt[e]
 	})
 }));
-$e.displayName = "EmptyState";
-var et = {
+nt.displayName = "EmptyState";
+var rt = {
 	fade: "_fade_8nnao_1",
 	fadeTop: "_fadeTop_8nnao_13",
 	fadeBottom: "_fadeBottom_8nnao_18",
 	fadeLeft: "_fadeLeft_8nnao_23",
 	fadeRight: "_fadeRight_8nnao_28"
-}, tt = {
+}, it = {
 	top: "fadeTop",
 	bottom: "fadeBottom",
 	left: "fadeLeft",
 	right: "fadeRight"
-}, nt = n(({ side: e, height: t, background: n = "var(--color-background-secondary)", className: r, style: i = {} }, a) => /* @__PURE__ */ f("div", {
+}, at = r(({ side: e, height: t, background: n = "var(--color-background-secondary)", className: r, style: i = {} }, a) => /* @__PURE__ */ m("div", {
 	ref: a,
-	className: P(et.fade, et[tt[e]], r),
+	className: F(rt.fade, rt[it[e]], r),
 	style: {
 		...i,
 		height: t,
@@ -1678,22 +2007,22 @@ var et = {
 	},
 	"aria-hidden": "true"
 }));
-nt.displayName = "Fade";
-var rt = {
-	container: "_container_153sa_1",
-	content: "_content_153sa_8",
-	track: "_track_153sa_20",
-	thumb: "_thumb_153sa_35",
-	trackHorizontal: "_trackHorizontal_153sa_49",
-	thumbHorizontal: "_thumbHorizontal_153sa_64",
-	thick: "_thick_153sa_78"
-}, it = ({ children: e, className: t, variant: n = "default", showTrackOnHover: a = !0, onScroll: o, fadeOverlay: s, contentRef: u }) => {
-	let d = c(null), m = c(null), h = u || m, g = c(null), _ = c(null), [v, y] = l(0), [b, x] = l(0), [S, C] = l(0), [w, T] = l(0), [E, D] = l(!1), [O, k] = l(!1), [A, j] = l(!1), M = c(0), N = c(0), ee = c(0), F = c(0), I = r(() => {
-		a && j(!0);
-	}, [a]), L = r(() => {
-		j(!1);
-	}, []), R = r(() => {
-		let e = d.current, t = h.current;
+at.displayName = "Fade";
+var ot = {
+	container: "_container_1pmuk_1",
+	content: "_content_1pmuk_8",
+	track: "_track_1pmuk_25",
+	thumb: "_thumb_1pmuk_40",
+	trackHorizontal: "_trackHorizontal_1pmuk_54",
+	thumbHorizontal: "_thumbHorizontal_1pmuk_69",
+	thick: "_thick_1pmuk_83"
+}, st = ({ children: e, className: t, variant: n = "default", showTrackOnHover: r = !0, onScroll: i, fadeOverlay: s, contentRef: c }) => {
+	let l = u(null), f = u(null), p = c || f, g = u(null), _ = u(null), [v, y] = d(0), [b, x] = d(0), [S, C] = d(0), [w, T] = d(0), [E, D] = d(!1), [O, k] = d(!1), [ee, A] = d(!1), j = u(0), M = u(0), N = u(0), P = u(0), I = a(() => {
+		r && A(!0);
+	}, [r]), L = a(() => {
+		A(!1);
+	}, []), R = a(() => {
+		let e = l.current, t = p.current;
 		if (!e || !t) return;
 		let n = e.clientHeight, r = e.clientWidth, i = t.scrollHeight, a = t.scrollWidth, o = t.scrollTop, s = t.scrollLeft;
 		if (i <= n) y(0);
@@ -1706,20 +2035,20 @@ var rt = {
 			let e = r / a, t = Math.max(20, r * e);
 			C(t), T(s / (a - r) * (r - t));
 		}
-	}, [h]);
-	i(() => {
-		let e = h.current;
+	}, [p]);
+	o(() => {
+		let e = p.current;
 		if (!e) return;
 		let t = (e) => {
-			R(), o && o(e);
+			R(), i && i(e);
 		};
 		return e.addEventListener("scroll", t), () => e.removeEventListener("scroll", t);
 	}, [
 		R,
-		o,
-		h
-	]), i(() => {
-		let e = h.current;
+		i,
+		p
+	]), o(() => {
+		let e = p.current;
 		if (!e) return;
 		let t = () => R();
 		if (window.addEventListener("resize", t), typeof ResizeObserver < "u") {
@@ -1729,84 +2058,87 @@ var rt = {
 			};
 		}
 		return () => window.removeEventListener("resize", t);
-	}, [R, h]), i(() => {
+	}, [R, p]), o(() => {
 		R();
 	}, [R, e]);
-	let te = r((e) => {
+	let z = a((e) => {
 		e.preventDefault(), e.stopPropagation();
-		let t = h.current;
+		let t = p.current;
 		if (!t) return;
-		D(!0), M.current = e.clientY, N.current = t.scrollTop;
+		D(!0), j.current = e.clientY, M.current = t.scrollTop;
 		let n = (e) => {
-			let n = d.current;
+			let n = l.current;
 			if (!n || !t) return;
-			let r = e.clientY - M.current, i = t.scrollHeight - n.clientHeight, a = i / (n.clientHeight - v);
-			t.scrollTop = Math.max(0, Math.min(i, N.current + r * a));
+			let r = e.clientY - j.current, i = t.scrollHeight - n.clientHeight, a = i / (n.clientHeight - v);
+			t.scrollTop = Math.max(0, Math.min(i, M.current + r * a));
 		}, r = () => {
 			D(!1), document.removeEventListener("mousemove", n), document.removeEventListener("mouseup", r);
 		};
 		document.addEventListener("mousemove", n), document.addEventListener("mouseup", r);
-	}, [v, h]), z = r((e) => {
+	}, [v, p]), te = a((e) => {
 		e.preventDefault(), e.stopPropagation();
-		let t = h.current;
+		let t = p.current;
 		if (!t) return;
-		k(!0), ee.current = e.clientX, F.current = t.scrollLeft;
+		k(!0), N.current = e.clientX, P.current = t.scrollLeft;
 		let n = (e) => {
-			let n = d.current;
+			let n = l.current;
 			if (!n || !t) return;
-			let r = e.clientX - ee.current, i = t.scrollWidth - n.clientWidth, a = i / (n.clientWidth - S);
-			t.scrollLeft = Math.max(0, Math.min(i, F.current + r * a));
+			let r = e.clientX - N.current, i = t.scrollWidth - n.clientWidth, a = i / (n.clientWidth - S);
+			t.scrollLeft = Math.max(0, Math.min(i, P.current + r * a));
 		}, r = () => {
 			k(!1), document.removeEventListener("mousemove", n), document.removeEventListener("mouseup", r);
 		};
 		document.addEventListener("mousemove", n), document.addEventListener("mouseup", r);
-	}, [S, h]), B = v > 0, V = S > 0, ne = a && (A || E || O);
-	return /* @__PURE__ */ p("div", {
-		ref: d,
-		className: P(rt.container, n === "thick" && rt.thick, t),
+	}, [S, p]), B = v > 0, ne = S > 0, V = r && (ee || E || O), re = B || ne;
+	return /* @__PURE__ */ h("div", {
+		ref: l,
+		className: F(ot.container, n === "thick" && ot.thick, t),
 		onMouseEnter: I,
 		onMouseLeave: L,
 		"data-dragging": E || O,
-		"data-show-track": ne ? "true" : "false",
+		"data-show-track": V ? "true" : "false",
 		children: [
-			/* @__PURE__ */ f("div", {
-				ref: h,
-				className: rt.content,
+			/* @__PURE__ */ m("div", {
+				ref: p,
+				className: ot.content,
+				tabIndex: re ? 0 : void 0,
 				children: e
 			}),
 			s,
-			B && /* @__PURE__ */ f("div", {
-				className: rt.track,
-				children: /* @__PURE__ */ f("div", {
+			B && /* @__PURE__ */ m("div", {
+				className: ot.track,
+				"aria-hidden": "true",
+				children: /* @__PURE__ */ m("div", {
 					ref: g,
-					className: rt.thumb,
+					className: ot.thumb,
 					style: {
 						height: `${v}px`,
 						top: `${b}px`
 					},
-					onMouseDown: te
+					onMouseDown: z
 				})
 			}),
-			V && /* @__PURE__ */ f("div", {
-				className: rt.trackHorizontal,
-				children: /* @__PURE__ */ f("div", {
+			ne && /* @__PURE__ */ m("div", {
+				className: ot.trackHorizontal,
+				"aria-hidden": "true",
+				children: /* @__PURE__ */ m("div", {
 					ref: _,
-					className: rt.thumbHorizontal,
+					className: ot.thumbHorizontal,
 					style: {
 						width: `${S}px`,
 						left: `${w}px`
 					},
-					onMouseDown: z
+					onMouseDown: te
 				})
 			})
 		]
 	});
 };
-it.displayName = "Scrollbar";
-var at = {
+st.displayName = "Scrollbar";
+var ct = {
 	errorBoundary: "_errorBoundary_1avvb_1",
 	errorDetails: "_errorDetails_1avvb_11"
-}, ot = class extends t {
+}, lt = class extends t {
 	constructor(e) {
 		super(e), this.handleReset = () => {
 			this.setState({
@@ -1828,11 +2160,11 @@ var at = {
 		console.error("ErrorBoundary caught an error:", e, t);
 	}
 	render() {
-		return this.state.hasError ? this.props.fallback ? this.props.fallback : /* @__PURE__ */ p("div", {
-			className: at.errorBoundary,
-			children: [/* @__PURE__ */ f($e, { type: "no-content" }), /* @__PURE__ */ f("div", {
-				className: at.errorDetails,
-				children: /* @__PURE__ */ f(w, {
+		return this.state.hasError ? this.props.fallback ? this.props.fallback : /* @__PURE__ */ h("div", {
+			className: ct.errorBoundary,
+			children: [/* @__PURE__ */ m(nt, { type: "no-content" }), /* @__PURE__ */ m("div", {
+				className: ct.errorDetails,
+				children: /* @__PURE__ */ m(E, {
 					variant: "text-body-small",
 					as: "p",
 					color: "secondary",
@@ -1841,173 +2173,240 @@ var at = {
 			})]
 		}) : this.props.children;
 	}
-}, Z = {
-	sidebar: "_sidebar_1al5s_2",
-	resizing: "_resizing_1al5s_14",
-	collapsed: "_collapsed_1al5s_16",
-	mobile: "_mobile_1al5s_18",
-	mini: "_mini_1al5s_26",
-	itemLabel: "_itemLabel_1al5s_26",
-	itemBadge: "_itemBadge_1al5s_27",
-	sectionHeader: "_sectionHeader_1al5s_28",
-	backdrop: "_backdrop_1al5s_30",
-	content: "_content_1al5s_37",
-	footer: "_footer_1al5s_47",
-	resizeHandle: "_resizeHandle_1al5s_54",
-	section: "_section_1al5s_28",
-	sectionHeaderClickable: "_sectionHeaderClickable_1al5s_87",
-	sectionItems: "_sectionItems_1al5s_89",
-	itemWrapper: "_itemWrapper_1al5s_96",
-	item: "_item_1al5s_26",
-	itemSelected: "_itemSelected_1al5s_130",
-	itemDisabled: "_itemDisabled_1al5s_133",
-	itemIcon: "_itemIcon_1al5s_135",
-	subItems: "_subItems_1al5s_156"
-}, st = 56, ct = 240, lt = 180, ut = 140, dt = n(({ children: e, isCollapsed: t = !1, onToggle: n, width: a = "default", onWidthChange: o, resizable: s = !0, footer: u, className: m, isMobile: h = !1 }, g) => {
-	let _ = c(null), v = g || _, [y, b] = l(!1), x = a === "mini", S = a === "mini" ? st : a === "default" ? ct : a, C = r((e) => {
-		if (!s || !o) return;
-		e.preventDefault(), b(!0), e.clientX;
+}, $ = {
+	sidebar: "_sidebar_3oy49_2",
+	resizing: "_resizing_3oy49_14",
+	collapsed: "_collapsed_3oy49_16",
+	mobile: "_mobile_3oy49_18",
+	mini: "_mini_3oy49_26",
+	itemLabel: "_itemLabel_3oy49_26",
+	itemBadge: "_itemBadge_3oy49_27",
+	sectionHeader: "_sectionHeader_3oy49_28",
+	backdrop: "_backdrop_3oy49_30",
+	content: "_content_3oy49_37",
+	footer: "_footer_3oy49_47",
+	resizeHandle: "_resizeHandle_3oy49_54",
+	section: "_section_3oy49_28",
+	sectionHeaderClickable: "_sectionHeaderClickable_3oy49_94",
+	sectionItems: "_sectionItems_3oy49_96",
+	itemWrapper: "_itemWrapper_3oy49_103",
+	item: "_item_3oy49_26",
+	itemSelected: "_itemSelected_3oy49_137",
+	itemDisabled: "_itemDisabled_3oy49_140",
+	itemIcon: "_itemIcon_3oy49_142",
+	subItems: "_subItems_3oy49_163"
+}, ut = 56, dt = 240, ft = 480, pt = 180, mt = 140, ht = 16, gt = [
+	"a[href]",
+	"button:not([disabled])",
+	"input:not([disabled])",
+	"select:not([disabled])",
+	"textarea:not([disabled])",
+	"[tabindex]:not([tabindex=\"-1\"])"
+].join(","), _t = r(({ children: e, isCollapsed: t = !1, onToggle: n, width: r = "default", onWidthChange: i, resizable: s = !0, footer: c, className: l, isMobile: f = !1 }, g) => {
+	let _ = u(null), v = g || _, y = u(null), [b, x] = d(!1), S = r === "mini", C = r === "mini" ? ut : r === "default" ? dt : r, w = a((e) => {
+		if (!s || !i) return;
+		e.preventDefault(), x(!0);
 		let t = (e) => {
 			let t = e.clientX;
-			o(t < ut ? "mini" : t < lt ? "default" : t);
+			i(t < mt ? "mini" : t < pt ? "default" : t);
 		}, n = () => {
-			b(!1), document.removeEventListener("mousemove", t), document.removeEventListener("mouseup", n), document.body.style.cursor = "", document.body.style.userSelect = "";
+			x(!1), document.removeEventListener("mousemove", t), document.removeEventListener("mouseup", n), document.body.style.cursor = "", document.body.style.userSelect = "";
 		};
 		document.body.style.cursor = "col-resize", document.body.style.userSelect = "none", document.addEventListener("mousemove", t), document.addEventListener("mouseup", n);
-	}, [s, o]);
-	return i(() => {
-		if (!h || t) return;
+	}, [s, i]), T = a((e) => {
+		if (!(!s || !i)) switch (e.key) {
+			case "ArrowLeft": {
+				if (e.preventDefault(), r === "mini") return;
+				let t = C - ht;
+				i(t < pt ? "mini" : t);
+				break;
+			}
+			case "ArrowRight":
+				if (e.preventDefault(), r === "mini") {
+					i("default");
+					return;
+				}
+				i(Math.min(C + ht, ft));
+				break;
+			case "Home":
+				e.preventDefault(), i("mini");
+				break;
+			case "End":
+				e.preventDefault(), i(ft);
+				break;
+		}
+	}, [
+		s,
+		i,
+		r,
+		C
+	]);
+	o(() => {
+		if (!f || t) return;
 		let e = (e) => {
 			e.key === "Escape" && n?.();
 		};
 		return document.addEventListener("keydown", e), () => document.removeEventListener("keydown", e);
 	}, [
-		h,
+		f,
 		t,
 		n
-	]), t && !h ? null : /* @__PURE__ */ p(d, { children: [h && !t && /* @__PURE__ */ f("div", {
-		className: Z.backdrop,
+	]);
+	let E = f && !t;
+	if (o(() => {
+		if (!E) return;
+		y.current = document.activeElement ?? null;
+		let e = v.current;
+		if (!e) return;
+		let t = () => Array.from(e.querySelectorAll(gt)).filter((e) => !e.hasAttribute("aria-hidden") && e.offsetParent !== null);
+		(t()[0] ?? e).focus();
+		let n = (n) => {
+			if (n.key !== "Tab") return;
+			let r = t();
+			if (r.length === 0) {
+				n.preventDefault(), e.focus();
+				return;
+			}
+			let i = r[0], a = r[r.length - 1], o = document.activeElement;
+			n.shiftKey && (o === i || !e.contains(o)) ? (n.preventDefault(), a.focus()) : !n.shiftKey && (o === a || !e.contains(o)) && (n.preventDefault(), i.focus());
+		};
+		return document.addEventListener("keydown", n), () => {
+			document.removeEventListener("keydown", n), y.current?.focus?.(), y.current = null;
+		};
+	}, [E, v]), t && !f) return null;
+	let D = E ? {
+		role: "dialog",
+		"aria-modal": !0,
+		tabIndex: -1
+	} : { role: "navigation" };
+	return /* @__PURE__ */ h(p, { children: [f && !t && /* @__PURE__ */ m("div", {
+		className: $.backdrop,
 		onClick: n,
-		"aria-hidden": !0
-	}), /* @__PURE__ */ p("aside", {
+		"aria-hidden": "true"
+	}), /* @__PURE__ */ h("aside", {
 		ref: v,
-		className: P(Z.sidebar, x && Z.mini, h && Z.mobile, t && Z.collapsed, y && Z.resizing, m),
-		style: { width: t ? 0 : S },
-		role: "navigation",
+		className: F($.sidebar, S && $.mini, f && $.mobile, t && $.collapsed, b && $.resizing, l),
+		style: { width: t ? 0 : C },
 		"aria-label": "Sidebar",
+		...D,
 		children: [
-			/* @__PURE__ */ f("div", {
-				className: Z.content,
+			/* @__PURE__ */ m("div", {
+				className: $.content,
 				children: e
 			}),
-			u && /* @__PURE__ */ f("div", {
-				className: Z.footer,
-				children: u
+			c && /* @__PURE__ */ m("div", {
+				className: $.footer,
+				children: c
 			}),
-			s && !h && /* @__PURE__ */ f("div", {
-				className: Z.resizeHandle,
-				onMouseDown: C,
+			s && !f && /* @__PURE__ */ m("div", {
+				className: $.resizeHandle,
+				onMouseDown: w,
+				onKeyDown: T,
 				role: "separator",
 				"aria-orientation": "vertical",
-				"aria-label": "Resize sidebar"
+				"aria-label": "Resize sidebar",
+				"aria-valuenow": C,
+				"aria-valuemin": ut,
+				"aria-valuemax": ft,
+				tabIndex: 0
 			})
 		]
 	})] });
 });
-dt.displayName = "Sidebar";
+_t.displayName = "Sidebar";
 //#endregion
 //#region src/components/Sidebar/SidebarSection.tsx
-var ft = n(({ label: e, children: t, collapsible: n = !1, defaultCollapsed: r = !1, className: i }, a) => {
-	let [o, s] = l(r);
-	return /* @__PURE__ */ p("div", {
+var vt = r(({ label: e, children: t, collapsible: n = !1, defaultCollapsed: r = !1, className: i }, a) => {
+	let [o, s] = d(r);
+	return /* @__PURE__ */ h("div", {
 		ref: a,
-		className: P(Z.section, i),
-		children: [e && /* @__PURE__ */ f("div", {
-			className: P(Z.sectionHeader, n && Z.sectionHeaderClickable),
+		className: F($.section, i),
+		children: [e && /* @__PURE__ */ m("div", {
+			className: F($.sectionHeader, n && $.sectionHeaderClickable),
 			onClick: n ? () => s((e) => !e) : void 0,
 			role: n ? "button" : void 0,
 			"aria-expanded": n ? !o : void 0,
-			children: /* @__PURE__ */ f(w, {
+			children: /* @__PURE__ */ m(E, {
 				variant: "text-caption-emphasis",
 				as: "span",
 				color: "tertiary",
 				children: e
 			})
-		}), !o && /* @__PURE__ */ f("div", {
-			className: Z.sectionItems,
+		}), !o && /* @__PURE__ */ m("div", {
+			className: $.sectionItems,
 			children: t
 		})]
 	});
 });
-ft.displayName = "SidebarSection";
+vt.displayName = "SidebarSection";
 //#endregion
 //#region src/components/Sidebar/SidebarItem.tsx
-var pt = n(({ label: e, icon: t, isSelected: n = !1, isDisabled: r = !1, onClick: i, badge: a, children: o, className: s }, c) => /* @__PURE__ */ p("div", {
-	className: P(Z.itemWrapper, s),
-	children: [/* @__PURE__ */ p("button", {
+var yt = r(({ label: e, icon: t, isSelected: n = !1, isDisabled: r = !1, onClick: i, badge: a, children: o, className: s }, c) => /* @__PURE__ */ h("div", {
+	className: F($.itemWrapper, s),
+	children: [/* @__PURE__ */ h("button", {
 		ref: c,
-		className: P(Z.item, n && Z.itemSelected, r && Z.itemDisabled),
+		className: F($.item, n && $.itemSelected, r && $.itemDisabled),
 		onClick: i,
 		disabled: r,
 		type: "button",
 		"aria-current": n ? "page" : void 0,
 		children: [
-			t && /* @__PURE__ */ f("span", {
-				className: Z.itemIcon,
-				children: /* @__PURE__ */ f(t, { size: 20 })
+			t && /* @__PURE__ */ m("span", {
+				className: $.itemIcon,
+				children: /* @__PURE__ */ m(t, { size: 20 })
 			}),
-			/* @__PURE__ */ f(w, {
+			/* @__PURE__ */ m(E, {
 				variant: n ? "text-body-medium-emphasis" : "text-body-medium",
 				as: "span",
-				className: Z.itemLabel,
+				className: $.itemLabel,
 				lineTruncation: 1,
 				children: e
 			}),
-			a && /* @__PURE__ */ f("span", {
-				className: Z.itemBadge,
+			a && /* @__PURE__ */ m("span", {
+				className: $.itemBadge,
 				children: a
 			})
 		]
-	}), o && n && /* @__PURE__ */ f("div", {
-		className: Z.subItems,
+	}), o && n && /* @__PURE__ */ m("div", {
+		className: $.subItems,
 		children: o
 	})]
 }));
-pt.displayName = "SidebarItem";
-var mt = {
+yt.displayName = "SidebarItem";
+var bt = {
 	header: "_header_1902d_1",
 	left: "_left_1902d_11",
 	center: "_center_1902d_19",
 	right: "_right_1902d_28"
-}, ht = n(({ title: e, left: t, center: n, right: r, background: i = "secondary", className: a }, o) => /* @__PURE__ */ p(M, {
+}, xt = r(({ title: e, left: t, center: n, right: r, background: i = "secondary", className: a }, o) => /* @__PURE__ */ h(N, {
 	ref: o,
 	as: "header",
 	background: i,
 	elevation: "none",
 	edge: "bottom",
-	className: P(mt.header, a),
+	className: F(bt.header, a),
 	children: [
-		/* @__PURE__ */ p("div", {
-			className: mt.left,
-			children: [t, e && !n && /* @__PURE__ */ f(w, {
+		/* @__PURE__ */ h("div", {
+			className: bt.left,
+			children: [t, e && !n && /* @__PURE__ */ m(E, {
 				variant: "text-title-small",
 				as: "h1",
 				lineTruncation: 1,
 				children: e
 			})]
 		}),
-		n && /* @__PURE__ */ f("div", {
-			className: mt.center,
+		n && /* @__PURE__ */ m("div", {
+			className: bt.center,
 			children: n
 		}),
-		/* @__PURE__ */ f("div", {
-			className: mt.right,
+		/* @__PURE__ */ m("div", {
+			className: bt.right,
 			children: r
 		})
 	]
 }));
-ht.displayName = "Header";
-var gt = {
+xt.displayName = "Header";
+var St = {
 	group: "_group_9khnl_1",
 	horizontal: "_horizontal_9khnl_7",
 	radio: "_radio_9khnl_14",
@@ -2015,37 +2414,72 @@ var gt = {
 	circle: "_circle_9khnl_39",
 	circleChecked: "_circleChecked_9khnl_52",
 	dot: "_dot_9khnl_56"
-}, _t = n(({ value: e, onChange: t, options: n, "aria-label": r, direction: i = "vertical", inactive: a = !1, className: o }, s) => /* @__PURE__ */ f("div", {
-	ref: s,
-	role: "radiogroup",
-	"aria-label": r,
-	className: P(gt.group, i === "horizontal" && gt.horizontal, o),
-	children: n.map((n) => /* @__PURE__ */ f(vt, {
-		label: n.label,
-		checked: e === n.value,
-		inactive: a || n.inactive,
-		onChange: () => t(n.value)
-	}, n.value))
-}));
-_t.displayName = "RadioGroup";
-var vt = n(({ label: e, checked: t = !1, onChange: n, inactive: r = !1, className: i }, a) => {
-	let o = () => {
+}, Ct = r(({ value: e, onChange: t, options: n, "aria-label": r, "aria-labelledby": i, direction: a = "vertical", inactive: o = !1, className: s }, c) => {
+	!r && !i && globalThis.process?.env?.NODE_ENV !== "production" && console.warn("RadioGroup: an accessible name is required. Pass either `aria-label` or `aria-labelledby`.");
+	let l = u([]), d = (e) => e >= 0 && e < n.length && !o && !n[e].inactive, f = n.reduce((e, t, n) => (d(n) && e.push(n), e), []), p = n.findIndex((t) => t.value === e), h = d(p) ? p : f[0] ?? -1, g = (r) => {
+		l.current[r]?.focus(), n[r].value !== e && t(n[r].value);
+	}, _ = (e, t) => {
+		if (f.length === 0) return;
+		let n = f.indexOf(e);
+		g(f[((n === -1 ? t === 1 ? -1 : 0 : n) + t + f.length) % f.length]);
+	};
+	return /* @__PURE__ */ m("div", {
+		ref: c,
+		role: "radiogroup",
+		"aria-label": r,
+		"aria-labelledby": i,
+		onKeyDown: (e) => {
+			let t = e.target, n = l.current.findIndex((e) => e === t);
+			if (n !== -1) switch (e.key) {
+				case "ArrowDown":
+				case "ArrowRight":
+					e.preventDefault(), _(n, 1);
+					break;
+				case "ArrowUp":
+				case "ArrowLeft":
+					e.preventDefault(), _(n, -1);
+					break;
+				case "Home":
+					e.preventDefault(), f.length && g(f[0]);
+					break;
+				case "End":
+					e.preventDefault(), f.length && g(f[f.length - 1]);
+					break;
+			}
+		},
+		className: F(St.group, a === "horizontal" && St.horizontal, s),
+		children: n.map((n, r) => /* @__PURE__ */ m(wt, {
+			ref: (e) => {
+				l.current[r] = e;
+			},
+			label: n.label,
+			checked: e === n.value,
+			inactive: o || n.inactive,
+			tabIndex: r === h ? 0 : -1,
+			onChange: () => t(n.value)
+		}, n.value))
+	});
+});
+Ct.displayName = "RadioGroup";
+var wt = r(({ label: e, checked: t = !1, onChange: n, inactive: r = !1, tabIndex: i, className: a }, o) => {
+	let s = () => {
 		!r && !t && n?.();
 	};
-	return /* @__PURE__ */ p("div", {
-		ref: a,
+	return /* @__PURE__ */ h("div", {
+		ref: o,
 		role: "radio",
 		"aria-checked": t,
-		tabIndex: r ? -1 : 0,
-		className: P(gt.radio, r && gt.inactive, i),
-		onClick: o,
+		"aria-disabled": r || void 0,
+		tabIndex: i ?? (r ? -1 : 0),
+		className: F(St.radio, r && St.inactive, a),
+		onClick: s,
 		onKeyDown: (e) => {
-			(e.key === " " || e.key === "Enter") && (e.preventDefault(), o());
+			(e.key === " " || e.key === "Enter") && (e.preventDefault(), s());
 		},
-		children: [/* @__PURE__ */ f("span", {
-			className: P(gt.circle, t && gt.circleChecked),
-			children: t && /* @__PURE__ */ f("span", { className: gt.dot })
-		}), /* @__PURE__ */ f(w, {
+		children: [/* @__PURE__ */ m("span", {
+			className: F(St.circle, t && St.circleChecked),
+			children: t && /* @__PURE__ */ m("span", { className: St.dot })
+		}), /* @__PURE__ */ m(E, {
 			variant: "text-body-medium",
 			as: "span",
 			color: "inherit",
@@ -2053,57 +2487,76 @@ var vt = n(({ label: e, checked: t = !1, onChange: n, inactive: r = !1, classNam
 		})]
 	});
 });
-vt.displayName = "RadioItem";
-var yt = {
+wt.displayName = "RadioItem";
+var Tt = {
 	tabGroup: "_tabGroup_1kx0a_1",
 	tabsRow: "_tabsRow_1kx0a_7",
 	track: "_track_1kx0a_12",
 	indicator: "_indicator_1kx0a_18"
-}, bt = n(({ tabs: e, activeIndex: t = 0, onTabChange: n, className: a }, o) => {
-	let s = c([]), [u, d] = l({
+}, Et = r(({ tabs: e, activeIndex: t = 0, onTabChange: n, orientation: r = "horizontal", className: i, "aria-label": s, "aria-labelledby": c }, l) => {
+	let f = u([]), [p, g] = d({
 		left: 0,
 		width: 0
-	}), m = r(() => {
-		let e = s.current[t];
-		e && e.parentElement && d({
+	}), _ = a(() => {
+		let e = f.current[t];
+		e && g({
 			left: e.offsetLeft,
 			width: e.offsetWidth
 		});
 	}, [t]);
-	return i(() => {
-		m();
-	}, [m]), i(() => {
-		let e = new ResizeObserver(m), t = s.current[0]?.parentElement;
+	o(() => {
+		_();
+	}, [_]), o(() => {
+		let e = new ResizeObserver(_), t = f.current[0]?.parentElement;
 		return t && e.observe(t), () => e.disconnect();
-	}, [m]), /* @__PURE__ */ p("div", {
-		ref: o,
+	}, [_]);
+	let v = a((t, n) => {
+		let r = e.length;
+		if (r === 0) return t;
+		let i = t;
+		for (let t = 0; t < r; t++) if (i = (i + n + r) % r, !e[i].disabled) return i;
+		return t;
+	}, [e]), y = a((e) => {
+		e !== t && n?.(e), f.current[e]?.focus();
+	}, [t, n]);
+	return /* @__PURE__ */ h("div", {
+		ref: l,
 		role: "tablist",
-		className: P(yt.tabGroup, a),
-		children: [/* @__PURE__ */ f("div", {
-			className: yt.tabsRow,
-			children: e.map((e, r) => /* @__PURE__ */ f(Xe, {
+		"aria-label": s,
+		"aria-labelledby": c,
+		"aria-orientation": r === "vertical" ? "vertical" : void 0,
+		onKeyDown: (n) => {
+			let i = r !== "vertical", a = i ? "ArrowRight" : "ArrowDown", o = i ? "ArrowLeft" : "ArrowUp", s = null;
+			n.key === a ? s = v(t, 1) : n.key === o ? s = v(t, -1) : n.key === "Home" ? s = v(-1, 1) : n.key === "End" && (s = v(e.length, -1)), s !== null && (n.preventDefault(), y(s));
+		},
+		className: F(Tt.tabGroup, i),
+		children: [/* @__PURE__ */ m("div", {
+			className: Tt.tabsRow,
+			children: e.map((e, r) => /* @__PURE__ */ m($e, {
 				ref: (e) => {
-					s.current[r] = e;
+					f.current[r] = e;
 				},
 				id: e.id,
+				controls: e.panelId,
 				label: e.label,
 				isSelected: r === t,
+				disabled: e.disabled,
 				onClick: () => n?.(r)
 			}, e.id ?? r))
-		}), /* @__PURE__ */ f("div", {
-			className: yt.track,
-			children: /* @__PURE__ */ f("div", {
-				className: yt.indicator,
+		}), /* @__PURE__ */ m("div", {
+			className: Tt.track,
+			children: /* @__PURE__ */ m("div", {
+				className: Tt.indicator,
 				style: {
-					transform: `translateX(${u.left}px)`,
-					width: u.width
+					transform: `translateX(${p.left}px)`,
+					width: p.width
 				}
 			})
 		})]
 	});
 });
-bt.displayName = "TabGroup";
-var Q = {
+Et.displayName = "TabGroup";
+var Dt = {
 	accordion: "_accordion_15kid_1",
 	item: "_item_15kid_8",
 	inactive: "_inactive_15kid_16",
@@ -2112,111 +2565,117 @@ var Q = {
 	chevronOpen: "_chevronOpen_15kid_52",
 	body: "_body_15kid_58",
 	bodyInner: "_bodyInner_15kid_63"
-}, xt = n(({ items: e, multiple: t = !1, expandedIds: n, onExpandedChange: r, className: i }, a) => {
-	let [o, s] = l([]), c = n ?? o, u = (e) => {
+}, Ot = r(({ items: e, multiple: t = !1, expandedIds: n, onExpandedChange: r, className: i }, a) => {
+	let [o, s] = d([]), c = n ?? o, l = (e) => {
 		let n;
 		n = c.includes(e) ? c.filter((t) => t !== e) : t ? [...c, e] : [e], s(n), r?.(n);
 	};
-	return /* @__PURE__ */ f("div", {
+	return /* @__PURE__ */ m("div", {
 		ref: a,
-		className: P(Q.accordion, i),
-		children: e.map((e) => /* @__PURE__ */ f(St, {
+		className: F(Dt.accordion, i),
+		children: e.map((e) => /* @__PURE__ */ m(kt, {
 			label: e.label,
 			isExpanded: c.includes(e.id),
 			inactive: e.inactive,
-			onToggle: () => u(e.id),
+			onToggle: () => l(e.id),
 			children: e.content
 		}, e.id))
 	});
 });
-xt.displayName = "Accordion";
-var St = n(({ label: e, children: t, isExpanded: n = !1, onToggle: a, inactive: o = !1, className: s }, u) => {
-	let d = c(null), [m, h] = l(0), g = r(() => {
-		d.current && h(d.current.scrollHeight);
+Ot.displayName = "Accordion";
+var kt = r(({ label: e, children: t, isExpanded: n = !1, onToggle: r, inactive: i = !1, className: c }, l) => {
+	let f = u(null), [p, g] = d(0), _ = s(), v = `${_}-trigger`, y = `${_}-panel`, b = a(() => {
+		f.current && g(f.current.scrollHeight);
 	}, []);
-	return i(() => {
-		g();
-		let e = d.current;
+	return o(() => {
+		b();
+		let e = f.current;
 		if (!e) return;
-		let t = new ResizeObserver(g);
+		let t = new ResizeObserver(b);
 		return t.observe(e), () => t.disconnect();
-	}, [g]), /* @__PURE__ */ p("div", {
-		ref: u,
-		className: P(Q.item, o && Q.inactive, s),
-		children: [/* @__PURE__ */ p("button", {
+	}, [b]), /* @__PURE__ */ h("div", {
+		ref: l,
+		className: F(Dt.item, i && Dt.inactive, c),
+		children: [/* @__PURE__ */ h("button", {
 			type: "button",
-			className: Q.trigger,
-			onClick: () => !o && a?.(),
+			id: v,
+			className: Dt.trigger,
+			onClick: () => !i && r?.(),
 			"aria-expanded": n,
-			tabIndex: o ? -1 : 0,
-			children: [/* @__PURE__ */ f(w, {
+			"aria-controls": y,
+			"aria-disabled": i || void 0,
+			tabIndex: i ? -1 : 0,
+			children: [/* @__PURE__ */ m(E, {
 				variant: "text-body-medium-emphasis",
 				as: "span",
 				color: "inherit",
 				children: e
-			}), /* @__PURE__ */ f("span", {
-				className: P(Q.chevron, n && Q.chevronOpen),
+			}), /* @__PURE__ */ m("span", {
+				className: F(Dt.chevron, n && Dt.chevronOpen),
 				children: "›"
 			})]
-		}), /* @__PURE__ */ f("div", {
-			className: Q.body,
-			style: { height: n ? m : 0 },
+		}), /* @__PURE__ */ m("div", {
+			id: y,
+			role: "region",
+			"aria-labelledby": v,
+			className: Dt.body,
+			style: { height: n ? p : 0 },
 			"aria-hidden": !n,
-			children: /* @__PURE__ */ f("div", {
-				ref: d,
-				className: Q.bodyInner,
+			children: /* @__PURE__ */ m("div", {
+				ref: f,
+				className: Dt.bodyInner,
 				children: t
 			})
 		})]
 	});
 });
-St.displayName = "AccordionItem";
-var Ct = {
+kt.displayName = "AccordionItem";
+var At = {
 	breadcrumb: "_breadcrumb_1xq6b_1",
 	list: "_list_1xq6b_6",
 	item: "_item_1xq6b_15",
 	link: "_link_1xq6b_21",
 	separator: "_separator_1xq6b_41"
-}, wt = n(({ items: e, separator: t = "/", className: n }, r) => /* @__PURE__ */ f("nav", {
+}, jt = r(({ items: e, separator: t = "/", className: n }, r) => /* @__PURE__ */ m("nav", {
 	ref: r,
 	"aria-label": "Breadcrumb",
-	className: P(Ct.breadcrumb, n),
-	children: /* @__PURE__ */ f("ol", {
-		className: Ct.list,
+	className: F(At.breadcrumb, n),
+	children: /* @__PURE__ */ m("ol", {
+		className: At.list,
 		children: e.map((n, r) => {
 			let i = r === e.length - 1;
-			return /* @__PURE__ */ f("li", {
-				className: Ct.item,
-				children: i ? /* @__PURE__ */ f(w, {
+			return /* @__PURE__ */ m("li", {
+				className: At.item,
+				children: i ? /* @__PURE__ */ m(E, {
 					variant: "text-body-medium-emphasis",
 					as: "span",
 					color: "primary",
 					"aria-current": "page",
 					children: n.label
-				}) : /* @__PURE__ */ p(d, { children: [n.href ? /* @__PURE__ */ f("a", {
+				}) : /* @__PURE__ */ h(p, { children: [n.href ? /* @__PURE__ */ m("a", {
 					href: n.href,
-					className: Ct.link,
+					className: At.link,
 					onClick: (e) => {
 						n.onClick && (e.preventDefault(), n.onClick());
 					},
-					children: /* @__PURE__ */ f(w, {
+					children: /* @__PURE__ */ m(E, {
 						variant: "text-body-medium",
 						as: "span",
 						color: "inherit",
 						children: n.label
 					})
-				}) : /* @__PURE__ */ f("button", {
+				}) : /* @__PURE__ */ m("button", {
 					type: "button",
-					className: Ct.link,
+					className: At.link,
 					onClick: n.onClick,
-					children: /* @__PURE__ */ f(w, {
+					children: /* @__PURE__ */ m(E, {
 						variant: "text-body-medium",
 						as: "span",
 						color: "inherit",
 						children: n.label
 					})
-				}), /* @__PURE__ */ f("span", {
-					className: Ct.separator,
+				}), /* @__PURE__ */ m("span", {
+					className: At.separator,
 					"aria-hidden": "true",
 					children: t
 				})] })
@@ -2224,8 +2683,8 @@ var Ct = {
 		})
 	})
 }));
-wt.displayName = "Breadcrumb";
-var $ = {
+jt.displayName = "Breadcrumb";
+var Mt = {
 	pagination: "_pagination_ax4c0_1",
 	inactive: "_inactive_ax4c0_9",
 	button: "_button_ax4c0_16",
@@ -2235,82 +2694,82 @@ var $ = {
 };
 //#endregion
 //#region src/components/Pagination/Pagination.tsx
-function Tt(e, t) {
+function Nt(e, t) {
 	let n = [];
 	for (let r = e; r <= t; r++) n.push(r);
 	return n;
 }
-function Et(e, t, n) {
-	if (t <= n * 2 + 5) return Tt(1, t);
+function Pt(e, t, n) {
+	if (t <= n * 2 + 5) return Nt(1, t);
 	let r = Math.max(e - n, 2), i = Math.min(e + n, t - 1), a = r > 2, o = i < t - 1;
 	return !a && o ? [
-		...Tt(1, n * 2 + 3),
+		...Nt(1, n * 2 + 3),
 		"ellipsis",
 		t
 	] : a && !o ? [
 		1,
 		"ellipsis",
-		...Tt(t - (n * 2 + 2), t)
+		...Nt(t - (n * 2 + 2), t)
 	] : [
 		1,
 		"ellipsis",
-		...Tt(r, i),
+		...Nt(r, i),
 		"ellipsis",
 		t
 	];
 }
-var Dt = n(({ page: e, totalPages: t, onPageChange: n, siblingCount: r = 1, inactive: i = !1, className: a }, o) => {
-	let c = s(() => Et(e, t, r), [
+var Ft = r(({ page: e, totalPages: t, onPageChange: n, siblingCount: r = 1, inactive: i = !1, className: a }, o) => {
+	let s = l(() => Pt(e, t, r), [
 		e,
 		t,
 		r
 	]);
-	return t <= 1 ? null : /* @__PURE__ */ p("nav", {
+	return t <= 1 ? null : /* @__PURE__ */ h("nav", {
 		ref: o,
 		"aria-label": "Pagination",
-		className: P($.pagination, i && $.inactive, a),
+		className: F(Mt.pagination, i && Mt.inactive, a),
 		children: [
-			/* @__PURE__ */ f("button", {
+			/* @__PURE__ */ m("button", {
 				type: "button",
-				className: P($.button, $.nav),
+				className: F(Mt.button, Mt.nav),
 				disabled: e <= 1 || i,
 				onClick: () => n(e - 1),
 				"aria-label": "Previous page",
-				children: /* @__PURE__ */ f(w, {
+				children: /* @__PURE__ */ m(E, {
 					variant: "text-body-small",
 					as: "span",
 					color: "inherit",
 					children: "‹"
 				})
 			}),
-			c.map((t, r) => t === "ellipsis" ? /* @__PURE__ */ f("span", {
-				className: $.ellipsis,
-				children: /* @__PURE__ */ f(w, {
+			s.map((t, r) => t === "ellipsis" ? /* @__PURE__ */ m("span", {
+				className: Mt.ellipsis,
+				children: /* @__PURE__ */ m(E, {
 					variant: "text-body-small",
 					as: "span",
 					color: "tertiary",
 					children: "…"
 				})
-			}, `e${r}`) : /* @__PURE__ */ f("button", {
+			}, `e${r}`) : /* @__PURE__ */ m("button", {
 				type: "button",
-				className: P($.button, t === e && $.active),
+				className: F(Mt.button, t === e && Mt.active),
 				onClick: () => n(t),
 				"aria-current": t === e ? "page" : void 0,
 				disabled: i,
-				children: /* @__PURE__ */ f(w, {
+				children: /* @__PURE__ */ m(E, {
 					variant: t === e ? "text-body-small-emphasis" : "text-body-small",
 					as: "span",
 					color: "inherit",
 					children: t
 				})
 			}, t)),
-			/* @__PURE__ */ f("button", {
+			/* @__PURE__ */ m("button", {
 				type: "button",
-				className: P($.button, $.nav),
+				className: F(Mt.button, Mt.nav),
 				disabled: e >= t || i,
 				onClick: () => n(e + 1),
 				"aria-label": "Next page",
-				children: /* @__PURE__ */ f(w, {
+				children: /* @__PURE__ */ m(E, {
 					variant: "text-body-small",
 					as: "span",
 					color: "inherit",
@@ -2320,18 +2779,18 @@ var Dt = n(({ page: e, totalPages: t, onPageChange: n, siblingCount: r = 1, inac
 		]
 	});
 });
-Dt.displayName = "Pagination";
-var Ot = {
+Ft.displayName = "Pagination";
+var It = {
 	divider: "_divider_yo1st_1",
 	vertical: "_vertical_yo1st_9"
-}, kt = n(({ orientation: e = "horizontal", className: t }, n) => /* @__PURE__ */ f("hr", {
+}, Lt = r(({ orientation: e = "horizontal", className: t }, n) => /* @__PURE__ */ m("hr", {
 	ref: n,
 	role: "separator",
 	"aria-orientation": e,
-	className: P(Ot.divider, e === "vertical" && Ot.vertical, t)
+	className: F(It.divider, e === "vertical" && It.vertical, t)
 }));
-kt.displayName = "Divider";
-var At = {
+Lt.displayName = "Divider";
+var Rt = {
 	skeleton: "_skeleton_gebkr_1",
 	text: "_text_gebkr_9",
 	circular: "_circular_gebkr_15",
@@ -2339,28 +2798,28 @@ var At = {
 	textGroup: "_textGroup_gebkr_29",
 	animate: "_animate_gebkr_37",
 	shimmer: "_shimmer_gebkr_1"
-}, jt = n(({ variant: e = "text", width: t, height: n, lines: r = 1, animate: i = !0, className: a }, o) => e === "text" && r > 1 ? /* @__PURE__ */ f("div", {
+}, zt = r(({ variant: e = "text", width: t, height: n, lines: r = 1, animate: i = !0, className: a }, o) => e === "text" && r > 1 ? /* @__PURE__ */ m("div", {
 	ref: o,
-	className: P(At.textGroup, a),
+	className: F(Rt.textGroup, a),
 	style: { width: t },
-	children: Array.from({ length: r }, (e, t) => /* @__PURE__ */ f("div", {
-		className: P(At.skeleton, At.text, i && At.animate),
+	children: Array.from({ length: r }, (e, t) => /* @__PURE__ */ m("div", {
+		className: F(Rt.skeleton, Rt.text, i && Rt.animate),
 		style: {
 			width: t === r - 1 ? "60%" : "100%",
 			height: n
 		}
 	}, t))
-}) : /* @__PURE__ */ f("div", {
+}) : /* @__PURE__ */ m("div", {
 	ref: o,
-	className: P(At.skeleton, At[e], i && At.animate, a),
+	className: F(Rt.skeleton, Rt[e], i && Rt.animate, a),
 	style: {
 		width: t,
 		height: n
 	},
 	"aria-hidden": "true"
 }));
-jt.displayName = "Skeleton";
-var Mt = {
+zt.displayName = "Skeleton";
+var Bt = {
 	container: "_container_ssyox_3",
 	topCenter: "_topCenter_ssyox_16",
 	topRight: "_topRight_ssyox_23",
@@ -2371,114 +2830,131 @@ var Mt = {
 	toastExit: "_toastExit_ssyox_54",
 	fadeOut: "_fadeOut_ssyox_1",
 	dismiss: "_dismiss_ssyox_58"
-}, Nt = [], Pt = /* @__PURE__ */ new Set();
-function Ft() {
-	Pt.forEach((e) => e());
+}, Vt = [], Ht = /* @__PURE__ */ new Set();
+function Ut() {
+	Ht.forEach((e) => e());
 }
-function It() {
-	return Nt;
+function Wt() {
+	return Vt;
 }
-function Lt(e) {
-	return Pt.add(e), () => {
-		Pt.delete(e);
+function Gt(e) {
+	return Ht.add(e), () => {
+		Ht.delete(e);
 	};
 }
-var Rt = 0, zt = {
+var Kt = 0, qt = {
 	show(e) {
-		let t = `toast-${++Rt}`;
-		return Nt = [...Nt, {
+		let t = `toast-${++Kt}`;
+		return Vt = [...Vt, {
 			id: t,
 			...e
-		}], Ft(), t;
+		}], Ut(), t;
 	},
 	info(e, t) {
-		return zt.show({
+		return qt.show({
 			message: e,
 			intent: "neutral",
 			...t
 		});
 	},
 	success(e, t) {
-		return zt.show({
+		return qt.show({
 			message: e,
 			intent: "positive",
 			...t
 		});
 	},
 	error(e, t) {
-		return zt.show({
+		return qt.show({
 			message: e,
 			intent: "negative",
 			...t
 		});
 	},
 	warning(e, t) {
-		return zt.show({
+		return qt.show({
 			message: e,
 			intent: "warning",
 			...t
 		});
 	},
 	dismiss(e) {
-		Nt = Nt.filter((t) => t.id !== e), Ft();
+		Vt = Vt.filter((t) => t.id !== e), Ut();
 	},
 	dismissAll() {
-		Nt = [], Ft();
+		Vt = [], Ut();
 	}
 };
-function Bt() {
-	return u(Lt, It, It);
+function Jt() {
+	return f(Gt, Wt, Wt);
 }
-var Vt = {
+var Yt = {
 	neutral: "neutral",
 	brand: "brand",
 	positive: "positive",
 	negative: "negative",
 	warning: "warning",
 	caution: "caution"
-}, Ht = ({ data: e }) => {
-	let [t, n] = l(!1), a = c(void 0), o = r(() => {
+}, Xt = ({ data: e }) => {
+	let [t, n] = d(!1), r = u(void 0), i = u(e.duration ?? 4e3), s = u(0), c = u(!1), l = a(() => {
 		n(!0), setTimeout(() => {
-			zt.dismiss(e.id), e.onDismiss?.();
+			qt.dismiss(e.id), e.onDismiss?.();
 		}, 200);
-	}, [e]);
-	return i(() => {
-		let t = e.duration ?? 4e3;
-		return t > 0 && (a.current = setTimeout(o, t)), () => {
-			a.current && clearTimeout(a.current);
-		};
-	}, [e.duration, o]), /* @__PURE__ */ p(M, {
-		intent: Vt[e.intent ?? "neutral"],
+	}, [e]), f = a(() => {
+		r.current &&= (clearTimeout(r.current), void 0);
+	}, []), p = a((e) => {
+		e <= 0 || (s.current = Date.now(), r.current = setTimeout(l, e));
+	}, [l]), g = a(() => {
+		if (c.current || !r.current) return;
+		c.current = !0;
+		let e = Date.now() - s.current;
+		i.current = Math.max(0, i.current - e), f();
+	}, [f]), _ = a(() => {
+		c.current && (c.current = !1, p(i.current));
+	}, [p]);
+	o(() => (i.current = e.duration ?? 4e3, c.current = !1, p(i.current), f), [
+		e.duration,
+		p,
+		f
+	]);
+	let v = e.intent === "negative";
+	return /* @__PURE__ */ h(N, {
+		intent: Yt[e.intent ?? "neutral"],
 		contrast: "bold",
 		elevation: "floating",
 		radius: "lg",
-		className: P(Mt.toast, t && Mt.toastExit),
-		role: "status",
-		"aria-live": "polite",
-		children: [/* @__PURE__ */ f(w, {
+		className: F(Bt.toast, t && Bt.toastExit),
+		role: v ? "alert" : "status",
+		"aria-live": v ? "assertive" : "polite",
+		onMouseEnter: g,
+		onMouseLeave: _,
+		onFocus: g,
+		onBlur: _,
+		children: [/* @__PURE__ */ m(E, {
 			variant: "text-body-medium",
 			as: "span",
 			color: "inherit",
 			children: e.message
-		}), /* @__PURE__ */ f("button", {
+		}), /* @__PURE__ */ m("button", {
 			type: "button",
-			className: Mt.dismiss,
-			onClick: o,
+			className: Bt.dismiss,
+			onClick: l,
 			"aria-label": "Dismiss",
 			children: "×"
 		})]
 	});
-}, Ut = n(({ position: e = "top-center" }, t) => {
-	let n = Bt();
-	return typeof document > "u" ? null : g.createPortal(/* @__PURE__ */ f("div", {
+}, Zt = r(({ position: e = "top-center" }, t) => {
+	let n = Jt();
+	return typeof document > "u" ? null : v.createPortal(/* @__PURE__ */ m("div", {
 		ref: t,
-		className: P(Mt.container, Mt[Wt(e)]),
+		className: F(Bt.container, Bt[Qt(e)]),
+		role: "region",
 		"aria-label": "Notifications",
-		children: n.map((e) => /* @__PURE__ */ f(Ht, { data: e }, e.id))
+		children: n.map((e) => /* @__PURE__ */ m(Xt, { data: e }, e.id))
 	}), document.body);
 });
-Ut.displayName = "ToastContainer";
-function Wt(e) {
+Zt.displayName = "ToastContainer";
+function Qt(e) {
 	switch (e) {
 		case "top-center": return "topCenter";
 		case "top-right": return "topRight";
@@ -2487,6 +2963,6 @@ function Wt(e) {
 	}
 }
 //#endregion
-export { xt as Accordion, St as AccordionItem, pe as Badge, Ge as Banner, wt as Breadcrumb, re as Button, se as ButtonGroup, I as Card, _e as Checkbox, Oe as DestructiveMenuItem, kt as Divider, $e as EmptyState, ot as ErrorBoundary, nt as Fade, Se as Field, ht as Header, ye as Input, z as Loader, Ne as Menu, Ee as MenuItem, Te as Modal, Dt as Pagination, _t as RadioGroup, vt as RadioItem, it as Scrollbar, Ve as Select, dt as Sidebar, pt as SidebarItem, ft as SidebarSection, jt as Skeleton, be as Slider, M as Surface, Xe as Tab, bt as TabGroup, Je as Table, de as Tag, w as Text, Ut as ToastContainer, he as Toggle, oe as ToggleButton, ce as ToggleButtonGroup, ze as Tooltip, zt as toast, Bt as useToasts };
+export { Ot as Accordion, kt as AccordionItem, fe as Badge, Je as Banner, jt as Breadcrumb, ie as Button, K as ButtonGroup, R as Card, ge as Checkbox, je as DestructiveMenuItem, Lt as Divider, nt as EmptyState, lt as ErrorBoundary, at as Fade, Se as Field, xt as Header, ye as Input, ne as Loader, Ie as Menu, ke as MenuItem, Oe as Modal, Ft as Pagination, Ct as RadioGroup, wt as RadioItem, st as Scrollbar, We as Select, _t as Sidebar, yt as SidebarItem, vt as SidebarSection, zt as Skeleton, be as Slider, N as Surface, $e as Tab, Et as TabGroup, Ze as Table, ue as Tag, E as Text, Zt as ToastContainer, me as Toggle, oe as ToggleButton, se as ToggleButtonGroup, He as Tooltip, qt as toast, Jt as useToasts };
 
 //# sourceMappingURL=index.js.map