@elcrm/form 0.0.87 → 0.1.0

package/dist/fields/Rating.js

@@ -1,82 +1 @@
-import e from "../styles/Field.module.js";
-import t from "../core/Field.js";
-import { useFormFieldState as n } from "../hooks/use.js";
-import r from "react";
-import { jsx as i, jsxs as a } from "react/jsx-runtime";
-//#region src/lib/fields/Rating.tsx
-function o(e, t) {
-	return Number.isFinite(e) ? Math.min(t, Math.max(0, Math.round(e))) : 0;
-}
-function s({ value: s = 0, form: c, onValue: l, onBlur: u, name: d = "", placeholder: f = "", label: p = "", error: m = "", hidden: h = !1, disabled: g = !1, className: _ = "", after: v = "", before: y = "", max: b = 5, allowClear: x = !0 }) {
-	let { value: S } = n(c, d, s), C = o(Number(S), b), w = !g, [T, E] = r.useState(0), D = (e) => {
-		let t = {
-			value: e,
-			name: d
-		};
-		c && d && c.setValue(t), l && l !== c?.onValue && l(t);
-	};
-	if (h && !C) return null;
-	let O = T || C;
-	return /* @__PURE__ */ a(t, {
-		type: "rating",
-		label: p,
-		error: m,
-		element_blok: { className: [_ || ""] },
-		element_input: {
-			className: [e.rating],
-			props: { "data-disabled": g || !w ? "true" : void 0 }
-		},
-		children: [
-			y ? /* @__PURE__ */ i("span", {
-				className: e.affix,
-				children: y
-			}) : null,
-			/* @__PURE__ */ i("div", {
-				role: "slider",
-				"aria-label": p || f || "Оценка",
-				"aria-valuemin": 0,
-				"aria-valuemax": b,
-				"aria-valuenow": C,
-				tabIndex: w ? 0 : -1,
-				onMouseLeave: () => E(0),
-				onBlur: () => {
-					E(0), u?.({
-						value: C,
-						name: d
-					});
-				},
-				onKeyDown: (e) => {
-					if (!w) return;
-					let t = C;
-					if (e.key === "ArrowRight" || e.key === "ArrowUp") t = Math.min(b, C + 1);
-					else if (e.key === "ArrowLeft" || e.key === "ArrowDown") t = Math.max(0, C - 1);
-					else if (e.key === "Home") t = 0;
-					else if (e.key === "End") t = b;
-					else return;
-					e.preventDefault(), D(t);
-				},
-				children: Array.from({ length: b }, (t, n) => {
-					let r = n + 1;
-					return /* @__PURE__ */ i("button", {
-						type: "button",
-						className: r <= O ? `${e.ratingStar} ${e.ratingStarOn}` : e.ratingStar,
-						"aria-label": `${r} из ${b}`,
-						disabled: !w,
-						onMouseEnter: () => w && E(r),
-						onClick: () => {
-							w && D(x && C === r ? 0 : r);
-						},
-						children: "★"
-					}, r);
-				})
-			}),
-			v ? /* @__PURE__ */ i("span", {
-				className: e.affix,
-				children: v
-			}) : null
-		]
-	});
-}
-s.displayName = "RatingField";
-//#endregion
-export { s as default };
+import e from"../styles/Field.module.js";import t from"../core/Field.js";import{useFormFieldState as n}from"../hooks/use.js";import r from"react";import{jsx as i,jsxs as a}from"react/jsx-runtime";function o(e,t){return Number.isFinite(e)?Math.min(t,Math.max(0,Math.round(e))):0}function s({value:s=0,form:c,onValue:l,onBlur:u,name:d=``,placeholder:f=``,label:p=``,error:m=``,hidden:h=!1,disabled:g=!1,className:_=``,after:v=``,before:y=``,max:b=5,allowClear:x=!0}){let{value:S}=n(c,d,s),C=o(Number(S),b),w=!g,[T,E]=r.useState(0),D=e=>{let t={value:e,name:d};c&&d&&c.setValue(t),l&&l!==c?.onValue&&l(t)};if(h&&!C)return null;let O=T||C;return a(t,{type:`rating`,label:p,error:m,element_blok:{className:[_||``]},element_input:{className:[e.rating],props:{"data-disabled":g||!w?`true`:void 0}},children:[y?i(`span`,{className:e.affix,children:y}):null,i(`div`,{role:`slider`,"aria-label":p||f||`Оценка`,"aria-valuemin":0,"aria-valuemax":b,"aria-valuenow":C,tabIndex:w?0:-1,onMouseLeave:()=>E(0),onBlur:()=>{E(0),u?.({value:C,name:d})},onKeyDown:e=>{if(!w)return;let t=C;if(e.key===`ArrowRight`||e.key===`ArrowUp`)t=Math.min(b,C+1);else if(e.key===`ArrowLeft`||e.key===`ArrowDown`)t=Math.max(0,C-1);else if(e.key===`Home`)t=0;else if(e.key===`End`)t=b;else return;e.preventDefault(),D(t)},children:Array.from({length:b},(t,n)=>{let r=n+1;return i(`button`,{type:`button`,className:r<=O?`${e.ratingStar} ${e.ratingStarOn}`:e.ratingStar,"aria-label":`${r} из ${b}`,disabled:!w,onMouseEnter:()=>w&&E(r),onClick:()=>{w&&D(x&&C===r?0:r)},children:`★`},r)})}),v?i(`span`,{className:e.affix,children:v}):null]})}s.displayName=`RatingField`;export{s as default};

package/dist/fields/RichText.js

@@ -1,134 +1 @@
-import e from "../styles/Field.module.js";
-import t from "../core/Field.js";
-import { useFormFieldState as n } from "../hooks/use.js";
-import { isEmptyTextLike as r } from "./visibility.js";
-import i from "react";
-import { jsx as a, jsxs as o } from "react/jsx-runtime";
-//#region src/lib/fields/RichText.tsx
-function s({ value: s = "", form: c, onValue: l, onBlur: u, name: d = "", placeholder: f = "", label: p = "", error: m = "", hidden: h = !1, disabled: g = !1, className: _ = "", after: v = "", before: y = "", maxLength: b, spellCheck: x = !0, toolbar: S = !0 }) {
-	let { value: C, version: w } = n(c, d, s), T = !g, E = typeof C == "string" ? C : "", D = i.useRef(null), O = i.useRef(!1);
-	i.useLayoutEffect(() => {
-		if (O.current) return;
-		let e = D.current;
-		e && e.innerHTML !== E && (e.innerHTML = E || "");
-	}, [E, w]);
-	let k = (e, t = !1) => {
-		let n = e;
-		if (b && n.replace(/<[^>]+>/g, "").length > b) return;
-		let r = {
-			value: n,
-			name: d
-		};
-		c && d && (t ? c.setValue(r) : c.onValue(r)), l && l !== c?.onValue && l(r);
-	}, A = (e) => {
-		if (T) {
-			D.current?.focus();
-			try {
-				document.execCommand(e, !1);
-			} catch {}
-			k(D.current?.innerHTML || "");
-		}
-	};
-	if (h && r(E.replace(/<[^>]+>/g, ""))) return null;
-	let j = {};
-	return f && !E && (j.placeholder = f), T && (j.edit = ""), /* @__PURE__ */ o(t, {
-		type: "richtext",
-		label: p,
-		error: m,
-		element_blok: { className: [_ || ""] },
-		element_input: {
-			className: [e.rich],
-			props: { "data-disabled": g || !T ? "true" : void 0 }
-		},
-		children: [
-			y ? /* @__PURE__ */ a("span", {
-				className: e.affix,
-				children: y
-			}) : null,
-			/* @__PURE__ */ o("div", {
-				className: e.richWrap,
-				children: [S ? /* @__PURE__ */ o("div", {
-					className: e.richToolbar,
-					role: "toolbar",
-					children: [
-						/* @__PURE__ */ a("button", {
-							type: "button",
-							className: e.richBtn,
-							disabled: !T,
-							"aria-label": "Жирный",
-							onMouseDown: (e) => e.preventDefault(),
-							onClick: () => A("bold"),
-							children: "B"
-						}),
-						/* @__PURE__ */ a("button", {
-							type: "button",
-							className: e.richBtn,
-							disabled: !T,
-							"aria-label": "Курсив",
-							onMouseDown: (e) => e.preventDefault(),
-							onClick: () => A("italic"),
-							children: /* @__PURE__ */ a("em", { children: "I" })
-						}),
-						/* @__PURE__ */ a("button", {
-							type: "button",
-							className: e.richBtn,
-							disabled: !T,
-							"aria-label": "Подчёркивание",
-							onMouseDown: (e) => e.preventDefault(),
-							onClick: () => A("underline"),
-							children: /* @__PURE__ */ a("u", { children: "U" })
-						}),
-						/* @__PURE__ */ a("button", {
-							type: "button",
-							className: e.richBtn,
-							disabled: !T,
-							"aria-label": "Маркированный список",
-							onMouseDown: (e) => e.preventDefault(),
-							onClick: () => A("insertUnorderedList"),
-							children: "•"
-						}),
-						/* @__PURE__ */ a("button", {
-							type: "button",
-							className: e.richBtn,
-							disabled: !T,
-							"aria-label": "Нумерованный список",
-							onMouseDown: (e) => e.preventDefault(),
-							onClick: () => A("insertOrderedList"),
-							children: "1."
-						})
-					]
-				}) : null, /* @__PURE__ */ a("div", {
-					ref: D,
-					className: e.richEditor,
-					contentEditable: T,
-					suppressContentEditableWarning: !0,
-					spellCheck: x,
-					role: "textbox",
-					"aria-multiline": !0,
-					"aria-label": p || f || "Текст",
-					tabIndex: T ? 0 : -1,
-					onFocus: () => {
-						O.current = !0;
-					},
-					onInput: () => k(D.current?.innerHTML || ""),
-					onBlur: () => {
-						O.current = !1;
-						let e = D.current?.innerHTML || "";
-						k(e, !0), u?.({
-							value: e,
-							name: d
-						});
-					},
-					...j
-				})]
-			}),
-			v ? /* @__PURE__ */ a("span", {
-				className: e.affix,
-				children: v
-			}) : null
-		]
-	});
-}
-s.displayName = "RichTextField";
-//#endregion
-export { s as default };
+import e from"../styles/Field.module.js";import t from"../core/Field.js";import{useFormFieldState as n}from"../hooks/use.js";import{isEmptyTextLike as r}from"./visibility.js";import i from"react";import{jsx as a,jsxs as o}from"react/jsx-runtime";function s({value:s=``,form:c,onValue:l,onBlur:u,name:d=``,placeholder:f=``,label:p=``,error:m=``,hidden:h=!1,disabled:g=!1,className:_=``,after:v=``,before:y=``,maxLength:b,spellCheck:x=!0,toolbar:S=!0}){let{value:C,version:w}=n(c,d,s),T=!g,E=typeof C==`string`?C:``,D=i.useRef(null),O=i.useRef(!1);i.useLayoutEffect(()=>{if(O.current)return;let e=D.current;e&&e.innerHTML!==E&&(e.innerHTML=E||``)},[E,w]);let k=(e,t=!1)=>{let n=e;if(b&&n.replace(/<[^>]+>/g,``).length>b)return;let r={value:n,name:d};c&&d&&(t?c.setValue(r):c.onValue(r)),l&&l!==c?.onValue&&l(r)},A=e=>{if(T){D.current?.focus();try{document.execCommand(e,!1)}catch{}k(D.current?.innerHTML||``)}};if(h&&r(E.replace(/<[^>]+>/g,``)))return null;let j={};return f&&!E&&(j.placeholder=f),T&&(j.edit=``),o(t,{type:`richtext`,label:p,error:m,element_blok:{className:[_||``]},element_input:{className:[e.rich],props:{"data-disabled":g||!T?`true`:void 0}},children:[y?a(`span`,{className:e.affix,children:y}):null,o(`div`,{className:e.richWrap,children:[S?o(`div`,{className:e.richToolbar,role:`toolbar`,children:[a(`button`,{type:`button`,className:e.richBtn,disabled:!T,"aria-label":`Жирный`,onMouseDown:e=>e.preventDefault(),onClick:()=>A(`bold`),children:`B`}),a(`button`,{type:`button`,className:e.richBtn,disabled:!T,"aria-label":`Курсив`,onMouseDown:e=>e.preventDefault(),onClick:()=>A(`italic`),children:a(`em`,{children:`I`})}),a(`button`,{type:`button`,className:e.richBtn,disabled:!T,"aria-label":`Подчёркивание`,onMouseDown:e=>e.preventDefault(),onClick:()=>A(`underline`),children:a(`u`,{children:`U`})}),a(`button`,{type:`button`,className:e.richBtn,disabled:!T,"aria-label":`Маркированный список`,onMouseDown:e=>e.preventDefault(),onClick:()=>A(`insertUnorderedList`),children:`•`}),a(`button`,{type:`button`,className:e.richBtn,disabled:!T,"aria-label":`Нумерованный список`,onMouseDown:e=>e.preventDefault(),onClick:()=>A(`insertOrderedList`),children:`1.`})]}):null,a(`div`,{ref:D,className:e.richEditor,contentEditable:T,suppressContentEditableWarning:!0,spellCheck:x,role:`textbox`,"aria-multiline":!0,"aria-label":p||f||`Текст`,tabIndex:T?0:-1,onFocus:()=>{O.current=!0},onInput:()=>k(D.current?.innerHTML||``),onBlur:()=>{O.current=!1;let e=D.current?.innerHTML||``;k(e,!0),u?.({value:e,name:d})},...j})]}),v?a(`span`,{className:e.affix,children:v}):null]})}s.displayName=`RichTextField`;export{s as default};

package/dist/fields/Select.d.ts

@@ -1,3 +1,4 @@
+import { default as React } from 'react';
 import { TInput } from './type';
 type SelectOptionObject = Record<number, {
     n: string;
@@ -18,4 +19,5 @@ declare function SelectField({ value, form, onValue, name, placeholder, label, e
 declare namespace SelectField {
     var displayName: string;
 }
-export default SelectField;
+declare const _default: React.MemoExoticComponent<typeof SelectField>;
+export default _default;

package/dist/fields/Select.js

@@ -1,159 +1 @@
-import e from "../styles/Field.module.js";
-import t from "../core/Field.js";
-import { useFormFieldState as n } from "../hooks/use.js";
-import { acquireOverlayZIndex as r, releaseOverlayZIndex as i } from "../overlayZ.js";
-import a from "../styles/Select.module.js";
-import o, { useEffect as s, useState as c } from "react";
-import { Fragment as l, jsx as u, jsxs as d } from "react/jsx-runtime";
-import { createPortal as f } from "react-dom";
-//#region src/lib/fields/Select.tsx
-function p({ value: r = 0, form: i, onValue: s, name: c = "", placeholder: p = "", label: h, error: g, hidden: _ = !1, disabled: v = !1, className: y, after: b = "", before: x = "", options: S, order: C, size: w = "md" }) {
-	let [T, E] = o.useState(!1), [D, O] = o.useState(0), [k, A] = o.useState(null), j = o.useId(), { value: M } = n(i, c, r ?? 0), N = Number(M), P = [];
-	S && (P = Array.isArray(S) ? S.map((e) => ({
-		id: e.id ?? e.i ?? 0,
-		label: e.n || "",
-		hidden: e.s === 0
-	})).filter((e) => e.id !== 0 && e.label.length > 0) : Object.keys(S).map((e) => {
-		let t = Number(e), n = S[t];
-		return {
-			id: t,
-			label: n?.n || "",
-			hidden: n?.s === 0
-		};
-	}).filter((e) => e.label.length > 0));
-	let F = (() => {
-		if (!C || C.length === 0) return P;
-		let e = new Map(P.map((e) => [e.id, e]));
-		return C.map((t) => e.get(t)).filter((e) => !!e);
-	})().filter((e) => !e.hidden), I = (e) => F.find((t) => t.id === e)?.label, L = T && F.length > 0 ? `${j}-opt-${D}` : void 0, R = (e) => {
-		let t = {
-			value: e,
-			name: c
-		};
-		i && c && i.onValue(t), s && s !== i?.onValue && s(t);
-	}, z = (e) => {
-		if (F.length === 0 || v) return;
-		let t = F.findIndex((e) => e.id === N);
-		A(e.getBoundingClientRect()), O(t >= 0 ? t : 0), E(!0);
-	}, B = (e) => {
-		z(e.currentTarget);
-	}, V = (e) => {
-		if (!v && F.length !== 0) {
-			if (!T && (e.key === "ArrowDown" || e.key === "Enter" || e.key === " ")) {
-				e.preventDefault(), z(e.currentTarget);
-				return;
-			}
-			if (T) {
-				if (e.key === "Escape") {
-					e.preventDefault(), E(!1);
-					return;
-				}
-				if (e.key === "ArrowDown") {
-					e.preventDefault(), O((e) => (e + 1) % F.length);
-					return;
-				}
-				if (e.key === "ArrowUp") {
-					e.preventDefault(), O((e) => e - 1 < 0 ? F.length - 1 : e - 1);
-					return;
-				}
-				if (e.key === "Enter") {
-					e.preventDefault();
-					let t = F[D];
-					t && R(t.id), E(!1);
-				}
-			}
-		}
-	}, H = {};
-	p && (H.placeholder = p);
-	let U = I(N), W = (U === void 0 || U === "") && !!p, G = N === 0 || I(N) === void 0;
-	return _ && G ? "" : /* @__PURE__ */ d(l, { children: [/* @__PURE__ */ d(t, {
-		type: "select",
-		label: h,
-		element_blok: { className: [y || ""] },
-		error: g,
-		size: w,
-		element_input: {
-			className: [a.f],
-			props: {
-				onClick: B,
-				onKeyDown: V,
-				tabIndex: v ? -1 : 0,
-				role: "combobox",
-				"aria-expanded": T,
-				"aria-haspopup": "listbox",
-				"aria-controls": j,
-				...L ? { "aria-activedescendant": L } : {},
-				"aria-disabled": v,
-				"data-disabled": v
-			}
-		},
-		children: [
-			x ? /* @__PURE__ */ u("span", {
-				className: e.affix,
-				children: x
-			}) : null,
-			/* @__PURE__ */ u("div", {
-				...H,
-				className: W ? a.placeholderValue : void 0,
-				children: U ?? p ?? ""
-			}),
-			b ? /* @__PURE__ */ u("span", {
-				className: e.affix,
-				children: b
-			}) : null
-		]
-	}), T && f(/* @__PURE__ */ u(m, {
-		parent: k || void 0,
-		onValue: R,
-		className: y,
-		items: F,
-		setOpen: E,
-		listId: j,
-		activeIndex: D,
-		currentValue: N
-	}), document.body)] });
-}
-p.displayName = "SelectField";
-var m = ({ onValue: e, parent: t, className: n, items: o, setOpen: f, listId: p, activeIndex: m, currentValue: g }) => {
-	let [_] = c(() => r());
-	if (s(() => () => i(_), [_]), !t) return null;
-	let v = () => {
-		f(!1);
-	}, y = (t) => {
-		f(!1), e(t);
-	}, b = window.innerHeight - t.bottom < 306 ? Math.max(6, t.top - 300 - 6) : Math.min(window.innerHeight - 300 - 6, t.bottom + 6), x = Math.max(t.width, 260), S = Math.min(Math.max(6, t.left), window.innerWidth - x - 6);
-	return /* @__PURE__ */ d(l, { children: [/* @__PURE__ */ u("div", {
-		className: a.o,
-		style: { zIndex: _ },
-		onClick: v,
-		"aria-hidden": !0
-	}), /* @__PURE__ */ u("div", {
-		className: [a.l, n].filter((e) => e !== void 0).join(" "),
-		style: {
-			top: b + "px",
-			left: S + "px",
-			width: x,
-			zIndex: _ + 1
-		},
-		children: /* @__PURE__ */ u(h, {
-			listId: p,
-			items: o,
-			link: y,
-			activeIndex: m,
-			currentValue: g
-		})
-	})] });
-}, h = ({ listId: e, items: t, link: n, activeIndex: r, currentValue: i }) => /* @__PURE__ */ u("ul", {
-	id: e,
-	role: "listbox",
-	children: t.map((t, a) => /* @__PURE__ */ u("li", {
-		id: `${e}-opt-${a}`,
-		role: "option",
-		"aria-selected": i === t.id,
-		"data-focus": r === a ? "true" : "false",
-		onClick: () => n(t.id),
-		children: t.label
-	}, t.id))
-});
-//#endregion
-export { p as default };
+import e from"../styles/Field.module.js";import t from"../core/Field.js";import{useFormFieldState as n}from"../hooks/use.js";import{acquireOverlayZIndex as r,releaseOverlayZIndex as i}from"../overlayZ.js";import a from"../styles/Select.module.js";import o,{useEffect as s,useState as c}from"react";import{Fragment as l,jsx as u,jsxs as d}from"react/jsx-runtime";import{createPortal as f}from"react-dom";function p({value:r=0,form:i,onValue:c,name:p=``,placeholder:m=``,label:g,error:_,hidden:v=!1,disabled:y=!1,className:b,after:x=``,before:S=``,options:C,order:w,size:T=`md`}){let[E,D]=o.useState(!1),[O,k]=o.useState(0),[A,j]=o.useState(null),M=o.useRef(null),N=o.useId(),P=o.useCallback(()=>{let e=M.current;if(!e)return;let t=e.getBoundingClientRect();j(e=>e&&e.top===t.top&&e.left===t.left&&e.width===t.width&&e.height===t.height&&e.bottom===t.bottom?e:t)},[]);s(()=>{if(!E)return;P();let e=()=>P();return window.addEventListener(`scroll`,e,!0),window.addEventListener(`resize`,e),()=>{window.removeEventListener(`scroll`,e,!0),window.removeEventListener(`resize`,e)}},[E,P]);let{value:F}=n(i,p,r??0),I=Number(F),L=[];C&&(L=Array.isArray(C)?C.map(e=>({id:e.id??e.i??0,label:e.n||``,hidden:e.s===0})).filter(e=>e.id!==0&&e.label.length>0):Object.keys(C).map(e=>{let t=Number(e),n=C[t];return{id:t,label:n?.n||``,hidden:n?.s===0}}).filter(e=>e.label.length>0));let R=(()=>{if(!w||w.length===0)return L;let e=new Map(L.map(e=>[e.id,e]));return w.map(t=>e.get(t)).filter(e=>!!e)})().filter(e=>!e.hidden),z=e=>R.find(t=>t.id===e)?.label,B=E&&R.length>0?`${N}-opt-${O}`:void 0,V=e=>{let t={value:e,name:p};i&&p&&i.setValue(t),c&&c!==i?.onValue&&c(t)},H=e=>{if(R.length===0||y)return;let t=R.findIndex(e=>e.id===I);M.current=e;let n=e.getBoundingClientRect(),r=t>=0?t:0;j(n),k(r),D(!0)},U=e=>{H(e.currentTarget)},W=e=>{if(!y&&R.length!==0){if(!E&&(e.key===`ArrowDown`||e.key===`Enter`||e.key===` `)){e.preventDefault(),H(e.currentTarget);return}if(E){if(e.key===`Escape`){e.preventDefault(),D(!1);return}if(e.key===`ArrowDown`){e.preventDefault(),k(e=>(e+1)%R.length);return}if(e.key===`ArrowUp`){e.preventDefault(),k(e=>e-1<0?R.length-1:e-1);return}if(e.key===`Enter`){e.preventDefault();let t=R[O];t&&V(t.id),D(!1)}}}},G={};m&&(G.placeholder=m);let K=z(I),q=(K===void 0||K===``)&&!!m,J=I===0||z(I)===void 0;return v&&J?``:d(l,{children:[d(t,{type:`select`,label:g,element_blok:{className:[b||``]},error:_,size:T,element_input:{className:[a.f],props:{onClick:U,onKeyDown:W,tabIndex:y?-1:0,role:`combobox`,"aria-expanded":E,"aria-haspopup":`listbox`,"aria-controls":N,...B?{"aria-activedescendant":B}:{},"aria-disabled":y,"data-disabled":y}},children:[S?u(`span`,{className:e.affix,children:S}):null,u(`div`,{...G,className:q?a.placeholderValue:void 0,children:K??m??``}),x?u(`span`,{className:e.affix,children:x}):null]}),E&&f(u(h,{parent:A||void 0,onValue:V,className:b,items:R,setOpen:D,listId:N,activeIndex:O,currentValue:I}),document.body)]})}p.displayName=`SelectField`;var m=o.memo(p),h=({onValue:e,parent:t,className:n,items:o,setOpen:f,listId:p,activeIndex:m,currentValue:h})=>{let[_]=c(()=>r());if(s(()=>()=>i(_),[_]),!t)return null;let v=()=>{f(!1)},y=t=>{f(!1),e(t)},b=Math.min(300,Math.max(52,o.length*52+8)),x=window.innerHeight-t.bottom-6-8,S=t.top-6-8,C=x<Math.min(b,160)&&S>x,w=Math.max(t.width,260),T=Math.min(Math.max(8,t.left),window.innerWidth-w-8);return d(l,{children:[u(`div`,{className:a.o,style:{zIndex:_},onClick:v,"aria-hidden":!0}),u(`div`,{className:[a.l,n].filter(e=>e!==void 0).join(` `),style:{...C?{bottom:`${window.innerHeight-t.top+6}px`}:{top:`${t.bottom+6}px`},left:T+`px`,width:w,zIndex:_+1},children:u(g,{listId:p,items:o,link:y,activeIndex:m,currentValue:h})})]})},g=({listId:e,items:t,link:n,activeIndex:r,currentValue:i})=>u(`ul`,{id:e,role:`listbox`,children:t.map((t,a)=>u(`li`,{id:`${e}-opt-${a}`,role:`option`,"aria-selected":i===t.id,"data-focus":r===a?`true`:`false`,onClick:()=>n(t.id),children:t.label},t.id))});export{m as default};

package/dist/fields/Tags.js

@@ -1,97 +1 @@
-import e from "../styles/Field.module.js";
-import t from "../core/Field.js";
-import { useFormFieldState as n } from "../hooks/use.js";
-import r from "react";
-import { jsx as i, jsxs as a } from "react/jsx-runtime";
-//#region src/lib/fields/Tags.tsx
-function o(e) {
-	return Array.isArray(e) ? e.map(String).map((e) => e.trim()).filter(Boolean) : typeof e == "string" && e.trim() ? e.split(",").map((e) => e.trim()).filter(Boolean) : [];
-}
-function s({ value: s = [], form: c, onValue: l, onBlur: u, name: d = "", placeholder: f = "Добавить…", label: p = "", error: m = "", hidden: h = !1, disabled: g = !1, className: _ = "", after: v = "", before: y = "", maxTags: b, maxLength: x, separators: S = [",", "Enter"] }) {
-	let { value: C } = n(c, d, s), w = o(C), T = !g, [E, D] = r.useState(""), O = r.useRef(null), k = (e) => {
-		let t = {
-			value: e,
-			name: d
-		};
-		c && d && c.setValue(t), l && l !== c?.onValue && l(t);
-	}, A = (e) => {
-		let t = e.trim();
-		if (t && !(x && t.length > x)) {
-			if (w.some((e) => e.toLowerCase() === t.toLowerCase())) {
-				D("");
-				return;
-			}
-			b !== void 0 && w.length >= b || (k([...w, t]), D(""));
-		}
-	}, j = (e) => {
-		T && k(w.filter((t, n) => n !== e));
-	}, M = (e) => {
-		if (T) {
-			if (S.includes(e.key) || e.key === "," && S.includes(",")) {
-				e.preventDefault(), A(E);
-				return;
-			}
-			e.key === "Backspace" && !E && w.length > 0 && (e.preventDefault(), j(w.length - 1));
-		}
-	}, N = w.length === 0;
-	return h && N ? null : /* @__PURE__ */ a(t, {
-		type: "tags",
-		label: p,
-		error: m,
-		element_blok: { className: [_ || ""] },
-		element_input: {
-			className: [e.tags],
-			props: {
-				"data-disabled": g || !T ? "true" : void 0,
-				onClick: () => O.current?.focus()
-			}
-		},
-		children: [
-			y ? /* @__PURE__ */ i("span", {
-				className: e.affix,
-				children: y
-			}) : null,
-			/* @__PURE__ */ a("div", {
-				className: e.tagsInner,
-				children: [w.map((t, n) => /* @__PURE__ */ a("span", {
-					className: e.tagChip,
-					children: [/* @__PURE__ */ i("span", {
-						className: e.tagLabel,
-						children: t
-					}), T ? /* @__PURE__ */ i("button", {
-						type: "button",
-						className: e.tagRemove,
-						"aria-label": `Удалить ${t}`,
-						onClick: (e) => {
-							e.stopPropagation(), j(n);
-						},
-						children: "×"
-					}) : null]
-				}, `${t}-${n}`)), T && (b === void 0 || w.length < b) ? /* @__PURE__ */ i("input", {
-					ref: O,
-					className: e.tagInput,
-					value: E,
-					placeholder: w.length === 0 ? f : "",
-					disabled: g,
-					maxLength: x,
-					"aria-label": p || f || "Теги",
-					onChange: (e) => D(e.target.value),
-					onKeyDown: M,
-					onBlur: () => {
-						E.trim() && A(E), u?.({
-							value: w,
-							name: d
-						});
-					}
-				}) : null]
-			}),
-			v ? /* @__PURE__ */ i("span", {
-				className: e.affix,
-				children: v
-			}) : null
-		]
-	});
-}
-s.displayName = "TagsField";
-//#endregion
-export { s as default };
+import e from"../styles/Field.module.js";import t from"../core/Field.js";import{useFormFieldState as n}from"../hooks/use.js";import r from"react";import{jsx as i,jsxs as a}from"react/jsx-runtime";function o(e){return Array.isArray(e)?e.map(String).map(e=>e.trim()).filter(Boolean):typeof e==`string`&&e.trim()?e.split(`,`).map(e=>e.trim()).filter(Boolean):[]}function s({value:s=[],form:c,onValue:l,onBlur:u,name:d=``,placeholder:f=`Добавить…`,label:p=``,error:m=``,hidden:h=!1,disabled:g=!1,className:_=``,after:v=``,before:y=``,maxTags:b,maxLength:x,separators:S=[`,`,`Enter`]}){let{value:C}=n(c,d,s),w=o(C),T=!g,[E,D]=r.useState(``),O=r.useRef(null),k=e=>{let t={value:e,name:d};c&&d&&c.setValue(t),l&&l!==c?.onValue&&l(t)},A=e=>{let t=e.trim();if(t&&!(x&&t.length>x)){if(w.some(e=>e.toLowerCase()===t.toLowerCase())){D(``);return}b!==void 0&&w.length>=b||(k([...w,t]),D(``))}},j=e=>{T&&k(w.filter((t,n)=>n!==e))},M=e=>{if(T){if(S.includes(e.key)||e.key===`,`&&S.includes(`,`)){e.preventDefault(),A(E);return}e.key===`Backspace`&&!E&&w.length>0&&(e.preventDefault(),j(w.length-1))}},N=w.length===0;return h&&N?null:a(t,{type:`tags`,label:p,error:m,element_blok:{className:[_||``]},element_input:{className:[e.tags],props:{"data-disabled":g||!T?`true`:void 0,onClick:()=>O.current?.focus()}},children:[y?i(`span`,{className:e.affix,children:y}):null,a(`div`,{className:e.tagsInner,children:[w.map((t,n)=>a(`span`,{className:e.tagChip,children:[i(`span`,{className:e.tagLabel,children:t}),T?i(`button`,{type:`button`,className:e.tagRemove,"aria-label":`Удалить ${t}`,onClick:e=>{e.stopPropagation(),j(n)},children:`×`}):null]},`${t}-${n}`)),T&&(b===void 0||w.length<b)?i(`input`,{ref:O,className:e.tagInput,value:E,placeholder:w.length===0?f:``,disabled:g,maxLength:x,"aria-label":p||f||`Теги`,onChange:e=>D(e.target.value),onKeyDown:M,onBlur:()=>{E.trim()&&A(E),u?.({value:w,name:d})}}):null]}),v?i(`span`,{className:e.affix,children:v}):null]})}s.displayName=`TagsField`;export{s as default};

package/dist/fields/Textarea.d.ts

@@ -1,6 +1,6 @@
 import { TInput } from './type';
 /** TextareaField — многострочное поле (contentEditable). */
-declare function TextareaField({ value, form, onValue, name, placeholder, label, hidden, disabled, onBlur: onBlurField, className, after, before, error, size, inputmode, maxLength, spellCheck, }: TInput): import("react/jsx-runtime").JSX.Element;
+declare function TextareaField({ value, form, onValue, name, placeholder, label, hidden, disabled, onBlur: onBlurField, className, after, before, error, size, inputmode, maxLength, spellCheck, }: TInput): import("react/jsx-runtime").JSX.Element | null;
 declare namespace TextareaField {
     var displayName: string;
 }

package/dist/fields/Textarea.js

@@ -1,68 +1 @@
-import e from "../styles/Field.module.js";
-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 o from "react";
-import { Fragment as s, jsx as c, jsxs as l } from "react/jsx-runtime";
-//#region src/lib/fields/Textarea.tsx
-function u({ value: u, form: d, onValue: f, name: p = "", placeholder: m = "", label: h = "", hidden: g = !1, disabled: _ = !1, onBlur: v, className: y = "", after: b = "", before: x = "", error: S = "", size: C = "md", inputmode: w = "text", maxLength: T, spellCheck: E = !0 }) {
-	let { value: D, version: O } = n(d, p || "", u), k = !_, A = String(D ?? ""), j = o.useRef(null), M = o.useRef(!1);
-	o.useLayoutEffect(() => {
-		if (M.current) return;
-		let e = j.current;
-		e && e.innerText !== A && (e.innerText = A);
-	}, [A, O]);
-	let N = (e) => {
-		let t = {
-			value: e.currentTarget.innerText,
-			name: p || ""
-		};
-		d && p && d.onValue(t), f && f !== d?.onValue && f(t);
-	}, P = (e) => {
-		let t = (e.currentTarget.textContent ?? "").trim();
-		T && t.length >= T && e.key !== "Backspace" && e.preventDefault(), e.key === "Enter" && !e.shiftKey && e.preventDefault();
-	}, F = (e) => r.Paste(T || 0, i(e));
-	if (g && a(D)) return /* @__PURE__ */ c(s, {});
-	let I = {};
-	return m && (I.placeholder = m), k && (I.edit = ""), I.inputMode = w || "text", /* @__PURE__ */ l(t, {
-		type: "note",
-		label: h,
-		error: S,
-		size: C,
-		element_blok: { className: [y || ""] },
-		element_input: { className: [e.n] },
-		children: [
-			x ? /* @__PURE__ */ c("span", {
-				className: e.affix,
-				children: x
-			}) : null,
-			/* @__PURE__ */ c("div", {
-				ref: j,
-				onPaste: F,
-				onInput: N,
-				onFocus: () => {
-					M.current = !0;
-				},
-				onBlur: (e) => {
-					r.Blur(e), v?.({
-						value: (e.currentTarget.textContent ?? "").trim(),
-						name: p || ""
-					}), M.current = !1;
-				},
-				onKeyDown: P,
-				spellCheck: E,
-				contentEditable: k ? "plaintext-only" : !1,
-				suppressContentEditableWarning: !0,
-				...I
-			}),
-			b ? /* @__PURE__ */ c("span", {
-				className: e.affix,
-				children: b
-			}) : null
-		]
-	});
-}
-u.displayName = "TextareaField";
-//#endregion
-export { u as default };
+import e from"../styles/Field.module.js";import t,{useFieldA11y as n}from"../core/Field.js";import{useFormFieldState as r}from"../hooks/use.js";import i,{asEditableClipboard as a}from"../events/onEvent.js";import{isEmptyTextLike as o}from"./visibility.js";import s from"react";import{jsx as c,jsxs as l}from"react/jsx-runtime";function u({value:n,form:u,onValue:f,name:p=``,placeholder:m=``,label:h=``,hidden:g=!1,disabled:_=!1,onBlur:v,className:y=``,after:b=``,before:x=``,error:S=``,size:C=`md`,inputmode:w=`text`,maxLength:T,spellCheck:E=!0}){let{value:D,version:O}=r(u,p||``,n),k=!_,A=String(D??``),j=s.useRef(null),M=s.useRef(!1);s.useLayoutEffect(()=>{if(M.current)return;let e=j.current;e&&e.innerText!==A&&(e.innerText=A)},[A,O]);let N=e=>{let t={value:e.currentTarget.innerText,name:p||``};u&&p&&u.onValue(t),f&&f!==u?.onValue&&f(t)},P=e=>{let t=(e.currentTarget.textContent??``).trim();T&&t.length>=T&&e.key!==`Backspace`&&e.preventDefault(),e.key===`Enter`&&!e.shiftKey&&e.preventDefault()},F=e=>i.Paste(T||0,a(e));if(g&&o(D))return null;let I={};return m&&(I.placeholder=m),k&&(I.edit=``),I.inputMode=w||`text`,l(t,{type:`note`,label:h,error:S,size:C,element_blok:{className:[y||``]},element_input:{className:[e.n]},children:[x?c(`span`,{className:e.affix,children:x}):null,c(d,{divRef:j,editable:k,label:h,placeholder:m,spellCheck:E,dd:I,onPaste:F,onInput:N,onFocus:()=>{M.current=!0},onBlur:e=>{i.Blur(e),v?.({value:(e.currentTarget.textContent??``).trim(),name:p||``}),M.current=!1},onKeyDown:P}),b?c(`span`,{className:e.affix,children:b}):null]})}function d({divRef:e,editable:t,label:r,placeholder:i,spellCheck:a,dd:o,onPaste:s,onInput:l,onFocus:u,onBlur:d,onKeyDown:f}){let p=n();return c(`div`,{ref:e,id:p?.controlId,role:`textbox`,"aria-multiline":`true`,"aria-label":r?void 0:i||`Текст`,"aria-describedby":p?.describedBy,"aria-invalid":p?.errorId?!0:void 0,tabIndex:t?0:-1,onPaste:s,onInput:l,onFocus:u,onBlur:d,onKeyDown:f,spellCheck:a,contentEditable:t?`plaintext-only`:!1,suppressContentEditableWarning:!0,...o})}u.displayName=`TextareaField`;export{u as default};