@studiolxd/brand 45.1.0 → 47.0.0

package/dist/async-multi-select.js

@@ -3,22 +3,23 @@ import './async-multi-select.css';
 import { n as e } from "./_shared/brandmessagescontext.js";
 import { Icon as t } from "./icon.js";
 import { Spinner as n } from "./spinner.js";
-import { forwardRef as r, useCallback as ee, useEffect as te, useId as i, useRef as a, useState as o } from "react";
-import { jsx as s, jsxs as c } from "react/jsx-runtime";
-import { Popover as l } from "@base-ui/react/popover";
+import { n as r } from "./_shared/portal-container.js";
+import { forwardRef as i, useCallback as a, useEffect as o, useId as s, useRef as c, useState as l } from "react";
+import { jsx as u, jsxs as d } from "react/jsx-runtime";
+import { Popover as f } from "@base-ui/react/popover";
 //#region src/stories/atoms/AsyncMultiSelect/AsyncMultiSelect.tsx
-function u(e, t) {
+function ee(e, t) {
 	typeof e == "function" ? e(t) : e && (e.current = t);
 }
-var d = r(function({ onSearch: r, value: d, defaultValue: f = [], onValueChange: p, selectedOptions: ne, placeholder: m, disabled: h, readOnly: g, size: _ = "md", debounceMs: v = 300, id: re, name: y, error: b = !1, required: ie, onBlur: ae, className: x, "aria-label": S, "aria-describedby": C, removeLabel: w, emptyMessage: T, loadingLabel: E, container: D }, oe) {
-	let O = e("asyncMultiSelect"), [k, A] = o(!1), [j, M] = o(""), [N, P] = o(!1), [F, I] = o([]), [L, R] = o(!1), [z, B] = o(-1), [V, H] = o(f), [U, W] = o([]), G = a(null), K = a(0), q = a(null), J = a(null), Y = i(), se = i(), X = d === void 0 ? V : d, ce = X.map((e) => ne?.find((t) => t.value === e) ?? U.find((t) => t.value === e) ?? {
+var p = i(function({ onSearch: i, value: p, defaultValue: te = [], onValueChange: ne, selectedOptions: m, placeholder: h, disabled: g, readOnly: _, size: v = "md", debounceMs: re = 300, id: ie, name: y, error: b = !1, required: x, onBlur: S, className: ae, "aria-label": C, "aria-describedby": oe, removeLabel: se, emptyMessage: ce, loadingLabel: w, container: T }, E) {
+	let D = e("asyncMultiSelect"), O = r(T), [k, A] = l(!1), [j, M] = l(""), [N, P] = l(!1), [F, I] = l([]), [L, R] = l(!1), [z, B] = l(-1), [V, H] = l(te), [U, W] = l([]), G = c(null), K = c(0), q = c(null), J = c(null), Y = s(), le = s(), X = p === void 0 ? V : p, ue = X.map((e) => m?.find((t) => t.value === e) ?? U.find((t) => t.value === e) ?? {
 		value: e,
 		label: e
-	}), Z = (e) => `${se}-opt-${e}`, Q = ee(async (e) => {
+	}), Z = (e) => `${le}-opt-${e}`, Q = a(async (e) => {
 		let t = ++K.current;
 		P(!0), R(!1);
 		try {
-			let n = await r(e);
+			let n = await i(e);
 			if (t !== K.current) return;
 			I(n), B(-1);
 		} catch {
@@ -27,22 +28,22 @@ var d = r(function({ onSearch: r, value: d, defaultValue: f = [], onValueChange:
 		} finally {
 			t === K.current && (P(!1), R(!0));
 		}
-	}, [r]);
-	te(() => () => {
+	}, [i]);
+	o(() => () => {
 		K.current += 1, G.current && clearTimeout(G.current);
 	}, []);
-	function le(e) {
+	function de(e) {
 		let t = e.target.value;
-		M(t), k || A(!0), G.current && clearTimeout(G.current), G.current = setTimeout(() => void Q(t), v);
+		M(t), k || A(!0), G.current && clearTimeout(G.current), G.current = setTimeout(() => void Q(t), re);
 	}
-	function ue(e) {
-		h || g || k || (e.preventDefault(), q.current?.focus(), B(-1), M(""), I([]), R(!1), A(!0), Q(""));
+	function fe(e) {
+		g || _ || k || (e.preventDefault(), q.current?.focus(), B(-1), M(""), I([]), R(!1), A(!0), Q(""));
 	}
 	function $(e, t) {
 		let n = X.includes(e) ? X.filter((t) => t !== e) : [...X, e];
-		t && W((e) => e.some((e) => e.value === t.value) ? e : [...e, t]), d === void 0 && H(n), p?.(n);
+		t && W((e) => e.some((e) => e.value === t.value) ? e : [...e, t]), p === void 0 && H(n), ne?.(n);
 	}
-	function de(e) {
+	function pe(e) {
 		if (e.key === "ArrowDown") e.preventDefault(), k ? B((e) => Math.min(e + 1, F.length - 1)) : (A(!0), Q(j));
 		else if (e.key === "ArrowUp") e.preventDefault(), B((e) => Math.max(e - 1, -1));
 		else if (e.key === "Enter" && z >= 0 && F[z]) e.preventDefault(), $(F[z].value, F[z]), q.current?.focus();
@@ -53,7 +54,7 @@ var d = r(function({ onSearch: r, value: d, defaultValue: f = [], onValueChange:
 			$(e);
 		}
 	}
-	function fe(e, t) {
+	function me(e, t) {
 		if (!e) {
 			if (t.reason === "outside-press") {
 				let e = t.event?.target;
@@ -62,61 +63,61 @@ var d = r(function({ onSearch: r, value: d, defaultValue: f = [], onValueChange:
 			A(!1), M(""), B(-1);
 		}
 	}
-	let pe = [
+	let he = [
 		"async-multi-select",
-		_ === "md" ? "" : `async-multi-select--${_}`,
-		h ? "async-multi-select--disabled" : "",
+		v === "md" ? "" : `async-multi-select--${v}`,
+		g ? "async-multi-select--disabled" : "",
 		k ? "async-multi-select--open" : "",
 		b ? "async-multi-select--error" : "",
-		x ?? ""
-	].filter(Boolean).join(" "), me = ["async-multi-select__content", _ === "md" ? "" : `async-multi-select__content--${_}`].filter(Boolean).join(" ");
-	return /* @__PURE__ */ c(l.Root, {
+		ae ?? ""
+	].filter(Boolean).join(" "), ge = ["async-multi-select__content", v === "md" ? "" : `async-multi-select__content--${v}`].filter(Boolean).join(" ");
+	return /* @__PURE__ */ d(f.Root, {
 		open: k,
-		onOpenChange: fe,
-		children: [/* @__PURE__ */ c("div", {
+		onOpenChange: me,
+		children: [/* @__PURE__ */ d("div", {
 			ref: J,
-			className: pe,
+			className: he,
 			"data-popup-open": k || void 0,
-			children: [/* @__PURE__ */ c("div", {
+			children: [/* @__PURE__ */ d("div", {
 				className: "async-multi-select__input-area",
 				children: [
-					ce.map((e) => /* @__PURE__ */ c("span", {
+					ue.map((e) => /* @__PURE__ */ d("span", {
 						className: "async-multi-select__pill",
-						children: [/* @__PURE__ */ s("span", {
+						children: [/* @__PURE__ */ u("span", {
 							className: "async-multi-select__pill-label",
 							children: e.label
-						}), !h && !g && /* @__PURE__ */ s("button", {
+						}), !g && !_ && /* @__PURE__ */ u("button", {
 							type: "button",
 							className: "async-multi-select__pill-remove",
-							"aria-label": O("remove", w)(e.label),
+							"aria-label": D("remove", se)(e.label),
 							tabIndex: -1,
 							onMouseDown: (t) => {
 								t.preventDefault(), $(e.value);
 							},
-							children: /* @__PURE__ */ s(t, {
+							children: /* @__PURE__ */ u(t, {
 								name: "close",
 								size: "xs"
 							})
 						})]
 					}, e.value)),
-					/* @__PURE__ */ s("input", {
+					/* @__PURE__ */ u("input", {
 						ref: (e) => {
-							q.current = e, u(oe, e);
+							q.current = e, ee(E, e);
 						},
-						id: re,
+						id: ie,
 						type: "text",
 						className: "async-multi-select__input",
 						value: j,
-						onChange: le,
-						onPointerDown: ue,
-						onKeyDown: de,
-						placeholder: X.length === 0 ? O("placeholder", m) : void 0,
-						disabled: h,
-						readOnly: g,
-						"aria-label": S,
-						"aria-describedby": C,
+						onChange: de,
+						onPointerDown: fe,
+						onKeyDown: pe,
+						placeholder: X.length === 0 ? D("placeholder", h) : void 0,
+						disabled: g,
+						readOnly: _,
+						"aria-label": C,
+						"aria-describedby": oe,
 						"aria-invalid": b || void 0,
-						"aria-required": ie || void 0,
+						"aria-required": x || void 0,
 						"aria-expanded": k,
 						"aria-haspopup": "listbox",
 						"aria-controls": k ? Y : void 0,
@@ -124,49 +125,49 @@ var d = r(function({ onSearch: r, value: d, defaultValue: f = [], onValueChange:
 						autoComplete: "off",
 						role: "combobox",
 						"aria-autocomplete": "list",
-						onBlur: ae
+						onBlur: S
 					}),
-					y && X.map((e) => /* @__PURE__ */ s("input", {
+					y && X.map((e) => /* @__PURE__ */ u("input", {
 						type: "hidden",
 						name: y,
 						value: e
 					}, e))
 				]
-			}), N && /* @__PURE__ */ s(n, {
+			}), N && /* @__PURE__ */ u(n, {
 				size: "sm",
 				"aria-hidden": !0
 			})]
-		}), /* @__PURE__ */ s(l.Portal, {
-			container: D,
-			children: /* @__PURE__ */ s(l.Positioner, {
+		}), /* @__PURE__ */ u(f.Portal, {
+			container: O,
+			children: /* @__PURE__ */ u(f.Positioner, {
 				className: "async-multi-select__positioner",
 				anchor: J,
 				align: "start",
 				sideOffset: -1,
-				children: /* @__PURE__ */ s(l.Popup, {
-					className: me,
+				children: /* @__PURE__ */ u(f.Popup, {
+					className: ge,
 					initialFocus: !1,
 					finalFocus: !1,
-					children: /* @__PURE__ */ c("div", {
+					children: /* @__PURE__ */ d("div", {
 						role: "listbox",
 						"aria-multiselectable": "true",
-						"aria-label": S ?? O("placeholder", m),
+						"aria-label": C ?? D("placeholder", h),
 						id: Y,
 						children: [
-							N && /* @__PURE__ */ s("div", {
+							N && /* @__PURE__ */ u("div", {
 								className: "async-multi-select__loading",
-								children: /* @__PURE__ */ s(n, {
+								children: /* @__PURE__ */ u(n, {
 									size: "sm",
-									label: O("loading", E)
+									label: D("loading", w)
 								})
 							}),
-							!N && L && F.length === 0 && /* @__PURE__ */ s("div", {
+							!N && L && F.length === 0 && /* @__PURE__ */ u("div", {
 								className: "async-multi-select__empty",
-								children: O("empty", T)
+								children: D("empty", ce)
 							}),
 							!N && F.map((e, t) => {
 								let n = X.includes(e.value), r = z === t;
-								return /* @__PURE__ */ c("div", {
+								return /* @__PURE__ */ d("div", {
 									id: Z(t),
 									role: "option",
 									"aria-selected": n,
@@ -179,11 +180,11 @@ var d = r(function({ onSearch: r, value: d, defaultValue: f = [], onValueChange:
 									onClick: () => {
 										$(e.value, e), q.current?.focus();
 									},
-									children: [/* @__PURE__ */ s("span", {
+									children: [/* @__PURE__ */ u("span", {
 										className: "async-multi-select__item-check",
 										"aria-hidden": "true",
-										children: /* @__PURE__ */ s("span", { className: "async-multi-select__item-check-mark" })
-									}), /* @__PURE__ */ s("span", { children: e.label })]
+										children: /* @__PURE__ */ u("span", { className: "async-multi-select__item-check-mark" })
+									}), /* @__PURE__ */ u("span", { children: e.label })]
 								}, e.value);
 							})
 						]
@@ -194,4 +195,4 @@ var d = r(function({ onSearch: r, value: d, defaultValue: f = [], onValueChange:
 	});
 });
 //#endregion
-export { d as AsyncMultiSelect };
+export { p as AsyncMultiSelect };

package/dist/async-select.js

@@ -3,19 +3,20 @@ import './async-select.css';
 import { n as e } from "./_shared/brandmessagescontext.js";
 import { Icon as t } from "./icon.js";
 import { Spinner as n } from "./spinner.js";
-import { forwardRef as r, useCallback as i, useEffect as a, useId as o, useRef as s, useState as c } from "react";
+import { n as r } from "./_shared/portal-container.js";
+import { forwardRef as i, useCallback as ee, useEffect as a, useId as o, useRef as s, useState as c } from "react";
 import { jsx as l, jsxs as u } from "react/jsx-runtime";
 import { Popover as d } from "@base-ui/react/popover";
 //#region src/stories/atoms/AsyncSelect/AsyncSelect.tsx
-function ee(e, t) {
+function f(e, t) {
 	typeof e == "function" ? e(t) : e && (e.current = t);
 }
-var f = r(function({ onSearch: r, value: f, onValueChange: p, selectedOption: m, placeholder: h, disabled: g, readOnly: _, size: v = "md", debounceMs: y = 300, id: b, name: x, error: S = !1, required: te, onBlur: ne, className: C, "aria-label": w, "aria-describedby": T, emptyMessage: re, loadingLabel: ie, clearLabel: ae, container: E }, D) {
-	let O = e("asyncSelect"), [k, A] = c(!1), [j, M] = c(""), [N, P] = c(!1), [F, I] = c([]), [oe, L] = c(!1), [R, z] = c(-1), [B, V] = c(null), [H, U] = c(null), W = s(null), G = s(0), K = s(null), q = s(null), J = o(), se = o(), Y = f === void 0 ? B : f, ce = m === void 0 ? H : m, X = (e) => `${se}-opt-${e}`, Z = i(async (e) => {
+var p = i(function({ onSearch: i, value: p, onValueChange: m, selectedOption: h, placeholder: g, disabled: _, readOnly: v, size: y = "md", debounceMs: b = 300, id: x, name: S, error: C = !1, required: te, onBlur: ne, className: w, "aria-label": T, "aria-describedby": re, emptyMessage: E, loadingLabel: D, clearLabel: ie, container: ae }, oe) {
+	let O = e("asyncSelect"), se = r(ae), [k, A] = c(!1), [j, M] = c(""), [N, P] = c(!1), [F, I] = c([]), [ce, L] = c(!1), [R, z] = c(-1), [B, V] = c(null), [H, U] = c(null), W = s(null), G = s(0), K = s(null), q = s(null), J = o(), le = o(), Y = p === void 0 ? B : p, ue = h === void 0 ? H : h, X = (e) => `${le}-opt-${e}`, Z = ee(async (e) => {
 		let t = ++G.current;
 		P(!0), L(!1);
 		try {
-			let n = await r(e);
+			let n = await i(e);
 			if (t !== G.current) return;
 			I(n), z(-1);
 		} catch {
@@ -24,30 +25,30 @@ var f = r(function({ onSearch: r, value: f, onValueChange: p, selectedOption: m,
 		} finally {
 			t === G.current && (P(!1), L(!0));
 		}
-	}, [r]);
+	}, [i]);
 	a(() => () => {
 		G.current += 1, W.current && clearTimeout(W.current);
 	}, []);
-	function le(e) {
+	function de(e) {
 		let t = e.target.value;
-		M(t), W.current && clearTimeout(W.current), W.current = setTimeout(() => void Z(t), y);
+		M(t), W.current && clearTimeout(W.current), W.current = setTimeout(() => void Z(t), b);
 	}
-	function ue(e) {
-		g || _ || k || (e.preventDefault(), K.current?.focus(), z(-1), M(""), I([]), L(!1), A(!0), Z(""));
+	function fe(e) {
+		_ || v || k || (e.preventDefault(), K.current?.focus(), z(-1), M(""), I([]), L(!1), A(!0), Z(""));
 	}
 	function Q(e) {
-		f === void 0 && (V(e.value), U(e)), p?.(e.value, e), A(!1), z(-1), M("");
+		p === void 0 && (V(e.value), U(e)), m?.(e.value, e), A(!1), z(-1), M("");
 	}
 	function $() {
-		f === void 0 && (V(null), U(null)), p?.(null, null), M(""), I([]), L(!1), K.current?.focus();
+		p === void 0 && (V(null), U(null)), m?.(null, null), M(""), I([]), L(!1), K.current?.focus();
 	}
-	function de(e) {
+	function pe(e) {
 		e.stopPropagation(), $();
 	}
-	function fe(e) {
-		e.key === "ArrowDown" ? (e.preventDefault(), k ? z((e) => Math.min(e + 1, F.length - 1)) : (A(!0), Z(j))) : e.key === "ArrowUp" ? (e.preventDefault(), z((e) => Math.max(e - 1, -1))) : e.key === "Enter" && R >= 0 && F[R] ? (e.preventDefault(), Q(F[R])) : e.key === "Escape" ? (A(!1), M(""), z(-1)) : e.key === "Tab" ? (A(!1), z(-1)) : (e.key === "Backspace" || e.key === "Delete") && j === "" && Y && !g && !_ ? (e.preventDefault(), $()) : !k && e.key.length === 1 && !e.ctrlKey && !e.metaKey && !e.altKey && (e.preventDefault(), M(e.key), A(!0), I([]), L(!1), W.current && clearTimeout(W.current), W.current = setTimeout(() => void Z(e.key), y));
+	function me(e) {
+		e.key === "ArrowDown" ? (e.preventDefault(), k ? z((e) => Math.min(e + 1, F.length - 1)) : (A(!0), Z(j))) : e.key === "ArrowUp" ? (e.preventDefault(), z((e) => Math.max(e - 1, -1))) : e.key === "Enter" && R >= 0 && F[R] ? (e.preventDefault(), Q(F[R])) : e.key === "Escape" ? (A(!1), M(""), z(-1)) : e.key === "Tab" ? (A(!1), z(-1)) : (e.key === "Backspace" || e.key === "Delete") && j === "" && Y && !_ && !v ? (e.preventDefault(), $()) : !k && e.key.length === 1 && !e.ctrlKey && !e.metaKey && !e.altKey && (e.preventDefault(), M(e.key), A(!0), I([]), L(!1), W.current && clearTimeout(W.current), W.current = setTimeout(() => void Z(e.key), b));
 	}
-	function pe(e, t) {
+	function he(e, t) {
 		if (!e) {
 			if (t.reason === "outside-press") {
 				let e = t.event?.target;
@@ -56,38 +57,38 @@ var f = r(function({ onSearch: r, value: f, onValueChange: p, selectedOption: m,
 			A(!1), M(""), z(-1);
 		}
 	}
-	let me = k ? j : ce?.label ?? "", he = [
+	let ge = k ? j : ue?.label ?? "", _e = [
 		"async-select",
-		v === "md" ? "" : `async-select--${v}`,
-		g ? "async-select--disabled" : "",
-		S ? "async-select--error" : "",
-		C ?? ""
-	].filter(Boolean).join(" "), ge = ["async-select__content", v === "md" ? "" : `async-select__content--${v}`].filter(Boolean).join(" ");
+		y === "md" ? "" : `async-select--${y}`,
+		_ ? "async-select--disabled" : "",
+		C ? "async-select--error" : "",
+		w ?? ""
+	].filter(Boolean).join(" "), ve = ["async-select__content", y === "md" ? "" : `async-select__content--${y}`].filter(Boolean).join(" ");
 	return /* @__PURE__ */ u(d.Root, {
 		open: k,
-		onOpenChange: pe,
+		onOpenChange: he,
 		children: [/* @__PURE__ */ u("div", {
 			ref: q,
-			className: he,
+			className: _e,
 			"data-popup-open": k || void 0,
 			children: [
 				/* @__PURE__ */ l("input", {
 					ref: (e) => {
-						K.current = e, ee(D, e);
+						K.current = e, f(oe, e);
 					},
-					id: b,
+					id: x,
 					type: "text",
 					className: "async-select__input",
-					value: me,
-					onChange: le,
-					onPointerDown: ue,
-					onKeyDown: fe,
-					placeholder: O("placeholder", h),
-					disabled: g,
-					readOnly: _,
-					"aria-label": w,
-					"aria-describedby": T,
-					"aria-invalid": S || void 0,
+					value: ge,
+					onChange: de,
+					onPointerDown: fe,
+					onKeyDown: me,
+					placeholder: O("placeholder", g),
+					disabled: _,
+					readOnly: v,
+					"aria-label": T,
+					"aria-describedby": re,
+					"aria-invalid": C || void 0,
 					"aria-required": te || void 0,
 					"aria-expanded": k,
 					"aria-haspopup": "listbox",
@@ -98,21 +99,21 @@ var f = r(function({ onSearch: r, value: f, onValueChange: p, selectedOption: m,
 					"aria-autocomplete": "list",
 					onBlur: ne
 				}),
-				x && /* @__PURE__ */ l("input", {
+				S && /* @__PURE__ */ l("input", {
 					type: "hidden",
-					name: x,
+					name: S,
 					value: Y ?? ""
 				}),
 				N && /* @__PURE__ */ l(n, {
 					size: "sm",
 					"aria-hidden": !0
 				}),
-				!N && Y && !g && !_ && /* @__PURE__ */ l("button", {
+				!N && Y && !_ && !v && /* @__PURE__ */ l("button", {
 					type: "button",
 					className: "async-select__clear",
-					"aria-label": O("clear", ae),
+					"aria-label": O("clear", ie),
 					tabIndex: -1,
-					onMouseDown: de,
+					onMouseDown: pe,
 					children: /* @__PURE__ */ l(t, {
 						name: "close",
 						size: "xs"
@@ -120,31 +121,31 @@ var f = r(function({ onSearch: r, value: f, onValueChange: p, selectedOption: m,
 				})
 			]
 		}), /* @__PURE__ */ l(d.Portal, {
-			container: E,
+			container: se,
 			children: /* @__PURE__ */ l(d.Positioner, {
 				className: "async-select__positioner",
 				anchor: q,
 				align: "start",
 				sideOffset: -1,
 				children: /* @__PURE__ */ l(d.Popup, {
-					className: ge,
+					className: ve,
 					initialFocus: !1,
 					finalFocus: !1,
 					children: /* @__PURE__ */ u("div", {
 						role: "listbox",
-						"aria-label": w ?? O("placeholder", h),
+						"aria-label": T ?? O("placeholder", g),
 						id: J,
 						children: [
 							N && /* @__PURE__ */ l("div", {
 								className: "async-select__loading",
 								children: /* @__PURE__ */ l(n, {
 									size: "sm",
-									label: O("loading", ie)
+									label: O("loading", D)
 								})
 							}),
-							!N && oe && F.length === 0 && /* @__PURE__ */ l("div", {
+							!N && ce && F.length === 0 && /* @__PURE__ */ l("div", {
 								className: "async-select__empty",
-								children: O("empty", re)
+								children: O("empty", E)
 							}),
 							!N && F.map((e, t) => {
 								let n = e.value === Y, r = R === t;
@@ -170,4 +171,4 @@ var f = r(function({ onSearch: r, value: f, onValueChange: p, selectedOption: m,
 	});
 });
 //#endregion
-export { f as AsyncSelect };
+export { p as AsyncSelect };

package/dist/breadcrumb.js

@@ -1,39 +1,42 @@
+'use client';
 import './breadcrumb.css';
-import { jsx as e, jsxs as t } from "react/jsx-runtime";
+import { n as e } from "./_shared/brandmessagescontext.js";
+import { jsx as t, jsxs as n } from "react/jsx-runtime";
 //#region src/stories/molecules/Breadcrumb/Breadcrumb.tsx
-function n({ children: t, ...n }) {
-	return /* @__PURE__ */ e("a", {
+function r({ children: e, ...n }) {
+	return /* @__PURE__ */ t("a", {
 		...n,
-		children: t
+		children: e
 	});
 }
-function r({ items: r, renderLink: i = n, separator: a = "/", ariaLabel: o = "Migas de pan", className: s }) {
-	return /* @__PURE__ */ e("nav", {
-		"aria-label": o,
-		className: ["breadcrumb", s].filter(Boolean).join(" "),
-		children: /* @__PURE__ */ e("ol", {
+function i({ items: i, renderLink: a = r, separator: o = "/", ariaLabel: s, className: c }) {
+	let l = e("breadcrumb");
+	return /* @__PURE__ */ t("nav", {
+		"aria-label": l("label", s),
+		className: ["breadcrumb", c].filter(Boolean).join(" "),
+		children: /* @__PURE__ */ t("ol", {
 			className: "breadcrumb__list",
-			children: r.map((n, o) => {
-				let s = o === r.length - 1;
-				return /* @__PURE__ */ t("li", {
+			children: i.map((e, r) => {
+				let s = r === i.length - 1;
+				return /* @__PURE__ */ n("li", {
 					className: ["breadcrumb__item", s ? "breadcrumb__item--current" : ""].filter(Boolean).join(" "),
-					children: [s || !n.href ? /* @__PURE__ */ e("span", {
+					children: [s || !e.href ? /* @__PURE__ */ t("span", {
 						className: s ? "breadcrumb__current" : "breadcrumb__static",
 						...s ? { "aria-current": "page" } : {},
-						children: n.label
-					}) : i({
-						href: n.href,
-						children: n.label,
+						children: e.label
+					}) : a({
+						href: e.href,
+						children: e.label,
 						className: "breadcrumb__link"
-					}), !s && /* @__PURE__ */ e("span", {
+					}), !s && /* @__PURE__ */ t("span", {
 						className: "breadcrumb__separator",
 						"aria-hidden": "true",
-						children: a
+						children: o
 					})]
-				}, `${n.label}-${o}`);
+				}, `${e.label}-${r}`);
 			})
 		})
 	});
 }
 //#endregion
-export { r as Breadcrumb };
+export { i as Breadcrumb };

package/dist/command-palette.js

@@ -1,62 +1,64 @@
 'use client';
 import './command-palette.css';
-import { Modal as e } from "./modal.js";
-import { useCallback as t, useEffect as n } from "react";
-import { jsx as r, jsxs as i } from "react/jsx-runtime";
-import { Autocomplete as a } from "@base-ui/react/autocomplete";
+import { n as e } from "./_shared/brandmessagescontext.js";
+import { Modal as t } from "./modal.js";
+import { useCallback as n, useEffect as r } from "react";
+import { jsx as i, jsxs as a } from "react/jsx-runtime";
+import { Autocomplete as o } from "@base-ui/react/autocomplete";
 //#region src/stories/molecules/CommandPalette/CommandPalette.tsx
-function o({ open: o, onOpenChange: s, groups: c, title: l, placeholder: u, emptyLabel: d, listLabel: f, closeLabel: p, shortcut: m = "k", locale: h, className: g }) {
-	n(() => {
-		if (m === !1) return;
+function s({ open: s, onOpenChange: c, groups: l, title: u, placeholder: d, emptyLabel: f, listLabel: p, closeLabel: m, shortcut: h = "k", locale: g, className: _ }) {
+	let v = e("commandPalette");
+	r(() => {
+		if (h === !1) return;
 		let e = (e) => {
-			typeof e.key == "string" && e.key.toLowerCase() === m && (e.metaKey || e.ctrlKey) && (e.preventDefault(), s(!o));
+			typeof e.key == "string" && e.key.toLowerCase() === h && (e.metaKey || e.ctrlKey) && (e.preventDefault(), c(!s));
 		};
 		return window.addEventListener("keydown", e), () => window.removeEventListener("keydown", e);
 	}, [
-		m,
-		o,
-		s
+		h,
+		s,
+		c
 	]);
-	let _ = a.useFilter({
+	let y = o.useFilter({
 		sensitivity: "base",
-		locale: h
-	}), v = t((e, t) => _.contains(e.label, t) || (e.keywords ?? []).some((e) => _.contains(e, t)), [_]);
-	return /* @__PURE__ */ r(e, {
-		open: o,
-		onClose: () => s(!1),
-		title: l,
-		...p ? { closeLabel: p } : {},
-		children: /* @__PURE__ */ r(a.Root, {
+		locale: g
+	}), b = n((e, t) => y.contains(e.label, t) || (e.keywords ?? []).some((e) => y.contains(e, t)), [y]);
+	return /* @__PURE__ */ i(t, {
+		open: s,
+		onClose: () => c(!1),
+		title: v("title", u),
+		...m ? { closeLabel: m } : {},
+		children: /* @__PURE__ */ i(o.Root, {
 			inline: !0,
 			open: !0,
-			items: c,
-			filter: v,
+			items: l,
+			filter: b,
 			autoHighlight: "always",
-			children: /* @__PURE__ */ i("div", {
-				className: ["command-palette", g].filter(Boolean).join(" "),
+			children: /* @__PURE__ */ a("div", {
+				className: ["command-palette", _].filter(Boolean).join(" "),
 				children: [
-					/* @__PURE__ */ r(a.Input, {
+					/* @__PURE__ */ i(o.Input, {
 						className: "command-palette__input",
-						placeholder: u,
+						placeholder: v("placeholder", d),
 						autoFocus: !0
 					}),
-					/* @__PURE__ */ r(a.List, {
+					/* @__PURE__ */ i(o.List, {
 						className: "command-palette__list",
-						"aria-label": f,
-						children: (e) => /* @__PURE__ */ i(a.Group, {
+						"aria-label": v("list", p),
+						children: (e) => /* @__PURE__ */ a(o.Group, {
 							items: e.items,
 							className: "command-palette__group",
-							children: [/* @__PURE__ */ r(a.GroupLabel, {
+							children: [/* @__PURE__ */ i(o.GroupLabel, {
 								className: "command-palette__heading",
 								children: e.heading
-							}), /* @__PURE__ */ r(a.Collection, { children: (e) => /* @__PURE__ */ i(a.Item, {
+							}), /* @__PURE__ */ i(o.Collection, { children: (e) => /* @__PURE__ */ a(o.Item, {
 								value: e,
 								disabled: e.disabled,
 								className: "command-palette__item",
 								onClick: () => {
-									s(!1), e.onSelect();
+									c(!1), e.onSelect();
 								},
-								children: [e.icon && /* @__PURE__ */ r("span", {
+								children: [e.icon && /* @__PURE__ */ i("span", {
 									className: "command-palette__item-icon",
 									"aria-hidden": "true",
 									children: e.icon
@@ -64,9 +66,9 @@ function o({ open: o, onOpenChange: s, groups: c, title: l, placeholder: u, empt
 							}, e.id) })]
 						}, e.id)
 					}),
-					/* @__PURE__ */ r(a.Empty, {
+					/* @__PURE__ */ i(o.Empty, {
 						className: "command-palette__empty",
-						children: d
+						children: v("empty", f)
 					})
 				]
 			})
@@ -74,4 +76,4 @@ function o({ open: o, onOpenChange: s, groups: c, title: l, placeholder: u, empt
 	});
 }
 //#endregion
-export { o as CommandPalette };
+export { s as CommandPalette };