@elcrm/form 0.0.87 → 0.1.0

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 (68) hide show
  1. package/README.md +87 -47
  2. package/dist/Form.js +1 -11
  3. package/dist/FormInitContext.js +1 -20
  4. package/dist/assets/styles/Field.module.css +1 -1
  5. package/dist/assets/styles/Form.module.css +1 -1
  6. package/dist/assets/styles/Select.module.css +1 -1
  7. package/dist/core/Field.d.ts +14 -2
  8. package/dist/core/Field.js +2 -35
  9. package/dist/dark.css +22 -3
  10. package/dist/events/onEvent.js +1 -67
  11. package/dist/fields/Check.js +1 -86
  12. package/dist/fields/Code.js +1 -94
  13. package/dist/fields/Color.js +1 -495
  14. package/dist/fields/Date.js +1 -450
  15. package/dist/fields/Display.d.ts +1 -1
  16. package/dist/fields/Display.js +1 -49
  17. package/dist/fields/DragDrop.js +1 -189
  18. package/dist/fields/Email.d.ts +4 -2
  19. package/dist/fields/Email.js +1 -80
  20. package/dist/fields/File.js +1 -115
  21. package/dist/fields/Hidden.js +1 -33
  22. package/dist/fields/Input.d.ts +3 -1
  23. package/dist/fields/Input.js +1 -149
  24. package/dist/fields/Mask.js +1 -119
  25. package/dist/fields/Modal.js +1 -68
  26. package/dist/fields/Money.js +1 -125
  27. package/dist/fields/NativeTextField.d.ts +15 -0
  28. package/dist/fields/NativeTextField.js +1 -0
  29. package/dist/fields/Numeric.d.ts +12 -1
  30. package/dist/fields/Numeric.js +1 -105
  31. package/dist/fields/Options.js +1 -69
  32. package/dist/fields/Password.d.ts +1 -1
  33. package/dist/fields/Password.js +1 -143
  34. package/dist/fields/Percent.d.ts +8 -1
  35. package/dist/fields/Percent.js +1 -100
  36. package/dist/fields/Phone.d.ts +2 -2
  37. package/dist/fields/Phone.js +1 -128
  38. package/dist/fields/Radio.js +1 -88
  39. package/dist/fields/Range.js +1 -109
  40. package/dist/fields/Rating.js +1 -82
  41. package/dist/fields/RichText.js +1 -134
  42. package/dist/fields/Select.d.ts +3 -1
  43. package/dist/fields/Select.js +1 -159
  44. package/dist/fields/Tags.js +1 -97
  45. package/dist/fields/Textarea.d.ts +1 -1
  46. package/dist/fields/Textarea.js +1 -68
  47. package/dist/fields/Time.js +1 -444
  48. package/dist/fields/Url.d.ts +4 -2
  49. package/dist/fields/Url.js +1 -80
  50. package/dist/fields/emit.d.ts +9 -0
  51. package/dist/fields/emit.js +1 -0
  52. package/dist/fields/type.d.ts +1 -1
  53. package/dist/fields/visibility.js +1 -6
  54. package/dist/hooks/use.js +1 -57
  55. package/dist/index.js +2 -42
  56. package/dist/index.umd.js +2 -2
  57. package/dist/light.css +23 -3
  58. package/dist/mask/MaskPhone.js +1 -1384
  59. package/dist/mask/phoneDefaults.d.ts +8 -0
  60. package/dist/mask/phoneDefaults.js +1 -0
  61. package/dist/overlayZ.js +1 -25
  62. package/dist/package.js +1 -130
  63. package/dist/style.css +3 -3
  64. package/dist/styles/Color.module.js +1 -27
  65. package/dist/styles/Field.module.js +1 -77
  66. package/dist/styles/Form.module.js +1 -12
  67. package/dist/styles/Select.module.js +1 -9
  68. package/package.json +2 -2
@@ -5,41 +5,8 @@
5
5
  var el = document.createElement("style");
6
6
  el.id = "elcrm-form-base-styles";
7
7
  el.setAttribute("data-elcrm", "form");
8
- el.textContent = "._l_174yx_2{min-width:var(--field-width);gap:var(--field-block-gap,0);flex-direction:column;margin:0;padding:0;display:flex;position:relative}._l_174yx_2[data-size=sm]{--field-height:32px;--control-height:32px;--field-side-padding:10px;--control-side-padding:10px;--control-inner-padding:0 10px;font-size:13px}._l_174yx_2>dt,._l_174yx_2>dd{margin:0}._l_174yx_2[data-field=group] div{cursor:pointer;border-bottom:var(--field-border);padding:var(--field-padding);margin:0}._l_174yx_2[data-field=group] div:last-child{border-bottom:0}._l_174yx_2 [placeholder]:empty:before{content:attr(placeholder);color:var(--field-placeholder);opacity:1;pointer-events:none;font-style:normal;font-weight:400;display:block}._l_174yx_2 [placeholder]:focus:before{display:none}._f_174yx_48{box-sizing:border-box;align-items:center;gap:var(--field-icon-gap,10px);border:var(--field-border);border-radius:var(--field-radius);background:var(--field-background);color:var(--field-color);padding:var(--control-inner-padding,0 var(--field-side-padding,14px));transition:border-color .16s,box-shadow .16s,background-color .16s,opacity .16s;display:flex;overflow:hidden}._f_174yx_48:hover{border-color:var(--field-border-hover,var(--field-border))}._f_174yx_48:focus-within{border-color:var(--field-border-focus,var(--field-border));box-shadow:0 0 0 3px var(--field-focus-ring,#0000);background:var(--field-background-focus,var(--field-background))}._f_174yx_48._e_174yx_73:focus-within{background:var(--field-error-background);color:var(--field-error-color)}._f_174yx_48[data-disabled=true]{background:var(--field-background-disabled,var(--field-background));border-color:var(--field-border-disabled,var(--field-border));color:var(--field-color-disabled,var(--field-placeholder));cursor:not-allowed;opacity:.85}._f_174yx_48[data-disabled=true]>*{cursor:not-allowed}._f_174yx_48>div{min-height:var(--field-height);line-height:calc(var(--field-height) - 2px);font-size:var(--control-font-size,14px);text-wrap:pretty;outline:0;flex:1;margin:0;padding:0}._f_174yx_48>div::selection{background:var(--field-selection-bg,#b3d4fc);color:var(--field-selection-color,inherit)}._f_174yx_48>:not(div){box-sizing:border-box;height:var(--field-height);min-height:var(--field-height);max-height:var(--field-height);color:var(--field-icon-color,var(--field-placeholder));flex:none;justify-content:center;align-self:center;align-items:center;display:inline-flex}._f_174yx_48>:not(div) svg{flex-shrink:0;width:20px;height:20px;display:block}._f_174yx_48 input::placeholder,._f_174yx_48 textarea::placeholder{color:var(--field-placeholder);opacity:1;font-weight:400}._f_174yx_48 input::-webkit-input-placeholder{color:var(--field-placeholder);opacity:1;font-weight:400}._f_174yx_48 textarea::-webkit-input-placeholder{color:var(--field-placeholder);opacity:1;font-weight:400}._f_174yx_48 input::-moz-placeholder{color:var(--field-placeholder);opacity:1;font-weight:400}._f_174yx_48 textarea::-moz-placeholder{color:var(--field-placeholder);opacity:1;font-weight:400}._f_174yx_48 input:-webkit-autofill{caret-color:var(--field-color);transition:background-color 99999s ease-out;-webkit-text-fill-color:var(--field-color)!important;box-shadow:0 0 0 1000px var(--field-background) inset!important;font-size:inherit!important;line-height:inherit!important}._f_174yx_48 input:-webkit-autofill:hover{caret-color:var(--field-color);transition:background-color 99999s ease-out;-webkit-text-fill-color:var(--field-color)!important;box-shadow:0 0 0 1000px var(--field-background) inset!important;font-size:inherit!important;line-height:inherit!important}._f_174yx_48 input:-webkit-autofill:focus{caret-color:var(--field-color);transition:background-color 99999s ease-out;-webkit-text-fill-color:var(--field-color)!important;box-shadow:0 0 0 1000px var(--field-background) inset!important;font-size:inherit!important;line-height:inherit!important}._f_174yx_48 input:-webkit-autofill:active{caret-color:var(--field-color);transition:background-color 99999s ease-out;-webkit-text-fill-color:var(--field-color)!important;box-shadow:0 0 0 1000px var(--field-background) inset!important;font-size:inherit!important;line-height:inherit!important}._f_174yx_48:focus-within input:-webkit-autofill{box-shadow:0 0 0 1000px var(--field-background-focus,var(--field-background)) inset!important}._f_174yx_48 [contenteditable=true],._f_174yx_48 [contenteditable=plaintext-only],._f_174yx_48>div{scrollbar-width:none;-ms-overflow-style:none}._f_174yx_48 [contenteditable=true]::-webkit-scrollbar{background:0 0;width:0;height:0;display:none}._f_174yx_48 [contenteditable=plaintext-only]::-webkit-scrollbar{background:0 0;width:0;height:0;display:none}._f_174yx_48>div::-webkit-scrollbar{background:0 0;width:0;height:0;display:none}._n_174yx_183>div{min-height:var(--field-note-height);line-height:var(--field-note-line-height);padding-top:var(--field-note-padding,var(--field-note-padding-top,8px));padding-bottom:var(--field-note-padding,var(--field-note-padding-top,8px));scrollbar-width:none;-ms-overflow-style:none;overflow:hidden auto}._n_174yx_183>div::-webkit-scrollbar{background:0 0;width:0;height:0;display:none}._w_174yx_200>div{box-sizing:border-box;height:var(--field-height);min-height:var(--field-height);max-height:var(--field-height);text-wrap:nowrap;scrollbar-width:none;-ms-overflow-style:none;overflow:auto hidden}._w_174yx_200>div::-webkit-scrollbar{background:0 0;width:0;height:0;display:none}._w_174yx_200>div input{box-sizing:border-box;height:100%;min-height:0;max-height:100%;line-height:normal}._time_174yx_227>div{text-wrap:nowrap;align-items:center;min-width:0;display:flex;overflow:visible}._time_174yx_227 ._timeInner_174yx_234{justify-content:flex-start;align-items:center;gap:4px;width:100%;min-width:0;display:flex}._time_174yx_227._timeAlignCenter_174yx_245 ._timeInner_174yx_234{justify-content:center}._time_174yx_227 ._timeSep_174yx_248{opacity:.65;-webkit-user-select:none;user-select:none;flex:none;padding:0 2px;font-weight:500;transform:translateY(-1px)}._time_174yx_227 ._timePickerBtn_174yx_256{color:var(--field-icon-color,var(--field-placeholder));cursor:pointer;background:0 0;border:0;outline:none;flex:none;justify-content:center;align-items:center;margin:0;padding:0;line-height:0;display:inline-flex}._time_174yx_227 ._timePickerBtn_174yx_256:hover:not(:disabled){color:var(--field-color)}._time_174yx_227 ._timePickerBtn_174yx_256:focus-visible{box-shadow:0 0 0 3px var(--field-focus-ring,#0000);border-radius:6px}._time_174yx_227 ._timePickerBtn_174yx_256:disabled{cursor:not-allowed;opacity:.5}._time_174yx_227 ._timePart_174yx_284{box-sizing:border-box;width:2.25ch;min-width:2.25ch;color:inherit;font:inherit;font-variant-numeric:tabular-nums;line-height:inherit;text-align:center;min-height:var(--field-height);cursor:text;scrollbar-width:none;-ms-overflow-style:none;background:0 0;border:0;border-radius:6px;outline:none;flex:none;margin:0;padding:0;overflow:hidden}._time_174yx_227 ._timePart_174yx_284::-webkit-scrollbar{background:0 0;width:0;height:0;display:none}._time_174yx_227 ._timePart_174yx_284[contenteditable=false]{cursor:not-allowed;opacity:.7}._time_174yx_227 ._timePart_174yx_284:empty:before{content:attr(placeholder);color:var(--field-placeholder);opacity:1;font-weight:400}._time_174yx_227 ._timePart_174yx_284:focus:empty:before{content:none}._time_174yx_227 ._timePart_174yx_284:focus-visible{background:0 0}._time_174yx_227._timeAlignCenter_174yx_245 ._timePart_174yx_284{text-align:center}._t_174yx_227{color:var(--field-label-color);font-size:var(--field-label-size);padding-bottom:10px}._affix_174yx_342{box-sizing:border-box;height:var(--field-height);min-height:var(--field-height);max-height:var(--field-height);color:var(--field-icon-color,var(--field-placeholder));font-size:inherit;-webkit-user-select:none;user-select:none;cursor:pointer;background:0 0;border:0;flex:none;justify-content:center;align-self:center;align-items:center;margin:0;padding:0;line-height:1;display:inline-flex}._affix_174yx_342:disabled{cursor:not-allowed;opacity:.6}._affix_174yx_342 svg{flex-shrink:0;width:20px;height:20px;display:block}._g_174yx_375{flex-direction:column}._range_174yx_379>div{box-sizing:border-box;min-width:0;min-height:var(--field-height);flex:1;align-items:center;line-height:normal;display:flex}._range_174yx_379 ._rangeTrack_174yx_388{box-sizing:border-box;width:100%;height:var(--field-range-bar-height,14px);background:var(--field-range-track,#e0e0e0);cursor:pointer;touch-action:none;border-radius:999px;outline:none;flex-shrink:0;position:relative;overflow:hidden}._range_174yx_379 ._rangeTrack_174yx_388:focus-visible{box-shadow:0 0 0 3px var(--field-focus-ring,#0000)}._range_174yx_379 ._rangeTrack_174yx_388[data-disabled=true]{cursor:not-allowed;opacity:.55;pointer-events:none}._range_174yx_379 ._rangeFill_174yx_409{background:var(--field-range-fill,#00b5ad);pointer-events:none;border-radius:999px 0 0 999px;width:0;min-width:0;height:100%}._range_174yx_379 ._rangeFillFull_174yx_420{border-radius:999px}._checkbox_174yx_424>div{min-height:var(--field-height);align-items:flex-start;width:100%;padding:0;line-height:normal;display:flex}._checkbox_174yx_424[data-variant=plain]{border-radius:0;overflow:visible;box-shadow:none!important;background:0 0!important;border:none!important;min-height:0!important;padding:0!important}._checkbox_174yx_424[data-variant=plain]:hover,._checkbox_174yx_424[data-variant=plain]:focus-within{box-shadow:none!important;background:0 0!important;border:none!important}._checkbox_174yx_424[data-size=sm]>div{align-items:center;min-height:0}._checkPlainBlok_174yx_451{width:100%;min-width:0}._checkControl_174yx_456{width:100%;min-height:var(--field-height);color:inherit;font:inherit;text-align:left;cursor:pointer;background:0 0;border:0;outline:none;align-items:flex-start;gap:12px;margin:0;padding:10px 0;display:flex}._checkControl_174yx_456:focus-visible{box-shadow:0 0 0 3px var(--field-focus-ring,#0000);border-radius:calc(var(--field-radius) - 2px)}._checkControl_174yx_456[data-focus-ring=false]:focus-visible{box-shadow:none}._checkControl_174yx_456[aria-disabled=true]{cursor:not-allowed}._checkControl_174yx_456[data-size=sm]{border-radius:8px;align-items:center;gap:10px;min-height:0;padding:7px 8px}._checkControl_174yx_456[data-size=sm] ._checkBox_174yx_489{border-radius:5px;width:18px;height:18px}._checkControl_174yx_456[data-size=sm] ._checkMark_174yx_494{width:9px;height:5px}._checkControl_174yx_456[data-size=sm] ._checkText_174yx_498{padding-top:0;font-size:13px;line-height:1.2}._checkControl_174yx_456[data-size=sm][data-variant=plain]:hover:not([aria-disabled=true]){background:var(--field-background-focus,#ffffff0f)}._checkBox_174yx_489{border:var(--field-check-box-border,var(--field-border));background:0 0;border-radius:8px;flex:none;justify-content:center;align-items:center;width:22px;height:22px;transition:background-color .16s,border-color .16s,opacity .16s;display:inline-flex}._checkMark_174yx_494{border-top:none;border-bottom:2px solid #fcfff4;border-left:2px solid #fcfff4;border-right:none;width:11px;height:6px;transform:translateY(-1px)rotate(-45deg)}._checkText_174yx_498{min-width:0;color:inherit;font-size:var(--control-font-size,14px);flex:auto;padding-top:2px;line-height:1.25}._checkControl_174yx_456[aria-checked=true] ._checkBox_174yx_489{background:var(--field-background-active)}._h_174yx_542{--field-border:0}._h_174yx_542 div{border:var(--field-check-box-border,--field-border);width:var(--field-height);height:var(--field-height);border-radius:var(--field-radius);background:var(--field-background);cursor:pointer;flex:none;gap:10px;margin:0;position:relative}._h_174yx_542 div[aria-checked=true]{background:var(--field-background-active)}._h_174yx_542 div:after{content:\"\";background:0 0;border-top:none;border-bottom:3px solid #fcfff4;border-left:3px solid #fcfff4;border-right:none;width:9px;height:5px;margin:4px;position:absolute;top:5px;left:4px;transform:rotate(-45deg)}._e_174yx_73{border-color:var(--field-error-border);background:var(--field-error-background);color:var(--field-error-color)}._m_174yx_581{color:var(--field-error-color);margin-top:6px;font-size:12px;font-style:normal}._display_174yx_589>div{color:inherit;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}._displayEmpty_174yx_596{color:var(--field-placeholder)}._radio_174yx_601>div{width:100%;min-height:var(--field-height);flex-direction:column;align-items:stretch;gap:4px;padding:6px 0;line-height:normal;display:flex}._radioInline_174yx_612>div{flex-flow:wrap;align-items:center;gap:8px 16px}._radioItem_174yx_619{color:inherit;font:inherit;text-align:left;cursor:pointer;background:0 0;border:0;outline:none;align-items:center;gap:10px;margin:0;padding:4px 0;display:inline-flex}._radioItem_174yx_619:focus-visible{box-shadow:0 0 0 3px var(--field-focus-ring,#0000);border-radius:6px}._radioItem_174yx_619[aria-disabled=true]{cursor:not-allowed;opacity:.7}._radioDot_174yx_642{border:var(--field-check-box-border,var(--field-border));border-radius:50%;flex:none;justify-content:center;align-items:center;width:20px;height:20px;display:inline-flex}._radioDotFill_174yx_653{background:var(--field-background-active);border-radius:50%;width:10px;height:10px}._radioText_174yx_660{font-size:var(--control-font-size,14px);line-height:1.25}._tags_174yx_666>div,._tags_174yx_666 ._tagsInner_174yx_667{width:100%;min-height:var(--field-height);flex-wrap:wrap;align-items:center;gap:4px;padding:0;line-height:normal;display:flex;overflow:visible}._tagsInner_174yx_667{flex:1;min-width:0}._tagChip_174yx_684{background:var(--field-background-focus,#0000000f);border-radius:999px;align-items:center;gap:2px;max-width:100%;padding:0 6px;line-height:1.35;display:inline-flex}._tagLabel_174yx_695{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}._tagRemove_174yx_701{color:inherit;cursor:pointer;opacity:.65;background:0 0;border:0;padding:0 2px;font-size:16px;line-height:1}._tagRemove_174yx_701:hover{opacity:1}._tagInput_174yx_715{min-width:80px;color:inherit;font:inherit;background:0 0;border:0;outline:none;flex:80px;margin:0;padding:0}._rating_174yx_728>div{width:100%;min-height:var(--field-height);outline:none;align-items:center;gap:2px;line-height:normal;display:flex}._ratingStar_174yx_738{color:var(--field-placeholder);cursor:pointer;background:0 0;border:0;outline:none;padding:0 2px;font-size:22px;line-height:1}._ratingStar_174yx_738:disabled{cursor:not-allowed;opacity:.6}._ratingStar_174yx_738:focus-visible{box-shadow:0 0 0 3px var(--field-focus-ring,#0000);border-radius:4px}._ratingStarOn_174yx_757{color:var(--field-range-fill,#34c759)}._code_174yx_762>div,._code_174yx_762 ._codeInner_174yx_763{width:100%;min-height:var(--field-height);align-items:center;gap:8px;line-height:normal;display:flex;overflow:visible}._codeInner_174yx_763{flex:1;min-width:0}._codeCell_174yx_778{box-sizing:border-box;width:36px;height:calc(var(--field-height) - 12px);border:var(--field-border);border-radius:calc(var(--field-radius) - 2px);background:var(--field-background-focus,#0000000a);min-height:32px;color:inherit;font:inherit;font-variant-numeric:tabular-nums;text-align:center;outline:none;padding:0}._codeCell_174yx_778:focus{border-color:var(--field-border-focus,var(--field-border));box-shadow:0 0 0 3px var(--field-focus-ring,#0000)}._codeCell_174yx_778:disabled{opacity:.6;cursor:not-allowed}._file_174yx_803>div,._file_174yx_803 ._fileInner_174yx_804{width:100%;min-height:var(--field-height);align-items:center;gap:10px;line-height:normal;display:flex;overflow:visible}._fileInner_174yx_804{flex:1;min-width:0;position:relative}._fileInput_174yx_820{opacity:0;pointer-events:none;width:1px;height:1px;position:absolute}._fileButton_174yx_828{background:var(--field-background-focus,#0000000f);color:inherit;font:inherit;cursor:pointer;white-space:nowrap;border:0;border-radius:8px;flex:none;padding:6px 10px;font-size:13px}._fileButton_174yx_828:disabled{cursor:not-allowed;opacity:.6}._fileList_174yx_845{flex-direction:column;flex:1;gap:2px;min-width:0;display:flex;overflow:hidden}._fileEmpty_174yx_854{color:var(--field-placeholder);font-size:13px}._fileItem_174yx_859{align-items:baseline;gap:8px;min-width:0;display:flex}._fileName_174yx_866{text-overflow:ellipsis;white-space:nowrap;font-size:13px;overflow:hidden}._fileSize_174yx_873{color:var(--field-placeholder);flex:none;font-size:12px}._fileClear_174yx_879{color:inherit;cursor:pointer;opacity:.65;background:0 0;border:0;flex:none;padding:0 2px;font-size:18px;line-height:1}._fileClear_174yx_879:hover{opacity:1}._rich_174yx_895{align-items:stretch}._rich_174yx_895>div{min-height:var(--field-note-height);line-height:var(--field-note-line-height);flex-direction:column;align-items:flex-start;padding:0;display:flex;overflow:visible}._richWrap_174yx_908{flex-direction:column;align-items:flex-start;width:100%;min-width:0;display:flex}._richToolbar_174yx_916{box-sizing:border-box;border-bottom:1px solid #00000014;flex-wrap:nowrap;justify-content:flex-start;align-items:center;gap:2px;width:100%;max-width:100%;margin:0;padding:4px 0 6px;display:inline-flex}._richBtn_174yx_930{box-sizing:border-box;width:28px;min-width:28px;height:28px;color:inherit;font:inherit;cursor:pointer;background:0 0;border:0;border-radius:6px;flex:none;justify-content:center;align-items:center;margin:0;padding:0;font-size:13px;font-weight:600;line-height:1;display:inline-flex}._richBtn_174yx_930:hover:not(:disabled){background:var(--field-background-focus,#0000000f)}._richBtn_174yx_930:disabled{opacity:.5;cursor:not-allowed}._richEditor_174yx_959{box-sizing:border-box;width:100%;min-height:calc(var(--field-note-height) - 36px);padding:var(--field-note-padding,8px) 0;overflow-wrap:anywhere;line-height:var(--field-note-line-height);scrollbar-width:none;-ms-overflow-style:none;outline:none;overflow:hidden auto}._richEditor_174yx_959::-webkit-scrollbar{background:0 0;width:0;height:0;display:none}._richEditor_174yx_959:empty:before{content:attr(placeholder);color:var(--field-placeholder);pointer-events:none}._richEditor_174yx_959 ul,._richEditor_174yx_959 ol{margin:.25em 0;padding-left:1.25em}._dragDrop_174yx_990{align-items:stretch;overflow:visible;box-shadow:none!important;background:0 0!important;border:0!important;padding:0!important}._dragDrop_174yx_990>div{min-height:auto;padding:0;line-height:normal;display:block;overflow:visible}._dragDrop_174yx_990[data-dragging=true]{background:0 0!important}._dragDropInner_174yx_1009{flex-direction:column;gap:16px;width:100%;min-width:0;display:flex;position:relative}._dragDropZone_174yx_1018{box-sizing:border-box;border-radius:calc(var(--field-radius) - 2px);width:100%;min-height:88px;color:inherit;font:inherit;text-align:center;cursor:pointer;background:0 0;border:2px dashed #c7c7cc;outline:none;flex-direction:column;justify-content:center;align-items:center;gap:6px;margin:0;padding:18px 14px;transition:border-color .16s,background-color .16s,border-style .16s;display:flex}._dragDropZone_174yx_1018:hover:not(:disabled){background:var(--field-background-focus,#00000008);border-color:#8e8e93}._dragDropZone_174yx_1018[data-dragging=true]{border-color:var(--field-range-fill,#34c759);background:color-mix(in srgb, var(--field-range-fill,#34c759) 10%, transparent);border-style:solid}._dragDropZone_174yx_1018:focus-visible{box-shadow:0 0 0 3px var(--field-focus-ring,#0000)}._dragDropZone_174yx_1018:disabled{cursor:not-allowed;opacity:.65}._dragDropHint_174yx_1056{font-size:var(--control-font-size,14px);color:inherit;line-height:1.35}._dragDropAccept_174yx_1062{color:var(--field-placeholder);letter-spacing:.01em;font-size:12px}._dragDropList_174yx_1068{flex-direction:column;gap:6px;margin:4px 0 0;padding:0;list-style:none;display:flex}._dragDropItem_174yx_1077{background:var(--field-background-focus,#0000000a);border-radius:10px;align-items:center;gap:10px;min-width:0;padding:8px 10px;display:flex}._dragDropMeta_174yx_1087{flex-direction:column;flex:1;gap:2px;min-width:0;display:flex}._dragDropName_174yx_1095{text-overflow:ellipsis;white-space:nowrap;font-size:var(--control-font-size,14px);color:inherit;line-height:1.3;overflow:hidden}._dragDropSize_174yx_1104{color:var(--field-placeholder);font-size:12px;line-height:1.2}._dragDropRemove_174yx_1110{width:28px;height:28px;color:var(--field-placeholder);cursor:pointer;background:0 0;border:0;border-radius:8px;flex:none;justify-content:center;align-items:center;padding:0;font-size:18px;line-height:1;display:inline-flex}._dragDropRemove_174yx_1110:hover{color:var(--field-error-color,#d70015);background:color-mix(in srgb, var(--field-error-color,#d70015) 10%, transparent)}._dragDropClearAll_174yx_1131{color:var(--field-placeholder);font:inherit;cursor:pointer;background:0 0;border:0;align-self:flex-start;margin-top:2px;padding:2px 0;font-size:12px}._dragDropClearAll_174yx_1131:hover{color:var(--field-error-color,#d70015)}\n\n._o_1l419_2{z-index:var(--elcrm-z-popover,1000);background:0 0;position:fixed;inset:0}._c_1l419_13{background:var(--select-background);z-index:var(--elcrm-z-popover-front,1001);scrollbar-width:none;-ms-overflow-style:none;border-radius:10px;max-height:min(92vh,480px);margin:0;padding:10px 12px 12px;display:block;position:fixed;overflow:hidden auto;box-shadow:5px 7px 18px #000000a8}._c_1l419_13::-webkit-scrollbar{background:0 0;width:0;height:0;display:none}._c_1l419_13::-webkit-scrollbar:vertical{width:0;display:none}._c_1l419_13::-webkit-scrollbar:horizontal{height:0;display:none}._c_1l419_13{color:var(--select-color,#333);box-sizing:border-box;min-width:259px}._c_1l419_13 [grid-calendar]{grid-template-columns:repeat(7,1fr);grid-auto-rows:34px;gap:2px;display:grid}._c_1l419_13 [grid-calendar]>p{color:var(--color-placeholder);box-sizing:border-box;justify-content:center;align-items:center;margin:0;padding:0;font-size:.75rem;font-weight:500;line-height:1;display:flex}._c_1l419_13 [grid-month]{grid-template-columns:1fr 1fr 1fr 1fr;width:250px;display:grid}._c_1l419_13 b{cursor:pointer;text-align:center;border-radius:5px;padding:8px 5px;font-weight:400;display:block}._c_1l419_13 b.__active_1l419_82{background:var(--bg-select-active)}._c_1l419_13 b:hover{background:var(--bg-select-hover)}._c_1l419_13 p{color:var(--color-placeholder);text-align:center;cursor:default;pointer-events:none;padding:0}._c_1l419_13 i{text-align:center;cursor:pointer;border-radius:5px;flex:0 30px;padding:9px}._c_1l419_13 i:hover{background:var(--bg-select-hover)}._c_1l419_13 i:before{cursor:pointer;display:block}._c_1l419_13 s{align-items:center;gap:4px;padding-bottom:6px;font-style:normal;text-decoration:none;display:flex}._c_1l419_13 s h2{text-align:center;min-width:0;color:var(--select-color,#333);cursor:default;flex-wrap:nowrap;flex:auto;justify-content:center;align-items:center;gap:8px;margin:0;padding:0;font-size:16px;font-weight:400;line-height:1.25;display:flex}._c_1l419_13 ._dateHeaderMonth_1l419_137,._c_1l419_13 ._dateHeaderYear_1l419_137{cursor:pointer;-webkit-user-select:none;user-select:none;white-space:nowrap;border-radius:6px;padding:2px 8px}._c_1l419_13 ._dateHeaderMonth_1l419_137:hover,._c_1l419_13 ._dateHeaderYear_1l419_137:hover{background:var(--bg-select-hover)}._c_1l419_13 ._dateHeaderDisabled_1l419_147{cursor:not-allowed;opacity:.45;pointer-events:none}._c_1l419_13 ._dateHeaderDisabled_1l419_147[data-active=true],._c_1l419_13 ._dateHeaderDisabled_1l419_147[data-current=true]{opacity:.45}._c_1l419_13 [grid-calendar] b[data-current=true],._c_1l419_13 [grid-month] b[data-current=true]{background:color-mix(in srgb, var(--field-background-active) 52%, transparent);font-weight:600}._c_1l419_13 [grid-calendar] b[data-active=true]:not([data-current=true]),._c_1l419_13 [grid-month] b[data-active=true]:not([data-current=true]){outline:2px solid var(--field-background-active);outline-offset:-2px}._c_1l419_13 [grid-calendar] b[data-active=true][data-current=true],._c_1l419_13 [grid-month] b[data-active=true][data-current=true]{box-shadow:inset 0 0 0 2px var(--field-background-active)}._c_1l419_13 [grid-calendar] p[data-current=true]{background:color-mix(in srgb, var(--field-background-active) 52%, transparent);color:inherit;border-radius:5px;font-weight:600}._c_1l419_13 [grid-calendar] p[data-active=true]:not([data-current=true]){outline:2px solid var(--field-background-active);outline-offset:-2px;opacity:.85}._c_1l419_13 [grid-calendar] p[data-active=true][data-current=true]{box-shadow:inset 0 0 0 2px var(--field-background-active)}._c_1l419_13 span{text-align:center;padding:2px}._c_1l419_13 span p{color:var(--color-placeholder);padding:8px 5px}._c_1l419_13 [grid-calendar]>span{box-sizing:border-box;justify-content:stretch;align-items:stretch;min-height:0;padding:0;display:flex}._c_1l419_13 [grid-calendar]>span>b,._c_1l419_13 [grid-calendar]>span>p{box-sizing:border-box;border-radius:5px;flex:auto;justify-content:center;align-items:center;width:100%;min-height:0;margin:0;padding:0;display:flex}._c_1l419_13 ._as_1l419_214{cursor:ns-resize}._c_1l419_13 ._ap_1l419_217{cursor:pointer}[field=password] dd{white-space:nowrap;font-style:unset;-webkit-text-security:disc;-webkit-user-select:text;user-select:text}[field=password][show] dd,[field=password] dd:before{-webkit-text-security:none}[field=code] div{gap:8px;display:flex}[field=select] dd{cursor:pointer}[field] dd:before{pointer-events:none}[field=check] dd{cursor:pointer;max-width:35px;padding:0}[field=check] [active]:after{content:\"\";background:#394264;border-radius:5px;width:15px;height:15px;display:block}[field=file] input{display:none}[field=file] dd{aspect-ratio:16/9;cursor:pointer;position:relative}[field=file] img{aspect-ratio:16/9;object-fit:contain;cursor:pointer;width:-webkit-fill-available;display:block}[field=file] label{aspect-ratio:16/9;object-fit:contain;cursor:pointer;width:-webkit-fill-available;display:block;position:absolute}[field=color] dd{border:0;gap:3px;padding:0;display:flex}[field=color] dd s{cursor:pointer;opacity:.6;border:1px solid #dde2e4;border-radius:6px;flex:1}[field=color] dd s:hover{opacity:.9}[field=color] dd s[active=true]{opacity:1}\n\n:root{--select-overlay:transparent;--select-height:52px;--select-separator:1px solid #c6c6c8;--select-color:#000;--select-background:#fff;--select-li-hover-bg:#f2f2f7;--select-li-focus-bg:#e5e5ea;--select-li-selected-bg:#e5e5ea;--select-icon:calc(var(--select-height) / 1.5);--select-icon-padding:calc((var(--select-height) - var(--select-icon)) / 2);--select-font-size:17px}._o_hv4hf_20{z-index:var(--elcrm-z-popover,1000);background:var(--select-overlay);position:fixed;inset:0}._l_hv4hf_30{background:var(--select-background);z-index:var(--elcrm-z-popover-front,1001);scrollbar-width:none;-ms-overflow-style:none;border-radius:20px;max-height:300px;margin:0;padding:0;display:block;position:fixed;overflow:hidden auto}._l_hv4hf_30::-webkit-scrollbar{background:0 0;width:0;height:0;display:none}._l_hv4hf_30::-webkit-scrollbar:vertical{width:0;display:none}._l_hv4hf_30::-webkit-scrollbar:horizontal{height:0;display:none}._l_hv4hf_30 ul{scrollbar-width:none;-ms-overflow-style:none;width:100%;max-height:300px;margin:0;padding:0;list-style:none;display:block;overflow:hidden auto}._l_hv4hf_30 ul::-webkit-scrollbar{background:0 0;width:0;height:0;display:none}._l_hv4hf_30 ul::-webkit-scrollbar:vertical{width:0;display:none}._l_hv4hf_30 ul::-webkit-scrollbar:horizontal{height:0;display:none}._l_hv4hf_30 li{border-bottom:var(--select-separator);cursor:pointer;color:var(--select-color);height:var(--select-height);line-height:var(--select-height);font-size:var(--select-font-size);white-space:nowrap;text-overflow:ellipsis;opacity:1;margin:0;padding:0 14px;display:block;overflow:hidden;text-align:left!important;border-left:0!important}._l_hv4hf_30 li[aria-selected=true]{background:var(--select-li-selected-bg,var(--select-li-hover-bg))}._l_hv4hf_30 li:hover{background:var(--select-li-hover-bg,#f2f2f7)}._l_hv4hf_30 li[data-focus=true]{background:var(--select-li-focus-bg,#e5e5ea)}._l_hv4hf_30 li:last-child{border-bottom:0}._i_hv4hf_123{width:var(--select-icon);height:var(--select-icon);color:var(--field-color);right:var(--select-icon-padding);top:var(--select-icon-padding);position:absolute}._placeholderValue_hv4hf_133{color:var(--field-placeholder);font-weight:400}._f_hv4hf_138{cursor:pointer}._f_hv4hf_138[aria-disabled=true]{cursor:not-allowed}\n\n:root{--color-picker-width:260px;--color-picker-radius:16px;--color-picker-pad:10px;--color-picker-swatch:20px;--color-picker-input-radius:5px;--color-picker-handle:14px}._o_1i8zo_14{z-index:var(--elcrm-z-popover,1000);background:var(--select-overlay,transparent);position:fixed;inset:0}._panel_1i8zo_21{z-index:var(--elcrm-z-popover-front,1001);box-sizing:border-box;width:var(--color-picker-width);padding:var(--color-picker-pad);background:var(--select-background,#2c2c2e);color:var(--select-color,#fff);border-radius:var(--color-picker-radius);flex-direction:column;gap:8px;display:flex;position:fixed;box-shadow:0 8px 28px #00000059}._sv_1i8zo_37{aspect-ratio:1/.55;cursor:crosshair;touch-action:none;border-radius:8px;width:100%;max-height:140px;position:relative;overflow:hidden}._svWhite_1i8zo_48{background:linear-gradient(90deg,#fff,#0000);position:absolute;inset:0}._svBlack_1i8zo_54{background:linear-gradient(#0000,#000);position:absolute;inset:0}._handle_1i8zo_60{width:var(--color-picker-handle);height:var(--color-picker-handle);margin:calc(var(--color-picker-handle) / -2) 0 0 calc(var(--color-picker-handle) / -2);pointer-events:none;box-sizing:border-box;border:2px solid #fff;border-radius:50%;position:absolute;box-shadow:0 0 0 1px #00000059}._slidersRow_1i8zo_72{align-items:center;gap:8px;display:flex}._eyedropper_1i8zo_78{border-radius:var(--color-picker-input-radius);background:var(--field-background,#1c1c1e);width:26px;height:26px;color:var(--field-icon-color,#8e8e93);cursor:pointer;border:none;flex:none;justify-content:center;align-items:center;padding:0;display:inline-flex}._eyedropper_1i8zo_78:hover{color:var(--field-color,#fff)}._sliders_1i8zo_72{flex-direction:column;flex:1;gap:8px;min-width:0;display:flex}._slider_1i8zo_72{cursor:pointer;touch-action:none;border-radius:999px;height:10px;position:relative}._sliderHue_1i8zo_113{background:linear-gradient(90deg,red 0%,#ff0 17%,#0f0 33%,#0ff 50%,#00f 67%,#f0f 83%,red 100%)}._sliderAlpha_1i8zo_117{background-image:linear-gradient(to right, transparent, var(--alpha-color,#fff)), linear-gradient(45deg, #777 25%, transparent 25%), linear-gradient(-45deg, #777 25%, transparent 25%), linear-gradient(45deg, transparent 75%, #777 75%), linear-gradient(-45deg, transparent 75%, #777 75%);background-color:#bbb;background-position:0 0,0 0,0 4px,4px -4px,-4px 0;background-size:100% 100%,8px 8px,8px 8px,8px 8px,8px 8px}._sliderHandle_1i8zo_125{width:var(--color-picker-handle);height:var(--color-picker-handle);margin:calc(var(--color-picker-handle) / -2) 0 0 calc(var(--color-picker-handle) / -2);pointer-events:none;box-sizing:border-box;background:0 0;border:2px solid #fff;border-radius:50%;position:absolute;top:50%;box-shadow:0 0 0 1px #00000059}._inputs_1i8zo_139{align-items:center;gap:6px;display:flex}._format_1i8zo_145{color:var(--field-placeholder,#8e8e93);flex:none;padding:0 2px;font-size:12px}._input_1i8zo_139{box-sizing:border-box;border-radius:var(--color-picker-input-radius);background:var(--field-background,#1c1c1e);min-width:0;height:28px;color:var(--field-color,#fff);font:inherit;border:none;outline:none;flex:1;padding:0 8px;font-size:13px}._input_1i8zo_139:focus{box-shadow:0 0 0 2px var(--field-focus-ring,#fff3)}._inputAlpha_1i8zo_171{text-align:center;flex:0 0 56px}._palette_1i8zo_176{grid-template-columns:repeat(8,1fr);place-items:center;gap:4px;padding:0;display:grid}._swatchBtn_1i8zo_185{width:var(--color-picker-swatch);height:var(--color-picker-swatch);cursor:pointer;background:var(--swatch,#888);border:none;border-radius:50%;padding:0;transition:transform .12s;box-shadow:inset 0 0 0 1px #0000001f}._swatchBtn_1i8zo_185[aria-checked=true]{z-index:1;box-shadow:inset 0 0 0 1px #00000026, 0 0 0 2px var(--select-background,#2c2c2e), 0 0 0 3px #ffffff59;transform:scale(1.35)}._swatchBtn_1i8zo_185:disabled{cursor:not-allowed;opacity:.5}._trigger_1i8zo_210{cursor:pointer;align-items:center;gap:var(--field-icon-gap,10px);min-width:0;height:var(--field-height,44px);flex:1;display:flex}._trigger_1i8zo_210[aria-disabled=true]{cursor:not-allowed}._preview_1i8zo_224{background-color:var(--preview-color,transparent);background-image:linear-gradient(var(--preview-color,transparent), var(--preview-color,transparent)), linear-gradient(45deg, #c6c6c8 25%, transparent 25%), linear-gradient(-45deg, #c6c6c8 25%, transparent 25%), linear-gradient(45deg, transparent 75%, #c6c6c8 75%), linear-gradient(-45deg, transparent 75%, #c6c6c8 75%);background-position:0 0,0 0,0 3px,3px -3px,-3px 0;background-size:100% 100%,6px 6px,6px 6px,6px 6px,6px 6px;border-radius:50%;flex:none;width:22px;height:22px;box-shadow:inset 0 0 0 1px #00000026}._hexText_1i8zo_237{text-overflow:ellipsis;white-space:nowrap;min-width:0;font-size:var(--control-font-size,17px);flex:1;overflow:hidden}._placeholder_1i8zo_246{color:var(--field-placeholder,#8e8e93);font-weight:400}\n";
8
+ el.textContent = "._l_2ps0c_4{min-width:var(--field-width);gap:var(--field-block-gap,0);flex-direction:column;margin:0;padding:0;display:flex;position:relative}._l_2ps0c_4[data-size=sm]{--field-height:32px;--control-height:32px;--field-side-padding:10px;--control-side-padding:10px;--control-inner-padding:0 10px;font-size:13px}._l_2ps0c_4>._t_2ps0c_22,._l_2ps0c_4>._f_2ps0c_22,._l_2ps0c_4>._m_2ps0c_22{margin:0}._l_2ps0c_4[data-field=group] ._f_2ps0c_22>div{cursor:pointer;border-bottom:var(--field-border);padding:var(--field-padding);margin:0}._l_2ps0c_4[data-field=group] ._f_2ps0c_22>div:last-child{border-bottom:0}._l_2ps0c_4 [placeholder]:empty:before{content:attr(placeholder);color:var(--field-placeholder);opacity:1;pointer-events:none;font-style:normal;font-weight:400;display:block}._l_2ps0c_4 [placeholder]:focus:before{display:none}._f_2ps0c_22{box-sizing:border-box;align-items:center;gap:var(--field-icon-gap,10px);border:var(--field-border);border-radius:var(--field-radius);background:var(--field-background);color:var(--field-color);padding:var(--control-inner-padding,0 var(--field-side-padding,14px));transition:border-color .16s,box-shadow .16s,background-color .16s,opacity .16s;display:flex;overflow:hidden}._f_2ps0c_22:hover{border-color:var(--field-border-hover,var(--field-border))}._f_2ps0c_22:focus-within{border-color:var(--field-border-focus,var(--field-border));box-shadow:var(--field-focus-shadow,0 0 0 3px var(--field-focus-ring,#0000));background:var(--field-background-focus,var(--field-background))}._f_2ps0c_22._e_2ps0c_78:focus-within{background:var(--field-error-background);color:var(--field-error-color)}._f_2ps0c_22[data-disabled=true]{background:var(--field-background-disabled,var(--field-background));border-color:var(--field-border-disabled,var(--field-border));color:var(--field-color-disabled,var(--field-placeholder));cursor:not-allowed;opacity:.85}._f_2ps0c_22[data-disabled=true]>*{cursor:not-allowed}._f_2ps0c_22>div{min-height:var(--field-height);line-height:calc(var(--field-height) - 2px);font-size:var(--control-font-size,14px);text-wrap:pretty;outline:0;flex:1;margin:0;padding:0}._f_2ps0c_22>div::selection{background:var(--field-selection-bg,#b3d4fc);color:var(--field-selection-color,inherit)}._f_2ps0c_22>:not(div){box-sizing:border-box;height:var(--field-height);min-height:var(--field-height);max-height:var(--field-height);color:var(--field-icon-color,var(--field-placeholder));flex:none;justify-content:center;align-self:center;align-items:center;display:inline-flex}._f_2ps0c_22>:not(div) svg{width:var(--field-icon-size,20px);height:var(--field-icon-size,20px);flex-shrink:0;display:block}._f_2ps0c_22 input::placeholder,._f_2ps0c_22 textarea::placeholder{color:var(--field-placeholder);opacity:1;font-weight:400}._f_2ps0c_22 input::-webkit-input-placeholder{color:var(--field-placeholder);opacity:1;font-weight:400}._f_2ps0c_22 textarea::-webkit-input-placeholder{color:var(--field-placeholder);opacity:1;font-weight:400}._f_2ps0c_22 input::-moz-placeholder{color:var(--field-placeholder);opacity:1;font-weight:400}._f_2ps0c_22 textarea::-moz-placeholder{color:var(--field-placeholder);opacity:1;font-weight:400}._f_2ps0c_22 input:-webkit-autofill{caret-color:var(--field-color);-webkit-text-fill-color:var(--field-color)!important;color:var(--field-color)!important;-webkit-box-shadow:none!important;box-shadow:none!important;font-size:inherit!important;line-height:inherit!important;background-color:#0000!important;background-image:none!important;transition:background-color 99999s ease-out,background-image 99999s ease-out!important}._f_2ps0c_22 input:-webkit-autofill:hover{caret-color:var(--field-color);-webkit-text-fill-color:var(--field-color)!important;color:var(--field-color)!important;-webkit-box-shadow:none!important;box-shadow:none!important;font-size:inherit!important;line-height:inherit!important;background-color:#0000!important;background-image:none!important;transition:background-color 99999s ease-out,background-image 99999s ease-out!important}._f_2ps0c_22 input:-webkit-autofill:focus{caret-color:var(--field-color);-webkit-text-fill-color:var(--field-color)!important;color:var(--field-color)!important;-webkit-box-shadow:none!important;box-shadow:none!important;font-size:inherit!important;line-height:inherit!important;background-color:#0000!important;background-image:none!important;transition:background-color 99999s ease-out,background-image 99999s ease-out!important}._f_2ps0c_22 input:-webkit-autofill:active{caret-color:var(--field-color);-webkit-text-fill-color:var(--field-color)!important;color:var(--field-color)!important;-webkit-box-shadow:none!important;box-shadow:none!important;font-size:inherit!important;line-height:inherit!important;background-color:#0000!important;background-image:none!important;transition:background-color 99999s ease-out,background-image 99999s ease-out!important}._f_2ps0c_22 input:-webkit-autofill{-webkit-background-clip:text!important;background-clip:text!important}._f_2ps0c_22 [contenteditable=true],._f_2ps0c_22 [contenteditable=plaintext-only],._f_2ps0c_22>div{scrollbar-width:none;-ms-overflow-style:none}._f_2ps0c_22 [contenteditable=true]::-webkit-scrollbar{background:0 0;width:0;height:0;display:none}._f_2ps0c_22 [contenteditable=plaintext-only]::-webkit-scrollbar{background:0 0;width:0;height:0;display:none}._f_2ps0c_22>div::-webkit-scrollbar{background:0 0;width:0;height:0;display:none}._n_2ps0c_199>div{min-height:var(--field-note-height);line-height:var(--field-note-line-height);padding-top:var(--field-note-padding,var(--field-note-padding-top,8px));padding-bottom:var(--field-note-padding,var(--field-note-padding-top,8px));scrollbar-width:none;-ms-overflow-style:none;overflow:hidden auto}._n_2ps0c_199>div::-webkit-scrollbar{background:0 0;width:0;height:0;display:none}._w_2ps0c_216>div{box-sizing:border-box;height:var(--field-height);min-height:var(--field-height);max-height:var(--field-height);text-wrap:nowrap;scrollbar-width:none;-ms-overflow-style:none;overflow:auto hidden}._w_2ps0c_216>div::-webkit-scrollbar{background:0 0;width:0;height:0;display:none}._w_2ps0c_216>div input{box-sizing:border-box;height:100%;min-height:0;max-height:100%;line-height:normal}._time_2ps0c_243>div{text-wrap:nowrap;align-items:center;min-width:0;display:flex;overflow:visible}._time_2ps0c_243 ._timeInner_2ps0c_250{justify-content:flex-start;align-items:center;gap:4px;width:100%;min-width:0;display:flex}._time_2ps0c_243._timeAlignCenter_2ps0c_261 ._timeInner_2ps0c_250{justify-content:center}._time_2ps0c_243 ._timeSep_2ps0c_264{opacity:.65;-webkit-user-select:none;user-select:none;flex:none;padding:0 2px;font-weight:500;transform:translateY(-1px)}._time_2ps0c_243 ._timePickerBtn_2ps0c_272{color:var(--field-icon-color,var(--field-placeholder));cursor:pointer;background:0 0;border:0;outline:none;flex:none;justify-content:center;align-items:center;margin:0;padding:0;line-height:0;display:inline-flex}._time_2ps0c_243 ._timePickerBtn_2ps0c_272:hover:not(:disabled){color:var(--field-color)}._time_2ps0c_243 ._timePickerBtn_2ps0c_272:focus-visible{box-shadow:var(--field-focus-shadow,0 0 0 3px var(--field-focus-ring,#0000));border-radius:6px}._time_2ps0c_243 ._timePickerBtn_2ps0c_272:disabled{cursor:not-allowed;opacity:.5}._time_2ps0c_243 ._timePart_2ps0c_300{box-sizing:border-box;width:2.25ch;min-width:2.25ch;color:inherit;font:inherit;font-variant-numeric:tabular-nums;line-height:inherit;text-align:center;min-height:var(--field-height);cursor:text;scrollbar-width:none;-ms-overflow-style:none;background:0 0;border:0;border-radius:6px;outline:none;flex:none;margin:0;padding:0;overflow:hidden}._time_2ps0c_243 ._timePart_2ps0c_300::-webkit-scrollbar{background:0 0;width:0;height:0;display:none}._time_2ps0c_243 ._timePart_2ps0c_300[contenteditable=false]{cursor:not-allowed;opacity:.7}._time_2ps0c_243 ._timePart_2ps0c_300:empty:before{content:attr(placeholder);color:var(--field-placeholder);opacity:1;font-weight:400}._time_2ps0c_243 ._timePart_2ps0c_300:focus:empty:before{content:none}._time_2ps0c_243 ._timePart_2ps0c_300:focus-visible{background:0 0}._time_2ps0c_243._timeAlignCenter_2ps0c_261 ._timePart_2ps0c_300{text-align:center}._t_2ps0c_22{color:var(--field-label-color);font-size:var(--field-label-size);padding-bottom:var(--field-label-gap,10px);cursor:default;display:block}._nativeWrap_2ps0c_361{flex:1;align-items:center;min-width:0;display:flex}._nativeInput_2ps0c_368{box-sizing:border-box;width:100%;font:inherit;color:inherit;background:0 0;border:none;outline:none;margin:0;padding:0}._nativeInput_2ps0c_368:-webkit-autofill{caret-color:var(--field-color);-webkit-text-fill-color:var(--field-color)!important;color:var(--field-color)!important;-webkit-box-shadow:none!important;box-shadow:none!important;background-color:#0000!important;background-image:none!important;-webkit-background-clip:text!important;background-clip:text!important;transition:background-color 99999s ease-out,background-image 99999s ease-out!important}._nativeInput_2ps0c_368:-webkit-autofill:hover{caret-color:var(--field-color);-webkit-text-fill-color:var(--field-color)!important;color:var(--field-color)!important;-webkit-box-shadow:none!important;box-shadow:none!important;background-color:#0000!important;background-image:none!important;-webkit-background-clip:text!important;background-clip:text!important;transition:background-color 99999s ease-out,background-image 99999s ease-out!important}._nativeInput_2ps0c_368:-webkit-autofill:focus{caret-color:var(--field-color);-webkit-text-fill-color:var(--field-color)!important;color:var(--field-color)!important;-webkit-box-shadow:none!important;box-shadow:none!important;background-color:#0000!important;background-image:none!important;-webkit-background-clip:text!important;background-clip:text!important;transition:background-color 99999s ease-out,background-image 99999s ease-out!important}._nativeInput_2ps0c_368:-webkit-autofill:active{caret-color:var(--field-color);-webkit-text-fill-color:var(--field-color)!important;color:var(--field-color)!important;-webkit-box-shadow:none!important;box-shadow:none!important;background-color:#0000!important;background-image:none!important;-webkit-background-clip:text!important;background-clip:text!important;transition:background-color 99999s ease-out,background-image 99999s ease-out!important}._affix_2ps0c_393{box-sizing:border-box;height:var(--field-height);min-height:var(--field-height);max-height:var(--field-height);color:var(--field-icon-color,var(--field-placeholder));font-size:inherit;-webkit-user-select:none;user-select:none;cursor:pointer;background:0 0;border:0;flex:none;justify-content:center;align-self:center;align-items:center;margin:0;padding:0;line-height:1;display:inline-flex}._affix_2ps0c_393:disabled{cursor:not-allowed;opacity:.6}._affix_2ps0c_393 svg{width:var(--field-icon-size,20px);height:var(--field-icon-size,20px);flex-shrink:0;display:block}._g_2ps0c_426{flex-direction:column}._range_2ps0c_430>div{box-sizing:border-box;min-width:0;min-height:var(--field-height);flex:1;align-items:center;line-height:normal;display:flex}._range_2ps0c_430 ._rangeTrack_2ps0c_439{box-sizing:border-box;width:100%;height:var(--field-range-bar-height,14px);background:var(--field-range-track,#e0e0e0);cursor:pointer;touch-action:none;border-radius:999px;outline:none;flex-shrink:0;position:relative;overflow:hidden}._range_2ps0c_430 ._rangeTrack_2ps0c_439:focus-visible{box-shadow:var(--field-focus-shadow,0 0 0 3px var(--field-focus-ring,#0000))}._range_2ps0c_430 ._rangeTrack_2ps0c_439[data-disabled=true]{cursor:not-allowed;opacity:.55;pointer-events:none}._range_2ps0c_430 ._rangeFill_2ps0c_460{background:var(--field-range-fill,#00b5ad);pointer-events:none;border-radius:999px 0 0 999px;width:0;min-width:0;height:100%}._range_2ps0c_430 ._rangeFillFull_2ps0c_471{border-radius:999px}._checkbox_2ps0c_475>div{min-height:var(--field-height);align-items:flex-start;width:100%;padding:0;line-height:normal;display:flex}._checkbox_2ps0c_475[data-variant=plain]{border-radius:0;overflow:visible;box-shadow:none!important;background:0 0!important;border:none!important;min-height:0!important;padding:0!important}._checkbox_2ps0c_475[data-variant=plain]:hover,._checkbox_2ps0c_475[data-variant=plain]:focus-within{box-shadow:none!important;background:0 0!important;border:none!important}._checkbox_2ps0c_475[data-size=sm]>div{align-items:center;min-height:0}._checkPlainBlok_2ps0c_502{width:100%;min-width:0}._checkControl_2ps0c_507{width:100%;min-height:var(--field-height);color:inherit;font:inherit;text-align:left;cursor:pointer;background:0 0;border:0;outline:none;align-items:flex-start;gap:12px;margin:0;padding:10px 0;display:flex}._checkControl_2ps0c_507:focus-visible{box-shadow:var(--field-focus-shadow,0 0 0 3px var(--field-focus-ring,#0000));border-radius:calc(var(--field-radius) - 2px)}._checkControl_2ps0c_507[data-focus-ring=false]:focus-visible{box-shadow:none}._checkControl_2ps0c_507[aria-disabled=true]{cursor:not-allowed}._checkControl_2ps0c_507[data-size=sm]{border-radius:8px;align-items:center;gap:10px;min-height:0;padding:7px 8px}._checkControl_2ps0c_507[data-size=sm] ._checkBox_2ps0c_540{border-radius:5px;width:18px;height:18px}._checkControl_2ps0c_507[data-size=sm] ._checkMark_2ps0c_545{width:9px;height:5px}._checkControl_2ps0c_507[data-size=sm] ._checkText_2ps0c_549{padding-top:0;font-size:13px;line-height:1.2}._checkControl_2ps0c_507[data-size=sm][data-variant=plain]:hover:not([aria-disabled=true]){background:var(--field-background-focus,#ffffff0f)}._checkBox_2ps0c_540{width:var(--field-check-size,22px);height:var(--field-check-size,22px);border:var(--field-check-box-border,var(--field-border));background:0 0;border-radius:8px;flex:none;justify-content:center;align-items:center;transition:background-color .16s,border-color .16s,opacity .16s;display:inline-flex}._checkMark_2ps0c_545{border-top:none;border-bottom:2px solid #fcfff4;border-left:2px solid #fcfff4;border-right:none;width:11px;height:6px;transform:translateY(-1px)rotate(-45deg)}._checkText_2ps0c_549{min-width:0;color:inherit;font-size:var(--control-font-size,14px);flex:auto;padding-top:2px;line-height:1.25}._checkControl_2ps0c_507[aria-checked=true] ._checkBox_2ps0c_540{background:var(--field-background-active)}._e_2ps0c_78{border-color:var(--field-error-border);background:var(--field-error-background);color:var(--field-error-color)}._m_2ps0c_22{color:var(--field-error-color);font-size:var(--field-error-size,12px);margin-top:var(--field-error-gap,6px);font-style:normal}._display_2ps0c_607>div{color:inherit;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}._displayEmpty_2ps0c_614{color:var(--field-placeholder)}._radio_2ps0c_619>div{width:100%;min-height:var(--field-height);flex-direction:column;align-items:stretch;gap:4px;padding:6px 0;line-height:normal;display:flex}._radioInline_2ps0c_630>div{flex-flow:wrap;align-items:center;gap:8px 16px}._radioItem_2ps0c_637{color:inherit;font:inherit;text-align:left;cursor:pointer;background:0 0;border:0;outline:none;align-items:center;gap:10px;margin:0;padding:4px 0;display:inline-flex}._radioItem_2ps0c_637:focus-visible{box-shadow:var(--field-focus-shadow,0 0 0 3px var(--field-focus-ring,#0000));border-radius:6px}._radioItem_2ps0c_637[aria-disabled=true]{cursor:not-allowed;opacity:.7}._radioDot_2ps0c_660{width:var(--field-radio-size,20px);height:var(--field-radio-size,20px);border:var(--field-check-box-border,var(--field-border));border-radius:50%;flex:none;justify-content:center;align-items:center;display:inline-flex}._radioDotFill_2ps0c_671{background:var(--field-background-active);border-radius:50%;width:10px;height:10px}._radioText_2ps0c_678{font-size:var(--control-font-size,14px);line-height:1.25}._tags_2ps0c_684>div,._tags_2ps0c_684 ._tagsInner_2ps0c_685{width:100%;min-height:var(--field-height);flex-wrap:wrap;align-items:center;gap:4px;padding:0;line-height:normal;display:flex;overflow:visible}._tagsInner_2ps0c_685{flex:1;min-width:0}._tagChip_2ps0c_702{background:var(--field-background-focus,#0000000f);border-radius:999px;align-items:center;gap:2px;max-width:100%;padding:0 6px;line-height:1.35;display:inline-flex}._tagLabel_2ps0c_713{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}._tagRemove_2ps0c_719{color:inherit;cursor:pointer;opacity:.65;background:0 0;border:0;padding:0 2px;font-size:16px;line-height:1}._tagRemove_2ps0c_719:hover{opacity:1}._tagInput_2ps0c_733{min-width:80px;color:inherit;font:inherit;background:0 0;border:0;outline:none;flex:80px;margin:0;padding:0}._rating_2ps0c_746>div{width:100%;min-height:var(--field-height);outline:none;align-items:center;gap:2px;line-height:normal;display:flex}._ratingStar_2ps0c_756{color:var(--field-placeholder);cursor:pointer;font-size:var(--field-rating-size,22px);background:0 0;border:0;outline:none;padding:0 2px;line-height:1}._ratingStar_2ps0c_756:disabled{cursor:not-allowed;opacity:.6}._ratingStar_2ps0c_756:focus-visible{box-shadow:var(--field-focus-shadow,0 0 0 3px var(--field-focus-ring,#0000));border-radius:4px}._ratingStarOn_2ps0c_775{color:var(--field-range-fill,#34c759)}._code_2ps0c_780>div,._code_2ps0c_780 ._codeInner_2ps0c_781{width:100%;min-height:var(--field-height);align-items:center;gap:8px;line-height:normal;display:flex;overflow:visible}._codeInner_2ps0c_781{flex:1;min-width:0}._codeCell_2ps0c_796{box-sizing:border-box;width:var(--field-code-cell-size,36px);height:calc(var(--field-height) - 12px);border:var(--field-border);border-radius:calc(var(--field-radius) - 2px);background:var(--field-background-focus,#0000000a);min-height:32px;color:inherit;font:inherit;font-variant-numeric:tabular-nums;text-align:center;outline:none;padding:0}._codeCell_2ps0c_796:focus{border-color:var(--field-border-focus,var(--field-border));box-shadow:var(--field-focus-shadow,0 0 0 3px var(--field-focus-ring,#0000))}._codeCell_2ps0c_796:disabled{opacity:.6;cursor:not-allowed}._file_2ps0c_821>div,._file_2ps0c_821 ._fileInner_2ps0c_822{width:100%;min-height:var(--field-height);align-items:center;gap:10px;line-height:normal;display:flex;overflow:visible}._fileInner_2ps0c_822{flex:1;min-width:0;position:relative}._fileInput_2ps0c_838{opacity:0;pointer-events:none;width:1px;height:1px;position:absolute}._fileButton_2ps0c_846{background:var(--field-background-focus,#0000000f);color:inherit;font:inherit;cursor:pointer;white-space:nowrap;border:0;border-radius:8px;flex:none;padding:6px 10px;font-size:13px}._fileButton_2ps0c_846:disabled{cursor:not-allowed;opacity:.6}._fileList_2ps0c_863{flex-direction:column;flex:1;gap:2px;min-width:0;display:flex;overflow:hidden}._fileEmpty_2ps0c_872{color:var(--field-placeholder);font-size:13px}._fileItem_2ps0c_877{align-items:baseline;gap:8px;min-width:0;display:flex}._fileName_2ps0c_884{text-overflow:ellipsis;white-space:nowrap;font-size:13px;overflow:hidden}._fileSize_2ps0c_891{color:var(--field-placeholder);font-size:var(--field-error-size,12px);flex:none}._fileClear_2ps0c_897{color:inherit;cursor:pointer;opacity:.65;background:0 0;border:0;flex:none;padding:0 2px;font-size:18px;line-height:1}._fileClear_2ps0c_897:hover{opacity:1}._rich_2ps0c_913{align-items:stretch}._rich_2ps0c_913>div{min-height:var(--field-note-height);line-height:var(--field-note-line-height);flex-direction:column;align-items:flex-start;padding:0;display:flex;overflow:visible}._richWrap_2ps0c_926{flex-direction:column;align-items:flex-start;width:100%;min-width:0;display:flex}._richToolbar_2ps0c_934{box-sizing:border-box;border-bottom:1px solid #00000014;flex-wrap:nowrap;justify-content:flex-start;align-items:center;gap:2px;width:100%;max-width:100%;margin:0;padding:4px 0 6px;display:inline-flex}._richBtn_2ps0c_948{box-sizing:border-box;width:28px;min-width:28px;height:28px;color:inherit;font:inherit;cursor:pointer;background:0 0;border:0;border-radius:6px;flex:none;justify-content:center;align-items:center;margin:0;padding:0;font-size:13px;font-weight:600;line-height:1;display:inline-flex}._richBtn_2ps0c_948:hover:not(:disabled){background:var(--field-background-focus,#0000000f)}._richBtn_2ps0c_948:disabled{opacity:.5;cursor:not-allowed}._richEditor_2ps0c_977{box-sizing:border-box;width:100%;min-height:calc(var(--field-note-height) - 36px);padding:var(--field-note-padding,8px) 0;overflow-wrap:anywhere;line-height:var(--field-note-line-height);scrollbar-width:none;-ms-overflow-style:none;outline:none;overflow:hidden auto}._richEditor_2ps0c_977::-webkit-scrollbar{background:0 0;width:0;height:0;display:none}._richEditor_2ps0c_977:empty:before{content:attr(placeholder);color:var(--field-placeholder);pointer-events:none}._richEditor_2ps0c_977 ul,._richEditor_2ps0c_977 ol{margin:.25em 0;padding-left:1.25em}._dragDrop_2ps0c_1008{align-items:stretch;overflow:visible;box-shadow:none!important;background:0 0!important;border:0!important;padding:0!important}._dragDrop_2ps0c_1008>div{min-height:auto;padding:0;line-height:normal;display:block;overflow:visible}._dragDrop_2ps0c_1008[data-dragging=true]{background:0 0!important}._dragDropInner_2ps0c_1027{flex-direction:column;gap:16px;width:100%;min-width:0;display:flex;position:relative}._dragDropZone_2ps0c_1036{box-sizing:border-box;width:100%;min-height:var(--field-drag-min-height,88px);border:var(--field-drag-border,2px dashed #c7c7cc);border-radius:calc(var(--field-radius) - 2px);color:inherit;font:inherit;text-align:center;cursor:pointer;background:0 0;outline:none;flex-direction:column;justify-content:center;align-items:center;gap:6px;margin:0;padding:18px 14px;transition:border-color .16s,background-color .16s,border-style .16s;display:flex}._dragDropZone_2ps0c_1036:hover:not(:disabled){border-color:var(--field-drag-border-hover,#8e8e93);background:var(--field-background-focus,#00000008)}._dragDropZone_2ps0c_1036[data-dragging=true]{border-color:var(--field-range-fill,#34c759);background:color-mix(in srgb, var(--field-range-fill,#34c759) 10%, transparent);border-style:solid}._dragDropZone_2ps0c_1036:focus-visible{box-shadow:var(--field-focus-shadow,0 0 0 3px var(--field-focus-ring,#0000))}._dragDropZone_2ps0c_1036:disabled{cursor:not-allowed;opacity:.65}._dragDropHint_2ps0c_1074{font-size:var(--control-font-size,14px);color:inherit;line-height:1.35}._dragDropAccept_2ps0c_1080{font-size:var(--field-error-size,12px);color:var(--field-placeholder);letter-spacing:.01em}._dragDropList_2ps0c_1086{flex-direction:column;gap:6px;margin:4px 0 0;padding:0;list-style:none;display:flex}._dragDropItem_2ps0c_1095{background:var(--field-background-focus,#0000000a);border-radius:10px;align-items:center;gap:10px;min-width:0;padding:8px 10px;display:flex}._dragDropMeta_2ps0c_1105{flex-direction:column;flex:1;gap:2px;min-width:0;display:flex}._dragDropName_2ps0c_1113{text-overflow:ellipsis;white-space:nowrap;font-size:var(--control-font-size,14px);color:inherit;line-height:1.3;overflow:hidden}._dragDropSize_2ps0c_1122{font-size:var(--field-error-size,12px);color:var(--field-placeholder);line-height:1.2}._dragDropRemove_2ps0c_1128{width:28px;height:28px;color:var(--field-placeholder);cursor:pointer;background:0 0;border:0;border-radius:8px;flex:none;justify-content:center;align-items:center;padding:0;font-size:18px;line-height:1;display:inline-flex}._dragDropRemove_2ps0c_1128:hover{color:var(--field-error-color,#d70015);background:color-mix(in srgb, var(--field-error-color,#d70015) 10%, transparent)}._dragDropClearAll_2ps0c_1149{color:var(--field-placeholder);font:inherit;font-size:var(--field-error-size,12px);cursor:pointer;background:0 0;border:0;align-self:flex-start;margin-top:2px;padding:2px 0}._dragDropClearAll_2ps0c_1149:hover{color:var(--field-error-color,#d70015)}\n\n._o_5zbqt_4{z-index:var(--elcrm-z-popover,1000);background:0 0;position:fixed;inset:0}._c_5zbqt_15{box-shadow:var(--date-popup-shadow,5px 7px 18px 0 #000000a8);padding:var(--date-popup-padding,10px 12px 12px);background:var(--select-background);z-index:var(--elcrm-z-popover-front,1001);border-radius:var(--date-popup-radius,10px);scrollbar-width:none;-ms-overflow-style:none;max-height:min(92vh,480px);margin:0;display:block;position:fixed;overflow:hidden auto}._c_5zbqt_15::-webkit-scrollbar{background:0 0;width:0;height:0;display:none}._c_5zbqt_15{color:var(--select-color,#333);box-sizing:border-box;min-width:var(--date-popup-min-width,259px)}._c_5zbqt_15 [grid-calendar]{grid-template-columns:repeat(7,1fr);grid-auto-rows:var(--date-popup-row-height,34px);gap:2px;display:grid}._c_5zbqt_15 [grid-calendar]>p{color:var(--field-placeholder);box-sizing:border-box;justify-content:center;align-items:center;margin:0;padding:0;font-size:.75rem;font-weight:500;line-height:1;display:flex}._c_5zbqt_15 [grid-month]{grid-template-columns:1fr 1fr 1fr 1fr;width:250px;display:grid}._c_5zbqt_15 b{border-radius:var(--date-popup-cell-radius,5px);cursor:pointer;text-align:center;padding:8px 5px;font-weight:400;display:block}._c_5zbqt_15 b:hover{background:var(--select-li-hover-bg)}._c_5zbqt_15 p{color:var(--field-placeholder);text-align:center;cursor:default;pointer-events:none;padding:0}._c_5zbqt_15 i{text-align:center;cursor:pointer;border-radius:var(--date-popup-cell-radius,5px);flex:0 30px;padding:9px}._c_5zbqt_15 i:hover{background:var(--select-li-hover-bg)}._c_5zbqt_15 i:before{cursor:pointer;display:block}._c_5zbqt_15 s{align-items:center;gap:4px;padding-bottom:6px;font-style:normal;text-decoration:none;display:flex}._c_5zbqt_15 s h2{text-align:center;min-width:0;color:var(--select-color,#333);cursor:default;flex-wrap:nowrap;flex:auto;justify-content:center;align-items:center;gap:8px;margin:0;padding:0;font-size:16px;font-weight:400;line-height:1.25;display:flex}._c_5zbqt_15 ._dateHeaderMonth_5zbqt_128,._c_5zbqt_15 ._dateHeaderYear_5zbqt_128{cursor:pointer;-webkit-user-select:none;user-select:none;white-space:nowrap;border-radius:6px;padding:2px 8px}._c_5zbqt_15 ._dateHeaderMonth_5zbqt_128:hover,._c_5zbqt_15 ._dateHeaderYear_5zbqt_128:hover{background:var(--select-li-hover-bg)}._c_5zbqt_15 ._dateHeaderDisabled_5zbqt_138{cursor:not-allowed;opacity:.45;pointer-events:none}._c_5zbqt_15 ._dateHeaderDisabled_5zbqt_138[data-active=true],._c_5zbqt_15 ._dateHeaderDisabled_5zbqt_138[data-current=true]{opacity:.45}._c_5zbqt_15 [grid-calendar] b[data-current=true],._c_5zbqt_15 [grid-month] b[data-current=true]{background:color-mix(in srgb, var(--field-background-active) 52%, transparent);font-weight:600}._c_5zbqt_15 [grid-calendar] b[data-active=true]:not([data-current=true]),._c_5zbqt_15 [grid-month] b[data-active=true]:not([data-current=true]){outline:2px solid var(--field-background-active);outline-offset:-2px}._c_5zbqt_15 [grid-calendar] b[data-active=true][data-current=true],._c_5zbqt_15 [grid-month] b[data-active=true][data-current=true]{box-shadow:inset 0 0 0 2px var(--field-background-active)}._c_5zbqt_15 [grid-calendar] p[data-current=true]{background:color-mix(in srgb, var(--field-background-active) 52%, transparent);color:inherit;border-radius:var(--date-popup-cell-radius,5px);font-weight:600}._c_5zbqt_15 [grid-calendar] p[data-active=true]:not([data-current=true]){outline:2px solid var(--field-background-active);outline-offset:-2px;opacity:.85}._c_5zbqt_15 [grid-calendar] p[data-active=true][data-current=true]{box-shadow:inset 0 0 0 2px var(--field-background-active)}._c_5zbqt_15 span{text-align:center;padding:2px}._c_5zbqt_15 span p{color:var(--field-placeholder);padding:8px 5px}._c_5zbqt_15 [grid-calendar]>span{box-sizing:border-box;justify-content:stretch;align-items:stretch;min-height:0;padding:0;display:flex}._c_5zbqt_15 [grid-calendar]>span>b,._c_5zbqt_15 [grid-calendar]>span>p{box-sizing:border-box;border-radius:var(--date-popup-cell-radius,5px);flex:auto;justify-content:center;align-items:center;width:100%;min-height:0;margin:0;padding:0;display:flex}._c_5zbqt_15 ._as_5zbqt_205{cursor:ns-resize}._c_5zbqt_15 ._ap_5zbqt_208{cursor:pointer}\n\n:root{--select-height:52px;--select-icon:calc(var(--select-height) / 1.5);--select-icon-padding:calc((var(--select-height) - var(--select-icon)) / 2);--select-font-size:17px;--select-radius:20px;--select-max-height:300px}._o_ogta0_19{z-index:var(--elcrm-z-popover,1000);background:var(--select-overlay,transparent);position:fixed;inset:0}._l_ogta0_29{background:var(--select-background,#fff);z-index:var(--elcrm-z-popover-front,1001);border-radius:var(--select-radius);max-height:var(--select-max-height);scrollbar-width:none;-ms-overflow-style:none;margin:0;padding:0;display:block;position:fixed;overflow:hidden auto}._l_ogta0_29::-webkit-scrollbar{background:0 0;width:0;height:0;display:none}._l_ogta0_29 ul{width:100%;max-height:var(--select-max-height);scrollbar-width:none;-ms-overflow-style:none;margin:0;padding:0;list-style:none;display:block;overflow:hidden auto}._l_ogta0_29 ul::-webkit-scrollbar{background:0 0;width:0;height:0;display:none}._l_ogta0_29 li{border-bottom:var(--select-separator,1px solid #c6c6c8);cursor:pointer;color:var(--select-color,#000);height:var(--select-height);line-height:var(--select-height);font-size:var(--select-font-size);white-space:nowrap;text-overflow:ellipsis;opacity:1;margin:0;padding:0 14px;display:block;overflow:hidden;text-align:left!important;border-left:0!important}._l_ogta0_29 li[aria-selected=true]{background:var(--select-li-selected-bg,var(--select-li-hover-bg,#f2f2f7))}._l_ogta0_29 li:hover{background:var(--select-li-hover-bg,#f2f2f7)}._l_ogta0_29 li[data-focus=true]{background:var(--select-li-focus-bg,#e5e5ea)}._l_ogta0_29 li:last-child{border-bottom:0}._i_ogta0_105{width:var(--select-icon);height:var(--select-icon);color:var(--field-color);right:var(--select-icon-padding);top:var(--select-icon-padding);position:absolute}._placeholderValue_ogta0_115{color:var(--field-placeholder);font-weight:400}._f_ogta0_120{cursor:pointer}._f_ogta0_120[aria-disabled=true]{cursor:not-allowed}\n\n:root{--color-picker-width:260px;--color-picker-radius:16px;--color-picker-pad:10px;--color-picker-swatch:20px;--color-picker-input-radius:5px;--color-picker-handle:14px}._o_1i8zo_14{z-index:var(--elcrm-z-popover,1000);background:var(--select-overlay,transparent);position:fixed;inset:0}._panel_1i8zo_21{z-index:var(--elcrm-z-popover-front,1001);box-sizing:border-box;width:var(--color-picker-width);padding:var(--color-picker-pad);background:var(--select-background,#2c2c2e);color:var(--select-color,#fff);border-radius:var(--color-picker-radius);flex-direction:column;gap:8px;display:flex;position:fixed;box-shadow:0 8px 28px #00000059}._sv_1i8zo_37{aspect-ratio:1/.55;cursor:crosshair;touch-action:none;border-radius:8px;width:100%;max-height:140px;position:relative;overflow:hidden}._svWhite_1i8zo_48{background:linear-gradient(90deg,#fff,#0000);position:absolute;inset:0}._svBlack_1i8zo_54{background:linear-gradient(#0000,#000);position:absolute;inset:0}._handle_1i8zo_60{width:var(--color-picker-handle);height:var(--color-picker-handle);margin:calc(var(--color-picker-handle) / -2) 0 0 calc(var(--color-picker-handle) / -2);pointer-events:none;box-sizing:border-box;border:2px solid #fff;border-radius:50%;position:absolute;box-shadow:0 0 0 1px #00000059}._slidersRow_1i8zo_72{align-items:center;gap:8px;display:flex}._eyedropper_1i8zo_78{border-radius:var(--color-picker-input-radius);background:var(--field-background,#1c1c1e);width:26px;height:26px;color:var(--field-icon-color,#8e8e93);cursor:pointer;border:none;flex:none;justify-content:center;align-items:center;padding:0;display:inline-flex}._eyedropper_1i8zo_78:hover{color:var(--field-color,#fff)}._sliders_1i8zo_72{flex-direction:column;flex:1;gap:8px;min-width:0;display:flex}._slider_1i8zo_72{cursor:pointer;touch-action:none;border-radius:999px;height:10px;position:relative}._sliderHue_1i8zo_113{background:linear-gradient(90deg,red 0%,#ff0 17%,#0f0 33%,#0ff 50%,#00f 67%,#f0f 83%,red 100%)}._sliderAlpha_1i8zo_117{background-image:linear-gradient(to right, transparent, var(--alpha-color,#fff)), linear-gradient(45deg, #777 25%, transparent 25%), linear-gradient(-45deg, #777 25%, transparent 25%), linear-gradient(45deg, transparent 75%, #777 75%), linear-gradient(-45deg, transparent 75%, #777 75%);background-color:#bbb;background-position:0 0,0 0,0 4px,4px -4px,-4px 0;background-size:100% 100%,8px 8px,8px 8px,8px 8px,8px 8px}._sliderHandle_1i8zo_125{width:var(--color-picker-handle);height:var(--color-picker-handle);margin:calc(var(--color-picker-handle) / -2) 0 0 calc(var(--color-picker-handle) / -2);pointer-events:none;box-sizing:border-box;background:0 0;border:2px solid #fff;border-radius:50%;position:absolute;top:50%;box-shadow:0 0 0 1px #00000059}._inputs_1i8zo_139{align-items:center;gap:6px;display:flex}._format_1i8zo_145{color:var(--field-placeholder,#8e8e93);flex:none;padding:0 2px;font-size:12px}._input_1i8zo_139{box-sizing:border-box;border-radius:var(--color-picker-input-radius);background:var(--field-background,#1c1c1e);min-width:0;height:28px;color:var(--field-color,#fff);font:inherit;border:none;outline:none;flex:1;padding:0 8px;font-size:13px}._input_1i8zo_139:focus{box-shadow:0 0 0 2px var(--field-focus-ring,#fff3)}._inputAlpha_1i8zo_171{text-align:center;flex:0 0 56px}._palette_1i8zo_176{grid-template-columns:repeat(8,1fr);place-items:center;gap:4px;padding:0;display:grid}._swatchBtn_1i8zo_185{width:var(--color-picker-swatch);height:var(--color-picker-swatch);cursor:pointer;background:var(--swatch,#888);border:none;border-radius:50%;padding:0;transition:transform .12s;box-shadow:inset 0 0 0 1px #0000001f}._swatchBtn_1i8zo_185[aria-checked=true]{z-index:1;box-shadow:inset 0 0 0 1px #00000026, 0 0 0 2px var(--select-background,#2c2c2e), 0 0 0 3px #ffffff59;transform:scale(1.35)}._swatchBtn_1i8zo_185:disabled{cursor:not-allowed;opacity:.5}._trigger_1i8zo_210{cursor:pointer;align-items:center;gap:var(--field-icon-gap,10px);min-width:0;height:var(--field-height,44px);flex:1;display:flex}._trigger_1i8zo_210[aria-disabled=true]{cursor:not-allowed}._preview_1i8zo_224{background-color:var(--preview-color,transparent);background-image:linear-gradient(var(--preview-color,transparent), var(--preview-color,transparent)), linear-gradient(45deg, #c6c6c8 25%, transparent 25%), linear-gradient(-45deg, #c6c6c8 25%, transparent 25%), linear-gradient(45deg, transparent 75%, #c6c6c8 75%), linear-gradient(-45deg, transparent 75%, #c6c6c8 75%);background-position:0 0,0 0,0 3px,3px -3px,-3px 0;background-size:100% 100%,6px 6px,6px 6px,6px 6px,6px 6px;border-radius:50%;flex:none;width:22px;height:22px;box-shadow:inset 0 0 0 1px #00000026}._hexText_1i8zo_237{text-overflow:ellipsis;white-space:nowrap;min-width:0;font-size:var(--control-font-size,17px);flex:1;overflow:hidden}._placeholder_1i8zo_246{color:var(--field-placeholder,#8e8e93);font-weight:400}\n";
9
9
  document.head.appendChild(el);
10
10
  })();
11
11
 
12
- import e from "../styles/Field.module.js";
13
- import { jsx as t, jsxs as n } from "react/jsx-runtime";
14
- //#region src/lib/core/Field.tsx
15
- var r = ({ element_blok: r = { className: [] }, element_input: i = {
16
- className: [],
17
- props: {}
18
- }, type: a = "input", label: o, error: s, before: c, after: l, children: u, size: d = "md" }) => /* @__PURE__ */ n("dl", {
19
- "data-field": a,
20
- "data-size": d,
21
- className: [e.l, ...r.className || []].filter((e) => e !== void 0).join(" "),
22
- children: [
23
- o ? /* @__PURE__ */ t("dt", {
24
- className: e.t,
25
- children: o
26
- }) : "",
27
- c,
28
- /* @__PURE__ */ t("dd", {
29
- className: [
30
- e.f,
31
- ...i.className || [],
32
- s && s.length > 0 ? e.e : ""
33
- ].join(" "),
34
- ...i.props || {},
35
- children: u
36
- }),
37
- s && s.length > 0 ? /* @__PURE__ */ t("em", {
38
- className: e.m,
39
- children: s
40
- }) : "",
41
- l
42
- ]
43
- });
44
- //#endregion
45
- export { r as default };
12
+ import e from"../styles/Field.module.js";import{createContext as t,useContext as n,useId as r,useMemo as i}from"react";import{jsx as a,jsxs as o}from"react/jsx-runtime";var s=t(null);function c(){return n(s)}var l=({element_blok:t={className:[]},element_input:n={className:[],props:{}},type:c=`input`,label:l,id:u,error:d,before:f,after:p,children:m,size:h=`md`})=>{let g=r(),_=u||`elcrm-field-${g.replace(/:/g,``)}`,v=`${_}-label`,y=!!(d&&d.length>0),b=y?`${_}-error`:void 0,x=i(()=>({controlId:_,labelId:v,errorId:b,describedBy:b}),[_,v,b]),S=i(()=>[e.l,...t.className||[]].filter(e=>e!==void 0).join(` `),[t.className?.join(` `)]),C=i(()=>[e.f,...n.className||[],y?e.e:``].join(` `),[n.className?.join(` `),y]);return a(s.Provider,{value:x,children:o(`div`,{"data-field":c,"data-size":h,className:S,children:[l?a(`label`,{htmlFor:_,id:v,className:e.t,children:l}):null,f,a(`div`,{className:C,...n.props||{},children:m}),y?a(`div`,{id:b,className:e.m,role:`alert`,children:d}):null,p]})})};export{l as default,c as useFieldA11y};
package/dist/dark.css CHANGED
@@ -17,6 +17,7 @@
17
17
  --field-border-hover: 0px solid #48484a;
18
18
  --field-border-focus: 0px solid #636366;
19
19
  --field-focus-ring: rgba(235, 235, 245, 0.22);
20
+ --field-focus-shadow: 0 0 0 3px var(--field-focus-ring);
20
21
  --field-radius: var(--control-radius);
21
22
  --field-background: #1c1c1e;
22
23
  --field-background-focus: rgba(255, 255, 255, 0.06);
@@ -27,14 +28,19 @@
27
28
  --field-placeholder: #8e8e93;
28
29
  --field-label-color: #aeaeb2;
29
30
  --field-label-size: 14px;
31
+ --field-label-gap: 10px;
30
32
  --field-error-border: #ff453a;
31
33
  --field-error-background: rgba(255, 69, 58, 0.15);
32
34
  --field-error-color: #ff6961;
35
+ --field-error-size: 12px;
36
+ --field-error-gap: 6px;
33
37
  /* чекбокс / переключатели — нейтральный серый, не акцентный синий */
34
38
  --field-background-active: #8e8e93;
35
39
  --field-check-box-border: 2px solid #8e8e93;
40
+ --field-check-size: 22px;
36
41
  --field-icon-color: #8e8e93;
37
42
  --field-icon-gap: 10px;
43
+ --field-icon-size: 20px;
38
44
  --field-side-padding: var(--control-side-padding);
39
45
  --field-block-gap: 0;
40
46
  --field-note-height: 100px;
@@ -50,6 +56,14 @@
50
56
  --field-range-track: #39393d;
51
57
  --field-range-bar-height: 14px;
52
58
 
59
+ --field-code-cell-size: 36px;
60
+ --field-rating-size: 22px;
61
+ --field-radio-size: 20px;
62
+
63
+ --field-drag-border: 2px dashed #48484a;
64
+ --field-drag-border-hover: #8e8e93;
65
+ --field-drag-min-height: 88px;
66
+
53
67
  /* Списки / календарь: только серые пласты */
54
68
  --select-overlay: transparent;
55
69
  --select-background: #2c2c2e;
@@ -58,9 +72,14 @@
58
72
  --select-li-hover-bg: #3a3a3c;
59
73
  --select-li-focus-bg: #48484a;
60
74
  --select-li-selected-bg: #48484a;
61
- --color-placeholder: #8e8e93;
62
- --bg-select-hover: #48484a;
63
- --bg-select-active: rgba(255, 255, 255, 0.12);
75
+
76
+ /* Календарь (Date popup) */
77
+ --date-popup-radius: 10px;
78
+ --date-popup-shadow: 5px 7px 18px 0 #000000a8;
79
+ --date-popup-min-width: 259px;
80
+ --date-popup-row-height: 34px;
81
+ --date-popup-cell-radius: 5px;
82
+ --date-popup-padding: 10px 12px 12px;
64
83
 
65
84
  /* ColorField popup */
66
85
  --color-picker-width: 260px;
@@ -1,67 +1 @@
1
- //#region src/lib/events/onEvent.ts
2
- var e = (e) => {
3
- let t = window.getSelection();
4
- if (!t || t.rangeCount === 0) return;
5
- let n = t.getRangeAt(0);
6
- n.deleteContents(), n.insertNode(document.createTextNode(e)), n.collapse(!1), t.removeAllRanges(), t.addRange(n);
7
- };
8
- function t(t, n) {
9
- e(t), n.dispatchEvent(new Event("input", { bubbles: !0 }));
10
- }
11
- var n = (e) => {
12
- let t = window.getSelection();
13
- if (!t) return;
14
- let n = document.createRange();
15
- n.selectNodeContents(e), n.collapse(!1), t.removeAllRanges(), t.addRange(n);
16
- }, r = (e, t, n) => {
17
- if (!t) return e;
18
- let r = window.getSelection(), i = 0;
19
- if (r && r.rangeCount > 0) {
20
- let e = r.getRangeAt(0);
21
- n.contains(e.commonAncestorContainer) && (i = e.toString().length);
22
- }
23
- let a = t - ((n.textContent || "").length - i);
24
- return a <= 0 ? "" : e.slice(0, a);
25
- };
26
- function i(e) {
27
- queueMicrotask(() => {
28
- e.dispatchEvent(new Event("input", { bubbles: !0 }));
29
- });
30
- }
31
- var a = {
32
- KeyDown(e) {
33
- e.key === "Enter" && e.preventDefault();
34
- },
35
- PasteOne(t) {
36
- t.preventDefault(), e(t.clipboardText.replace(/\D/g, "")), i(t.target);
37
- },
38
- Paste(t, n) {
39
- n.preventDefault();
40
- let a = r(n.clipboardText, t, n.target);
41
- a && (e(a.replace(/(\r\n|\n|\r)/gm, " ")), i(n.target));
42
- },
43
- PasteDigits(t, n) {
44
- n.preventDefault();
45
- let a = r(n.clipboardText.replace(/\D/g, ""), t, n.target);
46
- a && (e(a), i(n.target));
47
- },
48
- Focus(e) {
49
- (e.target.textContent || "").length || (e.target.innerHTML = "<br>"), n(e.target);
50
- },
51
- Blur(e) {
52
- e.target.scrollLeft = 0, e.target.querySelector("br") !== null && e.target.querySelector("br")?.remove();
53
- }
54
- }, o = "plaintext-only";
55
- function s(e) {
56
- return {
57
- preventDefault: () => e.preventDefault(),
58
- target: e.currentTarget,
59
- clipboardText: e.clipboardData?.getData("text/plain") ?? ""
60
- };
61
- }
62
- var c = {
63
- ...a,
64
- ContentEditable: o
65
- };
66
- //#endregion
67
- export { s as asEditableClipboard, c as default, t as pastePlainTextIntoSelection };
1
+ var e=e=>{let t=window.getSelection();if(!t||t.rangeCount===0)return;let n=t.getRangeAt(0);n.deleteContents(),n.insertNode(document.createTextNode(e)),n.collapse(!1),t.removeAllRanges(),t.addRange(n)};function t(t,n){e(t),n.dispatchEvent(new Event(`input`,{bubbles:!0}))}var n=e=>{let t=window.getSelection();if(!t)return;let n=document.createRange();n.selectNodeContents(e),n.collapse(!1),t.removeAllRanges(),t.addRange(n)},r=(e,t,n)=>{if(!t)return e;let r=window.getSelection(),i=0;if(r&&r.rangeCount>0){let e=r.getRangeAt(0);n.contains(e.commonAncestorContainer)&&(i=e.toString().length)}let a=t-((n.textContent||``).length-i);return a<=0?``:e.slice(0,a)};function i(e){queueMicrotask(()=>{e.dispatchEvent(new Event(`input`,{bubbles:!0}))})}var a={KeyDown(e){e.key===`Enter`&&e.preventDefault()},PasteOne(t){t.preventDefault(),e(t.clipboardText.replace(/\D/g,``)),i(t.target)},Paste(t,n){n.preventDefault();let a=r(n.clipboardText,t,n.target);a&&(e(a.replace(/(\r\n|\n|\r)/gm,` `)),i(n.target))},PasteDigits(t,n){n.preventDefault();let a=r(n.clipboardText.replace(/\D/g,``),t,n.target);a&&(e(a),i(n.target))},Focus(e){(e.target.textContent||``).length||(e.target.innerHTML=`<br>`),n(e.target)},Blur(e){e.target.scrollLeft=0,e.target.querySelector(`br`)!==null&&e.target.querySelector(`br`)?.remove()}},o=`plaintext-only`;function s(e){return{preventDefault:()=>e.preventDefault(),target:e.currentTarget,clipboardText:e.clipboardData?.getData(`text/plain`)??``}}var c={...a,ContentEditable:o};export{s as asEditableClipboard,c as default,t as pastePlainTextIntoSelection};
@@ -1,86 +1 @@
1
- import e from "../styles/Field.module.js";
2
- import t from "../core/Field.js";
3
- import { useFormFieldState as n } from "../hooks/use.js";
4
- import r from "react";
5
- import { jsx as i, jsxs as a } from "react/jsx-runtime";
6
- //#region src/lib/fields/Check.tsx
7
- function o(e) {
8
- if (e === !0 || e === 1) return !0;
9
- if (typeof e == "string") {
10
- let t = e.trim().toLowerCase();
11
- return t === "1" || t === "true" || t === "on" || t === "yes";
12
- }
13
- return !1;
14
- }
15
- function s({ value: s = !1, form: c, onValue: l, onBlur: u, name: d = "", placeholder: f = "", label: p = "", error: m = "", hidden: h = !1, disabled: g = !1, className: _ = "", after: v = "", before: y = "", size: b = "md", variant: x = "field", showFocusRing: S = !0 }) {
16
- let { value: C } = n(c, d, s), w = o(C), T = !g, E = f || "", D = r.useCallback((e) => {
17
- let t = {
18
- value: e,
19
- name: d || ""
20
- };
21
- c && d && c.setValue(t), l && l !== c?.onValue && l(t);
22
- }, [
23
- c,
24
- d,
25
- l
26
- ]), O = () => {
27
- T && D(!w);
28
- }, k = (e) => {
29
- T && (e.key === " " || e.key === "Enter") && (e.preventDefault(), O());
30
- }, A = () => {
31
- !u || !d || u({
32
- value: o(c && d ? c.getValue(d, w) : w),
33
- name: d
34
- });
35
- };
36
- return h && !w ? null : /* @__PURE__ */ a(t, {
37
- type: "checkbox",
38
- label: p,
39
- error: m,
40
- element_blok: { className: [_ || "", x === "plain" ? e.checkPlainBlok : ""].filter(Boolean) },
41
- element_input: {
42
- className: [e.checkbox],
43
- props: {
44
- "data-disabled": g || !T ? "true" : void 0,
45
- "data-size": b,
46
- "data-variant": x
47
- }
48
- },
49
- children: [
50
- y ? /* @__PURE__ */ i("span", {
51
- className: e.affix,
52
- children: y
53
- }) : null,
54
- /* @__PURE__ */ i("div", { children: /* @__PURE__ */ a("button", {
55
- type: "button",
56
- className: e.checkControl,
57
- role: "checkbox",
58
- "aria-checked": w,
59
- "aria-label": p || E || "Чекбокс",
60
- "aria-disabled": g || !T ? !0 : void 0,
61
- disabled: g || !T,
62
- "data-size": b,
63
- "data-variant": x,
64
- "data-focus-ring": S ? "true" : "false",
65
- onClick: O,
66
- onKeyDown: k,
67
- onBlur: A,
68
- children: [/* @__PURE__ */ i("span", {
69
- className: e.checkBox,
70
- "aria-hidden": !0,
71
- children: w ? /* @__PURE__ */ i("span", { className: e.checkMark }) : null
72
- }), E ? /* @__PURE__ */ i("span", {
73
- className: e.checkText,
74
- children: E
75
- }) : null]
76
- }) }),
77
- v ? /* @__PURE__ */ i("span", {
78
- className: e.affix,
79
- children: v
80
- }) : null
81
- ]
82
- });
83
- }
84
- s.displayName = "CheckField";
85
- //#endregion
86
- export { s 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 i from"react";import{jsx as a,jsxs as o}from"react/jsx-runtime";function s(e){if(e===!0||e===1)return!0;if(typeof e==`string`){let t=e.trim().toLowerCase();return t===`1`||t===`true`||t===`on`||t===`yes`}return!1}function c({value:n=!1,form:c,onValue:u,onBlur:d,name:f=``,placeholder:p=``,label:m=``,error:h=``,hidden:g=!1,disabled:_=!1,className:v=``,after:y=``,before:b=``,size:x=`md`,variant:S=`field`,showFocusRing:C=!0}){let{value:w}=r(c,f,n),T=s(w),E=!_,D=p||``,O=i.useCallback(e=>{let t={value:e,name:f||``};c&&f&&c.setValue(t),u&&u!==c?.onValue&&u(t)},[c,f,u]),k=()=>{E&&O(!T)},A=e=>{E&&(e.key===` `||e.key===`Enter`)&&(e.preventDefault(),k())},j=()=>{!d||!f||d({value:s(c&&f?c.getValue(f,T):T),name:f})};return g&&!T?null:o(t,{type:`checkbox`,label:m,error:h,element_blok:{className:[v||``,S===`plain`?e.checkPlainBlok:``].filter(Boolean)},element_input:{className:[e.checkbox],props:{"data-disabled":_||!E?`true`:void 0,"data-size":x,"data-variant":S}},children:[b?a(`span`,{className:e.affix,children:b}):null,a(`div`,{children:a(l,{checked:T,label:m,text:D,disabled:_,editable:E,size:x,variant:S,showFocusRing:C,toggle:k,onKeyDown:A,onBlur:j})}),y?a(`span`,{className:e.affix,children:y}):null]})}c.displayName=`CheckField`;function l({checked:t,label:r,text:i,disabled:s,editable:c,size:l,variant:u,showFocusRing:d,toggle:f,onKeyDown:p,onBlur:m}){let h=n();return o(`button`,{type:`button`,id:h?.controlId,className:e.checkControl,role:`checkbox`,"aria-checked":t,"aria-label":r?void 0:i||`Чекбокс`,"aria-describedby":h?.describedBy,"aria-invalid":h?.errorId?!0:void 0,"aria-disabled":s||!c?!0:void 0,disabled:s||!c,"data-size":l,"data-variant":u,"data-focus-ring":d?`true`:`false`,onClick:f,onKeyDown:p,onBlur:m,children:[a(`span`,{className:e.checkBox,"aria-hidden":!0,children:t?a(`span`,{className:e.checkMark}):null}),i?a(`span`,{className:e.checkText,children:i}):null]})}export{c as default};
@@ -1,94 +1 @@
1
- import e from "../styles/Field.module.js";
2
- import t from "../core/Field.js";
3
- import { useFormFieldState as n } from "../hooks/use.js";
4
- import { isEmptyTextLike as r } from "./visibility.js";
5
- import i from "react";
6
- import { jsx as a, jsxs as o } from "react/jsx-runtime";
7
- //#region src/lib/fields/Code.tsx
8
- function s({ value: s = "", form: c, onValue: l, onBlur: u, name: d = "", placeholder: f = "", label: p = "", error: m = "", hidden: h = !1, disabled: g = !1, className: _ = "", after: v = "", before: y = "", length: b = 6, numeric: x = !0, autoComplete: S = "one-time-code" }) {
9
- let { value: C, version: w } = n(c, d, s), T = !g, E = (x ? String(C ?? "").replace(/\D/g, "") : String(C ?? "")).slice(0, b), D = i.useRef([]);
10
- i.useEffect(() => {}, [w]);
11
- let O = (e, t = !1) => {
12
- let n = {
13
- value: e,
14
- name: d
15
- };
16
- c && d && (t ? c.setValue(n) : c.onValue(n)), l && l !== c?.onValue && l(n);
17
- }, k = (e, t) => {
18
- let n = E.padEnd(b, " ").split("");
19
- n[e] = t;
20
- let r = n.join("").replace(/ /g, "").slice(0, b);
21
- return O(r, !0), r;
22
- }, A = (e, t) => {
23
- let n = x ? t.replace(/\D/g, "") : t;
24
- if (!n) {
25
- k(e, "");
26
- return;
27
- }
28
- if (n.length > 1) {
29
- let e = n.slice(0, b);
30
- O(e, !0);
31
- let t = Math.min(e.length, b - 1);
32
- D.current[t]?.focus();
33
- return;
34
- }
35
- k(e, n), e < b - 1 && D.current[e + 1]?.focus();
36
- };
37
- return h && r(E) ? null : /* @__PURE__ */ o(t, {
38
- type: "code",
39
- label: p,
40
- error: m,
41
- element_blok: { className: [_ || ""] },
42
- element_input: {
43
- className: [e.code],
44
- props: { "data-disabled": g || !T ? "true" : void 0 }
45
- },
46
- children: [
47
- y ? /* @__PURE__ */ a("span", {
48
- className: e.affix,
49
- children: y
50
- }) : null,
51
- /* @__PURE__ */ a("div", {
52
- className: e.codeInner,
53
- role: "group",
54
- "aria-label": p || f || "Код",
55
- children: Array.from({ length: b }, (t, n) => /* @__PURE__ */ a("input", {
56
- ref: (e) => {
57
- D.current[n] = e;
58
- },
59
- className: e.codeCell,
60
- type: "text",
61
- inputMode: x ? "numeric" : "text",
62
- autoComplete: n === 0 ? S : "off",
63
- maxLength: b,
64
- disabled: g || !T,
65
- value: E[n] || "",
66
- placeholder: f ? f[n] : "",
67
- "aria-label": `${n + 1} из ${b}`,
68
- onChange: (e) => A(n, e.target.value),
69
- onKeyDown: (e) => {
70
- e.key === "Backspace" && !E[n] && n > 0 && (e.preventDefault(), k(n - 1, ""), D.current[n - 1]?.focus()), e.key === "ArrowLeft" && n > 0 && (e.preventDefault(), D.current[n - 1]?.focus()), e.key === "ArrowRight" && n < b - 1 && (e.preventDefault(), D.current[n + 1]?.focus());
71
- },
72
- onBlur: () => {
73
- (n === b - 1 || document.activeElement === document.body) && u?.({
74
- value: E,
75
- name: d
76
- });
77
- },
78
- onPaste: (e) => {
79
- e.preventDefault();
80
- let t = e.clipboardData.getData("text") || "", n = (x ? t.replace(/\D/g, "") : t).slice(0, b);
81
- O(n, !0), D.current[Math.min(n.length, b - 1)]?.focus();
82
- }
83
- }, n))
84
- }),
85
- v ? /* @__PURE__ */ a("span", {
86
- className: e.affix,
87
- children: v
88
- }) : null
89
- ]
90
- });
91
- }
92
- s.displayName = "CodeField";
93
- //#endregion
94
- 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 i from"react";import{jsx as a,jsxs as o}from"react/jsx-runtime";function s({value:s=``,form:c,onValue:l,onBlur:u,name:d=``,placeholder:f=``,label:p=``,error:m=``,hidden:h=!1,disabled:g=!1,className:_=``,after:v=``,before:y=``,length:b=6,numeric:x=!0,autoComplete:S=`one-time-code`}){let{value:C,version:w}=n(c,d,s),T=!g,E=(x?String(C??``).replace(/\D/g,``):String(C??``)).slice(0,b),D=i.useRef([]);i.useEffect(()=>{},[w]);let O=(e,t=!1)=>{let n={value:e,name:d};c&&d&&(t?c.setValue(n):c.onValue(n)),l&&l!==c?.onValue&&l(n)},k=(e,t)=>{let n=E.padEnd(b,` `).split(``);n[e]=t;let r=n.join(``).replace(/ /g,``).slice(0,b);return O(r,!0),r},A=(e,t)=>{let n=x?t.replace(/\D/g,``):t;if(!n){k(e,``);return}if(n.length>1){let e=n.slice(0,b);O(e,!0);let t=Math.min(e.length,b-1);D.current[t]?.focus();return}k(e,n),e<b-1&&D.current[e+1]?.focus()};return h&&r(E)?null:o(t,{type:`code`,label:p,error:m,element_blok:{className:[_||``]},element_input:{className:[e.code],props:{"data-disabled":g||!T?`true`:void 0}},children:[y?a(`span`,{className:e.affix,children:y}):null,a(`div`,{className:e.codeInner,role:`group`,"aria-label":p||f||`Код`,children:Array.from({length:b},(t,n)=>a(`input`,{ref:e=>{D.current[n]=e},className:e.codeCell,type:`text`,inputMode:x?`numeric`:`text`,autoComplete:n===0?S:`off`,maxLength:b,disabled:g||!T,value:E[n]||``,placeholder:f?f[n]:``,"aria-label":`${n+1} из ${b}`,onChange:e=>A(n,e.target.value),onKeyDown:e=>{e.key===`Backspace`&&!E[n]&&n>0&&(e.preventDefault(),k(n-1,``),D.current[n-1]?.focus()),e.key===`ArrowLeft`&&n>0&&(e.preventDefault(),D.current[n-1]?.focus()),e.key===`ArrowRight`&&n<b-1&&(e.preventDefault(),D.current[n+1]?.focus())},onBlur:()=>{(n===b-1||document.activeElement===document.body)&&u?.({value:E,name:d})},onPaste:e=>{e.preventDefault();let t=e.clipboardData.getData(`text`)||``,n=(x?t.replace(/\D/g,``):t).slice(0,b);O(n,!0),D.current[Math.min(n.length,b-1)]?.focus()}},n))}),v?a(`span`,{className:e.affix,children:v}):null]})}s.displayName=`CodeField`;export{s as default};