themelia-react-ui 2.0.5 → 3.0.0

package/dist/{text-inputs-B1culiSK.js → text-inputs-ljyBYaCd.js}

@@ -1,123 +1,124 @@
 "use client";
-import { d as e } from "./ui-provider-C-74NVLc.js";
+import { f as e } from "./ui-provider-Bu1S-o96.js";
 import { useStrings as t } from "./lib/strings.js";
-import { t as n } from "./utils-B6kKb8jB.js";
+import { t as n } from "./utils-BVbAG2J6.js";
 import { t as r } from "./affordance-geometry.generated-P-aVJisu.js";
-import { n as i } from "./buttons-BedGfygC.js";
-import { c as a } from "./typography-BQnine1k.js";
-import { t as o } from "./field-state-recipes-BVA2CWHo.js";
-import { n as s } from "./field-affordance-recipes-DWcNcOjh.js";
+import { c as i } from "./typography-C0dELqYV.js";
+import { n as a } from "./buttons-pZVgPTZn.js";
+import { t as o } from "./field-state-recipes-EtCxpEy3.js";
+import { n as s } from "./field-affordance-recipes-DfbMadot.js";
 import { t as c } from "./editable-text-recipe-Cn61kEcv.js";
-import { _ as l, a as u, g as d, o as f, u as p, v as m, y as h } from "./form-sizing-Bs2qFUeE.js";
-import { a as g, i as _, o as v, r as y, t as b } from "./input-CvyDQlY7.js";
-import { t as x } from "./input-DMBwAZmr.js";
+import { _ as l, a as u, g as d, o as f, u as p, v as m, y as h } from "./form-sizing-DE_dZw32.js";
+import { a as g, i as ee, o as _, r as v, t as y } from "./input-DfJyrjoR.js";
+import { t as b } from "./input-2YrgTUrz.js";
+import { t as x } from "./use-controllable-state-BlP8SyBI.js";
 import * as S from "react";
-import { useCallback as C, useEffect as w, useRef as T } from "react";
-import { jsx as E, jsxs as D } from "react/jsx-runtime";
-import { Eye as O, EyeOff as k, Loader2Icon as ee } from "lucide-react";
-import { cva as A } from "class-variance-authority";
+import { useCallback as C, useEffect as w, useRef as te } from "react";
+import { jsx as T, jsxs as E } from "react/jsx-runtime";
+import { Eye as D, EyeOff as O, Loader2Icon as ne } from "lucide-react";
+import { cva as k } from "class-variance-authority";
 //#region src/components/base/text-inputs/textarea.tsx
-var te = { clear: "Clear textarea" }, j = S.forwardRef((i, u) => {
-	let { className: f, maxLength: p, showCharacterCount: _, clearable: b, onClear: x, loading: S = !1, invalid: O, size: k, autoResize: A = !1, minRows: j = 2, maxRows: M, onChange: N, onValueChange: P, value: F, defaultValue: I, id: L, strings: ne, ...R } = i, z = T(null), B = t(te, ne), { defaultScale: V } = e(), H = h(k, V), { id: U, value: W, isControlled: G, characterCount: K, hasCharacterLimit: q, showCount: J, hasValue: Y, updateValue: X, wouldExceedLimit: Z } = v({
-		controlledValue: F,
-		hasControlledValue: "value" in i,
+var A = { clear: "Clear textarea" }, j = S.forwardRef((a, u) => {
+	let { className: f, maxLength: p, showCharacterCount: ee, clearable: y, onClear: b, loading: x = !1, invalid: S, size: D, autoResize: O = !1, minRows: k = 2, maxRows: j, onChange: M, onValueChange: N, value: P, defaultValue: F, id: I, strings: L, ...R } = a, z = te(null), B = t(A, L), { defaultScale: V } = e(), H = h(D, V), { id: U, value: W, isControlled: G, characterCount: K, hasCharacterLimit: q, showCount: J, hasValue: Y, updateValue: X, wouldExceedLimit: Z } = _({
+		controlledValue: P,
+		hasControlledValue: "value" in a,
 		nativeRef: z,
-		defaultValue: I,
+		defaultValue: F,
 		maxLength: p,
-		showCharacterCount: _,
-		providedId: L,
+		showCharacterCount: ee,
+		providedId: I,
 		idPrefix: "textarea",
-		hasOnChange: N !== void 0
-	}), Q = !!O, $ = C(() => {
-		if (!A || !z.current) return;
+		hasOnChange: M !== void 0
+	}), Q = !!S, $ = C(() => {
+		if (!O || !z.current) return;
 		let e = z.current, t = getComputedStyle(e), n = Number.parseFloat(t.lineHeight) || 20, r = (Number.parseFloat(t.paddingTop) || 0) + (Number.parseFloat(t.paddingBottom) || 0), i = t.boxSizing === "border-box" ? (Number.parseFloat(t.borderTopWidth) || 0) + (Number.parseFloat(t.borderBottomWidth) || 0) : 0;
 		e.style.height = "auto";
-		let a = n * j + r + i, o = M ? n * M + r + i : Infinity, s = Math.min(Math.max(e.scrollHeight + i, a), o);
+		let a = n * k + r + i, o = j ? n * j + r + i : Infinity, s = Math.min(Math.max(e.scrollHeight + i, a), o);
 		e.style.height = `${s}px`;
 	}, [
-		A,
-		M,
-		j
+		O,
+		j,
+		k
 	]);
 	w(() => {
 		$();
 	}, [
 		W,
 		R.placeholder,
-		A,
+		O,
 		$
 	]), w(() => {
 		let e = z.current;
-		if (!A || !e || typeof ResizeObserver > "u") return;
+		if (!O || !e || typeof ResizeObserver > "u") return;
 		let t = "", n = new ResizeObserver(() => {
 			let n = getComputedStyle(e), r = `${e.clientWidth}:${n.fontSize}:${n.lineHeight}`;
 			r !== t && (t = r, $());
 		});
 		return n.observe(e), () => n.disconnect();
-	}, [A, $]);
+	}, [O, $]);
 	let re = C((e) => {
 		let t = e.target.value;
-		Z(t) || (X(t), P?.(t), N?.(e), A && setTimeout($, 0));
+		Z(t) || (X(t), N?.(t), M?.(e), O && setTimeout($, 0));
 	}, [
+		M,
 		N,
-		P,
 		X,
 		Z,
-		A,
+		O,
 		$
 	]), ie = C(() => {
-		R.disabled || R.readOnly || S || (z.current && g(z.current), x?.(), z.current?.focus());
+		R.disabled || R.readOnly || x || (z.current && g(z.current), b?.(), z.current?.focus());
 	}, [
 		R.disabled,
 		R.readOnly,
-		S,
-		x
-	]), ae = b && Y && !S && !J;
-	return /* @__PURE__ */ D("div", {
+		x,
+		b
+	]), ae = y && Y && !x && !J;
+	return /* @__PURE__ */ E("div", {
 		className: n("textarea--component", "relative w-full"),
 		children: [
-			/* @__PURE__ */ E("textarea", {
+			/* @__PURE__ */ T("textarea", {
 				ref: (e) => {
 					typeof u == "function" ? u(e) : u && (u.current = e), z.current = e;
 				},
 				id: U,
-				...G ? { value: W } : { defaultValue: I },
+				...G ? { value: W } : { defaultValue: F },
 				onChange: re,
 				maxLength: p,
 				"aria-invalid": Q || void 0,
-				rows: j,
+				rows: k,
 				style: {
-					resize: A ? "none" : R.style?.resize,
-					overflow: A && M ? "auto" : "visible",
+					resize: O ? "none" : R.style?.resize,
+					overflow: O && j ? "auto" : "visible",
 					...R.style
 				},
 				className: n("placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground", "border-input box-border flex w-full rounded-radius border bg-transparent px-control", l[H], "transition-[color,box-shadow] outline-none", "disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50", "[&:read-only:not(:disabled)]:bg-muted", m[H], c[H], o.focus, o.invalid, ae && s.clearPadding[H], J && s.textareaCountPadding, f),
 				...R,
-				disabled: R.disabled || S
+				disabled: R.disabled || x
 			}),
-			!!J && /* @__PURE__ */ E("div", {
+			!!J && /* @__PURE__ */ T("div", {
 				className: n("pointer-events-none absolute bottom-control-y-offset text-xs tabular-nums", r.clearEnd.md, R.disabled && "opacity-50", Q ? "text-destructive" : "text-muted-foreground"),
 				"aria-live": "polite",
 				role: "status",
-				children: /* @__PURE__ */ D(a, {
+				children: /* @__PURE__ */ E(i, {
 					tag: "span",
 					size: "xs",
 					type: Q ? "error" : "secondary",
 					children: [K, q ? `/${p}` : ""]
 				})
 			}),
-			!!S && !J && /* @__PURE__ */ E("div", {
+			!!x && !J && /* @__PURE__ */ T("div", {
 				className: n("pointer-events-none absolute end-[calc(var(--control-x)*var(--space-scale))]", d.icon[H], Q ? "text-destructive" : "text-muted-foreground"),
-				children: /* @__PURE__ */ E(ee, {
+				children: /* @__PURE__ */ T(ne, {
 					className: "size-icon animate-spin",
 					"aria-hidden": "true"
 				})
 			}),
-			!!ae && !J && /* @__PURE__ */ E(y, {
+			!!ae && !J && /* @__PURE__ */ T(v, {
 				className: n("absolute", d.target[H], s.clearEnd[H]),
 				"aria-label": B.clear,
 				onClick: ie,
-				disabled: R.disabled || R.readOnly || S
+				disabled: R.disabled || R.readOnly || x
 			})
 		]
 	});
@@ -126,7 +127,7 @@ j.displayName = "Textarea";
 //#endregion
 //#region src/components/ui/textarea.tsx
 function M({ className: e, ...t }) {
-	return /* @__PURE__ */ E("textarea", {
+	return /* @__PURE__ */ T("textarea", {
 		"data-slot": "textarea",
 		className: n("border-input rounded-radius border bg-transparent px-control py-space-md shadow-none transition-[color,box-shadow] placeholder:text-muted-foreground flex field-sizing-content min-h-textarea w-full outline-none disabled:cursor-not-allowed disabled:opacity-50 [&:read-only:not(:disabled)]:bg-muted", c.md, o.focus, o.invalid, e),
 		...t
@@ -135,14 +136,14 @@ function M({ className: e, ...t }) {
 //#endregion
 //#region src/components/ui/input-group.tsx
 function N({ className: e, ...t }) {
-	return /* @__PURE__ */ E("div", {
+	return /* @__PURE__ */ T("div", {
 		"data-slot": "input-group",
 		role: "group",
 		className: n("border-input h-control rounded-radius border shadow-none transition-[color,box-shadow] has-[>[data-align=block-end]]:h-auto has-[>[data-align=block-end]]:flex-col has-[>[data-align=block-start]]:h-auto has-[>[data-align=block-start]]:flex-col has-[>[data-align=block-end]]:[&>input]:pt-space-lg has-[>[data-align=block-start]]:[&>input]:pb-space-lg has-[>[data-align=inline-end]]:[&>input]:pe-space-sm has-[>[data-align=inline-start]]:[&>input]:ps-space-sm [[data-slot=combobox-content]_&]:focus-within:border-inherit [[data-slot=combobox-content]_&]:focus-within:ring-0 group/input-group relative flex w-full min-w-0 items-center outline-none has-[>textarea]:h-auto", o.groupFocus, o.groupInvalid, e),
 		...t
 	});
 }
-var P = A("text-muted-foreground h-auto gap-space-md py-space-sm text-sm font-medium group-data-[disabled=true]/input-group:opacity-50 [&>kbd]:rounded-radius [&>svg:not([class*='size-'])]:size-icon flex cursor-text items-center justify-center select-none", {
+var P = k("text-muted-foreground h-auto gap-space-md py-space-sm text-sm font-medium group-data-[disabled=true]/input-group:opacity-50 [&>kbd]:rounded-radius [&>svg:not([class*='size-'])]:size-icon flex cursor-text items-center justify-center select-none", {
 	variants: { align: {
 		"inline-start": "ps-control has-[>button]:-ms-space-xs has-[>kbd]:-ms-space-2xs order-first",
 		"inline-end": "pe-control has-[>button]:-me-space-xs has-[>kbd]:-me-space-2xs order-last",
@@ -152,7 +153,7 @@ var P = A("text-muted-foreground h-auto gap-space-md py-space-sm text-sm font-me
 	defaultVariants: { align: "inline-start" }
 });
 function F({ className: e, align: t = "inline-start", ...r }) {
-	return /* @__PURE__ */ E("div", {
+	return /* @__PURE__ */ T("div", {
 		role: "group",
 		"data-slot": "input-group-addon",
 		"data-align": t,
@@ -163,7 +164,7 @@ function F({ className: e, align: t = "inline-start", ...r }) {
 		...r
 	});
 }
-A("gap-space-md text-sm shadow-none flex items-center", {
+k("gap-space-md text-sm shadow-none flex items-center", {
 	variants: { size: {
 		xs: "h-action-xs gap-space-xs rounded-radius px-control-xs [&>svg:not([class*='size-'])]:size-icon-sm",
 		sm: "",
@@ -173,20 +174,20 @@ A("gap-space-md text-sm shadow-none flex items-center", {
 	defaultVariants: { size: "xs" }
 });
 function I({ className: e, ...t }) {
-	return /* @__PURE__ */ E("span", {
+	return /* @__PURE__ */ T("span", {
 		className: n("text-muted-foreground gap-space-md text-sm [&_svg:not([class*='size-'])]:size-icon flex items-center [&_svg]:pointer-events-none", e),
 		...t
 	});
 }
 function L({ className: e, ...t }) {
-	return /* @__PURE__ */ E(x, {
+	return /* @__PURE__ */ T(b, {
 		"data-slot": "input-group-control",
 		className: n("rounded-none border-0 bg-transparent shadow-none ring-0 focus-visible:ring-0 aria-invalid:ring-0 flex-1", e),
 		...t
 	});
 }
-function ne({ className: e, ...t }) {
-	return /* @__PURE__ */ E(M, {
+function R({ className: e, ...t }) {
+	return /* @__PURE__ */ T(M, {
 		"data-slot": "input-group-control",
 		className: n("rounded-none border-0 bg-transparent py-space-md shadow-none ring-0 focus-visible:ring-0 aria-invalid:ring-0 flex-1 resize-none", e),
 		...t
@@ -194,23 +195,23 @@ function ne({ className: e, ...t }) {
 }
 //#endregion
 //#region src/components/base/text-inputs/input-group.tsx
-function R() {
+function z() {
 	let { defaultScale: t } = e();
 	return h(void 0, t);
 }
-function z({ className: e, ...t }) {
-	let r = R();
-	return /* @__PURE__ */ E(N, {
+function B({ className: e, ...t }) {
+	let r = z();
+	return /* @__PURE__ */ T(N, {
 		className: n("input-group--component box-border rounded-radius font-sans text-foreground shadow-none", u[r], c[r], "has-[>[data-align=block-end]]:[&>input]:pt-space-lg has-[>[data-align=block-start]]:[&>input]:pb-space-lg", "has-[>[data-align=inline-end]]:[&>input]:pe-space-sm has-[>[data-align=inline-start]]:[&>input]:ps-space-sm", e),
 		...t
 	});
 }
-var B = {
+var V = {
 	"inline-start": "h-full py-0",
 	"inline-end": "h-full py-0",
 	"block-start": "pt-space-md group-has-[>input]/input-group:pt-space-md [.border-b]:pb-space-md",
 	"block-end": "pb-space-md group-has-[>input]/input-group:pb-space-md [.border-t]:pt-space-md"
-}, V = {
+}, H = {
 	sm: {
 		"inline-start": "ps-control-sm",
 		"inline-end": "pe-control-sm"
@@ -223,37 +224,37 @@ var B = {
 		"inline-start": "ps-control",
 		"inline-end": "pe-control"
 	}
-}, H = {
+}, U = {
 	sm: "[&>svg:not([class*='size-'])]:size-icon-sm",
 	md: "[&>svg:not([class*='size-'])]:size-icon",
 	lg: "[&>svg:not([class*='size-'])]:size-icon-lg"
 };
-function U({ className: e, align: t = "inline-start", ...r }) {
-	let i = R(), a = t ?? "inline-start";
-	return /* @__PURE__ */ E(F, {
+function W({ className: e, align: t = "inline-start", ...r }) {
+	let i = z(), a = t ?? "inline-start";
+	return /* @__PURE__ */ T(F, {
 		align: t,
-		className: n("input-group-addon--component box-border gap-space-md py-space-sm", H[i], B[a], a === "inline-start" || a === "inline-end" ? V[i][a] : f[i], e),
+		className: n("input-group-addon--component box-border gap-space-md py-space-sm", U[i], V[a], a === "inline-start" || a === "inline-end" ? H[i][a] : f[i], e),
 		...r
 	});
 }
-function W({ className: e, tone: t = "secondary", buttonStyle: r = "ghost", truncate: a = !0, iconOnly: o, ...s }) {
-	return /* @__PURE__ */ E(i, {
+function G({ className: e, tone: t = "secondary", buttonStyle: r = "ghost", truncate: i = !0, iconOnly: o, ...s }) {
+	return /* @__PURE__ */ T(a, {
 		tone: t,
 		buttonStyle: r,
-		truncate: a,
+		truncate: i,
 		iconOnly: o,
 		className: n("input-group-button--component max-h-full shadow-none", o ? "in-[[data-align=inline-start]]:w-auto in-[[data-align=inline-start]]:aspect-square in-[[data-align=inline-end]]:w-auto in-[[data-align=inline-end]]:aspect-square" : "in-[[data-align=inline-start]]:h-full in-[[data-align=inline-start]]:min-h-0 in-[[data-align=inline-end]]:h-full in-[[data-align=inline-end]]:min-h-0", e),
 		...s
 	});
 }
-function G(e) {
+function K(e) {
 	return typeof e == "string" || typeof e == "number" || typeof e == "bigint";
 }
-function K({ children: e, className: t, ...r }) {
-	return /* @__PURE__ */ E(I, {
+function q({ children: e, className: t, ...r }) {
+	return /* @__PURE__ */ T(I, {
 		className: n("input-group-text--component gap-space-md [&_svg:not([class*='size-'])]:size-icon", t),
 		...r,
-		children: G(e) ? /* @__PURE__ */ E(a, {
+		children: K(e) ? /* @__PURE__ */ T(i, {
 			tag: "span",
 			size: "inherit",
 			lineHeight: "tight",
@@ -262,54 +263,53 @@ function K({ children: e, className: t, ...r }) {
 		}) : e
 	});
 }
-function q({ className: e, ...t }) {
-	let r = R();
-	return /* @__PURE__ */ E(L, {
+function J({ className: e, ...t }) {
+	let r = z();
+	return /* @__PURE__ */ T(L, {
 		className: n("input-group-input--component box-border max-h-full font-sans text-foreground", u[r], "min-h-lh", p[r], c[r], e),
 		...t
 	});
 }
-function J({ className: e, ...t }) {
-	let r = R();
-	return /* @__PURE__ */ E(ne, {
+function Y({ className: e, ...t }) {
+	let r = z();
+	return /* @__PURE__ */ T(R, {
 		className: n("input-group-textarea--component box-border py-space-md", m[r], f[r], c[r], e),
 		...t
 	});
 }
 //#endregion
 //#region src/components/base/text-inputs/password-input.tsx
-var Y = {
+var X = {
 	showPassword: "Show password",
 	hidePassword: "Hide password"
-}, X = S.forwardRef(function({ visible: e, defaultVisible: r = !1, onVisibleChange: i, revealable: a = !0, wrapperClassName: o, visibilityButtonClassName: c, className: l, disabled: u, loading: d, inputStrings: f, strings: p, ...m }, h) {
-	let g = t(Y, p), [v, y] = S.useState(r), x = e !== void 0, C = x ? e : v, w = u || d, T = S.useCallback(() => {
-		let e = !C;
-		x || y(e), i?.(e);
-	}, [
-		x,
-		C,
-		i
-	]), D = a ? /* @__PURE__ */ E("button", {
+}, Z = S.forwardRef(function({ visible: e, defaultVisible: r = !1, onVisibleChange: i, revealable: a = !0, wrapperClassName: o, visibilityButtonClassName: c, className: l, disabled: u, loading: d, inputStrings: f, strings: p, ...m }, h) {
+	let g = t(X, p), [_, v] = x({
+		value: e,
+		defaultValue: r,
+		onChange: i
+	}), b = u || d, C = S.useCallback(() => {
+		v(!_);
+	}, [_, v]), w = a ? /* @__PURE__ */ T("button", {
 		type: "button",
 		className: n("password-input--toggle", s.target, s.focus, s.toggle, c),
-		"aria-label": C ? g.hidePassword : g.showPassword,
-		"aria-pressed": C,
-		disabled: w,
+		"aria-label": _ ? g.hidePassword : g.showPassword,
+		"aria-pressed": _,
+		disabled: b,
 		onMouseDown: (e) => e.preventDefault(),
-		onClick: T,
-		children: E(C ? k : O, {
+		onClick: C,
+		children: T(_ ? O : D, {
 			className: s.icon,
 			"aria-hidden": "true"
 		})
 	}) : null;
-	return /* @__PURE__ */ E("div", {
+	return /* @__PURE__ */ T("div", {
 		className: n("password-input--component", "relative", o),
-		children: /* @__PURE__ */ E(_.Provider, {
-			value: D,
-			children: /* @__PURE__ */ E(b, {
+		children: /* @__PURE__ */ T(ee.Provider, {
+			value: w,
+			children: /* @__PURE__ */ T(y, {
 				...m,
 				ref: h,
-				type: C ? "text" : "password",
+				type: _ ? "text" : "password",
 				disabled: u,
 				loading: d,
 				className: l,
@@ -318,15 +318,15 @@ var Y = {
 		})
 	});
 });
-X.displayName = "PasswordInput";
+Z.displayName = "PasswordInput";
 //#endregion
 //#region src/components/base/text-inputs/slug-field.tsx
-function Z(e, { separator: t = "-", lowercase: n = !0, trim: r = !0 } = {}) {
+function Q(e, { separator: t = "-", lowercase: n = !0, trim: r = !0 } = {}) {
 	let i = t || "-", a = i.replace(/[.*+?^${}()|[\]\\]/g, "\\$&"), o = String(e ?? "").normalize("NFKD").replace(/[\u0300-\u036f]/g, "").replace(/&/g, " and ").replace(/['’]/g, "");
 	return n && (o = o.toLowerCase()), o = o.replace(/[^\p{Letter}\p{Number}]+/gu, i).replace(RegExp(`${a}{2,}`, "g"), i), r && (o = o.replace(RegExp(`^${a}|${a}$`, "g"), "")), o;
 }
-var Q = S.forwardRef(function({ value: e, slugify: t, separator: r = "-", lowercase: i = !0, trim: a = !0, wrapperClassName: o, className: s, ...c }, l) {
-	let u = S.useMemo(() => t?.(e) ?? Z(e, {
+var $ = S.forwardRef(function({ value: e, slugify: t, separator: r = "-", lowercase: i = !0, trim: a = !0, wrapperClassName: o, className: s, ...c }, l) {
+	let u = S.useMemo(() => t?.(e) ?? Q(e, {
 		separator: r,
 		lowercase: i,
 		trim: a
@@ -337,9 +337,9 @@ var Q = S.forwardRef(function({ value: e, slugify: t, separator: r = "-", lowerc
 		a,
 		e
 	]);
-	return /* @__PURE__ */ E("div", {
+	return /* @__PURE__ */ T("div", {
 		className: n("slug-field--component", o),
-		children: /* @__PURE__ */ E(b, {
+		children: /* @__PURE__ */ T(y, {
 			ref: l,
 			...c,
 			type: "text",
@@ -349,8 +349,8 @@ var Q = S.forwardRef(function({ value: e, slugify: t, separator: r = "-", lowerc
 		})
 	});
 });
-Q.displayName = "SlugField";
+$.displayName = "SlugField";
 //#endregion
-export { z as a, q as c, j as d, Y as i, K as l, Z as n, U as o, X as r, W as s, Q as t, J as u };
+export { B as a, J as c, j as d, A as f, X as i, q as l, Q as n, W as o, Z as r, G as s, $ as t, Y as u };
 
-//# sourceMappingURL=text-inputs-B1culiSK.js.map
+//# sourceMappingURL=text-inputs-ljyBYaCd.js.map

package/dist/text-inputs-ljyBYaCd.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"text-inputs-ljyBYaCd.js","names":["Textarea","React","InputGroup","InputGroupAddon","InputGroupText","InputGroupInput","Input","InputGroupTextarea","InputGroupPrimitive","InputGroupAddonPrimitive","InputGroupTextPrimitive","InputGroupInputPrimitive","InputGroupTextareaPrimitive","React","React","useDensityConfig","cn","affordanceGeometry","Text","Button","fieldStateRecipes","fieldAffordanceRecipes","editableTextSizeClasses","formTextareaInsetClasses","formControlHeightClasses","formTextareaAffordanceTopClasses","formControlHorizontalPaddingClasses","formControlPaddingClasses","formTextareaSizeClasses","resolveFormControlSize","clearNativeField","InputTrailingActionContext","useFormFieldState","FieldClearButton","Input","Input$1","useControllableState","React$1","defaultTextareaStrings","Textarea$1","sizeProp","controlledValue","providedId","stringsProp","props","allProps","textareaRef","useRef","strings","useStrings","size","defaultScale","textareaValue","onChange","hasError","invalid","adjustHeight","useCallback","autoResize","textarea","css","lineHeight","padding","border","minHeight","minRows","maxHeight","maxRows","newHeight","useEffect","previous","observer","signature","handleTextareaChange","newValue","wouldExceedLimit","updateValue","onValueChange","handleClear","loading","onClear","showClearButton","clearable","hasValue","showCount","forwardedRef","node","isControlled","className","characterCount","hasCharacterLimit","maxLength","Loader2Icon","Textarea","InputGroup$1","inputGroupAddonVariants","cva","InputGroupAddon$1","align","InputGroupText$1","InputGroupInput$1","InputGroupTextarea$1","useInputGroupScale","InputGroup","addonAlignmentClasses","addonInlinePaddingClasses","addonIconClasses","InputGroupAddon","alignment","InputGroupButton","iconOnly","isScalarContent","content","InputGroupText","children","InputGroupInput","InputGroupTextarea","defaultPasswordInputStrings","PasswordInput","isVisible","setVisible","visible","defaultVisible","onVisibleChange","disabledState","disabled","toggleVisibility","visibilityAction","revealable","visibilityButtonClassName","event","jsx","EyeOff","Eye","wrapperClassName","inputStrings","slugifyValue","safeSeparator","separator","escapedSeparator","normalized","value","lowercase","trim","SlugField","slug","slugify"],"sources":["../src/components/base/text-inputs/textarea.tsx","../src/components/ui/textarea.tsx","../src/components/ui/input-group.tsx","../src/components/base/text-inputs/input-group.tsx","../src/components/base/text-inputs/password-input.tsx","../src/components/base/text-inputs/slug-field.tsx"],"sourcesContent":["import { fieldStateRecipes } from '../../../lib/field-state-recipes';\nimport { affordanceGeometry } from '../../../lib/affordance-geometry.generated';\nimport { fieldAffordanceRecipes } from '../../../lib/field-affordance-recipes';\nimport { editableTextSizeClasses } from '../../../lib/editable-text-recipe';\nimport { Loader2Icon } from 'lucide-react';\nimport * as React from 'react';\nimport { useRef, useCallback, useEffect } from 'react';\nimport { Text } from '../../typography';\nimport { useDensityConfig, type FormControlSize } from '../../../lib/ui-provider';\nimport { useStrings, type StringsProp } from '../../../lib/strings';\nimport { cn } from '../../../lib/utils';\nimport { formTextareaAffordanceTopClasses, formTextareaInsetClasses, formTextareaSizeClasses, resolveFormControlSize } from '../forms/form-sizing';\nimport { useFormFieldState } from './hooks';\nimport { clearNativeField } from './clear-native-field';\nimport { FieldClearButton } from './field-clear-button';\n\nexport interface TextareaStrings {\n\t\tclear: string;\n}\n\nexport const defaultTextareaStrings: TextareaStrings = {\n\t\tclear: 'Clear textarea',\n};\n\nexport interface TextareaProps extends Omit<React.ComponentProps<'textarea'>, 'onChange' | 'value'> {\n\t\t// String overrides (e.g. clear button aria-label)\n\t\t/** Overrides the character-count and clear copy. */\n\t\tstrings?: StringsProp<TextareaStrings>;\n\t\t// Character limit\n\t\t/** Character cap, also used as the denominator of the count. */\n\t\tmaxLength?: number;\n\t\t/** Shows the current and maximum character count. */\n\t\tshowCharacterCount?: boolean;\n\n\t\t// Clear button\n\t\t/** Shows an inline clear action when the field has a value. */\n\t\tclearable?: boolean;\n\t\tonClear?: () => void;\n\n\t\t// Loading state\n\t\t/** Replaces the trailing affordance with a loading indicator. */\n\t\tloading?: boolean;\n\n\t\t// Error state for styling (passed from FormField)\n\t\t/** Applies the invalid styling. Validation copy stays with FormField. */\n\t\tinvalid?: boolean;\n\n\t\t// Visual size\n\t\t/** Control density. Falls back to `UIProvider.density.defaultScale`. */\n\t\tsize?: FormControlSize;\n\n\t\t// Auto-resize functionality\n\t\t/** Grows the field with its content, between `minRows` and `maxRows`. */\n\t\tautoResize?: boolean;\n\t\t/** Smallest height, in rows, when `autoResize` is set. */\n\t\tminRows?: number;\n\t\t/** Height at which the field stops growing and starts scrolling. */\n\t\tmaxRows?: number;\n\n\t\t// Value props\n\t\tonChange?: (e: React.ChangeEvent<HTMLTextAreaElement>) => void;\n\t\t/** Raw string callback, emitted alongside the native change event. */\n\t\tonValueChange?: (value: string) => void;\n\t\t/** Current text. Controlled. */\n\t\tvalue?: string | null;\n\t\t/** Initial text for uncontrolled use. */\n\t\tdefaultValue?: string;\n}\n\nconst TextareaImpl = (\n\t\tallProps: TextareaProps,\n\t\tforwardedRef: React.ForwardedRef<HTMLTextAreaElement>,\n) => {\n\t\tconst {\n\t\t\t\tclassName,\n\t\t\t\tmaxLength,\n\t\t\t\tshowCharacterCount,\n\t\t\t\tclearable,\n\t\t\t\tonClear,\n\t\t\t\tloading = false,\n\t\t\t\tinvalid,\n\t\t\t\tsize: sizeProp,\n\t\t\t\tautoResize = false,\n\t\t\t\tminRows = 2,\n\t\t\t\tmaxRows,\n\t\t\t\tonChange,\n\t\t\t\tonValueChange,\n\t\t\t\tvalue: controlledValue,\n\t\t\t\tdefaultValue,\n\t\t\t\tid: providedId,\n\t\t\t\tstrings: stringsProp,\n\t\t\t\t...props\n\t\t} = allProps;\n\t\tconst textareaRef = useRef<HTMLTextAreaElement>(null);\n\t\tconst strings = useStrings(defaultTextareaStrings, stringsProp);\n\t\tconst { defaultScale } = useDensityConfig();\n\t\tconst size = resolveFormControlSize(sizeProp, defaultScale);\n\n\t\t// Use shared form field state hook\n\t\tconst {\n\t\t\t\tid,\n\t\t\t\tvalue: textareaValue,\n\t\t\t\tisControlled,\n\t\t\t\tcharacterCount,\n\t\t\t\thasCharacterLimit,\n\t\t\t\tshowCount,\n\t\t\t\thasValue,\n\t\t\t\tupdateValue,\n\t\t\t\twouldExceedLimit,\n\t\t} = useFormFieldState({\n\t\t\t\tcontrolledValue,\n\t\t\t\thasControlledValue: 'value' in allProps,\n\t\t\t\tnativeRef: textareaRef,\n\t\t\t\tdefaultValue,\n\t\t\t\tmaxLength,\n\t\t\t\tshowCharacterCount,\n\t\t\t\tprovidedId,\n\t\t\t\tidPrefix: 'textarea',\n\t\t\t\thasOnChange: onChange !== undefined,\n\t\t});\n\n\t\t// Derive display states\n\t\tconst hasError = Boolean(invalid);\n\n\t\tconst adjustHeight = useCallback(() => {\n\t\t\t\tif (!autoResize || !textareaRef.current) return;\n\n\t\t\t\tconst textarea = textareaRef.current;\n\n\t\t\t\tconst css = getComputedStyle(textarea);\n\t\t\t\tconst lineHeight = Number.parseFloat(css.lineHeight) || 20;\n\t\t\t\tconst padding = (Number.parseFloat(css.paddingTop) || 0) + (Number.parseFloat(css.paddingBottom) || 0);\n\t\t\t\tconst border = css.boxSizing === 'border-box' ? (Number.parseFloat(css.borderTopWidth) || 0) + (Number.parseFloat(css.borderBottomWidth) || 0) : 0;\n\t\t\t\ttextarea.style.height = 'auto';\n\t\t\t\tconst minHeight = lineHeight * minRows + padding + border;\n\t\t\t\tconst maxHeight = maxRows ? lineHeight * maxRows + padding + border : Infinity;\n\n\t\t\t\tconst newHeight = Math.min(Math.max(textarea.scrollHeight + border, minHeight), maxHeight);\n\t\t\t\ttextarea.style.height = `${newHeight}px`;\n\t\t}, [autoResize, maxRows, minRows]);\n\n\t\tuseEffect(() => {\n\t\t\t\tadjustHeight();\n\t\t}, [textareaValue, props.placeholder, autoResize, adjustHeight]);\n\n\t\tuseEffect(() => {\n\t\t\t\tconst textarea = textareaRef.current;\n\t\t\t\tif (!autoResize || !textarea || typeof ResizeObserver === 'undefined') return;\n\t\t\t\tlet previous = '';\n\t\t\t\tconst observer = new ResizeObserver(() => {\n\t\t\t\t\t\tconst css = getComputedStyle(textarea);\n\t\t\t\t\t\tconst signature = `${textarea.clientWidth}:${css.fontSize}:${css.lineHeight}`;\n\t\t\t\t\t\tif (signature === previous) return;\n\t\t\t\t\t\tprevious = signature;\n\t\t\t\t\t\tadjustHeight();\n\t\t\t\t});\n\t\t\t\tobserver.observe(textarea);\n\t\t\t\treturn () => observer.disconnect();\n\t\t}, [autoResize, adjustHeight]);\n\n\t\tconst handleTextareaChange = useCallback(\n\t\t\t\t(e: React.ChangeEvent<HTMLTextAreaElement>) => {\n\t\t\t\t\t\tconst newValue = e.target.value;\n\n\t\t\t\t\t\t// Check character limit\n\t\t\t\t\t\tif (wouldExceedLimit(newValue)) {\n\t\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\t// Update internal state if uncontrolled\n\t\t\t\t\t\tupdateValue(newValue);\n\t\t\t\t\t\tonValueChange?.(newValue);\n\n\t\t\t\t\t\t// Call external onChange\n\t\t\t\t\t\tonChange?.(e);\n\n\t\t\t\t\t\t// Auto-resize if enabled\n\t\t\t\t\t\tif (autoResize) {\n\t\t\t\t\t\t\t\tsetTimeout(adjustHeight, 0);\n\t\t\t\t\t\t}\n\t\t\t\t},\n\t\t\t\t[onChange, onValueChange, updateValue, wouldExceedLimit, autoResize, adjustHeight]\n\t\t);\n\n\t\tconst handleClear = useCallback(() => {\n\t\t\t\tif (props.disabled || props.readOnly || loading) return;\n\n\t\t\t\tif (textareaRef.current) clearNativeField(textareaRef.current);\n\n\t\t\t\t// Execute optional onClear callback\n\t\t\t\tonClear?.();\n\n\t\t\t\t// Focus the textarea after clearing\n\t\t\t\ttextareaRef.current?.focus();\n\n\t\t}, [props.disabled, props.readOnly, loading, onClear]);\n\n\t\t// Determine what to show in the end position\n\t\tconst showClearButton = clearable && hasValue && !loading && !showCount;\n\n\t\treturn (\n\t\t\t\t<div className={cn('textarea--component', 'relative w-full')}>\n\t\t\t\t\t\t<textarea\n\t\t\t\t\t\t\t\tref={(node) => {\n\t\t\t\t\t\t\t\t\t\tif (typeof forwardedRef === 'function') {\n\t\t\t\t\t\t\t\t\t\t\t\tforwardedRef(node);\n\t\t\t\t\t\t\t\t\t\t} else if (forwardedRef) {\n\t\t\t\t\t\t\t\t\t\t\t\tforwardedRef.current = node;\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\ttextareaRef.current = node;\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\tid={id}\n\t\t\t\t\t\t\t\t{...(isControlled ? { value: textareaValue } : { defaultValue })}\n\t\t\t\t\t\t\t\tonChange={handleTextareaChange}\n\t\t\t\t\t\t\t\tmaxLength={maxLength}\n\t\t\t\t\t\t\t\taria-invalid={hasError || undefined}\n\t\t\t\t\t\t\t\trows={minRows}\n\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t\tresize: autoResize ? 'none' : props.style?.resize,\n\t\t\t\t\t\t\t\t\t\toverflow: autoResize && maxRows ? 'auto' : 'visible',\n\t\t\t\t\t\t\t\t\t\t...props.style,\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\t\t\t\t// Base styles\n\t\t\t\t\t\t\t\t\t\t'placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground',\n\t\t\t\t\t\t\t\t\t\t'border-input box-border flex w-full rounded-radius border bg-transparent px-control',\n\t\t\t\t\t\t\t\t\t\t// First line where a single-line control of this size draws its value.\n\t\t\t\t\t\t\t\t\t\tformTextareaInsetClasses[size],\n\t\t\t\t\t\t\t\t\t\t'transition-[color,box-shadow] outline-none',\n\t\t\t\t\t\t\t\t\t\t'disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50',\n\t\t\t\t\t\t\t\t\t\t// Same read-only fill as Input; disabled stays on the transparent fill.\n\t\t\t\t\t\t\t\t\t\t'[&:read-only:not(:disabled)]:bg-muted',\n\t\t\t\t\t\t\t\t\t\tformTextareaSizeClasses[size],\n\t\t\t\t\t\t\t\t\t\teditableTextSizeClasses[size],\n\t\t\t\t\t\t\t\t\t\t// Focus styles\n\t\t\t\t\t\t\t\t\t\tfieldStateRecipes.focus,\n\t\t\t\t\t\t\t\t\t\t// Invalid/error styles\n\t\t\t\t\t\t\t\t\t\tfieldStateRecipes.invalid,\n\t\t\t\t\t\t\t\t\t\t// Dynamic padding for overlays\n\t\t\t\t\t\t\t\t\t\tshowClearButton && fieldAffordanceRecipes.clearPadding[size],\n\t\t\t\t\t\t\t\t\t\tshowCount && fieldAffordanceRecipes.textareaCountPadding,\n\t\t\t\t\t\t\t\t\t\tclassName\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t{...props}\n\t\t\t\t\t\t\t\tdisabled={props.disabled || loading}\n\t\t\t\t\t\t/>\n\n\t\t\t\t\t\t{/* Character Count */}\n\t\t\t\t\t\t{!!showCount && (\n\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\t\t\t\t\t\t'pointer-events-none absolute bottom-control-y-offset text-xs tabular-nums',\n\t\t\t\t\t\t\t\t\t\t\t\taffordanceGeometry.clearEnd.md,\n\t\t\t\t\t\t\t\t\t\t\t\tprops.disabled && 'opacity-50',\n\t\t\t\t\t\t\t\t\t\t\t\thasError ? 'text-destructive' : 'text-muted-foreground'\n\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t\taria-live=\"polite\"\n\t\t\t\t\t\t\t\t\t\trole=\"status\"\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t<Text tag=\"span\" size=\"xs\" type={hasError ? 'error' : 'secondary'}>\n\t\t\t\t\t\t\t\t\t\t\t\t{characterCount}\n\t\t\t\t\t\t\t\t\t\t\t\t{hasCharacterLimit ? `/${maxLength}` : ''}\n\t\t\t\t\t\t\t\t\t\t</Text>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t)}\n\n\t\t\t\t\t\t{/* Loading Spinner */}\n\t\t\t\t\t\t{!!loading && !showCount && (\n\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\t\t\t\t\t\t'pointer-events-none absolute end-[calc(var(--control-x)*var(--space-scale))]',\n\t\t\t\t\t\t\t\t\t\t\t\tformTextareaAffordanceTopClasses.icon[size],\n\t\t\t\t\t\t\t\t\t\t\t\thasError ? 'text-destructive' : 'text-muted-foreground'\n\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t<Loader2Icon className=\"size-icon animate-spin\" aria-hidden=\"true\" />\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t)}\n\n\t\t\t\t\t\t{/* Clear Button */}\n\t\t\t\t\t\t{!!showClearButton && !showCount && (\n\t\t\t\t\t\t\t\t<FieldClearButton\n\t\t\t\t\t\t\t\t\t\tclassName={cn('absolute', formTextareaAffordanceTopClasses.target[size], fieldAffordanceRecipes.clearEnd[size])}\n\t\t\t\t\t\t\t\t\t\taria-label={strings.clear}\n\t\t\t\t\t\t\t\t\t\tonClick={handleClear}\n\t\t\t\t\t\t\t\t\t\tdisabled={props.disabled || props.readOnly || loading}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t)}\n\t\t\t\t</div>\n\t\t);\n};\n\nconst Textarea = React.forwardRef<HTMLTextAreaElement, TextareaProps>(TextareaImpl);\nTextarea.displayName = 'Textarea';\n\nexport { Textarea };\n","import { fieldStateRecipes } from '../../lib/field-state-recipes';\nimport { editableTextSizeClasses } from '../../lib/editable-text-recipe';\nimport * as React from \"react\"\n\nimport { cn } from \"../../lib/utils\"\n\nfunction Textarea({ className, ...props }: React.ComponentProps<\"textarea\">) {\n  return (\n    <textarea\n      data-slot=\"textarea\"\n      className={cn(\n        \"border-input rounded-radius border bg-transparent px-control py-space-md shadow-none transition-[color,box-shadow] placeholder:text-muted-foreground flex field-sizing-content min-h-textarea w-full outline-none disabled:cursor-not-allowed disabled:opacity-50 [&:read-only:not(:disabled)]:bg-muted\",\n        editableTextSizeClasses.md,\n        fieldStateRecipes.focus,\n        fieldStateRecipes.invalid,\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nexport { Textarea }\n","import { fieldStateRecipes } from '../../lib/field-state-recipes';\nimport { cva } from \"class-variance-authority\"\nimport type { StrictVariantProps } from \"../../lib/variant-props\"\nimport * as React from \"react\"\n\nimport { Button } from \"./button\"\nimport { Input } from \"./input\"\nimport { Textarea } from \"./textarea\"\nimport { cn } from \"../../lib/utils\"\n\nfunction InputGroup({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"input-group\"\n      role=\"group\"\n      className={cn(\n        \"border-input h-control rounded-radius border shadow-none transition-[color,box-shadow] has-[>[data-align=block-end]]:h-auto has-[>[data-align=block-end]]:flex-col has-[>[data-align=block-start]]:h-auto has-[>[data-align=block-start]]:flex-col has-[>[data-align=block-end]]:[&>input]:pt-space-lg has-[>[data-align=block-start]]:[&>input]:pb-space-lg has-[>[data-align=inline-end]]:[&>input]:pe-space-sm has-[>[data-align=inline-start]]:[&>input]:ps-space-sm [[data-slot=combobox-content]_&]:focus-within:border-inherit [[data-slot=combobox-content]_&]:focus-within:ring-0 group/input-group relative flex w-full min-w-0 items-center outline-none has-[>textarea]:h-auto\",\n        fieldStateRecipes.groupFocus,\n        fieldStateRecipes.groupInvalid,\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nconst inputGroupAddonVariants = cva(\n  \"text-muted-foreground h-auto gap-space-md py-space-sm text-sm font-medium group-data-[disabled=true]/input-group:opacity-50 [&>kbd]:rounded-radius [&>svg:not([class*='size-'])]:size-icon flex cursor-text items-center justify-center select-none\",\n  {\n    variants: {\n      align: {\n        \"inline-start\": \"ps-control has-[>button]:-ms-space-xs has-[>kbd]:-ms-space-2xs order-first\",\n        \"inline-end\": \"pe-control has-[>button]:-me-space-xs has-[>kbd]:-me-space-2xs order-last\",\n        \"block-start\":\n          \"px-control pt-space-md group-has-[>input]/input-group:pt-space-md [.border-b]:pb-space-md order-first w-full justify-start\",\n        \"block-end\":\n          \"px-control pb-space-md group-has-[>input]/input-group:pb-space-md [.border-t]:pt-space-md order-last w-full justify-start\",\n      },\n    },\n    defaultVariants: {\n      align: \"inline-start\",\n    },\n  }\n)\n\nfunction InputGroupAddon({\n  className,\n  align = \"inline-start\",\n  ...props\n}: React.ComponentProps<\"div\"> & StrictVariantProps<typeof inputGroupAddonVariants>) {\n  return (\n    // oxlint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-noninteractive-element-interactions -- Clicking the addon focuses the input, which is the keyboard control.\n    <div\n      role=\"group\"\n      data-slot=\"input-group-addon\"\n      data-align={align}\n      className={cn(inputGroupAddonVariants({ align }), className)}\n      onClick={(e) => {\n        if ((e.target as HTMLElement).closest(\"button\")) {\n          return\n        }\n        e.currentTarget.parentElement?.querySelector(\"input\")?.focus()\n      }}\n      {...props}\n    />\n  )\n}\n\nconst inputGroupButtonVariants = cva(\n  \"gap-space-md text-sm shadow-none flex items-center\",\n  {\n    variants: {\n      size: {\n        xs: \"h-action-xs gap-space-xs rounded-radius px-control-xs [&>svg:not([class*='size-'])]:size-icon-sm\",\n        sm: \"\",\n        \"icon-xs\": \"size-action-xs rounded-radius p-0 has-[>svg]:p-0\",\n        \"icon-sm\": \"size-action-sm p-0 has-[>svg]:p-0\",\n      },\n    },\n    defaultVariants: {\n      size: \"xs\",\n    },\n  }\n)\n\nfunction InputGroupButton({\n  className,\n  type = \"button\",\n  variant = \"ghost\",\n  size = \"xs\",\n  ...props\n}: Omit<React.ComponentProps<typeof Button>, \"size\" | \"type\"> &\n  StrictVariantProps<typeof inputGroupButtonVariants> & {\n    type?: \"button\" | \"submit\" | \"reset\"\n  }) {\n  return (\n    <Button\n      type={type}\n      data-size={size}\n      variant={variant}\n      className={cn(inputGroupButtonVariants({ size }), className)}\n      {...props}\n    />\n  )\n}\n\nfunction InputGroupText({ className, ...props }: React.ComponentProps<\"span\">) {\n  return (\n    <span\n      className={cn(\n        \"text-muted-foreground gap-space-md text-sm [&_svg:not([class*='size-'])]:size-icon flex items-center [&_svg]:pointer-events-none\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction InputGroupInput({\n  className,\n  ...props\n}: React.ComponentProps<\"input\">) {\n  return (\n    <Input\n      data-slot=\"input-group-control\"\n      className={cn(\"rounded-none border-0 bg-transparent shadow-none ring-0 focus-visible:ring-0 aria-invalid:ring-0 flex-1\", className)}\n      {...props}\n    />\n  )\n}\n\nfunction InputGroupTextarea({\n  className,\n  ...props\n}: React.ComponentProps<\"textarea\">) {\n  return (\n    <Textarea\n      data-slot=\"input-group-control\"\n      className={cn(\"rounded-none border-0 bg-transparent py-space-md shadow-none ring-0 focus-visible:ring-0 aria-invalid:ring-0 flex-1 resize-none\", className)}\n      {...props}\n    />\n  )\n}\n\nexport {\n  InputGroup,\n  InputGroupAddon,\n  InputGroupButton,\n  InputGroupText,\n  InputGroupInput,\n  InputGroupTextarea,\n}\n","/**\n * InputGroup — base wrapper around the shadcn `ui/input-group` primitive.\n *\n * What this layer adds on top of the primitive:\n *  - Stable BEM hooks on every wrapped part's outermost node\n *    (`input-group--component`, `input-group-addon--component`, and so on).\n *  - Design-system typography for the scalar copy inside `InputGroupText`,\n *    while arbitrary `ReactNode` content (icons, `kbd`, buttons) passes through\n *    untouched so the compound pattern stays composable.\n *  - Keeps the primitive's addon alignment and button-size variants, its\n *    focus-within/aria-invalid ring behaviour, and every native prop by spread.\n *\n * Compose it as\n * `<InputGroup><InputGroupAddon><Icon/></InputGroupAddon><InputGroupInput/></InputGroup>`.\n *\n * Reach for it when one control needs inline affordances welded to its frame —\n * a search icon, a unit suffix, a busy indicator, an inline action. For the\n * label / control / hint / error row, use `FormField` instead; this wrapper\n * owns only the control frame.\n */\nimport type { ComponentProps, ReactNode } from 'react';\n\nimport {\n\tInputGroup as InputGroupPrimitive,\n\tInputGroupAddon as InputGroupAddonPrimitive,\n\tInputGroupInput as InputGroupInputPrimitive,\n\tInputGroupText as InputGroupTextPrimitive,\n\tInputGroupTextarea as InputGroupTextareaPrimitive,\n} from '../../ui/input-group';\nimport { Button, type ButtonProps } from '../buttons';\nimport { Text } from '../../typography';\nimport { useDensityConfig, type ComponentScale } from '../../../lib/ui-provider';\nimport { editableTextSizeClasses } from '../../../lib/editable-text-recipe';\nimport { cn } from '../../../lib/utils';\nimport {\n\tformControlHeightClasses,\n\tformControlHorizontalPaddingClasses,\n\tformControlPaddingClasses,\n\tformTextareaSizeClasses,\n\tresolveFormControlSize,\n} from '../forms/form-sizing';\n\nexport type InputGroupProps = ComponentProps<typeof InputGroupPrimitive>;\nexport type InputGroupAddonProps = ComponentProps<typeof InputGroupAddonPrimitive>;\nexport interface InputGroupButtonProps extends Omit<ButtonProps, 'size'> {\n\t/** Component scale. Falls back to `UIProvider.density.defaultScale`. */\n\tsize?: ComponentScale;\n}\nexport type InputGroupInputProps = ComponentProps<typeof InputGroupInputPrimitive>;\nexport type InputGroupTextProps = ComponentProps<typeof InputGroupTextPrimitive>;\nexport type InputGroupTextareaProps = ComponentProps<typeof InputGroupTextareaPrimitive>;\n\nfunction useInputGroupScale() {\n\tconst { defaultScale } = useDensityConfig();\n\treturn resolveFormControlSize(undefined, defaultScale);\n}\n\n/** Control frame that welds inline addons onto a single input or textarea. */\nfunction InputGroup({ className, ...props }: InputGroupProps) {\n\tconst size = useInputGroupScale();\n\treturn (\n\t\t<InputGroupPrimitive\n\t\t\tclassName={cn(\n\t\t\t\t'input-group--component box-border rounded-radius font-sans text-foreground shadow-none',\n\t\t\t\tformControlHeightClasses[size],\n\t\t\t\teditableTextSizeClasses[size],\n\t\t\t\t'has-[>[data-align=block-end]]:[&>input]:pt-space-lg has-[>[data-align=block-start]]:[&>input]:pb-space-lg',\n\t\t\t\t'has-[>[data-align=inline-end]]:[&>input]:pe-space-sm has-[>[data-align=inline-start]]:[&>input]:ps-space-sm',\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\nconst addonAlignmentClasses = {\n\t'inline-start': 'h-full py-0',\n\t'inline-end': 'h-full py-0',\n\t'block-start': 'pt-space-md group-has-[>input]/input-group:pt-space-md [.border-b]:pb-space-md',\n\t'block-end': 'pb-space-md group-has-[>input]/input-group:pb-space-md [.border-t]:pt-space-md',\n} as const;\n\nconst addonInlinePaddingClasses = {\n\tsm: { 'inline-start': 'ps-control-sm', 'inline-end': 'pe-control-sm' },\n\tmd: { 'inline-start': 'ps-control', 'inline-end': 'pe-control' },\n\tlg: { 'inline-start': 'ps-control', 'inline-end': 'pe-control' },\n} as const;\n\nconst addonIconClasses = {\n\tsm: \"[&>svg:not([class*='size-'])]:size-icon-sm\",\n\tmd: \"[&>svg:not([class*='size-'])]:size-icon\",\n\tlg: \"[&>svg:not([class*='size-'])]:size-icon-lg\",\n} as const;\n\n/** Leading/trailing (or block start/end) affordance slot inside the frame. */\nfunction InputGroupAddon({ className, align = 'inline-start', ...props }: InputGroupAddonProps) {\n\tconst size = useInputGroupScale();\n\tconst alignment = align ?? 'inline-start';\n\treturn (\n\t\t<InputGroupAddonPrimitive\n\t\t\talign={align}\n\t\t\tclassName={cn(\n\t\t\t\t'input-group-addon--component box-border gap-space-md py-space-sm',\n\t\t\t\taddonIconClasses[size],\n\t\t\t\taddonAlignmentClasses[alignment],\n\t\t\t\talignment === 'inline-start' || alignment === 'inline-end'\n\t\t\t\t\t? addonInlinePaddingClasses[size][alignment]\n\t\t\t\t\t: formControlHorizontalPaddingClasses[size],\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\n/** Inline action button sized to sit inside the control frame; its label stays on one line. */\nfunction InputGroupButton({\n\tclassName,\n\ttone = 'secondary',\n\tbuttonStyle = 'ghost',\n\ttruncate = true,\n\ticonOnly,\n\t...props\n}: InputGroupButtonProps) {\n\treturn (\n\t\t<Button\n\t\t\ttone={tone}\n\t\t\tbuttonStyle={buttonStyle}\n\t\t\ttruncate={truncate}\n\t\t\ticonOnly={iconOnly}\n\t\t\tclassName={cn(\n\t\t\t\t'input-group-button--component max-h-full shadow-none',\n\t\t\t\t// Text actions fit the inner frame. Icon actions retain their own\n\t\t\t\t// height and derive a square width after the frame caps that height.\n\t\t\t\t// Block/footer actions keep their natural Button geometry.\n\t\t\t\ticonOnly\n\t\t\t\t\t? 'in-[[data-align=inline-start]]:w-auto in-[[data-align=inline-start]]:aspect-square in-[[data-align=inline-end]]:w-auto in-[[data-align=inline-end]]:aspect-square'\n\t\t\t\t\t: 'in-[[data-align=inline-start]]:h-full in-[[data-align=inline-start]]:min-h-0 in-[[data-align=inline-end]]:h-full in-[[data-align=inline-end]]:min-h-0',\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\nfunction isScalarContent(content: ReactNode): content is string | number | bigint {\n\treturn typeof content === 'string' || typeof content === 'number' || typeof content === 'bigint';\n}\n\n/** Static copy segment — scalar text renders through Typography. */\nfunction InputGroupText({ children, className, ...props }: InputGroupTextProps) {\n\treturn (\n\t\t<InputGroupTextPrimitive\n\t\t\tclassName={cn('input-group-text--component gap-space-md [&_svg:not([class*=\\'size-\\'])]:size-icon', className)}\n\t\t\t{...props}\n\t\t>\n\t\t\t{isScalarContent(children) ? (\n\t\t\t\t<Text tag=\"span\" size=\"inherit\" lineHeight=\"tight\" className=\"text-inherit\">\n\t\t\t\t\t{children}\n\t\t\t\t</Text>\n\t\t\t) : (\n\t\t\t\tchildren\n\t\t\t)}\n\t\t</InputGroupTextPrimitive>\n\t);\n}\n\n/** Single-line control that inherits the group's frame instead of its own. */\nfunction InputGroupInput({ className, ...props }: InputGroupInputProps) {\n\tconst size = useInputGroupScale();\n\treturn (\n\t\t<InputGroupInputPrimitive\n\t\t\tclassName={cn(\n\t\t\t\t// Inline frames grow for their shared editable line and clamp the\n\t\t\t\t// borderless input to the resulting content box.\n\t\t\t\t// Auto-height block compositions retain the shared control height.\n\t\t\t\t'input-group-input--component box-border max-h-full font-sans text-foreground',\n\t\t\t\tformControlHeightClasses[size],\n\t\t\t\t// The group owns the border; its native editor needs only its line.\n\t\t\t\t'min-h-lh',\n\t\t\t\tformControlPaddingClasses[size],\n\t\t\t\teditableTextSizeClasses[size],\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\n/** Multi-line control that inherits the group's frame instead of its own. */\nfunction InputGroupTextarea({ className, ...props }: InputGroupTextareaProps) {\n\tconst size = useInputGroupScale();\n\treturn (\n\t\t<InputGroupTextareaPrimitive\n\t\t\tclassName={cn(\n\t\t\t\t'input-group-textarea--component box-border py-space-md',\n\t\t\t\tformTextareaSizeClasses[size],\n\t\t\t\tformControlHorizontalPaddingClasses[size],\n\t\t\t\teditableTextSizeClasses[size],\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\nexport {\n\tInputGroup,\n\tInputGroupAddon,\n\tInputGroupButton,\n\tInputGroupInput,\n\tInputGroupText,\n\tInputGroupTextarea,\n};\n","import { Eye, EyeOff } from 'lucide-react';\nimport * as React from 'react';\n\nimport { useStrings, type StringsProp } from '../../../lib/strings';\nimport { cn } from '../../../lib/utils';\nimport { useControllableState } from '../../../lib/use-controllable-state';\n\nimport { Input, type InputProps } from './input';\nimport { InputTrailingActionContext } from './input-trailing-action';\nimport { fieldAffordanceRecipes } from '../../../lib/field-affordance-recipes';\n\nexport interface PasswordInputStrings {\n\tshowPassword: string;\n\thidePassword: string;\n}\n\nexport const defaultPasswordInputStrings: PasswordInputStrings = {\n\tshowPassword: 'Show password',\n\thidePassword: 'Hide password',\n};\n\nexport interface PasswordInputProps extends Omit<InputProps, 'type' | 'endIcon' | 'strings'> {\n\t/** Whether the value is revealed. Controlled. */\n\tvisible?: boolean;\n\t/** Whether the value starts revealed, for uncontrolled use. */\n\tdefaultVisible?: boolean;\n\t/** Fired whenever the reveal state changes. */\n\tonVisibleChange?: (visible: boolean) => void;\n\t/** Shows the reveal toggle. Turn it off for fields that must stay masked. */\n\trevealable?: boolean;\n\t/** Merged onto the field wrapper, outside the input frame. */\n\twrapperClassName?: string;\n\t/** Merged onto the reveal toggle. */\n\tvisibilityButtonClassName?: string;\n\t/** Copy overrides forwarded to the underlying text input. */\n\tinputStrings?: InputProps['strings'];\n\t/** Overrides the show/hide accessible names. */\n\tstrings?: StringsProp<PasswordInputStrings>;\n}\n\nconst PasswordInput = React.forwardRef<HTMLInputElement, PasswordInputProps>(\n\tfunction PasswordInput(\n\t\t{\n\t\t\tvisible,\n\t\t\tdefaultVisible = false,\n\t\t\tonVisibleChange,\n\t\t\trevealable = true,\n\t\t\twrapperClassName,\n\t\t\tvisibilityButtonClassName,\n\t\t\tclassName,\n\t\t\tdisabled,\n\t\t\tloading,\n\t\t\tinputStrings,\n\t\t\tstrings: stringsProp,\n\t\t\t...props\n\t\t},\n\t\tref,\n\t) {\n\t\tconst strings = useStrings(defaultPasswordInputStrings, stringsProp);\n\t\tconst [isVisible, setVisible] = useControllableState({ value: visible, defaultValue: defaultVisible, onChange: onVisibleChange });\n\t\tconst disabledState = disabled || loading;\n\n\t\tconst toggleVisibility = React.useCallback(() => {\n\t\t\tsetVisible(!isVisible);\n\t\t}, [isVisible, setVisible]);\n\n\t\tconst visibilityAction = revealable ? (\n\t\t\t<button\n\t\t\t\ttype=\"button\"\n\t\t\t\tclassName={cn('password-input--toggle', fieldAffordanceRecipes.target, fieldAffordanceRecipes.focus, fieldAffordanceRecipes.toggle, visibilityButtonClassName)}\n\t\t\t\taria-label={isVisible ? strings.hidePassword : strings.showPassword}\n\t\t\t\taria-pressed={isVisible}\n\t\t\t\tdisabled={disabledState}\n\t\t\t\tonMouseDown={(event) => event.preventDefault()}\n\t\t\t\tonClick={toggleVisibility}\n\t\t\t>\n\t\t\t\t{isVisible ? <EyeOff className={fieldAffordanceRecipes.icon} aria-hidden=\"true\" /> : <Eye className={fieldAffordanceRecipes.icon} aria-hidden=\"true\" />}\n\t\t\t</button>\n\t\t) : null;\n\n\t\treturn (\n\t\t\t<div className={cn('password-input--component', 'relative', wrapperClassName)}>\n\t\t\t\t<InputTrailingActionContext.Provider value={visibilityAction}>\n\t\t\t\t\t<Input\n\t\t\t\t\t\t{...props}\n\t\t\t\t\t\tref={ref}\n\t\t\t\t\t\ttype={isVisible ? 'text' : 'password'}\n\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t\tloading={loading}\n\t\t\t\t\t\tclassName={className}\n\t\t\t\t\t\tstrings={inputStrings}\n\t\t\t\t\t/>\n\t\t\t\t</InputTrailingActionContext.Provider>\n\t\t\t</div>\n\t\t);\n\t},\n);\n\nPasswordInput.displayName = 'PasswordInput';\n\nexport { PasswordInput };\n","import * as React from 'react';\n\nimport { cn } from '../../../lib/utils';\n\nimport { Input, type InputProps } from './input';\n\nexport interface SlugifyValueOptions {\n\t/** Character joining words in the generated slug. Default: `-`. */\n\tseparator?: string;\n\t/** Lowercases the generated slug. */\n\tlowercase?: boolean;\n\t/** Strips leading and trailing separators. */\n\ttrim?: boolean;\n}\n\nexport function slugifyValue(\n\tvalue: string | number | null | undefined,\n\t{\n\t\tseparator = '-',\n\t\tlowercase = true,\n\t\ttrim = true,\n\t}: SlugifyValueOptions = {},\n) {\n\tconst safeSeparator = separator || '-';\n\tconst escapedSeparator = safeSeparator.replace(/[.*+?^${}()|[\\]\\\\]/g, '\\\\$&');\n\tlet normalized = String(value ?? '')\n\t\t.normalize('NFKD')\n\t\t.replace(/[\\u0300-\\u036f]/g, '')\n\t\t.replace(/&/g, ' and ')\n\t\t.replace(/['’]/g, '');\n\n\tif (lowercase) {\n\t\tnormalized = normalized.toLowerCase();\n\t}\n\n\tnormalized = normalized\n\t\t.replace(/[^\\p{Letter}\\p{Number}]+/gu, safeSeparator)\n\t\t.replace(new RegExp(`${escapedSeparator}{2,}`, 'g'), safeSeparator);\n\n\tif (trim) {\n\t\tnormalized = normalized.replace(new RegExp(`^${escapedSeparator}|${escapedSeparator}$`, 'g'), '');\n\t}\n\n\treturn normalized;\n}\n\nexport interface SlugFieldProps\n\textends Omit<\n\t\tInputProps,\n\t\t'value' | 'defaultValue' | 'onChange' | 'readOnly' | 'type'\n\t>,\n\t\tSlugifyValueOptions {\n\t/** Current slug. Controlled. */\n\tvalue: string | number | null | undefined;\n\t/** Replaces the built-in slug derivation entirely. */\n\tslugify?: (value: string | number | null | undefined) => string;\n\t/** Merged onto the field wrapper, outside the input frame. */\n\twrapperClassName?: string;\n}\n\nconst SlugField = React.forwardRef<HTMLInputElement, SlugFieldProps>(\n\tfunction SlugField(\n\t\t{\n\t\t\tvalue,\n\t\t\tslugify,\n\t\t\tseparator = '-',\n\t\t\tlowercase = true,\n\t\t\ttrim = true,\n\t\t\twrapperClassName,\n\t\t\tclassName,\n\t\t\t...props\n\t\t},\n\t\tref,\n\t) {\n\t\tconst slug = React.useMemo(\n\t\t\t() => slugify?.(value) ?? slugifyValue(value, { separator, lowercase, trim }),\n\t\t\t[lowercase, separator, slugify, trim, value],\n\t\t);\n\n\t\treturn (\n\t\t\t<div className={cn('slug-field--component', wrapperClassName)}>\n\t\t\t\t<Input\n\t\t\t\t\tref={ref}\n\t\t\t\t\t{...props}\n\t\t\t\t\ttype=\"text\"\n\t\t\t\t\tvalue={slug}\n\t\t\t\t\treadOnly\n\t\t\t\t\tclassName={className}\n\t\t\t\t/>\n\t\t\t</div>\n\t\t);\n\t},\n);\n\nSlugField.displayName = 'SlugField';\n\nexport { SlugField };\n"],"mappings":"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"}

package/dist/theme.css

@@ -14,6 +14,9 @@
 	--color-sidebar-primary: var(--sidebar-primary);
 	--color-sidebar-foreground: var(--sidebar-foreground);
 	--color-sidebar: var(--sidebar);
+	--color-chart-8: var(--chart-8);
+	--color-chart-7: var(--chart-7);
+	--color-chart-6: var(--chart-6);
 	--color-chart-5: var(--chart-5);
 	--color-chart-4: var(--chart-4);
 	--color-chart-3: var(--chart-3);
@@ -99,11 +102,21 @@
 		--chart-3: oklch(0.56 0.17 285); /* Third categorical chart-series color; never a status color. */
 		--chart-4: oklch(0.58 0.16 330); /* Fourth categorical chart-series color; never a status color. */
 		--chart-5: oklch(0.60 0.14 60); /* Fifth categorical chart-series color; never a status color. */
+		/*
+		 * Series 6 to 8 complete the named categorical set (red, yellow, green).
+		 * Red and green necessarily sit near the destructive and success hues, so
+		 * they are for categories only: a chart or calendar that encodes state
+		 * still uses the status tokens. Yellow is light by nature; on a light
+		 * surface use it for fills and markers, not for text.
+		 */
+		--chart-6: oklch(0.55 0.19 20); /* Sixth categorical chart-series color (red); never a status color. */
+		--chart-7: oklch(0.74 0.15 95); /* Seventh categorical chart-series color (yellow); never a status color. */
+		--chart-8: oklch(0.62 0.15 130); /* Eighth categorical chart-series color (green); never a status color. */
 		--sidebar: oklch(0.96 0 0); /* Sidebar shell background. */
 		--sidebar-foreground: oklch(0.28 0 0); /* Primary sidebar text and icon color. */
 		--sidebar-primary: var(--primary); /* Strong sidebar selection or primary action fill; follows the brand in both modes. */
 		--sidebar-primary-foreground: var(--primary-foreground); /* Text and icons on sidebar primary fills. */
-		--sidebar-accent: oklch(0.98 0 0 / 1); /* Sidebar hover and selected-row neutral fill. */
+		--sidebar-accent: oklch(0.92 0 0 / 1); /* Sidebar hover and selected-row neutral fill: one step deeper than the sidebar, like --accent on --card, so the current entry is visible. */
 		--sidebar-accent-foreground: oklch(0.205 0 0); /* Text and icons on sidebar accent fills. */
 		--sidebar-border: oklch(0.922 0 0); /* Sidebar dividers and shell border. */
 		--sidebar-ring: oklch(0.60 0 0); /* Focus-visible ring inside the sidebar. */
@@ -145,6 +158,9 @@
 		--chart-3: oklch(0.72 0.15 285);
 		--chart-4: oklch(0.74 0.15 330);
 		--chart-5: oklch(0.78 0.14 60);
+		--chart-6: oklch(0.70 0.17 20);
+		--chart-7: oklch(0.88 0.15 95);
+		--chart-8: oklch(0.80 0.17 130);
 		--sidebar: oklch(0.175 0 0);
 		--sidebar-foreground: oklch(0.985 0 0);
 		--sidebar-primary: var(--primary);
@@ -244,7 +260,7 @@
 		 * Override individual --text-* tokens for precise theme sizing. Line-height
 		 * tokens intentionally match Tailwind's unitless default ratios.
 		 */
-		--text-xxs: 0.75rem; /* Micro-label role kept at the accessible 12px floor. */
+		--text-xxs: 0.75rem; /* Micro-label role kept at the accessible 12px floor. It is a separate role that equals --text-xs by default; a theme that changes --text-xs sets this one too. */
 		--text-xxs--line-height: calc(1 / 0.75); /* Unitless line height paired with the micro-label role. */
 		--text-xs: 0.75rem; /* Compact metadata, hints, and secondary row descriptions. */
 		--text-xs--line-height: calc(1 / 0.75); /* Unitless line height paired with compact metadata. */
@@ -424,9 +440,9 @@
 
 @layer theme {
 	:root {
-		--height-action: 2rem; /* Default button and action-trigger height. */
-		--height-control: 2rem; /* Default input, select, and field-control height. */
-		--control-x: 0.75rem; /* Default inline padding for buttons and field controls. */
+		--height-action: 2.125rem; /* Default button and action-trigger height. */
+		--height-control: 2.125rem; /* Default input, select, and field-control height. */
+		--control-x: 0.875rem; /* Default inline padding for buttons and field controls. */
 
 		/* Media */
 		--icon: 1rem; /* Default interface icon size. */