@studiolxd/brand 49.28.0 → 51.0.0

package/dist/pagination.js

@@ -1,181 +1,4 @@
 'use client';
 import './pagination.css';
-import { n as e } from "./_shared/brandmessagescontext.js";
-import { Icon as t } from "./icon.js";
-import { Select as n } from "./select.js";
-import { jsx as r, jsxs as i } from "react/jsx-runtime";
-//#region src/stories/molecules/Pagination/Pagination.tsx
-function a(e) {
-	return [
-		{
-			label: "10",
-			value: "10"
-		},
-		{
-			label: "20",
-			value: "20"
-		},
-		{
-			label: "50",
-			value: "50"
-		},
-		{
-			label: "100",
-			value: "100"
-		},
-		{
-			label: e,
-			value: "all"
-		}
-	];
-}
-function o(e, t) {
-	return t <= 3 ? Array.from({ length: t }, (e, t) => t + 1) : e <= 3 ? [
-		1,
-		2,
-		3,
-		"..."
-	] : e >= t - 2 ? [
-		"...",
-		t - 2,
-		t - 1,
-		t
-	] : [
-		"...",
-		e - 1,
-		e,
-		e + 1,
-		"..."
-	];
-}
-function s({ mode: s = "pages", total: c, pageCount: l, page: u = 1, pageSize: d = 10, hrefs: f, previousHref: p, nextHref: m, onPrevious: h, onNext: g, onPageChange: _, hrefBuilder: v, linkComponent: y, onPageSizeChange: b, pageSizeOptions: x, afterPageSize: S, showTotal: C = !1, size: w = "md", ariaLabel: T, pageLabel: E, previousLabel: D, nextLabel: O, pagesGroupLabel: k, pageSizeLabel: A, totalLabel: j, className: M }) {
-	let N = e("pagination"), P = v ?? (f ? (e) => f[e] : void 0), F = y ?? "a";
-	if (s === "cursor") {
-		let e = w === "lg" ? "md" : "sm", n = (n) => {
-			let i = n === "prev" ? p : m, a = n === "prev" ? h : g, o = !i && !a, s = n === "prev" ? N("previous", D) : N("next", O), c = /* @__PURE__ */ r(t, {
-				name: "chevron",
-				size: e,
-				className: n === "prev" ? "pagination__chevron--prev" : void 0
-			});
-			return i ? /* @__PURE__ */ r(F, {
-				href: i,
-				className: "pagination__btn pagination__btn--nav",
-				"aria-label": s,
-				children: c
-			}) : /* @__PURE__ */ r("button", {
-				type: "button",
-				className: "pagination__btn pagination__btn--nav",
-				disabled: o,
-				"aria-label": s,
-				onClick: a,
-				children: c
-			});
-		};
-		return /* @__PURE__ */ r("nav", {
-			className: [
-				"pagination",
-				`pagination--${w}`,
-				M
-			].filter(Boolean).join(" "),
-			"aria-label": N("label", T),
-			children: /* @__PURE__ */ i("div", {
-				className: "pagination__controls",
-				role: "group",
-				"aria-label": N("pagesGroup", k),
-				children: [n("prev"), n("next")]
-			})
-		});
-	}
-	if (c === 0 || l === 0 || c === void 0 && (l ?? 1) <= 1 && !S) return null;
-	let I = c ?? 0, L = l ?? (d === "all" ? 1 : Math.ceil(I / d)), R = L > 1 ? o(u, L) : [];
-	function z(e, t) {
-		if (e === "...") return /* @__PURE__ */ r("span", {
-			className: "pagination__ellipsis",
-			"aria-hidden": "true",
-			children: "…"
-		}, `ellipsis-${t}`);
-		let n = e === u, i = ["pagination__btn", n ? "pagination__btn--current" : ""].filter(Boolean).join(" ");
-		return P && !n ? /* @__PURE__ */ r(F, {
-			href: P(e),
-			className: i,
-			"aria-label": N("goToPage", E)(e),
-			onClick: _ ? (t) => {
-				t.preventDefault(), _(e);
-			} : void 0,
-			children: e
-		}, e) : /* @__PURE__ */ r("button", {
-			type: "button",
-			className: i,
-			"aria-current": n ? "page" : void 0,
-			"aria-label": N("goToPage", E)(e),
-			onClick: n ? void 0 : () => _?.(e),
-			children: e
-		}, e);
-	}
-	function B(e, n, i) {
-		let a = n === "prev" ? N("previous", D) : N("next", O), o = /* @__PURE__ */ r(t, {
-			name: "chevron",
-			size: w === "lg" ? "md" : "sm",
-			className: n === "prev" ? "pagination__chevron--prev" : void 0
-		});
-		return P && !i ? /* @__PURE__ */ r(F, {
-			href: P(e),
-			className: "pagination__btn pagination__btn--nav",
-			"aria-label": a,
-			onClick: _ ? (t) => {
-				t.preventDefault(), _(e);
-			} : void 0,
-			children: o
-		}) : /* @__PURE__ */ r("button", {
-			type: "button",
-			className: "pagination__btn pagination__btn--nav",
-			disabled: i,
-			"aria-label": a,
-			onClick: () => _?.(e),
-			children: o
-		});
-	}
-	let V = C || !!b || !!S;
-	return /* @__PURE__ */ i("nav", {
-		className: [
-			"pagination",
-			`pagination--${w}`,
-			M
-		].filter(Boolean).join(" "),
-		"aria-label": N("label", T),
-		children: [V && /* @__PURE__ */ i("div", {
-			className: "pagination__meta",
-			children: [
-				C && /* @__PURE__ */ r("span", {
-					className: "pagination__summary",
-					children: N("total", j)(I)
-				}),
-				b && /* @__PURE__ */ r("div", {
-					className: "pagination__size-selector",
-					children: /* @__PURE__ */ r(n, {
-						options: x ?? a(N("allOption")),
-						value: d === "all" ? "all" : String(d),
-						onValueChange: b,
-						"aria-label": N("perPage", A),
-						size: w
-					})
-				}),
-				S && /* @__PURE__ */ r("div", {
-					className: "pagination__after-page-size",
-					children: S
-				})
-			]
-		}), L > 1 && /* @__PURE__ */ i("div", {
-			className: "pagination__controls",
-			role: "group",
-			"aria-label": N("pagesGroup", k),
-			children: [
-				B(u - 1, "prev", u <= 1),
-				R.map((e, t) => z(e, t)),
-				B(u + 1, "next", u >= L)
-			]
-		})]
-	});
-}
-//#endregion
-export { s as Pagination };
+import { t as e } from "./_shared/pagination.js";
+export { e as Pagination };

package/dist/paragraph.css

@@ -1 +1 @@
-.paragraph.paragraph--small{font-size:var(--text-paragraph-small-font-size);line-height:var(--text-paragraph-small-line-height)}.paragraph.paragraph--large{font-size:var(--text-paragraph-large-font-size);line-height:var(--text-paragraph-large-line-height)}
+.paragraph.paragraph--sm{font-size:var(--text-paragraph-small-font-size);line-height:var(--text-paragraph-small-line-height)}.paragraph.paragraph--lg{font-size:var(--text-paragraph-large-font-size);line-height:var(--text-paragraph-large-line-height)}

package/dist/paragraph.js

@@ -1,18 +1,24 @@
 import './paragraph.css';
-import { forwardRef as e } from "react";
-import { jsx as t } from "react/jsx-runtime";
+import { n as e } from "./_shared/env.js";
+import { forwardRef as t } from "react";
+import { jsx as n } from "react/jsx-runtime";
 //#region src/stories/atoms/Paragraph/Paragraph.tsx
-var n = e(function({ size: e = "default", className: n, children: r, ...i }, a) {
-	return /* @__PURE__ */ t("p", {
-		ref: a,
+var r = {
+	small: "sm",
+	default: "md",
+	large: "lg"
+}, i = t(function({ size: t = "md", className: i, children: a, ...o }, s) {
+	let c = t;
+	return t in r && (c = r[t], e("Paragraph", `size="${t}"`, `\`size="${c}"\``)), /* @__PURE__ */ n("p", {
+		ref: s,
 		className: [
 			"paragraph",
-			e === "default" ? "" : `paragraph--${e}`,
-			n
+			c === "md" ? "" : `paragraph--${c}`,
+			i
 		].filter(Boolean).join(" "),
-		...i,
-		children: r
+		...o,
+		children: a
 	});
 });
 //#endregion
-export { n as Paragraph };
+export { i as Paragraph };

package/dist/password-field.css

@@ -1 +1 @@
-.password-field{gap:var(--password-field-gap);flex-direction:column;display:flex}.password-field__wrapper{display:block;position:relative}.password-field__wrapper--sm{--password-field-toggle-size:var(--password-field-sm-toggle-size);--password-field-toggle-icon-size:var(--password-field-sm-toggle-icon-size)}.password-field__wrapper--lg{--password-field-toggle-size:var(--password-field-lg-toggle-size);--password-field-toggle-icon-size:var(--password-field-lg-toggle-icon-size)}.password-field__wrapper .input{padding-inline-end:var(--password-field-input-padding-inline-end)}.password-field__toggle{inline-size:var(--password-field-toggle-size);block-size:var(--password-field-toggle-size);cursor:pointer;color:var(--password-field-toggle-color);transition:color var(--input-transition-duration) var(--input-transition-easing);background:0 0;border:none;justify-content:center;align-items:center;padding-block:0;padding-inline:0;display:flex;position:absolute;inset-block-start:50%;inset-inline-end:0;transform:translateY(-50%)}.password-field__toggle:hover:not(:disabled){color:var(--password-field-toggle-color-hover)}.password-field__toggle:focus-visible{outline:var(--password-field-toggle-focus-ring-width) solid var(--password-field-toggle-focus-ring-color);outline-offset:calc(-1 * var(--password-field-toggle-focus-ring-offset))}.password-field__toggle:disabled{cursor:not-allowed;pointer-events:none}.password-field__icon{inline-size:var(--password-field-toggle-icon-size);block-size:var(--password-field-toggle-icon-size)}.password-field__helper{font-family:var(--input-field-helper-font-family);font-size:var(--input-field-helper-font-size);font-weight:var(--input-field-helper-font-weight);line-height:var(--input-field-helper-line-height);color:var(--input-field-helper-color)}.password-field__action{margin-block-start:var(--password-field-action-margin-block-start)}
+.password-field{gap:var(--password-field-gap);flex-direction:column;display:flex}.password-field__wrapper{display:block;position:relative}.password-field__wrapper--sm{--password-field-toggle-size:var(--password-field-sm-toggle-size);--password-field-toggle-icon-size:var(--password-field-sm-toggle-icon-size)}.password-field__wrapper--lg{--password-field-toggle-size:var(--password-field-lg-toggle-size);--password-field-toggle-icon-size:var(--password-field-lg-toggle-icon-size)}.password-field__wrapper .input{padding-inline-end:var(--password-field-input-padding-inline-end)}.password-field__toggle{inline-size:var(--password-field-toggle-size);block-size:var(--password-field-toggle-size);cursor:pointer;color:var(--password-field-toggle-color);transition:color var(--input-transition-duration) var(--input-transition-easing);background:0 0;border:none;justify-content:center;align-items:center;padding-block:0;padding-inline:0;display:flex;position:absolute;inset-block-start:50%;inset-inline-end:0;transform:translateY(-50%)}.password-field__toggle:hover:not(:disabled){color:var(--password-field-toggle-hover-color)}.password-field__toggle:focus-visible{outline:var(--password-field-toggle-focus-ring-width) solid var(--password-field-toggle-focus-ring-color);outline-offset:calc(-1 * var(--password-field-toggle-focus-ring-offset))}.password-field__toggle:disabled{cursor:not-allowed;pointer-events:none}.password-field__icon{inline-size:var(--password-field-toggle-icon-size);block-size:var(--password-field-toggle-icon-size)}.password-field__helper{font-family:var(--input-field-helper-font-family);font-size:var(--input-field-helper-font-size);font-weight:var(--input-field-helper-font-weight);line-height:var(--input-field-helper-line-height);color:var(--input-field-helper-color)}.password-field__action{margin-block-start:var(--password-field-action-margin-block-start)}

package/dist/password-field.js

@@ -1,66 +1,66 @@
 'use client';
 import './password-field.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 { n as r } from "./_shared/form-size.js";
-import { ErrorText as i } from "./error-text.js";
-import { Input as a } from "./input.js";
-import { Label as o } from "./label.js";
-import { forwardRef as s, useId as c, useState as l } from "react";
-import { jsx as u, jsxs as d } from "react/jsx-runtime";
-//#region src/stories/molecules/PasswordField/PasswordField.tsx
-var f = s(function({ label: s, labelHidden: f = !0, error: p = !1, errorMessage: m, helperText: h, action: g, size: _, showPasswordLabel: v, hidePasswordLabel: y, className: b, id: x, disabled: S, placeholder: C, ...w }, T) {
-	let E = e("passwordField"), D = r(_), O = c(), k = x ?? O, [A, j] = l(!1), M = m ? `${k}-error` : void 0, N = h ? `${k}-helper` : void 0, P = [M, N].filter(Boolean).join(" ") || void 0;
-	return /* @__PURE__ */ d("div", {
-		className: ["password-field", b ?? ""].filter(Boolean).join(" "),
-		children: [
-			s && /* @__PURE__ */ u(o, {
-				htmlFor: k,
-				hidden: f,
-				size: D,
-				children: s
-			}),
-			/* @__PURE__ */ d("div", {
-				className: ["password-field__wrapper", D === "md" ? "" : `password-field__wrapper--${D}`].filter(Boolean).join(" "),
-				children: [/* @__PURE__ */ u(a, {
-					ref: T,
-					id: k,
-					size: D,
-					error: p || !!m,
-					placeholder: C ?? (s && f ? s : void 0),
-					"aria-describedby": P,
-					...w,
-					type: A ? "text" : "password",
-					disabled: S
-				}), /* @__PURE__ */ d("button", {
-					type: "button",
-					className: "password-field__toggle",
-					onClick: () => j((e) => !e),
-					disabled: S,
-					"aria-controls": k,
-					"aria-pressed": A,
-					children: [/* @__PURE__ */ u(n, { children: A ? E("hide", y) : E("show", v) }), /* @__PURE__ */ u(t, {
-						name: A ? "eye-off" : "eye",
-						className: "password-field__icon"
-					})]
+import { Input as i } from "./input.js";
+import { n as a } from "./_shared/field-optional.js";
+import { n as o } from "./_shared/field-labels.js";
+import { a as s, n as c } from "./_shared/fieldshell.js";
+import { forwardRef as l, useState as u } from "react";
+import { jsx as d, jsxs as f } from "react/jsx-runtime";
+//#region src/stories/messages/es/passwordField.ts
+var p = {
+	show: "Mostrar contraseña",
+	hide: "Ocultar contraseña"
+}, m = l(function({ label: l, optional: m, optionalLabel: h, labelHidden: g, error: _ = !1, errorMessage: v, helperText: y, action: b, size: x, showPasswordLabel: S, hidePasswordLabel: C, className: w, id: T, disabled: E, placeholder: D, "aria-describedby": O, ...k }, A) {
+	let j = e("passwordField", p), M = r(x), N = a(m, k.required), P = o(g), F = s({
+		id: T,
+		error: _,
+		errorMessage: v,
+		helperText: y,
+		describedBy: O
+	}), I = F.id, [L, R] = u(!1);
+	return /* @__PURE__ */ d(c, {
+		field: F,
+		block: "password-field",
+		className: w,
+		label: l,
+		optional: N,
+		optionalLabel: h,
+		labelHidden: P,
+		size: M,
+		footer: b && /* @__PURE__ */ d("div", {
+			className: "password-field__action",
+			children: b
+		}),
+		children: /* @__PURE__ */ f("div", {
+			className: ["password-field__wrapper", M === "md" ? "" : `password-field__wrapper--${M}`].filter(Boolean).join(" "),
+			children: [/* @__PURE__ */ d(i, {
+				ref: A,
+				id: I,
+				size: M,
+				error: F.hasError,
+				placeholder: D ?? (l && P ? l : void 0),
+				"aria-describedby": F.describedBy,
+				...k,
+				type: L ? "text" : "password",
+				disabled: E
+			}), /* @__PURE__ */ f("button", {
+				type: "button",
+				className: "password-field__toggle",
+				onClick: () => R((e) => !e),
+				disabled: E,
+				"aria-controls": I,
+				"aria-pressed": L,
+				children: [/* @__PURE__ */ d(n, { children: L ? j("hide", C) : j("show", S) }), /* @__PURE__ */ d(t, {
+					name: L ? "eye-off" : "eye",
+					className: "password-field__icon"
 				})]
-			}),
-			m && /* @__PURE__ */ u(i, {
-				id: M,
-				children: m
-			}),
-			h && /* @__PURE__ */ u("span", {
-				id: N,
-				className: "password-field__helper",
-				children: h
-			}),
-			g && /* @__PURE__ */ u("div", {
-				className: "password-field__action",
-				children: g
-			})
-		]
+			})]
+		})
 	});
 });
 //#endregion
-export { f as PasswordField };
+export { m as PasswordField };

package/dist/planning-grid.css

@@ -1 +1 @@
-.planning-grid{font-family:var(--planning-grid-font-family)}.planning-grid__wrap{border:var(--planning-grid-border-width) solid var(--planning-grid-border-color);border-radius:var(--planning-grid-radius);overflow:auto visible}.planning-grid__table{border-collapse:collapse;inline-size:100%}.planning-grid__corner,.planning-grid__row-header,.planning-grid__footer-header{z-index:1;min-inline-size:var(--planning-grid-row-header-width);max-inline-size:var(--planning-grid-row-header-width);padding-block:var(--planning-grid-row-header-padding-block);padding-inline:var(--planning-grid-row-header-padding-inline);text-align:start;background-color:var(--planning-grid-row-header-bg);border-inline-end:var(--planning-grid-border-width) solid var(--planning-grid-border-color);position:sticky;inset-inline-start:0}.planning-grid__corner{z-index:2;background-color:var(--planning-grid-column-header-bg);border-block-end:var(--planning-grid-border-width) solid var(--planning-grid-border-color)}.planning-grid__row-header{font-size:var(--planning-grid-row-header-font-size);font-weight:var(--planning-grid-row-header-font-weight);color:var(--planning-grid-row-header-color)}.planning-grid__footer-header{background-color:var(--planning-grid-footer-bg);font-size:var(--planning-grid-row-header-font-size);font-weight:var(--planning-grid-footer-font-weight);color:var(--planning-grid-footer-color)}.planning-grid__column-header{min-inline-size:var(--planning-grid-column-width);padding-block:var(--planning-grid-column-header-padding-block);padding-inline:var(--planning-grid-cell-padding-inline);background-color:var(--planning-grid-column-header-bg);font-size:var(--planning-grid-column-header-font-size);font-weight:var(--planning-grid-column-header-font-weight);color:var(--planning-grid-column-header-color);text-align:center;border-block-end:var(--planning-grid-border-width) solid var(--planning-grid-border-color);border-inline-end:var(--planning-grid-border-width) solid var(--planning-grid-border-color)}.planning-grid__column-sub{font-size:var(--planning-grid-column-header-sub-font-size);font-weight:var(--planning-grid-row-header-font-weight);color:var(--planning-grid-column-header-sub-color);display:block}.planning-grid__column-header.planning-grid__column-header--current{outline:var(--planning-grid-current-outline-width) solid var(--planning-grid-current-outline-color);outline-offset:calc(-1 * var(--planning-grid-current-outline-width))}.planning-grid__cell{padding-block:var(--planning-grid-cell-padding-block);padding-inline:var(--planning-grid-cell-padding-inline);font-size:var(--planning-grid-cell-font-size);color:var(--planning-grid-cell-color);text-align:center;font-variant-numeric:tabular-nums;border-inline-end:var(--planning-grid-border-width) solid var(--planning-grid-border-color);border-block-end:var(--planning-grid-border-width) solid var(--planning-grid-border-color)}.planning-grid__cell.planning-grid__cell--readonly{background-color:var(--planning-grid-cell-readonly-bg);color:var(--planning-grid-cell-readonly-color)}.planning-grid__cell.planning-grid__cell--pending{opacity:var(--planning-grid-pending-opacity)}.planning-grid__input{inline-size:var(--planning-grid-cell-input-width);text-align:center}.planning-grid__footer-cell{padding-block:var(--planning-grid-cell-padding-block);padding-inline:var(--planning-grid-cell-padding-inline);background-color:var(--planning-grid-footer-bg);font-size:var(--planning-grid-cell-font-size);font-weight:var(--planning-grid-footer-font-weight);color:var(--planning-grid-footer-color);text-align:center;font-variant-numeric:tabular-nums;border-inline-end:var(--planning-grid-border-width) solid var(--planning-grid-border-color)}.planning-grid__footer-cell.planning-grid__footer-cell--over{color:var(--planning-grid-over-color)}
+.planning-grid{font-family:var(--planning-grid-font-family)}.planning-grid__wrap{border:var(--planning-grid-border-width) solid var(--planning-grid-border-color);border-radius:var(--planning-grid-radius);overflow:auto visible}.planning-grid__table{border-collapse:collapse;inline-size:100%}.planning-grid__corner,.planning-grid__row-header,.planning-grid__footer-header{z-index:1;min-inline-size:var(--planning-grid-row-header-width);max-inline-size:var(--planning-grid-row-header-width);padding-block:var(--planning-grid-row-header-padding-block);padding-inline:var(--planning-grid-row-header-padding-inline);text-align:start;background-color:var(--planning-grid-row-header-bg);border-inline-end:var(--planning-grid-border-width) solid var(--planning-grid-border-color);position:sticky;inset-inline-start:0}.planning-grid__corner{z-index:2;background-color:var(--planning-grid-column-header-bg);border-block-end:var(--planning-grid-border-width) solid var(--planning-grid-border-color)}.planning-grid__row-header{font-size:var(--planning-grid-row-header-font-size);font-weight:var(--planning-grid-row-header-font-weight);color:var(--planning-grid-row-header-color)}.planning-grid__footer-header{background-color:var(--planning-grid-footer-bg);font-size:var(--planning-grid-row-header-font-size);font-weight:var(--planning-grid-footer-font-weight);color:var(--planning-grid-footer-color)}.planning-grid__column-header{min-inline-size:var(--planning-grid-column-width);padding-block:var(--planning-grid-column-header-padding-block);padding-inline:var(--planning-grid-cell-padding-inline);background-color:var(--planning-grid-column-header-bg);font-size:var(--planning-grid-column-header-font-size);font-weight:var(--planning-grid-column-header-font-weight);color:var(--planning-grid-column-header-color);text-align:center;border-block-end:var(--planning-grid-border-width) solid var(--planning-grid-border-color);border-inline-end:var(--planning-grid-border-width) solid var(--planning-grid-border-color)}.planning-grid__column-sub{font-size:var(--planning-grid-column-header-sub-font-size);font-weight:var(--planning-grid-row-header-font-weight);color:var(--planning-grid-column-header-sub-color);display:block}.planning-grid__column-header.planning-grid__column-header--current{outline:var(--planning-grid-current-outline-width) solid var(--planning-grid-current-outline-color);outline-offset:calc(-1 * var(--planning-grid-current-outline-width))}.planning-grid__cell{padding-block:var(--planning-grid-cell-padding-block);padding-inline:var(--planning-grid-cell-padding-inline);font-size:var(--planning-grid-cell-font-size);color:var(--planning-grid-cell-color);text-align:center;font-variant-numeric:tabular-nums;border-inline-end:var(--planning-grid-border-width) solid var(--planning-grid-border-color);border-block-end:var(--planning-grid-border-width) solid var(--planning-grid-border-color)}.planning-grid__cell.planning-grid__cell--readonly{background-color:var(--planning-grid-cell-readonly-bg);color:var(--planning-grid-cell-readonly-color)}.planning-grid__cell.planning-grid__cell--pending{white-space:nowrap}.planning-grid__saving{vertical-align:middle;margin-inline-start:var(--planning-grid-saving-gap)}.planning-grid__input{inline-size:var(--planning-grid-cell-input-width);text-align:center}.planning-grid__footer-cell{padding-block:var(--planning-grid-cell-padding-block);padding-inline:var(--planning-grid-cell-padding-inline);background-color:var(--planning-grid-footer-bg);font-size:var(--planning-grid-cell-font-size);font-weight:var(--planning-grid-footer-font-weight);color:var(--planning-grid-footer-color);text-align:center;font-variant-numeric:tabular-nums;border-inline-end:var(--planning-grid-border-width) solid var(--planning-grid-border-color)}.planning-grid__footer-cell.planning-grid__footer-cell--over{background-color:var(--planning-grid-over-bg);color:var(--planning-grid-over-color)}

package/dist/planning-grid.js

@@ -1,12 +1,13 @@
 'use client';
 import './planning-grid.css';
-import { n as e } from "./_shared/brandmessagescontext.js";
+import { r as e } from "./_shared/brandmessagescontext.js";
 import { VisuallyHidden as t } from "./visually-hidden.js";
-import { Input as n } from "./input.js";
-import { forwardRef as r, useId as i, useMemo as a, useState as o } from "react";
-import { Fragment as s, jsx as c, jsxs as l } from "react/jsx-runtime";
+import { Spinner as n } from "./spinner.js";
+import { Input as r } from "./input.js";
+import { forwardRef as i, useId as a, useMemo as o, useState as s } from "react";
+import { Fragment as c, jsx as l, jsxs as u } from "react/jsx-runtime";
 //#region src/stories/organisms/PlanningGrid/planningHours.ts
-function u(e) {
+function d(e) {
 	let t = e.trim().replace(",", ".");
 	if (t === "") return 0;
 	if (!/^\d*\.?\d*$/.test(t)) return null;
@@ -14,119 +15,132 @@ function u(e) {
 	return Number.isFinite(n) && n >= 0 ? n : null;
 }
 //#endregion
-//#region src/stories/organisms/PlanningGrid/PlanningGrid.tsx
-var d = (e, t) => `${e}\u0000${t}`, f = r(function({ rows: n, columns: r, cells: i, onCellChange: o, readOnly: s = !1, rowHeader: u, showRowTotals: f = !0, showColumnTotals: m = !0, showCapacity: h = !1, showRemaining: g = !0, max: _ = 999, locale: v = "es-ES", formatHours: y, size: b = "sm", label: x, cellLabel: S, className: C, ...w }, T) {
-	let E = e("planningGrid"), D = a(() => {
+//#region src/stories/messages/es/planningGrid.ts
+var f = {
+	label: "Planificación",
+	cellLabel: (e, t) => `Horas de ${e} en ${t}`,
+	rowTotal: "Total",
+	columnTotal: "Total",
+	capacity: "Disponible",
+	remaining: "Sin asignar",
+	over: "sobreasignado",
+	saving: "Guardando…"
+}, p = (e, t) => `${e}\u0000${t}`, m = i(function({ rows: r, columns: i, cells: a, onCellChange: s, readOnly: c = !1, rowHeader: d, showRowTotals: m = !0, showColumnTotals: g = !0, showCapacity: _ = !1, showRemaining: v = !0, max: y = 999, locale: b = "es-ES", formatHours: x, size: S = "sm", label: C, cellLabel: w, savingLabel: T, className: E, ...D }, O) {
+	let k = e("planningGrid", f), A = o(() => {
 		let e = /* @__PURE__ */ new Map();
-		for (let t of i) e.set(d(t.rowId, t.columnKey), t);
+		for (let t of a) e.set(p(t.rowId, t.columnKey), t);
 		return e;
-	}, [i]), O = a(() => new Intl.NumberFormat(v, { maximumFractionDigits: 2 }), [v]), k = y ?? ((e) => `${O.format(e)} h`), A = (e, t) => D.get(d(e, t))?.value ?? 0, j = (e) => r.reduce((t, n) => t + A(e, n.key), 0), M = (e) => n.reduce((t, n) => t + A(n.id, e), 0), N = r.some((e) => e.capacity !== void 0), P = !s && o !== void 0, F = S ?? E("cellLabel");
-	return /* @__PURE__ */ c("div", {
-		ref: T,
-		className: ["planning-grid", C].filter(Boolean).join(" "),
-		...w,
-		children: /* @__PURE__ */ c("div", {
+	}, [a]), j = o(() => new Intl.NumberFormat(b, { maximumFractionDigits: 2 }), [b]), M = x ?? ((e) => `${j.format(e)} h`), N = (e, t) => A.get(p(e, t))?.value ?? 0, P = (e) => i.reduce((t, n) => t + N(e, n.key), 0), F = (e) => r.reduce((t, n) => t + N(n.id, e), 0), I = i.some((e) => e.capacity !== void 0), L = !c && s !== void 0, R = w ?? k("cellLabel");
+	return /* @__PURE__ */ l("div", {
+		ref: O,
+		className: ["planning-grid", E].filter(Boolean).join(" "),
+		...D,
+		children: /* @__PURE__ */ l("div", {
 			className: "planning-grid__wrap",
-			children: /* @__PURE__ */ l("table", {
+			children: /* @__PURE__ */ u("table", {
 				className: "planning-grid__table",
 				children: [
-					/* @__PURE__ */ c("caption", {
+					/* @__PURE__ */ l("caption", {
 						className: "visually-hidden",
-						children: E("label", x)
+						children: k("label", C)
 					}),
-					/* @__PURE__ */ c("thead", { children: /* @__PURE__ */ l("tr", { children: [
-						/* @__PURE__ */ c("th", {
+					/* @__PURE__ */ l("thead", { children: /* @__PURE__ */ u("tr", { children: [
+						/* @__PURE__ */ l("th", {
 							className: "planning-grid__corner",
 							scope: "col",
-							children: u
+							children: d
 						}),
-						r.map((e) => /* @__PURE__ */ l("th", {
+						i.map((e) => /* @__PURE__ */ u("th", {
 							scope: "col",
 							className: ["planning-grid__column-header", e.current ? "planning-grid__column-header--current" : ""].filter(Boolean).join(" "),
-							children: [e.label ?? e.name, e.sublabel ? /* @__PURE__ */ c("span", {
+							children: [e.label ?? e.name, e.sublabel ? /* @__PURE__ */ l("span", {
 								className: "planning-grid__column-sub",
 								children: e.sublabel
 							}) : null]
 						}, e.key)),
-						f ? /* @__PURE__ */ c("th", {
+						m ? /* @__PURE__ */ l("th", {
 							className: "planning-grid__column-header",
 							scope: "col",
-							children: E("rowTotal")
+							children: k("rowTotal")
 						}) : null
 					] }) }),
-					/* @__PURE__ */ c("tbody", { children: n.map((e) => /* @__PURE__ */ l("tr", { children: [
-						/* @__PURE__ */ c("th", {
+					/* @__PURE__ */ l("tbody", { children: r.map((e) => /* @__PURE__ */ u("tr", { children: [
+						/* @__PURE__ */ l("th", {
 							className: "planning-grid__row-header",
 							scope: "row",
 							children: e.label ?? e.name
 						}),
-						r.map((t) => {
-							let n = D.get(d(e.id, t.key)), r = s || e.readOnly || t.readOnly || n?.readOnly || !P, i = n?.value ?? null;
-							return /* @__PURE__ */ c("td", {
+						i.map((t) => {
+							let r = A.get(p(e.id, t.key)), i = c || e.readOnly || t.readOnly || r?.readOnly || !L, a = r?.value ?? null;
+							return /* @__PURE__ */ u("td", {
 								className: [
 									"planning-grid__cell",
-									r ? "planning-grid__cell--readonly" : "",
-									n?.pending ? "planning-grid__cell--pending" : ""
+									i ? "planning-grid__cell--readonly" : "",
+									r?.pending ? "planning-grid__cell--pending" : ""
 								].filter(Boolean).join(" "),
-								children: r ? i ? k(i) : null : /* @__PURE__ */ c(p, {
-									value: i,
-									max: _,
-									size: b,
-									locale: v,
-									error: n?.error,
-									label: F(e.name, t.name),
-									onCommit: (n) => o?.(e.id, t.key, n)
-								}, `${e.id}-${t.key}-${i ?? ""}`)
+								children: [i ? a ? M(a) : null : /* @__PURE__ */ l(h, {
+									value: a,
+									max: y,
+									size: S,
+									locale: b,
+									error: r?.error,
+									label: R(e.name, t.name),
+									onCommit: (n) => s?.(e.id, t.key, n)
+								}, `${e.id}-${t.key}-${a ?? ""}`), r?.pending ? /* @__PURE__ */ l(n, {
+									size: "sm",
+									label: k("saving", T),
+									className: "planning-grid__saving"
+								}) : null]
 							}, t.key);
 						}),
-						f ? /* @__PURE__ */ c("td", {
+						m ? /* @__PURE__ */ l("td", {
 							className: "planning-grid__footer-cell",
-							children: k(j(e.id))
+							children: M(P(e.id))
 						}) : null
 					] }, e.id)) }),
-					m || (g || h) && N ? /* @__PURE__ */ l("tfoot", { children: [
-						m ? /* @__PURE__ */ l("tr", { children: [
-							/* @__PURE__ */ c("th", {
+					g || (v || _) && I ? /* @__PURE__ */ u("tfoot", { children: [
+						g ? /* @__PURE__ */ u("tr", { children: [
+							/* @__PURE__ */ l("th", {
 								className: "planning-grid__footer-header",
 								scope: "row",
-								children: E("columnTotal")
+								children: k("columnTotal")
 							}),
-							r.map((e) => /* @__PURE__ */ c("td", {
+							i.map((e) => /* @__PURE__ */ l("td", {
 								className: "planning-grid__footer-cell",
-								children: k(M(e.key))
+								children: M(F(e.key))
 							}, e.key)),
-							f ? /* @__PURE__ */ c("td", {
+							m ? /* @__PURE__ */ l("td", {
 								className: "planning-grid__footer-cell",
-								children: k(n.reduce((e, t) => e + j(t.id), 0))
+								children: M(r.reduce((e, t) => e + P(t.id), 0))
 							}) : null
 						] }) : null,
-						h && N ? /* @__PURE__ */ l("tr", { children: [
-							/* @__PURE__ */ c("th", {
+						_ && I ? /* @__PURE__ */ u("tr", { children: [
+							/* @__PURE__ */ l("th", {
 								className: "planning-grid__footer-header",
 								scope: "row",
-								children: E("capacity")
+								children: k("capacity")
 							}),
-							r.map((e) => /* @__PURE__ */ c("td", {
+							i.map((e) => /* @__PURE__ */ l("td", {
 								className: "planning-grid__footer-cell",
-								children: e.capacity === void 0 ? null : k(e.capacity)
+								children: e.capacity === void 0 ? null : M(e.capacity)
 							}, e.key)),
-							f ? /* @__PURE__ */ c("td", { className: "planning-grid__footer-cell" }) : null
+							m ? /* @__PURE__ */ l("td", { className: "planning-grid__footer-cell" }) : null
 						] }) : null,
-						g && N ? /* @__PURE__ */ l("tr", { children: [
-							/* @__PURE__ */ c("th", {
+						v && I ? /* @__PURE__ */ u("tr", { children: [
+							/* @__PURE__ */ l("th", {
 								className: "planning-grid__footer-header",
 								scope: "row",
-								children: E("remaining")
+								children: k("remaining")
 							}),
-							r.map((e) => {
-								if (e.capacity === void 0) return /* @__PURE__ */ c("td", { className: "planning-grid__footer-cell" }, e.key);
-								let n = e.capacity - M(e.key), r = n < 0;
-								return /* @__PURE__ */ l("td", {
+							i.map((e) => {
+								if (e.capacity === void 0) return /* @__PURE__ */ l("td", { className: "planning-grid__footer-cell" }, e.key);
+								let n = e.capacity - F(e.key), r = n < 0;
+								return /* @__PURE__ */ u("td", {
 									className: ["planning-grid__footer-cell", r ? "planning-grid__footer-cell--over" : ""].filter(Boolean).join(" "),
-									children: [k(n), r ? /* @__PURE__ */ c(t, { children: ` (${E("over")})` }) : null]
+									children: [M(n), r ? /* @__PURE__ */ l(t, { children: ` (${k("over")})` }) : null]
 								}, e.key);
 							}),
-							f ? /* @__PURE__ */ c("td", { className: "planning-grid__footer-cell" }) : null
+							m ? /* @__PURE__ */ l("td", { className: "planning-grid__footer-cell" }) : null
 						] }) : null
 					] }) : null
 				]
@@ -134,19 +148,19 @@ var d = (e, t) => `${e}\u0000${t}`, f = r(function({ rows: n, columns: r, cells:
 		})
 	});
 });
-function p({ value: e, max: r, size: a, locale: d, error: f, label: p, onCommit: m }) {
-	let h = e === null ? "" : new Intl.NumberFormat(d, { maximumFractionDigits: 2 }).format(e), [g, _] = o(h), v = i(), y = () => {
-		let t = u(g);
+function h({ value: e, max: n, size: i, locale: o, error: f, label: p, onCommit: m }) {
+	let h = e === null ? "" : new Intl.NumberFormat(o, { maximumFractionDigits: 2 }).format(e), [g, _] = s(h), v = a(), y = () => {
+		let t = d(g);
 		if (t === null) {
 			_(h);
 			return;
 		}
-		let n = Math.min(r, t);
-		n !== (e ?? 0) && m(n);
+		let r = Math.min(n, t);
+		r !== (e ?? 0) && m(r);
 	};
-	return /* @__PURE__ */ l(s, { children: [/* @__PURE__ */ c(n, {
+	return /* @__PURE__ */ u(c, { children: [/* @__PURE__ */ l(r, {
 		className: "planning-grid__input",
-		size: a,
+		size: i,
 		inputMode: "decimal",
 		"aria-label": p,
 		"aria-describedby": f ? v : void 0,
@@ -157,11 +171,11 @@ function p({ value: e, max: r, size: a, locale: d, error: f, label: p, onCommit:
 		onKeyDown: (e) => {
 			e.key === "Enter" && (e.preventDefault(), e.currentTarget.blur());
 		}
-	}), f ? /* @__PURE__ */ c(t, {
+	}), f ? /* @__PURE__ */ l(t, {
 		id: v,
 		role: "alert",
 		children: f
 	}) : null] });
 }
 //#endregion
-export { f as PlanningGrid };
+export { m as PlanningGrid };

package/dist/popover.css

@@ -1 +1 @@
-.popover{box-sizing:border-box;background-color:var(--popover-bg);border-width:var(--popover-border-width);border-style:solid;border-color:var(--popover-border-color);border-radius:var(--popover-border-radius);padding-block:var(--popover-padding-block);padding-inline:var(--popover-padding-inline);transform-origin:var(--transform-origin);max-height:var(--popover-max-height,var(--available-height));overscroll-behavior:contain;animation-duration:var(--popover-transition-duration);animation-timing-function:var(--popover-transition-easing);outline:none;overflow-y:auto}.popover:focus-visible{outline:var(--popover-focus-ring-width) solid var(--popover-focus-ring-color);outline-offset:var(--popover-focus-ring-offset)}.popover[data-open]{animation-name:popover-in}.popover[data-closed]{animation-name:popover-out}@keyframes popover-in{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}@keyframes popover-out{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(.95)}}.popover__positioner{z-index:var(--popover-z-index)}
+.popover{box-sizing:border-box;background-color:var(--popover-bg);border-width:var(--popover-border-width);border-style:solid;border-color:var(--popover-border-color);border-radius:var(--popover-border-radius);padding-block:var(--popover-padding-block);padding-inline:var(--popover-padding-inline);transform-origin:var(--transform-origin);max-block-size:var(--popover-max-height,var(--available-height));overscroll-behavior:contain;animation-duration:var(--popover-transition-duration);animation-timing-function:var(--popover-transition-easing);outline:none;overflow-y:auto}.popover:focus-visible{outline:var(--popover-focus-ring-width) solid var(--popover-focus-ring-color);outline-offset:var(--popover-focus-ring-offset)}.popover[data-open]{animation-name:popover-in}.popover[data-closed]{animation-name:popover-out}@keyframes popover-in{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}@keyframes popover-out{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(.95)}}.popover__positioner{z-index:var(--popover-z-index)}