@ryuzaki13/react-foundation-ui 0.1.0

package/dist/chunks/InputDateTime-DPtY_4Od.js

@@ -0,0 +1,258 @@
+import { t as e } from "./ui.module-BisoTevy.js";
+import { c as t, n, o as r, r as i } from "./Input-Ce2HXBUc.js";
+import { cn as a } from "@ryuzaki13/react-foundation-lib/utils";
+import { jsx as o } from "react/jsx-runtime";
+import { useCallback as s, useMemo as c, useRef as l, useState as u } from "react";
+import { dateToIndexedSegmentValues as d, indexedSegmentsToDate as f, parseDateSegmentMask as p } from "@ryuzaki13/react-foundation-lib/date-segments";
+var m = {
+	segmentInput: "t1iysX",
+	separator: "_-4oX-p"
+};
+//#endregion
+//#region src/input-date-time/maskParser.ts
+function h(e) {
+	return p(e).map((e) => e.kind === "editable" ? {
+		...e,
+		type: e.id
+	} : e);
+}
+function g(e, t) {
+	let n = d(e, t), r = /* @__PURE__ */ new Map();
+	return t.forEach((e, t) => {
+		e.kind === "editable" && r.set(e.type, n.get(t) ?? "");
+	}), r;
+}
+function _(e, t) {
+	let n = /* @__PURE__ */ new Map();
+	return e.forEach((e, r) => {
+		e.kind === "editable" && n.set(r, t.get(e.type) ?? "");
+	}), f(e, n);
+}
+//#endregion
+//#region src/input-date-time/useMaskedSegments.ts
+function v(e, t) {
+	let n = g(e, t), r = /* @__PURE__ */ new Map();
+	return t.forEach((e, t) => {
+		e.kind === "editable" && r.set(t, n.get(e.type) ?? "");
+	}), r;
+}
+function y(e) {
+	let t = [];
+	return e.forEach((e, n) => {
+		e.kind === "editable" && t.push(n);
+	}), t;
+}
+function b({ mask: e, value: t, onChange: n, onClearError: r, disabled: i }) {
+	let a = c(() => h(e), [e]), o = c(() => y(a), [a]), d = c(() => v(t, a), [t, a]), [f, p] = u(null), [m, g] = u(() => t?.getTime()), b = t?.getTime();
+	b !== m && (g(b), p(null));
+	let x = f ?? d, S = l(/* @__PURE__ */ new Map()), C = l(0), [w, T] = u(!1), E = s((e) => {
+		let t = /* @__PURE__ */ new Map();
+		a.forEach((n, r) => {
+			n.kind === "editable" && t.set(n.type, e.get(r) ?? "");
+		});
+		let r = _(a, t);
+		r !== null && n(r);
+	}, [a, n]), D = s((e, t = !0) => {
+		let n = S.current.get(e);
+		n && (n.focus(), t && requestAnimationFrame(() => n.select()));
+	}, []), O = s((e) => {
+		let t = o.indexOf(e);
+		return t < o.length - 1 ? o[t + 1] : null;
+	}, [o]), k = s((e) => {
+		let t = o.indexOf(e);
+		return t > 0 ? o[t - 1] : null;
+	}, [o]), A = s((e, t) => e.padStart(t.length, "0"), []);
+	return {
+		segments: a,
+		segmentValues: x,
+		isFocused: w,
+		registerRef: s((e) => (t) => {
+			t ? S.current.set(e, t) : S.current.delete(e);
+		}, []),
+		handleInput: s((e) => (t) => {
+			if (i) return;
+			let n = a[e], o = t.target.value.replace(/\D/g, "").slice(0, n.length), s = new Map(x);
+			if (s.set(e, o), p(s), r?.(), o.length === n.length) {
+				let t = O(e);
+				t !== null && requestAnimationFrame(() => D(t));
+			}
+			E(s);
+		}, [
+			i,
+			a,
+			x,
+			r,
+			O,
+			D,
+			E
+		]),
+		handleKeyDown: s((e) => (t) => {
+			if (i) return;
+			let n = a[e], r = x.get(e) ?? "", o = t.currentTarget;
+			switch (t.key) {
+				case "ArrowRight":
+					if (o.selectionStart === r.length || r === "") {
+						t.preventDefault();
+						let n = O(e);
+						n !== null && D(n);
+					}
+					break;
+				case "ArrowLeft":
+					if (o.selectionStart === 0 || r === "") {
+						t.preventDefault();
+						let n = k(e);
+						n !== null && D(n);
+					}
+					break;
+				case "ArrowUp": {
+					t.preventDefault();
+					let i = r === "" ? n.min : parseInt(r, 10) + 1;
+					i > n.max && (i = n.min);
+					let a = A(i.toString(), n), s = new Map(x);
+					s.set(e, a), p(s), E(s), requestAnimationFrame(() => o.select());
+					break;
+				}
+				case "ArrowDown": {
+					t.preventDefault();
+					let i = r === "" ? n.max : parseInt(r, 10) - 1;
+					i < n.min && (i = n.max);
+					let a = A(i.toString(), n), s = new Map(x);
+					s.set(e, a), p(s), E(s), requestAnimationFrame(() => o.select());
+					break;
+				}
+				case "Backspace":
+					if (r === "") {
+						t.preventDefault();
+						let n = k(e);
+						n !== null && D(n);
+					}
+					break;
+				case "Delete": {
+					t.preventDefault();
+					let n = new Map(x);
+					n.set(e, ""), p(n), E(n);
+					break;
+				}
+			}
+		}, [
+			i,
+			a,
+			x,
+			O,
+			k,
+			D,
+			A,
+			E
+		]),
+		handleFocus: s(() => (e) => {
+			e.target.select();
+		}, []),
+		handleContainerFocus: s(() => {
+			clearTimeout(C.current), T(!0);
+		}, []),
+		handleContainerBlur: s(() => {
+			C.current = window.setTimeout(() => {
+				T(!1), p(null);
+			}, 0);
+		}, []),
+		focusFirstEmpty: s(() => {
+			let e = o.find((e) => !(x.get(e) ?? "")) ?? o[o.length - 1];
+			e !== void 0 && D(e);
+		}, [
+			o,
+			x,
+			D
+		])
+	};
+}
+//#endregion
+//#region src/input-date-time/InputDateTime.tsx
+function x({ mask: s, value: c, onChange: l, label: u, description: d, disabled: f, size: p, className: h, error: g, onClearError: _, onClear: v, "aria-label": y }) {
+	let { segments: x, segmentValues: S, registerRef: C, handleInput: w, handleKeyDown: T, handleFocus: E, handleContainerFocus: D, handleContainerBlur: O, focusFirstEmpty: k } = b({
+		mask: s,
+		value: c,
+		onChange: l,
+		onClearError: _,
+		disabled: f
+	}), { controlId: A, labelId: j, descriptionId: M, errorId: N, describedBy: P } = t({
+		hasLabel: u != null,
+		hasDescription: !!d,
+		hasError: !!g
+	});
+	return /* @__PURE__ */ o(r, {
+		label: u,
+		description: d,
+		disabled: f,
+		className: h,
+		size: p,
+		error: g,
+		labelId: j,
+		descriptionId: M,
+		errorId: N,
+		children: /* @__PURE__ */ o(i, {
+			endAdornment: v ? /* @__PURE__ */ o(n, {
+				onClick: v,
+				disabled: f
+			}) : void 0,
+			endAdornmentWidth: v ? "var(--control-height)" : void 0,
+			children: ({ controlClassName: t }) => /* @__PURE__ */ o("div", {
+				id: A,
+				className: a(e.uiInputControlFake, t),
+				"data-invalid": g ? "" : void 0,
+				"data-disabled": f || void 0,
+				role: "group",
+				"aria-invalid": !!g || void 0,
+				"aria-label": y || (typeof u == "string" ? u : void 0),
+				"aria-labelledby": y ? void 0 : j,
+				"aria-describedby": P,
+				onFocus: D,
+				onBlur: O,
+				onClick: (e) => {
+					e.target === e.currentTarget && k();
+				},
+				children: x.map((e, t) => e.kind === "literal" ? /* @__PURE__ */ o("span", {
+					className: m.separator,
+					"data-disabled": f || void 0,
+					children: e.text
+				}, t) : /* @__PURE__ */ o("input", {
+					ref: C(t),
+					type: "text",
+					inputMode: "numeric",
+					className: m.segmentInput,
+					style: { width: `${e.length + .5}ch` },
+					value: S.get(t) ?? "",
+					placeholder: e.placeholder,
+					maxLength: e.length,
+					disabled: f,
+					"aria-label": e.type,
+					autoComplete: "off",
+					onChange: w(t),
+					onKeyDown: T(t),
+					onFocus: E()
+				}, t))
+			})
+		})
+	});
+}
+function S({ mask: e = "YYYY.MM.DD", ...t }) {
+	return /* @__PURE__ */ o(x, {
+		mask: e,
+		...t
+	});
+}
+function C({ mask: e = "hh:mm", ...t }) {
+	return /* @__PURE__ */ o(x, {
+		mask: e,
+		...t
+	});
+}
+function w({ mask: e = "YYYY.MM.DD hh:mm", ...t }) {
+	return /* @__PURE__ */ o(x, {
+		mask: e,
+		...t
+	});
+}
+//#endregion
+export { w as n, C as r, S as t };
+
+//# sourceMappingURL=InputDateTime-DPtY_4Od.js.map

package/dist/chunks/InputDateTime-DPtY_4Od.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"InputDateTime-DPtY_4Od.js","names":[],"sources":["../../src/input-date-time/InputDateTime.module.scss","../../src/input-date-time/maskParser.ts","../../src/input-date-time/useMaskedSegments.ts","../../src/input-date-time/InputDateTime.tsx"],"sourcesContent":["@use \"@/styles/mixins\" as *;\n\n.segmentInput {\n\tborder: none;\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// Remove spin buttons\n\t&::-webkit-inner-spin-button,\n\t&::-webkit-outer-spin-button {\n\t\t-webkit-appearance: none;\n\t\tmargin: 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-2);\n\tflex-shrink: 0;\n\n\t&[data-disabled] {\n\t\topacity: 0.25;\n\t}\n}\n","import {\n\ttype DateMaskSegment,\n\ttype DateSegmentId,\n\tdateToIndexedSegmentValues,\n\ttype EditableDateSegment,\n\tindexedSegmentsToDate,\n\ttype LiteralDateSegment,\n\tparseDateSegmentMask\n} from \"@ryuzaki13/react-foundation-lib/date-segments\";\n\n/**\n * Совместимый тип сегмента для существующего `InputDateTime`.\n */\nexport type SegmentType = DateSegmentId;\n\n/**\n * Совместимый редактируемый сегмент для существующего `InputDateTime`.\n */\nexport interface EditableSegment extends Omit<EditableDateSegment, \"id\"> {\n\ttype: SegmentType;\n}\n\n/**\n * Совместимый литеральный сегмент для существующего `InputDateTime`.\n */\nexport type LiteralSegment = LiteralDateSegment;\n\n/**\n * Совместимый тип сегмента маски для существующего `InputDateTime`.\n */\nexport type Segment = EditableSegment | LiteralSegment;\n\n/**\n * Разбирает строковую маску, сохраняя прежний контракт `InputDateTime`.\n */\nexport function parseMask(mask: string): Segment[] {\n\treturn parseDateSegmentMask(mask).map((segment) => (segment.kind === \"editable\" ? { ...segment, type: segment.id } : segment));\n}\n\n/**\n * Преобразует Date в карту значений сегментов по их совместимым типам.\n */\nexport function dateToSegmentValues(date: Date | undefined, segments: Segment[]): Map<SegmentType, string> {\n\tconst indexedValues = dateToIndexedSegmentValues(date, segments as DateMaskSegment[]);\n\tconst values = new Map<SegmentType, string>();\n\n\tsegments.forEach((segment, index) => {\n\t\tif (segment.kind !== \"editable\") return;\n\t\tvalues.set(segment.type, indexedValues.get(index) ?? \"\");\n\t});\n\n\treturn values;\n}\n\n/**\n * Собирает строгий Date из карты сегментов старого формата.\n */\nexport function segmentsToDate(segments: Segment[], values: Map<SegmentType, string>): Date | null {\n\tconst indexedValues = new Map<number, string>();\n\n\tsegments.forEach((segment, index) => {\n\t\tif (segment.kind !== \"editable\") return;\n\t\tindexedValues.set(index, values.get(segment.type) ?? \"\");\n\t});\n\n\treturn indexedSegmentsToDate(segments as DateMaskSegment[], indexedValues);\n}\n","import React, { useCallback, useMemo, useRef, useState } from \"react\";\n\nimport { dateToSegmentValues, EditableSegment, parseMask, segmentsToDate, SegmentType } from \"./maskParser\";\n\ninterface UseMaskedSegmentsOptions {\n\tmask: string;\n\tvalue: Date | undefined;\n\tonChange: (date: Date) => void;\n\tonClearError?: () => void;\n\tdisabled?: boolean;\n}\n\n// Вычисляет Map<index, string> из Date и массива сегментов\nfunction buildSegmentMap(date: Date | undefined, segments: ReturnType<typeof parseMask>): Map<number, string> {\n\tconst typeValues = dateToSegmentValues(date, segments);\n\tconst map = new Map<number, string>();\n\n\tsegments.forEach((seg, i) => {\n\t\tif (seg.kind === \"editable\") {\n\t\t\tmap.set(i, typeValues.get(seg.type) ?? \"\");\n\t\t}\n\t});\n\n\treturn map;\n}\n\n// TODO: Duplicate date-time-input/model/useDateTimeSegments\nfunction resolveEditableIndices(segments: ReturnType<typeof parseMask>): 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\nexport function useMaskedSegments({ mask, value, onChange, onClearError, disabled }: UseMaskedSegmentsOptions) {\n\tconst segments = useMemo(() => parseMask(mask), [mask]);\n\n\tconst editableIndices = useMemo(() => resolveEditableIndices(segments), [segments]);\n\n\t// Значения сегментов, вычисленные из пропса value (источник истины)\n\tconst committedValues = useMemo(() => buildSegmentMap(value, segments), [value, segments]);\n\n\t// Локальные «грязные» значения при редактировании (null → используем committedValues)\n\tconst [dirtyValues, setDirtyValues] = useState<Map<number, string> | null>(null);\n\n\t// Сброс грязного состояния при внешнем изменении value (паттерн «adjusting state during render»)\n\tconst [prevValueTime, setPrevValueTime] = useState(() => value?.getTime());\n\tconst currentValueTime = value?.getTime();\n\tif (currentValueTime !== prevValueTime) {\n\t\tsetPrevValueTime(currentValueTime);\n\t\tsetDirtyValues(null);\n\t}\n\n\t// Текущие отображаемые значения\n\tconst segmentValues = dirtyValues ?? committedValues;\n\n\tconst refsMap = useRef<Map<number, HTMLInputElement>>(new Map());\n\tconst blurTimeout = useRef<number>(0);\n\tconst [isFocused, setIsFocused] = useState(false);\n\n\tconst tryFireOnChange = useCallback(\n\t\t(updatedValues: Map<number, string>) => {\n\t\t\tconst typeValues = new Map<SegmentType, string>();\n\n\t\t\tsegments.forEach((seg, i) => {\n\t\t\t\tif (seg.kind === \"editable\") {\n\t\t\t\t\ttypeValues.set(seg.type, updatedValues.get(i) ?? \"\");\n\t\t\t\t}\n\t\t\t});\n\n\t\t\tconst date = segmentsToDate(segments, typeValues);\n\t\t\tif (date !== null) {\n\t\t\t\tonChange(date);\n\t\t\t}\n\t\t},\n\t\t[segments, onChange]\n\t);\n\n\tconst focusSegment = useCallback((index: number, selectAll = true) => {\n\t\tconst el = refsMap.current.get(index);\n\t\tif (el) {\n\t\t\tel.focus();\n\t\t\tif (selectAll) {\n\t\t\t\trequestAnimationFrame(() => el.select());\n\t\t\t}\n\t\t}\n\t}, []);\n\n\tconst getNextEditable = useCallback(\n\t\t(currentIndex: number): number | null => {\n\t\t\tconst pos = editableIndices.indexOf(currentIndex);\n\t\t\treturn pos < editableIndices.length - 1 ? editableIndices[pos + 1] : null;\n\t\t},\n\t\t[editableIndices]\n\t);\n\n\tconst getPrevEditable = useCallback(\n\t\t(currentIndex: number): number | null => {\n\t\t\tconst pos = editableIndices.indexOf(currentIndex);\n\t\t\treturn pos > 0 ? editableIndices[pos - 1] : null;\n\t\t},\n\t\t[editableIndices]\n\t);\n\n\tconst padValue = useCallback((val: string, segment: EditableSegment): string => {\n\t\treturn val.padStart(segment.length, \"0\");\n\t}, []);\n\n\tconst registerRef = useCallback(\n\t\t(index: number) => (el: HTMLInputElement | null) => {\n\t\t\tif (el) {\n\t\t\t\trefsMap.current.set(index, el);\n\t\t\t} else {\n\t\t\t\trefsMap.current.delete(index);\n\t\t\t}\n\t\t},\n\t\t[]\n\t);\n\n\tconst handleInput = useCallback(\n\t\t(index: number) => (e: React.ChangeEvent<HTMLInputElement>) => {\n\t\t\tif (disabled) return;\n\n\t\t\tconst segment = segments[index] as EditableSegment;\n\t\t\tconst raw = e.target.value.replace(/\\D/g, \"\");\n\t\t\tconst clamped = raw.slice(0, segment.length);\n\n\t\t\tconst updated = new Map(segmentValues);\n\t\t\tupdated.set(index, clamped);\n\t\t\tsetDirtyValues(updated);\n\n\t\t\tonClearError?.();\n\n\t\t\t// Авто-переход к следующему сегменту при заполнении текущего\n\t\t\tif (clamped.length === segment.length) {\n\t\t\t\tconst next = getNextEditable(index);\n\t\t\t\tif (next !== null) {\n\t\t\t\t\trequestAnimationFrame(() => focusSegment(next));\n\t\t\t\t}\n\t\t\t}\n\n\t\t\ttryFireOnChange(updated);\n\t\t},\n\t\t[disabled, segments, segmentValues, onClearError, getNextEditable, focusSegment, tryFireOnChange]\n\t);\n\n\tconst handleKeyDown = useCallback(\n\t\t(index: number) => (e: React.KeyboardEvent<HTMLInputElement>) => {\n\t\t\tif (disabled) return;\n\n\t\t\tconst segment = segments[index] as EditableSegment;\n\t\t\tconst currentVal = segmentValues.get(index) ?? \"\";\n\t\t\tconst el = e.currentTarget;\n\n\t\t\tswitch (e.key) {\n\t\t\t\tcase \"ArrowRight\": {\n\t\t\t\t\tif (el.selectionStart === currentVal.length || currentVal === \"\") {\n\t\t\t\t\t\te.preventDefault();\n\t\t\t\t\t\tconst next = getNextEditable(index);\n\t\t\t\t\t\tif (next !== null) focusSegment(next);\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 (el.selectionStart === 0 || currentVal === \"\") {\n\t\t\t\t\t\te.preventDefault();\n\t\t\t\t\t\tconst prev = getPrevEditable(index);\n\t\t\t\t\t\tif (prev !== null) focusSegment(prev);\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\te.preventDefault();\n\t\t\t\t\tlet num = currentVal === \"\" ? segment.min : parseInt(currentVal, 10) + 1;\n\t\t\t\t\tif (num > segment.max) num = segment.min;\n\n\t\t\t\t\tconst padded = padValue(num.toString(), segment);\n\t\t\t\t\tconst updated = new Map(segmentValues);\n\t\t\t\t\tupdated.set(index, padded);\n\t\t\t\t\tsetDirtyValues(updated);\n\t\t\t\t\ttryFireOnChange(updated);\n\n\t\t\t\t\trequestAnimationFrame(() => el.select());\n\t\t\t\t\tbreak;\n\t\t\t\t}\n\t\t\t\tcase \"ArrowDown\": {\n\t\t\t\t\te.preventDefault();\n\t\t\t\t\tlet num = currentVal === \"\" ? segment.max : parseInt(currentVal, 10) - 1;\n\t\t\t\t\tif (num < segment.min) num = segment.max;\n\n\t\t\t\t\tconst padded = padValue(num.toString(), segment);\n\t\t\t\t\tconst updated = new Map(segmentValues);\n\t\t\t\t\tupdated.set(index, padded);\n\t\t\t\t\tsetDirtyValues(updated);\n\t\t\t\t\ttryFireOnChange(updated);\n\n\t\t\t\t\trequestAnimationFrame(() => el.select());\n\t\t\t\t\tbreak;\n\t\t\t\t}\n\t\t\t\tcase \"Backspace\": {\n\t\t\t\t\tif (currentVal === \"\") {\n\t\t\t\t\t\te.preventDefault();\n\t\t\t\t\t\tconst prev = getPrevEditable(index);\n\t\t\t\t\t\tif (prev !== null) focusSegment(prev);\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\te.preventDefault();\n\t\t\t\t\tconst updated = new Map(segmentValues);\n\t\t\t\t\tupdated.set(index, \"\");\n\t\t\t\t\tsetDirtyValues(updated);\n\t\t\t\t\ttryFireOnChange(updated);\n\t\t\t\t\tbreak;\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\t\t[disabled, segments, segmentValues, getNextEditable, getPrevEditable, focusSegment, padValue, tryFireOnChange]\n\t);\n\n\tconst handleFocus = useCallback(\n\t\t() => (e: React.FocusEvent<HTMLInputElement>) => {\n\t\t\te.target.select();\n\t\t},\n\t\t[]\n\t);\n\n\tconst handleContainerFocus = useCallback(() => {\n\t\tclearTimeout(blurTimeout.current);\n\t\tsetIsFocused(true);\n\t}, []);\n\n\tconst handleContainerBlur = useCallback(() => {\n\t\tblurTimeout.current = window.setTimeout(() => {\n\t\t\tsetIsFocused(false);\n\t\t\t// Откат к последнему валидному значению (из пропса) при потере фокуса\n\t\t\tsetDirtyValues(null);\n\t\t}, 0);\n\t}, []);\n\n\tconst focusFirstEmpty = useCallback(() => {\n\t\tconst firstEmpty = editableIndices.find((i) => !(segmentValues.get(i) ?? \"\"));\n\t\tconst target = firstEmpty ?? editableIndices[editableIndices.length - 1];\n\t\tif (target !== undefined) focusSegment(target);\n\t}, [editableIndices, segmentValues, focusSegment]);\n\n\treturn {\n\t\tsegments,\n\t\tsegmentValues,\n\t\tisFocused,\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","import { cn } from \"@ryuzaki13/react-foundation-lib/utils\";\n\nimport { InputClearButton, InputControl, InputUI, useInputFieldIds } from \"../input\";\nimport { UiBaseProps } from \"../types\";\nimport uiStyles from \"../ui.module.scss\";\n\nimport styles from \"./InputDateTime.module.scss\";\nimport { useMaskedSegments } from \"./useMaskedSegments\";\n\ninterface InputDateTimeBaseProps extends UiBaseProps<Date, Date | undefined> {\n\tmask: string;\n\n\tclassName?: string;\n\n\terror?: string;\n\tonClearError?: () => void;\n\tonClear?: () => void;\n\n\t\"aria-label\"?: string;\n}\n\nfunction InputDateTimeBase({\n\tmask,\n\tvalue,\n\tonChange,\n\tlabel,\n\tdescription,\n\tdisabled,\n\tsize,\n\tclassName,\n\terror,\n\tonClearError,\n\tonClear,\n\t\"aria-label\": ariaLabel\n}: InputDateTimeBaseProps) {\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} = useMaskedSegments({ mask, value, onChange, onClearError, disabled });\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\treturn (\n\t\t<InputUI\n\t\t\tlabel={label}\n\t\t\tdescription={description}\n\t\t\tdisabled={disabled}\n\t\t\tclassName={className}\n\t\t\tsize={size}\n\t\t\terror={error}\n\t\t\tlabelId={labelId}\n\t\t\tdescriptionId={descriptionId}\n\t\t\terrorId={errorId}>\n\t\t\t<InputControl\n\t\t\t\tendAdornment={onClear ? <InputClearButton onClick={onClear} disabled={disabled} /> : undefined}\n\t\t\t\tendAdornmentWidth={onClear ? \"var(--control-height)\" : undefined}>\n\t\t\t\t{({ controlClassName }) => (\n\t\t\t\t\t<div\n\t\t\t\t\t\tid={controlId}\n\t\t\t\t\t\tclassName={cn(uiStyles.uiInputControlFake, controlClassName)}\n\t\t\t\t\t\tdata-invalid={error ? \"\" : undefined}\n\t\t\t\t\t\tdata-disabled={disabled || undefined}\n\t\t\t\t\t\trole=\"group\"\n\t\t\t\t\t\taria-invalid={!!error || undefined}\n\t\t\t\t\t\taria-label={ariaLabel || (typeof label === \"string\" ? label : undefined)}\n\t\t\t\t\t\taria-labelledby={ariaLabel ? undefined : labelId}\n\t\t\t\t\t\taria-describedby={describedBy}\n\t\t\t\t\t\tonFocus={handleContainerFocus}\n\t\t\t\t\t\tonBlur={handleContainerBlur}\n\t\t\t\t\t\tonClick={(e) => {\n\t\t\t\t\t\t\tif (e.target === e.currentTarget) focusFirstEmpty();\n\t\t\t\t\t\t}}>\n\t\t\t\t\t\t{segments.map((segment, index) => {\n\t\t\t\t\t\t\tif (segment.kind === \"literal\") {\n\t\t\t\t\t\t\t\treturn (\n\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{segment.text}\n\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t<input\n\t\t\t\t\t\t\t\t\tkey={index}\n\t\t\t\t\t\t\t\t\tref={registerRef(index)}\n\t\t\t\t\t\t\t\t\ttype=\"text\"\n\t\t\t\t\t\t\t\t\tinputMode=\"numeric\"\n\t\t\t\t\t\t\t\t\tclassName={styles.segmentInput}\n\t\t\t\t\t\t\t\t\tstyle={{ width: `${segment.length + 0.5}ch` }}\n\t\t\t\t\t\t\t\t\tvalue={segmentValues.get(index) ?? \"\"}\n\t\t\t\t\t\t\t\t\tplaceholder={segment.placeholder}\n\t\t\t\t\t\t\t\t\tmaxLength={segment.length}\n\t\t\t\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t\t\t\t\taria-label={segment.type}\n\t\t\t\t\t\t\t\t\tautoComplete=\"off\"\n\t\t\t\t\t\t\t\t\tonChange={handleInput(index)}\n\t\t\t\t\t\t\t\t\tonKeyDown={handleKeyDown(index)}\n\t\t\t\t\t\t\t\t\tonFocus={handleFocus()}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t})}\n\t\t\t\t\t</div>\n\t\t\t\t)}\n\t\t\t</InputControl>\n\t\t</InputUI>\n\t);\n}\n\nexport type InputDateProps = Omit<InputDateTimeBaseProps, \"mask\"> & { mask?: string };\nexport type InputTimeProps = Omit<InputDateTimeBaseProps, \"mask\"> & { mask?: string };\nexport type InputDateTimeProps = Omit<InputDateTimeBaseProps, \"mask\"> & { mask?: string };\n\nexport function InputDate({ mask = \"YYYY.MM.DD\", ...props }: InputDateProps) {\n\treturn <InputDateTimeBase mask={mask} {...props} />;\n}\n\nexport function InputTime({ mask = \"hh:mm\", ...props }: InputTimeProps) {\n\treturn <InputDateTimeBase mask={mask} {...props} />;\n}\n\nexport function InputDateTime({ mask = \"YYYY.MM.DD hh:mm\", ...props }: InputDateTimeProps) {\n\treturn <InputDateTimeBase mask={mask} {...props} />;\n}\n"],"mappings":"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"}

package/dist/chunks/InputFile-ga5yJmdZ.js

@@ -0,0 +1,105 @@
+import { t as e } from "./ui.module-BisoTevy.js";
+import { c as t, n, o as r, r as i } from "./Input-Ce2HXBUc.js";
+import { cn as a, handleKeyboardActivation as o } from "@ryuzaki13/react-foundation-lib/utils";
+import { jsx as s, jsxs as c } from "react/jsx-runtime";
+import { useCallback as l, useRef as u } from "react";
+import { ReadFileError as d, assertValidAccept as f, assertValidAllowedMime as p, readFile as m } from "@ryuzaki13/react-foundation-lib/file";
+var h = {
+	control: "Ggxyuj",
+	fileName: "fthcmO",
+	hiddenInput: "wyY60X"
+};
+//#endregion
+//#region src/input-file/InputFile.tsx
+function g(g) {
+	let { value: _, onClear: v, onReadError: y, accept: b, allowedMime: x, maxBytes: S, label: C, description: w, placeholder: T = "Выберите файл", disabled: E, size: D, error: O, onClearError: k, className: A } = g;
+	p(x), f(b);
+	let j = u(null), { controlId: M, labelId: N, descriptionId: P, errorId: F, describedBy: I } = t({
+		hasLabel: C != null,
+		hasDescription: !!w,
+		hasError: !!O
+	}), L = l(async (e) => {
+		let t = e.target.files?.[0];
+		if (t) {
+			e.target.value = "", O && k && k();
+			try {
+				if (g.readMode === "array-buffer") {
+					let e = await m(t, {
+						allowedMime: x,
+						maxBytes: S,
+						mode: "array-buffer"
+					});
+					g.onChange(e);
+					return;
+				}
+				let e = await m(t, {
+					allowedMime: x,
+					maxBytes: S
+				});
+				g.onChange(e);
+			} catch (e) {
+				e instanceof d && y && y(e);
+			}
+		}
+	}, [
+		g,
+		x,
+		S,
+		y,
+		O,
+		k
+	]), R = l(() => {
+		j.current?.click();
+	}, []);
+	return /* @__PURE__ */ c(r, {
+		label: C,
+		description: w,
+		disabled: E,
+		className: A,
+		size: D,
+		error: O,
+		controlId: M,
+		labelId: N,
+		descriptionId: P,
+		errorId: F,
+		children: [/* @__PURE__ */ s("input", {
+			ref: j,
+			id: M,
+			type: "file",
+			accept: (b ?? x)?.join(","),
+			disabled: E,
+			className: h.hiddenInput,
+			onChange: L,
+			tabIndex: -1
+		}), /* @__PURE__ */ s(i, {
+			endAdornment: v ? /* @__PURE__ */ s(n, {
+				onClick: v,
+				disabled: E
+			}) : void 0,
+			endAdornmentWidth: v ? "var(--control-height)" : void 0,
+			children: ({ controlClassName: t }) => /* @__PURE__ */ s("div", {
+				role: "button",
+				tabIndex: E ? -1 : 0,
+				onClick: R,
+				onKeyDown: (e) => o(e, R, { disabled: E }),
+				className: a(e.uiInputControl, h.control, t, !!O && e.invalid),
+				"data-disabled": E || void 0,
+				"aria-invalid": !!O || void 0,
+				"aria-disabled": E,
+				"aria-labelledby": N,
+				"aria-describedby": I,
+				children: _ ? /* @__PURE__ */ s("span", {
+					className: h.fileName,
+					children: _.meta.name
+				}) : /* @__PURE__ */ s("span", {
+					className: e.uiPlaceholder,
+					children: T
+				})
+			})
+		})]
+	});
+}
+//#endregion
+export { g as t };
+
+//# sourceMappingURL=InputFile-ga5yJmdZ.js.map

package/dist/chunks/InputFile-ga5yJmdZ.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"InputFile-ga5yJmdZ.js","names":[],"sources":["../../src/input-file/InputFile.module.scss","../../src/input-file/InputFile.tsx"],"sourcesContent":[".control {\n\theight: var(--control-height);\n\twidth: 100%;\n\tpadding: 0 var(--space-sm);\n\tfont-size: var(--font-size-md);\n\tcursor: pointer;\n\tdisplay: flex;\n\talign-items: center;\n}\n\n.fileName {\n\toverflow: hidden;\n\ttext-overflow: ellipsis;\n\twhite-space: nowrap;\n}\n\n.hiddenInput {\n\tposition: absolute;\n\twidth: 0;\n\theight: 0;\n\topacity: 0;\n\toverflow: hidden;\n\tpointer-events: none;\n}\n","import { useCallback, useRef } from \"react\";\n\nimport { assertValidAccept, assertValidAllowedMime, readFile, ReadFileError, ReadFileResult, ReadMode } from \"@ryuzaki13/react-foundation-lib/file\";\nimport { cn, handleKeyboardActivation } from \"@ryuzaki13/react-foundation-lib/utils\";\n\nimport { InputClearButton, InputControl, InputUI, useInputFieldIds } from \"../input\";\nimport { UiBaseProps } from \"../types\";\nimport uiStyles from \"../ui.module.scss\";\n\nimport styles from \"./InputFile.module.scss\";\n\ninterface InputFileCommonProps extends Omit<UiBaseProps<undefined>, \"value\" | \"onChange\"> {\n\t/** Callback очистки выбранного файла. Если передан — отображается кнопка «крестик» */\n\tonClear?: () => void;\n\t/** Callback ошибки чтения файла (невалидный MIME, превышение размера и т.д.) */\n\tonReadError?: (error: ReadFileError) => void;\n\n\t/** HTML-атрибут accept для нативного input[type=\"file\"] (например `[\".pdf\", \".docx\"]`) */\n\taccept?: readonly string[];\n\t/** Список допустимых MIME-типов — передаётся в readFile для валидации */\n\tallowedMime?: readonly string[];\n\t/** Максимальный размер файла в байтах — передаётся в readFile для валидации */\n\tmaxBytes?: number;\n\t/** Режим чтения файла: \"data-url\" (по умолчанию) или \"array-buffer\" */\n\treadMode?: ReadMode;\n\n\t/** Текст ошибки под полем */\n\terror?: string;\n\t/** Callback сброса ошибки (вызывается при повторном выборе файла) */\n\tonClearError?: () => void;\n\t/** CSS-класс обёртки */\n\tclassName?: string;\n}\n\ntype InputFileDataUrlResult = Extract<ReadFileResult, { mode: \"data-url\" }>;\ntype InputFileArrayBufferResult = Extract<ReadFileResult, { mode: \"array-buffer\" }>;\n\n/**\n * Пропсы компонента InputFile.\n *\n * Компонент предназначен для выбора одного файла.\n * Внешний вид идентичен InputText — label, description, error, кнопка очистки.\n *\n * В onChange передаётся результат чтения файла через readFile:\n * - В режиме \"data-url\" — объект с dataUrl и метаданными\n * - В режиме \"array-buffer\" — объект с ArrayBuffer и метаданными\n */\nexport type InputFileProps =\n\t| (InputFileCommonProps & {\n\t\t\tvalue: ReadFileResult | undefined;\n\t\t\tonChange: (value: InputFileDataUrlResult) => void;\n\t\t\treadMode?: \"data-url\";\n\t  })\n\t| (InputFileCommonProps & {\n\t\t\tvalue: ReadFileResult | undefined;\n\t\t\tonChange: (value: InputFileArrayBufferResult) => void;\n\t\t\treadMode: \"array-buffer\";\n\t  });\n\n/**\n * InputFile — компонент выбора одного файла.\n *\n * Визуально идентичен InputText: поле с label, description, placeholder,\n * кнопкой очистки (крестик) и блоком ошибки.\n *\n * При клике открывается нативный диалог выбора файла.\n * После выбора файл читается через readFile, результат передаётся в onChange.\n *\n * InputFile позволяет выбрать один файл и передаёт наружу типизированный результат чтения.\n * Если `readMode` не задан или равен `\"data-url\"`, в `onChange` приходит объект с `dataUrl`.\n * Если `readMode` равен `\"array-buffer\"`, в `onChange` приходит объект с `buffer`.\n */\nexport function InputFile(props: InputFileProps) {\n\tconst {\n\t\tvalue,\n\t\tonClear,\n\t\tonReadError,\n\t\taccept,\n\t\tallowedMime,\n\t\tmaxBytes,\n\t\tlabel,\n\t\tdescription,\n\t\tplaceholder = \"Выберите файл\",\n\t\tdisabled,\n\t\tsize,\n\t\terror,\n\t\tonClearError,\n\t\tclassName\n\t} = props;\n\n\tassertValidAllowedMime(allowedMime);\n\tassertValidAccept(accept);\n\n\t/** Реф на скрытый нативный input[type=\"file\"] */\n\tconst inputRef = useRef<HTMLInputElement>(null);\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\t/**\n\t * Обработчик выбора файла из нативного диалога.\n\t * Читает файл через readFile и передаёт результат в onChange.\n\t * При ошибке чтения вызывает onReadError.\n\t */\n\tconst handleChange = useCallback(\n\t\tasync (e: React.ChangeEvent<HTMLInputElement>) => {\n\t\t\tconst file = e.target.files?.[0];\n\t\t\tif (!file) return;\n\n\t\t\t// Сбрасываем значение input чтобы можно было выбрать тот же файл повторно\n\t\t\te.target.value = \"\";\n\n\t\t\t// Сбрасываем ошибку при повторном выборе\n\t\t\tif (error && onClearError) onClearError();\n\n\t\t\ttry {\n\t\t\t\tif (props.readMode === \"array-buffer\") {\n\t\t\t\t\tconst result = await readFile(file, { allowedMime, maxBytes, mode: \"array-buffer\" });\n\t\t\t\t\tprops.onChange(result);\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tconst result = await readFile(file, { allowedMime, maxBytes });\n\t\t\t\tprops.onChange(result);\n\t\t\t} catch (err) {\n\t\t\t\tif (err instanceof ReadFileError && onReadError) {\n\t\t\t\t\tonReadError(err);\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\t\t[props, allowedMime, maxBytes, onReadError, error, onClearError]\n\t);\n\n\t/** Клик по видимому контролу открывает нативный диалог */\n\tconst handleClick = useCallback(() => {\n\t\tinputRef.current?.click();\n\t}, []);\n\n\treturn (\n\t\t<InputUI\n\t\t\tlabel={label}\n\t\t\tdescription={description}\n\t\t\tdisabled={disabled}\n\t\t\tclassName={className}\n\t\t\tsize={size}\n\t\t\terror={error}\n\t\t\tcontrolId={controlId}\n\t\t\tlabelId={labelId}\n\t\t\tdescriptionId={descriptionId}\n\t\t\terrorId={errorId}>\n\t\t\t<input\n\t\t\t\tref={inputRef}\n\t\t\t\tid={controlId}\n\t\t\t\ttype=\"file\"\n\t\t\t\taccept={(accept ?? allowedMime)?.join(\",\")}\n\t\t\t\tdisabled={disabled}\n\t\t\t\tclassName={styles.hiddenInput}\n\t\t\t\tonChange={handleChange}\n\t\t\t\ttabIndex={-1}\n\t\t\t/>\n\n\t\t\t<InputControl\n\t\t\t\tendAdornment={onClear ? <InputClearButton onClick={onClear} disabled={disabled} /> : undefined}\n\t\t\t\tendAdornmentWidth={onClear ? \"var(--control-height)\" : undefined}>\n\t\t\t\t{({ controlClassName }) => (\n\t\t\t\t\t<div\n\t\t\t\t\t\trole=\"button\"\n\t\t\t\t\t\ttabIndex={disabled ? -1 : 0}\n\t\t\t\t\t\tonClick={handleClick}\n\t\t\t\t\t\tonKeyDown={(event) => handleKeyboardActivation(event, handleClick, { disabled })}\n\t\t\t\t\t\tclassName={cn(uiStyles.uiInputControl, styles.control, controlClassName, !!error && uiStyles.invalid)}\n\t\t\t\t\t\tdata-disabled={disabled || undefined}\n\t\t\t\t\t\taria-invalid={!!error || undefined}\n\t\t\t\t\t\taria-disabled={disabled}\n\t\t\t\t\t\taria-labelledby={labelId}\n\t\t\t\t\t\taria-describedby={describedBy}>\n\t\t\t\t\t\t{value ? (\n\t\t\t\t\t\t\t<span className={styles.fileName}>{value.meta.name}</span>\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<span className={uiStyles.uiPlaceholder}>{placeholder}</span>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</div>\n\t\t\t\t)}\n\t\t\t</InputControl>\n\t\t</InputUI>\n\t);\n}\n"],"mappings":";;;;;;;;;;;;;ACwEA,SAAgB,EAAU,GAAuB;CAChD,IAAM,EACL,UACA,YACA,gBACA,WACA,gBACA,aACA,UACA,gBACA,iBAAc,iBACd,aACA,SACA,UACA,iBACA,iBACG;CAGJ,AADA,EAAuB,CAAW,GAClC,EAAkB,CAAM;CAGxB,IAAM,IAAW,EAAyB,IAAI,GACxC,EAAE,cAAW,YAAS,kBAAe,YAAS,mBAAgB,EAAiB;EACpF,UAAU,KAAiC;EAC3C,gBAAgB,CAAC,CAAC;EAClB,UAAU,CAAC,CAAC;CACb,CAAC,GAOK,IAAe,EACpB,OAAO,MAA2C;EACjD,IAAM,IAAO,EAAE,OAAO,QAAQ;EACzB,OAML;GAHA,EAAE,OAAO,QAAQ,IAGb,KAAS,KAAc,EAAa;GAExC,IAAI;IACH,IAAI,EAAM,aAAa,gBAAgB;KACtC,IAAM,IAAS,MAAM,EAAS,GAAM;MAAE;MAAa;MAAU,MAAM;KAAe,CAAC;KACnF,EAAM,SAAS,CAAM;KACrB;IACD;IAEA,IAAM,IAAS,MAAM,EAAS,GAAM;KAAE;KAAa;IAAS,CAAC;IAC7D,EAAM,SAAS,CAAM;GACtB,SAAS,GAAK;IACb,AAAI,aAAe,KAAiB,KACnC,EAAY,CAAG;GAEjB;EAfwC;CAgBzC,GACA;EAAC;EAAO;EAAa;EAAU;EAAa;EAAO;CAAY,CAChE,GAGM,IAAc,QAAkB;EACrC,EAAS,SAAS,MAAM;CACzB,GAAG,CAAC,CAAC;CAEL,OACC,kBAAC,GAAD;EACQ;EACM;EACH;EACC;EACL;EACC;EACI;EACF;EACM;EACN;YAVV,CAWC,kBAAC,SAAD;GACC,KAAK;GACL,IAAI;GACJ,MAAK;GACL,SAAS,KAAU,EAAA,EAAc,KAAK,GAAG;GAC/B;GACV,WAAW,EAAO;GAClB,UAAU;GACV,UAAU;EACV,CAAA,GAED,kBAAC,GAAD;GACC,cAAc,IAAU,kBAAC,GAAD;IAAkB,SAAS;IAAmB;GAAW,CAAA,IAAI,KAAA;GACrF,mBAAmB,IAAU,0BAA0B,KAAA;cACrD,EAAE,0BACH,kBAAC,OAAD;IACC,MAAK;IACL,UAAU,IAAW,KAAK;IAC1B,SAAS;IACT,YAAY,MAAU,EAAyB,GAAO,GAAa,EAAE,YAAS,CAAC;IAC/E,WAAW,EAAG,EAAS,gBAAgB,EAAO,SAAS,GAAkB,CAAC,CAAC,KAAS,EAAS,OAAO;IACpG,iBAAe,KAAY,KAAA;IAC3B,gBAAc,CAAC,CAAC,KAAS,KAAA;IACzB,iBAAe;IACf,mBAAiB;IACjB,oBAAkB;cACjB,IACA,kBAAC,QAAD;KAAM,WAAW,EAAO;eAAW,EAAM,KAAK;IAAW,CAAA,IAEzD,kBAAC,QAAD;KAAM,WAAW,EAAS;eAAgB;IAAkB,CAAA;GAEzD,CAAA;EAEO,CAAA,CACN;;AAEX"}

package/dist/chunks/InputFiles-Or2Nvfgk.js

@@ -0,0 +1,141 @@
+import { t as e } from "./ui.module-BisoTevy.js";
+import { c as t, o as n, r } from "./Input-Ce2HXBUc.js";
+import { XIcon as i } from "lucide-react";
+import { cn as a, handleKeyboardActivation as o } from "@ryuzaki13/react-foundation-lib/utils";
+import { jsx as s, jsxs as c } from "react/jsx-runtime";
+import { useCallback as l, useRef as u } from "react";
+import { ReadFileError as d, assertValidAccept as f, assertValidAllowedMime as p, readFile as m } from "@ryuzaki13/react-foundation-lib/file";
+var h = {
+	control: "h9SMea",
+	hiddenInput: "rUyh0y",
+	fileList: "Q0CY1r",
+	fileItem: "AJuYXd",
+	fileItemName: "CKKkOD",
+	removeButton: "UgxhS1"
+};
+//#endregion
+//#region src/input-files/InputFilesList.tsx
+function g({ files: e, onChange: t }) {
+	let n = l((n) => {
+		t(e.filter((e, t) => t !== n));
+	}, [e, t]);
+	return !e || !e.length ? null : /* @__PURE__ */ s("ul", {
+		className: h.fileList,
+		children: e.map((e, t) => /* @__PURE__ */ c("li", {
+			className: h.fileItem,
+			children: [/* @__PURE__ */ s("span", {
+				className: h.fileItemName,
+				children: e.meta.name
+			}), /* @__PURE__ */ s("button", {
+				type: "button",
+				className: a(h.removeButton, "flexCenter"),
+				onClick: () => n(t),
+				"aria-label": `Удалить ${e.meta.name}`,
+				children: /* @__PURE__ */ s(i, {})
+			})]
+		}, `${e.meta.name}-${e.meta.lastModified}`))
+	});
+}
+//#endregion
+//#region src/input-files/InputFiles.tsx
+function _(i) {
+	let { value: _, onReadError: v, accept: y, allowedMime: b, maxBytes: x, maxFiles: S, label: C, description: w, placeholder: T = "Выберите файлы", disabled: E, size: D, error: O, onClearError: k, className: A } = i;
+	p(b), f(y);
+	let j = u(null), { controlId: M, labelId: N, descriptionId: P, errorId: F, describedBy: I } = t({
+		hasLabel: C != null,
+		hasDescription: !!w,
+		hasError: !!O
+	}), L = typeof S == "number" && _.length >= S, R = l(async (e) => {
+		let t = e.target.files;
+		if (!t || t.length === 0) return;
+		let n = Array.from(t);
+		e.target.value = "", O && k && k();
+		let r = typeof S == "number" ? S - _.length : n.length, a = n.slice(0, r);
+		if (i.readMode === "array-buffer") {
+			let e = [];
+			for (let t of a) try {
+				let n = await m(t, {
+					allowedMime: b,
+					maxBytes: x,
+					mode: "array-buffer"
+				});
+				e.push(n);
+			} catch (e) {
+				e instanceof d && v && v(e);
+			}
+			e.length > 0 && i.onChange([...i.value, ...e]);
+			return;
+		}
+		let o = [];
+		for (let e of a) try {
+			let t = await m(e, {
+				allowedMime: b,
+				maxBytes: x
+			});
+			o.push(t);
+		} catch (e) {
+			e instanceof d && v && v(e);
+		}
+		o.length > 0 && i.onChange([...i.value, ...o]);
+	}, [
+		i,
+		S,
+		_.length,
+		b,
+		x,
+		v,
+		O,
+		k
+	]), z = l(() => {
+		j.current?.click();
+	}, []), B = (i.readMode, /* @__PURE__ */ s(g, {
+		files: i.value,
+		onChange: i.onChange
+	}));
+	return /* @__PURE__ */ c(n, {
+		label: C,
+		description: w,
+		disabled: E,
+		className: A,
+		size: D,
+		error: O,
+		controlId: M,
+		labelId: N,
+		descriptionId: P,
+		errorId: F,
+		children: [
+			/* @__PURE__ */ s("input", {
+				ref: j,
+				id: M,
+				type: "file",
+				accept: (y ?? b)?.join(","),
+				multiple: !0,
+				disabled: E || L,
+				className: h.hiddenInput,
+				onChange: R,
+				tabIndex: -1
+			}),
+			/* @__PURE__ */ s(r, { children: () => /* @__PURE__ */ s("div", {
+				role: "button",
+				tabIndex: E || L ? -1 : 0,
+				onClick: z,
+				onKeyDown: (e) => o(e, z, { disabled: E || L }),
+				className: a(e.uiInputControl, h.control, !!O && "invalid"),
+				"data-disabled": E || void 0,
+				"aria-invalid": !!O || void 0,
+				"aria-disabled": E || L,
+				"aria-labelledby": N,
+				"aria-describedby": I,
+				children: /* @__PURE__ */ s("span", {
+					className: e.uiPlaceholder,
+					children: L ? `Максимум ${S} файлов` : T
+				})
+			}) }),
+			B
+		]
+	});
+}
+//#endregion
+export { g as n, _ as t };
+
+//# sourceMappingURL=InputFiles-Or2Nvfgk.js.map

package/dist/chunks/InputFiles-Or2Nvfgk.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"InputFiles-Or2Nvfgk.js","names":[],"sources":["../../src/input-files/InputFiles.module.scss","../../src/input-files/InputFilesList.tsx","../../src/input-files/InputFiles.tsx"],"sourcesContent":["/* Контрол, имитирующий внешний вид InputText */\n.control {\n\theight: var(--control-height);\n\twidth: 100%;\n\tpadding: 0 var(--space-sm);\n\tfont-size: var(--font-size-md);\n\tcursor: pointer;\n\n\tdisplay: flex;\n\talign-items: center;\n}\n\n/* Скрытый нативный input[type=\"file\"] */\n.hiddenInput {\n\tposition: absolute;\n\twidth: 0;\n\theight: 0;\n\topacity: 0;\n\toverflow: hidden;\n\tpointer-events: none;\n}\n\n/* Список выбранных файлов */\n.fileList {\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: var(--space-xs);\n\tmargin-top: var(--space-xs);\n}\n\n/* Элемент списка — строка с именем файла и кнопкой удаления */\n.fileItem {\n\tdisplay: flex;\n\talign-items: center;\n\tgap: var(--space-xs);\n\tpadding: var(--space-xs) var(--space-sm);\n\tbackground-color: var(--surface-2);\n\tborder-radius: var(--radius-sm);\n\t// font-size: var(--font-size-sm);\n}\n\n/* Имя файла — обрезка с троеточием */\n.fileItemName {\n\tflex: 1;\n\toverflow: hidden;\n\ttext-overflow: ellipsis;\n\twhite-space: nowrap;\n}\n\n/* Кнопка удаления файла из списка */\n.removeButton {\n\tflex-shrink: 0;\n\twidth: 1.25em;\n\theight: 1.25em;\n\tcolor: var(--content-2);\n\n\t&:hover {\n\t\tcolor: var(--content-accent);\n\t}\n}\n","import { useCallback } from \"react\";\n\nimport { XIcon } from \"lucide-react\";\n\nimport { ReadFileResult } from \"@ryuzaki13/react-foundation-lib/file\";\nimport { cn } from \"@ryuzaki13/react-foundation-lib/utils\";\n\nimport styles from \"./InputFiles.module.scss\";\n\ninterface InputFilesListProps<TFile extends ReadFileResult> {\n\tfiles: TFile[];\n\tonChange: (files: TFile[]) => void;\n}\n\nexport function InputFilesList<TFile extends ReadFileResult>({ files, onChange }: InputFilesListProps<TFile>) {\n\tconst handleRemove = useCallback(\n\t\t(index: number) => {\n\t\t\tonChange(files.filter((_, i) => i !== index));\n\t\t},\n\t\t[files, onChange]\n\t);\n\n\tif (!files || !files.length) return null;\n\n\treturn (\n\t\t<ul className={styles.fileList}>\n\t\t\t{files.map((item, index) => (\n\t\t\t\t<li key={`${item.meta.name}-${item.meta.lastModified}`} className={styles.fileItem}>\n\t\t\t\t\t<span className={styles.fileItemName}>{item.meta.name}</span>\n\t\t\t\t\t<button\n\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\tclassName={cn(styles.removeButton, \"flexCenter\")}\n\t\t\t\t\t\tonClick={() => handleRemove(index)}\n\t\t\t\t\t\taria-label={`Удалить ${item.meta.name}`}>\n\t\t\t\t\t\t<XIcon />\n\t\t\t\t\t</button>\n\t\t\t\t</li>\n\t\t\t))}\n\t\t</ul>\n\t);\n}\n","import { useCallback, useRef } from \"react\";\n\nimport { assertValidAccept, assertValidAllowedMime, readFile, ReadFileError, ReadFileResult } from \"@ryuzaki13/react-foundation-lib/file\";\nimport { cn, handleKeyboardActivation } from \"@ryuzaki13/react-foundation-lib/utils\";\n\nimport { InputControl, InputUI, useInputFieldIds } from \"../input\";\nimport { UiBaseProps } from \"../types\";\nimport uiStyles from \"../ui.module.scss\";\n\nimport styles from \"./InputFiles.module.scss\";\nimport { InputFilesList } from \"./InputFilesList\";\n\ninterface InputFilesCommonProps extends Omit<UiBaseProps<undefined>, \"value\" | \"onChange\"> {\n\t/** Callback ошибки чтения файла */\n\tonReadError?: (error: ReadFileError) => void;\n\n\t/** HTML-атрибут accept для нативного input[type=\"file\"] (например `[\".pdf\", \".docx\"]`) */\n\taccept?: readonly string[];\n\t/** Список допустимых MIME-типов — передаётся в readFile */\n\tallowedMime?: readonly string[];\n\t/** Максимальный размер одного файла в байтах */\n\tmaxBytes?: number;\n\t/** Максимальное количество файлов. При достижении лимита input блокируется */\n\tmaxFiles?: number;\n\n\t/** Текст ошибки под полем */\n\terror?: string;\n\t/** Callback сброса ошибки */\n\tonClearError?: () => void;\n\t/** CSS-класс обёртки */\n\tclassName?: string;\n}\n\ntype InputFilesDataUrlResult = Extract<ReadFileResult, { mode: \"data-url\" }>;\ntype InputFilesArrayBufferResult = Extract<ReadFileResult, { mode: \"array-buffer\" }>;\n\n/**\n * Пропсы компонента InputFiles.\n *\n * Компонент предназначен для выбора нескольких файлов.\n * Выбранные файлы отображаются списком под полем ввода,\n * каждый с кнопкой удаления (крестик).\n *\n * В onChange передаётся обновлённый массив результатов readFile.\n */\nexport type InputFilesProps =\n\t| (InputFilesCommonProps & {\n\t\t\tvalue: InputFilesDataUrlResult[];\n\t\t\tonChange: (value: InputFilesDataUrlResult[]) => void;\n\t\t\t/** Режим чтения: \"data-url\" по умолчанию */\n\t\t\treadMode?: \"data-url\";\n\t  })\n\t| (InputFilesCommonProps & {\n\t\t\tvalue: InputFilesArrayBufferResult[];\n\t\t\tonChange: (value: InputFilesArrayBufferResult[]) => void;\n\t\t\t/** Режим чтения файла как ArrayBuffer */\n\t\t\treadMode: \"array-buffer\";\n\t  });\n\n/**\n * InputFiles — компонент выбора нескольких файлов.\n *\n * Поле стилизовано как InputText. При клике открывается нативный\n * диалог с multiple. Каждый выбранный файл читается через readFile\n * и добавляется в массив value.\n *\n * Список выбранных файлов отображается под полем.\n * Каждый файл можно удалить кнопкой «крестик».\n *\n * InputFiles типизирует массив по `readMode`.\n * Если `readMode` не задан или равен `\"data-url\"`, в `value` и `onChange`\n * используется массив объектов с `dataUrl`. Если `readMode` равен\n * `\"array-buffer\"`, используется массив объектов с `buffer`.\n */\nexport function InputFiles(props: InputFilesProps) {\n\tconst {\n\t\tvalue,\n\t\tonReadError,\n\t\taccept,\n\t\tallowedMime,\n\t\tmaxBytes,\n\t\tmaxFiles,\n\t\tlabel,\n\t\tdescription,\n\t\tplaceholder = \"Выберите файлы\",\n\t\tdisabled,\n\t\tsize,\n\t\terror,\n\t\tonClearError,\n\t\tclassName\n\t} = props;\n\n\tassertValidAllowedMime(allowedMime);\n\tassertValidAccept(accept);\n\n\t/** Реф на скрытый нативный input[type=\"file\"] */\n\tconst inputRef = useRef<HTMLInputElement>(null);\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\t/** Достигнут ли лимит файлов */\n\tconst isLimitReached = typeof maxFiles === \"number\" && value.length >= maxFiles;\n\n\t/**\n\t * Обработчик выбора файлов из нативного диалога.\n\t * Каждый файл читается через readFile.\n\t * Успешно прочитанные файлы добавляются к текущему массиву value.\n\t */\n\tconst handleChange = useCallback(\n\t\tasync (e: React.ChangeEvent<HTMLInputElement>) => {\n\t\t\tconst files = e.target.files;\n\t\t\tif (!files || files.length === 0) return;\n\n\t\t\tconst selectedFiles = Array.from(files);\n\n\t\t\t// Сбрасываем значение input чтобы можно было выбрать те же файлы повторно\n\t\t\te.target.value = \"\";\n\n\t\t\t// Сбрасываем ошибку при выборе новых файлов\n\t\t\tif (error && onClearError) onClearError();\n\n\t\t\t// Определяем сколько файлов можно ещё добавить\n\t\t\tconst remaining = typeof maxFiles === \"number\" ? maxFiles - value.length : selectedFiles.length;\n\t\t\tconst filesToProcess = selectedFiles.slice(0, remaining);\n\n\t\t\tif (props.readMode === \"array-buffer\") {\n\t\t\t\t// Читаем файлы как ArrayBuffer и сохраняем точный тип массива для потребителя.\n\t\t\t\tconst results: InputFilesArrayBufferResult[] = [];\n\n\t\t\t\tfor (const file of filesToProcess) {\n\t\t\t\t\ttry {\n\t\t\t\t\t\tconst result = await readFile(file, { allowedMime, maxBytes, mode: \"array-buffer\" });\n\t\t\t\t\t\tresults.push(result);\n\t\t\t\t\t} catch (err) {\n\t\t\t\t\t\tif (err instanceof ReadFileError && onReadError) {\n\t\t\t\t\t\t\tonReadError(err);\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\tif (results.length > 0) {\n\t\t\t\t\tprops.onChange([...props.value, ...results]);\n\t\t\t\t}\n\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// Читаем файлы как Data URL и сохраняем точный тип массива для потребителя.\n\t\t\tconst results: InputFilesDataUrlResult[] = [];\n\t\t\tfor (const file of filesToProcess) {\n\t\t\t\ttry {\n\t\t\t\t\tconst result = await readFile(file, { allowedMime, maxBytes });\n\t\t\t\t\tresults.push(result);\n\t\t\t\t} catch (err) {\n\t\t\t\t\tif (err instanceof ReadFileError && onReadError) {\n\t\t\t\t\t\tonReadError(err);\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t\tif (results.length > 0) {\n\t\t\t\tprops.onChange([...props.value, ...results]);\n\t\t\t}\n\t\t},\n\t\t[props, maxFiles, value.length, allowedMime, maxBytes, onReadError, error, onClearError]\n\t);\n\n\t/** Клик по видимому контролу открывает нативный диалог */\n\tconst handleClick = useCallback(() => {\n\t\tinputRef.current?.click();\n\t}, []);\n\n\tconst filesList =\n\t\tprops.readMode === \"array-buffer\" ? (\n\t\t\t<InputFilesList files={props.value} onChange={props.onChange} />\n\t\t) : (\n\t\t\t<InputFilesList files={props.value} onChange={props.onChange} />\n\t\t);\n\n\treturn (\n\t\t<InputUI\n\t\t\tlabel={label}\n\t\t\tdescription={description}\n\t\t\tdisabled={disabled}\n\t\t\tclassName={className}\n\t\t\tsize={size}\n\t\t\terror={error}\n\t\t\tcontrolId={controlId}\n\t\t\tlabelId={labelId}\n\t\t\tdescriptionId={descriptionId}\n\t\t\terrorId={errorId}>\n\t\t\t<input\n\t\t\t\tref={inputRef}\n\t\t\t\tid={controlId}\n\t\t\t\ttype=\"file\"\n\t\t\t\taccept={(accept ?? allowedMime)?.join(\",\")}\n\t\t\t\tmultiple\n\t\t\t\tdisabled={disabled || isLimitReached}\n\t\t\t\tclassName={styles.hiddenInput}\n\t\t\t\tonChange={handleChange}\n\t\t\t\ttabIndex={-1}\n\t\t\t/>\n\n\t\t\t<InputControl>\n\t\t\t\t{() => (\n\t\t\t\t\t<div\n\t\t\t\t\t\trole=\"button\"\n\t\t\t\t\t\ttabIndex={disabled || isLimitReached ? -1 : 0}\n\t\t\t\t\t\tonClick={handleClick}\n\t\t\t\t\t\tonKeyDown={(event) => handleKeyboardActivation(event, handleClick, { disabled: disabled || isLimitReached })}\n\t\t\t\t\t\tclassName={cn(uiStyles.uiInputControl, styles.control, !!error && \"invalid\")}\n\t\t\t\t\t\tdata-disabled={disabled || undefined}\n\t\t\t\t\t\taria-invalid={!!error || undefined}\n\t\t\t\t\t\taria-disabled={disabled || isLimitReached}\n\t\t\t\t\t\taria-labelledby={labelId}\n\t\t\t\t\t\taria-describedby={describedBy}>\n\t\t\t\t\t\t<span className={uiStyles.uiPlaceholder}>{isLimitReached ? `Максимум ${maxFiles} файлов` : placeholder}</span>\n\t\t\t\t\t</div>\n\t\t\t\t)}\n\t\t\t</InputControl>\n\n\t\t\t{/* Список выбранных файлов */}\n\t\t\t{filesList}\n\t\t</InputUI>\n\t);\n}\n"],"mappings":"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"}