themelia-ui 3.0.0 → 3.2.0

package/dist/value-inputs-ng8aVJJZ.js

@@ -0,0 +1,728 @@
+import "#core.css";
+import { c as e, s as t } from "./typography-DmeR05Er.js";
+import { t as n } from "./cx--CBrhWH0.js";
+import { o as r } from "./structure-CynEZ-OY.js";
+import { d as i } from "./display-a7AoX_u7.js";
+import { s as a } from "./choice-inputs-NwRxvmZN.js";
+import { d as o, l as s } from "./text-inputs-BboE77nZ.js";
+import { c, u as l } from "./date-pickers-BwCwKIVM.js";
+import { XIcon as u } from "lucide-react";
+import * as d from "react";
+import { forwardRef as f, useCallback as p, useId as m, useMemo as h, useRef as g, useState as _ } from "react";
+import { jsx as v, jsxs as y } from "react/jsx-runtime";
+import { converter as b, formatHsl as x, formatRgb as S, parse as C } from "culori";
+import { Slider as w } from "@base-ui/react/slider";
+import { Field as T } from "@base-ui/react/field";
+import "#css/value-inputs.css";
+//#region src/components/base/value-inputs/value-inputs.strings.ts
+var E = {
+	thumb: (e) => e === 0 ? "Minimum" : "Maximum",
+	label: "Value"
+}, D = {
+	...o,
+	picker: "Choose a colour"
+}, O = {
+	...o,
+	prefixPlaceholder: "Code",
+	prefix: "Country dial code"
+}, k = {
+	...o,
+	clearAll: "Clear all",
+	removeTag: (e) => `Remove ${e}`,
+	notAdded: (e) => `Not added: ${e}.`,
+	placeholder: "Add a tag…"
+}, A = {
+	sliderRoot: "value-inputs__sliderRoot___TVz5X",
+	slider: "value-inputs__slider___Jn7Np",
+	sliderControl: "value-inputs__sliderControl___5mXkK",
+	sliderThumb: "value-inputs__sliderThumb___PA1oN",
+	sliderTrack: "value-inputs__sliderTrack___OZ4qQ",
+	sliderRange: "value-inputs__sliderRange___qgdN0",
+	sliderValue: "value-inputs__sliderValue___Jcfq4",
+	tagsShell: "value-inputs__tagsShell___R-B11",
+	tag: "value-inputs__tag___6Ch0s",
+	tagRemove: "value-inputs__tagRemove___vPeFa",
+	tagsInput: "value-inputs__tagsInput___88_8P",
+	tagsFooter: "value-inputs__tagsFooter___dEqPc",
+	tagsClear: "value-inputs__tagsClear___DpqXx",
+	colorRoot: "value-inputs__colorRoot___4TlRL",
+	colorPicker: "value-inputs__colorPicker___oCBbz",
+	colorNative: "value-inputs__colorNative___M0EBv",
+	colorSwatch: "value-inputs__colorSwatch___IKK_t",
+	colorText: "value-inputs__colorText___t1CW9",
+	phoneRoot: "value-inputs__phoneRoot___H2Jvj",
+	phonePrefix: "value-inputs__phonePrefix___f5PTY",
+	phoneNumber: "value-inputs__phoneNumber___vIwkj"
+}, j = f(function({ name: e, id: r, value: i, defaultValue: a, min: o = 0, max: s = 100, step: c = 1, disabled: l = !1, invalid: u = !1, orientation: d = "horizontal", onChange: f, onValueChange: p, onValueCommitted: h, showValue: g = !1, formatValue: _, unit: b, className: x, "aria-label": S, "aria-labelledby": C, "aria-describedby": D, "aria-invalid": O, strings: k }, j) {
+	let M = {
+		...E,
+		...k
+	}, N = S ?? M.label, P = m(), F = r ?? P, I = e ?? F, L = i ?? a, R = Array.isArray(L), z = ((e, t) => e === void 0 ? [t] : Array.isArray(e) ? e : [e])(L, o), B = (e) => _ ? _(e) : b ? `${e}${b}` : String(e);
+	return /* @__PURE__ */ v(T.Root, {
+		invalid: u || O !== void 0 && O !== !1 && O !== "false",
+		className: n("slider--component", A.sliderRoot, x),
+		children: /* @__PURE__ */ y(w.Root, {
+			ref: j,
+			id: F,
+			name: e,
+			"aria-label": C ? void 0 : N,
+			"aria-labelledby": C,
+			"aria-describedby": D,
+			"aria-invalid": u || O || void 0,
+			value: i,
+			defaultValue: a ?? o,
+			min: o,
+			max: s,
+			step: c,
+			disabled: l,
+			orientation: d,
+			onValueChange: (e) => {
+				p?.(e), f?.({ target: {
+					name: I,
+					value: e
+				} });
+			},
+			onValueCommitted: (e) => h?.(e),
+			className: A.slider,
+			children: [/* @__PURE__ */ y(w.Control, {
+				className: A.sliderControl,
+				children: [/* @__PURE__ */ v(w.Track, {
+					className: A.sliderTrack,
+					children: /* @__PURE__ */ v(w.Indicator, { className: A.sliderRange })
+				}), z.map((e, t) => /* @__PURE__ */ v(w.Thumb, {
+					index: t,
+					"aria-labelledby": R ? void 0 : C,
+					"aria-describedby": D,
+					"aria-invalid": u || O || void 0,
+					getAriaLabel: () => R ? M.thumb(t) : N ?? "",
+					getAriaValueText: (e, t) => B(t),
+					className: A.sliderThumb
+				}, t))]
+			}), g && /* @__PURE__ */ v(w.Value, {
+				render: /* @__PURE__ */ v(t, {
+					tag: "span",
+					size: "inherit",
+					numeric: !0,
+					type: u ? "error" : "secondary",
+					className: A.sliderValue
+				}),
+				children: (e, t) => t.map(B).join("–")
+			})]
+		})
+	});
+}), M = f(function(e, t) {
+	return /* @__PURE__ */ v(j, {
+		ref: t,
+		...e
+	});
+}), N = [];
+function P({ value: t, defaultValue: r, onValueChange: a, placeholder: o, disabled: s = !1, invalid: c = !1, name: l, maxTags: d, showCount: f = !1, showClearAll: m = !1, strings: b, allowDuplicates: x = !1, caseSensitive: S = !1, sortTags: C = !1, minLength: w = 1, maxLength: T, validate: E, delimiter: D = /[\n,]/, addOnBlur: O = !0, renderTag: j, className: M, id: P, "aria-label": F, "aria-labelledby": I, "aria-describedby": L, "aria-invalid": R, "aria-required": z }) {
+	let B = {
+		...k,
+		...b
+	}, V = t !== void 0, [H, U] = _(r ?? []), W = V ? t ?? N : H, [G, K] = _(""), q = g(null), J = g(null), [Y, X] = _(null), [ee, te] = _(""), Z = p((e) => {
+		V || U(e), a?.(e);
+	}, [V, a]), ne = p((e, t) => {
+		if (S) return t.includes(e);
+		let n = e.toLowerCase();
+		return t.some((e) => e.toLowerCase() === n);
+	}, [S]), re = p((e) => {
+		let t = [...W], n = [];
+		for (let r of e) {
+			let e = r.trim();
+			if (e) {
+				if (e.length < w || T !== void 0 && e.length > T || d !== void 0 && t.length >= d || !x && ne(e, t) || E && !E(e)) {
+					n.push(e);
+					continue;
+				}
+				t.push(e);
+			}
+		}
+		return t.length !== W.length && (C && (t = t.sort((e, t) => e.localeCompare(t))), Z(t)), n.join(typeof D == "string" ? D : ", ");
+	}, [
+		x,
+		Z,
+		D,
+		ne,
+		T,
+		d,
+		w,
+		C,
+		W,
+		E
+	]), Q = p((e) => Z(W.filter((t, n) => n !== e)), [Z, W]), $ = (e) => {
+		let t = re(e);
+		K(t), X(t || null), te(t ? (B.notAdded ?? k.notAdded)(t) : "");
+	}, ie = (e) => {
+		Q(e), requestAnimationFrame(() => {
+			let t = J.current?.querySelectorAll("[data-tag-remove]");
+			(t?.[Math.min(e, t.length - 1)] ?? q.current)?.focus();
+		});
+	}, ae = (e) => {
+		if (!(e.nativeEvent.isComposing || e.keyCode === 229)) {
+			if (e.key === "Enter") {
+				e.preventDefault(), $(G.split(D));
+				return;
+			}
+			e.key === "Backspace" && G === "" && W.length > 0 && (e.preventDefault(), Q(W.length - 1));
+		}
+	}, oe = (e) => {
+		let t = e.clipboardData.getData("text");
+		if (!t) return;
+		let n = e.currentTarget.selectionStart ?? G.length, r = e.currentTarget.selectionEnd ?? n, i = `${G.slice(0, n)}${t}${G.slice(r)}`.split(D);
+		i.length <= 1 || (e.preventDefault(), $(i));
+	}, se = d !== void 0 && W.length > d, ce = f && d !== void 0 || m && W.length > 0, le = h(() => d === void 0 ? null : `${W.length} / ${d}`, [d, W.length]);
+	return /* @__PURE__ */ y("div", {
+		ref: J,
+		className: n("tags-input--component", M),
+		children: [
+			/* @__PURE__ */ v(i, {
+				role: "status",
+				"aria-live": "polite",
+				children: ee
+			}),
+			!!l && W.map((e, t) => /* @__PURE__ */ v("input", {
+				type: "hidden",
+				name: `${l}[]`,
+				value: e,
+				disabled: s
+			}, `${e}-${t}`)),
+			/* @__PURE__ */ y("div", {
+				"data-field-shell": "",
+				"aria-invalid": c || R || void 0,
+				className: A.tagsShell,
+				onClick: () => q.current?.focus(),
+				children: [W.map((t, r) => j ? j(t, r, Q) : /* @__PURE__ */ y("span", {
+					className: n(A.tag, e({
+						size: "xs",
+						weight: "medium"
+					})),
+					children: [t, /* @__PURE__ */ v("button", {
+						type: "button",
+						"data-hit-area": !0,
+						className: A.tagRemove,
+						"aria-label": B.removeTag(t),
+						"data-tag-remove": "",
+						disabled: s,
+						onClick: (e) => {
+							e.stopPropagation(), ie(r);
+						},
+						children: /* @__PURE__ */ v(u, { "aria-hidden": !0 })
+					})]
+				}, `${t}-${r}`)), /* @__PURE__ */ v("input", {
+					ref: q,
+					id: P,
+					"data-field-control": "",
+					className: A.tagsInput,
+					value: G,
+					placeholder: W.length === 0 ? o ?? B.placeholder : void 0,
+					disabled: s,
+					"aria-label": F,
+					"aria-labelledby": I,
+					"aria-describedby": L,
+					"aria-invalid": c || R || Y !== null || void 0,
+					"aria-required": z,
+					onChange: (e) => {
+						let t = e.target.value.split(D);
+						if (t.length > 1) {
+							$(t);
+							return;
+						}
+						X(null), K(e.target.value);
+					},
+					onKeyDown: ae,
+					onPaste: oe,
+					onBlur: () => {
+						!O || s || G === Y || $(G.split(D));
+					}
+				})]
+			}),
+			ce && /* @__PURE__ */ y("div", {
+				className: n(A.tagsFooter, e({
+					size: "xs",
+					type: "secondary"
+				})),
+				children: [/* @__PURE__ */ v("span", {
+					className: se ? e({
+						size: "inherit",
+						type: "error"
+					}) : void 0,
+					children: f ? le : null
+				}), m && W.length > 0 && /* @__PURE__ */ v("button", {
+					type: "button",
+					"data-hit-area": !0,
+					className: A.tagsClear,
+					onClick: () => {
+						Z([]), q.current?.focus();
+					},
+					disabled: s,
+					children: B.clearAll
+				})]
+			})
+		]
+	});
+}
+//#endregion
+//#region src/components/base/value-inputs/color-input.tsx
+function F(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 I(e, t) {
+	let n = Number(e.toFixed(t));
+	return Object.is(n, -0) ? 0 : n;
+}
+var L = b("oklch");
+function R(e, t) {
+	if (t === "hex") return e;
+	let n = C(e);
+	if (!n) return e;
+	if (t === "rgb") return S(n) ?? e;
+	if (t === "hsl") return x(n) ?? e;
+	let r = L(n);
+	return r ? `oklch(${I(r.l, 4)} ${I(r.c, 4)} ${I(r.h ?? 0, 2)})` : e;
+}
+function z(e, t) {
+	let n = window.getComputedStyle(e).backgroundColor;
+	if (!n) return t;
+	let r = document.createElement("canvas");
+	r.width = 1, r.height = 1;
+	let i = r.getContext("2d", { willReadFrequently: !0 });
+	if (!i) return t;
+	i.fillStyle = "#000000", i.fillStyle = n;
+	let a = i.fillStyle;
+	if (i.fillStyle = "#ffffff", i.fillStyle = n, a !== i.fillStyle) return t;
+	i.clearRect(0, 0, 1, 1), i.fillRect(0, 0, 1, 1);
+	let [o, s, c, l] = i.getImageData(0, 0, 1, 1).data;
+	if (l === 0) return t;
+	let u = (e) => e.toString(16).padStart(2, "0");
+	return `#${u(o ?? 0)}${u(s ?? 0)}${u(c ?? 0)}`;
+}
+function B(e) {
+	return typeof CSS > "u" || typeof CSS.supports != "function" || CSS.supports("color", e);
+}
+var V = d.forwardRef(function({ className: t, value: r, defaultValue: i, onChange: a, onValueChange: o, previewValue: c, strings: l, format: u, disabled: f, readOnly: p, onFocus: m, onBlur: h, ...g }, _) {
+	let b = {
+		...D,
+		...l
+	}, [x, S] = d.useState(String(i ?? "")), C = r === void 0 ? x : String(r), w = c ?? C, T = d.useId(), [E, O] = d.useState(!1), k = w.trim() !== "" && !B(w), j = g["aria-invalid"] ?? (k && !E ? !0 : void 0), M = d.useRef(null), [N, P] = d.useState(() => F(C) ?? "#000000");
+	d.useLayoutEffect(() => {
+		let e = F(w);
+		if (e) {
+			P(e);
+			return;
+		}
+		M.current && P((e) => z(M.current, e));
+	}, [w]);
+	let I = (e) => {
+		r === void 0 && S(e.target.value), a?.(e), o?.(e.target.value);
+	}, L = (e) => {
+		let t = e.currentTarget.value, n = R(F(t) ?? t, u ?? "oklch");
+		r === void 0 && S(n), o?.(n);
+	}, V = g["aria-labelledby"] ?? (g["aria-label"] ? T : void 0);
+	return /* @__PURE__ */ y("div", {
+		className: n("color-input--component", A.colorRoot, t),
+		children: [/* @__PURE__ */ y("label", {
+			className: A.colorPicker,
+			"data-disabled": f || p || void 0,
+			"data-invalid": j === !0 || j === "true" || void 0,
+			children: [
+				/* @__PURE__ */ v("span", {
+					ref: M,
+					"aria-hidden": !0,
+					className: A.colorSwatch,
+					"data-empty": !w.trim() || k || void 0,
+					"data-unreadable": k || void 0,
+					style: { background: w.trim() && !k ? w : void 0 }
+				}),
+				!!g["aria-label"] && !g["aria-labelledby"] && /* @__PURE__ */ v("span", {
+					id: T,
+					hidden: !0,
+					children: g["aria-label"]
+				}),
+				/* @__PURE__ */ v("input", {
+					type: "color",
+					className: A.colorNative,
+					value: N,
+					disabled: f || p,
+					"aria-label": b.picker,
+					"aria-describedby": V,
+					onInput: L
+				})
+			]
+		}), /* @__PURE__ */ v(s, {
+			...g,
+			ref: _,
+			value: C,
+			disabled: f,
+			readOnly: p,
+			"aria-invalid": j,
+			onChange: I,
+			onFocus: (e) => {
+				O(!0), m?.(e);
+			},
+			onBlur: (e) => {
+				O(!1), h?.(e);
+			},
+			className: n(A.colorText, e({
+				size: "inherit",
+				mono: !0
+			}))
+		})]
+	});
+}), H = {
+	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"
+	}
+}, U = [
+	"US",
+	"CA",
+	"GB",
+	"DE",
+	"FR",
+	"IT",
+	"ES",
+	"AU"
+];
+function W(e) {
+	return typeof e == "string" ? H[e.toUpperCase()] ?? null : e;
+}
+//#endregion
+//#region src/components/base/value-inputs/phone-input.tsx
+var G = /* @__PURE__ */ new Set([
+	"+39",
+	"+378",
+	"+379"
+]);
+function K(e, t, n) {
+	let r = /\s*(?:ext\.?|extension|x|#)\s*(\d+)\s*$/i.exec(e), i = (r ? e.slice(0, r.index) : e).trim().replace(/\s+/g, " ").replace(/[^\d ()+-]/g, "");
+	return t && i.startsWith(t) && (i = i.slice(t.length).replace(/^[\s-]+/, "")), t && n && !G.has(t) && i.startsWith("0") && (i = i.slice(1)), r ? `${i} ext. ${r[1]}` : i;
+}
+function q(e, t) {
+	let n = e.toUpperCase();
+	return t.find((e) => e.iso.toUpperCase() === n) ?? H[n];
+}
+function J(e, t) {
+	return e ? e.startsWith("+") ? e : q(e, t)?.value ?? e : t[0]?.value ?? "";
+}
+function Y(e, t) {
+	return e ? e.startsWith("+") ? void 0 : q(e, t)?.iso : t[0]?.iso;
+}
+var X = f(function({ prefix: e, defaultPrefix: t, onPrefixChange: r, prefixes: i = U, disablePrefixSelector: o = !1, strings: c, normalizeOnBlur: l = !0, showCountryName: u = !0, value: d, onChange: f, onBlur: m, disabled: g, readOnly: b, invalid: x, className: S, ...C }, w) {
+	let T = {
+		...O,
+		...c
+	}, E = h(() => i.map(W).filter((e) => e !== null), [i]), D = e !== void 0, [k, j] = _(() => J(t, E)), M = D ? J(e, E) : k, [N, P] = _(() => Y(t, E)), F = p((e) => {
+		let t = (e ? E.find((t) => t.iso === e)?.value : void 0) ?? "";
+		P(e), D || j(t), r?.(t);
+	}, [
+		D,
+		r,
+		E
+	]), I = h(() => E.map((e) => ({
+		value: e.iso,
+		label: e.value,
+		description: u ? e.label : void 0
+	})), [E, u]), L = h(() => {
+		let t = D ? Y(e, E) : void 0, n = E.filter((e) => e.value === M);
+		return (n.find((e) => e.iso === t) ?? n.find((e) => e.iso === N) ?? n[0])?.iso;
+	}, [
+		D,
+		E,
+		N,
+		e,
+		M
+	]), R = (e) => {
+		if (l && !g && !b) {
+			let t = K(e.target.value, M, !o);
+			t !== e.target.value && (e.target.value = t, f?.(e));
+		}
+		m?.(e);
+	};
+	return /* @__PURE__ */ y("div", {
+		className: n("phone-input--component", A.phoneRoot, S),
+		children: [!o && /* @__PURE__ */ v("div", {
+			className: A.phonePrefix,
+			children: /* @__PURE__ */ v(a, {
+				options: I,
+				value: L ?? null,
+				onValueChange: F,
+				placeholder: T.prefixPlaceholder,
+				disabled: g || b,
+				invalid: x,
+				"aria-label": T.prefix
+			})
+		}), /* @__PURE__ */ v(s, {
+			...C,
+			ref: w,
+			type: "tel",
+			inputMode: "tel",
+			value: d,
+			onChange: f,
+			onBlur: R,
+			disabled: g,
+			readOnly: b,
+			"aria-invalid": x || C["aria-invalid"] || void 0,
+			className: A.phoneNumber
+		})]
+	});
+}), ee = f(function({ id: e, value: t, onValueChange: i, placeholder: a, displayFormat: o, minuteStep: s = 15, withSeconds: u = !1, disabled: d, invalid: f, className: m, "aria-labelledby": h, "aria-describedby": g, "aria-invalid": _, "aria-required": b }, x) {
+	let S = f || _ === !0 || _ === "true", C = t ? new Date(t) : void 0, w = C && !Number.isNaN(C.getTime()) ? C : void 0, T = {
+		hours: w?.getHours() ?? 0,
+		minutes: w?.getMinutes() ?? 0,
+		seconds: w?.getSeconds() ?? 0
+	}, E = p((e) => {
+		if (!(e instanceof Date)) {
+			i?.(void 0);
+			return;
+		}
+		let t = new Date(e);
+		t.setHours(T.hours, T.minutes, T.seconds ?? 0, 0), i?.(t.toISOString());
+	}, [
+		i,
+		T.hours,
+		T.minutes,
+		T.seconds
+	]), D = p((e) => {
+		let t = new Date(w ?? /* @__PURE__ */ new Date());
+		t.setHours(e.hours, e.minutes, e.seconds ?? 0, 0), i?.(t.toISOString());
+	}, [i, w]);
+	return /* @__PURE__ */ y(r, {
+		ref: x,
+		direction: "horizontal",
+		gap: "sm",
+		align: "center",
+		className: n("date-time-input--component", m),
+		children: [/* @__PURE__ */ v(l, {
+			id: e,
+			value: w,
+			onValueChange: E,
+			placeholder: a,
+			displayFormat: o,
+			disabled: d,
+			invalid: S,
+			"aria-labelledby": h,
+			"aria-describedby": g,
+			"aria-required": b
+		}), /* @__PURE__ */ v(c, {
+			value: T,
+			onValueChange: D,
+			minuteStep: s,
+			withSeconds: u,
+			disabled: d,
+			invalid: S,
+			"aria-labelledby": h,
+			"aria-describedby": g,
+			"aria-required": b
+		})]
+	});
+});
+//#endregion
+export { W as a, M as c, O as d, E as f, U as i, j as l, X as n, V as o, k as p, H as r, P as s, ee as t, D as u };