@bridge-ui/vue 0.0.11 → 0.1.1

package/dist/Components/TimeRangeField/composables/useTimeRangeField.js

@@ -1,20 +1,22 @@
 import { useDateAdapter as e, useDateAdapterContext as t } from "../../../Adapters/Date/useDateAdapter.js";
 import { hasNamedSlot as n } from "../../../Utils/slotOrProp.js";
 import { useBreakpoint as r } from "../../../Utils/useBreakpoint.js";
-import { mergePartBind as i, resolveFieldAdornmentIconSize as a, useFieldShowFooter as o } from "../../../Utils/index.js";
-import { formFieldBridgeKeys as s, useFormField as c } from "../../FormField/composables/useFormField.js";
-import { computed as l, ref as u, useAttrs as d, useSlots as f } from "vue";
-import { get as p, isNil as m, omit as h } from "es-toolkit/compat";
-import { isFieldOverlayDialog as g, isTimeRangeValue as _, resolveFieldOverlay as v } from "@bridge-ui/core/Domain";
-import { listboxColorProps as y } from "@bridge-ui/core/Tokens";
-import { cn as b, splitComponentProps as x } from "@bridge-ui/core/Utils";
+import { mergePartBind as i, resolveFieldAdornmentIconSize as a, useFieldShowFooter as o, usePickerFill as s } from "../../../Utils/index.js";
+import { formFieldBridgeKeys as c, useFormField as l } from "../../FormField/composables/useFormField.js";
+import { computed as u, ref as d, useAttrs as f, useSlots as p } from "vue";
+import { get as m, isNil as h, omit as g } from "es-toolkit/compat";
+import { isTimeRangeValue as _, resolveFieldOverlay as v, resolveFieldPickerClassName as y } from "@bridge-ui/core/Domain";
+import { listboxColorProps as b } from "@bridge-ui/core/Tokens";
+import { cn as x, splitComponentProps as S } from "@bridge-ui/core/Utils";
 //#region src/Components/TimeRangeField/composables/useTimeRangeField.ts
-var S = [
+var C = [
 	"ampm",
+	"fill",
 	"classes",
 	"maxTime",
 	"minTime",
 	"overlay",
+	"editable",
 	"interval",
 	"timeZone",
 	"clearable",
@@ -24,8 +26,8 @@ var S = [
 	"defaultValue",
 	"disableTimes"
 ];
-function C(e, t, n, r, i) {
-	return m(e) || !_(e) ? "" : `${t.formatTime(e[0], n, {
+function w(e, t, n, r, i) {
+	return h(e) || !_(e) ? "" : `${t.formatTime(e[0], n, {
 		ampm: r,
 		showSeconds: i
 	})} – ${t.formatTime(e[1], n, {
@@ -33,120 +35,125 @@ function C(e, t, n, r, i) {
 		showSeconds: i
 	})}`;
 }
-function w(_, w, T) {
-	let E = d(), D = f(), O = e(), k = r(), A = t(), j = u(!1), M = u(null), N = l(() => x({
+function T(_, T, E) {
+	let D = f(), ee = p(), te = e(), O = r(), k = t(), A = d(!1), j = d(null), M = u(() => S({
 		props: {
-			...E,
+			...D,
 			..._
 		},
-		bridgeKeys: S
-	})), P = l(() => N.value.componentProps), F = l(() => A(P.value.timeZone)), I = l(() => w.value ?? null), L = l(() => P.value.clearable !== !1), R = l(() => !m(I.value)), z = (e) => {
-		M.value = e instanceof HTMLElement ? e : null;
+		bridgeKeys: C
+	})), N = u(() => M.value.componentProps), P = u(() => k(N.value.timeZone)), F = u(() => T.value ?? null), I = u(() => N.value.clearable !== !1), L = u(() => !h(F.value)), R = (e) => {
+		j.value = e instanceof HTMLElement ? e : null;
 	};
-	function B(e) {
-		j.value !== e && (j.value = e, T(e ? "open" : "close"));
+	function z(e) {
+		A.value !== e && (A.value = e, E(e ? "open" : "close"));
 	}
-	let V = l(() => h(N.value.inheritedAttrs, ["class"])), H = l(() => {
-		let e = x({
-			bridgeKeys: s,
-			props: V.value
-		}).componentProps, t = e.endIcon ?? (n(D, "end") ? void 0 : "clock"), { menu: r, clearIcon: a, timeRangePicker: o, ...c } = P.value.customProps ?? {};
+	let B = u(() => g(M.value.inheritedAttrs, ["class"])), V = u(() => {
+		let e = S({
+			bridgeKeys: c,
+			props: B.value
+		}).componentProps, t = e.endIcon ?? (n(ee, "end") ? void 0 : "clock"), { menu: r, clearIcon: a, timeRangePicker: o, ...s } = N.value.customProps ?? {};
 		return {
 			...e,
 			endIcon: t,
-			classes: P.value.classes,
+			classes: N.value.classes,
 			customProps: {
-				...c,
-				container: i(c.container, {}, {
-					ref: z,
-					class: b({ "cursor-pointer": !_.disabled && !_.readonly }),
+				...s,
+				container: i(s.container, {}, {
+					ref: R,
+					class: x({ "cursor-pointer": !_.disabled && !_.readonly }),
 					onClick: (e) => {
-						_.disabled || _.readonly || e.target.closest("[data-field-clear]") || B(!0);
+						_.disabled || _.readonly || e.target.closest("[data-field-clear]") || z(!0);
 					}
 				})
 			}
 		};
-	}), U = c(() => H.value, {
+	}), H = l(() => V.value, {
 		size: "md",
 		rounded: "md",
 		color: "primary",
 		variant: "outline",
 		showErrorIcon: !0
-	}, { componentName: "TimeRangeField" }), W = l(() => R.value && L.value && !_.readonly && !U.isDisabled.value), G = l(() => C(I.value, O.value, F.value, P.value.ampm, P.value.showSeconds));
-	function K(e) {
-		w.value = e, T("change", e);
+	}, { componentName: "TimeRangeField" }), U = u(() => L.value && I.value && !_.readonly && !H.isDisabled.value), W = u(() => w(F.value, te.value, P.value, N.value.ampm, N.value.showSeconds));
+	function G(e) {
+		T.value = e, E("change", e);
 	}
-	let q = o({
+	let K = o({
 		componentName: "TimeRangeField",
-		showFooter: () => P.value.showFooter,
-		overlay: () => v(P.value.overlay, k.mobile)
+		showFooter: () => N.value.showFooter,
+		overlay: () => v(N.value.overlay, O.mobile)
 	});
-	function J(e) {
-		if (K(e), q.value) {
-			T("apply");
+	function q(e) {
+		if (G(e), K.value) {
+			E("apply");
 			return;
 		}
-		B(!1);
+		z(!1);
 	}
-	function Y() {
-		T("cancel");
+	function J() {
+		E("cancel");
 	}
-	function X(e) {
-		e?.preventDefault(), e?.stopPropagation(), !(_.disabled || _.readonly) && (K(null), T("clear"), B(!1));
+	function Y(e) {
+		e?.preventDefault(), e?.stopPropagation(), !(_.disabled || _.readonly) && (G(null), E("clear"), z(!1));
 	}
-	function Z(e) {
+	function X(e) {
 		e.preventDefault();
 	}
-	let Q = l(() => i({
-		readonly: !0,
-		value: G.value,
+	let Z = u(() => i({
+		value: W.value,
+		readonly: !N.value.editable || H.inputBind.value.readonly,
 		onFocus: (e) => {
-			U.inputBind.value.onFocus?.(e), B(!0);
+			H.inputBind.value.onFocus?.(e), z(!0);
 		},
 		onKeydown: (e) => {
-			U.inputBind.value.onKeydown?.(e), e.key === "Escape" && B(!1);
+			H.inputBind.value.onKeydown?.(e), e.key === "Escape" && z(!1);
 		}
-	}, void 0, U.inputBind.value)), $ = l(() => P.value.overlay), ee = l(() => ({
-		modal: P.value.customProps?.modal,
-		drawer: P.value.customProps?.drawer,
+	}, void 0, H.inputBind.value)), ne = u(() => N.value.overlay), re = u(() => ({
+		modal: N.value.customProps?.modal,
+		drawer: N.value.customProps?.drawer,
 		menu: {
-			anchorEl: M.value,
+			anchorEl: j.value,
 			placement: "bottom-start",
-			...P.value.customProps?.menu
+			...N.value.customProps?.menu
 		}
-	})), te = l(() => P.value.customProps?.timeRangePicker), ne = l(() => v(P.value.overlay, k.mobile)), re = l(() => g(ne.value) ? "w-full shadow-none" : void 0), ie = l(() => a(U.merged.value.size)), ae = l(() => p(y, [U.merged.value.color ?? "primary", "clear"]) ?? "text-dark-400 hover:text-dark-600 dark:text-dark-500 dark:hover:text-dark-300");
+	})), ie = u(() => N.value.customProps?.timeRangePicker), Q = u(() => v(N.value.overlay, O.mobile)), $ = s({
+		overlay: Q,
+		componentName: "TimeRangeField",
+		fill: () => N.value.fill
+	}), ae = u(() => y($.value, Q.value)), oe = u(() => a(H.merged.value.size)), se = u(() => m(b, [H.merged.value.color ?? "primary", "clear"]) ?? "text-dark-400 hover:text-dark-600 dark:text-dark-500 dark:hover:text-dark-300");
 	return {
-		open: j,
-		overlay: $,
-		hasValue: R,
-		timeOnly: P,
-		formField: U,
-		inputBind: Q,
-		clearable: L,
-		clearBind: l(() => i({}, {}, {
+		open: A,
+		fill: $,
+		overlay: ne,
+		hasValue: L,
+		timeOnly: N,
+		formField: H,
+		inputBind: Z,
+		clearable: I,
+		clearBind: u(() => i({}, {}, {
 			tabindex: 0,
 			role: "button",
 			"data-field-clear": !0,
-			onMousedown: Z,
-			class: b({
+			onMousedown: X,
+			class: x({
 				"inline-flex shrink-0 cursor-pointer items-center justify-center rounded-sm transition-colors duration-150": !0,
-				[ae.value]: !0,
-				[P.value.classes?.clear ?? ""]: !0
+				[se.value]: !0,
+				[N.value.classes?.clear ?? ""]: !0
 			})
 		})),
-		clearValue: X,
-		modelValue: I,
-		showFooter: q,
-		pickerClass: re,
-		containerRef: M,
-		clearIconSize: ie,
-		showClearIcon: W,
-		handleOpenChange: B,
-		handlePickerChange: J,
-		handlePickerCancel: Y,
-		overlayCustomProps: ee,
-		timeRangePickerCustomProps: te
+		clearValue: Y,
+		modelValue: F,
+		showFooter: K,
+		pickerClass: ae,
+		containerRef: j,
+		clearIconSize: oe,
+		showClearIcon: U,
+		handleOpenChange: z,
+		handlePickerChange: q,
+		handlePickerCancel: J,
+		overlayCustomProps: re,
+		timeRangePickerCustomProps: ie
 	};
 }
 //#endregion
-export { w as useTimeRangeField };
+export { T as useTimeRangeField };

package/dist/Components/TimeRangeField/timeRangeField.types.d.ts

@@ -108,6 +108,22 @@ export interface TimeRangeFieldOwnProps extends Omit<FormFieldOwnProps, "field"
      * @default undefined
      */
     disableTimes?: DisableTimesInput;
+    /**
+     * Unlocks the input for typing. The field does not parse or commit typed
+     * text; use the picker (or your own component) to update the value. When
+     * unset, the input is read-only.
+     *
+     * @default false
+     */
+    editable?: boolean;
+    /**
+     * When `true`, the picker fills the overlay width.
+     * When `false`, it stays at its minimum width.
+     * Unset: `true` for `drawer`, `false` for `menu` and `modal`.
+     *
+     * @default undefined
+     */
+    fill?: boolean;
     /**
      * Minute step between options.
      *

package/dist/Components/TimeRangePicker/TimeRangePicker.vue_vue_type_script_setup_true_lang.js

@@ -15,6 +15,8 @@ var v = /*@__PURE__*/ c({
 		disabled: { type: Boolean },
 		disableTimes: {},
 		endTitle: {},
+		error: { type: Boolean },
+		fill: { type: Boolean },
 		interval: {},
 		maxTime: {},
 		minTime: {},
@@ -28,7 +30,6 @@ var v = /*@__PURE__*/ c({
 		showSeconds: { type: Boolean },
 		startTitle: {},
 		timeZone: {},
-		tokens: {},
 		value: {}
 	},
 	emits: [
@@ -37,7 +38,7 @@ var v = /*@__PURE__*/ c({
 		"change"
 	],
 	setup(c, { emit: v }) {
-		let { merged: y, endBind: b, rootBind: x, endTitle: S, startBind: C, startTitle: w, footerBind: T, panelsBind: E, showFooter: D, applyLabel: O, timeTokens: k, handleApply: A, cancelLabel: j, endTitleBind: M, handleCancel: N, startTitleBind: P, endDisplayValue: F, handleEndChange: I, applyButtonProps: L, startDisplayValue: R, cancelButtonProps: z, handleStartChange: B } = n(c, {
+		let { merged: y, endBind: b, rootBind: x, endTitle: S, startBind: C, startTitle: w, footerBind: T, panelsBind: E, showFooter: D, applyLabel: O, handleApply: k, cancelLabel: A, endTitleBind: j, handleCancel: M, startTitleBind: N, endDisplayValue: P, handleEndChange: F, applyButtonProps: I, startDisplayValue: L, cancelButtonProps: R, handleStartChange: z } = n(c, {
 			ampm: !1,
 			interval: 1,
 			rounded: "md",
@@ -45,25 +46,27 @@ var v = /*@__PURE__*/ c({
 			showSeconds: !1,
 			orientation: "horizontal"
 		}, v);
-		return (n, c) => (p(), i("div", f(l(g(x))), [a("div", f(l(g(E))), [a("div", f(l(g(C))), [a("p", { class: d(g(P)) }, h(g(w)), 3), s(g(t), {
+		return (n, c) => (p(), i("div", f(l(g(x))), [a("div", f(l(g(E))), [a("div", f(l(g(C))), [a("p", { class: d(g(N)) }, h(g(w)), 3), s(g(t), {
 			ampm: g(y).ampm,
-			tokens: g(k),
+			fill: g(y).fill,
 			color: g(y).color,
+			error: g(y).error,
 			rounded: g(y).rounded,
-			value: g(R),
+			value: g(L),
 			"max-time": g(y).maxTime,
 			"min-time": g(y).minTime,
 			disabled: g(y).disabled,
 			interval: g(y).interval,
 			"read-only": g(y).readOnly,
 			"time-zone": g(y).timeZone,
-			onChange: g(B),
+			onChange: g(z),
 			"show-seconds": g(y).showSeconds,
 			"disable-times": g(y).disableTimes
 		}, null, 8, [
 			"ampm",
-			"tokens",
+			"fill",
 			"color",
+			"error",
 			"rounded",
 			"value",
 			"max-time",
@@ -75,11 +78,12 @@ var v = /*@__PURE__*/ c({
 			"onChange",
 			"show-seconds",
 			"disable-times"
-		])], 16), a("div", f(l(g(b))), [a("p", { class: d(g(M)) }, h(g(S)), 3), s(g(t), {
+		])], 16), a("div", f(l(g(b))), [a("p", { class: d(g(j)) }, h(g(S)), 3), s(g(t), {
 			ampm: g(y).ampm,
-			tokens: g(k),
+			fill: g(y).fill,
 			color: g(y).color,
-			value: g(F),
+			error: g(y).error,
+			value: g(P),
 			rounded: g(y).rounded,
 			"max-time": g(y).maxTime,
 			"min-time": g(y).minTime,
@@ -87,13 +91,14 @@ var v = /*@__PURE__*/ c({
 			interval: g(y).interval,
 			"read-only": g(y).readOnly,
 			"time-zone": g(y).timeZone,
-			onChange: g(I),
+			onChange: g(F),
 			"show-seconds": g(y).showSeconds,
 			"disable-times": g(y).disableTimes
 		}, null, 8, [
 			"ampm",
-			"tokens",
+			"fill",
 			"color",
+			"error",
 			"value",
 			"rounded",
 			"max-time",
@@ -106,16 +111,16 @@ var v = /*@__PURE__*/ c({
 			"show-seconds",
 			"disable-times"
 		])], 16)], 16), g(D) ? (p(), i("div", f(u({ key: 0 }, g(T))), [m(n.$slots, "footer", {
-			apply: g(A),
-			cancel: g(N)
+			apply: g(k),
+			cancel: g(M)
 		}, () => [s(g(e), u({
 			variant: "flat",
 			color: "secondary",
-			onClick: g(N)
-		}, g(z)), {
-			default: _(() => [o(h(g(j)), 1)]),
+			onClick: g(M)
+		}, g(R)), {
+			default: _(() => [o(h(g(A)), 1)]),
 			_: 1
-		}, 16, ["onClick"]), s(g(e), u({ color: "primary" }, g(L), { onClick: g(A) }), {
+		}, 16, ["onClick"]), s(g(e), u({ color: "primary" }, g(I), { onClick: g(k) }), {
 			default: _(() => [o(h(g(O)), 1)]),
 			_: 1
 		}, 16, ["onClick"])])], 16)) : r("", !0)], 16));

package/dist/Components/TimeRangePicker/composables/useTimeRangePicker.d.ts

@@ -10,15 +10,11 @@ type TimeRangePickerMerged = MergeLibDefaults<TimeRangePickerOwnProps, TimeRange
 export declare function useTimeRangePicker(props: MaybeRefOrGetter<TimeRangePickerOwnProps>, libDefaults: TimeRangePickerLibDefaults, emit: SetupContext<TimeRangePickerEmits>["emit"]): {
     merged: import('vue').ComputedRef<TimeRangePickerMerged>;
     endBind: import('vue').ComputedRef<import('@bridge-ui/core/Utils').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, {}>>;
-    rootBind: import('vue').ComputedRef<import('@bridge-ui/core/Utils').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, Partial<Omit<TimeRangePickerOwnProps, "color" | "orientation" | "value" | "classes" | "tokens" | "showFooter" | "customProps" | "rounded" | "disabled" | "defaultValue" | "readOnly" | "timeZone" | "ampm" | "disableTimes" | "interval" | "maxTime" | "minTime" | "showSeconds" | "endTitle" | "startTitle">>>>;
+    rootBind: import('vue').ComputedRef<import('@bridge-ui/core/Utils').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, Partial<Omit<TimeRangePickerOwnProps, "error" | "color" | "fill" | "orientation" | "value" | "classes" | "showFooter" | "customProps" | "rounded" | "disabled" | "defaultValue" | "readOnly" | "timeZone" | "ampm" | "disableTimes" | "interval" | "maxTime" | "minTime" | "showSeconds" | "endTitle" | "startTitle">>>>;
     startBind: import('vue').ComputedRef<import('@bridge-ui/core/Utils').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, {}>>;
     footerBind: import('vue').ComputedRef<import('@bridge-ui/core/Utils').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, {}>>;
     panelsBind: import('vue').ComputedRef<import('@bridge-ui/core/Utils').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, {}>>;
     showFooter: import('vue').ComputedRef<boolean>;
-    timeTokens: import('vue').ComputedRef<{
-        color: Record<string, Partial<import('@bridge-ui/core/Tokens').TimeColorItem>> | undefined;
-        rounded: Record<string, string> | undefined;
-    }>;
     handleApply: () => void;
     displayValue: import('vue').ComputedRef<[Date, Date] | null>;
     handleCancel: () => void;

package/dist/Components/TimeRangePicker/composables/useTimeRangePicker.js

@@ -10,9 +10,10 @@ import { cn as _, splitComponentProps as v } from "@bridge-ui/core/Utils";
 //#region src/Components/TimeRangePicker/composables/useTimeRangePicker.ts
 var y = [
 	"ampm",
+	"fill",
 	"color",
+	"error",
 	"value",
-	"tokens",
 	"classes",
 	"maxTime",
 	"minTime",
@@ -55,76 +56,74 @@ function b(b, x, S) {
 	d(() => [R.value, k.value.showFooter], ([e, t]) => {
 		t && (z.value = e);
 	});
-	let B = o(() => k.value.showFooter ? z.value : R.value), V = o(() => B.value?.[0] ?? T.value.now(F.value)), H = o(() => B.value?.[1] ?? T.value.now(F.value)), U = o(() => ({
-		color: k.value.tokens?.time?.color ?? k.value.tokens?.color,
-		rounded: k.value.tokens?.time?.rounded ?? k.value.tokens?.rounded
-	})), W = (e) => {
+	let B = o(() => k.value.showFooter ? z.value : R.value), V = o(() => B.value?.[0] ?? T.value.now(F.value)), H = o(() => B.value?.[1] ?? T.value.now(F.value)), U = (e) => {
 		I.value || (L.value = e), S("change", e);
-	}, G = (e) => {
+	}, W = (e) => {
 		let t = h(e, T.value, F.value);
 		if (k.value.showFooter) {
 			z.value = t;
 			return;
 		}
-		W(t);
-	}, K = (e) => {
+		U(t);
+	}, G = (e) => {
 		if (p(e)) return;
 		let t = B.value?.[1] ?? T.value.now(F.value);
-		G([e, t]);
-	}, q = (e) => {
+		W([e, t]);
+	}, K = (e) => {
 		if (p(e)) return;
 		let t = B.value?.[0] ?? T.value.now(F.value);
-		G([t, e]);
+		W([t, e]);
+	}, q = () => {
+		U(z.value), S("apply"), w.apply();
 	}, J = () => {
-		W(z.value), S("apply"), w.apply();
-	}, Y = () => {
 		z.value = R.value, S("cancel"), w.cancel();
-	}, X = o(() => {
+	}, Y = o(() => {
 		let e = f(g, k.value.rounded ?? "md");
 		return r(j.value?.root, M.value, _({
-			"flex w-fit flex-col overflow-hidden bg-white shadow-lg dark:bg-dark-900": !0,
+			"flex flex-col overflow-hidden bg-white shadow-lg dark:bg-dark-900": !0,
+			"w-full": k.value.fill,
+			"w-fit": !k.value.fill,
 			[e]: !0,
 			[N.value.root ?? ""]: !0
 		}));
-	}), Z = o(() => k.value.orientation === "vertical"), Q = o(() => r(j.value?.panels, {}, _({
+	}), X = o(() => k.value.orientation === "vertical"), Z = o(() => r(j.value?.panels, {}, _({
 		"flex w-full gap-2 px-2.5": !0,
-		"flex-row": !Z.value,
-		"flex-col": Z.value,
+		"flex-row": !X.value,
+		"flex-col": X.value,
 		[N.value.panels ?? ""]: !0
-	}))), te = o(() => r(j.value?.start, {}, _({
+	}))), Q = o(() => r(j.value?.start, {}, _({
 		"flex min-w-0 flex-1 flex-col gap-1": !0,
 		[N.value.start ?? ""]: !0
-	}))), ne = o(() => r(j.value?.end, {}, _({
+	}))), te = o(() => r(j.value?.end, {}, _({
 		"flex min-w-0 flex-1 flex-col gap-1": !0,
 		[N.value.end ?? ""]: !0
-	}))), $ = o(() => _({ "px-2 py-2 text-center text-xs font-medium tracking-wide text-dark-500 uppercase dark:text-dark-400": !0 })), re = o(() => _({
+	}))), $ = o(() => _({ "px-2 py-2 text-center text-xs font-medium tracking-wide text-dark-500 uppercase dark:text-dark-400": !0 })), ne = o(() => _({
 		[$.value]: !0,
 		[N.value.startTitle ?? ""]: !0
-	})), ie = o(() => _({
+	})), re = o(() => _({
 		[$.value]: !0,
 		[N.value.endTitle ?? ""]: !0
 	}));
 	return {
 		merged: k,
-		endBind: ne,
-		rootBind: X,
-		startBind: te,
+		endBind: te,
+		rootBind: Y,
+		startBind: Q,
 		footerBind: o(() => r(j.value?.footer, {}, _({
 			"flex items-center justify-end gap-2 border-t border-dark-100 bg-dark-50 px-3 py-2 dark:border-dark-800 dark:bg-dark-950/40": !0,
 			[N.value.footer ?? ""]: !0
 		}))),
-		panelsBind: Q,
+		panelsBind: Z,
 		showFooter: o(() => !!k.value.showFooter),
-		timeTokens: U,
-		handleApply: J,
+		handleApply: q,
 		displayValue: B,
-		handleCancel: Y,
-		endTitleBind: ie,
-		startTitleBind: re,
+		handleCancel: J,
+		endTitleBind: re,
+		startTitleBind: ne,
 		endDisplayValue: H,
-		handleEndChange: q,
+		handleEndChange: K,
 		startDisplayValue: V,
-		handleStartChange: K,
+		handleStartChange: G,
 		applyLabel: o(() => D("Apply")),
 		cancelLabel: o(() => D("Cancel")),
 		applyButtonProps: o(() => j.value?.applyButton),

package/dist/Components/TimeRangePicker/index.d.ts

@@ -1,3 +1,3 @@
 export { useTimeRangePicker } from './composables/useTimeRangePicker';
-export type { TimeRangePickerClasses, TimeRangePickerColorOverrides, TimeRangePickerCustomProps, TimeRangePickerEmits, TimeRangePickerOwnProps, TimeRangePickerProps, TimeRangePickerRoundedOverrides, TimeRangePickerSlots, TimeRangePickerTokens, } from './timeRangePicker.types';
+export type { TimeRangePickerClasses, TimeRangePickerColorOverrides, TimeRangePickerCustomProps, TimeRangePickerEmits, TimeRangePickerOwnProps, TimeRangePickerProps, TimeRangePickerRoundedOverrides, TimeRangePickerSlots, } from './timeRangePicker.types';
 export { default as TimeRangePicker } from './TimeRangePicker.vue';

package/dist/Components/TimeRangePicker/timeRangePicker.types.d.ts

@@ -1,6 +1,6 @@
 import { HTMLAttributes, Slot } from 'vue';
 import { DisableTimesInput, FieldOverlayFooterSlotProps, RangePickerOrientation, TimeRangeValue } from '@bridge-ui/core/Domain';
-import { TimeColor, TimeColorItem, TimeRounded } from '@bridge-ui/core/Tokens';
+import { TimeColor, TimeRounded } from '@bridge-ui/core/Tokens';
 import { MergeHtmlProps, MergeProps } from '@bridge-ui/core/Utils';
 import { ButtonProps } from '../Button/button.types';
 export interface TimeRangePickerColorOverrides {}
@@ -142,6 +142,19 @@ export interface TimeRangePickerOwnProps {
      * @default "End time"
      */
     endTitle?: string;
+    /**
+     * When `true`, applies the error color palette to tiles.
+     *
+     * @default false
+     */
+    error?: boolean;
+    /**
+     * When `true`, fills the container width.
+     * When `false` or unset, stays at the minimum width.
+     *
+     * @default false
+     */
+    fill?: boolean;
     /**
      * Minute step between options.
      *
@@ -209,12 +222,6 @@ export interface TimeRangePickerOwnProps {
      * @default undefined
      */
     timeZone?: string;
-    /**
-     * Token overrides.
-     *
-     * @default undefined
-     */
-    tokens?: TimeRangePickerTokens;
     /**
      * Controlled value.
      *
@@ -231,21 +238,4 @@ export interface TimeRangePickerSlots {
      */
     footer?: Slot<FieldOverlayFooterSlotProps>;
 }
-export interface TimeRangePickerTokens {
-    /**
-     * Color token map overrides.
-     */
-    color?: Record<string, Partial<TimeColorItem>>;
-    /**
-     * Border radius token map overrides.
-     */
-    rounded?: Record<string, string>;
-    /**
-     * Nested time panel token overrides.
-     */
-    time?: {
-        color?: Record<string, Partial<TimeColorItem>>;
-        rounded?: Record<string, string>;
-    };
-}
 export type TimeRangePickerProps = MergeHtmlProps<TimeRangePickerOwnProps, HTMLAttributes>;

package/dist/Components/Tooltip/Tooltip.vue_vue_type_script_setup_true_lang.js

@@ -57,16 +57,14 @@ var x = /*@__PURE__*/ d({
 				C.onShowChange?.(e), S("show-change", e);
 			}
 		}), P = a(() => T.value.teleportTo === !1), F = a(() => T.value.teleportTo === !1 ? "body" : T.value.teleportTo);
-		return (n, a) => (h(), c(r, null, [v(e)(v(x), "trigger") ? (h(), c("div", m(p({ key: 0 }, v(D))), [l("div", p({ ref: v(M) }, v(k)), [g(n.$slots, "trigger")], 16)], 16)) : s("", !0), (h(), o(i, {
+		return (n, a) => (h(), c(r, null, [v(e)(v(x), "trigger") ? (h(), c("div", m(p({ key: 0 }, v(D))), [l("div", p({ ref: v(M) }, v(k)), [g(n.$slots, "trigger")], 16)], 16)) : s("", !0), v(E) ? (h(), o(i, {
+			key: 1,
 			to: F.value,
 			disabled: P.value
-		}, [v(E) ? (h(), c("div", p({
-			key: 0,
-			ref: v(N)
-		}, v(A)), [v(e)(v(x), "default") ? g(n.$slots, "default", {}, void 0, void 0, 0) : v(t)(v(T).content) ? (h(), c(r, { key: 1 }, [u(_(v(T).content), 1)], 64)) : s("", !0), v(O) ? (h(), c("div", p({
+		}, [l("div", p({ ref: v(N) }, v(A)), [v(e)(v(x), "default") ? g(n.$slots, "default", {}, void 0, void 0, 0) : v(t)(v(T).content) ? (h(), c(r, { key: 1 }, [u(_(v(T).content), 1)], 64)) : s("", !0), v(O) ? (h(), c("div", p({
 			key: 2,
 			ref: v(j)
-		}, v(O)), null, 16)) : s("", !0)], 16)) : s("", !0)], 8, ["to", "disabled"]))], 64));
+		}, v(O)), null, 16)) : s("", !0)], 16)], 8, ["to", "disabled"])) : s("", !0)], 64));
 	}
 });
 //#endregion

package/dist/Utils/index.d.ts

@@ -42,6 +42,15 @@ export declare function useFieldShowFooter({ overlay, showFooter, componentName,
     overlay: MaybeRefOrGetter<ResolvedFieldOverlay>;
     showFooter: MaybeRefOrGetter<boolean | undefined>;
 }): ComputedRef<boolean>;
+/**
+ * Resolves picker fill: instance prop, then registry `defaultProps.fill`,
+ * then the overlay default from core.
+ */
+export declare function usePickerFill({ fill, overlay, componentName, }: {
+    componentName: undefined | keyof BridgeUIComponentsConfig;
+    fill: MaybeRefOrGetter<boolean | undefined>;
+    overlay?: MaybeRefOrGetter<undefined | ResolvedFieldOverlay>;
+}): ComputedRef<boolean>;
 /**
  * Merges `entry.classes` (Bridge provider) with `props.classes` (instance).
  */