@fewangsit/wangsvue-fats 1.0.0-alpha.41 → 1.0.0-alpha.42

package/components/image/Image-BZ31CL-y.es.js

@@ -0,0 +1,169 @@
+import { defineComponent as j, computed as p, onMounted as G, onUnmounted as M, shallowRef as f, createBlock as W, openBlock as n, unref as q, mergeProps as I, withCtx as b, createElementBlock as m, normalizeStyle as k, Fragment as _, createElementVNode as U, renderList as T, withDirectives as A, vShow as H, withModifiers as D, createVNode as C, normalizeClass as z } from "vue";
+import { l as J } from "../../vendor/primevue-CadmDhWp.es.js";
+import { u as K, m as Q } from "../animation/Animation-COWVilAA.es.js";
+import { _ as F } from "../button/Button-D-MSv_AS.es.js";
+import { _ as X } from "../icon/Icon-mDqG7urn.es.js";
+const Y = ["src"], Z = ["src"], ee = ["src"], te = ["src", "onClick"], ie = /* @__PURE__ */ j({
+  __name: "Image",
+  props: {
+    src: {},
+    size: {},
+    width: {},
+    rounded: { type: Boolean },
+    imageStyle: {},
+    imageClass: {},
+    galleries: {},
+    indicatorIcon: {},
+    zoomInDisabled: { type: Boolean },
+    zoomOutDisabled: { type: Boolean },
+    pt: {},
+    ptOptions: {},
+    unstyled: { type: Boolean },
+    getImageURL: { type: Function },
+    placeholder: {}
+  },
+  setup(O) {
+    const r = O, { defaultProps: x } = K("Image"), c = p(() => Q(r, x));
+    G(() => {
+      setTimeout(() => {
+        $();
+      }, 3e3);
+    }), M(() => {
+      w();
+    });
+    const o = f(0), v = f(), L = f(), h = f(!1), E = p(() => {
+      var e;
+      return !h.value && !((e = u.value) != null && e.toString().includes("data:image/png;base64")) && u.value !== c.value.placeholder;
+    }), N = () => {
+      const e = r.galleries ?? [];
+      o.value = (o.value + 1) % e.length, y();
+    }, P = () => {
+      const e = r.galleries ?? [];
+      o.value = (o.value - 1 + e.length) % e.length, y();
+    }, $ = () => {
+      var e;
+      w(), (e = r.galleries) != null && e.length && (v.value = window.setInterval(() => {
+        const t = r.galleries ?? [];
+        o.value = (o.value + 1) % t.length;
+      }, 3e3));
+    }, w = () => {
+      v.value && (window.clearInterval(v.value), v.value = void 0);
+    }, S = p(() => r.width != null ? r.width : r.size === "small" ? 30 : r.size === "medium" ? 80 : 125), u = p(() => {
+      var e, t;
+      return !r.src || h.value ? c.value.placeholder : typeof r.src == "string" ? r.src.includes("http") || // From public image
+      r.src.includes("data:image/png;base64") ? r.src : (t = (e = c.value).getImageURL) == null ? void 0 : t.call(e, r.src, S.value) : r.src;
+    }), V = p(() => {
+      var t, l, a, g;
+      const e = u.value;
+      if (typeof e == "string") {
+        const s = (l = (t = c.value).getImageURL) == null ? void 0 : l.call(t, "preview"), i = s && !(s != null && s.includes("undefined")) ? new URL(s).origin : "", R = i && e.includes(i);
+        return e.includes("http") && !R || // From public resource
+        e.includes("data:image/svg+xml") ? e : (g = (a = c.value).getImageURL) == null ? void 0 : g.call(a, r.src);
+      }
+      return e;
+    }), y = (e) => {
+      w(), typeof e == "number" && (o.value = e), L.value ? window.clearTimeout(L.value) : window.setTimeout($, 3e3);
+    }, d = (e) => {
+      var l;
+      const t = (l = e.target) == null ? void 0 : l.src;
+      (t === u.value || t.includes(u.value.toString())) && (h.value = !0);
+    }, B = (e) => {
+      var l, a;
+      const t = e;
+      return typeof t == "string" ? t.includes("http") ? t : (a = (l = c.value).getImageURL) == null ? void 0 : a.call(l, t) : t;
+    };
+    return (e, t) => {
+      var l;
+      return n(), W(q(J), I(e.$props, {
+        preview: E.value,
+        pt: { root: (l = e.$preset.image) == null ? void 0 : l.root({ props: e.$props }) }
+      }), {
+        image: b(() => {
+          var a;
+          return [
+            U("img", I((a = e.$preset.image) == null ? void 0 : a.image({ props: e.$props, context: { imageSize: S.value } }), {
+              onerror: d,
+              src: u.value,
+              alt: ""
+            }), null, 16, Y)
+          ];
+        }),
+        indicatoricon: b(() => [
+          C(X, I(e.$preset.image.icon, { icon: "eye" }), null, 16)
+        ]),
+        preview: b((a) => {
+          var g;
+          return [
+            (g = e.galleries) != null && g.length ? (n(), m(_, { key: 1 }, [
+              (n(!0), m(_, null, T(e.galleries, ({ src: s }, i) => A((n(), m("img", {
+                key: i,
+                onerror: d,
+                src: B(s),
+                style: k(a.style),
+                alt: "",
+                "data-wv-section": "image-gallery"
+              }, null, 12, ee)), [
+                [H, i === o.value]
+              ])), 128)),
+              U("div", {
+                onClick: t[0] || (t[0] = D(() => {
+                }, ["stop"])),
+                class: "fixed bottom-0 left-0 flex justify-center items-center w-full p-4 mx-auto flex-row bg-black/80",
+                "data-wv-section": "gallery-thumbnail"
+              }, [
+                C(F, {
+                  class: z([
+                    "text-surface-0 rotate-180 sticky left-0 !w-8 !h-8 [&_i]:w-5 [&_i]:h-5",
+                    "rounded-full mr-3"
+                  ]),
+                  onClick: P,
+                  "aria-label": "Previous Image",
+                  "data-wv-section": "prev-button",
+                  icon: "arrow-right",
+                  "icon-class": "w-5 h-5",
+                  severity: "secondary",
+                  text: ""
+                }),
+                (n(!0), m(_, null, T(e.galleries, ({ src: s }, i) => (n(), m("img", {
+                  key: i,
+                  class: z([
+                    "h-10 w-10 object-cover cursor-pointer opacity-50 hover:opacity-100 transition-opacity",
+                    { "!opacity-100": o.value == i }
+                  ]),
+                  onerror: d,
+                  src: B(s),
+                  style: k(a.style),
+                  onClick: D((R) => y(i), ["stop"]),
+                  alt: "",
+                  "data-wv-section": "thumbnail-image"
+                }, null, 14, te))), 128)),
+                C(F, {
+                  class: z([
+                    "text-surface-0 sticky !w-8 !h-8 [&_i]:w-5 [&_i]:h-5",
+                    "rounded-full ml-3"
+                  ]),
+                  onClick: N,
+                  "aria-label": "Next Image",
+                  "data-wv-section": "next-button",
+                  icon: "arrow-right",
+                  severity: "secondary",
+                  text: ""
+                })
+              ])
+            ], 64)) : (n(), m("img", {
+              key: 0,
+              onerror: d,
+              src: V.value,
+              style: k(a.style),
+              alt: ""
+            }, null, 12, Z))
+          ];
+        }),
+        _: 1
+      }, 16, ["preview", "pt"]);
+    };
+  }
+});
+export {
+  ie as _
+};

package/components/image/Image-DX6uB7Ns.system.js

@@ -0,0 +1 @@
+System.register(["vue","../../vendor/primevue-u6FsQONA.system.js","../animation/Animation-6756VN9N.system.js","../button/Button-Okx1_kOu.system.js","../icon/Icon-DUylRmY4.system.js"],function(H,re){"use strict";var U,g,j,D,p,E,c,F,f,h,u,w,y,C,z,N,T,B,I,k,V,x,M,S,O;return{setters:[t=>{U=t.defineComponent,g=t.computed,j=t.onMounted,D=t.onUnmounted,p=t.shallowRef,E=t.createBlock,c=t.openBlock,F=t.unref,f=t.mergeProps,h=t.withCtx,u=t.createElementBlock,w=t.normalizeStyle,y=t.Fragment,C=t.createElementVNode,z=t.renderList,N=t.withDirectives,T=t.vShow,B=t.withModifiers,I=t.createVNode,k=t.normalizeClass},t=>{V=t.l},t=>{x=t.u,M=t.m},t=>{S=t._},t=>{O=t._}],execute:function(){const t=["src"],J=["src"],K=["src"],Q=["src","onClick"],ae=H("_",U({__name:"Image",props:{src:{},size:{},width:{},rounded:{type:Boolean},imageStyle:{},imageClass:{},galleries:{},indicatorIcon:{},zoomInDisabled:{type:Boolean},zoomOutDisabled:{type:Boolean},pt:{},ptOptions:{},unstyled:{type:Boolean},getImageURL:{type:Function},placeholder:{}},setup(X){const r=X,{defaultProps:Y}=x("Image"),m=g(()=>M(r,Y));j(()=>{setTimeout(()=>{G()},3e3)}),D(()=>{$()});const i=p(0),b=p(),P=p(),L=p(!1),Z=g(()=>{var e;return!L.value&&!((e=v.value)!=null&&e.toString().includes("data:image/png;base64"))&&v.value!==m.value.placeholder}),ee=()=>{const e=r.galleries??[];i.value=(i.value+1)%e.length,R()},te=()=>{const e=r.galleries??[];i.value=(i.value-1+e.length)%e.length,R()},G=()=>{var e;$(),(e=r.galleries)!=null&&e.length&&(b.value=window.setInterval(()=>{const n=r.galleries??[];i.value=(i.value+1)%n.length},3e3))},$=()=>{b.value&&(window.clearInterval(b.value),b.value=void 0)},W=g(()=>r.width!=null?r.width:r.size==="small"?30:r.size==="medium"?80:125),v=g(()=>{var e,n;return!r.src||L.value?m.value.placeholder:typeof r.src=="string"?r.src.includes("http")||r.src.includes("data:image/png;base64")?r.src:(n=(e=m.value).getImageURL)==null?void 0:n.call(e,r.src,W.value):r.src}),ne=g(()=>{var n,s,a,d;const e=v.value;if(typeof e=="string"){const o=(s=(n=m.value).getImageURL)==null?void 0:s.call(n,"preview"),l=o&&!(o!=null&&o.includes("undefined"))?new URL(o).origin:"",q=l&&e.includes(l);return e.includes("http")&&!q||e.includes("data:image/svg+xml")?e:(d=(a=m.value).getImageURL)==null?void 0:d.call(a,r.src)}return e}),R=e=>{$(),typeof e=="number"&&(i.value=e),P.value?window.clearTimeout(P.value):window.setTimeout(G,3e3)},_=e=>{var s;const n=(s=e.target)==null?void 0:s.src;(n===v.value||n.includes(v.value.toString()))&&(L.value=!0)},A=e=>{var s,a;const n=e;return typeof n=="string"?n.includes("http")?n:(a=(s=m.value).getImageURL)==null?void 0:a.call(s,n):n};return(e,n)=>{var s;return c(),E(F(V),f(e.$props,{preview:Z.value,pt:{root:(s=e.$preset.image)==null?void 0:s.root({props:e.$props})}}),{image:h(()=>{var a;return[C("img",f((a=e.$preset.image)==null?void 0:a.image({props:e.$props,context:{imageSize:W.value}}),{onerror:_,src:v.value,alt:""}),null,16,t)]}),indicatoricon:h(()=>[I(O,f(e.$preset.image.icon,{icon:"eye"}),null,16)]),preview:h(a=>{var d;return[(d=e.galleries)!=null&&d.length?(c(),u(y,{key:1},[(c(!0),u(y,null,z(e.galleries,({src:o},l)=>N((c(),u("img",{key:l,onerror:_,src:A(o),style:w(a.style),alt:"","data-wv-section":"image-gallery"},null,12,K)),[[T,l===i.value]])),128)),C("div",{onClick:n[0]||(n[0]=B(()=>{},["stop"])),class:"fixed bottom-0 left-0 flex justify-center items-center w-full p-4 mx-auto flex-row bg-black/80","data-wv-section":"gallery-thumbnail"},[I(S,{class:k(["text-surface-0 rotate-180 sticky left-0 !w-8 !h-8 [&_i]:w-5 [&_i]:h-5","rounded-full mr-3"]),onClick:te,"aria-label":"Previous Image","data-wv-section":"prev-button",icon:"arrow-right","icon-class":"w-5 h-5",severity:"secondary",text:""}),(c(!0),u(y,null,z(e.galleries,({src:o},l)=>(c(),u("img",{key:l,class:k(["h-10 w-10 object-cover cursor-pointer opacity-50 hover:opacity-100 transition-opacity",{"!opacity-100":i.value==l}]),onerror:_,src:A(o),style:w(a.style),onClick:B(q=>R(l),["stop"]),alt:"","data-wv-section":"thumbnail-image"},null,14,Q))),128)),I(S,{class:k(["text-surface-0 sticky !w-8 !h-8 [&_i]:w-5 [&_i]:h-5","rounded-full ml-3"]),onClick:ee,"aria-label":"Next Image","data-wv-section":"next-button",icon:"arrow-right",severity:"secondary",text:""})])],64)):(c(),u("img",{key:0,onerror:_,src:ne.value,style:w(a.style),alt:""},null,12,J))]}),_:1},16,["preview","pt"])}}}))}}});

package/components/imagecompressor/ImageCompressor-BLeJDvN3.system.js

@@ -0,0 +1 @@
+System.register(["vue","../../vendor/vee-validate-Cc_B-qII.system.js","../../vendor/vue-advanced-cropper-NG93jHnU.system.js","../animation/Animation-6756VN9N.system.js","../editor/Editor-IfYw2Tps.system.js","../image/Image-DX6uB7Ns.system.js","../button/Button-Okx1_kOu.system.js","../buttonradio/ButtonRadio-B2wWrgB5.system.js","../dialog/Dialog-WEl66uTI.system.js","../dialogconfirm/DialogConfirm-o7_v7F31.system.js","../fieldwrapper/FieldWrapper-DFjw9hA8.system.js","../icon/Icon-DUylRmY4.system.js","../invisiblefield/InvisibleField-BHudtX2g.system.js","../validatormessage/ValidatorMessage-VVfyqlRF.system.js","../backgroundimagecropper/BackgroundImageCropper-DFHtaSyE.system.js","../imageinputinfo/ImageInputInfo-C5F14hbF.system.js"],function(Q,Qe){"use strict";var ie,X,ne,ue,ce,y,k,de,me,Y,V,w,c,x,d,h,_,j,A,I,ve,P,pe,ge,fe,ye,be,we,F,he,Ie,Be,Ce,Z,ke,Pe,Me,ee;return{setters:[t=>{ie=t.defineComponent,X=t.mergeModels,ne=t.inject,ue=t.onMounted,ce=t.onUnmounted,y=t.ref,k=t.shallowRef,de=t.useModel,me=t.reactive,Y=t.computed,V=t.watch,w=t.createElementBlock,c=t.openBlock,x=t.Fragment,d=t.createVNode,h=t.normalizeClass,_=t.withCtx,j=t.createElementVNode,A=t.createBlock,I=t.createCommentVNode,ve=t.renderList,P=t.unref},t=>{pe=t.u},t=>{ge=t.f},t=>{fe=t.u},t=>{ye=t.g,be=t.a},t=>{we=t._},t=>{F=t._},t=>{he=t._},t=>{Ie=t._},t=>{Be=t._},t=>{Ce=t._},t=>{Z=t._},t=>{ke=t._},t=>{Pe=t._},t=>{Me=t.B},t=>{ee=t._}],execute:function(){Q("g",Ue);var t=Q("c",typeof globalThis<"u"?globalThis:typeof window<"u"?window:typeof global<"u"?global:typeof self<"u"?self:{});function Ue(v){return v&&v.__esModule&&Object.prototype.hasOwnProperty.call(v,"default")?v.default:v}var ae={exports:{}};(function(v,K){(function(){function W(te,a){a=a||"";for(var B=1024,M=window.atob(te),m=[],R=0,E=M.length;R<E;R+=B){for(var f=M.slice(R,R+B),r=new Array(f.length),U=0;U<f.length;U++)r[U]=f.charCodeAt(U);var G=new Uint8Array(r);m.push(G)}return new Blob(m,{type:a})}v.exports&&(K=v.exports=W),K.base64ToBlob=W}).call(t)})(ae,ae.exports);var ze=ae.exports;const De=Ue(ze),$e={key:1,class:"flex gap-1 items-start"},Le=["id","multiple"],Xe=Q("_",ie({__name:"ImageCompressor",props:X({initialName:{},multiple:{type:Boolean},defaultImage:{},disabled:{type:Boolean,default:!1},compressedBlob:{default:void 0},imagePreviewUrl:{default:void 0},imagePreviewSize:{default:"big"},rounded:{type:Boolean,default:!1},useDeleteButton:{type:Boolean,default:!0},useValidator:{type:Boolean,default:!1},mandatory:{type:Boolean,default:!1},invalid:{type:Boolean},validatorMessage:{default:"Photo must be uploaded"},label:{default:void 0},fieldName:{default:"imageInput"},fieldInfo:{default:void 0},showInfo:{type:Boolean,default:!0},customRequirements:{default:void 0},confirmOnDelete:{type:Boolean},emitDeleteFn:{type:Boolean},showValidatorMessage:{type:Boolean,default:!0},fileType:{default:"webp"}},{defaultImage:{default:0},defaultImageModifiers:{}}),emits:X(["apply","applyProp","update:defaultImage","delete"],["update:defaultImage"]),setup(v,{expose:K,emit:W}){const te=ne("preset",{}).image,a=v,B=W,{locale:M}=fe("ImageCompressor");ue(async()=>{Te(),D()}),ce(()=>{$(0),$(1)});const m=y([{src:null,type:null},{src:null,type:null}]),R=be(),E=y(),f=y(),r=y([]),U=y(),G=k(0),le=y(),N=y(),p=k(),H=de(v,"defaultImage"),i=me({value:a.multiple?[]:void 0}),S=k(!1),C=k(),Ve=k(0),b=k(!1),se=y([!1,!1]),z=Y(()=>`image/${a.fileType}`),oe=e=>typeof r.value[e]=="string"&&r.value[e].includes("data:image/png;base64"),D=async()=>{var e,l;(e=a.imagePreviewUrl)!=null&&e.length?r.value=Array.isArray(a.imagePreviewUrl)?a.imagePreviewUrl:[a.imagePreviewUrl]:Array.isArray(a.compressedBlob)?r.value=a.compressedBlob:a.compressedBlob?r.value=[a.compressedBlob]:a.initialName?(E.value=ye(a.initialName,125,R),r.value=[(l=E.value)==null?void 0:l.toDataURL()]):r.value=[],a.imagePreviewUrl?i.value=a.imagePreviewUrl:a.initialName&&(i.value=await _e()),B("applyProp")},_e=async()=>new Promise(e=>{var l;(l=E.value)==null||l.toBlob(o=>{e(new File([o??new Blob],Date.now()+".png",{type:"image/png"}))})}),T=(e=!1)=>{var l;a.disabled||(e&&(p.value=1),(l=U.value)==null||l.click())},Ee=async e=>{const{files:l}=e.target,o=Array.from(l??[]).slice(0,r.value.length?1:2);for(const[s,u]of o.entries())try{const n=p.value??s;await Ne(u,n)}catch(n){console.error("Error loading image:",n)}finally{p.value=void 0}},Ne=async(e,l)=>{const o=u=>u.includes("image"),s=u=>u>1e6;return new Promise((u,n)=>{var O,L;if(e)if(je(l),!o(e.type))S.value=!0,C.value=typeof a.validatorMessage!="string"&&((O=a.validatorMessage)!=null&&O.invalidFormat)?a.validatorMessage.invalidFormat:"Tipe file harus berupa gambar!",D(),b.value=!1,$(l),n("Tipe file harus berupa gambar!");else if(s(e.size))S.value=!0,C.value=typeof a.validatorMessage!="string"&&((L=a.validatorMessage)!=null&&L.exceed)?a.validatorMessage.exceed:"Ukuran gambar terlalu besar! Maks. 1 MB",D(),b.value=!1,$(l),n("Ukuran gambar terlalu besar! Maks. 1 MB");else{$(l);const J=URL.createObjectURL(e),g=new FileReader;g.onload=q=>{var Se;m.value[l].src=J,m.value[l].type=Oe((Se=q==null?void 0:q.target)==null?void 0:Se.result,e.type)},g.onerror=q=>{console.error("🚀 ~ returnnewPromise ~ e:",q)},g.readAsArrayBuffer(e),p.value==null&&(p.value=l),b.value||(b.value=!0),S.value=!1,C.value=void 0}Ve.value+=1,N.value=u})},Te=()=>{a.useValidator&&Object.assign(i,pe(a.fieldName,e=>{var l;return!e&&a.mandatory?typeof a.validatorMessage!="string"&&((l=a.validatorMessage)!=null&&l.empty)?a.validatorMessage.empty:(a.label??"Photo")+" must be uploaded":a.invalid&&a.validatorMessage?a.validatorMessage:C.value?C.value:!0}))},je=e=>{m.value[e]={src:null,type:null}},Oe=(e,l=null)=>{if(e){const o=new Uint8Array(e).subarray(0,4);let s="";for(const u of o)s+=u.toString(16);switch(s){case"89504e47":return"image/png";case"47494638":return"image/gif";case"ffd8ffe0":case"ffd8ffe1":case"ffd8ffe2":case"ffd8ffe3":case"ffd8ffe8":return z.value;default:return l}}return null},Ae=e=>{const l=De(e.split(",")[1],z.value);return window.URL.createObjectURL(l)},qe=async(e,l)=>{const o=await fetch(e).then(s=>s.blob());return new File([o],l,{type:z.value})},xe=async()=>{const e=p.value??0;try{await Ke(e)}catch(l){console.error(l)}Fe()},Fe=()=>{var e;b.value=!1,(e=N.value)==null||e.call(N),N.value=void 0},Ke=async e=>{if(le.value){const l=le.value.getResult();if(l.canvas){const o=l.canvas.toDataURL(z.value);await We(o,e)}}},We=async(e,l)=>{try{f.value=document.createElement("canvas");const o=f.value.getContext("2d"),s=new Image;s.src=e,await s.decode();const u=80/100,n=s.width*u,O=s.height*u;f.value.setAttribute("width",n.toString()),f.value.setAttribute("height",O.toString()),o&&o.drawImage(s,0,0,n,O);const L=f.value.toDataURL(z.value,.95),J=Date.now()+`.${a.fileType}`,g={canvas:f.value,compressed:{blob:Ae(L),base64:L,fileName:J,file:await qe(Ae(L),J),size:"",type:z.value},message:"File has been compressed."};g.compressed.size=Math.round(g.compressed.file.size/1e3)+"KB",r.value[l]=g.compressed.blob,a.multiple?i.value&&Array.isArray(i.value)?i.value[l]=g.compressed.file:i.value=[g.compressed.file]:i.value=g.compressed.file,B("apply",g)}catch(o){console.error(o)}},$=e=>{m.value[e].src&&URL.revokeObjectURL(m.value[e].src)},Ge=e=>{a.confirmOnDelete?se.value[e]=!0:a.emitDeleteFn?B("delete",re,e):re(e)},re=(e=0)=>{S.value=!1,C.value=void 0,r.value=r.value.toSpliced(e,1),$(e),m.value[e]={src:null,type:null},m.value=[m.value[+!e],m.value[e]],p.value=0,H.value=0,a.confirmOnDelete||B("delete"),a.multiple&&Array.isArray(i.value)?i.value=i.value.toSpliced(e,1):i.handleReset&&i.handleReset()},He=e=>{var o;const l=(o=r.value[e])==null?void 0:o.toString();p.value=e,l!=null&&l.includes("blob")?(p.value=e,b.value=!0):(je(e),T())},Je=()=>{T()},Re=Y(()=>navigator.userAgent.includes("Firefox"));return V(C,e=>{e&&i.setErrors&&i.setErrors(e)}),V(b,e=>{e||G.value++}),V(()=>a.initialName,()=>{D()}),V(()=>a.imagePreviewUrl,()=>{D()},{once:!0}),K({assignPreviewImagesFromProp:D}),(e,l)=>(c(),w(x,null,[d(Ce,{class:h([{"!w-max":!a.multiple,"!w-full":a.multiple}]),info:a.fieldInfo,label:a.label,mandatory:a.mandatory,"data-wv-name":"image-compressor","data-wv-section":"root"},{default:_(()=>[j("div",{class:h(["w-full",{"grid gap-6 items-start grid-cols-2":e.multiple}]),"data-wv-section":"wrapper"},[r.value.length?(c(!0),w(x,{key:0},ve(r.value,(o,s)=>{var u;return c(),w("div",{key:s,class:"flex gap-1 items-start","data-wv-section":"preview"},[j("div",{class:h(["flex flex-col gap-1 items-center",{"max-w-[80px]":e.imagePreviewSize==="medium"},{"max-w-[125px]":e.imagePreviewSize==="big"}]),"data-wv-section":"preview-image-wrapper"},[j("div",{class:h([{"[&>span]:hover:opacity-30 [&>[data-wv-section=input-image-trigger]]:hover:opacity-100":oe(s)},"relative",{"w-[125px] h-[125px]":e.imagePreviewSize==="big","w-[30px] h-[30px]":e.imagePreviewSize==="small","w-[80px] h-[80px]":e.imagePreviewSize==="medium"}]),"data-wv-section":"image-wrapper"},[d(we,{rounded:e.rounded,size:e.imagePreviewSize,src:o,class:"transition-opacity duration-300","data-wv-section":"preview-image"},null,8,["rounded","size","src"]),oe(s)?(c(),w("button",{key:0,class:h([(u=P(te))==null?void 0:u.button.class,"hover:bg-opacity-0 rounded-lg opacity-0"]),onClick:l[0]||(l[0]=n=>T(!1)),"data-wv-section":"input-image-trigger",type:"button"},[d(Z,{class:"w-6 h-6","data-wv-section":"trigger-icon",icon:"image-add",severity:"primary"})],2)):I("",!0)],2),!a.disabled&&!oe(s)?(c(),w(x,{key:0},[j("div",{class:h(["flex gap-0.5 justify-center",{"scale-75":e.imagePreviewSize==="medium"}]),"data-wv-section":"preview-buttons"},[d(F,{onClick:n=>He(s),class:"!py-0 !px-1 !h-max",icon:"pencil",label:"Edit",text:""},null,8,["onClick"]),e.useDeleteButton?(c(),A(F,{key:0,onClick:n=>Ge(s),class:"!py-0 !px-1 !h-max",icon:"delete-bin",label:"Delete",severity:"danger",text:""},null,8,["onClick"])):I("",!0)],2),d(Be,{visible:se.value[s],"onUpdate:visible":n=>se.value[s]=n,closable:!1,onConfirm:n=>B("delete",re,s),body:"Are you sure you want to delete it?","confirm-label":"Delete",header:"Delete Photo",severity:"danger"},null,8,["visible","onUpdate:visible","onConfirm"])],64)):I("",!0)],2),d(ee,{"custom-requirements":e.customRequirements,"show-add-button":r.value.length===1&&a.multiple,"show-info":e.showInfo,onAddPhoto:l[2]||(l[2]=n=>T(!0))},{default:_(()=>[r.value.length===2&&a.multiple?(c(),A(he,{key:0,modelValue:H.value,"onUpdate:modelValue":l[1]||(l[1]=n=>H.value=n),"label-id":"default-"+s,value:s,label:"Set as default"},null,8,["modelValue","label-id","value"])):I("",!0)]),_:2},1032,["custom-requirements","show-add-button","show-info"])])}),128)):(c(),w("div",$e,[j("button",{class:h([{"w-[125px] h-[125px]":e.imagePreviewSize==="big","w-[30px] h-[30px]":e.imagePreviewSize==="small","w-[80px] h-[80px]":e.imagePreviewSize==="medium"},"flex items-center justify-center","ring-inset","cursor-pointer",{"ring-1":Re.value,"ring-[0.5px]":!Re.value},{"rounded-full":e.rounded,"rounded-lg":!e.rounded},{"ring-general-400 focus-visible:ring-primary-500":!S.value&&!i.errorMessage,"ring-danger-500":S.value||i.errorMessage},{"bg-white":!a.disabled,"bg-general-50":a.disabled}]),onClick:l[3]||(l[3]=o=>T(!1)),"data-wv-section":"input-image-trigger",type:"button"},[d(Z,{class:"w-6 h-6","data-wv-section":"trigger-icon",icon:"image-add",severity:"primary"})],2),d(ee,{"custom-requirements":e.customRequirements,"show-info":e.showInfo},null,8,["custom-requirements","show-info"])]))],2),(c(),w("input",{id:e.fieldName,key:G.value,ref_key:"inputImageFile",ref:U,multiple:a.multiple&&!r.value.length,onChange:Ee,accept:"image/*",class:"hidden","data-wv-section":"hidden-image-input",type:"file"},null,40,Le)),e.showValidatorMessage?(c(),A(Pe,{key:0,format:!1,message:i.errorMessage??C.value},null,8,["message"])):I("",!0),a.multiple?(c(),A(ke,{key:1,value:H.value?"secondImage":"firstImage","field-name":"defaultImage"},null,8,["value"])):I("",!0)]),_:1},8,["class","info","label","mandatory"]),d(Ie,{visible:b.value,"onUpdate:visible":l[4]||(l[4]=o=>b.value=o),draggable:!1,header:P(M).cropDialogHeader,class:"w-max max-w-[98vw] min-w-[min(500px,98vw)] !max-h-[94vh]","content-class":"overflow-hidden overflow-y-auto min-h-[100px]","data-wv-section":"dialog-cropper","footer-class":"!gap-1",modal:""},{footer:_(()=>[d(F,{label:P(M).cancelCropLabel,onClick:Fe,"data-wv-section":"cancel-crop",severity:"secondary",text:"",type:"button"},null,8,["label"]),d(F,{label:P(M).changeImageLabel,onClick:Je,"data-wv-section":"change-image-button",text:"",type:"button"},null,8,["label"]),d(F,{label:P(M).applyCropLabel,onClick:xe,"data-wv-section":"apply-image-button",severity:"success",type:"button"},null,8,["label"])]),default:_(()=>[p.value!=null?(c(),A(P(ge),{key:0,ref_key:"vueAdvanceCropper",ref:le,"auto-zoom":!1,"background-wrapper-component":Me,src:m.value[p.value].src,class:"upload-example-cropper h-400","foreground-class":"h-400","image-class":"h-400"},null,8,["src"])):I("",!0)]),_:1},8,["visible","header"])],64))}}))}}});