@indielayer/ui 0.0.0-dev-20240129122517 → 0.0.0-dev-20240205224808

package/lib/components/label/Label.vue.d.ts

@@ -10,6 +10,7 @@ declare const labelProps: {
         type: StringConstructor;
         default: string;
     };
+    tooltip: StringConstructor;
     size: {
         readonly type: import("vue").PropType<import("../../composables/useCommon").Size>;
         readonly default: "md";
@@ -30,6 +31,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
         type: StringConstructor;
         default: string;
     };
+    tooltip: StringConstructor;
     size: {
         readonly type: import("vue").PropType<import("../../composables/useCommon").Size>;
         readonly default: "md";
@@ -45,6 +47,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
         type: StringConstructor;
         default: string;
     };
+    tooltip: StringConstructor;
     size: {
         readonly type: import("vue").PropType<import("../../composables/useCommon").Size>;
         readonly default: "md";

package/lib/components/label/Label.vue.js

@@ -1,8 +1,9 @@
-import { defineComponent as u, openBlock as o, createBlock as t, resolveDynamicComponent as s, normalizeStyle as f, unref as l, normalizeClass as r, withCtx as n, createTextVNode as b, toDisplayString as y, createCommentVNode as g, renderSlot as B } from "vue";
+import { defineComponent as f, openBlock as o, createBlock as t, resolveDynamicComponent as s, normalizeStyle as b, unref as l, normalizeClass as n, withCtx as r, createElementVNode as y, toDisplayString as g, createCommentVNode as i, renderSlot as B } from "vue";
 import { useTheme as C } from "../../composables/useTheme.js";
-import { useCommon as i } from "../../composables/useCommon.js";
-const S = {
-  ...i.props(),
+import { useCommon as p } from "../../composables/useCommon.js";
+import S from "../tooltip/ToggleTip.vue.js";
+const k = {
+  ...p.props(),
   label: String,
   disabled: Boolean,
   required: Boolean,
@@ -11,32 +12,37 @@ const S = {
   tag: {
     type: String,
     default: "label"
-  }
-}, k = {
+  },
+  tooltip: String
+}, _ = {
   name: "XLabel",
   validators: {
-    ...i.validators()
+    ...p.validators()
   }
-}, w = /* @__PURE__ */ u({
-  ...k,
-  props: S,
+}, D = /* @__PURE__ */ f({
+  ..._,
+  props: k,
   setup(m) {
-    const p = m, { styles: d, classes: a, className: c } = C("Label", {}, p);
-    return (e, _) => (o(), t(s(e.tag), {
-      style: f(l(d)),
-      class: r([l(c), l(a).wrapper])
+    const d = m, { styles: c, classes: a, className: u } = C("Label", {}, d);
+    return (e, h) => (o(), t(s(e.tag), {
+      style: b(l(c)),
+      class: n([l(u), l(a).wrapper])
     }, {
-      default: n(() => [
+      default: r(() => [
         e.label ? (o(), t(s(e.tag === "fieldset" ? "legend" : "p"), {
           key: 0,
           title: e.label,
-          class: r(l(a).label)
+          class: n(l(a).label)
         }, {
-          default: n(() => [
-            b(y(e.label), 1)
+          default: r(() => [
+            y("span", null, g(e.label), 1),
+            e.tooltip ? (o(), t(S, {
+              key: 0,
+              content: e.tooltip
+            }, null, 8, ["content"])) : i("", !0)
           ]),
           _: 1
-        }, 8, ["title", "class"])) : g("", !0),
+        }, 8, ["title", "class"])) : i("", !0),
         B(e.$slots, "default")
       ]),
       _: 3
@@ -44,5 +50,5 @@ const S = {
   }
 });
 export {
-  w as default
+  D as default
 };

package/lib/components/label/theme/Label.base.theme.js

@@ -2,10 +2,10 @@ const s = {
   classes: {
     wrapper: ({ props: t }) => {
       const e = ["block relative align-bottom focus:outline-none"];
-      return t.isInsideForm && e.push("mb-3"), t.block && e.push("w-full"), e;
+      return t.isInsideForm && e.push("mb-4"), t.block && e.push("w-full"), e;
     },
     label: ({ props: t }) => {
-      const e = "font-medium text-gray-800 dark:text-gray-200 mb-1";
+      const e = "flex items-center gap-2 font-medium text-secondary-800 dark:text-secondary-200 mb-1";
       return t.size === "xs" ? e + " text-xs" : t.size === "sm" ? e + " text-sm" : t.size === "lg" ? e + " text-lg" : t.size === "xl" ? e + " text-xl" : e;
     }
   }

package/lib/components/label/theme/Label.carbon.theme.js

@@ -4,9 +4,9 @@ const s = {
       const e = ["block relative align-bottom focus:outline-none"];
       return t.isInsideForm && e.push("mb-8"), t.block && e.push("w-full"), e;
     },
-    label: "text-xs text-gray-500 dark:text-gray-200 mb-2"
+    label: "text-xs text-secondary-500 dark:text-secondary-200 mb-2"
   }
-}, l = s;
+}, o = s;
 export {
-  l as default
+  o as default
 };

package/lib/components/link/Link.vue.js

@@ -3,7 +3,7 @@ import o from "./Link.vue3.js";
 import t from "../../_virtual/_plugin-vue_export-helper.js";
 const e = {
   $style: o
-}, c = /* @__PURE__ */ t(s, [["__cssModules", e], ["__scopeId", "data-v-37edea5a"]]);
+}, m = /* @__PURE__ */ t(s, [["__cssModules", e], ["__scopeId", "data-v-81a39d2b"]]);
 export {
-  c as default
+  m as default
 };

package/lib/components/link/Link.vue2.js

@@ -1,4 +1,4 @@
-import { defineComponent as m, openBlock as n, createBlock as p, resolveDynamicComponent as u, normalizeStyle as d, unref as o, normalizeClass as c, withCtx as f, createElementBlock as k, renderSlot as t, createVNode as y } from "vue";
+import { defineComponent as m, openBlock as n, createBlock as p, resolveDynamicComponent as d, normalizeStyle as u, unref as o, normalizeClass as c, withCtx as f, createElementBlock as k, renderSlot as t, createVNode as y } from "vue";
 import { useColors as h } from "../../composables/useColors.js";
 import { useTheme as g } from "../../composables/useTheme.js";
 import { externalIcon as B } from "../../common/icons.js";
@@ -7,7 +7,7 @@ const C = {
   key: 0,
   class: "inline-flex items-center"
 }, $ = {
-  ...h.props("primary"),
+  ...h.props("secondary"),
   tag: {
     type: String,
     default: "a"
@@ -21,9 +21,9 @@ const C = {
   props: $,
   setup(s) {
     const l = s, { styles: r, classes: a, className: i } = g("Link", {}, l);
-    return (e, v) => (n(), p(u(e.to ? e.tag !== "a" ? e.tag : "router-link" : e.tag), {
+    return (e, v) => (n(), p(d(e.to ? e.tag !== "a" ? e.tag : "router-link" : e.tag), {
       to: e.to,
-      style: d(o(r)),
+      style: u(o(r)),
       class: c([
         o(i),
         e.$style.link,

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

@@ -2,7 +2,7 @@ const e = {
   classes: {
     wrapper: "inline-flex items-center justify-center",
     iconSuccess: "text-green-500",
-    iconError: "text-red-500",
+    iconError: "text-error-500",
     label: "mx-2 text-sm"
   }
 }, t = e;

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

@@ -2,7 +2,7 @@ const e = {
   classes: {
     wrapper: "inline-flex items-center justify-center",
     iconSuccess: "text-green-500",
-    iconError: "text-red-500",
+    iconError: "text-error-500",
     label: "mx-2 text-sm"
   }
 }, t = e;

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

@@ -1,13 +1,13 @@
-import { defineComponent as C, resolveComponent as B, openBlock as d, createElementBlock as n, normalizeStyle as g, unref as p, normalizeClass as r, Fragment as a, renderList as E, createBlock as u, withCtx as c, createVNode as i, createCommentVNode as w } from "vue";
+import { defineComponent as C, resolveComponent as B, openBlock as d, createElementBlock as n, normalizeStyle as E, unref as p, normalizeClass as i, Fragment as a, renderList as w, createBlock as u, withCtx as b, createVNode as r, createCommentVNode as M } from "vue";
 import { useCommon as m } from "../../composables/useCommon.js";
-import { useColors as M } from "../../composables/useColors.js";
-import { useTheme as N } from "../../composables/useTheme.js";
-import f from "./MenuItem.vue.js";
+import { useColors as N } from "../../composables/useColors.js";
+import { useTheme as g } from "../../composables/useTheme.js";
+import c from "./MenuItem.vue.js";
 import A from "../accordion/AccordionItem.vue.js";
 import S from "../divider/Divider.vue.js";
 const V = {
   ...m.props(),
-  ...M.props("primary"),
+  ...N.props("secondary"),
   items: Array,
   collapsible: {
     type: Boolean,
@@ -34,19 +34,19 @@ const V = {
   props: V,
   emits: ["expand", "item-click"],
   setup(y) {
-    const z = y, { styles: k, classes: v, className: $ } = N("Menu", {}, z);
+    const z = y, { styles: k, classes: v, className: $ } = g("Menu", {}, z);
     return (e, o) => {
-      const b = B("x-menu");
+      const f = B("x-menu");
       return e.items ? (d(), n("div", {
         key: 0,
-        style: g(p(k)),
-        class: r([
+        style: E(p(k)),
+        class: i([
           "space-y-1",
           p($),
           p(v).wrapper
         ])
       }, [
-        (d(!0), n(a, null, E(e.items, (l, t) => (d(), n(a, { key: t }, [
+        (d(!0), n(a, null, w(e.items, (l, t) => (d(), n(a, { key: t }, [
           l.items ? (d(), n(a, { key: 0 }, [
             l.collapsible !== !1 ? (d(), u(A, {
               key: 0,
@@ -57,20 +57,20 @@ const V = {
               class: "x-menu-inner space-y-1",
               onExpand: o[1] || (o[1] = (s) => e.$emit("expand"))
             }, {
-              default: c(({}) => [
-                i(f, {
+              default: b(({}) => [
+                r(c, {
                   item: l,
                   rounded: e.rounded,
                   color: l.color || e.color,
                   filled: l.filled || e.filled,
                   size: l.size || e.size,
                   disabled: e.disabled || l.disabled,
-                  class: "pr-10 font-medium"
+                  class: "font-medium"
                 }, null, 8, ["item", "rounded", "color", "filled", "size", "disabled"])
               ]),
-              content: c(({ expand: s }) => [
-                i(b, {
-                  class: r(["border-l ml-4 border-gray-100 dark:border-gray-700", { "pl-1": e.filled }]),
+              content: b(({ expand: s }) => [
+                r(f, {
+                  class: i(["border-l ml-4 border-secondary-100 dark:border-secondary-700", { "pl-1": e.filled }]),
                   items: l.items,
                   color: l.color || e.color,
                   size: l.size || e.size,
@@ -86,7 +86,7 @@ const V = {
               ]),
               _: 2
             }, 1032, ["icon", "expanded", "disabled", "show-icon"])) : (d(), n(a, { key: 1 }, [
-              i(f, {
+              r(c, {
                 item: l,
                 rounded: e.rounded,
                 color: l.color || e.color,
@@ -97,8 +97,8 @@ const V = {
                 inactive: "",
                 onClick: o[2] || (o[2] = (s) => e.$emit("item-click"))
               }, null, 8, ["item", "rounded", "color", "filled", "size", "disabled"]),
-              i(b, {
-                class: r(["x-menu-inner space-y-1 ml-4 border-l border-gray-100 dark:border-gray-700", { "pl-1": e.filled }]),
+              r(f, {
+                class: i(["x-menu-inner space-y-1 ml-4 border-l border-secondary-100 dark:border-secondary-700", { "pl-1": e.filled }]),
                 items: l.items,
                 color: l.color || e.color,
                 size: l.size || e.size,
@@ -112,7 +112,7 @@ const V = {
               }, null, 8, ["class", "items", "color", "size", "collapsible", "collapse-icon", "expanded", "disabled", "rounded", "filled"])
             ], 64))
           ], 64)) : (d(), n(a, { key: 1 }, [
-            l.divider ? (d(), u(S, { key: 0 })) : (d(), u(f, {
+            l.divider ? (d(), u(S, { key: 0 })) : (d(), u(c, {
               key: 1,
               item: l,
               rounded: e.rounded,
@@ -120,13 +120,13 @@ const V = {
               filled: l.filled || e.filled,
               size: l.size || e.size,
               disabled: e.disabled || l.disabled,
-              class: r({ "my-2": l.divider }),
+              class: i({ "my-2": l.divider }),
               onClick: o[4] || (o[4] = (s) => e.$emit("item-click")),
               onActive: o[5] || (o[5] = (s) => e.$emit("expand"))
             }, null, 8, ["item", "rounded", "color", "filled", "size", "disabled", "class"]))
           ], 64))
         ], 64))), 128))
-      ], 6)) : w("", !0);
+      ], 6)) : M("", !0);
     };
   }
 });

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

@@ -1,58 +1,48 @@
-const x = {
+const l = {
   classes: {
-    wrapper: ({ props: r, data: a }) => {
-      const i = ["relative !flex items-center whitespace-nowrap px-3"];
-      return i.push({
-        "font-medium": a.isActive,
-        "cursor-pointer": !r.disabled,
-        // size
-        "py-1 text-xs": r.size === "xs",
-        "py-2 text-sm": r.size === "sm",
-        "py-1.5": !r.size || !["xs", "sm", "lg", "xl"].includes(r.size),
-        "py-3": r.size === "lg",
-        "py-4 text-lg": r.size === "xl",
-        rounded: r.rounded
-      }), i;
+    wrapper: ({ props: i, data: s }) => {
+      const r = ["relative !flex items-center whitespace-nowrap px-3"];
+      return i.disabled || r.push("cursor-pointer"), s.isActive && r.push("font-medium"), i.rounded && r.push("rounded"), i.size === "xs" ? r.push("py-1 text-xs") : i.size === "sm" ? r.push("py-1.5 text-sm") : i.size === "lg" ? r.push("py-3") : i.size === "xl" ? r.push("py-4 text-lg") : r.push("py-1.5"), r;
     }
   },
-  styles: ({ colors: r, props: a, css: i, data: l }) => {
-    const e = r.getPalette(a.color || "gray"), t = r.getPalette("gray");
-    return a.disabled ? i.variables({
+  styles: ({ colors: i, props: s, css: r, data: a }) => {
+    const e = i.getPalette(s.color || "gray"), t = i.getPalette("secondary");
+    return s.disabled ? r.variables({
       text: t[300],
       dark: {
         text: t[600]
       }
-    }) : a.filled ? l.isActive ? i.variables({
-      bg: a.selected ? e[100] : e[50],
-      text: e[500],
+    }) : s.filled ? a.isActive ? r.variables({
+      bg: s.selected ? e[100] : e[200],
+      text: e[800],
       hover: {
-        bg: a.selected ? e[100] : e[50],
-        text: e[500]
+        bg: (s.selected, e[200]),
+        text: e[800]
       },
       dark: {
-        bg: (a.selected, e[700]),
+        bg: (s.selected, e[700]),
         text: e[100],
         hover: {
-          bg: (a.selected, e[700]),
+          bg: (s.selected, e[700]),
           text: e[100]
         }
       }
-    }) : i.variables({
-      bg: a.selected ? t[50] : "transparent",
+    }) : r.variables({
+      bg: s.selected ? t[100] : "transparent",
       text: t[800],
       hover: {
-        bg: t[50],
+        bg: t[100],
         text: t[900]
       },
       dark: {
-        bg: a.selected ? t[800] : "transparent",
+        bg: s.selected ? t[800] : "transparent",
         text: t[200],
         hover: {
-          bg: t[800],
+          bg: t[600],
           text: t[100]
         }
       }
-    }) : l.isActive ? i.variables({
+    }) : a.isActive ? r.variables({
       text: e[500],
       hover: {
         text: e[500],
@@ -65,7 +55,7 @@ const x = {
           border: e[500]
         }
       }
-    }) : i.variables({
+    }) : r.variables({
       text: t[800],
       hover: {
         text: t[900],
@@ -80,7 +70,7 @@ const x = {
       }
     });
   }
-}, d = x;
+}, d = l;
 export {
   d as default
 };

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

@@ -36,6 +36,7 @@ declare const modalProps: {
         type: PropType<[FormError[], FormError]>;
         default: () => never[];
     };
+    persistent: BooleanConstructor;
 };
 export type ModalSize = typeof modalSize[number];
 export type ModalProps = ExtractPublicPropTypes<typeof modalProps>;
@@ -79,6 +80,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
         type: PropType<[FormError[], FormError]>;
         default: () => never[];
     };
+    persistent: BooleanConstructor;
 }, {
     open: () => void;
     close: () => void;
@@ -116,6 +118,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
         type: PropType<[FormError[], FormError]>;
         default: () => never[];
     };
+    persistent: BooleanConstructor;
 }>> & {
     onSubmit?: ((...args: any[]) => any) | undefined;
     "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
@@ -123,15 +126,16 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
     size: "xs" | "sm" | "md" | "lg" | "xl" | "full";
     loading: boolean;
     modelValue: boolean;
+    fluid: boolean;
     backdrop: boolean;
     showClose: boolean;
     hasActions: boolean;
     hasHeader: boolean;
-    fluid: boolean;
     isForm: boolean;
     formDisabled: boolean;
     formAutoValidate: boolean;
     formErrors: [FormError[], FormError];
+    persistent: boolean;
 }, {}>, {
     image?(_: {}): any;
     header?(_: {}): any;