@elcrm/form 0.1.2 → 0.1.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (94) hide show
  1. package/README.md +162 -204
  2. package/dist/assets/styles/Check.module.css +1 -1
  3. package/dist/assets/styles/Code.module.css +1 -1
  4. package/dist/assets/styles/Color.module.css +1 -1
  5. package/dist/assets/styles/Drag.module.css +1 -1
  6. package/dist/assets/styles/Field.module.css +1 -1
  7. package/dist/assets/styles/FieldGroup.module.css +1 -0
  8. package/dist/assets/styles/File.module.css +1 -1
  9. package/dist/assets/styles/Form.module.css +1 -1
  10. package/dist/assets/styles/Radio.module.css +1 -1
  11. package/dist/assets/styles/Rating.module.css +1 -1
  12. package/dist/assets/styles/Rich.module.css +1 -1
  13. package/dist/assets/styles/Select.module.css +1 -1
  14. package/dist/assets/styles/Tabs.module.css +1 -0
  15. package/dist/assets/styles/Tags.module.css +1 -1
  16. package/dist/assets/styles/Time.module.css +1 -1
  17. package/dist/core/Field.d.ts +26 -10
  18. package/dist/core/Field.js +2 -2
  19. package/dist/dark.css +34 -11
  20. package/dist/fields/Card.d.ts +12 -0
  21. package/dist/fields/Card.js +1 -0
  22. package/dist/fields/Check.d.ts +6 -2
  23. package/dist/fields/Check.js +1 -1
  24. package/dist/fields/Code.d.ts +13 -4
  25. package/dist/fields/Code.js +1 -1
  26. package/dist/fields/Color.d.ts +8 -13
  27. package/dist/fields/Color.js +1 -1
  28. package/dist/fields/ColorPanel.d.ts +16 -0
  29. package/dist/fields/ColorPanel.js +1 -0
  30. package/dist/fields/Date.d.ts +3 -1
  31. package/dist/fields/Date.js +1 -1
  32. package/dist/fields/DateCalendar.d.ts +16 -0
  33. package/dist/fields/DateCalendar.js +1 -0
  34. package/dist/fields/Display.d.ts +8 -5
  35. package/dist/fields/Display.js +2 -1
  36. package/dist/fields/DragDrop.d.ts +13 -3
  37. package/dist/fields/DragDrop.js +1 -1
  38. package/dist/fields/Email.d.ts +6 -3
  39. package/dist/fields/Email.js +1 -1
  40. package/dist/fields/FieldGroup.d.ts +107 -0
  41. package/dist/fields/FieldGroup.js +1 -0
  42. package/dist/fields/File.js +1 -1
  43. package/dist/fields/Hidden.js +1 -1
  44. package/dist/fields/Input.js +1 -1
  45. package/dist/fields/Mask.d.ts +2 -1
  46. package/dist/fields/Mask.js +1 -1
  47. package/dist/fields/Modal.js +1 -1
  48. package/dist/fields/Money.d.ts +2 -1
  49. package/dist/fields/Money.js +1 -1
  50. package/dist/fields/NativeTextField.js +1 -1
  51. package/dist/fields/Numeric.d.ts +2 -1
  52. package/dist/fields/Numeric.js +1 -1
  53. package/dist/fields/Options.js +1 -1
  54. package/dist/fields/Password.js +1 -1
  55. package/dist/fields/Percent.js +1 -1
  56. package/dist/fields/Phone.js +1 -1
  57. package/dist/fields/Radio.d.ts +3 -1
  58. package/dist/fields/Radio.js +1 -1
  59. package/dist/fields/Range.d.ts +9 -6
  60. package/dist/fields/Range.js +1 -1
  61. package/dist/fields/Rating.js +1 -1
  62. package/dist/fields/RichText.js +1 -1
  63. package/dist/fields/Select.js +1 -1
  64. package/dist/fields/Tabs.d.ts +30 -0
  65. package/dist/fields/Tabs.js +1 -0
  66. package/dist/fields/Tags.js +1 -1
  67. package/dist/fields/Textarea.js +1 -1
  68. package/dist/fields/Time.js +1 -1
  69. package/dist/fields/TimePicker.d.ts +15 -0
  70. package/dist/fields/TimePicker.js +1 -0
  71. package/dist/fields/cardUtils.d.ts +37 -0
  72. package/dist/fields/cardUtils.js +1 -0
  73. package/dist/fields/colorUtils.d.ts +29 -0
  74. package/dist/fields/colorUtils.js +1 -0
  75. package/dist/fields/dateUtils.d.ts +32 -0
  76. package/dist/fields/dateUtils.js +1 -0
  77. package/dist/fields/emailUtils.d.ts +4 -0
  78. package/dist/fields/emailUtils.js +1 -0
  79. package/dist/fields/timeUtils.d.ts +23 -0
  80. package/dist/fields/timeUtils.js +1 -0
  81. package/dist/fields/type.d.ts +4 -3
  82. package/dist/hooks/use.d.ts +12 -7
  83. package/dist/index.d.ts +19 -9
  84. package/dist/index.js +2 -2
  85. package/dist/index.umd.js +3 -2
  86. package/dist/light.css +35 -12
  87. package/dist/package.js +1 -1
  88. package/dist/style.css +17 -13
  89. package/dist/styles/Code.module.js +1 -1
  90. package/dist/styles/Color.module.js +1 -1
  91. package/dist/styles/Field.module.js +1 -1
  92. package/dist/styles/FieldGroup.module.js +1 -0
  93. package/dist/styles/Tabs.module.js +1 -0
  94. package/package.json +1 -1
@@ -1 +1 @@
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"../styles/Form.module.js";import{acquireOverlayZIndex as a,releaseOverlayZIndex as o}from"../overlayZ.js";import s from"react";import{Fragment as c,jsx as l,jsxs as u}from"react/jsx-runtime";import{createPortal as d}from"react-dom";function f(e){return!!(e==null||typeof e==`string`&&r(e)||e instanceof Date&&Number.isNaN(e.getTime()))}function p(e,t,n,r){let i=new Date(e,t-1,1);return!(n&&new Date(e,t,0)<n||r&&i>r)}function m(e,t,n){return!(t&&e<t.getFullYear()||n&&e>n.getFullYear())}function h(e,t,n){let r=e;if(t){let e=t.getFullYear();r+11<e&&(r=e-11),r<e&&(r=e)}if(n){let e=n.getFullYear();r>e&&(r=e-11),r+11>e&&(r=e-11)}return r}function g(e){if(!(e instanceof HTMLElement))return!1;let t=e.tagName;return t===`INPUT`||t===`TEXTAREA`||t===`SELECT`?!0:!!e.isContentEditable}function _(e){let t=(e||``).trim();if(!t)return null;let n=t.split(/\s+/)[0].replace(/,/g,`.`),r=(e,t,n)=>{if(t<1||t>12||n<1||n>31)return null;let r=e<100?2e3+e:e,i=new Date(r,t-1,n);return Number.isNaN(i.getTime())||i.getFullYear()!==r||i.getMonth()!==t-1||i.getDate()!==n?null:i},i=/^(\d{1,2})[./](\d{1,2})[./](\d{2,4})$/.exec(n);if(i)return r(parseInt(i[3],10),parseInt(i[2],10),parseInt(i[1],10));if(i=/^(\d{4})-(\d{1,2})-(\d{1,2})$/.exec(n),i)return r(parseInt(i[1],10),parseInt(i[2],10),parseInt(i[3],10));if(i=/^(\d{1,2})\/(\d{1,2})\/(\d{2,4})$/.exec(n),i)return r(parseInt(i[3],10),parseInt(i[2],10),parseInt(i[1],10));let a=n.replace(/\D/g,``);return a.length===8?r(parseInt(a.slice(4,8),10),parseInt(a.slice(2,4),10),parseInt(a.slice(0,2),10))||r(parseInt(a.slice(0,4),10),parseInt(a.slice(4,6),10),parseInt(a.slice(6,8),10)):null}function v(e,t,n){let r=e.getTime();return t&&r<t.getTime()&&(r=t.getTime()),n&&r>n.getTime()&&(r=n.getTime()),new Date(r)}function y(e){return e.getFullYear()+`-`+w(2,e.getMonth()+1)+`-`+w(2,e.getDate())}function b({label:i=``,error:a,hidden:o=!1,className:p,placeholder:m,disabled:h=!1,onValue:b,max:S,min:C,form:w,icon:E,name:D=``,value:O,after:k=``,before:A=``}){let j=s.useCallback(e=>{if(e==null||typeof e==`string`&&r(e))return``;if(e instanceof Date)return Number.isNaN(e.getTime())?``:e;if(typeof e==`string`||typeof e==`number`){let t=new Date(e);return Number.isNaN(t.getTime())?``:e}return``},[]),{value:M}=n(w,D,O),[N,P]=s.useState(j(M)),F=s.useRef(null),[I,L]=s.useState(null),[R,z]=s.useState(!1),B=s.useCallback(()=>{let e=F.current;if(!e)return;let t=e.getBoundingClientRect();L({x:t.left,y:t.top,b:t.bottom})},[]);s.useEffect(()=>{if(!R)return;B();let e=()=>{B()};return window.addEventListener(`scroll`,e,!0),window.addEventListener(`resize`,e),()=>{window.removeEventListener(`scroll`,e,!0),window.removeEventListener(`resize`,e)}},[R,B]),s.useEffect(()=>{P(j(M))},[M,j]);let V=s.useCallback(e=>{let t={value:e,name:D};P(e),w&&D&&w.setValue(t),b&&b!==w?.onValue&&b(t)},[w,D,b]);s.useEffect(()=>{if(!R||h)return;let e=``,t=t=>{let n=_(t);if(!n)return!1;let r=y(v(n,C,S));return r===e?!0:(e=r,V(r),z(!1),!0)},n=e=>{g(e.target)||t(e.clipboardData?.getData(`text/plain`)??``)&&(e.preventDefault(),e.stopPropagation())},r=e=>{(e.ctrlKey||e.metaKey)&&(e.key!==`v`&&e.key!==`V`||g(e.target)||navigator.clipboard?.readText&&(e.preventDefault(),navigator.clipboard.readText().then(e=>{t(e)})))};return document.addEventListener(`paste`,n,!0),window.addEventListener(`keydown`,r,!0),()=>{document.removeEventListener(`paste`,n,!0),window.removeEventListener(`keydown`,r,!0)}},[R,h,C,S,V]);let H=e=>{if(h)return;let t=e.currentTarget.getBoundingClientRect();L({x:t.left,y:t.top,b:t.bottom}),z(!0)},U={};m&&(U.placeholder=m);let W=M==null||M===``||typeof M==`string`&&r(M);return o&&W?l(c,{}):u(c,{children:[E?E():u(t,{type:`date`,label:i,error:a,element_blok:{className:[p||``]},element_input:{className:[e.w],props:{"data-disabled":h?`true`:void 0}},children:[A?l(`span`,{className:e.a,children:A}):null,l(`div`,{ref:F,onClick:H,onKeyDown:e=>{(e.key===`Enter`||e.key===` `)&&(e.preventDefault(),H(e))},tabIndex:h?-1:0,role:`button`,"aria-haspopup":`dialog`,"aria-expanded":R,"aria-label":i||m||`Дата`,"data-edit":h?void 0:`true`,...U,style:{cursor:h?`not-allowed`:`pointer`},children:f(N)?``:T(N,`dd.mm.yyyy`)}),k?l(`span`,{className:e.a,children:k}):null]}),R&&I&&d(l(x,{position:I,onValue:V,date:N,max:S,min:C,onOpen:z,className:p},`elcrm-date-popup`),document.body)]})}b.displayName=`DateField`;var x=({date:e,onValue:t,position:n,max:r,min:d,className:f,onOpen:g})=>{let[_]=s.useState(()=>a());s.useEffect(()=>()=>o(_),[_]);let v=new Date,y=new Date(e);Number.isNaN(y.getTime())&&(y=new Date);let b={y:v.getFullYear(),d:v.getDate(),m:v.getMonth()+1},x={y:y.getFullYear(),d:y.getDate(),m:y.getMonth()+1},[S,T]=s.useState({y:x.y,m:x.m}),[E,D]=s.useState(`days`),[O,k]=s.useState(()=>h(x.y-5,d,r)),A=e=>{let t=e.getDay();return t===0&&(t=7),t-1},j=[`пн`,`вт`,`ср`,`чт`,`пт`,`сб`,`вс`],M=S.m-1,N=new Date(S.y,M),P=[];for(let e=0;e<A(N);e++)P.push(0);for(;N.getMonth()===M;)P.push(N.getDate()),N.setDate(N.getDate()+1);let F=()=>{g(!1)},I=()=>{W(S.m+1,S.y)},L=()=>{W(S.m-1,S.y)},R=()=>{E===`days`?L():E===`months`?W(S.m,S.y-1):k(e=>h(e-12,d,r))},z=()=>{E===`days`?I():E===`months`?W(S.m,S.y+1):k(e=>h(e+12,d,r))},B=e=>{e.stopPropagation(),k(h(S.y-5,d,r)),D(`years`)},V=e=>{p(S.y,e,d,r)&&(T({y:S.y,m:e}),D(`days`))},H=e=>{m(e,d,r)&&(T({y:e,m:S.m}),D(`days`))},U=e=>{t(S.y+`-`+w(2,S.m)+`-`+w(2,e)),F()},W=(e,t)=>{t=e>12?t+1:e<1?t-1:t,e=e>12?1:e<1?12:e,T({y:t,m:e})},G=e=>b.y===S.y&&b.m===S.m&&b.d===e?{"data-active":`true`}:{},K=e=>x.y===S.y&&x.m===S.m&&x.d===e?{"data-current":`true`}:{},q=e=>{let t=!0;return r&&r.getTime()<new Date(S.y,S.m-1,e).getTime()&&(t=!1),d&&d.getTime()>new Date(S.y,S.m-1,e).getTime()&&(t=!1),t},J=window.innerHeight-n.b<360?Math.max(8,n.y-360):n.b;J=Math.min(J,window.innerHeight-360-8),J=Math.max(8,J);let Y=window.innerWidth-n.x<270?n.x-246:n.x;return Y=Math.max(8,Math.min(Y,window.innerWidth-270-8)),u(c,{children:[l(`div`,{className:i.o,style:{zIndex:_},onClick:()=>F()}),u(`div`,{className:[i.c,f&&f+`-backdrop`].join(` `),style:{top:J+`px`,left:Y+`px`,zIndex:_+1},onClick:e=>e.stopPropagation(),children:[u(`s`,{children:[l(`i`,{onClick:e=>{e.stopPropagation(),R()},children:l(`svg`,{width:`16`,height:`16`,fill:`currentColor`,viewBox:`0 0 24 24`,xmlns:`http://www.w3.org/2000/svg`,children:l(`path`,{d:`m15.09 4.594-7.646 6.553a1.126 1.126 0 0 0 0 1.708l7.647 6.552c.73.625 1.857.107 1.857-.854V5.447c0-.961-1.127-1.48-1.857-.853Z`})})}),u(`h2`,{children:[l(`span`,{className:i.h,onClick:e=>{e.stopPropagation(),D(E===`years`?`months`:E===`months`?`days`:`months`)},title:E===`years`?`К списку месяцев`:E===`months`?`К календарю`:`Выбрать месяц`,children:C(S.m).name}),l(`span`,{className:i.y,onClick:e=>{e.stopPropagation(),E===`years`?D(`days`):B(e)},title:E===`years`?`К календарю`:`Выбрать год`,children:S.y})]}),l(`i`,{onClick:e=>{e.stopPropagation(),z()},children:l(`svg`,{width:`16`,height:`16`,fill:`currentColor`,viewBox:`0 0 24 24`,xmlns:`http://www.w3.org/2000/svg`,children:l(`path`,{d:`m8.91 19.406 7.646-6.552a1.125 1.125 0 0 0 0-1.709L8.91 4.593c-.73-.625-1.857-.107-1.857.854v13.107c0 .96 1.127 1.479 1.857.852Z`})})})]}),E===`days`&&u(`div`,{"grid-calendar":``,role:`grid`,"aria-label":`Календарь`,children:[j.map((e,t)=>l(`p`,{role:`columnheader`,children:e},`v`+t)),P.map((e,t)=>l(`span`,{role:`gridcell`,children:e!==0&&q(e)?l(`b`,{role:`button`,tabIndex:0,"aria-label":`${e}`,...G(e),...K(e),"aria-selected":K(e)[`data-current`]?`true`:void 0,onClick:()=>U(e),onKeyDown:t=>{(t.key===`Enter`||t.key===` `)&&(t.preventDefault(),U(e))},children:e}):l(`p`,{"aria-disabled":e===0?void 0:!0,...G(e),...K(e),children:e===0?``:e})},t))]}),E===`months`&&l(`div`,{"grid-month":``,role:`listbox`,"aria-label":`Месяц`,children:Array.from({length:12},(e,t)=>{let n=t+1,a=p(S.y,n,d,r),o=b.y===S.y&&b.m===n?{"data-active":`true`}:{},s=x.y===S.y&&x.m===n?{"data-current":`true`}:{};return l(`b`,{role:`option`,tabIndex:a?0:-1,"aria-selected":s[`data-current`]?`true`:`false`,"aria-disabled":a?void 0:!0,className:a?``:i.d,...o,...s,onClick:()=>a&&V(n),onKeyDown:e=>{a&&(e.key===`Enter`||e.key===` `)&&(e.preventDefault(),V(n))},children:C(n).abc},n)})}),E===`years`&&l(`div`,{"grid-month":``,role:`listbox`,"aria-label":`Год`,children:Array.from({length:12},(e,t)=>{let n=O+t,a=m(n,d,r),o=b.y===n?{"data-active":`true`}:{},s=x.y===n?{"data-current":`true`}:{};return l(`b`,{role:`option`,tabIndex:a?0:-1,"aria-selected":s[`data-current`]?`true`:`false`,"aria-disabled":a?void 0:!0,className:a?``:i.d,...o,...s,onClick:()=>a&&H(n),onKeyDown:e=>{a&&(e.key===`Enter`||e.key===` `)&&(e.preventDefault(),H(n))},children:n},n)})})]})]})},S={val:`01`,name:`—`,names:`—`,abc:`—`};function C(e){let t=typeof e==`number`?e:new Date(e).getMonth()+1;return(!Number.isFinite(t)||t<1||t>12)&&(t=new Date().getMonth()+1),{1:{val:`01`,name:`Январь`,names:`Января`,abc:`Янв`},2:{val:`02`,name:`Февраль`,names:`Февраля`,abc:`Февр`},3:{val:`03`,name:`Март`,names:`Марта`,abc:`Март`},4:{val:`04`,name:`Апрель`,names:`Апреля`,abc:`Апр`},5:{val:`05`,name:`Май`,names:`Мая`,abc:`Май`},6:{val:`06`,name:`Июнь`,names:`Июня`,abc:`Июнь`},7:{val:`07`,name:`Июль`,names:`Июля`,abc:`Июль`},8:{val:`08`,name:`Август`,names:`Августа`,abc:`Авг`},9:{val:`09`,name:`Сентябрь`,names:`Сентября`,abc:`Сент`},10:{val:`10`,name:`Октябрь`,names:`Октября`,abc:`Окт`},11:{val:`11`,name:`Ноябрь`,names:`Ноября`,abc:`Нояб`},12:{val:`12`,name:`Декабрь`,names:`Декабря`,abc:`Дек`}}[t]??S}function w(e,t){let n=t+``;for(;n.length<e;)n=`0`+n;return n}function T(e,t){let n,r;t===void 0?(r=String(e),n=new Date):(r=t,n=new Date(e)),Number.isNaN(n.getTime())&&(n=new Date);let i=r,a={yyyy:n.getFullYear(),yy:(``+n.getFullYear()).slice(-2),mm:(`0`+(n.getMonth()+1)).slice(-2),dd:(`0`+n.getDate()).slice(-2),HH:(`0`+n.getHours()).slice(-2),MM:(`0`+n.getMinutes()).slice(-2),SS:(`0`+n.getSeconds()).slice(-2),__:` \xA0\xA0\xA0\xA0 `,_:` \xA0\xA0 `};for(let e in a)i=i.replace(e,String(a[e]));return i}export{b as default};
1
+ import e from"../styles/Field.module.js";import t from"../core/Field.js";import{useFormFieldState as n}from"../hooks/use.js";import{createFieldEmit as r}from"./emit.js";import{isEmptyTextLike as i}from"./visibility.js";import{FormatDate as a,clampDateValue as o,isDateDisplayEmpty as s,isEditablePasteTarget as c,parseClipboardDate as l,toStoreDateString as u}from"./dateUtils.js";import d from"./DateCalendar.js";import f from"react";import{Fragment as p,jsx as m,jsxs as h}from"react/jsx-runtime";import{createPortal as g}from"react-dom";function _({label:_=``,error:v,hidden:y=!1,className:b,placeholder:x,disabled:S=!1,onValue:C,max:w,min:T,form:E,icon:D,name:O=``,value:k,after:A=``,before:j=``}){let M=f.useCallback(e=>{if(e==null||typeof e==`string`&&i(e))return``;if(e instanceof Date)return Number.isNaN(e.getTime())?``:e;if(typeof e==`string`||typeof e==`number`){let t=new Date(e);return Number.isNaN(t.getTime())?``:e}return``},[]),{value:N}=n(E,O,k),[P,F]=f.useState(M(N)),I=f.useRef(null),[L,R]=f.useState(null),[z,B]=f.useState(!1),V=f.useCallback(()=>{let e=I.current;if(!e)return;let t=e.getBoundingClientRect();R({x:t.left,y:t.top,b:t.bottom})},[]);f.useEffect(()=>{if(!z)return;V();let e=()=>{V()};return window.addEventListener(`scroll`,e,!0),window.addEventListener(`resize`,e),()=>{window.removeEventListener(`scroll`,e,!0),window.removeEventListener(`resize`,e)}},[z,V]),f.useEffect(()=>{F(M(N))},[N,M]);let H=f.useCallback(e=>{F(e),r(E,O,C)(e,!0)},[E,O,C]);f.useEffect(()=>{if(!z||S)return;let e=``,t=t=>{let n=l(t);if(!n)return!1;let r=u(o(n,T,w));return r===e?!0:(e=r,H(r),B(!1),!0)},n=e=>{c(e.target)||t(e.clipboardData?.getData(`text/plain`)??``)&&(e.preventDefault(),e.stopPropagation())},r=e=>{(e.ctrlKey||e.metaKey)&&(e.key!==`v`&&e.key!==`V`||c(e.target)||navigator.clipboard?.readText&&(e.preventDefault(),navigator.clipboard.readText().then(e=>{t(e)})))};return document.addEventListener(`paste`,n,!0),window.addEventListener(`keydown`,r,!0),()=>{document.removeEventListener(`paste`,n,!0),window.removeEventListener(`keydown`,r,!0)}},[z,S,T,w,H]);let U=e=>{if(S)return;let t=e.currentTarget.getBoundingClientRect();R({x:t.left,y:t.top,b:t.bottom}),B(!0)},W={};x&&(W.placeholder=x);let G=N==null||N===``||typeof N==`string`&&i(N);return y&&G?m(p,{}):h(p,{children:[D?D():h(t,{type:`date`,label:_,error:v,element_blok:{className:[b||``]},element_input:{className:[e.w],props:{"data-disabled":S?`true`:void 0}},children:[j?m(`span`,{className:e.a,children:j}):null,m(`div`,{ref:I,onClick:U,onKeyDown:e=>{(e.key===`Enter`||e.key===` `)&&(e.preventDefault(),U(e))},tabIndex:S?-1:0,role:`button`,"aria-haspopup":`dialog`,"aria-expanded":z,"aria-label":_||x||`Дата`,"data-edit":S?void 0:`true`,...W,style:{cursor:S?`not-allowed`:`pointer`},children:s(P)?``:a(P,`dd.mm.yyyy`)}),A?m(`span`,{className:e.a,children:A}):null]}),z&&L&&g(m(d,{position:L,onValue:H,date:P,max:w,min:T,onOpen:B,className:b},`elcrm-date-popup`),document.body)]})}_.displayName=`DateField`;export{_ as default};
@@ -0,0 +1,16 @@
1
+ import { TDatePosition } from './dateUtils';
2
+ export type TDateCalendarProps = {
3
+ date: Date | string | number;
4
+ onValue: (value: string) => void;
5
+ position: TDatePosition;
6
+ max?: Date;
7
+ min?: Date;
8
+ className?: string;
9
+ onOpen: (open: boolean) => void;
10
+ };
11
+ /** Попап календаря даты (портал). */
12
+ declare function DateCalendar({ date, onValue, position, max, min, className, onOpen, }: TDateCalendarProps): import("react/jsx-runtime").JSX.Element;
13
+ declare namespace DateCalendar {
14
+ var displayName: string;
15
+ }
16
+ export default DateCalendar;
@@ -0,0 +1 @@
1
+ import e from"../styles/Form.module.js";import{acquireOverlayZIndex as t,releaseOverlayZIndex as n}from"../overlayZ.js";import{FormatMonth as r,FormatNumber as i,clampYearPageStart as a,isMonthInRange as o,isYearInRange as s}from"./dateUtils.js";import c from"react";import{Fragment as l,jsx as u,jsxs as d}from"react/jsx-runtime";function f({date:f,onValue:p,position:m,max:h,min:g,className:_,onOpen:v}){let[y]=c.useState(()=>t());c.useEffect(()=>()=>n(y),[y]);let b=new Date,x=new Date(f);Number.isNaN(x.getTime())&&(x=new Date);let S={y:b.getFullYear(),d:b.getDate(),m:b.getMonth()+1},C={y:x.getFullYear(),d:x.getDate(),m:x.getMonth()+1},[w,T]=c.useState({y:C.y,m:C.m}),[E,D]=c.useState(`days`),[O,k]=c.useState(()=>a(C.y-5,g,h)),A=e=>{let t=e.getDay();return t===0&&(t=7),t-1},j=[`пн`,`вт`,`ср`,`чт`,`пт`,`сб`,`вс`],M=w.m-1,N=new Date(w.y,M),P=[];for(let e=0;e<A(N);e++)P.push(0);for(;N.getMonth()===M;)P.push(N.getDate()),N.setDate(N.getDate()+1);let F=()=>{v(!1)},I=()=>{W(w.m+1,w.y)},L=()=>{W(w.m-1,w.y)},R=()=>{E===`days`?L():E===`months`?W(w.m,w.y-1):k(e=>a(e-12,g,h))},z=()=>{E===`days`?I():E===`months`?W(w.m,w.y+1):k(e=>a(e+12,g,h))},B=e=>{e.stopPropagation(),k(a(w.y-5,g,h)),D(`years`)},V=e=>{o(w.y,e,g,h)&&(T({y:w.y,m:e}),D(`days`))},H=e=>{s(e,g,h)&&(T({y:e,m:w.m}),D(`days`))},U=e=>{p(w.y+`-`+i(2,w.m)+`-`+i(2,e)),F()},W=(e,t)=>{t=e>12?t+1:e<1?t-1:t,e=e>12?1:e<1?12:e,T({y:t,m:e})},G=e=>S.y===w.y&&S.m===w.m&&S.d===e?{"data-active":`true`}:{},K=e=>C.y===w.y&&C.m===w.m&&C.d===e?{"data-current":`true`}:{},q=e=>{let t=!0;return h&&h.getTime()<new Date(w.y,w.m-1,e).getTime()&&(t=!1),g&&g.getTime()>new Date(w.y,w.m-1,e).getTime()&&(t=!1),t},J=window.innerHeight-m.b<360?Math.max(8,m.y-360):m.b;J=Math.min(J,window.innerHeight-360-8),J=Math.max(8,J);let Y=window.innerWidth-m.x<270?m.x-246:m.x;return Y=Math.max(8,Math.min(Y,window.innerWidth-270-8)),d(l,{children:[u(`div`,{className:e.o,style:{zIndex:y},onClick:()=>F()}),d(`div`,{className:[e.c,_&&_+`-backdrop`].join(` `),style:{top:J+`px`,left:Y+`px`,zIndex:y+1},onClick:e=>e.stopPropagation(),children:[d(`s`,{children:[u(`i`,{onClick:e=>{e.stopPropagation(),R()},children:u(`svg`,{width:`16`,height:`16`,fill:`currentColor`,viewBox:`0 0 24 24`,xmlns:`http://www.w3.org/2000/svg`,children:u(`path`,{d:`m15.09 4.594-7.646 6.553a1.126 1.126 0 0 0 0 1.708l7.647 6.552c.73.625 1.857.107 1.857-.854V5.447c0-.961-1.127-1.48-1.857-.853Z`})})}),d(`h2`,{children:[u(`span`,{className:e.h,onClick:e=>{e.stopPropagation(),D(E===`years`?`months`:E===`months`?`days`:`months`)},title:E===`years`?`К списку месяцев`:E===`months`?`К календарю`:`Выбрать месяц`,children:r(w.m).name}),u(`span`,{className:e.y,onClick:e=>{e.stopPropagation(),E===`years`?D(`days`):B(e)},title:E===`years`?`К календарю`:`Выбрать год`,children:w.y})]}),u(`i`,{onClick:e=>{e.stopPropagation(),z()},children:u(`svg`,{width:`16`,height:`16`,fill:`currentColor`,viewBox:`0 0 24 24`,xmlns:`http://www.w3.org/2000/svg`,children:u(`path`,{d:`m8.91 19.406 7.646-6.552a1.125 1.125 0 0 0 0-1.709L8.91 4.593c-.73-.625-1.857-.107-1.857.854v13.107c0 .96 1.127 1.479 1.857.852Z`})})})]}),E===`days`&&d(`div`,{"grid-calendar":``,role:`grid`,"aria-label":`Календарь`,children:[j.map((e,t)=>u(`p`,{role:`columnheader`,children:e},`v`+t)),P.map((e,t)=>u(`span`,{role:`gridcell`,children:e!==0&&q(e)?u(`b`,{role:`button`,tabIndex:0,"aria-label":`${e}`,...G(e),...K(e),"aria-selected":K(e)[`data-current`]?`true`:void 0,onClick:()=>U(e),onKeyDown:t=>{(t.key===`Enter`||t.key===` `)&&(t.preventDefault(),U(e))},children:e}):u(`p`,{"aria-disabled":e===0?void 0:!0,...G(e),...K(e),children:e===0?``:e})},t))]}),E===`months`&&u(`div`,{"grid-month":``,role:`listbox`,"aria-label":`Месяц`,children:Array.from({length:12},(t,n)=>{let i=n+1,a=o(w.y,i,g,h),s=S.y===w.y&&S.m===i?{"data-active":`true`}:{},c=C.y===w.y&&C.m===i?{"data-current":`true`}:{};return u(`b`,{role:`option`,tabIndex:a?0:-1,"aria-selected":c[`data-current`]?`true`:`false`,"aria-disabled":a?void 0:!0,className:a?``:e.d,...s,...c,onClick:()=>a&&V(i),onKeyDown:e=>{a&&(e.key===`Enter`||e.key===` `)&&(e.preventDefault(),V(i))},children:r(i).abc},i)})}),E===`years`&&u(`div`,{"grid-month":``,role:`listbox`,"aria-label":`Год`,children:Array.from({length:12},(t,n)=>{let r=O+n,i=s(r,g,h),a=S.y===r?{"data-active":`true`}:{},o=C.y===r?{"data-current":`true`}:{};return u(`b`,{role:`option`,tabIndex:i?0:-1,"aria-selected":o[`data-current`]?`true`:`false`,"aria-disabled":i?void 0:!0,className:i?``:e.d,...a,...o,onClick:()=>i&&H(r),onKeyDown:e=>{i&&(e.key===`Enter`||e.key===` `)&&(e.preventDefault(),H(r))},children:r},r)})})]})]})}f.displayName=`DateCalendar`;export{f as default};
@@ -1,17 +1,20 @@
1
1
  import { TInput } from './type';
2
2
  /**
3
- * DisplayField (Readonly) — только отображение значения в layout поля.
4
- * Не принимает ввод; удобно для превью / рассчитанных полей.
3
+ * DisplayField (Readonly) — только показ значения.
4
+ * Вид как у StringField / TextareaField (капсула + disabled).
5
5
  */
6
6
  export type TDisplay = TInput & {
7
7
  /** Форматтер отображаемого текста */
8
8
  format?: (value: unknown) => string;
9
9
  emptyText?: string;
10
+ /**
11
+ * Многострочный вид (как TextareaField).
12
+ * По умолчанию — если в тексте есть переносы `\n`.
13
+ */
14
+ multiline?: boolean;
10
15
  };
11
- declare function DisplayField({ value, form, name, placeholder, label, error, hidden, className, after, before, format, emptyText, size, }: TDisplay): import("react/jsx-runtime").JSX.Element | null;
16
+ declare function DisplayField({ value, form, name, placeholder, label, error, hidden, disabled, className, after, before, format, emptyText, size, multiline, }: TDisplay): import("react/jsx-runtime").JSX.Element | null;
12
17
  declare namespace DisplayField {
13
18
  var displayName: string;
14
19
  }
15
- /** @deprecated используйте `DisplayField` */
16
- export { DisplayField as ReadonlyField };
17
20
  export default DisplayField;
@@ -1 +1,2 @@
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"react";import{jsx as i,jsxs as a}from"react/jsx-runtime";function o(e){if(e==null)return``;if(typeof e==`string`)return e;if(typeof e==`number`||typeof e==`boolean`)return String(e);if(Array.isArray(e))return e.map(String).join(`, `);try{return JSON.stringify(e)}catch{return String(e)}}function s({value:s=``,form:c,name:l=``,placeholder:u=``,label:d=``,error:f=``,hidden:p=!1,className:m=``,after:h=``,before:g=``,format:_=o,emptyText:v,size:y=`md`}){let{value:b}=n(c,l,s),x=_(b),S=!x.trim(),C=S?v||u||`—`:x;return p&&r(b)?null:a(t,{type:`display`,label:d,error:f,size:y,element_blok:{className:[m||``]},element_input:{className:[e.w,e.d],props:{"data-readonly":`true`}},children:[g?i(`span`,{className:e.a,children:g}):null,i(`div`,{className:S?e.z:void 0,"aria-label":d||`Значение`,children:C}),h?i(`span`,{className:e.a,children:h}):null]})}s.displayName=`DisplayField`;export{s as default};
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"react";import{jsx as i,jsxs as a}from"react/jsx-runtime";function o(e){if(e==null)return``;if(typeof e==`string`)return e;if(typeof e==`number`||typeof e==`boolean`)return String(e);if(Array.isArray(e))return e.map(String).join(`, `);try{return JSON.stringify(e)}catch{return String(e)}}function s({value:s=``,form:c,name:l=``,placeholder:u=``,label:d=``,error:f=``,hidden:p=!1,disabled:m=!1,className:h=``,after:g=``,before:_=``,format:v=o,emptyText:y,size:b=`m`,multiline:x}){let{value:S}=n(c,l,s),C=v(S),w=!C.trim(),T=w?y||u||`—`:C,E=x===!0||x!==!1&&T.includes(`
2
+ `);return p&&r(S)?null:a(t,{type:`display`,label:d,error:f,size:b,element_blok:{className:[h||``]},element_input:{className:[E?e.n:e.w,e.d],props:{"data-readonly":`true`,"data-disabled":m?`true`:void 0,"data-multiline":E?`true`:void 0}},children:[_?i(`span`,{className:e.a,children:_}):null,i(`div`,{className:w?e.z:void 0,"aria-label":d||`Значение`,"aria-readonly":`true`,"aria-disabled":m?!0:void 0,children:T}),g?i(`span`,{className:e.a,children:g}):null]})}s.displayName=`DisplayField`;export{s as default};
@@ -1,4 +1,6 @@
1
1
  import { TInput } from './type';
2
+ /** Раскладка зоны: default · fill (100% родителя) · overlay (прозрачная поверх превью) */
3
+ export type TDragDropLayout = "default" | "fill" | "overlay";
2
4
  /** DragDropField — зона перетаскивания файлов (+ клик для выбора). */
3
5
  export type TDragDrop = TInput & {
4
6
  accept?: string;
@@ -16,11 +18,19 @@ export type TDragDrop = TInput & {
16
18
  hint?: string;
17
19
  /** Дописывать к уже выбранным при multiple (по умолчанию true) */
18
20
  append?: boolean;
21
+ /**
22
+ * Раскладка без локальных !important-хаков.
23
+ * - `fill` — высота 100% контейнера
24
+ * - `overlay` — как fill + прозрачный фон (превью снизу)
25
+ */
26
+ layout?: TDragDropLayout;
27
+ /** CSS aspect-ratio на зоне (число или строка, напр. `1` / `"16/9"`) */
28
+ aspectRatio?: string | number;
29
+ /** Скрыть список файлов и «Очистить всё» (часто с overlay) */
30
+ hideList?: boolean;
19
31
  };
20
- declare function DragDropField({ value, form, onValue, onBlur: onBlurField, name, placeholder, label, error, hidden, disabled, className, after, before, accept, multiple, maxSize, maxFiles, keepFile, hint, append, }: TDragDrop): import("react/jsx-runtime").JSX.Element | null;
32
+ declare function DragDropField({ value, form, onValue, onBlur: onBlurField, name, placeholder, label, error, hidden, disabled, className, after, before, accept, multiple, maxSize, maxFiles, keepFile, hint, append, layout, aspectRatio, hideList, }: TDragDrop): import("react/jsx-runtime").JSX.Element | null;
21
33
  declare namespace DragDropField {
22
34
  var displayName: string;
23
35
  }
24
- /** Алиас на случай опечатки «DragonDrop» */
25
- export { DragDropField as DragonDropField };
26
36
  export default DragDropField;
@@ -1 +1 @@
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"../styles/File.module.js";import i from"../styles/Drag.module.js";import a from"react";import{jsx as o,jsxs as s}from"react/jsx-runtime";function c(e){return{name:e.name,size:e.size,type:e.type,lastModified:e.lastModified}}function l(e){return typeof File<`u`&&e instanceof File?c(e):e}function u(e){return e?Array.isArray(e)?e:typeof File<`u`&&e instanceof File||typeof e==`object`&&e&&`name`in e?[e]:[]:[]}function d(e){return e<1024?`${e} Б`:e<1024*1024?`${(e/1024).toFixed(1)} КБ`:`${(e/(1024*1024)).toFixed(1)} МБ`}function f(e,t){if(!t||!t.trim())return!0;let n=t.split(`,`).map(e=>e.trim().toLowerCase()).filter(Boolean);if(n.length===0)return!0;let r=e.name.toLowerCase(),i=(e.type||``).toLowerCase();return n.some(e=>{if(e.startsWith(`.`))return r.endsWith(e);if(e.endsWith(`/*`)){let t=e.slice(0,-1);return i.startsWith(t)}return i===e})}function p(e){return`${e.name}:${e.size}`}function m({value:m,form:h,onValue:g,onBlur:_,name:v=``,placeholder:y=`Перетащите файлы сюда или нажмите`,label:b=``,error:x=``,hidden:S=!1,disabled:C=!1,className:w=``,after:T=``,before:E=``,accept:D,multiple:O=!0,maxSize:k,maxFiles:A,keepFile:j=!0,hint:M,append:N=!0}){let{value:P}=n(h,v,m),F=u(P),I=!C,L=a.useRef(null),[R,z]=a.useState(``),[B,V]=a.useState(!1),H=a.useRef(0),U=e=>{let t={value:e,name:v};h&&v&&h.setValue(t),g&&g!==h?.onValue&&g(t)},W=e=>{if(e.length===0)return;let t=e.filter(e=>!f(e,D));if(t.length>0){z(`Тип файла не подходит: ${t.map(e=>e.name).join(`, `)}`);return}if(k!==void 0){let t=e.find(e=>e.size>k);if(t){z(`Файл «${t.name}» больше ${d(k)}`);return}}let n;if(!O)n=[e[0]];else if(N&&F.length>0){let t=new Set(F.map(e=>p(e))),r=e.filter(e=>!t.has(p(e))),i=F.filter(e=>typeof File<`u`&&e instanceof File);n=j&&i.length===F.length?[...i,...r]:[...e]}else n=e;if(A!==void 0&&n.length>A){z(`Не больше ${A} файлов`);return}z(``);let r=j?O?n:n[0]:O?n.map(c):c(n[0]);U(r),_?.({value:r,name:v})},G=()=>{I&&(U(O?[]:null),L.current&&(L.current.value=``),z(``))},K=e=>{if(!I)return;if(!O){G();return}let t=F.filter((t,n)=>n!==e);U(j?t:t.map(l)),L.current&&(L.current.value=``)},q=e=>{e.preventDefault(),e.stopPropagation(),I&&(H.current+=1,V(!0))},J=e=>{e.preventDefault(),e.stopPropagation(),--H.current,H.current<=0&&(H.current=0,V(!1))},Y=e=>{e.preventDefault(),e.stopPropagation(),e.dataTransfer&&(e.dataTransfer.dropEffect=I?`copy`:`none`)},X=e=>{e.preventDefault(),e.stopPropagation(),H.current=0,V(!1),I&&W(Array.from(e.dataTransfer.files||[]))},Z=F.length===0;if(S&&Z)return null;let Q=x||R,$=M||y;return s(t,{type:`dragdrop`,label:b,error:Q,element_blok:{className:[w||``]},element_input:{className:[i.r],props:{"data-disabled":C||!I?`true`:void 0,"data-dragging":B?`true`:void 0}},children:[E?o(`span`,{className:e.a,children:E}):null,s(`div`,{className:i.i,children:[o(`input`,{ref:L,type:`file`,className:r.p,accept:D,multiple:O,disabled:C||!I,"aria-label":b||y||`Файлы`,onChange:e=>{W(Array.from(e.target.files||[])),e.target.value=``}}),s(`button`,{type:`button`,className:i.z,disabled:!I,"data-dragging":B?`true`:void 0,onClick:()=>L.current?.click(),onDragEnter:q,onDragLeave:J,onDragOver:Y,onDrop:X,children:[o(`span`,{className:i.h,children:$}),D?o(`span`,{className:i.a,children:D}):null]}),Z?null:o(`ul`,{className:i.l,children:F.map((e,t)=>s(`li`,{className:i.t,children:[s(`div`,{className:i.m,children:[o(`span`,{className:i.n,title:e.name,children:e.name}),o(`span`,{className:i.s,children:d(e.size)})]}),I?o(`button`,{type:`button`,className:i.d,"aria-label":`Удалить ${e.name}`,onClick:()=>K(t),children:`×`}):null]},`${e.name}-${t}`))}),!Z&&I?o(`button`,{type:`button`,className:i.c,onClick:G,children:`Очистить всё`}):null]}),T?o(`span`,{className:e.a,children:T}):null]})}m.displayName=`DragDropField`;export{m as default};
1
+ import e from"../styles/Field.module.js";import t from"../core/Field.js";import{useFormFieldState as n}from"../hooks/use.js";import{createFieldEmit as r}from"./emit.js";import i from"../styles/File.module.js";import a from"../styles/Drag.module.js";import o from"react";import{jsx as s,jsxs as c}from"react/jsx-runtime";function l(e){return{name:e.name,size:e.size,type:e.type,lastModified:e.lastModified}}function u(e){return typeof File<`u`&&e instanceof File?l(e):e}function d(e){return e?Array.isArray(e)?e:typeof File<`u`&&e instanceof File||typeof e==`object`&&e&&`name`in e?[e]:[]:[]}function f(e){return e<1024?`${e} Б`:e<1024*1024?`${(e/1024).toFixed(1)} КБ`:`${(e/(1024*1024)).toFixed(1)} МБ`}function p(e,t){if(!t||!t.trim())return!0;let n=t.split(`,`).map(e=>e.trim().toLowerCase()).filter(Boolean);if(n.length===0)return!0;let r=e.name.toLowerCase(),i=(e.type||``).toLowerCase();return n.some(e=>{if(e.startsWith(`.`))return r.endsWith(e);if(e.endsWith(`/*`)){let t=e.slice(0,-1);return i.startsWith(t)}return i===e})}function m(e){return`${e.name}:${e.size}`}function h({value:h,form:g,onValue:_,onBlur:v,name:y=``,placeholder:b=`Перетащите файлы сюда или нажмите`,label:x=``,error:S=``,hidden:C=!1,disabled:w=!1,className:T=``,after:E=``,before:D=``,accept:O,multiple:k=!0,maxSize:A,maxFiles:j,keepFile:M=!0,hint:N,append:P=!0,layout:F=`default`,aspectRatio:I,hideList:L=!1}){let{value:R}=n(g,y,h),z=d(R),B=!w,V=o.useRef(null),[H,U]=o.useState(``),[W,G]=o.useState(!1),K=o.useRef(0),q=e=>{r(g,y,_)(e,!0)},J=e=>{if(e.length===0)return;let t=e.filter(e=>!p(e,O));if(t.length>0){U(`Тип файла не подходит: ${t.map(e=>e.name).join(`, `)}`);return}if(A!==void 0){let t=e.find(e=>e.size>A);if(t){U(`Файл «${t.name}» больше ${f(A)}`);return}}let n;if(!k)n=[e[0]];else if(P&&z.length>0){let t=new Set(z.map(e=>m(e))),r=e.filter(e=>!t.has(m(e))),i=z.filter(e=>typeof File<`u`&&e instanceof File);n=M&&i.length===z.length?[...i,...r]:[...e]}else n=e;if(j!==void 0&&n.length>j){U(`Не больше ${j} файлов`);return}U(``);let r=M?k?n:n[0]:k?n.map(l):l(n[0]);q(r),v?.({value:r,name:y})},Y=()=>{B&&(q(k?[]:null),V.current&&(V.current.value=``),U(``))},X=e=>{if(!B)return;if(!k){Y();return}let t=z.filter((t,n)=>n!==e);q(M?t:t.map(u)),V.current&&(V.current.value=``)},ee=e=>{e.preventDefault(),e.stopPropagation(),B&&(K.current+=1,G(!0))},te=e=>{e.preventDefault(),e.stopPropagation(),--K.current,K.current<=0&&(K.current=0,G(!1))},ne=e=>{e.preventDefault(),e.stopPropagation(),e.dataTransfer&&(e.dataTransfer.dropEffect=B?`copy`:`none`)},re=e=>{e.preventDefault(),e.stopPropagation(),K.current=0,G(!1),B&&J(Array.from(e.dataTransfer.files||[]))},Z=z.length===0;if(C&&Z)return null;let ie=S||H,ae=N||b,Q=I==null?void 0:typeof I==`number`?String(I):I,$=!L&&!Z;return c(t,{type:`dragdrop`,label:x,error:ie,element_blok:{className:[T||``]},element_input:{className:[a.r],props:{"data-disabled":w||!B?`true`:void 0,"data-dragging":W?`true`:void 0,"data-layout":F===`default`?void 0:F,style:Q?{"--field-drag-aspect":Q}:void 0}},children:[D?s(`span`,{className:e.a,children:D}):null,c(`div`,{className:a.i,"data-layout":F===`default`?void 0:F,style:Q?{aspectRatio:Q}:void 0,children:[s(`input`,{ref:V,type:`file`,className:i.p,accept:O,multiple:k,disabled:w||!B,"aria-label":x||b||`Файлы`,onChange:e=>{J(Array.from(e.target.files||[])),e.target.value=``}}),c(`button`,{type:`button`,className:a.z,disabled:!B,"data-dragging":W?`true`:void 0,"data-layout":F===`default`?void 0:F,onClick:()=>V.current?.click(),onDragEnter:ee,onDragLeave:te,onDragOver:ne,onDrop:re,children:[s(`span`,{className:a.h,children:ae}),O&&F===`default`?s(`span`,{className:a.a,children:O}):null]}),$?s(`ul`,{className:a.l,children:z.map((e,t)=>c(`li`,{className:a.t,children:[c(`div`,{className:a.m,children:[s(`span`,{className:a.n,title:e.name,children:e.name}),s(`span`,{className:a.s,children:f(e.size)})]}),B?s(`button`,{type:`button`,className:a.d,"aria-label":`Удалить ${e.name}`,onClick:()=>X(t),children:`×`}):null]},`${e.name}-${t}`))}):null,$&&B?s(`button`,{type:`button`,className:a.c,onClick:Y,children:`Очистить всё`}):null]}),E?s(`span`,{className:e.a,children:E}):null]})}h.displayName=`DragDropField`;export{h as default};
@@ -1,8 +1,11 @@
1
1
  import { default as React } from 'react';
2
2
  import { TInput } from './type';
3
- /** EmailField — нативный input type=email (автозаполнение, мобильная клавиатура). */
4
- export type TEmail = TInput;
5
- declare function EmailField(props: TEmail): import("react/jsx-runtime").JSX.Element;
3
+ /** EmailField — нативный input type=email + опциональная проверка формата. */
4
+ export type TEmail = TInput & {
5
+ /** Проверка формата при blur (по умолчанию true) */
6
+ validate?: boolean;
7
+ };
8
+ declare function EmailField({ validate, error, onBlur, onValue, after, ...rest }: TEmail): import("react/jsx-runtime").JSX.Element;
6
9
  declare namespace EmailField {
7
10
  var displayName: string;
8
11
  }
@@ -1 +1 @@
1
- import e from"./NativeTextField.js";import t from"react";import{jsx as n}from"react/jsx-runtime";function r(t){return n(e,{...t,fieldType:`email`,inputType:`email`,inputmode:t.inputmode??`email`,autoComplete:t.autoComplete??`email`,defaultAriaLabel:`Email`})}r.displayName=`EmailField`;var i=t.memo(r);export{i as default};
1
+ import e from"./NativeTextField.js";import{validateEmail as t}from"./emailUtils.js";import n from"react";import{jsx as r}from"react/jsx-runtime";function i(){return r(`span`,{"aria-hidden":!0,style:{display:`inline-flex`,alignItems:`center`,justifyContent:`center`,width:20,height:20,borderRadius:`50%`,background:`var(--field-error-color)`,color:`#fff`,fontSize:12,fontWeight:700,lineHeight:1,flexShrink:0},children:`i`})}function a({validate:a=!0,error:o=``,onBlur:s,onValue:c,after:l,...u}){let[d,f]=n.useState(``),p=o||d,m=l!=null&&l!==``,h=e=>{a&&d&&f(``),c?.(e)},g=e=>{a&&f(t(e.value)),s?.(e)};return r(e,{...u,error:p,fieldType:`email`,inputType:`email`,inputmode:u.inputmode??`email`,autoComplete:u.autoComplete??`email`,defaultAriaLabel:`Email`,onValue:h,onBlur:g,after:m?l:p?r(i,{}):void 0})}a.displayName=`EmailField`;var o=n.memo(a);export{o as default};
@@ -0,0 +1,107 @@
1
+ import { default as React, HTMLAttributes } from 'react';
2
+ import { UseFormApi } from '../hooks/use';
3
+ import { TInput, TValue } from './type';
4
+ /**
5
+ * Тип поля в группе — соответствует компоненту `*Field`.
6
+ * `string` → StringField, `number` → NumberField, …
7
+ */
8
+ export type FieldGroupFieldKind = "string" | "password" | "email" | "url" | "phone" | "number" | "money" | "percent" | "mask" | "date" | "time" | "textarea" | "select" | "radio" | "tabs" | "check" | "color" | "tags" | "rating" | "code" | "card" | "file" | "drag" | "rich" | "display" | "hidden" | "range" | "options" | "modal";
9
+ /** Пропы, которые группа задаёт сама (item их не дублирует) */
10
+ type GroupOwned = "form" | "onValue" | "onBlur";
11
+ /**
12
+ * Частые пропы конкретных полей (без `[key: string]` — сохраняем типы `field`/`name`).
13
+ * Редкие пропы можно передать через assertion или расширить тип.
14
+ */
15
+ type FieldGroupItemExtras = {
16
+ options?: unknown;
17
+ order?: number[];
18
+ format?: string;
19
+ length?: number;
20
+ group?: number;
21
+ cellSize?: number | string;
22
+ numeric?: boolean;
23
+ validate?: boolean;
24
+ course?: number;
25
+ isClear?: boolean;
26
+ decimals?: number;
27
+ min?: number | string | Date;
28
+ max?: number | string | Date;
29
+ step?: number;
30
+ variant?: string;
31
+ inline?: boolean;
32
+ equal?: boolean;
33
+ maxTags?: number;
34
+ separators?: string[];
35
+ allowClear?: boolean;
36
+ accept?: string;
37
+ multiple?: boolean;
38
+ maxSize?: number;
39
+ maxFiles?: number;
40
+ keepFile?: boolean;
41
+ hint?: string;
42
+ append?: boolean;
43
+ layout?: string;
44
+ aspectRatio?: string | number;
45
+ hideList?: boolean;
46
+ toolbar?: boolean;
47
+ colors?: string[];
48
+ alpha?: boolean;
49
+ emptyText?: string;
50
+ modal?: string;
51
+ inlinePalette?: boolean;
52
+ outFormat?: "array" | "string" | "object";
53
+ separator?: string;
54
+ picker?: boolean;
55
+ presets?: string[];
56
+ align?: "start" | "center" | "top" | "bottom";
57
+ showFocusRing?: boolean;
58
+ native?: boolean;
59
+ eyes?: [React.ReactNode?, React.ReactNode?];
60
+ autoComplete?: string;
61
+ inputType?: TInput["inputType"];
62
+ };
63
+ /**
64
+ * Элемент группы: обязательны `field` + `name`,
65
+ * остальное — пропы конкретного поля (`label`, `placeholder`, `options`, …).
66
+ */
67
+ export type FieldGroupItem = {
68
+ /** Какое поле рендерить */
69
+ field: FieldGroupFieldKind;
70
+ /** Имя в form / onValue */
71
+ name: string;
72
+ } & Partial<Omit<TInput, GroupOwned | "name">> & FieldGroupItemExtras;
73
+ export type FieldGroupProps = Omit<HTMLAttributes<HTMLDivElement>, "onChange"> & {
74
+ items: FieldGroupItem[];
75
+ /** Общая форма для всех items */
76
+ form?: UseFormApi;
77
+ /** Общий onValue (если у item нет своего) */
78
+ onValue?: (data: TValue) => void | Promise<void>;
79
+ /** Общий onBlur */
80
+ onBlur?: (data: TValue) => void | Promise<void>;
81
+ /** disabled на всю группу (item.disabled перекрывает) */
82
+ disabled?: boolean;
83
+ /** размер по умолчанию */
84
+ size?: TInput["size"];
85
+ /**
86
+ * Ошибки по имени поля — удобно снаружи:
87
+ * `errors={{ email: "…", card: "…" }}`
88
+ */
89
+ errors?: Record<string, string>;
90
+ /**
91
+ * Значения без form (controlled map).
92
+ * Если есть `form` — обычно не нужно.
93
+ */
94
+ values?: Record<string, unknown>;
95
+ /** Переопределить `--field-group-gap` (число → px) */
96
+ gap?: number | string;
97
+ };
98
+ /**
99
+ * Группа полей (items-API, как RadioGroup в @elcrm/components).
100
+ * Родитель задаёт общие `form` / `onValue` / `onBlur` / `disabled` / `size`,
101
+ * у каждого item — `field` + конкретные пропы (`name`, `label`, `options`, …).
102
+ */
103
+ declare function FieldGroup({ items, form, onValue, onBlur, disabled, size, errors, values, gap, className, style, ...rest }: FieldGroupProps): import("react/jsx-runtime").JSX.Element;
104
+ declare namespace FieldGroup {
105
+ var displayName: string;
106
+ }
107
+ export default FieldGroup;
@@ -0,0 +1 @@
1
+ import e from"./Range.js";import t from"./Money.js";import n from"./Mask.js";import r from"./Date.js";import i from"./Time.js";import a from"./Textarea.js";import o from"./Phone.js";import s from"./Input.js";import c from"./Numeric.js";import l from"./Options.js";import u from"./Select.js";import d from"./Modal.js";import f from"./Password.js";import p from"./Check.js";import m from"./Color.js";import h from"./Email.js";import g from"./Card.js";import _ from"./Url.js";import v from"./Percent.js";import y from"./Radio.js";import b from"./Tags.js";import x from"./Rating.js";import S from"./Code.js";import C from"./Tabs.js";import w from"./File.js";import T from"./DragDrop.js";import E from"./RichText.js";import D from"./Hidden.js";import O from"./Display.js";import k from"../styles/FieldGroup.module.js";import"react";import{jsx as A}from"react/jsx-runtime";var j=e=>e,M={string:j(s),password:j(f),email:j(h),url:j(_),phone:j(o),number:j(c),money:j(t),percent:j(v),mask:j(n),date:j(r),time:j(i),textarea:j(a),select:j(u),radio:j(y),tabs:j(C),check:j(p),color:j(m),tags:j(b),rating:j(x),code:j(S),card:j(g),file:j(w),drag:j(T),rich:j(E),display:j(O),hidden:j(D),range:j(e),options:j(l),modal:j(d)};function N({items:e,form:t,onValue:n,onBlur:r,disabled:i=!1,size:a,errors:o,values:s,gap:c,className:l,style:u,...d}){let f=c===void 0?u:{...u,"--field-group-gap":typeof c==`number`?`${c}px`:c};return A(`div`,{className:[k.r,l].filter(Boolean).join(` `),role:`group`,style:f,...d,children:e.map(e=>{let{field:c,name:l,disabled:u,size:d,error:f,value:p,...m}=e,h=M[c];if(!h)return null;let g=p===void 0?s?s[l]:void 0:p;return A(h,{name:l,form:t,onValue:n,onBlur:r,disabled:u??i,size:d??a,error:f??o?.[l]??``,...g===void 0?{}:{value:g},...m},l)})})}N.displayName=`FieldGroup`;export{N as default};
@@ -1 +1 @@
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"../styles/File.module.js";import i from"react";import{jsx as a,jsxs as o}from"react/jsx-runtime";function s(e){return{name:e.name,size:e.size,type:e.type,lastModified:e.lastModified}}function c(e){return e?Array.isArray(e)?e:typeof File<`u`&&e instanceof File||typeof e==`object`&&e&&`name`in e?[e]:[]:[]}function l(e){return e<1024?`${e} Б`:e<1024*1024?`${(e/1024).toFixed(1)} КБ`:`${(e/(1024*1024)).toFixed(1)} МБ`}function u({value:u,form:d,onValue:f,onBlur:p,name:m=``,placeholder:h=`Выберите файл`,label:g=``,error:_=``,hidden:v=!1,disabled:y=!1,className:b=``,after:x=``,before:S=``,accept:C,multiple:w=!1,maxSize:T,keepFile:E=!0}){let{value:D}=n(d,m,u),O=c(D),k=!y,A=i.useRef(null),[j,M]=i.useState(``),N=e=>{let t={value:e,name:m};d&&m&&d.setValue(t),f&&f!==d?.onValue&&f(t)},P=e=>{if(!e||e.length===0)return;let t=Array.from(e);if(T!==void 0){let e=t.find(e=>e.size>T);if(e){M(`Файл «${e.name}» больше ${l(T)}`);return}}M(``);let n=E?w?t:t[0]:w?t.map(s):s(t[0]);N(n),p?.({value:n,name:m})},F=()=>{k&&(N(w?[]:null),A.current&&(A.current.value=``),M(``))},I=O.length===0;return v&&I?null:o(t,{type:`file`,label:g,error:_||j,element_blok:{className:[b||``]},element_input:{className:[r.r],props:{"data-disabled":y||!k?`true`:void 0}},children:[S?a(`span`,{className:e.a,children:S}):null,o(`div`,{className:r.n,children:[a(`input`,{ref:A,type:`file`,className:r.p,accept:C,multiple:w,disabled:y||!k,"aria-label":g||h||`Файл`,onChange:e=>P(e.target.files)}),a(`button`,{type:`button`,className:r.b,disabled:!k,onClick:()=>A.current?.click(),children:h}),a(`div`,{className:r.l,children:I?a(`span`,{className:r.e,children:`Нет файла`}):O.map((e,t)=>o(`span`,{className:r.t,children:[a(`span`,{className:r.m,children:e.name}),a(`span`,{className:r.z,children:l(e.size)})]},`${e.name}-${t}`))}),!I&&k?a(`button`,{type:`button`,className:r.c,"aria-label":`Очистить`,onClick:F,children:`×`}):null]}),x?a(`span`,{className:e.a,children:x}):null]})}u.displayName=`FileField`;export{u as default};
1
+ import e from"../styles/Field.module.js";import t from"../core/Field.js";import{useFormFieldState as n}from"../hooks/use.js";import{createFieldEmit as r}from"./emit.js";import i from"../styles/File.module.js";import a from"react";import{jsx as o,jsxs as s}from"react/jsx-runtime";function c(e){return{name:e.name,size:e.size,type:e.type,lastModified:e.lastModified}}function l(e){return e?Array.isArray(e)?e:typeof File<`u`&&e instanceof File||typeof e==`object`&&e&&`name`in e?[e]:[]:[]}function u(e){return e<1024?`${e} Б`:e<1024*1024?`${(e/1024).toFixed(1)} КБ`:`${(e/(1024*1024)).toFixed(1)} МБ`}function d({value:d,form:f,onValue:p,onBlur:m,name:h=``,placeholder:g=`Выберите файл`,label:_=``,error:v=``,hidden:y=!1,disabled:b=!1,className:x=``,after:S=``,before:C=``,accept:w,multiple:T=!1,maxSize:E,keepFile:D=!0}){let{value:O}=n(f,h,d),k=l(O),A=!b,j=a.useRef(null),[M,N]=a.useState(``),P=e=>{r(f,h,p)(e,!0)},F=e=>{if(!e||e.length===0)return;let t=Array.from(e);if(E!==void 0){let e=t.find(e=>e.size>E);if(e){N(`Файл «${e.name}» больше ${u(E)}`);return}}N(``);let n=D?T?t:t[0]:T?t.map(c):c(t[0]);P(n),m?.({value:n,name:h})},I=()=>{A&&(P(T?[]:null),j.current&&(j.current.value=``),N(``))},L=k.length===0;return y&&L?null:s(t,{type:`file`,label:_,error:v||M,element_blok:{className:[x||``]},element_input:{className:[i.r],props:{"data-disabled":b||!A?`true`:void 0}},children:[C?o(`span`,{className:e.a,children:C}):null,s(`div`,{className:i.n,children:[o(`input`,{ref:j,type:`file`,className:i.p,accept:w,multiple:T,disabled:b||!A,"aria-label":_||g||`Файл`,onChange:e=>F(e.target.files)}),o(`button`,{type:`button`,className:i.b,disabled:!A,onClick:()=>j.current?.click(),children:g}),o(`div`,{className:i.l,children:L?o(`span`,{className:i.e,children:`Нет файла`}):k.map((e,t)=>s(`span`,{className:i.t,children:[o(`span`,{className:i.m,children:e.name}),o(`span`,{className:i.z,children:u(e.size)})]},`${e.name}-${t}`))}),!L&&A?o(`button`,{type:`button`,className:i.c,"aria-label":`Очистить`,onClick:I,children:`×`}):null]}),S?o(`span`,{className:e.a,children:S}):null]})}d.displayName=`FileField`;export{d as default};
@@ -1 +1 @@
1
- import{useFormFieldState as e}from"../hooks/use.js";import t from"react";import{jsx as n}from"react/jsx-runtime";function r({value:r=``,form:i,onValue:a,name:o=``,id:s,hidden:c=!1}){let{value:l}=e(i,o,r);if(t.useEffect(()=>{if(!i||!o||i.getValue(o)!==void 0)return;let e={value:l,name:o};i.onValue(e),a&&a!==i.onValue&&a(e)},[i,o,l,a]),c)return null;let u=l==null?``:typeof l==`string`||typeof l==`number`||typeof l==`boolean`?String(l):JSON.stringify(l);return n(`input`,{type:`hidden`,id:s,name:o||void 0,value:u,readOnly:!0,"data-field":`hidden`,"aria-hidden":!0})}r.displayName=`HiddenField`;export{r as default};
1
+ import{useFormFieldState as e}from"../hooks/use.js";import{createFieldEmit as t}from"./emit.js";import n from"react";import{jsx as r}from"react/jsx-runtime";function i({value:i=``,form:a,onValue:o,name:s=``,id:c,hidden:l=!1}){let{value:u}=e(a,s,i);if(n.useEffect(()=>{!a||!s||a.getValue(s)===void 0&&t(a,s,o)(u)},[a,s,u,o]),l)return null;let d=u==null?``:typeof u==`string`||typeof u==`number`||typeof u==`boolean`?String(u):JSON.stringify(u);return r(`input`,{type:`hidden`,id:c,name:s||void 0,value:d,readOnly:!0,"data-field":`hidden`,"aria-hidden":!0})}i.displayName=`HiddenField`;export{i as default};
@@ -1 +1 @@
1
- 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{createFieldEmit as s}from"./emit.js";import c from"react";import{jsx as l,jsxs as u}from"react/jsx-runtime";function d({value:n,form:d,onValue:m,name:h=``,placeholder:g=``,label:_=``,hidden:v=!1,disabled:y=!1,onBlur:b,className:x=``,after:S=``,before:C=``,error:w=``,inputmode:T=`text`,maxLength:E,spellCheck:D=!0,native:O=!1,autoComplete:k,inputType:A=`text`,id:j,size:M=`md`}){let{value:N,version:P}=r(d,h,n),F=!y,I=typeof N==`string`||typeof N==`number`?String(N):``,L=c.useRef(null),R=c.useRef(null),z=c.useRef(!1);c.useLayoutEffect(()=>{if(O)return;let e=R.current;e&&e.textContent!==I&&(e.textContent=I)},[O,I,P]),c.useEffect(()=>{if(!O)return;let e=L.current;e&&e.value!==I&&(e.value=I)},[O,I]);let B=s(d,h,m),V=e=>{let t=e.target;B((t.textContent||``).trim())},H=e=>{B(e.target.value)},U=e=>{let t=e.target;E&&(t.textContent||``).trim().length>=E&&e.key!==`Backspace`&&e.preventDefault(),e.key===`Enter`&&e.preventDefault()},W=e=>{e.key===`Enter`&&e.preventDefault()},G=e=>i.Paste(E||0,a(e));if(v&&o(N))return``;let K=e=>{i.Blur(e),b?.({value:(e.target.textContent||``).trim(),name:h}),z.current=!1},q=e=>{b?.({value:(e.target.value||``).trim(),name:h})},J=e=>{z.current=!0,i.Focus({target:e.currentTarget})},Y={};return g&&(Y.placeholder=g),F&&(Y.edit=``),O?u(t,{type:`input`,label:_,error:w,id:j,size:M,element_blok:{className:[x||``]},element_input:{className:[e.w],props:{"data-disabled":y||!F?`true`:void 0}},children:[C?l(`span`,{className:e.a,children:C}):null,l(f,{inputRef:L,name:h,displayString:I,placeholder:g,maxLength:E,spellCheck:D,disabled:y,editable:F,autoComplete:k,inputType:A,inputmode:T,label:_,onChangeNative:H,handleBlurNative:q,onKeyDownNative:W}),S?l(`span`,{className:e.a,children:S}):null]}):u(t,{type:`input`,label:_,error:w,id:j,size:M,element_blok:{className:[x]},element_input:{className:[e.w]},children:[C?l(`span`,{className:e.a,children:C}):null,l(p,{ceRef:R,editable:F,label:_,placeholder:g,spellCheck:D,inputmode:T,dd:Y,onBlur:K,onFocus:J,onPaste:G,onInput:V,onKeyDown:U}),S?l(`span`,{className:e.a,children:S}):null]})}function f({inputRef:t,name:r,displayString:i,placeholder:a,maxLength:o,spellCheck:s,disabled:c,editable:u,autoComplete:d,inputType:f,inputmode:p,label:m,onChangeNative:h,handleBlurNative:g,onKeyDownNative:_}){let v=n();return l(`div`,{className:e.x,children:l(`input`,{id:v?.controlId,ref:t,className:e.y,type:f,name:r||void 0,defaultValue:i,placeholder:a,maxLength:o,spellCheck:s,disabled:c,readOnly:c,autoComplete:d,inputMode:p||`text`,"aria-label":m?void 0:a||`Текст`,"aria-describedby":v?.describedBy,"aria-invalid":v?.errorId?!0:void 0,"aria-disabled":c||!u?!0:void 0,tabIndex:c?-1:0,onChange:h,onBlur:g,onKeyDown:_})})}function p({ceRef:e,editable:t,label:r,placeholder:i,spellCheck:a,inputmode:o,dd:s,onBlur:c,onFocus:u,onPaste:d,onInput:f,onKeyDown:p}){let m=n();return l(`div`,{ref:e,id:m?.controlId,role:`textbox`,"aria-multiline":`false`,"aria-label":r?void 0:i||`Текст`,"aria-describedby":m?.describedBy,"aria-invalid":m?.errorId?!0:void 0,"aria-disabled":!t,tabIndex:t?0:-1,onBlur:c,onFocus:u,onPaste:d,onInput:f,onKeyDown:p,spellCheck:a,inputMode:o||`text`,contentEditable:t?`plaintext-only`:!1,suppressContentEditableWarning:!0,...s})}var m=c.memo(d);export{m as default};
1
+ 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{createFieldEmit as i}from"./emit.js";import a,{asEditableClipboard as o}from"../events/onEvent.js";import{isEmptyTextLike as s}from"./visibility.js";import c from"react";import{jsx as l,jsxs as u}from"react/jsx-runtime";function d({value:n,form:d,onValue:m,name:h=``,placeholder:g=``,label:_=``,hidden:v=!1,disabled:y=!1,onBlur:b,className:x=``,after:S=``,before:C=``,error:w=``,inputmode:T=`text`,maxLength:E,spellCheck:D=!0,native:O=!1,autoComplete:k,inputType:A=`text`,id:j,size:M=`m`}){let{value:N,version:P}=r(d,h,n),F=!y,I=typeof N==`string`||typeof N==`number`?String(N):``,L=c.useRef(null),R=c.useRef(null),z=c.useRef(!1);c.useLayoutEffect(()=>{if(O)return;let e=R.current;e&&e.textContent!==I&&(e.textContent=I)},[O,I,P]),c.useEffect(()=>{if(!O)return;let e=L.current;e&&e.value!==I&&(e.value=I)},[O,I]);let B=i(d,h,m),V=e=>{let t=e.target;B((t.textContent||``).trim())},H=e=>{B(e.target.value)},U=e=>{let t=e.target;E&&(t.textContent||``).trim().length>=E&&e.key!==`Backspace`&&e.preventDefault(),e.key===`Enter`&&e.preventDefault()},W=e=>{e.key===`Enter`&&e.preventDefault()},G=e=>a.Paste(E||0,o(e));if(v&&s(N))return``;let K=e=>{a.Blur(e),b?.({value:(e.target.textContent||``).trim(),name:h}),z.current=!1},q=e=>{b?.({value:(e.target.value||``).trim(),name:h})},J=e=>{z.current=!0,a.Focus({target:e.currentTarget})},Y={};return g&&(Y.placeholder=g),F&&(Y.edit=``),O?u(t,{type:`input`,label:_,error:w,id:j,size:M,element_blok:{className:[x||``]},element_input:{className:[e.w],props:{"data-disabled":y||!F?`true`:void 0}},children:[C?l(`span`,{className:e.a,children:C}):null,l(f,{inputRef:L,name:h,displayString:I,placeholder:g,maxLength:E,spellCheck:D,disabled:y,editable:F,autoComplete:k,inputType:A,inputmode:T,label:_,onChangeNative:H,handleBlurNative:q,onKeyDownNative:W}),S?l(`span`,{className:e.a,children:S}):null]}):u(t,{type:`input`,label:_,error:w,id:j,size:M,element_blok:{className:[x]},element_input:{className:[e.w],props:{"data-disabled":y||!F?`true`:void 0}},children:[C?l(`span`,{className:e.a,children:C}):null,l(p,{ceRef:R,editable:F,label:_,placeholder:g,spellCheck:D,inputmode:T,dd:Y,onBlur:K,onFocus:J,onPaste:G,onInput:V,onKeyDown:U}),S?l(`span`,{className:e.a,children:S}):null]})}function f({inputRef:t,name:r,displayString:i,placeholder:a,maxLength:o,spellCheck:s,disabled:c,editable:u,autoComplete:d,inputType:f,inputmode:p,label:m,onChangeNative:h,handleBlurNative:g,onKeyDownNative:_}){let v=n();return l(`div`,{className:e.x,children:l(`input`,{id:v?.controlId,ref:t,className:e.y,type:f,name:r||void 0,defaultValue:i,placeholder:a,maxLength:o,spellCheck:s,disabled:c,readOnly:c,autoComplete:d,inputMode:p||`text`,"aria-label":m?void 0:a||`Текст`,"aria-describedby":v?.describedBy,"aria-invalid":v?.errorId?!0:void 0,"aria-disabled":c||!u?!0:void 0,tabIndex:c?-1:0,onChange:h,onBlur:g,onKeyDown:_})})}function p({ceRef:e,editable:t,label:r,placeholder:i,spellCheck:a,inputmode:o,dd:s,onBlur:c,onFocus:u,onPaste:d,onInput:f,onKeyDown:p}){let m=n();return l(`div`,{ref:e,id:m?.controlId,role:`textbox`,"aria-multiline":`false`,"aria-label":r?void 0:i||`Текст`,"aria-describedby":m?.describedBy,"aria-invalid":m?.errorId?!0:void 0,"aria-disabled":!t,tabIndex:t?0:-1,onBlur:c,onFocus:u,onPaste:d,onInput:f,onKeyDown:p,spellCheck:a,inputMode:o||`text`,contentEditable:t?`plaintext-only`:!1,suppressContentEditableWarning:!0,...s})}var m=c.memo(d);export{m as default};
@@ -1,5 +1,6 @@
1
1
  import { TInput } from './type';
2
- type TMask = TInput & {
2
+ /** MaskField — в form только цифры; UI по `format` (`_` = слот). */
3
+ export type TMask = TInput & {
3
4
  format?: string;
4
5
  };
5
6
  declare function MaskField({ value, form, onValue, onBlur: onBlurField, name, format, placeholder, label, error, hidden, disabled, className, after, before, inputmode, view, }: TMask): import("react/jsx-runtime").JSX.Element;
@@ -1 +1 @@
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";function u(e){let t=window.getSelection();if(!t||t.rangeCount===0)return 0;let n=t.getRangeAt(0);if(!e.contains(n.startContainer))return 0;let r=document.createRange();return r.selectNodeContents(e),r.setEnd(n.startContainer,n.startOffset),r.toString().length}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 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())},L=e=>r.PasteOne(i(e)),R=e=>{N=_,P=!0,F=0;let t=0,n=``,r=e.replace(/\D/g,``);r===``&&(P=!0);let i=r.split(``),a=``;i.forEach(e=>{P&&(a+=e,P&&(F=(``+a).length,N=_.replace(RegExp(`[0-9]`,`g`),`_`),n=``),F>(``+a).length&&(P=!0,N=_.replace(RegExp(`[0-9]`,`g`),`_`),n=``))});let o=N.replace(/\D/g,``);return o.length>=r.length&&(r=o),{q:N.replace(/[_\d]/g,function(){return r.charAt(t++)||`_`}),i:t,v:r,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=d(a.q,i);a.q.length>0&&queueMicrotask(()=>{I(Math.min(o,a.q.length),t)});let s={value:a.q.replace(/\D/g,``),name:g};p&&g&&p.onValue(s),m&&m!==p?.onValue&&m(s)},B=e=>{e.key===`Enter`&&e.preventDefault()},V=e=>{r.Blur(e),h&&h({value:(e.target.textContent??``).replace(/\D/g,``),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)?c(s,{}):l(t,{type:`input`,label:y,error:b,element_blok:{className:[C]},element_input:{className:[e.w]},children:[T?c(`span`,{className:e.a,children:T}):null,c(`div`,{ref:j,onPaste:L,onInput:z,onKeyDown:B,onBlur:V,onFocus:H,role:`textbox`,spellCheck:!1,"aria-label":y||v||g||`Маска`,"aria-disabled":!O,tabIndex:S?-1:0,"data-disabled":!O,contentEditable:O?`plaintext-only`:!1,suppressContentEditableWarning:!0,...U}),w?c(`span`,{className:e.a,children:w}):null]})}f.displayName=`MaskField`;export{f as default};
1
+ import e from"../styles/Field.module.js";import t from"../core/Field.js";import{useFormFieldState as n}from"../hooks/use.js";import{createFieldEmit as r}from"./emit.js";import i,{asEditableClipboard as a}from"../events/onEvent.js";import{isEmptyTextLike as o}from"./visibility.js";import s from"react";import{Fragment as c,jsx as l,jsxs as u}from"react/jsx-runtime";function d(e){let t=window.getSelection();if(!t||t.rangeCount===0)return 0;let n=t.getRangeAt(0);if(!e.contains(n.startContainer))return 0;let r=document.createRange();return r.selectNodeContents(e),r.setEnd(n.startContainer,n.startOffset),r.toString().length}function f(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 p({value:p=``,form:m,onValue:h,onBlur:g,name:_=``,format:v=`+_(___) ___-__-__`,placeholder:y=``,label:b=``,error:x=``,hidden:S=!1,disabled:C=!1,className:w=``,after:T=``,before:E=``,inputmode:D=`numeric`,view:O}){let k=!C,{value:A,version:j}=n(m,_,p),M=s.useRef(null),N=s.useRef(!1),P=v,F=!0,I=0,L=(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())},R=e=>i.PasteOne(a(e)),z=e=>{P=v,F=!0,I=0;let t=0,n=``,r=e.replace(/\D/g,``);r===``&&(F=!0);let i=r.split(``),a=``;i.forEach(e=>{F&&(a+=e,F&&(I=(``+a).length,P=v.replace(RegExp(`[0-9]`,`g`),`_`),n=``),I>(``+a).length&&(F=!0,P=v.replace(RegExp(`[0-9]`,`g`),`_`),n=``))});let o=P.replace(/\D/g,``);return o.length>=r.length&&(r=o),{q:P.replace(/[_\d]/g,function(){return r.charAt(t++)||`_`}),i:t,v:r,f:n}};s.useLayoutEffect(()=>{if(N.current)return;let e=M.current;if(!e)return;let t=z(String(A||``));e.textContent!==t.q&&(e.textContent=t.q)},[A,j,v]),z(String(A||``));let B=r(m,_,h),V=e=>{let t=e.target,n=t.textContent||``,r=d(t),i=n.slice(0,r).replace(/\D/g,``).length,a=z(n);t.textContent=a.q;let o=f(a.q,i);a.q.length>0&&queueMicrotask(()=>{L(Math.min(o,a.q.length),t)}),B(a.q.replace(/\D/g,``))},H=e=>{e.key===`Enter`&&e.preventDefault()},U=e=>{i.Blur(e),g&&g({value:(e.target.textContent??``).replace(/\D/g,``),name:_}),N.current=!1},W=e=>{N.current=!0,i.Focus({target:e.currentTarget})},G={};y&&(G.placeholder=y),G.inputMode=D??`numeric`;let K=String(A??``).replace(/\D/g,``);return S&&o(K)?l(c,{}):u(t,{type:`input`,label:b,error:x,element_blok:{className:[w]},element_input:{className:[e.w],props:{"data-disabled":C||!k?`true`:void 0}},children:[E?l(`span`,{className:e.a,children:E}):null,l(`div`,{ref:M,onPaste:R,onInput:V,onKeyDown:H,onBlur:U,onFocus:W,role:`textbox`,spellCheck:!1,"aria-label":b||y||_||`Маска`,"aria-disabled":!k,tabIndex:C?-1:0,"data-disabled":k?void 0:`true`,contentEditable:k?`plaintext-only`:!1,suppressContentEditableWarning:!0,...G}),T?l(`span`,{className:e.a,children:T}):null]})}p.displayName=`MaskField`;export{p as default};
@@ -1 +1 @@
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{useFormInit as i}from"../FormInitContext.js";import"react";import{Fragment as a,jsx as o,jsxs as s}from"react/jsx-runtime";function c({value:c,form:l,onValue:u,name:d,placeholder:f=``,label:p,error:m,hidden:h=!1,disabled:g=!1,after:_,before:v,view:y,modal:b,options:x,className:S}){let{onModal:C}=i(),{value:w}=n(l,d,c),T=w,E=e=>e?Array.isArray(e)?e[1]||``:e:``,D=e=>{if(Array.isArray(e)&&e.length>=2)return[e[0],String(e[1]??``)];if(typeof e==`object`&&e){let t=e;if(t.id!==void 0&&t.name!==void 0)return[t.id,t.name]}return String(e??``)},O=e=>{let t={value:D(e),name:d};l&&d&&l.setValue(t),u&&u!==l?.onValue&&u(t)},k=()=>{if(g||!b)return;let e=b.split(`.`);if(e.length<2)return;let t=Array.isArray(T)?T[0]:T;C({module:e[0],modalName:e[1],callback:O,onValue:O,options:x,fieldName:d,value:t})},A={};f&&(A.placeholder=f);let j=r(E(T));return h&&j?o(a,{}):s(t,{type:`input`,label:p,element_blok:{className:[S||``]},error:m,element_input:{className:[e.w],props:{onClick:k}},children:[v?o(`span`,{className:e.a,children:v}):null,o(`div`,{...A,children:E(T)}),_?o(`span`,{className:e.a,children:_}):null]})}c.displayName=`ModalField`;export{c as default};
1
+ import e from"../styles/Field.module.js";import t from"../core/Field.js";import{useFormFieldState as n}from"../hooks/use.js";import{createFieldEmit as r}from"./emit.js";import{isEmptyTextLike as i}from"./visibility.js";import{useFormInit as a}from"../FormInitContext.js";import"react";import{Fragment as o,jsx as s,jsxs as c}from"react/jsx-runtime";function l({value:l,form:u,onValue:d,name:f,placeholder:p=``,label:m,error:h,hidden:g=!1,disabled:_=!1,after:v,before:y,view:b,modal:x,options:S,className:C}){let{onModal:w}=a(),{value:T}=n(u,f,l),E=T,D=e=>e?Array.isArray(e)?e[1]||``:e:``,O=e=>{if(Array.isArray(e)&&e.length>=2)return[e[0],String(e[1]??``)];if(typeof e==`object`&&e){let t=e;if(t.id!==void 0&&t.name!==void 0)return[t.id,t.name]}return String(e??``)},k=e=>{r(u,f,d)(O(e),!0)},A=()=>{if(_||!x)return;let e=x.split(`.`);if(e.length<2)return;let t=Array.isArray(E)?E[0]:E;w({module:e[0],modalName:e[1],callback:k,onValue:k,options:S,fieldName:f,value:t})},j={};p&&(j.placeholder=p);let M=i(D(E));return g&&M?s(o,{}):c(t,{type:`input`,label:m,element_blok:{className:[C||``]},error:h,element_input:{className:[e.w],props:{onClick:A,"data-disabled":_?`true`:void 0}},children:[y?s(`span`,{className:e.a,children:y}):null,s(`div`,{...j,children:D(E)}),v?s(`span`,{className:e.a,children:v}):null]})}l.displayName=`ModalField`;export{l as default};
@@ -1,5 +1,6 @@
1
1
  import { TInput } from './type';
2
- type TMoney = TInput & {
2
+ /** MoneyField в form число × `course` (по умолчанию 100). */
3
+ export type TMoney = TInput & {
3
4
  /** Курс для отображения (множитель при записи в форму) */
4
5
  course?: number;
5
6
  /** Кнопка очистки */
@@ -1 +1 @@
1
- import e from"../styles/Field.module.js";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 o from"react";import{jsx as s,jsxs as c}from"react/jsx-runtime";function l(e){let t=window.getSelection();if(!t||t.rangeCount===0)return 0;let n=t.getRangeAt(0);if(!e.contains(n.startContainer))return 0;let r=document.createRange();return r.selectNodeContents(e),r.setEnd(n.startContainer,n.startOffset),r.toString().length}function u(e,t,n){let r=Math.max(0,Math.min(t,e.length));return n(e.slice(0,r)).length}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):``;e.textContent!==n&&(e.textContent=n)},[M,j,g,E]);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())},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};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)})},R=e=>{let t=e.target;r.Blur(e),(t.textContent||``)===``&&(t.textContent=`0`);let n={value:Number(F(t.textContent||``))*E,name:h};p&&h&&p.setValue(n),x?.(n),m&&m!==p?.onValue&&m(n),t.textContent=f(F(t.textContent||``).trim()||`0`),P.current=!1},z=e=>{P.current=!0;let t=e.target;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:h};p&&h&&p.setValue(n),m&&m!==p?.onValue&&m(n)},V=e=>{e.key===`Enter`&&e.preventDefault()},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=``),c(t,{type:`input`,label:_,error:v,element_blok:{className:[S]},element_input:{className:[e.w]},children:[w?s(`span`,{className:e.a,children:w}):null,s(`div`,{ref:N,...G,onInput:L,onPaste:H,onBlur:R,onKeyDown:V,onFocus:z,role:`textbox`,spellCheck:!1,"aria-label":_||g||`Сумма`,"aria-disabled":!U,tabIndex:b?-1:0,contentEditable:U?`plaintext-only`:!1,suppressContentEditableWarning:!0}),k&&s(`button`,{type:`button`,onClick:B,"aria-label":`Очистить поле`,children:`x`}),C?s(`span`,{className:e.a,children:C}):null]})}d.displayName=`MoneyField`;function f(e,t){let n;if(typeof e==`string`){let t=e.replace(/\s/g,``).replace(`,`,`.`);n=parseFloat(t===``?`0`:t)}else n=Number(e??0);return Number.isNaN(n)&&(n=0),t!=null&&t>0&&(n/=t),n.toFixed(2).replace(/(\d)(?=(\d{3})+\.)/g,`$1 `)}export{d as default};
1
+ import e from"../styles/Field.module.js";import t from"../core/Field.js";import{useFormFieldState as n}from"../hooks/use.js";import{createFieldEmit as r}from"./emit.js";import i,{pastePlainTextIntoSelection 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(e){let t=window.getSelection();if(!t||t.rangeCount===0)return 0;let n=t.getRangeAt(0);if(!e.contains(n.startContainer))return 0;let r=document.createRange();return r.selectNodeContents(e),r.setEnd(n.startContainer,n.startOffset),r.toString().length}function d(e,t,n){let r=Math.max(0,Math.min(t,e.length));return n(e.slice(0,r)).length}function f({value:f,form:m,onValue:h,name:g=``,placeholder:_=``,label:v=``,error:y=``,hidden:b=!1,disabled:x=!1,onBlur:S,className:C=``,after:w=``,before:T=``,inputmode:E=`decimal`,course:D=100,view:O,type:k,isClear:A=!1}){let{value:j,version:M}=n(m,g||``,f),N=m&&g?j:f,P=s.useRef(null),F=s.useRef(!1);s.useLayoutEffect(()=>{if(F.current)return;let e=P.current;if(!e)return;let t=N!=null&&(typeof N==`number`?!0:!o(String(N))),n=!_||t?p(N??``,D):``;e.textContent!==n&&(e.textContent=n)},[N,M,_,D]);let I=e=>k===`multi`?e.replace(/[^+\d.+-]/g,``):e.replace(/[^+\d.]/g,``),L=(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())},R=r(m,g,h),z=e=>{let t=e.target,n=t.textContent||``,r=u(t),i=I(n),a=d(n,r,I);R(Number(i||0)*D),t.textContent=i,i.length>0&&queueMicrotask(()=>{L(Math.min(a,i.length),t)})},B=e=>{let t=e.target;i.Blur(e),(t.textContent||``)===``&&(t.textContent=`0`);let n=Number(I(t.textContent||``))*D;R(n,!0),S?.({value:n,name:g}),t.textContent=p(I(t.textContent||``).trim()||`0`),F.current=!1},V=e=>{F.current=!0;let t=e.target;t.textContent=I(t.textContent||``),i.Focus({target:e.currentTarget})},H=e=>{let t=e.currentTarget.previousElementSibling;t&&(t.textContent=``),R(0,!0)},U=e=>{e.key===`Enter`&&e.preventDefault()},W=e=>{e.preventDefault(),a(I(e.clipboardData?.getData(`text/plain`)??``),e.currentTarget)},G=!x,K=N==null||(typeof N==`number`?!1:o(String(N??``)));if(b&&K)return``;let q={};return q.inputMode=E??`decimal`,_&&(q.placeholder=_),G&&(q.edit=``),l(t,{type:`input`,label:v,error:y,element_blok:{className:[C]},element_input:{className:[e.w],props:{"data-disabled":x||!G?`true`:void 0}},children:[T?c(`span`,{className:e.a,children:T}):null,c(`div`,{ref:P,...q,onInput:z,onPaste:W,onBlur:B,onKeyDown:U,onFocus:V,role:`textbox`,spellCheck:!1,"aria-label":v||_||`Сумма`,"aria-disabled":!G,tabIndex:x?-1:0,contentEditable:G?`plaintext-only`:!1,suppressContentEditableWarning:!0}),A&&c(`button`,{type:`button`,onClick:H,"aria-label":`Очистить поле`,children:`x`}),w?c(`span`,{className:e.a,children:w}):null]})}f.displayName=`MoneyField`;function p(e,t){let n;if(typeof e==`string`){let t=e.replace(/\s/g,``).replace(`,`,`.`);n=parseFloat(t===``?`0`:t)}else n=Number(e??0);return Number.isNaN(n)&&(n=0),t!=null&&t>0&&(n/=t),n.toFixed(2).replace(/(\d)(?=(\d{3})+\.)/g,`$1 `)}export{f as default};
@@ -1 +1 @@
1
- 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{isEmptyTextLike as i}from"./visibility.js";import{createFieldEmit as a}from"./emit.js";import o from"react";import{jsx as s,jsxs as c}from"react/jsx-runtime";function l({value:n=``,form:l,onValue:d,onBlur:f,name:p=``,placeholder:m=``,label:h=``,error:g=``,hidden:_=!1,disabled:v=!1,className:y=``,after:b=``,before:x=``,maxLength:S,autoComplete:C,inputmode:w,id:T,size:E=`md`,fieldType:D,inputType:O,defaultAriaLabel:k}){let{value:A,version:j}=r(l,p,n),M=!v,N=typeof A==`string`||typeof A==`number`?String(A):``,P=o.useRef(null),F=a(l,p,d);return o.useEffect(()=>{let e=P.current;!e||e.value===N||(e.value=N)},[N,j]),_&&i(A)?null:c(t,{type:D,label:h,error:g,id:T,size:E,element_blok:{className:[y||``]},element_input:{className:[e.w],props:{"data-disabled":v||!M?`true`:void 0}},children:[x?s(`span`,{className:e.a,children:x}):null,s(u,{inputRef:P,name:p,display:N,placeholder:m,maxLength:S,disabled:v,editable:M,autoComplete:C,inputMode:w,inputType:O,label:h,defaultAriaLabel:k,emit:F,onBlurField:f}),b?s(`span`,{className:e.a,children:b}):null]})}function u({inputRef:t,name:r,display:i,placeholder:a,maxLength:o,disabled:c,editable:l,autoComplete:u,inputMode:d,inputType:f,label:p,defaultAriaLabel:m,emit:h,onBlurField:g}){let _=n();return s(`div`,{className:e.x,children:s(`input`,{id:_?.controlId,ref:t,className:e.y,type:f,name:r||void 0,defaultValue:i,placeholder:a,maxLength:o,disabled:c,readOnly:!l,autoComplete:u,inputMode:d,spellCheck:!1,"aria-label":p?void 0:a||m,"aria-describedby":_?.describedBy,"aria-invalid":_?.errorId?!0:void 0,onChange:e=>h(e.target.value),onBlur:e=>{let t=(e.target.value||``).trim();h(t,!0),g?.({value:t,name:r})},onKeyDown:e=>{e.key===`Enter`&&e.preventDefault()}})})}export{l as default};
1
+ 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{createFieldEmit as i}from"./emit.js";import{isEmptyTextLike as a}from"./visibility.js";import o from"react";import{jsx as s,jsxs as c}from"react/jsx-runtime";function l({value:n=``,form:l,onValue:d,onBlur:f,name:p=``,placeholder:m=``,label:h=``,error:g=``,hidden:_=!1,disabled:v=!1,className:y=``,after:b=``,before:x=``,maxLength:S,autoComplete:C,inputmode:w,id:T,size:E=`m`,fieldType:D,inputType:O,defaultAriaLabel:k}){let{value:A,version:j}=r(l,p,n),M=!v,N=typeof A==`string`||typeof A==`number`?String(A):``,P=o.useRef(null),F=i(l,p,d);return o.useEffect(()=>{let e=P.current;!e||e.value===N||(e.value=N)},[N,j]),_&&a(A)?null:c(t,{type:D,label:h,error:g,id:T,size:E,element_blok:{className:[y||``]},element_input:{className:[e.w],props:{"data-disabled":v||!M?`true`:void 0}},children:[x?s(`span`,{className:e.a,children:x}):null,s(u,{inputRef:P,name:p,display:N,placeholder:m,maxLength:S,disabled:v,editable:M,autoComplete:C,inputMode:w,inputType:O,label:h,defaultAriaLabel:k,emit:F,onBlurField:f}),b?s(`span`,{className:e.a,children:b}):null]})}function u({inputRef:t,name:r,display:i,placeholder:a,maxLength:o,disabled:c,editable:l,autoComplete:u,inputMode:d,inputType:f,label:p,defaultAriaLabel:m,emit:h,onBlurField:g}){let _=n();return s(`div`,{className:e.x,children:s(`input`,{id:_?.controlId,ref:t,className:e.y,type:f,name:r||void 0,defaultValue:i,placeholder:a,maxLength:o,disabled:c,readOnly:!l,autoComplete:u,inputMode:d,spellCheck:!1,"aria-label":p?void 0:a||m,"aria-describedby":_?.describedBy,"aria-invalid":_?.errorId?!0:void 0,onChange:e=>h(e.target.value),onBlur:e=>{let t=(e.target.value||``).trim();h(t,!0),g?.({value:t,name:r})},onKeyDown:e=>{e.key===`Enter`&&e.preventDefault()}})})}export{l as default};
@@ -9,7 +9,8 @@ import { TInput } from './type';
9
9
  *
10
10
  * Для процентов / clamp 0–100 / `number` используйте **`PercentField`**.
11
11
  */
12
- type TNumeric = TInput & {
12
+ /** NumberField — строка цифр в form. `max` = лимит символов. */
13
+ export type TNumeric = TInput & {
13
14
  /** Макс. число символов (если нет `maxLength`). Не числовой максимум значения. */
14
15
  max?: number;
15
16
  };
@@ -1 +1 @@
1
- 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=`numeric`,maxLength:T,max:E,view:D}){let O=!_,{value:k,version:A}=r(u,p,n);m=m===void 0?``:m,E=E===void 0?99:E;let j=k!=null&&k!==``?String(k):``,M=s.useRef(null),N=s.useRef(!1);s.useLayoutEffect(()=>{if(N.current)return;let e=M.current;e&&e.textContent!==j&&(e.textContent=j)},[j,A]);let P=T??E,F=(e,t)=>{e.textContent!==t&&(e.textContent=t,queueMicrotask(()=>{let n=e.firstChild;if(n&&n.nodeType===Node.TEXT_NODE){let e=t.length,r=window.getSelection(),i=document.createRange();i.setStart(n,e),i.collapse(!0),r?.removeAllRanges(),r?.addRange(i)}else t||(e.innerHTML=`<br>`)}))},I=e=>{let t=e.currentTarget,n=(t.textContent||``).replace(/\D/g,``);P>0&&n.length>P&&(n=n.slice(0,P)),F(t,n);let r={value:n,name:p};u&&p&&u.onValue(r),f&&f!==u?.onValue&&f(r)},L=e=>{N.current=!0;let t=e.currentTarget;t.textContent=(t.textContent||``).replace(/\D/g,``),i.Focus({target:e.currentTarget})},R=e=>{if((e.ctrlKey||e.metaKey)&&e.key.toLowerCase()===`v`||e.key===`Backspace`)return;let t=(e.currentTarget.textContent??``).replace(/\D/g,``).length;P>0&&t>=P&&e.key.length===1&&/\d/.test(e.key)&&e.preventDefault(),e.key===`Enter`&&e.preventDefault(),e.key.length===1&&!/\d/.test(e.key)&&!e.metaKey&&!e.ctrlKey&&e.preventDefault()},z=e=>{i.PasteDigits(P,a(e)),queueMicrotask(()=>{let e=M.current;if(!e)return;let t=(e.textContent||``).replace(/\D/g,``);P>0&&t.length>P&&(t=t.slice(0,P)),F(e,t),u&&p&&u.onValue({value:t,name:p})})},B=e=>{e.preventDefault()},V=e=>{i.Blur(e);let t=(e.currentTarget.textContent||``).replace(/\D/g,``);e.currentTarget.textContent!==t&&(e.currentTarget.textContent=t),v?.({value:t,name:p}),N.current=!1},H={};return O&&(H.edit=``),H.inputMode=w??`numeric`,m&&(H.placeholder=m),g&&o(k)?null:l(t,{type:`numeric`,label:h,error:S,size:C,element_blok:{className:[y||``]},element_input:{className:[e.w]},children:[x?c(`span`,{className:e.a,children:x}):null,c(d,{divRef:M,editable:O,label:h,placeholder:m,dd:H,onPaste:z,onDrop:B,onInput:I,onFocus:L,onBlur:V,onKeyDown:R}),b?c(`span`,{className:e.a,children:b}):null]})}function d({divRef:e,editable:t,label:r,placeholder:i,dd:a,onPaste:o,onDrop:s,onInput:l,onFocus:u,onBlur:d,onKeyDown:f}){let p=n();return c(`div`,{ref:e,id:p?.controlId,onPaste:o,onDrop:s,onDragOver:e=>e.preventDefault(),onInput:l,onFocus:u,onBlur:d,onKeyDown:f,spellCheck:!1,role:`textbox`,"aria-multiline":`false`,tabIndex:t?0:-1,"aria-label":r?void 0:i||`Число`,"aria-describedby":p?.describedBy,"aria-invalid":p?.errorId?!0:void 0,contentEditable:t?`plaintext-only`:!1,suppressContentEditableWarning:!0,...a})}u.displayName=`NumberField`;export{u as default};
1
+ 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{createFieldEmit as i}from"./emit.js";import a,{asEditableClipboard as o}from"../events/onEvent.js";import{isEmptyTextLike as s}from"./visibility.js";import c from"react";import{jsx as l,jsxs as u}from"react/jsx-runtime";function d({value:n,form:d,onValue:p,name:m=``,placeholder:h=``,label:g=``,hidden:_=!1,disabled:v=!1,onBlur:y,className:b=``,after:x=``,before:S=``,error:C=``,size:w=`m`,inputmode:T=`numeric`,maxLength:E,max:D,view:O}){let k=!v,{value:A,version:j}=r(d,m,n);h=h===void 0?``:h,D=D===void 0?99:D;let M=A!=null&&A!==``?String(A):``,N=c.useRef(null),P=c.useRef(!1);c.useLayoutEffect(()=>{if(P.current)return;let e=N.current;e&&e.textContent!==M&&(e.textContent=M)},[M,j]);let F=E??D,I=(e,t)=>{e.textContent!==t&&(e.textContent=t,queueMicrotask(()=>{let n=e.firstChild;if(n&&n.nodeType===Node.TEXT_NODE){let e=t.length,r=window.getSelection(),i=document.createRange();i.setStart(n,e),i.collapse(!0),r?.removeAllRanges(),r?.addRange(i)}else t||(e.innerHTML=`<br>`)}))},L=i(d,m,p),R=e=>{let t=e.currentTarget,n=(t.textContent||``).replace(/\D/g,``);F>0&&n.length>F&&(n=n.slice(0,F)),I(t,n),L(n)},z=e=>{P.current=!0;let t=e.currentTarget;t.textContent=(t.textContent||``).replace(/\D/g,``),a.Focus({target:e.currentTarget})},B=e=>{if((e.ctrlKey||e.metaKey)&&e.key.toLowerCase()===`v`||e.key===`Backspace`)return;let t=(e.currentTarget.textContent??``).replace(/\D/g,``).length;F>0&&t>=F&&e.key.length===1&&/\d/.test(e.key)&&e.preventDefault(),e.key===`Enter`&&e.preventDefault(),e.key.length===1&&!/\d/.test(e.key)&&!e.metaKey&&!e.ctrlKey&&e.preventDefault()},V=e=>{a.PasteDigits(F,o(e)),queueMicrotask(()=>{let e=N.current;if(!e)return;let t=(e.textContent||``).replace(/\D/g,``);F>0&&t.length>F&&(t=t.slice(0,F)),I(e,t),L(t)})},H=e=>{e.preventDefault()},U=e=>{a.Blur(e);let t=(e.currentTarget.textContent||``).replace(/\D/g,``);e.currentTarget.textContent!==t&&(e.currentTarget.textContent=t),y?.({value:t,name:m}),P.current=!1},W={};return k&&(W.edit=``),W.inputMode=T??`numeric`,h&&(W.placeholder=h),_&&s(A)?null:u(t,{type:`numeric`,label:g,error:C,size:w,element_blok:{className:[b||``]},element_input:{className:[e.w],props:{"data-disabled":v||!k?`true`:void 0}},children:[S?l(`span`,{className:e.a,children:S}):null,l(f,{divRef:N,editable:k,label:g,placeholder:h,dd:W,onPaste:V,onDrop:H,onInput:R,onFocus:z,onBlur:U,onKeyDown:B}),x?l(`span`,{className:e.a,children:x}):null]})}function f({divRef:e,editable:t,label:r,placeholder:i,dd:a,onPaste:o,onDrop:s,onInput:c,onFocus:u,onBlur:d,onKeyDown:f}){let p=n();return l(`div`,{ref:e,id:p?.controlId,onPaste:o,onDrop:s,onDragOver:e=>e.preventDefault(),onInput:c,onFocus:u,onBlur:d,onKeyDown:f,spellCheck:!1,role:`textbox`,"aria-multiline":`false`,tabIndex:t?0:-1,"aria-label":r?void 0:i||`Число`,"aria-disabled":t?void 0:!0,"aria-describedby":p?.describedBy,"aria-invalid":p?.errorId?!0:void 0,contentEditable:t?`plaintext-only`:!1,suppressContentEditableWarning:!0,...a})}d.displayName=`NumberField`;export{d as default};
@@ -1 +1 @@
1
- import e from"../styles/Field.module.js";import t from"../core/Field.js";import{useFormFieldState as n}from"../hooks/use.js";import{useFormInit as r}from"../FormInitContext.js";import{Fragment as i,jsx as a,jsxs as o}from"react/jsx-runtime";var s=(e,t=`,`)=>(e!==void 0&&e!==``?e.split(t):[]).filter(e=>e!==``).reduce((e,t)=>(e[t]=!0,e),{});function c({value:c,form:l,onValue:u,name:d,placeholder:f=``,separator:p=`,`,label:m,error:h,hidden:g=!1,disabled:_=!1,outFormat:v=`object`,after:y,before:b,modal:x,options:S,className:C}){let{onModal:w}=r(),{value:T}=n(l,d,c),E=T,D=typeof E==`string`?s(E,p):E&&typeof E==`object`?E:{},O=()=>{if(_||!x)return;let e=x.split(`.`);w({module:e[0],modalName:e[1],callback:e=>{let t=e;if(u)switch(v===`array`||v===`string`&&Object.keys(t).filter(e=>t[e]).join(p),v){case`array`:u!==l?.onValue&&u({value:Object.keys(t),name:d});break;case`string`:u!==l?.onValue&&u({value:Object.keys(t).filter(e=>t[e]).join(p),name:d});break;default:u!==l?.onValue&&u({value:t,name:d})}},onValue:u,options:S,fieldName:d,value:D})},k={};f&&(k.placeholder=f);let A=Object.keys(D).length===0;return g&&A?a(i,{}):o(t,{type:`group`,label:m,error:h,element_blok:{className:[C||``]},element_input:{className:[e.g],props:{onClick:O}},children:[b?a(`span`,{className:e.a,children:b}):null,Object.keys(D).map(e=>a(`div`,{children:S?.[e]?.label},e)),y?a(`span`,{className:e.a,children:y}):null]})}c.displayName=`OptionsField`;export{c as default};
1
+ import e from"../styles/Field.module.js";import t from"../core/Field.js";import{useFormFieldState as n}from"../hooks/use.js";import{createFieldEmit as r}from"./emit.js";import{useFormInit as i}from"../FormInitContext.js";import{Fragment as a,jsx as o,jsxs as s}from"react/jsx-runtime";var c=(e,t=`,`)=>(e!==void 0&&e!==``?e.split(t):[]).filter(e=>e!==``).reduce((e,t)=>(e[t]=!0,e),{});function l({value:l,form:u,onValue:d,name:f,placeholder:p=``,separator:m=`,`,label:h,error:g,hidden:_=!1,disabled:v=!1,outFormat:y=`object`,after:b,before:x,modal:S,options:C,className:w}){let{onModal:T}=i(),{value:E}=n(u,f,l),D=E,O=typeof D==`string`?c(D,m):D&&typeof D==`object`?D:{},k=()=>{if(v||!S)return;let e=S.split(`.`);T({module:e[0],modalName:e[1],callback:e=>{let t=e,n=y===`array`?Object.keys(t):y===`string`?Object.keys(t).filter(e=>t[e]).join(m):t;r(u,f,d)(n,!0)},onValue:d,options:C,fieldName:f,value:O})},A={};p&&(A.placeholder=p);let j=Object.keys(O).length===0;return _&&j?o(a,{}):s(t,{type:`options`,label:h,error:g,element_blok:{className:[w||``]},element_input:{className:[e.g],props:{onClick:k,"data-disabled":v?`true`:void 0}},children:[x?o(`span`,{className:e.a,children:x}):null,Object.keys(O).map(e=>o(`div`,{children:C?.[e]?.label},e)),b?o(`span`,{className:e.a,children:b}):null]})}l.displayName=`OptionsField`;export{l as default};
@@ -1 +1 @@
1
- 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 from"../events/onEvent.js";import{isEmptyTextLike as a}from"./visibility.js";import o from"react";import{jsx as s,jsxs as c}from"react/jsx-runtime";function l(){return c(`svg`,{xmlns:`http://www.w3.org/2000/svg`,width:`20`,height:`20`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,strokeWidth:`2`,strokeLinecap:`round`,strokeLinejoin:`round`,"aria-hidden":!0,children:[s(`path`,{d:`M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z`}),s(`circle`,{cx:`12`,cy:`12`,r:`3`})]})}function u(){return c(`svg`,{xmlns:`http://www.w3.org/2000/svg`,width:`20`,height:`20`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,strokeWidth:`2`,strokeLinecap:`round`,strokeLinejoin:`round`,"aria-hidden":!0,children:[s(`path`,{d:`M17.94 17.94A10.07 10.07 0 0 1 12 20c-7 0-11-8-11-8a18.45 18.45 0 0 1 5.06-5.94M9.9 4.24A9.12 9.12 0 0 1 12 4c7 0 11 8 11 8a18.5 18.5 0 0 1-2.16 3.19m-6.72-1.07a3 3 0 1 1-4.24-4.24`}),s(`line`,{x1:`1`,y1:`1`,x2:`23`,y2:`23`})]})}function d({value:n,form:d,onValue:p,name:m=``,placeholder:h=``,label:g,error:_,hidden:v=!1,disabled:y=!1,onBlur:b,className:x,after:S=``,before:C=``,native:w=!1,maxLength:T,eyes:E,id:D,size:O=`md`}){let{value:k}=r(d,m,n),[A,j]=o.useState(!1),M=o.useRef(null),N=typeof k==`string`?k:k==null?``:String(k);o.useEffect(()=>{let e=M.current;e&&e.value!==N&&(e.value=N)},[N]);let P=e=>{let t={value:e,name:m};d&&m&&d.onValue(t),p&&p!==d?.onValue&&p(t)},F=e=>{P(e.target.value)},I=e=>{e.key===`Enter`&&e.preventDefault()},L=e=>{i.Blur(e),b?.({value:(e.target.value||``).trim(),name:m||``})};if(w)return``;let R=!y;if(v&&a(N))return``;let z=E?.[0]??s(l,{}),B=E?.[1]??s(u,{});return c(t,{type:`input`,label:g,error:_,id:D,size:O,element_blok:{className:[x||``]},element_input:{className:[e.w],props:{"data-disabled":y||!R?`true`:void 0}},children:[C?s(`span`,{className:e.a,children:C}):null,s(f,{inputRef:M,passwordVisible:A,currentValue:N,disabled:y,editable:R,maxLength:T,placeholder:h,label:g,onChangeInput:F,keyDown:I,handleBlur:L}),s(`button`,{type:`button`,className:e.a,tabIndex:y?-1:0,"aria-label":A?`Скрыть пароль`:`Показать пароль`,"aria-pressed":A,disabled:y,onClick:()=>!y&&j(!A),children:A?B:z}),S?s(`span`,{className:e.a,children:S}):null]})}function f({inputRef:t,passwordVisible:r,currentValue:i,disabled:a,editable:o,maxLength:c,placeholder:l,label:u,onChangeInput:d,keyDown:f,handleBlur:p}){let m=n();return s(`div`,{className:e.x,children:s(`input`,{id:m?.controlId,className:e.y,type:r?`text`:`password`,defaultValue:i,ref:t,onChange:d,onKeyDown:f,onBlur:p,disabled:a,readOnly:a,maxLength:c,spellCheck:!1,autoComplete:`current-password`,"aria-label":u?void 0:l||`Пароль`,"aria-describedby":m?.describedBy,"aria-invalid":m?.errorId?!0:void 0,"aria-disabled":a||!o,tabIndex:a?-1:0,placeholder:l})})}d.displayName=`PasswordField`;export{d as default};
1
+ 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{createFieldEmit as i}from"./emit.js";import 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(){return l(`svg`,{xmlns:`http://www.w3.org/2000/svg`,width:`20`,height:`20`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,strokeWidth:`2`,strokeLinecap:`round`,strokeLinejoin:`round`,"aria-hidden":!0,children:[c(`path`,{d:`M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z`}),c(`circle`,{cx:`12`,cy:`12`,r:`3`})]})}function d(){return l(`svg`,{xmlns:`http://www.w3.org/2000/svg`,width:`20`,height:`20`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,strokeWidth:`2`,strokeLinecap:`round`,strokeLinejoin:`round`,"aria-hidden":!0,children:[c(`path`,{d:`M17.94 17.94A10.07 10.07 0 0 1 12 20c-7 0-11-8-11-8a18.45 18.45 0 0 1 5.06-5.94M9.9 4.24A9.12 9.12 0 0 1 12 4c7 0 11 8 11 8a18.5 18.5 0 0 1-2.16 3.19m-6.72-1.07a3 3 0 1 1-4.24-4.24`}),c(`line`,{x1:`1`,y1:`1`,x2:`23`,y2:`23`})]})}function f({value:n,form:f,onValue:m,name:h=``,placeholder:g=``,label:_,error:v,hidden:y=!1,disabled:b=!1,onBlur:x,className:S,after:C=``,before:w=``,native:T=!1,maxLength:E,eyes:D,id:O,size:k=`m`}){let{value:A}=r(f,h,n),[j,M]=s.useState(!1),N=s.useRef(null),P=typeof A==`string`?A:A==null?``:String(A);s.useEffect(()=>{let e=N.current;e&&e.value!==P&&(e.value=P)},[P]);let F=i(f,h,m),I=e=>{F(e.target.value)},L=e=>{e.key===`Enter`&&e.preventDefault()},R=e=>{a.Blur(e),x?.({value:(e.target.value||``).trim(),name:h||``})};if(T)return``;let z=!b;if(y&&o(P))return``;let B=D?.[0]??c(u,{}),V=D?.[1]??c(d,{});return l(t,{type:`input`,label:_,error:v,id:O,size:k,element_blok:{className:[S||``]},element_input:{className:[e.w],props:{"data-disabled":b||!z?`true`:void 0}},children:[w?c(`span`,{className:e.a,children:w}):null,c(p,{inputRef:N,passwordVisible:j,currentValue:P,disabled:b,editable:z,maxLength:E,placeholder:g,label:_,onChangeInput:I,keyDown:L,handleBlur:R}),c(`button`,{type:`button`,className:e.a,tabIndex:b?-1:0,"aria-label":j?`Скрыть пароль`:`Показать пароль`,"aria-pressed":j,disabled:b,onClick:()=>!b&&M(!j),children:j?V:B}),C?c(`span`,{className:e.a,children:C}):null]})}function p({inputRef:t,passwordVisible:r,currentValue:i,disabled:a,editable:o,maxLength:s,placeholder:l,label:u,onChangeInput:d,keyDown:f,handleBlur:p}){let m=n();return c(`div`,{className:e.x,children:c(`input`,{id:m?.controlId,className:e.y,type:r?`text`:`password`,defaultValue:i,ref:t,onChange:d,onKeyDown:f,onBlur:p,disabled:a,readOnly:a,maxLength:s,spellCheck:!1,autoComplete:`current-password`,"aria-label":u?void 0:l||`Пароль`,"aria-describedby":m?.describedBy,"aria-invalid":m?.errorId?!0:void 0,"aria-disabled":a||!o,tabIndex:a?-1:0,placeholder:l})})}f.displayName=`PasswordField`;export{f as default};
@@ -1 +1 @@
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 a from"react";import{jsx as o,jsxs as s}from"react/jsx-runtime";function c(e,t,n){return Number.isFinite(e)?Math.min(n,Math.max(t,e)):t}function l(e,t){let n=e.replace(`,`,`.`).replace(/[^\d.]/g,``);if(!n)return null;let r=Number(n);if(!Number.isFinite(r))return null;if(t<=0)return Math.round(r);let i=10**t;return Math.round(r*i)/i}function u(e,t){return Number.isFinite(e)?String(t<=0?Math.round(e):Number(e.toFixed(t))):``}function d({value:d=0,form:f,onValue:p,onBlur:m,name:h=``,placeholder:g=`0`,label:_=``,error:v=``,hidden:y=!1,disabled:b=!1,className:x=``,after:S,before:C=``,min:w=0,max:T=100,decimals:E=0,inputmode:D=`decimal`}){let{value:O,version:k}=n(f,h,d),A=!b,j=c(Number(O),w,T),M=O==null||O===``?``:u(j,E),N=a.useRef(null),P=a.useRef(!1);a.useLayoutEffect(()=>{if(P.current)return;let e=N.current;e&&e.textContent!==M&&(e.textContent=M)},[M,k]);let F=(e,t=!1)=>{let n={value:e,name:h};if(f&&h)if(t){let t=f.getValue(h);Object.is(t,e)?f.onValue(n):f.setValue(n)}else f.onValue(n);p&&p!==f?.onValue&&p(n)},I=e=>{let t=(e.currentTarget.textContent||``).replace(/[^\d.,]/g,``);e.currentTarget.textContent!==t&&(e.currentTarget.textContent=t);let n=l(t,E);if(n===null){F(``);return}F(c(n,w,T))},L=e=>{r.Blur(e),P.current=!1;let t=l(e.currentTarget.textContent||``,E),n=t===null?w:c(t,w,T),i=u(n,E);e.currentTarget.textContent!==i&&(e.currentTarget.textContent=i),F(n,!0),m?.({value:n,name:h})};if(y&&(O==null||O===``))return null;let R={};return g&&(R.placeholder=g),A&&(R.edit=``),R.inputMode=D||`decimal`,s(t,{type:`percent`,label:_,error:v,element_blok:{className:[x||``]},element_input:{className:[e.w],props:{"data-disabled":b||!A?`true`:void 0}},children:[C?o(`span`,{className:e.a,children:C}):null,o(`div`,{ref:N,onInput:I,onFocus:e=>{P.current=!0,r.Focus({target:e.currentTarget})},onBlur:L,onPaste:e=>r.Paste(12,i(e)),onKeyDown:e=>{e.key===`Enter`&&e.preventDefault(),e.key.length===1&&!/[\d.,]/.test(e.key)&&!e.metaKey&&!e.ctrlKey&&e.preventDefault()},spellCheck:!1,role:`textbox`,tabIndex:A?0:-1,"aria-label":_||g||`Процент`,contentEditable:A?`plaintext-only`:!1,suppressContentEditableWarning:!0,...R}),S===void 0?o(`span`,{className:e.a,children:`%`}):o(`span`,{className:e.a,children:S})]})}d.displayName=`PercentField`;export{d as default};
1
+ import e from"../styles/Field.module.js";import t from"../core/Field.js";import{useFormFieldState as n}from"../hooks/use.js";import{createFieldEmit as r}from"./emit.js";import i,{asEditableClipboard as a}from"../events/onEvent.js";import o from"react";import{jsx as s,jsxs as c}from"react/jsx-runtime";function l(e,t,n){return Number.isFinite(e)?Math.min(n,Math.max(t,e)):t}function u(e,t){let n=e.replace(`,`,`.`).replace(/[^\d.]/g,``);if(!n)return null;let r=Number(n);if(!Number.isFinite(r))return null;if(t<=0)return Math.round(r);let i=10**t;return Math.round(r*i)/i}function d(e,t){return Number.isFinite(e)?String(t<=0?Math.round(e):Number(e.toFixed(t))):``}function f({value:f=0,form:p,onValue:m,onBlur:h,name:g=``,placeholder:_=`0`,label:v=``,error:y=``,hidden:b=!1,disabled:x=!1,className:S=``,after:C,before:w=``,min:T=0,max:E=100,decimals:D=0,inputmode:O=`decimal`}){let{value:k,version:A}=n(p,g,f),j=!x,M=l(Number(k),T,E),N=k==null||k===``?``:d(M,D),P=o.useRef(null),F=o.useRef(!1);o.useLayoutEffect(()=>{if(F.current)return;let e=P.current;e&&e.textContent!==N&&(e.textContent=N)},[N,A]);let I=r(p,g,m),L=e=>{let t=(e.currentTarget.textContent||``).replace(/[^\d.,]/g,``);e.currentTarget.textContent!==t&&(e.currentTarget.textContent=t);let n=u(t,D);if(n===null){I(``);return}I(l(n,T,E))},R=e=>{i.Blur(e),F.current=!1;let t=u(e.currentTarget.textContent||``,D),n=t===null?T:l(t,T,E),r=d(n,D);e.currentTarget.textContent!==r&&(e.currentTarget.textContent=r),I(n,!0),h?.({value:n,name:g})};if(b&&(k==null||k===``))return null;let z={};return _&&(z.placeholder=_),j&&(z.edit=``),z.inputMode=O||`decimal`,c(t,{type:`percent`,label:v,error:y,element_blok:{className:[S||``]},element_input:{className:[e.w],props:{"data-disabled":x||!j?`true`:void 0}},children:[w?s(`span`,{className:e.a,children:w}):null,s(`div`,{ref:P,onInput:L,onFocus:e=>{F.current=!0,i.Focus({target:e.currentTarget})},onBlur:R,onPaste:e=>i.Paste(12,a(e)),onKeyDown:e=>{e.key===`Enter`&&e.preventDefault(),e.key.length===1&&!/[\d.,]/.test(e.key)&&!e.metaKey&&!e.ctrlKey&&e.preventDefault()},spellCheck:!1,role:`textbox`,tabIndex:j?0:-1,"aria-label":v||_||`Процент`,contentEditable:j?`plaintext-only`:!1,suppressContentEditableWarning:!0,...z}),C===void 0?s(`span`,{className:e.a,children:`%`}):s(`span`,{className:e.a,children:C})]})}f.displayName=`PercentField`;export{f as default};
@@ -1 +1 @@
1
- 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{PHONE_MASK_DEFAULTS as s}from"../mask/phoneDefaults.js";import{useFormInit as c}from"../FormInitContext.js";import l from"react";import{jsx as u,jsxs as d}from"react/jsx-runtime";var f={...s},p=!1,m=null;function h(){return p?Promise.resolve(!1):m||(m=import(`../mask/MaskPhone.js`).then(e=>(f={...s,...e.default},p=!0,!0)),m)}function g(e){let t=window.getSelection();if(!t||t.rangeCount===0)return 0;let n=t.getRangeAt(0);if(!e.contains(n.startContainer))return 0;let r=document.createRange();return r.selectNodeContents(e),r.setEnd(n.startContainer,n.startOffset),r.toString().length}function _(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 v(e){let t=`+_(___) ___-__-__`,n=!0,r=0,i=0,a=``,o=e.replace(/\D/g,``);o===``&&(n=!0);let s=o.split(``),c=``;s.forEach(e=>{n&&(c+=e,f[c]!==void 0&&n?(n=!1,t=f[c].mask.replace(RegExp(`[0-9]`,`g`),`_`),a=f[c].code):(n&&(r=(``+c).length,t=`+${c}_(___) ___-__-__`.replace(RegExp(`[0-9]`,`g`),`_`),a=``),r>(``+c).length&&(n=!0,t=`+${c}_(___) ___-__-__`.replace(RegExp(`[0-9]`,`g`),`_`),a=``)))});let l=t.replace(/\D/g,``);return l.length>=o.length&&(o=l),{q:t.replace(/[_\d]/g,function(){return o.charAt(i++)||`_`}),i,v:o,f:a}}function y({value:n,form:s,onValue:f,onBlur:p,name:m=``,placeholder:y=``,label:x=``,error:S=``,hidden:C=!1,disabled:w=!1,className:T=``,after:E=``,before:D=``,inputmode:O=`tel`,id:k}){let{onNotice:A}=c(),j=!w,{value:M,version:N}=r(s,m,n),[,P]=l.useState(0),F=l.useRef(null),I=l.useRef(!1),L=(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())},R=e=>{let t=e.target,n=t.textContent||``,r=g(t),i=n.slice(0,r).replace(/\D/g,``).length,a=v(n);t.textContent=a.q;let o=_(a.q,i);a.q.length>0&&queueMicrotask(()=>{L(Math.min(o,a.q.length),t)});let c={value:a.q.replace(/\D/g,``),name:m||``};s&&m&&s.onValue(c),f&&f!==s?.onValue&&f(c)},z=e=>i.PasteOne(a(e));l.useLayoutEffect(()=>{if(I.current)return;let e=F.current;if(!e)return;let t=v(String(M||``));e.textContent!==t.q&&(e.textContent=t.q)},[M,N]);let B=e=>{e.preventDefault();let t=e.target;navigator.clipboard.writeText((t.textContent||``).replace(/\D/g,``)).then(function(){A(`Данные в буфер обмене`)},function(e){})},V=e=>{e.key===`Enter`&&e.preventDefault()},H=e=>{i.Blur(e),p&&p({value:(e.target.textContent||``).replace(/\D/g,``),name:m||``}),I.current=!1},U=e=>{I.current=!0,i.Focus({target:e.currentTarget}),h().then(e=>{if(!e)return;P(e=>e+1);let t=F.current;if(!t||document.activeElement!==t)return;let n=t.textContent||``,r=g(t),i=n.slice(0,r).replace(/\D/g,``).length,a=v(n);t.textContent!==a.q&&(t.textContent=a.q,queueMicrotask(()=>{L(Math.min(_(a.q,i),a.q.length),t)}))})},W={};y&&(W.placeholder=y),W.inputMode=O??`tel`;let G=String(M??``).replace(/\D/g,``);return C&&o(G)?null:d(t,{type:`input`,label:x,error:S,id:k,element_blok:{className:[T]},element_input:{className:[e.w]},children:[D?u(`span`,{className:e.a,children:D}):null,u(b,{divRef:F,editable:j,disabled:w,label:x,placeholder:y,dd:W,onPaste:z,onInput:R,onKeyDown:V,onContextMenu:B,onBlur:H,onFocus:U}),E?u(`span`,{className:e.a,children:E}):null]})}function b({divRef:e,editable:t,disabled:r,label:i,placeholder:a,dd:o,onPaste:s,onInput:c,onKeyDown:l,onContextMenu:d,onBlur:f,onFocus:p}){let m=n();return u(`div`,{ref:e,id:m?.controlId,onPaste:s,onInput:c,onKeyDown:l,onContextMenu:d,onBlur:f,onFocus:p,spellCheck:!1,role:`textbox`,"aria-label":i?void 0:a||`Телефон`,"aria-describedby":m?.describedBy,"aria-invalid":m?.errorId?!0:void 0,"aria-disabled":!t,tabIndex:r?-1:0,"data-disabled":!t,contentEditable:t?`plaintext-only`:!1,suppressContentEditableWarning:!0,...o})}y.displayName=`PhoneField`;export{y as default};
1
+ 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{createFieldEmit as i}from"./emit.js";import a,{asEditableClipboard as o}from"../events/onEvent.js";import{isEmptyTextLike as s}from"./visibility.js";import{PHONE_MASK_DEFAULTS as c}from"../mask/phoneDefaults.js";import{useFormInit as l}from"../FormInitContext.js";import u from"react";import{jsx as d,jsxs as f}from"react/jsx-runtime";var p={...c},m=!1,h=null;function g(){return m?Promise.resolve(!1):h||(h=import(`../mask/MaskPhone.js`).then(e=>(p={...c,...e.default},m=!0,!0)),h)}function _(e){let t=window.getSelection();if(!t||t.rangeCount===0)return 0;let n=t.getRangeAt(0);if(!e.contains(n.startContainer))return 0;let r=document.createRange();return r.selectNodeContents(e),r.setEnd(n.startContainer,n.startOffset),r.toString().length}function v(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 y(e){let t=`+_(___) ___-__-__`,n=!0,r=0,i=0,a=``,o=e.replace(/\D/g,``);o===``&&(n=!0);let s=o.split(``),c=``;s.forEach(e=>{n&&(c+=e,p[c]!==void 0&&n?(n=!1,t=p[c].mask.replace(RegExp(`[0-9]`,`g`),`_`),a=p[c].code):(n&&(r=(``+c).length,t=`+${c}_(___) ___-__-__`.replace(RegExp(`[0-9]`,`g`),`_`),a=``),r>(``+c).length&&(n=!0,t=`+${c}_(___) ___-__-__`.replace(RegExp(`[0-9]`,`g`),`_`),a=``)))});let l=t.replace(/\D/g,``);return l.length>=o.length&&(o=l),{q:t.replace(/[_\d]/g,function(){return o.charAt(i++)||`_`}),i,v:o,f:a}}function b({value:n,form:c,onValue:p,onBlur:m,name:h=``,placeholder:b=``,label:S=``,error:C=``,hidden:w=!1,disabled:T=!1,className:E=``,after:D=``,before:O=``,inputmode:k=`tel`,id:A}){let{onNotice:j}=l(),M=!T,{value:N,version:P}=r(c,h,n),[,F]=u.useState(0),I=u.useRef(null),L=u.useRef(!1),R=(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())},z=i(c,h,p),B=e=>{let t=e.target,n=t.textContent||``,r=_(t),i=n.slice(0,r).replace(/\D/g,``).length,a=y(n);t.textContent=a.q;let o=v(a.q,i);a.q.length>0&&queueMicrotask(()=>{R(Math.min(o,a.q.length),t)}),z(a.q.replace(/\D/g,``))},V=e=>a.PasteOne(o(e));u.useLayoutEffect(()=>{if(L.current)return;let e=I.current;if(!e)return;let t=y(String(N||``));e.textContent!==t.q&&(e.textContent=t.q)},[N,P]);let H=e=>{e.preventDefault();let t=e.target;navigator.clipboard.writeText((t.textContent||``).replace(/\D/g,``)).then(function(){j(`Данные в буфер обмене`)},function(e){})},U=e=>{e.key===`Enter`&&e.preventDefault()},W=e=>{a.Blur(e),m&&m({value:(e.target.textContent||``).replace(/\D/g,``),name:h||``}),L.current=!1},G=e=>{L.current=!0,a.Focus({target:e.currentTarget}),g().then(e=>{if(!e)return;F(e=>e+1);let t=I.current;if(!t||document.activeElement!==t)return;let n=t.textContent||``,r=_(t),i=n.slice(0,r).replace(/\D/g,``).length,a=y(n);t.textContent!==a.q&&(t.textContent=a.q,queueMicrotask(()=>{R(Math.min(v(a.q,i),a.q.length),t)}))})},K={};b&&(K.placeholder=b),K.inputMode=k??`tel`;let q=String(N??``).replace(/\D/g,``);return w&&s(q)?null:f(t,{type:`input`,label:S,error:C,id:A,element_blok:{className:[E]},element_input:{className:[e.w],props:{"data-disabled":T||!M?`true`:void 0}},children:[O?d(`span`,{className:e.a,children:O}):null,d(x,{divRef:I,editable:M,disabled:T,label:S,placeholder:b,dd:K,onPaste:V,onInput:B,onKeyDown:U,onContextMenu:H,onBlur:W,onFocus:G}),D?d(`span`,{className:e.a,children:D}):null]})}function x({divRef:e,editable:t,disabled:r,label:i,placeholder:a,dd:o,onPaste:s,onInput:c,onKeyDown:l,onContextMenu:u,onBlur:f,onFocus:p}){let m=n();return d(`div`,{ref:e,id:m?.controlId,onPaste:s,onInput:c,onKeyDown:l,onContextMenu:u,onBlur:f,onFocus:p,spellCheck:!1,role:`textbox`,"aria-label":i?void 0:a||`Телефон`,"aria-describedby":m?.describedBy,"aria-invalid":m?.errorId?!0:void 0,"aria-disabled":!t,tabIndex:r?-1:0,"data-disabled":t?void 0:`true`,contentEditable:t?`plaintext-only`:!1,suppressContentEditableWarning:!0,...o})}b.displayName=`PhoneField`;export{b as default};