@indielayer/ui 1.4.0 → 1.5.0

package/lib/components/select/Select.vue.d.ts

@@ -23,6 +23,7 @@ declare const selectProps: {
         readonly type: ArrayConstructor;
         readonly default: () => never[];
     };
+    tooltip: StringConstructor;
     disabled: BooleanConstructor;
     loading: BooleanConstructor;
     loadingLabel: StringConstructor;
@@ -35,6 +36,10 @@ declare const selectProps: {
         readonly default: "md";
         readonly validator: (value: string) => boolean;
     };
+    color: {
+        readonly type: StringConstructor;
+        readonly default: string | undefined;
+    };
 };
 export type SelectOption = {
     value: number | string;
@@ -71,6 +76,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
         readonly type: ArrayConstructor;
         readonly default: () => never[];
     };
+    tooltip: StringConstructor;
     disabled: BooleanConstructor;
     loading: BooleanConstructor;
     loadingLabel: StringConstructor;
@@ -83,6 +89,10 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
         readonly default: "md";
         readonly validator: (value: string) => boolean;
     };
+    color: {
+        readonly type: StringConstructor;
+        readonly default: string | undefined;
+    };
 }, {
     focus: () => void | undefined;
     blur: () => void | undefined;
@@ -112,6 +122,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
         readonly type: ArrayConstructor;
         readonly default: () => never[];
     };
+    tooltip: StringConstructor;
     disabled: BooleanConstructor;
     loading: BooleanConstructor;
     loadingLabel: StringConstructor;
@@ -124,11 +135,16 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
         readonly default: "md";
         readonly validator: (value: string) => boolean;
     };
+    color: {
+        readonly type: StringConstructor;
+        readonly default: string | undefined;
+    };
 }>> & {
     [x: `on${Capitalize<string>}`]: ((...args: any[]) => any) | undefined;
 }, {
     disabled: boolean;
     flat: boolean;
+    color: string;
     size: import("../../composables/useCommon").Size;
     loading: boolean;
     loadingStatus: import("../loader/Loader.vue").LoaderStatus;

package/lib/components/select/Select.vue.js

@@ -1,35 +1,37 @@
-import { defineComponent as ve, ref as A, computed as I, watch as O, nextTick as U, unref as s, openBlock as a, createBlock as c, mergeProps as X, toHandlers as H, withCtx as b, createElementVNode as E, createElementBlock as o, normalizeClass as _, Fragment as p, renderList as z, createTextVNode as C, toDisplayString as m, createVNode as K, withDirectives as pe, vModelSelect as ce, renderSlot as me, createCommentVNode as ye } from "vue";
+import { defineComponent as pe, ref as A, computed as I, watch as O, nextTick as U, unref as s, openBlock as o, createBlock as c, mergeProps as X, toHandlers as H, withCtx as b, createElementVNode as C, createElementBlock as a, normalizeClass as R, Fragment as v, renderList as E, createTextVNode as z, toDisplayString as m, createVNode as K, withDirectives as ve, vModelSelect as ce, renderSlot as me, createCommentVNode as ye } from "vue";
 import { useEventListener as he } from "../../node_modules/.pnpm/@vueuse_core@10.2.0_vue@3.3.9/node_modules/@vueuse/core/index.js";
+import { useColors as be } from "../../composables/useColors.js";
 import { useCommon as G } from "../../composables/useCommon.js";
 import { useInputtable as D } from "../../composables/useInputtable.js";
 import { useInteractive as J } from "../../composables/useInteractive.js";
-import { useTheme as be } from "../../composables/useTheme.js";
-import { checkIcon as ke, selectIcon as ge } from "../../common/icons.js";
-import we from "../label/Label.vue.js";
+import { useTheme as ke } from "../../composables/useTheme.js";
+import { checkIcon as ge, selectIcon as we } from "../../common/icons.js";
+import Ae from "../label/Label.vue.js";
 import W from "../tag/Tag.vue.js";
-import Ae from "../icon/Icon.vue.js";
-import Ie from "../menu/MenuItem.vue.js";
-import _e from "../spinner/Spinner.vue.js";
-import Re from "../popover/Popover.vue.js";
-import "../popover/Popover.vue2.js";
-import Ve from "../popover/PopoverContainer.vue.js";
-import $e from "../inputFooter/InputFooter.vue.js";
+import Ie from "../icon/Icon.vue.js";
+import Re from "../menu/MenuItem.vue.js";
+import Ve from "../spinner/Spinner.vue.js";
+import _e from "../popover/Popover.vue.js";
+import "../popover/Popover.vue3.js";
+import $e from "../popover/PopoverContainer.vue.js";
+import Ce from "../inputFooter/InputFooter.vue.js";
 const Ee = { class: "relative" }, ze = {
   key: 0,
   class: "flex gap-1 flex-wrap"
-}, Ce = {
+}, Se = {
   key: 0,
-  class: "text-gray-400 dark:text-gray-500"
-}, Se = { key: 1 }, Ne = {
+  class: "text-secondary-400 dark:text-secondary-500"
+}, Ne = { key: 1 }, Oe = {
   key: 0,
   class: "flex gap-1 flex-wrap"
-}, Oe = {
+}, De = {
   key: 0,
-  class: "text-gray-400 dark:text-gray-500"
-}, De = { key: 1 }, Le = {
+  class: "text-secondary-400 dark:text-secondary-500"
+}, Le = { key: 1 }, Be = {
   key: 1,
-  class: "px-2 text-center text-gray-400"
-}, Be = ["id", "name", "disabled", "multiple", "readonly"], Te = ["value", "disabled"], xe = {
+  class: "px-2 text-center text-secondary-400"
+}, Te = ["id", "name", "disabled", "multiple", "readonly"], Fe = ["value", "disabled"], Pe = {
+  ...be.props("primary"),
   ...G.props(),
   ...J.props(),
   ...D.props(),
@@ -38,22 +40,22 @@ const Ee = { class: "relative" }, ze = {
   multiple: Boolean,
   flat: Boolean,
   native: Boolean
-}, Fe = {
+}, qe = {
   name: "XSelect",
   validators: {
     ...G.validators()
   }
-}, il = /* @__PURE__ */ ve({
-  ...Fe,
-  props: xe,
+}, nl = /* @__PURE__ */ pe({
+  ...qe,
+  props: Pe,
   emits: D.emits(),
   setup(Q, { expose: Y, emit: Z }) {
-    const r = Q, R = Z, k = A(null), S = A(null), V = A(null), f = A(null), u = A(), t = I({
+    const r = Q, V = Z, k = A(null), S = A(null), _ = A(null), f = A(null), u = A(), t = I({
       get() {
         return r.multiple ? r.modelValue ? Array.isArray(r.modelValue) ? r.modelValue : [r.modelValue] : [] : r.modelValue;
       },
       set(e) {
-        R("update:modelValue", e);
+        V("update:modelValue", e);
       }
     }), d = I(() => !r.options || r.options.length === 0 ? [] : r.options.map((e) => {
       let i = !1;
@@ -62,7 +64,7 @@ const Ee = { class: "relative" }, ze = {
         label: e.label,
         active: i,
         disabled: e.disabled,
-        iconRight: i ? ke : void 0,
+        iconRight: i ? ge : void 0,
         onClick: () => T(e.value)
       };
     })), L = I(() => {
@@ -90,10 +92,10 @@ const Ee = { class: "relative" }, ze = {
     }
     function B(e) {
       var i;
-      V.value && ((i = V.value[e]) == null || i.$el.scrollIntoView({ block: "nearest", inline: "nearest" }));
+      _.value && ((i = _.value[e]) == null || i.$el.scrollIntoView({ block: "nearest", inline: "nearest" }));
     }
     O(u, (e) => {
-      typeof e < "u" && V.value && B(e);
+      typeof e < "u" && _.value && B(e);
     });
     function N(e, i = "down") {
       if (!L.value || L.value.length === 0) {
@@ -119,41 +121,41 @@ const Ee = { class: "relative" }, ze = {
         if (r.multiple)
           if (Array.isArray(t.value)) {
             const n = t.value.indexOf(e);
-            n !== -1 ? t.value.splice(n, 1) : (t.value.push(e), R("update:modelValue", t.value));
+            n !== -1 ? t.value.splice(n, 1) : (t.value.push(e), V("update:modelValue", t.value));
           } else
             t.value = [e];
         else
           t.value = e;
         r.native || U(() => {
-          var n, v, w;
-          (n = k.value) == null || n.dispatchEvent(new Event("input")), (v = k.value) == null || v.dispatchEvent(new Event("change")), (w = S.value) == null || w.$el.focus();
+          var n, p, w;
+          (n = k.value) == null || n.dispatchEvent(new Event("input")), (p = k.value) == null || p.dispatchEvent(new Event("change")), (w = S.value) == null || w.$el.focus();
         });
       }
     }
-    function x(e) {
+    function F(e) {
       return !!(typeof e > "u" || e === null || e === "" || Array.isArray(e) && e.length === 0 || !Array.isArray(e) && typeof e == "object" && Object.keys(e).length === 0);
     }
-    function F(e, i) {
+    function P(e, i) {
       e.stopPropagation();
       const l = t.value.indexOf(i);
-      l !== -1 && (t.value.splice(l, 1), R("update:modelValue", t.value));
+      l !== -1 && (t.value.splice(l, 1), V("update:modelValue", t.value));
     }
     function $(e) {
       var l;
       const i = (l = r.options) == null ? void 0 : l.find((n) => n.value === e);
       return i ? i.label : "";
     }
-    const { focus: P, blur: le } = J(k), {
-      errorInternal: q,
+    const { focus: q, blur: le } = J(k), {
+      errorInternal: j,
       hideFooterInternal: ie,
-      inputListeners: j,
+      inputListeners: x,
       reset: te,
       validate: ne,
-      setError: ae,
+      setError: oe,
       isFocused: re,
-      isInsideForm: oe
-    } = D(r, { focus: P, emit: R, withListeners: !0 }), se = I(() => {
-      const { focus: e, blur: i } = s(j);
+      isInsideForm: ae
+    } = D(r, { focus: q, emit: V, withListeners: !0 }), se = I(() => {
+      const { focus: e, blur: i } = s(x);
       return {
         focus: e,
         blur: i
@@ -166,7 +168,7 @@ const Ee = { class: "relative" }, ze = {
       immediate: !0
     });
     function ue(e) {
-      var i, l, n, v, w;
+      var i, l, n, p, w;
       if (d.value.length !== 0)
         if (e.code === "ArrowDown") {
           if (e.preventDefault(), !y.value) {
@@ -185,15 +187,15 @@ const Ee = { class: "relative" }, ze = {
             (n = f.value) == null || n.show();
             return;
           }
-          typeof u.value < "u" && (T(d.value[u.value].value), r.multiple || (v = f.value) == null || v.hide());
+          typeof u.value < "u" && (T(d.value[u.value].value), r.multiple || (p = f.value) == null || p.hide());
         } else
           e.code === "Tab" && y.value && (e.preventDefault(), (w = f.value) == null || w.hide(), r.native || U(() => {
             var M;
             (M = S.value) == null || M.$el.focus();
           }));
     }
-    const { styles: de, classes: h, className: fe } = be("Select", {}, r, { errorInternal: q });
-    return Y({ focus: P, blur: le, reset: te, validate: ne, setError: ae }), (e, i) => (a(), c(we, X({
+    const { styles: de, classes: h, className: fe } = ke("Select", {}, r, { errorInternal: j });
+    return Y({ focus: q, blur: le, reset: te, validate: ne, setError: oe }), (e, i) => (o(), c(Ae, X({
       ref_key: "labelRef",
       ref: S,
       tabindex: "0",
@@ -204,99 +206,100 @@ const Ee = { class: "relative" }, ze = {
       style: s(de),
       disabled: e.disabled,
       required: e.required,
-      "is-inside-form": s(oe),
-      label: e.label
+      "is-inside-form": s(ae),
+      label: e.label,
+      tooltip: e.tooltip
     }, H(se.value)), {
       default: b(() => [
-        E("div", Ee, [
-          e.native && !e.multiple ? (a(), o("div", {
+        C("div", Ee, [
+          e.native && !e.multiple ? (o(), a("div", {
             key: 0,
-            class: _(s(h).box),
+            class: R(s(h).box),
             onClick: i[0] || (i[0] = (l) => {
               var n;
               return (n = k.value) == null ? void 0 : n.click();
             })
           }, [
-            e.multiple && Array.isArray(t.value) && t.value.length > 0 ? (a(), o("div", ze, [
-              (a(!0), o(p, null, z(t.value, (l) => (a(), c(W, {
+            e.multiple && Array.isArray(t.value) && t.value.length > 0 ? (o(), a("div", ze, [
+              (o(!0), a(v, null, E(t.value, (l) => (o(), c(W, {
                 key: l,
                 size: "xs",
                 outlined: "",
                 removable: "",
                 onRemove: (n) => {
-                  F(n, l);
+                  P(n, l);
                 }
               }, {
                 default: b(() => [
-                  C(m($(l)), 1)
+                  z(m($(l)), 1)
                 ]),
                 _: 2
               }, 1032, ["onRemove"]))), 128))
-            ])) : !e.multiple && !x(t.value) ? (a(), o(p, { key: 1 }, [
-              C(m($(t.value)), 1)
-            ], 64)) : (a(), o(p, { key: 2 }, [
-              e.placeholder ? (a(), o("div", Ce, m(e.placeholder), 1)) : (a(), o("div", Se, " "))
+            ])) : !e.multiple && !F(t.value) ? (o(), a(v, { key: 1 }, [
+              z(m($(t.value)), 1)
+            ], 64)) : (o(), a(v, { key: 2 }, [
+              e.placeholder ? (o(), a("div", Se, m(e.placeholder), 1)) : (o(), a("div", Ne, " "))
             ], 64))
-          ], 2)) : (a(), c(Re, {
+          ], 2)) : (o(), c(_e, {
             key: 1,
             ref_key: "popoverRef",
             ref: f,
             disabled: e.disabled || e.loading || e.readonly
           }, {
             content: b(() => [
-              K(Ve, {
-                class: _(s(h).content)
+              K($e, {
+                class: R(s(h).content)
               }, {
                 default: b(() => [
-                  d.value.length > 0 ? (a(!0), o(p, { key: 0 }, z(d.value, (l, n) => (a(), c(Ie, {
+                  d.value.length > 0 ? (o(!0), a(v, { key: 0 }, E(d.value, (l, n) => (o(), c(Re, {
                     key: n,
                     ref_for: !0,
                     ref_key: "itemsRef",
-                    ref: V,
+                    ref: _,
                     item: l,
                     size: e.size,
                     disabled: l.disabled,
                     selected: n === u.value,
-                    color: "primary",
+                    color: e.color,
                     filled: "",
                     onClick: i[1] || (i[1] = () => {
-                      var v;
-                      return !e.multiple && ((v = f.value) == null ? void 0 : v.hide());
+                      var p;
+                      return !e.multiple && ((p = f.value) == null ? void 0 : p.hide());
                     })
-                  }, null, 8, ["item", "size", "disabled", "selected"]))), 128)) : (a(), o("div", Le, " No options "))
+                  }, null, 8, ["item", "size", "disabled", "selected", "color"]))), 128)) : (o(), a("div", Be, " No options "))
                 ]),
                 _: 1
               }, 8, ["class"])
             ]),
             default: b(() => [
-              E("div", {
-                class: _([s(h).box])
+              C("div", {
+                class: R([s(h).box])
               }, [
-                e.multiple && Array.isArray(t.value) && t.value.length > 0 ? (a(), o("div", Ne, [
-                  (a(!0), o(p, null, z(t.value, (l) => (a(), c(W, {
+                e.multiple && Array.isArray(t.value) && t.value.length > 0 ? (o(), a("div", Oe, [
+                  (o(!0), a(v, null, E(t.value, (l) => (o(), c(W, {
                     key: l,
                     size: "xs",
                     outlined: "",
                     removable: "",
                     onRemove: (n) => {
-                      F(n, l);
+                      P(n, l);
                     }
                   }, {
                     default: b(() => [
-                      C(m($(l)), 1)
+                      z(m($(l)), 1)
                     ]),
                     _: 2
                   }, 1032, ["onRemove"]))), 128))
-                ])) : !e.multiple && !x(t.value) ? (a(), o(p, { key: 1 }, [
-                  C(m($(t.value)), 1)
-                ], 64)) : (a(), o(p, { key: 2 }, [
-                  e.placeholder ? (a(), o("div", Oe, m(e.placeholder), 1)) : (a(), o("div", De, " "))
+                ])) : !e.multiple && !F(t.value) ? (o(), a(v, { key: 1 }, [
+                  z(m($(t.value)), 1)
+                ], 64)) : (o(), a(v, { key: 2 }, [
+                  e.placeholder ? (o(), a("div", De, m(e.placeholder), 1)) : (o(), a("div", Le, " "))
                 ], 64))
               ], 2)
             ]),
             _: 1
           }, 8, ["disabled"])),
-          pe(E("select", X({
+          ve(C("select", X({
             id: e.id,
             ref_key: "elRef",
             ref: k,
@@ -307,39 +310,39 @@ const Ee = { class: "relative" }, ze = {
             disabled: e.disabled || e.loading,
             multiple: e.multiple,
             readonly: e.readonly
-          }, H(s(j), !0)), [
-            (a(!0), o(p, null, z(e.options, (l, n) => (a(), o("option", {
+          }, H(s(x), !0)), [
+            (o(!0), a(v, null, E(e.options, (l, n) => (o(), a("option", {
               key: n,
               value: l.value,
               disabled: l.disabled
-            }, m(l.label), 9, Te))), 128))
-          ], 16, Be), [
+            }, m(l.label), 9, Fe))), 128))
+          ], 16, Te), [
             [ce, t.value]
           ]),
-          E("div", {
-            class: _(s(h).iconWrapper)
+          C("div", {
+            class: R(s(h).iconWrapper)
           }, [
-            e.loading ? (a(), c(_e, {
+            e.loading ? (o(), c(Ve, {
               key: 0,
               size: e.size
             }, null, 8, ["size"])) : me(e.$slots, "icon", { key: 1 }, () => [
-              K(Ae, {
-                icon: s(ge),
-                class: _([s(h).icon])
+              K(Ie, {
+                icon: s(we),
+                class: R([s(h).icon])
               }, null, 8, ["icon", "class"])
             ])
           ], 2)
         ]),
-        s(ie) ? ye("", !0) : (a(), c($e, {
+        s(ie) ? ye("", !0) : (o(), c(Ce, {
           key: 0,
-          error: s(q),
+          error: s(j),
           helper: e.helper
         }, null, 8, ["error", "helper"]))
       ]),
       _: 3
-    }, 16, ["style", "disabled", "required", "is-inside-form", "label", "class"]));
+    }, 16, ["style", "disabled", "required", "is-inside-form", "label", "class", "tooltip"]));
   }
 });
 export {
-  il as default
+  nl as default
 };

package/lib/components/select/theme/Select.base.theme.js

@@ -1,22 +1,22 @@
-const s = {
+const t = {
   classes: {
     wrapper: "",
-    box: ({ props: e, data: t }) => {
-      const r = ["w-full border border-gray-300 dark:border-gray-700 pr-8 outline-transparent outline outline-2 outline-offset-[-1px] transition-all duration-150 ease-in-out rounded-md shadow-sm"];
-      return !t.errorInternal && !e.disabled && r.push("hover:border-gray-400 dark:hover:border-gray-500"), e.size === "xs" ? r.push("px-2 py-1 text-xs") : e.size === "sm" ? r.push("px-2 py-2 text-sm") : e.size === "lg" ? r.push("px-4 py-3 text-lg") : e.size === "xl" ? r.push("px-5 py-4 text-xl") : r.push("px-3 py-2"), e.disabled ? r.push("bg-gray-100 dark:bg-gray-900 text-gray-500 cursor-not-allowed") : r.push("bg-white dark:bg-gray-800 text-gray-700 dark:text-gray-200"), t.errorInternal ? r.push("border-red-500 dark:border-red-400 group-focus:outline-red-500") : e.disabled || r.push("group-focus:outline-[color:var(--x-select-border)]"), r;
+    box: ({ props: e, data: s }) => {
+      const r = ["w-full border border-secondary-300 dark:border-secondary-700 pr-8 outline-transparent outline outline-2 outline-offset-[-1px] transition-all duration-150 ease-in-out rounded-md shadow-sm"];
+      return !s.errorInternal && !e.disabled && r.push("hover:border-secondary-400 dark:hover:border-secondary-500"), e.size === "xs" ? r.push("px-2 py-1 text-xs") : e.size === "sm" ? r.push("px-2 py-2 text-sm") : e.size === "lg" ? r.push("px-4 py-3 text-lg") : e.size === "xl" ? r.push("px-5 py-4 text-xl") : r.push("px-3 py-2"), e.disabled ? r.push("bg-secondary-100 dark:bg-secondary-700 text-secondary-400 dark:text-secondary-600 cursor-not-allowed") : r.push("bg-white dark:bg-secondary-800 text-secondary-700 dark:text-secondary-200"), s.errorInternal ? r.push("border-error-500 dark:border-error-400 group-focus:outline-error-500") : e.disabled || r.push("group-focus:outline-[color:var(--x-select-border)]"), r;
     },
-    content: "py-1 max-h-72 overflow-y-auto",
+    content: "p-1 max-h-72 overflow-y-auto",
     iconWrapper: "pointer-events-none absolute inset-y-0 right-0 flex items-center px-2",
     icon: ({ props: e }) => {
-      const t = [""];
-      return e.size === "sm" || e.size === "xs" ? t.push("h-3 w-3") : e.size === "lg" ? t.push("h-6 w-6") : e.size === "xl" ? t.push("h-7 w-7") : t.push("h-5 w-5"), e.disabled ? t.push("text-gray-300 dark:text-gray-500") : t.push("text-gray-500 dark:text-gray-400"), t;
+      const s = [""];
+      return e.size === "sm" || e.size === "xs" ? s.push("h-3 w-3") : e.size === "lg" ? s.push("h-6 w-6") : e.size === "xl" ? s.push("h-7 w-7") : s.push("h-5 w-5"), e.disabled ? s.push("text-secondary-300 dark:text-secondary-500") : s.push("text-secondary-500 dark:text-secondary-400"), s;
     }
   },
-  styles: ({ colors: e, css: t }) => {
+  styles: ({ colors: e, css: s }) => {
     const r = e.getPalette("primary");
-    return t.get("border", r[500]);
+    return s.get("border", r[500]);
   }
-}, a = s;
+}, o = t;
 export {
-  a as default
+  o as default
 };

package/lib/components/select/theme/Select.carbon.theme.js

@@ -1,22 +1,22 @@
-const a = {
+const o = {
   classes: {
     wrapper: "",
-    box: ({ props: e, data: t }) => {
-      const r = ["w-full border-b text-sm px-4 border-gray-300 dark:border-gray-700 pr-8 outline-transparent outline outline-2 outline-offset-[-1px] transition-all duration-150 ease-in-out"];
-      return !t.errorInternal && !e.disabled && r.push("hover:border-gray-400 dark:hover:border-gray-500"), e.size === "xs" || e.size === "sm" ? r.push("py-1.5") : e.size === "lg" || e.size === "xl" ? r.push("py-3.5") : r.push("py-2.5"), e.disabled ? r.push("bg-gray-100 dark:bg-gray-900 text-gray-300 cursor-not-allowed") : e.readonly ? r.push("bg-white dark:bg-gray-900 text-gray-700") : r.push("bg-gray-50 dark:bg-gray-800 text-gray-700 dark:text-gray-200"), t.errorInternal ? r.push("border-red-500 dark:border-red-400 group-focus:outline-red-500") : e.disabled || r.push("group-focus:outline-[color:var(--x-select-border)]"), r;
+    box: ({ props: e, data: s }) => {
+      const r = ["w-full border-b text-sm px-4 border-secondary-300 dark:border-secondary-700 pr-8 outline-transparent outline outline-2 outline-offset-[-1px] transition-all duration-150 ease-in-out"];
+      return !s.errorInternal && !e.disabled && r.push("hover:border-secondary-400 dark:hover:border-secondary-500"), e.size === "xs" || e.size === "sm" ? r.push("py-1.5") : e.size === "lg" || e.size === "xl" ? r.push("py-3.5") : r.push("py-2.5"), e.disabled ? r.push("bg-secondary-100 dark:bg-secondary-900 text-secondary-300 cursor-not-allowed") : e.readonly ? r.push("bg-white dark:bg-secondary-900 text-secondary-700") : r.push("bg-secondary-50 dark:bg-secondary-800 text-secondary-700 dark:text-secondary-200"), s.errorInternal ? r.push("border-error-500 dark:border-error-400 group-focus:outline-error-500") : e.disabled || r.push("group-focus:outline-[color:var(--x-select-border)]"), r;
     },
     content: "py-1 max-h-72 overflow-y-auto",
     iconWrapper: "pointer-events-none absolute inset-y-0 right-0 flex items-center px-2",
     icon: ({ props: e }) => {
-      const t = ["h-5 w-5"];
-      return e.disabled ? t.push("text-gray-300 dark:text-gray-500") : t.push("text-gray-500 dark:text-gray-400"), t;
+      const s = ["h-5 w-5"];
+      return e.disabled ? s.push("text-secondary-300 dark:text-secondary-500") : s.push("text-secondary-500 dark:text-secondary-400"), s;
     }
   },
-  styles: ({ colors: e, css: t }) => {
+  styles: ({ colors: e, css: s }) => {
     const r = e.getPalette("primary");
-    return t.get("border", r[500]);
+    return s.get("border", r[500]);
   }
-}, s = a;
+}, t = o;
 export {
-  s as default
+  t as default
 };

package/lib/components/skeleton/theme/Skeleton.base.theme.js

@@ -1,7 +1,7 @@
 const a = {
   classes: {
     wrapper: ({ props: s }) => {
-      const e = ["animate-pulse bg-gray-300 dark:bg-gray-600"];
+      const e = ["animate-pulse bg-secondary-300 dark:bg-secondary-600"];
       return s.shape === "circle" ? e.push("w-8 h-8 rounded-full") : e.push("rounded-md"), e;
     }
   }

package/lib/components/slider/Slider.vue.d.ts

@@ -25,6 +25,7 @@ declare const sliderProps: {
         readonly type: ArrayConstructor;
         readonly default: () => never[];
     };
+    tooltip: StringConstructor;
     disabled: BooleanConstructor;
     loading: BooleanConstructor;
     loadingLabel: StringConstructor;
@@ -71,6 +72,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
         readonly type: ArrayConstructor;
         readonly default: () => never[];
     };
+    tooltip: StringConstructor;
     disabled: BooleanConstructor;
     loading: BooleanConstructor;
     loadingLabel: StringConstructor;
@@ -118,6 +120,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
         readonly type: ArrayConstructor;
         readonly default: () => never[];
     };
+    tooltip: StringConstructor;
     disabled: BooleanConstructor;
     loading: BooleanConstructor;
     loadingLabel: StringConstructor;

package/lib/components/slider/Slider.vue.js

@@ -135,7 +135,7 @@ const oe = { class: "flex items-center relative w-full" }, ae = { class: "-mx-2"
         ]),
         l(y) ? (k(), Q("p", {
           key: 0,
-          class: "text-sm text-red-500 mt-1",
+          class: "text-sm text-error-500 mt-1",
           textContent: U(l(y))
         }, null, 8, se)) : Y("", !0)
       ]),

package/lib/components/slider/theme/Slider.carbon.theme.js

@@ -1,16 +1,16 @@
-const s = {
+const o = {
   classes: {
     wrapper: "",
-    drag: "w-[16px] h-[16px] -mt-[11px] -ml-[8px] rounded-full bg-gray-900 dark:bg-gray-100"
+    drag: "w-[16px] h-[16px] -mt-[11px] -ml-[8px] rounded-full bg-secondary-900 dark:bg-secondary-100"
   },
   styles: ({ props: r, colors: e, css: t }) => {
-    const a = e.getPalette("primary"), l = e.getPalette(r.color);
+    const a = e.getPalette("primary"), s = e.getPalette(r.color);
     return t.variables({
-      bg: l[500],
+      bg: s[500],
       border: a[500]
     });
   }
-}, o = s;
+}, l = o;
 export {
-  o as default
+  l as default
 };