UNPKG

@niku/ez-form

Version:

Powerful, Easy-to-use form package

8 lines (5 loc) 30.9 kB
import { reactive, defineComponent, computed, h, toRef, provide, inject, toRaw, isReactive, watch, ref, onBeforeUnmount, getCurrentInstance, useSlots, unref, shallowReactive, onBeforeMount, Fragment, nextTick } from 'vue'; import { setupDevtoolsPlugin } from '@vue/devtools-api'; import Bt from 'async-validator'; function G(e,o=[]){return e?Array.isArray(e)?e:[e]:o}var fe=Symbol("ezFormInjectKey"),Q=Symbol(),ee=Symbol(),te=Symbol(),y=reactive({});var De=()=>({name:{required:!1,type:String},form:{required:!1,type:Object},initialValues:{required:!1,type:Object},enableReinitialize:{required:!1,type:Boolean},rules:{required:!1,type:Object},validateTrigger:{required:!1,type:[String,Array]},validateMessages:{required:!1,type:Object},classPrefix:{required:!1,type:String,default:"ez"},preserveValues:{required:!1,type:Boolean,default:!0},onSubmit:{required:!1,type:Function},onChange:{required:!1,type:Function},onError:{required:!1,type:Function},onReset:{required:!1,type:Function}}),Re=()=>({label:{required:!1,type:String},name:{required:!1,type:[String,Array]},formItem:{required:!1,type:Object},defaultValue:{required:!1},valuePropName:{required:!1,type:String,default:"value"},changeEventPropName:{required:!1,type:String},blurEventPropName:{required:!1,type:String,default:"blur"},getValueFromChangeEvent:{required:!1,type:Function,default:e=>e?.target?e.target.value??e.target.checked:e},valueTransformer:{required:!1,type:Object,default:()=>({in:e=>e,out:e=>e})},autoBinding:{required:!1,type:Boolean,default:!0},inputNodeIndex:{required:!1,type:Number,default:0},rules:{required:!1,type:[Object,Array]},requiredMark:{required:!1,type:[String,Boolean],default:!0},validateTrigger:{required:!1,type:[String,Array],default:"change"},validateFirst:{required:!1,type:Boolean},noStyle:{required:!1,type:Boolean},colon:{required:!1,type:Boolean}}),Ce=()=>({label:{required:!1,type:String},name:{type:[String,Array],required:!0},formList:{required:!1,type:Object},defaultValue:{required:!1,type:Array},valuePropName:{required:!1,type:String,default:"value"},changeEventPropName:{required:!1,type:String},blurEventPropName:{required:!1,type:String,default:"blur"},getValueFromChangeEvent:{required:!1,type:Function,default:e=>e?.target?e.target.value??e.target.checked:e},valueTransformer:{required:!1,type:Object,default:()=>({in:e=>e,out:e=>e})},autoBinding:{required:!1,type:Boolean,default:!0},rules:{required:!1,type:[Object,Array]},requiredMark:{required:!1,type:[String,Boolean],default:!0},validateTrigger:{required:!1,type:[String,Array],default:"change"},validateFirst:{required:!1,type:Boolean},noStyle:{required:!1,type:Boolean}});function Oe(e,o=!1){return o?computed(()=>y[e]?.instance):y[e]?.instance}function Xe(e){for(let o in e)Object.prototype.hasOwnProperty.call(e,o)&&(e[o]=void 0);return e}function v(e){let o=Array.isArray(e)?[]:{};for(let r in e)if(Object.prototype.hasOwnProperty.call(e,r)){let t=e[r];o[r]=typeof t=="object"&&t!==null?v(t):t;}return o}function j(e){return Array.isArray(e)?e.reduce((o,r)=>(o.push(String(r)),o),[]):typeof e=="string"?e.replace(/\[([\d\w]+)\]/g,".$1").split("."):[String(e)]}function d(e){return j(e).join(".")}function Z(e,o,r=void 0){let t=j(o),n=0;for(;n<t.length&&e!=null;n++)e=e[t[n]];return n&&n===t.length?e:void 0}function de(e,o,r,t){let n=j(o),s=0;for(;s<n.length&&e!=null;s++){let i=r,a=n[s];if(s!==n.length-1){let u=e[a];i=t?t(e,a,s,n):void 0,i===void 0&&(i=typeof u=="object"?u:Number.isNaN(Number(n[s+1]))?{}:[]);}e[a]=i,e=e[a];}}function Ye(e,o){let r=j(o);if(e=Z(e,r.slice(0,-1)),e){let t=r.pop();t&&delete e[t];}}function $(e){return Object.values(e)}function _e(e,o,r=!1){function t(){let n=y[e];if(n)return n.items?n.items[d(o)]:void 0}return r?computed(()=>t()):t()}function qe(e,o,r=!1){function t(){let n=y[e];if(n)return n.lists?n.lists[d(o)]:void 0}return r?computed(()=>t()):t()}function J(e){provide(Q,e);}function re(e){provide(ee,e);}function oe(e){provide(te,e);}function _(e,o=100,r=!0){let t,n;return (...s)=>(!t&&r&&(n=e(...s)),clearTimeout(t),t=setTimeout(()=>{n=e(...s);},o),n)}function ne(e,o){let r=typeof e,t=typeof o;if(r!==t)return !1;if(r!=="object"&&t!=="object")return e===o;let n=Object.keys(e),s=Object.keys(o);if(n.length!==s.length)return !1;for(let i of n){let a=e[i],u=o[i];if(!ne(a,u))return !1}return !0}function P(e=6){let o="",r="ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789",t=r.length;for(let n=0;n<e;n++)o+=r.charAt(Math.floor(Math.random()*t));return o}function Qe(e,o,r){let t=ref(o());return watch(e,()=>{t.value=o();},r),t}function K(){return inject(fe,{})}var pe="ez-form-inspector",je,S,U,C,W,et=[],T=[],N={addForm(e,o,r){T.push({type:"form",name:e,instance:o,componentUid:r}),this?.sendInspectorTree();},removeForm(e){let o=T.findIndex(({name:r,type:t})=>r===e&&t==="form");o>-1&&(T.splice(o,1),this.sendInspectorTree());},updateFormName(e,o){let r=T.findIndex(({name:t,type:n})=>t===e&&n==="form");r>-1&&(T[r].name=o,this.sendInspectorTree());},addFormItem(e,o,r,t){T.push({type:"item",name:o,instance:r,form:e,componentUid:t}),this.sendInspectorTree();},removeFormItem(e,o){let r=T.findIndex(t=>t.type!=="item"?!1:t.form===e&&t.name===o);r!==-1&&(T.splice(r,1),this.sendInspectorTree());},updateFormItemName(e,o,r){let t=T.findIndex(n=>n.type!=="item"?!1:n.form===e&&n.name===o);t!==-1&&(T[t].name=r,this.sendInspectorTree());},updateFormItemForm(e,o,r){let t=T.find(n=>n.type!=="item"?!1:n.form===o&&n.name===e);t&&t.type==="item"&&(t.form=r,this.sendInspectorTree());},addFormList(e,o,r,t){T.push({type:"list",name:o,instance:r,form:e,componentUid:t}),this.sendInspectorTree();},removeFormList(e,o){let r=T.findIndex(t=>t.type!=="list"?!1:t.form===e&&t.name===o);r!==-1&&(T.splice(r,1),this.sendInspectorTree());},updateFormListName(e,o,r){let t=T.findIndex(n=>n.type!=="list"?!1:n.form===e&&n.name===o);t!==-1&&(T[t].name=r,this.sendInspectorTree());},updateFormListForm(e,o,r){let t=T.find(n=>n.type!=="list"?!1:n.form===o&&n.name===e);t&&t.type==="list"&&(t.form=r,this.sendInspectorTree());},sendInspectorTree:_(()=>{je?.sendInspectorTree(pe);}),sendInspectorState:_(()=>{je?.sendInspectorState(pe);})};function ae(e){window.EZ_FORM_DEVTOOL=!0,setupDevtoolsPlugin({id:"ez-form-plugin",label:"EzForm Plugin",packageName:"ez-form-plugin",homepage:"https://niku98.github.io/ez-form",app:e,settings:{}},o=>{je=o,o.addInspector({id:pe,label:"Ez Form",icon:"bolt",actions:[{icon:"clear_all",tooltip:"Clear Form Validate",action(){if(!S)return alert("Please select a form first!");S.instance.clearValidate();}},{icon:"done_all",tooltip:"Validate Form",action(){if(!S)return alert("Please select a form first!");S.instance.validate();}},{icon:"refresh",tooltip:"Reset Form",action(){if(!S)return alert("Please select a form first!");S.instance.reset();}},{icon:"check_circle",tooltip:"Submit Form",action(){if(!S)return alert("Please select a form first!");S.instance.submit();}}],nodeActions:[{icon:"clear_all",tooltip:"Clear Validate",action(){if(S){S.instance.clearValidate();return}if(U){U.instance.clearValidate();return}if(C&&W!==void 0){C.instance.clearItemValidate(W);return}if(C){C.instance.clearValidate();return}alert("Please select a node first!");}},{icon:"done_all",tooltip:"Validate",action(){if(S){S.instance.validate();return}if(U){U.instance.validate();return}if(C&&W!==void 0){C.instance.getItemFields(W).forEach(({validate:r})=>r());return}if(C){C.instance.validate();return}alert("Please select a node first!");}},{icon:"refresh",tooltip:"Reset",action(){if(S){S.instance.reset();return}if(U){U.instance.reset();return}if(C&&W!==void 0){C.instance.resetItem(W);return}if(C){C.instance.reset();return}alert("Please select a node first!");}}]}),o.on.getInspectorTree(async r=>{r.inspectorId===pe&&(et=await o.getComponentInstances(e),r.rootNodes=Rt(T.filter(({name:t})=>t.includes(r.filter))));}),o.on.getInspectorState(async r=>{S=void 0,U=void 0,C=void 0,W=void 0;let t=T.find(s=>s.type==="form"?s.name===r.nodeId:r.nodeId===`${s.form}_${s.name}`||r.nodeId.startsWith(`${s.form}_${s.name}-item-`));if(!t)return;let n=et.find(s=>s.uid.toString()===t.componentUid);if(n){o.highlightElement(n);let s=await o.getComponentBounds(n);window.scrollTo({top:s.top+window.scrollY-16,left:s.left,behavior:"smooth"});}if(t.type==="form"){S=t,r.state={"Form Info":[{key:"Dirty",value:t.instance.meta.dirty},{key:"Values",value:t.instance.meta.values},{key:"Errors",value:t.instance.meta.errors}]};return}if(r.nodeId.startsWith(`${t.form}_${t.name}-item-`)&&t.type==="list"){let s=Number(r.nodeId.replace(`${t.form}_${t.name}-item-`,""));if(Number.isNaN(s))return;C=t,W=s,r.state={"List's Item Info":[{key:"Value",value:t.instance.meta.rawValue[s]},{key:"TransformedValue",value:t.instance.meta.transformedValue[s]},{key:"Errors",value:t.instance.getErrors(s)}]};return}if(t.type==="list"){C=t,r.state={"FormList Info":[{key:"Dirty",value:t.instance.meta.dirty},{key:"Touched",value:t.instance.meta.touched},{key:"RawValue",value:t.instance.meta.rawValue},{key:"TransformedValue",value:t.instance.meta.transformedValue},{key:"Errors",value:t.instance.meta.error}]};return}U=t,r.state={"FormItem Info":[{key:"Dirty",value:t.instance.meta.dirty},{key:"Touched",value:t.instance.meta.touched},{key:"RawValue",value:t.instance.meta.rawValue},{key:"TransformedValue",value:t.instance.meta.transformedValue},{key:"Errors",value:t.instance.meta.error}]};});});}function Rt(e){let o=e.filter(n=>n.type==="form"),r=o.map(n=>({id:n.name,label:n.name,tags:[{label:"Form",textColor:16777215,backgroundColor:16007990}],children:we(e.filter(s=>s.type!=="form"&&s.form===n.name))})),t=o.map(({name:n})=>n);return r.push(...we(e.filter(n=>n.type==="form"?!1:!t.includes(n.form)))),r}function we(e,o){return e.reduce((t,n)=>(t.some(({name:i,type:a})=>a==="list"&&i!==n.name&&n.name.startsWith(`${i}.`))||t.push(n),t),[]).map(t=>{let n=e.filter(s=>s.name.startsWith(t.name)?s.name!==t.name:!1);return {label:o?t.name.replace(o,""):t.name,id:`${t.form}_${t.name}`,children:t.type==="list"?n.reduce((s,i)=>{let a=i.name.replace(new RegExp(`^${t.name}.`,"g"),"").split(".")[0];return s.findIndex(({id:m})=>m===`${t.form}_${t.name}-item-${a}`)===-1&&s.push({id:`${t.form}_${t.name}-item-${a}`,label:`${t.name} ${Number(a)+1}`,tags:[{label:"List's Item",textColor:16777215,backgroundColor:16743424}],children:we(n.filter(m=>m.name.includes(`${t.name}.${a}.`)),`${t.name}.${a}.`)}),s},[]):[],tags:t.type==="list"?[{label:"List",textColor:16777215,backgroundColor:16733986}]:[{label:"Field",textColor:16777215,backgroundColor:16750592}]}})}function ke(e){if(!window.EZ_FORM_DEVTOOL)return;let o=getCurrentInstance();N?.addForm(e.meta.name,e,o?.uid?.toString?.()??P()),watch(()=>e.meta.name,(r,t)=>{t&&r&&N.updateFormName(t,r);}),watch(()=>[e.meta.values,e.meta.errors],()=>{N.sendInspectorState();}),onBeforeUnmount(()=>{N.removeForm(e.meta.name);});}function Fe(e){let o=K(),r=reactive(toRaw(e)??{classPrefix:"ez",name:P()});r.name=r.name||P(),r.classPrefix=r.classPrefix||"ez";function t(l,g=!1){Object.assign(r,{...l,name:l.name||r.name||P(),classPrefix:l.classPrefix||"ez"}),g&&(s(r.initialValues,!0),R());}e&&isReactive(e)&&watch(e,()=>{t({...e});});let{initialValues:n,setInitialValues:s,getClonedInitialValues:i}=kt(toRef(r,"initialValues"),toRef(r,"enableReinitialize"),()=>{O(),R();}),a=reactive({dirty:!1,get name(){return r.name??""},values:i(),errors:[]});function u(l){a.dirty=!1,a.errors=[],l!==void 0&&(a.values=l);}let m=reactive({});function h(l){let g=d(l.name.value);m[g]=l,O();}function F(l){let g=d(l);r.preserveValues===!1&&Ye(a.values,l),delete m[g];}function V(l){return l?$(m).filter(({name:g})=>l?ne(g,l):!0).some(({dirty:g})=>g):a.dirty}function x(l,g,L=!0){if(de(a.values,l,g),L){a.dirty=!0;let b=m[d(l)];b&&b.markAsDirty();}}function I(l){return Z(a.values,l)}function O(){$(m).forEach(l=>{l.defaultValue!==void 0&&Z(n.value,l.name)===void 0&&de(n.value,l.name,l.defaultValue);});}function k(l){if(l){let g=d(l);m[g]?.clearValidate?.();}else $(m).forEach(({clearValidate:g})=>{g();});}function D(l,g){let L=G(l),b=L.length?$(m).filter(({name:q})=>L.some(M=>ne(j(M),j(q)))):$(m);return new Promise(async q=>{let M=await Promise.all(b.map(({name:A,validate:B})=>B(g).then(({value:Y,error:ce})=>ce||{name:A,value:Y}))),ue=M.filter(A=>!!A.messages),Ne=ue.length>0;q(Ne?{errors:ue,values:void 0}:{values:M.reduce((A,B)=>(de(A,B.name,B.value),A),{}),errors:void 0});})}watch(m,_(()=>{a.errors=$(m).map(l=>l.error).filter(l=>l!==void 0);},500),{immediate:!0});function R(l){let g=!ne(i(),{}),L=$(m);Xe(a.values),u(),L.forEach(({reset:b})=>{b();}),l?Object.assign(a.values,v(l)):g&&Object.assign(a.values,i());}let p={meta:a,fields:m,get initialValues(){return v(n.value)},submit:(l,g)=>{if(l||g){D().then(({errors:L})=>{if(L)g?.(L);else {let b=v(a.values);l?.(b);}});return}return new Promise(L=>{D().then(({errors:b})=>{let q=b===void 0?v(a.values):void 0;L({values:q,errors:b});});})},reset:R,setFieldValue:x,getFieldValue:I,validate:D,isDirty:V,updateSettings:t,addField:h,removeField:F,clearValidate:k,get classPrefix(){return r.classPrefix??""},get rules(){return r.rules},get validateMessages(){return r.validateMessages??o?.validateMessages},get validateTrigger(){return r.validateTrigger}};return (process.env.NODE_ENV==="development"||__VUE_PROD_DEVTOOLS__)&&ke(p),$t(a,p),J(p),p}function kt(e,o,r){let t=ref(e.value??{}),n=ref(e.value??{}),s=ref(u()),i=()=>n.value?v(unref(n)):{};function a(m,h=!1){n.value=v(m),h&&(t.value=v(m));}function u(){if(o.value)return watch(e.value,m=>{a(v(m),!0),r(v(m));},{deep:!0})}return watch(o,()=>{if(o.value){s.value=u();return}s.value&&s.value();}),{initialValues:n,originalInitialValues:t,setInitialValues:a,getClonedInitialValues:i}}function $t(e,o){watch(()=>e.name,(r,t)=>{let n={},s={};if(t){let a=y[t]?.items,u=y[t]?.lists;n=a?v(a):{},s=u?v(u):{},delete y[t];}let i=y[r];i?(i.instance=o,i.items={...n,...i.items},i.lists={...s,...i.lists}):y[r]={instance:o,items:n,lists:s};},{immediate:!0}),onBeforeUnmount(()=>{delete y[e.name];});}function ge(e,o){let r=e.form??Fe(e);e.form&&(r.updateSettings({...e},!0),watch(e,_(()=>{r.updateSettings({...e});},500)));let t=r.submit,n=(a,u)=>a||u?t(m=>{o("submit",m),a?.(m);},m=>{o("error",m),u?.(m);}):new Promise(m=>{t().then(({values:h,errors:F})=>{F?(o("error",F),m({errors:F})):(o("submit",h),m({values:h}));});});r.submit=n;let s=r.reset,i=a=>{s(a),o("reset");};return r.reset=i,watch(r.meta.values,a=>{o("change",v(a));}),J(r),{submit:n,reset:i,formInstance:r}}function w(){return getCurrentInstance().provides[Q]??inject(Q,{__IS_FAKE__:!0,addField(){},removeField(){},updateSettings(){},getFieldValue(){},setFieldValue(){},reset(){},clearValidate(){},async validate(){return {}},submit(){},isDirty(){return !1},meta:reactive({values:void 0,name:P(),errors:[],dirty:!1}),classPrefix:""})}function ie(){let e=w();return e.__IS_FAKE__&&Object.assign(e,{fields:{}}),e}function me(e){let o=ie(),r=ref(void 0),t=P(),n=shallowReactive(e?toRaw(e):{});function s(p){Object.assign(n,{...p});}e&&isReactive(e)&&watch(e,()=>{s({...e});});let i=reactive({get rawValue(){return o.__IS_FAKE__||!n.name?r.value:n.name?Z(o.meta.values,n.name):r.value},set rawValue(p){if(this.dirty=!0,this.touched=!0,o.__IS_FAKE__||!n.name){r.value=p;return}n.name&&o.setFieldValue(n.name,p);},get transformedValue(){return n.valueTransformer?n.valueTransformer.in(this.rawValue,o):this.rawValue},set transformedValue(p){this.rawValue=n.valueTransformer?n.valueTransformer.out(p,o):p;},get name(){return n.name},dirty:!1,touched:!1,get id(){return n.name?`${this.formName}_${j(n.name).join("_")}`:`${this.formName}_${t}`},get formName(){return o.meta.name}});function a(){i.dirty=!1,i.touched=!1,i.error=void 0,o.__IS_FAKE__||!n.name?i.rawValue=v(n.defaultValue):n.name&&(i.rawValue=Z(o.initialValues,n.name));}let u=computed(()=>G(n.validateTrigger??"change",G(o.validateTrigger))),m=computed(()=>{let p=G(n.rules);if(!n.name)return p;let l=o.rules,g=d(n.name),L=l?.[g],b=G(L);return p.concat(b)});function h(){i.error=void 0;}async function F(p){let l=p?.trigger?m.value.filter(b=>b.trigger?b.trigger===p.trigger:!0):m.value;if(l.length===0)return Promise.resolve({value:v(i.rawValue)});let g=n.label?n.label:n.name?j(n.name).pop()??P():P(),L=new Bt({[g]:l});return o.validateMessages&&L.messages(o.validateMessages),new Promise(b=>{L.validate({[g]:i.rawValue},{first:n.validateFirst??!1},q=>{q===null||q.length===0?(h(),b({value:i.rawValue})):(i.error={name:n.name??[],messages:q.map(({message:M})=>M??"")},b({error:v(i.error)}));});})}function V(p){return p instanceof Event&&p.target?p.target.value??p.target.checked:p}function x(p){i.transformedValue=n.getValueFromChangeEvent?n.getValueFromChangeEvent(p):V(p),u.value.includes("change")&&nextTick(()=>{F({trigger:"change"}).catch(()=>{});});}function I(){i.touched=!0,u.value.includes("blur")&&F({trigger:"blur"}).catch(()=>{});}onBeforeMount(()=>{n.defaultValue!==void 0&&i.rawValue===void 0&&(i.rawValue=v(n.defaultValue));});let O=K(),k=computed(()=>{if(!m.value.some(g=>g.required))return "";let l=O?.requiredMark??"*";switch(typeof n.requiredMark){case"boolean":return n.requiredMark?`'${l}'`:"";case"string":return `'${n.requiredMark}'`;default:return `'${l}'`}});function D(){return {name:computed(()=>n.name??[]),id:computed(()=>i.id),value:computed(()=>i.rawValue),validate:F,clearValidate:h,reset:a,get defaultValue(){return n.defaultValue},error:computed(()=>i.error),dirty:computed(()=>i.dirty),markAsDirty(){i.dirty=!0,i.touched=!0;}}}function R(p){p?(p.addField(D()),o=p):o.addField(D());}function z(p){n.name&&o.removeField(n.name),p&&o.removeField(p);}return {fieldMeta:i,requiredMarkString:k,registerFormField:R,unRegisterFormField:z,handleChange:x,handleBlur:I,validate:F,resetFieldMeta:a,clearValidate:h,updateProps:s,props:n,get injectedForm(){return o},getFormFieldObject:D}}function Ae(e){if(!window.EZ_FORM_DEVTOOL)return ()=>()=>{};let o=getCurrentInstance();return onBeforeUnmount(()=>{e.meta.name&&N.removeFormList(e.meta.formName,d(e.meta.name));}),()=>{if(!window.EZ_FORM_DEVTOOL)return ()=>{};let r=e.meta.formName,t=e.meta.name;e.meta.name&&N.addFormItem(e.meta.formName,d(e.meta.name),e,o?.uid?.toString?.()??P());let n=watch(()=>e.meta.name,(a,u)=>{e.meta.name&&a&&u&&N.updateFormItemName(e.meta.formName,d(u),d(a));}),s=watch(()=>e.meta.formName,(a,u)=>{e.meta.name&&N.updateFormItemForm(d(e.meta.name),u,a);}),i=watch([()=>e.meta.rawValue,()=>e.meta.touched],()=>{N.sendInspectorState();});return ()=>{t&&N.removeFormItem(r,d(t)),n(),s(),i();}}}function Ie(e){let o=me(e),{fieldMeta:r,validate:t,requiredMarkString:n,handleBlur:s,handleChange:i,resetFieldMeta:a,clearValidate:u,updateProps:m,props:h}=o,F={reset:a,meta:r,handleBlur:s,validate:t,handleChange:i,clearValidate:u,requiredMarkString:n,registerFormField:k,unRegisterFormField:D,updateProps:m,props:h},V=ref(()=>{}),x=er(r,F),I=ref(()=>()=>{}),O=ref(()=>{});(process.env.NODE_ENV==="development"||__VUE_PROD_DEVTOOLS__)&&(I.value=Ae(F));function k(R){O.value(),V.value(),o.registerFormField(R),O.value=I.value(),V.value=x();}function D(R){o.unRegisterFormField(R),O.value(),V.value();}return k(),watch(()=>h.name,(R,z)=>{z&&D(z),k();},{immediate:!0}),onBeforeUnmount(()=>{D();}),F}function er(e,o){return onBeforeUnmount(()=>{if(!e.name)return;let r=y[e.formName];if(!r)return;let t=d(e.name);r.items&&delete r.items[t];}),()=>{let r=e.formName,t=e.formName,n=watch(()=>e.name,(s,i)=>{y[e.formName]||(y[e.formName]={});let a=y[e.formName];if(!a)return;if(i){let m=d(i);a.items&&delete a.items[m];}if(!s)return;let u=d(s);a.items?a.items[u]=o:a.items={[u]:o};},{immediate:!0});return ()=>{if(!t)return;let s=y[r];if(!s)return;let i=d(t);s.items&&delete s.items[i],n();}}}function ye(e,o){let{meta:r,handleBlur:t,handleChange:n}=e,s=w(),i=computed(()=>o.changeEventPropName??`update:${o.valuePropName}`),a=useSlots(),u=computed(()=>({value:r.transformedValue,rawValue:r.rawValue,handleChange:n,form:s,error:r.error})),m=()=>a.default?h$1(a.default):[],h$1=V=>{let x=(V&&V(u))??[];if(x.length&&x[0].type===Fragment){let{children:I}=x[0];return I===null?[]:typeof I=="string"?[h(I)]:[...Array.isArray(I)?I:h$1(I.default),...x.slice(1)]}return (a.default&&a.default(u))??[]};return {getVNodesFromDefaultSlot:m,slotData:u,getInputItemProps:V=>{if(V.component===null&&["input","select","textarea"].includes(String(V.type)))return {value:r.transformedValue,onInput:n,onChange:n,onBlur:t,id:r.id};let x=`on${i.value[0].toUpperCase()}${i.value.slice(1)}`,I=`on${o.blurEventPropName[0].toUpperCase()}${o.blurEventPropName.slice(1)}`,O=o.valuePropName;return {[x]:n,[I]:t,[O]:r.transformedValue,id:r.id}}}}function ve(e,o){let r=w(),t=e.formItem??Ie(e);return e.formItem&&(t.unRegisterFormField(),t.updateProps({...e,name:t.props.name??e.name}),t.registerFormField(r),watch(e,_(()=>{t.updateProps(e);},500))),watch(()=>t.meta.rawValue,n=>{o("change",v(n),r);}),re(t),{formItemInstance:t,formInstance:r}}function Ue(e){if(!window.EZ_FORM_DEVTOOL)return ()=>()=>{};let o=getCurrentInstance();return onBeforeUnmount(()=>{e.meta.name&&N.removeFormList(e.meta.formName,d(e.meta.name));}),()=>{if(!window.EZ_FORM_DEVTOOL)return ()=>{};let r=e.meta.formName,t=e.meta.name;e.meta.name&&N.addFormList(e.meta.formName,d(e.meta.name),e,o?.uid?.toString?.()??P());let n=watch(()=>e.meta.name,(a,u)=>{e.meta.name&&a&&u&&N.updateFormListName(e.meta.formName,d(u),d(a));}),s=watch(()=>e.meta.formName,(a,u)=>{e.meta.name&&N.updateFormListForm(d(e.meta.name),u,a);}),i=watch(()=>e.meta.rawValue,()=>{N.sendInspectorState();});return ()=>{t&&N.removeFormList(r,d(t)),n(),s(),i();}}}function Pe(e){let o=me(e),{fieldMeta:r,handleChange:t,requiredMarkString:n,validate:s,resetFieldMeta:i,clearValidate:a,updateProps:u,props:m,injectedForm:h}=o,F=computed(()=>r.transformedValue&&Array.isArray(r.transformedValue)?r.transformedValue:[]),V=computed(()=>Array.isArray(m.name)?m.name:m.name?[m.name]:[]),x=computed(()=>F.value.map((f,c)=>({key:d([...V.value,c]),index:c,getNamePath(E){return d([...V.value,c,...j(E)])}})));function I(f){return $(h.fields).filter(({name:c})=>d(c).includes(d([...V.value,f])+"."))}function O(f){I(f).forEach(c=>{c.reset();});}function k(f){I(f).forEach(c=>{c.clearValidate();});}function D(f,c){return c=Array.isArray(c)?c:[c],d([...V.value,f,...c])}function R(f){return f===void 0?h.meta.errors:I(f).map(({error:c})=>c).filter(c=>!!c)}function z(f){return R(f).length>0}function p(f){let c=[...F.value];c.push(f),t(c);}function l(f,c){let E=[...F.value];E.splice(f,0,c),t(E);}function g(f){let c=[...F.value];c.unshift(f),t(c);}function L(){let f=[...F.value],c=f.pop();return t(f),c}function b(){let f=[...F.value],c=f.shift();return t(f),c}function q(f){let c=[...F.value];c.splice(f,1),t(c);}function M(f,c){let E=[...F.value],X=E.findIndex(vt=>vt[f]===c);X>-1&&E.splice(X,1),t(E);}function ue(f,c){let E=[...F.value];E[f]=c,t(E);}function Ne(f,c){let E=[...F.value],X=E[f];E[f]=E[c],E[c]=X,t(E);}function A(f,c){let E=[...F.value],X=E[f];E.splice(f,1),E.splice(c,0,X),t(E);}let B={props:m,meta:r,requiredMarkString:n,listValues:F,namePrefix:V,fields:x,reset:i,registerFormField:Le,unRegisterFormField:Se,updateProps:u,getItemFields:I,resetItem:O,clearItemValidate:k,validate:s,clearValidate:a,getNamePath:D,getErrors:R,hasError:z,add:p,insert:l,unshift:g,pop:L,shift:b,remove:q,removeByKey:M,replace:ue,swap:Ne,move:A},Y=ref(()=>{}),ce=sr(r,B),Je=ref(()=>()=>{}),xe=ref(()=>{});(process.env.NODE_ENV==="development"||__VUE_PROD_DEVTOOLS__)&&(Je.value=Ue(B));function Le(f){xe.value(),Y.value(),o.registerFormField(f),xe.value=Je.value(),Y.value=ce();}function Se(f){o.unRegisterFormField(f),xe.value(),Y.value();}return Le(),watch(()=>m.name,(f,c)=>{c&&Se(c),Le();}),onBeforeUnmount(()=>{Se();}),B}function sr(e,o){return onBeforeUnmount(()=>{if(!e.name)return;let r=y[e.formName];if(!r)return;let t=d(e.name);r.lists&&delete r.lists[t];}),()=>{let r=e.formName,t=e.formName,n=watch(()=>e.name,(s,i)=>{y[e.formName]||(y[e.formName]={});let a=y[e.formName];if(!a)return;if(i){let m=d(i);a.lists&&delete a.lists[m];}if(!s)return;let u=d(s);a.lists?a.lists[u]=o:a.lists={[u]:o};},{immediate:!0});return ()=>{if(!t)return;let s=y[r];if(!s)return;let i=d(t);s.lists&&delete s.lists[i],n();}}}function he(e,o){let r=w(),t=e.formList??Pe(e);return e.formList&&(t.unRegisterFormField(),t.updateProps(e),t.registerFormField(r),watch(e,_(()=>{t.updateProps(e);},500))),watch(()=>t.meta.rawValue,n=>{o("change",v(n),r);}),oe(t),{formListInstance:t,formInstance:r}}var cr=()=>({__IS_FAKE__:!0,props:{},handleChange(){},handleBlur(){},updateProps(){},reset(){},registerFormField(){},unRegisterFormField(){},clearValidate(){},async validate(){return {}},meta:reactive({rawValue:void 0,transformedValue:void 0,name:P(),id:P(),formName:P(),error:void 0,dirty:!1,touched:!1}),requiredMarkString:computed(()=>"")});function Ve(){return getCurrentInstance().provides[ee]??inject(ee,cr())}var Fr=()=>({__IS_FAKE__:!0,props:{name:""},async validate(){return {}},clearValidate(){},registerFormField(){},unRegisterFormField(){},meta:reactive({rawValue:void 0,transformedValue:void 0,name:P(),id:P(),formName:P(),error:void 0,dirty:!1,touched:!1}),requiredMarkString:computed(()=>""),fields:computed(()=>[]),namePrefix:computed(()=>[]),listValues:computed(()=>[]),swap(){},updateProps(){},resetItem(){},reset(){},getItemFields(){return []},clearItemValidate(){},replace(){},removeByKey(){},remove(){},move(){},hasError(){return !1},getNamePath(){return ""},getErrors(){return []},add(){},insert(){},shift(){},unshift(){},pop(){}});function ct(){return getCurrentInstance().provides[te]??inject(te,Fr())}var vr=defineComponent({name:"EzForm",props:De(),setup:(e,o)=>{let{reset:r,submit:t,formInstance:n}=ge(e,o.emit),{meta:s,setFieldValue:i,getFieldValue:a,validate:u,isDirty:m}=n,h$1=computed(()=>`${n.classPrefix}-form`);o.expose(n);let F=I=>{I.preventDefault(),t();},V=I=>{I.preventDefault(),r();},x={values:s.values,errors:s.errors,dirty:s.dirty,submit:t,reset:r,validate:u,getFieldValue:a,setFieldValue:i,isDirty:m};return ()=>h("form",{class:h$1.value,onSubmit:F,onReset:V},o.slots.default?.(x))}}),Pr=vr,ft=Pr;function Ge(e){let o=ie();if(e===void 0)return computed(()=>o.meta.errors);let r=Qe([()=>e,e,o.fields],_(()=>{let t=d(unref(e)??"");return o.fields[t]??{}},500));return computed(()=>{let t=unref(r.value.error);return t?[t]:[]})}var Er=defineComponent({name:"EzFormErrors",props:{name:{type:[String,Number,Array],required:!1}},setup:(e,o)=>{let r=Ge(toRef(e,"name"));return ()=>o.slots.default?.({errors:r})}}),br=Er,Ft=br;var xr=defineComponent({name:"EzFormItemAutoBindingInput",props:{inputNodeIndex:{type:Number,required:!1},autoBinding:{type:Boolean,required:!1},changeEventPropName:{type:String,required:!1},blurEventPropName:{type:String,required:!0},valuePropName:{type:String,required:!0}},setup:(e,o)=>{let r=Ve(),{slotData:t,getVNodesFromDefaultSlot:n,getInputItemProps:s}=ye(r,e);return e.autoBinding?()=>n().map((i,a)=>h(i,{key:i.patchFlag,...a===e.inputNodeIndex?s(i):{}},void 0)):o.slots.default?.(t)}}),Lr=xr,be=Lr;var Dr=defineComponent({name:"EzFormItemView",props:{label:{type:String,required:!1},idFor:{type:String,required:!1},requiredMark:{type:String,required:!1},noStyle:{type:Boolean,required:!1},colon:{type:Boolean,required:!1},hasError:{type:Boolean,required:!1}},setup:(e,o)=>{let r=w(),t=K(),n=computed(()=>({main:`${r.classPrefix}-form-item`,get label(){return `${this.main}-label`},get input(){return `${this.main}-input`},get errors(){return `${this.main}-errors`},get extra(){return `${this.main}-extra`}})),s=computed(()=>{let i=`--${r.classPrefix}-form-required-mark`,a=`--${r.classPrefix}-form-colon`;return {[i]:e.requiredMark,[a]:`"${e.colon??t?.colon?":":""}"`}});return ()=>h("fieldset",{class:[n.value.main,{"has-errors":e.hasError,"no-style":!!e.noStyle,required:!!e.requiredMark}],style:s},[e.label?h("label",{for:e.idFor,class:n.value.label},e.label):void 0,h("div",{class:n.value.input},{default:()=>o.slots.default?.()}),o.slots.errors&&!e.noStyle&&e.hasError?h("div",{class:n.value.errors},{default:()=>o.slots.errors?.()}):void 0,o.slots.extra&&!e.noStyle?h("div",{class:n.value.extra},{default:()=>o.slots.extra?.()}):void 0])}}),Rr=Dr,Te=Rr;var _r=defineComponent({name:"EzFormItem",props:Re(),setup:(e,o)=>{let{formItemInstance:r,formInstance:t}=ve(e,o.emit),{meta:n,requiredMarkString:s}=r,i=computed(()=>`${t.classPrefix}-form-item`);return o.expose(r),()=>h(Te,{label:e.label,idFor:n.id,requiredMark:s.value,noStyle:e.noStyle,colon:e.colon,class:i.value,hasError:!!n.error},{default:()=>h(be,{autoBinding:e.autoBinding,blurEventPropName:e.blurEventPropName,changeEventPropName:e.changeEventPropName,inputNodeIndex:e.inputNodeIndex,valuePropName:e.valuePropName},{default:a=>o.slots.default?.(a)}),errors:n.error?()=>o.slots.errors?o.slots.errors({errors:n.error,form:t,formItem:r}):n.error?.messages.map(a=>h("span",null,a)):void 0,extra:o.slots.extra?.({form:t,formItem:r})})}}),qr=_r,It=qr;var $r=defineComponent({name:"EzFormList",props:Ce(),setup:(e,o)=>{let{formListInstance:r,formInstance:t}=he(e,o.emit),{meta:n,requiredMarkString:s,listValues:i,fields:a,getErrors:u,getNamePath:m,hasError:h$1,add:F,pop:V,insert:x,unshift:I,shift:O,remove:k,removeByKey:D,swap:R,replace:z,move:p}=r,l=computed(()=>`${t.classPrefix}-form-list`);return o.expose(r),()=>h(Te,{class:l.value,label:e.label,idFor:n.id,requiredMark:s.value,noStyle:e.noStyle,hasError:!!n.error},{default:()=>o.slots.default?.({value:i.value,length:i.value.length,fields:a.value,getNamePath:m,getErrors:u,hasError:h$1,add:F,insert:x,unshift:I,shift:O,pop:V,remove:k,removeByKey:D,swap:R,replace:z,move:p,form:t}),errors:o.slots.errors?.({error:n.error,form:t,formList:r}),extra:o.slots.extra?.({form:t,formList:r})})}}),zr=$r,yt=zr;var Mr={install(e){(process.env.NODE_ENV==="development"||__VUE_PROD_DEVTOOLS__)&&ae(e);}};var Ar={},Br={install(e,o){let r=Object.assign(Ar,o);r.validateMessages&&e.provide(fe,r),e.component("EzForm",ft),e.component("EzFormItem",It),e.component("EzFormList",yt),e.component("EzFormItemAutoBindingInput",be),e.component("EzFormErrors",Ft),ae(e);}},Xa=Br; export { ft as EzForm, Mr as EzFormDevtool, Ft as EzFormErrors, It as EzFormItem, be as EzFormItemAutoBindingInput, yt as EzFormList, Xa as default, De as getFormDefinePropsObject, Oe as getFormInstance, Re as getFormItemDefinePropsObject, _e as getFormItemInstance, Ce as getFormListDefinePropsObject, qe as getFormListInstance, J as provideFormInstance, re as provideFormItemInstance, oe as provideFormListInstance, K as useEzFormPluginOptions, Fe as useForm, ge as useFormComponentLogics, Ie as useFormItem, ye as useFormItemAutoBinding, ve as useFormItemComponentLogics, Pe as useFormList, he as useFormListComponentLogics, w as useInjectForm, Ve as useInjectFormItem, ct as useInjectFormList };