@daracl/form 0.0.17 → 0.0.19

package/dist/index.min.cjs

@@ -0,0 +1,171 @@
+/*!
+* @daracl/form v0.0.19
+* Copyright 2023-2026 darainfo;
+* Licensed MIT
+*/
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const g=require("@daracl/core"),le={"&":"&amp;","<":"&lt;",">":"&gt;",'"':"&quot;","'":"&#39;"},Z=l=>{let e=l;return e&&Object.keys(le).forEach(t=>{e=e.replaceAll(t,le[t])}),e},qe=(l,e)=>l.hasOwnProperty(e),D=l=>l===null||l===""||typeof l>"u"||typeof l=="string"&&(l===""||l.replace(/\s/g,"")===""),E=l=>typeof l>"u",Ee=l=>typeof l=="function",ae=l=>typeof l=="string",M=l=>D(l)?!1:(l=+l,!isNaN(l)),L=l=>g.isArray(l),C=l=>E(l)||l==null,_=l=>l&&l.renderType==="tab",xe=l=>l&&l.renderType==="grid",Ne=l=>(l.$xssName=Se(l),l.label=Z(l.label),l),Ve=l=>xe(l.$parent)||_(l.$parent),Se=l=>{if(E(l.$xssName)){let e=l.name;return e&&Object.keys(le).forEach(t=>{e=e.replaceAll(t,"_")}),"df_"+e}return l.$xssName},Ae=l=>{let e=0;if(l.length==0)return e;for(let t=0;t<l.length;t++){let i=l.charCodeAt(t);e=(e<<5)-e+i,e=e&e}return String(e).replaceAll(/-/g,"_")},Re=l=>l.renderType==="hidden",j=l=>{const e=document.createElement("template");return e.innerHTML=l,e.content.firstElementChild};function re(l){if(typeof l!="object"||l===null)return!1;let e=l;for(;Object.getPrototypeOf(e)!==null;)e=Object.getPrototypeOf(e);return Object.getPrototypeOf(l)===e}function Le(l){return typeof l=="object"&&l!==null&&!L(l)}function He(l){return l instanceof Date&&!isNaN(l.valueOf())}const oe=(...l)=>{let e=l[0];if(!re(e)||C(e))return e;let t=1;Object.keys(e).length>0&&(t=0,e=L(e)?[]:{});const i=l.length;for(;t<i;t+=1)Q(e,l[t]);return e};function Q(l,e){return Le(e)?Ye(l,e):L(e)?_e(l,e):He(e)?new e.constructor(e):e}function Ye(l,e){if(Ee(e))return e;for(const t of Object.keys(e)){const i=e[t];E(i)||(i===null||Ee(i)?l[t]=i:C(l[t])?l[t]=Q(L(i)?[]:{},i):Le(i)?Q(l[t],i):l[t]=i)}return l}function _e(l,e){const t=re(l);for(let i=0;i<e.length;i+=1){const s=e[i];let n;s==null?n=s:n=Q(L(s)?[]:{},s),t?l[i]=n:l.push(n)}return l}class f{constructor(e,t,i){var s;this.enableView=!0,this.daraForm=e,this.field=t,this.rowElement=i,this.createField(),t.tooltip&&((s=i.querySelector(".df-tooltip"))==null||s.setAttribute("tooltip",t.tooltip))}setDefaultInfo(){if(E(this.field.defaultValue)?this.setValue("",!1):this.setValue(this.field.defaultValue,!1),!E(this.field.placeholder)){const e=this.getElement();e instanceof Element&&e.setAttribute("placeholder",this.field.placeholder)}}setDefaultOption(){this.setDisabled(this.field.disabled??!1)}addChildField(e){var t;(t=this.rowElement.querySelector(".df-field-container"))==null||t.append(e)}static isDataRender(){return!0}static isChildrenCreate(){return!0}getForm(){return this.daraForm}setValueItems(e){}static getDescriptionTemplate(e){const t=e.descriptionClass?Z(e.descriptionClass):"",i=e.descriptionStyle?'style="'+Z(e.descriptionStyle)+'"':"";return e.description?`<div class="df-description ${t}" ${i}>${e.description}</div>`:""}changeEventCall(e,t,i,s){var n;if(e.onChange){let a={field:e,evt:t,oldValue:e.$value,value:s};if((n=e.listItem)!=null&&n.list){let o=[];const r=f.valuesValueKey(e);for(let d of e.listItem.list){let h=d[r];if(ae(s)){if(h==s){o.push(d);break}}else L(s)&&s.includes(h)&&o.push(d)}a.valueItems=o}if(a.oldValue!=a.value&&e.onChange.call(null,a)===!1)return i.setValue(e.$value,!1),!1;e.$value=a.value}this.daraForm.conditionCheck()}focus(){this.getElement().focus()}isEnableView(){return this.enableView}show(){this.enableView=!0,this.rowElement.classList.remove("df-hidden")}hide(){this.enableView=!1,this.rowElement.classList.contains("df-hidden")||this.rowElement.classList.add("df-hidden")}setDescription(e){var i;const t=this.rowElement.querySelector(".df-description");if(t)t.textContent=e;else{const s=this.rowElement.querySelector(".df-field");if(s){const n=new DOMParser;this.field.description=e;const a=n.parseFromString(f.getDescriptionTemplate(this.field),"text/html").querySelector(".df-description");a&&((i=s.parentNode)==null||i.insertBefore(a,s.nextSibling))}}}setActive(e){}setDisabled(e){this.getElement()instanceof HTMLElement&&(e===!1?this.getElement().removeAttribute("disabled"):this.getElement().setAttribute("disabled",!0))}commonValidator(){}static valuesValueKey(e){var t;return(t=e.listItem)!=null&&t.valueField?e.listItem.valueField:"value"}static valuesLabelKey(e){var t;return(t=e.listItem)!=null&&t.labelField?e.listItem.labelField:"label"}static valuesLabelValue(e,t){let i=!1;const s=e.replace(/\{\{([A-Za-z0-9_.]*)\}\}/g,(n,a)=>(i=!0,t[a]||""));return i?s:t[e]||""}}const je={mobile:/^\d{3}-\d{3,4}-\d{4}$/,email:/^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/,url:/^(?:(?:https?|HTTPS?|ftp|FTP):\/\/)(?:\S+(?::\S*)?@)?(?:(?!(?:10|127)(?:\.\d{1,3}){3})(?!(?:169\.254|192\.168)(?:\.\d{1,3}){2})(?!172\.(?:1[6-9]|2\d|3[0-1])(?:\.\d{1,3}){2})(?:[1-9]\d?|1\d\d|2[01]\d|22[0-3])(?:\.(?:1?\d{1,2}|2[0-4]\d|25[0-5])){2}(?:\.(?:[1-9]\d?|1\d\d|2[0-4]\d|25[0-4]))|(?:(?:[a-zA-Z\u00a1-\uffff0-9]-*)*[a-zA-Z\u00a1-\uffff0-9]+)(?:\.(?:[a-zA-Z\u00a1-\uffff0-9]-*)*[a-zA-Z\u00a1-\uffff0-9]+)*(?:\.(?:[a-zA-Z\u00a1-\uffff]{2,}))\.?)(?::\d{2,5})?(?:[/?#]\S*)?$/,number:/\d$/,alpha:/^[a-zA-Z]+$/,"alpha-num":/^[a-zA-Z0-9]+$/,variable:/^[a-zA-Z0-9_$][a-zA-Z0-9_$]*$/,"number-char":/^(?=.*[A-Za-z])(?=.*\d)[A-Za-z\d]/,"upper-char":/^(?=.*?[A-Z])(?=.*?[a-z])/,"upper-char-special":/^(?=.*?[A-Z])(?=.*?[a-z])(?=.*?[#?!@$%^&*-])/,"upper-char-special-number":/^(?=.*[A-Za-z])(?=.*\d)(?=.*[@$!%*#?&])[A-Za-z\d@$!%*#?&]/},Ce=(l,e,t)=>{if(!e.$instance.isEnableView())return{name:e.name,constraint:[]};typeof t>"u"&&(t={name:e.name,constraint:[]});const i=e.regexpType;return i&&!je[i].test(l)&&(t.regexp=i),t},Te=(l,e,t)=>{if(e.validator&&(t.validator=e.validator(e,l),typeof t.validator=="object")||(t=Ce(l,e,t),t.regexp))return t;if(e.different){const i=e.different.field,s=e.$instance.getForm().getField(i);if(!C(s)&&e.$instance.getValue()==s.$instance.getValue())return t.message=e.different.message,t}if(e.identical){const i=e.identical.field,s=e.$instance.getForm().getField(i);if(!C(s)&&e.$instance.getValue()!=s.$instance.getValue())return t.message=e.identical.message,t}return!0},de=(l,e)=>{if(!e.$instance.isEnableView())return!0;const t={name:e.name,constraint:[]},i=Number(l);if(e.required&&D(l))return t.constraint.push(y.REQUIRED),t;if(!M(l))return t.constraint.push(y.NAN),t;if(Te(l,e,t)!==!0)return t;const s=e.rule;if(s){const n=M(s.minimum),a=M(s.maximum);let o=!1,r=!1,d=!1,h=!1;n&&(s.exclusiveMinimum&&i<=s.minimum?r=!0:i<s.minimum&&(o=!0)),a&&(s.exclusiveMaximum&&i>=s.maximum?h=!0:i>s.maximum&&(d=!0)),n&&a&&(o||r||d||h)?s.exclusiveMinimum&&s.exclusiveMaximum&&(r||h)?t.constraint.push(y.BETWEEN_EXCLUSIVE_MINMAX):r?t.constraint.push(y.BETWEEN_EXCLUSIVE_MIN):h?t.constraint.push(y.BETWEEN_EXCLUSIVE_MAX):t.constraint.push(y.BETWEEN):(r&&t.constraint.push(y.EXCLUSIVE_MIN),h&&t.constraint.push(y.EXCLUSIVE_MAX),o&&t.constraint.push(y.MIN),d&&t.constraint.push(y.MAX))}return t.constraint.length>0?t:!0},$=(l,e,t)=>{if(t===!0){e.classList.remove("invalid"),e.classList.contains("valid")||e.classList.add("valid");const i=e.querySelector(".df-help-message");i&&(i.innerHTML="");return}if(e.classList.remove("valid"),e.classList.contains("invalid")||e.classList.add("invalid"),t!==!1){const i=I.validMessage(l,t);t.message&&i.push(t.message);const s=e.querySelector(".df-help-message");if(s&&i.length>0){const n=[];i.forEach(a=>{n.push(`<div>${a}</div>`)}),s.innerHTML=n.join("")}}},w=l=>{l.classList.remove("invalid"),l.classList.remove("valid")},he=(l,e,t)=>{e.addEventListener("input",i=>{O(l,i,t,t.getValue()),t.valid()})},ze=(l,e,t)=>{e.addEventListener("keyup",i=>{const s=i.target.value;M(s)||(e.value=s.replace(/[^0-9\.\-\+]/g,""),i.preventDefault()),O(l,i,t,t.getValue()),t.valid()})},We=(l,e,t)=>{e.addEventListener("change",i=>{O(l,i,t,t.getValue()),t.valid()})},O=(l,e,t,i)=>{t.changeEventCall(l,e,t,i)};class Pe extends f{constructor(e,t,i){super(i,e,t),this.mounted(),this.setDefaultOption(),this.setDefaultInfo()}mounted(){ze(this.field,this.element,this)}createField(){const e=this.field,t=this.rowElement.querySelector(".df-field-container");t.innerHTML=`
+        <div class="df-field">
+            <input type="text" name="${e.$xssName}" class="df-form-field df-number df-help-icon" />
+        </div> 
+        ${f.getDescriptionTemplate(e)}
+        <div class="df-help-message"></div>
+       `,this.element=t.querySelector(`[name="${e.$xssName}"]`)}getValue(){return this.element.value}setValue(e,t){if(t!==!1&&this.changeEventCall(this.field,null,this,e)===!1){this.element.value=this.field.$value;return}this.field.$value=e,this.element.value=e}reset(){this.setDefaultInfo(),this.setDisabled(!1),w(this.rowElement)}getElement(){return this.element}valid(){const e=de(this.getValue(),this.field);return $(this.field,this.rowElement,e),e}}const R=(l,e)=>{if(!e.$instance.isEnableView())return!0;let t={name:e.name,constraint:[]};if(e.required&&D(l))return t.constraint.push(y.REQUIRED),t;const i=Te(l,e,t);if(i!==!0)return i;const s=e.rule;if(s){const n=l.length,a=M(s.minLength),o=M(s.maxLength);let r=!1,d=!1;if(a&&n<s.minLength&&(r=!0),o&&n>s.maxLength&&(d=!0),a&&o&&(r||d)?t.constraint.push(y.BETWEEN):(r&&t.constraint.push(y.MIN_LENGTH),d&&t.constraint.push(y.MAX_LENGTH)),t.constraint.length>0)return t}return!0};class Be extends f{constructor(e,t,i){super(i,e,t),this.mounted(),this.setDefaultOption(),this.setDefaultInfo()}mounted(){he(this.field,this.element,this)}createField(){var s;const e=this.field,t=this.rowElement.querySelector(".df-field-container");let i=(s=e.rendererOptions)==null?void 0:s.rows;i=+i>0?i:3,t.innerHTML=`
+        <div class="df-field">
+            <textarea name="${e.$xssName}" rows="${i}" class="df-form-field df-textarea df-help-icon"></textarea>
+        </div> 
+        ${f.getDescriptionTemplate(e)}
+        <div class="df-help-message"></div>
+    `,this.element=t.querySelector(`[name="${e.$xssName}"]`)}getValue(){return this.element.value}setValue(e,t){if(t!==!1&&this.changeEventCall(this.field,null,this,e)===!1){this.element.value=this.field.$value;return}this.field.$value=e,this.element.value=e}reset(){this.setDefaultInfo(),this.setDisabled(!1),w(this.rowElement)}getElement(){return this.element}valid(){const e=R(this.getValue(),this.field);return $(this.field,this.rowElement,e),e}}class ue extends f{constructor(e,t,i){var o,r,d,h,u;super(i,e,t);let s="";E(e.defaultValue)||(s=e.defaultValue);const n=ue.valuesValueKey(e);let a=!1;(r=(o=this.field.listItem)==null?void 0:o.list)==null||r.forEach(c=>{let p=c[n];c.selected&&(this.defaultSelected=p),p==s&&(a=!0)}),a?this.defaultSelected=s:this.defaultSelected||((d=e.rendererOptions)==null?void 0:d.disableDefaultOption)===!0&&(this.defaultSelected=((u=(h=this.field.listItem)==null?void 0:h.list)==null?void 0:u.length)>0&&this.field.listItem.list[0][n]||""),E(this.defaultSelected)&&(this.defaultSelected=""),this.mounted(),this.setDefaultOption(),this.setValue(this.defaultSelected,!1)}mounted(){We(this.field,this.element,this)}createField(){const e=this.field,t=this.rowElement.querySelector(".df-field-container");let i=` <div class="df-field"><select name="${e.$xssName}" class="df-form-field df-dropdown">
+          ${this.dropdownValuesTemplate(e)}
+          </select> <i class="df-help-icon"></i></div>
+                ${f.getDescriptionTemplate(e)}
+      <div class="df-help-message"></div>
+    `;t.innerHTML=i,this.element=t.querySelector(`[name="${e.$xssName}"]`)}setValueItems(e){if(this.field.listItem?this.field.listItem.list=e:this.field.listItem={list:e},this.element.innerHTML=this.dropdownValuesTemplate(this.field),!D(this.field.$value)){const t=this.field.$value;this.field.$value="",this.setValue(t)}}getValue(){return this.element.value}setValue(e,t){if(t!==!1&&this.changeEventCall(this.field,null,this,e)===!1){this.element.value=this.field.$value;return}this.field.$value=e,this.element.value=e}reset(){this.setValue(this.defaultSelected,!1),this.setDisabled(!1),w(this.rowElement)}getElement(){return this.element}valid(){const e=this.getValue();let t=!0;return this.field.required&&e.length<1&&(t={name:this.field.name,constraint:[]},t.constraint.push(y.REQUIRED)),$(this.field,this.rowElement,t),t}dropdownValuesTemplate(e){var n,a,o;const t=f.valuesLabelKey(e),i=f.valuesValueKey(e);let s="";return((n=e.rendererOptions)==null?void 0:n.disableDefaultOption)!==!0&&(s+=`<option value="">${I.getMessage("selection")}</option>`),(o=(a=e.listItem)==null?void 0:a.list)==null||o.forEach(r=>{const d=`${r.selected?"selected":""} ${r.disabled?"disabled":""}`;E(r[i])&&r.label?s+=`<option value="${r.value||""}" ${d}>${r.label}</option>`:s+=`<option value="${r[i]}" ${d}>${f.valuesLabelValue(t,r)}</option>`}),s}}class Xe extends f{constructor(e,t,i){super(i,e,t),this.mounted(),this.setDefaultOption(),this.setDefaultInfo()}mounted(){he(this.field,this.element,this)}createField(){const e=this.field,t=this.rowElement.querySelector(".df-field-container");t.innerHTML=`
+      <div class="df-field">
+       <input type="text" name="${e.$xssName}" class="df-form-field df-text df-help-icon" />
+      </div>
+      ${f.getDescriptionTemplate(e)}
+      <div class="df-help-message"></div>
+      `,this.element=t.querySelector(`[name="${e.$xssName}"]`)}getValue(){return this.element.value}setValue(e,t){if(t!==!1&&this.changeEventCall(this.field,null,this,e)===!1){this.element.value=this.field.$value;return}this.field.$value=e,this.element.value=e}reset(){this.setDefaultInfo(),this.setDisabled(!1),w(this.rowElement)}getElement(){return this.element}valid(){const e=R(this.getValue(),this.field);return $(this.field,this.rowElement,e),e}}function A(l,e,t,i){var c,p,x,V,T,W,pe,ge,ve;const s={rowStyleClass:ce(e.orientation),fieldClass:"",fieldStyle:"",labelClass:"",labelStyle:"",labelAlignClass:"",valueClass:"",valueStyle:"",tabAlignClass:""},n=((c=t==null?void 0:t.style)==null?void 0:c.labelWidth)??l.style.labelWidth??"3";let a=((p=t==null?void 0:t.style)==null?void 0:p.valueWidth)??l.style.valueWidth??"9";const o=((x=t==null?void 0:t.style)==null?void 0:x.position)??l.style.position,r=(V=e.style)==null?void 0:V.width,d=F[(T=e.style)==null?void 0:T.position]??F[o]??F.top;s.fieldClass=`${d[0]?"df-"+d[0]:""} ${((W=e.style)==null?void 0:W.customClass)||""}`,r&&(M(r)?s.fieldClass+=M(r)?` df-col-xs-${r}`:"":s.fieldStyle=M(r)?"":`width:${r};`),s.tabAlignClass="df-tab-al-"+(["right","center"].includes((pe=e.style)==null?void 0:pe.tabAlign)?e.style.tabAlign:"left");const h=((ge=e.style)==null?void 0:ge.labelWidth)||n;if(s.labelAlignClass=d[1],!i&&h&&!["top","bottom"].includes(d[0]))if(M(h)){const ye=+h;a=12-ye,s.labelClass=`df-col-xs-${ye}`,s.valueClass=s.labelStyle?"df-col-full":`df-col-xs-${a}`}else s.labelStyle=`width:${h};`;const u=((ve=e.style)==null?void 0:ve.valueWidth)||a;return i&&!["left","right"].includes(d[0])?s.valueClass="df-col-full":u&&!["top","bottom"].includes(d[0])?M(u)?s.valueClass=s.labelStyle?"df-col-full":`df-col-xs-${u}`:s.valueStyle=`width:${u};`:s.valueClass=s.labelStyle?"df-col-full":"",s.fieldClass=te(s.fieldClass),s.labelClass=te(s.labelClass),s.valueClass=te(s.valueClass),s}function ce(l){return l==="horizontal"?"df-horizontal":"df-vertical"}function te(l){return l.replace(/\s+/g," ").trim()}class fe extends f{constructor(e,t,i){var o,r;super(i,e,t),this.defaultCheckValue=[],this.defaultCheckValue=[];let s=[];E(e.defaultValue)||(L(e.defaultValue)?s=e.defaultValue:s=[e.defaultValue]);const n=fe.valuesValueKey(e);E(this.field.listItem)&&this.setValueItems([{label:"",value:"Y"}]);let a=!1;(r=(o=this.field.listItem)==null?void 0:o.list)==null||r.forEach(d=>{let h=d[n];d.selected&&this.defaultCheckValue.push(h||!0),s.includes(h)&&(a=!0)}),this.defaultCheckValue=a?s:this.defaultCheckValue,this.mounted(),this.setDefaultOption(),this.setValue(this.defaultCheckValue,!1)}mounted(){this.initEvent()}initEvent(){this.rowElement.querySelectorAll(this.getSelector()).forEach(t=>{t.addEventListener("change",i=>{O(this.field,i,this,this.getValue()),this.valid()})})}getSelector(){return`input[type="checkbox"][name="${this.field.$xssName}"]`}createField(){var o,r;const e=this.field,t=this.rowElement.querySelector(".df-field-container"),i=[],s=e.$xssName,n=f.valuesLabelKey(e),a=f.valuesValueKey(e);i.push(' <div class="df-field"><div class="df-field-group">'),(r=(o=e.listItem)==null?void 0:o.list)==null||r.forEach(d=>{const h=d[a];i.push(`
+          <span class="df-field-item ${ce(e.listItem.orientation??Oe.horizontal)}">
+              <label>
+                  <input type="checkbox" name="${s}" value="${h?Z(h):""}" class="df-form-field df-checkbox" ${d.selected?"checked":""} ${d.disabled?"disabled":""}  />
+                  ${f.valuesLabelValue(n,d)}
+              </label>
+          </span>
+      `)}),i.push(`<i class="df-form-icon df-help-icon"></i></div></div> ${f.getDescriptionTemplate(e)}<div class="df-help-message"></div>`),t.innerHTML=i.join("")}setValueItems(e){if(this.rowElement.querySelector(".df-field-container")&&(this.field.listItem?this.field.listItem.list=e:this.field.listItem={list:e},this.createField(),!D(this.field.$value))){const i=this.field.$value;this.field.$value="",this.setValue(i)}}getValue(){const e=this.rowElement.querySelectorAll(this.getSelector());if(e.length>1){const t=[];return e.forEach(i=>{const s=i;s.checked&&t.push(s.value)}),t}else{const t=this.rowElement.querySelector(`[name="${this.field.$xssName}"]`);return t!=null&&t.checked?t.value?t.value:!0:t.value?"":!1}}setValue(e,t){if(t!==!1&&this.changeEventCall(this.field,null,this,e)===!1&&(e=this.field.$value),this.field.$value=e,e===!0){this.rowElement.querySelector(`[name="${this.field.$xssName}"]`).checked=!0;return}if(e===!1){this.rowElement.querySelector(`[name="${this.field.$xssName}"]`).checked=!1;return}let i=[];L(e)?i=e:i.push(e),this.rowElement.querySelectorAll(this.getSelector()).forEach(n=>{n.checked=!1}),i.forEach(n=>{const a=this.rowElement.querySelector(`[name="${this.field.$xssName}"][value="${n}"]`);a&&(a.checked=!0)})}reset(){var e,t;((t=(e=this.field.listItem)==null?void 0:e.list)==null?void 0:t.length)==1&&this.defaultCheckValue.length==1?this.setValue(!0,!1):this.setValue(this.defaultCheckValue,!1),this.setDisabled(!1),w(this.rowElement)}getElement(){return this.rowElement.querySelectorAll(`[name="${this.field.$xssName}"]`)}focus(){const e=this.getElement();e&&e.length>0&&this.getElement()[0].focus()}valid(){const e=this.getValue();let t=!0;return this.field.required&&L(e)&&e.length<1&&(t={name:this.field.name,constraint:[]},t.constraint.push(y.REQUIRED)),$(this.field,this.rowElement,t),t}}class me extends f{constructor(e,t,i){var o,r,d,h,u;super(i,e,t),this.defaultCheckValue="";let s=[];E(e.defaultValue)||(s=e.defaultValue);const n=me.valuesValueKey(e);let a=!1;(r=(o=this.field.listItem)==null?void 0:o.list)==null||r.forEach(c=>{let p=c[n];c.selected&&(this.defaultCheckValue=p),s==p&&(a=!0)}),a?this.defaultCheckValue=s:this.defaultCheckValue||(this.defaultCheckValue=((h=(d=this.field.listItem)==null?void 0:d.list)==null?void 0:h.length)>0?(u=this.field.listItem)==null?void 0:u.list[0][n]:""),this.mounted(),this.setDefaultOption(),this.setValue(this.defaultCheckValue,!1)}mounted(){this.initEvent()}initEvent(){this.rowElement.querySelectorAll(this.getSelector()).forEach(t=>{t.addEventListener("change",i=>{O(this.field,i,this,this.getValue()),this.valid()})})}getSelector(){return`input[type="radio"][name="${this.field.$xssName}"]`}createField(){var o,r;const e=this.field,t=this.rowElement.querySelector(".df-field-container"),i=[],s=e.$xssName,n=f.valuesLabelKey(e),a=f.valuesValueKey(e);i.push('<div class="df-field"><div class="df-field-group">'),(r=(o=e.listItem)==null?void 0:o.list)==null||r.forEach(d=>{const h=d[a];i.push(`<span class="df-field-item ${ce(e.orientation??Oe.horizontal)}">
+        <label>
+            <input type="radio" name="${s}" value="${h}" class="df-form-field df-radio" ${d.selected?"checked":""} ${d.disabled?"disabled":""}/>
+            ${f.valuesLabelValue(n,d)}
+        </label>
+        </span>
+                `)}),i.push(`<i class="df-form-icon df-help-icon"></i></div></div>
+        ${f.getDescriptionTemplate(e)}
+     <div class="df-help-message"></div>
+    `),t.innerHTML=i.join(""),this.initEvent()}setValueItems(e){if(this.rowElement.querySelector(".df-field-container")&&(this.field.listItem?this.field.listItem.list=e:this.field.listItem={list:e},this.createField(),!D(this.field.$value))){const i=this.field.$value;this.field.$value="",this.setValue(i)}}getValue(){var e;return(e=this.rowElement.querySelector(`[name="${this.field.$xssName}"]:checked`))==null?void 0:e.value}setValue(e,t){if(t!==!1&&this.changeEventCall(this.field,null,this,e)===!1&&(e=this.field.$value),this.field.$value=e,e===!0){this.rowElement.querySelector(`[name="${this.field.$xssName}"]`).checked=!0;return}if(e===!1){this.rowElement.querySelector(`[name="${this.field.$xssName}"]`).checked=!1;return}this.rowElement.querySelectorAll(this.getSelector()).forEach(s=>{let n=s;n.value==e?n.checked=!0:n.checked=!1})}reset(){this.setValue(this.defaultCheckValue,!1),this.setDisabled(!1),w(this.rowElement)}getElement(){return this.rowElement.querySelectorAll(this.getSelector())}focus(){const e=this.getElement();e&&e.length>0&&this.getElement()[0].focus()}valid(){const e=this.getValue();let t=!0;return this.field.required&&D(e)&&(t={name:this.field.name,constraint:[]},t.constraint.push(y.REQUIRED)),$(this.field,this.rowElement,t),t}}class Ue extends f{constructor(e,t,i){super(i,e,t),this.mounted(),this.setDefaultOption(),this.setDefaultInfo()}mounted(){he(this.field,this.element,this)}createField(){const e=this.field,t=this.rowElement.querySelector(".df-field-container");t.innerHTML=`
+        <div class="df-field">
+            <input type="password" name="${e.$xssName}" class="df-form-field df-password df-help-icon" autocomplete="off" />
+        </div>
+        ${f.getDescriptionTemplate(e)}
+        <div class="df-help-message"></div>
+    `,this.element=t.querySelector(`[name="${e.$xssName}"]`)}getValue(){return this.element.value}setValue(e,t){if(t!==!1&&this.changeEventCall(this.field,null,this,e)===!1){this.element.value=this.field.$value;return}this.field.$value=e,this.element.value=e}reset(){this.setDefaultInfo(),this.setDisabled(!1),w(this.rowElement)}getElement(){return this.element}valid(){const e=R(this.getValue(),this.field);return $(this.field,this.rowElement,e),e}}const Ke=(l,e,t)=>{const i={name:e.name,constraint:[]};return e.required&&t.length<1?(i.constraint.push(y.REQUIRED),i):i.constraint.length>0?i:!0};class Ze extends f{constructor(e,t,i){var s;super(i,e,t),this.removeIds=[],this.uploadFiles={},this.fileList=[],this.fileSeq=0,this.element=t.querySelector(`[name="${e.$xssName}"]`),this.fileList=((s=e.listItem)==null?void 0:s.list)||[],this.mounted(),this.setDefaultOption()}mounted(){this.element.addEventListener("change",e=>{var i;const t=(i=e.target)==null?void 0:i.files;if(t){let s=[];for(let n of t)s.push(n);this.addFiles(s)}O(this.field,e,this,this.fileList),this.valid()}),this.fileList.forEach(e=>{e.$seq=this.fileSeq+=1}),this.setFileList(this.fileList)}createField(){const e=this.field,t=this.rowElement.querySelector(".df-field-container");t.innerHTML=`
+    <div class="df-field">
+      <span class="df-file-wrapper">
+        <label class="df-file-label">
+          <input type="file" name="${e.$xssName}" class="df-form-field df-file" multiple />
+          ${I.getMessage("fileButton")}
+        </label>
+        <i class="df-form-icon df-help-icon"></i>
+      </span>
+    </div>
+    ${f.getDescriptionTemplate(e)}
+    <div class="df-file-list"></div>
+    <div class="df-help-message"></div>
+    `,this.element=t.querySelector(`[name="${e.$xssName}"]`)}addFiles(e){let t=!1;const i=[];for(let s of e){if(this.fileList.filter(o=>o.fileName==s.name&&o.fileSize==s.size&&o.lastModified==s.lastModified).length>0)continue;this.fileSeq+=1,this.uploadFiles[this.fileSeq]=s;let a={fileName:s.name,$seq:this.fileSeq,fileSize:s.size,lastModified:s.lastModified};i.push(a),t=!0}t&&(this.setFileList(i),this.fileList.push(...i))}setFileList(e,t){const i=this.rowElement.querySelector(".df-file-list");if(i){t===!0&&(i.innerHTML="");const s=[];e.forEach(n=>{s.push(`
+        <div class="df-file-item" data-seq="${n.$seq}">
+          ${n.fileId?'<span class="df-file-icon df-file-download"></span>':'<span class="df-file-icon df-empty-icon"></span>'} <span class="df-file-icon df-file-remove"></span>
+          <span class="df-file-name">${n.fileName}</span > 
+        </div>`)}),i.insertAdjacentHTML("beforeend",s.join("")),e.forEach(n=>{this.removeFileEvent(n,i),this.downloadFileEvent(n,i)})}}downloadFileEvent(e,t){const i=t.querySelector(`[data-seq="${e.$seq}"] .df-file-download`);i&&i.addEventListener("click",s=>{const n=s.target.closest(".df-file-item");if(n){const a=n.getAttribute("data-seq");if(a){const o=parseInt(a,10),r=this.fileList.findIndex(h=>h.$seq===o),d=this.fileList[r];if(d.url){location.href=d.url;return}if(this.field.fileDownload){this.field.fileDownload.call(null,{file:d,field:this.field});return}}}})}removeFileEvent(e,t){const i=t.querySelector(`[data-seq="${e.$seq}"] .df-file-remove`);i&&i.addEventListener("click",s=>{const n=s.target.closest(".df-file-item");if(n){const a=n.getAttribute("data-seq");if(a){const o=parseInt(a,10),r=this.fileList.findIndex(h=>h.$seq===o),d=this.fileList[r];this.fileList.splice(r,1),delete this.uploadFiles[o],n.remove(),d.fileId&&this.removeIds.push(d.fileId)}}this.valid()})}getValue(){return{uploadFile:Object.values(this.uploadFiles),removeIds:this.removeIds}}setValueItems(e){this.fileList=[],this.uploadFiles=[],this.removeIds=[];for(let t of e)t.$seq=this.fileSeq+=1,this.fileList.push(t);this.setFileList(this.fileList,!0)}setValue(e){g.isArray(e)&&this.setValueItems(e),this.element.value=""}reset(){this.setValue(""),this.setValueItems([]),w(this.rowElement)}getElement(){return this.element}valid(){const e=Ke(this.element,this.field,this.fileList);return $(this.field,this.rowElement,e),e}}class Qe extends f{constructor(e,t,i){super(i,e,t),e.renderer?(this.customFunction=e.renderer,this.mounted(),this.setDefaultOption(),this.setDefaultInfo()):this.customFunction={}}mounted(){this.customFunction.mounted&&this.customFunction.mounted.call(this,this.field,this.rowElement)}static isDataRender(){return!1}createField(){const e=this.field,t=C(e.template)?"":ae(e.template)?e.template:e.template(),i=this.rowElement.querySelector(".df-field-container");i.innerHTML=` <div class="df-field">
+        ${t}
+        </div>
+          ${f.getDescriptionTemplate(e)}
+        <div class="df-help-message"></div>`}getValue(){return this.customFunction.getValue?this.customFunction.getValue.call(this,this.field,this.rowElement):""}setValue(e,t){this.customFunction.setValue&&(t!==!1&&this.changeEventCall(this.field,null,this,e)===!1&&(e=this.field.$value),this.customFunction.setValue.call(this,e,this.field,this.rowElement)),this.field.$value=e}reset(){this.setDefaultInfo(),w(this.rowElement)}getElement(){return this.customFunction.getElement?this.customFunction.getElement.call(this,this.field,this.rowElement):null}valid(){if(this.customFunction.valid){const t=this.customFunction.valid.call(this,this.field,this.rowElement);$(this.field,this.rowElement,t);return}const e=R(this.getValue(),this.field);return $(this.field,this.rowElement,e),e}focus(){this.customFunction.focus&&this.customFunction.focus.call(this,this.field,this.rowElement)}}class Ge extends f{constructor(e,t,i){super(i,e,t)}mounted(){}static isDataRender(){return!1}createField(){return""}getValue(){return null}setValue(e){}reset(){}getElement(){return this.rowElement}valid(){return!0}addChildField(e){let t=this.rowElement.querySelector(".df-field-container");t?t.append(e):this.rowElement.append(e)}focus(){}}class Je extends f{constructor(e,t,i){super(i,e,t),this.field.$value=e.defaultValue}mounted(){}createField(){return""}getValue(){return this.field.$value}setValue(e){this.field.$value=e}reset(){this.setValue(this.field.defaultValue)}getElement(){}valid(){return!0}}class et extends f{constructor(e,t,i){super(i,e,t),this.mounted(),this.setDefaultOption()}mounted(){var e;(e=this.rowElement.querySelector(`#${this.field.$key}`))==null||e.addEventListener("click",t=>{this.field.onClick&&this.field.onClick.call(null,this.field)})}static isDataRender(){return!1}createField(){const e=this.field,t=this.rowElement.querySelector(".df-field-container");t.innerHTML=`
+      <button type="button" id="${e.$key}" class="df-btn">${e.label}</button> ${f.getDescriptionTemplate(e)}
+     `}getValue(){return""}setValue(e){}reset(){this.setDisabled(!1)}getElement(){return null}valid(){return!0}}class tt extends f{constructor(e,t,i){super(i,e,t),this.rangeNumElement=t.querySelector(".df-range-num"),this.mounted(),this.setDefaultOption(),this.setDefaultInfo()}mounted(){this.element.addEventListener("input",e=>{this.rangeNumElement.innerHTML=e.target.value,this.element.setAttribute("title",e.target.value),O(this.field,e,this,this.getValue()),this.valid()})}createField(){const e=this.field,t=this.rowElement.querySelector(".df-field-container");t.innerHTML=`
+        <div class="df-field">
+            <span class="df-range-num">${e.defaultValue?e.defaultValue:0}</span>
+            <input type="range" name="${e.$xssName}" class="df-form-field df-range df-help-icon" min="${e.rule.minimum}" max="${e.rule.maximum}"/>
+        </div> 
+        ${f.getDescriptionTemplate(e)}
+        <div class="df-help-message"></div>
+       `,this.element=t.querySelector(`[name="${e.$xssName}"]`)}getValue(){return this.element.value}setValue(e,t){if(t!==!1&&this.changeEventCall(this.field,null,this,e)===!1){this.element.value=this.field.$value;return}this.field.$value=e,this.element.value=e}reset(){this.setDefaultInfo(),this.setDisabled(!1),w(this.rowElement)}getElement(){return this.element}valid(){const e=de(this.getValue(),this.field);return $(this.field,this.rowElement,e),e}}let P={year:"Year",month:"Month",day:"Day",am:"AM",pm:"PM",today:"Today",ok:"Ok",months:{full:["January","February","March","April","May","June","July","August","September","October","November","December"],abbr:["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"]},weeks:{full:["Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday"],abbr:["Sun","Mon","Tue","Wed","Thu","Fri","Sat"]}},it=class{constructor(){this.lang=P}setDefaultMessage(e){P=Object.assign(P,e)}set(e){this.lang=Object.assign({},P,e)}getMessage(e){return this.lang[e]}getMonthsMessage(e,t="abbr"){return this.lang.months[t][e]||""}getWeeksMessage(e,t="abbr"){return this.lang.weeks[t][e]||""}getMonthsIdx(e,t="abbr"){return t=="full"?this.lang.months.full.indexOf(e):this.lang.months.abbr.indexOf(e)}getWeeksIdx(e,t="abbr"){return t=="full"?this.lang.weeks.full.indexOf(e):this.lang.weeks.abbr.indexOf(e)}};const v=new it,G=["YY","YYYY","MMMM","MMM","MM","M","dddd","ddd","dd","d","DD","D","S","HH","H","hh","h","mm","m","ss","s","SSS","zzzz","zzz","zz","z","a","A"];let J=0,S={year:"YYYY",month:"YYYY-MM",date:"YYYY-MM-DD",time:"HH:mm",datetime:"YYYY-MM-DD HH:mm"};const k=["ddtp-sun","ddtp-mon","ddtp-tue","ddtp-wed","ddtp-thu","ddtp-fri","ddtp-sat"];var m=(l=>(l.year="year",l.month="month",l.date="date",l.datetime="datetime",l.time="time",l))(m||{});G.forEach(l=>{J=Math.max(l.length,J)});const ke=(l,e)=>{e=e||"YYYY-MM-DD";const t=e.length;let i=[];for(let s=0;s<t;){let a=Math.min(J,t-s);for(;a>0;a--){const o=e.substring(s,s+a);if(G.includes(o)){try{i.push(st[o](l))}catch(r){console.log(G.includes(o),o,r)}break}}a<1?(i.push(e.substring(s,s+1)),s+=1):s+=a}return i.join("")},st={YY:l=>String(l.getFullYear()).slice(-2),YYYY:l=>String(l.getFullYear()),M:l=>String(l.getMonth()+1),MM:l=>g.leftPad(l.getMonth()+1,2),MMM:l=>v.getMonthsMessage(l.getMonth()),MMMM:l=>v.getMonthsMessage(l.getMonth(),"full"),D:l=>String(l.getDate()),DD:l=>g.leftPad(l.getDate(),2),d:l=>String(l.getDate()),dd:l=>g.leftPad(l.getDate(),2),ddd:l=>v.getWeeksMessage(l.getDay()),dddd:l=>v.getWeeksMessage(l.getDay(),"full"),H:l=>String(l.getHours()),HH:l=>g.leftPad(l.getHours(),2),h:l=>be(l),hh:l=>g.leftPad(be(l),2),a:l=>String(l.getFullYear()).slice(-2),A:l=>lt(l),m:l=>String(l.getMinutes()),mm:l=>g.leftPad(l.getMinutes(),2),s:l=>String(l.getSeconds()),ss:l=>g.leftPad(l.getSeconds(),2),SSS:l=>g.leftPad(l.getMilliseconds(),3)};function be(l){let e=l.getHours();return e>12?e-=12:e<1&&(e=12),e}function lt(l,e,t){let s=l.getHours()<12?"am":"pm";return s=v.getMessage(s),s=s.toUpperCase(),s}const H=(l,e)=>{if(l.length>1e3)return null;e=e||S.date;const t={year:new Date().getFullYear(),month:0,day:1,hour:0,minute:0,second:0,millisecond:0,isPm:!1,isH:!1,charIdx:0},i=e.length;let s=0;for(let a=0;a<i;){let r=Math.min(J,i-a);for(;r>0;r--){const d=e.substring(a,a+r);if(G.includes(d)){const h=at[d],u=nt(l.substring(s),h[0]);h[1](t,u),s+=u.length;break}}r<1?(a+=1,s+=1):a+=r}t.hour!=null&&!t.isH&&(t.isPm&&+t.hour!=12?t.hour=+t.hour+12:!t.isPm&&+t.hour==12&&(t.hour=0));let n;return n=new Date(t.year,t.month,t.day,t.hour,t.minute,t.second,t.millisecond),n},nt=(l,e)=>{const t=e.exec(l);return t==null?"":t[0]},b={twoOptional:/\d\d?/,two:/\d\d/,three:/\d{3}/,four:/\d{4}/},q=/[^\s]+/,at={YY:[b.two,(l,e)=>(l.year=+((""+new Date().getFullYear()).substring(0,2)+e),l)],YYYY:[b.four,(l,e)=>(l.year=+e,l)],M:[b.twoOptional,(l,e)=>(l.month=+e-1,l)],MM:[b.two,(l,e)=>(l.month=+e-1,l)],MMM:[q,(l,e)=>(l.month=v.getMonthsIdx(e,"abbr"),l)],MMMM:[q,(l,e)=>(l.month=v.getMonthsIdx(e,"full"),l)],D:[b.twoOptional,(l,e)=>(l.day=+e,l)],DD:[b.two,(l,e)=>(l.day=+e,l)],d:[b.twoOptional,(l,e)=>(l.day=+e,l)],dd:[b.two,(l,e)=>(l.day=+e,l)],ddd:[q,(l,e)=>l],dddd:[q,(l,e)=>l],H:[b.twoOptional,(l,e)=>(l.hour=+e,l.isH=!0,l)],HH:[b.two,(l,e)=>(l.hour=+e,l.isH=!0,l)],h:[b.twoOptional,(l,e)=>(l.hour=+e,l)],hh:[b.two,(l,e)=>(l.hour=+e,l)],a:[q,(l,e)=>(v.getMessage("am")!=e.toLowerCase()&&(l.isPm=!0),l)],A:[q,(l,e)=>(v.getMessage("am")!=e.toLowerCase()&&(l.isPm=!0),l)],m:[b.twoOptional,(l,e)=>(l.minute=+e,l)],mm:[b.two,(l,e)=>(l.minute=+e,l)],s:[b.twoOptional,(l,e)=>(l.second=+e,l)],ss:[b.two,(l,e)=>(l.second=+e,l)],SSS:[b.three,(l,e)=>(l.millisecond=+e,l)]};function rt(l,e){let t=l;for(;t;){if(t==e)return!0;t=t.parentElement}return!1}class N{constructor(e){this.date=e}setYear(e){return this.date.setFullYear(e),this}addYear(e){return this.date.setFullYear(this.date.getFullYear()+e),this}addMonth(e){return this.date.setMonth(this.date.getMonth()+e),this}setMonth(e){return this.date.setMonth(e),this}setDate(e){return this.date.setDate(e),this}addDate(e){return this.date.setDate(this.date.getDate()+e),this}addWeek(e){return this.date.setDate(this.date.getDate()+e*7),this}addHours(e){return this.date.setHours(this.date.getHours()+e),this}setHour(e){return this.date.setHours(e),this}addMinutes(e){return this.date.setMinutes(this.date.getMinutes()+e),this}setMinutes(e){return this.date.setMinutes(e),this}addSeconds(e){return this.date.setSeconds(this.date.getSeconds()+e),this}addMilliseconds(e){return this.date.setMilliseconds(this.date.getMilliseconds()+e),this}compare(e){return this.date.valueOf()<e.valueOf()?-1:this.date.valueOf()>e.valueOf()?1:0}getYear(){return this.date.getFullYear()}getMonth(){return this.date.getMonth()+1}getDate(){return this.date.getDate()}getDay(){return this.date.getDay()}getTime(){return this.date.getTime()}format(e){return ke(this.date,e)}clone(){return new N(new Date(this.date.valueOf()))}}let ie={inline:!1,weekStartDay:0,initialDate:"",autoClose:!0,isRTL:!1,mode:m.date,enableTodayBtn:!1,showMonthAfterYear:!1,isPositionFixed:!1,format:"",zIndex:1e3,minDate:"",maxDate:"",beforeDrawDate:l=>({check:!1,style:"",tooltip:""})};function ot(){var l;return document.getElementById("hiddenDaraDatetimeElement")==null&&((l=document.querySelector("body"))==null||l.insertAdjacentHTML("beforeend",'<div id="hiddenDaraDatetimeElement" class="daracl-datetime-hidden"></div>')),document.getElementById("hiddenDaraDatetimeElement")}let se=0;const ee=class Ie{constructor(e,t,i){var s;this.isInput=!1,this.isVisible=!1,this.minYear=-1,this.maxYear=-1,this.minMonth=-1,this.maxMonth=-1,this.dayOrder=[0,1,2,3,4,5,6],this._documentClickEvent=o=>{this.isVisible&&o.target!=this.targetElement&&!rt(o.target,this.datetimeElement)&&this.hide()},this.options=Object.assign({},ie,t),se+=1;let n;if(typeof e=="string"?n=document.querySelector(e):n=e,!n)throw new Error(`${e} datetimepicker element not found`);this._viewMode=Object.keys(m).includes(this.options.mode)?this.options.mode:m.date,this.initMode=this._viewMode,v.set(i),this.initMode==m.year?this.dateFormat=this.options.format||S.year:this.initMode==m.month?this.dateFormat=this.options.format||S.month:this.initMode==m.time?this.dateFormat=this.options.format||S.time:this.initMode==m.datetime?this.dateFormat=this.options.format||S.datetime:this.dateFormat=this.options.format||S.date;let a;if(this.options.initialDate?typeof this.options.initialDate=="string"?a=new N(H(this.options.initialDate,this.dateFormat)||new Date):a=new N(this.options.initialDate):(a=new N(new Date),this.options.initialDate=a.format(this.dateFormat)),this.setWeekDays(),this.todayDate=a.format(S.date),this.currentDate=a,this.targetElement=n,this.minDate=this._minDate(),this.maxDate=this._maxDate(),this.options.inline)this.datetimeElement=n,this.datetimeElement.className=`daracl-datetime-wrapper ddtp-${se} embed`;else{this.isInput=!0,this.targetElement.setAttribute("value",a.format(this.dateFormat));const o=document.createElement("div");o.className=`daracl-datetime-wrapper ddtp-${se} layer`,o.setAttribute("style",`z-index:${this.options.zIndex};`),(s=ot())==null||s.appendChild(o),this.datetimeElement=o,this.initTargetEvent()}this.createDatetimeTemplate(),this.isTimeMode()?(this.hourInputEle=this.datetimeElement.querySelector(".ddtp-hour"),this.minuteInputEle=this.datetimeElement.querySelector(".ddtp-minute")):(this.hourInputEle={},this.minuteInputEle={}),this.changeViewMode(this._viewMode),this.initHeaderEvent(),this.initDateEvent(),this.initTimeEvent()}setWeekDays(){let e=this.options.weekStartDay;if(e!=0){(e<0||e>6)&&(e=0);for(let t=0;t<7;t++){let i=e+t;this.dayOrder[t]=i<7?i:i-7}}}static create(e,t,i){return new Ie(e,t,i)}static setDefaultFormat(e){Object.assign(S,e)}_minDate(){let e=this.options.minDate;if(e!=""){if(typeof e=="string"){const t=H(e,this.dateFormat);if(!t)return-1;e=t}return this.minYear=e.getFullYear(),this.minMonth=+(this.minYear+g.leftPad(e.getMonth(),2)),new Date(e.getFullYear(),e.getMonth(),e.getDate(),0,0).getTime()}return-1}_maxDate(){let e=this.options.maxDate;if(e!=""){if(typeof e=="string"){const t=H(e,this.dateFormat);if(!t)return-1;e=t}return this.maxYear=e.getFullYear(),this.maxMonth=+(this.maxYear+g.leftPad(e.getMonth(),2)),new Date(e.getFullYear(),e.getMonth(),e.getDate(),23,59).getTime()}return-1}set viewMode(e){this._viewMode!==e&&(this._viewMode=e,this.changeViewMode(e))}get viewMode(){return this._viewMode}changeViewMode(e){var t;(t=this.datetimeElement.querySelector(".ddtp-datetime"))==null||t.setAttribute("view-mode",e),e==="year"?this.yearDraw():e==="month"?this.monthDraw():this.dayDraw()}initHeaderEvent(){var e,t,i,s;const n=this.options.isRTL;(e=this.datetimeElement.querySelector(".ddtp-move-btn.prev"))==null||e.addEventListener("click",a=>{this.moveDate(n?"next":"prev",a)}),(t=this.datetimeElement.querySelector(".ddtp-move-btn.next"))==null||t.addEventListener("click",a=>{this.moveDate(n?"prev":"next",a)}),(i=this.datetimeElement.querySelector(".ddtp-header-year"))==null||i.addEventListener("click",a=>{this.viewMode=m.year}),(s=this.datetimeElement.querySelector(".ddtp-header-month"))==null||s.addEventListener("click",a=>{this.viewMode=m.month})}initDateEvent(){var e,t;(e=this.datetimeElement.querySelector(".ddtp-day-body"))==null||e.addEventListener("click",i=>{var s;const n=i.target;if(n.classList.contains("ddtp-day")||n.closest(".ddtp-day")){const o=(n.getAttribute("data-day")||"1").split(",");if(this.currentDate.setMonth(+o[0]-1),this.currentDate.setDate(+o[1]),this.isDayDisabled(this.currentDate))return;(s=this.datetimeElement.querySelector(".select"))==null||s.classList.remove("select"),n.classList.add("select"),this.isTimeMode()&&(this.currentDate.setHour(+this.hourInputEle.value),this.currentDate.setMinutes(+this.minuteInputEle.value)),this.dateChangeEvent(i)}}),(t=this.datetimeElement.querySelector(".ddtp-today"))==null||t.addEventListener("click",i=>{const s=new N(H(this.todayDate,S.date)||new Date);this.currentDate.setYear(s.getYear()),this.currentDate.setMonth(s.getMonth()-1),this.currentDate.setDate(s.getDate()),this.changeViewMode(this.initMode)})}isTimeMode(){return this._viewMode===m.time||this._viewMode===m.datetime}getTimeNumberValue(e){return g.isNumeric(e)?parseInt(e,10):0}initTimeEvent(){var e;if(!this.isTimeMode())return;let t=this.currentDate.format("HH");const i=this.datetimeElement,s=i.querySelector(".ddtp-hour"),n=i.querySelector(".ddtp-hour-range");s.value=t,n.value=t,s.addEventListener("input",d=>{const h=d.target;let u=this.getTimeNumberValue(h.value),c=g.leftPadClamp(u,2,"0");parseInt(c,10)>23&&(c="23"),s.value=c,n.value=c}),n.addEventListener("input",d=>{const h=d.target;s.value=g.leftPadClamp(h.value,2,"0")});let a=this.currentDate.format("mm");const o=i.querySelector(".ddtp-minute"),r=i.querySelector(".ddtp-minute-range");o.value=a,r.value=a,o.addEventListener("input",d=>{const h=d.target;let u=this.getTimeNumberValue(h.value),c=g.leftPadClamp(u,2,"0");parseInt(c,10)>59&&(c="59"),o.value=c,r.value=c}),r.addEventListener("input",d=>{const h=d.target;o.value=g.leftPadClamp(h.value,2,"0")}),(e=i.querySelector(".time-select"))==null||e.addEventListener("click",d=>{this.currentDate.setHour(+s.value),this.currentDate.setMinutes(+o.value),this.dateChangeEvent(d)})}moveDate(e,t){if(this._viewMode===m.date||this._viewMode===m.datetime){this.currentDate.setDate(1),this.currentDate.addMonth(e==="prev"?-1:1),this.dayDraw();return}if(this._viewMode===m.month){this.currentDate.setDate(1),this.currentDate.addYear(e==="prev"?-1:1),this.monthDraw();return}this._viewMode===m.year&&(this.currentDate.setDate(1),this.currentDate.addYear(e==="prev"?-16:16),this.yearDraw())}getDateValue(){return this.currentDate.format(this.dateFormat)}static setOptions(e){ie=Object.assign({},ie,e)}show(){if(this.isVisible)return;this.isVisible=!0;const e=ht();this.datetimeElement.classList.remove("hide"),this.datetimeElement.classList.add("show");const t=this.targetElement.getBoundingClientRect(),i=window.scrollY||document.documentElement.scrollTop,s=window.scrollX||document.documentElement.scrollLeft,n=this.datetimeElement.offsetHeight,a=this.targetElement.offsetHeight+2;let o=t.left+s,r=0;this.options.isPositionFixed?(r=t.top+a,o=t.left):t.top+a+n>e.clientHeight&&t.top>=n?r=i+t.top-n-2:r=i+t.top+a,this.datetimeElement.setAttribute("style",`${this.options.isPositionFixed?"position:fixed;":""}top:${r}px;left:${o}px;z-index:${this.options.zIndex}`),document.addEventListener("click",this._documentClickEvent)}hide(){this.isVisible=!1,!(this.options.onClose&&this.options.onClose()===!1)&&(this.datetimeElement.classList.remove("show"),this.datetimeElement.classList.add("hide"),document.removeEventListener("click",this._documentClickEvent))}initTargetEvent(){this.targetElement&&this.targetElement.addEventListener("click",e=>{this.show()})}afterChangeDatepicker(){const e=this.currentDate.format(this.dateFormat);this.options.afterChangeDatepicker&&g.isFunction(this.options.afterChangeDatepicker)&&this.options.afterChangeDatepicker(e,this.viewMode)}beforeChangeDatepicker(){const e=this.currentDate.format(this.dateFormat);if(this.options.beforeChangeDatepicker&&g.isFunction(this.options.beforeChangeDatepicker)){if(this.options.beforeChangeDatepicker(e,i=>{i!==!1&&this.refresh(!1)})===!1)return;this.refresh(!1);return}this.refresh(!1)}dateChangeEvent(e){const t=this.currentDate.format(this.dateFormat);this.options.onSelect&&this.options.onSelect(t,this.viewMode,e)===!1||(this.isInput&&this.targetElement.setAttribute("value",t),!this.options.inline&&this.options.autoClose&&this.hide())}createDatetimeTemplate(){const e=this.options.showMonthAfterYear;let t=`<div class="ddtp-datetime ${this.options.isRTL?"rtl":""}" view-mode="${this._viewMode}">
+			<div class="ddtp-header">
+                <span class="${e?"ddtp-header-year":"ddtp-header-month"}"></span>
+                <span class="${e?"ddtp-header-month":"ddtp-header-year"}"></span>
+
+                <span class="ddtp-date-move">  
+                    <a href="javascript:;" class="ddtp-move-btn prev">
+                        <svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="#000000"><path d="M0 0h24v24H0z" fill="none"/><path d="M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12z"/></svg>
+                    </a>
+                    <a href="javascript:;" class="ddtp-move-btn next">
+                        <svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="#000000"><path d="M0 0h24v24H0z" fill="none"/><path d="M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z"/></svg>
+                    </a> 
+                </span>
+			</div>
+            <div class="ddtp-body">
+                <table class="ddtp-days">
+                    <thead class="ddtp-day-header">
+                        <tr>		
+                            <td class="ddtp-day-label ${k[this.dayOrder[0]]}">${v.getWeeksMessage(this.dayOrder[0])}</td>		
+                            <td class="ddtp-day-label ${k[this.dayOrder[1]]}">${v.getWeeksMessage(this.dayOrder[1])}</td>		
+                            <td class="ddtp-day-label ${k[this.dayOrder[2]]}">${v.getWeeksMessage(this.dayOrder[2])}</td>		
+                            <td class="ddtp-day-label ${k[this.dayOrder[3]]}">${v.getWeeksMessage(this.dayOrder[3])}</td>		
+                            <td class="ddtp-day-label ${k[this.dayOrder[4]]}">${v.getWeeksMessage(this.dayOrder[4])}</td>		
+                            <td class="ddtp-day-label ${k[this.dayOrder[5]]}">${v.getWeeksMessage(this.dayOrder[5])}</td>		
+                            <td class="ddtp-day-label ${k[this.dayOrder[6]]}">${v.getWeeksMessage(this.dayOrder[6])}</td>		
+                        </tr>
+                    </thead>
+                    <tbody class="ddtp-day-body">
+                    </tbody>
+                    
+                    <tfoot class="ddtp-day-footer">
+                        <td colspan="7">
+                            <div style="width:99%;text-align:center;margin-top: 5px;${this.options.enableTodayBtn?"":"display:none;"}"><button type="button" class="ddtp-today">${v.getMessage("today")}</button></div>
+                            <div class="footer-tooltip"></div>
+                        </td>
+                    </tfoot>
+                </table>
+
+                <div class="ddtp-times">
+                        <div class="time-container">
+                            <div class="ddtp-time">
+                                <span>H: </span><input type="number" class="ddtp-hour" min="0" max="23" maxlength="2">
+                                <input type="range" min="0" max="23" class="ddtp-hour-range">
+                            </div>
+                            <div class="ddtp-time">
+                                <span>M: </span><input type="number" class="ddtp-minute" min="0" max="59" size="2" maxlength="2">
+                                <input type="range" min="0" max="59" class="ddtp-minute-range">
+                            </div>
+                        </div>
+                        <div class="ddtp-btn">
+                            <button type="button" class="time-select">${v.getMessage("ok")}</button>
+                        </div>
+                </div>
+
+                <div class="ddtp-months">
+                </div>
+
+                <div class="ddtp-years">
+                </div>
+            </div>
+        </div>`;this.datetimeElement.innerHTML=t}refresh(e){if(this._viewMode===m.date||this._viewMode===m.datetime){this.dayDraw(e);return}if(this._viewMode===m.month){this.monthDraw(e);return}this._viewMode===m.year&&this.yearDraw(e)}yearDraw(e){var t;const i=this.currentDate.format("YYYY");if(e!==!1&&this.initMode==m.year){this.beforeChangeDatepicker();return}const s=+i-8;this.datetimeElement.querySelector(".ddtp-header-year").textContent=`${s} ~ ${s+15}`;const n=g.isFunction(this.options.beforeDrawDate),a=n?this.options.beforeDrawDate:!1,o=[];for(let r=0;r<16;r++){const d=s+r;let u=this.isYearDisabled(d)?" disabled":"",c="";if(n&&a){const p=a({mode:this._viewMode,date:d});u+=p.style?" "+p.style:"",c=p.tooltip,c=c?`title="${c}"`:""}o.push(`<div class="ddtp-year ${u}" data-year="${d}" ${c}>${d}</div>`)}this.datetimeElement.querySelector(".ddtp-years").innerHTML=o.join(""),this.initMode==m.year&&this.afterChangeDatepicker(),(t=this.datetimeElement.querySelectorAll(".ddtp-year"))==null||t.forEach(r=>{r.addEventListener("click",d=>{const h=d.target;if(h){const u=h.getAttribute("data-year");if(u){const c=+u;if(this.isYearDisabled(c))return;if(this.initMode==m.year){if(this.isYearDisabled(c))return;this.currentDate.setYear(c),this.dateChangeEvent(d);return}this.currentDate.setYear(c),this.viewMode=this.initMode}}})})}monthDraw(e){var t;if(e!==!1&&this.initMode==m.month){this.beforeChangeDatepicker();return}const i=this.currentDate.format("YYYY");this.datetimeElement.querySelector(".ddtp-header-year").textContent=`${i}`;const s=this.datetimeElement.querySelectorAll(".ddtp-months > .ddtp-month");if(s.length>0){if(this.isYearDisabled(+i)){s.forEach(r=>{r.classList.contains("disabled")||r.classList.add("disabled")});return}s.forEach((r,d)=>{this.isMonthDisabled(+i,d)?r.classList.contains("disabled")||r.classList.add("disabled"):r.classList.remove("disabled")}),this.initMode==m.month&&this.afterChangeDatepicker();return}this.datetimeElement.querySelector(".ddtp-header-month").textContent=this.currentDate.format("MMMM");const n=g.isFunction(this.options.beforeDrawDate),a=n?this.options.beforeDrawDate:!1,o=[];for(let r=0;r<12;r++){let h=this.isMonthDisabled(+i,r)?" disabled":"",u="";if(n&&a){const c=a({mode:this._viewMode,date:i+"/"+(r+1)});h+=c.style?" "+c.style:"",u=c.tooltip,u=u?`title="${u}"`:""}o.push(`<div class="ddtp-month ${h}" data-month="${r}" ${u}>${v.getMonthsMessage(r,"abbr")}</div>`)}this.datetimeElement.querySelector(".ddtp-months").innerHTML=o.join(""),this.initMode==m.month&&this.afterChangeDatepicker(),(t=this.datetimeElement.querySelectorAll(".ddtp-month"))==null||t.forEach(r=>{r.addEventListener("click",d=>{const h=d.target;if(h){const u=h.getAttribute("data-month");if(u){if(this.isMonthDisabled(this.currentDate.getYear(),+u))return!1;if(this.initMode==m.month){this.currentDate.setMonth(+u),this.dateChangeEvent(d);return}this.currentDate.setMonth(+u),this.viewMode=this.initMode,this.dayDraw()}}})})}dayDraw(e){if(e!==!1&&(this.initMode==m.date||this.initMode==m.datetime)){this.beforeChangeDatepicker();return}let t=this.currentDate.clone();const i=t.getMonth();t.setDate(1),this.datetimeElement.querySelector(".ddtp-header-year").textContent=t.format("YYYY"),this.datetimeElement.querySelector(".ddtp-header-month").textContent=t.format("MMMM");let s=t.getDay();s=s-this.dayOrder[0],s>=0?t.addDate(-s):t.addDate(-(7+s));const n=g.isFunction(this.options.beforeDrawDate),a=n?this.options.beforeDrawDate:!1,o=[];for(let r=0;r<42;r++){let d;r==0?d=t:d=t.clone().addDate(r);const h=d.format(S.date);r%7==0&&o.push((r==0?"":"</tr>")+"<tr>");let u=this.isDayDisabled(d),c=k[this.dayOrder[r%7]];const p=d.getMonth();p!=i&&(p<i?c+=p==1?" new":" old":c+=i==1&&p==12?" old":" new"),c+=this.todayDate==h?" ddtp-today":"",c+=u?" disabled":"";let x="";if(n&&a){const V=a({mode:this._viewMode,item:d,date:d.format(this.dateFormat)});c+=V.style?" "+V.style:"",c+=V.check?" ddtp-event":"",x=V.tooltip,x=x?`title="${x}"`:""}o.push(`<td class="ddtp-day ${c}" data-day="${d.format("M,D")}" ${x}>`),o.push(`<span>${d.format("d")}</span>`),o.push("</td>")}o.push("</tr>"),this.datetimeElement.querySelector(".ddtp-day-body").innerHTML=o.join(""),(this.initMode==m.date||this.initMode==m.datetime)&&this.afterChangeDatepicker()}isDayDisabled(e){return this.minDate!=-1&&this.minDate>e.getTime()||this.maxDate!=-1&&this.maxDate<e.getTime()}isYearDisabled(e){return this.minYear!=-1&&this.minYear>e||this.maxYear!=-1&&this.maxYear<e}isMonthDisabled(e,t){if(this.isYearDisabled(e))return!0;let i=+(e+g.leftPad(t,2));return this.minMonth!=-1&&this.minMonth>i||this.maxMonth!=-1&&this.maxMonth<i}static setMessage(e){v.setDefaultMessage(e)}};ee.VERSION="0.0.13";ee.format=ke;ee.parser=H;let dt=ee;function ht(){return{clientHeight:Math.max(document.documentElement.clientHeight,window.innerHeight||0),clientWidth:Math.max(document.documentElement.clientWidth,window.innerWidth||0)}}class B extends f{constructor(e,t,i){super(i,e,t),this.mounted(),this.setDefaultOption(),this.setDefaultInfo()}mounted(){let e;this.field.rendererOptions=Object.assign({},this.field.rendererOptions),typeof this.field.rendererOptions.onSelect<"u"&&(e=typeof this.field.rendererOptions.onSelect),E(this.field.rendererOptions.mode)&&(this.field.renderType=="datemonth"||this.field.renderType=="datehour"?this.field.rendererOptions.mode=this.field.renderType.replace("date",""):this.field.rendererOptions.mode=this.field.renderType),this.field.rendererOptions.onSelect=(t,i)=>{e&&e(t,i),this.setValue(t),this.valid()},this.dateObj=new dt(this.element,this.field.rendererOptions,{})}createField(){const e=this.field,t=this.rowElement.querySelector(".df-field-container");t.innerHTML=`
+    <div class="df-field">
+      <input type="text" name="${e.$xssName}" class="df-form-field df-text df-help-icon" autocomplete="off" readonly/>
+     </div>
+     ${f.getDescriptionTemplate(e)}
+     <div class="df-help-message"></div>
+     `,this.element=t.querySelector(`[name="${e.$xssName}"]`)}getValue(){return this.element.value}setValue(e,t){if(t!==!1&&this.changeEventCall(this.field,null,this,e)===!1){this.element.value=this.field.$value;return}this.field.$value=e,this.element.value=e}reset(){this.setDefaultInfo(),this.setDisabled(!1),w(this.rowElement)}getElement(){return this.element}valid(){const e=R(this.getValue(),this.field);return $(this.field,this.rowElement,e),e}}class ut extends f{constructor(e,t,i){super(i,e,t),e.renderer?this.customFunction=e.renderer:this.customFunction={},this.mounted()}mounted(){this.customFunction.mounted&&this.customFunction.mounted.call(this,this.field,this.rowElement),this.tabContainerElement.querySelectorAll(".df-tab-item").forEach(e=>{e.addEventListener("click",t=>{this.clickEventHandler(e,t)})})}clickEventHandler(e,t){this.setActive(e.getAttribute("data-tab-id")??"")}setActive(e){var s,n;const t=this.tabContainerElement.querySelector(`[data-tab-id="${e}"]`);if(!t)return;if(!t.classList.contains("active")){for(let a of((s=t==null?void 0:t.parentElement)==null?void 0:s.children)??[])a.classList.remove("active");t.classList.add("active")}const i=this.rowElement.querySelector(`[tab-panel-id="${e}"]`);if(!(i!=null&&i.classList.contains("active"))){for(let a of((n=i==null?void 0:i.parentElement)==null?void 0:n.children)??[])a.classList.remove("active");i==null||i.classList.add("active")}}static isDataRender(){return!1}static isChildrenCreate(){return!1}createField(){var a,o;const e=this.field,t=this.daraForm.formTemplate,i=this.daraForm.getOptions(),s=this.rowElement.querySelector(".df-field-container");let n=A(i,e);if(s.innerHTML=`
+        <div class="df-field ">
+          <div class="df-tab-header ${n.tabAlignClass}"></div>
+        </div>
+        <div class="df-tab-body"></div>
+    `,e.children){let r=!0;const d=this.getForm().getOptions();let h=A(d,e,null,t.isLabelHide(e));for(const u of e.children){u.$parent=e,t.addRowFieldInfo(u);let c=u.$key,p=`<span class="df-tab-item ${r?"active":""}" data-tab-id="${c}"><a href="javascript:;">${u.label}</a></span>`,x=`<div class="df-tab-panel ${r?"active":""}" tab-panel-id="${c}">${f.getDescriptionTemplate(u)}
+          <div class="df-tab-group"></div>
+        </div>`;const V=j(p),T=j(x);if(r=!1,V&&((a=s.querySelector(".df-tab-header"))==null||a.appendChild(V)),T&&((o=s.querySelector(".df-tab-body"))==null||o.appendChild(T),u.children)){let W={style:{width:d.style.width??"100%",labelWidth:d.style.labelWidth??3,valueWidth:d.style.valueWidth??9,position:d.style.position??"left-right"},useTypeValue:d.useTypeValue,autoCreate:!1,notValidMessage:"This form is not valid.",fields:[]};u.$tabForm=new z(document.createElement("div"),W),u.$instance=new u.$renderType(u,T==null?void 0:T.querySelector(".df-tab-group"),u.$tabForm),u.$tabForm.formTemplate.childTemplate(u,h)}}this.tabContainerElement=s}}getValue(){var i;if(this.customFunction.getValue)return this.customFunction.getValue.call(this,this.field,this.rowElement);let e={},t=this.getForm().getOptions().useTypeValue;for(const s of this.field.children){const n=(i=s.$tabForm)==null?void 0:i.getValue(!1);if(t)e[s.$validName]=n;else for(let[a,o]of Object.entries(n))e[a]=o}return e}setValue(e){var t;for(const i of this.field.children){let s=e[i.$validName];s&&((t=i.$tabForm)==null||t.setValue(s))}}reset(){}getElement(){return this.rowElement}valid(){var t;if(this.customFunction.valid){const i=this.customFunction.valid.call(this,this.field,this.rowElement);$(this.field,this.rowElement,i);return}const e=this.field;for(const i of e.children){const s=(t=i.$tabForm)==null?void 0:t.validForm();if(s&&s.length>0){const n=s[0];if(n.message)return n.message="["+this.field.label+"] "+n.message,n}}return!0}focus(){}}let X=0;class ct extends f{constructor(e,t,i){super(i,e,t),this.allAddRowInfo={},e.renderer?this.customFunction=e.renderer:this.customFunction={};const s={style:{width:"100%",labelWidth:3,valueWidth:9,position:"left-right"},autoCreate:!1,notValidMessage:"This form is not valid.",fields:[]};this.gridForm=new z(document.createElement("div"),s),this.mounted(),this.setDefaultOption(),this.setDefaultInfo()}mounted(){var e;this.addRow(),this.customFunction.mounted&&this.customFunction.mounted.call(this,this.field,this.rowElement),(e=this.rowElement.querySelector(".df-grid-add-row-btn"))==null||e.addEventListener("click",t=>{this.addRow()})}static isDataRender(){return!1}static isChildrenCreate(){return!1}createField(){var a,o,r,d;const e=this.field,t=this.rowElement.querySelector(".df-field-container");let i=[],s=[],n=[];if(n.push(""),e.children){s.push("<colgroup>"),i.push("<tr>"),s.push('<col style="width:38px">'),i.push("<th>"),((a=e.rendererOptions)==null?void 0:a.disableAddButton)!==!0&&i.push('<button type="button" class="df-btn df-grid-add-row-btn" title="Add"><i class="df-icon df-add-icon"></i></button>'),i.push("</th>");for(const h of e.children)s.push(`<col style="width:${((o=h.style)==null?void 0:o.width)??"*"}">`),i.push(`<th class="df-grid-header">${h.label}</th>`);s.push("</colgroup>"),i.push("</tr>")}t.innerHTML=`
+    <div class="df-grid-field">
+      ${n.join("")}
+     <div class="df-grid-container ${((r=e.style)==null?void 0:r.position)??""}" style="height:${((d=e.rendererOptions)==null?void 0:d.height)??"auto"};">
+        <table class="df-grid">${s.join("")}<thead>${i.join("")}</thead><tbody></tbody></table>
+     </div>
+     </div>
+     `}addRow(e){var r,d,h;let t=[];const i=this.daraForm.getOptions(),s=this.gridForm.formTemplate,n=this.field.$xssName;++X;let a=[];t.push('<tr class="df-grid-row">'),t.push("<td>"),((r=this.field.rendererOptions)==null?void 0:r.disableRemoveButton)!==!0&&t.push(`<button type="button" data-row-idx="${X}" class="df-btn df-grid-row-remove"><i class="df-icon df-remove-icon"></i></button>`),t.push("</td>");for(const u of this.field.children){let c=A(i,u,null,!0),p=oe({},u);a.push(p),p.$orgin=u,p.name=p.name+"_"+X,p.$xssName=n+"_"+Se(p),s.addRowFieldInfo(p),t.push(`<td id="${p.$xssName}"><div class="df-field-container ${p.required?"required":""} " style="${c.valueStyle}"></div></td>`)}t.push("</tr>"),this.allAddRowInfo[X]=a;const o=j(t.join(""));o&&((d=this.rowElement.querySelector("tbody"))==null||d.append(o),(h=o.querySelector(".df-grid-row-remove"))==null||h.addEventListener("click",u=>{this.removeRow(u)})),e=e??{};for(let u of a)u.$instance=new u.$renderType(u,o==null?void 0:o.querySelector(`#${u.$xssName}`),this.gridForm),e[u.$orgin.name]&&u.$instance.setValue(e[u.$orgin.name])}removeRow(e){var s;const i=e.target.closest("tr");if(i){let n=((s=e.currentTarget)==null?void 0:s.getAttribute("data-row-idx"))||"-1";this.removeFieldInfo(n),i.remove()}}removeFieldInfo(e){let t=[];if(console.log("rowIdx : ",e),C(e)){for(let i in this.allAddRowInfo)t=t.concat(this.allAddRowInfo[i]);this.allAddRowInfo={}}else if(e){const i=parseInt(e,10);t=t.concat(this.allAddRowInfo[i]),delete this.allAddRowInfo[i]}for(let i of t)this.gridForm.getFieldInfoMap().removeFieldInfo(i.name)}allRemoveRow(){var e;(e=this.rowElement.querySelector("tbody"))==null||e.replaceChildren(),this.removeFieldInfo()}getValue(){if(this.customFunction.getValue)return this.customFunction.getValue.call(this,this.field,this.rowElement);let e=[];const t=this.field.children,i=t.length;for(let s in this.allAddRowInfo){const n=this.allAddRowInfo[s];let a={};for(let o=0;o<i;o++){let r=t[o];a[r.name]=this.gridForm.getFieldValue(n[o].name)}e.push(a)}return e}setValue(e){this.field.$value=e;let t=[];L(e)?t=e:re(e)&&t.push(e),this.allRemoveRow();for(let i of t)this.addRow(i)}reset(){this.setDefaultInfo(),w(this.rowElement)}getElement(){return this.customFunction.getElement?this.customFunction.getElement.call(this,this.field,this.rowElement):null}valid(){if(this.customFunction.valid){const t=this.customFunction.valid.call(this,this.field,this.rowElement);$(this.field,this.rowElement,t);return}const e=this.gridForm.validForm();if(e.length>0){const t=e[0];if(t.message)return t.message="["+this.field.label+"] "+t.message,t}return!0}focus(){}}const y={NAN:"nan",MIN:"minimum",EXCLUSIVE_MIN:"exclusiveMinimum",MAX:"maximum",EXCLUSIVE_MAX:"exclusiveMaximum",MIN_LENGTH:"minLength",MAX_LENGTH:"maxLength",BETWEEN:"between",BETWEEN_EXCLUSIVE_MIN:"betweenExclusiveMin",BETWEEN_EXCLUSIVE_MAX:"betweenExclusiveMax",BETWEEN_EXCLUSIVE_MINMAX:"betweenExclusiveMinMax",REQUIRED:"required"},ft="dff",U={number:Pe,textarea:Be,dropdown:ue,checkbox:fe,radio:me,text:Xe,password:Ue,file:Ze,custom:Qe,group:Ge,hidden:Je,button:et,range:tt,datehour:B,datemonth:B,date:B,datetime:B,tab:ut,grid:ct},Oe={horizontal:"horizontal"},F={"top-left":["top","df-txt-left"],"top-center":["top","df-txt-center"],"top-right":["top","df-txt-right"],"left-left":["","df-txt-left"],"left-center":["","df-txt-center"],"left-right":["","df-txt-right"],"right-right":["right","df-txt-right"],"right-center":["right","df-txt-center"],"right-left":["right","df-txt-left"],"bottom-left":["bottom","df-txt-left"],"bottom-center":["bottom","df-txt-center"],"bottom-right":["bottom","df-txt-right"]};F.top=F["top-left"];F.right=F["right-right"];F.left=F["left-left"];F.bottom=F["bottom-left"];let $e={required:"{label} 필수 입력사항입니다.",fileButton:"파일찾기",selection:"선택",string:{minLength:"{minLength} 글자 이상으로 입력하세요.",maxLength:"{maxLength} 글자 이하로 입력하세요.",between:"{minLength} ~ {maxLength} 사이의 글자를 입력하세요."},number:{nan:"숫자만 입력 가능 합니다.",minimum:"{minimum} 값과 같거나 커야 합니다",exclusiveMinimum:"{minimum} 보다 커야 합니다",maximum:"{maximum} 값과 같거나 작아야 합니다",exclusiveMaximum:"{maximum} 보다 작아야 합니다.",between:"{minimum}~{maximum} 사이의 값을 입력하세요.",betweenExclusiveMin:"{minimum} 보다 크고 {maximum} 보다 같거나 작아야 합니다",betweenExclusiveMax:"{minimum} 보다 같거나 크고 {maximum} 보다 작아야 합니다",betweenExclusiveMinMax:"{minimum} 보다 크고 {maximum} 보다 작아야 합니다"},regexp:{mobile:"핸드폰 번호가 유효하지 않습니다.",email:"이메일이 유효하지 않습니다.",url:"URL이 유효하지 않습니다.",alpha:"영문만 입력 가능 합니다.","alpha-num":"영문과 숫자만 입력 가능 합니다.",number:"숫자만 입력 가능 합니다.",variable:"값이 유효하지 않습니다.","number-char":"숫자, 문자 각각 하나 이상 포함 되어야 합니다.","upper-char":"대문자가 하나 이상 포함 되어야 합니다.","upper-char-special":"대문자,소문자,특수문자 각각 하나 이상 포함 되어야 합니다.","upper-char-special-number":"대문자,소문자,특수문자,숫자 각각 하나 이상 포함 되어야합니다."}},mt=class{constructor(){this.lang=$e}set(e){this.lang=Object.assign({},$e,e)}getMessage(e){return this.lang[e]}validMessage(e,t){let i="",s=[];t.regexp&&(i=this.lang.regexp[t.regexp],s.push(i)),(t.constraint??[]).forEach(o=>{o===y.REQUIRED&&(i=we(this.lang.required,e),s.push(i)),e.renderType=="number"||e.renderType=="range"?(i=this.lang.number[o],s.push(i)):(i=this.lang.string[o],s.push(i))});const n=[],a=Object.assign({},{name:e.name,label:e.label},e.rule);return s.forEach(o=>{o&&n.push(we(o,a))}),t.validator&&n.push(t.validator.message),n}};function we(l,e){return l.replace(/\{{1,1}([A-Za-z0-9_.]*)\}{1,1}/g,(t,i)=>typeof e[i]<"u"?e[i]:t)}const I=new mt,pt=l=>{let e;return l.renderType&&(e=U[l.renderType]),e&&(e.isDataRender()===!1||!E(l.name))?e:E(l.name)?l.children?U.group:U.hidden:U.text};class gt{constructor(e,t){this.fieldIdx=0,this.allFieldInfo={},this.keyNameMap={},this.conditionFields=[],this.fieldPrefix=`${ft}_${Ae(e)}`,this.form=t}addField(e){Ne(e),this.fieldIdx+=1,e.$key=`${this.fieldPrefix}_${this.fieldIdx}`,e.$validName=e.name??e.label,this.keyNameMap[e.$validName]=e.$key,this.allFieldInfo[e.$key]=e,e.$renderType=pt(e),e.conditional&&this.conditionFields.push(e.$key)}getFieldName(e){return this.allFieldInfo[this.keyNameMap[e]]}get(e){return this.allFieldInfo[e]}hasFieldName(e){return!!(this.keyNameMap[e]&&this.allFieldInfo[this.keyNameMap[e]])}getAllFieldInfo(){return this.allFieldInfo}removeFieldInfo(e){const t=this.keyNameMap[e];E(t)||(this.removeFieldInfoByKey(t),delete this.keyNameMap[e])}removeFieldInfoByKey(e){const t=this.allFieldInfo[e];t&&this.keyNameMap[t.$validName]===e&&delete this.keyNameMap[t.$validName],delete this.allFieldInfo[e],this.conditionFields=this.conditionFields.filter(i=>i!==e)}getAllFieldValue(e,t){const i=this.form.getOptions().useTypeValue;if(t!==!0){for(let[s,n]of Object.entries(this.allFieldInfo))e=Me(e,n,i);return e}return new Promise((s,n)=>{for(let[a,o]of Object.entries(this.allFieldInfo)){if(!o.$instance.isEnableView())continue;let r=this.getFieldValidation(o,!0);if(r!==!0){n(new Error(r.message,{cause:r}));return}e=Me(e,o,i)}s(e)})}getFormDataValue(e,t){if(t!==!0){let i=new FormData;for(let[s,n]of Object.entries(e))i.set(s,n);for(let[s,n]of Object.entries(this.allFieldInfo))Fe(i,n,n.$instance.getValue());return i}return new Promise((i,s)=>{let n=new FormData;for(let[a,o]of Object.entries(e))n.set(a,o);for(let[a,o]of Object.entries(this.allFieldInfo)){if(!o.$instance.isEnableView())continue;let r=this.getFieldValidation(o,!0);if(r!==!0){s(new Error(r.message,{cause:r}));return}Fe(n,o,o.$instance.getValue())}i(n)})}isConditionFieldCheck(e){let t=e;for(;typeof t<"u";){if(!this.isConditionField(t))return!1;t=t.$parent}return!0}isConditionField(e){if(!this.conditionFields.includes(e.$key))return!0;let t=!1;if(e.conditional.custom)t=e.conditional.custom.call(null,e);else if(e.conditional.field){const i=this.getFieldName(e.conditional.field);i&&e.conditional.eq==i.$instance.getValue()&&(t=!0)}return t}conditionCheck(){this.conditionFields.forEach(e=>{const t=this.allFieldInfo[e];this.isConditionField(t)?t.$instance.show():t.$instance.hide()})}getFieldValidation(e,t){if(!this.isConditionFieldCheck(e))return!0;const i=e.$instance;let s=i.valid();return s===!0?!0:(t&&i.focus(),s=s,E(s.message)&&(s.message=I.validMessage(e,s)[0]),s)}}function Me(l,e,t){if(Ve(e))return l;const i=e.$instance.getValue();if(e.renderType==="file"){const s=i.uploadFile;l[e.$validName]=s,l[e.$validName+"RemoveIds"]=i.removeIds}else if(t!==!0)if(_(e))for(let[s,n]of Object.entries(i))l[s]=n;else C(e.name)||(l[e.name]=i);else l[e.$validName]=i;return l}function Fe(l,e,t){if(Ve(e))return l;const i=e.$instance.getValue();if(e.renderType==="file"){const s=i.uploadFile;l.delete(e.$validName);for(let n of s)l.append(e.$validName,n);l.set(e.$validName+"RemoveIds",i.removeIds)}else if(t!==!0)if(_(e))for(let[s,n]of Object.entries(i))l.set(s,n);else C(e.name)||l.set(e.$validName,i);else l.set(e.$validName,i);return l}class vt{constructor(e,t,i){this.addRowFields=[],this.daraform=e,this.options=e.getOptions(),this.formElement=t,this.fieldInfoMap=i}addRow(e){this.checkHiddenField(e)||(this.addRowFields=[],this.addRowTemplate(e))}addRowTemplate(e){let t=this.isLabelHide(e),i=A(this.options,e,null,t);this.addRowFieldInfo(e);const s=j(`
+        <div class="df-row df-form-group ${i.fieldClass}" id="${e.$key}">
+          ${t?"":`<div class="df-label ${i.labelClass} ${i.labelAlignClass}" title="${e.label??""}" style="${i.labelStyle}">${this.getLabelTemplate(e)}</div>`}
+
+          <div class="df-field-container ${i.valueClass} ${e.required?"required":""}" style="${i.valueStyle}"></div>
+        </div>
+    `);s&&(this.createField(e,s),this.formElement.append(s),e.children&&this.childTemplate(e,i))}createField(e,t){e.$instance=new e.$renderType(e,t,this.daraform)}childTemplate(e,t){let i=null,s=!0,n=!1;if(!e.$renderType.isChildrenCreate())return;const a=document.createElement("div");a.classList.add("df-row",t.rowStyleClass??"");let o=0;for(const r of e.children){if(C(r))throw new Error(`parent field :[${e.$validName}], children index ${o},  empty [${r}]`);if(r.$parent=e,++o,this.checkHiddenField(r))continue;this.addRowFieldInfo(r),s&&(i=r);let d=this.isLabelHide(r),h,u="";d?(h=A(this.options,r,i,!n),u=n?`<span class="df-label df-empty ${h.labelClass}" style="${h.labelStyle}"></span>`:""):(h=A(this.options,r,i,!1),u=`<span class="df-label ${h.labelClass} ${h.labelAlignClass}" title="${r.label??""}" style="${h.labelStyle}">${this.getLabelTemplate(r)}</span>`);const c=j(`<div class="df-form-group ${h.fieldClass}" style="${h.fieldStyle}" id="${r.$key}">
+        ${u}
+        <span class="df-field-container ${h.valueClass} ${r.required?"required":""}" style="${h.valueStyle}"></span>
+      </div>`);c&&(this.createField(r,c),a.append(c),r.children&&this.childTemplate(r,r.children?h:t)),d||(n=!0),s=!1}e.$instance.addChildField(a)}getLabelTemplate(e){const t=e.required?'<span class="required"></span>':"",i=D(e.tooltip)?"":`<span class="df-tooltip">?<span class="df-tooltip-text">${e.tooltip}</span></span>`;return`<span class="df-label-text">${e.label??""}</span> ${i} ${t}`}isLabelHide(e){var t;return((t=e.style)==null?void 0:t.labelHide)||E(e.label)}checkHiddenField(e){return Re(e)?(this.fieldInfoMap.addField(e),e.$instance=new e.$renderType(e,null,this.daraform),!0):!1}addRowFieldInfo(e){if(!D(e.name)&&this.fieldInfoMap.hasFieldName(e.name))throw new Error(`Duplicate field name "${e.name}"`);this.fieldInfoMap.addField(e),this.addRowFields.push(e.$key)}}function yt(l){return oe({},ne,l)}function Et(l){ne=oe({},ne,l)}let ne={style:{width:"100%",labelWidth:3,valueWidth:9,position:"left-right"},mode:"new",useTypeValue:!0,autoCreate:!0,notValidMessage:"This form is not valid.",fields:[]};const K={},De="data-form-uid";let bt=0;const Y=class Y{constructor(e,t,i){if(this.formValue={},this.changeListeners=[],this.changeMode=s=>{this.options.mode=s,this.formElement.setAttribute("data-df-mode",s);const n=this.formElement.querySelectorAll(".df-field input, .df-field textarea, .df-field select");s=="view"?n.forEach(a=>{a instanceof HTMLInputElement&&(a.readOnly=!0),a instanceof HTMLTextAreaElement&&(a.readOnly=!0)}):n.forEach(a=>{a instanceof HTMLInputElement&&(a.readOnly=!1),a instanceof HTMLTextAreaElement&&(a.readOnly=!1)})},this.resetForm=()=>{const s=this.fieldInfoMap.getAllFieldInfo();for(const n in s){const o=s[n].$instance;o&&typeof o.reset=="function"&&o.reset()}this.formValue={},this.conditionCheck()},this.resetField=s=>{this.fieldInfoMap.getFieldName(s).$instance.reset(),this.formValue[s]="",this.conditionCheck()},this.getFieldValue=s=>{const n=this.fieldInfoMap.getFieldName(s);return n?n.$instance.getValue():null},this.getValue=s=>this.fieldInfoMap.getAllFieldValue(this.formValue,s),this.getFormDataValue=s=>this.fieldInfoMap.getFormDataValue(this.formValue,s),this.setValue=(s,n)=>{n!==!1&&this.resetForm(),Object.keys(s).forEach(a=>{this._setFieldValue(a,s[a])}),this.conditionCheck()},this.setFieldValue=(s,n)=>{this._setFieldValue(s,n),this.conditionCheck()},this.setFieldItems=(s,n)=>{const a=this.fieldInfoMap.getFieldName(s);if(a)return a.$instance.setValueItems(n)},this.addField=s=>{this.options.fields.push(s),this.formTemplate.addRow(s),this.conditionCheck()},this.removeField=s=>{const n=this.fieldInfoMap.getFieldName(s);if(!n)return;const a=this.getRemoveFields(n);a.forEach(o=>{this.removeFormValue(o)}),this.removeFieldElement(n),this.removeParentChildField(n),a.forEach(o=>{this.fieldInfoMap.removeFieldInfoByKey(o.$key)}),this.conditionCheck()},this.isValidForm=()=>this.validForm().length<1,this.validForm=()=>{let s=[],n=this.options.autoFocus!==!1,a=!0;const o=this.fieldInfoMap.getAllFieldInfo();for(const r in o){const d=o[r];let h=this.fieldInfoMap.getFieldValidation(d,n);h!==!0&&(n=!1,xe(d)?s=s.concat(h):(a&&(this.validTabCheck(d),a=!1),s.push(h)))}return s},this.isValidField=s=>{const n=this.fieldInfoMap.getFieldName(s);if(E(n))throw new Error(`Field name [${s}] not found`);const a=n.$instance;return a?a.valid()===!0:!0},this.getOptions=()=>this.options,this.subscribe=s=>(this.changeListeners.push(s),()=>{this.changeListeners=this.changeListeners.filter(n=>n!==s)}),this.destroy=()=>{this.formElement.className=this.orginFormStyleClass,this.formElement.replaceChildren();for(const s in this)qe(this,s)&&(delete this[s],delete K[this.selector])},this.getFields=()=>this.options.fields,this.setFields=s=>{this.options.fields=s,this.createForm(s)},this.options=yt(t),I.set(i),e)this.orginFormStyleClass=e.className,e.classList.add("daracl-form"),this.selector=`df_${++bt}`,e.setAttribute("name",this.selector),e.setAttribute(De,this.selector),this.options.style.width&&e.setAttribute("style",`width:${this.options.style.width};`),this.formElement=e,this.changeMode(this.options.mode??"new"),this.createForm(this.options.fields),this.options.autoCreate!==!1&&(K[this.selector]=this);else throw new Error(`${e} form selector not found`)}static create(e,t,i){return new Y(e,t,i)}static setMessage(e){I.set(e)}static setDefaultOptions(e,t){Et(e),t&&I.set(t)}createForm(e){this.fieldInfoMap=new gt(this.selector,this),this.formTemplate=new vt(this,this.formElement,this.fieldInfoMap),this.options.autoCreate!==!1&&(e.forEach(t=>{this.formTemplate.addRow(t)}),this.conditionCheck(),this.options.onMounted&&this.options.onMounted.call(this))}getFieldElement(e){const t=this.fieldInfoMap.getFieldName(e);return t!=null&&t.$instance?t.$instance.getElement():null}getField(e){return this.fieldInfoMap.getFieldName(e)}_setFieldValue(e,t){this.formValue[e]=t;const i=this.fieldInfoMap.getFieldName(e);i&&i.$instance.setValue(t)}getRemoveFields(e,t=[]){var i;return t.push(e),(i=e.children)==null||i.forEach(s=>{s&&this.fieldInfoMap.get(s.$key)===s&&this.getRemoveFields(s,t)}),t}removeFieldElement(e){var o,r;const t=e.$parent;if(t&&_(t)){const d=t.$instance.getElement(),h=d.querySelector(`[data-tab-id="${e.$key}"]`),u=h==null?void 0:h.classList.contains("active");h==null||h.remove(),(o=d.querySelector(`[tab-panel-id="${e.$key}"]`))==null||o.remove();const c=d.querySelector(".df-tab-header .df-tab-item");u&&c&&t.$instance.setActive(c.getAttribute("data-tab-id")??"");return}const i=`[id="${e.$key}"]`;let s=(r=e.$instance)==null?void 0:r.getElement();(s instanceof NodeList||s instanceof HTMLCollection)&&(s=s[0]??null);const n=(s instanceof Element?s.closest(i):null)??this.formElement.querySelector(i),a=n==null?void 0:n.parentElement;n==null||n.remove(),t&&(a!=null&&a.classList.contains("df-row"))&&a.childElementCount<1&&a.remove()}removeParentChildField(e){const t=e.$parent?e.$parent.children:this.options.fields,i=t?t.indexOf(e):-1;i>-1&&(t==null||t.splice(i,1))}removeFormValue(e){const t=[e.name,e.$validName];e.renderType==="file"?t.push(e.$validName+"RemoveIds"):_(e)&&t.push(...Object.keys(e.$instance.getValue()??{})),e.$tabForm&&t.push(...Object.keys(e.$tabForm.getValue(!1)??{})),t.forEach(i=>{D(i)||delete this.formValue[i]})}validTabCheck(e){e.$parent&&(e.$parent.renderType=="tab"&&e.$parent.$instance.setActive(e.$key),this.validTabCheck(e.$parent))}conditionCheck(){this.fieldInfoMap.conditionCheck(),this.notifyChange()}notifyChange(){if(this.changeListeners.length<1)return;const e={form:this};this.changeListeners.forEach(t=>t(e))}setFieldDisabled(e,t){this.fieldInfoMap.getFieldName(e).$instance.setDisabled(t)}setFieldDescription(e,t){this.fieldInfoMap.getFieldName(e).$instance.setDescription(t)}static instance(e){let t;ae(e)?t=document.querySelector(e):t=e,t=t;let i=t.getAttribute(De);if(E(i)||D(i)){const s=Object.keys(K);if(s.length>1)throw new Error(`selector empty : [${i}]`);return i=s[0],K[i]}}getFieldInfoMap(){return this.fieldInfoMap}};Y.VERSION="0.0.19",Y.validator={string:(e,t)=>R(e,t),number:(e,t)=>de(e,t),regexp:(e,t)=>{let i={name:t.name,constraint:[]};return Ce(e,t,i)}};let z=Y;exports.DaraForm=z;
+//# sourceMappingURL=index.min.cjs.map