@nmorph/nmorph-ui-kit 3.0.6 → 3.0.8

package/dist/components/data/nmorph-carousel/components/nmorph-carousel-item/NmorphCarouselItem.vue.js

@@ -1,25 +1,32 @@
-import t from "./NmorphCarouselItem.vue2.js";
-import { openBlock as e, createElementBlock as a, normalizeClass as m, createBlock as s, Teleport as n, renderSlot as c, createCommentVNode as l } from "vue";
-import i from "../../../../../_virtual/_plugin-vue_export-helper.js";
-function p(r, d, f, o, u, _) {
-  return o.isMounted ? (e(), a(
+import m from "./NmorphCarouselItem.vue2.js";
+import { openBlock as r, createElementBlock as t, normalizeClass as s, Fragment as l, renderList as a, createBlock as c, Teleport as i, renderSlot as p, createCommentVNode as d } from "vue";
+import u from "../../../../../_virtual/_plugin-vue_export-helper.js";
+function f(n, _, h, e, k, C) {
+  return e.isMounted ? (r(), t(
     "div",
     {
       key: 0,
-      class: m(o.modifiers)
+      class: s(e.modifiers)
     },
     [
-      (e(), s(n, {
-        to: `#nmorph-carousel-item-${o.carouselData?.carouselId}-${o.props.name}`
-      }, [
-        c(r.$slots, "default")
-      ], 8, ["to"]))
+      (r(!0), t(
+        l,
+        null,
+        a(e.teleportTargets, (o) => (r(), c(i, {
+          key: o,
+          to: o
+        }, [
+          p(n.$slots, "default")
+        ], 8, ["to"]))),
+        128
+        /* KEYED_FRAGMENT */
+      ))
     ],
     2
     /* CLASS */
-  )) : l("v-if", !0);
+  )) : d("v-if", !0);
 }
-const v = /* @__PURE__ */ i(t, [["render", p], ["__file", "/builds/ketjo/nmorph/library/src/components/data/nmorph-carousel/components/nmorph-carousel-item/NmorphCarouselItem.vue"]]);
+const N = /* @__PURE__ */ u(m, [["render", f], ["__file", "/builds/ketjo/nmorph/library/src/components/data/nmorph-carousel/components/nmorph-carousel-item/NmorphCarouselItem.vue"]]);
 export {
-  v as default
+  N as default
 };

package/dist/components/data/nmorph-carousel/components/nmorph-carousel-item/NmorphCarouselItem.vue2.js

@@ -1,28 +1,32 @@
-import { defineComponent as i, computed as p, inject as m, ref as c, onMounted as d, onBeforeUnmount as f } from "vue";
-import { useModifiers as l } from "../../../../../utils/create-modifiers.js";
-const x = /* @__PURE__ */ i({
+import { defineComponent as l, computed as u, inject as c, ref as d, onMounted as _, onBeforeUnmount as h } from "vue";
+import { useModifiers as v } from "../../../../../utils/create-modifiers.js";
+const C = /* @__PURE__ */ l({
   __name: "NmorphCarouselItem",
   props: {
     name: { type: String, required: !0 }
   },
-  setup(a, { expose: u }) {
-    u();
-    const t = a, s = p(
-      () => l({
+  setup(i, { expose: m }) {
+    m();
+    const r = i, p = u(
+      () => v({
         "nmorph-carousel-item": []
       })
-    ), e = m("carousel-data"), r = c(!1);
-    d(() => {
-      r.value = !0, e && e.data.value.push(t.name);
-    }), f(() => {
+    ), e = c("carousel-data"), o = d(!1), n = (t, a) => `#nmorph-carousel-item-${e?.carouselId}-${t}${a ? `-${a}` : ""}`, f = u(() => {
+      if (!e) return [];
+      const t = [n(r.name)], a = e.data.value;
+      return !e.hasLoopClones.value || !a.length || (r.name === a[0] && t.push(n(r.name, "after")), r.name === a[a.length - 1] && t.push(n(r.name, "before"))), t;
+    });
+    _(() => {
+      o.value = !0, e && e.data.value.push(r.name);
+    }), h(() => {
       if (!e) return;
-      const n = e.data.value.indexOf(t.name);
-      n !== -1 && e.data.value.splice(n, 1);
+      const t = e.data.value.indexOf(r.name);
+      t !== -1 && e.data.value.splice(t, 1);
     });
-    const o = { props: t, modifiers: s, carouselData: e, isMounted: r };
-    return Object.defineProperty(o, "__isScriptSetup", { enumerable: !1, value: !0 }), o;
+    const s = { props: r, modifiers: p, carouselData: e, isMounted: o, getCarouselItemId: n, teleportTargets: f };
+    return Object.defineProperty(s, "__isScriptSetup", { enumerable: !1, value: !0 }), s;
   }
 });
 export {
-  x as default
+  C as default
 };

package/dist/components/data/nmorph-image-preview/NmorphImagePreview.vue.js

@@ -1,96 +1,96 @@
 import './NmorphImagePreview.css';
 import _ from "./NmorphImagePreview.vue2.js";
-import { openBlock as n, createElementBlock as a, Fragment as g, normalizeStyle as v, normalizeClass as w, createElementVNode as d, renderList as p, withModifiers as k, createVNode as l, createSlots as m, withCtx as o, renderSlot as t, toDisplayString as y, createCommentVNode as c, createBlock as s, resolveDynamicComponent as f } from "vue";
+import { openBlock as n, createElementBlock as a, Fragment as g, normalizeStyle as p, normalizeClass as w, createElementVNode as m, renderList as v, withModifiers as k, createVNode as l, createSlots as d, withCtx as o, renderSlot as t, toDisplayString as y, createCommentVNode as c, createBlock as s, resolveDynamicComponent as f } from "vue";
 /* empty css                        */
 import b from "../../../_virtual/_plugin-vue_export-helper.js";
 const N = ["aria-label", "onClick"], C = {
   key: 0,
   class: "nmorph-image-preview__trigger-more"
 }, S = { class: "nmorph-image-preview__action-element" };
-function I(r, B, T, e, L, P) {
+function I(e, T, B, r, P, z) {
   return n(), a(
     g,
     null,
     [
-      e.props.showTrigger ? (n(), a(
+      r.props.showTrigger ? (n(), a(
         "div",
         {
           key: 0,
-          class: w(e.modifiers),
-          style: v(e.triggerStyle)
+          class: w(r.modifiers),
+          style: p(r.triggerStyle)
         },
         [
-          d("div", {
+          m("div", {
             class: "nmorph-image-preview__trigger",
-            onClick: e.clickHandler
+            onClick: r.clickHandler
           }, [
-            e.showGalleryTrigger ? (n(!0), a(
+            r.showGalleryTrigger ? (n(!0), a(
               g,
               { key: 0 },
-              p(e.triggerSources, (i) => (n(), a("button", {
+              v(r.triggerSources, (i) => (n(), a("button", {
                 key: `${i.src}-${i.index}`,
                 type: "button",
                 class: "nmorph-image-preview__trigger-item",
-                "aria-label": e.getTriggerLabel(i.index),
-                onClick: k((h) => e.openPreviewAt(i.index), ["stop"])
+                "aria-label": r.getTriggerLabel(i.index),
+                onClick: k((h) => r.openPreviewAt(i.index), ["stop"])
               }, [
-                l(e.NmorphImage, {
+                l(r.NmorphImage, {
                   src: i.src,
-                  alt: e.getTriggerLabel(i.index),
-                  fit: e.props.fit,
+                  alt: r.getTriggerLabel(i.index),
+                  fit: r.props.fit,
                   design: "plain",
                   "frame-border": 0
-                }, m({
+                }, d({
                   _: 2
                   /* DYNAMIC */
                 }, [
-                  r.$slots.loading ? {
+                  e.$slots.loading ? {
                     name: "loading",
                     fn: o(() => [
-                      t(r.$slots, "loading")
+                      t(e.$slots, "loading")
                     ]),
                     key: "0"
                   } : void 0,
-                  r.$slots.error ? {
+                  e.$slots.error ? {
                     name: "error",
                     fn: o(() => [
-                      t(r.$slots, "error")
+                      t(e.$slots, "error")
                     ]),
                     key: "1"
                   } : void 0
                 ]), 1032, ["src", "alt", "fit"]),
-                i.index === e.lastVisibleTriggerIndex && e.hiddenTriggerCount > 0 ? (n(), a(
+                i.index === r.lastVisibleTriggerIndex && r.hiddenTriggerCount > 0 ? (n(), a(
                   "span",
                   C,
-                  " +" + y(e.hiddenTriggerCount),
+                  " +" + y(r.hiddenTriggerCount),
                   1
                   /* TEXT */
                 )) : c("v-if", !0)
               ], 8, N))),
               128
               /* KEYED_FRAGMENT */
-            )) : (n(), s(e.NmorphImage, {
+            )) : (n(), s(r.NmorphImage, {
               key: 1,
-              src: e.triggerSource,
-              alt: e.props.alt,
-              fit: e.props.fit,
+              src: r.triggerSource,
+              alt: r.props.alt,
+              fit: r.props.fit,
               design: "plain",
               "frame-border": 0
-            }, m({
+            }, d({
               _: 2
               /* DYNAMIC */
             }, [
-              r.$slots.loading ? {
+              e.$slots.loading ? {
                 name: "loading",
                 fn: o(() => [
-                  t(r.$slots, "loading")
+                  t(e.$slots, "loading")
                 ]),
                 key: "0"
               } : void 0,
-              r.$slots.error ? {
+              e.$slots.error ? {
                 name: "error",
                 fn: o(() => [
-                  t(r.$slots, "error")
+                  t(e.$slots, "error")
                 ]),
                 key: "1"
               } : void 0
@@ -100,34 +100,34 @@ function I(r, B, T, e, L, P) {
         6
         /* CLASS, STYLE */
       )) : c("v-if", !0),
-      e.open ? (n(), s(e.NmorphPreviewPortal, {
+      r.open ? (n(), s(r.NmorphPreviewPortal, {
         key: 1,
-        show: e.open,
-        "z-index": e.props.zIndex,
+        show: r.open,
+        "z-index": r.props.zIndex,
         "root-class": "nmorph-image-preview__portal",
-        "state-class": e.modifiers,
+        "state-class": r.modifiers,
         "content-class": "nmorph-image-preview__content",
         "left-class": "nmorph-image-preview__left",
         "right-class": "nmorph-image-preview__right",
         "actions-class": "nmorph-image-preview__actions",
-        "navigation-button-margin": e.props.navigationButtonMargin,
-        "content-width": e.props.previewWidth,
-        "content-height": e.props.previewHeight,
-        "show-navigation": e.showNavigation,
-        "show-action-bar": e.props.showActionBar,
-        onClose: e.closeHandler,
-        onPrevious: e.previousHandler,
-        onNext: e.nextHandler
+        "navigation-button-margin": r.props.navigationButtonMargin,
+        "content-width": r.props.previewWidth,
+        "content-height": r.props.previewHeight,
+        "show-navigation": r.showNavigation,
+        "show-action-bar": r.props.showActionBar,
+        onClose: r.closeHandler,
+        onPrevious: r.previousHandler,
+        onNext: r.nextHandler
       }, {
         actions: o(() => [
           (n(), a(
             g,
             null,
-            p(e.actions, (i, h) => d("div", {
+            v(r.actions, (i, h) => m("div", {
               key: h,
               class: "nmorph-image-preview__action-element"
             }, [
-              l(e.NmorphButton, {
+              l(r.NmorphButton, {
                 class: "nmorph-preview-portal__control-button",
                 design: "plain",
                 borderless: "",
@@ -135,7 +135,7 @@ function I(r, B, T, e, L, P) {
               }, {
                 default: o(() => [
                   l(
-                    e.NmorphIcon,
+                    r.NmorphIcon,
                     null,
                     {
                       default: o(() => [
@@ -155,18 +155,18 @@ function I(r, B, T, e, L, P) {
             64
             /* STABLE_FRAGMENT */
           )),
-          d("div", S, [
-            l(e.NmorphButton, {
+          m("div", S, [
+            l(r.NmorphButton, {
               class: "nmorph-preview-portal__control-button",
               design: "plain",
               borderless: "",
-              disabled: e.scaleLevel === 1,
-              onClick: e.enlargeShrinkActionData.handler
+              disabled: r.scaleLevel === 1,
+              onClick: r.enlargeShrinkActionData.handler
             }, {
               default: o(() => [
-                l(e.NmorphIcon, null, {
+                l(r.NmorphIcon, null, {
                   default: o(() => [
-                    (n(), s(f(e.enlargeShrinkActionData.icon)))
+                    (n(), s(f(r.enlargeShrinkActionData.icon)))
                   ]),
                   _: 1
                   /* STABLE */
@@ -178,28 +178,28 @@ function I(r, B, T, e, L, P) {
           ])
         ]),
         default: o(() => [
-          l(e.NmorphImage, {
-            src: e.triggerSource,
-            alt: e.props.alt,
+          l(r.NmorphImage, {
+            src: r.triggerSource,
+            alt: r.props.alt,
             fit: "contain",
             design: "plain",
             "frame-border": 0,
-            style: v({ transform: `rotate(${e.rotateLevel}deg) scale(${e.scaleLevel})` })
-          }, m({
+            style: p({ transform: r.imageTransform })
+          }, d({
             _: 2
             /* DYNAMIC */
           }, [
-            r.$slots.loading ? {
+            e.$slots.loading ? {
               name: "loading",
               fn: o(() => [
-                t(r.$slots, "loading")
+                t(e.$slots, "loading")
               ]),
               key: "0"
             } : void 0,
-            r.$slots.error ? {
+            e.$slots.error ? {
               name: "error",
               fn: o(() => [
-                t(r.$slots, "error")
+                t(e.$slots, "error")
               ]),
               key: "1"
             } : void 0

package/dist/components/data/nmorph-image-preview/NmorphImagePreview.vue2.js

@@ -1,18 +1,18 @@
 import './NmorphImagePreview.css';
-import { defineComponent as $, ref as g, watch as h, computed as t, onBeforeUnmount as Z } from "vue";
-import { useModifiers as j } from "../../../utils/create-modifiers.js";
-import { createCssSizeVariables as U } from "../../../utils/common.js";
-import W from "../nmorph-preview-portal/NmorphPreviewPortal.vue.js";
-import J from "../../../assets/icons/shrink.svg.js";
-import Q from "../../../assets/icons/rotate-right.svg.js";
-import X from "../../../assets/icons/rotate-left.svg.js";
-import Y from "../../../assets/icons/zoom-in.svg.js";
-import ee from "../../../assets/icons/zoom-out.svg.js";
-import re from "../../../assets/icons/enlarge.svg.js";
-import te from "../../basic/nmorph-icon/NmorphIcon.vue.js";
-import ae from "../../basic/nmorph-button/NmorphButton.vue.js";
-import ie from "../nmorph-image/NmorphImage.vue.js";
-const Ne = /* @__PURE__ */ $({
+import { defineComponent as ee, ref as w, watch as I, computed as a, onBeforeUnmount as te } from "vue";
+import { useModifiers as re } from "../../../utils/create-modifiers.js";
+import { createCssSizeVariables as ae } from "../../../utils/common.js";
+import oe from "../nmorph-preview-portal/NmorphPreviewPortal.vue.js";
+import le from "../../../assets/icons/shrink.svg.js";
+import ne from "../../../assets/icons/rotate-right.svg.js";
+import ie from "../../../assets/icons/rotate-left.svg.js";
+import ue from "../../../assets/icons/zoom-in.svg.js";
+import se from "../../../assets/icons/zoom-out.svg.js";
+import me from "../../../assets/icons/enlarge.svg.js";
+import de from "../../basic/nmorph-icon/NmorphIcon.vue.js";
+import ce from "../../basic/nmorph-button/NmorphButton.vue.js";
+import ge from "../nmorph-image/NmorphImage.vue.js";
+const _e = /* @__PURE__ */ ee({
   __name: "NmorphImagePreview",
   props: {
     modelValue: { type: Boolean, required: !1, default: !1 },
@@ -38,117 +38,141 @@ const Ne = /* @__PURE__ */ $({
     triggerGap: { type: [Number, String], required: !1, default: 8 }
   },
   emits: ["update:model-value"],
-  setup(V, { expose: C, emit: H }) {
-    C();
-    const r = V, l = g(r.modelValue);
-    h(
-      () => r.modelValue,
+  setup(O, { expose: D, emit: E }) {
+    D();
+    const t = O, l = w(t.modelValue);
+    I(
+      () => t.modelValue,
       (e) => l.value = e
     );
-    const a = t(() => Array.isArray(r.src) ? r.src : [r.src]), s = (e) => {
-      const o = a.value.length - 1;
-      return o < 0 || e < 0 ? 0 : e > o ? o : e;
-    }, u = g(s(r.initialIndex)), d = t(() => s(u.value)), K = t(() => a.value[d.value] || ""), v = t(() => r.triggerView === "gallery" && a.value.length > 1), y = t(() => !r.triggerLimit || r.triggerLimit < 1 ? a.value.length : Math.min(Math.floor(r.triggerLimit), a.value.length)), m = t(
-      () => a.value.slice(0, y.value).map((e, o) => ({
-        index: o,
+    const o = a(() => Array.isArray(t.src) ? t.src : [t.src]), s = (e) => {
+      const r = o.value.length - 1;
+      return r < 0 || e < 0 ? 0 : e > r ? r : e;
+    }, i = w(s(t.initialIndex)), u = a(() => s(i.value)), b = a(() => o.value[u.value] || ""), p = a(() => t.triggerView === "gallery" && o.value.length > 1), q = a(() => !t.triggerLimit || t.triggerLimit < 1 ? o.value.length : Math.min(Math.floor(t.triggerLimit), o.value.length)), d = a(
+      () => o.value.slice(0, q.value).map((e, r) => ({
+        index: r,
         src: e
       }))
-    ), M = t(() => a.value.length - m.value.length), P = t(() => m.value[m.value.length - 1]?.index ?? -1), R = t(
-      () => j({
-        "nmorph-image-preview": [l.value && "opened", v.value && "gallery-trigger"]
+    ), G = a(() => o.value.length - d.value.length), j = a(() => d.value[d.value.length - 1]?.index ?? -1), F = a(
+      () => re({
+        "nmorph-image-preview": [l.value && "opened", p.value && "gallery-trigger"]
       })
-    ), i = g(1);
-    h(
-      () => [r.initialIndex, a.value.length],
+    ), c = w(/* @__PURE__ */ new Map()), x = (e, r) => e || `__empty-image-${r}`, f = a(() => x(b.value, u.value)), g = a(
+      () => c.value.get(f.value) || {
+        rotateLevel: 0,
+        scaleLevel: 1
+      }
+    ), v = a(() => g.value.rotateLevel), m = a(() => g.value.scaleLevel), Z = a(() => `rotate(${v.value}deg) scale(${m.value})`), T = (e) => {
+      const r = new Map(c.value);
+      r.set(f.value, e), c.value = r;
+    }, n = (e) => {
+      T({
+        ...g.value,
+        ...e
+      });
+    }, h = (e) => {
+      const r = e % 360;
+      return Object.is(r, -0) ? 0 : r;
+    }, y = (e) => parseFloat(Math.min(Math.max(e, t.minScaleLevel), t.maxScaleLevel).toFixed(3));
+    I(
+      () => [t.initialIndex, o.value.length],
       () => {
-        u.value = s(r.initialIndex);
+        i.value = s(t.initialIndex);
       }
     );
-    const N = (e) => {
-      u.value = s(e), l.value = !0, f("update:model-value", l.value);
+    const _ = (e) => {
+      i.value = s(e), l.value = !0, S("update:model-value", l.value);
+    }, U = () => {
+      p.value || _(u.value);
+    }, W = () => {
+      l.value = !1, S("update:model-value", l.value);
+    }, B = () => {
+      n({
+        rotateLevel: h(v.value + 90)
+      });
+    }, k = () => {
+      n({
+        rotateLevel: h(v.value - 90)
+      });
+    }, M = () => {
+      n({
+        scaleLevel: y(m.value + t.scaleStep)
+      });
+    }, A = () => {
+      n({
+        scaleLevel: y(m.value - t.scaleStep)
+      });
+    }, C = a(() => m.value < 1), K = () => {
+      n({ scaleLevel: 1 });
+    }, V = () => {
+      n({ scaleLevel: 1 });
     }, z = () => {
-      v.value || N(d.value);
-    }, F = () => {
-      l.value = !1, f("update:model-value", l.value);
-    }, S = () => {
-      n.value = n.value + 90, n.value >= 360 && (n.value = 0);
-    }, w = () => {
-      n.value = n.value - 90, n.value <= -360 && (n.value = 0);
-    }, I = () => {
-      i.value < r.maxScaleLevel && (i.value += r.scaleStep), i.value = parseFloat(i.value.toFixed(3));
-    }, b = () => {
-      i.value > r.minScaleLevel && (i.value -= r.scaleStep), i.value = parseFloat(i.value.toFixed(3));
-    }, L = t(() => i.value < 1), q = () => {
-      i.value = 1;
-    }, x = () => {
-      i.value = 1;
-    }, n = g(0), B = () => {
-      const e = a.value.length;
+      const e = o.value.length;
       if (!e) return;
-      const o = d.value - 1;
-      u.value = o < 0 ? e - 1 : o;
-    }, _ = () => {
-      const e = a.value.length;
+      const r = u.value - 1;
+      i.value = r < 0 ? e - 1 : r;
+    }, H = () => {
+      const e = o.value.length;
       if (!e) return;
-      const o = d.value + 1;
-      u.value = o > e - 1 ? 0 : o;
-    }, p = (e) => {
-      !l.value || a.value.length < 2 || e.altKey || e.ctrlKey || e.metaKey || e.shiftKey || (e.key === "ArrowLeft" && (e.preventDefault(), B()), e.key === "ArrowRight" && (e.preventDefault(), _()));
-    }, k = () => {
-      typeof document > "u" || document.addEventListener("keydown", p);
-    }, c = () => {
-      typeof document > "u" || document.removeEventListener("keydown", p);
+      const r = u.value + 1;
+      i.value = r > e - 1 ? 0 : r;
+    }, N = (e) => {
+      !l.value || o.value.length < 2 || e.altKey || e.ctrlKey || e.metaKey || e.shiftKey || (e.key === "ArrowLeft" && (e.preventDefault(), z()), e.key === "ArrowRight" && (e.preventDefault(), H()));
+    }, R = () => {
+      typeof document > "u" || document.addEventListener("keydown", N);
+    }, L = () => {
+      typeof document > "u" || document.removeEventListener("keydown", N);
     };
-    h(
+    I(
       l,
       (e) => {
-        e ? k() : c();
+        e ? R() : L();
       },
       { immediate: !0 }
-    ), Z(c);
-    const D = t(() => {
+    ), te(L);
+    const J = a(() => {
       let e = {
-        icon: J,
-        handler: x
+        icon: le,
+        handler: V
       };
-      return L.value && (e = {
-        icon: re,
-        handler: q
+      return C.value && (e = {
+        icon: me,
+        handler: K
       }), e;
-    }), E = [
+    }), Q = [
       {
-        icon: Q,
-        handler: S
+        icon: ne,
+        handler: B
       },
       {
-        icon: X,
-        handler: w
+        icon: ie,
+        handler: k
       },
       {
-        icon: Y,
-        handler: I
+        icon: ue,
+        handler: M
       },
       {
-        icon: ee,
-        handler: b
+        icon: se,
+        handler: A
       }
-    ], f = H, T = t(() => a.value.length > 1), G = t(() => r.showNavigationButtons && T.value), O = t(
-      () => U({
-        "--nmorph-private-image-preview-trigger-width": r.width,
-        "--nmorph-private-image-preview-trigger-height": r.height,
-        "--nmorph-private-image-preview-radius": r.radius,
-        "--nmorph-private-image-preview-trigger-gap": r.triggerGap
+    ], S = E, $ = a(() => o.value.length > 1), X = a(() => t.showNavigationButtons && $.value), Y = a(
+      () => ae({
+        "--nmorph-private-image-preview-trigger-width": t.width,
+        "--nmorph-private-image-preview-trigger-height": t.height,
+        "--nmorph-private-image-preview-radius": t.radius,
+        "--nmorph-private-image-preview-trigger-gap": t.triggerGap
       })
-    ), A = { props: r, open: l, sourceList: a, getClampedIndex: s, currentIndex: u, resolvedCurrentIndex: d, triggerSource: K, showGalleryTrigger: v, triggerSourceLimit: y, triggerSources: m, hiddenTriggerCount: M, lastVisibleTriggerIndex: P, modifiers: R, scaleLevel: i, openPreviewAt: N, clickHandler: z, closeHandler: F, rotateRight: S, rotateLeft: w, zoomIn: I, zoomOut: b, isLevelChangedToMin: L, enlargeToNormal: q, shrinkToNormal: x, rotateLevel: n, previousHandler: B, nextHandler: _, keyboardNavigationHandler: p, addKeyboardNavigationListener: k, removeKeyboardNavigationListener: c, enlargeShrinkActionData: D, actions: E, emit: f, multipleSources: T, showNavigation: G, triggerStyle: O, getTriggerLabel: (e) => r.alt ? `${r.alt} ${e + 1}` : `Image ${e + 1}`, get NmorphImage() {
-      return ie;
+    ), P = { props: t, open: l, sourceList: o, getClampedIndex: s, currentIndex: i, resolvedCurrentIndex: u, triggerSource: b, showGalleryTrigger: p, triggerSourceLimit: q, triggerSources: d, hiddenTriggerCount: G, lastVisibleTriggerIndex: j, modifiers: F, imageTransformStates: c, getImageTransformKey: x, currentTransformKey: f, currentTransformState: g, rotateLevel: v, scaleLevel: m, imageTransform: Z, setCurrentTransformState: T, updateCurrentTransformState: n, normalizeRotateLevel: h, clampScaleLevel: y, openPreviewAt: _, clickHandler: U, closeHandler: W, rotateRight: B, rotateLeft: k, zoomIn: M, zoomOut: A, isLevelChangedToMin: C, enlargeToNormal: K, shrinkToNormal: V, previousHandler: z, nextHandler: H, keyboardNavigationHandler: N, addKeyboardNavigationListener: R, removeKeyboardNavigationListener: L, enlargeShrinkActionData: J, actions: Q, emit: S, multipleSources: $, showNavigation: X, triggerStyle: Y, getTriggerLabel: (e) => t.alt ? `${t.alt} ${e + 1}` : `Image ${e + 1}`, get NmorphImage() {
+      return ge;
     }, get NmorphButton() {
-      return ae;
+      return ce;
     }, get NmorphIcon() {
-      return te;
-    }, NmorphPreviewPortal: W };
-    return Object.defineProperty(A, "__isScriptSetup", { enumerable: !1, value: !0 }), A;
+      return de;
+    }, NmorphPreviewPortal: oe };
+    return Object.defineProperty(P, "__isScriptSetup", { enumerable: !1, value: !0 }), P;
   }
 });
 export {
-  Ne as default
+  _e as default
 };

package/dist/components/data/nmorph-media-tile/NmorphMediaTile.css

@@ -1 +1 @@
-.nmorph-media-tile{position:relative;display:flex;justify-content:center;align-items:center;aspect-ratio:16/9;min-width:0;overflow:hidden;background:var(--nmorph-main-color);border-radius:var(--default-border-radius);box-shadow:var(--nmorph-shadow-inset)}.nmorph-media-tile .nmorph-media-tile__video{width:100%;height:100%;object-fit:cover}.nmorph-media-tile.nmorph-media-tile--contain .nmorph-media-tile__video{object-fit:contain}.nmorph-media-tile.nmorph-media-tile--mirrored .nmorph-media-tile__video{transform:scaleX(-1)}.nmorph-media-tile .nmorph-media-tile__fallback{display:flex;flex-direction:column;gap:var(--indentation-02);justify-content:center;align-items:center;width:100%;height:100%;padding:var(--indentation-04);color:var(--nmorph-text-color);text-align:center}.nmorph-media-tile .nmorph-media-tile__initials{display:flex;justify-content:center;align-items:center;width:72px;height:72px;color:var(--nmorph-focus-text-color);font-weight:var(--font-weight-bold);font-size:var(--nmorph-typography-title-large-font-size);background:var(--nmorph-accent-color);border-radius:var(--border-radius-circular)}.nmorph-media-tile .nmorph-media-tile__name,.nmorph-media-tile .nmorph-media-tile__error-text{max-width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.nmorph-media-tile .nmorph-media-tile__error-text{color:var(--nmorph-error-text-color);font-size:var(--nmorph-typography-body-small-font-size);line-height:var(--nmorph-typography-body-small-line-height)}.nmorph-media-tile .nmorph-media-tile__status{position:absolute;right:var(--indentation-03);bottom:var(--indentation-03);display:flex;gap:var(--indentation-02)}.nmorph-media-tile .nmorph-media-tile__status-item{color:var(--nmorph-text-color)}.nmorph-media-tile .nmorph-media-tile__status-item .nmorph-button__content{width:28px;min-width:28px;height:24px;min-height:24px;padding:0;color:currentColor;background:color-mix(in srgb,var(--nmorph-main-color) 86%,transparent);border-color:color-mix(in srgb,currentColor 35%,transparent);border-radius:var(--default-border-radius)}.nmorph-media-tile.nmorph-media-tile--selected{outline:2px solid var(--nmorph-accent-color)}.nmorph-media-tile.nmorph-media-tile--speaking{outline:3px solid var(--nmorph-success-color)}.nmorph-media-tile.nmorph-media-tile--error{outline:2px solid var(--nmorph-error-color)}.nmorph-media-tile.nmorph-media-tile--screen-sharing{box-shadow:0 0 0 2px var(--nmorph-success-color)}
+.nmorph-media-tile{position:relative;display:flex;justify-content:center;align-items:center;box-sizing:border-box;min-width:0;overflow:hidden;background:var(--nmorph-main-color);border:none;border-radius:var(--default-border-radius);box-shadow:var(--nmorph-shadow-inset)}.nmorph-media-tile.nmorph-media-tile--video{aspect-ratio:16/9}.nmorph-media-tile.nmorph-media-tile--fill{width:100%;height:100%;aspect-ratio:auto}.nmorph-media-tile .nmorph-media-tile__video{width:100%;height:100%;object-fit:cover}.nmorph-media-tile.nmorph-media-tile--contain .nmorph-media-tile__video{object-fit:contain}.nmorph-media-tile.nmorph-media-tile--mirrored .nmorph-media-tile__video{transform:scaleX(-1)}.nmorph-media-tile .nmorph-media-tile__fallback{display:flex;flex-direction:column;gap:var(--indentation-02);justify-content:center;align-items:center;width:100%;height:100%;padding:var(--indentation-04);color:var(--nmorph-text-color);text-align:center}.nmorph-media-tile .nmorph-media-tile__initials{display:flex;justify-content:center;align-items:center;width:72px;height:72px;color:var(--nmorph-focus-text-color);font-weight:var(--font-weight-bold);font-size:var(--nmorph-typography-title-large-font-size);background:var(--nmorph-accent-color);border-radius:var(--border-radius-circular)}.nmorph-media-tile .nmorph-media-tile__name,.nmorph-media-tile .nmorph-media-tile__error-text{max-width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.nmorph-media-tile .nmorph-media-tile__error-text{color:var(--nmorph-error-text-color);font-size:var(--nmorph-typography-body-small-font-size);line-height:var(--nmorph-typography-body-small-line-height)}.nmorph-media-tile .nmorph-media-tile__status{position:absolute;right:var(--indentation-03);bottom:var(--indentation-03);display:flex;gap:var(--indentation-02)}.nmorph-media-tile .nmorph-media-tile__status-item{color:var(--nmorph-text-color)}.nmorph-media-tile .nmorph-media-tile__status-item .nmorph-button__content{width:28px;min-width:28px;height:24px;min-height:24px;padding:0;color:currentColor;background:color-mix(in srgb,var(--nmorph-main-color) 86%,transparent);border-color:color-mix(in srgb,currentColor 35%,transparent);border-radius:var(--default-border-radius)}.nmorph-media-tile.nmorph-media-tile--selected{outline:2px solid var(--nmorph-accent-color)}.nmorph-media-tile.nmorph-media-tile--speaking{outline:3px solid var(--nmorph-success-color)}.nmorph-media-tile.nmorph-media-tile--error{outline:2px solid var(--nmorph-error-color)}.nmorph-media-tile.nmorph-media-tile--plain{border:var(--nmorph-plain-border);box-shadow:none}.nmorph-media-tile.nmorph-media-tile--screen-sharing{box-shadow:0 0 0 2px var(--nmorph-success-color)}