@nmorph/nmorph-ui-kit 2.2.34 → 2.2.36

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

@@ -1,13 +1,13 @@
 import './NmorphContextMenu.css';
 import s from "./NmorphContextMenu.vue2.js";
-import { openBlock as o, createElementBlock as l, renderSlot as i, createBlock as d, withCtx as p, Fragment as c, renderList as f, normalizeStyle as m, createElementVNode as h, toDisplayString as _, normalizeClass as y, resolveDynamicComponent as x, mergeProps as k, createCommentVNode as b } from "vue";
+import { openBlock as o, createElementBlock as l, renderSlot as i, createBlock as d, withCtx as p, Fragment as c, renderList as h, normalizeStyle as m, createElementVNode as f, toDisplayString as _, normalizeClass as y, resolveDynamicComponent as x, mergeProps as k, createCommentVNode as w } from "vue";
 /* empty css                       */
-import w from "../../../_virtual/_plugin-vue_export-helper.js";
+import b from "../../../_virtual/_plugin-vue_export-helper.js";
 const C = {
   key: 0,
   class: "nmorph-context-menu__options"
 }, v = ["disabled", "onClick"], O = { class: "nmorph-context-menu__item-label" }, g = ["tabindex", "aria-disabled", "onClick", "onKeydown"];
-function H(a, u, z, e, E, K) {
+function H(a, u, z, e, E, S) {
   return o(), l(
     "div",
     {
@@ -35,6 +35,7 @@ function H(a, u, z, e, E, K) {
         "trap-focus": e.props.trapFocus,
         role: e.props.role,
         "aria-label": e.props.ariaLabel,
+        "hide-shadow": e.props.hideShadow,
         "content-class": "nmorph-context-menu__dropdown",
         onOnOutsideClick: e.outsideClickHandler,
         onOnEscapeKeydown: e.escapeHandler
@@ -44,7 +45,7 @@ function H(a, u, z, e, E, K) {
             (o(!0), l(
               c,
               null,
-              f(e.normalizedOptions, (n, t) => (o(), l(
+              h(e.normalizedOptions, (n, r) => (o(), l(
                 c,
                 {
                   key: n.key
@@ -57,8 +58,8 @@ function H(a, u, z, e, E, K) {
                     tabindex: n.disabled ? -1 : 0,
                     "aria-disabled": n.disabled,
                     style: m(e.getOptionStyle(n)),
-                    onClick: (r) => e.optionClickHandler(n, t),
-                    onKeydown: (r) => e.optionKeydownHandler(r, n, t)
+                    onClick: (t) => e.optionClickHandler(n, r),
+                    onKeydown: (t) => e.optionKeydownHandler(t, n, r)
                   }, [
                     (o(), d(
                       x(n.component),
@@ -74,9 +75,9 @@ function H(a, u, z, e, E, K) {
                     role: "menuitem",
                     disabled: n.disabled,
                     style: m(e.getOptionStyle(n)),
-                    onClick: (r) => e.optionClickHandler(n, t)
+                    onClick: (t) => e.optionClickHandler(n, r)
                   }, [
-                    h(
+                    f(
                       "span",
                       O,
                       _(n.label),
@@ -98,13 +99,13 @@ function H(a, u, z, e, E, K) {
         ]),
         _: 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"])) : b("v-if", !0)
+      }, 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"])) : w("v-if", !0)
     ],
     544
     /* NEED_HYDRATION, NEED_PATCH */
   );
 }
-const B = /* @__PURE__ */ w(s, [["render", H], ["__file", "/builds/ketjo/nmorph/library/src/components/navigation/nmorph-context-menu/NmorphContextMenu.vue"]]);
+const B = /* @__PURE__ */ b(s, [["render", H], ["__file", "/builds/ketjo/nmorph/library/src/components/navigation/nmorph-context-menu/NmorphContextMenu.vue"]]);
 export {
   B as default
 };

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

@@ -1,5 +1,5 @@
 import './NmorphContextMenu.css';
-import { defineComponent as L, ref as i, computed as y, markRaw as M, toRaw as D, watch as h, onBeforeUnmount as V } from "vue";
+import { defineComponent as L, ref as i, computed as y, markRaw as M, toRaw as D, watch as k, onBeforeUnmount as V } from "vue";
 import P from "../nmorph-dropdown/NmorphDropdown.vue.js";
 const $ = /* @__PURE__ */ L({
   __name: "NmorphContextMenu",
@@ -20,11 +20,12 @@ const $ = /* @__PURE__ */ L({
     disabled: { type: Boolean, required: !1, default: !1 },
     closeOnScroll: { type: Boolean, required: !1, default: !0 },
     role: { type: String, required: !1, default: "menu" },
-    ariaLabel: { type: String, required: !1, default: "" }
+    ariaLabel: { type: String, required: !1, default: "" },
+    hideShadow: { type: Boolean, required: !1, default: !1 }
   },
   emits: ["update:model-value", "open", "close", "select", "on-outside-click", "on-escape-keydown"],
-  setup(O, { expose: q, emit: v }) {
-    const l = O, r = v, d = i(null), c = i(null), o = i("point"), a = i(!!l.modelValue), f = y(() => typeof l.modelValue == "boolean" ? l.modelValue : a.value), S = y(() => l.options.length > 0), B = y(
+  setup(q, { expose: O, emit: v }) {
+    const l = q, r = v, d = i(null), c = i(null), o = i("point"), a = i(!!l.modelValue), f = y(() => typeof l.modelValue == "boolean" ? l.modelValue : a.value), S = y(() => l.options.length > 0), B = y(
       () => l.options.map((e, t) => typeof e == "string" || typeof e == "number" ? {
         key: `${e}-${t}`,
         label: e,
@@ -44,7 +45,7 @@ const $ = /* @__PURE__ */ L({
         raw: e
       })
     );
-    h(
+    k(
       () => l.modelValue,
       (e) => {
         typeof e == "boolean" && (a.value = e);
@@ -95,7 +96,7 @@ const $ = /* @__PURE__ */ L({
     }), s = () => {
       l.closeOnScroll && o.value === "point" && n();
     };
-    h(
+    k(
       f,
       (e) => {
         typeof window > "u" || (e ? window.addEventListener("scroll", s, { passive: !0, capture: !0 }) : window.removeEventListener("scroll", s, !0));
@@ -103,9 +104,9 @@ const $ = /* @__PURE__ */ L({
       { immediate: !0 }
     ), V(() => {
       typeof window < "u" && window.removeEventListener("scroll", s, !0);
-    }), q({ close: n });
-    const k = { props: l, emit: r, triggerDOMRef: d, relativeElement: c, anchorType: o, openState: a, isOpen: f, hasOptions: S, normalizedOptions: B, createPointElement: g, setOpen: u, close: n, openAt: b, openAtElement: p, contextMenuHandler: C, clickHandler: E, keydownHandler: H, outsideClickHandler: _, escapeHandler: N, optionClickHandler: w, optionKeydownHandler: x, getOptionStyle: T, scrollHandler: s, NmorphDropdown: P };
-    return Object.defineProperty(k, "__isScriptSetup", { enumerable: !1, value: !0 }), k;
+    }), O({ close: n });
+    const h = { props: l, emit: r, triggerDOMRef: d, relativeElement: c, anchorType: o, openState: a, isOpen: f, hasOptions: S, normalizedOptions: B, createPointElement: g, setOpen: u, close: n, openAt: b, openAtElement: p, contextMenuHandler: C, clickHandler: E, keydownHandler: H, outsideClickHandler: _, escapeHandler: N, optionClickHandler: w, optionKeydownHandler: x, getOptionStyle: T, scrollHandler: s, NmorphDropdown: P };
+    return Object.defineProperty(h, "__isScriptSetup", { enumerable: !1, value: !0 }), h;
   }
 });
 export {

package/dist/components/navigation/nmorph-dropdown/NmorphDropdown.css

@@ -1 +1 @@
-.nmorph-dropdown{position:fixed;width:var(--nmorph-dropdown-width);min-width:var(--nmorph-dropdown-min-width);max-width:var(--nmorph-dropdown-max-width);background:var(--nmorph-main-color);border-radius:var(--default-border-radius);box-shadow:var(--nmorph-shadow-outset)}.nmorph-dropdown--closed{z-index:-1000;opacity:0}
+.nmorph-dropdown{position:fixed;width:var(--nmorph-dropdown-width);min-width:var(--nmorph-dropdown-min-width);max-width:var(--nmorph-dropdown-max-width);background:var(--nmorph-main-color);border-radius:var(--default-border-radius);box-shadow:var(--nmorph-shadow-outset)}.nmorph-dropdown--closed{z-index:-1000;opacity:0}.nmorph-dropdown--hide-shadow{box-shadow:none}

package/dist/components/navigation/nmorph-dropdown/NmorphDropdown.vue2.js

@@ -1,9 +1,9 @@
 import './NmorphDropdown.css';
-import { defineComponent as q, ref as w, toRef as r, computed as i, watch as b } from "vue";
+import { defineComponent as w, ref as q, toRef as r, computed as n, watch as b } from "vue";
 import { useModifiers as v } from "../../../utils/create-modifiers.js";
 import { usePlacement as x } from "../../../hooks/use-placement.js";
 import O from "../../others/nmorph-overlay/NmorphOverlay.vue.js";
-const k = /* @__PURE__ */ q({
+const k = /* @__PURE__ */ w({
   __name: "NmorphDropdown",
   props: {
     open: { type: Boolean, required: !0 },
@@ -21,30 +21,31 @@ const k = /* @__PURE__ */ q({
     restoreFocus: { type: Boolean, required: !1, default: !0 },
     role: { type: String, required: !1, default: "listbox" },
     ariaLabel: { type: String, required: !1, default: "" },
-    contentClass: { type: String, required: !1, default: "" }
+    contentClass: { type: String, required: !1, default: "" },
+    hideShadow: { type: Boolean, required: !1, default: !1 }
   },
   emits: ["on-outside-click", "on-escape-keydown"],
   setup(f, { expose: m, emit: c }) {
     m();
-    const e = f, l = c, d = w(null), { placementCoords: n, placementReady: a, adjustPlacement: s } = x({
+    const e = f, l = c, i = q(null), { placementCoords: d, placementReady: a, adjustPlacement: s } = x({
       initialPlacement: r(e, "placement"),
-      contentDOMElement: d,
+      contentDOMElement: i,
       relativeElement: r(e, "relativeElement"),
       yOffset: r(e, "yOffset"),
       xOffset: r(e, "xOffset"),
       enabled: r(e, "open")
-    }), y = i(
+    }), y = n(
       () => v({
-        "nmorph-dropdown": [`${!e.open && "closed"}`]
+        "nmorph-dropdown": [`${!e.open && "closed"}`, `${e.hideShadow && "hide-shadow"}`]
       })
-    ), o = (t) => typeof t == "number" ? `${t}px` : t, u = i(
+    ), o = (t) => typeof t == "number" ? `${t}px` : t, u = n(
       () => e.fillWidth && e.relativeElement ? `${e.relativeElement.clientWidth}px` : o(e.width)
-    ), h = i(() => ({
+    ), h = n(() => ({
       "--nmorph-dropdown-width": u.value,
       "--nmorph-dropdown-min-width": o(e.minWidth) || "auto",
       "--nmorph-dropdown-max-width": o(e.maxWidth) || "none",
-      left: n.value.x,
-      top: n.value.y,
+      left: d.value.x,
+      top: d.value.y,
       visibility: e.open && a.value ? "visible" : "hidden"
     }));
     b(
@@ -54,7 +55,7 @@ const k = /* @__PURE__ */ q({
       },
       { flush: "post" }
     );
-    const p = { props: e, emit: l, dropdownDOMRef: d, placementCoords: n, placementReady: a, adjustPlacement: s, modifiers: y, getCssSize: o, width: u, dropdownStyle: h, outsideClickHandler: () => {
+    const p = { props: e, emit: l, dropdownDOMRef: i, placementCoords: d, placementReady: a, adjustPlacement: s, modifiers: y, getCssSize: o, width: u, dropdownStyle: h, outsideClickHandler: () => {
       l("on-outside-click");
     }, escapeHandler: () => {
       l("on-escape-keydown");

package/dist/hooks/use-common-styles.js

@@ -52,6 +52,7 @@ const u = {
       --indentation-02: 4px;
       --indentation-03: 8px;
       --indentation-04: 16px;
+      --indentation-05: 24px;
 
       --base-shadow-blur: calc(var(--base-shadow-width) * var(--base-shadow-blur-coefficient));
       --nmorph-shadow-outset:
@@ -350,7 +351,7 @@ const u = {
     }
 
     .nmorph-avatar__initials {
-      color: var(--nmorph-accent-color);
+      color: var(--nmorph-text-color);
       font-weight: 600;
       line-height: 1;
     }