@studiolxd/brand 38.12.4

package/dist/chat-shell.js

@@ -0,0 +1,83 @@
+'use client';
+import './chat-shell.css';
+import { Icon as e } from "./icon.js";
+import { Button as t } from "./button.js";
+import { Sheet as n } from "./sheet.js";
+import { jsx as r, jsxs as i } from "react/jsx-runtime";
+import { forwardRef as a, useCallback as o, useEffect as s, useState as c } from "react";
+//#region src/stories/templates/ChatShell/ChatShell.tsx
+var l = "(min-width: 1024px)", u = a(function({ list: a, header: u, children: d, composer: f, listLabel: p = "Conversaciones", listTriggerLabel: m = "Abrir conversaciones", listOpen: h, onListOpenChange: g, className: _, ...v }, y) {
+	let [b, x] = c(() => typeof window > "u" ? !0 : window.matchMedia(l).matches), [S, C] = c(!1), [w, T] = c(null), E = o((e) => {
+		T(e), typeof y == "function" ? y(e) : y && (y.current = e);
+	}, [y]);
+	s(() => {
+		let e = window.matchMedia(l), t = () => {
+			x(e.matches), e.matches && C(!1);
+		};
+		return t(), e.addEventListener("change", t), () => e.removeEventListener("change", t);
+	}, []);
+	let D = o((e) => {
+		h === void 0 && C(e), g?.(e);
+	}, [h, g]), O = !b && (h ?? S), k = a != null && b, A = a != null && !b;
+	return /* @__PURE__ */ i("div", {
+		ref: E,
+		className: [
+			"chat-shell",
+			k ? "chat-shell--with-list" : "",
+			_ ?? ""
+		].filter(Boolean).join(" "),
+		...v,
+		children: [
+			k && /* @__PURE__ */ r("aside", {
+				className: "chat-shell__list",
+				"aria-label": p,
+				children: a
+			}),
+			/* @__PURE__ */ i("div", {
+				className: "chat-shell__main",
+				children: [
+					(u || A) && /* @__PURE__ */ i("header", {
+						className: "chat-shell__header",
+						children: [A && /* @__PURE__ */ r(t, {
+							variant: "ghost",
+							size: "sm",
+							iconOnly: !0,
+							"aria-label": m,
+							"aria-haspopup": "dialog",
+							"aria-expanded": O,
+							className: "chat-shell__list-trigger",
+							onClick: () => D(!0),
+							children: /* @__PURE__ */ r(e, {
+								name: "layout-sidebar",
+								size: "sm"
+							})
+						}), u && /* @__PURE__ */ r("div", {
+							className: "chat-shell__header-content",
+							children: u
+						})]
+					}),
+					/* @__PURE__ */ r("div", {
+						className: "chat-shell__thread",
+						children: d
+					}),
+					f && /* @__PURE__ */ r("div", {
+						className: "chat-shell__composer",
+						children: f
+					})
+				]
+			}),
+			A && /* @__PURE__ */ r(n, {
+				side: "left",
+				open: O,
+				onOpenChange: D,
+				title: p,
+				titleHidden: !0,
+				container: w ?? void 0,
+				className: "chat-shell__drawer",
+				children: a
+			})
+		]
+	});
+});
+//#endregion
+export { u as ChatShell };

package/dist/checkbox-field.css

@@ -0,0 +1 @@
+.checkbox-field{align-items:flex-start;gap:var(--checkbox-field-stack-gap);flex-direction:column;display:flex}.checkbox-field__control{align-items:flex-start;gap:var(--checkbox-field-gap);padding-block:var(--checkbox-field-padding-block);cursor:var(--checkbox-field-cursor);display:flex}.checkbox-field .checkbox{margin-block-start:var(--checkbox-field-checkbox-offset)}.checkbox-field__label{font-family:var(--checkbox-field-label-font-family);font-size:var(--checkbox-field-label-font-size);font-weight:var(--checkbox-field-label-font-weight);line-height:var(--checkbox-field-label-line-height);color:var(--checkbox-field-label-color);letter-spacing:var(--checkbox-field-label-letter-spacing)}.checkbox-field__label a{color:var(--link-color);cursor:var(--link-cursor)}.checkbox-field__label a:hover{color:var(--link-hover-color)}.checkbox-field__label a:focus-visible{outline:var(--link-focus-ring-width) solid var(--link-focus-ring-color);outline-offset:var(--link-focus-ring-offset)}.checkbox-field.checkbox-field--disabled .checkbox-field__control{cursor:var(--checkbox-field-disabled-cursor)}.checkbox-field__helper{font-family:var(--checkbox-field-helper-font-family);font-size:var(--checkbox-field-helper-font-size);font-weight:var(--checkbox-field-helper-font-weight);line-height:var(--checkbox-field-helper-line-height);color:var(--checkbox-field-helper-color)}.checkbox-field.checkbox-field--sm{--checkbox-field-gap:var(--checkbox-field-sm-gap);--checkbox-field-padding-block:var(--checkbox-field-sm-padding-block);--checkbox-field-label-font-size:var(--checkbox-field-sm-label-font-size)}.checkbox-field.checkbox-field--lg{--checkbox-field-gap:var(--checkbox-field-lg-gap);--checkbox-field-padding-block:var(--checkbox-field-lg-padding-block);--checkbox-field-label-font-size:var(--checkbox-field-lg-label-font-size)}

package/dist/checkbox-field.js

@@ -0,0 +1,55 @@
+'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 { jsx as a, jsxs as o } from "react/jsx-runtime";
+import { forwardRef as s, useId as c } from "react";
+//#region src/stories/molecules/CheckboxField/CheckboxField.tsx
+var l = s(function({ label: s, 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 = c(), 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__ */ o("div", {
+		className: [
+			"checkbox-field",
+			T === "md" ? "" : `checkbox-field--${T}`,
+			f ? "checkbox-field--disabled" : "",
+			b
+		].filter(Boolean).join(" "),
+		children: [
+			/* @__PURE__ */ o("label", {
+				className: "checkbox-field__control",
+				htmlFor: D,
+				children: [/* @__PURE__ */ a(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
+				}), a(w ? e : "span", {
+					className: "checkbox-field__label",
+					children: s
+				})]
+			}),
+			v && /* @__PURE__ */ a(r, {
+				id: O,
+				children: v
+			}),
+			y && /* @__PURE__ */ a("span", {
+				id: k,
+				className: "checkbox-field__helper",
+				children: y
+			})
+		]
+	});
+});
+//#endregion
+export { l as CheckboxField };

package/dist/checkbox.css

@@ -0,0 +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)}

package/dist/checkbox.js

@@ -0,0 +1,35 @@
+'use client';
+import './checkbox.css';
+import { jsx as e } from "react/jsx-runtime";
+import { forwardRef as t } from "react";
+import { Checkbox as n } from "@base-ui/react/checkbox";
+//#region src/stories/atoms/Checkbox/Checkbox.tsx
+var r = t(function({ size: t = "md", className: r, checked: i, indeterminate: a, onCheckedChange: o, id: s, error: c = !1, ...l }, u) {
+	let d = [
+		"checkbox",
+		t === "md" ? "" : `checkbox--${t}`,
+		c ? "checkbox--error" : "",
+		r ?? ""
+	].filter(Boolean).join(" "), f = i === "indeterminate" || a;
+	return /* @__PURE__ */ e(n.Root, {
+		ref: u,
+		className: d,
+		render: /* @__PURE__ */ e("button", {
+			type: "button",
+			id: s
+		}),
+		nativeButton: !0,
+		checked: i === "indeterminate" ? !1 : i,
+		indeterminate: f,
+		...f ? { "aria-checked": "mixed" } : {},
+		"aria-invalid": c || void 0,
+		onCheckedChange: o ? (e) => o(e) : void 0,
+		...l,
+		children: /* @__PURE__ */ e(n.Indicator, {
+			className: "checkbox__indicator",
+			keepMounted: !0
+		})
+	});
+});
+//#endregion
+export { r as Checkbox };

package/dist/close-button.css

@@ -0,0 +1 @@
+:root{--close-button-size-sm:var(--size-component-sm);--close-button-size-md:var(--size-component-md);--close-button-size-lg:var(--size-component-lg);--close-button-icon-size:var(--icon-size-md);--close-button-color:var(--color-text-on-light);--close-button-focus-ring-width:var(--border-width-focus);--close-button-focus-ring-offset:var(--border-width-focus);--close-button-focus-ring-color:var(--color-text-on-light)}.surface-dark,.surface-invert,[data-theme=dark],html.dark{--close-button-color:var(--color-text-on-dark);--close-button-focus-ring-color:var(--color-text-on-dark)}.close-button{--close-button-size:var(--close-button-size-md);inline-size:var(--close-button-size);block-size:var(--close-button-size);color:var(--close-button-color);cursor:pointer;background:0 0;border:0;flex-shrink:0;justify-content:center;align-items:center;padding:0;display:inline-flex}.close-button.close-button--sm{--close-button-size:var(--close-button-size-sm)}.close-button.close-button--lg{--close-button-size:var(--close-button-size-lg)}.close-button:focus-visible{outline:var(--close-button-focus-ring-width) solid var(--close-button-focus-ring-color);outline-offset:var(--close-button-focus-ring-offset)}.close-button .icon{--icon-size:var(--close-button-icon-size)}

package/dist/close-button.js

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

package/dist/code-block.css

@@ -0,0 +1 @@
+:root{--code-block-focus-ring-style:solid;--code-block-font-family:var(--font-family-mono);--code-block-header-gap:var(--spacing-2);--code-block-token-keyword-color:var(--color-chart-sequential-700);--code-block-token-string-color:var(--color-green);--code-block-token-number-color:var(--color-chart-diverging-warm-3);--code-block-padding-inline:var(--card-padding-inline);--code-block-padding-block-start:var(--card-padding-block-start);--code-block-padding-block-end:var(--card-padding-block-end);--code-block-color:var(--color-text-on-light);--code-block-bg:var(--color-surface-secondary-on-light);--code-block-font-size:var(--text-paragraph-small-font-size);--code-block-line-height:var(--text-paragraph-small-line-height);--code-block-focus-ring-width:var(--border-width-focus);--code-block-focus-ring-offset:var(--border-width-default);--code-block-focus-ring-color:var(--color-primary);--code-block-token-tag-color:var(--code-block-token-keyword-color);--code-block-token-constant-color:var(--code-block-token-keyword-color);--code-block-token-regexp-color:var(--code-block-token-string-color);--code-block-token-attribute-color:var(--code-block-token-string-color);--code-block-token-function-color:var(--code-block-token-number-color);--code-block-token-comment-color:var(--color-text-muted-on-light);--code-block-token-inserted-bg:var(--color-success-fill);--code-block-token-inserted-color:var(--color-success-fill-text);--code-block-token-deleted-bg:var(--color-destructive-fill);--code-block-token-deleted-color:var(--color-destructive-fill-text);--code-block-border-radius:var(--card-border-radius);--code-block-border-width:var(--card-outline-border-width);--code-block-border-color:var(--card-outline-border-color);--code-block-token-punctuation-color:var(--code-block-token-comment-color);--code-block-token-operator-color:var(--code-block-token-comment-color);--code-block-token-variable-color:var(--code-block-color);--code-block-token-property-color:var(--code-block-token-variable-color)}.surface-dark,.surface-invert,[data-theme=dark],html.dark{--code-block-token-keyword-color:var(--color-chart-sequential-700-on-dark);--code-block-token-string-color:var(--color-emerald);--code-block-token-number-color:var(--color-yellow);--code-block-border-color:var(--color-text-on-dark);--code-block-color:var(--color-text-on-dark);--code-block-bg:var(--color-surface-secondary-on-dark);--code-block-focus-ring-color:var(--color-text-on-dark);--code-block-token-tag-color:var(--code-block-token-keyword-color);--code-block-token-constant-color:var(--code-block-token-keyword-color);--code-block-token-regexp-color:var(--code-block-token-string-color);--code-block-token-attribute-color:var(--code-block-token-string-color);--code-block-token-function-color:var(--code-block-token-number-color);--code-block-token-comment-color:var(--color-text-muted-on-dark);--code-block-token-punctuation-color:var(--code-block-token-comment-color);--code-block-token-operator-color:var(--code-block-token-comment-color);--code-block-token-variable-color:var(--code-block-color);--code-block-token-property-color:var(--code-block-token-variable-color)}.code-block{background-color:var(--code-block-bg);color:var(--code-block-color);border:var(--code-block-border-width) solid var(--code-block-border-color);border-radius:var(--code-block-border-radius);padding-inline:var(--code-block-padding-inline);flex-direction:column;padding-block-start:var(--code-block-padding-block-start);padding-block-end:var(--code-block-padding-block-end);display:flex}.code-block__header{align-items:center;gap:var(--code-block-header-gap);margin-block-end:var(--code-block-header-gap);display:flex}.code-block__header .code-block__copy{margin-inline-start:auto}.code-block__row{align-items:center;gap:var(--code-block-header-gap);display:flex}.code-block__row .code-block__pre{flex:1;min-inline-size:0}.code-block__controls{align-items:center;gap:var(--code-block-header-gap);flex-shrink:0;display:flex}.code-block__pre{margin:0;overflow-x:auto}.code-block__pre:focus-visible{outline:var(--code-block-focus-ring-width) var(--code-block-focus-ring-style) var(--code-block-focus-ring-color);outline-offset:var(--code-block-focus-ring-offset)}.code-block__code{font-family:var(--code-block-font-family);font-size:var(--code-block-font-size);line-height:var(--code-block-line-height);white-space:pre}.code-block__token{color:inherit}.code-block__token.code-block__token--keyword{color:var(--code-block-token-keyword-color)}.code-block__token.code-block__token--tag{color:var(--code-block-token-tag-color)}.code-block__token.code-block__token--constant{color:var(--code-block-token-constant-color)}.code-block__token.code-block__token--string{color:var(--code-block-token-string-color)}.code-block__token.code-block__token--regexp{color:var(--code-block-token-regexp-color)}.code-block__token.code-block__token--attribute{color:var(--code-block-token-attribute-color)}.code-block__token.code-block__token--number{color:var(--code-block-token-number-color)}.code-block__token.code-block__token--function{color:var(--code-block-token-function-color)}.code-block__token.code-block__token--comment{color:var(--code-block-token-comment-color)}.code-block__token.code-block__token--punctuation{color:var(--code-block-token-punctuation-color)}.code-block__token.code-block__token--operator{color:var(--code-block-token-operator-color)}.code-block__token.code-block__token--variable{color:var(--code-block-token-variable-color)}.code-block__token.code-block__token--property{color:var(--code-block-token-property-color)}.code-block__token.code-block__token--inserted{background-color:var(--code-block-token-inserted-bg);color:var(--code-block-token-inserted-color);display:block}.code-block__token.code-block__token--deleted{background-color:var(--code-block-token-deleted-bg);color:var(--code-block-token-deleted-color);display:block}

package/dist/code-block.js

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

package/dist/code.css

@@ -0,0 +1 @@
+:root{--code-padding-block:0px;--code-padding-inline:var(--spacing-1);--code-font-family:var(--code-block-font-family);--code-font-size:var(--code-block-font-size);--code-bg:var(--code-block-bg);--code-color:var(--code-block-color);--code-border-radius:var(--code-block-border-radius)}.code{padding-block:var(--code-padding-block);padding-inline:var(--code-padding-inline);border-radius:var(--code-border-radius);background-color:var(--code-bg);color:var(--code-color);font-family:var(--code-font-family);font-size:var(--code-font-size)}pre .code{font-size:inherit;background-color:#0000;padding-block:0;padding-inline:0}

package/dist/code.js

@@ -0,0 +1,14 @@
+import './code.css';
+import { jsx as e } from "react/jsx-runtime";
+import { forwardRef as t } from "react";
+//#region src/stories/atoms/Code/Code.tsx
+var n = t(function({ className: t, children: n, ...r }, i) {
+	return /* @__PURE__ */ e("code", {
+		ref: i,
+		className: ["code", t].filter(Boolean).join(" "),
+		...r,
+		children: n
+	});
+});
+//#endregion
+export { n as Code };

package/dist/collapsible.css

@@ -0,0 +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)}

package/dist/collapsible.js

@@ -0,0 +1,41 @@
+'use client';
+import './collapsible.css';
+import { Icon as e } from "./icon.js";
+import { jsx as t, jsxs as n } from "react/jsx-runtime";
+import "react";
+import { Collapsible as r } from "@base-ui/react/collapsible";
+//#region src/stories/atoms/Collapsible/Collapsible.tsx
+function i({ onOpenChange: e, children: n, className: i, ...a }) {
+	return /* @__PURE__ */ t(r.Root, {
+		className: ["collapsible", i].filter(Boolean).join(" "),
+		onOpenChange: e ? (t) => e(t) : void 0,
+		...a,
+		children: n
+	});
+}
+function a({ chevron: i = !0, chevronSize: a = "sm", children: o, className: s, ...c }) {
+	return /* @__PURE__ */ n(r.Trigger, {
+		className: ["collapsible__trigger", s].filter(Boolean).join(" "),
+		...c,
+		children: [/* @__PURE__ */ t("span", {
+			className: "collapsible__trigger-text",
+			children: o
+		}), i && /* @__PURE__ */ t(e, {
+			name: "chevron",
+			className: "collapsible__chevron",
+			size: a
+		})]
+	});
+}
+function o({ children: e, className: n, ...i }) {
+	return /* @__PURE__ */ t(r.Panel, {
+		className: ["collapsible__content", n].filter(Boolean).join(" "),
+		...i,
+		children: /* @__PURE__ */ t("div", {
+			className: "collapsible__content-inner",
+			children: e
+		})
+	});
+}
+//#endregion
+export { i as Collapsible, o as CollapsibleContent, a as CollapsibleTrigger };

package/dist/columns.css

@@ -0,0 +1 @@
+.columns{gap:var(--columns-stack-gap-md);grid-template-columns:1fr;align-items:start;display:grid}.columns.columns--gap-lg{gap:var(--columns-stack-gap-lg)}.columns.columns--align-center{align-items:center}.columns.columns--align-stretch{align-items:stretch}.columns.columns--reverse>.columns__col{order:1}.columns.columns--reverse>.columns__col:last-child{order:0}.columns__col{min-inline-size:0}.columns.columns--align-stretch>.columns__col{flex-direction:column;display:flex}.columns.columns--align-stretch>.columns__col>*{flex:auto;min-block-size:0}@media (width>=768px){.columns{gap:var(--columns-gap-md)}.columns.columns--gap-lg{gap:var(--columns-gap-lg)}.columns.columns--2{grid-template-columns:var(--columns-ratio-1-1)}.columns.columns--2.columns--ratio-1-2{grid-template-columns:var(--columns-ratio-1-2)}.columns.columns--2.columns--ratio-2-1{grid-template-columns:var(--columns-ratio-2-1)}.columns.columns--3,.columns.columns--4{grid-template-columns:repeat(2,1fr)}.columns.columns--reverse>.columns__col,.columns.columns--reverse>.columns__col:last-child{order:0}.columns.columns--no-intermediate.columns--3,.columns.columns--no-intermediate.columns--4{grid-template-columns:1fr}}@media (width>=1024px){.columns.columns--3,.columns.columns--no-intermediate.columns--3{grid-template-columns:repeat(3,1fr)}.columns.columns--4,.columns.columns--no-intermediate.columns--4{grid-template-columns:repeat(4,1fr)}}

package/dist/columns.js

@@ -0,0 +1,26 @@
+import './columns.css';
+import { jsx as e } from "react/jsx-runtime";
+import { Children as t, Fragment as n, isValidElement as r } from "react";
+//#region src/stories/atoms/Columns/Columns.tsx
+function i({ columns: i = 2, ratio: a = "1:1", align: o = "start", gap: s = "md", intermediate: c = !0, stackOrder: l = "normal", children: u, className: d, ...f }) {
+	let p = [
+		"columns",
+		`columns--${i}`,
+		i === 2 && a !== "1:1" ? `columns--ratio-${a.replace(":", "-")}` : "",
+		o === "start" ? "" : `columns--align-${o}`,
+		s === "md" ? "" : `columns--gap-${s}`,
+		c ? "" : "columns--no-intermediate",
+		l === "reverse" ? "columns--reverse" : "",
+		d
+	].filter(Boolean).join(" "), m = r(u) && u.type === n ? u.props.children : u, h = t.toArray(m);
+	return /* @__PURE__ */ e("div", {
+		className: p,
+		...f,
+		children: h.map((t, n) => /* @__PURE__ */ e("div", {
+			className: "columns__col",
+			children: t
+		}, n))
+	});
+}
+//#endregion
+export { i as Columns };

package/dist/command-palette.css

@@ -0,0 +1 @@
+.command-palette{max-height:var(--command-palette-max-height);flex-direction:column;display:flex}.command-palette__input{box-sizing:border-box;width:100%;padding-block:var(--command-palette-input-padding-block);padding-inline:var(--command-palette-input-padding-inline);border:0;border-block-end:var(--command-palette-input-border-width) solid var(--command-palette-input-border-color);color:inherit;font-family:inherit;font-size:var(--command-palette-input-font-size);background:0 0;outline:none}.command-palette__input:focus-visible{box-shadow:inset 0 0 0 var(--command-palette-input-focus-ring-width) var(--command-palette-input-focus-ring-color);border-block-end-color:var(--command-palette-input-focus-border-color);outline:none}.command-palette__input::placeholder{color:var(--command-palette-input-placeholder-color)}.command-palette__list{padding-block:var(--command-palette-list-padding-block);padding-inline:var(--command-palette-list-padding-inline);outline:none;overflow-y:auto}.command-palette__empty{padding-block:var(--command-palette-empty-padding-block);padding-inline:var(--command-palette-empty-padding-inline);text-align:center;font-size:var(--command-palette-empty-font-size);color:var(--command-palette-empty-color)}.command-palette__empty:empty{clip-path:inset(50%);white-space:nowrap;block-size:1px;inline-size:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.command-palette__heading{padding-block:var(--command-palette-heading-padding-block);padding-inline:var(--command-palette-heading-padding-inline);font-size:var(--command-palette-heading-font-size);font-weight:var(--command-palette-heading-font-weight);color:var(--command-palette-heading-color)}.command-palette__item{align-items:center;gap:var(--command-palette-item-gap);padding-block:var(--command-palette-item-padding-block);padding-inline:var(--command-palette-item-padding-inline);border-radius:var(--command-palette-item-border-radius);font-size:var(--command-palette-item-font-size);color:var(--command-palette-item-color);cursor:pointer;outline:none;display:flex}.command-palette__item[data-highlighted]{background-color:var(--command-palette-item-highlighted-bg);color:var(--command-palette-item-highlighted-color)}.command-palette__item[data-disabled]{opacity:var(--opacity-disabled);cursor:not-allowed}.command-palette__item-icon{flex-shrink:0;display:inline-flex}.command-palette__item-icon svg{width:var(--command-palette-item-icon-size);height:var(--command-palette-item-icon-size)}

package/dist/command-palette.js

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

package/dist/confirm-dialog.css

@@ -0,0 +1 @@
+.confirm-dialog__actions.modal__footer{margin-block-start:var(--confirm-dialog-actions-space-before)}

package/dist/confirm-dialog.js

@@ -0,0 +1,64 @@
+'use client';
+import './confirm-dialog.css';
+import { Button as e } from "./button.js";
+import { Modal as t } from "./modal.js";
+import { Fragment as n, jsx as r, jsxs as i } from "react/jsx-runtime";
+import { useEffect as a, useRef as o, useState as s } from "react";
+//#region src/stories/molecules/ConfirmDialog/ConfirmDialog.tsx
+function c({ open: c, title: l, description: u, children: d, onConfirm: f, onCancel: p, onConfirmError: m, secondaryActionLabel: h, onSecondaryAction: g, destructive: _ = !1, confirmLabel: v = "Confirmar", cancelLabel: y = "Cancelar", pendingLabel: b = "Confirmando…", closeLabel: x = "Cerrar", container: S, className: C }) {
+	let w = o(null), [T, E] = s(!1);
+	a(() => {
+		c || E(!1);
+	}, [c]);
+	let D = () => {
+		T || p();
+	}, O = async () => {
+		if (T) return;
+		let e = f();
+		if (e instanceof Promise) {
+			E(!0);
+			try {
+				await e;
+			} catch (e) {
+				m?.(e);
+			} finally {
+				E(!1);
+			}
+		}
+	};
+	return /* @__PURE__ */ r(t, {
+		open: c,
+		onClose: D,
+		title: l,
+		closeLabel: x,
+		container: S,
+		initialFocus: w,
+		...u == null ? {} : { description: u },
+		footerClassName: ["confirm-dialog__actions", C].filter(Boolean).join(" "),
+		footer: /* @__PURE__ */ i(n, { children: [
+			/* @__PURE__ */ r(e, {
+				ref: w,
+				variant: "outline",
+				onClick: D,
+				disabled: T,
+				children: y
+			}),
+			h && g && /* @__PURE__ */ r(e, {
+				variant: "outline",
+				onClick: g,
+				disabled: T,
+				children: h
+			}),
+			/* @__PURE__ */ r(e, {
+				variant: _ ? "outline" : "primary",
+				destructive: _,
+				onClick: O,
+				disabled: T,
+				children: T ? b : v
+			})
+		] }),
+		children: d
+	});
+}
+//#endregion
+export { c as ConfirmDialog };

package/dist/connector-auth-shell.js

@@ -0,0 +1,37 @@
+'use client';
+import { t as e } from "./_shared/form-size.js";
+import { Columns as t } from "./columns.js";
+import { Stack as n } from "./stack.js";
+import { PageIntro as r } from "./page-intro.js";
+import { PublicPageShell as i } from "./public-page-shell.js";
+import { jsx as a, jsxs as o } from "react/jsx-runtime";
+import { forwardRef as s } from "react";
+//#region src/stories/templates/ConnectorAuth/ConnectorAuthShell.tsx
+var c = s(function({ title: s, description: c, intro: l, aside: u, children: d, header: f, footer: p, preferences: m, preferencesLabel: h, id: g, shell: _, className: v }, y) {
+	let b = /* @__PURE__ */ a(r, {
+		title: s,
+		description: c,
+		children: l
+	});
+	return /* @__PURE__ */ a(i, {
+		ref: y,
+		header: f,
+		footer: p,
+		preferences: m,
+		preferencesLabel: h,
+		id: g,
+		shell: _,
+		children: /* @__PURE__ */ a(e.Provider, {
+			value: "lg",
+			children: /* @__PURE__ */ o(t, {
+				className: v,
+				children: [u ? /* @__PURE__ */ o(n, {
+					mobileOrder: "reverse",
+					children: [b, u]
+				}) : b, d]
+			})
+		})
+	});
+});
+//#endregion
+export { c as ConnectorAuthShell };