https://www.perwoll.ro/etc.clientlibs/heliux/clientlibs/publish/co…-d4b67f045c438cc8f982928035ecb2fe-lc.min.js

1"use strict";(self.heliuxModules=self.heliuxModules||[]).push([[2995],{38755(e,t,i){var s=i(23029),a=i(49530),n=i(50388),l=i(53954),o=i(90991),r=i(85501),c=(i(74423),i(31526)),d=i(30082);const h={selectors:{dropArea:".attachment__dropArea",dropOverlay:".attachment__dropOverlay",input:".attachment__fileInput",uploadCta:".attachment__uploadCta",attachmentList:".attachment__list",attachmentFileRow:".attachment__fileRow",attachmentFileUploaded:".attachment--uploaded",circleLoading:".circleLoading",loaderIcon:".attachment__loaderIcon",deleteIcon:".attachment__deleteIcon",successIcon:".attachment__successIcon",invalidIcon:".attachment__invalidIcon",fileError:".attachment__fileError",listError:".attachment__listError"},elements:{formStep:".formstepscontainer__step"},classes:{attachmentFileRow:"attachment__fileRow",hidden:"isHidden",disabled:"attachment--disabled",invalid:"attachment--invalid"},subscribes:{getFormId:"form:assign:child",validate:e=>`form:${e}:validate`,validateStep:e=>`form:${e}:step:validate`},publishes:{change:e=>`form:${e}:input:change`},state:{initial:{isValid:!1,errors:[]}},keys:{fileKey:"userfile"},templates:{attachmentFile:(e,t="")=>`<div class="attachment__fileRowContent">\n        <span  class="attachment__loaderIcon isHidden">\n          <svg version="1.1" viewBox="0 0 140 140" preserveAspectRatio="xMinYMin meet">\n            <circle class="circleMain" cx="50%" cy="50%" r="60"/>\n            <circle class="circleLoading" cx="50%" cy="50%" r="60"/>\n          </svg>\n        </span>\n        <span class="attachment__invalidIcon">\n          <heliux-icon><svg viewBox="0 0 24 24"><use xlink:href="#iconSprite_error"></use></svg></heliux-icon>\n        </span>\n        <span class="attachment__successIcon isHidden">\n          <heliux-icon><svg viewBox="0 0 24 24"><use xlink:href="#iconSprite_success"></use></svg></heliux-icon>\n        </span>\n        <p class="attachment__name">${e}</p>\n        <span class="attachment__deleteIcon">\n          <heliux-icon><svg viewBox="0 0 24 24"><use xlink:href="#iconSprite_close"></use></svg></heliux-icon>\n        </span>\n      </div>\n      <p class="attachment__fileError">${t}</p>`}};function u(e,t,i){return t=(0,l.A)(t),(0,n.A)(e,p()?Reflect.construct(t,i||[],(0,l.A)(e).constructor):t.apply(e,i))}function p(){try{var e=!Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],function(){}))}catch(e){}return(p=function(){return!!e})()}let f=function(e){function t(){return(0,s.A)(this,t),u(this,t,arguments)}return(0,r.A)(t,e),(0,a.A)(t,[{key:"init",value:function(){this.config={...h,...this.config},this.getElements(),this.files=[],this.fileIndex=0,this.numFilesUploaded=0,this.addEvents(),this.state={...this.config.state.initial,name:this.inputName},this.findParentForm()}},{key:"inputName",get:function(){return this.input.dataset.inputname}},{key:"filenameInputName",get:function(){return this.input.dataset.nameinputname}},{key:"sendWithForm",get:function(){const{target:e}=this.config;return"formRequest"===e}},{key:"sendAsMultipart",get:function(){return this.config.multipart}},{key:"sendToSeparateApi",get:function(){return!this.sendWithForm}},{key:"getElements",value:function(){var e,i,s;(e=t,i=this,"function"==typeof(s=(0,o.A)((0,l.A)(e.prototype),"getElements",i))?function(e){return s.apply(i,e)}:s)([]);const{elements:a}=this.config;this.formStep=this.el.closest(a.formStep)}},{key:"findParentForm",value:function(){const e=this.el.closest("form");e?.classList.contains("formcontainer__form--initialised")&&e.id?this.assignForm({formId:e.id,inputId:this.input.id}):(this.assignFormBinded=this.assignForm.bind(this),(0,c.B1)(this.config.subscribes.getFormId,this.assignFormBinded))}},{key:"assignForm",value:function(e){const{formId:t,inputId:i}=e;if(this.input.id===i){this.formId=t;const{subscribes:e}=this.config;(0,c.B1)(e.validate(this.formId),()=>this.validate()),(0,c.B1)(e.validateStep(this.formId),({index:e})=>this.validateStep(e))}}},{key:"addEvents",value:function(){this.input.addEventListener("change",()=>this.handleInputDialogFiles(),!1),["dragenter","dragover","dragleave","drop"].forEach(e

1=>{this.dropArea.addEventListener(e,e=>this.preventDefaults(e),!1),document.body.addEventListener(e,e=>this.preventDefaults(e),!1)}),["dragenter","dragover"].forEach(e=>{this.dropArea.addEventListener(e,e=>this.highlightDropArea(e),!1)}),this.dropArea.addEventListener("drop",e=>{this.unhighlightDropArea(e),this.handleInputDroppedFiles(e)},!1),this.dropArea.addEventListener("dropleave",()=>{this.dropOverlay.classList.add(this.config.classes.hidden)},!1),this.sendToSeparateApi&&this.uploadCta&&this.uploadCta.addEventListener("click",e=>this.UploadFileToSeparateApi(e),!1)}},{key:"validateStep",value:function(e){this.formStep&&this.formStep.dataset.index===e&&this.validate()}},{key:"validate",value:function(){const e={...this.state};this.isValid(),this.hideListError();const t="true"===this.config.required;if(this.sendToSeparateApi&&t){const e=this.numFilesUploaded===this.files.length;0!==this.numFilesUploaded&&e||this.showListError(this.config.notUpdatedWarningMessage)}t&&this.sendWithForm&&!this.files.length&&this.showListError("is required"),this.validateAttachedFiles(),e.isValid===this.state.isValid&&e.error===this.state.error||this.updateState()}},{key:"isValid",value:function(){this.state.isValid=!0,this.state.errors=[]}},{key:"showListError",value:function(e){this.addError(e),this.listError.textContent=e,this.listError.classList.remove(this.config.classes.hidden)}},{key:"hideListError",value:function(){this.listError.classList.add(this.config.classes.hidden)}},{key:"addError",value:function(e){this.state.isValid=!1,e&&this.state.errors.push(e),this.updateState()}},{key:"updateState",value:function(){(0,c.publish)(this.config.publishes.change(this.formId),this.state)}},{key:"preventDefaults",value:function(e){e.stopPropagation(),e.preventDefault()}},{key:"highlightDropArea",value:function(e){this.preventDefaults(e),this.dropOverlay.classList.remove(this.config.classes.hidden)}},{key:"unhighlightDropArea",value:function(){this.dropOverlay.classList.add(this.config.classes.hidden)}},{key:"validateFileSize",value:function(e){return 1e6*this.config.maxSizePerFile>=e.size||!1}},{key:"validateFileSizeSum",value:function(){const e=[];this.files.forEach(t=>e.push(t.size));const t=e.reduce((e,t)=>e+t);return this.maxFileSizeSum=1e6*Number(this.config.maxSizeSum),this.maxFileSizeSum<t||!1}},{key:"validateNumberOfFiles",value:function(){return this.files.length<=Number(this.config.allowedAttachments)}},{key:"validateAllowedFileType",value:function(e){const t=this.config.allowedFiletypes.map(e=>e.toLowerCase());return(()=>{const i=e.type.split("/").pop();return t.includes(i)||!1})()||(()=>{const i=e.name.split(".").pop();return t.includes(i)||!1})()}},{key:"validateAttachedFiles",value:function(){this.validateNumberOfFiles()?[...this.files].forEach(e=>{const t=this.attachmentList.querySelector(`[data-file-name='${e.name}']`),i=this.validateAllowedFileType(e),s=this.validateFileSize(e);if(!i||!s){let e="";t.classList.add(this.config.classes.invalid),i||(e=this.config.allowedFiletypesErrorMessage),s||(e=this.config.fileSizeErrorMessage),this.showListError(e)}}):this.showListError(this.config.allowedAttachmentsErrorMessage)}},{key:"resetInputValue",value:function(){this.input.value=""}},{key:"deleteFile",value:function(e){this.files=this.files.filter(t=>t.name!==e),this.resetInputValue()}},{key:"renderFile",value:function(e,t){const{name:i}=e;if(this.attachmentList.querySelector(`[data-file-name='${i}']`))this.files.splice(t,1);else{this.sendToSeparateApi&&this.uploadCta&&this.uploadCta.classList.remove(this.config.classes.disabled);const e=document.createElement("div");e.classList.add(this.config.classes.attachmentFileRow),e.dataset.fileName=i,e.innerHTML=this.config.templates.attachmentFile(i),e.querySelector(this.config.selectors.deleteIcon).addEventListener("click",e=>this.deleteUploadedFile(e)),this.attachmentList.append(e)}}},{key:"handleInputDroppedFiles",value:function(e){const t=e.dataTransfer.files;this.handleFiles(t)}},{key:"handleInputDialogFiles",value:function(){const{files:e}=this.input;this.handleFiles(e)}},{key:"handleFiles",value:function(e){this.files.push(...e),[...e].forEach((e,t)=>this.renderFile(e,t)),this.sendWithForm&&!this.sendAsMultipart&&this.validateAndGenerateBase64Inputs(),this.touched=!0,this.validate()}},{key:"deleteUploadedFile",value:function(e){this.preventDefaults(e);const t=e.target;if(t){const e=t.closest(this.config.selectors.attachmentFileRow),i=e.dataset.f

1ileName;e.remove(),this.el.querySelectorAll(`input[data-file-name='${i}']`).forEach(e=>e.remove()),this.deleteFile(i),this.numFilesUploaded-=1}this.validate(),this.sendToSeparateApi&&this.uploadCta&&0===this.files.length&&this.uploadCta.classList.add(this.config.classes.disabled)}},{key:"fileToBase64",value:function(e){return new Promise((t,i)=>{const s=new FileReader;s.readAsDataURL(e),s.onload=()=>t(s.result),s.onerror=e=>i(e)})}},{key:"generateInputWithName",value:function(e,t){const i=document.createElement("input");i.type="hidden";let s=`${e}${t}`;const a=e.match(/(.*)\[\](.*)/);if(a){const[,e,i]=a;s=`${e}[${t}]${i}`}return i.name=s,i}},{key:"validateAndGenerateBase64Inputs",value:function(){this.files.forEach(async(e,t)=>{const i=this.validateAllowedFileType(e),s=this.validateFileSize(e),a=this.input.parentNode.querySelector(`[data-file-name='${e.name}']`);i&&s&&!a&&this.fileToBase64(e).then(i=>{const s=this.generateInputWithName(this.inputName,t);if(s.value=i,s.dataset.fileName=e.name,this.input.parentNode.appendChild(s),this.filenameInputName){const i=this.generateInputWithName(this.filenameInputName,t);

1i.value=e.name,i.dataset.fileName=e.name,this.input.parentNode.appendChild(i)}})})}},{key:"toggleFileIcons",value:function(e){const t=e.querySelector(this.config.selectors.successIcon),i=e.querySelector(this.config.selectors.loaderIcon);t.classList.remove(this.config.classes.hidden),i.classList.add(this.config.classes.hidden),e.classList.add(this.config.classes.disabled)}},{key:"animateLoader",value:function(e){const t=e.querySelector(this.config.selectors.loaderIcon),i=e.querySelector(this.config.selectors.circleLoading);e.querySelector(this.config.selectors.deleteIcon).classList.add(this.config.classes.disabled),t.classList.remove(this.config.classes.hidden),i.animate([{strokeDashoffset:"376px"},{strokeDashoffset:"0px"}],1e3).onfinish=()=>{this.toggleFileIcons(e)}}},{key:"uploadFileToSeparateApiRequest",value:async function(e){const t=new FormData,i=this.config.endpointUrl;t.append(this.config.keys.fileKey,e);const{folderStorageInputName:s,folderStorageValue:a}=this.config;a&&a.length&&t.append(s,a);const n=await fetch(i,{method:"POST",headers:{"Ocp-Apim-Subscription-Key":this.config.subscriptionId},body:t});return await n.json()}},{key:"UploadFileToSeparateApi",value:async function(e){this.validate(),this.preventDefaults(e),[...this.files].forEach(e=>{const t=this.attachmentList.querySelector(`[data-file-name='${e.name}']`),i=this.validateAllowedFileType(e),s=this.validateFileSize(e);i&&s?this.animateLoader(t):(0,d.rG)({autoHide:!1,description:this.config.notUpdatedWarningMessage,forceRender:!0})}),this.files.forEach(e=>{const t=this.validateAllowedFileType(e),i=this.validateFileSize(e);if(t&&i&&!this.input.parentNode.querySelector(`[data-file-name='${e.name}']`)){const t=this.generateInputWithName(this.inputName,this.fileIndex);t.dataset.fileName=e.name,this.fileIndex+=1,this.uploadFileToSeparateApiRequest(e).then(e=>{const i=t.cloneNode(!0);delete i.dataset.fileName,i.name=`${t.name}_token`,i.value=e.token,this.input.parentNode.appendChild(i),t.value=e.fileReference}),this.input.parentNode.appendChild(t)}}),this.uploadCta.classList.add(this.config.classes.disabled),this.numFilesUploaded+=1,this.validate()}},{key:"disconnectedCallback",value:function(){(0,c.al)(this.config.subscribes.getFormId,this.assignFormBinded)}}])}(c.xu);(0,c.kz)({Attachment:f},0)}},e=>{e.O(0,[750],()=>e(38755)),e.O()}]);