@studiolxd/brand 49.28.0 → 51.0.0

package/dist/chat-shell.css

@@ -1 +1 @@
-.chat-shell{background-color:var(--chat-shell-bg);flex-direction:column;block-size:100%;min-block-size:0;display:flex;position:relative}.chat-shell .chat-shell__drawer,.chat-shell .sheet__overlay{position:absolute}.chat-shell .chat-shell__drawer{--sheet-inline-size:100%;--sheet-padding-block:0;--sheet-padding-inline:0;--sheet-gap:0;overflow:visible}.chat-shell__drawer .sheet__body{gap:var(--chat-shell-drawer-gap);flex-direction:column;min-block-size:0;display:flex}.chat-shell__drawer-list{flex:1;min-block-size:0;overflow-y:auto}.chat-shell__list{inline-size:var(--chat-shell-list-width);flex-shrink:0;block-size:100%;overflow-y:auto}.chat-shell.chat-shell--with-list{gap:var(--chat-shell-gap);flex-direction:row}.chat-shell__main{flex-direction:column;flex:1;min-block-size:0;display:flex}.chat-shell__header{justify-content:space-between;align-items:center;gap:var(--chat-shell-header-gap);flex-shrink:0;display:flex}.chat-shell__list-trigger{flex-shrink:0;align-self:flex-start}.chat-shell__header-content{justify-content:space-between;align-items:center;gap:var(--chat-shell-header-gap);flex:1;min-inline-size:0;display:flex}.chat-shell__thread{--conversation-thread-padding-inline:var(--chat-shell-thread-padding-inline);min-block-size:0;padding-block:var(--chat-shell-thread-padding-block);flex-direction:column;flex:1;display:flex;overflow-y:auto}.chat-shell__composer{flex-shrink:0}@media (width<=1023.98px){.chat-shell:not([data-layout]) .chat-shell__list{display:none}.chat-shell.chat-shell--with-list:not([data-layout]){flex-direction:column}}
+.chat-shell{background-color:var(--chat-shell-bg);flex-direction:column;block-size:100%;min-block-size:0;display:flex;position:relative}.chat-shell .chat-shell__drawer,.chat-shell .sheet__overlay{position:absolute}.chat-shell .chat-shell__drawer{--sheet-width:100%;--sheet-padding-block:0;--sheet-padding-inline:0;--sheet-gap:0;overflow:visible}.chat-shell__drawer .sheet__body{gap:var(--chat-shell-drawer-gap);flex-direction:column;min-block-size:0;display:flex}.chat-shell__drawer-list{flex:1;min-block-size:0;overflow-y:auto}.chat-shell__list{inline-size:var(--chat-shell-list-width);flex-shrink:0;block-size:100%;overflow-y:auto}.chat-shell.chat-shell--with-list{gap:var(--chat-shell-gap);flex-direction:row}.chat-shell__main{flex-direction:column;flex:1;min-block-size:0;display:flex}.chat-shell__header{justify-content:space-between;align-items:center;gap:var(--chat-shell-header-gap);flex-shrink:0;display:flex}.chat-shell__list-trigger{flex-shrink:0;align-self:flex-start}.chat-shell__header-content{justify-content:space-between;align-items:center;gap:var(--chat-shell-header-gap);flex:1;min-inline-size:0;display:flex}.chat-shell__thread{--conversation-thread-padding-inline:var(--chat-shell-thread-padding-inline);min-block-size:0;padding-block:var(--chat-shell-thread-padding-block);flex-direction:column;flex:1;display:flex;overflow-y:auto}.chat-shell__composer{flex-shrink:0}@media (width<=1023.98px){.chat-shell:not([data-layout]) .chat-shell__list{display:none}.chat-shell.chat-shell--with-list:not([data-layout]){flex-direction:column}}

package/dist/chat-shell.js

@@ -1,100 +1,104 @@
 'use client';
 import './chat-shell.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 { Button as n } from "./button.js";
-import { Sheet as r } from "./sheet.js";
-import { t as i } from "./_shared/media-query.js";
-import { forwardRef as a, useCallback as o, useState as s } from "react";
-import { jsx as c, jsxs as l } from "react/jsx-runtime";
-//#region src/stories/templates/ChatShell/ChatShell.tsx
-var u = "(min-width: 1024px)", d = a(function({ list: a, header: d, children: f, composer: p, listLabel: m, listTriggerLabel: h, listOpen: g, onListOpenChange: _, className: v, ...y }, b) {
-	let x = e("chatShell"), S = i(u), C = S ?? !0, [w, T] = s(!1), [E, D] = s(null), O = o((e) => {
-		D(e), typeof b == "function" ? b(e) : b && (b.current = e);
-	}, [b]), [k, A] = s(S);
-	S !== k && (A(S), S && T(!1));
-	let j = o((e) => {
-		g === void 0 && T(e), _?.(e);
-	}, [g, _]), M = !C && (g ?? w), N = a != null && C, P = a != null && !C;
-	return /* @__PURE__ */ l("div", {
-		ref: O,
+import { t as r } from "./_shared/assign-ref.js";
+import { t as i } from "./_shared/sheet.js";
+import { t as a } from "./_shared/media-query.js";
+import { forwardRef as o, useCallback as s, useState as c } from "react";
+import { jsx as l, jsxs as u } from "react/jsx-runtime";
+//#region src/stories/messages/es/chatShell.ts
+var d = {
+	list: "Conversaciones",
+	listTrigger: "Abrir conversaciones"
+}, f = "(min-width: 1024px)", p = o(function({ list: o, header: p, children: m, composer: h, listLabel: g, listTriggerLabel: _, listOpen: v, onListOpenChange: y, className: b, ...x }, S) {
+	let C = e("chatShell", d), w = a(f), T = w ?? !0, [E, D] = c(!1), [O, k] = c(null), A = s((e) => {
+		k(e), r(S, e);
+	}, [S]), [j, M] = c(w);
+	w !== j && (M(w), w && D(!1));
+	let N = s((e) => {
+		v === void 0 && D(e), y?.(e);
+	}, [v, y]), P = !T && (v ?? E), F = o != null && T, I = o != null && !T;
+	return /* @__PURE__ */ u("div", {
+		ref: A,
 		className: [
 			"chat-shell",
-			N ? "chat-shell--with-list" : "",
-			v ?? ""
+			F ? "chat-shell--with-list" : "",
+			b ?? ""
 		].filter(Boolean).join(" "),
-		"data-layout": S === null ? void 0 : C ? "column" : "drawer",
-		...y,
+		"data-layout": w === null ? void 0 : T ? "column" : "drawer",
+		...x,
 		children: [
-			N && /* @__PURE__ */ c("aside", {
+			F && /* @__PURE__ */ l("aside", {
 				className: "chat-shell__list",
-				"aria-label": x("list", m),
-				children: a
+				"aria-label": C("list", g),
+				children: o
 			}),
-			/* @__PURE__ */ l("div", {
+			/* @__PURE__ */ u("div", {
 				className: "chat-shell__main",
 				children: [
-					(d || P) && /* @__PURE__ */ l("header", {
+					(p || I) && /* @__PURE__ */ u("header", {
 						className: "chat-shell__header",
-						children: [P && /* @__PURE__ */ c(n, {
+						children: [I && /* @__PURE__ */ l(n, {
 							variant: "ghost",
 							size: "sm",
 							iconOnly: !0,
-							"aria-label": x("listTrigger", h),
+							"aria-label": C("listTrigger", _),
 							"aria-haspopup": "dialog",
-							"aria-expanded": M,
+							"aria-expanded": P,
 							className: "chat-shell__list-trigger",
-							onClick: () => j(!0),
-							children: /* @__PURE__ */ c(t, {
+							onClick: () => N(!0),
+							children: /* @__PURE__ */ l(t, {
 								name: "layout-sidebar",
 								size: "sm"
 							})
-						}), d && /* @__PURE__ */ c("div", {
+						}), p && /* @__PURE__ */ l("div", {
 							className: "chat-shell__header-content",
-							children: d
+							children: p
 						})]
 					}),
-					/* @__PURE__ */ c("div", {
+					/* @__PURE__ */ l("div", {
 						className: "chat-shell__thread",
-						children: f
+						children: m
 					}),
-					p && /* @__PURE__ */ c("div", {
+					h && /* @__PURE__ */ l("div", {
 						className: "chat-shell__composer",
-						children: p
+						children: h
 					})
 				]
 			}),
-			P && /* @__PURE__ */ l(r, {
+			I && /* @__PURE__ */ u(i, {
 				side: "left",
-				open: M,
-				onOpenChange: j,
-				title: x("list", m),
+				open: P,
+				onOpenChange: N,
+				title: C("list", g),
 				titleHidden: !0,
-				container: E ?? void 0,
+				container: O ?? void 0,
 				hideClose: !0,
 				className: "chat-shell__drawer",
-				children: [/* @__PURE__ */ c("header", {
+				children: [/* @__PURE__ */ l("header", {
 					className: "chat-shell__header",
-					children: /* @__PURE__ */ c(n, {
+					children: /* @__PURE__ */ l(n, {
 						variant: "ghost",
 						size: "sm",
 						iconOnly: !0,
-						"aria-label": x("listTrigger", h),
+						"aria-label": C("listTrigger", _),
 						"aria-expanded": !0,
 						className: "chat-shell__list-trigger",
-						onClick: () => j(!1),
-						children: /* @__PURE__ */ c(t, {
+						onClick: () => N(!1),
+						children: /* @__PURE__ */ l(t, {
 							name: "layout-sidebar",
 							size: "sm"
 						})
 					})
-				}), /* @__PURE__ */ c("div", {
+				}), /* @__PURE__ */ l("div", {
 					className: "chat-shell__drawer-list",
-					children: a
+					children: o
 				})]
 			})
 		]
 	});
 });
 //#endregion
-export { d as ChatShell };
+export { p as ChatShell };

package/dist/checkbox-field.js

@@ -1,55 +1,46 @@
 'use client';
 import './checkbox-field.css';
-import { VisuallyHidden as e } from "./visually-hidden.js";
-import { n as t } from "./_shared/form-size.js";
-import { Checkbox as n } from "./checkbox.js";
-import { ErrorText as r } from "./error-text.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 as e } from "./_shared/form-size.js";
+import { Checkbox as t } from "./checkbox.js";
+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/CheckboxField/CheckboxField.tsx
-var l = a(function({ label: a, labelHidden: l, checked: u, defaultChecked: d, disabled: f, size: p, id: m, name: h, value: g, error: _ = !1, errorMessage: v, helperText: y, className: b, onCheckedChange: x, onBlur: S }, C) {
-	let w = i(l), T = t(p), E = o(), D = m ?? E, O = v ? `${D}-error` : void 0, k = y ? `${D}-helper` : void 0, A = [O, k].filter(Boolean).join(" ") || void 0, j = _ || !!v;
-	return /* @__PURE__ */ c("div", {
-		className: [
-			"checkbox-field",
-			T === "md" ? "" : `checkbox-field--${T}`,
-			f ? "checkbox-field--disabled" : "",
-			b
-		].filter(Boolean).join(" "),
-		children: [
-			/* @__PURE__ */ c("label", {
-				className: "checkbox-field__control",
-				htmlFor: D,
-				children: [/* @__PURE__ */ s(n, {
-					ref: C,
-					id: D,
-					checked: u,
-					defaultChecked: d,
-					disabled: f,
-					size: T,
-					name: h,
-					value: g,
-					error: j,
-					"aria-describedby": A,
-					onCheckedChange: x,
-					onBlur: S
-				}), s(w ? e : "span", {
-					className: "checkbox-field__label",
-					children: a
-				})]
-			}),
-			v && /* @__PURE__ */ s(r, {
-				id: O,
-				children: v
-			}),
-			y && /* @__PURE__ */ s("span", {
-				id: k,
-				className: "checkbox-field__helper",
-				children: y
-			})
-		]
+var c = o(function({ label: o, optional: c, optionalLabel: l, labelHidden: u, checked: d, defaultChecked: f, disabled: p, required: m, size: h, id: g, name: _, value: v, error: y = !1, errorMessage: b, helperText: x, className: S, onCheckedChange: C, onBlur: w }, T) {
+	let E = r(u), D = e(h), O = n(c, m), k = i({
+		id: g,
+		error: y,
+		errorMessage: b,
+		helperText: x
+	}), { id: A } = k;
+	return /* @__PURE__ */ s(a, {
+		field: k,
+		block: "checkbox-field",
+		modifiers: [D !== "md" && `checkbox-field--${D}`, p && "checkbox-field--disabled"],
+		className: S,
+		layout: "inline",
+		label: o,
+		optional: O,
+		optionalLabel: l,
+		labelHidden: E,
+		children: /* @__PURE__ */ s(t, {
+			ref: T,
+			id: A,
+			checked: d,
+			defaultChecked: f,
+			disabled: p,
+			required: m,
+			size: D,
+			name: _,
+			value: v,
+			error: k.hasError,
+			"aria-describedby": k.describedBy,
+			onCheckedChange: C,
+			onBlur: w
+		})
 	});
 });
 //#endregion
-export { l as CheckboxField };
+export { c as CheckboxField };

package/dist/checkbox.css

@@ -1 +1 @@
-.checkbox{all:unset;box-sizing:border-box;width:var(--checkbox-size);height:var(--checkbox-size);border-width:var(--checkbox-border-width);border-style:var(--checkbox-border-style);border-color:var(--checkbox-border-color);border-radius:var(--checkbox-border-radius);background-color:var(--checkbox-bg);cursor:var(--checkbox-cursor);transition:background-color var(--checkbox-transition-duration) var(--checkbox-transition-easing), border-color var(--checkbox-transition-duration) var(--checkbox-transition-easing);flex-shrink:0;place-content:center;display:grid;position:relative}.checkbox:after{content:"";inline-size:max(100%, var(--checkbox-target-size));block-size:max(100%, var(--checkbox-target-size));position:absolute;inset-block-start:50%;inset-inline-start:50%;translate:-50% -50%}.checkbox__indicator{width:var(--checkbox-check-size);height:var(--checkbox-check-size);background-color:var(--checkbox-check-color);clip-path:polygon(14% 44%,0 65%,50% 100%,100% 16%,80% 0%,43% 62%);transform:scale(0) rotate(var(--checkbox-check-rotate));transition:transform var(--checkbox-transition-duration) var(--checkbox-transition-easing)}.checkbox[data-indeterminate] .checkbox__indicator{clip-path:none;width:60%;height:var(--checkbox-border-width);background-color:var(--checkbox-check-color);transform:none}.checkbox[data-checked]{background-color:var(--checkbox-bg-checked)}.checkbox[data-checked] .checkbox__indicator,.checkbox[data-indeterminate] .checkbox__indicator{transform:scale(1) rotate(var(--checkbox-check-rotate))}.checkbox[data-indeterminate] .checkbox__indicator{transform:none}.checkbox:focus-visible{outline:var(--checkbox-focus-ring-width) solid var(--checkbox-focus-ring-color);outline-offset:var(--checkbox-focus-ring-offset)}.checkbox[data-disabled]{border-color:var(--checkbox-disabled-border-color);cursor:var(--checkbox-disabled-cursor);pointer-events:none}.checkbox.checkbox--error{border-color:var(--checkbox-error-border-color)}.checkbox[data-disabled][data-checked],.checkbox[data-disabled][data-indeterminate]{background-color:var(--checkbox-disabled-bg-checked);border-color:var(--checkbox-disabled-border-color)}.checkbox.checkbox--sm{--checkbox-size:var(--checkbox-sm-size);--checkbox-check-size:var(--checkbox-sm-check-size)}.checkbox.checkbox--lg{--checkbox-size:var(--checkbox-lg-size);--checkbox-check-size:var(--checkbox-lg-check-size)}
+.checkbox{all:unset;box-sizing:border-box;inline-size:var(--checkbox-size);block-size:var(--checkbox-size);border-width:var(--checkbox-border-width);border-style:var(--checkbox-border-style);border-color:var(--checkbox-border-color);border-radius:var(--checkbox-border-radius);background-color:var(--checkbox-bg);cursor:var(--checkbox-cursor);transition:background-color var(--checkbox-transition-duration) var(--checkbox-transition-easing), border-color var(--checkbox-transition-duration) var(--checkbox-transition-easing);flex-shrink:0;place-content:center;display:grid;position:relative}.checkbox:after{content:"";inline-size:max(100%, var(--checkbox-target-size));block-size:max(100%, var(--checkbox-target-size));position:absolute;inset-block-start:50%;inset-inline-start:50%;translate:-50% -50%}.checkbox__indicator{inline-size:var(--checkbox-check-size);block-size:var(--checkbox-check-size);background-color:var(--checkbox-check-color);clip-path:polygon(14% 44%,0 65%,50% 100%,100% 16%,80% 0%,43% 62%);transform:scale(0) rotate(var(--checkbox-check-rotate));transition:transform var(--checkbox-transition-duration) var(--checkbox-transition-easing)}.checkbox[data-indeterminate] .checkbox__indicator{clip-path:none;inline-size:60%;block-size:var(--checkbox-border-width);background-color:var(--checkbox-check-color);transform:none}.checkbox[data-checked]{background-color:var(--checkbox-checked-bg)}.checkbox[data-checked] .checkbox__indicator,.checkbox[data-indeterminate] .checkbox__indicator{transform:scale(1) rotate(var(--checkbox-check-rotate))}.checkbox[data-indeterminate] .checkbox__indicator{transform:none}.checkbox:focus-visible{outline:var(--checkbox-focus-ring-width) solid var(--checkbox-focus-ring-color);outline-offset:var(--checkbox-focus-ring-offset)}.checkbox[data-disabled]{border-color:var(--checkbox-disabled-border-color);cursor:var(--checkbox-disabled-cursor);pointer-events:none}.checkbox.checkbox--error{border-color:var(--checkbox-error-border-color)}.checkbox[data-disabled][data-checked],.checkbox[data-disabled][data-indeterminate]{background-color:var(--checkbox-checked-disabled-bg);border-color:var(--checkbox-disabled-border-color)}.checkbox.checkbox--sm{--checkbox-size:var(--checkbox-sm-size);--checkbox-check-size:var(--checkbox-sm-check-size)}.checkbox.checkbox--lg{--checkbox-size:var(--checkbox-lg-size);--checkbox-check-size:var(--checkbox-lg-check-size)}

package/dist/clock-widget.js

@@ -1,10 +1,10 @@
 'use client';
 import './clock-widget.css';
-import { n as e } from "./_shared/brandmessagescontext.js";
+import { r as e } from "./_shared/brandmessagescontext.js";
 import { Button as t } from "./button.js";
 import { Heading as n } from "./heading.js";
-import { Alert as r } from "./alert.js";
-import { Table as i, TableBody as a, TableCell as o, TableFooter as s, TableHead as c, TableHeader as l, TableRow as u } from "./table.js";
+import { t as r } from "./_shared/alert.js";
+import { a as i, i as a, n as o, o as s, r as c, s as l, t as u } from "./_shared/table.js";
 import { forwardRef as d, useEffect as f, useState as p } from "react";
 import { Fragment as m, jsx as h, jsxs as g } from "react/jsx-runtime";
 //#region src/stories/molecules/ClockWidget/clockDuration.ts
@@ -19,19 +19,35 @@ function y(e) {
 	return e.some((e) => e.end === null || e.end === void 0);
 }
 //#endregion
-//#region src/stories/molecules/ClockWidget/ClockWidget.tsx
-var b = d(function({ entries: d, date: b, dayState: x = "working", onClockIn: S, onClockOut: C, pending: w = !1, disabled: T = !1, error: E, now: D, locale: O = "es-ES", timeZone: k, headingLevel: A = 2, showEntries: j = !0, footer: M, titleLabel: N, clockInLabel: P, clockOutLabel: F, pendingLabel: I, elapsedLabel: L, dayStateLabel: R, formatDuration: z, className: B, ...V }, H) {
-	let U = e("clockWidget"), W = y(d), G = W && D === void 0, [K, q] = p(() => Date.now());
+//#region src/stories/messages/es/clockWidget.ts
+var b = {
+	title: "Fichaje",
+	clockIn: "Fichar entrada",
+	clockOut: "Fichar salida",
+	pending: "Fichando…",
+	elapsed: "Trabajado hoy",
+	entries: "Fichajes de hoy",
+	in: "Entrada",
+	out: "Salida",
+	duration: "Duración",
+	running: "en curso",
+	total: "Total",
+	nonWorking: "Día no laborable",
+	vacation: "Día de vacaciones",
+	absence: "Día de ausencia",
+	durationValue: (e, t) => e === 0 ? `${t} min` : t === 0 ? `${e} h` : `${e} h ${t} min`
+}, x = d(function({ entries: d, date: x, dayState: S = "working", onClockIn: C, onClockOut: w, pending: T = !1, disabled: E = !1, error: D, now: O, locale: ee = "es-ES", timeZone: k, headingLevel: A = 2, showEntries: j = !0, footer: M, titleLabel: N, clockInLabel: P, clockOutLabel: F, pendingLabel: I, elapsedLabel: L, dayStateLabel: R, formatDuration: z, className: B, ...V }, H) {
+	let U = e("clockWidget", b), W = y(d), G = W && O === void 0, [K, q] = p(() => Date.now());
 	f(() => {
 		if (!G) return;
 		let e = setInterval(() => q(Date.now()), 1e3);
 		return () => clearInterval(e);
 	}, [G]);
-	let J = D ?? new Date(K), Y = new Intl.DateTimeFormat(O, {
+	let J = O ?? new Date(K), Y = new Intl.DateTimeFormat(ee, {
 		hour: "2-digit",
 		minute: "2-digit",
 		timeZone: k
-	}), X = (e) => (z ?? U("durationValue"))(Math.floor(e / 60), e % 60), Z = v(d, J), Q = x === "working", $ = R ?? (Q ? null : U(x === "vacation" ? "vacation" : x === "absence" ? "absence" : "nonWorking"));
+	}), X = (e) => (z ?? U("durationValue"))(Math.floor(e / 60), e % 60), Z = v(d, J), Q = S === "working", $ = R ?? (Q ? null : U(S === "vacation" ? "vacation" : S === "absence" ? "absence" : "nonWorking"));
 	return /* @__PURE__ */ g("section", {
 		ref: H,
 		className: ["clock-widget", B].filter(Boolean).join(" "),
@@ -44,9 +60,9 @@ var b = d(function({ entries: d, date: b, dayState: x = "working", onClockIn: S,
 						level: A,
 						children: U("title", N)
 					}),
-					b ? /* @__PURE__ */ h("p", {
+					x ? /* @__PURE__ */ h("p", {
 						className: "clock-widget__date",
-						children: b
+						children: x
 					}) : null,
 					$ ? /* @__PURE__ */ g("p", {
 						className: "clock-widget__status",
@@ -57,9 +73,9 @@ var b = d(function({ entries: d, date: b, dayState: x = "working", onClockIn: S,
 					}) : null
 				]
 			}),
-			E ? /* @__PURE__ */ h(r, {
-				variant: "error",
-				children: E
+			D ? /* @__PURE__ */ h(r, {
+				tone: "error",
+				children: D
 			}) : null,
 			Q ? /* @__PURE__ */ g(m, { children: [
 				/* @__PURE__ */ g("p", {
@@ -73,45 +89,45 @@ var b = d(function({ entries: d, date: b, dayState: x = "working", onClockIn: S,
 						children: U("elapsed", L)
 					})]
 				}),
-				W && C ? /* @__PURE__ */ h("p", {
+				W && w ? /* @__PURE__ */ h("p", {
 					className: "clock-widget__actions",
 					children: /* @__PURE__ */ h(t, {
 						type: "button",
 						variant: "outline",
 						destructive: !0,
-						disabled: w || T,
-						onClick: C,
-						children: w ? U("pending", I) : U("clockOut", F)
+						disabled: T || E,
+						onClick: w,
+						children: T ? U("pending", I) : U("clockOut", F)
 					})
 				}) : null,
-				!W && S ? /* @__PURE__ */ h("p", {
+				!W && C ? /* @__PURE__ */ h("p", {
 					className: "clock-widget__actions",
 					children: /* @__PURE__ */ h(t, {
 						type: "button",
 						variant: "primary",
-						disabled: w || T,
-						onClick: S,
-						children: w ? U("pending", I) : U("clockIn", P)
+						disabled: T || E,
+						onClick: C,
+						children: T ? U("pending", I) : U("clockIn", P)
 					})
 				}) : null,
-				j && d.length > 0 ? /* @__PURE__ */ g(i, {
+				j && d.length > 0 ? /* @__PURE__ */ g(u, {
 					caption: U("entries"),
 					size: "sm",
 					children: [
-						/* @__PURE__ */ h(c, { children: /* @__PURE__ */ g(u, { children: [
-							/* @__PURE__ */ h(l, { children: U("in") }),
-							/* @__PURE__ */ h(l, { children: U("out") }),
-							/* @__PURE__ */ h(l, { children: U("duration") })
+						/* @__PURE__ */ h(i, { children: /* @__PURE__ */ g(l, { children: [
+							/* @__PURE__ */ h(s, { children: U("in") }),
+							/* @__PURE__ */ h(s, { children: U("out") }),
+							/* @__PURE__ */ h(s, { children: U("duration") })
 						] }) }),
-						/* @__PURE__ */ h(a, { children: d.map((e) => /* @__PURE__ */ g(u, { children: [
-							/* @__PURE__ */ h(o, { children: Y.format(e.start) }),
-							/* @__PURE__ */ h(o, { children: e.end ? Y.format(e.end) : U("running") }),
-							/* @__PURE__ */ h(o, { children: X(_(e, J)) })
+						/* @__PURE__ */ h(o, { children: d.map((e) => /* @__PURE__ */ g(l, { children: [
+							/* @__PURE__ */ h(c, { children: Y.format(e.start) }),
+							/* @__PURE__ */ h(c, { children: e.end ? Y.format(e.end) : U("running") }),
+							/* @__PURE__ */ h(c, { children: X(_(e, J)) })
 						] }, e.id)) }),
-						d.length > 1 ? /* @__PURE__ */ h(s, { children: /* @__PURE__ */ g(u, { children: [/* @__PURE__ */ h(o, {
+						d.length > 1 ? /* @__PURE__ */ h(a, { children: /* @__PURE__ */ g(l, { children: [/* @__PURE__ */ h(c, {
 							colSpan: 2,
 							children: U("total")
-						}), /* @__PURE__ */ h(o, { children: X(Z) })] }) }) : null
+						}), /* @__PURE__ */ h(c, { children: X(Z) })] }) }) : null
 					]
 				}) : null
 			] }) : null,
@@ -123,4 +139,4 @@ var b = d(function({ entries: d, date: b, dayState: x = "working", onClockIn: S,
 	});
 });
 //#endregion
-export { b as ClockWidget };
+export { x as ClockWidget };

package/dist/close-button.js

@@ -1,22 +1,3 @@
 'use client';
-import './close-button.css';
-import { Icon as e } from "./icon.js";
-import { forwardRef as t } from "react";
-import { jsx as n } from "react/jsx-runtime";
-//#region src/stories/atoms/CloseButton/CloseButton.tsx
-var r = t(function({ label: t = "Cerrar", size: r = "md", className: i, ...a }, o) {
-	return /* @__PURE__ */ n("button", {
-		ref: o,
-		type: "button",
-		className: [
-			"close-button",
-			r === "md" ? "" : `close-button--${r}`,
-			i
-		].filter(Boolean).join(" "),
-		"aria-label": t,
-		...a,
-		children: /* @__PURE__ */ n(e, { name: "close" })
-	});
-});
-//#endregion
-export { r as CloseButton };
+import { t as e } from "./_shared/closebutton.js";
+export { e as CloseButton };

package/dist/code-block.js

@@ -1,69 +1,75 @@
 'use client';
 import './code-block.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 { VisuallyHidden as n } from "./visually-hidden.js";
 import { Button as r } from "./button.js";
-import { n as i } from "./_shared/copy-to-clipboard.js";
-import { Tag as a } from "./tag.js";
-import { useRef as o } from "react";
-import { Fragment as s, jsx as c, jsxs as l } from "react/jsx-runtime";
+import { r as i, t as a } from "./_shared/copy.js";
+import { Tag as o } from "./tag.js";
+import { useRef as s } from "react";
+import { Fragment as c, jsx as l, jsxs as u } from "react/jsx-runtime";
+//#region src/stories/messages/es/codeBlock.ts
+var d = {
+	copy: "Copiar código",
+	region: (e) => e ? `Bloque de código ${e}` : "Bloque de código"
+};
+//#endregion
 //#region src/stories/molecules/CodeBlock/CodeBlock.tsx
-function u({ children: u, language: d, copyable: f = !1, singleLine: p, copyLabel: m, copiedLabel: h, codeLabel: g, className: _, ...v }) {
-	let y = e("codeBlock"), b = e("copy"), x = o(null), { status: S, copy: C } = i(), w = S === "copied", T = () => C(() => x.current?.textContent ?? ""), E = typeof u == "string" && !u.includes("\n"), D = p ?? E, O = !!d || f, k = [
+function f({ children: f, language: p, copyable: m = !1, singleLine: h, copyLabel: g, copiedLabel: _, codeLabel: v, className: y, ...b }) {
+	let x = e("codeBlock", d), S = e("copy", a), C = s(null), { status: w, copy: T } = i(), E = w === "copied", D = () => T(() => C.current?.textContent ?? ""), O = typeof f == "string" && !f.includes("\n"), k = h ?? O, A = !!p || m, j = [
 		"code-block",
-		D ? "code-block--single-line" : "",
-		_ ?? ""
-	].filter(Boolean).join(" "), A = d && /* @__PURE__ */ c(a, {
-		variant: "neutral",
+		k ? "code-block--single-line" : "",
+		y ?? ""
+	].filter(Boolean).join(" "), M = p && /* @__PURE__ */ l(o, {
+		tone: "neutral",
 		className: "code-block__language",
-		children: d
-	}), j = f && /* @__PURE__ */ l(s, { children: [/* @__PURE__ */ c(r, {
+		children: p
+	}), N = m && /* @__PURE__ */ u(c, { children: [/* @__PURE__ */ l(r, {
 		iconOnly: !0,
 		variant: "ghost",
 		size: "sm",
-		"aria-label": y("copy", m),
-		onClick: T,
+		"aria-label": x("copy", g),
+		onClick: D,
 		className: "code-block__copy",
-		children: /* @__PURE__ */ c(t, {
-			name: w ? "check" : "copy",
+		children: /* @__PURE__ */ l(t, {
+			name: E ? "check" : "copy",
 			size: "sm"
 		})
-	}), /* @__PURE__ */ c(n, {
+	}), /* @__PURE__ */ l(n, {
 		role: "status",
-		children: w ? b("copied", h) : ""
-	})] }), M = /* @__PURE__ */ c("pre", {
+		children: E ? S("copied", _) : ""
+	})] }), P = /* @__PURE__ */ l("pre", {
 		className: "code-block__pre",
 		tabIndex: 0,
 		role: "region",
-		"aria-label": y("region", g)(d),
-		children: /* @__PURE__ */ c("code", {
-			ref: x,
+		"aria-label": x("region", v)(p),
+		children: /* @__PURE__ */ l("code", {
+			ref: C,
 			className: "code-block__code",
-			children: u
+			children: f
 		})
 	});
-	return D ? /* @__PURE__ */ c("div", {
-		className: k,
-		...v,
-		children: /* @__PURE__ */ l("div", {
+	return k ? /* @__PURE__ */ l("div", {
+		className: j,
+		...b,
+		children: /* @__PURE__ */ u("div", {
 			className: "code-block__row",
-			children: [M, O && /* @__PURE__ */ l("div", {
+			children: [P, A && /* @__PURE__ */ u("div", {
 				className: "code-block__controls",
-				children: [A, j]
+				children: [M, N]
 			})]
 		})
-	}) : /* @__PURE__ */ l("div", {
-		className: k,
-		...v,
-		children: [O && /* @__PURE__ */ l("div", {
+	}) : /* @__PURE__ */ u("div", {
+		className: j,
+		...b,
+		children: [A && /* @__PURE__ */ u("div", {
 			className: "code-block__header",
-			children: [A, j]
-		}), M]
+			children: [M, N]
+		}), P]
 	});
 }
-function d({ type: e, className: t, children: n, ...r }) {
-	return /* @__PURE__ */ c("span", {
+function p({ type: e, className: t, children: n, ...r }) {
+	return /* @__PURE__ */ l("span", {
 		className: [
 			"code-block__token",
 			`code-block__token--${e}`,
@@ -74,4 +80,4 @@ function d({ type: e, className: t, children: n, ...r }) {
 	});
 }
 //#endregion
-export { u as CodeBlock, d as CodeToken };
+export { f as CodeBlock, p as CodeToken };

package/dist/collapsible.css

@@ -1 +1 @@
-.collapsible{inline-size:100%}.collapsible__trigger{all:unset;box-sizing:border-box;align-items:center;gap:var(--collapsible-trigger-gap);inline-size:100%;padding-block:var(--collapsible-trigger-padding-block);font-family:var(--collapsible-trigger-font-family);font-size:var(--collapsible-trigger-font-size);font-weight:var(--collapsible-trigger-font-weight);color:var(--collapsible-trigger-color);cursor:var(--collapsible-trigger-cursor);text-align:start;padding-inline:0;display:flex}.collapsible__trigger:focus-visible{outline:var(--collapsible-focus-ring-width) solid var(--collapsible-focus-ring-color);outline-offset:var(--collapsible-focus-ring-offset)}.collapsible__trigger[data-disabled]{opacity:var(--collapsible-disabled-opacity);cursor:var(--collapsible-disabled-cursor)}.collapsible__trigger-text{flex:1;min-inline-size:0}.collapsible__chevron{transition:transform var(--collapsible-transition-duration) var(--collapsible-transition-easing);flex-shrink:0;transform:rotate(90deg)}.collapsible__trigger[data-panel-open] .collapsible__chevron{transform:rotate(-90deg)}.collapsible__content{overflow:hidden}.collapsible__content[data-open]{animation:collapsible-open var(--collapsible-transition-duration) var(--collapsible-transition-easing)}.collapsible__content[data-closed]{animation:collapsible-close var(--collapsible-transition-duration) var(--collapsible-transition-easing)}@keyframes collapsible-open{0%{block-size:0}to{block-size:var(--collapsible-panel-height)}}@keyframes collapsible-close{0%{block-size:var(--collapsible-panel-height)}to{block-size:0}}.collapsible__content-inner{padding-block-end:var(--collapsible-content-padding-block)}
+.collapsible{inline-size:100%}.collapsible__trigger{all:unset;box-sizing:border-box;align-items:center;gap:var(--collapsible-trigger-gap);inline-size:100%;padding-block:var(--collapsible-trigger-padding-block);font-family:var(--collapsible-trigger-font-family);font-size:var(--collapsible-trigger-font-size);font-weight:var(--collapsible-trigger-font-weight);line-height:var(--collapsible-trigger-line-height);color:var(--collapsible-trigger-color);cursor:var(--collapsible-trigger-cursor);text-align:start;padding-inline:0;display:flex}.collapsible__trigger:focus-visible{outline:var(--collapsible-focus-ring-width) solid var(--collapsible-focus-ring-color);outline-offset:var(--collapsible-focus-ring-offset)}.collapsible__trigger[data-disabled]{opacity:var(--collapsible-disabled-opacity);cursor:var(--collapsible-disabled-cursor)}.collapsible__trigger-text{flex:1;min-inline-size:0}.collapsible__chevron{transition:transform var(--collapsible-transition-duration) var(--collapsible-transition-easing);flex-shrink:0;transform:rotate(90deg)}.collapsible__trigger[data-panel-open] .collapsible__chevron{transform:rotate(-90deg)}.collapsible__content{overflow:hidden}.collapsible__content[data-open]{animation:collapsible-open var(--collapsible-transition-duration) var(--collapsible-transition-easing)}.collapsible__content[data-closed]{animation:collapsible-close var(--collapsible-transition-duration) var(--collapsible-transition-easing)}@keyframes collapsible-open{0%{block-size:0}to{block-size:var(--collapsible-panel-height)}}@keyframes collapsible-close{0%{block-size:var(--collapsible-panel-height)}to{block-size:0}}.collapsible__content-inner{padding-block-end:var(--collapsible-content-padding-block)}