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

package/lib/components/carousel/CarouselSlide.vue.d.ts

@@ -1,17 +1,28 @@
 import { type ExtractPublicPropTypes } from 'vue';
 import { type ThemeComponent } from '../../composables/useTheme';
-declare const carouselSlideProps: {};
+declare const carouselSlideProps: {
+    tag: {
+        type: StringConstructor;
+        default: string;
+    };
+};
 export type CarouselSlideProps = ExtractPublicPropTypes<typeof carouselSlideProps>;
 type InternalClasses = 'wrapper';
 export interface CarouselSlideTheme extends ThemeComponent<CarouselSlideProps, InternalClasses> {
 }
-declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<Readonly<import("vue").ComponentPropsOptions<{
-    [x: string]: unknown;
-}>>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, readonly string[] | Readonly<import("vue").ExtractPropTypes<Readonly<import("vue").ComponentObjectPropsOptions<{
-    [x: string]: unknown;
-}>>>>, {
-    [x: number]: string;
-} | {}, {}>, {
+declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
+    tag: {
+        type: StringConstructor;
+        default: string;
+    };
+}, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    tag: {
+        type: StringConstructor;
+        default: string;
+    };
+}>>, {
+    tag: string;
+}, {}>, {
     default?(_: {}): any;
 }>;
 export default _default;

package/lib/components/carousel/CarouselSlide.vue.js

@@ -3,7 +3,7 @@ import o from "./CarouselSlide.vue3.js";
 import t from "../../_virtual/_plugin-vue_export-helper.js";
 const e = {
   $style: o
-}, a = /* @__PURE__ */ t(s, [["__cssModules", e], ["__scopeId", "data-v-8d26c82a"]]);
+}, d = /* @__PURE__ */ t(s, [["__cssModules", e], ["__scopeId", "data-v-402870d3"]]);
 export {
-  a as default
+  d as default
 };

package/lib/components/carousel/CarouselSlide.vue2.js

@@ -1,25 +1,32 @@
-import { defineComponent as n, openBlock as c, createElementBlock as p, normalizeStyle as i, unref as e, normalizeClass as m, renderSlot as u } from "vue";
-import { useTheme as d } from "../../composables/useTheme.js";
-const f = {}, _ = {
-  name: "XCarouselSlide",
-  validators: {}
-}, h = /* @__PURE__ */ n({
-  ..._,
-  props: f,
+import { defineComponent as n, openBlock as c, createBlock as p, resolveDynamicComponent as i, normalizeStyle as u, unref as s, normalizeClass as m, withCtx as d, renderSlot as f } from "vue";
+import { useTheme as y } from "../../composables/useTheme.js";
+const C = {
+  tag: {
+    type: String,
+    default: "div"
+  }
+}, S = {
+  name: "XCarouselSlide"
+}, k = /* @__PURE__ */ n({
+  ...S,
+  props: C,
   setup(l) {
-    const o = l, { styles: r, classes: t, className: a } = d("CarouselSlide", {}, o);
-    return (s, S) => (c(), p("div", {
-      style: i(e(r)),
+    const t = l, { styles: o, classes: a, className: r } = y("CarouselSlide", {}, t);
+    return (e, _) => (c(), p(i(e.tag), {
+      style: u(s(o)),
       class: m([
-        e(a),
-        s.$style["carousel-slide"],
-        e(t).wrapper
+        s(r),
+        e.$style["carousel-slide"],
+        s(a).wrapper
       ])
-    }, [
-      u(s.$slots, "default")
-    ], 6));
+    }, {
+      default: d(() => [
+        f(e.$slots, "default")
+      ]),
+      _: 3
+    }, 8, ["style", "class"]));
   }
 });
 export {
-  h as default
+  k as default
 };

package/lib/components/checkbox/theme/Checkbox.base.theme.js

@@ -1,8 +1,8 @@
-const n = {
+const o = {
   classes: {
     wrapper: ({ data: r }) => {
       const e = ["inline-block relative cursor-pointer align-middle"];
-      return r.isInsideForm && e.push("mb-3"), e;
+      return r.isInsideForm && !r.isInsideFormGroup && e.push("mb-3"), e;
     },
     box: ({ props: r }) => {
       const e = ["rounded flex justify-center items-center shrink-0 border-2 border-[color:var(--x-checkbox-border)] bg-[color:var(--x-checkbox-bg)] dark:border-[color:var(--x-checkbox-dark-border)] dark:bg-[color:var(--x-checkbox-dark-bg)]"];
@@ -53,7 +53,7 @@ const n = {
       }
     })), r.glow && a.push(l.get("glow", e.getColorOpacity(t[500], 0.5)))), a);
   }
-}, o = n;
+}, n = o;
 export {
-  o as default
+  n as default
 };

package/lib/components/container/Container.vue.d.ts

@@ -5,6 +5,10 @@ declare const containerProps: {
         type: StringConstructor;
         default: string;
     };
+    fluid: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
 };
 export type ContainerProps = ExtractPublicPropTypes<typeof containerProps>;
 type InternalClasses = 'wrapper';
@@ -15,13 +19,22 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
         type: StringConstructor;
         default: string;
     };
+    fluid: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
 }, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     tag: {
         type: StringConstructor;
         default: string;
     };
+    fluid: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
 }>>, {
     tag: string;
+    fluid: boolean;
 }, {}>, {
     default?(_: {}): any;
 }>;

package/lib/components/container/Container.vue.js

@@ -1,20 +1,24 @@
-import { defineComponent as l, openBlock as c, createBlock as p, resolveDynamicComponent as i, normalizeStyle as m, unref as e, normalizeClass as f, withCtx as u, renderSlot as d } from "vue";
-import { useTheme as _ } from "../../composables/useTheme.js";
-const y = {
+import { defineComponent as r, openBlock as c, createBlock as p, resolveDynamicComponent as i, normalizeStyle as f, unref as e, normalizeClass as m, withCtx as u, renderSlot as d } from "vue";
+import { useTheme as y } from "../../composables/useTheme.js";
+const _ = {
   tag: {
     type: String,
     default: "div"
+  },
+  fluid: {
+    type: Boolean,
+    default: !1
   }
-}, C = { name: "XContainer" }, k = /* @__PURE__ */ l({
+}, C = { name: "XContainer" }, S = /* @__PURE__ */ r({
   ...C,
-  props: y,
+  props: _,
   setup(s) {
-    const o = s, { styles: n, classes: a, className: r } = _("Container", {}, o);
+    const o = s, { styles: a, classes: n, className: l } = y("Container", {}, o);
     return (t, g) => (c(), p(i(t.tag), {
-      style: m(e(n)),
-      class: f([
-        e(r),
-        e(a).wrapper
+      style: f(e(a)),
+      class: m([
+        e(l),
+        e(n).wrapper
       ])
     }, {
       default: u(() => [
@@ -25,5 +29,5 @@ const y = {
   }
 });
 export {
-  k as default
+  S as default
 };

package/lib/components/container/theme/Container.base.theme.js

@@ -1,8 +1,11 @@
-const e = {
+const a = {
   classes: {
-    wrapper: "max-w-screen-2xl mx-auto px-4 md:px-8"
+    wrapper: ({ props: s }) => {
+      const e = ["px-4 md:px-8"];
+      return s.fluid || e.push("max-w-screen-2xl mx-auto"), e;
+    }
   }
-}, s = e;
+}, t = a;
 export {
-  s as default
+  t as default
 };

package/lib/components/form/theme/Form.base.theme.js

@@ -1,7 +1,7 @@
 const t = {
   classes: {
     wrapper: "relative",
-    content: "grid gap-4",
+    content: "",
     title: "text-xl mb-1",
     description: "text-gray-500",
     footer: "space-x-4 mt-4"

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

@@ -1,4 +1,4 @@
-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 g, unref as p, normalizeClass as i, Fragment as a, renderList as E, createBlock as u, withCtx as c, createVNode as r, createCommentVNode as w } 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";
@@ -40,7 +40,7 @@ const V = {
       return e.items ? (d(), n("div", {
         key: 0,
         style: g(p(k)),
-        class: r([
+        class: i([
           "space-y-1",
           p($),
           p(v).wrapper
@@ -58,19 +58,19 @@ const V = {
               onExpand: o[1] || (o[1] = (s) => e.$emit("expand"))
             }, {
               default: c(({}) => [
-                i(f, {
+                r(f, {
                   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 }]),
+                r(b, {
+                  class: i(["border-l ml-4 border-gray-100 dark:border-gray-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(f, {
                 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(b, {
+                class: i(["x-menu-inner space-y-1 ml-4 border-l border-gray-100 dark:border-gray-700", { "pl-1": e.filled }]),
                 items: l.items,
                 color: l.color || e.color,
                 size: l.size || e.size,
@@ -120,7 +120,7 @@ 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"]))

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

@@ -48,7 +48,7 @@ const x = {
         bg: a.selected ? t[800] : "transparent",
         text: t[200],
         hover: {
-          bg: t[800],
+          bg: t[600],
           text: t[100]
         }
       }

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

@@ -123,11 +123,11 @@ 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;

package/lib/components/radio/theme/Radio.base.theme.js

@@ -1,8 +1,8 @@
-const n = {
+const a = {
   classes: {
     wrapper: ({ data: e }) => {
       const t = ["inline-block relative cursor-pointer focus:outline-none group"];
-      return e.isInsideForm && t.push("mb-3"), t;
+      return e.isInsideForm && !e.isInsideFormGroup && t.push("mb-3"), t;
     },
     circle: ({ props: e }) => {
       let t = "rounded-full flex justify-center items-center shrink-0 border-2 outline-offset-2 outline-slate-300 dark:outline-slate-500 group-focus:outline-1 group-focus:outline";
@@ -21,7 +21,7 @@ const n = {
       return e.size === "xs" ? t += " text-xs" : e.size === "sm" ? t += " text-sm" : e.size === "lg" ? t += " text-lg" : e.size === "xl" && (t += " text-xl"), t;
     }
   },
-  styles: ({ props: e, colors: t, css: r, data: a }) => {
+  styles: ({ props: e, colors: t, css: r, data: n }) => {
     const l = t.getPalette("gray"), s = t.getPalette(e.color), i = [];
     return e.loading ? r.variables({
       bg: "transparent",
@@ -30,7 +30,7 @@ const n = {
         bg: "transparent",
         border: "transparent"
       }
-    }) : (e.disabled ? a.selected ? i.push(r.variables({
+    }) : (e.disabled ? n.selected ? i.push(r.variables({
       bg: "transparent",
       border: l[200],
       circle: l[200],
@@ -46,7 +46,7 @@ const n = {
         bg: l[700],
         border: l[700]
       }
-    })) : (a.selected ? i.push(r.variables({
+    })) : (n.selected ? i.push(r.variables({
       bg: "transparent",
       border: s[500],
       circle: s[500],
@@ -64,7 +64,7 @@ const n = {
       }
     })), e.glow && i.push(r.get("glow", t.getColorOpacity(s[500], 0.5)))), i);
   }
-}, u = n;
+}, u = a;
 export {
   u as default
 };

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

@@ -1,18 +1,18 @@
-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 h, createElementVNode as E, createElementBlock as o, normalizeClass as R, 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 { useEventListener as be } from "../../node_modules/.pnpm/@vueuse_core@10.2.0_vue@3.3.9/node_modules/@vueuse/core/index.js";
+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 { useEventListener as he } from "../../node_modules/.pnpm/@vueuse_core@10.2.0_vue@3.3.9/node_modules/@vueuse/core/index.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 he } from "../../composables/useTheme.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 W from "../tag/Tag.vue.js";
 import Ae from "../icon/Icon.vue.js";
 import Ie from "../menu/MenuItem.vue.js";
-import Re from "../spinner/Spinner.vue.js";
-import Ve from "../popover/Popover.vue.js";
+import _e from "../spinner/Spinner.vue.js";
+import Re from "../popover/Popover.vue.js";
 import "../popover/Popover.vue2.js";
-import _e from "../popover/PopoverContainer.vue.js";
+import Ve from "../popover/PopoverContainer.vue.js";
 import $e from "../inputFooter/InputFooter.vue.js";
 const Ee = { class: "relative" }, ze = {
   key: 0,
@@ -29,7 +29,7 @@ const Ee = { class: "relative" }, ze = {
 }, De = { key: 1 }, Le = {
   key: 1,
   class: "px-2 text-center text-gray-400"
-}, Be = ["id", "name", "disabled", "multiple", "readonly"], Te = ["value", "disabled"], Fe = {
+}, Be = ["id", "name", "disabled", "multiple", "readonly"], Te = ["value", "disabled"], xe = {
   ...G.props(),
   ...J.props(),
   ...D.props(),
@@ -38,22 +38,22 @@ const Ee = { class: "relative" }, ze = {
   multiple: Boolean,
   flat: Boolean,
   native: Boolean
-}, Pe = {
+}, Fe = {
   name: "XSelect",
   validators: {
     ...G.validators()
   }
 }, il = /* @__PURE__ */ ve({
-  ...Pe,
-  props: Fe,
+  ...Fe,
+  props: xe,
   emits: D.emits(),
   setup(Q, { expose: Y, emit: Z }) {
-    const r = Q, V = Z, k = A(null), S = A(null), _ = A(null), f = A(null), u = A(), t = I({
+    const r = Q, R = Z, k = A(null), S = A(null), V = 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) {
-        V("update:modelValue", e);
+        R("update:modelValue", e);
       }
     }), d = I(() => !r.options || r.options.length === 0 ? [] : r.options.map((e) => {
       let i = !1;
@@ -90,10 +90,10 @@ const Ee = { class: "relative" }, ze = {
     }
     function B(e) {
       var i;
-      _.value && ((i = _.value[e]) == null || i.$el.scrollIntoView({ block: "nearest", inline: "nearest" }));
+      V.value && ((i = V.value[e]) == null || i.$el.scrollIntoView({ block: "nearest", inline: "nearest" }));
     }
     O(u, (e) => {
-      typeof e < "u" && _.value && B(e);
+      typeof e < "u" && V.value && B(e);
     });
     function N(e, i = "down") {
       if (!L.value || L.value.length === 0) {
@@ -119,7 +119,7 @@ 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), V("update:modelValue", t.value));
+            n !== -1 ? t.value.splice(n, 1) : (t.value.push(e), R("update:modelValue", t.value));
           } else
             t.value = [e];
         else
@@ -130,21 +130,21 @@ const Ee = { class: "relative" }, ze = {
         });
       }
     }
-    function F(e) {
+    function x(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 P(e, i) {
+    function F(e, i) {
       e.stopPropagation();
       const l = t.value.indexOf(i);
-      l !== -1 && (t.value.splice(l, 1), V("update:modelValue", t.value));
+      l !== -1 && (t.value.splice(l, 1), R("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: q, blur: le } = J(k), {
-      errorInternal: x,
+    const { focus: P, blur: le } = J(k), {
+      errorInternal: q,
       hideFooterInternal: ie,
       inputListeners: j,
       reset: te,
@@ -152,7 +152,7 @@ const Ee = { class: "relative" }, ze = {
       setError: ae,
       isFocused: re,
       isInsideForm: oe
-    } = D(r, { focus: q, emit: V, withListeners: !0 }), se = I(() => {
+    } = D(r, { focus: P, emit: R, withListeners: !0 }), se = I(() => {
       const { focus: e, blur: i } = s(j);
       return {
         focus: e,
@@ -161,7 +161,7 @@ const Ee = { class: "relative" }, ze = {
     });
     let g = null;
     O([re, y], ([e, i]) => {
-      e || i ? g || (g = be(document, "keydown", ue)) : g && (g(), g = null);
+      e || i ? g || (g = he(document, "keydown", ue)) : g && (g(), g = null);
     }, {
       immediate: !0
     });
@@ -192,14 +192,14 @@ const Ee = { class: "relative" }, ze = {
             (M = S.value) == null || M.$el.focus();
           }));
     }
-    const { styles: de, classes: b, className: fe } = he("Select", {}, r, { errorInternal: x });
-    return Y({ focus: q, blur: le, reset: te, validate: ne, setError: ae }), (e, i) => (a(), c(we, X({
+    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({
       ref_key: "labelRef",
       ref: S,
       tabindex: "0",
       class: ["group", [
         s(fe),
-        s(b).wrapper
+        s(h).wrapper
       ]],
       style: s(de),
       disabled: e.disabled,
@@ -207,11 +207,11 @@ const Ee = { class: "relative" }, ze = {
       "is-inside-form": s(oe),
       label: e.label
     }, H(se.value)), {
-      default: h(() => [
+      default: b(() => [
         E("div", Ee, [
           e.native && !e.multiple ? (a(), o("div", {
             key: 0,
-            class: R(s(b).box),
+            class: _(s(h).box),
             onClick: i[0] || (i[0] = (l) => {
               var n;
               return (n = k.value) == null ? void 0 : n.click();
@@ -224,38 +224,35 @@ const Ee = { class: "relative" }, ze = {
                 outlined: "",
                 removable: "",
                 onRemove: (n) => {
-                  P(n, l);
+                  F(n, l);
                 }
               }, {
-                default: h(() => [
+                default: b(() => [
                   C(m($(l)), 1)
                 ]),
                 _: 2
               }, 1032, ["onRemove"]))), 128))
-            ])) : !e.multiple && !F(t.value) ? (a(), o(p, { key: 1 }, [
+            ])) : !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, " "))
             ], 64))
-          ], 2)) : (a(), c(Ve, {
+          ], 2)) : (a(), c(Re, {
             key: 1,
             ref_key: "popoverRef",
             ref: f,
-            block: "",
-            disabled: e.disabled || e.loading || e.readonly,
-            "dismiss-on-click": !e.multiple,
-            align: "left"
+            disabled: e.disabled || e.loading || e.readonly
           }, {
-            content: h(() => [
-              K(_e, {
-                class: R(s(b).content)
+            content: b(() => [
+              K(Ve, {
+                class: _(s(h).content)
               }, {
-                default: h(() => [
+                default: b(() => [
                   d.value.length > 0 ? (a(!0), o(p, { key: 0 }, z(d.value, (l, n) => (a(), c(Ie, {
                     key: n,
                     ref_for: !0,
                     ref_key: "itemsRef",
-                    ref: _,
+                    ref: V,
                     item: l,
                     size: e.size,
                     disabled: l.disabled,
@@ -271,9 +268,9 @@ const Ee = { class: "relative" }, ze = {
                 _: 1
               }, 8, ["class"])
             ]),
-            default: h(() => [
+            default: b(() => [
               E("div", {
-                class: R([s(b).box])
+                class: _([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, {
@@ -282,15 +279,15 @@ const Ee = { class: "relative" }, ze = {
                     outlined: "",
                     removable: "",
                     onRemove: (n) => {
-                      P(n, l);
+                      F(n, l);
                     }
                   }, {
-                    default: h(() => [
+                    default: b(() => [
                       C(m($(l)), 1)
                     ]),
                     _: 2
                   }, 1032, ["onRemove"]))), 128))
-                ])) : !e.multiple && !F(t.value) ? (a(), o(p, { key: 1 }, [
+                ])) : !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, " "))
@@ -298,7 +295,7 @@ const Ee = { class: "relative" }, ze = {
               ], 2)
             ]),
             _: 1
-          }, 8, ["disabled", "dismiss-on-click"])),
+          }, 8, ["disabled"])),
           pe(E("select", X({
             id: e.id,
             ref_key: "elRef",
@@ -320,22 +317,22 @@ const Ee = { class: "relative" }, ze = {
             [ce, t.value]
           ]),
           E("div", {
-            class: R(s(b).iconWrapper)
+            class: _(s(h).iconWrapper)
           }, [
-            e.loading ? (a(), c(Re, {
+            e.loading ? (a(), c(_e, {
               key: 0,
               size: e.size
             }, null, 8, ["size"])) : me(e.$slots, "icon", { key: 1 }, () => [
               K(Ae, {
                 icon: s(ge),
-                class: R([s(b).icon])
+                class: _([s(h).icon])
               }, null, 8, ["icon", "class"])
             ])
           ], 2)
         ]),
         s(ie) ? ye("", !0) : (a(), c($e, {
           key: 0,
-          error: s(x),
+          error: s(q),
           helper: e.helper
         }, null, 8, ["error", "helper"]))
       ]),

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

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