images-viewer-vue3/dist/lib/directive/v-image-viewer.js

A lightweight image viewer for Vue3

"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const a=require("../utils/ViewerCore.js"),s=require("../index.js"),u=require("../node_modules/.pnpm/uuid@10.0.0/node_modules/uuid/dist/esm-browser/v4.js"),c=a.default.getInStance(),b=c.getConfigOptions();var d=[];let g=0;function o(e){const t=e.getAttribute("data-key"),n=e.getAttribute("data-index"),i=d.findIndex(r=>r.key===t);i!==-1?d[i].url=e.src:d.push({key:t,url:e.src,index:Number(n)})}function f(){return d.sort((t,n)=>t.index-n.index).map(t=>t.url).filter(t=>t)}const v={created(e,t,n){},beforeMount(e,t,n){},mounted(e,t,n){!e.getAttribute("data-key")&&e.setAttribute("data-key",u.default()),e.setAttribute("data-index",`${g++}`),e.src&&o(e);const r=new MutationObserver(()=>{e.src&&(o(e),r.disconnect())});r.observe(e,{attributes:!0,attributeFilter:["src"]}),e.addEventListener("click",function(m){s.imageViewerApi({specifyIndex:Number(e.getAttribute("data-index")),current:e.src,images:f(),zIndex:b.zIndex,imageDom:e,from:"directive"})})},beforeUpdate(e,t,n){},updated(e,t,n){const i=new MutationObserver(()=>{e.src&&(o(e),i.disconnect())});i.observe(e,{attributes:!0,attributeFilter:["src"]})},beforeUnmount(e,t,n){},unmounted(e,t,n){}};exports.default=v;