@indielayer/ui 1.2.0 → 1.3.0

package/lib/components/link/theme/Link.base.theme.d.ts

@@ -0,0 +1,3 @@
+import type { LinkTheme } from '../Link.vue';
+declare const theme: LinkTheme;
+export default theme;

package/lib/components/link/{Link.theme.js → theme/Link.base.theme.js}

@@ -1,10 +1,10 @@
-const a = {
+const r = {
   classes: {
     wrapper: "transition duration-300 ease-in-out cursor-pointer inline-flex"
   },
-  styles: ({ colors: o, props: t, css: r }) => {
+  styles: ({ colors: o, props: t, css: a }) => {
     const e = o.getPalette(t.color || "gray");
-    return r.variables({
+    return a.variables({
       text: t.color ? e[600] : "",
       hover: {
         text: t.shadow ? "" : e[700]
@@ -19,7 +19,7 @@ const a = {
       }
     });
   }
-}, s = a;
+}, s = r;
 export {
   s as default
 };

package/lib/components/link/theme/Link.carbon.theme.d.ts

@@ -0,0 +1,3 @@
+import type { LinkTheme } from '../Link.vue';
+declare const theme: LinkTheme;
+export default theme;

package/lib/components/link/theme/Link.carbon.theme.js

@@ -0,0 +1,5 @@
+import e from "./Link.base.theme.js";
+const t = e, o = t;
+export {
+  o as default
+};

package/lib/components/loader/Loader.vue.d.ts

@@ -0,0 +1,49 @@
+import type { ExtractPublicPropTypes, PropType } from 'vue';
+import { type ThemeComponent } from '../../composables/useTheme';
+declare const loaderProps: {
+    status: {
+        type: PropType<LoaderStatus>;
+        default: string;
+    };
+    icon: StringConstructor;
+    label: StringConstructor;
+    size: {
+        readonly type: PropType<import("../../composables/useCommon").Size>;
+        readonly default: "md";
+        readonly validator: (value: string) => boolean;
+    };
+};
+export type LoaderStatus = 'active' | 'success' | 'error';
+export type LoaderProps = ExtractPublicPropTypes<typeof loaderProps>;
+type InternalClasses = 'wrapper' | 'iconSuccess' | 'iconError' | 'label';
+export interface LoaderTheme extends ThemeComponent<LoaderProps, InternalClasses> {
+}
+declare const _default: import("vue").DefineComponent<{
+    status: {
+        type: PropType<LoaderStatus>;
+        default: string;
+    };
+    icon: StringConstructor;
+    label: StringConstructor;
+    size: {
+        readonly type: PropType<import("../../composables/useCommon").Size>;
+        readonly default: "md";
+        readonly validator: (value: string) => boolean;
+    };
+}, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    status: {
+        type: PropType<LoaderStatus>;
+        default: string;
+    };
+    icon: StringConstructor;
+    label: StringConstructor;
+    size: {
+        readonly type: PropType<import("../../composables/useCommon").Size>;
+        readonly default: "md";
+        readonly validator: (value: string) => boolean;
+    };
+}>>, {
+    size: import("../../composables/useCommon").Size;
+    status: LoaderStatus;
+}, {}>;
+export default _default;

package/lib/components/loader/Loader.vue.js

@@ -0,0 +1,54 @@
+import { defineComponent as d, openBlock as o, createElementBlock as t, normalizeClass as a, unref as e, normalizeStyle as z, createBlock as i, createCommentVNode as n, toDisplayString as y } from "vue";
+import { useCommon as l } from "../../composables/useCommon.js";
+import { useTheme as k } from "../../composables/useTheme.js";
+import c from "../icon/Icon.vue.js";
+import v from "../spinner/Spinner.vue.js";
+import { successIcon as S, errorIcon as b } from "../../common/icons.js";
+const g = {
+  ...l.props(),
+  status: {
+    type: String,
+    default: "active"
+  },
+  icon: String,
+  label: String
+}, C = {
+  name: "XLoader",
+  validators: {
+    ...l.validators(),
+    status: ["active", "success", "error"]
+  }
+}, $ = /* @__PURE__ */ d({
+  ...C,
+  props: g,
+  setup(m) {
+    const u = m, { styles: p, classes: r, className: f } = k("Loader", {}, u);
+    return (s, B) => (o(), t("div", {
+      class: a([e(f), e(r).wrapper]),
+      style: z(e(p))
+    }, [
+      s.status === "active" ? (o(), i(v, {
+        key: 0,
+        size: s.size,
+        icon: s.icon
+      }, null, 8, ["size", "icon"])) : s.status === "success" ? (o(), i(c, {
+        key: 1,
+        class: a(e(r).iconSuccess),
+        size: s.size,
+        icon: e(S)
+      }, null, 8, ["class", "size", "icon"])) : s.status === "error" ? (o(), i(c, {
+        key: 2,
+        class: a(e(r).iconError),
+        size: s.size,
+        icon: e(b)
+      }, null, 8, ["class", "size", "icon"])) : n("", !0),
+      s.label ? (o(), t("span", {
+        key: 3,
+        class: a(e(r).label)
+      }, y(s.label), 3)) : n("", !0)
+    ], 6));
+  }
+});
+export {
+  $ as default
+};

package/lib/components/loader/Loader.vue2.js

@@ -0,0 +1,4 @@
+import f from "./Loader.vue.js";
+export {
+  f as default
+};

package/lib/components/loader/__tests__/Loader.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/lib/components/loader/index.d.ts

@@ -0,0 +1,2 @@
+export { default as XLoader } from './Loader.vue';
+export type { LoaderProps, LoaderTheme } from './Loader.vue';

package/lib/components/loader/theme/Loader.base.theme.d.ts

@@ -0,0 +1,3 @@
+import type { LoaderTheme } from '../Loader.vue';
+declare const theme: LoaderTheme;
+export default theme;

package/lib/components/loader/theme/Loader.base.theme.js

@@ -0,0 +1,11 @@
+const e = {
+  classes: {
+    wrapper: "inline-flex items-center justify-center",
+    iconSuccess: "text-green-500",
+    iconError: "text-red-500",
+    label: "mx-2 text-sm"
+  }
+}, t = e;
+export {
+  t as default
+};

package/lib/components/loader/theme/Loader.carbon.theme.d.ts

@@ -0,0 +1,3 @@
+import type { LoaderTheme } from '../Loader.vue';
+declare const theme: LoaderTheme;
+export default theme;

package/lib/components/loader/theme/Loader.carbon.theme.js

@@ -0,0 +1,11 @@
+const e = {
+  classes: {
+    wrapper: "inline-flex items-center justify-center",
+    iconSuccess: "text-green-500",
+    iconError: "text-red-500",
+    label: "mx-1 text-sm"
+  }
+}, t = e;
+export {
+  t as default
+};

package/lib/components/menu/Menu.vue.d.ts

@@ -1,5 +1,6 @@
 import type { ExtractPublicPropTypes, PropType } from 'vue';
-import { type Size } from '../../composables/common';
+import { type Size } from '../../composables/useCommon';
+import { type ThemeComponent } from '../../composables/useTheme';
 declare const menuProps: {
     items: PropType<MenuArrayItem[]>;
     collapsible: {
@@ -52,6 +53,9 @@ export type MenuArrayItem = {
     onClick?: (e: MouseEvent) => void;
 };
 export type MenuProps = ExtractPublicPropTypes<typeof menuProps>;
+type InternalClasses = 'wrapper';
+export interface MenuTheme extends ThemeComponent<MenuProps, InternalClasses> {
+}
 declare const _default: import("vue").DefineComponent<{
     items: PropType<MenuArrayItem[]>;
     collapsible: {
@@ -107,11 +111,11 @@ declare const _default: import("vue").DefineComponent<{
 }>> & {
     onExpand?: ((...args: any[]) => any) | undefined;
 }, {
-    disabled: boolean;
-    color: string;
     size: Size;
-    rounded: boolean;
     filled: boolean;
+    color: string;
+    rounded: boolean;
+    disabled: boolean;
     expanded: boolean;
     collapsible: boolean;
 }, {}>;

package/lib/components/menu/Menu.vue.js

@@ -1,12 +1,11 @@
-import { defineComponent as B, resolveComponent as t, openBlock as o, createElementBlock as s, normalizeStyle as C, unref as p, normalizeClass as r, Fragment as n, renderList as g, createBlock as u, withCtx as b, createVNode as i, createCommentVNode as E } from "vue";
-import { useCommon as m } from "../../composables/common.js";
-import { useColors as w } from "../../composables/colors.js";
-import { useTheme as N } from "../../composables/theme.js";
+import { defineComponent as B, resolveComponent as C, openBlock as o, createElementBlock as s, normalizeStyle as g, unref as p, normalizeClass as r, Fragment as n, renderList as E, createBlock as u, withCtx as b, createVNode as i, createCommentVNode as t } from "vue";
+import { useCommon as m } from "../../composables/useCommon.js";
+import { useColors as w } from "../../composables/useColors.js";
+import { useTheme as M } from "../../composables/useTheme.js";
 import f from "./MenuItem.vue.js";
-import A from "../collapse/Collapse.vue.js";
-import M from "../divider/Divider.vue.js";
-import S from "./Menu.theme.js";
-const V = {
+import N from "../collapse/Collapse.vue.js";
+import A from "../divider/Divider.vue.js";
+const S = {
   ...m.props(),
   ...w.props("primary"),
   items: Array,
@@ -25,31 +24,31 @@ const V = {
     type: Boolean,
     default: !0
   }
-}, X = {
+}, V = {
   name: "XMenu",
   validators: {
     ...m.validators()
   }
-}, J = /* @__PURE__ */ B({
-  ...X,
-  props: V,
+}, G = /* @__PURE__ */ B({
+  ...V,
+  props: S,
   emits: ["expand"],
-  setup(y, { emit: F }) {
-    const z = y, { styles: k, classes: v, className: I } = N("menu", S, z);
+  setup(y) {
+    const z = y, { styles: k, classes: v, className: I } = M("Menu", {}, z);
     return (e, d) => {
-      const c = t("x-menu");
+      const c = C("x-menu");
       return e.items ? (o(), s("div", {
         key: 0,
-        style: C(p(k)),
+        style: g(p(k)),
         class: r([
           "space-y-1",
           p(I),
           p(v).wrapper
         ])
       }, [
-        (o(!0), s(n, null, g(e.items, (l, $) => (o(), s(n, { key: $ }, [
+        (o(!0), s(n, null, E(e.items, (l, $) => (o(), s(n, { key: $ }, [
           l.items ? (o(), s(n, { key: 0 }, [
-            l.collapsible !== !1 ? (o(), u(A, {
+            l.collapsible !== !1 ? (o(), u(N, {
               key: 0,
               icon: l.collapseIcon || e.collapseIcon,
               expanded: l.expanded || e.expanded,
@@ -81,7 +80,7 @@ const V = {
                   disabled: e.disabled || l.disabled,
                   rounded: e.rounded,
                   filled: e.filled,
-                  onExpand: (L) => a(!1)
+                  onExpand: (X) => a(!1)
                 }, null, 8, ["class", "items", "color", "size", "collapsible", "collapse-icon", "expanded", "disabled", "rounded", "filled", "onExpand"])
               ]),
               _: 2
@@ -111,7 +110,7 @@ const V = {
               }, null, 8, ["class", "items", "color", "size", "collapsible", "collapse-icon", "expanded", "disabled", "rounded", "filled"])
             ], 64))
           ], 64)) : (o(), s(n, { key: 1 }, [
-            l.divider ? (o(), u(M, { key: 0 })) : (o(), u(f, {
+            l.divider ? (o(), u(A, { key: 0 })) : (o(), u(f, {
               key: 1,
               item: l,
               rounded: e.rounded,
@@ -124,10 +123,10 @@ const V = {
             }, null, 8, ["item", "rounded", "color", "filled", "size", "disabled", "class"]))
           ], 64))
         ], 64))), 128))
-      ], 6)) : E("", !0);
+      ], 6)) : t("", !0);
     };
   }
 });
 export {
-  J as default
+  G as default
 };

package/lib/components/menu/MenuItem.vue.d.ts

@@ -1,4 +1,5 @@
-import { type ExtractPublicPropTypes, type PropType } from 'vue';
+import { type ExtractPublicPropTypes, type PropType, type Ref } from 'vue';
+import { type ThemeComponent } from '../../composables/useTheme';
 import type { MenuArrayItem } from './Menu.vue';
 declare const menuItemProps: {
     item: {
@@ -35,12 +36,18 @@ declare const menuItemProps: {
         readonly default: string | undefined;
     };
     size: {
-        readonly type: PropType<import("../../composables/common").Size>;
+        readonly type: PropType<import("../../composables/useCommon").Size>;
         readonly default: "md";
         readonly validator: (value: string) => boolean;
     };
 };
 export type MenuItemProps = ExtractPublicPropTypes<typeof menuItemProps>;
+type InternalClasses = 'wrapper';
+type InternalExtraData = {
+    isActive: Ref<boolean>;
+};
+export interface MenuItemTheme extends ThemeComponent<MenuItemProps, InternalClasses, InternalExtraData> {
+}
 declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
     item: {
         type: PropType<MenuArrayItem>;
@@ -76,7 +83,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
         readonly default: string | undefined;
     };
     size: {
-        readonly type: PropType<import("../../composables/common").Size>;
+        readonly type: PropType<import("../../composables/useCommon").Size>;
         readonly default: "md";
         readonly validator: (value: string) => boolean;
     };
@@ -115,7 +122,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
         readonly default: string | undefined;
     };
     size: {
-        readonly type: PropType<import("../../composables/common").Size>;
+        readonly type: PropType<import("../../composables/useCommon").Size>;
         readonly default: "md";
         readonly validator: (value: string) => boolean;
     };
@@ -124,15 +131,15 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
     onActive?: ((...args: any[]) => any) | undefined;
 }, {
     active: boolean;
-    disabled: boolean;
+    size: import("../../composables/useCommon").Size;
+    filled: boolean;
     color: string;
-    size: import("../../composables/common").Size;
-    exact: boolean;
     rounded: boolean;
+    item: MenuArrayItem;
+    disabled: boolean;
     loading: boolean;
-    filled: boolean;
     attrs: Record<string, any>;
-    item: MenuArrayItem;
+    exact: boolean;
     selected: boolean;
 }, {}>, {
     prefix?(_: {}): any;

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

@@ -3,7 +3,7 @@ import o from "./MenuItem.vue3.js";
 import t from "../../_virtual/_plugin-vue_export-helper.js";
 const e = {
   $style: o
-}, _ = /* @__PURE__ */ t(s, [["__cssModules", e], ["__scopeId", "data-v-4f3fa5ad"]]);
+}, c = /* @__PURE__ */ t(s, [["__cssModules", e], ["__scopeId", "data-v-458822a0"]]);
 export {
-  _ as default
+  c as default
 };

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

@@ -1,17 +1,16 @@
-import { defineComponent as z, ref as m, computed as p, onMounted as S, watch as d, openBlock as l, createBlock as r, resolveDynamicComponent as x, mergeProps as N, unref as i, withCtx as R, createElementBlock as s, renderSlot as n, createCommentVNode as k, createElementVNode as h, createTextVNode as P, toDisplayString as w, Fragment as D } from "vue";
-import { useMutationObserver as F } from "../../node_modules/.pnpm/@vueuse_core@10.2.0_vue@3.3.4/node_modules/@vueuse/core/index.js";
-import { useColors as I } from "../../composables/colors.js";
-import { useCommon as y } from "../../composables/common.js";
-import { useTheme as M } from "../../composables/theme.js";
-import g from "../icon/Icon.vue.js";
-import O from "../spinner/Spinner.vue.js";
-import T from "./MenuItem.theme.js";
+import { defineComponent as S, ref as m, computed as p, onMounted as x, watch as d, openBlock as l, createBlock as i, resolveDynamicComponent as N, mergeProps as R, unref as s, withCtx as I, createElementBlock as r, renderSlot as n, createCommentVNode as k, createElementVNode as g, createTextVNode as M, toDisplayString as P, Fragment as w } from "vue";
+import { useMutationObserver as D } from "../../node_modules/.pnpm/@vueuse_core@10.2.0_vue@3.3.9/node_modules/@vueuse/core/index.js";
+import { useColors as F } from "../../composables/useColors.js";
+import { useCommon as y } from "../../composables/useCommon.js";
+import { useTheme as O } from "../../composables/useTheme.js";
+import h from "../icon/Icon.vue.js";
+import T from "../spinner/Spinner.vue.js";
 const V = {
   key: 0,
   class: "mr-2 shrink-0"
 }, j = { class: "flex-1 truncate" }, E = { class: "ml-1 shrink-0" }, A = { key: 0 }, L = {
   ...y.props(),
-  ...I.props("primary"),
+  ...F.props("primary"),
   item: {
     type: Object,
     default: () => {
@@ -48,27 +47,27 @@ const V = {
   validators: {
     ...y.validators()
   }
-}, Z = /* @__PURE__ */ z({
+}, Y = /* @__PURE__ */ S({
   ...X,
   props: L,
   emits: ["active", "click"],
-  setup($, { emit: u }) {
-    const c = $, o = m(), a = m(!1), e = p(() => ({
-      ...c,
-      ...c.item
+  setup($, { emit: _ }) {
+    const u = $, c = _, o = m(), a = m(!1), e = p(() => ({
+      ...u,
+      ...u.item
     })), v = p(() => e.value.to ? "router-link" : e.value.href ? "a" : "div");
-    S(() => {
-      o.value && (f(), v.value === "router-link" && F(o.value.$el, f, {
+    x(() => {
+      o.value && (f(), v.value === "router-link" && D(o.value.$el, f, {
         attributes: !0,
         attributeFilter: ["class"]
       }));
     });
-    function _(t) {
+    function b(t) {
       if (e.value.disabled) {
         t.stopPropagation(), t.preventDefault();
         return;
       }
-      e.value.onClick && e.value.onClick(t), u("click", t);
+      e.value.onClick && e.value.onClick(t), c("click", t);
     }
     function f() {
       if (o.value && o.value.$el && (e.value.href || e.value.to)) {
@@ -78,12 +77,12 @@ const V = {
         a.value = !!e.value.active;
     }
     d(() => a.value, (t) => {
-      t && u("active");
+      t && c("active");
     }), d(() => e.value.active, (t) => {
       a.value = !!t;
     });
-    const { styles: b, classes: C, className: B } = M("menu-item", T, e, { isActive: a });
-    return (t, q) => (l(), r(x(v.value), N({
+    const { styles: C, classes: B, className: z } = O("MenuItem", {}, e, { isActive: a });
+    return (t, q) => (l(), i(N(v.value), R({
       ref_key: "elRef",
       ref: o
     }, e.value.attrs, {
@@ -91,42 +90,42 @@ const V = {
       href: e.value.href,
       target: e.value.target,
       color: e.value.color,
-      style: i(b),
+      style: s(C),
       class: [
-        i(B),
+        s(z),
         t.$style["menu-item"],
         [a.value ? t.$style["menu-item--active"] : ""],
-        i(C).wrapper,
+        s(B).wrapper,
         {
           "flex items-center": t.$slots.prefix || t.$slots.suffix
         }
       ],
       title: e.value.label,
       alt: e.value.label,
-      onClick: _
+      onClick: b
     }), {
-      default: R(() => [
-        t.$slots.prefix ? (l(), s("span", V, [
+      default: I(() => [
+        t.$slots.prefix ? (l(), r("span", V, [
           n(t.$slots, "prefix", {}, void 0, !0)
-        ])) : e.value.icon ? (l(), r(g, {
+        ])) : e.value.icon ? (l(), i(h, {
           key: 1,
           size: e.value.size,
           icon: e.value.icon,
           class: "mr-2"
         }, null, 8, ["size", "icon"])) : k("", !0),
-        h("span", j, [
+        g("span", j, [
           n(t.$slots, "default", {}, () => [
-            P(w(e.value.label), 1)
+            M(P(e.value.label), 1)
           ], !0)
         ]),
-        h("span", E, [
-          e.value.loading ? (l(), r(O, {
+        g("span", E, [
+          e.value.loading ? (l(), i(T, {
             key: 0,
             size: e.value.size
-          }, null, 8, ["size"])) : (l(), s(D, { key: 1 }, [
-            t.$slots.suffix ? (l(), s("span", A, [
+          }, null, 8, ["size"])) : (l(), r(w, { key: 1 }, [
+            t.$slots.suffix ? (l(), r("span", A, [
               n(t.$slots, "suffix", {}, void 0, !0)
-            ])) : e.value.iconRight ? (l(), r(g, {
+            ])) : e.value.iconRight ? (l(), i(h, {
               key: 1,
               size: e.value.size,
               icon: e.value.iconRight
@@ -139,5 +138,5 @@ const V = {
   }
 });
 export {
-  Z as default
+  Y as default
 };

package/lib/components/menu/index.d.ts

@@ -1,6 +1,4 @@
 export { default as XMenu } from './Menu.vue';
-export type { MenuProps, MenuArrayItem } from './Menu.vue';
-export type { MenuTheme } from './Menu.theme';
+export type { MenuProps, MenuArrayItem, MenuTheme } from './Menu.vue';
 export { default as XMenuItem } from './MenuItem.vue';
-export type { MenuItemProps } from './MenuItem.vue';
-export type { MenuItemTheme } from './MenuItem.theme';
+export type { MenuItemProps, MenuItemTheme } from './MenuItem.vue';

package/lib/components/menu/theme/Menu.base.theme.d.ts

@@ -0,0 +1,3 @@
+import type { MenuTheme } from '../Menu.vue';
+declare const theme: MenuTheme;
+export default theme;

package/lib/components/menu/theme/Menu.carbon.theme.d.ts

@@ -0,0 +1,3 @@
+import type { MenuTheme } from '../Menu.vue';
+declare const theme: MenuTheme;
+export default theme;

package/lib/components/menu/theme/Menu.carbon.theme.js

@@ -0,0 +1,5 @@
+import e from "./Menu.base.theme.js";
+const t = e, o = t;
+export {
+  o as default
+};

package/lib/components/menu/theme/MenuItem.base.theme.d.ts

@@ -0,0 +1,3 @@
+import type { MenuItemTheme } from '../MenuItem.vue';
+declare const theme: MenuItemTheme;
+export default theme;

package/lib/components/menu/theme/MenuItem.carbon.theme.d.ts

@@ -0,0 +1,3 @@
+import type { MenuItemTheme } from '../MenuItem.vue';
+declare const theme: MenuItemTheme;
+export default theme;

package/lib/components/menu/theme/MenuItem.carbon.theme.js

@@ -0,0 +1,5 @@
+import e from "./MenuItem.base.theme.js";
+const t = e, o = t;
+export {
+  o as default
+};

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

@@ -1,4 +1,5 @@
 import { type PropType, type ExtractPublicPropTypes } from 'vue';
+import { type ThemeComponent } from '../../composables/useTheme';
 declare const modalSize: readonly ["xs", "sm", "md", "lg", "xl", "full"];
 declare const modalProps: {
     size: {
@@ -11,6 +12,9 @@ declare const modalProps: {
 };
 export type ModalSize = typeof modalSize[number];
 export type ModalProps = ExtractPublicPropTypes<typeof modalProps>;
+type InternalClasses = 'wrapper' | 'backdrop' | 'modal' | 'closeIcon' | 'header' | 'content' | 'actions';
+export interface ModalTheme extends ThemeComponent<ModalProps, InternalClasses> {
+}
 declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
     size: {
         type: PropType<"xs" | "sm" | "md" | "lg" | "xl" | "full">;