@elcrm/form 0.0.69 → 0.0.71

package/dist/fields/Date.js

@@ -35,36 +35,32 @@ function p({ label: i = "", error: u, hidden: d = !1, className: f, placeholder:
 			return Number.isNaN(t.getTime()) ? /* @__PURE__ */ new Date() : e;
 		}
 		return /* @__PURE__ */ new Date();
-	}, []), { value: D, version: O } = n(b, S, C), [k, A] = a.useState(E(D)), j = a.useRef({
+	}, []), { value: D } = n(b, S, C), [O, k] = a.useState(E(D)), A = a.useRef({
 		x: 0,
 		y: 0,
 		b: 0
-	}), [M, N] = a.useState(!1);
+	}), [j, M] = a.useState(!1);
 	a.useEffect(() => {
-		A(E(D));
-	}, [
-		D,
-		O,
-		E
-	]);
-	let P = (e) => {
+		k(E(D));
+	}, [D, E]);
+	let N = (e) => {
 		let t = {
 			value: e,
 			name: S
 		};
-		b && S ? b.setValue(t) : A(e), g && g !== b?.onValue && g(t);
-	}, F = (e) => {
+		k(e), g && g !== b?.onValue && g(t);
+	}, P = (e) => {
 		if (h) return;
 		let t = e.currentTarget.getBoundingClientRect();
-		j.current = {
+		A.current = {
 			x: t.left,
 			b: t.bottom,
 			y: t.top
-		}, N(!0);
-	}, I = {};
-	p && (I.placeholder = p);
-	let L = D == null || D === "" || typeof D == "string" && r(D);
-	return d && L ? /* @__PURE__ */ s(o, {}) : /* @__PURE__ */ c(o, { children: [x ? x() : /* @__PURE__ */ c(t, {
+		}, M(!0);
+	}, F = {};
+	p && (F.placeholder = p);
+	let I = D == null || D === "" || typeof D == "string" && r(D);
+	return d && I ? /* @__PURE__ */ s(o, {}) : /* @__PURE__ */ c(o, { children: [x ? x() : /* @__PURE__ */ c(t, {
 		type: "date",
 		label: i,
 		error: u,
@@ -76,29 +72,29 @@ function p({ label: i = "", error: u, hidden: d = !1, className: f, placeholder:
 		children: [
 			T,
 			/* @__PURE__ */ s("div", {
-				onClick: F,
+				onClick: P,
 				onKeyDown: (e) => {
-					(e.key === "Enter" || e.key === " ") && (e.preventDefault(), F(e));
+					(e.key === "Enter" || e.key === " ") && (e.preventDefault(), P(e));
 				},
 				tabIndex: h ? -1 : 0,
 				role: "button",
 				"aria-haspopup": "dialog",
-				"aria-expanded": M,
+				"aria-expanded": j,
 				"aria-label": i || p || "Дата",
 				"data-edit": h ? void 0 : "true",
-				...I,
+				...F,
 				style: { cursor: h ? "not-allowed" : "pointer" },
-				children: v(k, "dd.mm.yyyy")
-			}, O),
+				children: v(O, "dd.mm.yyyy")
+			}),
 			w
 		]
-	}), M && l(/* @__PURE__ */ s(m, {
-		position: j.current,
-		onValue: P,
-		date: k,
+	}), j && l(/* @__PURE__ */ s(m, {
+		position: A.current,
+		onValue: N,
+		date: O,
 		max: _,
 		min: y,
-		onOpen: N,
+		onOpen: M,
 		className: f
 	}, (/* @__PURE__ */ new Date()).getTime()), document.body)] });
 }
@@ -349,7 +345,7 @@ function _(e, t) {
 }
 function v(e, t) {
 	let n, r;
-	t === void 0 ? (r = String(e), n = /* @__PURE__ */ new Date()) : (r = t, n = new Date(e));
+	t === void 0 ? (r = String(e), n = /* @__PURE__ */ new Date()) : (r = t, n = new Date(e)), Number.isNaN(n.getTime()) && (n = /* @__PURE__ */ new Date());
 	let i = r, a = {
 		yyyy: n.getFullYear(),
 		yy: ("" + n.getFullYear()).slice(-2),

package/dist/fields/Input.js

@@ -7,45 +7,53 @@ import o from "react";
 import { jsx as s, jsxs as c } from "react/jsx-runtime";
 //#region src/lib/fields/Input.tsx
 function l({ value: l, form: u, onValue: d, name: f = "", placeholder: p = "", label: m = "", hidden: h = !1, disabled: g = !1, onBlur: _, className: v = "", after: y = "", before: b = "", error: x = "", inputmode: S = "text", maxLength: C, spellCheck: w = !0, native: T = !1, autoComplete: E, inputType: D = "text", id: O }) {
-	let { value: k, version: A } = n(u, f, l), j = !g, M = typeof k == "string" || typeof k == "number" ? String(k) : "", N = o.useRef(null);
-	o.useEffect(() => {
+	let { value: k, version: A } = n(u, f, l), j = !g, M = typeof k == "string" || typeof k == "number" ? String(k) : "", N = o.useRef(null), P = o.useRef(null), F = o.useRef(!1);
+	o.useLayoutEffect(() => {
+		if (T || F.current) return;
+		let e = P.current;
+		e && e.textContent !== M && (e.textContent = M);
+	}, [
+		T,
+		M,
+		A
+	]), o.useEffect(() => {
 		if (!T) return;
 		let e = N.current;
 		e && e.value !== M && (e.value = M);
 	}, [T, M]);
-	let P = (e) => {
+	let I = (e) => {
 		let t = {
 			value: (e.target.textContent || "").trim(),
 			name: f
 		};
 		u && f && u.onValue(t), d && d !== u?.onValue && d(t);
-	}, F = (e) => {
+	}, L = (e) => {
 		let t = {
 			value: e.target.value,
 			name: f
 		};
 		u && f && u.onValue(t), d && d !== u?.onValue && d(t);
-	}, I = (e) => {
+	}, R = (e) => {
 		let t = e.target;
 		C && (t.textContent || "").trim().length >= C && e.key !== "Backspace" && e.preventDefault(), e.key === "Enter" && e.preventDefault();
-	}, L = (e) => {
+	}, z = (e) => {
 		e.key === "Enter" && e.preventDefault();
-	}, R = (e) => r.Paste(C || 0, i(e));
+	}, B = (e) => r.Paste(C || 0, i(e));
 	if (h && a(k)) return "";
-	let z = (e) => {
+	let V = (e) => {
 		r.Blur(e), _?.({
 			value: (e.target.textContent || "").trim(),
 			name: f
-		});
-	}, B = (e) => {
+		}), F.current = !1;
+	}, H = (e) => {
 		_?.({
 			value: (e.target.value || "").trim(),
 			name: f
 		});
-	}, V = (e) => {
-		r.Focus({ target: e.currentTarget });
-	}, H = {};
-	return p && (H.placeholder = p), j && (H.edit = ""), T ? /* @__PURE__ */ c(t, {
+	}, U = (e) => {
+		F.current = !0, r.Focus({ target: e.currentTarget });
+	}, W = {};
+	return p && (W.placeholder = p), j && (W.edit = ""), T ? /* @__PURE__ */ c(t, {
 		type: "input",
 		label: m,
 		error: x,
@@ -79,9 +87,9 @@ function l({ value: l, form: u, onValue: d, name: f = "", placeholder: p = "", l
 					"aria-label": m || p || "Текст",
 					"aria-disabled": g || !j ? !0 : void 0,
 					tabIndex: g ? -1 : 0,
-					onChange: F,
-					onBlur: B,
-					onKeyDown: L,
+					onChange: L,
+					onBlur: H,
+					onKeyDown: z,
 					style: {
 						width: "100%",
 						border: "none",
@@ -106,19 +114,19 @@ function l({ value: l, form: u, onValue: d, name: f = "", placeholder: p = "", l
 		children: [
 			b,
 			/* @__PURE__ */ s("div", {
+				ref: P,
 				id: O,
-				onBlur: z,
-				onFocus: V,
-				onPaste: R,
-				onInput: P,
-				onKeyDown: I,
+				onBlur: V,
+				onFocus: U,
+				onPaste: B,
+				onInput: I,
+				onKeyDown: R,
 				spellCheck: w,
 				inputMode: S || "text",
 				contentEditable: j ? "plaintext-only" : !1,
 				suppressContentEditableWarning: !0,
-				...H,
-				children: typeof k == "string" || typeof k == "number" ? String(k) : ""
-			}, A),
+				...W
+			}),
 			y
 		]
 	});

package/dist/fields/Mask.js

@@ -3,10 +3,10 @@ import t from "../core/Field.js";
 import { useFormFieldState as n } from "../hooks/use.js";
 import r, { asEditableClipboard as i } from "../events/onEvent.js";
 import { isEmptyTextLike as a } from "./visibility.js";
-import "react";
-import { Fragment as o, jsx as s, jsxs as c } from "react/jsx-runtime";
+import o from "react";
+import { Fragment as s, jsx as c, jsxs as l } from "react/jsx-runtime";
 //#region src/lib/fields/Mask.tsx
-function l(e) {
+function u(e) {
 	let t = window.getSelection();
 	if (!t || t.rangeCount === 0) return 0;
 	let n = t.getRangeAt(0);
@@ -14,88 +14,100 @@ function l(e) {
 	let r = document.createRange();
 	return r.selectNodeContents(e), r.setEnd(n.startContainer, n.startOffset), r.toString().length;
 }
-function u(e, t) {
+function d(e, t) {
 	if (t <= 0) return 0;
 	let n = 0;
 	for (let r = 0; r < e.length; r++) if (/\d/.test(e[r]) && (n++, n === t)) return r + 1;
 	return e.length;
 }
-function d({ value: d = "", form: f, onValue: p, onBlur: m, name: h = "", format: g = "+_(___) ___-__-__", placeholder: _ = "", label: v = "", error: y = "", hidden: b = !1, disabled: x = !1, className: S = "", after: C = "", before: w = "", inputmode: T = "numeric", view: E }) {
-	let D = !x, { value: O, version: k } = n(f, h, d), A = g, j = !0, M = 0, N = (e, t) => {
+function f({ value: f = "", form: p, onValue: m, onBlur: h, name: g = "", format: _ = "+_(___) ___-__-__", placeholder: v = "", label: y = "", error: b = "", hidden: x = !1, disabled: S = !1, className: C = "", after: w = "", before: T = "", inputmode: E = "numeric", view: D }) {
+	let O = !S, { value: k, version: A } = n(p, g, f), j = o.useRef(null), M = o.useRef(!1), N = _, P = !0, F = 0, I = (e, t) => {
 		let n = t.firstChild;
 		if (!n || n.nodeType !== Node.TEXT_NODE) return;
 		let r = n.textContent?.length ?? 0, i = Math.max(0, Math.min(e, r)), a = document.createRange(), o = window.getSelection();
 		o && (a.setStart(n, i), a.collapse(!0), o.removeAllRanges(), o.addRange(a), t.focus());
-	}, P = (e) => r.PasteOne(i(e)), F = (e) => {
-		A = g, j = !0, M = 0;
+	}, L = (e) => r.PasteOne(i(e)), R = (e) => {
+		N = _, P = !0, F = 0;
 		let t = 0, n = "", r = e.replace(/\D/g, "");
-		r === "" && (j = !0);
+		r === "" && (P = !0);
 		let i = r.split(""), a = "";
 		i.forEach((e) => {
-			j && (a += e, j && (M = ("" + a).length, A = g.replace(/* @__PURE__ */ RegExp("[0-9]", "g"), "_"), n = ""), M > ("" + a).length && (j = !0, A = g.replace(/* @__PURE__ */ RegExp("[0-9]", "g"), "_"), n = ""));
+			P && (a += e, P && (F = ("" + a).length, N = _.replace(/* @__PURE__ */ RegExp("[0-9]", "g"), "_"), n = ""), F > ("" + a).length && (P = !0, N = _.replace(/* @__PURE__ */ RegExp("[0-9]", "g"), "_"), n = ""));
 		});
-		let o = A.replace(/\D/g, "");
+		let o = N.replace(/\D/g, "");
 		return o.length >= r.length && (r = o), {
-			q: A.replace(/[_\d]/g, function() {
+			q: N.replace(/[_\d]/g, function() {
 				return r.charAt(t++) || "_";
 			}),
 			i: t,
 			v: r,
 			f: n
 		};
-	}, I = F(String(O || "")), L = (e) => {
-		let t = e.target, n = t.textContent || "", r = l(t), i = n.slice(0, r).replace(/\D/g, "").length, a = F(n);
+	};
+	o.useLayoutEffect(() => {
+		if (M.current) return;
+		let e = j.current;
+		if (!e) return;
+		let t = R(String(k || ""));
+		e.textContent !== t.q && (e.textContent = t.q);
+	}, [
+		k,
+		A,
+		_
+	]), R(String(k || ""));
+	let z = (e) => {
+		let t = e.target, n = t.textContent || "", r = u(t), i = n.slice(0, r).replace(/\D/g, "").length, a = R(n);
 		t.textContent = a.q;
-		let o = u(a.q, i);
+		let o = d(a.q, i);
 		a.q.length > 0 && queueMicrotask(() => {
-			N(Math.min(o, a.q.length), t);
+			I(Math.min(o, a.q.length), t);
 		});
 		let s = {
 			value: a.q.replace(/\D/g, ""),
-			name: h
+			name: g
 		};
-		f && h && f.onValue(s), p && p !== f?.onValue && p(s);
-	}, R = (e) => {
+		p && g && p.onValue(s), m && m !== p?.onValue && m(s);
+	}, B = (e) => {
 		e.key === "Enter" && e.preventDefault();
-	}, z = (e) => {
-		r.Blur(e), m && m({
+	}, V = (e) => {
+		r.Blur(e), h && h({
 			value: (e.target.textContent ?? "").replace(/\D/g, ""),
-			name: h
-		});
-	}, B = (e) => {
-		r.Focus({ target: e.currentTarget });
-	}, V = {};
-	_ && (V.placeholder = _), V.inputMode = T ?? "numeric";
-	let H = String(O ?? "").replace(/\D/g, "");
-	return b && a(H) ? /* @__PURE__ */ s(o, {}) : /* @__PURE__ */ c(t, {
+			name: g
+		}), M.current = !1;
+	}, H = (e) => {
+		M.current = !0, r.Focus({ target: e.currentTarget });
+	}, U = {};
+	v && (U.placeholder = v), U.inputMode = E ?? "numeric";
+	let W = String(k ?? "").replace(/\D/g, "");
+	return x && a(W) ? /* @__PURE__ */ c(s, {}) : /* @__PURE__ */ l(t, {
 		type: "input",
-		label: v,
-		error: y,
-		element_blok: { className: [S] },
+		label: y,
+		error: b,
+		element_blok: { className: [C] },
 		element_input: { className: [e.w] },
 		children: [
-			w,
-			/* @__PURE__ */ s("div", {
-				onPaste: P,
-				onInput: L,
-				onKeyDown: R,
-				onBlur: z,
-				onFocus: B,
+			T,
+			/* @__PURE__ */ c("div", {
+				ref: j,
+				onPaste: L,
+				onInput: z,
+				onKeyDown: B,
+				onBlur: V,
+				onFocus: H,
 				role: "textbox",
 				spellCheck: !1,
-				"aria-label": v || _ || h || "Маска",
-				"aria-disabled": !D,
-				tabIndex: x ? -1 : 0,
-				"data-disabled": !D,
-				contentEditable: D ? "plaintext-only" : !1,
+				"aria-label": y || v || g || "Маска",
+				"aria-disabled": !O,
+				tabIndex: S ? -1 : 0,
+				"data-disabled": !O,
+				contentEditable: O ? "plaintext-only" : !1,
 				suppressContentEditableWarning: !0,
-				...V,
-				children: I.q
-			}, k),
-			C
+				...U
+			}),
+			w
 		]
 	});
 }
-d.displayName = "MaskField";
+f.displayName = "MaskField";
 //#endregion
-export { d as default };
+export { f as default };

package/dist/fields/Money.js

@@ -3,10 +3,10 @@ import t from "../core/Field.js";
 import { useFormFieldState as n } from "../hooks/use.js";
 import r, { pastePlainTextIntoSelection as i } from "../events/onEvent.js";
 import { isEmptyTextLike as a } from "./visibility.js";
-import "react";
-import { jsx as o, jsxs as s } from "react/jsx-runtime";
+import o from "react";
+import { jsx as s, jsxs as c } from "react/jsx-runtime";
 //#region src/lib/fields/Money.tsx
-function c(e) {
+function l(e) {
 	let t = window.getSelection();
 	if (!t || t.rangeCount === 0) return 0;
 	let n = t.getRangeAt(0);
@@ -14,87 +14,100 @@ function c(e) {
 	let r = document.createRange();
 	return r.selectNodeContents(e), r.setEnd(n.startContainer, n.startOffset), r.toString().length;
 }
-function l(e, t, n) {
+function u(e, t, n) {
 	let r = Math.max(0, Math.min(t, e.length));
 	return n(e.slice(0, r)).length;
 }
-function u({ value: u, form: f, onValue: p, name: m = "", placeholder: h = "", label: g = "", error: _ = "", hidden: v = !1, disabled: y = !1, onBlur: b, className: x = "", after: S = "", before: C = "", inputmode: w = "decimal", course: T = 100, view: E, type: D, isClear: O = !1 }) {
-	let { value: k, version: A } = n(f, m || "", u), j = f && m ? k : u, M = (e) => D === "multi" ? e.replace(/[^+\d.+-]/g, "") : e.replace(/[^+\d.]/g, ""), N = (e, t) => {
+function d({ value: d, form: p, onValue: m, name: h = "", placeholder: g = "", label: _ = "", error: v = "", hidden: y = !1, disabled: b = !1, onBlur: x, className: S = "", after: C = "", before: w = "", inputmode: T = "decimal", course: E = 100, view: D, type: O, isClear: k = !1 }) {
+	let { value: A, version: j } = n(p, h || "", d), M = p && h ? A : d, N = o.useRef(null), P = o.useRef(!1);
+	o.useLayoutEffect(() => {
+		if (P.current) return;
+		let e = N.current;
+		if (!e) return;
+		let t = M != null && (typeof M == "number" ? !0 : !a(String(M))), n = !g || t ? f(M ?? "") : "";
+		e.textContent !== n && (e.textContent = n);
+	}, [
+		M,
+		j,
+		g
+	]);
+	let F = (e) => O === "multi" ? e.replace(/[^+\d.+-]/g, "") : e.replace(/[^+\d.]/g, ""), I = (e, t) => {
 		let n = t.firstChild;
 		if (!n || n.nodeType !== Node.TEXT_NODE) return;
 		let r = n.textContent?.length ?? 0, i = Math.max(0, Math.min(e, r)), a = document.createRange(), o = window.getSelection();
 		o && (a.setStart(n, i), a.collapse(!0), o.removeAllRanges(), o.addRange(a), t.focus());
-	}, P = (e) => {
-		let t = e.target, n = t.textContent || "", r = c(t), i = M(n), a = l(n, r, M), o = {
-			value: Number(i || 0) * T,
-			name: m
+	}, L = (e) => {
+		let t = e.target, n = t.textContent || "", r = l(t), i = F(n), a = u(n, r, F), o = {
+			value: Number(i || 0) * E,
+			name: h
 		};
-		f && m && f.onValue(o), p && p !== f?.onValue && p(o), t.textContent = i, i.length > 0 && queueMicrotask(() => {
-			N(Math.min(a, i.length), t);
+		p && h && p.onValue(o), m && m !== p?.onValue && m(o), t.textContent = i, i.length > 0 && queueMicrotask(() => {
+			I(Math.min(a, i.length), t);
 		});
-	}, F = (e) => {
+	}, R = (e) => {
 		let t = e.target;
 		r.Blur(e), (t.textContent || "") === "" && (t.textContent = "0");
 		let n = {
-			value: Number(M(t.textContent || "")) * T,
-			name: m
+			value: Number(F(t.textContent || "")) * E,
+			name: h
 		};
-		b?.(n), f && m && f.setValue(n), p && p !== f?.onValue && p(n), t.textContent = d(t.textContent || "");
-	}, I = (e) => {
+		x?.(n), m && m !== p?.onValue && m(n), t.textContent = f(t.textContent || ""), P.current = !1;
+	}, z = (e) => {
+		P.current = !0;
 		let t = e.target;
-		t.textContent = M(t.textContent || ""), r.Focus({ target: e.currentTarget });
-	}, L = (e) => {
+		t.textContent = F(t.textContent || ""), r.Focus({ target: e.currentTarget });
+	}, B = (e) => {
 		let t = e.currentTarget.previousElementSibling;
 		t && (t.textContent = "");
 		let n = {
 			value: 0,
-			name: m
+			name: h
 		};
-		f && m && f.setValue(n), p && p !== f?.onValue && p(n);
-	}, R = (e) => {
+		m && m !== p?.onValue && m(n);
+	}, V = (e) => {
 		e.key === "Enter" && e.preventDefault();
-	}, z = (e) => {
-		e.preventDefault(), i(M(e.clipboardData?.getData("text/plain") ?? ""), e.currentTarget);
-	}, B = !y, V = j == null || (typeof j == "number" ? !1 : a(String(j ?? "")));
-	if (v && V) return "";
-	let H = {};
-	return H.inputMode = w ?? "decimal", h && (H.placeholder = h), B && (H.edit = ""), /* @__PURE__ */ s(t, {
+	}, H = (e) => {
+		e.preventDefault(), i(F(e.clipboardData?.getData("text/plain") ?? ""), e.currentTarget);
+	}, U = !b, W = M == null || (typeof M == "number" ? !1 : a(String(M ?? "")));
+	if (y && W) return "";
+	let G = {};
+	return G.inputMode = T ?? "decimal", g && (G.placeholder = g), U && (G.edit = ""), /* @__PURE__ */ c(t, {
 		type: "input",
-		label: g,
-		error: _,
-		element_blok: { className: [x] },
+		label: _,
+		error: v,
+		element_blok: { className: [S] },
 		element_input: { className: [e.w] },
 		children: [
-			C,
-			/* @__PURE__ */ o("div", {
-				...H,
-				onInput: P,
-				onPaste: z,
-				onBlur: F,
-				onKeyDown: R,
-				onFocus: I,
+			w,
+			/* @__PURE__ */ s("div", {
+				ref: N,
+				...G,
+				onInput: L,
+				onPaste: H,
+				onBlur: R,
+				onKeyDown: V,
+				onFocus: z,
 				role: "textbox",
 				spellCheck: !1,
-				"aria-label": g || h || "Сумма",
-				"aria-disabled": !B,
-				tabIndex: y ? -1 : 0,
-				contentEditable: B ? "plaintext-only" : !1,
-				suppressContentEditableWarning: !0,
-				children: !h || j ? d(j ?? "") : ""
-			}, A),
-			O && /* @__PURE__ */ o("button", {
+				"aria-label": _ || g || "Сумма",
+				"aria-disabled": !U,
+				tabIndex: b ? -1 : 0,
+				contentEditable: U ? "plaintext-only" : !1,
+				suppressContentEditableWarning: !0
+			}),
+			k && /* @__PURE__ */ s("button", {
 				type: "button",
-				onClick: L,
+				onClick: B,
 				"aria-label": "Очистить поле",
 				children: "x"
 			}),
-			S
+			C
 		]
 	});
 }
-u.displayName = "MoneyField";
-function d(e, t) {
+d.displayName = "MoneyField";
+function f(e, t) {
 	return t && (e = Number(e) / t), parseFloat(String(e || 0)).toFixed(2).replace(/(\d)(?=(\d{3})+\.)/g, "$1 ");
 }
 //#endregion
-export { u as default };
+export { d as default };