themelia-ui 1.0.3 → 2.0.0

package/dist/{navigation-kNABvpYb.js → navigation-D00jGH59.js}

@@ -1,18 +1,19 @@
 import "./css/navigation.css";
 import { t as e } from "./cvm-DtsCA8iZ.js";
 import { t } from "./cx--CBrhWH0.js";
-import { a as n, i as r, o as i } from "./typography-vC_wwEBm.js";
-import { c as a } from "./buttons-bYhZyhqF.js";
-import { a as o, g as s, r as c, t as l } from "./dropdown-menu-BrnmY0Tz.js";
-import { d as u, m as d, v as f } from "./display-COvC2663.js";
-import { t as p } from "./badge-DwsR_WXN.js";
+import { a as n, i as r, o as i } from "./typography-B8Iurhy1.js";
+import { c as a } from "./buttons-Corm-KHK.js";
+import { a as o, g as s, r as c, t as l } from "./dropdown-menu-CIXxWTpw.js";
+import { d as u, m as d, v as f } from "./display-DVhYS75K.js";
+import { t as p } from "./badge-D34FkKLD.js";
 import { i as m, t as h } from "./observers-CKohiJqU.js";
 import { t as g } from "./strings-Co9_qArR.js";
-import { n as _ } from "./path-_-vHPVht.js";
-import { r as v } from "./choice-inputs-CxtZUW1g.js";
-import { CheckIcon as y, ChevronLeftIcon as b, ChevronRightIcon as x, GlobeIcon as S } from "lucide-react";
-import * as C from "react";
-import { useCallback as w, useEffect as T, useRef as E, useState as D } from "react";
+import { n as _, t as v } from "./scroll-edges-CWjEJktN.js";
+import { n as y } from "./navigation-Db1UQSIU.js";
+import { r as b } from "./choice-inputs-Ca9PoQwa.js";
+import { CheckIcon as x, ChevronLeftIcon as S, ChevronRightIcon as C, GlobeIcon as w } from "lucide-react";
+import * as T from "react";
+import { useId as E, useRef as D } from "react";
 import { Fragment as O, jsx as k, jsxs as A } from "react/jsx-runtime";
 //#region src/components/base/navigation/navigation.strings.ts
 var j = {
@@ -25,56 +26,56 @@ var j = {
 	previous: "Scroll tabs backward",
 	next: "Scroll tabs forward"
 }, F = {
-	tabs: "navigation-module__tabs___-enSM",
-	tabRail: "navigation-module__tabRail___0WjkF",
-	tabScroll: "navigation-module__tabScroll___qNR1l",
-	tabList: "navigation-module__tabList___5Fa7y",
-	tabListEnclosed: "navigation-module__tabListEnclosed___wctvT",
-	tab: "navigation-module__tab___g97ST",
-	tabPanel: "navigation-module__tabPanel___08h-9",
-	breadcrumb: "navigation-module__breadcrumb___qyZfR",
-	breadcrumbItem: "navigation-module__breadcrumbItem___5u08X",
-	breadcrumbLink: "navigation-module__breadcrumbLink___zUmx3",
-	breadcrumbCurrent: "navigation-module__breadcrumbCurrent___h5VBO",
-	breadcrumbSeparator: "navigation-module__breadcrumbSeparator___QyWbu",
-	pagination: "navigation-module__pagination___AxCQd",
-	paginationArrowWord: "navigation-module__paginationArrowWord___ZPUSr",
-	paginationEllipsis: "navigation-module__paginationEllipsis___5Amyh",
-	pageHeading: "navigation-module__pageHeading___PyUy2",
-	pageHeadingCrumbs: "navigation-module__pageHeadingCrumbs___VLzP4",
-	pageHeadingRow: "navigation-module__pageHeadingRow___5ymya",
-	pageHeadingLeading: "navigation-module__pageHeadingLeading___73HDa",
-	pageHeadingMain: "navigation-module__pageHeadingMain___KQBw8",
-	pageHeadingGrid: "navigation-module__pageHeadingGrid___pPC2H",
-	pageHeadingPrefix: "navigation-module__pageHeadingPrefix___wmh5B",
-	pageHeadingBlock: "navigation-module__pageHeadingBlock___Zwpv0",
-	pageHeadingHeadline: "navigation-module__pageHeadingHeadline___Th0gE",
-	pageHeadingTitleRow: "navigation-module__pageHeadingTitleRow___qgNWD",
-	pageHeadingTitle: "navigation-module__pageHeadingTitle___rqEeb",
-	pageHeadingBadges: "navigation-module__pageHeadingBadges___kv--P",
-	pageHeadingActions: "navigation-module__pageHeadingActions___B3695",
-	pageHeadingDescription: "navigation-module__pageHeadingDescription___QBaWn",
-	pageHeadingChildren: "navigation-module__pageHeadingChildren___-lkUM",
-	pageHeadingSeparator: "navigation-module__pageHeadingSeparator___Neehr",
-	tabBar: "navigation-module__tabBar___muLkj",
-	tabBarWrap: "navigation-module__tabBarWrap___58XhB",
-	tabBarItem: "navigation-module__tabBarItem___OU13T"
-}, I = C.createContext(null);
+	tabs: "navigation__tabs___MoJyv",
+	tabRail: "navigation__tabRail___fkXu3",
+	tabScroll: "navigation__tabScroll___6MKV9",
+	tabList: "navigation__tabList___6fCJE",
+	tabListEnclosed: "navigation__tabListEnclosed___RpZu7",
+	tabsPill: "navigation__tabsPill___Ug0fU",
+	tab: "navigation__tab___o1EUP",
+	tabPanel: "navigation__tabPanel___aUaAn",
+	breadcrumb: "navigation__breadcrumb___eRfAg",
+	breadcrumbItem: "navigation__breadcrumbItem___shfye",
+	breadcrumbLink: "navigation__breadcrumbLink___zHDIh",
+	breadcrumbCurrent: "navigation__breadcrumbCurrent___9BQhW",
+	breadcrumbSeparator: "navigation__breadcrumbSeparator___2Okqy",
+	pagination: "navigation__pagination___QauKM",
+	paginationArrowWord: "navigation__paginationArrowWord___rmxzx",
+	paginationEllipsis: "navigation__paginationEllipsis___MEC8A",
+	pageHeading: "navigation__pageHeading___R7jSV",
+	pageHeadingCrumbs: "navigation__pageHeadingCrumbs___0JeR1",
+	pageHeadingRow: "navigation__pageHeadingRow___1SVff",
+	pageHeadingLeading: "navigation__pageHeadingLeading___Ydk6o",
+	pageHeadingMain: "navigation__pageHeadingMain___c9iIe",
+	pageHeadingGrid: "navigation__pageHeadingGrid___D0Ddi",
+	pageHeadingPrefix: "navigation__pageHeadingPrefix___Ef0P3",
+	pageHeadingBlock: "navigation__pageHeadingBlock___Wpd1x",
+	pageHeadingHeadline: "navigation__pageHeadingHeadline___8cftu",
+	pageHeadingActions: "navigation__pageHeadingActions___xyJOE",
+	pageHeadingTitleRow: "navigation__pageHeadingTitleRow___77qXV",
+	pageHeadingTitle: "navigation__pageHeadingTitle___wqE4c",
+	pageHeadingBadges: "navigation__pageHeadingBadges___ByzY3",
+	pageHeadingDescription: "navigation__pageHeadingDescription___cCQrC",
+	pageHeadingChildren: "navigation__pageHeadingChildren___0CTs2",
+	pageHeadingSeparator: "navigation__pageHeadingSeparator___yGoaX",
+	tabBar: "navigation__tabBar___WTgSO",
+	tabBarWrap: "navigation__tabBarWrap___kohcY"
+}, I = T.createContext(null);
 function L(e) {
-	let t = C.useContext(I);
+	let t = T.useContext(I);
 	if (!t) throw Error(`<${e}> must be used within <Tabs>`);
 	return t;
 }
 function R({ value: e, defaultValue: n = "", onValueChange: r, className: i, children: a, ...o }) {
-	let [s, c] = C.useState(n), l = e !== void 0, u = l ? e : s, d = C.useId(), f = C.useCallback((e) => {
+	let [s, c] = T.useState(n), l = e !== void 0, u = l ? e : s, d = T.useId(), f = T.useCallback((e) => {
 		l || c(e), r?.(e);
-	}, [l, r]), [p, m] = C.useState(() => /* @__PURE__ */ new Set()), h = C.useCallback((e) => (m((t) => {
+	}, [l, r]), [p, m] = T.useState(() => /* @__PURE__ */ new Set()), h = T.useCallback((e) => (m((t) => {
 		let n = new Set(t);
 		return n.add(e), n;
 	}), () => m((t) => {
 		let n = new Set(t);
 		return n.delete(e), n;
-	})), []), g = C.useMemo(() => ({
+	})), []), g = T.useMemo(() => ({
 		value: u,
 		setValue: f,
 		id: d,
@@ -100,37 +101,38 @@ function R({ value: e, defaultValue: n = "", onValueChange: r, className: i, chi
 var z = e(F.tabList, {
 	variants: { variant: {
 		underline: void 0,
-		enclosed: F.tabListEnclosed
+		enclosed: F.tabListEnclosed,
+		pill: F.tabsPill
 	} },
 	defaultVariants: { variant: "underline" }
 });
 function B({ variant: e, label: n, edgeFade: r = !1, strings: i, className: o, children: s, ref: c, onKeyDown: l, onScroll: u, id: f, ...p }) {
-	let _ = C.useRef(null), v = C.useRef(null), y = C.useId(), S = f ?? y, { value: w } = L("TabList"), T = g(P, i), [E, D] = C.useState({
+	let _ = T.useRef(null), y = T.useRef(null), b = T.useId(), x = f ?? b, { value: w } = L("TabList"), E = g(P, i), [D, O] = T.useState({
 		overflow: !1,
 		previous: !1,
 		next: !1
 	});
-	C.useImperativeHandle(c, () => _.current);
-	let O = C.useCallback(() => {
-		let e = _.current, t = v.current;
+	T.useImperativeHandle(c, () => _.current);
+	let j = T.useCallback(() => {
+		let e = _.current, t = y.current;
 		if (!e || !t) return;
-		let n = getComputedStyle(e), r = t.clientWidth - (parseFloat(n.marginLeft) || 0) - (parseFloat(n.marginRight) || 0), i = e.scrollWidth > r + 1, a = Math.max(0, e.scrollWidth - e.clientWidth), o = Math.abs(e.scrollLeft), s = {
+		let n = getComputedStyle(e), r = t.clientWidth - (parseFloat(n.marginLeft) || 0) - (parseFloat(n.marginRight) || 0), i = e.scrollWidth > r + 1, { start: a, end: o } = v(e), s = {
 			overflow: i,
-			previous: o > 1,
-			next: o < a - 1
+			previous: a,
+			next: o
 		};
-		D((e) => e.overflow === s.overflow && e.previous === s.previous && e.next === s.next ? e : s);
-	}, []), j = C.useCallback(() => {
+		O((e) => e.overflow === s.overflow && e.previous === s.previous && e.next === s.next ? e : s);
+	}, []), M = T.useCallback(() => {
 		let e = _.current, t = e?.querySelector("[role=\"tab\"][aria-selected=\"true\"]");
 		if (!e || !t) return;
-		let n = e.getBoundingClientRect(), r = t.getBoundingClientRect(), i = getComputedStyle(e), a = n.left + (parseFloat(i.paddingLeft) || 0), o = n.right - (parseFloat(i.paddingRight) || 0);
-		r.left < a ? e.scrollLeft += r.left - a : r.right > o && (e.scrollLeft += r.right - o), O();
-	}, [O]);
-	C.useEffect(() => {
-		let e = _.current, t = v.current;
+		let n = e.getBoundingClientRect(), i = t.getBoundingClientRect(), a = getComputedStyle(e), o = r && parseFloat(a.scrollPaddingInlineStart) || 0, s = n.left + (parseFloat(a.paddingLeft) || 0) + o, c = n.right - (parseFloat(a.paddingRight) || 0) - o;
+		i.left < s ? e.scrollLeft += i.left - s : i.right > c && (e.scrollLeft += i.right - c), j();
+	}, [r, j]);
+	T.useEffect(() => {
+		let e = _.current, t = y.current;
 		if (!e || !t) return;
 		let n = () => {
-			O(), j();
+			j(), M();
 		}, r = m([
 			t,
 			e,
@@ -139,14 +141,14 @@ function B({ variant: e, label: n, edgeFade: r = !1, strings: i, className: o, c
 		return n(), r;
 	}, [
 		s,
-		O,
-		j
-	]), C.useEffect(j, [
+		j,
+		M
+	]), T.useEffect(M, [
 		w,
-		E.overflow,
-		j
+		D.overflow,
+		M
 	]);
-	let M = (e) => {
+	let N = (e) => {
 		let t = _.current;
 		if (!t) return;
 		let n = getComputedStyle(t).direction === "rtl" ? -1 : 1;
@@ -156,29 +158,29 @@ function B({ variant: e, label: n, edgeFade: r = !1, strings: i, className: o, c
 		});
 	};
 	return /* @__PURE__ */ A("div", {
-		ref: v,
+		ref: y,
 		className: t("tabs--rail", F.tabRail),
 		children: [
-			E.overflow && /* @__PURE__ */ k(a, {
+			D.overflow && /* @__PURE__ */ k(a, {
 				iconOnly: !0,
 				tone: "neutral",
 				buttonStyle: "ghost",
 				className: F.tabScroll,
-				"aria-label": T.previous,
-				"aria-controls": S,
-				disabled: !E.previous,
-				onClick: () => M(-1),
-				children: /* @__PURE__ */ k(b, {})
+				"aria-label": E.previous,
+				"aria-controls": x,
+				disabled: !D.previous,
+				onClick: () => N(-1),
+				children: /* @__PURE__ */ k(S, {})
 			}),
 			/* @__PURE__ */ k(d, {
 				ref: _,
-				id: S,
+				id: x,
 				tabIndex: -1,
 				role: "tablist",
 				"aria-label": n,
 				"data-slot": "tab-list",
-				"data-fade-start": r && E.overflow && E.previous ? "" : void 0,
-				"data-fade-end": r && E.overflow && E.next ? "" : void 0,
+				"data-fade-start": r && D.overflow && D.previous ? "" : void 0,
+				"data-fade-end": r && D.overflow && D.next ? "" : void 0,
 				className: t("tabs--list", z({ variant: e }), o),
 				onKeyDown: (e) => {
 					if (l?.(e), e.defaultPrevented || ![
@@ -193,21 +195,21 @@ function B({ variant: e, label: n, edgeFade: r = !1, strings: i, className: o, c
 					e.key === (i ? "ArrowRight" : "ArrowLeft") ? r = n <= 0 ? t.length - 1 : n - 1 : e.key === (i ? "ArrowLeft" : "ArrowRight") ? r = n === t.length - 1 ? 0 : n + 1 : e.key === "Home" ? r = 0 : e.key === "End" && (r = t.length - 1), e.preventDefault(), t[r]?.focus({ preventScroll: !0 }), t[r]?.click();
 				},
 				onScroll: (e) => {
-					O(), u?.(e);
+					j(), u?.(e);
 				},
 				...p,
 				children: s
 			}),
-			E.overflow && /* @__PURE__ */ k(a, {
+			D.overflow && /* @__PURE__ */ k(a, {
 				iconOnly: !0,
 				tone: "neutral",
 				buttonStyle: "ghost",
 				className: F.tabScroll,
-				"aria-label": T.next,
-				"aria-controls": S,
-				disabled: !E.next,
-				onClick: () => M(1),
-				children: /* @__PURE__ */ k(x, {})
+				"aria-label": E.next,
+				"aria-controls": x,
+				disabled: !D.next,
+				onClick: () => N(1),
+				children: /* @__PURE__ */ k(C, {})
 			})
 		]
 	});
@@ -231,7 +233,7 @@ function V({ value: e, className: n, onClick: r, ...i }) {
 }
 function H({ value: e, className: n, children: r, ...i }) {
 	let { value: a, id: o, registerPanel: s } = L("TabPanel");
-	return C.useEffect(() => s(e), [s, e]), a === e ? /* @__PURE__ */ k("div", {
+	return T.useEffect(() => s(e), [s, e]), a === e ? /* @__PURE__ */ k("div", {
 		role: "tabpanel",
 		id: `${o}-panel-${e}`,
 		"aria-labelledby": `${o}-tab-${e}`,
@@ -260,7 +262,7 @@ function U({ items: e, separator: n, label: r, strings: a, className: o, ...s })
 					className: F.breadcrumbCurrent,
 					"aria-current": "page",
 					children: r.label
-				}) : r.render ? C.cloneElement(r.render, {
+				}) : r.render ? T.cloneElement(r.render, {
 					className: t(F.breadcrumbLink, r.render.props.className),
 					children: r.label,
 					"data-hit-area": ""
@@ -271,6 +273,7 @@ function U({ items: e, separator: n, label: r, strings: a, className: o, ...s })
 					children: /* @__PURE__ */ k(i, {
 						tag: "span",
 						size: "sm",
+						type: "inherit",
 						children: r.label
 					})
 				});
@@ -279,7 +282,7 @@ function U({ items: e, separator: n, label: r, strings: a, className: o, ...s })
 					children: [s, !o && /* @__PURE__ */ k("span", {
 						className: F.breadcrumbSeparator,
 						"aria-hidden": !0,
-						children: n ?? /* @__PURE__ */ k(x, {})
+						children: n ?? /* @__PURE__ */ k(C, {})
 					})]
 				}, a);
 			})
@@ -305,16 +308,27 @@ function G({ page: e, total: n, onPageChange: r, disabled: i = !1, siblings: o =
 		let u = i || o, d = (t) => {
 			if (u) return t.preventDefault();
 			r(e);
-		};
-		return l && !u ? l(e, {
-			"aria-label": t,
-			"aria-current": n ? "page" : void 0,
-			onClick: d,
-			children: s
-		}) : /* @__PURE__ */ k(a, {
+		}, f = n ? "page" : void 0;
+		if (l && !u) {
+			let n = l(e, {
+				"aria-label": t,
+				"aria-current": f,
+				onClick: d,
+				children: s
+			});
+			return T.isValidElement(n) ? /* @__PURE__ */ k(a, {
+				"aria-label": t,
+				"aria-current": f,
+				render: n,
+				...c,
+				children: s
+			}) : n;
+		}
+		return /* @__PURE__ */ k(a, {
 			"aria-label": t,
-			"aria-current": n ? "page" : void 0,
-			disabled: u,
+			"aria-current": f,
+			disabled: i || void 0,
+			"aria-disabled": !i && !!o || void 0,
 			onClick: d,
 			...c,
 			children: s
@@ -330,6 +344,7 @@ function G({ page: e, total: n, onPageChange: r, disabled: i = !1, siblings: o =
 		...p,
 		children: /* @__PURE__ */ A("div", {
 			className: F.pagination,
+			"data-labels": s,
 			children: [
 				g(e - 1, {
 					label: m.previous,
@@ -337,13 +352,13 @@ function G({ page: e, total: n, onPageChange: r, disabled: i = !1, siblings: o =
 					tone: "neutral",
 					buttonStyle: "ghost",
 					iconOnly: !_,
-					children: /* @__PURE__ */ A(O, { children: [/* @__PURE__ */ k(b, {}), _ && v(m.previous)] })
+					children: /* @__PURE__ */ A(O, { children: [/* @__PURE__ */ k(S, {}), _ && v(m.previous)] })
 				}),
-				h.map((t, n) => t === null ? /* @__PURE__ */ A(C.Fragment, { children: [/* @__PURE__ */ k("span", {
+				h.map((t, n) => t === null ? /* @__PURE__ */ A(T.Fragment, { children: [/* @__PURE__ */ k("span", {
 					className: F.paginationEllipsis,
 					"aria-hidden": !0,
 					children: "…"
-				}), /* @__PURE__ */ k(u, { children: m.morePages })] }, `gap-${n}`) : /* @__PURE__ */ k(C.Fragment, { children: g(t, {
+				}), /* @__PURE__ */ k(u, { children: m.morePages })] }, `gap-${n}`) : /* @__PURE__ */ k(T.Fragment, { children: g(t, {
 					label: m.page(t),
 					current: t === e,
 					tone: "secondary",
@@ -357,7 +372,7 @@ function G({ page: e, total: n, onPageChange: r, disabled: i = !1, siblings: o =
 					tone: "neutral",
 					buttonStyle: "ghost",
 					iconOnly: !_,
-					children: /* @__PURE__ */ A(O, { children: [_ && v(m.next), /* @__PURE__ */ k(x, {})] })
+					children: /* @__PURE__ */ A(O, { children: [_ && v(m.next), /* @__PURE__ */ k(C, {})] })
 				})
 			]
 		})
@@ -447,119 +462,115 @@ function q({ eyebrow: e, title: a, description: o, level: s = 1, badge: c, badge
 //#region src/components/base/navigation/navigation-tabs.strings.ts
 var J = { label: "Sections" }, Y = { label: "Sections" };
 //#endregion
-//#region src/components/base/navigation/overflow-tab-bar.tsx
-function X({ items: e, value: n, onValueChange: r, strings: i, className: a, ...o }) {
-	let s = {
-		...Y,
-		...i
-	}, c = E(null), [l, u] = D(!1), d = w(() => {
-		let e = c.current;
-		e && u(e.scrollLeft + e.clientWidth < e.scrollWidth - 1);
-	}, []);
-	return T(() => {
-		let e = c.current;
-		if (!e) return;
-		d(), e.addEventListener("scroll", d, { passive: !0 });
-		let t = m(e, d);
-		return () => {
-			e.removeEventListener("scroll", d), t();
-		};
-	}, [d, e]), T(() => {
-		let e = c.current;
-		if (!n || !e) return;
-		let t = e.querySelector(`[data-tab-id="${CSS.escape(n)}"]`);
-		if (!t) return;
-		let r = t.offsetLeft, i = r + t.offsetWidth, a = e.scrollLeft, o = a + e.clientWidth;
-		r >= a && i <= o || e.scrollTo({ left: r < a ? r : i - e.clientWidth });
-	}, [n]), /* @__PURE__ */ k("div", {
-		className: t("overflow-tab-bar--component", F.tabBarWrap, a),
-		"data-overflowing": l || void 0,
-		...o,
+//#region src/components/base/navigation/navigation-tabs.tsx
+function X({ items: e, currentPath: n = "/", renderLink: r, variant: i = "underline", strings: a, className: o, ...s }) {
+	let c = {
+		...J,
+		...a
+	}, l = y(n, e.map((e) => e.href)), u = D(null), d = _(u, [e]);
+	return /* @__PURE__ */ k("nav", {
+		"aria-label": c.label,
+		"data-fade-start": d.start || void 0,
+		"data-fade-end": d.end || void 0,
+		className: t("navigation-tabs--component", F.tabBarWrap, o),
+		...s,
 		children: /* @__PURE__ */ k("div", {
-			ref: c,
-			role: "tablist",
-			"aria-label": s.label,
-			tabIndex: e.length > 0 && e.every((e) => e.disabled) ? 0 : void 0,
-			className: F.tabBar,
+			ref: u,
+			className: t(F.tabBar, i === "pill" && F.tabsPill),
 			children: e.map((e) => {
-				let t = e.id === n, i = /* @__PURE__ */ A(O, { children: [
+				let t = !!l && e.href === l, n = /* @__PURE__ */ A(O, { children: [
 					e.icon,
 					e.label,
 					e.badge
-				] });
-				return e.href && !e.disabled ? /* @__PURE__ */ k("a", {
-					role: "tab",
-					href: e.href,
-					"data-tab-id": e.id,
-					"data-active": t || void 0,
-					"aria-selected": t,
-					className: F.tabBarItem,
-					onClick: () => r?.(e.id),
-					children: i
-				}, e.id) : /* @__PURE__ */ k("button", {
-					type: "button",
-					role: "tab",
-					"data-tab-id": e.id,
+				] }), i = {
+					className: F.tab,
 					"data-active": t || void 0,
-					"aria-selected": t,
-					"aria-disabled": e.disabled || void 0,
-					disabled: e.disabled,
-					className: F.tabBarItem,
-					onClick: () => r?.(e.id),
-					children: i
-				}, e.id);
+					"aria-current": t ? "page" : void 0,
+					"aria-disabled": e.disabled || void 0
+				};
+				return r ? /* @__PURE__ */ k("span", {
+					style: { display: "contents" },
+					children: r({
+						href: e.href,
+						children: n,
+						active: t,
+						disabled: e.disabled,
+						...i
+					})
+				}, e.href) : /* @__PURE__ */ k("a", {
+					href: e.disabled ? void 0 : e.href,
+					...i,
+					children: n
+				}, e.href);
 			})
 		})
 	});
 }
 //#endregion
-//#region src/components/base/navigation/navigation-tabs.tsx
-function Z({ items: e, currentPath: n = "/", renderLink: r, strings: i, className: a, ...o }) {
+//#region src/components/base/navigation/overflow-tab-bar.tsx
+function Z({ items: e, value: n, onValueChange: r, strings: i, className: a, ...o }) {
 	let s = {
-		...J,
+		...Y,
 		...i
-	}, c = _(n, e.map((e) => e.href));
-	return /* @__PURE__ */ k("nav", {
-		"aria-label": s.label,
-		className: t("navigation-tabs--component", F.tabBar, a),
-		...o,
-		children: e.map((e) => {
-			let t = !!c && e.href === c, n = /* @__PURE__ */ A(O, { children: [
-				e.icon,
-				e.label,
-				e.badge
-			] }), i = {
-				className: F.tab,
-				"data-active": t || void 0,
-				"aria-current": t ? "page" : void 0,
-				"aria-disabled": e.disabled || void 0
-			};
-			return r ? /* @__PURE__ */ k("span", {
-				style: { display: "contents" },
-				children: r({
-					href: e.href,
-					children: n,
-					active: t,
-					disabled: e.disabled,
-					...i
-				})
-			}, e.href) : /* @__PURE__ */ k("a", {
-				href: e.disabled ? void 0 : e.href,
-				...i,
+	}, c = t("overflow-tab-bar--component", a);
+	if (e.length > 0 && e.every((e) => e.href)) {
+		let t = new Map(e.map((e) => [e.href, e.id])), i = e.find((e) => e.id === n)?.href;
+		return /* @__PURE__ */ k(X, {
+			...o,
+			className: c,
+			items: e.map((e) => ({
+				label: e.label,
+				href: e.href,
+				icon: e.icon,
+				badge: e.badge,
+				disabled: e.disabled
+			})),
+			currentPath: i ?? "",
+			variant: "pill",
+			strings: { label: s.label },
+			renderLink: ({ href: e, children: n, active: i, disabled: a, external: o, ...s }) => /* @__PURE__ */ k("a", {
+				...s,
+				href: a ? void 0 : e,
+				onClick: () => {
+					let n = e ? t.get(e) : void 0;
+					n && r?.(n);
+				},
 				children: n
-			}, e.href);
+			})
+		});
+	}
+	let l = e.some((e) => e.id === n), u = e.find((e) => !e.disabled)?.id;
+	return /* @__PURE__ */ k(R, {
+		...o,
+		value: n ?? "",
+		onValueChange: (e) => r?.(e),
+		className: c,
+		children: /* @__PURE__ */ k(B, {
+			label: s.label,
+			variant: "pill",
+			edgeFade: !0,
+			children: e.map((e) => /* @__PURE__ */ A(V, {
+				value: e.id,
+				disabled: e.disabled,
+				"data-tab-id": e.id,
+				...!l && e.id === u ? { tabIndex: 0 } : null,
+				children: [
+					e.icon,
+					e.label,
+					e.badge
+				]
+			}, e.id))
 		})
 	});
 }
 //#endregion
 //#region src/components/base/navigation/language-switcher.tsx
 function Q({ locales: e, value: n, onSelect: r, variant: i = "menu", label: u, strings: d, className: f, ...p }) {
-	let m = g(N, d), h = e.find((e) => e.value === n);
+	let m = g(N, d), h = e.find((e) => e.value === n), _ = E(), v = E();
 	return i === "pills" ? /* @__PURE__ */ k("div", {
 		className: t("language-switcher--component", f),
 		...p,
-		children: /* @__PURE__ */ k(v, {
-			name: "locale",
+		children: /* @__PURE__ */ k(b, {
 			"aria-label": u ?? m.label,
 			value: n ?? null,
 			onValueChange: (e) => e && r?.(e),
@@ -571,14 +582,19 @@ function Q({ locales: e, value: n, onSelect: r, variant: i = "menu", label: u, s
 				})
 			}))
 		})
-	}) : /* @__PURE__ */ k("div", {
+	}) : /* @__PURE__ */ A("div", {
 		className: t("language-switcher--component", f),
 		...p,
-		children: /* @__PURE__ */ A(l, { children: [/* @__PURE__ */ k(s, { render: /* @__PURE__ */ A(a, {
+		children: [/* @__PURE__ */ k("span", {
+			id: _,
+			hidden: !0,
+			children: u ?? m.label
+		}), /* @__PURE__ */ A(l, { children: [/* @__PURE__ */ k(s, { render: /* @__PURE__ */ A(a, {
 			tone: "neutral",
 			buttonStyle: "ghost",
-			"aria-label": u ?? m.label,
-			children: [/* @__PURE__ */ k(S, {}), h ? /* @__PURE__ */ k("span", {
+			"aria-labelledby": h ? `${_} ${v}` : u ? void 0 : _,
+			children: [/* @__PURE__ */ k(w, {}), h ? /* @__PURE__ */ k("span", {
+				id: v,
 				lang: h.value,
 				children: h.label
 			}) : u]
@@ -587,10 +603,10 @@ function Q({ locales: e, value: n, onSelect: r, variant: i = "menu", label: u, s
 			children: e.map((e) => /* @__PURE__ */ k(o, {
 				lang: e.value,
 				onClick: () => r?.(e.value),
-				trailing: e.value === n ? /* @__PURE__ */ k(y, { "aria-hidden": !0 }) : void 0,
+				trailing: e.value === n ? /* @__PURE__ */ k(x, { "aria-hidden": !0 }) : void 0,
 				children: e.label
 			}, e.value))
-		})] })
+		})] })]
 	});
 }
 //#endregion

package/dist/{path-_-vHPVht.js → navigation-Db1UQSIU.js}

@@ -1,4 +1,4 @@
-//#region src/components/layout/sidebar/path.ts
+//#region src/lib/navigation.ts
 function e(e) {
 	if (e.startsWith("#/")) return e.slice(1).split("?")[0]?.split("#")[0] || "/";
 	try {
@@ -9,7 +9,7 @@ function e(e) {
 }
 function t(t, n) {
 	let r = e(t);
-	return r === n ? !0 : n === "/" ? !1 : r.startsWith(`${n}/`) || r.startsWith(`${n}?`);
+	return r === n || n !== "/" && r.startsWith(`${n}/`);
 }
 function n(n, r) {
 	let i, a = -1;