themelia-ui 3.0.0 → 3.2.0

package/dist/text-inputs-BboE77nZ.js

@@ -0,0 +1,395 @@
+import "#core.css";
+import { c as e } from "./typography-DmeR05Er.js";
+import { t } from "./cx--CBrhWH0.js";
+import { ChevronDownIcon as n, CircleXIcon as r, EyeIcon as i, EyeOffIcon as a, Loader2Icon as o, SearchIcon as s } from "lucide-react";
+import * as c from "react";
+import { useCallback as l, useId as u, useMemo as d, useState as f } from "react";
+import { jsx as p, jsxs as m } from "react/jsx-runtime";
+import "#css/text-inputs.css";
+//#region src/components/base/text-inputs/input.strings.ts
+var h = {
+	clear: "Clear input",
+	characterCount: (e, t) => `${e} of ${t} characters`
+}, g = {
+	...h,
+	clear: "Clear search"
+}, _ = {
+	textarea: "text-inputs__textarea___bzqKy",
+	textareaFrame: "text-inputs__textareaFrame___4VXbv",
+	affordance: "text-inputs__affordance___W4UeX",
+	affordanceTextareaEnd: "text-inputs__affordanceTextareaEnd___PciWh",
+	addon: "text-inputs__addon___91UZA",
+	revealButton: "text-inputs__revealButton___85A9f",
+	selectFrame: "text-inputs__selectFrame____HFj1",
+	select: "text-inputs__select___r5Ors",
+	selectChevron: "text-inputs__selectChevron___lhayj",
+	search: "text-inputs__search___IKkd-",
+	frame: "text-inputs__frame___T8iew",
+	affordanceStart: "text-inputs__affordanceStart___vT_Ak",
+	affordanceEnd: "text-inputs__affordanceEnd___-eqXP",
+	affordanceText: "text-inputs__affordanceText___eJ6Nv",
+	clear: "text-inputs__clear___uRgV6",
+	spinner: "text-inputs__spinner___14Abc",
+	count: "text-inputs__count___al9Xc"
+};
+//#endregion
+//#region src/components/base/text-inputs/use-field-value.ts
+function v({ controlledValue: e, defaultValue: t, maxLength: n, showCharacterCount: r, providedId: i, idPrefix: a = "field" }) {
+	let o = u(), s = i ?? `${a}-${o}`, c = e !== void 0, [p, m] = f(String(t ?? "")), h = c ? String(e ?? "") : p, g = typeof n == "number" && n > 0, _ = h.length, v = l((e) => g && e.length > n, [g, n]), y = l((e) => !v(e) && (c || m(e), !0), [c, v]), b = l(() => {
+		c || m("");
+	}, [c]);
+	return d(() => ({
+		id: s,
+		value: h,
+		isControlled: c,
+		characterCount: _,
+		hasCharacterLimit: g,
+		showCount: !!r && g,
+		hasValue: h.length > 0,
+		updateValue: y,
+		clearValue: b,
+		wouldExceedLimit: v
+	}), [
+		s,
+		h,
+		c,
+		_,
+		g,
+		r,
+		y,
+		b,
+		v
+	]);
+}
+//#endregion
+//#region src/components/base/text-inputs/input.tsx
+function y(e) {
+	return e ? c.isValidElement(e) ? e : typeof e == "function" || typeof e == "object" && e && "$$typeof" in e ? /* @__PURE__ */ p(e, { "aria-hidden": !0 }) : e : null;
+}
+function b(e, t, n) {
+	return e && `${typeof t == "string" ? t : ""}${e}${typeof n == "string" ? n : ""}`;
+}
+var x = c.forwardRef(function({ className: n, type: i = "text", startIcon: a, endIcon: s, startAddon: l, endAddon: u, maxLength: d, showCharacterCount: f, clearable: g, onClear: x, loading: S = !1, invalid: C, returnValueWithAddons: w = !1, strings: T, value: E, defaultValue: D, onChange: O, id: k, ...A }, j) {
+	let M = {
+		...h,
+		...T
+	}, N = c.useRef(null), P = c.useCallback((e) => {
+		N.current = e, typeof j == "function" ? j(e) : j && (j.current = e);
+	}, [j]), F = v({
+		controlledValue: E,
+		defaultValue: D,
+		maxLength: d,
+		showCharacterCount: f,
+		providedId: k,
+		idPrefix: "input"
+	}), I = (e) => {
+		let t = e.target.value;
+		if (!F.updateValue(t) || !O) return;
+		if (!w) {
+			O(e);
+			return;
+		}
+		let n = b(t, l, u);
+		O({
+			...e,
+			target: {
+				...e.target,
+				value: n
+			},
+			currentTarget: {
+				...e.currentTarget,
+				value: n
+			}
+		});
+	}, L = () => {
+		if (A.disabled || A.readOnly) return;
+		F.clearValue();
+		let e = N.current;
+		e && ((Object.getOwnPropertyDescriptor(window.HTMLInputElement.prototype, "value")?.set)?.call(e, ""), O?.({
+			target: e,
+			currentTarget: e,
+			type: "change"
+		})), x?.(), N.current?.focus();
+	}, R = !!g && F.hasValue && !S, z = S ? "loading" : R ? "clear" : F.showCount ? "count" : s ? "icon" : u ? "addon" : null, B = F.hasCharacterLimit && F.characterCount >= d;
+	return /* @__PURE__ */ m("span", {
+		"data-slot": "input-frame",
+		className: _.frame,
+		"data-start-icon": a ? "" : void 0,
+		"data-start-addon": l ? "" : void 0,
+		"data-end-icon": z === "icon" || z === "clear" || z === "loading" ? "" : void 0,
+		"data-end-addon": z === "addon" ? "" : void 0,
+		"data-count": z === "count" ? "" : void 0,
+		children: [
+			(a || l) && /* @__PURE__ */ m("span", {
+				className: t(_.affordance, _.affordanceStart),
+				children: [y(a), !!l && /* @__PURE__ */ p("span", {
+					className: _.affordanceText,
+					children: l
+				})]
+			}),
+			/* @__PURE__ */ p("input", {
+				...A,
+				ref: P,
+				id: F.id,
+				type: i,
+				"data-slot": "input",
+				"data-field-control": "",
+				"aria-invalid": C || A["aria-invalid"] || void 0,
+				maxLength: d,
+				value: E,
+				defaultValue: D,
+				onChange: I,
+				className: t("input--component", n)
+			}),
+			z !== null && /* @__PURE__ */ m("span", {
+				className: t(_.affordance, _.affordanceEnd),
+				children: [
+					z === "loading" && /* @__PURE__ */ p(o, {
+						"aria-hidden": !0,
+						className: _.spinner
+					}),
+					z === "clear" && /* @__PURE__ */ p("button", {
+						type: "button",
+						"data-hit-area": !0,
+						className: _.clear,
+						"aria-label": M.clear,
+						disabled: A.disabled || A.readOnly,
+						onClick: L,
+						children: /* @__PURE__ */ p(r, { "aria-hidden": !0 })
+					}),
+					z === "count" && /* @__PURE__ */ m("span", {
+						className: t(_.count, e({
+							size: "xs",
+							numeric: !0,
+							type: B ? "error" : "secondary"
+						})),
+						"aria-label": M.characterCount(F.characterCount, d),
+						children: [
+							F.characterCount,
+							" / ",
+							d
+						]
+					}),
+					z === "icon" && y(s),
+					z === "addon" && /* @__PURE__ */ p("span", {
+						className: _.affordanceText,
+						children: u
+					})
+				]
+			})
+		]
+	});
+}), S = c.forwardRef(function({ className: n, strings: i, maxLength: a, showCharacterCount: s, clearable: l, onClear: u, loading: d = !1, invalid: f, minRows: g, maxRows: y, value: b, defaultValue: x, onChange: S, id: C, rows: w, style: T, ...E }, D) {
+	let O = {
+		...h,
+		...i
+	}, k = c.useRef(null), A = g ?? w, j = v({
+		controlledValue: b,
+		defaultValue: x,
+		maxLength: a,
+		showCharacterCount: s,
+		providedId: C,
+		idPrefix: "textarea"
+	}), M = c.useCallback((e) => {
+		k.current = e, typeof D == "function" ? D(e) : D && (D.current = e);
+	}, [D]), N = () => {
+		if (E.disabled || E.readOnly) return;
+		let e = k.current;
+		e && ((Object.getOwnPropertyDescriptor(window.HTMLTextAreaElement.prototype, "value")?.set)?.call(e, ""), e.dispatchEvent(new Event("input", { bubbles: !0 })), e.focus()), j.clearValue(), u?.();
+	}, P = l && j.value.length > 0, F = d ? "loading" : P ? "clear" : j.showCount ? "count" : null, I = j.hasCharacterLimit && j.characterCount >= a;
+	return /* @__PURE__ */ m("span", {
+		"data-slot": "textarea-frame",
+		className: _.textareaFrame,
+		"data-field-shell": "",
+		"data-invalid": f ? "" : void 0,
+		"data-trailing": F ?? void 0,
+		children: [/* @__PURE__ */ p("textarea", {
+			...E,
+			ref: M,
+			id: j.id,
+			rows: w ?? g,
+			maxLength: a,
+			"aria-invalid": f || E["aria-invalid"] || void 0,
+			"data-slot": "textarea",
+			"data-field-control": "",
+			className: t("textarea--component", _.textarea, n),
+			style: {
+				...A ? { minHeight: `calc(${A}lh + var(--padding-sm) * 2 + var(--border-width) * 2)` } : null,
+				...y ? { maxHeight: `calc(${y}lh + var(--padding-sm) * 2 + var(--border-width) * 2)` } : null,
+				...T
+			},
+			value: b === void 0 ? void 0 : j.value,
+			defaultValue: b === void 0 ? x : void 0,
+			onChange: (e) => {
+				j.updateValue(e.target.value), S?.(e);
+			}
+		}), !!F && /* @__PURE__ */ m("span", {
+			className: t(_.affordance, _.affordanceTextareaEnd),
+			children: [
+				F === "loading" && /* @__PURE__ */ p(o, {
+					"aria-hidden": !0,
+					className: _.spinner
+				}),
+				F === "clear" && /* @__PURE__ */ p("button", {
+					type: "button",
+					"data-hit-area": !0,
+					className: _.clear,
+					"aria-label": O.clear,
+					disabled: E.disabled || E.readOnly,
+					onClick: N,
+					children: /* @__PURE__ */ p(r, { "aria-hidden": !0 })
+				}),
+				F === "count" && /* @__PURE__ */ m("span", {
+					className: t(_.count, e({
+						size: "xs",
+						numeric: !0,
+						type: I ? "error" : "secondary"
+					})),
+					"aria-label": O.characterCount(j.characterCount, a),
+					children: [
+						j.characterCount,
+						" / ",
+						a
+					]
+				})
+			]
+		})]
+	});
+});
+//#endregion
+//#region src/components/base/text-inputs/field-shell.tsx
+function C({ start: e, end: n, className: r, children: i, id: a, "aria-labelledby": o, "aria-invalid": s, "aria-describedby": l, "aria-required": u, ...d }) {
+	let f = typeof i == "function", h = {
+		id: a,
+		"aria-labelledby": o,
+		"aria-invalid": s,
+		"aria-describedby": l,
+		"aria-required": u
+	}, g = (e) => c.cloneElement(e, {
+		id: e.props.id ?? h.id,
+		"aria-labelledby": e.props["aria-labelledby"] ?? (e.props["aria-label"] === void 0 ? h["aria-labelledby"] : void 0),
+		"aria-invalid": e.props["aria-invalid"] ?? h["aria-invalid"],
+		"aria-describedby": e.props["aria-describedby"] ?? h["aria-describedby"],
+		"aria-required": e.props["aria-required"] ?? h["aria-required"]
+	}), v = f ? [] : c.Children.toArray(i), y = !f && c.isValidElement(i) ? -1 : v.findIndex((e) => c.isValidElement(e)), b = f ? i(h) : c.isValidElement(i) ? g(i) : y === -1 ? i : v.map((e, t) => t === y ? g(e) : e);
+	return /* @__PURE__ */ m("div", {
+		"data-slot": "field-shell",
+		"data-field-shell": "",
+		className: t("field-shell--component", r),
+		...d,
+		children: [
+			!!e && /* @__PURE__ */ p("span", {
+				className: _.addon,
+				children: e
+			}),
+			b,
+			!!n && /* @__PURE__ */ p("span", {
+				className: _.addon,
+				children: n
+			})
+		]
+	});
+}
+//#endregion
+//#region src/components/base/text-inputs/password-input.strings.ts
+var w = {
+	...h,
+	reveal: "Show password",
+	hide: "Hide password"
+}, T = c.forwardRef(function({ strings: e, className: n, ...r }, o) {
+	let s = {
+		...w,
+		...e
+	}, [l, u] = c.useState(!1);
+	return /* @__PURE__ */ p(C, {
+		className: t("password-input--component", n),
+		end: /* @__PURE__ */ p("button", {
+			type: "button",
+			className: _.revealButton,
+			"data-hit-area": !0,
+			"aria-label": l ? s.hide : s.reveal,
+			disabled: r.disabled,
+			onClick: () => u((e) => !e),
+			children: p(l ? a : i, {})
+		}),
+		children: /* @__PURE__ */ p(x, {
+			ref: o,
+			type: l ? "text" : "password",
+			strings: e,
+			...r
+		})
+	});
+}), E = c.forwardRef(function({ onClear: e, className: n, strings: r, ...i }, a) {
+	return /* @__PURE__ */ p(x, {
+		ref: a,
+		type: "search",
+		className: t("search-input--component", _.search, n),
+		startIcon: /* @__PURE__ */ p(s, { "aria-hidden": !0 }),
+		clearable: !0,
+		onClear: e,
+		strings: {
+			...g,
+			...r
+		},
+		...i
+	});
+}), D = c.forwardRef(function({ className: e, placeholder: r, children: i, ...a }, o) {
+	return /* @__PURE__ */ m("span", {
+		"data-slot": "native-select-frame",
+		className: _.selectFrame,
+		children: [/* @__PURE__ */ m("select", {
+			ref: o,
+			"data-slot": "native-select",
+			"data-field-control": "",
+			className: t("native-select--component", _.select, e),
+			...a,
+			children: [!!r && /* @__PURE__ */ p("option", {
+				value: "",
+				disabled: !0,
+				children: r
+			}), i]
+		}), /* @__PURE__ */ p(n, {
+			"aria-hidden": !0,
+			className: _.selectChevron
+		})]
+	});
+});
+//#endregion
+//#region src/components/base/text-inputs/slugify.ts
+function O(e, { separator: t = "-", lowercase: n = !0, trim: r = !0 } = {}) {
+	let i = t || "-", a = i.replace(/[.*+?^${}()|[\]\\]/g, "\\$&"), o = String(e ?? "").normalize("NFKD").replace(/[̀-ͯ]/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;
+}
+//#endregion
+//#region src/components/base/text-inputs/slug-field.tsx
+var k = c.forwardRef(function({ value: e, transform: n, separator: r = "-", lowercase: i = !0, trim: a = !0, prefix: o, className: s, ...l }, u) {
+	let d = c.useMemo(() => n?.(e) ?? O(e, {
+		separator: r,
+		lowercase: i,
+		trim: a
+	}), [
+		i,
+		r,
+		n,
+		a,
+		e
+	]), f = /* @__PURE__ */ p(x, {
+		ref: u,
+		...l,
+		type: "text",
+		value: d,
+		readOnly: !0,
+		className: t(!o && "slug-field--component", s)
+	});
+	return o ? /* @__PURE__ */ m("div", {
+		"data-field-shell": "",
+		className: "slug-field--component",
+		children: [/* @__PURE__ */ p("span", {
+			"data-slot": "slug-field-prefix",
+			className: _.affordanceText,
+			children: o
+		}), f]
+	}) : f;
+});
+//#endregion
+export { T as a, S as c, h as d, g as f, E as i, x as l, O as n, w as o, D as r, C as s, k as t, v as u };

package/dist/theming-C5ygF5uf.js

@@ -0,0 +1,292 @@
+import { wcagContrast as e } from "culori";
+//#region src/lib/theming/contrast.ts
+var t = "oklch(0.18 0.01 260)", n = "oklch(0.985 0 0)";
+function r(e, r = "light", a = [t, n]) {
+	let o = a.map((t) => {
+		let n = i(t, e);
+		return n === null ? null : {
+			color: t,
+			ratio: n
+		};
+	}).filter((e) => e !== null);
+	if (o.length === 0) return {
+		color: r === "dark" ? t : n,
+		ratio: 0,
+		meetsAA: !1,
+		measured: !1
+	};
+	let s = o.reduce((e, t) => t.ratio > e.ratio ? t : e);
+	return {
+		color: s.color,
+		ratio: Number(s.ratio.toFixed(2)),
+		meetsAA: s.ratio >= 4.5,
+		measured: !0
+	};
+}
+function i(t, n) {
+	try {
+		let r = e(t, n);
+		return Number.isFinite(r) ? r : null;
+	} catch {
+		return null;
+	}
+}
+//#endregion
+//#region src/lib/theming/recipes.ts
+function a(e, t, n) {
+	return Math.min(n, Math.max(t, e));
+}
+function o(e, t) {
+	return r(e, t).color;
+}
+function s({ primary: e, mode: t = "light" }) {
+	return {
+		"--primary": e,
+		"--primary-foreground": o(e, t),
+		"--secondary": "color-mix(in oklch, var(--primary) 10%, var(--background))",
+		"--secondary-foreground": "var(--foreground)",
+		"--muted": "color-mix(in oklch, var(--primary) 7%, var(--background))",
+		"--muted-foreground": "color-mix(in oklch, var(--foreground) 62%, var(--background))",
+		"--accent": "color-mix(in oklch, var(--primary) 14%, var(--background))",
+		"--accent-foreground": "var(--foreground)",
+		"--border": "color-mix(in oklch, var(--primary) 14%, var(--background))",
+		"--input": "color-mix(in oklch, var(--primary) 18%, var(--background))",
+		"--ring": "var(--primary)",
+		"--link": "var(--primary)",
+		"--chart-1": "var(--primary)",
+		"--chart-2": "color-mix(in oklch, var(--primary) 68%, var(--info))",
+		"--chart-3": "color-mix(in oklch, var(--primary) 60%, var(--success))",
+		"--chart-4": "color-mix(in oklch, var(--primary) 58%, var(--warning))",
+		"--chart-5": "color-mix(in oklch, var(--primary) 52%, var(--destructive))",
+		"--sidebar-accent": "var(--accent)",
+		"--sidebar-accent-foreground": "var(--accent-foreground)",
+		"--sidebar-border": "var(--border)",
+		"--sidebar-ring": "var(--ring)"
+	};
+}
+var c = {
+	xs: .75,
+	pxs: .8125,
+	sm: .875,
+	base: 1
+}, l = [
+	"lg",
+	"xl",
+	"2xl"
+];
+function u({ baseSize: e, ratio: t = 1.2 }) {
+	let n = a(e, 14, 20), r = a(t, 1.125, 1.333), i = {};
+	for (let [e, t] of Object.entries(c)) {
+		let r = Math.max(12, n * t);
+		i[`--text-${e}`] = `${Number((r / 16).toFixed(4))}rem`;
+	}
+	return l.forEach((e, t) => {
+		let a = n * r ** (t + 1);
+		i[`--text-${e}`] = `${Number((a / 16).toFixed(4))}rem`;
+	}), i;
+}
+function d({ intensity: e }) {
+	let t = a(e, 0, 1), n = (e) => `oklch(0 0 0 / ${Number((t / .8 * e).toFixed(2))}%)`;
+	return {
+		"--shadow": `0 1px 2px 0 ${n(6)}, 0 1px 1px -1px ${n(6)}`,
+		"--shadow-lg": `0 4px 8px -2px ${n(10)}, 0 12px 24px -12px ${n(18)}`
+	};
+}
+//#endregion
+//#region src/lib/theming/themes/pair.ts
+var f = (e, t) => `light-dark(${e}, ${t})`, p = "0 0 transparent", m = {
+	label: "Dense",
+	description: "Compact spacing and small corners for screens full of data.",
+	config: {
+		density: "compact",
+		motion: { durations: {
+			fast: "100ms",
+			normal: "140ms"
+		} },
+		defaults: { card: {
+			surface: "card",
+			headerDivider: !0
+		} },
+		theme: {
+			radius: "0.625rem",
+			radiusSm: "0.3125rem",
+			vars: { shadow: "0 1px 1px oklch(0 0 0 / 5%)" },
+			colors: {
+				background: f("oklch(0.99 0.005 245)", "oklch(0.195 0.018 255)"),
+				foreground: f("oklch(0.27 0.03 250)", "oklch(0.965 0.008 245)"),
+				card: f("oklch(1 0 0)", "oklch(0.235 0.022 255)"),
+				"card-foreground": f("oklch(0.27 0.03 250)", "oklch(0.965 0.008 245)"),
+				popover: f("oklch(1 0 0)", "oklch(0.265 0.024 255)"),
+				"popover-foreground": f("oklch(0.27 0.03 250)", "oklch(0.965 0.008 245)"),
+				muted: f("oklch(0.965 0.012 245)", "oklch(0.22 0.02 255)"),
+				"muted-foreground": f("oklch(0.48 0.035 250)", "oklch(0.72 0.03 248)"),
+				accent: f("oklch(0.955 0.02 245)", "oklch(0.31 0.035 255)"),
+				"accent-foreground": f("oklch(0.24 0.04 250)", "oklch(0.975 0.006 245)"),
+				border: f("oklch(0.915 0.016 245)", "oklch(0.85 0.04 250 / 13%)"),
+				input: f("oklch(0.72 0.03 248)", "oklch(0.85 0.04 250 / 30%)"),
+				ring: f("oklch(0.55 0.14 252)", "oklch(0.66 0.12 252)"),
+				primary: f("oklch(0.48 0.16 255)", "oklch(0.72 0.13 250)"),
+				"primary-foreground": f("oklch(0.985 0 0)", "oklch(0.18 0.04 255)"),
+				secondary: f("oklch(0.96 0.015 245)", "oklch(0.25 0.025 255)"),
+				"secondary-foreground": f("oklch(0.24 0.04 250)", "oklch(0.965 0.008 245)"),
+				link: f("oklch(0.47 0.17 258)", "oklch(0.74 0.12 250)"),
+				"chart-1": f("oklch(0.55 0.15 252)", "oklch(0.72 0.13 250)"),
+				sidebar: f("oklch(0.965 0.01 245)", "oklch(0.16 0.018 255)"),
+				"sidebar-foreground": f("oklch(0.27 0.03 250)", "oklch(0.965 0.008 245)"),
+				"sidebar-accent": f("oklch(0.985 0.006 245)", "oklch(0.27 0.03 255)"),
+				"sidebar-accent-foreground": f("oklch(0.24 0.04 250)", "oklch(0.975 0.006 245)"),
+				"sidebar-border": f("oklch(0.915 0.016 245)", "oklch(0.85 0.04 250 / 13%)"),
+				"sidebar-ring": f("oklch(0.55 0.14 252)", "oklch(0.66 0.12 252)")
+			}
+		}
+	}
+}, h = {
+	label: "Editorial",
+	description: "Serif headings on warm paper, set for reading.",
+	config: {
+		density: "comfortable",
+		typography: {
+			scale: 1.0625,
+			fonts: { heading: "'Iowan Old Style', 'Palatino Linotype', Palatino, Georgia, ui-serif, serif" }
+		},
+		defaults: { card: {
+			surface: "bordered",
+			headerDivider: !0
+		} },
+		theme: {
+			radius: "0.75rem",
+			radiusSm: "0.375rem",
+			vars: { shadow: p },
+			colors: {
+				background: f("oklch(0.985 0.008 85)", "oklch(0.2 0.01 60)"),
+				foreground: f("oklch(0.28 0.02 60)", "oklch(0.96 0.01 85)"),
+				card: f("oklch(0.995 0.005 85)", "oklch(0.24 0.012 60)"),
+				"card-foreground": f("oklch(0.28 0.02 60)", "oklch(0.96 0.01 85)"),
+				popover: f("oklch(0.995 0.005 85)", "oklch(0.27 0.013 60)"),
+				"popover-foreground": f("oklch(0.28 0.02 60)", "oklch(0.96 0.01 85)"),
+				muted: f("oklch(0.955 0.014 80)", "oklch(0.225 0.011 60)"),
+				"muted-foreground": f("oklch(0.48 0.028 60)", "oklch(0.73 0.02 75)"),
+				accent: f("oklch(0.945 0.02 75)", "oklch(0.32 0.018 60)"),
+				"accent-foreground": f("oklch(0.25 0.025 55)", "oklch(0.97 0.008 85)"),
+				border: f("oklch(0.905 0.02 78)", "oklch(0.9 0.03 75 / 12%)"),
+				input: f("oklch(0.71 0.03 65)", "oklch(0.9 0.03 75 / 28%)"),
+				ring: f("oklch(0.55 0.12 45)", "oklch(0.66 0.11 50)"),
+				primary: f("oklch(0.47 0.14 40)", "oklch(0.72 0.12 50)"),
+				"primary-foreground": f("oklch(0.985 0.005 85)", "oklch(0.2 0.04 40)"),
+				secondary: f("oklch(0.95 0.016 78)", "oklch(0.25 0.012 60)"),
+				"secondary-foreground": f("oklch(0.25 0.025 55)", "oklch(0.96 0.01 85)"),
+				link: f("oklch(0.47 0.14 40)", "oklch(0.75 0.11 55)"),
+				"chart-1": f("oklch(0.55 0.13 45)", "oklch(0.72 0.12 50)"),
+				sidebar: f("oklch(0.96 0.012 80)", "oklch(0.17 0.01 60)"),
+				"sidebar-foreground": f("oklch(0.28 0.02 60)", "oklch(0.96 0.01 85)"),
+				"sidebar-accent": f("oklch(0.98 0.008 85)", "oklch(0.28 0.016 60)"),
+				"sidebar-accent-foreground": f("oklch(0.25 0.025 55)", "oklch(0.97 0.008 85)"),
+				"sidebar-border": f("oklch(0.905 0.02 78)", "oklch(0.9 0.03 75 / 12%)"),
+				"sidebar-ring": f("oklch(0.55 0.12 45)", "oklch(0.66 0.11 50)")
+			}
+		}
+	}
+}, g = {
+	label: "Sharp",
+	description: "Square corners, hairlines and no shadows: an interface drawn in ink.",
+	config: {
+		motion: { durations: {
+			fast: "90ms",
+			normal: "120ms"
+		} },
+		defaults: {
+			card: {
+				surface: "card",
+				headerDivider: !0
+			},
+			accordion: { surface: "flat" }
+		},
+		theme: {
+			radius: "0px",
+			radiusSm: "0px",
+			vars: {
+				shadow: p,
+				"shadow-lg": p
+			},
+			colors: {
+				background: f("oklch(1 0 0)", "oklch(0.17 0 0)"),
+				foreground: f("oklch(0.21 0 0)", "oklch(0.97 0 0)"),
+				card: f("oklch(1 0 0)", "oklch(0.21 0 0)"),
+				"card-foreground": f("oklch(0.21 0 0)", "oklch(0.97 0 0)"),
+				popover: f("oklch(1 0 0)", "oklch(0.24 0 0)"),
+				"popover-foreground": f("oklch(0.21 0 0)", "oklch(0.97 0 0)"),
+				muted: f("oklch(0.965 0 0)", "oklch(0.2 0 0)"),
+				"muted-foreground": f("oklch(0.47 0 0)", "oklch(0.72 0 0)"),
+				accent: f("oklch(0.955 0 0)", "oklch(0.3 0 0)"),
+				"accent-foreground": f("oklch(0.2 0 0)", "oklch(0.98 0 0)"),
+				border: f("oklch(0.905 0 0)", "oklch(1 0 0 / 12%)"),
+				input: f("oklch(0.7 0 0)", "oklch(1 0 0 / 30%)"),
+				ring: f("oklch(0.4 0 0)", "oklch(0.75 0 0)"),
+				primary: f("oklch(0.24 0 0)", "oklch(0.94 0 0)"),
+				"primary-foreground": f("oklch(0.985 0 0)", "oklch(0.2 0 0)"),
+				secondary: f("oklch(0.955 0 0)", "oklch(0.24 0 0)"),
+				"secondary-foreground": f("oklch(0.2 0 0)", "oklch(0.97 0 0)"),
+				"chart-1": f("oklch(0.45 0.02 260)", "oklch(0.78 0.02 260)"),
+				sidebar: f("oklch(0.96 0 0)", "oklch(0.14 0 0)"),
+				"sidebar-foreground": f("oklch(0.21 0 0)", "oklch(0.97 0 0)"),
+				"sidebar-accent": f("oklch(0.985 0 0)", "oklch(0.26 0 0)"),
+				"sidebar-accent-foreground": f("oklch(0.2 0 0)", "oklch(0.98 0 0)"),
+				"sidebar-border": f("oklch(0.905 0 0)", "oklch(1 0 0 / 12%)"),
+				"sidebar-ring": f("oklch(0.4 0 0)", "oklch(0.75 0 0)")
+			}
+		}
+	}
+}, _ = {
+	soft: {
+		label: "Soft",
+		description: "Rounded corners, diffuse shadows and room to breathe.",
+		config: {
+			density: "comfortable",
+			motion: { durations: {
+				fast: "180ms",
+				normal: "260ms"
+			} },
+			defaults: { card: { surface: "framed" } },
+			theme: {
+				radius: "1.5rem",
+				radiusSm: "0.75rem",
+				vars: {
+					shadow: "0 1px 2px oklch(0 0 0 / 4%), 0 6px 16px -6px oklch(0 0 0 / 10%)",
+					"shadow-lg": "0 10px 24px -8px oklch(0 0 0 / 14%), 0 28px 56px -20px oklch(0 0 0 / 20%)"
+				},
+				colors: {
+					background: f("oklch(0.99 0.005 320)", "oklch(0.195 0.022 310)"),
+					foreground: f("oklch(0.27 0.035 310)", "oklch(0.965 0.01 320)"),
+					card: f("oklch(1 0 0)", "oklch(0.235 0.026 310)"),
+					"card-foreground": f("oklch(0.27 0.035 310)", "oklch(0.965 0.01 320)"),
+					popover: f("oklch(1 0 0)", "oklch(0.265 0.028 310)"),
+					"popover-foreground": f("oklch(0.27 0.035 310)", "oklch(0.965 0.01 320)"),
+					muted: f("oklch(0.965 0.013 320)", "oklch(0.22 0.024 310)"),
+					"muted-foreground": f("oklch(0.48 0.04 312)", "oklch(0.73 0.035 315)"),
+					accent: f("oklch(0.955 0.022 318)", "oklch(0.31 0.04 310)"),
+					"accent-foreground": f("oklch(0.24 0.045 310)", "oklch(0.975 0.008 320)"),
+					border: f("oklch(0.915 0.018 318)", "oklch(0.85 0.05 315 / 13%)"),
+					input: f("oklch(0.72 0.035 314)", "oklch(0.85 0.05 315 / 30%)"),
+					ring: f("oklch(0.55 0.16 305)", "oklch(0.68 0.14 305)"),
+					primary: f("oklch(0.49 0.19 303)", "oklch(0.74 0.14 305)"),
+					"primary-foreground": f("oklch(0.985 0 0)", "oklch(0.18 0.05 305)"),
+					secondary: f("oklch(0.96 0.016 318)", "oklch(0.25 0.03 310)"),
+					"secondary-foreground": f("oklch(0.24 0.045 310)", "oklch(0.965 0.01 320)"),
+					link: f("oklch(0.48 0.19 300)", "oklch(0.76 0.13 305)"),
+					"chart-1": f("oklch(0.55 0.17 305)", "oklch(0.74 0.14 305)"),
+					sidebar: f("oklch(0.965 0.012 320)", "oklch(0.16 0.022 310)"),
+					"sidebar-foreground": f("oklch(0.27 0.035 310)", "oklch(0.965 0.01 320)"),
+					"sidebar-accent": f("oklch(0.985 0.006 320)", "oklch(0.27 0.035 310)"),
+					"sidebar-accent-foreground": f("oklch(0.24 0.045 310)", "oklch(0.975 0.008 320)"),
+					"sidebar-border": f("oklch(0.915 0.018 318)", "oklch(0.85 0.05 315 / 13%)"),
+					"sidebar-ring": f("oklch(0.55 0.16 305)", "oklch(0.68 0.14 305)")
+				}
+			}
+		}
+	},
+	sharp: g,
+	dense: m,
+	editorial: h
+};
+//#endregion
+export { t as a, u as i, d as n, n as o, s as r, r as s, _ as t };

package/dist/theming.js

@@ -1,2 +1,2 @@
-import { a as e, i as t, n, o as r, r as i, t as a } from "./theming-D6KRU7hO.js";
-export { t as INK, e as PAPER, a as deriveThemeElevation, n as deriveThemePalette, i as deriveThemeTypeScale, r as readableForeground };
+import { a as e, i as t, n, o as r, r as i, s as a, t as o } from "./theming-C5ygF5uf.js";
+export { e as INK, r as PAPER, n as deriveThemeElevation, i as deriveThemePalette, t as deriveThemeTypeScale, a as readableForeground, o as themes };