vue-form-schema
Version:
Two ways drag and drop form creator for Vue.
1 lines • 35 kB
JavaScript
!function(e,a){if("object"==typeof exports&&"object"==typeof module)module.exports=a();else if("function"==typeof define&&define.amd)define([],a);else{var t=a();for(var n in t)("object"==typeof exports?exports:e)[n]=t[n]}}(window,function(){return function(e){var a={};function t(n){if(a[n])return a[n].exports;var l=a[n]={i:n,l:!1,exports:{}};return e[n].call(l.exports,l,l.exports,t),l.l=!0,l.exports}return t.m=e,t.c=a,t.d=function(e,a,n){t.o(e,a)||Object.defineProperty(e,a,{enumerable:!0,get:n})},t.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},t.t=function(e,a){if(1&a&&(e=t(e)),8&a)return e;if(4&a&&"object"==typeof e&&e&&e.__esModule)return e;var n=Object.create(null);if(t.r(n),Object.defineProperty(n,"default",{enumerable:!0,value:e}),2&a&&"string"!=typeof e)for(var l in e)t.d(n,l,function(a){return e[a]}.bind(null,l));return n},t.n=function(e){var a=e&&e.__esModule?function(){return e.default}:function(){return e};return t.d(a,"a",a),a},t.o=function(e,a){return Object.prototype.hasOwnProperty.call(e,a)},t.p="",t(t.s=0)}([function(e,a,t){"use strict";t.r(a);var n=function(){var e=this,a=e.$createElement,t=e._self._c||a;return t("div",{attrs:{id:"vue-form-gen-main"}},[t("div",{staticClass:"vue-form-gen-builder-restore"},[t("fieldset",[t("legend",[e._v("Restore:")]),e._v(" "),e._l(e.deleted,function(a,n){return t("button",{key:"restore-"+n,staticClass:"vue-form-gen-button",on:{click:function(t){return e.restore(a)}}},[e._v(e._s(a.type)+" ⋙")])})],2)]),e._v(" "),t("div",{ref:"display",staticClass:"vue-form-gen-builder list"},[e._l(e.listed,function(a,n){return[e.removed(n,a.type)?e._e():t(e.editor?"fieldset":"span",{tag:"component"},[e.editor?t("legend",[e._v(e._s(a.type)+":")]):e._e(),e._v(" "),t(e.defaultConfig.container.tag,e._b({ref:"exportable",refInFor:!0,tag:"component",style:e.editor?"":"width:98%"},"component",e.defaultConfig.container.attributes,!1),[e.defaultConfig.showLabel&&a.label.text?t("label",{class:a.label.class,domProps:{innerHTML:e._s(a.label.text)}}):e._e(),e._v(" "),"radio"===a.type||"checkbox"===a.type?[e._l(a.options,function(l,i){return[t(e.templates[a.type],e._b({tag:"component",attrs:{id:"radio-"+n+"-"+i}},"component",e.attributes(a),!1)),e._v(" "),t("label",{attrs:{for:"radio-"+n+"-"+i}},[e._v(e._s(l.name))])]})]:"select"===a.type?[t(e.templates[a.type].select,e._b({tag:"comment"},"comment",e.attributes(a),!1),e._l(a.options,function(l,i){return t(e.templates[a.type].option,{key:"radio-"+n+"-"+i,tag:"component",attrs:{value:a.useName?l.value:l.name}},[e._v("\n "+e._s(l.name)+"\n ")])}),1)]:"button"===a.type?[t(e.templates[a.type],e._b({tag:"comment",domProps:{innerHTML:e._s(a.content)}},"comment",e.attributes(a),!1))]:"paragraph"===a.type||"label"===a.type?[t(e.templates[a.type],e._b({tag:"comment",domProps:{innerHTML:e._s(a.content)}},"comment",e.attributes(a),!1))]:[t(e.templates[a.type],e._b({tag:"comment"},"comment",e.attributes(a),!1))]],2),e._v(" "),e.editor?t("div",{staticClass:"vue-form-gen-action"},[t("span",{class:e.action.remove.class,style:e.action.remove.style,attrs:{title:"Delete Element"},domProps:{innerHTML:e._s(e.action.remove.icon)},on:{click:function(t){return e.remove(n,a.type)}}}),e._v(" "),t("span",{directives:[{name:"show",rawName:"v-show",value:!e.toggle[n],expression:"! toggle[i]"}],class:e.action.toggle.class,style:e.action.toggle.style,domProps:{innerHTML:e._s(e.action.toggle.show)},on:{click:function(a){e.toggle[n]=!0}}}),e._v(" "),t("span",{directives:[{name:"show",rawName:"v-show",value:e.toggle[n],expression:"toggle[i]"}],class:e.action.toggle.class,style:e.action.toggle.style,domProps:{innerHTML:e._s(e.action.toggle.hide)},on:{click:function(a){e.toggle[n]=!1}}}),e._v(" "),e.count>1?[n===e.count-1?t("span",{class:e.action.move.class,style:e.action.move.style,domProps:{innerHTML:e._s(e.action.move.up)},on:{click:function(t){return e.moveElement("up",a,n)}}}):0===n?t("span",{class:e.action.move.class,style:e.action.move.style,domProps:{innerHTML:e._s(e.action.move.down)},on:{click:function(t){return e.moveElement("down",a,n)}}}):[t("span",{class:e.action.move.class,style:e.action.move.style,domProps:{innerHTML:e._s(e.action.move.up)},on:{click:function(t){return e.moveElement("up",a,n)}}},[e._v("⇑")]),e._v(" "),t("span",{class:e.action.move.class,style:e.action.move.style,domProps:{innerHTML:e._s(e.action.move.down)},on:{click:function(t){return e.moveElement("down",a,n)}}})]]:e._e()],2):e._e(),e._v(" "),e.editor?t("div",{directives:[{name:"show",rawName:"v-show",value:e.toggle[n],expression:"toggle[i]"}],staticStyle:{"margin-top":"10px",display:"block",padding:"10px","border-top":"1px solid #ddd"}},["paragraph"===a.type||"label"===a.type?[t("label",[e._v(" Content\n "),t("textarea",{directives:[{name:"model",rawName:"v-model",value:a.content,expression:"e.content"}],attrs:{rows:"4",cols:"70"},domProps:{value:a.content},on:{input:function(t){t.target.composing||e.$set(a,"content",t.target.value)}}})])]:[e.hide[a.type].indexOf("name")<0?[t("div",{staticClass:"vue-form-gen-rendered"},[t("span",[e._v("Name")]),e._v(" "),t("input",{directives:[{name:"model",rawName:"v-model",value:a.name,expression:"e.name"}],attrs:{type:"text"},domProps:{value:a.name},on:{keyup:function(t){return e.resolveLP(a,n)},input:function(t){t.target.composing||e.$set(a,"name",t.target.value)}}})])]:e._e(),e._v(" "),"button"!==a.type?[e.hide[a.type].indexOf("required")<0?[t("div",{staticClass:"vue-form-gen-rendered"},[t("input",{directives:[{name:"model",rawName:"v-model",value:a.required,expression:"e.required"}],attrs:{id:"required"+n,type:"checkbox"},domProps:{checked:Array.isArray(a.required)?e._i(a.required,null)>-1:a.required},on:{change:function(t){var n=a.required,l=t.target,i=!!l.checked;if(Array.isArray(n)){var o=e._i(n,null);l.checked?o<0&&e.$set(a,"required",n.concat([null])):o>-1&&e.$set(a,"required",n.slice(0,o).concat(n.slice(o+1)))}else e.$set(a,"required",i)}}}),e._v(" "),t("label",{attrs:{for:"required"+n}},[e._v("Required")])])]:e._e(),e._v(" "),e.hide[a.type].indexOf("label")<0?[t("fieldset",[t("legend",[e._v("Label:")]),e._v(" "),t("span",[e._v("Name")]),e._v(" "),t("input",{attrs:{type:"text"},on:{keyup:function(e){return a.label.text=e.target.value}}}),e._v(" "),t("span",[e._v("Class")]),e._v(" "),t("input",{attrs:{type:"text"},on:{keyup:function(e){return a.label.class=e.target.value}}})])]:e._e(),e._v(" "),"radio"===a.type||"checkbox"===a.type||"select"===a.type?[t("fieldset",[t("legend",[e._v("Options:")]),e._v(" "),t("input",{directives:[{name:"model",rawName:"v-model",value:a.useName,expression:"e.useName"}],attrs:{type:"checkbox",id:"option-list"+n},domProps:{checked:Array.isArray(a.useName)?e._i(a.useName,null)>-1:a.useName},on:{change:function(t){var n=a.useName,l=t.target,i=!!l.checked;if(Array.isArray(n)){var o=e._i(n,null);l.checked?o<0&&e.$set(a,"useName",n.concat([null])):o>-1&&e.$set(a,"useName",n.slice(0,o).concat(n.slice(o+1)))}else e.$set(a,"useName",i)}}}),e._v(" "),t("label",{attrs:{for:"option-list"+n}},[e._v("Use Name as value?")]),e._v(" "),e._l(a.options,function(n,l){return t("div",["checkbox"===e.defaultConfig.additional.inputs.type?t("input",e._b({directives:[{name:"model",rawName:"v-model",value:n.name,expression:"attr.name"}],attrs:{placeholder:"Name",type:"checkbox"},domProps:{checked:Array.isArray(n.name)?e._i(n.name,null)>-1:n.name},on:{change:function(a){var t=n.name,l=a.target,i=!!l.checked;if(Array.isArray(t)){var o=e._i(t,null);l.checked?o<0&&e.$set(n,"name",t.concat([null])):o>-1&&e.$set(n,"name",t.slice(0,o).concat(t.slice(o+1)))}else e.$set(n,"name",i)}}},"input",e.defaultConfig.additional.inputs,!1)):"radio"===e.defaultConfig.additional.inputs.type?t("input",e._b({directives:[{name:"model",rawName:"v-model",value:n.name,expression:"attr.name"}],attrs:{placeholder:"Name",type:"radio"},domProps:{checked:e._q(n.name,null)},on:{change:function(a){return e.$set(n,"name",null)}}},"input",e.defaultConfig.additional.inputs,!1)):t("input",e._b({directives:[{name:"model",rawName:"v-model",value:n.name,expression:"attr.name"}],attrs:{placeholder:"Name",type:e.defaultConfig.additional.inputs.type},domProps:{value:n.name},on:{input:function(a){a.target.composing||e.$set(n,"name",a.target.value)}}},"input",e.defaultConfig.additional.inputs,!1)),e._v(" "),a.useName?["checkbox"===e.defaultConfig.additional.inputs.type?t("input",e._b({directives:[{name:"model",rawName:"v-model",value:n.value,expression:"attr.value"}],attrs:{placeholder:"Value",type:"checkbox"},domProps:{checked:Array.isArray(n.value)?e._i(n.value,null)>-1:n.value},on:{change:function(a){var t=n.value,l=a.target,i=!!l.checked;if(Array.isArray(t)){var o=e._i(t,null);l.checked?o<0&&e.$set(n,"value",t.concat([null])):o>-1&&e.$set(n,"value",t.slice(0,o).concat(t.slice(o+1)))}else e.$set(n,"value",i)}}},"input",e.defaultConfig.additional.inputs,!1)):"radio"===e.defaultConfig.additional.inputs.type?t("input",e._b({directives:[{name:"model",rawName:"v-model",value:n.value,expression:"attr.value"}],attrs:{placeholder:"Value",type:"radio"},domProps:{checked:e._q(n.value,null)},on:{change:function(a){return e.$set(n,"value",null)}}},"input",e.defaultConfig.additional.inputs,!1)):t("input",e._b({directives:[{name:"model",rawName:"v-model",value:n.value,expression:"attr.value"}],attrs:{placeholder:"Value",type:e.defaultConfig.additional.inputs.type},domProps:{value:n.value},on:{input:function(a){a.target.composing||e.$set(n,"value",a.target.value)}}},"input",e.defaultConfig.additional.inputs,!1))]:e._e(),e._v(" "),t("button",e._b({on:{click:function(e){return a.options.splice(l,1)}}},"button",e.defaultConfig.additional.remove,!1),[e._v("⊗")])],2)}),e._v(" "),t("button",e._b({on:{click:function(e){return a.options.push({name:null,value:null})}}},"button",e.defaultConfig.additional.add,!1),[e._v("Add option")])],2)]:"textarea"===a.type?[e.hide[a.type].indexOf("cols")<0?[t("div",{staticClass:"vue-form-gen-rendered"},[t("span",[e._v("Cols")]),e._v(" "),t("input",{directives:[{name:"model",rawName:"v-model",value:a.cols,expression:"e.cols"}],attrs:{type:"text"},domProps:{value:a.cols},on:{input:function(t){t.target.composing||e.$set(a,"cols",t.target.value)}}})])]:e._e(),e._v(" "),e.hide[a.type].indexOf("rows")<0?[t("div",{staticClass:"vue-form-gen-rendered"},[t("span",[e._v("Rows")]),e._v(" "),t("input",{directives:[{name:"model",rawName:"v-model",value:a.rows,expression:"e.rows"}],attrs:{type:"text"},domProps:{value:a.rows},on:{input:function(t){t.target.composing||e.$set(a,"rows",t.target.value)}}})])]:e._e(),e._v(" "),e.hide[a.type].indexOf("maxlength")<0?[t("div",{staticClass:"vue-form-gen-rendered"},[t("span",[e._v("Max Length")]),e._v(" "),t("input",{directives:[{name:"model",rawName:"v-model",value:a.maxlength,expression:"e.maxlength"}],attrs:{type:"number"},domProps:{value:a.maxlength},on:{input:function(t){t.target.composing||e.$set(a,"maxlength",t.target.value)}}})])]:e._e(),e._v(" "),e.hide[a.type].indexOf("readonly")<0?t("div",[t("div",{staticClass:"vue-form-gen-rendered"},[t("input",{directives:[{name:"model",rawName:"v-model",value:a.readonly,expression:"e.readonly"}],attrs:{id:"readonly"+n,type:"checkbox"},domProps:{checked:Array.isArray(a.readonly)?e._i(a.readonly,null)>-1:a.readonly},on:{change:function(t){var n=a.readonly,l=t.target,i=!!l.checked;if(Array.isArray(n)){var o=e._i(n,null);l.checked?o<0&&e.$set(a,"readonly",n.concat([null])):o>-1&&e.$set(a,"readonly",n.slice(0,o).concat(n.slice(o+1)))}else e.$set(a,"readonly",i)}}}),e._v(" "),t("label",{attrs:{for:"readonly"+n}},[e._v("Readonly")])])]):e._e()]:["file"!==a.type&&e.hide[a.type].indexOf("placeholder")<0?[t("div",{staticClass:"vue-form-gen-rendered"},[t("span",[e._v("Placeholder")]),e._v(" "),t("input",{directives:[{name:"model",rawName:"v-model",value:a.placeholder,expression:"e.placeholder"}],attrs:{type:"text"},domProps:{value:a.placeholder},on:{input:function(t){t.target.composing||e.$set(a,"placeholder",t.target.value)}}})])]:e._e(),e._v(" "),"file"!==a.type&&e.hide[a.type].indexOf("min")<0?[t("div",{staticClass:"vue-form-gen-rendered"},[t("span",[e._v("Min")]),e._v(" "),t("input",{directives:[{name:"model",rawName:"v-model",value:a.min,expression:"e.min"}],attrs:{type:"number"},domProps:{value:a.min},on:{input:function(t){t.target.composing||e.$set(a,"min",t.target.value)}}})])]:e._e(),e._v(" "),"file"!==a.type&&e.hide[a.type].indexOf("max")<0?[t("div",{staticClass:"vue-form-gen-rendered"},[t("span",[e._v("Max")]),e._v(" "),t("input",{directives:[{name:"model",rawName:"v-model",value:a.max,expression:"e.max"}],attrs:{type:"number"},domProps:{value:a.max},on:{input:function(t){t.target.composing||e.$set(a,"max",t.target.value)}}})])]:e._e(),e._v(" "),"file"===a.type&&e.hide[a.type].indexOf("multiple")<0?[t("div",{staticClass:"vue-form-gen-rendered"},[t("input",{directives:[{name:"model",rawName:"v-model",value:a.multiple,expression:"e.multiple"}],attrs:{id:a.name+n,type:"checkbox"},domProps:{checked:Array.isArray(a.multiple)?e._i(a.multiple,null)>-1:a.multiple},on:{change:function(t){var n=a.multiple,l=t.target,i=!!l.checked;if(Array.isArray(n)){var o=e._i(n,null);l.checked?o<0&&e.$set(a,"multiple",n.concat([null])):o>-1&&e.$set(a,"multiple",n.slice(0,o).concat(n.slice(o+1)))}else e.$set(a,"multiple",i)}}}),e._v(" "),t("label",{attrs:{for:a.name+n}},[e._v("Multiple")])])]:e._e(),e._v(" "),"file"!==a.type&&e.hide[a.type].indexOf("default")<0?[t("div",{staticClass:"vue-form-gen-rendered"},[t("span",[e._v("Default")]),e._v(" "),t("input",{directives:[{name:"model",rawName:"v-model",value:a.value,expression:"e.value"}],attrs:{type:"text"},domProps:{value:a.value},on:{input:function(t){t.target.composing||e.$set(a,"value",t.target.value)}}})])]:e._e(),e._v(" "),"file"!==a.type&&e.hide[a.type].indexOf("pattern")<0?[t("div",{staticClass:"vue-form-gen-rendered"},[t("span",[e._v("Pattern")]),e._v(" "),t("input",{directives:[{name:"model",rawName:"v-model",value:a.pattern,expression:"e.pattern"}],attrs:{type:"text"},domProps:{value:a.pattern},on:{input:function(t){t.target.composing||e.$set(a,"pattern",t.target.value)}}})])]:e._e(),e._v(" "),"file"!==a.type&&e.hide[a.type].indexOf("autofocus")<0?[t("div",{staticClass:"vue-form-gen-rendered"},[t("input",{directives:[{name:"model",rawName:"v-model",value:a.autofocus,expression:"e.autofocus"}],attrs:{id:"autofocus"+n,type:"checkbox"},domProps:{checked:Array.isArray(a.autofocus)?e._i(a.autofocus,null)>-1:a.autofocus},on:{change:function(t){var n=a.autofocus,l=t.target,i=!!l.checked;if(Array.isArray(n)){var o=e._i(n,null);l.checked?o<0&&e.$set(a,"autofocus",n.concat([null])):o>-1&&e.$set(a,"autofocus",n.slice(0,o).concat(n.slice(o+1)))}else e.$set(a,"autofocus",i)}}}),e._v(" "),t("label",{attrs:{for:"autofocus"+n}},[e._v("Autofocus")])])]:e._e(),e._v(" "),"file"!==a.type&&e.hide[a.type].indexOf("autocomplete")<0?[t("div",{staticClass:"vue-form-gen-rendered"},[t("span",[e._v("Autocomplete")]),e._v(" "),t("select",{directives:[{name:"model",rawName:"v-model",value:a.autocomplete,expression:"e.autocomplete"}],on:{change:function(t){var n=Array.prototype.filter.call(t.target.options,function(e){return e.selected}).map(function(e){return"_value"in e?e._value:e.value});e.$set(a,"autocomplete",t.target.multiple?n:n[0])}}},[t("option",{attrs:{value:"",disabled:"",selected:""}},[e._v("Select")]),e._v(" "),t("option",{attrs:{value:"on"}},[e._v("On")]),e._v(" "),t("option",{attrs:{value:"off"}},[e._v("Off")])])])]:e._e()]]:[[t("div",{staticClass:"vue-form-gen-rendered"},[t("span",[e._v("Content "),t("i",[e._v("(accepts HTML)")])]),e._v(" "),t("input",{directives:[{name:"model",rawName:"v-model",value:a.content,expression:"e.content"}],attrs:{type:"text"},domProps:{value:a.content},on:{input:function(t){t.target.composing||e.$set(a,"content",t.target.value)}}})])],e._v(" "),t("div",{staticClass:"vue-form-gen-rendered"},[t("label",{class:e.defaultConfig.class.buttonType.span},[e._v("Type:")]),e._v(" "),t("select",{directives:[{name:"model",rawName:"v-model",value:a.buttonType,expression:"e.buttonType"}],class:e.defaultConfig.class.buttonType.select,on:{change:function(t){var n=Array.prototype.filter.call(t.target.options,function(e){return e.selected}).map(function(e){return"_value"in e?e._value:e.value});e.$set(a,"buttonType",t.target.multiple?n:n[0])}}},[t("option",{attrs:{value:"button"}},[e._v("Button")]),e._v(" "),t("option",{attrs:{value:"reset"}},[e._v("Reset")]),e._v(" "),t("option",{attrs:{value:"submit"}},[e._v("Bubmit")])])])],e._v(" "),e.templates[a.type]?t("div",[t("div",{staticClass:"vue-form-gen-rendered"},[t("input",{directives:[{name:"model",rawName:"v-model",value:a.disabled,expression:"e.disabled"}],attrs:{id:"disabled"+n,type:"checkbox"},domProps:{checked:Array.isArray(a.disabled)?e._i(a.disabled,null)>-1:a.disabled},on:{change:function(t){var n=a.disabled,l=t.target,i=!!l.checked;if(Array.isArray(n)){var o=e._i(n,null);l.checked?o<0&&e.$set(a,"disabled",n.concat([null])):o>-1&&e.$set(a,"disabled",n.slice(0,o).concat(n.slice(o+1)))}else e.$set(a,"disabled",i)}}}),e._v(" "),t("label",{attrs:{for:"disabled"+n}},[e._v("Disabled")])])]):e._e(),e._v(" "),t("fieldset",[t("legend",[e._v("Additional Attributes:")]),e._v(" "),e._l(a.additionalAttr,function(n,l){return t("div",{staticClass:"vue-form-gen-attributes-options"},["checkbox"===e.defaultConfig.additional.inputs.type?t("input",e._b({directives:[{name:"model",rawName:"v-model",value:n.name,expression:"attr.name"}],attrs:{placeholder:"Name",type:"checkbox"},domProps:{checked:Array.isArray(n.name)?e._i(n.name,null)>-1:n.name},on:{change:function(a){var t=n.name,l=a.target,i=!!l.checked;if(Array.isArray(t)){var o=e._i(t,null);l.checked?o<0&&e.$set(n,"name",t.concat([null])):o>-1&&e.$set(n,"name",t.slice(0,o).concat(t.slice(o+1)))}else e.$set(n,"name",i)}}},"input",e.defaultConfig.additional.inputs,!1)):"radio"===e.defaultConfig.additional.inputs.type?t("input",e._b({directives:[{name:"model",rawName:"v-model",value:n.name,expression:"attr.name"}],attrs:{placeholder:"Name",type:"radio"},domProps:{checked:e._q(n.name,null)},on:{change:function(a){return e.$set(n,"name",null)}}},"input",e.defaultConfig.additional.inputs,!1)):t("input",e._b({directives:[{name:"model",rawName:"v-model",value:n.name,expression:"attr.name"}],attrs:{placeholder:"Name",type:e.defaultConfig.additional.inputs.type},domProps:{value:n.name},on:{input:function(a){a.target.composing||e.$set(n,"name",a.target.value)}}},"input",e.defaultConfig.additional.inputs,!1)),e._v(" "),"checkbox"===e.defaultConfig.additional.inputs.type?t("input",e._b({directives:[{name:"model",rawName:"v-model",value:n.value,expression:"attr.value"}],attrs:{placeholder:"Value",type:"checkbox"},domProps:{checked:Array.isArray(n.value)?e._i(n.value,null)>-1:n.value},on:{change:function(a){var t=n.value,l=a.target,i=!!l.checked;if(Array.isArray(t)){var o=e._i(t,null);l.checked?o<0&&e.$set(n,"value",t.concat([null])):o>-1&&e.$set(n,"value",t.slice(0,o).concat(t.slice(o+1)))}else e.$set(n,"value",i)}}},"input",e.defaultConfig.additional.inputs,!1)):"radio"===e.defaultConfig.additional.inputs.type?t("input",e._b({directives:[{name:"model",rawName:"v-model",value:n.value,expression:"attr.value"}],attrs:{placeholder:"Value",type:"radio"},domProps:{checked:e._q(n.value,null)},on:{change:function(a){return e.$set(n,"value",null)}}},"input",e.defaultConfig.additional.inputs,!1)):t("input",e._b({directives:[{name:"model",rawName:"v-model",value:n.value,expression:"attr.value"}],attrs:{placeholder:"Value",type:e.defaultConfig.additional.inputs.type},domProps:{value:n.value},on:{input:function(a){a.target.composing||e.$set(n,"value",a.target.value)}}},"input",e.defaultConfig.additional.inputs,!1)),e._v(" "),t("button",e._b({on:{click:function(e){return a.additionalAttr.splice(l,1)}}},"button",e.defaultConfig.additional.remove,!1),[e._v("⊗")])])}),e._v(" "),t("button",e._b({on:{click:function(e){return a.additionalAttr.push({name:null,value:null})}}},"button",e.defaultConfig.additional.add,!1),[e._v("Add Attribute")])],2)]],2):e._e()],1)]}),e._v(" "),e.exported?[t("div",{staticClass:"vue-form-gen-export"},[t("pre",[e._v(e._s(e.exported))])])]:e._e()],2),e._v(" "),t("div",{staticClass:"vue-form-gen-element-list"},[e._l(e.list,function(a){return t("div",{key:a,ref:"draggable",refInFor:!0,staticClass:"vue-form-gen-draggable",attrs:{draggable:"true","data-id":a}},[e._v("\n "+e._s(a)+"\n ")])}),e._v(" "),t("div",{staticClass:"vue-form-gen-export-btn"},[e.defaultConfig.buttons.html.show?t("button",{class:e.defaultConfig.buttons.html.class,domProps:{innerHTML:e._s(e.defaultConfig.buttons.html.content)},on:{click:function(a){return e.extract("html")}}}):e._e(),e._v(" "),e.defaultConfig.buttons.json.show?t("button",{class:e.defaultConfig.buttons.json.class,domProps:{innerHTML:e._s(e.defaultConfig.buttons.json.content)},on:{click:function(a){return e.extract("json")}}}):e._e(),e._v(" "),e.defaultConfig.buttons.view.show?t("button",{class:e.defaultConfig.buttons.view.class,domProps:{innerHTML:e._s(e.defaultConfig.buttons.view.content)},on:{click:e.toggleEditor}}):e._e()])],2)])};n._withStripped=!0;const l=[{name:"Afghanistan",value:"AF"},{name:"land Islands",value:"AX"},{name:"Albania",value:"AL"},{name:"Algeria",value:"DZ"},{name:"American Samoa",value:"AS"},{name:"AndorrA",value:"AD"},{name:"Angola",value:"AO"},{name:"Anguilla",value:"AI"},{name:"Antarctica",value:"AQ"},{name:"Antigua and Barbuda",value:"AG"},{name:"Argentina",value:"AR"},{name:"Armenia",value:"AM"},{name:"Aruba",value:"AW"},{name:"Australia",value:"AU"},{name:"Austria",value:"AT"},{name:"Azerbaijan",value:"AZ"},{name:"Bahamas",value:"BS"},{name:"Bahrain",value:"BH"},{name:"Bangladesh",value:"BD"},{name:"Barbados",value:"BB"},{name:"Belarus",value:"BY"},{name:"Belgium",value:"BE"},{name:"Belize",value:"BZ"},{name:"Benin",value:"BJ"},{name:"Bermuda",value:"BM"},{name:"Bhutan",value:"BT"},{name:"Bolivia",value:"BO"},{name:"Bosnia and Herzegovina",value:"BA"},{name:"Botswana",value:"BW"},{name:"Bouvet Island",value:"BV"},{name:"Brazil",value:"BR"},{name:"British Indian Ocean Territory",value:"IO"},{name:"Brunei Darussalam",value:"BN"},{name:"Bulgaria",value:"BG"},{name:"Burkina Faso",value:"BF"},{name:"Burundi",value:"BI"},{name:"Cambodia",value:"KH"},{name:"Cameroon",value:"CM"},{name:"Canada",value:"CA"},{name:"Cape Verde",value:"CV"},{name:"Cayman Islands",value:"KY"},{name:"Central African Republic",value:"CF"},{name:"Chad",value:"TD"},{name:"Chile",value:"CL"},{name:"China",value:"CN"},{name:"Christmas Island",value:"CX"},{name:"Cocos (Keeling) Islands",value:"CC"},{name:"Colombia",value:"CO"},{name:"Comoros",value:"KM"},{name:"Congo",value:"CG"},{name:"Congo, The Democratic Republic of the",value:"CD"},{name:"Cook Islands",value:"CK"},{name:"Costa Rica",value:"CR"},{name:'Cote D"Ivoire',value:"CI"},{name:"Croatia",value:"HR"},{name:"Cuba",value:"CU"},{name:"Cyprus",value:"CY"},{name:"Czech Republic",value:"CZ"},{name:"Denmark",value:"DK"},{name:"Djibouti",value:"DJ"},{name:"Dominica",value:"DM"},{name:"Dominican Republic",value:"DO"},{name:"Ecuador",value:"EC"},{name:"Egypt",value:"EG"},{name:"El Salvador",value:"SV"},{name:"Equatorial Guinea",value:"GQ"},{name:"Eritrea",value:"ER"},{name:"Estonia",value:"EE"},{name:"Ethiopia",value:"ET"},{name:"Falkland Islands (Malvinas)",value:"FK"},{name:"Faroe Islands",value:"FO"},{name:"Fiji",value:"FJ"},{name:"Finland",value:"FI"},{name:"France",value:"FR"},{name:"French Guiana",value:"GF"},{name:"French Polynesia",value:"PF"},{name:"French Southern Territories",value:"TF"},{name:"Gabon",value:"GA"},{name:"Gambia",value:"GM"},{name:"Georgia",value:"GE"},{name:"Germany",value:"DE"},{name:"Ghana",value:"GH"},{name:"Gibraltar",value:"GI"},{name:"Greece",value:"GR"},{name:"Greenland",value:"GL"},{name:"Grenada",value:"GD"},{name:"Guadeloupe",value:"GP"},{name:"Guam",value:"GU"},{name:"Guatemala",value:"GT"},{name:"Guernsey",value:"GG"},{name:"Guinea",value:"GN"},{name:"Guinea-Bissau",value:"GW"},{name:"Guyana",value:"GY"},{name:"Haiti",value:"HT"},{name:"Heard Island and Mcdonald Islands",value:"HM"},{name:"Holy See (Vatican City State)",value:"VA"},{name:"Honduras",value:"HN"},{name:"Hong Kong",value:"HK"},{name:"Hungary",value:"HU"},{name:"Iceland",value:"IS"},{name:"India",value:"IN"},{name:"Indonesia",value:"ID"},{name:"Iran, Islamic Republic Of",value:"IR"},{name:"Iraq",value:"IQ"},{name:"Ireland",value:"IE"},{name:"Isle of Man",value:"IM"},{name:"Israel",value:"IL"},{name:"Italy",value:"IT"},{name:"Jamaica",value:"JM"},{name:"Japan",value:"JP"},{name:"Jersey",value:"JE"},{name:"Jordan",value:"JO"},{name:"Kazakhstan",value:"KZ"},{name:"Kenya",value:"KE"},{name:"Kiribati",value:"KI"},{name:'Korea, Democratic People"S Republic of',value:"KP"},{name:"Korea, Republic of",value:"KR"},{name:"Kuwait",value:"KW"},{name:"Kyrgyzstan",value:"KG"},{name:'Lao People"S Democratic Republic',value:"LA"},{name:"Latvia",value:"LV"},{name:"Lebanon",value:"LB"},{name:"Lesotho",value:"LS"},{name:"Liberia",value:"LR"},{name:"Libyan Arab Jamahiriya",value:"LY"},{name:"Liechtenstein",value:"LI"},{name:"Lithuania",value:"LT"},{name:"Luxembourg",value:"LU"},{name:"Macao",value:"MO"},{name:"Macedonia, The Former Yugoslav Republic of",value:"MK"},{name:"Madagascar",value:"MG"},{name:"Malawi",value:"MW"},{name:"Malaysia",value:"MY"},{name:"Maldives",value:"MV"},{name:"Mali",value:"ML"},{name:"Malta",value:"MT"},{name:"Marshall Islands",value:"MH"},{name:"Martinique",value:"MQ"},{name:"Mauritania",value:"MR"},{name:"Mauritius",value:"MU"},{name:"Mayotte",value:"YT"},{name:"Mexico",value:"MX"},{name:"Micronesia, Federated States of",value:"FM"},{name:"Moldova, Republic of",value:"MD"},{name:"Monaco",value:"MC"},{name:"Mongolia",value:"MN"},{name:"Montenegro",value:"ME"},{name:"Montserrat",value:"MS"},{name:"Morocco",value:"MA"},{name:"Mozambique",value:"MZ"},{name:"Myanmar",value:"MM"},{name:"Namibia",value:"NA"},{name:"Nauru",value:"NR"},{name:"Nepal",value:"NP"},{name:"Netherlands",value:"NL"},{name:"Netherlands Antilles",value:"AN"},{name:"New Caledonia",value:"NC"},{name:"New Zealand",value:"NZ"},{name:"Nicaragua",value:"NI"},{name:"Niger",value:"NE"},{name:"Nigeria",value:"NG"},{name:"Niue",value:"NU"},{name:"Norfolk Island",value:"NF"},{name:"Northern Mariana Islands",value:"MP"},{name:"Norway",value:"NO"},{name:"Oman",value:"OM"},{name:"Pakistan",value:"PK"},{name:"Palau",value:"PW"},{name:"Palestinian Territory, Occupied",value:"PS"},{name:"Panama",value:"PA"},{name:"Papua New Guinea",value:"PG"},{name:"Paraguay",value:"PY"},{name:"Peru",value:"PE"},{name:"Philippines",value:"PH"},{name:"Pitcairn",value:"PN"},{name:"Poland",value:"PL"},{name:"Portugal",value:"PT"},{name:"Puerto Rico",value:"PR"},{name:"Qatar",value:"QA"},{name:"Reunion",value:"RE"},{name:"Romania",value:"RO"},{name:"Russian Federation",value:"RU"},{name:"RWANDA",value:"RW"},{name:"Saint Helena",value:"SH"},{name:"Saint Kitts and Nevis",value:"KN"},{name:"Saint Lucia",value:"LC"},{name:"Saint Pierre and Miquelon",value:"PM"},{name:"Saint Vincent and the Grenadines",value:"VC"},{name:"Samoa",value:"WS"},{name:"San Marino",value:"SM"},{name:"Sao Tome and Principe",value:"ST"},{name:"Saudi Arabia",value:"SA"},{name:"Senegal",value:"SN"},{name:"Serbia",value:"RS"},{name:"Seychelles",value:"SC"},{name:"Sierra Leone",value:"SL"},{name:"Singapore",value:"SG"},{name:"Slovakia",value:"SK"},{name:"Slovenia",value:"SI"},{name:"Solomon Islands",value:"SB"},{name:"Somalia",value:"SO"},{name:"South Africa",value:"ZA"},{name:"South Georgia and the South Sandwich Islands",value:"GS"},{name:"Spain",value:"ES"},{name:"Sri Lanka",value:"LK"},{name:"Sudan",value:"SD"},{name:"Suriname",value:"SR"},{name:"Svalbard and Jan Mayen",value:"SJ"},{name:"Swaziland",value:"SZ"},{name:"Sweden",value:"SE"},{name:"Switzerland",value:"CH"},{name:"Syrian Arab Republic",value:"SY"},{name:"Taiwan, Province of China",value:"TW"},{name:"Tajikistan",value:"TJ"},{name:"Tanzania, United Republic of",value:"TZ"},{name:"Thailand",value:"TH"},{name:"Timor-Leste",value:"TL"},{name:"Togo",value:"TG"},{name:"Tokelau",value:"TK"},{name:"Tonga",value:"TO"},{name:"Trinidad and Tobago",value:"TT"},{name:"Tunisia",value:"TN"},{name:"Turkey",value:"TR"},{name:"Turkmenistan",value:"TM"},{name:"Turks and Caicos Islands",value:"TC"},{name:"Tuvalu",value:"TV"},{name:"Uganda",value:"UG"},{name:"Ukraine",value:"UA"},{name:"United Arab Emirates",value:"AE"},{name:"United Kingdom",value:"GB"},{name:"United States",value:"US"},{name:"United States Minor Outlying Islands",value:"UM"},{name:"Uruguay",value:"UY"},{name:"Uzbekistan",value:"UZ"},{name:"Vanuatu",value:"VU"},{name:"Venezuela",value:"VE"},{name:"Viet Nam",value:"VN"},{name:"Virgin Islands, British",value:"VG"},{name:"Virgin Islands, U.S.",value:"VI"},{name:"Wallis and Futuna",value:"WF"},{name:"Western Sahara",value:"EH"},{name:"Yemen",value:"YE"},{name:"Zambia",value:"ZM"},{name:"Zimbabwe",value:"ZW"}],i={};var o=function(e,a,t,n,l,i,o,u){var r,s="function"==typeof e?e.options:e;if(a&&(s.render=a,s.staticRenderFns=t,s._compiled=!0),n&&(s.functional=!0),i&&(s._scopeId="data-v-"+i),o?(r=function(e){(e=e||this.$vnode&&this.$vnode.ssrContext||this.parent&&this.parent.$vnode&&this.parent.$vnode.ssrContext)||"undefined"==typeof __VUE_SSR_CONTEXT__||(e=__VUE_SSR_CONTEXT__),l&&l.call(this,e),e&&e._registeredComponents&&e._registeredComponents.add(o)},s._ssrRegister=r):l&&(r=u?function(){l.call(this,this.$root.$options.shadowRoot)}:l),r)if(s.functional){s._injectStyles=r;var d=s.render;s.render=function(e,a){return r.call(a),d(e,a)}}else{var m=s.beforeCreate;s.beforeCreate=m?[].concat(m,r):[r]}return{exports:e,options:s}}({props:["config","import","move","template"],name:"vue-form-schema",data(){return{deleted:[],templates:Object.assign({},{text:"input",file:"input",email:"input",number:"input",hidden:"input",password:"input",range:"input",url:"input",radio:"input",checkbox:"input",textarea:"textarea",button:"button",select:{select:"select",option:"option"},countries:{select:"select",option:"option"},paragraph:"p",label:"label",date:"input",time:"input"},this.template),toggle:{},defaultConfig:{hide:{},class:{select:"input",countries:"input",button:"button",textarea:"input",buttonType:{span:"span",select:"input"}},action:{remove:{icon:"⊗",class:null,style:"font-size:16px;cursor:pointer;color:red"},move:{up:"⇧",down:"⇩",class:null,style:"font-size:16px;cursor:pointer;"},toggle:{show:"⊕",hide:"⊖",class:null,style:"font-size:16px;cursor:pointer;"}},additional:{inputs:{style:null,class:null},add:{style:"margin-top:10px"},remove:{style:"margin-top:10px"}},showLabel:!0,container:{tag:"div",attributes:{class:"vue-form-gen-element"}},buttons:null},listed:[],exported:null,editor:!0}},computed:{list(){return Object.keys(this.templates)},hide(){return this.defaultConfig.hide},count(){return this.listed.length},action(){return this.defaultConfig.action}},created(){this.config.buttons?(this.config.buttons.html=Object.assign({},{class:"vue-form-gen-button",show:!0,click:null,content:"Extract Html"},this.config.buttons.html||{}),this.config.buttons.json=Object.assign({},{class:"vue-form-gen-button",show:!0,click:null,content:"Extract JSON"},this.config.buttons.json||{}),this.config.buttons.view=Object.assign({},{class:"vue-form-gen-button",show:!0,click:null,content:"View"},this.config.buttons.view||{})):this.config.button={html:{class:"vue-form-gen-button",show:!0,click:null,content:"Extract Html"},json:{class:"vue-form-gen-button",show:!0,click:null,content:"Extract JSON"},view:{class:"vue-form-gen-button",show:!0,click:null,content:"View"}},this.defaultConfig=Object.assign({},this.defaultConfig,this.config),Array.isArray(this.import)&&(this.import.forEach((e,a)=>{this.$set(this.defaultConfig.hide,e.type,[]),this.$set(this.toggle,a,!1)}),this.listed=this.import)},mounted(){const e=this.$refs.display;let a=0;e.addEventListener("drop",e=>{e.preventDefault();let t=e.dataTransfer.getData("text"),n=null;["radio","checkbox","select"].indexOf(t)>=0?n=[{name:"Yes",value:1},{name:"No",value:0}]:"countries"===t&&(n=l,t="select");const i={type:t,required:!1,name:null,label:{text:null,class:null},placeholder:null,value:null,pattern:null,autofocus:null,autocomplete:null,min:null,max:null,useName:!0,options:n,multiple:!1,additionalAttr:[],cols:null,rows:null,maxlength:null,readonly:null,disabled:null,buttonType:"button",content:"Content",class:this.defaultConfig.class[t]||"input"};this.$set(this.defaultConfig.hide,t,this.defaultConfig.hide[t]||[]),this.$set(this.toggle,a,!1),this.listed.push(i),this.$emit("add",i),a++},!1),e.addEventListener("dragover",e=>{e.preventDefault()},!1),e.addEventListener("dragenter",e=>{e.preventDefault()},!1),this.$refs.draggable.forEach(a=>{a.addEventListener("dragstart",a=>{e.classList.add("vue-form-gen-drag-start"),a.dataTransfer.setData("text",a.target.getAttribute("data-id"))},!1),a.addEventListener("dragend",a=>{e.classList.remove("vue-form-gen-drag-start")},!1)})},methods:{toggleEditor(){this.editor=!this.editor,this.defaultConfig.buttons.view.click&&this.defaultConfig.buttons.view.click(this.editor)},attributes(e){let a={};return Object.keys(e).forEach(t=>{"type"===t&&"select"===e.type||"content"===t||"buttonType"===t&&"button"!==e.type||"type"===t&&"textarea"===e.type||("additionalAttr"!==t?null!==e[t]&&void 0!==e[t]&&["label","options","useName"].indexOf(t)<0&&("boolean"==typeof e[t]?e[t]&&(a[t]=""):"buttonType"===t&&"button"===e.type?a.type=e[t]:a[t]=e[t]):e.additionalAttr.forEach(e=>{a[e.name]=e.value}))}),a},resolveLP(e,a){let t=null;e.name&&(t=e.name.split(/-|_| /).map(e=>{if(e.length)return e[0].toUpperCase()+e.slice(1)}).join(" "));const n=a+e.type;void 0===i[n]&&(i[n]={label:null,placeholder:null});const l=i[n];e.label.text===l.label&&(e.label.text=t,l.label=t),e.placeholder===l.placeholder&&(e.placeholder=t,l.placeholder=t)},moveElement(e,a,t){const n="up"===e?t-1:t+1,l=this.listed[n];this.$set(this.listed,n,this.listed[t]),this.$set(this.listed,t,l),this.$emit("move",e,a,t,n)},extract(e){if("html"===e){let e="";this.$refs.exportable.forEach(a=>e+=a.outerHTML.replace("\x3c!----\x3e","")+"\n"),this.defaultConfig.buttons.html.click&&this.defaultConfig.buttons.html.click(e),this.exported=e}else this.exported=JSON.stringify(this.listed.filter((e,a)=>!this.removed(a,e.type)))+"\n",this.defaultConfig.buttons.json.click&&this.defaultConfig.buttons.json.click(this.exported)},remove(e,a){this.deleted.push({i:e.toString(),type:a})},removed(e,a){return this.deleted.find(t=>t.i===e.toString()&&t.type===a)},restore(e){this.deleted.splice(this.deleted.indexOf(e),1)}}},n,[],!1,null,null,null);o.options.__file="src/VueFormSchema.vue";var u=o.exports;a.default=u}])});