@ryuzaki13/react-foundation-ui 1.0.8 → 1.0.12

package/dist/date-time-input/index.js

@@ -1,2 +1,458 @@
-import { t as e } from "../chunks/SingleDateTimeInput-kXrkLAAI.js";
-export { e as SingleDateTimeInput };
+import { r as e } from "../chunks/popover-xJJqy1v6.js";
+import { t } from "../chunks/ui.module-BisoTevy.js";
+import { n } from "../chunks/button-CC0Jdx1j.js";
+import { i as r, l as i, s as a } from "../chunks/input-CZLUUggm.js";
+import { t as o } from "../chunks/CalendarView-DCQjO2ho.js";
+import { t as s } from "../chunks/wheel-picker-FS58cRsQ.js";
+import { useCallback as c, useEffect as l, useEffectEvent as u, useMemo as d, useRef as f, useState as p } from "react";
+import { cn as m } from "@ryuzaki13/react-foundation-lib/utils";
+import { createCalendarDate as h, getStartOfDay as g, isDateRangeTuple as _, parseDate as v } from "@ryuzaki13/react-foundation-lib/formatters";
+import { CalendarDaysIcon as y, Clock3Icon as b } from "lucide-react";
+import { jsx as x, jsxs as S } from "react/jsx-runtime";
+import { areAllDateSegmentsEmpty as C, dateToIndexedSegmentValues as w, indexedSegmentsToDate as T, parseDateSegmentMask as E } from "@ryuzaki13/react-foundation-lib/date-segments";
+//#region src/date-time-input/lib/dateTimeValue.ts
+var D = "dd.MM.yyyy HH:mm", O = "HH:mm", k = 1970, A = 0, j = 1;
+E(O);
+function M(e = 0, t = 0) {
+	return h(k, A, j, e, t, 0, 0);
+}
+function N(e = "date-time") {
+	return e === "time" ? O : D;
+}
+function P(e, t = "date-time") {
+	if (e == null) return null;
+	let n = v(e);
+	return n ? t === "time" ? M(n.getHours(), n.getMinutes()) : n : null;
+}
+function F(e, t, n, r = "date-time") {
+	let i = P(e, r);
+	if (!i) return !1;
+	if (r === "time") {
+		let e = i.getHours() * 60 + i.getMinutes(), r = t ? P(t, "time") : null, a = n ? P(n, "time") : null;
+		return !(r && e < r.getHours() * 60 + r.getMinutes() || a && e > a.getHours() * 60 + a.getMinutes());
+	}
+	return !(t && i < t || n && i > n);
+}
+function I(e, t) {
+	let n = P(t), r = n?.getHours() ?? 0, i = n?.getMinutes() ?? 0;
+	return h(e.getFullYear(), e.getMonth(), e.getDate(), r, i, 0, 0);
+}
+function L(e, t, n, r = "date-time") {
+	return r === "time" ? M(t, n) : h(e.getFullYear(), e.getMonth(), e.getDate(), t, n, 0, 0);
+}
+function R(e, t, n = "date-time") {
+	return n === "time" ? P(e, "time") ?? M() : P(e, n) ?? t;
+}
+function z(e, t, n, r = "date-time") {
+	let i = P(e, r) ?? e, a = t ? P(t, r) : null, o = n ? P(n, r) : null, s = !!a && i.getFullYear() === a.getFullYear() && i.getMonth() === a.getMonth() && i.getDate() === a.getDate(), c = !!o && i.getFullYear() === o.getFullYear() && i.getMonth() === o.getMonth() && i.getDate() === o.getDate(), l = s ? a.getHours() : 0, u = c ? o.getHours() : 23, d = s && l === u ? a.getMinutes() : 0, f = c && l === u ? o.getMinutes() : 59, p = l > u || l === u && d > f;
+	return {
+		disabled: p,
+		minHour: l,
+		maxHour: u,
+		minMinuteByHour: (e) => p ? 0 : s && e === l ? a.getMinutes() : 0,
+		maxMinuteByHour: (e) => p ? 59 : c && e === u ? o.getMinutes() : 59
+	};
+}
+function B(e, t, n, r, i, a = "date-time") {
+	let o = z(e, r, i, a);
+	if (o.disabled) return {
+		hours: 0,
+		minutes: 0
+	};
+	let s = Math.min(Math.max(t, o.minHour), o.maxHour), c = o.minMinuteByHour(s), l = o.maxMinuteByHour(s);
+	return {
+		hours: s,
+		minutes: Math.min(Math.max(n, c), l)
+	};
+}
+//#endregion
+//#region src/date-time-input/lib/timePanelState.ts
+function V(e, t, n, r = "date-time") {
+	let i = z(e, t, n, r), a = e.getHours(), o = e.getMinutes(), s = i.minMinuteByHour(a), c = i.maxMinuteByHour(a);
+	return i.disabled ? {
+		disabled: !0,
+		selectedHour: a,
+		selectedMinute: o,
+		hours: [],
+		minutes: []
+	} : {
+		disabled: !1,
+		selectedHour: a,
+		selectedMinute: o,
+		hours: Array.from({ length: i.maxHour - i.minHour + 1 }, (e, t) => i.minHour + t),
+		minutes: Array.from({ length: c - s + 1 }, (e, t) => s + t)
+	};
+}
+//#endregion
+//#region src/date-time-input/model/useDateTimeSegments.ts
+function H(e) {
+	let t = [];
+	return e.forEach((e, n) => {
+		e.kind === "editable" && t.push(n);
+	}), t;
+}
+function ee({ value: e, onChange: t, onClearError: n, disabled: r, minDate: i, maxDate: a, mode: o = "date-time" }) {
+	let s = d(() => N(o), [o]), m = d(() => E(s), [s]), h = d(() => H(m), [m]), g = d(() => w(e ?? null, m), [m, e]), [_, v] = p(null), y = e?.getTime() ?? null, b = u((e) => v(e));
+	l(() => {
+		b(null);
+	}, [y, o]);
+	let x = _ ?? g, S = f(/* @__PURE__ */ new Map()), D = f(0), O = c((n) => {
+		if (C(m, n)) return t(null), null;
+		let r = T(m, n, { defaultDate: o === "time" ? P(e, "time") ?? M() : void 0 });
+		return !r || !F(r, i, a, o) ? null : (t(r), r);
+	}, [
+		a,
+		i,
+		o,
+		t,
+		m,
+		e
+	]), k = c((e, t = !0) => {
+		let n = S.current.get(e);
+		n && (n.focus(), t && requestAnimationFrame(() => n.select()));
+	}, []), A = c((e) => {
+		let t = h.indexOf(e);
+		return t < h.length - 1 ? h[t + 1] : null;
+	}, [h]), j = c((e) => {
+		let t = h.indexOf(e);
+		return t > 0 ? h[t - 1] : null;
+	}, [h]), I = c((e, t) => e.padStart(t.length, "0"), []);
+	return {
+		segments: m,
+		segmentValues: x,
+		registerRef: c((e) => (t) => {
+			if (t) {
+				S.current.set(e, t);
+				return;
+			}
+			S.current.delete(e);
+		}, []),
+		handleInput: c((e) => (t) => {
+			if (r) return;
+			let i = m[e];
+			if (i.kind !== "editable") return;
+			let a = t.target.value.replace(/\D/g, "").slice(0, i.length), o = new Map(x);
+			if (o.set(e, a), v(o), n?.(), a.length === i.length) {
+				let t = A(e);
+				t !== null && requestAnimationFrame(() => k(t));
+			}
+			O(o);
+		}, [
+			r,
+			k,
+			A,
+			n,
+			x,
+			m,
+			O
+		]),
+		handleKeyDown: c((e) => (t) => {
+			if (r) return;
+			let n = m[e];
+			if (n.kind !== "editable") return;
+			let i = x.get(e) ?? "", a = t.currentTarget;
+			switch (t.key) {
+				case "ArrowRight":
+					if (a.selectionStart === i.length || i === "") {
+						t.preventDefault();
+						let n = A(e);
+						n !== null && k(n);
+					}
+					break;
+				case "ArrowLeft":
+					if (a.selectionStart === 0 || i === "") {
+						t.preventDefault();
+						let n = j(e);
+						n !== null && k(n);
+					}
+					break;
+				case "ArrowUp": {
+					t.preventDefault();
+					let r = i === "" ? n.min : Number.parseInt(i, 10) + 1;
+					r > n.max && (r = n.min);
+					let o = new Map(x);
+					o.set(e, I(String(r), n)), v(o), O(o), requestAnimationFrame(() => a.select());
+					break;
+				}
+				case "ArrowDown": {
+					t.preventDefault();
+					let r = i === "" ? n.max : Number.parseInt(i, 10) - 1;
+					r < n.min && (r = n.max);
+					let o = new Map(x);
+					o.set(e, I(String(r), n)), v(o), O(o), requestAnimationFrame(() => a.select());
+					break;
+				}
+				case "Backspace":
+					if (i === "") {
+						t.preventDefault();
+						let n = j(e);
+						n !== null && k(n);
+					}
+					break;
+				case "Delete": {
+					t.preventDefault();
+					let n = new Map(x);
+					n.set(e, ""), v(n), O(n);
+					break;
+				}
+			}
+		}, [
+			r,
+			k,
+			A,
+			j,
+			I,
+			x,
+			m,
+			O
+		]),
+		handleFocus: c(() => (e) => {
+			e.target.select();
+		}, []),
+		handleContainerFocus: c(() => {
+			clearTimeout(D.current);
+		}, []),
+		handleContainerBlur: c(() => {
+			let n = new Map(x);
+			D.current = window.setTimeout(() => {
+				if (C(m, n)) {
+					t(null), v(n);
+					return;
+				}
+				let r = T(m, n, { defaultDate: o === "time" ? P(e, "time") ?? M() : void 0 });
+				if (!r || !F(r, i, a, o)) {
+					v(null);
+					return;
+				}
+				v(n);
+			}, 0);
+		}, [
+			a,
+			i,
+			o,
+			t,
+			x,
+			m,
+			e
+		]),
+		focusFirstEmpty: c(() => {
+			let e = h.find((e) => !(x.get(e) ?? "")) ?? h[h.length - 1];
+			e !== void 0 && k(e);
+		}, [
+			h,
+			k,
+			x
+		])
+	};
+}
+var U = {
+	segmentInput: "AvG-mf",
+	separator: "ig7KtT",
+	calendarButton: "RTruv0",
+	popoverContent: "YQHPZa",
+	bottom: "-RZe-i",
+	right: "Ox0SRE",
+	calendarPane: "gfaRup",
+	timePanelPane: "_59kEea",
+	timeOnlyPopoverContent: "Jjdu1Q",
+	timePanelPaneBottom: "Q8Y2xS",
+	timePanelPaneRight: "XxZYTW"
+}, W = {
+	timePanel: "_5-SSnO",
+	hint: "s1NHua",
+	fields: "KQC9-8",
+	field: "WDu02W",
+	label: "_9mEhfD",
+	wheel: "N-Fzjk"
+};
+//#endregion
+//#region src/date-time-input/ui/TimePanel.tsx
+function G({ value: e, disabled: t, minDate: n, maxDate: r, mode: i = "date-time", onChange: a }) {
+	let o = V(e, n, r, i), c = (e) => String(e).padStart(2, "0");
+	return o.disabled ? /* @__PURE__ */ x("div", {
+		className: W.timePanel,
+		children: /* @__PURE__ */ x("p", {
+			className: W.hint,
+			children: "Для выбранного дня нет доступного времени в заданном диапазоне."
+		})
+	}) : /* @__PURE__ */ x("div", {
+		className: W.timePanel,
+		children: /* @__PURE__ */ S("div", {
+			className: W.fields,
+			children: [/* @__PURE__ */ S("label", {
+				className: W.field,
+				children: [/* @__PURE__ */ x("span", {
+					className: W.label,
+					children: "Часы"
+				}), /* @__PURE__ */ x(s, {
+					className: W.wheel,
+					items: o.hours,
+					value: o.selectedHour,
+					onChange: (e) => a(e, o.selectedMinute),
+					ariaLabel: "Выбор часов",
+					disabled: t,
+					formatItem: c
+				})]
+			}), /* @__PURE__ */ S("label", {
+				className: W.field,
+				children: [/* @__PURE__ */ x("span", {
+					className: W.label,
+					children: "Минуты"
+				}), /* @__PURE__ */ x(s, {
+					className: W.wheel,
+					items: o.minutes,
+					value: o.selectedMinute,
+					onChange: (e) => a(o.selectedHour, e),
+					ariaLabel: "Выбор минут",
+					disabled: t,
+					formatItem: c
+				})]
+			})]
+		})
+	});
+}
+//#endregion
+//#region src/date-time-input/ui/SingleDateTimeInput.tsx
+function K({ value: s, onChange: c, label: f, description: h, placeholder: v, disabled: C, size: w, error: T, onClearError: E, minDate: D, maxDate: O, timePanelPlacement: k = "right", mode: A = "date-time" }) {
+	let j = P(s, A), M = j?.getTime() ?? null, N = d(() => g(/* @__PURE__ */ new Date()), []), [z, V] = p(!1), [H, W] = p(j ?? null), [K, te] = p("day"), [q, J] = p(() => R(j, N, A)), { controlId: Y, labelId: X, descriptionId: ne, errorId: re, describedBy: ie } = i({
+		hasLabel: f != null,
+		hasDescription: !!h,
+		hasError: !!T
+	}), ae = u((e) => W(e)), Z = u((e) => J(e));
+	l(() => {
+		z || ae(j ?? null), j && Z(j);
+	}, [
+		j,
+		M,
+		z
+	]), l(() => {
+		j && Z(j);
+	}, [j, M]);
+	let { segments: oe, segmentValues: se, registerRef: ce, handleInput: le, handleKeyDown: ue, handleFocus: de, handleContainerFocus: fe, handleContainerBlur: pe, focusFirstEmpty: me } = ee({
+		value: j,
+		onChange: c,
+		onClearError: E,
+		disabled: C,
+		minDate: D,
+		maxDate: O,
+		mode: A
+	}), he = (e) => {
+		if (A === "time" || _(e) || C) return;
+		let t = I(e, H ?? j ?? q), { hours: n, minutes: r } = B(e, t.getHours(), t.getMinutes(), D, O, A), i = L(e, n, r);
+		F(i, D, O, A) && (E?.(), W(i), J(i));
+	}, Q = (e, t) => {
+		if (C) return;
+		let n = H ?? j ?? q, r = B(n, e, t, D, O, A), i = L(n, r.hours, r.minutes, A);
+		F(i, D, O, A) && (E?.(), W(i), J(i));
+	}, ge = (e) => {
+		e && (W(j ?? null), J(R(j, N, A))), V(e);
+	}, _e = () => {
+		(j?.getTime() ?? null) !== (H?.getTime() ?? null) && c(H);
+	}, ve = k === "right" ? U.timePanelPaneRight : U.timePanelPaneBottom, ye = A === "time" ? "Открыть выбор времени" : "Открыть календарь даты и времени", be = v ?? (A === "time" ? "чч:мм" : "дд.мм.гггг чч:мм"), $ = H ?? j ?? q;
+	return /* @__PURE__ */ S(e, {
+		open: z,
+		onOpenChange: ge,
+		children: [/* @__PURE__ */ x(a, {
+			label: f,
+			description: h,
+			disabled: C,
+			size: w,
+			error: T,
+			controlId: Y,
+			labelId: X,
+			descriptionId: ne,
+			errorId: re,
+			children: /* @__PURE__ */ x(r, {
+				endAdornmentWidth: "var(--control-height)",
+				endAdornment: /* @__PURE__ */ x(e.Trigger, { children: /* @__PURE__ */ x(n, {
+					variant: "transparent",
+					disabled: C,
+					className: U.calendarButton,
+					icon: x(A === "time" ? b : y, {}),
+					"aria-label": ye
+				}) }),
+				children: ({ controlClassName: e }) => /* @__PURE__ */ x("div", {
+					id: Y,
+					className: m(t.uiInputControlFake, e),
+					"data-disabled": C || void 0,
+					"data-invalid": T ? "" : void 0,
+					role: "group",
+					"aria-invalid": !!T || void 0,
+					"aria-placeholder": be,
+					"aria-labelledby": X,
+					"aria-describedby": ie,
+					onFocus: fe,
+					onBlur: pe,
+					onClick: (e) => {
+						e.target === e.currentTarget && me();
+					},
+					children: oe.map((e, t) => e.kind === "literal" ? /* @__PURE__ */ x("span", {
+						className: U.separator,
+						"data-disabled": C || void 0,
+						children: e.text
+					}, t) : /* @__PURE__ */ x("input", {
+						ref: ce(t),
+						type: "text",
+						inputMode: "numeric",
+						className: U.segmentInput,
+						style: { width: `${e.length + .5}ch` },
+						value: se.get(t) ?? "",
+						placeholder: e.placeholder,
+						maxLength: e.length,
+						disabled: C,
+						"aria-label": e.ariaLabel,
+						autoComplete: "off",
+						onChange: le(t),
+						onKeyDown: ue(t),
+						onFocus: de()
+					}, t))
+				})
+			})
+		}), /* @__PURE__ */ x(e.Content, {
+			background: "primary",
+			onClose: _e,
+			children: A === "time" ? /* @__PURE__ */ x("div", {
+				className: U.timeOnlyPopoverContent,
+				children: /* @__PURE__ */ x(G, {
+					value: $,
+					disabled: C,
+					minDate: D,
+					maxDate: O,
+					mode: A,
+					onChange: Q
+				})
+			}) : /* @__PURE__ */ S("div", {
+				className: m(U.popoverContent, U[k]),
+				children: [/* @__PURE__ */ x("div", {
+					className: U.calendarPane,
+					children: /* @__PURE__ */ x(o, {
+						view: K,
+						datePickerLevel: "day",
+						selectionMode: "day",
+						onViewChange: te,
+						value: $,
+						onChange: he,
+						minDate: D,
+						maxDate: O,
+						currentDate: q,
+						onCurrentDateChange: J
+					})
+				}), /* @__PURE__ */ x("div", {
+					className: m(U.timePanelPane, ve),
+					children: /* @__PURE__ */ x(G, {
+						value: $,
+						disabled: C,
+						minDate: D,
+						maxDate: O,
+						mode: A,
+						onChange: Q
+					})
+				})]
+			})
+		})]
+	});
+}
+//#endregion
+export { K as SingleDateTimeInput };
+
+//# sourceMappingURL=index.js.map

package/dist/date-time-input/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":[],"sources":["../../src/date-time-input/lib/dateTimeValue.ts","../../src/date-time-input/lib/timePanelState.ts","../../src/date-time-input/model/useDateTimeSegments.ts","../../src/date-time-input/ui/SingleDateTimeInput.module.scss","../../src/date-time-input/ui/TimePanel.module.scss","../../src/date-time-input/ui/TimePanel.tsx","../../src/date-time-input/ui/SingleDateTimeInput.tsx"],"sourcesContent":["import { dateToIndexedSegmentValues, indexedSegmentsToDate, parseDateSegmentMask } from \"@ryuzaki13/react-foundation-lib/date-segments\";\nimport {\n\tcreateCalendarDate,\n\ttype DateFormatPreset,\n\tformatDate,\n\tparseDate,\n\tparseDateByPattern\n} from \"@ryuzaki13/react-foundation-lib/formatters\";\n\nexport type DateTimeInputMode = \"date-time\" | \"time\";\n\n/**\n * Фиксированный формат нового поля даты-времени.\n */\nexport const DATE_TIME_INPUT_FORMAT = \"dd.MM.yyyy HH:mm\";\nexport const TIME_INPUT_FORMAT = \"HH:mm\";\n\nconst DATE_TIME_INPUT_PRESET_NAME = \"__date_time_input__\";\nconst TIME_INPUT_PRESET_NAME = \"__time_input__\";\nconst TIME_ONLY_BASE_YEAR = 1970;\nconst TIME_ONLY_BASE_MONTH = 0;\nconst TIME_ONLY_BASE_DAY = 1;\nconst TIME_SEGMENTS = parseDateSegmentMask(TIME_INPUT_FORMAT);\n\n/**\n * Создаёт техническую базовую дату для режима выбора только времени.\n */\nexport function createTimeOnlyBaseDate(hours = 0, minutes = 0): Date {\n\treturn createCalendarDate(TIME_ONLY_BASE_YEAR, TIME_ONLY_BASE_MONTH, TIME_ONLY_BASE_DAY, hours, minutes, 0, 0);\n}\n\n/**\n * Возвращает формат пользовательского ввода для выбранного режима.\n */\nexport function getDateTimeInputFormat(mode: DateTimeInputMode = \"date-time\"): string {\n\treturn mode === \"time\" ? TIME_INPUT_FORMAT : DATE_TIME_INPUT_FORMAT;\n}\n\n/**\n * Создаёт временную предустановку форматирования для нового поля даты-времени.\n */\nexport function createDateTimeInputPreset(mode: DateTimeInputMode = \"date-time\"): DateFormatPreset {\n\treturn {\n\t\tname: mode === \"time\" ? TIME_INPUT_PRESET_NAME : DATE_TIME_INPUT_PRESET_NAME,\n\t\tpattern: getDateTimeInputFormat(mode),\n\t\tlocale: \"ru-RU\",\n\t\tinvalidFallback: \"\"\n\t};\n}\n\n/**\n * Нормализует внешнее значение к валидному Date без timezone-сдвига.\n */\nexport function normalizeDateTimeValue(value: Date | null | undefined, mode: DateTimeInputMode = \"date-time\"): Date | null {\n\tif (value == null) return null;\n\n\tconst parsedValue = parseDate(value);\n\tif (!parsedValue) return null;\n\n\tif (mode === \"time\") {\n\t\treturn createTimeOnlyBaseDate(parsedValue.getHours(), parsedValue.getMinutes());\n\t}\n\n\treturn parsedValue;\n}\n\n/**\n * Форматирует значение поля даты-времени в фиксированный пользовательский формат.\n */\nexport function formatDateTimeInputValue(value: Date | null | undefined, mode: DateTimeInputMode = \"date-time\"): string {\n\tif (!value) return \"\";\n\treturn formatDate(normalizeDateTimeValue(value, mode), createDateTimeInputPreset(mode));\n}\n\n/**\n * Строго парсит строку пользовательского ввода в Date.\n */\nexport function parseDateTimeInputValue(value: string, mode: DateTimeInputMode = \"date-time\"): Date | null {\n\tif (mode === \"time\") {\n\t\tconst match = /^\\d{2}:\\d{2}$/.exec(value.trim());\n\t\tif (!match) return null;\n\n\t\tconst values = dateToIndexedSegmentValues(createTimeOnlyBaseDate(), TIME_SEGMENTS);\n\t\tvalues.set(0, value.slice(0, 2));\n\t\tvalues.set(2, value.slice(3, 5));\n\n\t\treturn indexedSegmentsToDate(TIME_SEGMENTS, values, {\n\t\t\tdefaultDate: createTimeOnlyBaseDate()\n\t\t});\n\t}\n\n\tconst parsed = parseDateByPattern(value, DATE_TIME_INPUT_FORMAT);\n\tif (!parsed || parsed.kind !== \"date-time\") return null;\n\n\treturn parsed.date;\n}\n\n/**\n * Проверяет, попадает ли дата-время в допустимый диапазон.\n */\nexport function isDateTimeWithinRange(value: Date, minDate?: Date, maxDate?: Date, mode: DateTimeInputMode = \"date-time\"): boolean {\n\tconst normalizedValue = normalizeDateTimeValue(value, mode);\n\tif (!normalizedValue) return false;\n\n\tif (mode === \"time\") {\n\t\tconst valueMinutes = normalizedValue.getHours() * 60 + normalizedValue.getMinutes();\n\t\tconst normalizedMinDate = minDate ? normalizeDateTimeValue(minDate, \"time\") : null;\n\t\tconst normalizedMaxDate = maxDate ? normalizeDateTimeValue(maxDate, \"time\") : null;\n\n\t\tif (normalizedMinDate) {\n\t\t\tconst minMinutes = normalizedMinDate.getHours() * 60 + normalizedMinDate.getMinutes();\n\t\t\tif (valueMinutes < minMinutes) return false;\n\t\t}\n\n\t\tif (normalizedMaxDate) {\n\t\t\tconst maxMinutes = normalizedMaxDate.getHours() * 60 + normalizedMaxDate.getMinutes();\n\t\t\tif (valueMinutes > maxMinutes) return false;\n\t\t}\n\n\t\treturn true;\n\t}\n\n\tif (minDate && normalizedValue < minDate) return false;\n\tif (maxDate && normalizedValue > maxDate) return false;\n\n\treturn true;\n}\n\n/**\n * Переносит дату выбранного дня, сохраняя часы и минуты базового значения.\n */\nexport function mergeDateWithTime(datePart: Date, timeSource?: Date | null): Date {\n\tconst source = normalizeDateTimeValue(timeSource);\n\tconst hours = source?.getHours() ?? 0;\n\tconst minutes = source?.getMinutes() ?? 0;\n\n\treturn createCalendarDate(datePart.getFullYear(), datePart.getMonth(), datePart.getDate(), hours, minutes, 0, 0);\n}\n\n/**\n * Переносит часы и минуты в базовую календарную дату.\n */\nexport function mergeTimeIntoDate(baseDate: Date, hours: number, minutes: number, mode: DateTimeInputMode = \"date-time\"): Date {\n\tif (mode === \"time\") {\n\t\treturn createTimeOnlyBaseDate(hours, minutes);\n\t}\n\n\treturn createCalendarDate(baseDate.getFullYear(), baseDate.getMonth(), baseDate.getDate(), hours, minutes, 0, 0);\n}\n\n/**\n * Создаёт рабочую дату для picker-сценариев без выбранного значения.\n */\nexport function resolvePickerBaseDate(value: Date | null | undefined, fallbackDate: Date, mode: DateTimeInputMode = \"date-time\"): Date {\n\tif (mode === \"time\") {\n\t\treturn normalizeDateTimeValue(value, \"time\") ?? createTimeOnlyBaseDate();\n\t}\n\n\treturn normalizeDateTimeValue(value, mode) ?? fallbackDate;\n}\n\n/**\n * Возвращает границы часов и минут для выбранного календарного дня.\n */\nexport function getTimeRangeForDay(\n\tday: Date,\n\tminDate?: Date,\n\tmaxDate?: Date,\n\tmode: DateTimeInputMode = \"date-time\"\n): {\n\tdisabled: boolean;\n\tminHour: number;\n\tmaxHour: number;\n\tminMinuteByHour: (hour: number) => number;\n\tmaxMinuteByHour: (hour: number) => number;\n} {\n\tconst normalizedDay = normalizeDateTimeValue(day, mode) ?? day;\n\tconst normalizedMinDate = minDate ? normalizeDateTimeValue(minDate, mode) : null;\n\tconst normalizedMaxDate = maxDate ? normalizeDateTimeValue(maxDate, mode) : null;\n\tconst isSameMinDay =\n\t\t!!normalizedMinDate &&\n\t\tnormalizedDay.getFullYear() === normalizedMinDate.getFullYear() &&\n\t\tnormalizedDay.getMonth() === normalizedMinDate.getMonth() &&\n\t\tnormalizedDay.getDate() === normalizedMinDate.getDate();\n\tconst isSameMaxDay =\n\t\t!!normalizedMaxDate &&\n\t\tnormalizedDay.getFullYear() === normalizedMaxDate.getFullYear() &&\n\t\tnormalizedDay.getMonth() === normalizedMaxDate.getMonth() &&\n\t\tnormalizedDay.getDate() === normalizedMaxDate.getDate();\n\n\tconst minHour = isSameMinDay ? normalizedMinDate!.getHours() : 0;\n\tconst maxHour = isSameMaxDay ? normalizedMaxDate!.getHours() : 23;\n\tconst minMinuteAtBoundary = isSameMinDay && minHour === maxHour ? normalizedMinDate!.getMinutes() : 0;\n\tconst maxMinuteAtBoundary = isSameMaxDay && minHour === maxHour ? normalizedMaxDate!.getMinutes() : 59;\n\tconst disabled = minHour > maxHour || (minHour === maxHour && minMinuteAtBoundary > maxMinuteAtBoundary);\n\n\treturn {\n\t\tdisabled,\n\t\tminHour,\n\t\tmaxHour,\n\t\tminMinuteByHour: (hour) => {\n\t\t\tif (disabled) return 0;\n\t\t\treturn isSameMinDay && hour === minHour ? normalizedMinDate!.getMinutes() : 0;\n\t\t},\n\t\tmaxMinuteByHour: (hour) => {\n\t\t\tif (disabled) return 59;\n\t\t\treturn isSameMaxDay && hour === maxHour ? normalizedMaxDate!.getMinutes() : 59;\n\t\t}\n\t};\n}\n\n/**\n * Ограничивает часы и минуты допустимым диапазоном текущего дня.\n */\nexport function clampTimeForDay(\n\tday: Date,\n\thours: number,\n\tminutes: number,\n\tminDate?: Date,\n\tmaxDate?: Date,\n\tmode: DateTimeInputMode = \"date-time\"\n): { hours: number; minutes: number } {\n\tconst range = getTimeRangeForDay(day, minDate, maxDate, mode);\n\tif (range.disabled) {\n\t\treturn { hours: 0, minutes: 0 };\n\t}\n\n\tconst clampedHour = Math.min(Math.max(hours, range.minHour), range.maxHour);\n\tconst minMinute = range.minMinuteByHour(clampedHour);\n\tconst maxMinute = range.maxMinuteByHour(clampedHour);\n\tconst clampedMinute = Math.min(Math.max(minutes, minMinute), maxMinute);\n\n\treturn {\n\t\thours: clampedHour,\n\t\tminutes: clampedMinute\n\t};\n}\n","import { getTimeRangeForDay } from \"./dateTimeValue\";\n\nimport type { DateTimeInputMode } from \"./dateTimeValue\";\n\n/**\n * Состояние и доступные значения для панели выбора времени.\n */\nexport interface TimePanelState {\n\tdisabled: boolean;\n\tselectedHour: number;\n\tselectedMinute: number;\n\thours: number[];\n\tminutes: number[];\n}\n\n/**\n * Собирает состояние часов и минут для панели выбора времени.\n */\nexport function buildTimePanelState(value: Date, minDate?: Date, maxDate?: Date, mode: DateTimeInputMode = \"date-time\"): TimePanelState {\n\tconst timeRange = getTimeRangeForDay(value, minDate, maxDate, mode);\n\tconst selectedHour = value.getHours();\n\tconst selectedMinute = value.getMinutes();\n\tconst minuteMin = timeRange.minMinuteByHour(selectedHour);\n\tconst minuteMax = timeRange.maxMinuteByHour(selectedHour);\n\n\tif (timeRange.disabled) {\n\t\treturn {\n\t\t\tdisabled: true,\n\t\t\tselectedHour,\n\t\t\tselectedMinute,\n\t\t\thours: [],\n\t\t\tminutes: []\n\t\t};\n\t}\n\n\treturn {\n\t\tdisabled: false,\n\t\tselectedHour,\n\t\tselectedMinute,\n\t\thours: Array.from({ length: timeRange.maxHour - timeRange.minHour + 1 }, (_, index) => timeRange.minHour + index),\n\t\tminutes: Array.from({ length: minuteMax - minuteMin + 1 }, (_, index) => minuteMin + index)\n\t};\n}\n","import type { ChangeEvent, FocusEvent, KeyboardEvent } from \"react\";\nimport { useCallback, useEffect, useEffectEvent, useMemo, useRef, useState } from \"react\";\n\nimport {\n\tareAllDateSegmentsEmpty,\n\tdateToIndexedSegmentValues,\n\ttype EditableDateSegment,\n\tindexedSegmentsToDate,\n\tparseDateSegmentMask\n} from \"@ryuzaki13/react-foundation-lib/date-segments\";\n\nimport { createTimeOnlyBaseDate, getDateTimeInputFormat, isDateTimeWithinRange, normalizeDateTimeValue } from \"../lib\";\n\nimport type { DateTimeInputMode } from \"../lib\";\n\ninterface UseDateTimeSegmentsOptions {\n\tvalue: Date | null | undefined;\n\tonChange: (value: Date | null) => void;\n\tonClearError?: () => void;\n\tdisabled?: boolean;\n\tminDate?: Date;\n\tmaxDate?: Date;\n\tmode?: DateTimeInputMode;\n}\n\nfunction resolveEditableIndices(segments: readonly { kind: string }[]): number[] {\n\tconst indices: number[] = [];\n\n\tsegments.forEach((segment, index) => {\n\t\tif (segment.kind === \"editable\") {\n\t\t\tindices.push(index);\n\t\t}\n\t});\n\n\treturn indices;\n}\n\n/**\n * Управляет сегментным вводом фиксированного формата даты-времени или только времени.\n */\nexport function useDateTimeSegments({\n\tvalue,\n\tonChange,\n\tonClearError,\n\tdisabled,\n\tminDate,\n\tmaxDate,\n\tmode = \"date-time\"\n}: UseDateTimeSegmentsOptions) {\n\tconst inputFormat = useMemo(() => getDateTimeInputFormat(mode), [mode]);\n\tconst segments = useMemo(() => parseDateSegmentMask(inputFormat), [inputFormat]);\n\tconst editableIndices = useMemo(() => resolveEditableIndices(segments), [segments]);\n\tconst committedValues = useMemo(() => dateToIndexedSegmentValues(value ?? null, segments), [segments, value]);\n\tconst [dirtyValues, setDirtyValues] = useState<Map<number, string> | null>(null);\n\tconst currentValueTime = value?.getTime() ?? null;\n\n\tconst syncDirtyValues = useEffectEvent((values: Map<number, string> | null) => setDirtyValues(values));\n\n\tuseEffect(() => {\n\t\tsyncDirtyValues(null);\n\t}, [currentValueTime, mode]);\n\n\tconst segmentValues = dirtyValues ?? committedValues;\n\tconst refsMap = useRef<Map<number, HTMLInputElement>>(new Map());\n\tconst blurTimeout = useRef<number>(0);\n\n\t/**\n\t * Пытается собрать и отдать наружу новое значение поля.\n\t */\n\tconst tryCommit = useCallback(\n\t\t(updatedValues: Map<number, string>) => {\n\t\t\tif (areAllDateSegmentsEmpty(segments, updatedValues)) {\n\t\t\t\tonChange(null);\n\t\t\t\treturn null;\n\t\t\t}\n\n\t\t\tconst nextDate = indexedSegmentsToDate(segments, updatedValues, {\n\t\t\t\tdefaultDate: mode === \"time\" ? (normalizeDateTimeValue(value, \"time\") ?? createTimeOnlyBaseDate()) : undefined\n\t\t\t});\n\t\t\tif (!nextDate) return null;\n\t\t\tif (!isDateTimeWithinRange(nextDate, minDate, maxDate, mode)) return null;\n\n\t\t\tonChange(nextDate);\n\t\t\treturn nextDate;\n\t\t},\n\t\t[maxDate, minDate, mode, onChange, segments, value]\n\t);\n\n\t/**\n\t * Фокусирует конкретный редактируемый сегмент.\n\t */\n\tconst focusSegment = useCallback((index: number, selectAll = true) => {\n\t\tconst element = refsMap.current.get(index);\n\t\tif (!element) return;\n\n\t\telement.focus();\n\t\tif (selectAll) {\n\t\t\trequestAnimationFrame(() => element.select());\n\t\t}\n\t}, []);\n\n\t/**\n\t * Возвращает индекс следующего редактируемого сегмента.\n\t */\n\tconst getNextEditable = useCallback(\n\t\t(currentIndex: number): number | null => {\n\t\t\tconst position = editableIndices.indexOf(currentIndex);\n\t\t\treturn position < editableIndices.length - 1 ? editableIndices[position + 1] : null;\n\t\t},\n\t\t[editableIndices]\n\t);\n\n\t/**\n\t * Возвращает индекс предыдущего редактируемого сегмента.\n\t */\n\tconst getPreviousEditable = useCallback(\n\t\t(currentIndex: number): number | null => {\n\t\t\tconst position = editableIndices.indexOf(currentIndex);\n\t\t\treturn position > 0 ? editableIndices[position - 1] : null;\n\t\t},\n\t\t[editableIndices]\n\t);\n\n\t/**\n\t * Дополняет неполный сегмент ведущими нулями.\n\t */\n\tconst padValue = useCallback((valueToPad: string, segment: EditableDateSegment) => valueToPad.padStart(segment.length, \"0\"), []);\n\n\t/**\n\t * Регистрирует DOM-ссылку сегмента по индексу.\n\t */\n\tconst registerRef = useCallback(\n\t\t(index: number) => (element: HTMLInputElement | null) => {\n\t\t\tif (element) {\n\t\t\t\trefsMap.current.set(index, element);\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\trefsMap.current.delete(index);\n\t\t},\n\t\t[]\n\t);\n\n\t/**\n\t * Обрабатывает печать внутри отдельного сегмента.\n\t */\n\tconst handleInput = useCallback(\n\t\t(index: number) => (event: ChangeEvent<HTMLInputElement>) => {\n\t\t\tif (disabled) return;\n\n\t\t\tconst segment = segments[index];\n\t\t\tif (segment.kind !== \"editable\") return;\n\n\t\t\tconst rawValue = event.target.value.replace(/\\D/g, \"\");\n\t\t\tconst clampedValue = rawValue.slice(0, segment.length);\n\t\t\tconst updatedValues = new Map(segmentValues);\n\t\t\tupdatedValues.set(index, clampedValue);\n\t\t\tsetDirtyValues(updatedValues);\n\t\t\tonClearError?.();\n\n\t\t\tif (clampedValue.length === segment.length) {\n\t\t\t\tconst nextIndex = getNextEditable(index);\n\t\t\t\tif (nextIndex !== null) {\n\t\t\t\t\trequestAnimationFrame(() => focusSegment(nextIndex));\n\t\t\t\t}\n\t\t\t}\n\n\t\t\ttryCommit(updatedValues);\n\t\t},\n\t\t[disabled, focusSegment, getNextEditable, onClearError, segmentValues, segments, tryCommit]\n\t);\n\n\t/**\n\t * Обрабатывает клавиатурную навигацию и шаговые изменения сегментов.\n\t */\n\tconst handleKeyDown = useCallback(\n\t\t(index: number) => (event: KeyboardEvent<HTMLInputElement>) => {\n\t\t\tif (disabled) return;\n\n\t\t\tconst segment = segments[index];\n\t\t\tif (segment.kind !== \"editable\") return;\n\n\t\t\tconst currentValue = segmentValues.get(index) ?? \"\";\n\t\t\tconst element = event.currentTarget;\n\n\t\t\tswitch (event.key) {\n\t\t\t\tcase \"ArrowRight\": {\n\t\t\t\t\tif (element.selectionStart === currentValue.length || currentValue === \"\") {\n\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\tconst nextIndex = getNextEditable(index);\n\t\t\t\t\t\tif (nextIndex !== null) focusSegment(nextIndex);\n\t\t\t\t\t}\n\t\t\t\t\tbreak;\n\t\t\t\t}\n\t\t\t\tcase \"ArrowLeft\": {\n\t\t\t\t\tif (element.selectionStart === 0 || currentValue === \"\") {\n\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\tconst previousIndex = getPreviousEditable(index);\n\t\t\t\t\t\tif (previousIndex !== null) focusSegment(previousIndex);\n\t\t\t\t\t}\n\t\t\t\t\tbreak;\n\t\t\t\t}\n\t\t\t\tcase \"ArrowUp\": {\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\tlet numericValue = currentValue === \"\" ? segment.min : Number.parseInt(currentValue, 10) + 1;\n\t\t\t\t\tif (numericValue > segment.max) numericValue = segment.min;\n\n\t\t\t\t\tconst updatedValues = new Map(segmentValues);\n\t\t\t\t\tupdatedValues.set(index, padValue(String(numericValue), segment));\n\t\t\t\t\tsetDirtyValues(updatedValues);\n\t\t\t\t\ttryCommit(updatedValues);\n\t\t\t\t\trequestAnimationFrame(() => element.select());\n\t\t\t\t\tbreak;\n\t\t\t\t}\n\t\t\t\tcase \"ArrowDown\": {\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\tlet numericValue = currentValue === \"\" ? segment.max : Number.parseInt(currentValue, 10) - 1;\n\t\t\t\t\tif (numericValue < segment.min) numericValue = segment.max;\n\n\t\t\t\t\tconst updatedValues = new Map(segmentValues);\n\t\t\t\t\tupdatedValues.set(index, padValue(String(numericValue), segment));\n\t\t\t\t\tsetDirtyValues(updatedValues);\n\t\t\t\t\ttryCommit(updatedValues);\n\t\t\t\t\trequestAnimationFrame(() => element.select());\n\t\t\t\t\tbreak;\n\t\t\t\t}\n\t\t\t\tcase \"Backspace\": {\n\t\t\t\t\tif (currentValue === \"\") {\n\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\tconst previousIndex = getPreviousEditable(index);\n\t\t\t\t\t\tif (previousIndex !== null) focusSegment(previousIndex);\n\t\t\t\t\t}\n\t\t\t\t\tbreak;\n\t\t\t\t}\n\t\t\t\tcase \"Delete\": {\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\tconst updatedValues = new Map(segmentValues);\n\t\t\t\t\tupdatedValues.set(index, \"\");\n\t\t\t\t\tsetDirtyValues(updatedValues);\n\t\t\t\t\ttryCommit(updatedValues);\n\t\t\t\t\tbreak;\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\t\t[disabled, focusSegment, getNextEditable, getPreviousEditable, padValue, segmentValues, segments, tryCommit]\n\t);\n\n\t/**\n\t * Выделяет содержимое сегмента при фокусе.\n\t */\n\tconst handleFocus = useCallback(\n\t\t() => (event: FocusEvent<HTMLInputElement>) => {\n\t\t\tevent.target.select();\n\t\t},\n\t\t[]\n\t);\n\n\t/**\n\t * Сбрасывает таймер blur, когда контейнер получает фокус.\n\t */\n\tconst handleContainerFocus = useCallback(() => {\n\t\tclearTimeout(blurTimeout.current);\n\t}, []);\n\n\t/**\n\t * На blur оставляет только committed-значение либо полностью пустое состояние.\n\t */\n\tconst handleContainerBlur = useCallback(() => {\n\t\tconst currentValues = new Map(segmentValues);\n\n\t\tblurTimeout.current = window.setTimeout(() => {\n\t\t\tif (areAllDateSegmentsEmpty(segments, currentValues)) {\n\t\t\t\tonChange(null);\n\t\t\t\tsetDirtyValues(currentValues);\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tconst nextDate = indexedSegmentsToDate(segments, currentValues, {\n\t\t\t\tdefaultDate: mode === \"time\" ? (normalizeDateTimeValue(value, \"time\") ?? createTimeOnlyBaseDate()) : undefined\n\t\t\t});\n\t\t\tif (!nextDate || !isDateTimeWithinRange(nextDate, minDate, maxDate, mode)) {\n\t\t\t\tsetDirtyValues(null);\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tsetDirtyValues(currentValues);\n\t\t}, 0);\n\t}, [maxDate, minDate, mode, onChange, segmentValues, segments, value]);\n\n\t/**\n\t * Фокусирует первый пустой сегмент либо последний редактируемый.\n\t */\n\tconst focusFirstEmpty = useCallback(() => {\n\t\tconst firstEmpty = editableIndices.find((index) => !(segmentValues.get(index) ?? \"\"));\n\t\tconst targetIndex = firstEmpty ?? editableIndices[editableIndices.length - 1];\n\t\tif (targetIndex !== undefined) {\n\t\t\tfocusSegment(targetIndex);\n\t\t}\n\t}, [editableIndices, focusSegment, segmentValues]);\n\n\treturn {\n\t\tsegments,\n\t\tsegmentValues,\n\t\tregisterRef,\n\t\thandleInput,\n\t\thandleKeyDown,\n\t\thandleFocus,\n\t\thandleContainerFocus,\n\t\thandleContainerBlur,\n\t\tfocusFirstEmpty\n\t};\n}\n","@use \"@/styles/mixins\" as *;\n\n.segmentInput {\n\tborder: none;\n\tborder-radius: var(--radius-xs);\n\tbackground: transparent;\n\toutline: none;\n\tpadding: 0;\n\tmargin: 0;\n\tfont-family: var(--font-family-mono);\n\tcolor: inherit;\n\ttext-align: center;\n\tcaret-color: var(--content-0);\n\tfont-variant-numeric: tabular-nums;\n\n\t&::placeholder {\n\t\tcolor: var(--content-2);\n\t\t// font-size: var(--font-size-sm);\n\t}\n\n\t&::selection {\n\t\tbackground-color: var(--focus-ring);\n\t\tcolor: var(--surface-0);\n\t}\n\n\t&:disabled {\n\t\topacity: 0.25;\n\t}\n}\n\n.separator {\n\tuser-select: none;\n\tcolor: var(--content-1);\n\tflex-shrink: 0;\n\n\t&[data-disabled] {\n\t\topacity: 0.25;\n\t}\n}\n\n.calendarButton {\n\t&:hover {\n\t\tcolor: var(--focus-ring);\n\t}\n}\n\n.popoverContent {\n\tdisplay: grid;\n\tgap: var(--space-md);\n}\n\n.bottom {\n\tgrid-template-columns: minmax(0, 1fr);\n}\n\n.right {\n\tgrid-template-columns: auto calc(9em + var(--width-add));\n\talign-items: stretch;\n}\n\n.calendarPane {\n\tmin-width: 0;\n}\n\n.timePanelPane {\n\tmin-width: 0;\n}\n\n.timeOnlyPopoverContent {\n\tmin-width: calc(9em + var(--width-add));\n}\n\n.timePanelPaneBottom {\n\tpadding-top: var(--space-md);\n\tborder-top: var(--border);\n}\n\n.timePanelPaneRight {\n\tpadding-left: var(--space-md);\n\tborder-left: var(--border);\n}\n",".timePanel {\n\theight: 100%;\n}\n\n.hint {\n\tfont-size: var(--font-size-xs);\n\tcolor: var(--content-1);\n}\n\n.fields {\n\tdisplay: grid;\n\tgrid-template-columns: repeat(2, minmax(0, 1fr));\n\tgap: var(--space-sm);\n\tmin-height: 10em;\n\theight: 100%;\n}\n\n.field {\n\tdisplay: grid;\n\tgrid-template-rows: auto 1fr;\n\tgap: var(--space-xs);\n\tmin-height: 0;\n}\n\n.label {\n\t// font-size: var(--font-size-sm);\n\tcolor: var(--content-1);\n}\n\n.wheel {\n\tmin-height: 10em;\n}\n","import { WheelPicker } from \"../../wheel-picker\";\nimport { buildTimePanelState } from \"../lib/timePanelState\";\n\nimport styles from \"./TimePanel.module.scss\";\n\nimport type { DateTimeInputMode } from \"../lib\";\n\n/**\n * Пропсы панели выбора времени.\n */\nexport interface TimePanelProps {\n\tvalue: Date;\n\tdisabled?: boolean;\n\tminDate?: Date;\n\tmaxDate?: Date;\n\tmode?: DateTimeInputMode;\n\tonChange: (hours: number, minutes: number) => void;\n}\n\n/**\n * Переиспользуемая панель выбора времени поверх internal wheel-picker.\n */\nexport function TimePanel({ value, disabled, minDate, maxDate, mode = \"date-time\", onChange }: TimePanelProps) {\n\tconst state = buildTimePanelState(value, minDate, maxDate, mode);\n\n\t/**\n\t * Форматирует двузначное значение времени.\n\t */\n\tconst formatValue = (timePart: number) => String(timePart).padStart(2, \"0\");\n\n\tif (state.disabled) {\n\t\treturn (\n\t\t\t<div className={styles.timePanel}>\n\t\t\t\t<p className={styles.hint}>Для выбранного дня нет доступного времени в заданном диапазоне.</p>\n\t\t\t</div>\n\t\t);\n\t}\n\n\treturn (\n\t\t<div className={styles.timePanel}>\n\t\t\t<div className={styles.fields}>\n\t\t\t\t<label className={styles.field}>\n\t\t\t\t\t<span className={styles.label}>Часы</span>\n\t\t\t\t\t<WheelPicker\n\t\t\t\t\t\tclassName={styles.wheel}\n\t\t\t\t\t\titems={state.hours}\n\t\t\t\t\t\tvalue={state.selectedHour}\n\t\t\t\t\t\tonChange={(hours) => onChange(hours, state.selectedMinute)}\n\t\t\t\t\t\tariaLabel=\"Выбор часов\"\n\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t\tformatItem={formatValue}\n\t\t\t\t\t/>\n\t\t\t\t</label>\n\n\t\t\t\t<label className={styles.field}>\n\t\t\t\t\t<span className={styles.label}>Минуты</span>\n\t\t\t\t\t<WheelPicker\n\t\t\t\t\t\tclassName={styles.wheel}\n\t\t\t\t\t\titems={state.minutes}\n\t\t\t\t\t\tvalue={state.selectedMinute}\n\t\t\t\t\t\tonChange={(minutes) => onChange(state.selectedHour, minutes)}\n\t\t\t\t\t\tariaLabel=\"Выбор минут\"\n\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t\tformatItem={formatValue}\n\t\t\t\t\t/>\n\t\t\t\t</label>\n\t\t\t</div>\n\t\t</div>\n\t);\n}\n","import { JSX, useEffect, useEffectEvent, useMemo, useState } from \"react\";\n\nimport { getStartOfDay, isDateRangeTuple, NullableDateRange } from \"@ryuzaki13/react-foundation-lib/formatters\";\nimport { cn } from \"@ryuzaki13/react-foundation-lib/utils\";\nimport { CalendarDaysIcon, Clock3Icon } from \"lucide-react\";\n\nimport { Button } from \"../../button\";\nimport { CalendarView } from \"../../date-input/ui\";\nimport { InputControl, InputUI, useInputFieldIds } from \"../../input\";\nimport { Popover } from \"../../popover\";\nimport { UiBaseProps } from \"../../types\";\nimport uiStyles from \"../../ui.module.scss\";\nimport {\n\tclampTimeForDay,\n\tisDateTimeWithinRange,\n\tmergeDateWithTime,\n\tmergeTimeIntoDate,\n\tnormalizeDateTimeValue,\n\tresolvePickerBaseDate\n} from \"../lib\";\nimport { useDateTimeSegments } from \"../model\";\n\nimport styles from \"./SingleDateTimeInput.module.scss\";\nimport { TimePanel } from \"./TimePanel\";\n\nimport type { DateTimeInputMode } from \"../lib\";\n\ninterface BaseSingleDateTimeInputProps {\n\terror?: string;\n\tonClearError?: () => void;\n\tminDate?: Date;\n\tmaxDate?: Date;\n\ttimePanelPlacement?: \"bottom\" | \"right\";\n\tmode?: DateTimeInputMode;\n}\n\nexport interface SingleDateTimeInputProps extends BaseSingleDateTimeInputProps, UiBaseProps<Date | null> {}\n\n/**\n * Поле выбора даты-времени со строгой сегментной маской и popover-пикером.\n */\nexport function SingleDateTimeInput({\n\tvalue,\n\tonChange,\n\tlabel,\n\tdescription,\n\tplaceholder,\n\tdisabled,\n\tsize,\n\terror,\n\tonClearError,\n\tminDate,\n\tmaxDate,\n\ttimePanelPlacement = \"right\",\n\tmode = \"date-time\"\n}: SingleDateTimeInputProps): JSX.Element {\n\tconst normalizedValue = normalizeDateTimeValue(value, mode);\n\tconst normalizedValueTime = normalizedValue?.getTime() ?? null;\n\n\tconst fallbackPickerDate = useMemo(() => getStartOfDay(new Date()), []);\n\n\tconst [open, setOpen] = useState(false);\n\tconst [draftValue, setDraftValue] = useState<Date | null>(normalizedValue ?? null);\n\tconst [calendarView, setCalendarView] = useState<\"day\" | \"month\" | \"year\">(\"day\");\n\tconst [pickerDate, setPickerDate] = useState<Date>(() => resolvePickerBaseDate(normalizedValue, fallbackPickerDate, mode));\n\n\tconst { controlId, labelId, descriptionId, errorId, describedBy } = useInputFieldIds({\n\t\thasLabel: label !== undefined && label !== null,\n\t\thasDescription: !!description,\n\t\thasError: !!error\n\t});\n\n\tconst syncDraftDate = useEffectEvent((date: Date | null) => setDraftValue(date));\n\tconst syncPickerDate = useEffectEvent((date: Date) => setPickerDate(date));\n\n\tuseEffect(() => {\n\t\tif (!open) {\n\t\t\tsyncDraftDate(normalizedValue ?? null);\n\t\t}\n\n\t\tif (normalizedValue) {\n\t\t\tsyncPickerDate(normalizedValue);\n\t\t}\n\t}, [normalizedValue, normalizedValueTime, open]);\n\n\tuseEffect(() => {\n\t\tif (!normalizedValue) return;\n\t\tsyncPickerDate(normalizedValue);\n\t}, [normalizedValue, normalizedValueTime]);\n\n\tconst {\n\t\tsegments,\n\t\tsegmentValues,\n\t\tregisterRef,\n\t\thandleInput,\n\t\thandleKeyDown,\n\t\thandleFocus,\n\t\thandleContainerFocus,\n\t\thandleContainerBlur,\n\t\tfocusFirstEmpty\n\t} = useDateTimeSegments({\n\t\tvalue: normalizedValue,\n\t\tonChange,\n\t\tonClearError,\n\t\tdisabled,\n\t\tminDate,\n\t\tmaxDate,\n\t\tmode\n\t});\n\n\t/**\n\t * Выбирает дату в календаре и сохраняет текущее время.\n\t */\n\tconst handleCalendarSelect = (nextDate: Date | NullableDateRange) => {\n\t\tif (mode === \"time\" || isDateRangeTuple(nextDate) || disabled) return;\n\n\t\tconst baseValue = draftValue ?? normalizedValue ?? pickerDate;\n\t\tconst mergedDate = mergeDateWithTime(nextDate, baseValue);\n\t\tconst { hours, minutes } = clampTimeForDay(nextDate, mergedDate.getHours(), mergedDate.getMinutes(), minDate, maxDate, mode);\n\t\tconst nextValue = mergeTimeIntoDate(nextDate, hours, minutes);\n\n\t\tif (!isDateTimeWithinRange(nextValue, minDate, maxDate, mode)) return;\n\n\t\tonClearError?.();\n\t\tsetDraftValue(nextValue);\n\t\tsetPickerDate(nextValue);\n\t};\n\n\t/**\n\t * Выбирает время для текущего рабочего дня picker-а.\n\t */\n\tconst handleTimeChange = (hours: number, minutes: number) => {\n\t\tif (disabled) return;\n\n\t\tconst baseDate = draftValue ?? normalizedValue ?? pickerDate;\n\t\tconst clampedTime = clampTimeForDay(baseDate, hours, minutes, minDate, maxDate, mode);\n\t\tconst nextValue = mergeTimeIntoDate(baseDate, clampedTime.hours, clampedTime.minutes, mode);\n\n\t\tif (!isDateTimeWithinRange(nextValue, minDate, maxDate, mode)) return;\n\n\t\tonClearError?.();\n\t\tsetDraftValue(nextValue);\n\t\tsetPickerDate(nextValue);\n\t};\n\n\tconst handleOpenChange = (nextOpen: boolean) => {\n\t\tif (nextOpen) {\n\t\t\tsetDraftValue(normalizedValue ?? null);\n\t\t\tsetPickerDate(resolvePickerBaseDate(normalizedValue, fallbackPickerDate, mode));\n\t\t}\n\n\t\tsetOpen(nextOpen);\n\t};\n\n\tconst handlePopoverClose = () => {\n\t\tconst prevTime = normalizedValue?.getTime() ?? null;\n\t\tconst draftTime = draftValue?.getTime() ?? null;\n\n\t\tif (prevTime !== draftTime) {\n\t\t\tonChange(draftValue);\n\t\t}\n\t};\n\n\tconst panelPlacementClass = timePanelPlacement === \"right\" ? styles.timePanelPaneRight : styles.timePanelPaneBottom;\n\tconst buttonAriaLabel = mode === \"time\" ? \"Открыть выбор времени\" : \"Открыть календарь даты и времени\";\n\tconst inputPlaceholder = placeholder ?? (mode === \"time\" ? \"чч:мм\" : \"дд.мм.гггг чч:мм\");\n\tconst pickerValue = draftValue ?? normalizedValue ?? pickerDate;\n\n\treturn (\n\t\t<Popover open={open} onOpenChange={handleOpenChange}>\n\t\t\t<InputUI\n\t\t\t\tlabel={label}\n\t\t\t\tdescription={description}\n\t\t\t\tdisabled={disabled}\n\t\t\t\tsize={size}\n\t\t\t\terror={error}\n\t\t\t\tcontrolId={controlId}\n\t\t\t\tlabelId={labelId}\n\t\t\t\tdescriptionId={descriptionId}\n\t\t\t\terrorId={errorId}>\n\t\t\t\t<InputControl\n\t\t\t\t\tendAdornmentWidth=\"var(--control-height)\"\n\t\t\t\t\tendAdornment={\n\t\t\t\t\t\t<Popover.Trigger>\n\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\tvariant=\"transparent\"\n\t\t\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t\t\t\tclassName={styles.calendarButton}\n\t\t\t\t\t\t\t\ticon={mode === \"time\" ? <Clock3Icon /> : <CalendarDaysIcon />}\n\t\t\t\t\t\t\t\taria-label={buttonAriaLabel}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</Popover.Trigger>\n\t\t\t\t\t}>\n\t\t\t\t\t{({ controlClassName }) => (\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tid={controlId}\n\t\t\t\t\t\t\tclassName={cn(uiStyles.uiInputControlFake, controlClassName)}\n\t\t\t\t\t\t\tdata-disabled={disabled || undefined}\n\t\t\t\t\t\t\tdata-invalid={error ? \"\" : undefined}\n\t\t\t\t\t\t\trole=\"group\"\n\t\t\t\t\t\t\taria-invalid={!!error || undefined}\n\t\t\t\t\t\t\taria-placeholder={inputPlaceholder}\n\t\t\t\t\t\t\taria-labelledby={labelId}\n\t\t\t\t\t\t\taria-describedby={describedBy}\n\t\t\t\t\t\t\tonFocus={handleContainerFocus}\n\t\t\t\t\t\t\tonBlur={handleContainerBlur}\n\t\t\t\t\t\t\tonClick={(event) => {\n\t\t\t\t\t\t\t\tif (event.target === event.currentTarget) {\n\t\t\t\t\t\t\t\t\tfocusFirstEmpty();\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t}}>\n\t\t\t\t\t\t\t{segments.map((segment, index) => {\n\t\t\t\t\t\t\t\tif (segment.kind === \"literal\") {\n\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t<span key={index} className={styles.separator} data-disabled={disabled || undefined}>\n\t\t\t\t\t\t\t\t\t\t\t{segment.text}\n\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t<input\n\t\t\t\t\t\t\t\t\t\tkey={index}\n\t\t\t\t\t\t\t\t\t\tref={registerRef(index)}\n\t\t\t\t\t\t\t\t\t\ttype=\"text\"\n\t\t\t\t\t\t\t\t\t\tinputMode=\"numeric\"\n\t\t\t\t\t\t\t\t\t\tclassName={styles.segmentInput}\n\t\t\t\t\t\t\t\t\t\tstyle={{ width: `${segment.length + 0.5}ch` }}\n\t\t\t\t\t\t\t\t\t\tvalue={segmentValues.get(index) ?? \"\"}\n\t\t\t\t\t\t\t\t\t\tplaceholder={segment.placeholder}\n\t\t\t\t\t\t\t\t\t\tmaxLength={segment.length}\n\t\t\t\t\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t\t\t\t\t\taria-label={segment.ariaLabel}\n\t\t\t\t\t\t\t\t\t\tautoComplete=\"off\"\n\t\t\t\t\t\t\t\t\t\tonChange={handleInput(index)}\n\t\t\t\t\t\t\t\t\t\tonKeyDown={handleKeyDown(index)}\n\t\t\t\t\t\t\t\t\t\tonFocus={handleFocus()}\n\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})}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t)}\n\t\t\t\t</InputControl>\n\t\t\t</InputUI>\n\n\t\t\t<Popover.Content background=\"primary\" onClose={handlePopoverClose}>\n\t\t\t\t{mode === \"time\" ? (\n\t\t\t\t\t<div className={styles.timeOnlyPopoverContent}>\n\t\t\t\t\t\t<TimePanel\n\t\t\t\t\t\t\tvalue={pickerValue}\n\t\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t\t\tminDate={minDate}\n\t\t\t\t\t\t\tmaxDate={maxDate}\n\t\t\t\t\t\t\tmode={mode}\n\t\t\t\t\t\t\tonChange={handleTimeChange}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</div>\n\t\t\t\t) : (\n\t\t\t\t\t<div className={cn(styles.popoverContent, styles[timePanelPlacement])}>\n\t\t\t\t\t\t<div className={styles.calendarPane}>\n\t\t\t\t\t\t\t<CalendarView\n\t\t\t\t\t\t\t\tview={calendarView}\n\t\t\t\t\t\t\t\tdatePickerLevel=\"day\"\n\t\t\t\t\t\t\t\tselectionMode=\"day\"\n\t\t\t\t\t\t\t\tonViewChange={setCalendarView}\n\t\t\t\t\t\t\t\tvalue={pickerValue}\n\t\t\t\t\t\t\t\tonChange={handleCalendarSelect}\n\t\t\t\t\t\t\t\tminDate={minDate}\n\t\t\t\t\t\t\t\tmaxDate={maxDate}\n\t\t\t\t\t\t\t\tcurrentDate={pickerDate}\n\t\t\t\t\t\t\t\tonCurrentDateChange={setPickerDate}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</div>\n\n\t\t\t\t\t\t<div className={cn(styles.timePanelPane, panelPlacementClass)}>\n\t\t\t\t\t\t\t<TimePanel\n\t\t\t\t\t\t\t\tvalue={pickerValue}\n\t\t\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t\t\t\tminDate={minDate}\n\t\t\t\t\t\t\t\tmaxDate={maxDate}\n\t\t\t\t\t\t\t\tmode={mode}\n\t\t\t\t\t\t\t\tonChange={handleTimeChange}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</div>\n\t\t\t\t)}\n\t\t\t</Popover.Content>\n\t\t</Popover>\n\t);\n}\n"],"mappings":"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"}

package/dist/detail/index.js

@@ -1,2 +1,80 @@
-import { t as e } from "../chunks/Detail-DHDMsg8q.js";
-export { e as Detail };
+import { createContext as e, useContext as t } from "react";
+import { cn as n } from "@ryuzaki13/react-foundation-lib/utils";
+import { Fragment as r, jsx as i, jsxs as a } from "react/jsx-runtime";
+var o = {
+	detailList: "DyKaN-",
+	none: "_2Cf0DN",
+	small: "igyZiV",
+	normal: "lFsl-5",
+	large: "zQlD1x",
+	detail: "a6oRih",
+	dt: "MYdzIV",
+	dd: "Pxw-eb",
+	textCenter: "Kz2K6S",
+	inline: "Pbwja7",
+	start: "_1DseTb",
+	center: "h3oORx",
+	end: "gB9Kr4",
+	noWrap: "V-PlLc"
+}, s = e({});
+function c({ label: e, value: c, withColon: l, required: u }) {
+	let { semantic: d, inline: f, noWrap: p, center: m, vertical: h = "center", withColon: g = !0 } = t(s), _ = n(o.detail, m && o.textCenter, f && o.inline, p && o.noWrap, o[h]), v = /* @__PURE__ */ a(r, { children: [
+		e,
+		u && /* @__PURE__ */ i("span", {
+			className: "statusError",
+			children: "*"
+		}),
+		(typeof l == "boolean" ? l : g) && ":"
+	] });
+	switch (d) {
+		case "detail": return /* @__PURE__ */ a("div", {
+			className: _,
+			children: [/* @__PURE__ */ i("dt", {
+				className: o.dt,
+				children: v
+			}), /* @__PURE__ */ i("dd", {
+				className: o.dd,
+				children: c
+			})]
+		});
+		case "list": return /* @__PURE__ */ a("li", {
+			className: _,
+			children: [/* @__PURE__ */ i("div", {
+				className: o.dt,
+				children: v
+			}), /* @__PURE__ */ i("div", {
+				className: o.dd,
+				children: c
+			})]
+		});
+		default: return /* @__PURE__ */ a("div", {
+			className: _,
+			children: [/* @__PURE__ */ i("div", {
+				className: o.dt,
+				children: v
+			}), /* @__PURE__ */ i("div", {
+				className: o.dd,
+				children: c
+			})]
+		});
+	}
+}
+var l = ({ children: e, columnCount: t = 1, rowGap: r = "none", semantic: a = "list", className: c, ...l }) => {
+	let u = n(o.detailList, o[r], c), d = i(a === "detail" ? "dl" : "ul", {
+		className: u,
+		style: { columnCount: Math.min(5, Math.max(1, t)) },
+		children: e
+	});
+	return /* @__PURE__ */ i(s.Provider, {
+		value: {
+			...l,
+			semantic: a
+		},
+		children: d
+	});
+};
+l.Item = c;
+//#endregion
+export { l as Detail };
+
+//# sourceMappingURL=index.js.map

package/dist/detail/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":[],"sources":["../../src/detail/Detail.module.scss","../../src/detail/Detail.tsx"],"sourcesContent":[".detailList {\n\tcolumn-gap: var(--space-sm);\n\n\t&.none {\n\t\t--row-gap: 0;\n\t}\n\n\t&.small {\n\t\t--row-gap: var(--space-xs);\n\t}\n\n\t&.normal {\n\t\t--row-gap: var(--space-sm);\n\t}\n\n\t&.large {\n\t\t--row-gap: var(--space-md);\n\t}\n}\n\n.detail {\n\t.dt {\n\t\tfont-weight: 700;\n\t\tfont-variation-settings: \"wght\" 700;\n\t}\n\n\t.dd {\n\t\tfont-weight: 500;\n\t\tfont-variation-settings: \"wght\" 500;\n\t}\n\n\t&.textCenter {\n\t\ttext-align: center;\n\n\t\t.dt,\n\t\t.dd {\n\t\t\tflex: 1;\n\t\t}\n\t}\n\n\t&.inline {\n\t\tdisplay: flex;\n\n\t\t.dt {\n\t\t\ttext-align: right;\n\t\t\tpadding-right: var(--space-sm);\n\t\t}\n\n\t\t.dd {\n\t\t\ttext-align: left;\n\t\t}\n\n\t\t&.start {\n\t\t\talign-items: flex-start;\n\t\t}\n\t\t&.center {\n\t\t\talign-items: center;\n\t\t}\n\t\t&.end {\n\t\t\talign-items: flex-end;\n\t\t}\n\t}\n\n\t&.noWrap {\n\t\t.dt,\n\t\t.dd {\n\t\t\twhite-space: nowrap;\n\t\t\tword-break: normal;\n\t\t}\n\n\t\t.dd {\n\t\t\toverflow: hidden;\n\t\t\ttext-overflow: ellipsis;\n\t\t}\n\t}\n\n\t&:not(:last-child) {\n\t\tmargin-bottom: var(--row-gap);\n\t}\n}\n","import { createContext, CSSProperties, FC, ReactNode, useContext } from \"react\";\n\nimport { cn } from \"@ryuzaki13/react-foundation-lib/utils\";\n\nimport styles from \"./Detail.module.scss\";\n\nexport type DetailType = \"detail\" | \"list\";\n\nexport interface DetailContextType {\n\tsemantic?: DetailType;\n\tinline?: boolean;\n\tcenter?: boolean;\n\tvertical?: \"start\" | \"center\" | \"end\";\n\tnoWrap?: boolean;\n\twithColon?: boolean;\n}\n\nconst DetailContext = createContext<DetailContextType>({});\n\nexport interface DetailItemProps {\n\tlabel: ReactNode;\n\tvalue: ReactNode;\n\twithColon?: boolean;\n\trequired?: boolean;\n}\n\nfunction Item({ label, value, withColon, required }: DetailItemProps) {\n\tconst { semantic, inline, noWrap, center, vertical = \"center\", withColon: withColonParent = true } = useContext(DetailContext);\n\tconst detailClass = cn(styles.detail, center && styles.textCenter, inline && styles.inline, noWrap && styles.noWrap, styles[vertical]);\n\n\tconst labelContent = (\n\t\t<>\n\t\t\t{label}\n\t\t\t{required && <span className=\"statusError\">*</span>}\n\t\t\t{(typeof withColon === \"boolean\" ? withColon : withColonParent) && \":\"}\n\t\t</>\n\t);\n\n\tswitch (semantic) {\n\t\tcase \"detail\":\n\t\t\treturn (\n\t\t\t\t<div className={detailClass}>\n\t\t\t\t\t<dt className={styles.dt}>{labelContent}</dt>\n\t\t\t\t\t<dd className={styles.dd}>{value}</dd>\n\t\t\t\t</div>\n\t\t\t);\n\n\t\tcase \"list\":\n\t\t\treturn (\n\t\t\t\t<li className={detailClass}>\n\t\t\t\t\t<div className={styles.dt}>{labelContent}</div>\n\t\t\t\t\t<div className={styles.dd}>{value}</div>\n\t\t\t\t</li>\n\t\t\t);\n\n\t\tdefault:\n\t\t\treturn (\n\t\t\t\t<div className={detailClass}>\n\t\t\t\t\t<div className={styles.dt}>{labelContent}</div>\n\t\t\t\t\t<div className={styles.dd}>{value}</div>\n\t\t\t\t</div>\n\t\t\t);\n\t}\n}\n\nexport interface DetailProps {\n\tcolumnCount?: number;\n\trowGap?: \"none\" | \"small\" | \"normal\" | \"large\";\n\tchildren: ReactNode;\n\tclassName?: string;\n\n\tsemantic?: DetailType;\n\tinline?: boolean;\n\tcenter?: boolean;\n\tvertical?: \"start\" | \"center\" | \"end\";\n\tnoWrap?: boolean;\n\twithColon?: boolean;\n}\n\nexport interface DetailComponent extends FC<DetailProps> {\n\tItem: FC<DetailItemProps>;\n}\n\n/**\n * Компонент для вывода пар «заголовок-значение» в одну или несколько колонок. Подходит для карточек сущностей, сводок и страниц просмотра.\n */\nexport const Detail: DetailComponent = ({ children, columnCount = 1, rowGap = \"none\", semantic = \"list\", className, ...itemProps }) => {\n\tconst classes = cn(styles.detailList, styles[rowGap], className);\n\tconst style = { columnCount: Math.min(5, Math.max(1, columnCount)) } as CSSProperties;\n\tconst content =\n\t\tsemantic === \"detail\" ? (\n\t\t\t<dl className={classes} style={style}>\n\t\t\t\t{children}\n\t\t\t</dl>\n\t\t) : (\n\t\t\t<ul className={classes} style={style}>\n\t\t\t\t{children}\n\t\t\t</ul>\n\t\t);\n\n\treturn <DetailContext.Provider value={{ ...itemProps, semantic }}>{content}</DetailContext.Provider>;\n};\n\nDetail.Item = Item;\n"],"mappings":";;;;;;;;;;;;;;;;;;GCiBM,IAAgB,EAAiC,CAAC,CAAC;AASzD,SAAS,EAAK,EAAE,UAAO,UAAO,cAAW,eAA6B;CACrE,IAAM,EAAE,aAAU,WAAQ,WAAQ,WAAQ,cAAW,UAAU,WAAW,IAAkB,OAAS,EAAW,CAAa,GACvH,IAAc,EAAG,EAAO,QAAQ,KAAU,EAAO,YAAY,KAAU,EAAO,QAAQ,KAAU,EAAO,QAAQ,EAAO,EAAS,GAE/H,IACL,kBAAA,GAAA,EAAA,UAAA;EACE;EACA,KAAY,kBAAC,QAAD;GAAM,WAAU;aAAc;EAAO,CAAA;GAChD,OAAO,KAAc,YAAY,IAAY,MAAoB;CAClE,EAAA,CAAA;CAGH,QAAQ,GAAR;EACC,KAAK,UACJ,OACC,kBAAC,OAAD;GAAK,WAAW;aAAhB,CACC,kBAAC,MAAD;IAAI,WAAW,EAAO;cAAK;GAAiB,CAAA,GAC5C,kBAAC,MAAD;IAAI,WAAW,EAAO;cAAK;GAAU,CAAA,CACjC;;EAGP,KAAK,QACJ,OACC,kBAAC,MAAD;GAAI,WAAW;aAAf,CACC,kBAAC,OAAD;IAAK,WAAW,EAAO;cAAK;GAAkB,CAAA,GAC9C,kBAAC,OAAD;IAAK,WAAW,EAAO;cAAK;GAAW,CAAA,CACpC;;EAGN,SACC,OACC,kBAAC,OAAD;GAAK,WAAW;aAAhB,CACC,kBAAC,OAAD;IAAK,WAAW,EAAO;cAAK;GAAkB,CAAA,GAC9C,kBAAC,OAAD;IAAK,WAAW,EAAO;cAAK;GAAW,CAAA,CACnC;;CAER;AACD;AAuBA,IAAa,KAA2B,EAAE,aAAU,iBAAc,GAAG,YAAS,QAAQ,cAAW,QAAQ,cAAW,GAAG,QAAgB;CACtI,IAAM,IAAU,EAAG,EAAO,YAAY,EAAO,IAAS,CAAS,GAEzD,IAEJ,EADD,MAAa,WACX,OAIA,MAJD;EAAI,WAAW;EAAgB,SAHjB,aAAa,KAAK,IAAI,GAAG,KAAK,IAAI,GAAG,CAAW,CAAC,EAGhC;EAC7B;CACE,CAIA;CAGN,OAAO,kBAAC,EAAc,UAAf;EAAwB,OAAO;GAAE,GAAG;GAAW;EAAS;YAAI;CAAgC,CAAA;AACpG;AAEA,EAAO,OAAO"}