@studiolxd/brand 49.28.0 → 51.0.0

package/dist/app-launcher.css

@@ -1 +1 @@
-.app-launcher__trigger{all:unset;box-sizing:border-box;width:var(--app-launcher-trigger-size);height:var(--app-launcher-trigger-size);border-radius:var(--app-launcher-trigger-border-radius);color:var(--app-launcher-trigger-color);cursor:pointer;transition:box-shadow var(--app-launcher-transition-duration) var(--app-launcher-transition-easing);justify-content:center;align-items:center;display:flex}.app-launcher__trigger:hover{background-color:var(--app-launcher-trigger-hover-bg);color:var(--app-launcher-trigger-hover-color)}.app-launcher__trigger:focus-visible{outline:var(--app-launcher-focus-ring-width) solid var(--app-launcher-focus-ring-color);outline-offset:var(--app-launcher-focus-ring-offset)}.app-launcher__trigger--label{gap:var(--app-launcher-trigger-label-gap);width:auto;height:auto;padding-block:var(--app-launcher-trigger-label-padding-block);padding-inline:var(--app-launcher-trigger-label-padding-inline);border-radius:var(--app-launcher-trigger-label-border-radius);color:var(--app-launcher-trigger-label-color)}.app-launcher__trigger-label{font-size:var(--app-launcher-trigger-label-font-size);font-weight:var(--app-launcher-trigger-label-font-weight);line-height:var(--app-launcher-trigger-label-line-height)}.app-launcher__trigger--label:hover{color:var(--app-launcher-trigger-label-color);background-color:#0000}.app-launcher__content{box-sizing:border-box;background-color:var(--app-launcher-content-bg);border-width:var(--app-launcher-content-border-width);border-style:solid;border-color:var(--app-launcher-content-border-color);border-radius:var(--app-launcher-content-border-radius);box-shadow:var(--app-launcher-content-shadow);padding-block:var(--app-launcher-content-padding-block);padding-inline:var(--app-launcher-content-padding-inline);min-width:var(--app-launcher-content-min-width);transform-origin:var(--transform-origin);animation-duration:var(--app-launcher-transition-duration);animation-timing-function:var(--app-launcher-transition-easing);max-height:var(--app-launcher-content-max-height,var(--available-height));overscroll-behavior:contain;outline:none;overflow-y:auto}.app-launcher__content[data-open]{animation-name:app-launcher-in}.app-launcher__content[data-closed]{animation-name:app-launcher-out}@keyframes app-launcher-in{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}@keyframes app-launcher-out{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(.95)}}.app-launcher__grid{grid-template-columns:repeat(var(--app-launcher-content-columns-narrow), 1fr);gap:var(--app-launcher-content-gap);margin:0;padding:0;list-style:none;display:grid}@media (width>=480px){.app-launcher__grid{grid-template-columns:repeat(var(--app-launcher-content-columns), 1fr)}}.app-launcher__grid>li{min-inline-size:0}.app-launcher__tile{box-sizing:border-box;align-items:flex-start;gap:var(--app-launcher-tile-gap);padding-block:var(--app-launcher-tile-padding-block);padding-inline:var(--app-launcher-tile-padding-inline);border-radius:var(--app-launcher-tile-border-radius);box-shadow:none;text-align:start;cursor:pointer;transition:background-color var(--app-launcher-transition-duration) var(--app-launcher-transition-easing), box-shadow var(--app-launcher-transition-duration) var(--app-launcher-transition-easing);outline:none;flex-direction:column;text-decoration:none;display:flex}.app-launcher__tile:not(.app-launcher__tile--disabled):hover,.app-launcher__tile:focus-visible{background-color:var(--app-launcher-tile-highlighted-bg);color:var(--app-launcher-tile-highlighted-color)}.app-launcher__tile:not(.app-launcher__tile--disabled):hover .app-launcher__tile-name,.app-launcher__tile:focus-visible .app-launcher__tile-name{color:inherit}.app-launcher__tile:focus-visible{outline:var(--app-launcher-focus-ring-width) solid var(--app-launcher-focus-ring-color);outline-offset:var(--app-launcher-focus-ring-offset)}.app-launcher__tile--active .app-launcher__tile-name{font-weight:var(--app-launcher-tile-name-active-font-weight)}.app-launcher__tile.app-launcher__tile--disabled{cursor:default}.app-launcher__tile--disabled .app-launcher__tile-name{color:var(--app-launcher-tile-disabled-color)}.app-launcher__tile-badge-row{min-block-size:var(--app-launcher-tile-badge-block-size);align-items:center;display:flex}.app-launcher__tile-name{font-size:var(--app-launcher-tile-name-font-size);font-weight:var(--app-launcher-tile-name-font-weight);line-height:var(--app-launcher-tile-name-line-height);color:var(--app-launcher-tile-name-color)}.app-launcher__tile-badge{pointer-events:none}.app-launcher__tile:not(.app-launcher__tile--disabled):hover .app-launcher__tile-badge,.app-launcher__tile:focus-visible .app-launcher__tile-badge{--tag-info-bg:var(--app-launcher-tile-badge-hover-bg);--tag-info-color:var(--app-launcher-tile-badge-hover-color)}.app-launcher__positioner{z-index:var(--app-launcher-content-z-index)}
+.app-launcher__trigger{all:unset;box-sizing:border-box;inline-size:var(--app-launcher-trigger-size);block-size:var(--app-launcher-trigger-size);border-radius:var(--app-launcher-trigger-border-radius);color:var(--app-launcher-trigger-color);cursor:pointer;transition:box-shadow var(--app-launcher-transition-duration) var(--app-launcher-transition-easing);justify-content:center;align-items:center;display:flex}.app-launcher__trigger:hover{background-color:var(--app-launcher-trigger-hover-bg);color:var(--app-launcher-trigger-hover-color)}.app-launcher__trigger:focus-visible{outline:var(--app-launcher-focus-ring-width) solid var(--app-launcher-focus-ring-color);outline-offset:var(--app-launcher-focus-ring-offset)}.app-launcher__trigger--label{gap:var(--app-launcher-trigger-label-gap);block-size:auto;inline-size:auto;padding-block:var(--app-launcher-trigger-label-padding-block);padding-inline:var(--app-launcher-trigger-label-padding-inline);border-radius:var(--app-launcher-trigger-label-border-radius);color:var(--app-launcher-trigger-label-color)}.app-launcher__trigger-label{font-size:var(--app-launcher-trigger-label-font-size);font-weight:var(--app-launcher-trigger-label-font-weight);line-height:var(--app-launcher-trigger-label-line-height)}.app-launcher__trigger--label:hover{color:var(--app-launcher-trigger-label-color);background-color:#0000}.app-launcher__content{box-sizing:border-box;background-color:var(--app-launcher-content-bg);border-width:var(--app-launcher-content-border-width);border-style:solid;border-color:var(--app-launcher-content-border-color);border-radius:var(--app-launcher-content-border-radius);box-shadow:var(--app-launcher-content-shadow);padding-block:var(--app-launcher-content-padding-block);padding-inline:var(--app-launcher-content-padding-inline);min-inline-size:var(--app-launcher-content-min-width);transform-origin:var(--transform-origin);animation-duration:var(--app-launcher-transition-duration);animation-timing-function:var(--app-launcher-transition-easing);max-block-size:var(--app-launcher-content-max-height,var(--available-height));overscroll-behavior:contain;outline:none;overflow-y:auto}.app-launcher__content[data-open]{animation-name:app-launcher-in}.app-launcher__content[data-closed]{animation-name:app-launcher-out}@keyframes app-launcher-in{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}@keyframes app-launcher-out{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(.95)}}.app-launcher__grid{grid-template-columns:repeat(var(--app-launcher-content-columns-narrow), 1fr);gap:var(--app-launcher-content-gap);margin:0;padding:0;list-style:none;display:grid}@media (width>=480px){.app-launcher__grid{grid-template-columns:repeat(var(--app-launcher-content-columns), 1fr)}}.app-launcher__grid>li{min-inline-size:0}.app-launcher__tile{box-sizing:border-box;align-items:flex-start;gap:var(--app-launcher-tile-gap);padding-block:var(--app-launcher-tile-padding-block);padding-inline:var(--app-launcher-tile-padding-inline);border-radius:var(--app-launcher-tile-border-radius);text-align:start;cursor:pointer;transition:background-color var(--app-launcher-transition-duration) var(--app-launcher-transition-easing), box-shadow var(--app-launcher-transition-duration) var(--app-launcher-transition-easing);outline:none;flex-direction:column;text-decoration:none;display:flex}.app-launcher__tile:not(.app-launcher__tile--disabled):hover,.app-launcher__tile:focus-visible{background-color:var(--app-launcher-tile-highlighted-bg);color:var(--app-launcher-tile-highlighted-color)}.app-launcher__tile:not(.app-launcher__tile--disabled):hover .app-launcher__tile-name,.app-launcher__tile:focus-visible .app-launcher__tile-name{color:inherit}.app-launcher__tile:focus-visible{outline:var(--app-launcher-focus-ring-width) solid var(--app-launcher-focus-ring-color);outline-offset:var(--app-launcher-focus-ring-offset)}.app-launcher__tile--active .app-launcher__tile-name{font-weight:var(--app-launcher-tile-name-active-font-weight)}.app-launcher__tile.app-launcher__tile--disabled{cursor:default}.app-launcher__tile--disabled .app-launcher__tile-name{color:var(--app-launcher-tile-disabled-color)}.app-launcher__tile-badge-row{min-block-size:var(--app-launcher-tile-badge-height);align-items:center;display:flex}.app-launcher__tile-name{font-size:var(--app-launcher-tile-name-font-size);font-weight:var(--app-launcher-tile-name-font-weight);line-height:var(--app-launcher-tile-name-line-height);color:var(--app-launcher-tile-name-color)}.app-launcher__tile-badge{pointer-events:none}.app-launcher__tile:not(.app-launcher__tile--disabled):hover .app-launcher__tile-badge,.app-launcher__tile:focus-visible .app-launcher__tile-badge{--tag-info-bg:var(--app-launcher-tile-badge-hover-bg);--tag-info-color:var(--app-launcher-tile-badge-hover-color)}.app-launcher__positioner{z-index:var(--app-launcher-content-z-index)}

package/dist/app-launcher.js

@@ -1,19 +1,26 @@
 'use client';
 import './app-launcher.css';
-import { n as e } from "./_shared/brandmessagescontext.js";
+import { r as e } from "./_shared/brandmessagescontext.js";
 import { Icon as t } from "./icon.js";
 import { n } from "./_shared/portal-container.js";
 import { Tag as r } from "./tag.js";
-import { Modal as i } from "./modal.js";
+import { t as i } from "./_shared/modal.js";
 import { useState as a } from "react";
 import { Fragment as o, jsx as s, jsxs as c } from "react/jsx-runtime";
 import { Popover as l } from "@base-ui/react/popover";
+//#region src/stories/messages/es/appLauncher.ts
+var u = {
+	open: "Abrir el lanzador de aplicaciones",
+	new: "Nuevo",
+	title: "Aplicaciones"
+};
+//#endregion
 //#region src/stories/molecules/AppLauncher/AppLauncher.tsx
-function u({ app: t, isCurrent: n, newLabel: i }) {
-	let a = e("appLauncher"), l = t.badge ?? (t.isNew ? a("new", i) : void 0), u = /* @__PURE__ */ c(o, { children: [/* @__PURE__ */ s("span", {
+function d({ app: t, isCurrent: n, newLabel: i }) {
+	let a = e("appLauncher", u), l = t.badge ?? (t.isNew ? a("new", i) : void 0), d = /* @__PURE__ */ c(o, { children: [/* @__PURE__ */ s("span", {
 		className: "app-launcher__tile-badge-row",
 		children: l && /* @__PURE__ */ s(r, {
-			variant: t.disabled ? "neutral" : "info",
+			tone: t.disabled ? "neutral" : "info",
 			className: "app-launcher__tile-badge",
 			children: l
 		})
@@ -25,34 +32,41 @@ function u({ app: t, isCurrent: n, newLabel: i }) {
 		className: "app-launcher__tile app-launcher__tile--disabled",
 		role: "link",
 		"aria-disabled": "true",
-		children: u
+		children: d
 	}) : /* @__PURE__ */ s("a", {
 		href: t.url,
 		className: `app-launcher__tile${n ? " app-launcher__tile--active" : ""}`,
 		"aria-current": n ? "page" : void 0,
-		children: u
+		children: d
 	});
 }
-function d({ apps: e, currentAppId: t, newLabel: n }) {
+function f({ apps: e, currentAppId: t, newLabel: n }) {
 	return /* @__PURE__ */ s("ul", {
 		className: "app-launcher__grid",
 		role: "list",
-		children: e.map((e) => /* @__PURE__ */ s("li", { children: /* @__PURE__ */ s(u, {
+		children: e.map((e) => /* @__PURE__ */ s("li", { children: /* @__PURE__ */ s(d, {
 			app: e,
 			isCurrent: e.id === t,
 			newLabel: n
 		}) }, e.id))
 	});
 }
-function f({ apps: r, labels: i, currentAppId: a, open: o, defaultOpen: u, onOpenChange: f }) {
-	let p = e("appLauncher"), m = n(void 0);
+function p(e, t) {
+	return [
+		"app-launcher__trigger",
+		e ? "app-launcher__trigger--label" : "",
+		t
+	].filter(Boolean).join(" ");
+}
+function m({ apps: r, labels: i, currentAppId: a, open: o, defaultOpen: d, onOpenChange: m, className: h }) {
+	let g = e("appLauncher", u), _ = n(void 0);
 	return /* @__PURE__ */ c(l.Root, {
 		open: o,
-		defaultOpen: u,
-		onOpenChange: (e) => f?.(e),
+		defaultOpen: d,
+		onOpenChange: (e) => m?.(e),
 		children: [/* @__PURE__ */ s(l.Trigger, { render: i.trigger ? /* @__PURE__ */ c("button", {
 			type: "button",
-			className: "app-launcher__trigger app-launcher__trigger--label",
+			className: p(!0, h),
 			children: [/* @__PURE__ */ s(t, {
 				name: "grid",
 				size: "md"
@@ -62,21 +76,22 @@ function f({ apps: r, labels: i, currentAppId: a, open: o, defaultOpen: u, onOpe
 			})]
 		}) : /* @__PURE__ */ s("button", {
 			type: "button",
-			className: "app-launcher__trigger",
-			"aria-label": p("open", i.open),
+			className: p(!1, h),
+			"aria-label": g("open", i.open),
 			children: /* @__PURE__ */ s(t, {
 				name: "grid",
 				size: "md"
 			})
 		}) }), /* @__PURE__ */ s(l.Portal, {
-			container: m,
+			container: _,
 			children: /* @__PURE__ */ s(l.Positioner, {
 				className: "app-launcher__positioner",
 				sideOffset: 4,
 				align: "end",
 				children: /* @__PURE__ */ s(l.Popup, {
 					className: "app-launcher__content",
-					children: /* @__PURE__ */ s(d, {
+					"aria-label": g("title", i.title),
+					children: /* @__PURE__ */ s(f, {
 						apps: r,
 						currentAppId: a,
 						newLabel: i.new
@@ -86,19 +101,19 @@ function f({ apps: r, labels: i, currentAppId: a, open: o, defaultOpen: u, onOpe
 		})]
 	});
 }
-function p(e, t, n) {
+function h(e, t, n) {
 	let [r, i] = a(t ?? !1);
 	return [e ?? r, (t) => {
 		e === void 0 && i(t), n?.(t);
 	}];
 }
-function m({ apps: n, labels: r, currentAppId: a, open: l, defaultOpen: u, onOpenChange: f }) {
-	let m = e("appLauncher"), [h, g] = p(l, u, f);
+function g({ apps: n, labels: r, currentAppId: a, open: l, defaultOpen: d, onOpenChange: m, className: g }) {
+	let _ = e("appLauncher", u), [v, y] = h(l, d, m);
 	return /* @__PURE__ */ c(o, { children: [r.trigger ? /* @__PURE__ */ c("button", {
 		type: "button",
-		className: "app-launcher__trigger app-launcher__trigger--label",
+		className: p(!0, g),
 		"aria-haspopup": "dialog",
-		onClick: () => g(!0),
+		onClick: () => y(!0),
 		children: [/* @__PURE__ */ s(t, {
 			name: "grid",
 			size: "md"
@@ -108,30 +123,30 @@ function m({ apps: n, labels: r, currentAppId: a, open: l, defaultOpen: u, onOpe
 		})]
 	}) : /* @__PURE__ */ s("button", {
 		type: "button",
-		className: "app-launcher__trigger",
-		"aria-label": m("open", r.open),
+		className: p(!1, g),
+		"aria-label": _("open", r.open),
 		"aria-haspopup": "dialog",
-		onClick: () => g(!0),
+		onClick: () => y(!0),
 		children: /* @__PURE__ */ s(t, {
 			name: "grid",
 			size: "md"
 		})
 	}), /* @__PURE__ */ s(i, {
-		open: h,
-		onClose: () => g(!1),
-		title: m("title", r.title),
-		children: /* @__PURE__ */ s(d, {
+		open: v,
+		onOpenChange: y,
+		title: _("title", r.title),
+		children: /* @__PURE__ */ s(f, {
 			apps: n,
 			currentAppId: a,
 			newLabel: r.new
 		})
 	})] });
 }
-function h({ presentation: e = "modal", labels: t = {}, ...n }) {
-	return s(e === "popover" ? f : m, {
+function _({ presentation: e = "modal", labels: t = {}, ...n }) {
+	return s(e === "popover" ? m : g, {
 		labels: t,
 		...n
 	});
 }
 //#endregion
-export { h as AppLauncher };
+export { _ as AppLauncher };

package/dist/app-root.js

@@ -1,13 +1,16 @@
 'use client';
-import { n as e } from "./_shared/brandmessagescontext.js";
+import { r as e } from "./_shared/brandmessagescontext.js";
 import { SkipLink as t } from "./skip-link.js";
 import { Fragment as n, jsx as r, jsxs as i } from "react/jsx-runtime";
+//#region src/stories/messages/es/appRoot.ts
+var a = { skipToContent: "Saltar al contenido principal" };
+//#endregion
 //#region src/stories/sections/AppRoot/AppRoot.tsx
-function a({ skipLabel: a, skipHref: o = "#main-content", children: s }) {
+function o({ skipLabel: o, skipHref: s = "#main-content", children: c }) {
 	return /* @__PURE__ */ i(n, { children: [/* @__PURE__ */ r(t, {
-		href: o,
-		children: e("appRoot")("skipToContent", a)
-	}), s] });
+		href: s,
+		children: e("appRoot", a)("skipToContent", o)
+	}), c] });
 }
 //#endregion
-export { a as AppRoot };
+export { o as AppRoot };

package/dist/app-shell.js

@@ -1,92 +1,92 @@
 'use client';
 import './app-shell.css';
-import { n as e } from "./_shared/brandmessagescontext.js";
+import { r as e } from "./_shared/brandmessagescontext.js";
 import { SkipLink as t } from "./skip-link.js";
 import { t as n } from "./_shared/css-properties.js";
 import { TooltipProvider as r } from "./tooltip.js";
-import { n as i, t as a } from "./_shared/appshellcontext.js";
-import { t as o } from "./_shared/media-query.js";
+import { t as i } from "./_shared/media-query.js";
+import { n as a, t as o } from "./_shared/appshellcontext.js";
 import { useCallback as s, useEffect as c, useMemo as l, useState as u } from "react";
 import { jsx as d, jsxs as f } from "react/jsx-runtime";
-//#region src/stories/sections/AppShell/AppShell.tsx
-var p = "(min-width: 1024px)";
-function m({ banner: i, header: m, sidebar: h, children: g, contentFlush: _ = !1, defaultSidebar: v = "open", sidebarState: y, onSidebarChange: b, defaultSidebarWidth: x, onSidebarWidthChange: S, skipLabel: C }) {
-	let w = e("appShell"), T = o(p), E = T ?? !0, [D, O] = u(v), [k, A] = u(!1), [j, M] = u(x), N = E ? y ?? D : k ? "open" : "closed", P = s((e) => {
-		E ? (O(e), b?.(e)) : A(e === "open");
-	}, [E, b]), F = s(() => P(N === "open" ? "closed" : "open"), [P, N]), I = s(() => P("closed"), [P]), L = s((e) => {
-		M(e), S?.(e);
-	}, [S]);
+//#region src/stories/messages/es/appShell.ts
+var p = { skipToContent: "Saltar al contenido principal" }, m = "(min-width: 1024px)";
+function h({ banner: a, header: h, sidebar: g, children: _, contentFlush: v = !1, defaultSidebar: y = "open", sidebarState: b, onSidebarChange: x, defaultSidebarWidth: S, onSidebarWidthChange: C, skipLabel: w, className: T }) {
+	let E = e("appShell", p), D = i(m), O = D ?? !0, [k, A] = u(y), [j, M] = u(!1), [N, P] = u(S), F = O ? b ?? k : j ? "open" : "closed", I = s((e) => {
+		O ? (A(e), x?.(e)) : M(e === "open");
+	}, [O, x]), L = s(() => I(F === "open" ? "closed" : "open"), [I, F]), R = s(() => I("closed"), [I]), z = s((e) => {
+		P(e), C?.(e);
+	}, [C]);
 	c(() => {
-		if (E || !k) return;
+		if (O || !j) return;
 		let e = (e) => {
-			e.key === "Escape" && A(!1);
+			e.key === "Escape" && M(!1);
 		};
 		document.addEventListener("keydown", e);
 		let t = document.body.style.overflow;
 		return document.body.style.overflow = "hidden", () => {
 			document.removeEventListener("keydown", e), document.body.style.overflow = t;
 		};
-	}, [E, k]);
-	let R = l(() => ({
-		sidebar: N,
-		setSidebar: P,
-		sidebarWidth: j ?? 0,
-		setSidebarWidth: L,
-		toggleSidebar: F,
-		closeSidebar: I,
-		isDesktop: E
+	}, [O, j]);
+	let B = l(() => ({
+		sidebar: F,
+		setSidebar: I,
+		sidebarWidth: N ?? 0,
+		setSidebarWidth: z,
+		toggleSidebar: L,
+		closeSidebar: R,
+		isDesktop: O
 	}), [
-		N,
-		P,
-		j,
-		L,
 		F,
 		I,
-		E
-	]), [z, B] = u(0), V = s((e) => {
+		N,
+		z,
+		L,
+		R,
+		O
+	]), [V, H] = u(0), U = s((e) => {
 		if (!e) return;
-		let t = () => B(e.getBoundingClientRect().height);
+		let t = () => H(e.getBoundingClientRect().height);
 		if (t(), typeof ResizeObserver > "u") return;
 		let n = new ResizeObserver(t);
 		return n.observe(e), () => {
-			n.disconnect(), B(0);
+			n.disconnect(), H(0);
 		};
-	}, []), H = n({
-		"--app-shell-sidebar-width": j ? `${j}px` : void 0,
-		"--app-shell-banner-height": i ? `${z}px` : void 0
-	}), U = !E && k;
-	return /* @__PURE__ */ d(a.Provider, {
-		value: R,
+	}, []), W = n({
+		"--app-shell-sidebar-width": N ? `${N}px` : void 0,
+		"--app-shell-banner-height": a ? `${V}px` : void 0
+	}), G = !O && j;
+	return /* @__PURE__ */ d(o.Provider, {
+		value: B,
 		children: /* @__PURE__ */ f(r, { children: [/* @__PURE__ */ d(t, {
 			href: "#main-content",
-			children: w("skipToContent", C)
+			children: E("skipToContent", w)
 		}), /* @__PURE__ */ f("div", {
-			ref: H,
-			className: "app-shell",
-			"data-sidebar": N,
-			"data-layout": T === null ? void 0 : E ? "column" : "drawer",
+			ref: W,
+			className: ["app-shell", T].filter(Boolean).join(" "),
+			"data-sidebar": F,
+			"data-layout": D === null ? void 0 : O ? "column" : "drawer",
 			children: [
-				i && /* @__PURE__ */ d("div", {
-					ref: V,
+				a && /* @__PURE__ */ d("div", {
+					ref: U,
 					className: "app-shell__banner",
-					children: i
+					children: a
 				}),
-				m,
+				h,
 				/* @__PURE__ */ f("div", {
 					className: "app-shell__body",
 					children: [
-						h,
-						U && /* @__PURE__ */ d("div", {
+						g,
+						G && /* @__PURE__ */ d("div", {
 							className: "app-shell__backdrop",
-							onClick: I,
+							onClick: R,
 							"aria-hidden": "true"
 						}),
 						/* @__PURE__ */ d("main", {
 							id: "main-content",
 							tabIndex: -1,
-							className: _ ? "app-shell__content app-shell__content--flush" : "app-shell__content",
-							inert: U || void 0,
-							children: g
+							className: v ? "app-shell__content app-shell__content--flush" : "app-shell__content",
+							inert: G || void 0,
+							children: _
 						})
 					]
 				})
@@ -95,4 +95,4 @@ function m({ banner: i, header: m, sidebar: h, children: g, contentFlush: _ = !1
 	});
 }
 //#endregion
-export { m as AppShell, i as useAppShell };
+export { h as AppShell, a as useAppShell };

package/dist/assistant-message.js

@@ -1,6 +1,6 @@
 import './assistant-message.css';
 import { MessageBubble as e } from "./message-bubble.js";
-import { TypingIndicator as t } from "./typing-indicator.js";
+import { t } from "./_shared/typingindicator.js";
 import { t as n } from "./_shared/messagetimestamp.js";
 import { forwardRef as r } from "react";
 import { jsx as i, jsxs as a } from "react/jsx-runtime";

package/dist/async-multi-select-field.js

@@ -1,58 +1,53 @@
 'use client';
 import './async-multi-select-field.css';
-import { AsyncMultiSelect as e } from "./async-multi-select.js";
+import { t as e } from "./_shared/asyncmultiselect.js";
 import { n as t } from "./_shared/form-size.js";
-import { ErrorText as n } from "./error-text.js";
-import { Label as r } from "./label.js";
-import { n as i } from "./_shared/field-labels.js";
-import { forwardRef as a, useId as o } from "react";
-import { jsx as s, jsxs as c } from "react/jsx-runtime";
+import { n } from "./_shared/field-optional.js";
+import { n as r } from "./_shared/field-labels.js";
+import { a as i, n as a } from "./_shared/fieldshell.js";
+import { forwardRef as o } from "react";
+import { jsx as s } from "react/jsx-runtime";
 //#region src/stories/molecules/AsyncMultiSelectField/AsyncMultiSelectField.tsx
-var l = a(function({ id: a, label: l, labelHidden: u, onSearch: d, value: f, defaultValue: p, onValueChange: m, selectedOptions: h, placeholder: g, name: _, disabled: v, readOnly: y, size: b, debounceMs: x, required: S, error: C = !1, errorMessage: w, helperText: T, className: E, emptyMessage: D, removeLabel: O, loadingLabel: k, container: A, onBlur: j }, M) {
-	let N = i(u), P = t(b), F = o(), I = a ?? F, L = w ? `${I}-error` : void 0, R = T ? `${I}-helper` : void 0, z = [L, R].filter(Boolean).join(" ") || void 0, B = C || !!w;
-	return /* @__PURE__ */ c("div", {
-		className: ["async-multi-select-field", E].filter(Boolean).join(" "),
-		children: [
-			/* @__PURE__ */ s(r, {
-				htmlFor: I,
-				hidden: N,
-				size: P,
-				children: l
-			}),
-			/* @__PURE__ */ s(e, {
-				ref: M,
-				id: I,
-				name: _,
-				onSearch: d,
-				value: f,
-				defaultValue: p,
-				onValueChange: m,
-				selectedOptions: h,
-				placeholder: g,
-				disabled: v,
-				readOnly: y,
-				size: P,
-				debounceMs: x,
-				required: S,
-				error: B,
-				emptyMessage: D,
-				removeLabel: O,
-				loadingLabel: k,
-				container: A,
-				"aria-describedby": z,
-				onBlur: j
-			}),
-			w && /* @__PURE__ */ s(n, {
-				id: L,
-				children: w
-			}),
-			T && /* @__PURE__ */ s("span", {
-				id: R,
-				className: "async-multi-select-field__helper",
-				children: T
-			})
-		]
+var c = o(function({ id: o, label: c, optional: l, optionalLabel: u, labelHidden: d, onSearch: f, value: p, defaultValue: m, onValueChange: h, selectedOptions: g, placeholder: _, name: v, disabled: y, readOnly: b, size: x, debounceMs: S, required: C, error: w = !1, errorMessage: T, helperText: E, className: D, emptyMessage: O, removeLabel: k, loadingLabel: A, container: j, onBlur: M }, N) {
+	let P = r(d), F = t(x), I = n(l, C), L = i({
+		id: o,
+		error: w,
+		errorMessage: T,
+		helperText: E
+	}), { id: R } = L;
+	return /* @__PURE__ */ s(a, {
+		field: L,
+		block: "async-multi-select-field",
+		className: D,
+		label: c,
+		optional: I,
+		optionalLabel: u,
+		labelHidden: P,
+		size: F,
+		children: /* @__PURE__ */ s(e, {
+			ref: N,
+			id: R,
+			name: v,
+			onSearch: f,
+			value: p,
+			defaultValue: m,
+			onValueChange: h,
+			selectedOptions: g,
+			placeholder: _,
+			disabled: y,
+			readOnly: b,
+			size: F,
+			debounceMs: S,
+			required: C,
+			error: L.hasError,
+			emptyMessage: O,
+			removeLabel: k,
+			loadingLabel: A,
+			container: j,
+			"aria-describedby": L.describedBy,
+			onBlur: M
+		})
 	});
 });
 //#endregion
-export { l as AsyncMultiSelectField };
+export { c as AsyncMultiSelectField };