helithre-vue/helithre-vue.js.umd.cjs

Helithre allows you to create pages and forms in Vue using JSON configuration

(function(e,p){typeof exports=="object"&&typeof module<"u"?module.exports=p(require("vue")):typeof define=="function"&&define.amd?define(["vue"],p):(e=typeof globalThis<"u"?globalThis:e||self,e["helithre-vue"]=p(e.Vue))})(this,function(e){"use strict";const p=o=>{if(o===void 0)throw new Error("The value was undefined");if(o===null)throw new Error("The value was null");return o};class u{name;loadMap;constructor(t){this.loadMap=new Map,this.name=p(t)}get getLoadMap(){return this.loadMap}get getLoadArray(){return Array.from(this.loadMap,([n,r])=>({id:n,...r}))}get getName(){return this.name}}const f={form:"form",page:"page"};class y{save;edit;delete;name;constructor(t,n,r,s){if(this.save=new Map,this.edit=new Map,this.delete=new Map,this.name="Default_wrapper",t.size>0&&(this.save=t),n.size>0&&(this.edit=n),r.size>0&&(this.delete=r),typeof s!="string")throw new Error("The given wrapper name was not a string");if(s.trim().length<=0)throw new Error("The given wrapper name was not at least 1 char in lenght");this.name=s.trim()}get getObjToEmit(){return{name:this.name,type:f.form,results:{save:this.save,edit:this.edit,delete:this.delete}}}}class M extends u{errorMessageOpenIssue="The id of the response is null or undefined, open an issue on https://github.com/LorenzoCirelli/helithre-vue/issues";saveMap;editMap;deleteMap;responsesMap;constructor(t,n,r){super(r),this.parseChildrens(t),this.responsesMap=new Map,n!=null&&n!=null&&n.forEach(s=>{this.setResponsesMap=s}),this.saveMap=new Map,this.editMap=new Map,this.deleteMap=new Map}getComponent(){return"form"}get getResponsesMap(){return this.responsesMap}set setSaveMap(t){if(t.id==null||t.id==null)throw new Error(this.errorMessageOpenIssue);this.saveMap.set(t.id,t.value)}set setEditMap(t){if(t.id==null||t.id==null)throw new Error(this.errorMessageOpenIssue);this.editMap.set(t.id,t.value)}set setDeleteMap(t){if(t.id==null||t.id==null)throw new Error(this.errorMessageOpenIssue);this.deleteMap.set(t.id,t.value)}get getSaveMap(){return this.saveMap}get getEditMap(){return this.editMap}get getDeleteMap(){return this.deleteMap}responseForId(t){return this.responsesMap.get(t)}autoSetItem(t,n){const r=this.responseForId(t);return r==null?n.length>0?(this.setSaveMap={id:t,value:n},!0):!1:r!=null&&r!=n&&n!=""?(this.setEditMap={id:t,value:n},!0):r!=null&&r!=n&&n==""?(this.setDeleteMap={id:t,value:n},!0):!1}set setResponsesMap(t){t.value.length>0?this.responsesMap.set(t.id,t.value):this.responsesMap.delete(t.id)}clearSaved(){this.saveMap=new Map}createResultToEmit(){return new y(this.getSaveMap,this.getEditMap,this.deleteMap,this.name).getObjToEmit}set setLoadMap(t){this.loadMap.set(t.id,t.value)}parseChildrens(t){t.forEach(n=>{this.setLoadMap={id:n.id,value:{text:n.text,type:n.type,choices:n?.choices?.length!=null?n.choices:null}}})}}class k extends u{constructor(t,n){super(n),this.parseChildrens(t)}getComponent(){return"page"}set setLoadMap(t){this.loadMap.set(t.id,t.value)}parseChildrens(t){t.forEach(n=>{if(n.type!=null&&n.text!=null){const r={id:n.id,value:{text:n?.text,type:n?.type,elements:n?.elements,src:n?.src}};this.setLoadMap=r}else throw new Error("Type or text was passed as null for the page")})}}const c={text:"text",number:"number",date:"date",color:"color",datetimeLocal:"datetime-local",email:"email",file:"file",hidden:"hidden",image:"image",month:"month",password:"password",range:"range",reset:"reset",search:"search",tel:"tel",time:"time",url:"url",week:"week",select:"select",checkbox:"checkbox"};class x{text;id;constructor(t,n){this.text=t,this.id=n}}let h=class extends x{type;constructor(t,n,r){super(String(p(t)),String(p(n))),this.type=this.checkIfTypeIsValid(String(p(r)))}checkIfTypeIsValid(t){if(t in c)return t;throw new Error(`Type for input was not in the accepted list, ${t} received`)}};class B extends h{choices;constructor(t,n,r,s){if(super(t,n,r),s===null)throw new Error("No choices set for multiple option input");this.choices=p(s)}get getchoices(){return this.choices}}const b=["for"],_=["type","id"],C=["name"],I=e.defineComponent({__name:"CheckBoxInput",props:{conf:{type:Object,required:!0,default:()=>({text:void 0,id:void 0})},response:{type:String,required:!1,default:""}},setup(o){const t=o,n=new h(t.conf?.text,t.conf?.id,t.conf?.type),r=e.ref(!1);return t.response=="true"&&(r.value=!0),(s,i)=>(e.openBlock(),e.createElementBlock(e.Fragment,null,[e.createElementVNode("label",{for:e.unref(n).id},e.toDisplayString(e.unref(n).text),9,b),e.withDirectives(e.createElementVNode("input",{type:e.unref(n).type,"onUpdate:modelValue":i[0]||(i[0]=a=>r.value=a),id:e.unref(n).id},null,8,_),[[e.vModelDynamic,r.value]]),e.withDirectives(e.createElementVNode("input",{type:"hidden",name:e.unref(n).id,"onUpdate:modelValue":i[1]||(i[1]=a=>r.value=a)},null,8,C),[[e.vModelText,r.value]])],64))}}),T=["for"],S=["name","id"],$=["value","selected"],L=e.defineComponent({__name:"SelectInput",props:{conf:{type:Object,required:!0,default:()=>({text:void 0,id:void 0})},response:{type:String,required:!1,default:""}},setup(o){const t=o,n=new B(t.conf?.text,t.conf?.id,t.conf?.type,t.conf?.choices);return(r,s)=>(e.openBlock(),e.createElementBlock(e.Fragment,null,[e.createElementVNode("label",{for:e.unref(n).id},e.toDisplayString(e.unref(n).text),9,T),e.createElementVNode("select",{name:e.unref(n).id,id:e.unref(n).id},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(e.unref(n).getchoices,(i,a)=>(e.openBlock(),e.createElementBlock("option",{value:i.questionAnswerId,key:a,selected:o.response==i.questionAnswerId},e.toDisplayString(i.text),9,$))),128))],8,S)],64))}}),j=e.defineAsyncComponent(()=>Promise.resolve().then(()=>ye)),g={name:"BasicInput",props:{conf:{type:Object,required:!0,default:()=>({text:void 0,id:void 0})},response:{type:String,required:!1,default:""}}};function l(o){return e.defineComponent({name:g.name,props:g.props,setup(t){return()=>e.h(j,{response:t.response,conf:{...t.conf,type:p(o)}})}})}const O=l(c.text),F=l(c.number),V=l(c.date),D=l(c.color),q=l(c.datetimeLocal),N=l(c.email);l(c.file);const P=l(c.hidden),R=l(c.image),A=l(c.month),z=l(c.password);l(c.range);const J=l(c.reset),U=l(c.search),H=l(c.tel),W=l(c.time),G=l(c.url),K=l(c.week),Q=new Map([["text",O],["number",F],["date",V],["color",D],["datetimeLocal",q],["email",N],["hidden",P],["image",R],["month",A],["password",z],["reset",J],["search",U],["tel",H],["time",W],["url",G],["week",K],["select",L],["checkbox",I]]),X=["id"],Y=e.defineComponent({__name:"FormElement",props:{name:{type:String,required:!1,default:""}},emits:["formChange"],setup(o,{emit:t}){const n=t;function r(s){const i=s.target;if(i==null)throw new Error("The passed value of the form was null");const a=new FormData(i);n("formChange",a)}return(s,i)=>(e.openBlock(),e.createElementBlock("form",{onSubmit:e.withModifiers(r,["prevent"]),class:"helithreForm",id:o.name},[e.renderSlot(s.$slots,"default"),i[0]||(i[0]=e.createElementVNode("input",{type:"submit"},null,-1))],40,X))}}),Z=e.defineComponent({__name:"HelithreForm",props:{wrapper:{}},emits:["submitEvent"],setup(o,{emit:t}){const n=t,r=i=>{if(i==null)throw new Error("Undefined type for component type is not accepted");const a=Q.get(p(i));if(a==null)throw new Error("The required component cannot be render, because is not in the map");return a},s=i=>{o.wrapper?.clearSaved(),i.forEach((a,d)=>{const m={id:d,value:String(a)};o.wrapper?.autoSetItem(m.id,m.value)&&(o.wrapper.setResponsesMap={id:m.id,value:m.value})});try{n("submitEvent",p(o.wrapper?.createResultToEmit()))}catch(a){console.error(`Error genereting event action, open an issue on https://github.com/LorenzoCirelli/helithre-vue/issues. ${a}`)}};return(i,a)=>(e.openBlock(),e.createBlock(Y,{onFormChange:s,name:i.wrapper.getName},{default:e.withCtx(()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(i.wrapper?.getLoadArray,(d,m)=>(e.openBlock(),e.createElementBlock("div",{key:m},[(e.openBlock(),e.createBlock(e.resolveDynamicComponent(r(d.type)),{conf:d,response:i.wrapper?.responseForId(d.id)},null,8,["conf","response"]))]))),128))]),_:1},8,["name"]))}}),v=["id"],w=e.defineComponent({__name:"TextElement",props:{conf:{type:Object}},setup(o){return(t,n)=>(e.openBlock(),e.createElementBlock("p",{id:o.conf?.id,class:"helithrePageText"},e.toDisplayString(o.conf?.text),9,v))}}),ee={class:"helithrePageList"},te=["id"],ne=e.defineComponent({__name:"ListElement",props:{conf:{type:Object,required:!0}},setup(o){const t=e.computed(()=>{if((o.conf.text.length==0||o.conf.text==null||o.conf.text==null)&&(o.conf.text=""),o.conf.id!=null)return{id:o.conf?.id,text:o.conf?.text};throw new Error("Id cannot be null")});return(n,r)=>(e.openBlock(),e.createElementBlock(e.Fragment,null,[e.createVNode(w,{conf:t.value},null,8,["conf"]),e.createElementVNode("ul",ee,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(o.conf?.elements,s=>(e.openBlock(),e.createElementBlock("li",{key:s.id,id:o.conf?.id},e.toDisplayString(s.value),9,te))),128))])],64))}}),oe=["src","alt","title","id"],re=e.defineComponent({__name:"ImageElement",props:{conf:{type:Object}},setup(o){const t=e.computed(()=>{if(o.conf?.src==null||o.conf?.src==null||o.conf?.src.length==0)throw new Error("Impossible to load image from an non well defined url");return o.conf?.src});return(n,r)=>(e.openBlock(),e.createElementBlock("img",{src:t.value,alt:o.conf?.text,title:o.conf?.text,id:o.conf?.id,class:"helithrePageImage"},null,8,oe))}}),se=["id"],ie=["src"],ae=e.defineComponent({__name:"VideoElement",props:{conf:{type:Object}},setup(o){const t=e.computed(()=>{if(o.conf?.src==null||o.conf?.src==null||o.conf?.src?.length==0)throw new Error("The defined video url is not well formed");return o.conf?.src});return(n,r)=>(e.openBlock(),e.createElementBlock("video",{controls:"",id:o.conf?.id,class:"helithrePageVideo"},[e.createElementVNode("source",{src:t.value,type:"video/mp4"},null,8,ie),r[0]||(r[0]=e.createTextVNode(" Error: HTML video element is not supported by your browser, please try to update! "))],8,se))}}),ce=["href","id"],le=e.defineComponent({__name:"LinkElement",props:{conf:{type:Object}},setup(o){return(t,n)=>(e.openBlock(),e.createElementBlock("a",{href:o.conf?.src,id:o.conf?.id,class:"helithrePageLink"},e.toDisplayString(o.conf?.text),9,ce))}});e.defineAsyncComponent(()=>Promise.resolve().then(()=>he));const pe=new Map([["text",w],["list",ne],["image",re],["video",ae],["link",le]]),de=(o,t)=>{const n=o.__vccOpts||o;for(const[r,s]of t)n[r]=s;return n},me={};function fe(o,t){return e.renderSlot(o.$slots,"default")}const E=de(me,[["render",fe]]),he=Object.freeze(Object.defineProperty({__proto__:null,default:E},Symbol.toStringTag,{value:"Module"})),ue=e.defineComponent({__name:"HelithrePage",props:{wrapper:{}},emits:["submitEvent"],setup(o,{emit:t}){const n=r=>{if(r==null)throw new Error("Undefined type for component type is not accepted");const s=pe.get(p(r));if(s==null)throw new Error("The required component cannot be render, because is not in the map");return s};return(r,s)=>(e.openBlock(),e.createBlock(E,null,{default:e.withCtx(()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(r.wrapper?.getLoadArray,(i,a)=>(e.openBlock(),e.createElementBlock("span",{key:a},[(e.openBlock(),e.createBlock(e.resolveDynamicComponent(n(i.type)),{conf:i},null,8,["conf"]))]))),128))]),_:1}))}}),ge=e.defineComponent({__name:"HelithreLoad",props:{helithreJson:{}},emits:["helitreEvent"],setup(o,{emit:t}){const n=t;let r;const s=o.helithreJson.wrapper?.trim();if(s===f.form)r=new M(o.helithreJson.childrens,o.helithreJson.responses,o.helithreJson.name);else if(s===f.page)r=new k(o.helithreJson.childrens,o.helithreJson.name);else throw new Error("Invalid wrapper type");function i(a){n("helitreEvent",a)}return(a,d)=>e.unref(r).getComponent()==="form"?(e.openBlock(),e.createBlock(Z,{key:0,wrapper:e.unref(r),onSubmitEvent:i},null,8,["wrapper"])):(e.openBlock(),e.createBlock(ue,{key:1,wrapper:e.unref(r)},null,8,["wrapper"]))}}),we=["for"],Ee=["type","id","name","value"],ye=Object.freeze(Object.defineProperty({__proto__:null,default:e.defineComponent({__name:"BasicInput",props:{conf:{type:Object,required:!0},response:{type:String,default:null,required:!1}},setup(o){const t=o,n=new h(t.conf?.text,t.conf?.id,t.conf?.type);return(r,s)=>(e.openBlock(),e.createElementBlock(e.Fragment,null,[e.createElementVNode("label",{for:e.unref(n).id},e.toDisplayString(e.unref(n).text),9,we),e.createElementVNode("input",{type:e.unref(n).type,id:e.unref(n).id,name:e.unref(n).id,value:o.response},null,8,Ee)],64))}})},Symbol.toStringTag,{value:"Module"}));return ge});