@bridge-ui/vue 0.0.11 → 0.1.0

package/dist/Components/Slider/composables/useSlider.js

@@ -3,11 +3,11 @@ import { mergePartBind as t, useBridgeUIComponent as n, useBridgeUIMergedRegistr
 import { baseFieldBridgeKeys as i, useBaseField as a } from "../../BaseField/composables/useBaseField.js";
 import { computed as o, ref as s, toValue as ee, useAttrs as te, watch as ne } from "vue";
 import { get as c, omit as l, pick as u } from "es-toolkit/compat";
-import { getSliderBarGeometry as re, getSliderPointerClientX as d, isSliderStopCovered as ie, normalizeSliderStops as ae, percentFromSliderPointer as f, percentToValue as p, pickClosestSliderThumb as oe, resolveSliderBounds as se, snapSliderValue as m, sortSliderRangeValue as ce, stepSliderValue as h, valueToPercent as g, writeSliderRangeThumb as _ } from "@bridge-ui/core/Domain";
-import { sliderColorProps as le, sliderInvalidatedProps as ue, sliderRoundedProps as de, sliderSizeProps as fe } from "@bridge-ui/core/Tokens";
-import { cn as v, mergeBridgeUILayeredClasses as y, splitComponentProps as pe } from "@bridge-ui/core/Utils";
+import { getSliderBarGeometry as re, getSliderPointerClientX as d, isSliderStopCovered as ie, normalizeSliderStops as ae, percentFromSliderPointer as f, percentToValue as p, pickClosestSliderThumb as oe, resolveSliderBounds as m, snapSliderValue as h, sortSliderRangeValue as se, stepSliderValue as g, valueToPercent as _, writeSliderRangeThumb as v } from "@bridge-ui/core/Domain";
+import { sliderColorProps as ce, sliderRoundedProps as le, sliderSizeProps as ue } from "@bridge-ui/core/Tokens";
+import { cn as y, getColorToken as de, mergeBridgeUILayeredClasses as b, splitComponentProps as fe } from "@bridge-ui/core/Utils";
 //#region src/Components/Slider/composables/useSlider.ts
-var b = [
+var x = [
 	"max",
 	"min",
 	"step",
@@ -18,113 +18,117 @@ var b = [
 	"showStops",
 	"showTooltip",
 	"defaultValue"
-], x = [...i, ...b];
-function S(e, t, n) {
+], S = [...i, ...x];
+function C(e, t, n) {
 	return n && Array.isArray(e) ? e[t] : Array.isArray(e) ? e[0] : e;
 }
-function C(e, t, n, r) {
+function w(e, t, n, r) {
 	return !r || !Array.isArray(e) ? {
 		thumbIndex: t,
 		value: n
-	} : _(e, t, n);
+	} : v(e, t, n);
 }
-function w(_, w, T, me = {}) {
-	let he = te(), ge = e(), E = s(null), D = s(null), O = s(null), k = s(null), A = o(() => pe({
-		bridgeKeys: x,
+function T(v, T, E, pe = {}) {
+	let me = te(), he = e(), D = s(null), O = s(null), k = s(null), A = s(null), j = o(() => fe({
+		bridgeKeys: S,
 		props: {
-			...he,
-			...ee(_)
+			...me,
+			...ee(v)
 		}
-	})), _e = o(() => u(A.value.componentProps, i)), j = a(_e, {
+	})), ge = o(() => u(j.value.componentProps, i)), M = a(ge, {
 		error: !1,
 		hideErrorMessage: !1,
-		size: w.size ?? "md"
+		size: T.size ?? "md"
 	}, {
 		componentName: "Slider",
 		labelHtmlFor: (e) => `${e}-thumb-0`
-	}), { merged: M, entry: N } = n({
-		libDefaults: w,
+	}), { merged: N, entry: P } = n({
+		libDefaults: T,
 		componentName: "Slider",
 		props: () => ({
-			...u(A.value.componentProps, b),
-			size: j.merged.value.size,
-			classes: A.value.componentProps.classes,
-			customProps: A.value.componentProps.customProps
+			...u(j.value.componentProps, x),
+			size: M.merged.value.size,
+			classes: j.value.componentProps.classes,
+			customProps: j.value.componentProps.customProps
 		})
-	}), P = o(() => M.value.customProps), F = r({
-		entry: N,
-		props: () => A.value.componentProps
-	}), I = o(() => se({
-		min: M.value.min,
-		max: M.value.max,
-		step: M.value.step
-	})), L = o(() => !!M.value.range), R = o(() => M.value.showTooltip !== !1), z = o(() => ge?.global.value.direction === "rtl"), { controlId: B, isDisabled: V, isReadonly: H, invalidated: U, ariaDescribedBy: ve } = j, W = o(() => {
-		let e = T.value, t = I.value;
-		if (L.value) {
-			if (Array.isArray(e)) return ce(m(e[0], t.min, t.max, t.step), m(e[1], t.min, t.max, t.step));
-			let n = m(typeof e == "number" ? e : t.min, t.min, t.max, t.step);
+	}), F = o(() => N.value.customProps), I = r({
+		entry: P,
+		props: () => j.value.componentProps
+	}), L = o(() => m({
+		min: N.value.min,
+		max: N.value.max,
+		step: N.value.step
+	})), R = o(() => !!N.value.range), z = o(() => N.value.showTooltip !== !1), B = o(() => he?.global.value.direction === "rtl"), { controlId: V, isDisabled: H, isReadonly: U, invalidated: W, ariaDescribedBy: _e } = M, G = o(() => {
+		let e = E.value, t = L.value;
+		if (R.value) {
+			if (Array.isArray(e)) return se(h(e[0], t.min, t.max, t.step), h(e[1], t.min, t.max, t.step));
+			let n = h(typeof e == "number" ? e : t.min, t.min, t.max, t.step);
 			return [n, n];
 		}
-		return m(Array.isArray(e) ? e[0] : typeof e == "number" ? e : t.min, t.min, t.max, t.step);
-	}), G = o(() => ae({
-		min: I.value.min,
-		max: I.value.max,
-		step: I.value.step,
-		stops: M.value.stops,
-		showStops: M.value.showStops
-	})), K = o(() => re({
-		range: L.value,
-		min: I.value.min,
-		max: I.value.max,
-		value: W.value
-	})), ye = o(() => {
-		let e = y(le, N.value?.tokens?.color);
-		return c(e, M.value.color ?? "primary");
-	}), q = o(() => y(ue, N.value?.tokens?.invalidated, M.value.customProps?.invalidated)), J = o(() => U.value ? q.value : ye.value), Y = o(() => {
-		let e = y(fe, N.value?.tokens?.size);
-		return c(e, M.value.size ?? "md");
+		return h(Array.isArray(e) ? e[0] : typeof e == "number" ? e : t.min, t.min, t.max, t.step);
+	}), K = o(() => ae({
+		min: L.value.min,
+		max: L.value.max,
+		step: L.value.step,
+		stops: N.value.stops,
+		showStops: N.value.showStops
+	})), q = o(() => re({
+		range: R.value,
+		min: L.value.min,
+		max: L.value.max,
+		value: G.value
+	})), J = o(() => {
+		let e = b(ce, P.value?.tokens?.color);
+		return de({
+			tokens: e,
+			color: N.value.color,
+			invalid: W.value
+		});
+	}), Y = o(() => {
+		let e = b(ue, P.value?.tokens?.size);
+		return c(e, N.value.size ?? "md");
 	}), X = o(() => {
-		let e = y(de, N.value?.tokens?.rounded);
-		return c(e, M.value.rounded ?? "full");
-	}), be = o(() => G.value.some((e) => !!e.label)), Z = (e) => {
-		T.value = e, me.onChange?.(e);
-	}, xe = (e) => {
-		E.value &&= { thumbIndex: e }, D.value !== null && (D.value = e);
-	}, Se = (e, t) => {
-		if (V.value || H.value) return;
-		let n = I.value, r = p(t, n.min, n.max, n.step), i = C(W.value, e, r, L.value);
-		i.thumbIndex !== e && xe(i.thumbIndex), Z(i.value);
+		let e = b(le, P.value?.tokens?.rounded);
+		return c(e, N.value.rounded ?? "full");
+	}), ve = o(() => K.value.some((e) => !!e.label)), Z = (e) => {
+		E.value = e, pe.onChange?.(e);
+	}, ye = (e) => {
+		D.value &&= { thumbIndex: e }, O.value !== null && (O.value = e);
+	}, be = (e, t) => {
+		if (H.value || U.value) return;
+		let n = L.value, r = p(t, n.min, n.max, n.step), i = w(G.value, e, r, R.value);
+		i.thumbIndex !== e && ye(i.thumbIndex), Z(i.value);
 	}, Q = (e, t) => {
-		V.value || H.value || (e.preventDefault(), E.value = { thumbIndex: t }, D.value = t);
-	}, Ce = (e) => {
-		if (V.value || H.value || e.target.closest("[data-bridge-slider-thumb]")) return;
-		let t = k.value?.getBoundingClientRect();
+		H.value || U.value || (e.preventDefault(), D.value = { thumbIndex: t }, O.value = t);
+	}, xe = (e) => {
+		if (H.value || U.value || e.target.closest("[data-bridge-slider-thumb]")) return;
+		let t = A.value?.getBoundingClientRect();
 		if (!t) return;
 		let n = f({
 			rect: t,
-			isRtl: z.value,
+			isRtl: B.value,
 			clientX: d(e)
-		}), r = I.value, i = p(n, r.min, r.max, r.step), a = 0, o = W.value;
-		L.value && Array.isArray(o) && (a = oe(i, o[0], o[1]));
-		let s = C(o, a, i, L.value);
+		}), r = L.value, i = p(n, r.min, r.max, r.step), a = 0, o = G.value;
+		R.value && Array.isArray(o) && (a = oe(i, o[0], o[1]));
+		let s = w(o, a, i, R.value);
 		Z(s.value), Q(e, s.thumbIndex);
-	}, we = (e) => (t) => {
+	}, Se = (e) => (t) => {
 		Q(t, e);
-	}, Te = (e) => (t) => {
-		if (V.value || H.value) return;
-		let n = I.value, r = S(W.value, e, L.value), i = null, a = z.value;
+	}, Ce = (e) => (t) => {
+		if (H.value || U.value) return;
+		let n = L.value, r = C(G.value, e, R.value), i = null, a = B.value;
 		switch (t.key) {
 			case "ArrowRight":
-				i = h(r, a ? -1 : 1, n.min, n.max, n.step);
+				i = g(r, a ? -1 : 1, n.min, n.max, n.step);
 				break;
 			case "ArrowLeft":
-				i = h(r, a ? 1 : -1, n.min, n.max, n.step);
+				i = g(r, a ? 1 : -1, n.min, n.max, n.step);
 				break;
 			case "ArrowUp":
-				i = h(r, 1, n.min, n.max, n.step);
+				i = g(r, 1, n.min, n.max, n.step);
 				break;
 			case "ArrowDown":
-				i = h(r, -1, n.min, n.max, n.step);
+				i = g(r, -1, n.min, n.max, n.step);
 				break;
 			case "Home":
 				i = n.min;
@@ -133,161 +137,161 @@ function w(_, w, T, me = {}) {
 				i = n.max;
 				break;
 			case "PageUp":
-				i = h(r, 1, n.min, n.max, n.step * 10);
+				i = g(r, 1, n.min, n.max, n.step * 10);
 				break;
-			case "PageDown": i = h(r, -1, n.min, n.max, n.step * 10);
+			case "PageDown": i = g(r, -1, n.min, n.max, n.step * 10);
 		}
 		if (i === null) return;
 		t.preventDefault();
-		let o = C(W.value, e, i, L.value);
-		Z(o.value), o.thumbIndex !== e && document.getElementById(`${B.value}-thumb-${o.thumbIndex}`)?.focus();
+		let o = w(G.value, e, i, R.value);
+		Z(o.value), o.thumbIndex !== e && document.getElementById(`${V.value}-thumb-${o.thumbIndex}`)?.focus();
 	};
-	ne(D, (e, t, n) => {
+	ne(O, (e, t, n) => {
 		if (e === null) return;
 		let r = (e) => {
-			let t = k.value?.getBoundingClientRect();
-			if (!t || E.value === null) return;
+			let t = A.value?.getBoundingClientRect();
+			if (!t || D.value === null) return;
 			let n = f({
 				rect: t,
-				isRtl: z.value,
+				isRtl: B.value,
 				clientX: d(e)
 			});
-			Se(E.value.thumbIndex, n);
+			be(D.value.thumbIndex, n);
 		}, i = () => {
-			E.value = null, D.value = null;
+			D.value = null, O.value = null;
 		};
 		window.addEventListener("pointermove", r), window.addEventListener("pointerup", i), window.addEventListener("pointercancel", i), n(() => {
 			window.removeEventListener("pointermove", r), window.removeEventListener("pointerup", i), window.removeEventListener("pointercancel", i);
 		});
 	});
-	let Ee = o(() => t({}, {}, v("relative w-full min-w-0 flex-1"))), $ = o(() => t({
-		...l(P.value?.track ?? {}, ["style"]),
-		onPointerdown: Ce
-	}, {}, v({
+	let we = o(() => t({}, {}, y("relative w-full min-w-0 flex-1"))), Te = o(() => t({
+		...l(F.value?.track ?? {}, ["style"]),
+		onPointerdown: xe
+	}, {}, y({
 		"relative w-full select-none touch-none": !0,
-		"cursor-pointer": !V.value && !H.value,
-		"cursor-not-allowed": V.value,
+		"cursor-pointer": !H.value && !U.value,
+		"cursor-not-allowed": H.value,
 		[Y.value?.track ?? ""]: !0,
 		[X.value ?? ""]: !0,
 		[J.value?.track ?? ""]: !0,
-		[F.value.track ?? ""]: !0
-	}))), De = o(() => t(l(P.value?.bar ?? {}, ["style"]), {
+		[I.value.track ?? ""]: !0
+	}))), Ee = o(() => t(l(F.value?.bar ?? {}, ["style"]), {
 		"aria-hidden": !0,
 		style: {
-			width: K.value.width,
-			insetInlineStart: K.value.start
+			width: q.value.width,
+			insetInlineStart: q.value.start
 		}
-	}, v({
+	}, y({
 		"absolute top-0 h-full": !0,
 		[X.value ?? ""]: !0,
 		[J.value?.bar ?? ""]: !0,
-		[F.value.bar ?? ""]: !0
-	}))), Oe = (e) => {
-		let n = S(W.value, e, L.value), r = g(n, I.value.min, I.value.max), i = D.value === e;
+		[I.value.bar ?? ""]: !0
+	}))), $ = (e) => {
+		let n = C(G.value, e, R.value), r = _(n, L.value.min, L.value.max), i = O.value === e;
 		return t({
-			...l(P.value?.thumb ?? {}, ["style"]),
+			...l(F.value?.thumb ?? {}, ["style"]),
 			role: "slider",
 			type: "button",
 			"aria-valuenow": n,
-			"aria-valuemin": I.value.min,
-			"aria-valuemax": I.value.max,
-			tabIndex: V.value ? -1 : 0,
+			"aria-valuemin": L.value.min,
+			"aria-valuemax": L.value.max,
+			tabIndex: H.value ? -1 : 0,
 			"data-bridge-slider-thumb": e,
-			disabled: V.value || void 0,
+			disabled: H.value || void 0,
 			"aria-orientation": "horizontal",
-			"aria-describedby": ve.value,
-			onKeydown: Te(e),
-			id: `${B.value}-thumb-${e}`,
-			"aria-disabled": V.value || void 0,
-			"aria-readonly": H.value || void 0,
-			"aria-invalid": U.value || void 0,
-			onPointerdown: we(e),
+			"aria-describedby": _e.value,
+			onKeydown: Ce(e),
+			id: `${V.value}-thumb-${e}`,
+			"aria-disabled": H.value || void 0,
+			"aria-readonly": U.value || void 0,
+			"aria-invalid": W.value || void 0,
+			onPointerdown: Se(e),
 			style: { insetInlineStart: `${r}%` },
 			onFocus: () => {
-				O.value = e;
+				k.value = e;
 			},
 			onPointerenter: () => {
-				O.value = e;
+				k.value = e;
 			},
 			onBlur: () => {
-				D.value !== e && (O.value = O.value === e ? null : O.value);
+				O.value !== e && (k.value = k.value === e ? null : k.value);
 			},
 			onPointerleave: () => {
-				D.value !== e && (O.value = O.value === e ? null : O.value);
+				O.value !== e && (k.value = k.value === e ? null : k.value);
 			},
-			"aria-label": P.value?.thumb?.["aria-label"] ?? (L.value ? e === 0 ? "Minimum" : "Maximum" : j.merged.value.label || "Slider")
-		}, {}, v({
+			"aria-label": F.value?.thumb?.["aria-label"] ?? (R.value ? e === 0 ? "Minimum" : "Maximum" : M.merged.value.label || "Slider")
+		}, {}, y({
 			"group/thumb absolute z-10 flex -translate-x-1/2 items-center justify-center bg-transparent leading-none outline-none": !0,
-			"cursor-grab": !V.value && !H.value,
+			"cursor-grab": !H.value && !U.value,
 			"cursor-grabbing": i,
-			"cursor-not-allowed": V.value,
+			"cursor-not-allowed": H.value,
 			[Y.value?.thumb ?? ""]: !0,
-			[F.value.thumb ?? ""]: !0
+			[I.value.thumb ?? ""]: !0
 		}));
-	}, ke = (e) => {
-		let n = D.value === e;
-		return t(P.value?.thumbKnob, { "aria-hidden": !0 }, v({
+	}, De = (e) => {
+		let n = O.value === e;
+		return t(F.value?.thumbKnob, { "aria-hidden": !0 }, y({
 			"block rounded-full border-2 shadow-sm transition-transform duration-100": !0,
 			"group-focus-visible/thumb:ring-2 group-focus-visible/thumb:ring-offset-2": !0,
 			"scale-120": n,
 			[J.value?.focus ?? ""]: !0,
 			[Y.value?.thumbKnob ?? ""]: !0,
 			[J.value?.thumb ?? ""]: !0,
-			[F.value.thumbKnob ?? ""]: !0
+			[I.value.thumbKnob ?? ""]: !0
 		}));
-	}, Ae = (e) => {
-		let n = g(e.value, I.value.min, I.value.max), r = ie({
-			range: L.value,
-			min: I.value.min,
-			max: I.value.max,
+	}, Oe = (e) => {
+		let n = _(e.value, L.value.min, L.value.max), r = ie({
+			range: R.value,
+			min: L.value.min,
+			max: L.value.max,
 			stopValue: e.value,
-			value: W.value
+			value: G.value
 		});
-		return t(l(P.value?.stop ?? {}, ["style"]), {
+		return t(l(F.value?.stop ?? {}, ["style"]), {
 			"aria-hidden": !0,
 			style: {
 				insetInlineStart: `${n}%`,
 				display: r ? "none" : void 0
 			}
-		}, v({
+		}, y({
 			"absolute top-1/2 h-2 w-2 -translate-x-1/2 -translate-y-1/2 rounded-full bg-white dark:bg-dark-400": !0,
-			[F.value.stop ?? ""]: !0
+			[I.value.stop ?? ""]: !0
 		}));
-	}, je = o(() => t(P.value?.stopLabels, { "aria-hidden": !0 }, v({
+	}, ke = o(() => t(F.value?.stopLabels, { "aria-hidden": !0 }, y({
 		"relative h-[1lh] w-full text-xs": !0,
-		[F.value.stopLabels ?? ""]: !0
+		[I.value.stopLabels ?? ""]: !0
 	})));
 	return {
-		bounds: I,
-		merged: M,
-		barBind: De,
-		isRange: L,
-		trackRef: k,
-		baseField: j,
-		trackBind: $,
-		controlBind: Ee,
-		showTooltip: R,
-		getStopBind: Ae,
-		thumbIndexes: o(() => L.value ? [0, 1] : [0]),
-		getThumbBind: Oe,
-		resolvedStops: G,
-		resolvedValue: W,
-		isTooltipOpen: (e) => R.value && (D.value === e || O.value === e),
-		hasStopLabels: be,
-		stopLabelsBind: je,
+		bounds: L,
+		merged: N,
+		barBind: Ee,
+		isRange: R,
+		trackRef: A,
+		baseField: M,
+		trackBind: Te,
+		controlBind: we,
+		showTooltip: z,
+		getStopBind: Oe,
+		thumbIndexes: o(() => R.value ? [0, 1] : [0]),
+		getThumbBind: $,
+		resolvedStops: K,
+		resolvedValue: G,
+		isTooltipOpen: (e) => z.value && (O.value === e || k.value === e),
+		hasStopLabels: ve,
+		stopLabelsBind: ke,
 		getStopLabelBind: (e) => {
-			let n = g(e.value, I.value.min, I.value.max);
-			return t(l(P.value?.stopLabel ?? {}, ["style"]), { style: { insetInlineStart: `${n}%` } }, v({
+			let n = _(e.value, L.value.min, L.value.max);
+			return t(l(F.value?.stopLabel ?? {}, ["style"]), { style: { insetInlineStart: `${n}%` } }, y({
 				"absolute top-0 -translate-x-1/2 whitespace-nowrap": !0,
-				"text-dark-700 dark:text-dark-400": !U.value,
-				[q.value.stopLabel ?? ""]: U.value,
-				[F.value.stopLabel ?? ""]: !0
+				"text-dark-700 dark:text-dark-400": !W.value,
+				"text-error-600 dark:text-error-400": W.value,
+				[I.value.stopLabel ?? ""]: !0
 			}));
 		},
-		getThumbKnobBind: ke,
-		tooltipProps: o(() => P.value?.tooltip),
-		readThumbValue: (e) => S(W.value, e, L.value)
+		getThumbKnobBind: De,
+		tooltipProps: o(() => F.value?.tooltip),
+		readThumbValue: (e) => C(G.value, e, R.value)
 	};
 }
 //#endregion
-export { x as sliderBridgeKeys, w as useSlider };
+export { S as sliderBridgeKeys, T as useSlider };

package/dist/Components/Slider/slider.types.d.ts

@@ -1,6 +1,6 @@
 import { ButtonHTMLAttributes, HTMLAttributes, Slot } from 'vue';
 import { SliderRangeValue, SliderStopInput } from '@bridge-ui/core/Domain';
-import { BaseFieldInvalidated, SliderColor, SliderInvalidated, SliderRounded } from '@bridge-ui/core/Tokens';
+import { SliderColor, SliderRounded } from '@bridge-ui/core/Tokens';
 import { MergeHtmlProps, MergeProps } from '@bridge-ui/core/Utils';
 import { BaseFieldClasses, BaseFieldCustomProps, BaseFieldOwnProps, BaseFieldSlots } from '../BaseField/baseField.types';
 import { TooltipOwnProps } from '../Tooltip/tooltip.types';
@@ -38,18 +38,11 @@ export interface SliderClasses extends BaseFieldClasses {
      */
     track?: string;
 }
-export interface SliderCustomProps extends Omit<BaseFieldCustomProps, "invalidated"> {
+export interface SliderCustomProps extends BaseFieldCustomProps {
     /**
      * Props forwarded to the filled bar.
      */
     bar?: HTMLAttributes;
-    /**
-     * Control error chrome (`bar`, `thumb`, `track`, …). Error message color comes
-     * from {@link BaseField}; pass `errorMessage` here to override.
-     *
-     * @default undefined
-     */
-    invalidated?: Partial<SliderInvalidated & BaseFieldInvalidated>;
     /**
      * Props forwarded to stop markers.
      */

package/dist/Components/Snackbar/Snackbar.vue_vue_type_script_setup_true_lang.js

@@ -66,7 +66,8 @@ var w = { class: "w-full max-w-sm pointer-events-auto" }, T = ["src"], E = { cla
 			onLeaveComplete: () => M("leave-complete"),
 			onShowChange: (e) => M("show-change", e)
 		}), Y = i(() => !!(j.icon || K.value || I.value.img)), X = i(() => !!(j.title || I.value.title)), Z = i(() => !!(j.description || I.value.description)), Q = i(() => !!j.right), $ = i(() => I.value.teleportTo === !1), ee = i(() => I.value.teleportTo === !1 ? "body" : I.value.teleportTo);
-		return (e, n) => (_(), a(r, {
+		return (e, n) => b(L) ? (_(), a(r, {
+			key: 0,
 			to: ee.value,
 			disabled: $.value
 		}, [b(L) && b(V) ? (_(), s("div", g(m({ key: 0 }, b(H))), [c("div", w, [c("div", m(b(z), { class: b(C)(b(z).class, { flex: Q.value }) }), [
@@ -155,7 +156,7 @@ var w = { class: "w-full max-w-sm pointer-events-auto" }, T = ["src"], E = { cla
 			], 2)], 16),
 			v(e.$slots, "right"),
 			b(W) ? (_(), s("div", g(m({ key: 0 }, b(G))), null, 16)) : o("", !0)
-		], 16)) : o("", !0)], 8, ["to", "disabled"]));
+		], 16)) : o("", !0)], 8, ["to", "disabled"])) : o("", !0);
 	}
 });
 //#endregion

package/dist/Components/Switch/composables/useSwitch.js

@@ -2,8 +2,8 @@ import { mergePartBind as e, useBridgeUIComponent as t, useBridgeUIMergedRegistr
 import { useFormControl as r } from "../../FormControl/composables/useFormControl.js";
 import { computed as i, toValue as a, useAttrs as o } from "vue";
 import { get as s, omit as c } from "es-toolkit/compat";
-import { switchColorProps as l, switchInvalidatedProps as u, switchRoundedProps as d, switchSizeProps as f } from "@bridge-ui/core/Tokens";
-import { cn as p, mergeBridgeUILayeredClasses as m, splitComponentProps as h } from "@bridge-ui/core/Utils";
+import { switchColorProps as l, switchRoundedProps as u, switchSizeProps as d } from "@bridge-ui/core/Tokens";
+import { cn as f, getColorToken as p, mergeBridgeUILayeredClasses as m, splitComponentProps as h } from "@bridge-ui/core/Utils";
 //#region src/Components/Switch/composables/useSwitch.ts
 var g = [
 	"size",
@@ -36,46 +36,50 @@ function _(_, v, y) {
 		props: () => S.value.componentProps
 	}), D = i(() => !!a(y)), O = i(() => {
 		let e = m(l, w.value?.tokens?.color);
-		return s(e, C.value.color ?? "primary");
-	}), k = i(() => m(u, w.value?.tokens?.invalidated)), A = i(() => x.invalidated.value ? k.value : O.value), j = i(() => {
-		let e = m(f, w.value?.tokens?.size);
+		return p({
+			tokens: e,
+			color: C.value.color,
+			invalid: x.invalidated.value
+		});
+	}), k = i(() => {
+		let e = m(d, w.value?.tokens?.size);
 		return s(e, C.value.size ?? "sm");
-	}), M = i(() => {
-		let e = m(d, w.value?.tokens?.rounded);
+	}), A = i(() => {
+		let e = m(u, w.value?.tokens?.rounded);
 		return s(e, C.value.rounded ?? "full");
-	}), N = i(() => e({
+	}), j = i(() => e({
 		...T.value?.input,
 		...x.controlBind.value,
 		role: "switch",
 		type: "checkbox"
-	}, c(S.value.inheritedAttrs, ["class"]), p({
+	}, c(S.value.inheritedAttrs, ["class"]), f({
 		"sr-only": !0,
 		[E.value.input ?? ""]: !0
-	}))), P = i(() => e(T.value?.track, { "aria-hidden": !0 }, p({
+	}))), M = i(() => e(T.value?.track, { "aria-hidden": !0 }, f({
 		"block cursor-pointer transition ease-in-out duration-100": !0,
-		[j.value?.track ?? ""]: !0,
-		[M.value ?? ""]: !0,
-		[A.value?.track ?? ""]: !D.value,
-		[A.value?.trackChecked ?? ""]: D.value,
+		[k.value?.track ?? ""]: !0,
+		[A.value ?? ""]: !0,
+		[O.value?.track ?? ""]: !D.value,
+		[O.value?.trackChecked ?? ""]: D.value,
 		[E.value.track ?? ""]: !0
-	}))), F = i(() => e(T.value?.thumb, { "aria-hidden": !0 }, p({
+	}))), N = i(() => e(T.value?.thumb, { "aria-hidden": !0 }, f({
 		"pointer-events-none absolute start-0.5 top-1/2 -translate-y-1/2 rounded-full shadow-sm transition ease-in-out duration-200": !0,
-		[j.value?.thumb ?? ""]: !0,
-		[j.value?.thumbCheckedTranslate ?? ""]: D.value,
-		[A.value?.thumb ?? ""]: !0,
+		[k.value?.thumb ?? ""]: !0,
+		[k.value?.thumbCheckedTranslate ?? ""]: D.value,
+		[O.value?.thumb ?? ""]: !0,
 		[E.value.thumb ?? ""]: !0
 	})));
 	return {
-		fieldBind: i(() => e({}, {}, p({
+		fieldBind: i(() => e({}, {}, f({
 			"relative inline-flex shrink-0 select-none": !0,
 			"has-[:focus-visible]:ring-2 has-[:focus-visible]:ring-offset-2": !0,
-			[M.value ?? ""]: !0,
-			[A.value?.focus ?? ""]: !0
+			[A.value ?? ""]: !0,
+			[O.value?.focus ?? ""]: !0
 		}))),
-		inputBind: N,
+		inputBind: j,
 		isChecked: D,
-		thumbBind: F,
-		trackBind: P,
+		thumbBind: N,
+		trackBind: M,
 		formControl: x
 	};
 }

package/dist/Components/TimeField/TimeField.vue.d.ts

@@ -23,6 +23,7 @@ declare const __VLS_base: import('vue').DefineComponent<__VLS_PublicProps, {}, {
     onOpen?: (() => any) | undefined;
     "onUpdate:modelValue"?: ((value: Date | null | undefined) => any) | undefined;
 }>, {
+    fill: boolean;
     showFooter: boolean;
     showErrorIcon: boolean;
     clearable: boolean;