@nmorph/nmorph-ui-kit 2.2.53 → 2.2.54

package/dist/components/navigation/nmorph-breadcrumb/NmorphBreadcrumb.vue3.js

@@ -0,0 +1,6 @@
+import './NmorphBreadcrumb.css';
+import o from "./NmorphBreadcrumb.vue.js";
+/* empty css                      */
+export {
+  o as default
+};

package/dist/components/navigation/nmorph-breadcrumb/components/nmorph-breadcrumb-item/NmorphBreadcrumbItem.vue.js

@@ -1,36 +1,44 @@
-import n from "./NmorphBreadcrumbItem.vue2.js";
-import { resolveComponent as a, openBlock as o, createElementBlock as c, normalizeClass as l, createBlock as i, Teleport as d, createVNode as s, withCtx as p, renderSlot as b, createCommentVNode as f } from "vue";
-import u from "../../../../../_virtual/_plugin-vue_export-helper.js";
-function _(t, h, r, e, k, v) {
-  const m = a("router-link");
-  return e.isMounted && e.itemId ? (o(), c(
-    "div",
-    {
-      key: 0,
-      class: l(e.modifiers)
-    },
-    [
-      (o(), i(d, {
-        to: `#nmorph-breadcrumb-${e.breadcrumbData?.breadcrumbId}-${e.itemId}-element`
+import { defineComponent as s, computed as d, inject as i, ref as p, onMounted as f, resolveComponent as b, unref as r, openBlock as n, createElementBlock as h, normalizeClass as k, createBlock as v, Teleport as B, createVNode as C, withCtx as _, renderSlot as I, createCommentVNode as M } from "vue";
+import { useModifiers as N } from "../../../../../utils/create-modifiers.js";
+import { generateUUID as $ } from "../../../../../utils/common.js";
+const U = /* @__PURE__ */ s({
+  __name: "NmorphBreadcrumbItem",
+  props: {
+    to: { default: "" },
+    replace: { type: Boolean, default: !1 }
+  },
+  setup(e) {
+    const c = e, l = d(
+      () => N({
+        "nmorph-breadcrumb-item": []
+      })
+    ), o = i("breadcrumb-data"), a = p(!1), t = $();
+    return f(() => {
+      a.value = !0;
+    }), o.breadcrumbs.value.push({ ...c, itemId: t }), (m, g) => {
+      const u = b("router-link");
+      return a.value && r(t) ? (n(), h("div", {
+        key: 0,
+        class: k(l.value)
       }, [
-        s(m, {
-          to: r.to,
-          replace: r.replace,
-          class: "fill-height"
-        }, {
-          default: p(() => [
-            b(t.$slots, "default")
-          ]),
-          _: 3
-          /* FORWARDED */
-        }, 8, ["to", "replace"])
-      ], 8, ["to"]))
-    ],
-    2
-    /* CLASS */
-  )) : f("v-if", !0);
-}
-const N = /* @__PURE__ */ u(n, [["render", _], ["__file", "/builds/ketjo/nmorph/library/src/components/navigation/nmorph-breadcrumb/components/nmorph-breadcrumb-item/NmorphBreadcrumbItem.vue"]]);
+        (n(), v(B, {
+          to: `#nmorph-breadcrumb-${r(o)?.breadcrumbId}-${r(t)}-element`
+        }, [
+          C(u, {
+            to: e.to,
+            replace: e.replace,
+            class: "fill-height"
+          }, {
+            default: _(() => [
+              I(m.$slots, "default")
+            ]),
+            _: 3
+          }, 8, ["to", "replace"])
+        ], 8, ["to"]))
+      ], 2)) : M("", !0);
+    };
+  }
+});
 export {
-  N as default
+  U as default
 };

package/dist/components/navigation/nmorph-breadcrumb/components/nmorph-breadcrumb-item/NmorphBreadcrumbItem.vue2.js

@@ -1,26 +1,4 @@
-import { defineComponent as m, computed as p, inject as d, ref as c, onMounted as i } from "vue";
-import { useModifiers as f } from "../../../../../utils/create-modifiers.js";
-import { generateUUID as l } from "../../../../../utils/common.js";
-const j = /* @__PURE__ */ m({
-  __name: "NmorphBreadcrumbItem",
-  props: {
-    to: { type: [String, Object], required: !1, default: "" },
-    replace: { type: Boolean, required: !1, default: !1 }
-  },
-  setup(s, { expose: u }) {
-    u();
-    const e = s, n = p(
-      () => f({
-        "nmorph-breadcrumb-item": []
-      })
-    ), r = d("breadcrumb-data"), t = c(!1), o = l();
-    i(() => {
-      t.value = !0;
-    }), r.breadcrumbs.value.push({ ...e, itemId: o });
-    const a = { props: e, modifiers: n, breadcrumbData: r, isMounted: t, itemId: o };
-    return Object.defineProperty(a, "__isScriptSetup", { enumerable: !1, value: !0 }), a;
-  }
-});
+import f from "./NmorphBreadcrumbItem.vue.js";
 export {
-  j as default
+  f as default
 };

package/dist/components/navigation/nmorph-context-menu/NmorphContextMenu.vue.js

@@ -1,186 +1,274 @@
 import './NmorphContextMenu.css';
-import k from "./NmorphContextMenu.vue2.js";
-import { openBlock as o, createElementBlock as t, renderSlot as l, createBlock as i, withCtx as m, Fragment as h, renderList as x, normalizeStyle as _, resolveDynamicComponent as p, mergeProps as f, createCommentVNode as a, createElementVNode as y, toDisplayString as d, normalizeClass as b } from "vue";
-/* empty css                       */
-import v from "../../../_virtual/_plugin-vue_export-helper.js";
-const w = {
+import { defineComponent as de, ref as s, computed as c, markRaw as R, toRaw as I, watch as V, onBeforeUnmount as me, openBlock as o, createElementBlock as r, renderSlot as v, createBlock as w, withCtx as X, Fragment as Y, renderList as fe, normalizeStyle as z, unref as pe, resolveDynamicComponent as W, mergeProps as K, createCommentVNode as k, createElementVNode as A, toDisplayString as x, normalizeClass as he } from "vue";
+import ye from "../nmorph-dropdown/NmorphDropdown.vue.js";
+/* empty css                                     */
+import _e from "../../basic/nmorph-icon/NmorphIcon.vue.js";
+/* empty css                                      */
+const ge = {
   key: 0,
   class: "nmorph-context-menu__options"
-}, C = ["disabled", "onClick"], u = { class: "nmorph-context-menu__item-copy" }, H = { class: "nmorph-context-menu__item-label" }, O = {
+}, be = ["disabled", "onClick"], ve = { class: "nmorph-context-menu__item-copy" }, we = { class: "nmorph-context-menu__item-label" }, ke = {
   key: 0,
   class: "nmorph-context-menu__item-description"
-}, E = {
+}, xe = {
   key: 1,
   class: "nmorph-context-menu__item-shortcut"
-}, g = ["tabindex", "aria-disabled", "onClick", "onKeydown"], P = {
+}, Ce = ["tabindex", "aria-disabled", "onClick", "onKeydown"], Oe = {
   key: 2,
   class: "nmorph-context-menu__divider",
   role: "separator"
-}, z = {
+}, Ee = {
   key: 3,
   class: "nmorph-context-menu__section",
   role: "presentation"
-};
-function N(r, S, D, e, K, M) {
-  return o(), t(
-    "div",
-    {
-      ref: "triggerDOMRef",
+}, Pe = 600, F = 8, De = /* @__PURE__ */ de({
+  __name: "NmorphContextMenu",
+  props: {
+    modelValue: { type: [Boolean, null], default: null },
+    options: { default: () => [] },
+    trigger: { default: "contextmenu" },
+    placement: { default: "bottom-start" },
+    width: { default: "max-content" },
+    minWidth: { default: void 0 },
+    maxWidth: { default: void 0 },
+    xOffset: { default: 0 },
+    yOffset: { default: 0 },
+    fillWidth: { type: Boolean, default: !1 },
+    zIndex: { default: void 0 },
+    closeOnEscape: { type: Boolean, default: !0 },
+    trapFocus: { type: Boolean, default: !1 },
+    disabled: { type: Boolean, default: !1 },
+    closeOnScroll: { type: Boolean, default: !0 },
+    role: { default: "menu" },
+    ariaLabel: { default: "" },
+    hideShadow: { type: Boolean, default: !1 },
+    mobileMode: { default: "dropdown" }
+  },
+  emits: ["update:model-value", "open", "close", "select", "on-outside-click", "on-escape-keydown"],
+  setup(G, { expose: j, emit: J }) {
+    const n = G, a = J, f = s(null), p = s(null), C = s("point"), O = s(!!n.modelValue), u = s(null), h = s(null), d = s(null), E = s(!1), y = s(null), _ = c(() => typeof n.modelValue == "boolean" ? n.modelValue : O.value), U = c(() => n.options.length > 0), q = c(() => n.trigger === "longpress"), N = c(() => n.trigger === "contextmenu" || n.trigger === "both"), Q = c(
+      () => n.options.map((e, l) => typeof e == "string" || typeof e == "number" ? {
+        key: `${e}-${l}`,
+        type: "item",
+        label: e,
+        value: e,
+        disabled: !1,
+        closeOnClick: !0,
+        raw: e
+      } : {
+        key: `${String(e.value ?? e.label ?? l)}-${l}`,
+        type: e.type ?? "item",
+        label: e.label,
+        value: e.value ?? e.label ?? l,
+        icon: e.icon ? R(I(e.icon)) : void 0,
+        iconProps: e.iconProps,
+        shortcut: e.shortcut,
+        description: e.description,
+        component: e.component ? R(I(e.component)) : void 0,
+        componentProps: e.componentProps,
+        disabled: !!e.disabled,
+        color: e.color,
+        closeOnClick: e.closeOnClick ?? !0,
+        raw: e
+      })
+    ), Z = c(
+      () => [
+        "nmorph-context-menu__dropdown",
+        n.mobileMode === "bottom-sheet" && "nmorph-context-menu__dropdown--bottom-sheet"
+      ].filter(Boolean).join(" ")
+    );
+    V(
+      () => n.modelValue,
+      (e) => {
+        typeof e == "boolean" && (O.value = e);
+      }
+    );
+    const ee = (e, l) => ({
+      clientWidth: 0,
+      getBoundingClientRect: () => ({
+        x: e,
+        y: l,
+        width: 0,
+        height: 0,
+        top: l,
+        left: e,
+        right: e,
+        bottom: l,
+        toJSON: () => ({})
+      })
+    }), P = (e) => {
+      const l = _.value;
+      O.value = e, a("update:model-value", e), l && !e && a("close");
+    }, i = () => {
+      P(!1);
+    }, g = (e, l, t) => {
+      n.disabled || (C.value = "point", p.value = ee(e, l), P(!0), a("open", t));
+    }, T = (e, l) => {
+      n.disabled || (C.value = "element", p.value = e, P(!0), a("open", l));
+    }, te = (e) => {
+      if (!n.disabled) {
+        if (n.trigger === "longpress") {
+          e.preventDefault();
+          return;
+        }
+        N.value && (e.preventDefault(), g(e.clientX, e.clientY, e));
+      }
+    }, ne = (e) => {
+      const l = f.value;
+      if (!l) return !1;
+      if (e.target instanceof Node && l.contains(e.target)) return !0;
+      const t = l.getBoundingClientRect();
+      return e.clientX >= t.left && e.clientX <= t.right && e.clientY >= t.top && e.clientY <= t.bottom;
+    }, S = (e) => {
+      !_.value || n.disabled || !N.value || ne(e) && (e.preventDefault(), e.stopPropagation(), g(e.clientX, e.clientY, e));
+    }, le = (e) => {
+      if (E.value) {
+        b(), e.preventDefault();
+        return;
+      }
+      if (n.disabled || n.trigger !== "click" && n.trigger !== "both" || e.button !== 0) return;
+      const l = e.currentTarget instanceof HTMLElement ? e.currentTarget : f.value;
+      l && T(l, e);
+    }, oe = (e) => {
+      if (n.disabled || n.trigger === "manual" || e.key !== "ContextMenu" && !(e.shiftKey && e.key === "F10"))
+        return;
+      const l = e.target instanceof HTMLElement ? e.target : f.value;
+      l && (e.preventDefault(), T(l, e));
+    }, re = () => {
+      a("on-outside-click"), i();
+    }, se = () => {
+      a("on-escape-keydown"), i();
+    }, L = (e, l) => {
+      e.disabled || (a("select", e.raw, l), e.closeOnClick && i());
+    }, ae = (e, l, t) => {
+      e.key !== "Enter" && e.key !== " " || (e.preventDefault(), L(l, t));
+    }, m = () => {
+      u.value && clearTimeout(u.value), u.value = null, h.value = null, d.value = null;
+    }, b = () => {
+      y.value && clearTimeout(y.value), E.value = !1, y.value = null;
+    }, ie = () => {
+      b(), E.value = !0, y.value = setTimeout(b, 700);
+    }, ce = (e) => {
+      n.disabled || !q.value || e.pointerType !== "touch" && e.pointerType !== "pen" || (m(), h.value = e.pointerId, d.value = { x: e.clientX, y: e.clientY }, u.value = setTimeout(() => {
+        ie(), m(), g(e.clientX, e.clientY, e);
+      }, Pe));
+    }, ue = (e) => {
+      if (!u.value || h.value !== e.pointerId || !d.value) return;
+      const l = Math.abs(e.clientX - d.value.x), t = Math.abs(e.clientY - d.value.y);
+      (l > F || t > F) && m();
+    }, B = (e) => {
+      h.value === e.pointerId && m();
+    }, $ = (e) => ({
+      "--nmorph-context-menu-item-color": e.color
+    }), M = () => {
+      n.closeOnScroll && C.value === "point" && i();
+    };
+    return V(
+      _,
+      (e) => {
+        typeof window > "u" || (e ? (window.addEventListener("scroll", M, { passive: !0, capture: !0 }), document.addEventListener("contextmenu", S, !0)) : (window.removeEventListener("scroll", M, !0), document.removeEventListener("contextmenu", S, !0)));
+      },
+      { immediate: !0 }
+    ), me(() => {
+      typeof window < "u" && window.removeEventListener("scroll", M, !0), typeof document < "u" && document.removeEventListener("contextmenu", S, !0), m(), b();
+    }), j({ close: i, openAt: g, openAtElement: T }), (e, l) => (o(), r("div", {
+      ref_key: "triggerDOMRef",
+      ref: f,
       class: "nmorph-context-menu",
-      onClick: e.clickHandler,
-      onContextmenu: e.contextMenuHandler,
-      onKeydown: e.keydownHandler,
-      onPointerdown: e.pointerDownHandler,
-      onPointermove: e.pointerMoveHandler,
-      onPointerup: e.pointerEndHandler,
-      onPointercancel: e.pointerEndHandler,
-      onPointerleave: e.pointerEndHandler
-    },
-    [
-      l(r.$slots, "default"),
-      e.relativeElement ? (o(), i(e.NmorphDropdown, {
+      onClick: le,
+      onContextmenu: te,
+      onKeydown: oe,
+      onPointerdown: ce,
+      onPointermove: ue,
+      onPointerup: B,
+      onPointercancel: B,
+      onPointerleave: B
+    }, [
+      v(e.$slots, "default"),
+      p.value ? (o(), w(ye, {
         key: 0,
-        open: e.isOpen,
-        "relative-element": e.relativeElement,
-        placement: e.props.placement,
-        width: e.props.width,
-        "min-width": e.props.minWidth,
-        "max-width": e.props.maxWidth,
-        "x-offset": e.props.xOffset,
-        "y-offset": e.props.yOffset,
-        "fill-width": e.props.fillWidth,
-        "z-index": e.props.zIndex,
-        "close-on-escape": e.props.closeOnEscape,
-        "trap-focus": e.props.trapFocus,
-        role: e.props.role,
-        "aria-label": e.props.ariaLabel,
-        "hide-shadow": e.props.hideShadow,
-        "content-class": e.dropdownContentClass,
-        onOnOutsideClick: e.outsideClickHandler,
-        onOnEscapeKeydown: e.escapeHandler
+        open: _.value,
+        "relative-element": p.value,
+        placement: n.placement,
+        width: n.width,
+        "min-width": n.minWidth,
+        "max-width": n.maxWidth,
+        "x-offset": n.xOffset,
+        "y-offset": n.yOffset,
+        "fill-width": n.fillWidth,
+        "z-index": n.zIndex,
+        "close-on-escape": n.closeOnEscape,
+        "trap-focus": n.trapFocus,
+        role: n.role,
+        "aria-label": n.ariaLabel,
+        "hide-shadow": n.hideShadow,
+        "content-class": Z.value,
+        onOnOutsideClick: re,
+        onOnEscapeKeydown: se
       }, {
-        default: m(() => [
-          e.hasOptions ? (o(), t("div", w, [
-            (o(!0), t(
-              h,
-              null,
-              x(e.normalizedOptions, (n, s) => (o(), t(
-                h,
-                {
-                  key: n.key
-                },
-                [
-                  n.type === "item" && !n.component ? (o(), t("button", {
+        default: X(() => [
+          U.value ? (o(), r("div", ge, [
+            (o(!0), r(Y, null, fe(Q.value, (t, D) => (o(), r(Y, {
+              key: t.key
+            }, [
+              t.type === "item" && !t.component ? (o(), r("button", {
+                key: 0,
+                type: "button",
+                class: "nmorph-context-menu__item",
+                role: "menuitem",
+                disabled: t.disabled,
+                style: z($(t)),
+                onClick: (H) => L(t, D)
+              }, [
+                v(e.$slots, "item", {
+                  option: t,
+                  active: !1,
+                  disabled: t.disabled
+                }, () => [
+                  t.icon ? (o(), w(pe(_e), {
                     key: 0,
-                    type: "button",
-                    class: "nmorph-context-menu__item",
-                    role: "menuitem",
-                    disabled: n.disabled,
-                    style: _(e.getOptionStyle(n)),
-                    onClick: (c) => e.optionClickHandler(n, s)
-                  }, [
-                    l(r.$slots, "item", {
-                      option: n,
-                      active: !1,
-                      disabled: n.disabled
-                    }, () => [
-                      n.icon ? (o(), i(
-                        e.NmorphIcon,
-                        {
-                          key: 0,
-                          class: "nmorph-context-menu__item-icon"
-                        },
-                        {
-                          default: m(() => [
-                            (o(), i(
-                              p(n.icon),
-                              f({ ref_for: !0 }, n.iconProps),
-                              null,
-                              16
-                              /* FULL_PROPS */
-                            ))
-                          ]),
-                          _: 2
-                          /* DYNAMIC */
-                        },
-                        1024
-                        /* DYNAMIC_SLOTS */
-                      )) : a("v-if", !0),
-                      y("span", u, [
-                        y(
-                          "span",
-                          H,
-                          d(n.label),
-                          1
-                          /* TEXT */
-                        ),
-                        n.description ? (o(), t(
-                          "span",
-                          O,
-                          d(n.description),
-                          1
-                          /* TEXT */
-                        )) : a("v-if", !0)
-                      ]),
-                      n.shortcut ? (o(), t(
-                        "span",
-                        E,
-                        d(n.shortcut),
-                        1
-                        /* TEXT */
-                      )) : a("v-if", !0)
-                    ])
-                  ], 12, C)) : n.type === "item" ? (o(), t("div", {
-                    key: 1,
-                    class: b(["nmorph-context-menu__item", { "nmorph-context-menu__item--disabled": n.disabled }]),
-                    role: "menuitem",
-                    tabindex: n.disabled ? -1 : 0,
-                    "aria-disabled": n.disabled,
-                    style: _(e.getOptionStyle(n)),
-                    onClick: (c) => e.optionClickHandler(n, s),
-                    onKeydown: (c) => e.optionKeydownHandler(c, n, s)
-                  }, [
-                    l(r.$slots, "item", {
-                      option: n,
-                      active: !1,
-                      disabled: n.disabled
-                    }, () => [
-                      (o(), i(
-                        p(n.component),
-                        f({ ref_for: !0 }, n.componentProps),
-                        null,
-                        16
-                        /* FULL_PROPS */
-                      ))
-                    ])
-                  ], 46, g)) : n.type === "divider" ? (o(), t("div", P)) : (o(), t(
-                    "div",
-                    z,
-                    d(n.label),
-                    1
-                    /* TEXT */
-                  ))
-                ],
-                64
-                /* STABLE_FRAGMENT */
-              ))),
-              128
-              /* KEYED_FRAGMENT */
-            ))
-          ])) : l(r.$slots, "menu", {
+                    class: "nmorph-context-menu__item-icon"
+                  }, {
+                    default: X(() => [
+                      (o(), w(W(t.icon), K({ ref_for: !0 }, t.iconProps), null, 16))
+                    ]),
+                    _: 2
+                  }, 1024)) : k("", !0),
+                  A("span", ve, [
+                    A("span", we, x(t.label), 1),
+                    t.description ? (o(), r("span", ke, x(t.description), 1)) : k("", !0)
+                  ]),
+                  t.shortcut ? (o(), r("span", xe, x(t.shortcut), 1)) : k("", !0)
+                ])
+              ], 12, be)) : t.type === "item" ? (o(), r("div", {
+                key: 1,
+                class: he(["nmorph-context-menu__item", { "nmorph-context-menu__item--disabled": t.disabled }]),
+                role: "menuitem",
+                tabindex: t.disabled ? -1 : 0,
+                "aria-disabled": t.disabled,
+                style: z($(t)),
+                onClick: (H) => L(t, D),
+                onKeydown: (H) => ae(H, t, D)
+              }, [
+                v(e.$slots, "item", {
+                  option: t,
+                  active: !1,
+                  disabled: t.disabled
+                }, () => [
+                  (o(), w(W(t.component), K({ ref_for: !0 }, t.componentProps), null, 16))
+                ])
+              ], 46, Ce)) : t.type === "divider" ? (o(), r("div", Oe)) : (o(), r("div", Ee, x(t.label), 1))
+            ], 64))), 128))
+          ])) : v(e.$slots, "menu", {
             key: 1,
-            close: e.close
+            close: i
           })
         ]),
         _: 3
-        /* FORWARDED */
-      }, 8, ["open", "relative-element", "placement", "width", "min-width", "max-width", "x-offset", "y-offset", "fill-width", "z-index", "close-on-escape", "trap-focus", "role", "aria-label", "hide-shadow", "content-class"])) : a("v-if", !0)
-    ],
-    544
-    /* NEED_HYDRATION, NEED_PATCH */
-  );
-}
-const L = /* @__PURE__ */ v(k, [["render", N], ["__file", "/builds/ketjo/nmorph/library/src/components/navigation/nmorph-context-menu/NmorphContextMenu.vue"]]);
+      }, 8, ["open", "relative-element", "placement", "width", "min-width", "max-width", "x-offset", "y-offset", "fill-width", "z-index", "close-on-escape", "trap-focus", "role", "aria-label", "hide-shadow", "content-class"])) : k("", !0)
+    ], 544));
+  }
+});
 export {
-  L as default
+  De as default
 };

package/dist/components/navigation/nmorph-context-menu/NmorphContextMenu.vue3.js

@@ -0,0 +1,6 @@
+import './NmorphContextMenu.css';
+import o from "./NmorphContextMenu.vue.js";
+/* empty css                       */
+export {
+  o as default
+};