themelia-react-ui 2.0.6 → 3.0.0

package/dist/value-inputs-h5MwjGCo.js

@@ -0,0 +1,982 @@
+"use client";
+import { f as e, y as t } from "./ui-provider-Bu1S-o96.js";
+import { useStrings as n } from "./lib/strings.js";
+import { t as r } from "./utils-BVbAG2J6.js";
+import { c as i } from "./typography-C0dELqYV.js";
+import { s as a } from "./text.styles-B64My8RZ.js";
+import { t as o } from "./focus-recipes-DSkiUvUp.js";
+import { t as s } from "./buttons-pZVgPTZn.js";
+import { t as c } from "./anchored-positioning-1U_eBFNx.js";
+import { t as l } from "./structure-DElaQwwN.js";
+import { t as u } from "./track-recipes-CDcKmndW.js";
+import { n as d, t as f } from "./popover.recipes-BqkdvlZn.js";
+import { n as p } from "./collection-content-D7SoDlYd.js";
+import { t as m } from "./badge-oGiXblW7.js";
+import { t as h } from "./field-state-recipes-EtCxpEy3.js";
+import { n as g, r as _, t as v } from "./field-affordance-recipes-DfbMadot.js";
+import { t as ee } from "./editable-text-recipe-Cn61kEcv.js";
+import { d as te, l as ne, o as y, p as re, y as ie } from "./form-sizing-DE_dZw32.js";
+import { t as ae } from "./input-DfJyrjoR.js";
+import { t as b } from "./date-picker-D1keJQIG.js";
+import { o as oe, t as x } from "./popover-BpMxbqEK.js";
+import { _ as se, d as ce, f as S, g as C, p as le, v as ue } from "./choice-inputs-oJEsrb5Y.js";
+import * as w from "react";
+import { forwardRef as T, memo as E, useCallback as D, useId as O, useMemo as k, useRef as de, useState as A } from "react";
+import { jsx as j, jsxs as M } from "react/jsx-runtime";
+import { Check as fe } from "lucide-react";
+import { Slider as N } from "@base-ui/react/slider";
+//#region src/components/base/value-inputs/tags-input.tsx
+var P = {
+	placeholder: "Add a tag…",
+	emptyRecommendations: "No recommendations found.",
+	clearAll: "Clear all",
+	summary: (e, t) => `${e} / ${t} tags`,
+	removeTag: (e) => `Remove ${e}`,
+	notAdded: (e) => `Not added: ${e}.`,
+	recommendationsLabel: "Suggested tags"
+};
+function F(e) {
+	return e === !0 || e === "true";
+}
+function I({ id: u, inputRef: _, onBlur: te, "aria-label": re, "aria-labelledby": ae, "aria-describedby": b, "aria-invalid": se, "aria-required": ce, value: S, defaultValue: C, onValueChange: le, name: ue, placeholder: T, recommendations: E, maxTags: O, showMaxTags: N = !1, allowDuplicates: I = !1, validate: pe, disabled: L = !1, showClearAll: me = !1, renderTag: R, delimiter: z = /[\n,]/, addOnBlur: he = !0, minLength: ge = 1, maxLength: _e, sortTags: B = !1, caseSensitive: ve = !1, field: V, invalid: ye, className: be, strings: xe }) {
+	let { defaultTextSize: Se } = t(), { defaultScale: H } = e(), U = ie(void 0, H), Ce = n(P, T === void 0 ? void 0 : { placeholder: T }), W = n(Ce, xe), G = S !== void 0, [we, Te] = A(() => C ?? []), K = S ?? we, [q, Ee] = A(""), [De, Oe] = A(null), [ke, Ae] = A(""), [je, J] = A(!1), [Me, Y] = A(-1), [Ne, Pe] = A(null), Fe = de(null), Ie = de(null), Le = w.useId(), Re = w.useId(), ze = O !== void 0 && K.length >= O, Be = !!E?.length, X = D((e) => {
+		if (typeof e == "string") return e;
+		if (V && typeof e == "object" && e) {
+			let t = e[V];
+			return typeof t == "string" ? t : t == null ? "" : String(t);
+		}
+		return String(e);
+	}, [V]), Ve = D((e) => V ? { [V]: e } : e, [V]), Z = D((e) => ve ? e : e.toLowerCase(), [ve]), He = D((e, t) => {
+		let n = Z(e);
+		return t.some((e) => Z(X(e)) === n);
+	}, [Z, X]), Ue = k(() => E ? E.map((e, t) => {
+		if (e && typeof e == "object" && "value" in e && "label" in e) {
+			let n = e;
+			return {
+				key: `${t}:${n.label}`,
+				value: n.value,
+				label: n.label
+			};
+		}
+		let n = X(e);
+		return {
+			key: `${t}:${n}`,
+			value: e,
+			label: n
+		};
+	}) : [], [E, X]), Q = k(() => {
+		if (!Ue.length) return Ue;
+		let e = Z(q.trim()), t = new Set(K.map((e) => Z(X(e))));
+		return Ue.filter((n) => {
+			let r = Z(X(n.value));
+			return !I && t.has(r) ? !1 : !e || Z(n.label).includes(e) || r.includes(e);
+		});
+	}, [
+		Ue,
+		q,
+		K,
+		I,
+		Z,
+		X
+	]), We = je && !L && Be && !ze, Ge = We && Me >= 0 && Me < Q.length ? Me : -1, Ke = D((e) => [...e].sort((e, t) => X(e).localeCompare(X(t))), [X]), qe = D((e) => {
+		G || Te(e), le?.(e);
+	}, [G, le]), Je = D((e) => {
+		let t = [...K], n = [];
+		for (let r of e) {
+			let e = typeof r == "string", i = (e ? r : X(r)).trim();
+			if (!i) continue;
+			let a = e ? Ve(i) : r;
+			if (i.length < ge || _e !== void 0 && i.length > _e || O !== void 0 && t.length >= O || !I && He(i, t) || pe && !pe(a)) {
+				n.push(i);
+				continue;
+			}
+			t.push(a);
+		}
+		return t.length !== K.length && (B && (t = Ke(t)), qe(t)), n;
+	}, [
+		K,
+		X,
+		Ve,
+		ge,
+		_e,
+		O,
+		I,
+		He,
+		pe,
+		B,
+		Ke,
+		qe
+	]), $ = D((e) => {
+		let t = Je(e), n = t.join(typeof z == "string" ? z : ", ");
+		Ee(n), Oe(n || null), Ae(t.length ? (W.notAdded ?? P.notAdded)(t.join(", ")) : ""), J(!1), Y(-1);
+	}, [
+		Je,
+		z,
+		W
+	]), Ye = k(() => {
+		let e = /* @__PURE__ */ new Map();
+		return K.map((t, n) => {
+			let r = X(t), i = e.get(r) ?? 0;
+			return e.set(r, i + 1), {
+				tag: t,
+				index: n,
+				display: r,
+				key: `${r}::${i}`
+			};
+		});
+	}, [K, X]), Xe = k(() => B ? [...Ye].sort((e, t) => e.display.localeCompare(t.display)) : Ye, [Ye, B]), Ze = D((e) => {
+		qe(K.filter((t, n) => n !== e));
+	}, [K, qe]), Qe = D((e) => {
+		Pe(Math.max(0, Xe.findIndex((t) => t.index === e))), Ze(e);
+	}, [Xe, Ze]);
+	w.useLayoutEffect(() => {
+		if (Ne === null) return;
+		Pe(null);
+		let e = Ie.current?.querySelectorAll("[data-tag-remove]:not(:disabled)");
+		((e && e.length > 0 ? e[Math.min(Ne, e.length - 1)] : void 0) ?? Fe.current)?.focus();
+	}, [Ne]);
+	let $e = D((e) => {
+		let t = e.target.value;
+		if (t.split(z).length > 1) {
+			$(t.split(z));
+			return;
+		}
+		Ee(t), Oe(null), Y(-1), Be && J(!0);
+	}, [
+		z,
+		$,
+		Be
+	]), et = D((e) => {
+		L || e.nativeEvent.isComposing || e.keyCode === 229 || (e.key === "Enter" ? (e.preventDefault(), Ge >= 0 ? $([Q[Ge].value]) : q.trim() && $(q.split(z))) : e.key === "ArrowDown" ? We ? (e.preventDefault(), Y((e) => e < Q.length - 1 ? e + 1 : e)) : Be && !ze && Q.length > 0 && J(!0) : e.key === "ArrowUp" ? We && (e.preventDefault(), Y((e) => e > 0 ? e - 1 : 0)) : e.key === "Escape" ? (J(!1), Y(-1)) : e.key === "Backspace" && q === "" && Xe.length > 0 && (e.preventDefault(), Ze(Xe[Xe.length - 1].index)));
+	}, [
+		L,
+		Ge,
+		Q,
+		$,
+		q,
+		z,
+		We,
+		Be,
+		ze,
+		Xe,
+		Ze
+	]), tt = D((e) => {
+		if (L) return;
+		let t = e.clipboardData.getData("text");
+		if (!t) return;
+		let n = e.currentTarget.selectionStart ?? q.length, r = e.currentTarget.selectionEnd ?? n, i = `${q.slice(0, n)}${t}${q.slice(r)}`.split(z);
+		i.length <= 1 || (e.preventDefault(), $(i));
+	}, [
+		L,
+		q,
+		z,
+		$
+	]), nt = D((e) => {
+		J(!1), Y(-1), he && !L && q.trim() && q !== De && $(q.split(z)), te?.(e);
+	}, [
+		he,
+		L,
+		q,
+		De,
+		z,
+		$,
+		te
+	]), rt = D(() => {
+		qe([]), Ee(""), Oe(null), Ae(""), Fe.current?.focus();
+	}, [qe]), it = W.removeTag ?? P.removeTag, at = U === "sm" ? "sm" : "md", ot = (e, t, n) => {
+		let a = X(e);
+		return /* @__PURE__ */ M(m, {
+			tone: "secondary",
+			size: at,
+			className: r("tags-input--component tags-input--tag", "max-w-full gap-space-xs pe-space-xs"),
+			children: [/* @__PURE__ */ j(i, {
+				tag: "span",
+				size: "inherit",
+				weight: "normal",
+				lineHeight: "none",
+				className: "min-w-0 truncate text-inherit",
+				children: a
+			}), /* @__PURE__ */ j("button", {
+				type: "button",
+				"data-tag-remove": "",
+				"aria-label": it(a),
+				className: r("tags-input--tag-remove relative after:absolute after:-inset-space-xs", g.inline, o.edge, g.clear, "disabled:pointer-events-none disabled:cursor-not-allowed"),
+				onClick: () => n(t),
+				disabled: L,
+				children: /* @__PURE__ */ j(v, {
+					className: g.icon,
+					"aria-hidden": "true"
+				})
+			})]
+		});
+	}, st = !!ye || F(se) || De !== null, ct = O !== void 0 && K.length > O, lt = N ? O : void 0, ut = lt !== void 0, dt = me && K.length > 0, ft = [b, ut ? Re : void 0].filter(Boolean).join(" ") || void 0;
+	return /* @__PURE__ */ M(l, {
+		gap: "xs",
+		className: r("tags-input--root w-full relative", be),
+		children: [
+			/* @__PURE__ */ j("span", {
+				role: "status",
+				"aria-live": "polite",
+				"aria-atomic": "true",
+				className: "tags-input--status sr-only",
+				children: ke
+			}),
+			!!ue && Ye.map((e) => /* @__PURE__ */ j("input", {
+				type: "hidden",
+				name: `${ue}[]`,
+				value: e.display,
+				disabled: L
+			}, e.key)),
+			/* @__PURE__ */ M(oe, {
+				open: We,
+				onOpenChange: (e, t) => {
+					!e && t.reason === "outside-press" && t.event.target instanceof Node && Ie.current?.contains(t.event.target) || (J(e), e || Y(-1));
+				},
+				children: [/* @__PURE__ */ M("div", {
+					ref: Ie,
+					"data-slot": "tags-input-field",
+					"data-disabled": L || void 0,
+					"aria-invalid": st || void 0,
+					onClick: (e) => {
+						e.target instanceof Element && e.target.closest("button, a, input") || Fe.current?.focus();
+					},
+					className: r("tags-input--field", "box-border flex w-full min-w-0 cursor-text flex-wrap items-center rounded-radius border border-input bg-transparent font-sans text-foreground shadow-none outline-none transition-[color,box-shadow]", ne[U], y[U], U === "lg" ? "gap-space-sm" : "gap-space-xs", "py-[calc(0.125rem*var(--density-scale))]", h.compoundFocus, h.compoundInvalid, "data-disabled:cursor-not-allowed data-disabled:opacity-50"),
+					children: [Xe.map((e) => /* @__PURE__ */ j(w.Fragment, { children: R ? R(e.tag, e.index, Qe) : ot(e.tag, e.index, Qe) }, e.key)), /* @__PURE__ */ j("input", {
+						ref: (e) => {
+							Fe.current = e, typeof _ == "function" ? _(e) : _ && (_.current = e);
+						},
+						id: u,
+						type: "text",
+						"data-slot": "tags-input-control",
+						"aria-label": re,
+						"aria-labelledby": ae,
+						"aria-describedby": ft,
+						"aria-invalid": st || void 0,
+						"aria-required": ce,
+						role: E ? "combobox" : void 0,
+						"aria-autocomplete": E ? "list" : void 0,
+						"aria-expanded": E ? We : void 0,
+						"aria-controls": We ? Le : void 0,
+						"aria-activedescendant": Ge >= 0 ? `${Le}-${Ge}` : void 0,
+						placeholder: K.length === 0 ? W.placeholder : void 0,
+						value: q,
+						onChange: $e,
+						onKeyDown: et,
+						onPaste: tt,
+						onBlur: nt,
+						onFocus: () => {
+							Be && !ze && Q.length > 0 && J(!0);
+						},
+						disabled: L,
+						autoComplete: "off",
+						className: r("tags-input--input", "box-border min-w-20 flex-1 border-0 bg-transparent p-0 font-sans text-foreground outline-none placeholder:text-muted-foreground disabled:cursor-not-allowed", ee[U])
+					})]
+				}), !!E && /* @__PURE__ */ j(x, {
+					anchor: Ie,
+					align: "start",
+					type: "menu",
+					initialFocus: !1,
+					finalFocus: !1,
+					role: "listbox",
+					id: Le,
+					"aria-label": W.recommendationsLabel ?? P.recommendationsLabel,
+					className: r("tags-input--recommendations w-(--anchor-width)", c.md),
+					children: /* @__PURE__ */ j("div", { children: Q.length > 0 ? Q.map((e, t) => {
+						let n = K.some((t) => X(t) === X(e.value));
+						return /* @__PURE__ */ M("button", {
+							id: `${Le}-${t}`,
+							role: "option",
+							"aria-selected": Ge === t,
+							tabIndex: -1,
+							type: "button",
+							onPointerDown: (e) => e.preventDefault(),
+							onClick: () => {
+								$([e.value]), Fe.current?.focus();
+							},
+							onMouseEnter: () => Y(t),
+							className: r(f.interactive, d(), a[Se ?? "sm"], "box-border w-full cursor-pointer justify-between border-0 bg-transparent font-sans text-foreground", "hover:bg-accent hover:text-accent-foreground", "focus-visible:outline-none", Ge === t && "bg-accent text-accent-foreground"),
+							children: [/* @__PURE__ */ j(p, { children: e.label }), /* @__PURE__ */ j(fe, { className: r("ml-auto size-icon-sm", n ? "opacity-100" : "opacity-0") })]
+						}, e.key);
+					}) : /* @__PURE__ */ j(i, {
+						tag: "div",
+						size: "xs",
+						type: "secondary",
+						className: "px-row-x py-row-y",
+						children: W.emptyRecommendations
+					}) })
+				})]
+			}),
+			(ut || dt) && /* @__PURE__ */ M("div", {
+				className: "tags-input--footer flex items-center justify-between gap-space-sm",
+				children: [lt !== void 0 && /* @__PURE__ */ j(i, {
+					id: Re,
+					tag: "span",
+					size: "xs",
+					type: ct ? "error" : "secondary",
+					className: "tags-input--count tabular-nums",
+					children: W.summary(K.length, lt)
+				}), !!dt && /* @__PURE__ */ j(s, {
+					type: "button",
+					size: "sm",
+					onClick: rt,
+					disabled: L,
+					className: "tags-input--clear ms-auto",
+					children: W.clearAll
+				})]
+			})
+		]
+	});
+}
+I.displayName = "TagsInput";
+//#endregion
+//#region src/components/base/value-inputs/phone-input.tsx
+var pe = {
+	prefixPlaceholder: "Prefix",
+	prefixAriaLabel: "Country prefix"
+}, L = {
+	US: {
+		value: "+1",
+		label: "United States",
+		iso: "US"
+	},
+	CA: {
+		value: "+1",
+		label: "Canada",
+		iso: "CA"
+	},
+	AU: {
+		value: "+61",
+		label: "Australia",
+		iso: "AU"
+	},
+	BG: {
+		value: "+359",
+		label: "Bulgaria",
+		iso: "BG"
+	},
+	GR: {
+		value: "+30",
+		label: "Greece",
+		iso: "GR"
+	},
+	GB: {
+		value: "+44",
+		label: "United Kingdom",
+		iso: "GB"
+	},
+	DE: {
+		value: "+49",
+		label: "Germany",
+		iso: "DE"
+	},
+	FR: {
+		value: "+33",
+		label: "France",
+		iso: "FR"
+	},
+	IT: {
+		value: "+39",
+		label: "Italy",
+		iso: "IT"
+	},
+	ES: {
+		value: "+34",
+		label: "Spain",
+		iso: "ES"
+	},
+	NL: {
+		value: "+31",
+		label: "Netherlands",
+		iso: "NL"
+	},
+	BE: {
+		value: "+32",
+		label: "Belgium",
+		iso: "BE"
+	},
+	AT: {
+		value: "+43",
+		label: "Austria",
+		iso: "AT"
+	},
+	CH: {
+		value: "+41",
+		label: "Switzerland",
+		iso: "CH"
+	},
+	PL: {
+		value: "+48",
+		label: "Poland",
+		iso: "PL"
+	},
+	RO: {
+		value: "+40",
+		label: "Romania",
+		iso: "RO"
+	},
+	RS: {
+		value: "+381",
+		label: "Serbia",
+		iso: "RS"
+	},
+	HR: {
+		value: "+385",
+		label: "Croatia",
+		iso: "HR"
+	},
+	SI: {
+		value: "+386",
+		label: "Slovenia",
+		iso: "SI"
+	},
+	MK: {
+		value: "+389",
+		label: "North Macedonia",
+		iso: "MK"
+	},
+	TR: {
+		value: "+90",
+		label: "Turkey",
+		iso: "TR"
+	},
+	RU: {
+		value: "+7",
+		label: "Russia",
+		iso: "RU"
+	},
+	UA: {
+		value: "+380",
+		label: "Ukraine",
+		iso: "UA"
+	},
+	SK: {
+		value: "+421",
+		label: "Slovakia",
+		iso: "SK"
+	},
+	CZ: {
+		value: "+420",
+		label: "Czech Republic",
+		iso: "CZ"
+	},
+	HU: {
+		value: "+36",
+		label: "Hungary",
+		iso: "HU"
+	},
+	PT: {
+		value: "+351",
+		label: "Portugal",
+		iso: "PT"
+	},
+	IE: {
+		value: "+353",
+		label: "Ireland",
+		iso: "IE"
+	},
+	SE: {
+		value: "+46",
+		label: "Sweden",
+		iso: "SE"
+	},
+	NO: {
+		value: "+47",
+		label: "Norway",
+		iso: "NO"
+	},
+	DK: {
+		value: "+45",
+		label: "Denmark",
+		iso: "DK"
+	},
+	FI: {
+		value: "+358",
+		label: "Finland",
+		iso: "FI"
+	},
+	CY: {
+		value: "+357",
+		label: "Cyprus",
+		iso: "CY"
+	},
+	AL: {
+		value: "+355",
+		label: "Albania",
+		iso: "AL"
+	},
+	ME: {
+		value: "+382",
+		label: "Montenegro",
+		iso: "ME"
+	},
+	BA: {
+		value: "+387",
+		label: "Bosnia and Herzegovina",
+		iso: "BA"
+	},
+	XK: {
+		value: "+383",
+		label: "Kosovo",
+		iso: "XK"
+	},
+	MD: {
+		value: "+373",
+		label: "Moldova",
+		iso: "MD"
+	},
+	BY: {
+		value: "+375",
+		label: "Belarus",
+		iso: "BY"
+	},
+	LT: {
+		value: "+370",
+		label: "Lithuania",
+		iso: "LT"
+	},
+	LV: {
+		value: "+371",
+		label: "Latvia",
+		iso: "LV"
+	},
+	EE: {
+		value: "+372",
+		label: "Estonia",
+		iso: "EE"
+	}
+}, me = [
+	"US",
+	"CA",
+	"GB",
+	"DE",
+	"FR",
+	"IT",
+	"ES",
+	"AU"
+], R = (e) => typeof e == "string" ? L[e.toUpperCase()] ?? null : e, z = (e) => e.map(R).filter((e) => e !== null), he = (e, t) => {
+	let n = e.trim().replace(/\s+/g, " ").replace(/[^\d ()+-]/g, "");
+	return t && n.startsWith(t) && (n = n.slice(t.length).replace(/^[\s-]+/, "")), t && n.startsWith("0") && (n = n.slice(1)), n;
+}, ge = (e, t) => e ? e.startsWith("+") ? e : L[e.toUpperCase()]?.value ?? e : t[0]?.value ?? "";
+function _e({ normalizeOnBlur: t = !0, onBlur: a, onChange: o, onValueChange: s, prefix: c, defaultPrefix: l, prefixes: u = me, onPrefixChange: d, disablePrefixSelector: f = !1, prefixPlaceholder: p, prefixWidth: m = "w-30", showCountryName: g = !0, showPrefixInDropdown: v = !0, invalid: ne, "aria-invalid": b, disabled: oe, readOnly: x, loading: w, className: T, size: E, strings: O, ...de }, fe) {
+	let N = !!ne || b !== void 0 && b !== !1 && b !== "false", { defaultScale: P } = e(), F = ie(E, P), I = oe || w, R = I || x, _e = n(pe, O), B = k(() => z(u), [u]), ve = k(() => ge(l, B), [l, B]), [V, ye] = A(ve), [be, xe] = A(() => {
+		let e = c ?? l;
+		return e && !e.startsWith("+") ? e.toUpperCase() : B.find((e) => e.value === ve)?.iso;
+	}), Se = c !== void 0, H = Se ? ge(c, B) : V, U = k(() => {
+		if (!H || B.some((e) => e.value === H)) return B;
+		let e = Object.values(L).find((e) => e.value === H);
+		return e ? [e, ...B] : B;
+	}, [B, H]), Ce = k(() => U.find((e) => e.iso === (c && !c.startsWith("+") ? c.toUpperCase() : be) && e.value === H) ?? U.find((e) => e.value === H), [
+		U,
+		H,
+		be,
+		c
+	]), W = D((e) => {
+		if (e === null || R) return;
+		let t = U.find((t) => t.iso === e);
+		t && (xe(t.iso), Se || ye(t.value), d?.(t.value));
+	}, [
+		Se,
+		d,
+		U,
+		R
+	]), G = D((e) => {
+		if (R) return;
+		let t = e.target.value;
+		if (H && t.startsWith(H)) {
+			let n = t.slice(H.length).replace(/^[\s-]+/, ""), r = n.startsWith("0") ? n.slice(1) : n;
+			if (r !== t) {
+				let t = {
+					...e,
+					target: {
+						...e.target,
+						value: r
+					},
+					currentTarget: {
+						...e.currentTarget,
+						value: r
+					}
+				};
+				s?.(r), o?.(t);
+				return;
+			}
+		}
+		s?.(t), o?.(e);
+	}, [
+		R,
+		o,
+		s,
+		H
+	]), we = D((e) => {
+		if (!R && t && (o || s)) {
+			let t = he(e.target.value, H);
+			if (t !== e.target.value) {
+				let n = {
+					...e,
+					target: {
+						...e.target,
+						value: t
+					},
+					currentTarget: {
+						...e.currentTarget,
+						value: t
+					}
+				};
+				s?.(t), o?.(n);
+			}
+		}
+		a?.(e);
+	}, [
+		R,
+		t,
+		o,
+		s,
+		a,
+		H
+	]);
+	if (U.length === 0 || f) {
+		let e = H || l;
+		return e ? /* @__PURE__ */ M("div", {
+			className: "flex items-start gap-space-md",
+			children: [/* @__PURE__ */ j("div", {
+				"aria-invalid": N || void 0,
+				className: r("phone-input--prefix flex shrink-0 items-center justify-center rounded-radius border border-input bg-muted", te[F], ee[F], y[F], I && "opacity-50", h.invalid),
+				children: /* @__PURE__ */ j(i, {
+					tag: "span",
+					size: "inherit",
+					type: "secondary",
+					lineHeight: "tight",
+					children: e
+				})
+			}), /* @__PURE__ */ j("div", {
+				className: "flex-1",
+				children: /* @__PURE__ */ j(ae, {
+					ref: fe,
+					size: F,
+					type: "tel",
+					autoComplete: "tel",
+					inputMode: "tel",
+					onChange: G,
+					onBlur: we,
+					invalid: N,
+					disabled: I,
+					readOnly: x,
+					loading: w,
+					className: T,
+					...de
+				})
+			})]
+		}) : /* @__PURE__ */ j(ae, {
+			ref: fe,
+			size: F,
+			type: "tel",
+			autoComplete: "tel",
+			inputMode: "tel",
+			onChange: G,
+			onBlur: we,
+			invalid: N,
+			disabled: I,
+			readOnly: x,
+			loading: w,
+			className: r("phone-input--component", T),
+			...de
+		});
+	}
+	return /* @__PURE__ */ M("div", {
+		className: "flex items-start gap-space-md",
+		children: [/* @__PURE__ */ M(C, {
+			value: Ce?.iso ?? null,
+			onValueChange: (e) => W(e),
+			disabled: R,
+			children: [/* @__PURE__ */ j(se, {
+				"aria-label": _e.prefixAriaLabel,
+				"aria-invalid": N || void 0,
+				iconClassName: _.icon[F],
+				className: r("phone-input--prefix-trigger", re(F), "shrink-0", m),
+				children: /* @__PURE__ */ j(ue, {
+					placeholder: /* @__PURE__ */ j(i, {
+						tag: "span",
+						size: "inherit",
+						type: "secondary",
+						lineHeight: "tight",
+						className: "text-inherit",
+						children: p ?? _e.prefixPlaceholder
+					}),
+					children: !!Ce && /* @__PURE__ */ j(i, {
+						tag: "span",
+						size: "inherit",
+						lineHeight: "tight",
+						className: "text-inherit",
+						children: Ce.value
+					})
+				})
+			}), /* @__PURE__ */ j(ce, { children: /* @__PURE__ */ j(S, { children: U.map((e) => /* @__PURE__ */ j(le, {
+				value: e.iso,
+				size: F,
+				children: /* @__PURE__ */ M("div", {
+					className: "flex items-center gap-space-md",
+					children: [!!v && /* @__PURE__ */ j(i, {
+						tag: "span",
+						size: "inherit",
+						weight: "medium",
+						lineHeight: "tight",
+						className: "min-w-13 tabular-nums text-inherit",
+						children: e.value
+					}), !!g && /* @__PURE__ */ j(i, {
+						tag: "span",
+						size: "inherit",
+						lineHeight: "tight",
+						className: "text-inherit",
+						children: e.label
+					})]
+				})
+			}, e.iso)) }) })]
+		}), /* @__PURE__ */ j("div", {
+			className: "flex-1",
+			children: /* @__PURE__ */ j(ae, {
+				ref: fe,
+				size: F,
+				type: "tel",
+				autoComplete: "tel",
+				inputMode: "tel",
+				onChange: G,
+				onBlur: we,
+				invalid: N,
+				disabled: I,
+				readOnly: x,
+				loading: w,
+				className: T,
+				...de
+			})
+		})]
+	});
+}
+var B = E(w.forwardRef(_e));
+B.displayName = "PhoneInput";
+//#endregion
+//#region src/components/base/value-inputs/color-input.tsx
+var ve = { chooseColor: "Choose color" }, V = {
+	sm: "size-control-sm",
+	md: "size-control",
+	lg: "size-control-lg"
+};
+function ye(e) {
+	let t = e.trim().toLowerCase();
+	return /^#[0-9a-f]{6}$/.test(t) ? t : /^#[0-9a-f]{3}$/.test(t) ? `#${t.slice(1).split("").map((e) => `${e}${e}`).join("")}` : null;
+}
+function be(e, t) {
+	let n = Number(e.toFixed(t));
+	return Object.is(n, -0) ? 0 : n;
+}
+function xe(e) {
+	let t = ye(e);
+	if (!t) return e;
+	let [n, r, i] = [
+		1,
+		3,
+		5
+	].map((e) => Number.parseInt(t.slice(e, e + 2), 16) / 255).map((e) => e <= .04045 ? e / 12.92 : ((e + .055) / 1.055) ** 2.4), a = Math.cbrt(.4122214708 * n + .5363325363 * r + .0514459929 * i), o = Math.cbrt(.2119034982 * n + .6806995451 * r + .1073969566 * i), s = Math.cbrt(.0883024619 * n + .2817188376 * r + .6299787005 * i), c = .2104542553 * a + .793617785 * o - .0040720468 * s, l = 1.9779984951 * a - 2.428592205 * o + .4505937099 * s, u = .0259040371 * a + .7827717662 * o - .808675766 * s, d = Math.hypot(l, u), f = d < 5e-5 ? 0 : Math.atan2(u, l) * 180 / Math.PI + (u < 0 ? 360 : 0);
+	return `oklch(${be(c, 4)} ${be(d, 4)} ${be(f, 2)})`;
+}
+function Se(e, t) {
+	let n = window.getComputedStyle(e).backgroundColor, r = ye(n);
+	if (r) return r;
+	if (typeof CanvasRenderingContext2D > "u") return t;
+	try {
+		let e = document.createElement("canvas");
+		e.width = 1, e.height = 1;
+		let r = e.getContext("2d", { willReadFrequently: !0 });
+		if (!r) return t;
+		r.clearRect(0, 0, 1, 1), r.fillStyle = n, r.fillRect(0, 0, 1, 1);
+		let [i, a, o, s] = r.getImageData(0, 0, 1, 1).data;
+		return s === 0 ? t : `#${[
+			i,
+			a,
+			o
+		].map((e) => e.toString(16).padStart(2, "0")).join("")}`;
+	} catch {
+		return t;
+	}
+}
+var H = w.forwardRef(function({ className: t, value: i, defaultValue: a, onChange: o, onValueChange: s, previewValue: c, pickerAriaLabel: u, size: d, disabled: f, readOnly: p, loading: m, invalid: g, "aria-invalid": _, strings: v, inputStrings: ee, ...te }, ne) {
+	let y = !!g || _ !== void 0 && _ !== !1 && _ !== "false", re = n(ve, v), { defaultScale: b } = e(), oe = ie(d, b), x = f || p || m, [se, ce] = w.useState(a ?? ""), S = i ?? se, C = c ?? S, le = ye(S) ?? "#000000", [ue, T] = w.useState(le), E = w.useRef(null);
+	w.useLayoutEffect(() => {
+		let e = ye(C);
+		if (e) {
+			T(e);
+			return;
+		}
+		E.current && typeof window < "u" && T((e) => Se(E.current, e));
+	}, [C]);
+	let D = (e) => {
+		i === void 0 && ce(e.target.value), o?.(e), s?.(e.target.value);
+	};
+	return /* @__PURE__ */ M(l, {
+		direction: "horizontal",
+		gap: "sm",
+		align: "center",
+		wrap: !1,
+		className: r("color-input--component min-w-0 [&>.input--component]:min-w-0 [&>.input--component]:flex-1", t),
+		children: [/* @__PURE__ */ M("label", {
+			"aria-invalid": y || void 0,
+			className: r("color-input--picker box-border relative shrink-0 cursor-pointer overflow-hidden rounded-radius border border-input bg-background shadow-none outline-none transition-[color,box-shadow]", h.compoundFocus, h.invalid, h.compoundInvalid, "data-disabled:pointer-events-none data-disabled:cursor-not-allowed data-disabled:opacity-50", V[oe]),
+			"data-disabled": x || void 0,
+			children: [/* @__PURE__ */ j("span", {
+				ref: E,
+				"aria-hidden": "true",
+				"data-user-color": !0,
+				className: "color-input--swatch absolute inset-1 rounded-radius-xs",
+				style: { background: C || "transparent" }
+			}), /* @__PURE__ */ j("input", {
+				type: "color",
+				value: ue,
+				disabled: x,
+				"aria-label": u ?? re.chooseColor,
+				onInput: (e) => {
+					if (x) return;
+					let t = xe(e.currentTarget.value);
+					i === void 0 && ce(t), o && o({
+						...e,
+						target: {
+							...e.currentTarget,
+							value: t
+						},
+						currentTarget: {
+							...e.currentTarget,
+							value: t
+						}
+					}), s?.(t);
+				},
+				className: "color-input--native absolute inset-0 size-full cursor-pointer opacity-0"
+			})]
+		}), /* @__PURE__ */ j(ae, {
+			...te,
+			ref: ne,
+			size: oe,
+			value: S,
+			disabled: f,
+			readOnly: p,
+			loading: m,
+			invalid: y,
+			onChange: D,
+			strings: ee,
+			className: "min-w-0 flex-1 font-mono"
+		})]
+	});
+});
+H.displayName = "ColorInput";
+//#endregion
+//#region src/components/base/value-inputs/slider.tsx
+var U = { ariaLabel: "Value" };
+function Ce({ name: e, inputRef: t, onBlur: a, id: o, "aria-label": s, "aria-labelledby": c, "aria-describedby": l, strings: d, value: f, defaultValue: p, min: m = 0, max: h = 100, step: g = 1, disabled: _ = !1, invalid: v = !1, onChange: ee, onValueChange: te, onValueCommitted: ne, showValue: y = !1, formatValue: re, unit: ie, className: ae, orientation: b = "horizontal" }, oe) {
+	let x = O(), se = n(U, d), ce = o ?? `slider-${x}`, S = e ?? ce, C = s ?? (c ? void 0 : se.ariaLabel), le = f !== void 0, [ue, w] = A(() => p ?? m), T = D((e) => {
+		let t = Array.isArray(e) ? e[0] : e;
+		le || w(t), te?.(t), ee?.({ target: {
+			name: S,
+			value: t
+		} });
+	}, [
+		le,
+		S,
+		ee,
+		te
+	]), E = D((e) => {
+		let t = Array.isArray(e) ? e[0] : e;
+		ne?.(t);
+	}, [ne]), de = k(() => {
+		if (!y) return null;
+		let e = Math.min(h, Math.max(m, f ?? ue));
+		return re ? re(e) : ie ? `${e}${ie}` : String(e);
+	}, [
+		y,
+		f,
+		ue,
+		m,
+		h,
+		re,
+		ie
+	]), fe = f === void 0 ? void 0 : [f], P = p === void 0 ? [m] : [p];
+	return /* @__PURE__ */ M("div", {
+		className: r("slider--component", "flex items-center gap-space-lg", ae),
+		children: [/* @__PURE__ */ j(N.Root, {
+			ref: oe,
+			"data-slot": "slider",
+			id: ce,
+			"aria-label": C,
+			"aria-labelledby": c,
+			"aria-describedby": l,
+			value: fe,
+			defaultValue: P,
+			min: m,
+			max: h,
+			step: g,
+			disabled: _,
+			orientation: b,
+			onValueChange: T,
+			onValueCommitted: E,
+			"aria-invalid": v || void 0,
+			className: r("box-border data-[orientation=horizontal]:w-full data-[orientation=horizontal]:px-[calc(var(--icon)/2)] data-[orientation=vertical]:h-full", "min-w-0 flex-1", v && "[&_[data-slot=slider-range]]:bg-destructive"),
+			children: /* @__PURE__ */ M(N.Control, {
+				className: "relative flex w-full touch-none items-center select-none data-disabled:opacity-50 data-[orientation=horizontal]:min-h-control data-[orientation=vertical]:h-full data-[orientation=vertical]:min-h-40 data-[orientation=vertical]:w-auto data-[orientation=vertical]:flex-col",
+				children: [/* @__PURE__ */ j(N.Track, {
+					"data-slot": "slider-track",
+					className: r("relative grow overflow-hidden rounded-full bg-muted select-none data-[orientation=horizontal]:w-full data-[orientation=horizontal]:-mx-[calc(var(--icon)/2)] data-[orientation=vertical]:h-full", u),
+					children: /* @__PURE__ */ j(N.Indicator, {
+						"data-slot": "slider-range",
+						className: "absolute bg-primary select-none data-[orientation=horizontal]:h-full data-[orientation=vertical]:w-full"
+					})
+				}), /* @__PURE__ */ j(N.Thumb, {
+					index: 0,
+					inputRef: t,
+					onBlur: a,
+					"data-slot": "slider-thumb",
+					getAriaLabel: C === void 0 ? void 0 : () => C,
+					"aria-labelledby": c,
+					"aria-describedby": l,
+					className: r("block size-icon shrink-0 rounded-full border border-primary bg-background shadow-sm transition-[color,box-shadow] select-none", "has-[:focus-visible]:outline-hidden has-[:focus-visible]:ring-3 has-[:focus-visible]:ring-ring/50 data-disabled:pointer-events-none", v && "border-destructive has-[:focus-visible]:ring-destructive/30 dark:has-[:focus-visible]:ring-destructive/50")
+				})]
+			})
+		}), !!y && de !== null && /* @__PURE__ */ j(i, {
+			tag: "span",
+			type: v ? "error" : "secondary",
+			className: "min-w-8 shrink-0 text-right tabular-nums",
+			children: de
+		})]
+	});
+}
+var W = w.forwardRef(Ce);
+W.displayName = "SliderField";
+//#endregion
+//#region src/components/base/value-inputs/date-time-input.tsx
+var G = T(function({ value: e, defaultValue: t, onValueChange: n, placeholder: i, readableFormat: a = "dd-MM-yyyy HH:mm", stepMinutes: o = 30, modal: s = !0, invalid: c, disabled: l, id: u, className: d, triggerRef: f, onBlur: p, "aria-describedby": m, "aria-invalid": h }, g) {
+	let _ = e ? new Date(e) : void 0, v = D((e) => {
+		n?.(e.date ? e.date.toISOString() : void 0);
+	}, [n]);
+	return /* @__PURE__ */ j(b, {
+		ref: g,
+		className: r("date-time-input--component", d),
+		id: u,
+		triggerRef: f,
+		onBlur: p,
+		"aria-describedby": m,
+		"aria-invalid": h,
+		mode: "single",
+		disabled: l,
+		invalid: c,
+		placeholder: i,
+		value: _,
+		defaultValue: t ? new Date(t) : void 0,
+		onValueChange: v,
+		readableFormat: a,
+		withTime: {
+			enabled: !0,
+			format: "24",
+			step: o * 60
+		},
+		modal: s
+	});
+});
+G.displayName = "DateTimeInput";
+//#endregion
+export { ve as a, B as c, P as d, H as i, pe as l, W as n, L as o, U as r, me as s, G as t, I as u };
+
+//# sourceMappingURL=value-inputs-h5MwjGCo.js.map