@studiolxd/brand 46.0.0 → 47.0.0

package/dist/prev-next-nav.js

@@ -1,39 +1,41 @@
+'use client';
 import './prev-next-nav.css';
-import { Icon as e } from "./icon.js";
-import { Fragment as t, jsx as n, jsxs as r } from "react/jsx-runtime";
+import { n as e } from "./_shared/brandmessagescontext.js";
+import { Icon as t } from "./icon.js";
+import { Fragment as n, jsx as r, jsxs as i } from "react/jsx-runtime";
 //#region src/stories/molecules/PrevNextNav/PrevNextNav.tsx
-function i({ href: i, onClick: a, label: o, title: s, disabled: c, direction: l, chevronSize: u, linkComponent: d }) {
+function a({ href: e, onClick: a, label: o, title: s, disabled: c, direction: l, chevronSize: u, linkComponent: d }) {
 	let f = [
 		"prev-next-nav__btn",
 		`prev-next-nav__btn--${l}`,
 		s ? "prev-next-nav__btn--titled" : "",
 		c ? "prev-next-nav__btn--disabled" : ""
-	].filter(Boolean).join(" "), p = /* @__PURE__ */ n(e, {
+	].filter(Boolean).join(" "), p = /* @__PURE__ */ r(t, {
 		name: "chevron",
 		size: u
-	}), m = s ? /* @__PURE__ */ r(t, { children: [p, /* @__PURE__ */ r("span", {
+	}), m = s ? /* @__PURE__ */ i(n, { children: [p, /* @__PURE__ */ i("span", {
 		className: "prev-next-nav__text",
-		children: [/* @__PURE__ */ n("span", {
+		children: [/* @__PURE__ */ r("span", {
 			className: "prev-next-nav__eyebrow",
 			children: o
-		}), /* @__PURE__ */ n("span", {
+		}), /* @__PURE__ */ r("span", {
 			className: "prev-next-nav__title",
 			children: s
 		})]
 	})] }) : p, h = s ? void 0 : o;
-	return c ? /* @__PURE__ */ n("button", {
+	return c ? /* @__PURE__ */ r("button", {
 		type: "button",
 		className: f,
 		"aria-label": h,
 		disabled: !0,
 		children: m
-	}) : i ? /* @__PURE__ */ n(d ?? "a", {
-		href: i,
+	}) : e ? /* @__PURE__ */ r(d ?? "a", {
+		href: e,
 		className: f,
 		"aria-label": h,
 		onClick: a,
 		children: m
-	}) : /* @__PURE__ */ n("button", {
+	}) : /* @__PURE__ */ r("button", {
 		type: "button",
 		className: f,
 		"aria-label": h,
@@ -41,42 +43,42 @@ function i({ href: i, onClick: a, label: o, title: s, disabled: c, direction: l,
 		children: m
 	});
 }
-function a({ prevHref: e, nextHref: t, prevOnClick: a, nextOnClick: o, prevLabel: s = "Anterior", nextLabel: c = "Siguiente", prevTitle: l, nextTitle: u, label: d, labelId: f, linkComponent: p, size: m = "md" }) {
-	let h = m === "sm" ? "sm" : "md";
-	return /* @__PURE__ */ r("div", {
+function o({ prevHref: t, nextHref: n, prevOnClick: o, nextOnClick: s, prevLabel: c, nextLabel: l, prevTitle: u, nextTitle: d, label: f, labelId: p, linkComponent: m, size: h = "md" }) {
+	let g = e("prevNextNav"), _ = h === "sm" ? "sm" : "md";
+	return /* @__PURE__ */ i("div", {
 		className: [
 			"prev-next-nav",
-			m === "sm" ? "prev-next-nav--sm" : "",
-			l !== void 0 || u !== void 0 ? "prev-next-nav--titled" : ""
+			h === "sm" ? "prev-next-nav--sm" : "",
+			u !== void 0 || d !== void 0 ? "prev-next-nav--titled" : ""
 		].filter(Boolean).join(" "),
 		children: [
-			/* @__PURE__ */ n(i, {
-				href: e,
-				onClick: a,
-				label: s,
-				disabled: !e && !a,
+			/* @__PURE__ */ r(a, {
+				href: t,
+				onClick: o,
+				label: g("previous", c),
+				disabled: !t && !o,
 				direction: "prev",
-				title: l,
-				chevronSize: h,
-				linkComponent: p
+				title: u,
+				chevronSize: _,
+				linkComponent: m
 			}),
-			d !== void 0 && /* @__PURE__ */ n("strong", {
-				id: f,
+			f !== void 0 && /* @__PURE__ */ r("strong", {
+				id: p,
 				className: "prev-next-nav__label",
-				children: d
+				children: f
 			}),
-			/* @__PURE__ */ n(i, {
-				href: t,
-				onClick: o,
-				label: c,
-				disabled: !t && !o,
+			/* @__PURE__ */ r(a, {
+				href: n,
+				onClick: s,
+				label: g("next", l),
+				disabled: !n && !s,
 				direction: "next",
-				title: u,
-				chevronSize: h,
-				linkComponent: p
+				title: d,
+				chevronSize: _,
+				linkComponent: m
 			})
 		]
 	});
 }
 //#endregion
-export { a as PrevNextNav };
+export { o as PrevNextNav };

package/dist/public-page-shell.js

@@ -1,34 +1,38 @@
 'use client';
 import './public-page-shell.css';
-import { Container as e } from "./container.js";
-import { ErrorBoundary as t } from "./error-boundary.js";
-import { SiteShell as n } from "./site-shell.js";
-import { forwardRef as r } from "react";
-import { Fragment as i, jsx as a, jsxs as o } from "react/jsx-runtime";
+import { n as e } from "./_shared/brandmessagescontext.js";
+import { Container as t } from "./container.js";
+import { ErrorBoundary as n } from "./error-boundary.js";
+import { SiteShell as r } from "./site-shell.js";
+import { forwardRef as i } from "react";
+import { Fragment as a, jsx as o, jsxs as s } from "react/jsx-runtime";
 //#region src/stories/templates/PublicPageShell/PublicPageShell.tsx
-var s = r(function({ children: r, header: s, footer: c, preferences: l, preferencesLabel: u = "Preferencias", id: d = "main-content", shell: f = !0 }, p) {
-	if (!f) return /* @__PURE__ */ a(i, { children: r });
-	let m = l && /* @__PURE__ */ a(e, {
+var c = i(function({ children: i, header: c, footer: l, preferences: u, preferencesLabel: d, mainWidth: f = "xl", mainSpace: p = "xl", mainFlush: m = !1, id: h = "main-content", shell: g = !0 }, _) {
+	let v = e("publicPageShell");
+	if (!g) return /* @__PURE__ */ o(a, { children: i });
+	let y = u && /* @__PURE__ */ o(t, {
 		as: "section",
 		className: "public-page-shell__preferences",
-		"aria-label": u,
-		children: /* @__PURE__ */ a("div", {
+		"aria-label": v("preferences", d),
+		children: /* @__PURE__ */ o("div", {
 			className: "public-page-shell__preferences-row",
-			children: l
+			children: u
 		})
 	});
-	return /* @__PURE__ */ a(n, {
-		ref: p,
-		header: s && /* @__PURE__ */ a(t, { children: s }),
-		footer: (m || c) && /* @__PURE__ */ o(i, { children: [m && /* @__PURE__ */ a(t, { children: m }), c && /* @__PURE__ */ a(t, { children: c })] }),
-		children: /* @__PURE__ */ a(e, {
+	return /* @__PURE__ */ o(r, {
+		ref: _,
+		header: c && /* @__PURE__ */ o(n, { children: c }),
+		footer: (y || l) && /* @__PURE__ */ s(a, { children: [y && /* @__PURE__ */ o(n, { children: y }), l && /* @__PURE__ */ o(n, { children: l })] }),
+		children: /* @__PURE__ */ o(t, {
 			as: "main",
-			id: d,
+			id: h,
 			tabIndex: -1,
-			space: "xl",
-			children: r
+			width: f,
+			space: p,
+			flush: m,
+			children: i
 		})
 	});
 });
 //#endregion
-export { s as PublicPageShell };
+export { c as PublicPageShell };

package/dist/select.js

@@ -2,158 +2,159 @@
 import './select.css';
 import { n as e } from "./_shared/brandmessagescontext.js";
 import { Icon as t } from "./icon.js";
-import { Children as n, createContext as r, forwardRef as i, isValidElement as a, useContext as o, useMemo as s } from "react";
-import { Fragment as c, jsx as l, jsxs as u } from "react/jsx-runtime";
-import { Select as d } from "@base-ui/react/select";
+import { n } from "./_shared/portal-container.js";
+import { Children as r, createContext as i, forwardRef as a, isValidElement as o, useContext as s, useMemo as c } from "react";
+import { Fragment as l, jsx as u, jsxs as d } from "react/jsx-runtime";
+import { Select as f } from "@base-ui/react/select";
 //#region src/stories/atoms/Select/Select.tsx
-function f(e) {
+function p(e) {
 	return Array.isArray(e.options);
 }
-var p = r(null);
-function m(e, t) {
-	n.forEach(e, (e) => {
-		if (!a(e)) return;
+var m = i(null);
+function h(e, t) {
+	r.forEach(e, (e) => {
+		if (!o(e)) return;
 		let n = e.props ?? {};
-		if (e.type === b || typeof n.value == "string" && e.type !== h) {
+		if (e.type === x || typeof n.value == "string" && e.type !== g) {
 			typeof n.value == "string" && t.set(n.value, n.children);
 			return;
 		}
-		n.children != null && m(n.children, t);
+		n.children != null && h(n.children, t);
 	});
 }
-function h({ children: e, onValueChange: t, ...n }) {
-	let r = s(() => {
+function g({ children: e, onValueChange: t, ...n }) {
+	let r = c(() => {
 		let t = /* @__PURE__ */ new Map();
-		return m(e, t), t;
+		return h(e, t), t;
 	}, [e]);
-	return /* @__PURE__ */ l(p.Provider, {
+	return /* @__PURE__ */ u(m.Provider, {
 		value: r,
-		children: /* @__PURE__ */ l(d.Root, {
+		children: /* @__PURE__ */ u(f.Root, {
 			onValueChange: t ? (e) => t(e) : void 0,
 			...n,
 			children: e
 		})
 	});
 }
-var g = i(function({ placeholder: e, children: t, ...n }, r) {
-	let i = o(p);
-	return /* @__PURE__ */ l(d.Value, {
+var _ = a(function({ placeholder: e, children: t, ...n }, r) {
+	let i = s(m);
+	return /* @__PURE__ */ u(f.Value, {
 		ref: r,
 		...n,
 		children: (n) => typeof t == "function" ? t(n) : t ?? (n == null || n === "" ? e ?? null : i?.get(n) ?? n)
 	});
-}), _ = i(function({ className: e, children: t, ...n }, r) {
+}), v = a(function({ className: e, children: t, ...n }, r) {
 	let i = ["select__group", e ?? ""].filter(Boolean).join(" ");
-	return /* @__PURE__ */ l(d.Group, {
+	return /* @__PURE__ */ u(f.Group, {
 		ref: r,
 		className: i,
 		...n,
 		children: t
 	});
-}), v = i(function({ size: e = "md", className: n, children: r, ...i }, a) {
+}), y = a(function({ size: e = "md", className: n, children: r, ...i }, a) {
 	let o = [
 		"select",
 		e === "md" ? "" : `select--${e}`,
 		n ?? ""
 	].filter(Boolean).join(" ");
-	return /* @__PURE__ */ u(d.Trigger, {
+	return /* @__PURE__ */ d(f.Trigger, {
 		ref: a,
 		className: o,
 		...i,
-		children: [r, /* @__PURE__ */ l(t, {
+		children: [r, /* @__PURE__ */ u(t, {
 			name: "chevron",
 			className: "select__icon"
 		})]
 	});
-}), y = i(function({ size: e = "md", container: t, className: n, children: r, side: i = "bottom", align: a = "start", sideOffset: o = -1, ...s }, c) {
-	let u = [
+}), b = a(function({ size: e = "md", container: t, className: r, children: i, side: a = "bottom", align: o = "start", sideOffset: s = -1, ...c }, l) {
+	let d = n(t), p = [
 		"select__content",
 		e === "md" ? "" : `select__content--${e}`,
-		n ?? ""
+		r ?? ""
 	].filter(Boolean).join(" ");
-	return /* @__PURE__ */ l(d.Portal, {
-		container: t,
-		children: /* @__PURE__ */ l(d.Positioner, {
+	return /* @__PURE__ */ u(f.Portal, {
+		container: d,
+		children: /* @__PURE__ */ u(f.Positioner, {
 			className: "select__positioner",
-			side: i,
-			align: a,
-			sideOffset: o,
+			side: a,
+			align: o,
+			sideOffset: s,
 			alignItemWithTrigger: !1,
-			children: /* @__PURE__ */ l(d.Popup, {
-				ref: c,
-				className: u,
-				...s,
-				children: r
+			children: /* @__PURE__ */ u(f.Popup, {
+				ref: l,
+				className: p,
+				...c,
+				children: i
 			})
 		})
 	});
-}), b = i(function({ className: e, children: t, ...n }, r) {
+}), x = a(function({ className: e, children: t, ...n }, r) {
 	let i = ["select__item", e ?? ""].filter(Boolean).join(" ");
-	return /* @__PURE__ */ l(d.Item, {
+	return /* @__PURE__ */ u(f.Item, {
 		ref: r,
 		className: i,
 		...n,
-		children: /* @__PURE__ */ l(d.ItemText, { children: t })
+		children: /* @__PURE__ */ u(f.ItemText, { children: t })
 	});
-}), x = i(function({ className: e, children: t, ...n }, r) {
+}), S = a(function({ className: e, children: t, ...n }, r) {
 	let i = ["select__label", e ?? ""].filter(Boolean).join(" ");
-	return /* @__PURE__ */ l(d.GroupLabel, {
+	return /* @__PURE__ */ u(f.GroupLabel, {
 		ref: r,
 		className: i,
 		...n,
 		children: t
 	});
-}), S = i(function({ className: e, ...t }, n) {
+}), C = a(function({ className: e, ...t }, n) {
 	let r = ["select__separator", e ?? ""].filter(Boolean).join(" ");
-	return /* @__PURE__ */ l(d.Separator, {
+	return /* @__PURE__ */ u(f.Separator, {
 		ref: n,
 		className: r,
 		...t
 	});
 });
-function C({ value: e, label: t, "aria-label": n }) {
-	return /* @__PURE__ */ l(b, {
+function w({ value: e, label: t, "aria-label": n }) {
+	return /* @__PURE__ */ u(x, {
 		value: e,
 		"aria-label": n,
 		children: t
 	}, e);
 }
-function w({ override: t }) {
-	return /* @__PURE__ */ l(c, { children: e("select")("placeholder", t) });
+function T({ override: t }) {
+	return /* @__PURE__ */ u(l, { children: e("select")("placeholder", t) });
 }
-var T = i(function({ options: e, value: t, defaultValue: n, placeholder: r, disabled: i, readOnly: a, size: o = "md", onValueChange: s, id: c, name: d, required: p, onBlur: m, "aria-label": b, "aria-describedby": S, "aria-invalid": T, container: E }, D) {
-	return /* @__PURE__ */ u(h, {
+var E = a(function({ options: e, value: t, defaultValue: n, placeholder: r, disabled: i, readOnly: a, size: o = "md", onValueChange: s, id: c, name: l, required: f, onBlur: m, "aria-label": h, "aria-describedby": x, "aria-invalid": C, container: E }, D) {
+	return /* @__PURE__ */ d(g, {
 		value: t,
 		defaultValue: n,
 		disabled: i,
 		readOnly: a,
-		name: d,
-		required: p,
+		name: l,
+		required: f,
 		onValueChange: s,
-		children: [/* @__PURE__ */ l(v, {
+		children: [/* @__PURE__ */ u(y, {
 			ref: D,
 			size: o,
 			id: c,
 			onBlur: m,
-			"aria-label": b,
-			"aria-describedby": S,
-			"aria-invalid": T || void 0,
-			children: /* @__PURE__ */ l(g, { placeholder: /* @__PURE__ */ l(w, { override: r }) })
-		}), /* @__PURE__ */ l(y, {
+			"aria-label": h,
+			"aria-describedby": x,
+			"aria-invalid": C || void 0,
+			children: /* @__PURE__ */ u(_, { placeholder: /* @__PURE__ */ u(T, { override: r }) })
+		}), /* @__PURE__ */ u(b, {
 			size: o,
 			container: E,
-			children: e.map((e, t) => f(e) ? /* @__PURE__ */ u(_, { children: [/* @__PURE__ */ l(x, { children: e.label }), e.options.map(C)] }, `group-${t}`) : C(e))
+			children: e.map((e, t) => p(e) ? /* @__PURE__ */ d(v, { children: [/* @__PURE__ */ u(S, { children: e.label }), e.options.map(w)] }, `group-${t}`) : w(e))
 		})]
 	});
-}), E = Object.assign(T, {
-	Root: h,
-	Trigger: v,
-	Value: g,
-	Content: y,
-	Group: _,
-	Label: x,
-	Item: b,
-	Separator: S
+}), D = Object.assign(E, {
+	Root: g,
+	Trigger: y,
+	Value: _,
+	Content: b,
+	Group: v,
+	Label: S,
+	Item: x,
+	Separator: C
 });
 //#endregion
-export { E as Select, y as SelectContent, _ as SelectGroup, b as SelectItem, x as SelectLabel, h as SelectRoot, S as SelectSeparator, v as SelectTrigger, g as SelectValue, f as isSelectOptionGroup };
+export { D as Select, b as SelectContent, v as SelectGroup, x as SelectItem, S as SelectLabel, g as SelectRoot, C as SelectSeparator, y as SelectTrigger, _ as SelectValue, p as isSelectOptionGroup };

package/dist/sheet.js

@@ -2,54 +2,55 @@
 import './sheet.css';
 import { n as e } from "./_shared/brandmessagescontext.js";
 import { VisuallyHidden as t } from "./visually-hidden.js";
-import { CloseButton as n } from "./close-button.js";
-import { n as r, r as i, t as a } from "./_shared/dialogsurface.js";
-import { jsx as o, jsxs as s } from "react/jsx-runtime";
-import { Dialog as c } from "@base-ui/react/dialog";
+import { n } from "./_shared/portal-container.js";
+import { CloseButton as r } from "./close-button.js";
+import { n as i, r as a, t as o } from "./_shared/dialogsurface.js";
+import { jsx as s, jsxs as c } from "react/jsx-runtime";
+import { Dialog as l } from "@base-ui/react/dialog";
 //#region src/stories/molecules/Sheet/Sheet.tsx
-function l({ className: e, ...t }) {
-	return /* @__PURE__ */ o(a, {
+function u({ className: e, ...t }) {
+	return /* @__PURE__ */ s(o, {
 		className: ["sheet__footer", e].filter(Boolean).join(" "),
 		...t
 	});
 }
-function u({ open: a, onOpenChange: u, side: d = "right", title: f, titleHidden: p = !1, description: m, footer: h, children: g, closeLabel: _, hideClose: v = !1, trigger: y, container: b, onAnimationEndCapture: x, className: S, ...C }) {
-	let w = e("sheet");
-	return /* @__PURE__ */ s(c.Root, {
-		open: a,
-		onOpenChange: (e) => u(e),
-		children: [y && /* @__PURE__ */ o(c.Trigger, { render: y }), /* @__PURE__ */ s(c.Portal, {
-			container: b,
-			children: [/* @__PURE__ */ o(i, { className: "sheet__overlay" }), /* @__PURE__ */ s(c.Popup, {
-				className: ["sheet", S].filter(Boolean).join(" "),
-				"data-side": d,
-				onAnimationEndCapture: x,
-				...C,
+function d({ open: o, onOpenChange: d, side: f = "right", title: p, titleHidden: m = !1, description: h, footer: g, children: _, closeLabel: v, hideClose: y = !1, trigger: b, container: x, onAnimationEndCapture: S, className: C, ...w }) {
+	let T = e("sheet"), E = n(x);
+	return /* @__PURE__ */ c(l.Root, {
+		open: o,
+		onOpenChange: (e) => d(e),
+		children: [b && /* @__PURE__ */ s(l.Trigger, { render: b }), /* @__PURE__ */ c(l.Portal, {
+			container: E,
+			children: [/* @__PURE__ */ s(a, { className: "sheet__overlay" }), /* @__PURE__ */ c(l.Popup, {
+				className: ["sheet", C].filter(Boolean).join(" "),
+				"data-side": f,
+				onAnimationEndCapture: S,
+				...w,
 				children: [
-					/* @__PURE__ */ s(r, {
+					/* @__PURE__ */ c(i, {
 						layout: "stacked",
 						className: "sheet__header",
-						children: [p ? /* @__PURE__ */ o(c.Title, { render: /* @__PURE__ */ o(t, { children: f }) }) : /* @__PURE__ */ o(c.Title, {
+						children: [m ? /* @__PURE__ */ s(l.Title, { render: /* @__PURE__ */ s(t, { children: p }) }) : /* @__PURE__ */ s(l.Title, {
 							className: "sheet__title",
-							children: f
-						}), m != null && /* @__PURE__ */ o(c.Description, {
+							children: p
+						}), h != null && /* @__PURE__ */ s(l.Description, {
 							className: "sheet__description",
-							children: m
+							children: h
 						})]
 					}),
-					!v && /* @__PURE__ */ o(c.Close, {
+					!y && /* @__PURE__ */ s(l.Close, {
 						className: "sheet__close",
-						render: /* @__PURE__ */ o(n, { label: w("close", _) })
+						render: /* @__PURE__ */ s(r, { label: T("close", v) })
 					}),
-					/* @__PURE__ */ o("div", {
+					/* @__PURE__ */ s("div", {
 						className: "sheet__body",
-						children: g
+						children: _
 					}),
-					h && /* @__PURE__ */ o(l, { children: h })
+					g && /* @__PURE__ */ s(u, { children: g })
 				]
 			})]
 		})]
 	});
 }
 //#endregion
-export { u as Sheet, l as SheetFooter };
+export { d as Sheet, u as SheetFooter };