"use strict";(self.webpackChunkdotcms_ui=self.webpackChunkdotcms_ui||[]).push([[1484],{81484:(b,d,l)=>{l.r(d),l.d(d,{dot_form:()=>m});var c=l(15861),a=l(55956),n=l(50394),u=l(26184),h=l(40974);const m=class{constructor(t){(0,a.r)(this,t),this.submit=(0,a.c)(this,"submit",7),this.fieldsStatus={},this.value={},this.fieldsToShow=void 0,this.resetLabel="Reset",this.submitLabel="Submit",this.layout=[],this.variable="",this.status=(0,u.g)(),this.errorMessage="",this.uploadFileInProgress=!1,this.processingSubmit=!1}onValueChange(t){const{tagName:s}=t.target,{name:e,value:o}=t.detail,r=n.f[s];"DOT-BINARY-FILE"===s&&o?this.uploadFile(t).then(i=>{this.value[e]=i&&i.id}):this.value[e]=r?r(o):o}onStatusChange({detail:t}){this.fieldsStatus[t.name]=t.status,this.status=(0,u.u)(this.status,{dotTouched:this.getTouched(),dotPristine:this.getStatusValueByName("dotPristine"),dotValid:this.getStatusValueByName("dotValid")})}layoutWatch(){this.value=this.getUpdateValue()}fieldsToShowWatch(){this.value=this.getUpdateValue()}componentWillLoad(){this.value=this.getUpdateValue()}render(){const t=(0,u.a)(this.status,this.status.dotValid);return(0,a.h)(a.H,{class:Object.assign({},t)},(0,a.h)("form",{onSubmit:this.handleSubmit.bind(this)},this.layout.map(s=>(0,a.h)("dot-form-row",{row:s,"fields-to-show":this.fieldsToShow})),(0,a.h)("div",{class:"dot-form__buttons"},(0,a.h)("button",{type:"reset",onClick:()=>this.resetForm()},this.resetLabel),(0,a.h)("button",{type:"submit",disabled:!this.status.dotValid||this.uploadFileInProgress||this.processingSubmit},this.submitLabel))),(0,a.h)("dot-error-message",null,this.errorMessage))}getStatusValueByName(t){return Object.values(this.fieldsStatus).map(s=>s[t]).every(s=>!0===s)}getTouched(){return Object.values(this.fieldsStatus).map(t=>t.dotTouched).includes(!0)}handleSubmit(t){t.preventDefault(),t.stopPropagation(),this.processingSubmit||(this.processingSubmit=!0,fetch("/api/v1/workflow/actions/default/fire/NEW",{method:"PUT",headers:{"Content-Type":"application/json"},body:JSON.stringify({contentlet:Object.assign({contentType:this.variable},this.value)})}).then(function(){var s=(0,c.Z)(function*(e){if(200!==e.status)throw{message:yield e.text(),status:e.status};return e.json()});return function(e){return s.apply(this,arguments)}}()).then(s=>{this.submit.emit(s.entity)}).catch(({message:s,status:e})=>{this.errorMessage=(0,n.a)(s)||h.f[e]}).finally(()=>{this.processingSubmit=!1}))}resetForm(){Array.from(this.el.querySelectorAll("form dot-form-column > *")).forEach(function(){var s=(0,c.Z)(function*(e){try{yield e.reset()}catch(o){console.warn(`${e.tagName}`,o)}});return function(e){return s.apply(this,arguments)}}())}getUpdateValue(){return(0,n.b)(this.layout).filter(t=>!1===t.fixed).reduce((t,{variable:s,defaultValue:e,dataType:o,values:r})=>Object.assign(Object.assign({},t),{[s]:e||("TEXT"!==o?r:null)}),{})}getMaxSize(t){const e=[...t.target.attributes].filter(o=>"max-file-length"===o.name)[0];return e&&e.value}uploadFile(t){const s=new h.D,e=t.detail.value,o=this.getMaxSize(t),r=t.target;return!o||e.size<=o?(this.uploadFileInProgress=!0,r.errorMessage="",s.uploadFile(e,o).then(i=>(this.errorMessage="",r.previewImageUrl=i.thumbnailUrl,r.previewImageName=i.fileName,this.uploadFileInProgress=!1,i)).catch(({message:i,status:_})=>(r.clearValue(),this.uploadFileInProgress=!1,r.errorMessage=(0,n.a)(i)||h.f[_],null))):(r.reset().then(()=>{r.errorMessage=`File size larger than allowed ${o} bytes`}),Promise.resolve(null))}get el(){return(0,a.g)(this)}static get watchers(){return{layout:["layoutWatch"],fieldsToShow:["fieldsToShowWatch"]}}};m.style="dot-form{display:block}dot-form>form label{margin:0;padding:0}dot-form>form dot-form-column>*{display:block;margin:2rem 0}dot-form>form dot-form-column>*:first-child{margin-top:0}dot-form>form dot-form-column>*:last-child{margin-bottom:0}dot-form>form .dot-form__buttons{display:flex;flex-direction:row;justify-content:flex-end}dot-form>form .dot-form__buttons button:last-child{margin-left:1rem}"}}]);