https://www.velux.fr/dist/velux-marketing/client/assets/UploadImageField-9d03d3b0.js

1import{u as N,_ as W}from"./vee-validate-daa3561c.js";import{a0 as q,ag as H,f as c,m as J,ce as $,D as g,E as b,P as x,F as G,u as s,aC as K,I as _,J as h,i as Q,cx as X,cy as Y,r as I,w as Z}from"./vendor-a0789617.js";import{u as ee,s as te}from"./FormTool-697a8ace.js";import{m as le}from"./lodash-86ed0c75.js";import{b as ae}from"./index-a0a0e1a1.js";import"./axios-bb6ee5b8.js";import"./vue3-lottie.es-a37e0f1c.js";import"./lottie-web-b8223fd3.js";import"./ProgressIndicator.vue_vue_type_script_setup_true_lang-56ec5508.js";import"./useEncoding-54ae9046.js";import"./yup-69374111.js";import"./swiper-ade697ba.js";/*! @license Third-party license notices: /dist/velux-marketing/client/THIRD_PARTY_NOTICES.txt */const ie={class:"grid gap-10"},oe={class:"col-span-full"},ne={class:"grid gap-6"},re={key:0,class:"col-span-full"},se={class:"grid grid-cols-1 vds_m:grid-cols-6 gap-6"},ye=q({__name:"UploadImageField",props:{image:{},id:{},title:{},errorMessage:{},required:{}},emits:["focus"],setup(v,{emit:U}){const w=v,z={id:"",required:{value:!1},errorMessage:{value:""},title:{value:""}},{id:m}=le(z,w),{t:i}=H(),d=ee(),{trackDataLayer:C}=ae(),k=U,o=c(()=>({containerTitle:i("Feature/FormTool/Upload Image Field/Container Title"),inputTitle:i("Feature/FormTool/Upload Image Field/Input Title"),buttonText:i("Feature/FormTool/Upload Image Field/Button Text"),completeText:i("Feature/FormTool/Upload Image Field/File Upload Complete"),uploadingText:i("Feature/FormTool/Upload Image Field/File Is Uploading"),invalidTypeText:i("Feature/FormTool/Upload Image Field/Invalid Text Type"),invalidSizeText:i("Feature/FormTool/Upload Image Field/Invalid Size Text"),invalidFileCountText:i("Feature/FormTool/Upload Image Field/Invalid File Count Text"),invalidOverallSizeText:i("Feature/FormTool/Upload Image Field/Invalid Overall Size Text"),wordTitle:i("Feature/FormTool/Upload Image Field/Word Title"),powerpointTitle:i("Feature/FormTool/Upload Image Field/Powerpoint Title")})),V=c(()=>d.getFormFieldData(m)||[]),{value:n,errorMessage:S}

1=N(m,void 0,{initialValue:V.value,validateOnMount:!1}),u=I([]),F=I(null),D=t=>{const e=t.name?.toLowerCase()||"",l=t.type?.toLowerCase()||"";return e.endsWith(".heic")||e.endsWith(".heif")||l==="image/heic"||l==="image/heif"},L=async t=>{if(typeof window>"u")return t;const e=(await W(()=>import("./heic2any-a162ec4d.js").then(f=>f.h),[])).default,l=await e({blob:t,toType:"image/jpeg",quality:.7}),a=Array.isArray(l)?l[0]:l,p=t.name.replace(/\.hei(c|f)$/i,".jpg");return new File([a],p,{type:"image/jpeg"})},O=t=>new Promise((e,l)=>{const a=new FileReader;a.onload=()=>e(a.result||""),a.onerror=()=>l(new Error("Unable to convert file to base64")),a.readAsDataURL(t)});let r=null;const P=t=>{const e=a=>{C("form_interaction",!1,{...a,form_field_title:w.title.value,form_field_option:t?.length})},l=d.getFormTrackingData();if(l&&Object.keys(l).length>0){e(l);return}r&&r(),r=Z(()=>d.getFormTrackingData(),a=>{a&&Object.keys(a).length>0&&(e(a),r&&(r(),r=null))},{deep:!0})},A=async t=>{P(t),u.value=await Promise.all(t.map(async e=>{if(!D(e)||!e.url)return e;const a=await(await fetch(e.url)).blob(),p=await L(new File([a],e.name||"preview.heic",{type:e.type||a.type||"image/heic"})),f=await O(p);return{...e,url:f,type:p.type}})),k("focus"),d.updateField(m,n.value)},B=t=>{const e=n.value.findIndex(l=>l.name===u.value[t]?.name);u.value.splice(t,1),e!==-1&&(n.value=[...n.value.slice(0,e),...n.value.slice(e+1)]),F.value&&(F.value.fileContainer.value=""),d.updateField(m,n.value)},y=t=>t*1e3*1e3,j=J("combinedImageUploadFilesLimit",te),T=$(),R=c(()=>T.maxAllowedFileSize?.value),E=c(()=>T.maxNumberOfUploadFiles?.value),M=c(()=>T.allowedFileTypes?.value||[]);return(t,e)=>(g(),b("div",ie,[x("div",oe,[x("div",ne,[v.title?.value?(g(),G(s(K),{key:0,field:v.title.value,size:"s",class:"text-velux-grey-800"},null,8,["field"])):_("",!0),h(s(X),{ref_key:"fileUploadContainer",ref:F,modelValue:s(n),"onUpdate:modelValue":e[0]||(e[0]=l=>Q(n)?n.value=l:null),variant:"low",title:o.value.containerTitle,subtitle:o.value.inputTitle,"button-text":o.value.buttonText,"complete-text":o.value.completeText,"uploading-text":o.value.uploadingText,"invalid-type-text":

1o.value.invalidTypeText,"invalid-size-text":o.value.invalidSizeText,"invalid-files-count-text":o.value.invalidFileCountText,"invalid-overall-size-text":o.value.invalidOverallSizeText,"max-overall-size":y(s(j)),"max-file-size":y(R.value),"max-files-count":E.value,"allowed-file-types":M.value,"error-message":s(S),onVisibleFiles:A},null,8,["modelValue","title","subtitle","button-text","complete-text","uploading-text","invalid-type-text","invalid-size-text","invalid-files-count-text","invalid-overall-size-text","max-overall-size","max-file-size","max-files-count","allowed-file-types","error-message"])])]),u.value.length?(g(),b("div",re,[x("div",se,[h(s(Y),{files:u.value,"word-title":o.value.wordTitle,"powerpoint-title":o.value.powerpointTitle,onRemoveFile:B},null,8,["files","word-title","powerpoint-title"])])])):_("",!0)]))}});export{ye as default};