@indielayer/ui 1.5.1 → 1.6.0

package/lib/components/stepper/Stepper.vue.js

@@ -1,4 +1,4 @@
-import { defineComponent as I, ref as c, openBlock as i, createElementBlock as d, createElementVNode as r, normalizeClass as s, unref as o, normalizeStyle as B, createVNode as u, withCtx as p, Fragment as R, renderList as V, createBlock as N, resolveDynamicComponent as z, toDisplayString as f, createCommentVNode as E, renderSlot as P } from "vue";
+import { defineComponent as x, ref as c, openBlock as l, createElementBlock as d, createElementVNode as r, normalizeClass as s, unref as o, normalizeStyle as B, createVNode as u, withCtx as m, Fragment as R, renderList as V, createBlock as N, resolveDynamicComponent as z, toDisplayString as f, createCommentVNode as E, renderSlot as P } from "vue";
 import { useCommon as v } from "../../composables/useCommon.js";
 import { useColors as $ } from "../../composables/useColors.js";
 import { useTheme as D } from "../../composables/useTheme.js";
@@ -40,85 +40,86 @@ const j = { class: "overflow-hidden" }, q = { class: "flex items-start pr-4" },
 }, O = {
   name: "XStepper",
   validators: K
-}, se = /* @__PURE__ */ I({
+}, se = /* @__PURE__ */ x({
   ...O,
   props: M,
   emits: ["update:modelValue"],
   setup(y, { emit: _ }) {
-    const n = y, g = _, b = c(null), S = c(null), h = c(null);
-    function k(t, a) {
-      t.disabled || !n.interactive || g("update:modelValue", a);
+    const n = y, b = _, g = c(null), S = c(null), h = c(null);
+    function k(e, a) {
+      e.disabled || !n.interactive || b("update:modelValue", a);
     }
-    function C(t, a) {
-      return t.status === "incomplete" ? n.iconIncomplete || F : t.status === "error" ? n.iconError || L : t.status === "complete" ? n.iconComplete || T : n.iconPristine || W;
+    function C(e, a) {
+      return e.status === "incomplete" ? n.iconIncomplete || F : e.status === "error" ? n.iconError || L : e.status === "complete" ? n.iconComplete || T : n.iconPristine || W;
     }
-    const { styles: w, classes: l, className: x } = D("Stepper", {}, n);
-    return (t, a) => (i(), d("div", null, [
+    const { styles: w, classes: i, className: I } = D("Stepper", {}, n);
+    return (e, a) => (l(), d("div", null, [
       r("div", {
         ref_key: "wrapperRef",
         ref: S,
         class: s(["relative", [
-          o(x),
-          o(l).wrapper
+          o(I),
+          o(i).wrapper
         ]]),
         style: B(o(w))
       }, [
         u(X, {
           ref_key: "scrollRef",
-          ref: b,
+          ref: g,
           scrollbar: !1,
           horizontal: "",
           mousewheel: "",
-          class: s(o(l).scroller)
+          class: s(o(i).scroller)
         }, {
-          default: p(() => [
+          default: m(() => [
             r("div", {
               ref_key: "stepperRef",
               ref: h,
-              class: s(["relative", o(l).list])
+              class: s(["relative", o(i).list])
             }, [
-              (i(!0), d(R, null, V(t.steps, (e, m) => (i(), N(z(t.interactive ? "button" : "div"), {
-                key: m,
-                class: s([o(l).step, {
-                  "cursor-pointer": t.interactive && !e.disabled,
-                  "text-secondary-400 dark:text-secondary-600": e.disabled,
-                  "flex-1": t.grow
+              (l(!0), d(R, null, V(e.steps, (t, p) => (l(), N(z(e.interactive ? "button" : "div"), {
+                key: p,
+                type: e.interactive ? "button" : void 0,
+                class: s([o(i).step, {
+                  "cursor-pointer": e.interactive && !t.disabled,
+                  "text-secondary-400 dark:text-secondary-600": t.disabled,
+                  "flex-1": e.grow
                 }]),
-                disabled: e.disabled || !t.interactive,
-                onClick: (Q) => k(e, m)
+                disabled: t.disabled || !e.interactive,
+                onClick: (Q) => k(t, p)
               }, {
-                default: p(() => [
+                default: m(() => [
                   r("div", j, [
                     r("div", {
-                      class: s(["h-0.5 w-full mb-2", [e.status === "complete" || e.status === "incomplete" ? "bg-primary-500" : "bg-secondary-200 dark:bg-secondary-700"]])
+                      class: s(["h-0.5 w-full mb-2", [t.status === "complete" || t.status === "incomplete" ? "bg-primary-500" : "bg-secondary-200 dark:bg-secondary-700"]])
                     }, null, 2),
                     r("div", q, [
                       u(A, {
-                        icon: C(e),
+                        icon: C(t),
                         size: "sm",
-                        class: s([o(l).icon, {
-                          "text-primary-500": e.status === "complete" || e.status === "incomplete",
-                          "text-error-500": e.status === "error"
+                        class: s([o(i).icon, {
+                          "text-primary-500": t.status === "complete" || t.status === "incomplete",
+                          "text-error-500": t.status === "error"
                         }])
                       }, null, 8, ["icon", "class"]),
                       r("div", G, [
-                        r("div", H, f(e.label), 1),
-                        e.description ? (i(), d("div", J, f(e.description), 1)) : E("", !0)
+                        r("div", H, f(t.label), 1),
+                        t.description ? (l(), d("div", J, f(t.description), 1)) : E("", !0)
                       ])
                     ])
                   ])
                 ]),
                 _: 2
-              }, 1032, ["class", "disabled", "onClick"]))), 128))
+              }, 1032, ["type", "class", "disabled", "onClick"]))), 128))
             ], 2)
           ]),
           _: 1
         }, 8, ["class"])
       ], 6),
       r("div", {
-        class: s(o(l).content)
+        class: s(o(i).content)
       }, [
-        P(t.$slots, "default")
+        P(e.$slots, "default")
       ], 2)
     ]));
   }

package/lib/components/tab/Tab.vue.js

@@ -1,13 +1,13 @@
 import { defineComponent as R, computed as s, ref as d, inject as j, reactive as D, onMounted as E, openBlock as c, createBlock as m, resolveDynamicComponent as L, normalizeStyle as V, unref as o, normalizeClass as v, withCtx as M, renderSlot as g, createElementVNode as z, createCommentVNode as p, toDisplayString as O, Teleport as P, createElementBlock as X } from "vue";
 import { useMutationObserver as F } from "../../node_modules/.pnpm/@vueuse_core@10.2.0_vue@3.3.9/node_modules/@vueuse/core/index.js";
 import { injectTabGroupKey as G } from "../../composables/keys.js";
-import { useCommon as x } from "../../composables/useCommon.js";
+import { useCommon as T } from "../../composables/useCommon.js";
 import { useTheme as I } from "../../composables/useTheme.js";
 import C from "../icon/Icon.vue.js";
 import K from "../link/Link.vue.js";
 import { closeIcon as q } from "../../common/icons.js";
 const A = {
-  ...x.props(),
+  ...T.props(),
   value: {
     type: [String, Number]
   },
@@ -24,14 +24,14 @@ const A = {
 }, H = {
   name: "XTab",
   validators: {
-    ...x.validators()
+    ...T.validators()
   }
 }, te = /* @__PURE__ */ R({
   ...H,
   props: A,
   emits: ["remove"],
-  setup(T) {
-    const t = T, i = s(() => {
+  setup(x) {
+    const t = x, i = s(() => {
       var e, u;
       return ((u = (e = l.value) == null ? void 0 : e.$el) == null ? void 0 : u.href) || t.value;
     }), S = s(() => t.label || t.value), b = d(null), l = d(null), a = j(G, {
@@ -76,6 +76,7 @@ const A = {
     return (e, u) => (c(), m(L(e.to ? K : e.tag), {
       ref_key: "elRef",
       ref: l,
+      type: e.tag === "button" ? "button" : void 0,
       "data-value": i.value,
       to: e.to,
       color: r.value ? $.value : void 0,
@@ -141,7 +142,7 @@ const A = {
         ], 8, ["to"])) : p("", !0)
       ]),
       _: 3
-    }, 8, ["data-value", "to", "color", "style", "class", "aria-disabled", "aria-selected"]));
+    }, 8, ["type", "data-value", "to", "color", "style", "class", "aria-disabled", "aria-selected"]));
   }
 });
 export {

package/lib/components/table/Table.vue.js

@@ -1,4 +1,4 @@
-import { defineComponent as E, ref as J, watch as X, openBlock as n, createElementBlock as a, normalizeClass as c, unref as u, renderSlot as i, createElementVNode as f, normalizeStyle as F, createVNode as p, withCtx as d, createBlock as m, createCommentVNode as $, Fragment as y, renderList as g, createTextVNode as _, toDisplayString as C } from "vue";
+import { defineComponent as E, ref as J, watch as X, openBlock as n, createElementBlock as a, normalizeClass as c, unref as u, renderSlot as i, createElementVNode as p, normalizeStyle as F, createVNode as f, withCtx as d, createBlock as m, createCommentVNode as $, Fragment as y, renderList as g, createTextVNode as _, toDisplayString as C } from "vue";
 import { useTheme as O } from "../../composables/useTheme.js";
 import P from "./TableHead.vue.js";
 import N from "./TableHeader.vue.js";
@@ -42,7 +42,7 @@ const Q = { key: 1 }, R = ["colspan"], U = { key: 2 }, Y = ["colspan"], Z = ["on
     default: !0
   },
   expandable: Boolean
-}, te = { name: "XTable" }, pe = /* @__PURE__ */ E({
+}, te = { name: "XTable" }, fe = /* @__PURE__ */ E({
   ...te,
   props: {
     ...ee,
@@ -103,11 +103,11 @@ const Q = { key: 1 }, R = ["colspan"], U = { key: 2 }, Y = ["colspan"], Z = ["on
     }, [
       i(e.$slots, "title"),
       i(e.$slots, "actions"),
-      f("table", {
+      p("table", {
         style: F(u(L)),
         class: c(u(b).table)
       }, [
-        p(P, null, {
+        f(P, null, {
           default: d(() => [
             e.expandable ? (n(), m(N, {
               key: 0,
@@ -134,7 +134,7 @@ const Q = { key: 1 }, R = ["colspan"], U = { key: 2 }, Y = ["colspan"], Z = ["on
           ]),
           _: 3
         }),
-        p(u(W), null, {
+        f(u(W), null, {
           default: d(() => [
             e.loading ? (n(!0), a(y, { key: 0 }, g(Number(e.loadingLines), (t, l) => (n(), m(S, {
               key: l,
@@ -150,7 +150,7 @@ const Q = { key: 1 }, R = ["colspan"], U = { key: 2 }, Y = ["colspan"], Z = ["on
                 }, {
                   default: d(() => [
                     i(e.$slots, `loading-${s.value}`, { item: t }, () => [
-                      p(G, {
+                      f(G, {
                         class: c(["max-w-[60%]", {
                           "mx-auto": s.align === "center",
                           "ml-auto": s.align === "right"
@@ -164,13 +164,13 @@ const Q = { key: 1 }, R = ["colspan"], U = { key: 2 }, Y = ["colspan"], Z = ["on
               ]),
               _: 2
             }, 1032, ["striped"]))), 128)) : e.error ? (n(), a("tr", Q, [
-              f("td", {
+              p("td", {
                 colspan: e.headers.length
               }, [
                 i(e.$slots, "error")
               ], 8, R)
             ])) : !h.items || h.items.length === 0 ? (n(), a("tr", U, [
-              f("td", {
+              p("td", {
                 colspan: e.headers.length
               }, [
                 i(e.$slots, "empty")
@@ -178,7 +178,7 @@ const Q = { key: 1 }, R = ["colspan"], U = { key: 2 }, Y = ["colspan"], Z = ["on
             ])) : (n(!0), a(y, { key: 3 }, g(h.items, (t, l) => {
               var s;
               return n(), a(y, { key: l }, [
-                p(S, {
+                f(S, {
                   pointer: e.pointer,
                   striped: e.striped,
                   onClick: (r) => e.$emit("click-row", t)
@@ -192,11 +192,12 @@ const Q = { key: 1 }, R = ["colspan"], U = { key: 2 }, Y = ["colspan"], Z = ["on
                       default: d(() => {
                         var r;
                         return [
-                          f("button", {
+                          p("button", {
+                            type: "button",
                             class: "p-4",
                             onClick: (B) => k.value[l].__expanded = !k.value[l].__expanded
                           }, [
-                            p(K, {
+                            f(K, {
                               icon: u(M),
                               size: e.dense ? "xs" : "md",
                               class: c(["transition-transform", {
@@ -227,8 +228,8 @@ const Q = { key: 1 }, R = ["colspan"], U = { key: 2 }, Y = ["colspan"], Z = ["on
                   _: 2
                 }, 1032, ["pointer", "striped", "onClick"]),
                 e.expandable ? (n(), a("tr", j, [
-                  f("td", x, [
-                    f("div", {
+                  p("td", x, [
+                    p("div", {
                       class: c(["overflow-hidden transition-opacity", [(s = k.value[l]) != null && s.__expanded ? "" : "opacity-0 max-h-0"]])
                     }, [
                       i(e.$slots, "expanded-row", { item: t })
@@ -244,12 +245,12 @@ const Q = { key: 1 }, R = ["colspan"], U = { key: 2 }, Y = ["colspan"], Z = ["on
           key: 0,
           class: c(u(b).loadingWrapper)
         }, [
-          p(q, { size: "lg" })
+          f(q, { size: "lg" })
         ], 2)) : $("", !0)
       ], 6)
     ], 2));
   }
 });
 export {
-  pe as default
+  fe as default
 };

package/lib/components/tooltip/Tooltip.vue.js

@@ -2,7 +2,7 @@ import { defineComponent as r, openBlock as a, createBlock as s, withCtx as e, c
 import c from "../popover/Popover.vue.js";
 import "../popover/Popover.vue3.js";
 import p from "../popover/PopoverContainer.vue.js";
-import "../../node_modules/.pnpm/floating-vue@5.2.0_vue@3.3.9/node_modules/floating-vue/dist/floating-vue.js";
+import "../../node_modules/.pnpm/floating-vue@5.2.2_vue@3.3.9/node_modules/floating-vue/dist/floating-vue.js";
 const i = { class: "dark" }, m = {
   placement: {
     type: String,

package/lib/create.d.ts

@@ -1,10 +1,14 @@
-import type { App } from 'vue';
+import type { App, InjectionKey, MaybeRef } from 'vue';
 import { type UITheme } from './theme';
+import type { IconInjection } from './components/icon/Icon.vue';
 export type UIOptions = {
     prefix?: string;
     components?: any[];
     icons?: Record<string, any>;
     theme?: UITheme;
+    injectIconsKey?: InjectionKey<IconInjection>;
+    injectOptionsKey?: InjectionKey<UIOptions>;
+    injectThemeKey?: InjectionKey<MaybeRef<UITheme>>;
 };
 declare const create: (createOptions?: UIOptions) => {
     install: (app: App, installOptions?: UIOptions) => void;

package/lib/create.js

@@ -1,21 +1,24 @@
-import { injectOptionsKey as r, injectIconsKey as m, injectThemeKey as f } from "./composables/keys.js";
-import { injectThemeStyles as a } from "./theme.js";
-const l = {
-  prefix: "X"
-}, h = (o = {}) => ({
-  install: (t, c = {}) => {
-    var s;
+import { injectOptionsKey as s, injectIconsKey as m, injectThemeKey as r } from "./composables/keys.js";
+import { injectThemeStyles as h } from "./theme.js";
+const y = {
+  prefix: "X",
+  injectIconsKey: m,
+  injectOptionsKey: s,
+  injectThemeKey: r
+}, a = (f = {}) => ({
+  install: (t, n = {}) => {
+    var c;
     const e = {
-      ...l,
-      ...o,
-      ...c
+      ...y,
+      ...f,
+      ...n
     };
-    e.components && e.components.forEach((n) => {
-      const i = n.name.startsWith("X") ? n.name.slice(1) : n.name;
-      t.component(`${e.prefix}${i}`) || t.component(`${e.prefix}${i}`, n);
-    }), t.provide(r, e), t.provide(m, e.icons || {}), t.provide(f, e.theme || {}), (s = e.theme) != null && s.styles && a(e.theme.name || "", e.theme.styles);
+    e.components && e.components.forEach((o) => {
+      const i = o.name.startsWith("X") ? o.name.slice(1) : o.name;
+      t.component(`${e.prefix}${i}`) || t.component(`${e.prefix}${i}`, o);
+    }), t.provide(n.injectOptionsKey || s, e), t.provide(n.injectIconsKey || m, e.icons || {}), t.provide(n.injectThemeKey || r, e.theme || {}), (c = e.theme) != null && c.styles && h(e.theme.name || "", e.theme.styles);
   }
-}), $ = h;
+}), $ = a;
 export {
   $ as default
 };