@indielayer/ui 1.9.3 → 1.10.0

package/lib/components/menu/MenuItem.vue2.js

@@ -1,9 +1,9 @@
-import { defineComponent as z, ref as p, computed as d, onMounted as S, watch as k, openBlock as l, createBlock as i, resolveDynamicComponent as x, mergeProps as N, unref as s, withCtx as R, createElementBlock as r, renderSlot as n, createCommentVNode as u, createTextVNode as I, toDisplayString as M, createElementVNode as O, Fragment as P } from "vue";
-import { useMutationObserver as j } from "../../node_modules/.pnpm/@vueuse_core@10.2.0_vue@3.5.10_typescript@5.2.2_/node_modules/@vueuse/core/index.js";
+import { defineComponent as z, ref as k, computed as g, onMounted as N, watch as h, openBlock as l, createBlock as i, resolveDynamicComponent as R, mergeProps as I, unref as s, withCtx as M, createElementBlock as r, renderSlot as n, createTextVNode as u, toDisplayString as c, createCommentVNode as f, createElementVNode as O, Fragment as P } from "vue";
+import { useMutationObserver as j } from "../../node_modules/.pnpm/@vueuse_core@11.1.0_vue@3.5.10_typescript@5.2.2_/node_modules/@vueuse/core/index.js";
 import { useColors as w } from "../../composables/useColors.js";
-import { useCommon as h } from "../../composables/useCommon.js";
+import { useCommon as $ } from "../../composables/useCommon.js";
 import { useTheme as D } from "../../composables/useTheme.js";
-import g from "../icon/Icon.vue.js";
+import y from "../icon/Icon.vue.js";
 import F from "../spinner/Spinner.vue.js";
 const T = {
   key: 0,
@@ -12,8 +12,8 @@ const T = {
   key: 2,
   class: "flex-1 truncate"
 }, E = { class: "ml-1 shrink-0" }, A = { key: 0 }, L = {
-  ...h.props(),
-  ...w.props("primary"),
+  ...$.props(),
+  ...w.props("secondary"),
   item: {
     type: Object,
     default: () => {
@@ -45,48 +45,50 @@ const T = {
   },
   selected: Boolean,
   disabled: Boolean,
-  minimal: Boolean
+  minimal: Boolean,
+  prefix: String,
+  suffix: String
 }, X = {
   name: "XMenuItem",
   validators: {
-    ...h.validators()
+    ...$.validators()
   }
 }, Y = /* @__PURE__ */ z({
   ...X,
   props: L,
   emits: ["active", "click"],
-  setup(y, { emit: $ }) {
-    const c = y, m = $, a = p(), o = p(!1), e = d(() => ({
-      ...c,
-      ...c.item
-    })), v = d(() => e.value.to ? "router-link" : e.value.href ? "a" : "div");
-    S(() => {
-      a.value && (f(), v.value === "router-link" && j(a.value.$el, f, {
+  setup(b, { emit: _ }) {
+    const v = b, m = _, a = k(), o = k(!1), e = g(() => ({
+      ...v,
+      ...v.item
+    })), p = g(() => e.value.to ? "router-link" : e.value.href ? "a" : "div");
+    N(() => {
+      a.value && (d(), p.value === "router-link" && j(a.value.$el, d, {
         attributes: !0,
         attributeFilter: ["class"]
       }));
     });
-    function b(t) {
+    function x(t) {
       if (e.value.disabled) {
         t.stopPropagation(), t.preventDefault();
         return;
       }
       e.value.onClick && e.value.onClick(t), m("click", t);
     }
-    function f() {
+    function d() {
       if (a.value && a.value.$el && (e.value.href || e.value.to)) {
         const t = a.value.$el.classList.contains(e.value.exact ? "router-link-exact-active" : "router-link-active") || !1;
         o.value = t;
       } else
         o.value = !!e.value.active;
     }
-    k(() => o.value, (t) => {
+    h(() => o.value, (t) => {
       t && m("active");
-    }), k(() => e.value.active, (t) => {
+    }), h(() => e.value.active, (t) => {
       o.value = !!t;
     });
-    const { styles: _, classes: B, className: C } = D("MenuItem", {}, e, { isActive: o });
-    return (t, q) => (l(), i(x(v.value), N({
+    const { styles: B, classes: C, className: S } = D("MenuItem", {}, e, { isActive: o });
+    return (t, q) => (l(), i(R(p.value), I({
       ref_key: "elRef",
       ref: a
     }, {
@@ -96,32 +98,34 @@ const T = {
       to: e.value.to,
       target: e.value.target,
       color: e.value.color,
-      style: s(_),
+      style: s(B),
       class: [
-        s(C),
+        s(S),
         t.$style["menu-item"],
         [o.value ? t.$style["menu-item--active"] : ""],
-        s(B).wrapper,
+        s(C).wrapper,
         {
           "flex items-center": t.$slots.prefix || t.$slots.suffix
         }
       ],
       title: e.value.label,
       alt: e.value.label,
-      onClick: b
+      onClick: x
     }), {
-      default: R(() => [
-        t.$slots.prefix ? (l(), r("span", T, [
-          n(t.$slots, "prefix", {}, void 0, !0)
-        ])) : e.value.icon ? (l(), i(g, {
+      default: M(() => [
+        t.$slots.prefix || e.value.prefix ? (l(), r("span", T, [
+          n(t.$slots, "prefix", { item: e.value }, () => [
+            u(c(e.value.prefix), 1)
+          ], !0)
+        ])) : e.value.icon ? (l(), i(y, {
           key: 1,
           size: e.value.size,
           icon: e.value.icon,
           class: "mr-2"
-        }, null, 8, ["size", "icon"])) : u("", !0),
-        t.minimal ? u("", !0) : (l(), r("span", V, [
-          n(t.$slots, "default", {}, () => [
-            I(M(e.value.label), 1)
+        }, null, 8, ["size", "icon"])) : f("", !0),
+        t.minimal ? f("", !0) : (l(), r("span", V, [
+          n(t.$slots, "default", { item: e.value }, () => [
+            u(c(e.value.label), 1)
           ], !0)
         ])),
         O("span", E, [
@@ -129,13 +133,15 @@ const T = {
             key: 0,
             size: e.value.size
           }, null, 8, ["size"])) : (l(), r(P, { key: 1 }, [
-            t.$slots.suffix ? (l(), r("span", A, [
-              n(t.$slots, "suffix", {}, void 0, !0)
-            ])) : e.value.iconRight ? (l(), i(g, {
+            t.$slots.suffix || e.value.suffix ? (l(), r("span", A, [
+              n(t.$slots, "suffix", { item: e.value }, () => [
+                u(c(e.value.suffix), 1)
+              ], !0)
+            ])) : e.value.iconRight ? (l(), i(y, {
               key: 1,
               size: e.value.size,
               icon: e.value.iconRight
-            }, null, 8, ["size", "icon"])) : u("", !0)
+            }, null, 8, ["size", "icon"])) : f("", !0)
           ], 64))
         ])
       ]),

package/lib/components/modal/Modal.vue.d.ts

@@ -41,7 +41,7 @@ declare const modalProps: {
         default: boolean;
     };
     formErrors: {
-        type: PropType<[FormError[], FormError]>;
+        type: PropType<FormError | FormError[]>;
         default: () => never[];
     };
     persistent: BooleanConstructor;
@@ -93,7 +93,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<im
         default: boolean;
     };
     formErrors: {
-        type: PropType<[FormError[], FormError]>;
+        type: PropType<FormError | FormError[]>;
         default: () => never[];
     };
     persistent: BooleanConstructor;
@@ -138,7 +138,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<im
         default: boolean;
     };
     formErrors: {
-        type: PropType<[FormError[], FormError]>;
+        type: PropType<FormError | FormError[]>;
         default: () => never[];
     };
     persistent: BooleanConstructor;
@@ -158,7 +158,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<im
     isForm: boolean;
     formDisabled: boolean;
     formAutoValidate: boolean;
-    formErrors: [FormError[], FormError];
+    formErrors: FormError | FormError[];
     persistent: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>, {
     image?(_: {}): any;

package/lib/components/modal/Modal.vue.js

@@ -1,5 +1,5 @@
-import { defineComponent as X, ref as y, watch as S, nextTick as w, useSlots as H, computed as M, openBlock as t, createBlock as v, Teleport as j, createElementBlock as r, normalizeStyle as q, unref as o, normalizeClass as l, createCommentVNode as a, createElementVNode as B, resolveDynamicComponent as K, withCtx as $, renderSlot as i, toDisplayString as k } from "vue";
-import { onClickOutside as L, useEventListener as G } from "../../node_modules/.pnpm/@vueuse_core@10.2.0_vue@3.5.10_typescript@5.2.2_/node_modules/@vueuse/core/index.js";
+import { defineComponent as X, ref as y, watch as w, nextTick as S, useSlots as H, computed as M, openBlock as t, createBlock as v, Teleport as j, createElementBlock as r, normalizeStyle as q, unref as o, normalizeClass as l, createCommentVNode as a, createElementVNode as B, resolveDynamicComponent as K, withCtx as $, renderSlot as i, toDisplayString as h } from "vue";
+import { onClickOutside as L, useEventListener as G } from "../../node_modules/.pnpm/@vueuse_core@11.1.0_vue@3.5.10_typescript@5.2.2_/node_modules/@vueuse/core/index.js";
 import { useTheme as J } from "../../composables/useTheme.js";
 import { useFocusTrap as Q } from "../../composables/useFocusTrap.js";
 import { closeIcon as U } from "../../common/icons.js";
@@ -60,51 +60,55 @@ const x = { key: 0 }, ee = ["xs", "sm", "md", "lg", "xl", "full"], oe = ["top",
   props: te,
   emits: ["update:modelValue", "submit"],
   setup(V, { expose: C, emit: T }) {
-    const n = V, h = T, u = y(n.modelValue), d = y(!1), b = y(null), z = y(null), { initFocusTrap: A, clearFocusTrap: D } = Q();
+    const d = V, k = T, c = y(d.modelValue), u = y(!1), b = y(null), E = y(null), { initFocusTrap: z, clearFocusTrap: A } = Q();
     let m;
-    S(u, (e) => {
+    w(c, (e) => {
       m && (m(), m = void 0), e && setTimeout(() => {
-        m = L(b, P, {
+        m = L(b, F, {
           ignore: [".v-popper__popper"]
         });
       });
-    }), S(() => n.modelValue, E, { immediate: !0 });
-    async function E() {
-      const e = n.modelValue;
-      e ? (u.value = e, await w(), d.value = e, await w(), A(b), document.body.style.overflow = "hidden") : (d.value = e, u.value = e, D(), document.body.style.overflow = "auto");
+    }), w(() => d.modelValue, D, { immediate: !0 });
+    async function D() {
+      const e = d.modelValue;
+      if (e) {
+        const n = window.innerWidth - document.documentElement.clientWidth;
+        c.value = e, await S(), u.value = e, await S(), z(b), document.body.style.paddingRight = `${n}px`, document.body.style.overflow = "hidden";
+      } else
+        u.value = e, c.value = e, A(), document.body.style.paddingRight = "", document.body.style.overflow = "auto";
     }
-    typeof window < "u" && G(document, "keydown", O);
-    const F = (e) => [".v-popper__popper", ".x-datepicker"].some((c) => {
-      if (typeof c == "string")
-        return Array.from(window.document.querySelectorAll(c)).some((f) => f === e.target || e.composedPath().includes(f));
+    typeof window < "u" && G(document, "keydown", W);
+    const R = (e) => [".v-popper__popper", ".x-datepicker"].some((n) => {
+      if (typeof n == "string")
+        return Array.from(window.document.querySelectorAll(n)).some((f) => f === e.target || e.composedPath().includes(f));
     });
-    function O(e) {
-      e.key === "Escape" && !F(e) && u.value && !n.persistent && p();
+    function W(e) {
+      e.key === "Escape" && !R(e) && c.value && !d.persistent && p();
     }
-    function P() {
-      n.persistent || p();
+    function F() {
+      d.persistent || p();
     }
     function p() {
-      d.value = !1, setTimeout(() => {
-        h("update:modelValue", !1);
+      u.value = !1, setTimeout(() => {
+        k("update:modelValue", !1);
       }, 150);
     }
-    function R() {
-      h("update:modelValue", !0), d.value = !0;
+    function O() {
+      k("update:modelValue", !0), u.value = !0;
     }
-    const g = H(), I = M(() => !!(g["tertiary-action"] || g["cancel-action"])), { styles: N, classes: s, className: W } = J("Modal", {}, n, {
-      visible: d
+    const g = H(), P = M(() => !!(g["tertiary-action"] || g["cancel-action"])), { styles: I, classes: s, className: N } = J("Modal", {}, d, {
+      visible: u
     });
-    return C({ open: R, close: p }), (e, c) => (t(), v(j, { to: "body" }, [
-      u.value ? (t(), r("div", {
+    return C({ open: O, close: p }), (e, n) => (t(), v(j, { to: "body" }, [
+      c.value ? (t(), r("div", {
         key: 0,
         ref_key: "modalWrapperRef",
-        ref: z,
-        style: q(o(N)),
+        ref: E,
+        style: q(o(I)),
         class: l([
-          o(W),
+          o(N),
           o(s).wrapper,
-          d.value ? "visible" : "invisible ease-in duration-100"
+          u.value ? "visible" : "invisible ease-in duration-100"
         ])
       }, [
         e.backdrop ? (t(), r("div", {
@@ -128,7 +132,7 @@ const x = { key: 0 }, ee = ["xs", "sm", "md", "lg", "xl", "full"], oe = ["top",
             role: "dialog",
             "aria-modal": "true",
             "aria-labelledby": "modal-headline",
-            onSubmit: c[0] || (c[0] = (f) => e.$emit("submit", f))
+            onSubmit: n[0] || (n[0] = (f) => e.$emit("submit", f))
           }, {
             default: $(() => [
               i(e.$slots, "image"),
@@ -141,11 +145,11 @@ const x = { key: 0 }, ee = ["xs", "sm", "md", "lg", "xl", "full"], oe = ["top",
                     e.label ? (t(), r("div", {
                       key: 0,
                       class: l(o(s).label)
-                    }, k(e.label), 3)) : a("", !0),
+                    }, h(e.label), 3)) : a("", !0),
                     e.title ? (t(), r("div", {
                       key: 1,
                       class: l(o(s).title)
-                    }, k(e.title), 3)) : a("", !0)
+                    }, h(e.title), 3)) : a("", !0)
                   ])
                 ], 2)) : a("", !0)
               ]),
@@ -164,7 +168,7 @@ const x = { key: 0 }, ee = ["xs", "sm", "md", "lg", "xl", "full"], oe = ["top",
                     e.description ? (t(), r("div", {
                       key: 0,
                       class: l(o(s).description)
-                    }, k(e.description), 3)) : a("", !0),
+                    }, h(e.description), 3)) : a("", !0),
                     i(e.$slots, "default")
                   ], 2)
                 ]),
@@ -186,7 +190,7 @@ const x = { key: 0 }, ee = ["xs", "sm", "md", "lg", "xl", "full"], oe = ["top",
                 }, [
                   i(e.$slots, "actions", {}, () => [
                     i(e.$slots, "cancel-action"),
-                    I.value ? (t(), r("div", x)) : a("", !0),
+                    P.value ? (t(), r("div", x)) : a("", !0),
                     i(e.$slots, "tertiary-action"),
                     i(e.$slots, "secondary-action"),
                     i(e.$slots, "primary-action")

package/lib/components/notifications/Notifications.vue.d.ts

@@ -19,6 +19,10 @@ declare const notificationsProps: {
         type: BooleanConstructor;
         default: boolean;
     };
+    pauseOnHover: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
     injectKey: {
         type: (SymbolConstructor | StringConstructor)[];
         default: import("vue").InjectionKey<NotificationInjection>;
@@ -48,6 +52,8 @@ export type NotificationEvent = {
     title?: string;
     style?: string;
     message?: string;
+    timer?: ReturnType<typeof setTimeout>;
+    timerStart?: number;
     timeout?: number;
     removable?: boolean;
     align?: NotificationsAlign;
@@ -83,6 +89,10 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<im
         type: BooleanConstructor;
         default: boolean;
     };
+    pauseOnHover: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
     injectKey: {
         type: (SymbolConstructor | StringConstructor)[];
         default: import("vue").InjectionKey<NotificationInjection>;
@@ -117,6 +127,10 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<im
         type: BooleanConstructor;
         default: boolean;
     };
+    pauseOnHover: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
     injectKey: {
         type: (SymbolConstructor | StringConstructor)[];
         default: import("vue").InjectionKey<NotificationInjection>;
@@ -131,6 +145,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<im
     position: "top" | "bottom";
     align: "left" | "right";
     timeout: number;
+    pauseOnHover: boolean;
     injectKey: string | symbol;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>, {
     default?(_: {}): any;