@nmorph/nmorph-ui-kit 2.2.54 → 2.2.56

package/dist/components/data/nmorph-media-gallery/NmorphMediaGallery.vue.js

@@ -1,48 +1,47 @@
 import './NmorphMediaGallery.css';
-import { defineComponent as Ye, ref as _, computed as s, watch as S, onBeforeUnmount as Ge, openBlock as i, createElementBlock as u, Fragment as ve, normalizeStyle as me, normalizeClass as fe, renderList as Ue, createElementVNode as x, createBlock as B, unref as o, createVNode as r, withCtx as c, createCommentVNode as d, toDisplayString as A, withModifiers as P } from "vue";
-import { useModifiers as pe } from "../../../utils/create-modifiers.js";
-import { createCssSizeVariables as Ze } from "../../../utils/common.js";
-import We from "../nmorph-preview-portal/NmorphPreviewPortal.vue.js";
+import { defineComponent as Xe, ref as k, computed as s, watch as z, onBeforeUnmount as Ye, openBlock as i, createElementBlock as u, Fragment as ve, normalizeStyle as me, normalizeClass as fe, renderList as Ge, createElementVNode as b, createBlock as A, unref as n, createVNode as r, withCtx as c, createCommentVNode as v, toDisplayString as M, withModifiers as P } from "vue";
+import { useModifiers as ge } from "../../../utils/create-modifiers.js";
+import { createCssSizeVariables as Ue } from "../../../utils/common.js";
+import Ze from "../nmorph-preview-portal/NmorphPreviewPortal.vue.js";
 /* empty css                                                */
-import he from "../nmorph-image/NmorphImage.vue.js";
+import pe from "../nmorph-image/NmorphImage.vue.js";
 /* empty css                               */
 import f from "../../basic/nmorph-icon/NmorphIcon.vue.js";
 /* empty css                                      */
-import je from "../../../assets/icons/eye.svg.js";
-import ge from "../../../assets/icons/full-screen.svg.js";
-import M from "../../basic/nmorph-button/NmorphButton.vue.js";
+import We from "../../../assets/icons/eye.svg.js";
+import he from "../../../assets/icons/full-screen.svg.js";
+import H from "../../basic/nmorph-button/NmorphButton.vue.js";
 /* empty css                                          */
-import _e from "../../../assets/icons/play.svg.js";
-import ye from "../../../assets/icons/download.svg.js";
-import Je from "../../../assets/icons/pause.svg.js";
-import Qe from "../../../assets/icons/rotate-right.svg.js";
-import ea from "../../../assets/icons/rotate-left.svg.js";
-import aa from "../../../assets/icons/zoom-in.svg.js";
-import la from "../../../assets/icons/zoom-out.svg.js";
-import oa from "../../../assets/icons/enlarge.svg.js";
-import ta from "../../../assets/icons/shrink.svg.js";
-const na = ["aria-label", "onClick"], ra = ["src", "poster", "title"], ia = {
+import je from "../../../assets/icons/play.svg.js";
+import _e from "../../../assets/icons/download.svg.js";
+import Je from "../../../assets/icons/rotate-right.svg.js";
+import Qe from "../../../assets/icons/rotate-left.svg.js";
+import eo from "../../../assets/icons/zoom-in.svg.js";
+import oo from "../../../assets/icons/zoom-out.svg.js";
+import to from "../../../assets/icons/enlarge.svg.js";
+import ao from "../../../assets/icons/shrink.svg.js";
+const lo = ["aria-label", "onClick"], no = ["src", "poster", "title"], ro = {
   key: 2,
   class: "nmorph-media-gallery__trigger-play"
-}, sa = {
+}, io = {
   key: 3,
   class: "nmorph-media-gallery__trigger-name"
-}, ua = {
+}, so = {
   key: 4,
   class: "nmorph-media-gallery__trigger-size"
-}, ca = {
+}, uo = {
   key: 0,
   class: "nmorph-media-gallery__trigger-actions"
-}, da = ["aria-label", "onClick"], va = ["aria-label", "onClick"], ma = ["href", "download", "aria-label", "onClick"], fa = { class: "nmorph-media-gallery__stage" }, pa = ["src", "poster", "controls", "muted", "playsinline", "preload", "title"], ha = ["aria-label"], ga = {
-  key: 3,
+}, co = ["aria-label", "onClick"], vo = ["aria-label", "onClick"], mo = ["href", "download", "aria-label", "onClick"], fo = { class: "nmorph-media-gallery__stage" }, go = ["src", "poster", "controls", "muted", "playsinline", "preload", "title"], po = {
+  key: 2,
   class: "nmorph-media-gallery__file-name"
-}, _a = {
-  key: 4,
+}, ho = {
+  key: 3,
   class: "nmorph-media-gallery__file-actions"
-}, ya = ["aria-label"], ka = ["href", "download", "aria-label"], wa = {
-  key: 5,
+}, _o = ["aria-label"], yo = ["href", "download", "aria-label"], wo = {
+  key: 4,
   class: "nmorph-media-gallery__file-size"
-}, ba = { class: "nmorph-media-gallery__action-element" }, Ia = { class: "nmorph-media-gallery__action-element" }, Na = { class: "nmorph-media-gallery__action-element" }, xa = { class: "nmorph-media-gallery__action-element" }, Ba = { class: "nmorph-media-gallery__action-element" }, Fa = 45, Wa = /* @__PURE__ */ Ye({
+}, ko = { class: "nmorph-media-gallery__action-element" }, Io = { class: "nmorph-media-gallery__action-element" }, bo = { class: "nmorph-media-gallery__action-element" }, Fo = { class: "nmorph-media-gallery__action-element" }, No = { class: "nmorph-media-gallery__action-element" }, Bo = 45, Uo = /* @__PURE__ */ Xe({
   __name: "NmorphMediaGallery",
   props: {
     modelValue: { type: Boolean, default: !1 },
@@ -55,6 +54,9 @@ const na = ["aria-label", "onClick"], ra = ["src", "poster", "title"], ia = {
     showTriggerName: { type: Boolean, default: !0 },
     showTriggerSize: { type: Boolean, default: !0 },
     showTriggerActions: { type: Boolean, default: !0 },
+    showTriggerPreviewAction: { type: Boolean, default: !0 },
+    showTriggerFullscreenAction: { type: Boolean, default: !0 },
+    showTriggerDownloadAction: { type: Boolean, default: !0 },
     showTriggerPlayButton: { type: Boolean, default: !0 },
     showNavigationButtons: { type: Boolean, default: !0 },
     showActionBar: { type: Boolean, default: !0 },
@@ -66,305 +68,291 @@ const na = ["aria-label", "onClick"], ra = ["src", "poster", "title"], ia = {
     videoFit: { default: "contain" }
   },
   emits: ["update:model-value", "update:active-index", "close", "change", "download", "fullscreen"],
-  setup(ke, { emit: we }) {
-    const n = ke, h = we, y = _(n.modelValue), F = _(0), k = _(null), X = _({}), z = _(null), m = _(!1), I = _(!1), w = _(1), g = _(0), C = _(null), p = s(() => n.items || []), Y = s(() => p.value.length > 1), G = s(() => n.showNavigationButtons && Y.value), $ = (e) => {
-      const l = p.value.length - 1;
-      return l < 0 || !Number.isFinite(e) || e < 0 ? 0 : e > l ? l : e;
-    }, b = s(() => $(F.value)), t = s(() => p.value[b.value]), U = s(() => t.value?.kind === "image"), H = s(() => t.value?.kind === "video"), Z = s(
-      () => t.value?.kind === "video" ? t.value.controls !== !1 : !1
-    ), be = s(() => t.value?.kind === "video" ? t.value.muted === !0 : !1), Ie = s(
-      () => t.value?.kind === "video" ? t.value.playsinline !== !1 : !0
-    ), Ne = s(
-      () => t.value?.kind === "video" && t.value.preload || "metadata"
-    ), E = s(
-      () => t.value?.kind === "video" && t.value.name || "video"
-    ), R = s(() => t.value?.name || ""), W = s(() => n.showFileName ? R.value : ""), D = s(() => t.value?.downloadHref || ""), xe = s(() => n.showPlaybackButton && H.value && I.value), j = s(() => n.showFileActions && H.value && !Z.value), Be = s(
-      () => n.showFileActions && (j.value || !!D.value)
+  setup(ye, { emit: we }) {
+    const l = ye, g = we, _ = k(l.modelValue), F = k(0), N = k(null), K = k({}), C = k(null), p = k(!1), y = k(1), h = k(0), B = k(null), m = s(() => l.items || []), q = s(() => m.value.length > 1), O = s(() => l.showNavigationButtons && q.value), x = (e) => {
+      const t = m.value.length - 1;
+      return t < 0 || !Number.isFinite(e) || e < 0 ? 0 : e > t ? t : e;
+    }, w = s(() => x(F.value)), a = s(() => m.value[w.value]), X = s(() => a.value?.kind === "image"), V = s(() => a.value?.kind === "video"), Y = s(
+      () => a.value?.kind === "video" ? a.value.controls !== !1 : !1
+    ), ke = s(() => a.value?.kind === "video" ? a.value.muted === !0 : !1), Ie = s(
+      () => a.value?.kind === "video" ? a.value.playsinline !== !1 : !0
+    ), be = s(
+      () => a.value?.kind === "video" && a.value.preload || "metadata"
     ), Fe = s(
-      () => pe({
+      () => a.value?.kind === "video" && a.value.name || "video"
+    ), D = s(() => a.value?.name || ""), G = s(() => l.showFileName ? D.value : ""), L = s(() => a.value?.downloadHref || ""), U = s(() => l.showFileActions && V.value && !Y.value), Ne = s(
+      () => l.showFileActions && (U.value || !!L.value)
+    ), Be = s(
+      () => ge({
         "nmorph-media-gallery": [
-          y.value && "opened",
-          U.value && "image",
-          H.value && "video",
-          m.value && H.value && "video-playing",
-          n.imageFit === "cover" && U.value && "image-cover",
-          n.videoFit === "cover" && H.value && "video-cover"
+          _.value && "opened",
+          X.value && "image",
+          V.value && "video",
+          p.value && V.value && "video-playing",
+          l.imageFit === "cover" && X.value && "image-cover",
+          l.videoFit === "cover" && V.value && "video-cover"
         ]
       })
-    ), Ce = s(() => `rotate(${g.value}deg) scale(${w.value})`), $e = s(
-      () => Ze({
-        "--nmorph-media-gallery-trigger-height": n.height
+    ), xe = s(() => `rotate(${h.value}deg) scale(${y.value})`), Ce = s(
+      () => Ue({
+        "--nmorph-media-gallery-trigger-height": l.height
       })
-    ), Pe = s(
-      () => pe({
-        "nmorph-media-gallery__trigger": [n.height !== void 0 && "fixed-height"]
+    ), Te = s(
+      () => ge({
+        "nmorph-media-gallery__trigger": [l.height !== void 0 && "fixed-height"]
       })
-    ), J = (e) => {
+    ), Z = (e) => {
       if (e === void 0 || Number.isNaN(e) || e < 0) return "";
       if (e === 0) return "0 B";
-      const l = ["B", "KB", "MB", "GB", "TB"], a = Math.min(Math.floor(Math.log(e) / Math.log(1024)), l.length - 1), v = e / 1024 ** a, N = v >= 10 || a === 0 || Number.isInteger(v) ? 0 : 1;
-      return `${v.toFixed(N)} ${l[a]}`;
-    }, Q = s(() => n.showFileSize ? J(t.value?.size) : ""), V = (e) => e.name || "", L = (e, l) => e.name || `${e.kind === "video" ? "Video" : "Image"} ${l + 1}`, ee = (e) => J(e.size), K = (e) => e.downloadHref || "", ze = (e, l) => {
-      X.value[e] = l instanceof HTMLVideoElement ? l : null;
+      const t = ["B", "KB", "MB", "GB", "TB"], o = Math.min(Math.floor(Math.log(e) / Math.log(1024)), t.length - 1), d = e / 1024 ** o, I = d >= 10 || o === 0 || Number.isInteger(d) ? 0 : 1;
+      return `${d.toFixed(I)} ${t[o]}`;
+    }, W = s(() => l.showFileSize ? Z(a.value?.size) : ""), T = (e) => e.name || "", $ = (e, t) => e.name || `${e.kind === "video" ? "Video" : "Image"} ${t + 1}`, j = (e) => Z(e.size), J = (e) => e.downloadHref || "", Q = (e) => l.showTriggerPreviewAction && e.kind === "video", ee = (e) => l.showTriggerFullscreenAction && e.kind === "video", oe = (e) => l.showTriggerDownloadAction && !!J(e), $e = (e) => l.showTriggerActions && (Q(e) || ee(e) || oe(e)), ze = (e, t) => {
+      K.value[e] = t instanceof HTMLVideoElement ? t : null;
     };
-    S(
-      () => n.modelValue,
+    z(
+      () => l.modelValue,
       (e) => {
-        y.value = e;
+        _.value = e;
       }
-    ), S(
-      () => n.activeIndex,
+    ), z(
+      () => l.activeIndex,
       (e) => {
-        typeof e == "number" && (F.value = $(e));
+        typeof e == "number" && (F.value = x(e));
       },
       { immediate: !0 }
-    ), S(
-      () => [n.initialIndex, p.value.length],
+    ), z(
+      () => [l.initialIndex, m.value.length],
       () => {
-        typeof n.activeIndex != "number" && (F.value = $(n.initialIndex));
+        typeof l.activeIndex != "number" && (F.value = x(l.initialIndex));
       },
       { immediate: !0 }
-    ), S(
-      () => [t.value?.kind, t.value?.src, b.value],
+    ), z(
+      () => [a.value?.kind, a.value?.src, w.value],
       () => {
-        m.value = !1, I.value = !1, z.value = null;
+        p.value = !1, C.value = null;
       }
     );
-    const T = () => {
-      !k.value || k.value === z.value || (k.value.pause(), m.value = !1, z.value = k.value);
-    }, ae = () => {
-      w.value = 1, g.value = 0;
-    }, le = (e) => {
-      if (!p.value.length) return;
-      const l = $(e);
-      if (l === b.value) return;
-      T(), m.value = !1, I.value = !1, F.value = l, ae(), h("update:active-index", l);
-      const a = p.value[l];
-      a && h("change", a, l);
-    }, q = () => {
-      const e = p.value.length;
-      e && le(b.value === 0 ? e - 1 : b.value - 1);
-    }, O = () => {
-      const e = p.value.length;
-      e && le(b.value === e - 1 ? 0 : b.value + 1);
-    }, oe = (e) => {
-      if (!p.value.length) return;
-      const l = $(e);
-      T(), m.value = !1, I.value = !1, F.value = l, ae(), y.value = !0, h("update:model-value", !0), h("update:active-index", l);
-      const a = p.value[l];
-      a && h("change", a, l);
+    const S = () => {
+      !N.value || N.value === C.value || (N.value.pause(), p.value = !1, C.value = N.value);
     }, te = () => {
-      y.value && (T(), y.value = !1, h("update:model-value", !1), h("close"));
+      y.value = 1, h.value = 0;
+    }, ae = (e) => {
+      if (!m.value.length) return;
+      const t = x(e);
+      if (t === w.value) return;
+      S(), p.value = !1, F.value = t, te(), g("update:active-index", t);
+      const o = m.value[t];
+      o && g("change", o, t);
+    }, E = () => {
+      const e = m.value.length;
+      e && ae(w.value === 0 ? e - 1 : w.value - 1);
+    }, R = () => {
+      const e = m.value.length;
+      e && ae(w.value === e - 1 ? 0 : w.value + 1);
+    }, le = (e) => {
+      if (!m.value.length) return;
+      const t = x(e);
+      S(), p.value = !1, F.value = t, te(), _.value = !0, g("update:model-value", !0), g("update:active-index", t);
+      const o = m.value[t];
+      o && g("change", o, t);
+    }, ne = () => {
+      _.value && (S(), _.value = !1, g("update:model-value", !1), g("close"));
+    }, Ae = () => {
+      h.value = h.value + 90, h.value >= 360 && (h.value = 0);
+    }, Pe = () => {
+      h.value = h.value - 90, h.value <= -360 && (h.value = 0);
     }, He = () => {
-      g.value = g.value + 90, g.value >= 360 && (g.value = 0);
+      y.value = parseFloat(Math.min(y.value + 0.2, 4).toFixed(3));
     }, Ve = () => {
-      g.value = g.value - 90, g.value <= -360 && (g.value = 0);
-    }, Le = () => {
-      w.value = parseFloat(Math.min(w.value + 0.2, 4).toFixed(3));
+      y.value = parseFloat(Math.max(y.value - 0.2, 0.2).toFixed(3));
     }, Se = () => {
-      w.value = parseFloat(Math.max(w.value - 0.2, 0.2).toFixed(3));
-    }, Me = () => {
-      w.value = 1;
-    }, Te = async () => {
-      if (k.value) {
-        if (m.value) {
-          k.value.pause();
-          return;
-        }
-        try {
-          await k.value.play();
-        } catch {
-          m.value = !1;
-        }
-      }
-    }, ne = async (e) => {
+      y.value = 1;
+    }, re = async (e) => {
       if (e)
         try {
-          const l = e.requestFullscreen?.() || e.webkitRequestFullscreen?.();
-          if (l) {
-            await l;
+          const t = e.requestFullscreen?.() || e.webkitRequestFullscreen?.();
+          if (t) {
+            await t;
             return;
           }
           e.webkitEnterFullscreen?.();
         } catch {
         }
-    }, Ae = async () => {
-      !t.value || t.value.kind !== "video" || (h("fullscreen", t.value, b.value), await ne(k.value));
-    }, Ee = async (e, l) => {
-      e.kind === "video" && (h("fullscreen", e, l), await ne(X.value[l]));
-    }, re = (e, l) => {
-      h("download", e, l);
+    }, Me = async () => {
+      !a.value || a.value.kind !== "video" || (g("fullscreen", a.value, w.value), await re(N.value));
+    }, De = async (e, t) => {
+      e.kind === "video" && (g("fullscreen", e, t), await re(K.value[t]));
+    }, ie = (e, t) => {
+      g("download", e, t);
+    }, Le = () => {
+      a.value && ie(a.value, w.value);
+    }, Ee = () => {
+      p.value = !0, C.value = null;
     }, Re = () => {
-      t.value && re(t.value, b.value);
-    }, De = () => {
-      m.value = !0, z.value = null;
-    }, ie = () => {
-      I.value = !0;
+      p.value = !1;
     }, Ke = () => {
-      m.value = !1;
+      p.value = !1;
     }, qe = () => {
-      m.value = !1;
-    }, Oe = () => {
-      m.value = !1, I.value = !1;
+      p.value = !1;
     }, se = (e) => {
-      if (y.value && !(e.altKey || e.ctrlKey || e.metaKey || e.shiftKey)) {
+      if (_.value && !(e.altKey || e.ctrlKey || e.metaKey || e.shiftKey)) {
         if (e.key === "Escape") {
-          e.preventDefault(), te();
+          e.preventDefault(), ne();
           return;
         }
-        Y.value && (e.key === "ArrowLeft" && (e.preventDefault(), q()), e.key === "ArrowRight" && (e.preventDefault(), O()));
+        q.value && (e.key === "ArrowLeft" && (e.preventDefault(), E()), e.key === "ArrowRight" && (e.preventDefault(), R()));
       }
-    }, Xe = () => {
+    }, Oe = () => {
       typeof document > "u" || document.addEventListener("keydown", se);
     }, ue = () => {
       typeof document > "u" || document.removeEventListener("keydown", se);
     };
-    S(
-      y,
+    z(
+      _,
       (e) => {
-        e ? (Xe(), z.value = null, I.value = !1, F.value = $(
-          typeof n.activeIndex == "number" ? n.activeIndex : n.initialIndex
-        )) : (T(), m.value = !1, I.value = !1, ue());
+        e ? (Oe(), C.value = null, F.value = x(
+          typeof l.activeIndex == "number" ? l.activeIndex : l.initialIndex
+        )) : (S(), p.value = !1, ue());
       },
       { immediate: !0 }
-    ), Ge(ue);
+    ), Ye(ue);
     const ce = (e) => {
-      C.value = { x: e.clientX, y: e.clientY };
+      B.value = { x: e.clientX, y: e.clientY };
     }, de = (e) => {
-      if (!C.value || !G.value) {
-        C.value = null;
+      if (!B.value || !O.value) {
+        B.value = null;
         return;
       }
-      const l = e.clientX - C.value.x, a = e.clientY - C.value.y;
-      C.value = null, !(Math.abs(l) < Fa || Math.abs(l) < Math.abs(a) * 1.2) && (l > 0 ? q() : O());
+      const t = e.clientX - B.value.x, o = e.clientY - B.value.y;
+      B.value = null, !(Math.abs(t) < Bo || Math.abs(t) < Math.abs(o) * 1.2) && (t > 0 ? E() : R());
     };
-    return (e, l) => (i(), u(ve, null, [
-      n.showTrigger ? (i(), u("div", {
+    return (e, t) => (i(), u(ve, null, [
+      l.showTrigger ? (i(), u("div", {
         key: 0,
-        class: fe(Pe.value),
-        style: me($e.value)
+        class: fe(Te.value),
+        style: me(Ce.value)
       }, [
-        (i(!0), u(ve, null, Ue(p.value, (a, v) => (i(), u("div", {
-          key: `${a.kind}-${a.src}-${v}`,
-          class: fe(["nmorph-media-gallery__trigger-item", `nmorph-media-gallery__trigger-item--${a.kind}`])
+        (i(!0), u(ve, null, Ge(m.value, (o, d) => (i(), u("div", {
+          key: `${o.kind}-${o.src}-${d}`,
+          class: fe(["nmorph-media-gallery__trigger-item", `nmorph-media-gallery__trigger-item--${o.kind}`])
         }, [
-          x("button", {
+          b("button", {
             type: "button",
             class: "nmorph-media-gallery__trigger-open",
-            "aria-label": `Open ${L(a, v)}`,
-            onClick: (N) => oe(v)
+            "aria-label": `Open ${$(o, d)}`,
+            onClick: (I) => le(d)
           }, [
-            a.kind === "image" ? (i(), B(o(he), {
+            o.kind === "image" ? (i(), A(n(pe), {
               key: 0,
-              src: a.src,
-              alt: a.alt || L(a, v),
-              title: V(a),
+              src: o.src,
+              alt: o.alt || $(o, d),
+              title: T(o),
               fit: "cover",
               "frame-border": 0
             }, null, 8, ["src", "alt", "title"])) : (i(), u("video", {
               key: 1,
               ref_for: !0,
-              ref: (N) => ze(v, N),
+              ref: (I) => ze(d, I),
               class: "nmorph-media-gallery__trigger-video",
-              src: a.src,
-              poster: a.poster || void 0,
+              src: o.src,
+              poster: o.poster || void 0,
               muted: "",
               playsinline: "",
               preload: "metadata",
-              title: V(a)
-            }, null, 8, ra)),
-            n.showTriggerPlayButton && a.kind === "video" ? (i(), u("span", ia, [
-              r(o(f), {
+              title: T(o)
+            }, null, 8, no)),
+            l.showTriggerPlayButton && o.kind === "video" ? (i(), u("span", ro, [
+              r(n(f), {
                 size: "medium",
                 color: "var(--nmorph-contrast-text-color)"
               }, {
                 default: c(() => [
-                  r(o(_e))
+                  r(n(je))
                 ]),
                 _: 1
               })
-            ])) : d("", !0),
-            n.showTriggerName && V(a) ? (i(), u("span", sa, A(V(a)), 1)) : d("", !0),
-            n.showTriggerSize && ee(a) ? (i(), u("span", ua, A(ee(a)), 1)) : d("", !0)
-          ], 8, na),
-          n.showTriggerActions && (K(a) || a.kind === "video") ? (i(), u("div", ca, [
-            a.kind === "video" ? (i(), u("button", {
+            ])) : v("", !0),
+            l.showTriggerName && T(o) ? (i(), u("span", io, M(T(o)), 1)) : v("", !0),
+            l.showTriggerSize && j(o) ? (i(), u("span", so, M(j(o)), 1)) : v("", !0)
+          ], 8, lo),
+          $e(o) ? (i(), u("div", uo, [
+            Q(o) ? (i(), u("button", {
               key: 0,
               type: "button",
               class: "nmorph-media-gallery__trigger-action",
-              "aria-label": `Preview ${L(a, v)}`,
-              onClick: P((N) => oe(v), ["stop"])
+              "aria-label": `Preview ${$(o, d)}`,
+              onClick: P((I) => le(d), ["stop"])
             }, [
-              r(o(f), {
+              r(n(f), {
                 size: "small",
                 color: "var(--nmorph-contrast-text-color)"
               }, {
                 default: c(() => [
-                  r(o(je))
+                  r(n(We))
                 ]),
                 _: 1
               })
-            ], 8, da)) : d("", !0),
-            a.kind === "video" ? (i(), u("button", {
+            ], 8, co)) : v("", !0),
+            ee(o) ? (i(), u("button", {
               key: 1,
               type: "button",
               class: "nmorph-media-gallery__trigger-action",
-              "aria-label": `Fullscreen ${L(a, v)}`,
-              onClick: P((N) => Ee(a, v), ["stop"])
+              "aria-label": `Fullscreen ${$(o, d)}`,
+              onClick: P((I) => De(o, d), ["stop"])
             }, [
-              r(o(f), {
+              r(n(f), {
                 size: "small",
                 color: "var(--nmorph-contrast-text-color)"
               }, {
                 default: c(() => [
-                  r(o(ge))
+                  r(n(he))
                 ]),
                 _: 1
               })
-            ], 8, va)) : d("", !0),
-            K(a) ? (i(), u("a", {
+            ], 8, vo)) : v("", !0),
+            oe(o) ? (i(), u("a", {
               key: 2,
-              href: K(a),
-              download: V(a) || void 0,
+              href: J(o),
+              download: T(o) || void 0,
               class: "nmorph-media-gallery__trigger-action",
-              "aria-label": `Download ${L(a, v)}`,
-              onClick: P((N) => re(a, v), ["stop"])
+              "aria-label": `Download ${$(o, d)}`,
+              onClick: P((I) => ie(o, d), ["stop"])
             }, [
-              r(o(f), {
+              r(n(f), {
                 size: "small",
                 color: "var(--nmorph-contrast-text-color)"
               }, {
                 default: c(() => [
-                  r(o(ye))
+                  r(n(_e))
                 ]),
                 _: 1
               })
-            ], 8, ma)) : d("", !0)
-          ])) : d("", !0)
+            ], 8, mo)) : v("", !0)
+          ])) : v("", !0)
         ], 2))), 128))
-      ], 6)) : d("", !0),
-      y.value ? (i(), B(We, {
+      ], 6)) : v("", !0),
+      _.value ? (i(), A(Ze, {
         key: 1,
-        show: y.value,
-        "z-index": n.zIndex,
-        "state-class": Fe.value,
+        show: _.value,
+        "z-index": l.zIndex,
+        "state-class": Be.value,
         "content-class": "nmorph-media-gallery__content",
         "left-class": "nmorph-media-gallery__left",
         "right-class": "nmorph-media-gallery__right",
         "actions-class": "nmorph-media-gallery__actions",
-        "show-navigation": G.value,
-        "show-action-bar": n.showActionBar && t.value?.kind === "image",
-        onClose: te,
-        onPrevious: q,
-        onNext: O
+        "show-navigation": O.value,
+        "show-action-bar": l.showActionBar && a.value?.kind === "image",
+        onClose: ne,
+        onPrevious: E,
+        onNext: R
       }, {
         actions: c(() => [
-          x("div", ba, [
-            r(o(M), { onClick: He }, {
+          b("div", ko, [
+            r(n(H), { onClick: Ae }, {
               default: c(() => [
-                r(o(f), null, {
+                r(n(f), null, {
                   default: c(() => [
-                    r(o(Qe))
+                    r(n(Je))
                   ]),
                   _: 1
                 })
@@ -372,12 +360,12 @@ const na = ["aria-label", "onClick"], ra = ["src", "poster", "title"], ia = {
               _: 1
             })
           ]),
-          x("div", Ia, [
-            r(o(M), { onClick: Ve }, {
+          b("div", Io, [
+            r(n(H), { onClick: Pe }, {
               default: c(() => [
-                r(o(f), null, {
+                r(n(f), null, {
                   default: c(() => [
-                    r(o(ea))
+                    r(n(Qe))
                   ]),
                   _: 1
                 })
@@ -385,12 +373,12 @@ const na = ["aria-label", "onClick"], ra = ["src", "poster", "title"], ia = {
               _: 1
             })
           ]),
-          x("div", Na, [
-            r(o(M), { onClick: Le }, {
+          b("div", bo, [
+            r(n(H), { onClick: He }, {
               default: c(() => [
-                r(o(f), null, {
+                r(n(f), null, {
                   default: c(() => [
-                    r(o(aa))
+                    r(n(eo))
                   ]),
                   _: 1
                 })
@@ -398,12 +386,12 @@ const na = ["aria-label", "onClick"], ra = ["src", "poster", "title"], ia = {
               _: 1
             })
           ]),
-          x("div", xa, [
-            r(o(M), { onClick: Se }, {
+          b("div", Fo, [
+            r(n(H), { onClick: Ve }, {
               default: c(() => [
-                r(o(f), null, {
+                r(n(f), null, {
                   default: c(() => [
-                    r(o(la))
+                    r(n(oo))
                   ]),
                   _: 1
                 })
@@ -411,15 +399,15 @@ const na = ["aria-label", "onClick"], ra = ["src", "poster", "title"], ia = {
               _: 1
             })
           ]),
-          x("div", Ba, [
-            r(o(M), {
-              disabled: w.value === 1,
-              onClick: Me
+          b("div", No, [
+            r(n(H), {
+              disabled: y.value === 1,
+              onClick: Se
             }, {
               default: c(() => [
-                r(o(f), null, {
+                r(n(f), null, {
                   default: c(() => [
-                    w.value < 1 ? (i(), B(o(oa), { key: 0 })) : (i(), B(o(ta), { key: 1 }))
+                    y.value < 1 ? (i(), A(n(to), { key: 0 })) : (i(), A(n(ao), { key: 1 }))
                   ]),
                   _: 1
                 })
@@ -429,101 +417,82 @@ const na = ["aria-label", "onClick"], ra = ["src", "poster", "title"], ia = {
           ])
         ]),
         default: c(() => [
-          x("div", fa, [
-            t.value?.kind === "image" ? (i(), B(o(he), {
+          b("div", fo, [
+            a.value?.kind === "image" ? (i(), A(n(pe), {
               key: 0,
-              src: t.value.src,
-              alt: t.value.alt || t.value.name || "",
-              title: t.value.name,
-              fit: n.imageFit,
+              src: a.value.src,
+              alt: a.value.alt || a.value.name || "",
+              title: a.value.name,
+              fit: l.imageFit,
               "frame-border": 0,
-              style: me({ transform: Ce.value }),
+              style: me({ transform: xe.value }),
               onPointerdown: ce,
               onPointerup: de
-            }, null, 8, ["src", "alt", "title", "fit", "style"])) : t.value?.kind === "video" ? (i(), u("video", {
+            }, null, 8, ["src", "alt", "title", "fit", "style"])) : a.value?.kind === "video" ? (i(), u("video", {
               key: 1,
               ref_key: "currentVideoRef",
-              ref: k,
+              ref: N,
               class: "nmorph-media-gallery__video",
-              src: t.value.src,
-              poster: t.value.poster || void 0,
-              controls: Z.value,
-              muted: be.value,
+              src: a.value.src,
+              poster: a.value.poster || void 0,
+              controls: Y.value,
+              muted: ke.value,
               playsinline: Ie.value,
-              preload: Ne.value,
-              title: t.value.name,
+              preload: be.value,
+              title: a.value.name,
               onPointerdown: ce,
               onPointerup: de,
-              onLoadeddata: ie,
-              onCanplay: ie,
-              onPlay: De,
-              onPause: Ke,
-              onEnded: qe,
-              onError: Oe
-            }, null, 40, pa)) : d("", !0),
-            xe.value ? (i(), u("button", {
-              key: 2,
-              class: "nmorph-media-gallery__play",
-              type: "button",
-              "aria-label": m.value ? `Pause ${E.value}` : `Play ${E.value}`,
-              onClick: P(Te, ["stop"])
-            }, [
-              r(o(f), {
-                size: "medium",
-                color: "var(--nmorph-contrast-text-color)"
-              }, {
-                default: c(() => [
-                  m.value ? (i(), B(o(Je), { key: 0 })) : (i(), B(o(_e), { key: 1 }))
-                ]),
-                _: 1
-              })
-            ], 8, ha)) : d("", !0),
-            W.value ? (i(), u("span", ga, A(W.value), 1)) : d("", !0),
-            Be.value ? (i(), u("div", _a, [
-              j.value ? (i(), u("button", {
+              onPlay: Ee,
+              onPause: Re,
+              onEnded: Ke,
+              onError: qe
+            }, null, 40, go)) : v("", !0),
+            G.value ? (i(), u("span", po, M(G.value), 1)) : v("", !0),
+            Ne.value ? (i(), u("div", ho, [
+              U.value ? (i(), u("button", {
                 key: 0,
                 type: "button",
                 class: "nmorph-media-gallery__file-action",
-                "aria-label": `Fullscreen ${E.value}`,
-                onClick: P(Ae, ["stop"])
+                "aria-label": `Fullscreen ${Fe.value}`,
+                onClick: P(Me, ["stop"])
               }, [
-                r(o(f), {
+                r(n(f), {
                   size: "small",
                   color: "var(--nmorph-contrast-text-color)"
                 }, {
                   default: c(() => [
-                    r(o(ge))
+                    r(n(he))
                   ]),
                   _: 1
                 })
-              ], 8, ya)) : d("", !0),
-              D.value ? (i(), u("a", {
+              ], 8, _o)) : v("", !0),
+              L.value ? (i(), u("a", {
                 key: 1,
-                href: D.value,
-                download: R.value || void 0,
+                href: L.value,
+                download: D.value || void 0,
                 class: "nmorph-media-gallery__file-action",
-                "aria-label": `Download ${R.value || "media"}`,
-                onClick: P(Re, ["stop"])
+                "aria-label": `Download ${D.value || "media"}`,
+                onClick: P(Le, ["stop"])
               }, [
-                r(o(f), {
+                r(n(f), {
                   size: "small",
                   color: "var(--nmorph-contrast-text-color)"
                 }, {
                   default: c(() => [
-                    r(o(ye))
+                    r(n(_e))
                   ]),
                   _: 1
                 })
-              ], 8, ka)) : d("", !0)
-            ])) : d("", !0),
-            Q.value ? (i(), u("span", wa, A(Q.value), 1)) : d("", !0)
+              ], 8, yo)) : v("", !0)
+            ])) : v("", !0),
+            W.value ? (i(), u("span", wo, M(W.value), 1)) : v("", !0)
           ])
         ]),
         _: 1
-      }, 8, ["show", "z-index", "state-class", "show-navigation", "show-action-bar"])) : d("", !0)
+      }, 8, ["show", "z-index", "state-class", "show-navigation", "show-action-bar"])) : v("", !0)
     ], 64));
   }
 });
 export {
-  Wa as default
+  Uo as default
 };