import { ref as k, onMounted as P, onUnmounted as D, useAttrs as Z, computed as $, resolveComponent as w, createBlock as A, openBlock as y, mergeProps as j, unref as i, withCtx as s, createVNode as a, createTextVNode as x, toDisplayString as g, createElementVNode as m, renderSlot as J, defineComponent as K, mergeModels as B, useModel as S, watch as F, nextTick as Q, createElementBlock as L, Fragment as W, createCommentVNode as q, normalizeClass as M, withDirectives as X, vShow as Y } from "vue";
import { _ as ee, B as te } from "./install-BuMO14Rb.js";
const le = () => {
  const e = k(!1), c = () => {
    e.value ? l() : v();
  }, t = () => {
    e.value = !e.value;
  }, v = () => {
    const o = document.querySelector(".p-galleria");
    o.requestFullscreen ? o.requestFullscreen() : o.mozRequestFullScreen ? o.mozRequestFullScreen() : o.webkitRequestFullscreen ? o.webkitRequestFullscreen() : o.msRequestFullscreen && o.msRequestFullscreen();
  }, l = () => {
    document.exitFullscreen ? document.exitFullscreen() : document.mozCancelFullScreen ? document.mozCancelFullScreen() : document.webkitExitFullscreen ? document.webkitExitFullscreen() : document.msExitFullscreen && document.msExitFullscreen();
  }, n = () => {
    document.addEventListener("fullscreenchange", t), document.addEventListener("mozfullscreenchange", t), document.addEventListener("webkitfullscreenchange", t), document.addEventListener("msfullscreenchange", t);
  }, r = () => {
    document.removeEventListener("fullscreenchange", t), document.removeEventListener("mozfullscreenchange", t), document.removeEventListener("webkitfullscreenchange", t), document.removeEventListener("msfullscreenchange", t);
  };
  return P(() => {
    n();
  }), D(() => {
    r();
  }), {
    fullScreen: e,
    toggleFullScreen: c
  };
}, ne = (e) => {
  const c = ({ target: l }) => {
    l.classList.contains("p-galleria-mask") && (e.value = !1);
  };
  return {
    listenMaskElementClick: () => {
      document.querySelector(".p-galleria-mask")?.addEventListener("click", c);
    },
    removeMaskElementClick: () => {
      document.querySelector(".p-galleria-mask")?.removeEventListener("click", c);
    }
  };
}, oe = () => {
  const e = k(!1), c = k(0), t = k(() => {
  });
  function v({ deleted: n, callback: r }) {
    Array.isArray(n) ? c.value = n.length : c.value = 1, e.value = !0, t.value = r;
  }
  function l() {
    e.value = !1;
  }
  return {
    isVisible: e,
    deleteCount: c,
    deleteCallback: t,
    askDeleteConfirmation: v,
    closeDelete: l
  };
}, ae = { class: "delete-confirmation-popup__content" }, ie = { class: "delete-confirmation-popup__message" }, se = {
  __name: "delete-confirmation-popup",
  props: {
    deleteCount: {
      type: Number,
      required: !0
    },
    callback: {
      type: Function,
      required: !0
    }
  },
  emits: [
    "close"
  ],
  setup(e, { emit: c }) {
    const t = e, v = Z(), { t: l } = te(), n = $(() => t.deleteCount === 0 ? l("webitelUI.deleteConfirmationPopup.tableAskingAlert", 2, null, {
      count: l("webitelUI.deleteConfirmationPopup.deleteAll")
    }) : l(
      "webitelUI.deleteConfirmationPopup.tableAskingAlert",
      {
        count: t.deleteCount
      },
      null
    ));
    return (r, o) => {
      const _ = w("wt-icon"), u = w("wt-button"), h = w("wt-confirm-dialog");
      return y(), A(h, j(i(v), {
        class: "delete-confirmation-popup",
        title: r.$t("webitelUI.deleteConfirmationPopup.title"),
        callback: e.callback,
        onClose: o[0] || (o[0] = (b) => r.$emit("close"))
      }), {
        main: s(() => [
          m("div", ae, [
            a(_, {
              color: "error",
              icon: "attention"
            }),
            m("p", ie, [
              J(r.$slots, "deleteMessage", {}, () => [
                x(g(n.value), 1)
              ], !0)
            ])
          ])
        ]),
        actions: s(({ isDeleting: b, close: C, confirm: I }) => [
          a(u, {
            loading: b,
            onClick: I
          }, {
            default: s(() => [
              x(g(r.$t("vocabulary.yes")), 1)
            ], void 0, !0),
            _: 1
          }, 8, ["loading", "onClick"]),
          a(u, {
            disabled: b,
            color: "secondary",
            onClick: C
          }, {
            default: s(() => [
              x(g(r.$t("vocabulary.no")), 1)
            ], void 0, !0),
            _: 1
          }, 8, ["disabled", "onClick"])
        ]),
        _: 3
      }, 16, ["title", "callback"]);
    };
  }
}, ce = /* @__PURE__ */ ee(se, [["__scopeId", "data-v-95c498c1"]]), re = ["src", "alt"], ue = ["src", "alt"], de = { class: "wt-galleria__footer" }, me = {
  key: 0,
  class: "wt-galleria__footer-info"
}, ve = { class: "wt-galleria__footer-actions" }, ge = /* @__PURE__ */ K({
  __name: "wt-galleria",
  props: /* @__PURE__ */ B({
    value: {},
    id: {},
    activeIndex: {},
    fullScreen: { type: Boolean },
    visible: { type: Boolean },
    numVisible: {},
    responsiveOptions: {},
    showItemNavigators: { type: Boolean },
    showThumbnailNavigators: { type: Boolean },
    showItemNavigatorsOnHover: { type: Boolean },
    changeItemOnIndicatorHover: { type: Boolean },
    circular: { type: Boolean },
    autoPlay: { type: Boolean },
    transitionInterval: {},
    showThumbnails: { type: Boolean },
    thumbnailsPosition: {},
    verticalThumbnailViewPortHeight: {},
    showIndicators: { type: Boolean },
    showIndicatorsOnItem: { type: Boolean },
    indicatorsPosition: {},
    baseZIndex: {},
    maskClass: {},
    containerStyle: {},
    containerClass: {},
    containerProps: {},
    prevButtonProps: {},
    nextButtonProps: {},
    ariaLabel: {},
    ariaRoledescription: {},
    dt: {},
    pt: {},
    ptOptions: {},
    unstyled: { type: Boolean }
  }, {
    visible: { type: Boolean, required: !0 },
    visibleModifiers: {},
    activeIndex: {
      default: 0,
      required: !1
    },
    activeIndexModifiers: {}
  }),
  emits: /* @__PURE__ */ B([
    "download",
    "delete"
  ], ["update:visible", "update:activeIndex"]),
  setup(e, { emit: c }) {
    const t = e, v = c, l = S(e, "visible"), n = S(e, "activeIndex"), r = $(() => t.value[n.value]), o = k(!0), _ = k(!0), { fullScreen: u, toggleFullScreen: h } = le(), { listenMaskElementClick: b, removeMaskElementClick: C } = ne(l), {
      isVisible: I,
      deleteCount: N,
      deleteCallback: V,
      askDeleteConfirmation: z,
      closeDelete: R
    } = oe(), T = () => {
      _.value = !_.value;
    }, U = () => {
      o.value = !1;
    }, O = () => {
      u.value && h(), z({
        deleteCount: 1,
        callback: () => v("delete", n)
      });
    };
    return F(
      () => r.value,
      (E, f) => {
        E?.src !== f?.src && (o.value = !0);
      },
      {
        deep: !0
      }
    ), F(
      () => l.value,
      () => {
        l.value ? Q(() => {
          b();
        }) : (n.value = 0, C());
      }
    ), F(
      () => t.value,
      () => {
        t.value.length || (l.value = !1);
      }
    ), P(() => {
      l.value && b();
    }), D(() => {
      C();
    }), (E, f) => {
      const H = w("wt-loader"), p = w("wt-icon"), G = w("p-galleria");
      return y(), L(W, null, [
        a(G, {
          visible: l.value,
          "onUpdate:visible": f[1] || (f[1] = (d) => l.value = d),
          "active-index": n.value,
          "onUpdate:activeIndex": f[2] || (f[2] = (d) => n.value = d),
          value: e.value,
          "show-thumbnails": _.value,
          "full-screen": "",
          circular: "",
          "show-item-navigators": "",
          "num-visible": 5,
          pt: {
            root: {
              class: [{ "flex flex-col": i(u) }]
            },
            content: {
              class: ["relative", { "wt-galleria__content--fullscreen": i(u) }]
            },
            thumbnails: "wt-galleria__thumbnails",
            closeButton: {
              style: { display: i(u) ? "none" : "block" }
            }
          }
        }, {
          item: s(({ item: d }) => [
            m("div", {
              class: M(["wt-galleria__image-container", { "wt-galleria__image-container--preview": !i(u) }])
            }, [
              o.value ? (y(), A(H, { key: 0 })) : q("", !0),
              X(m("img", {
                class: M(["wt-galleria__image", { "wt-galleria__image--fullscreen": i(u) }]),
                src: d?.src,
                alt: d?.title,
                onLoad: U
              }, null, 42, re), [
                [Y, !o.value]
              ])
            ], 2)
          ]),
          thumbnail: s(({ item: d }) => [
            m("img", {
              src: d?.thumbnailSrc,
              alt: d?.title,
              class: "wt-galleria__thumbnail"
            }, null, 8, ue)
          ]),
          closeicon: s(() => [
            a(p, { icon: "close" })
          ]),
          previousitemicon: s(() => [
            a(p, { icon: "arrow-left" })
          ]),
          nextitemicon: s(() => [
            a(p, { icon: "arrow-right" })
          ]),
          previousthumbnailicon: s(() => [
            a(p, { icon: "arrow-left" })
          ]),
          nextthumbnailicon: s(() => [
            a(p, { icon: "arrow-right" })
          ]),
          footer: s(() => [
            m("div", de, [
              a(p, {
                icon: "tile",
                onClick: T
              }),
              e.value.length ? (y(), L("span", me, [
                m("span", null, g(n.value + 1) + "/" + g(e.value.length), 1),
                m("span", null, g(e.value[n.value].title), 1),
                m("span", null, g(e.value[n.value].description), 1)
              ])) : q("", !0),
              m("div", ve, [
                a(p, {
                  icon: "download",
                  onClick: f[0] || (f[0] = (d) => v("download", n.value))
                }),
                a(p, {
                  icon: "bucket",
                  onClick: O
                }),
                a(p, {
                  icon: i(u) ? "collapse" : "expand",
                  onClick: i(h)
                }, null, 8, ["icon", "onClick"])
              ])
            ])
          ]),
          _: 1
        }, 8, ["visible", "active-index", "value", "show-thumbnails", "pt"]),
        a(ce, {
          shown: i(I),
          callback: i(V),
          "delete-count": i(N),
          onClose: i(R)
        }, null, 8, ["shown", "callback", "delete-count", "onClose"])
      ], 64);
    };
  }
});
export {
  ge as default
};
