@nmorph/nmorph-ui-kit 2.2.16 → 2.2.17

package/dist/nuxt.mjs

@@ -48,11 +48,15 @@ const mergeMessages = (base, overrides = {}) => {
   return result
 }
 
-export default defineNuxtPlugin((nuxtApp) => {
+export default defineNuxtPlugin({
+  name: 'nmorph',
+  enforce: 'post',
+  setup(nuxtApp) {
   const pluginOptions = { ...options }
   const i18nOptions = { ...(pluginOptions.i18n || {}) }
   const messages = mergeMessages(libraryMessages, i18nOptions.messages)
-  const i18n = nuxtApp.$i18n
+  const vueI18nGlobal = nuxtApp.vueApp.__VUE_I18N__?.global
+  const i18n = nuxtApp.$i18n?.mergeLocaleMessage ? nuxtApp.$i18n : vueI18nGlobal
 
 	  if (import.meta.server) {
 	    useHead({
@@ -85,6 +89,7 @@ export default defineNuxtPlugin((nuxtApp) => {
 
   pluginOptions.i18n = i18nOptions
   nuxtApp.vueApp.use(NmorphLibrary, pluginOptions)
+  }
 })
 `
     });

package/dist/outside-hooks/use-nmorph-theme.js

@@ -1,7 +1,7 @@
-import { ref as A, readonly as H } from "vue";
-import _ from "../package.json.js";
+import { ref as H, readonly as _ } from "vue";
+import w from "../package.json.js";
 import { nmorphLog as I } from "../outside-utils/index.js";
-import { camelToKebab as b } from "../utils/case-transformers.js";
+import { camelToKebab as E } from "../utils/case-transformers.js";
 const $ = {
   info: "#d4e5edbb",
   infoText: "#506c80",
@@ -26,7 +26,7 @@ const $ = {
   placeholderText: "#c1c9cf",
   semiContrastText: "#8a9dc0",
   contrastText: "#b4c4de"
-}, w = {
+}, F = {
   darkShade: "#0f1112",
   main: "#1c1f21",
   lightShade: "#292d30",
@@ -37,11 +37,11 @@ const $ = {
   placeholderText: "#575757",
   semiContrastText: "#9caab0",
   contrastText: "#c3cdd1"
-}, C = "nmorph-data-theme", R = "dark", S = {
+}, T = "nmorph-data-theme", R = "dark", C = {
   themes: {
     common: $,
     light: V,
-    dark: w
+    dark: F
   },
   defaultTheme: R,
   saveCurrentThemeToLS: !0,
@@ -51,143 +51,142 @@ const $ = {
     baseShadowWidth: "3.5px",
     baseShadowBlurCoefficient: "2"
   }
-}, F = (t) => /^#[0-9A-Fa-f]{6}$/.test(t), v = (t) => {
-  if (!F(t)) throw new Error(`Invalid hex color: ${t}`);
-  return t;
-}, L = (t, e) => {
+}, U = (r) => /^#[0-9A-Fa-f]{6}$/.test(r), L = (r) => {
+  if (!U(r)) throw new Error(`Invalid hex color: ${r}`);
+  return r;
+}, A = (r, e) => {
   const n = {};
-  return t.forEach(({ name: o, color: s }) => {
-    n[o] = s;
-  }), e.forEach(({ name: o, color: s }) => {
-    n[o] = s;
-  }), Object.entries(n).map(([o, s]) => ({ name: o, color: s }));
-}, E = (t, e) => {
-  let n = parseInt(t.substring(1, 3), 16), o = parseInt(t.substring(3, 5), 16), s = parseInt(t.substring(5, 7), 16);
-  n = Math.round(n * (1 + e / 100)), o = Math.round(o * (1 + e / 100)), s = Math.round(s * (1 + e / 100)), n = Math.min(255, Math.max(0, n)), o = Math.min(255, Math.max(0, o)), s = Math.min(255, Math.max(0, s));
-  const c = n.toString(16).padStart(2, "0"), i = o.toString(16).padStart(2, "0"), d = s.toString(16).padStart(2, "0");
-  return `#${c}${i}${d}`;
-}, G = (t) => ({
-  themes: t?.themes ?? S.themes,
-  defaultTheme: t?.defaultTheme ?? S.defaultTheme,
-  saveCurrentThemeToLS: t?.saveCurrentThemeToLS ?? S.saveCurrentThemeToLS,
-  darkShadeGeneratorCoefficient: t?.darkShadeGeneratorCoefficient ?? S.darkShadeGeneratorCoefficient,
-  lightShadeGeneratorCoefficient: t?.lightShadeGeneratorCoefficient ?? S.lightShadeGeneratorCoefficient,
-  other: t?.other ?? S.other
-}), U = (t, e) => {
+  return r.forEach(({ name: a, color: s }) => {
+    n[a] = s;
+  }), e.forEach(({ name: a, color: s }) => {
+    n[a] = s;
+  }), Object.entries(n).map(([a, s]) => ({ name: a, color: s }));
+}, y = (r, e) => {
+  let n = parseInt(r.substring(1, 3), 16), a = parseInt(r.substring(3, 5), 16), s = parseInt(r.substring(5, 7), 16);
+  n = Math.round(n * (1 + e / 100)), a = Math.round(a * (1 + e / 100)), s = Math.round(s * (1 + e / 100)), n = Math.min(255, Math.max(0, n)), a = Math.min(255, Math.max(0, a)), s = Math.min(255, Math.max(0, s));
+  const c = n.toString(16).padStart(2, "0"), i = a.toString(16).padStart(2, "0"), l = s.toString(16).padStart(2, "0");
+  return `#${c}${i}${l}`;
+}, G = (r) => ({
+  themes: r?.themes ?? C.themes,
+  defaultTheme: r?.defaultTheme ?? C.defaultTheme,
+  saveCurrentThemeToLS: r?.saveCurrentThemeToLS ?? C.saveCurrentThemeToLS,
+  darkShadeGeneratorCoefficient: r?.darkShadeGeneratorCoefficient ?? C.darkShadeGeneratorCoefficient,
+  lightShadeGeneratorCoefficient: r?.lightShadeGeneratorCoefficient ?? C.lightShadeGeneratorCoefficient,
+  other: r?.other ?? C.other
+}), N = (r, e) => {
   try {
-    const n = v(e);
+    const n = L(e);
     return {
-      darkShade: E(n, t.darkShadeGeneratorCoefficient),
-      lightShade: E(n, t.lightShadeGeneratorCoefficient)
+      darkShade: y(n, r.darkShadeGeneratorCoefficient),
+      lightShade: y(n, r.lightShadeGeneratorCoefficient)
     };
   } catch (n) {
     return console.error(n instanceof Error ? n.message : n), {};
   }
-}, x = (t) => Object.entries(t).filter(([, e]) => typeof e == "string").map(([e, n]) => ({
-  name: `--nmorph-${b(e)}-color`,
+}, x = (r) => Object.entries(r).filter(([, e]) => typeof e == "string").map(([e, n]) => ({
+  name: `--nmorph-${E(e)}-color`,
   color: n
-})), N = (t, e) => {
-  const n = (c) => c.map((i) => `${i.name}: ${i.color};`).join(" "), o = Object.entries(e).map(([c, i]) => `--${b(c)}: ${i};`).join(" "), s = [];
-  return Object.entries(t).forEach(([c, i]) => {
-    const d = x($);
-    if (c === "common") s.push(n(L(d, i)));
+})), P = (r, e) => {
+  const n = (c) => c.map((i) => `${i.name}: ${i.color};`).join(" "), a = Object.entries(e).map(([c, i]) => `--${E(c)}: ${i};`).join(" "), s = [];
+  return Object.entries(r).forEach(([c, i]) => {
+    const l = x($);
+    if (c === "common") s.push(n(A(l, i)));
     else {
-      const T = `
-        &[${C}='${c}'] {
+      const S = `
+        &[${T}='${c}'] {
           ${n(i)}
         }
       `;
-      s.push(T);
+      s.push(S);
     }
   }), `
     :root {
       ${s.join(" ")}
-      ${o}
+      ${a}
     }
   `;
-}, P = (t) => {
+}, K = (r) => {
   const e = {};
-  return Object.entries(t.themes).forEach(([n, o]) => {
+  return Object.entries(r.themes).forEach(([n, a]) => {
     e[n] = [];
-    const s = !!o.darkShade, c = !!o.lightShade;
-    !!o.main && !s && !c && o.main && (e[n] = x(U(t, o.main))), e[n] = [...e[n], ...x(o)];
+    const s = !!a.darkShade, c = !!a.lightShade;
+    !!a.main && !s && !c && a.main && (e[n] = x(N(r, a.main))), e[n] = [...e[n], ...x(a)];
   }), e;
-}, z = (t) => {
-  const e = G(t);
-  return N(P(e), e.other);
-}, J = (t) => {
-  I("warn", `NMORPH(v${_.version})`);
-  const e = G(t), n = (a) => {
+}, J = (r) => {
+  const e = G(r);
+  return P(K(e), e.other);
+}, Q = (r) => {
+  I("warn", `NMORPH(v${w.version})`);
+  const e = G(r), n = (o) => {
     try {
-      const r = v(a);
+      const t = L(o);
       return {
-        darkShade: E(r, e.darkShadeGeneratorCoefficient),
-        lightShade: E(r, e.lightShadeGeneratorCoefficient)
+        darkShade: y(t, e.darkShadeGeneratorCoefficient),
+        lightShade: y(t, e.lightShadeGeneratorCoefficient)
       };
-    } catch (r) {
-      return console.error(r instanceof Error ? r.message : r), {};
+    } catch (t) {
+      return console.error(t instanceof Error ? t.message : t), {};
     }
-  }, o = (a) => {
-    const r = n(a);
-    return s(r);
-  }, s = (a) => Object.entries(a).filter(([, r]) => typeof r == "string").map(([r, h]) => ({
-    name: `--nmorph-${b(r)}-color`,
+  }, a = (o) => {
+    const t = n(o);
+    return s(t);
+  }, s = (o) => Object.entries(o).filter(([, t]) => typeof t == "string").map(([t, h]) => ({
+    name: `--nmorph-${E(t)}-color`,
     color: h
-  })), c = (a, r) => {
-    const h = (f) => f.map((u) => `${u.name}: ${u.color};`).join(" "), l = Object.entries(r).map(([f, u]) => `--${b(f)}: ${u};`).join(" "), g = [];
-    return Object.entries(a).forEach(([f, u]) => {
+  })), c = (o, t) => {
+    const h = (f) => f.map((u) => `${u.name}: ${u.color};`).join(" "), m = Object.entries(t).map(([f, u]) => `--${E(f)}: ${u};`).join(" "), b = [];
+    return Object.entries(o).forEach(([f, u]) => {
       const k = s($);
-      if (f === "common") g.push(h(L(k, u)));
+      if (f === "common") b.push(h(A(k, u)));
       else {
         const B = `
-          &[${C}='${f}'] {
+          &[${T}='${f}'] {
             ${h(u)}
           }
         `;
-        g.push(B);
+        b.push(B);
       }
     }), `
       :root {
-        ${g.join(" ")}
-        ${l}
+        ${b.join(" ")}
+        ${m}
       }
     `;
-  }, i = (a) => {
-    const r = {};
-    return Object.entries(a).forEach(([h, l]) => {
-      r[h] = [];
-      const g = !!l.darkShade, f = !!l.lightShade;
-      !!l.main && !g && !f && l.main && (r[h] = o(l.main)), r[h] = [...r[h], ...s(l)];
-    }), r;
-  }, d = typeof document < "u", T = A(e.defaultTheme);
-  let p = i(e.themes), m = null;
-  d && (m = document.getElementById("nmorph-theme-styles"), m || (m = document.createElement("style"), m.id = "nmorph-theme-styles", m.type = "text/css", document.head.appendChild(m)), m.innerHTML = c(p, e.other));
+  }, i = (o) => {
+    const t = {};
+    return Object.entries(o).forEach(([h, m]) => {
+      t[h] = [];
+      const b = !!m.darkShade, f = !!m.lightShade;
+      !!m.main && !b && !f && m.main && (t[h] = a(m.main)), t[h] = [...t[h], ...s(m)];
+    }), t;
+  }, l = typeof document < "u", S = H(e.defaultTheme);
+  let g = i(e.themes), d = null;
+  l && (d = document.getElementById("nmorph-theme-styles"), d || (d = document.createElement("style"), d.id = "nmorph-theme-styles", d.type = "text/css", document.head.appendChild(d)), d.innerHTML = c(g, e.other));
   const D = () => {
-    p = i(e.themes), m && (m.innerHTML = c(p, e.other));
-  }, y = (a) => {
-    T.value = a, d && (document.documentElement.setAttribute(C, T.value), !(typeof localStorage > "u") && (e.saveCurrentThemeToLS ? localStorage.setItem(C, a) : localStorage.removeItem(C)));
-  }, M = (a, r) => {
-    const h = r.main && !r.darkShade && !r.lightShade ? n(r.main) : {};
-    e.themes[a] = { ...e.themes[a], ...r, ...h }, D();
-  }, O = (a, r) => {
-    r && M(a, r), y(a);
+    g = i(e.themes), d && (d.innerHTML = c(g, e.other));
+  }, p = (o) => {
+    S.value = o, l && (document.documentElement.setAttribute(T, S.value), !(typeof localStorage > "u") && (e.saveCurrentThemeToLS ? localStorage.setItem(T, o) : localStorage.removeItem(T)));
+  }, M = (o, t) => {
+    const h = t.main && !t.darkShade && !t.lightShade ? n(t.main) : {};
+    e.themes[o] = { ...e.themes[o], ...t, ...h }, D();
+  }, O = (o, t) => {
+    t && M(o, t), p(o);
+  }, v = () => {
+    const o = document.documentElement.getAttribute(T), t = typeof localStorage < "u" ? localStorage.getItem(T) : null, h = t ? g[t] : void 0, m = o ? g[o] : void 0;
+    return e.saveCurrentThemeToLS && t && h ? t : o && m ? o : S.value;
   };
-  if (d && typeof localStorage < "u") {
-    const a = localStorage.getItem(C), r = a ? p[a] : void 0;
-    e.saveCurrentThemeToLS && r && (T.value = a);
-  }
-  y(T.value);
+  l ? document.documentElement.hasAttribute(T) ? window.requestAnimationFrame(() => p(v())) : p(v()) : p(S.value);
   const j = e;
   return {
-    setTheme: y,
+    setTheme: p,
     setThemeColors: M,
     applyTheme: O,
-    currentTheme: H(T),
+    currentTheme: _(S),
     data: j,
-    getDynamicColorVariables: o
+    getDynamicColorVariables: a
   };
 };
 export {
-  z as getNmorphThemeStyles,
-  J as useNmorphTheme
+  J as getNmorphThemeStyles,
+  Q as useNmorphTheme
 };

package/dist/package.json.js

@@ -1,4 +1,4 @@
-const a = "2.2.16", e = {
+const a = "2.2.17", e = {
   version: a
 };
 export {

package/dist/plugin.js

@@ -1,52 +1,52 @@
-import { default as C } from "./locales/ru.js";
-import { default as _ } from "./locales/zh.js";
-import { default as w } from "./locales/en.js";
-import { nmorphLog as M } from "./outside-utils/index.js";
+import { default as L } from "./locales/ru.js";
+import { default as M } from "./locales/zh.js";
+import { default as z } from "./locales/en.js";
+import { nmorphLog as D } from "./outside-utils/index.js";
 import { useNmorphTheme as h } from "./outside-hooks/use-nmorph-theme.js";
-import { getNmorphThemeStyles as E } from "./outside-hooks/use-nmorph-theme.js";
-import { useCommonStyles as i } from "./hooks/use-common-styles.js";
-import { getCommonStyles as O } from "./hooks/use-common-styles.js";
-import { AvatarShapeType as A, Locale as B, NmorphColor as F, NmorphComponentDirection as P, NmorphComponentHeight as R, NmorphComponentPosition as U, NmorphImageFit as Z, NmorphRadioStyleType as k, NmorphSelectionControlHeight as q, NmorphSelectionDateType as G, NmorphShadowType as J, NmorphSortOrder as K } from "./types/index.js";
+import { getNmorphThemeStyles as H } from "./outside-hooks/use-nmorph-theme.js";
+import { useCommonStyles as c } from "./hooks/use-common-styles.js";
+import { getCommonStyles as j } from "./hooks/use-common-styles.js";
+import { AvatarShapeType as F, Locale as G, NmorphColor as P, NmorphComponentDirection as R, NmorphComponentHeight as U, NmorphComponentPosition as Z, NmorphImageFit as k, NmorphRadioStyleType as q, NmorphSelectionControlHeight as J, NmorphSelectionDateType as K, NmorphShadowType as Q, NmorphSortOrder as W } from "./types/index.js";
 import { useNmorphTranslation as f } from "./hooks/use-nmorph-translation.js";
-import { useNmorphBrowser as c } from "./outside-hooks/use-nmorph-browser.js";
-import { useNmorphZIndex as N } from "./outside-hooks/use-nmorph-z-index.js";
-import { useNmorph as W } from "./outside-hooks/use-nmorph.js";
-import { useNmorphNotification as Y } from "./outside-hooks/use-nmorph-notification.js";
-const g = {
-  install(e, r = {}) {
+import { useNmorphBrowser as N } from "./outside-hooks/use-nmorph-browser.js";
+import { useNmorphZIndex as g } from "./outside-hooks/use-nmorph-z-index.js";
+import { useNmorph as Y } from "./outside-hooks/use-nmorph.js";
+import { useNmorphNotification as V } from "./outside-hooks/use-nmorph-notification.js";
+const u = {
+  install(o, r = {}) {
     if (!r?.i18n?.outsideMessagesMerge) {
-      const o = f(r.i18n), m = e.__VUE_I18N__;
-      m ? (o.global.messages.value && Object.entries(o.global.messages.value).forEach(([s, n]) => {
-        m.global.mergeLocaleMessage(s, n);
-      }), o.global.locale.value && (m.global.locale.value = o.global.locale.value)) : e.use(o);
+      const e = f(r.i18n), t = o.__VUE_I18N__?.global, s = !!(o.component("i18n-t") || o.component("I18nT") || o.directive("t"));
+      t?.mergeLocaleMessage ? (e.global.messages.value && Object.entries(e.global.messages.value).forEach(([p, i]) => {
+        t.mergeLocaleMessage?.(p, i);
+      }), t.locale && e.global.locale.value && (t.locale.value = e.global.locale.value)) : s || o.use(e);
     }
-    i();
-    const t = h(r.theme), a = c(), l = N(r.zIndex), p = { theme: t, browser: a, zIndex: l };
-    return e.provide("nmorph", p), e;
+    c();
+    const m = h(r.theme), n = N(), a = g(r.zIndex), l = { theme: m, browser: n, zIndex: a };
+    return o.provide("nmorph", l), o;
   }
-}, S = g;
+}, S = u;
 export {
-  A as AvatarShapeType,
-  B as Locale,
-  F as NmorphColor,
-  P as NmorphComponentDirection,
-  R as NmorphComponentHeight,
-  U as NmorphComponentPosition,
-  Z as NmorphImageFit,
+  F as AvatarShapeType,
+  G as Locale,
+  P as NmorphColor,
+  R as NmorphComponentDirection,
+  U as NmorphComponentHeight,
+  Z as NmorphComponentPosition,
+  k as NmorphImageFit,
   S as NmorphLibrary,
-  k as NmorphRadioStyleType,
-  q as NmorphSelectionControlHeight,
-  G as NmorphSelectionDateType,
-  J as NmorphShadowType,
-  K as NmorphSortOrder,
-  w as en,
-  O as getCommonStyles,
-  E as getNmorphThemeStyles,
-  M as nmorphLog,
-  C as ru,
-  W as useNmorph,
-  c as useNmorphBrowser,
-  Y as useNmorphNotification,
+  q as NmorphRadioStyleType,
+  J as NmorphSelectionControlHeight,
+  K as NmorphSelectionDateType,
+  Q as NmorphShadowType,
+  W as NmorphSortOrder,
+  z as en,
+  j as getCommonStyles,
+  H as getNmorphThemeStyles,
+  D as nmorphLog,
+  L as ru,
+  Y as useNmorph,
+  N as useNmorphBrowser,
+  V as useNmorphNotification,
   h as useNmorphTheme,
-  _ as zh
+  M as zh
 };

package/dist/src/components/navigation/nmorph-context-menu/NmorphContextMenu.vue.d.ts

@@ -1,7 +1,9 @@
 import { NmorphPlacementType } from '../../../types';
 import { DefineComponent, ComponentOptionsMixin, PublicProps, ComponentProvideOptions } from 'vue';
+type NmorphContextMenuTrigger = 'contextmenu' | 'click' | 'both';
 interface INmorphProps {
-    modelValue?: boolean;
+    modelValue?: boolean | null;
+    trigger?: NmorphContextMenuTrigger;
     placement?: NmorphPlacementType;
     width?: number | string;
     minWidth?: number | string;
@@ -33,6 +35,7 @@ declare const _default: __VLS_WithTemplateSlots< DefineComponent<INmorphProps, {
 }>, {
     disabled: boolean;
     width: string | number;
+    modelValue: boolean;
     minWidth: string | number;
     zIndex: number;
     closeOnEscape: boolean;
@@ -44,6 +47,7 @@ declare const _default: __VLS_WithTemplateSlots< DefineComponent<INmorphProps, {
     yOffset: number;
     fillWidth: boolean;
     ariaLabel: string;
+    trigger: NmorphContextMenuTrigger;
 }, {}, {}, {}, string, ComponentProvideOptions, true, {
     triggerDOMRef: HTMLDivElement;
 }, HTMLDivElement>, {