images-viewer-vue3/dist/es/js/directive-v-image-viewer.ts-BowM4bqr.js

A lightweight image viewer for Vue3

import "./npm-hotkeys-js-CQ2lDUlP.js";
import { I as a } from "./utils-core.ts-33QG0uRn.js";
import { imageViewerApi as s } from "../index.js";
import { v as c } from "./npm-uuid-Cgt9uYzN.js";
const u = a.getInStance(), b = u.getConfigOptions();
var o = [];
let g = 0;
function d(e) {
  const t = e.getAttribute("data-key"), n = e.getAttribute("data-index"), i = o.findIndex((r) => r.key === t);
  i !== -1 ? o[i].url = e.src : o.push({ key: t, url: e.src, index: Number(n) });
}
function m() {
  return o.sort((t, n) => t.index - n.index).map((t) => t.url).filter((t) => t);
}
const y = {
  // 在绑定元素的 attribute 前
  // 或事件监听器应用前调用
  created(e, t, n) {
  },
  // 在元素被插入到 DOM 前调用
  beforeMount(e, t, n) {
  },
  // 在绑定元素的父组件
  // 及他自己的所有子节点都挂载完成后调用
  mounted(e, t, n) {
    !e.getAttribute("data-key") && e.setAttribute("data-key", c()), e.setAttribute("data-index", `${g++}`), e.src && d(e);
    const r = new MutationObserver(() => {
      e.src && (d(e), r.disconnect());
    });
    r.observe(e, { attributes: !0, attributeFilter: ["src"] }), e.addEventListener("click", function(f) {
      s({
        specifyIndex: Number(e.getAttribute("data-index")),
        current: e.src,
        // images: imageList,
        images: m(),
        zIndex: b.zIndex,
        imageDom: e,
        from: "directive"
      });
    });
  },
  // 绑定元素的父组件更新前调用
  beforeUpdate(e, t, n) {
  },
  // 在绑定元素的父组件
  // 及他自己的所有子节点都更新后调用
  updated(e, t, n) {
    const i = new MutationObserver(() => {
      e.src && (d(e), i.disconnect());
    });
    i.observe(e, { attributes: !0, attributeFilter: ["src"] });
  },
  // 绑定元素的父组件卸载前调用
  beforeUnmount(e, t, n) {
  },
  // 绑定元素的父组件卸载后调用
  unmounted(e, t, n) {
  }
};
export {
  y as V
};