@elcrm/form 0.0.79 → 0.0.81
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.
- package/dist/assets/styles/Color.module.css +1 -1
- package/dist/assets/styles/Field.module.css +1 -1
- package/dist/core/Field.js +1 -1
- package/dist/fields/Code.d.ts +14 -0
- package/dist/fields/Code.js +94 -0
- package/dist/fields/Color.js +133 -91
- package/dist/fields/Date.js +132 -77
- package/dist/fields/Display.d.ts +17 -0
- package/dist/fields/Display.js +49 -0
- package/dist/fields/DragDrop.d.ts +26 -0
- package/dist/fields/DragDrop.js +189 -0
- package/dist/fields/Email.d.ts +8 -0
- package/dist/fields/Email.js +80 -0
- package/dist/fields/File.d.ts +24 -0
- package/dist/fields/File.js +115 -0
- package/dist/fields/Hidden.d.ts +11 -0
- package/dist/fields/Hidden.js +33 -0
- package/dist/fields/Numeric.js +42 -24
- package/dist/fields/Percent.d.ts +13 -0
- package/dist/fields/Percent.js +100 -0
- package/dist/fields/Radio.d.ts +22 -0
- package/dist/fields/Radio.js +88 -0
- package/dist/fields/Rating.d.ts +12 -0
- package/dist/fields/Rating.js +82 -0
- package/dist/fields/RichText.d.ts +14 -0
- package/dist/fields/RichText.js +134 -0
- package/dist/fields/Tags.d.ts +12 -0
- package/dist/fields/Tags.js +97 -0
- package/dist/fields/Time.d.ts +8 -1
- package/dist/fields/Time.js +330 -156
- package/dist/fields/Url.d.ts +8 -0
- package/dist/fields/Url.js +80 -0
- package/dist/index.d.ts +27 -0
- package/dist/index.js +18 -6
- package/dist/index.umd.js +2 -2
- package/dist/package.js +1 -1
- package/dist/style.css +2 -2
- package/dist/styles/Color.module.js +23 -23
- package/dist/styles/Field.module.js +72 -24
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
: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}.
|
|
1
|
+
: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_ftvr3_14{z-index:98;background:var(--select-overlay,transparent);position:fixed;inset:0}._panel_ftvr3_21{z-index:99;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_ftvr3_37{aspect-ratio:1/.55;cursor:crosshair;touch-action:none;border-radius:8px;width:100%;max-height:140px;position:relative;overflow:hidden}._svWhite_ftvr3_48{background:linear-gradient(90deg,#fff,#0000);position:absolute;inset:0}._svBlack_ftvr3_54{background:linear-gradient(#0000,#000);position:absolute;inset:0}._handle_ftvr3_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_ftvr3_72{align-items:center;gap:8px;display:flex}._eyedropper_ftvr3_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_ftvr3_78:hover{color:var(--field-color,#fff)}._sliders_ftvr3_72{flex-direction:column;flex:1;gap:8px;min-width:0;display:flex}._slider_ftvr3_72{cursor:pointer;touch-action:none;border-radius:999px;height:10px;position:relative}._sliderHue_ftvr3_113{background:linear-gradient(90deg,red 0%,#ff0 17%,#0f0 33%,#0ff 50%,#00f 67%,#f0f 83%,red 100%)}._sliderAlpha_ftvr3_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_ftvr3_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_ftvr3_139{align-items:center;gap:6px;display:flex}._format_ftvr3_145{color:var(--field-placeholder,#8e8e93);flex:none;padding:0 2px;font-size:12px}._input_ftvr3_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_ftvr3_139:focus{box-shadow:0 0 0 2px var(--field-focus-ring,#fff3)}._inputAlpha_ftvr3_171{text-align:center;flex:0 0 56px}._palette_ftvr3_176{grid-template-columns:repeat(8,1fr);place-items:center;gap:4px;padding:0;display:grid}._swatchBtn_ftvr3_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_ftvr3_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_ftvr3_185:disabled{cursor:not-allowed;opacity:.5}._trigger_ftvr3_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_ftvr3_210[aria-disabled=true]{cursor:not-allowed}._preview_ftvr3_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_ftvr3_237{text-overflow:ellipsis;white-space:nowrap;min-width:0;font-size:var(--control-font-size,17px);flex:1;overflow:hidden}._placeholder_ftvr3_246{color:var(--field-placeholder,#8e8e93);font-weight:400}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
._l_1to3e_2{min-width:var(--field-width);gap:var(--field-block-gap,0);flex-direction:column;margin:0;padding:0;display:flex;position:relative}._l_1to3e_2>dt,._l_1to3e_2>dd{margin:0}._l_1to3e_2[data-field=group] div{cursor:pointer;border-bottom:var(--field-border);padding:var(--field-padding);margin:0}._l_1to3e_2[data-field=group] div:last-child{border-bottom:0}._l_1to3e_2 [placeholder]:empty:before{content:attr(placeholder);color:var(--field-placeholder);opacity:1;font-style:normal;font-weight:400;display:block}._l_1to3e_2 [placeholder]:focus:before{display:none}._f_1to3e_38{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_1to3e_38:hover{border-color:var(--field-border-hover,var(--field-border))}._f_1to3e_38: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_1to3e_38._e_1to3e_63:focus-within{background:var(--field-error-background);color:var(--field-error-color)}._f_1to3e_38[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_1to3e_38[data-disabled=true]>*{cursor:not-allowed}._f_1to3e_38>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_1to3e_38>div::selection{background:var(--field-selection-bg,#b3d4fc);color:var(--field-selection-color,inherit)}._f_1to3e_38>:not(div){color:var(--field-icon-color,var(--field-placeholder));flex:none;justify-content:center;align-items:center;display:inline-flex}._f_1to3e_38>:not(div) svg{width:20px;height:20px}._f_1to3e_38 input::placeholder,._f_1to3e_38 textarea::placeholder{color:var(--field-placeholder);opacity:1;font-weight:400}._f_1to3e_38 input::-webkit-input-placeholder{color:var(--field-placeholder);opacity:1;font-weight:400}._f_1to3e_38 textarea::-webkit-input-placeholder{color:var(--field-placeholder);opacity:1;font-weight:400}._f_1to3e_38 input::-moz-placeholder{color:var(--field-placeholder);opacity:1;font-weight:400}._f_1to3e_38 textarea::-moz-placeholder{color:var(--field-placeholder);opacity:1;font-weight:400}._n_1to3e_127 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))}._w_1to3e_134>div{text-wrap:nowrap;overflow:scroll hidden}._w_1to3e_134>div::-webkit-scrollbar{width:0;height:0}._time_1to3e_144>div{text-wrap:nowrap;align-items:center;min-width:0;display:flex;overflow:visible}._time_1to3e_144 ._timeInner_1to3e_151{justify-content:flex-start;align-items:center;gap:4px;width:100%;min-width:0;display:flex}._time_1to3e_144._timeAlignCenter_1to3e_162 ._timeInner_1to3e_151{justify-content:center}._time_1to3e_144 ._timeSep_1to3e_165{opacity:.65;-webkit-user-select:none;user-select:none;flex:none;padding:0 2px;font-weight:500;transform:translateY(-1px)}._time_1to3e_144 ._timePart_1to3e_176{box-sizing:border-box;width:1em;min-width:0;color:inherit;font:inherit;line-height:inherit;text-align:left;min-height:var(--field-height);cursor:text;background:0 0;border:0;border-radius:6px;outline:none;flex:none;margin:0;padding:0}._time_1to3e_144 ._timePart_1to3e_176[contenteditable=false]{cursor:not-allowed;opacity:.7}._time_1to3e_144 ._timePart_1to3e_176:empty:before{content:attr(placeholder);color:var(--field-placeholder);opacity:1;font-weight:400}._time_1to3e_144 ._timePart_1to3e_176:focus:empty:before{content:none}._time_1to3e_144 ._timePart_1to3e_176:focus-visible{background:0 0}._time_1to3e_144._timeAlignCenter_1to3e_162 ._timePart_1to3e_176{text-align:center}._t_1to3e_144{color:var(--field-label-color);font-size:var(--field-label-size);padding-bottom:10px}._affix_1to3e_223{color:var(--field-icon-color,var(--field-placeholder));font-size:inherit;-webkit-user-select:none;user-select:none;flex:none;justify-content:center;align-items:center;margin:0;padding:0;line-height:1;display:inline-flex}._g_1to3e_237{flex-direction:column}._range_1to3e_241>div{box-sizing:border-box;min-width:0;min-height:var(--field-height);flex:1;align-items:center;line-height:normal;display:flex}._range_1to3e_241 ._rangeTrack_1to3e_250{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_1to3e_241 ._rangeTrack_1to3e_250:focus-visible{box-shadow:0 0 0 3px var(--field-focus-ring,#0000)}._range_1to3e_241 ._rangeTrack_1to3e_250[data-disabled=true]{cursor:not-allowed;opacity:.55;pointer-events:none}._range_1to3e_241 ._rangeFill_1to3e_271{background:var(--field-range-fill,#00b5ad);pointer-events:none;border-radius:999px 0 0 999px;width:0;min-width:0;height:100%}._range_1to3e_241 ._rangeFillFull_1to3e_282{border-radius:999px}._checkbox_1to3e_286>div{min-height:var(--field-height);align-items:flex-start;width:100%;padding:0;line-height:normal;display:flex}._checkControl_1to3e_295{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_1to3e_295:focus-visible{box-shadow:0 0 0 3px var(--field-focus-ring,#0000);border-radius:calc(var(--field-radius) - 2px)}._checkControl_1to3e_295[aria-disabled=true]{cursor:not-allowed}._checkBox_1to3e_319{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_1to3e_332{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_1to3e_341{min-width:0;color:inherit;font-size:var(--control-font-size,14px);flex:auto;padding-top:2px;line-height:1.25}._checkControl_1to3e_295[aria-checked=true] ._checkBox_1to3e_319{background:var(--field-background-active)}._h_1to3e_354{--field-border:0}._h_1to3e_354 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_1to3e_354 div[aria-checked=true]{background:var(--field-background-active)}._h_1to3e_354 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_1to3e_63{border-color:var(--field-error-border);background:var(--field-error-background);color:var(--field-error-color)}._m_1to3e_393{color:var(--field-error-color);margin-top:6px;font-size:12px;font-style:normal}
|
|
1
|
+
._l_1iesl_2{min-width:var(--field-width);gap:var(--field-block-gap,0);flex-direction:column;margin:0;padding:0;display:flex;position:relative}._l_1iesl_2>dt,._l_1iesl_2>dd{margin:0}._l_1iesl_2[data-field=group] div{cursor:pointer;border-bottom:var(--field-border);padding:var(--field-padding);margin:0}._l_1iesl_2[data-field=group] div:last-child{border-bottom:0}._l_1iesl_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_1iesl_2 [placeholder]:focus:before{display:none}._f_1iesl_39{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_1iesl_39:hover{border-color:var(--field-border-hover,var(--field-border))}._f_1iesl_39: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_1iesl_39._e_1iesl_64:focus-within{background:var(--field-error-background);color:var(--field-error-color)}._f_1iesl_39[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_1iesl_39[data-disabled=true]>*{cursor:not-allowed}._f_1iesl_39>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_1iesl_39>div::selection{background:var(--field-selection-bg,#b3d4fc);color:var(--field-selection-color,inherit)}._f_1iesl_39>:not(div){color:var(--field-icon-color,var(--field-placeholder));flex:none;justify-content:center;align-items:center;display:inline-flex}._f_1iesl_39>:not(div) svg{width:20px;height:20px}._f_1iesl_39 input::placeholder,._f_1iesl_39 textarea::placeholder{color:var(--field-placeholder);opacity:1;font-weight:400}._f_1iesl_39 input::-webkit-input-placeholder{color:var(--field-placeholder);opacity:1;font-weight:400}._f_1iesl_39 textarea::-webkit-input-placeholder{color:var(--field-placeholder);opacity:1;font-weight:400}._f_1iesl_39 input::-moz-placeholder{color:var(--field-placeholder);opacity:1;font-weight:400}._f_1iesl_39 textarea::-moz-placeholder{color:var(--field-placeholder);opacity:1;font-weight:400}._n_1iesl_128>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))}._w_1iesl_135>div{text-wrap:nowrap;overflow:scroll hidden}._w_1iesl_135>div::-webkit-scrollbar{width:0;height:0}._time_1iesl_145>div{text-wrap:nowrap;align-items:center;min-width:0;display:flex;overflow:visible}._time_1iesl_145 ._timeInner_1iesl_152{justify-content:flex-start;align-items:center;gap:4px;width:100%;min-width:0;display:flex}._time_1iesl_145._timeAlignCenter_1iesl_163 ._timeInner_1iesl_152{justify-content:center}._time_1iesl_145 ._timeSep_1iesl_166{opacity:.65;-webkit-user-select:none;user-select:none;flex:none;padding:0 2px;font-weight:500;transform:translateY(-1px)}._time_1iesl_145 ._timePickerBtn_1iesl_174{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_1iesl_145 ._timePickerBtn_1iesl_174:hover:not(:disabled){color:var(--field-color)}._time_1iesl_145 ._timePickerBtn_1iesl_174:focus-visible{box-shadow:0 0 0 3px var(--field-focus-ring,#0000);border-radius:6px}._time_1iesl_145 ._timePickerBtn_1iesl_174:disabled{cursor:not-allowed;opacity:.5}._time_1iesl_145 ._timePart_1iesl_202{box-sizing:border-box;width:1em;min-width:0;color:inherit;font:inherit;line-height:inherit;text-align:left;min-height:var(--field-height);cursor:text;background:0 0;border:0;border-radius:6px;outline:none;flex:none;margin:0;padding:0}._time_1iesl_145 ._timePart_1iesl_202[contenteditable=false]{cursor:not-allowed;opacity:.7}._time_1iesl_145 ._timePart_1iesl_202:empty:before{content:attr(placeholder);color:var(--field-placeholder);opacity:1;font-weight:400}._time_1iesl_145 ._timePart_1iesl_202:focus:empty:before{content:none}._time_1iesl_145 ._timePart_1iesl_202:focus-visible{background:0 0}._time_1iesl_145._timeAlignCenter_1iesl_163 ._timePart_1iesl_202{text-align:center}._t_1iesl_145{color:var(--field-label-color);font-size:var(--field-label-size);padding-bottom:10px}._affix_1iesl_249{color:var(--field-icon-color,var(--field-placeholder));font-size:inherit;-webkit-user-select:none;user-select:none;flex:none;justify-content:center;align-items:center;margin:0;padding:0;line-height:1;display:inline-flex}._g_1iesl_263{flex-direction:column}._range_1iesl_267>div{box-sizing:border-box;min-width:0;min-height:var(--field-height);flex:1;align-items:center;line-height:normal;display:flex}._range_1iesl_267 ._rangeTrack_1iesl_276{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_1iesl_267 ._rangeTrack_1iesl_276:focus-visible{box-shadow:0 0 0 3px var(--field-focus-ring,#0000)}._range_1iesl_267 ._rangeTrack_1iesl_276[data-disabled=true]{cursor:not-allowed;opacity:.55;pointer-events:none}._range_1iesl_267 ._rangeFill_1iesl_297{background:var(--field-range-fill,#00b5ad);pointer-events:none;border-radius:999px 0 0 999px;width:0;min-width:0;height:100%}._range_1iesl_267 ._rangeFillFull_1iesl_308{border-radius:999px}._checkbox_1iesl_312>div{min-height:var(--field-height);align-items:flex-start;width:100%;padding:0;line-height:normal;display:flex}._checkControl_1iesl_321{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_1iesl_321:focus-visible{box-shadow:0 0 0 3px var(--field-focus-ring,#0000);border-radius:calc(var(--field-radius) - 2px)}._checkControl_1iesl_321[aria-disabled=true]{cursor:not-allowed}._checkBox_1iesl_345{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_1iesl_358{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_1iesl_367{min-width:0;color:inherit;font-size:var(--control-font-size,14px);flex:auto;padding-top:2px;line-height:1.25}._checkControl_1iesl_321[aria-checked=true] ._checkBox_1iesl_345{background:var(--field-background-active)}._h_1iesl_380{--field-border:0}._h_1iesl_380 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_1iesl_380 div[aria-checked=true]{background:var(--field-background-active)}._h_1iesl_380 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_1iesl_64{border-color:var(--field-error-border);background:var(--field-error-background);color:var(--field-error-color)}._m_1iesl_419{color:var(--field-error-color);margin-top:6px;font-size:12px;font-style:normal}._display_1iesl_427>div{color:inherit;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}._displayEmpty_1iesl_434{color:var(--field-placeholder)}._radio_1iesl_439>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_1iesl_450>div{flex-flow:wrap;align-items:center;gap:8px 16px}._radioItem_1iesl_457{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_1iesl_457:focus-visible{box-shadow:0 0 0 3px var(--field-focus-ring,#0000);border-radius:6px}._radioItem_1iesl_457[aria-disabled=true]{cursor:not-allowed;opacity:.7}._radioDot_1iesl_480{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_1iesl_491{background:var(--field-background-active);border-radius:50%;width:10px;height:10px}._radioText_1iesl_498{font-size:var(--control-font-size,14px);line-height:1.25}._tags_1iesl_504>div,._tags_1iesl_504 ._tagsInner_1iesl_505{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_1iesl_505{flex:1;min-width:0}._tagChip_1iesl_522{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_1iesl_533{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}._tagRemove_1iesl_539{color:inherit;cursor:pointer;opacity:.65;background:0 0;border:0;padding:0 2px;font-size:16px;line-height:1}._tagRemove_1iesl_539:hover{opacity:1}._tagInput_1iesl_553{min-width:80px;color:inherit;font:inherit;background:0 0;border:0;outline:none;flex:80px;margin:0;padding:0}._rating_1iesl_566>div{width:100%;min-height:var(--field-height);outline:none;align-items:center;gap:2px;line-height:normal;display:flex}._ratingStar_1iesl_576{color:var(--field-placeholder);cursor:pointer;background:0 0;border:0;outline:none;padding:0 2px;font-size:22px;line-height:1}._ratingStar_1iesl_576:disabled{cursor:not-allowed;opacity:.6}._ratingStar_1iesl_576:focus-visible{box-shadow:0 0 0 3px var(--field-focus-ring,#0000);border-radius:4px}._ratingStarOn_1iesl_595{color:var(--field-range-fill,#34c759)}._code_1iesl_600>div,._code_1iesl_600 ._codeInner_1iesl_601{width:100%;min-height:var(--field-height);align-items:center;gap:8px;line-height:normal;display:flex;overflow:visible}._codeInner_1iesl_601{flex:1;min-width:0}._codeCell_1iesl_616{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_1iesl_616:focus{border-color:var(--field-border-focus,var(--field-border));box-shadow:0 0 0 3px var(--field-focus-ring,#0000)}._codeCell_1iesl_616:disabled{opacity:.6;cursor:not-allowed}._file_1iesl_641>div,._file_1iesl_641 ._fileInner_1iesl_642{width:100%;min-height:var(--field-height);align-items:center;gap:10px;line-height:normal;display:flex;overflow:visible}._fileInner_1iesl_642{flex:1;min-width:0;position:relative}._fileInput_1iesl_658{opacity:0;pointer-events:none;width:1px;height:1px;position:absolute}._fileButton_1iesl_666{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_1iesl_666:disabled{cursor:not-allowed;opacity:.6}._fileList_1iesl_683{flex-direction:column;flex:1;gap:2px;min-width:0;display:flex;overflow:hidden}._fileEmpty_1iesl_692{color:var(--field-placeholder);font-size:13px}._fileItem_1iesl_697{align-items:baseline;gap:8px;min-width:0;display:flex}._fileName_1iesl_704{text-overflow:ellipsis;white-space:nowrap;font-size:13px;overflow:hidden}._fileSize_1iesl_711{color:var(--field-placeholder);flex:none;font-size:12px}._fileClear_1iesl_717{color:inherit;cursor:pointer;opacity:.65;background:0 0;border:0;flex:none;padding:0 2px;font-size:18px;line-height:1}._fileClear_1iesl_717:hover{opacity:1}._rich_1iesl_733{align-items:stretch}._rich_1iesl_733>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_1iesl_746{flex-direction:column;align-items:flex-start;width:100%;min-width:0;display:flex}._richToolbar_1iesl_754{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_1iesl_768{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_1iesl_768:hover:not(:disabled){background:var(--field-background-focus,#0000000f)}._richBtn_1iesl_768:disabled{opacity:.5;cursor:not-allowed}._richEditor_1iesl_797{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);outline:none}._richEditor_1iesl_797:empty:before{content:attr(placeholder);color:var(--field-placeholder);pointer-events:none}._richEditor_1iesl_797 ul,._richEditor_1iesl_797 ol{margin:.25em 0;padding-left:1.25em}._dragDrop_1iesl_818{align-items:stretch;overflow:visible;box-shadow:none!important;background:0 0!important;border:0!important;padding:0!important}._dragDrop_1iesl_818>div{min-height:auto;padding:0;line-height:normal;display:block;overflow:visible}._dragDrop_1iesl_818[data-dragging=true]{background:0 0!important}._dragDropInner_1iesl_837{flex-direction:column;gap:16px;width:100%;min-width:0;display:flex;position:relative}._dragDropZone_1iesl_846{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_1iesl_846:hover:not(:disabled){background:var(--field-background-focus,#00000008);border-color:#8e8e93}._dragDropZone_1iesl_846[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_1iesl_846:focus-visible{box-shadow:0 0 0 3px var(--field-focus-ring,#0000)}._dragDropZone_1iesl_846:disabled{cursor:not-allowed;opacity:.65}._dragDropHint_1iesl_884{font-size:var(--control-font-size,14px);color:inherit;line-height:1.35}._dragDropAccept_1iesl_890{color:var(--field-placeholder);letter-spacing:.01em;font-size:12px}._dragDropList_1iesl_896{flex-direction:column;gap:6px;margin:4px 0 0;padding:0;list-style:none;display:flex}._dragDropItem_1iesl_905{background:var(--field-background-focus,#0000000a);border-radius:10px;align-items:center;gap:10px;min-width:0;padding:8px 10px;display:flex}._dragDropMeta_1iesl_915{flex-direction:column;flex:1;gap:2px;min-width:0;display:flex}._dragDropName_1iesl_923{text-overflow:ellipsis;white-space:nowrap;font-size:var(--control-font-size,14px);color:inherit;line-height:1.3;overflow:hidden}._dragDropSize_1iesl_932{color:var(--field-placeholder);font-size:12px;line-height:1.2}._dragDropRemove_1iesl_938{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_1iesl_938:hover{color:var(--field-error-color,#d70015);background:color-mix(in srgb, var(--field-error-color,#d70015) 10%, transparent)}._dragDropClearAll_1iesl_959{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_1iesl_959:hover{color:var(--field-error-color,#d70015)}
|
package/dist/core/Field.js
CHANGED
|
@@ -5,7 +5,7 @@
|
|
|
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_1to3e_2{min-width:var(--field-width);gap:var(--field-block-gap,0);flex-direction:column;margin:0;padding:0;display:flex;position:relative}._l_1to3e_2>dt,._l_1to3e_2>dd{margin:0}._l_1to3e_2[data-field=group] div{cursor:pointer;border-bottom:var(--field-border);padding:var(--field-padding);margin:0}._l_1to3e_2[data-field=group] div:last-child{border-bottom:0}._l_1to3e_2 [placeholder]:empty:before{content:attr(placeholder);color:var(--field-placeholder);opacity:1;font-style:normal;font-weight:400;display:block}._l_1to3e_2 [placeholder]:focus:before{display:none}._f_1to3e_38{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_1to3e_38:hover{border-color:var(--field-border-hover,var(--field-border))}._f_1to3e_38: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_1to3e_38._e_1to3e_63:focus-within{background:var(--field-error-background);color:var(--field-error-color)}._f_1to3e_38[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_1to3e_38[data-disabled=true]>*{cursor:not-allowed}._f_1to3e_38>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_1to3e_38>div::selection{background:var(--field-selection-bg,#b3d4fc);color:var(--field-selection-color,inherit)}._f_1to3e_38>:not(div){color:var(--field-icon-color,var(--field-placeholder));flex:none;justify-content:center;align-items:center;display:inline-flex}._f_1to3e_38>:not(div) svg{width:20px;height:20px}._f_1to3e_38 input::placeholder,._f_1to3e_38 textarea::placeholder{color:var(--field-placeholder);opacity:1;font-weight:400}._f_1to3e_38 input::-webkit-input-placeholder{color:var(--field-placeholder);opacity:1;font-weight:400}._f_1to3e_38 textarea::-webkit-input-placeholder{color:var(--field-placeholder);opacity:1;font-weight:400}._f_1to3e_38 input::-moz-placeholder{color:var(--field-placeholder);opacity:1;font-weight:400}._f_1to3e_38 textarea::-moz-placeholder{color:var(--field-placeholder);opacity:1;font-weight:400}._n_1to3e_127 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))}._w_1to3e_134>div{text-wrap:nowrap;overflow:scroll hidden}._w_1to3e_134>div::-webkit-scrollbar{width:0;height:0}._time_1to3e_144>div{text-wrap:nowrap;align-items:center;min-width:0;display:flex;overflow:visible}._time_1to3e_144 ._timeInner_1to3e_151{justify-content:flex-start;align-items:center;gap:4px;width:100%;min-width:0;display:flex}._time_1to3e_144._timeAlignCenter_1to3e_162 ._timeInner_1to3e_151{justify-content:center}._time_1to3e_144 ._timeSep_1to3e_165{opacity:.65;-webkit-user-select:none;user-select:none;flex:none;padding:0 2px;font-weight:500;transform:translateY(-1px)}._time_1to3e_144 ._timePart_1to3e_176{box-sizing:border-box;width:1em;min-width:0;color:inherit;font:inherit;line-height:inherit;text-align:left;min-height:var(--field-height);cursor:text;background:0 0;border:0;border-radius:6px;outline:none;flex:none;margin:0;padding:0}._time_1to3e_144 ._timePart_1to3e_176[contenteditable=false]{cursor:not-allowed;opacity:.7}._time_1to3e_144 ._timePart_1to3e_176:empty:before{content:attr(placeholder);color:var(--field-placeholder);opacity:1;font-weight:400}._time_1to3e_144 ._timePart_1to3e_176:focus:empty:before{content:none}._time_1to3e_144 ._timePart_1to3e_176:focus-visible{background:0 0}._time_1to3e_144._timeAlignCenter_1to3e_162 ._timePart_1to3e_176{text-align:center}._t_1to3e_144{color:var(--field-label-color);font-size:var(--field-label-size);padding-bottom:10px}._affix_1to3e_223{color:var(--field-icon-color,var(--field-placeholder));font-size:inherit;-webkit-user-select:none;user-select:none;flex:none;justify-content:center;align-items:center;margin:0;padding:0;line-height:1;display:inline-flex}._g_1to3e_237{flex-direction:column}._range_1to3e_241>div{box-sizing:border-box;min-width:0;min-height:var(--field-height);flex:1;align-items:center;line-height:normal;display:flex}._range_1to3e_241 ._rangeTrack_1to3e_250{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_1to3e_241 ._rangeTrack_1to3e_250:focus-visible{box-shadow:0 0 0 3px var(--field-focus-ring,#0000)}._range_1to3e_241 ._rangeTrack_1to3e_250[data-disabled=true]{cursor:not-allowed;opacity:.55;pointer-events:none}._range_1to3e_241 ._rangeFill_1to3e_271{background:var(--field-range-fill,#00b5ad);pointer-events:none;border-radius:999px 0 0 999px;width:0;min-width:0;height:100%}._range_1to3e_241 ._rangeFillFull_1to3e_282{border-radius:999px}._checkbox_1to3e_286>div{min-height:var(--field-height);align-items:flex-start;width:100%;padding:0;line-height:normal;display:flex}._checkControl_1to3e_295{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_1to3e_295:focus-visible{box-shadow:0 0 0 3px var(--field-focus-ring,#0000);border-radius:calc(var(--field-radius) - 2px)}._checkControl_1to3e_295[aria-disabled=true]{cursor:not-allowed}._checkBox_1to3e_319{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_1to3e_332{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_1to3e_341{min-width:0;color:inherit;font-size:var(--control-font-size,14px);flex:auto;padding-top:2px;line-height:1.25}._checkControl_1to3e_295[aria-checked=true] ._checkBox_1to3e_319{background:var(--field-background-active)}._h_1to3e_354{--field-border:0}._h_1to3e_354 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_1to3e_354 div[aria-checked=true]{background:var(--field-background-active)}._h_1to3e_354 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_1to3e_63{border-color:var(--field-error-border);background:var(--field-error-background);color:var(--field-error-color)}._m_1to3e_393{color:var(--field-error-color);margin-top:6px;font-size:12px;font-style:normal}\n\n._o_14hhr_2{z-index:98;background:0 0;position:fixed;inset:0}._c_14hhr_13{background:var(--select-background);z-index:99;max-height:min(92vh,480px);color:var(--select-color,#333);box-sizing:border-box;border-radius:10px;min-width:259px;margin:0;padding:10px 12px 12px;display:block;position:fixed;overflow:hidden auto;box-shadow:5px 7px 18px #000000a8}._c_14hhr_13 [grid-calendar]{grid-template-columns:repeat(7,1fr);grid-auto-rows:34px;gap:2px;display:grid}._c_14hhr_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_14hhr_13 [grid-month]{grid-template-columns:1fr 1fr 1fr 1fr;width:250px;display:grid}._c_14hhr_13 b{cursor:pointer;text-align:center;border-radius:5px;padding:8px 5px;font-weight:400;display:block}._c_14hhr_13 b.__active_14hhr_64{background:var(--bg-select-active)}._c_14hhr_13 b:hover{background:var(--bg-select-hover)}._c_14hhr_13 p{color:var(--color-placeholder);text-align:center;cursor:default;pointer-events:none;padding:0}._c_14hhr_13 i{text-align:center;cursor:pointer;border-radius:5px;flex:0 30px;padding:9px}._c_14hhr_13 i:hover{background:var(--bg-select-hover)}._c_14hhr_13 i:before{cursor:pointer;display:block}._c_14hhr_13 s{align-items:center;gap:4px;padding-bottom:6px;font-style:normal;text-decoration:none;display:flex}._c_14hhr_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_14hhr_13 ._dateHeaderMonth_14hhr_119,._c_14hhr_13 ._dateHeaderYear_14hhr_119{cursor:pointer;-webkit-user-select:none;user-select:none;white-space:nowrap;border-radius:6px;padding:2px 8px}._c_14hhr_13 ._dateHeaderMonth_14hhr_119:hover,._c_14hhr_13 ._dateHeaderYear_14hhr_119:hover{background:var(--bg-select-hover)}._c_14hhr_13 ._dateHeaderDisabled_14hhr_129{cursor:not-allowed;opacity:.45;pointer-events:none}._c_14hhr_13 ._dateHeaderDisabled_14hhr_129[data-active=true],._c_14hhr_13 ._dateHeaderDisabled_14hhr_129[data-current=true]{opacity:.45}._c_14hhr_13 [grid-calendar] b[data-current=true],._c_14hhr_13 [grid-month] b[data-current=true]{background:color-mix(in srgb, var(--field-background-active) 52%, transparent);font-weight:600}._c_14hhr_13 [grid-calendar] b[data-active=true]:not([data-current=true]),._c_14hhr_13 [grid-month] b[data-active=true]:not([data-current=true]){outline:2px solid var(--field-background-active);outline-offset:-2px}._c_14hhr_13 [grid-calendar] b[data-active=true][data-current=true],._c_14hhr_13 [grid-month] b[data-active=true][data-current=true]{box-shadow:inset 0 0 0 2px var(--field-background-active)}._c_14hhr_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_14hhr_13 [grid-calendar] p[data-active=true]:not([data-current=true]){outline:2px solid var(--field-background-active);outline-offset:-2px;opacity:.85}._c_14hhr_13 [grid-calendar] p[data-active=true][data-current=true]{box-shadow:inset 0 0 0 2px var(--field-background-active)}._c_14hhr_13 span{text-align:center;padding:2px}._c_14hhr_13 span p{color:var(--color-placeholder);padding:8px 5px}._c_14hhr_13 [grid-calendar]>span{box-sizing:border-box;justify-content:stretch;align-items:stretch;min-height:0;padding:0;display:flex}._c_14hhr_13 [grid-calendar]>span>b,._c_14hhr_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_14hhr_13 ._as_14hhr_196{cursor:ns-resize}._c_14hhr_13 ._ap_14hhr_199{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_12209_20{z-index:98;background:var(--select-overlay);position:fixed;inset:0}._l_12209_30{background:var(--select-background);z-index:99;border-radius:20px;max-height:300px;margin:0;padding:0;display:block;position:fixed;overflow:scroll}._l_12209_30::-webkit-scrollbar{width:0;height:0}._l_12209_30 ul{width:100%;max-height:300px;margin:0;padding:0;list-style:none;display:block;overflow:hidden auto}._l_12209_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_12209_30 li[aria-selected=true]{background:var(--select-li-selected-bg,var(--select-li-hover-bg))}._l_12209_30 li:hover{background:var(--select-li-hover-bg,#f2f2f7)}._l_12209_30 li[data-focus=true]{background:var(--select-li-focus-bg,#e5e5ea)}._l_12209_30 li:last-child{border-bottom:0}._i_12209_93{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_12209_103{color:var(--field-placeholder);font-weight:400}._f_12209_108{cursor:pointer}._f_12209_108[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_1937d_14{z-index:98;background:var(--select-overlay,transparent);position:fixed;inset:0}._panel_1937d_21{z-index:99;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_1937d_37{aspect-ratio:1/.55;cursor:crosshair;touch-action:none;border-radius:8px;width:100%;max-height:140px;position:relative;overflow:hidden}._svWhite_1937d_48{background:linear-gradient(90deg,#fff,#0000);position:absolute;inset:0}._svBlack_1937d_54{background:linear-gradient(#0000,#000);position:absolute;inset:0}._handle_1937d_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_1937d_72{align-items:center;gap:8px;display:flex}._eyedropper_1937d_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_1937d_78:hover{color:var(--field-color,#fff)}._sliders_1937d_72{flex-direction:column;flex:1;gap:8px;min-width:0;display:flex}._slider_1937d_72{cursor:pointer;touch-action:none;border-radius:999px;height:10px;position:relative}._sliderHue_1937d_113{background:linear-gradient(90deg,red 0%,#ff0 17%,#0f0 33%,#0ff 50%,#00f 67%,#f0f 83%,red 100%)}._sliderAlpha_1937d_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_1937d_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_1937d_139{align-items:center;gap:6px;display:flex}._format_1937d_145{color:var(--field-placeholder,#8e8e93);flex:none;padding:0 2px;font-size:12px}._input_1937d_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_1937d_139:focus{box-shadow:0 0 0 2px var(--field-focus-ring,#fff3)}._inputAlpha_1937d_171{text-align:center;flex:0 0 56px}._palette_1937d_176{grid-template-columns:repeat(8,1fr);place-items:center;gap:4px;padding:0;display:grid}._swatchBtn_1937d_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_1937d_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_1937d_185:disabled{cursor:not-allowed;opacity:.5}._trigger_1937d_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_1937d_210[aria-disabled=true]{cursor:not-allowed}._preview_1937d_224{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-color:#eee;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_1937d_236{text-overflow:ellipsis;white-space:nowrap;min-width:0;font-size:var(--control-font-size,17px);flex:1;overflow:hidden}._placeholder_1937d_245{color:var(--field-placeholder,#8e8e93);font-weight:400}\n";
|
|
8
|
+
el.textContent = "._l_1iesl_2{min-width:var(--field-width);gap:var(--field-block-gap,0);flex-direction:column;margin:0;padding:0;display:flex;position:relative}._l_1iesl_2>dt,._l_1iesl_2>dd{margin:0}._l_1iesl_2[data-field=group] div{cursor:pointer;border-bottom:var(--field-border);padding:var(--field-padding);margin:0}._l_1iesl_2[data-field=group] div:last-child{border-bottom:0}._l_1iesl_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_1iesl_2 [placeholder]:focus:before{display:none}._f_1iesl_39{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_1iesl_39:hover{border-color:var(--field-border-hover,var(--field-border))}._f_1iesl_39: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_1iesl_39._e_1iesl_64:focus-within{background:var(--field-error-background);color:var(--field-error-color)}._f_1iesl_39[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_1iesl_39[data-disabled=true]>*{cursor:not-allowed}._f_1iesl_39>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_1iesl_39>div::selection{background:var(--field-selection-bg,#b3d4fc);color:var(--field-selection-color,inherit)}._f_1iesl_39>:not(div){color:var(--field-icon-color,var(--field-placeholder));flex:none;justify-content:center;align-items:center;display:inline-flex}._f_1iesl_39>:not(div) svg{width:20px;height:20px}._f_1iesl_39 input::placeholder,._f_1iesl_39 textarea::placeholder{color:var(--field-placeholder);opacity:1;font-weight:400}._f_1iesl_39 input::-webkit-input-placeholder{color:var(--field-placeholder);opacity:1;font-weight:400}._f_1iesl_39 textarea::-webkit-input-placeholder{color:var(--field-placeholder);opacity:1;font-weight:400}._f_1iesl_39 input::-moz-placeholder{color:var(--field-placeholder);opacity:1;font-weight:400}._f_1iesl_39 textarea::-moz-placeholder{color:var(--field-placeholder);opacity:1;font-weight:400}._n_1iesl_128>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))}._w_1iesl_135>div{text-wrap:nowrap;overflow:scroll hidden}._w_1iesl_135>div::-webkit-scrollbar{width:0;height:0}._time_1iesl_145>div{text-wrap:nowrap;align-items:center;min-width:0;display:flex;overflow:visible}._time_1iesl_145 ._timeInner_1iesl_152{justify-content:flex-start;align-items:center;gap:4px;width:100%;min-width:0;display:flex}._time_1iesl_145._timeAlignCenter_1iesl_163 ._timeInner_1iesl_152{justify-content:center}._time_1iesl_145 ._timeSep_1iesl_166{opacity:.65;-webkit-user-select:none;user-select:none;flex:none;padding:0 2px;font-weight:500;transform:translateY(-1px)}._time_1iesl_145 ._timePickerBtn_1iesl_174{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_1iesl_145 ._timePickerBtn_1iesl_174:hover:not(:disabled){color:var(--field-color)}._time_1iesl_145 ._timePickerBtn_1iesl_174:focus-visible{box-shadow:0 0 0 3px var(--field-focus-ring,#0000);border-radius:6px}._time_1iesl_145 ._timePickerBtn_1iesl_174:disabled{cursor:not-allowed;opacity:.5}._time_1iesl_145 ._timePart_1iesl_202{box-sizing:border-box;width:1em;min-width:0;color:inherit;font:inherit;line-height:inherit;text-align:left;min-height:var(--field-height);cursor:text;background:0 0;border:0;border-radius:6px;outline:none;flex:none;margin:0;padding:0}._time_1iesl_145 ._timePart_1iesl_202[contenteditable=false]{cursor:not-allowed;opacity:.7}._time_1iesl_145 ._timePart_1iesl_202:empty:before{content:attr(placeholder);color:var(--field-placeholder);opacity:1;font-weight:400}._time_1iesl_145 ._timePart_1iesl_202:focus:empty:before{content:none}._time_1iesl_145 ._timePart_1iesl_202:focus-visible{background:0 0}._time_1iesl_145._timeAlignCenter_1iesl_163 ._timePart_1iesl_202{text-align:center}._t_1iesl_145{color:var(--field-label-color);font-size:var(--field-label-size);padding-bottom:10px}._affix_1iesl_249{color:var(--field-icon-color,var(--field-placeholder));font-size:inherit;-webkit-user-select:none;user-select:none;flex:none;justify-content:center;align-items:center;margin:0;padding:0;line-height:1;display:inline-flex}._g_1iesl_263{flex-direction:column}._range_1iesl_267>div{box-sizing:border-box;min-width:0;min-height:var(--field-height);flex:1;align-items:center;line-height:normal;display:flex}._range_1iesl_267 ._rangeTrack_1iesl_276{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_1iesl_267 ._rangeTrack_1iesl_276:focus-visible{box-shadow:0 0 0 3px var(--field-focus-ring,#0000)}._range_1iesl_267 ._rangeTrack_1iesl_276[data-disabled=true]{cursor:not-allowed;opacity:.55;pointer-events:none}._range_1iesl_267 ._rangeFill_1iesl_297{background:var(--field-range-fill,#00b5ad);pointer-events:none;border-radius:999px 0 0 999px;width:0;min-width:0;height:100%}._range_1iesl_267 ._rangeFillFull_1iesl_308{border-radius:999px}._checkbox_1iesl_312>div{min-height:var(--field-height);align-items:flex-start;width:100%;padding:0;line-height:normal;display:flex}._checkControl_1iesl_321{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_1iesl_321:focus-visible{box-shadow:0 0 0 3px var(--field-focus-ring,#0000);border-radius:calc(var(--field-radius) - 2px)}._checkControl_1iesl_321[aria-disabled=true]{cursor:not-allowed}._checkBox_1iesl_345{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_1iesl_358{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_1iesl_367{min-width:0;color:inherit;font-size:var(--control-font-size,14px);flex:auto;padding-top:2px;line-height:1.25}._checkControl_1iesl_321[aria-checked=true] ._checkBox_1iesl_345{background:var(--field-background-active)}._h_1iesl_380{--field-border:0}._h_1iesl_380 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_1iesl_380 div[aria-checked=true]{background:var(--field-background-active)}._h_1iesl_380 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_1iesl_64{border-color:var(--field-error-border);background:var(--field-error-background);color:var(--field-error-color)}._m_1iesl_419{color:var(--field-error-color);margin-top:6px;font-size:12px;font-style:normal}._display_1iesl_427>div{color:inherit;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}._displayEmpty_1iesl_434{color:var(--field-placeholder)}._radio_1iesl_439>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_1iesl_450>div{flex-flow:wrap;align-items:center;gap:8px 16px}._radioItem_1iesl_457{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_1iesl_457:focus-visible{box-shadow:0 0 0 3px var(--field-focus-ring,#0000);border-radius:6px}._radioItem_1iesl_457[aria-disabled=true]{cursor:not-allowed;opacity:.7}._radioDot_1iesl_480{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_1iesl_491{background:var(--field-background-active);border-radius:50%;width:10px;height:10px}._radioText_1iesl_498{font-size:var(--control-font-size,14px);line-height:1.25}._tags_1iesl_504>div,._tags_1iesl_504 ._tagsInner_1iesl_505{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_1iesl_505{flex:1;min-width:0}._tagChip_1iesl_522{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_1iesl_533{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}._tagRemove_1iesl_539{color:inherit;cursor:pointer;opacity:.65;background:0 0;border:0;padding:0 2px;font-size:16px;line-height:1}._tagRemove_1iesl_539:hover{opacity:1}._tagInput_1iesl_553{min-width:80px;color:inherit;font:inherit;background:0 0;border:0;outline:none;flex:80px;margin:0;padding:0}._rating_1iesl_566>div{width:100%;min-height:var(--field-height);outline:none;align-items:center;gap:2px;line-height:normal;display:flex}._ratingStar_1iesl_576{color:var(--field-placeholder);cursor:pointer;background:0 0;border:0;outline:none;padding:0 2px;font-size:22px;line-height:1}._ratingStar_1iesl_576:disabled{cursor:not-allowed;opacity:.6}._ratingStar_1iesl_576:focus-visible{box-shadow:0 0 0 3px var(--field-focus-ring,#0000);border-radius:4px}._ratingStarOn_1iesl_595{color:var(--field-range-fill,#34c759)}._code_1iesl_600>div,._code_1iesl_600 ._codeInner_1iesl_601{width:100%;min-height:var(--field-height);align-items:center;gap:8px;line-height:normal;display:flex;overflow:visible}._codeInner_1iesl_601{flex:1;min-width:0}._codeCell_1iesl_616{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_1iesl_616:focus{border-color:var(--field-border-focus,var(--field-border));box-shadow:0 0 0 3px var(--field-focus-ring,#0000)}._codeCell_1iesl_616:disabled{opacity:.6;cursor:not-allowed}._file_1iesl_641>div,._file_1iesl_641 ._fileInner_1iesl_642{width:100%;min-height:var(--field-height);align-items:center;gap:10px;line-height:normal;display:flex;overflow:visible}._fileInner_1iesl_642{flex:1;min-width:0;position:relative}._fileInput_1iesl_658{opacity:0;pointer-events:none;width:1px;height:1px;position:absolute}._fileButton_1iesl_666{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_1iesl_666:disabled{cursor:not-allowed;opacity:.6}._fileList_1iesl_683{flex-direction:column;flex:1;gap:2px;min-width:0;display:flex;overflow:hidden}._fileEmpty_1iesl_692{color:var(--field-placeholder);font-size:13px}._fileItem_1iesl_697{align-items:baseline;gap:8px;min-width:0;display:flex}._fileName_1iesl_704{text-overflow:ellipsis;white-space:nowrap;font-size:13px;overflow:hidden}._fileSize_1iesl_711{color:var(--field-placeholder);flex:none;font-size:12px}._fileClear_1iesl_717{color:inherit;cursor:pointer;opacity:.65;background:0 0;border:0;flex:none;padding:0 2px;font-size:18px;line-height:1}._fileClear_1iesl_717:hover{opacity:1}._rich_1iesl_733{align-items:stretch}._rich_1iesl_733>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_1iesl_746{flex-direction:column;align-items:flex-start;width:100%;min-width:0;display:flex}._richToolbar_1iesl_754{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_1iesl_768{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_1iesl_768:hover:not(:disabled){background:var(--field-background-focus,#0000000f)}._richBtn_1iesl_768:disabled{opacity:.5;cursor:not-allowed}._richEditor_1iesl_797{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);outline:none}._richEditor_1iesl_797:empty:before{content:attr(placeholder);color:var(--field-placeholder);pointer-events:none}._richEditor_1iesl_797 ul,._richEditor_1iesl_797 ol{margin:.25em 0;padding-left:1.25em}._dragDrop_1iesl_818{align-items:stretch;overflow:visible;box-shadow:none!important;background:0 0!important;border:0!important;padding:0!important}._dragDrop_1iesl_818>div{min-height:auto;padding:0;line-height:normal;display:block;overflow:visible}._dragDrop_1iesl_818[data-dragging=true]{background:0 0!important}._dragDropInner_1iesl_837{flex-direction:column;gap:16px;width:100%;min-width:0;display:flex;position:relative}._dragDropZone_1iesl_846{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_1iesl_846:hover:not(:disabled){background:var(--field-background-focus,#00000008);border-color:#8e8e93}._dragDropZone_1iesl_846[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_1iesl_846:focus-visible{box-shadow:0 0 0 3px var(--field-focus-ring,#0000)}._dragDropZone_1iesl_846:disabled{cursor:not-allowed;opacity:.65}._dragDropHint_1iesl_884{font-size:var(--control-font-size,14px);color:inherit;line-height:1.35}._dragDropAccept_1iesl_890{color:var(--field-placeholder);letter-spacing:.01em;font-size:12px}._dragDropList_1iesl_896{flex-direction:column;gap:6px;margin:4px 0 0;padding:0;list-style:none;display:flex}._dragDropItem_1iesl_905{background:var(--field-background-focus,#0000000a);border-radius:10px;align-items:center;gap:10px;min-width:0;padding:8px 10px;display:flex}._dragDropMeta_1iesl_915{flex-direction:column;flex:1;gap:2px;min-width:0;display:flex}._dragDropName_1iesl_923{text-overflow:ellipsis;white-space:nowrap;font-size:var(--control-font-size,14px);color:inherit;line-height:1.3;overflow:hidden}._dragDropSize_1iesl_932{color:var(--field-placeholder);font-size:12px;line-height:1.2}._dragDropRemove_1iesl_938{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_1iesl_938:hover{color:var(--field-error-color,#d70015);background:color-mix(in srgb, var(--field-error-color,#d70015) 10%, transparent)}._dragDropClearAll_1iesl_959{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_1iesl_959:hover{color:var(--field-error-color,#d70015)}\n\n._o_14hhr_2{z-index:98;background:0 0;position:fixed;inset:0}._c_14hhr_13{background:var(--select-background);z-index:99;max-height:min(92vh,480px);color:var(--select-color,#333);box-sizing:border-box;border-radius:10px;min-width:259px;margin:0;padding:10px 12px 12px;display:block;position:fixed;overflow:hidden auto;box-shadow:5px 7px 18px #000000a8}._c_14hhr_13 [grid-calendar]{grid-template-columns:repeat(7,1fr);grid-auto-rows:34px;gap:2px;display:grid}._c_14hhr_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_14hhr_13 [grid-month]{grid-template-columns:1fr 1fr 1fr 1fr;width:250px;display:grid}._c_14hhr_13 b{cursor:pointer;text-align:center;border-radius:5px;padding:8px 5px;font-weight:400;display:block}._c_14hhr_13 b.__active_14hhr_64{background:var(--bg-select-active)}._c_14hhr_13 b:hover{background:var(--bg-select-hover)}._c_14hhr_13 p{color:var(--color-placeholder);text-align:center;cursor:default;pointer-events:none;padding:0}._c_14hhr_13 i{text-align:center;cursor:pointer;border-radius:5px;flex:0 30px;padding:9px}._c_14hhr_13 i:hover{background:var(--bg-select-hover)}._c_14hhr_13 i:before{cursor:pointer;display:block}._c_14hhr_13 s{align-items:center;gap:4px;padding-bottom:6px;font-style:normal;text-decoration:none;display:flex}._c_14hhr_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_14hhr_13 ._dateHeaderMonth_14hhr_119,._c_14hhr_13 ._dateHeaderYear_14hhr_119{cursor:pointer;-webkit-user-select:none;user-select:none;white-space:nowrap;border-radius:6px;padding:2px 8px}._c_14hhr_13 ._dateHeaderMonth_14hhr_119:hover,._c_14hhr_13 ._dateHeaderYear_14hhr_119:hover{background:var(--bg-select-hover)}._c_14hhr_13 ._dateHeaderDisabled_14hhr_129{cursor:not-allowed;opacity:.45;pointer-events:none}._c_14hhr_13 ._dateHeaderDisabled_14hhr_129[data-active=true],._c_14hhr_13 ._dateHeaderDisabled_14hhr_129[data-current=true]{opacity:.45}._c_14hhr_13 [grid-calendar] b[data-current=true],._c_14hhr_13 [grid-month] b[data-current=true]{background:color-mix(in srgb, var(--field-background-active) 52%, transparent);font-weight:600}._c_14hhr_13 [grid-calendar] b[data-active=true]:not([data-current=true]),._c_14hhr_13 [grid-month] b[data-active=true]:not([data-current=true]){outline:2px solid var(--field-background-active);outline-offset:-2px}._c_14hhr_13 [grid-calendar] b[data-active=true][data-current=true],._c_14hhr_13 [grid-month] b[data-active=true][data-current=true]{box-shadow:inset 0 0 0 2px var(--field-background-active)}._c_14hhr_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_14hhr_13 [grid-calendar] p[data-active=true]:not([data-current=true]){outline:2px solid var(--field-background-active);outline-offset:-2px;opacity:.85}._c_14hhr_13 [grid-calendar] p[data-active=true][data-current=true]{box-shadow:inset 0 0 0 2px var(--field-background-active)}._c_14hhr_13 span{text-align:center;padding:2px}._c_14hhr_13 span p{color:var(--color-placeholder);padding:8px 5px}._c_14hhr_13 [grid-calendar]>span{box-sizing:border-box;justify-content:stretch;align-items:stretch;min-height:0;padding:0;display:flex}._c_14hhr_13 [grid-calendar]>span>b,._c_14hhr_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_14hhr_13 ._as_14hhr_196{cursor:ns-resize}._c_14hhr_13 ._ap_14hhr_199{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_12209_20{z-index:98;background:var(--select-overlay);position:fixed;inset:0}._l_12209_30{background:var(--select-background);z-index:99;border-radius:20px;max-height:300px;margin:0;padding:0;display:block;position:fixed;overflow:scroll}._l_12209_30::-webkit-scrollbar{width:0;height:0}._l_12209_30 ul{width:100%;max-height:300px;margin:0;padding:0;list-style:none;display:block;overflow:hidden auto}._l_12209_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_12209_30 li[aria-selected=true]{background:var(--select-li-selected-bg,var(--select-li-hover-bg))}._l_12209_30 li:hover{background:var(--select-li-hover-bg,#f2f2f7)}._l_12209_30 li[data-focus=true]{background:var(--select-li-focus-bg,#e5e5ea)}._l_12209_30 li:last-child{border-bottom:0}._i_12209_93{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_12209_103{color:var(--field-placeholder);font-weight:400}._f_12209_108{cursor:pointer}._f_12209_108[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_ftvr3_14{z-index:98;background:var(--select-overlay,transparent);position:fixed;inset:0}._panel_ftvr3_21{z-index:99;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_ftvr3_37{aspect-ratio:1/.55;cursor:crosshair;touch-action:none;border-radius:8px;width:100%;max-height:140px;position:relative;overflow:hidden}._svWhite_ftvr3_48{background:linear-gradient(90deg,#fff,#0000);position:absolute;inset:0}._svBlack_ftvr3_54{background:linear-gradient(#0000,#000);position:absolute;inset:0}._handle_ftvr3_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_ftvr3_72{align-items:center;gap:8px;display:flex}._eyedropper_ftvr3_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_ftvr3_78:hover{color:var(--field-color,#fff)}._sliders_ftvr3_72{flex-direction:column;flex:1;gap:8px;min-width:0;display:flex}._slider_ftvr3_72{cursor:pointer;touch-action:none;border-radius:999px;height:10px;position:relative}._sliderHue_ftvr3_113{background:linear-gradient(90deg,red 0%,#ff0 17%,#0f0 33%,#0ff 50%,#00f 67%,#f0f 83%,red 100%)}._sliderAlpha_ftvr3_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_ftvr3_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_ftvr3_139{align-items:center;gap:6px;display:flex}._format_ftvr3_145{color:var(--field-placeholder,#8e8e93);flex:none;padding:0 2px;font-size:12px}._input_ftvr3_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_ftvr3_139:focus{box-shadow:0 0 0 2px var(--field-focus-ring,#fff3)}._inputAlpha_ftvr3_171{text-align:center;flex:0 0 56px}._palette_ftvr3_176{grid-template-columns:repeat(8,1fr);place-items:center;gap:4px;padding:0;display:grid}._swatchBtn_ftvr3_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_ftvr3_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_ftvr3_185:disabled{cursor:not-allowed;opacity:.5}._trigger_ftvr3_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_ftvr3_210[aria-disabled=true]{cursor:not-allowed}._preview_ftvr3_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_ftvr3_237{text-overflow:ellipsis;white-space:nowrap;min-width:0;font-size:var(--control-font-size,17px);flex:1;overflow:hidden}._placeholder_ftvr3_246{color:var(--field-placeholder,#8e8e93);font-weight:400}\n";
|
|
9
9
|
document.head.appendChild(el);
|
|
10
10
|
})();
|
|
11
11
|
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import { TInput } from './type';
|
|
2
|
+
/** CodeField / OTP — код из N ячеек. Значение: строка цифр. */
|
|
3
|
+
export type TCode = TInput & {
|
|
4
|
+
length?: number;
|
|
5
|
+
/** Только цифры (по умолчанию) */
|
|
6
|
+
numeric?: boolean;
|
|
7
|
+
};
|
|
8
|
+
declare function CodeField({ value, form, onValue, onBlur: onBlurField, name, placeholder, label, error, hidden, disabled, className, after, before, length, numeric, autoComplete, }: TCode): import("react/jsx-runtime").JSX.Element | null;
|
|
9
|
+
declare namespace CodeField {
|
|
10
|
+
var displayName: string;
|
|
11
|
+
}
|
|
12
|
+
/** Алиас OTP */
|
|
13
|
+
export { CodeField as OtpField };
|
|
14
|
+
export default CodeField;
|
|
@@ -0,0 +1,94 @@
|
|
|
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 };
|