@bridge-ui/vue 0.8.0 → 0.9.0

package/dist/Components/DataTable/dataTable.types.d.ts

@@ -275,7 +275,8 @@ export interface DataTableOwnProps<T> {
     columns?: DataTableColumn<T>[];
     /**
      * Controlled per-column text search: column id → query. Set `searchable`
-     * on a column to show the field in that header's filter menu.
+     * on a column to show the field in that header's filter menu and include
+     * it in the toolbar search.
      *
      * @default undefined
      */
@@ -334,7 +335,7 @@ export interface DataTableOwnProps<T> {
      */
     getRowId?: (row: T) => string;
     /**
-     * Controlled hidden column ids.
+     * Controlled hidden column ids. Omit to let the table own visibility.
      *
      * @default undefined
      */
@@ -396,8 +397,9 @@ export interface DataTableOwnProps<T> {
      */
     rows?: T[];
     /**
-     * Controlled toolbar search query. Filters visible columns client-side,
-     * or emits `update:search` only when server-paged.
+     * Controlled toolbar search query. Omit to let the table own the query.
+     * Filters `searchable` columns client-side, or all visible columns when
+     * none are `searchable`. Server-paged tables emit only.
      *
      * @default undefined
      */
@@ -414,6 +416,22 @@ export interface DataTableOwnProps<T> {
      * @default "multiple"
      */
     selectionMode?: DataTableSelectionMode;
+    /**
+     * Show the column visibility toolbar button without a `hiddenColumns`
+     * binding. The table keeps hidden ids internally when `hiddenColumns` is
+     * unset. Bind `hiddenColumns` to show the control as controlled.
+     *
+     * @default false
+     */
+    showColumnVisibility?: boolean;
+    /**
+     * Show the toolbar search field without a `search` binding. The table
+     * keeps the query internally when `search` is unset. Bind `search` to
+     * show the field as controlled.
+     *
+     * @default false
+     */
+    showSearch?: boolean;
     /**
      * Cell padding / type scale.
      *

package/dist/Components/DateField/DateField.vue_vue_type_script_setup_true_lang.js

@@ -16,7 +16,7 @@ var M = { class: "flex min-w-0 flex-1 items-center gap-1" }, N = ["aria-label"],
 		classes: {},
 		clearable: {
 			type: Boolean,
-			default: !0
+			default: !1
 		},
 		customProps: {},
 		defaultValue: {},

package/dist/Components/DateField/composables/useDateField.d.ts

@@ -436,7 +436,7 @@ export declare function useDateField(props: DateFieldOwnProps, model: Ref<null |
             onTransitionend?: ((payload: TransitionEvent) => void) | undefined;
             onTransitionrun?: ((payload: TransitionEvent) => void) | undefined;
             onTransitionstart?: ((payload: TransitionEvent) => void) | undefined;
-        }, Partial<Omit<Omit<FormFieldOwnProps, "field">, "error" | "color" | "end" | "size" | "classes" | "customProps" | "rounded" | "variant" | "label" | "disabled" | "required" | "corner" | "description" | "errorMessage" | "start" | "endIcon" | "errorIcon" | "hideErrorMessage" | "readonly" | "showDescriptionOnError" | "showErrorIcon" | "startIcon">>>>;
+        }, Partial<Omit<Omit<FormFieldOwnProps, "field">, "error" | "color" | "end" | "size" | "classes" | "customProps" | "disabled" | "endIcon" | "rounded" | "startIcon" | "variant" | "label" | "start" | "required" | "corner" | "description" | "errorMessage" | "errorIcon" | "hideErrorMessage" | "readonly" | "showDescriptionOnError" | "showErrorIcon">>>>;
         isNotched: import('vue').ComputedRef<boolean>;
         isStacked: import('vue').ComputedRef<boolean>;
         startBind: import('vue').ComputedRef<import('@bridge-ui/core/Utils').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, {}>>;
@@ -687,7 +687,7 @@ export declare function useDateField(props: DateFieldOwnProps, model: Ref<null |
         onTransitionend?: ((payload: TransitionEvent) => void) | undefined;
         onTransitionrun?: ((payload: TransitionEvent) => void) | undefined;
         onTransitionstart?: ((payload: TransitionEvent) => void) | undefined;
-    }, Partial<Omit<Omit<FormFieldOwnProps, "field">, "error" | "color" | "end" | "size" | "classes" | "customProps" | "rounded" | "variant" | "label" | "disabled" | "required" | "corner" | "description" | "errorMessage" | "start" | "endIcon" | "errorIcon" | "hideErrorMessage" | "readonly" | "showDescriptionOnError" | "showErrorIcon" | "startIcon">>>, "class", {
+    }, Partial<Omit<Omit<FormFieldOwnProps, "field">, "error" | "color" | "end" | "size" | "classes" | "customProps" | "disabled" | "endIcon" | "rounded" | "startIcon" | "variant" | "label" | "start" | "required" | "corner" | "description" | "errorMessage" | "errorIcon" | "hideErrorMessage" | "readonly" | "showDescriptionOnError" | "showErrorIcon">>>, "class", {
         value: string;
         readonly: boolean;
         onFocus: (event: FocusEvent) => void;

package/dist/Components/DateField/composables/useDateField.js

@@ -53,7 +53,7 @@ function D(h, g, v) {
 		overlay: R,
 		componentName: "DateField",
 		showFooter: () => F.value.showFooter
-	}), B = u(() => g.value ?? null), V = u(() => F.value.clearable !== !1), H = u(() => ee(B.value)), U = s({
+	}), B = u(() => g.value ?? null), V = u(() => F.value.clearable === !0), H = u(() => ee(B.value)), U = s({
 		overlay: R,
 		componentName: "DateField",
 		fill: () => F.value.fill

package/dist/Components/DateField/dateField.types.d.ts

@@ -83,7 +83,7 @@ export interface DateFieldOwnProps extends Omit<FormFieldOwnProps, "field" | "cl
     /**
      * Whether the value can be cleared.
      *
-     * @default true
+     * @default false
      */
     clearable?: boolean;
     /**

package/dist/Components/DatePicker/DatePicker.vue_vue_type_script_setup_true_lang.js

@@ -1,4 +1,4 @@
-import e from "../Button/Button.js";
+import e from "../ActionFooter/ActionFooter.js";
 import t from "../Calendar/Calendar.js";
 import { useDatePicker as n } from "./composables/useDatePicker.js";
 import { createCommentVNode as r, createElementBlock as i, createTextVNode as a, createVNode as o, defineComponent as s, guardReactiveProps as c, mergeProps as l, normalizeProps as u, openBlock as d, renderSlot as f, toDisplayString as p, unref as m, withCtx as h } from "vue";
@@ -42,7 +42,7 @@ var g = /*@__PURE__*/ s({
 		"change"
 	],
 	setup(s, { emit: g }) {
-		let { merged: _, rootBind: v, footerBind: y, showFooter: b, applyLabel: x, handleApply: S, cancelLabel: C, displayValue: w, handleCancel: T, applyButtonProps: E, cancelButtonProps: D, handleCalendarChange: O } = n(s, {
+		let { merged: _, rootBind: v, footerBind: y, showFooter: b, handleApply: x, displayValue: S, handleCancel: C, applyButtonProps: w, cancelButtonProps: T, handleCalendarChange: E } = n(s, {
 			rounded: "md",
 			startOfWeek: 0,
 			color: "primary"
@@ -52,7 +52,7 @@ var g = /*@__PURE__*/ s({
 			color: m(_).color,
 			error: m(_).error,
 			range: m(_).range,
-			value: m(w),
+			value: m(S),
 			rounded: m(_).rounded,
 			"max-date": m(_).maxDate,
 			"min-date": m(_).minDate,
@@ -62,7 +62,7 @@ var g = /*@__PURE__*/ s({
 			"time-zone": m(_).timeZone,
 			"hide-years": m(_).hideYears,
 			"hide-months": m(_).hideMonths,
-			onChange: m(O),
+			onChange: m(E),
 			"default-view": m(_).defaultView,
 			"start-of-week": m(_).startOfWeek,
 			"disable-dates": m(_).disableDates,
@@ -97,19 +97,20 @@ var g = /*@__PURE__*/ s({
 			"disable-months",
 			"hide-outside-days"
 		]), m(b) ? (d(), i("div", u(l({ key: 0 }, m(y))), [f(n.$slots, "footer", {
-			apply: m(S),
-			cancel: m(T)
-		}, () => [o(m(e), l({
-			variant: "flat",
-			color: "secondary",
-			onClick: m(T)
-		}, m(D)), {
-			default: h(() => [a(p(m(C)), 1)]),
-			_: 1
-		}, 16, ["onClick"]), o(m(e), l({ color: "primary" }, m(E), { onClick: m(S) }), {
-			default: h(() => [a(p(m(x)), 1)]),
-			_: 1
-		}, 16, ["onClick"])])], 16)) : r("", !0)], 16));
+			apply: m(x),
+			cancel: m(C)
+		}, () => [o(m(e), {
+			onApply: m(x),
+			onCancel: m(C),
+			"custom-props": {
+				applyButton: m(w),
+				cancelButton: m(T)
+			}
+		}, null, 8, [
+			"onApply",
+			"onCancel",
+			"custom-props"
+		])])], 16)) : r("", !0)], 16));
 	}
 });
 //#endregion

package/dist/Components/DatePicker/composables/useDatePicker.d.ts

@@ -6,15 +6,13 @@ type DatePickerLibDefaults = LibDefaultsShape<DatePickerOwnProps, "color" | "rou
 type DatePickerMerged = MergeLibDefaults<DatePickerOwnProps, DatePickerLibDefaults>;
 export declare function useDatePicker(props: MaybeRefOrGetter<DatePickerOwnProps>, libDefaults: DatePickerLibDefaults, emit: SetupContext<DatePickerEmits>["emit"]): {
     merged: import('vue').ComputedRef<DatePickerMerged>;
-    rootBind: import('vue').ComputedRef<import('@bridge-ui/core/Utils').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, Partial<Omit<DatePickerOwnProps, "error" | "color" | "fill" | "value" | "classes" | "showFooter" | "customProps" | "rounded" | "disabled" | "hideMonths" | "hideOutsideDays" | "hideWeekdays" | "hideYears" | "multiple" | "range" | "startOfWeek" | "timeZone" | "defaultValue" | "readOnly" | "disableDates" | "disableMonths" | "disableYears" | "maxDate" | "minDate" | "defaultView">>>>;
+    rootBind: import('vue').ComputedRef<import('@bridge-ui/core/Utils').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, Partial<Omit<DatePickerOwnProps, "error" | "color" | "fill" | "value" | "classes" | "showFooter" | "customProps" | "disabled" | "rounded" | "hideMonths" | "hideOutsideDays" | "hideWeekdays" | "hideYears" | "multiple" | "range" | "startOfWeek" | "timeZone" | "defaultValue" | "readOnly" | "disableDates" | "disableMonths" | "disableYears" | "maxDate" | "minDate" | "defaultView">>>>;
     footerBind: import('vue').ComputedRef<import('@bridge-ui/core/Utils').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, {}>>;
     showFooter: import('vue').ComputedRef<boolean>;
     handleApply: () => void;
     displayValue: import('vue').ComputedRef<DatePickerModel>;
     handleCancel: () => void;
     handleCalendarChange: (next: DatePickerModel) => void;
-    applyLabel: import('vue').ComputedRef<string>;
-    cancelLabel: import('vue').ComputedRef<string>;
     applyButtonProps: import('vue').ComputedRef<Partial<import('../../Button').ButtonProps> | undefined>;
     cancelButtonProps: import('vue').ComputedRef<Partial<import('../../Button').ButtonProps> | undefined>;
 };

package/dist/Components/DatePicker/composables/useDatePicker.js

@@ -1,12 +1,11 @@
-import { useResolveMessage as e } from "../../../Adapters/I18n/useI18nAdapter.js";
-import { mergePartBind as t, useBridgeUIComponent as n, useBridgeUIMergedRegistryClasses as r } from "../../../Utils/index.js";
-import { FIELD_OVERLAY_INJECTION_KEY as i } from "../../FieldOverlay/fieldOverlayInjectionKey.js";
-import { computed as a, inject as o, ref as s, toValue as c, useAttrs as l, watch as u } from "vue";
-import { get as d, isNil as f, omit as p } from "es-toolkit/compat";
-import { menuRoundedProps as m } from "@bridge-ui/core/Tokens";
-import { cn as h, splitComponentProps as g } from "@bridge-ui/core/Utils";
+import { mergePartBind as e, useBridgeUIComponent as t, useBridgeUIMergedRegistryClasses as n } from "../../../Utils/index.js";
+import { FIELD_OVERLAY_INJECTION_KEY as r } from "../../FieldOverlay/fieldOverlayInjectionKey.js";
+import { computed as i, inject as a, ref as o, toValue as s, useAttrs as c, watch as l } from "vue";
+import { get as u, isNil as d, omit as f } from "es-toolkit/compat";
+import { menuRoundedProps as p } from "@bridge-ui/core/Tokens";
+import { cn as m, splitComponentProps as h } from "@bridge-ui/core/Utils";
 //#region src/Components/DatePicker/composables/useDatePicker.ts
-var _ = [
+var g = [
 	"fill",
 	"color",
 	"error",
@@ -33,70 +32,68 @@ var _ = [
 	"disableMonths",
 	"hideOutsideDays"
 ];
-function v(v, y, b) {
-	let x = l(), S = o(i, {
+function _(_, v, y) {
+	let b = c(), x = a(r, {
 		apply: () => void 0,
 		cancel: () => void 0
-	}), C = e(), w = a(() => g({
-		bridgeKeys: _,
+	}), S = i(() => h({
+		bridgeKeys: g,
 		props: {
-			...x,
-			...c(v)
+			...b,
+			...s(_)
 		}
-	})), { merged: T, entry: E } = n({
-		libDefaults: y,
+	})), { merged: C, entry: w } = t({
+		libDefaults: v,
 		componentName: "DatePicker",
-		props: () => w.value.componentProps
-	}), D = a(() => T.value.customProps), O = a(() => p(w.value.inheritedAttrs, [
+		props: () => S.value.componentProps
+	}), T = i(() => C.value.customProps), E = i(() => f(S.value.inheritedAttrs, [
 		"onApply",
 		"onCancel",
 		"onChange"
-	])), k = r({
-		entry: E,
-		props: () => w.value.componentProps
-	}), A = a(() => c(v)), j = a(() => !f(A.value.value)), M = s(T.value.defaultValue ?? null), N = a(() => j.value ? A.value.value ?? null : M.value), P = s(N.value);
-	u(() => [N.value, T.value.showFooter], ([e, t]) => {
-		t && (P.value = e);
+	])), D = n({
+		entry: w,
+		props: () => S.value.componentProps
+	}), O = i(() => s(_)), k = i(() => !d(O.value.value)), A = o(C.value.defaultValue ?? null), j = i(() => k.value ? O.value.value ?? null : A.value), M = o(j.value);
+	l(() => [j.value, C.value.showFooter], ([e, t]) => {
+		t && (M.value = e);
 	});
-	let F = a(() => T.value.showFooter ? P.value : N.value), I = (e) => {
-		j.value || (M.value = e), b("change", e);
+	let N = i(() => C.value.showFooter ? M.value : j.value), P = (e) => {
+		k.value || (A.value = e), y("change", e);
 	};
 	return {
-		merged: T,
-		rootBind: a(() => {
-			let e = d(m, T.value.rounded ?? "md");
-			return t(D.value?.root, O.value, h({
+		merged: C,
+		rootBind: i(() => {
+			let t = u(p, C.value.rounded ?? "md");
+			return e(T.value?.root, E.value, m({
 				"flex flex-col overflow-hidden bg-white shadow-lg dark:bg-dark-900": !0,
-				"w-full": T.value.fill,
-				"w-fit": !T.value.fill,
-				[e]: !0,
-				[k.value.root ?? ""]: !0
+				"w-full": C.value.fill,
+				"w-fit": !C.value.fill,
+				[t]: !0,
+				[D.value.root ?? ""]: !0
 			}));
 		}),
-		footerBind: a(() => t(D.value?.footer, {}, h({
+		footerBind: i(() => e(T.value?.footer, {}, m({
 			"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,
-			[k.value.footer ?? ""]: !0
+			[D.value.footer ?? ""]: !0
 		}))),
-		showFooter: a(() => !!T.value.showFooter),
+		showFooter: i(() => !!C.value.showFooter),
 		handleApply: () => {
-			I(P.value), b("apply"), S.apply();
+			P(M.value), y("apply"), x.apply();
 		},
-		displayValue: F,
+		displayValue: N,
 		handleCancel: () => {
-			P.value = N.value, b("cancel"), S.cancel();
+			M.value = j.value, y("cancel"), x.cancel();
 		},
 		handleCalendarChange: (e) => {
-			if (T.value.showFooter) {
-				P.value = e;
+			if (C.value.showFooter) {
+				M.value = e;
 				return;
 			}
-			I(e);
+			P(e);
 		},
-		applyLabel: a(() => C("Apply")),
-		cancelLabel: a(() => C("Cancel")),
-		applyButtonProps: a(() => D.value?.applyButton),
-		cancelButtonProps: a(() => D.value?.cancelButton)
+		applyButtonProps: i(() => T.value?.applyButton),
+		cancelButtonProps: i(() => T.value?.cancelButton)
 	};
 }
 //#endregion
-export { v as useDatePicker };
+export { _ as useDatePicker };

package/dist/Components/DateRangeField/DateRangeField.vue_vue_type_script_setup_true_lang.js

@@ -16,7 +16,7 @@ var M = { class: "flex min-w-0 flex-1 items-center gap-1" }, N = ["aria-label"],
 		classes: {},
 		clearable: {
 			type: Boolean,
-			default: !0
+			default: !1
 		},
 		customProps: {},
 		defaultValue: {},

package/dist/Components/DateRangeField/composables/useDateRangeField.d.ts

@@ -435,7 +435,7 @@ export declare function useDateRangeField(props: DateRangeFieldOwnProps, model:
             onTransitionend?: ((payload: TransitionEvent) => void) | undefined;
             onTransitionrun?: ((payload: TransitionEvent) => void) | undefined;
             onTransitionstart?: ((payload: TransitionEvent) => void) | undefined;
-        }, Partial<Omit<Omit<FormFieldOwnProps, "field">, "error" | "color" | "end" | "size" | "classes" | "customProps" | "rounded" | "variant" | "label" | "disabled" | "required" | "corner" | "description" | "errorMessage" | "start" | "endIcon" | "errorIcon" | "hideErrorMessage" | "readonly" | "showDescriptionOnError" | "showErrorIcon" | "startIcon">>>>;
+        }, Partial<Omit<Omit<FormFieldOwnProps, "field">, "error" | "color" | "end" | "size" | "classes" | "customProps" | "disabled" | "endIcon" | "rounded" | "startIcon" | "variant" | "label" | "start" | "required" | "corner" | "description" | "errorMessage" | "errorIcon" | "hideErrorMessage" | "readonly" | "showDescriptionOnError" | "showErrorIcon">>>>;
         isNotched: import('vue').ComputedRef<boolean>;
         isStacked: import('vue').ComputedRef<boolean>;
         startBind: import('vue').ComputedRef<import('@bridge-ui/core/Utils').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, {}>>;
@@ -686,7 +686,7 @@ export declare function useDateRangeField(props: DateRangeFieldOwnProps, model:
         onTransitionend?: ((payload: TransitionEvent) => void) | undefined;
         onTransitionrun?: ((payload: TransitionEvent) => void) | undefined;
         onTransitionstart?: ((payload: TransitionEvent) => void) | undefined;
-    }, Partial<Omit<Omit<FormFieldOwnProps, "field">, "error" | "color" | "end" | "size" | "classes" | "customProps" | "rounded" | "variant" | "label" | "disabled" | "required" | "corner" | "description" | "errorMessage" | "start" | "endIcon" | "errorIcon" | "hideErrorMessage" | "readonly" | "showDescriptionOnError" | "showErrorIcon" | "startIcon">>>, "class", {
+    }, Partial<Omit<Omit<FormFieldOwnProps, "field">, "error" | "color" | "end" | "size" | "classes" | "customProps" | "disabled" | "endIcon" | "rounded" | "startIcon" | "variant" | "label" | "start" | "required" | "corner" | "description" | "errorMessage" | "errorIcon" | "hideErrorMessage" | "readonly" | "showDescriptionOnError" | "showErrorIcon">>>, "class", {
         value: string;
         readonly: boolean;
         onFocus: (event: FocusEvent) => void;

package/dist/Components/DateRangeField/composables/useDateRangeField.js

@@ -41,7 +41,7 @@ function E(_, E, D) {
 			..._
 		},
 		bridgeKeys: w
-	})), F = u(() => P.value.componentProps), I = u(() => j(F.value.timeZone)), L = u(() => E.value ?? null), R = u(() => F.value.clearable !== !1), z = u(() => !h(L.value)), B = (e) => {
+	})), F = u(() => P.value.componentProps), I = u(() => j(F.value.timeZone)), L = u(() => E.value ?? null), R = u(() => F.value.clearable === !0), z = u(() => !h(L.value)), B = (e) => {
 		N.value = e instanceof HTMLElement ? e : null;
 	};
 	function V(e) {

package/dist/Components/DateRangeField/dateRangeField.types.d.ts

@@ -83,7 +83,7 @@ export interface DateRangeFieldOwnProps extends Omit<FormFieldOwnProps, "field"
     /**
      * Whether the value can be cleared.
      *
-     * @default true
+     * @default false
      */
     clearable?: boolean;
     /**

package/dist/Components/DateRangePicker/DateRangePicker.vue_vue_type_script_setup_true_lang.js

@@ -1,4 +1,4 @@
-import e from "../Button/Button.js";
+import e from "../ActionFooter/ActionFooter.js";
 import t from "../CalendarRange/CalendarRange.js";
 import { useDateRangePicker as n } from "./composables/useDateRangePicker.js";
 import { createCommentVNode as r, createElementBlock as i, createTextVNode as a, createVNode as o, defineComponent as s, guardReactiveProps as c, mergeProps as l, normalizeProps as u, openBlock as d, renderSlot as f, toDisplayString as p, unref as m, withCtx as h } from "vue";
@@ -40,7 +40,7 @@ var g = /*@__PURE__*/ s({
 		"change"
 	],
 	setup(s, { emit: g }) {
-		let { merged: _, rootBind: v, footerBind: y, showFooter: b, applyLabel: x, handleApply: S, cancelLabel: C, displayValue: w, handleCancel: T, applyButtonProps: E, cancelButtonProps: D, handleCalendarChange: O } = n(s, {
+		let { merged: _, rootBind: v, footerBind: y, showFooter: b, handleApply: x, displayValue: S, handleCancel: C, applyButtonProps: w, cancelButtonProps: T, handleCalendarChange: E } = n(s, {
 			rounded: "md",
 			startOfWeek: 0,
 			color: "primary",
@@ -50,7 +50,7 @@ var g = /*@__PURE__*/ s({
 			fill: m(_).fill,
 			color: m(_).color,
 			error: m(_).error,
-			value: m(w),
+			value: m(S),
 			rounded: m(_).rounded,
 			"max-date": m(_).maxDate,
 			"min-date": m(_).minDate,
@@ -60,7 +60,7 @@ var g = /*@__PURE__*/ s({
 			"hide-years": m(_).hideYears,
 			"hide-months": m(_).hideMonths,
 			orientation: m(_).orientation,
-			onChange: m(O),
+			onChange: m(E),
 			"start-of-week": m(_).startOfWeek,
 			"disable-dates": m(_).disableDates,
 			"hide-weekdays": m(_).hideWeekdays,
@@ -92,19 +92,20 @@ var g = /*@__PURE__*/ s({
 			"disable-months",
 			"hide-outside-days"
 		]), m(b) ? (d(), i("div", u(l({ key: 0 }, m(y))), [f(n.$slots, "footer", {
-			apply: m(S),
-			cancel: m(T)
-		}, () => [o(m(e), l({
-			variant: "flat",
-			color: "secondary",
-			onClick: m(T)
-		}, m(D)), {
-			default: h(() => [a(p(m(C)), 1)]),
-			_: 1
-		}, 16, ["onClick"]), o(m(e), l({ color: "primary" }, m(E), { onClick: m(S) }), {
-			default: h(() => [a(p(m(x)), 1)]),
-			_: 1
-		}, 16, ["onClick"])])], 16)) : r("", !0)], 16));
+			apply: m(x),
+			cancel: m(C)
+		}, () => [o(m(e), {
+			onApply: m(x),
+			onCancel: m(C),
+			"custom-props": {
+				applyButton: m(w),
+				cancelButton: m(T)
+			}
+		}, null, 8, [
+			"onApply",
+			"onCancel",
+			"custom-props"
+		])])], 16)) : r("", !0)], 16));
 	}
 });
 //#endregion

package/dist/Components/DateRangePicker/composables/useDateRangePicker.d.ts

@@ -6,15 +6,13 @@ type DateRangePickerLibDefaults = LibDefaultsShape<DateRangePickerOwnProps, "col
 type DateRangePickerMerged = MergeLibDefaults<DateRangePickerOwnProps, DateRangePickerLibDefaults>;
 export declare function useDateRangePicker(props: MaybeRefOrGetter<DateRangePickerOwnProps>, libDefaults: DateRangePickerLibDefaults, emit: SetupContext<DateRangePickerEmits>["emit"]): {
     merged: import('vue').ComputedRef<DateRangePickerMerged>;
-    rootBind: import('vue').ComputedRef<import('@bridge-ui/core/Utils').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, Partial<Omit<DateRangePickerOwnProps, "error" | "color" | "fill" | "orientation" | "value" | "classes" | "showFooter" | "customProps" | "rounded" | "disabled" | "hideMonths" | "hideOutsideDays" | "hideWeekdays" | "hideYears" | "startOfWeek" | "timeZone" | "defaultValue" | "readOnly" | "disableDates" | "disableMonths" | "disableYears" | "maxDate" | "minDate">>>>;
+    rootBind: import('vue').ComputedRef<import('@bridge-ui/core/Utils').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, Partial<Omit<DateRangePickerOwnProps, "error" | "color" | "fill" | "orientation" | "value" | "classes" | "showFooter" | "customProps" | "disabled" | "rounded" | "hideMonths" | "hideOutsideDays" | "hideWeekdays" | "hideYears" | "startOfWeek" | "timeZone" | "defaultValue" | "readOnly" | "disableDates" | "disableMonths" | "disableYears" | "maxDate" | "minDate">>>>;
     footerBind: import('vue').ComputedRef<import('@bridge-ui/core/Utils').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, {}>>;
     showFooter: import('vue').ComputedRef<boolean>;
     handleApply: () => void;
     displayValue: import('vue').ComputedRef<[Date, Date] | null>;
     handleCancel: () => void;
     handleCalendarChange: (next: null | DateRangeValue) => void;
-    applyLabel: import('vue').ComputedRef<string>;
-    cancelLabel: import('vue').ComputedRef<string>;
     applyButtonProps: import('vue').ComputedRef<Partial<import('../../Button').ButtonProps> | undefined>;
     cancelButtonProps: import('vue').ComputedRef<Partial<import('../../Button').ButtonProps> | undefined>;
 };

package/dist/Components/DateRangePicker/composables/useDateRangePicker.js

@@ -1,12 +1,11 @@
-import { useResolveMessage as e } from "../../../Adapters/I18n/useI18nAdapter.js";
-import { mergePartBind as t, useBridgeUIComponent as n, useBridgeUIMergedRegistryClasses as r } from "../../../Utils/index.js";
-import { FIELD_OVERLAY_INJECTION_KEY as i } from "../../FieldOverlay/fieldOverlayInjectionKey.js";
-import { computed as a, inject as o, ref as s, toValue as c, useAttrs as l, watch as u } from "vue";
-import { get as d, isNil as f, omit as p } from "es-toolkit/compat";
-import { menuRoundedProps as m } from "@bridge-ui/core/Tokens";
-import { cn as h, splitComponentProps as g } from "@bridge-ui/core/Utils";
+import { mergePartBind as e, useBridgeUIComponent as t, useBridgeUIMergedRegistryClasses as n } from "../../../Utils/index.js";
+import { FIELD_OVERLAY_INJECTION_KEY as r } from "../../FieldOverlay/fieldOverlayInjectionKey.js";
+import { computed as i, inject as a, ref as o, toValue as s, useAttrs as c, watch as l } from "vue";
+import { get as u, isNil as d, omit as f } from "es-toolkit/compat";
+import { menuRoundedProps as p } from "@bridge-ui/core/Tokens";
+import { cn as m, splitComponentProps as h } from "@bridge-ui/core/Utils";
 //#region src/Components/DateRangePicker/composables/useDateRangePicker.ts
-var _ = [
+var g = [
 	"fill",
 	"color",
 	"error",
@@ -31,70 +30,68 @@ var _ = [
 	"disableMonths",
 	"hideOutsideDays"
 ];
-function v(v, y, b) {
-	let x = l(), S = o(i, {
+function _(_, v, y) {
+	let b = c(), x = a(r, {
 		apply: () => void 0,
 		cancel: () => void 0
-	}), C = e(), w = a(() => g({
-		bridgeKeys: _,
+	}), S = i(() => h({
+		bridgeKeys: g,
 		props: {
-			...x,
-			...c(v)
+			...b,
+			...s(_)
 		}
-	})), { merged: T, entry: E } = n({
-		libDefaults: y,
+	})), { merged: C, entry: w } = t({
+		libDefaults: v,
 		componentName: "DateRangePicker",
-		props: () => w.value.componentProps
-	}), D = a(() => T.value.customProps), O = a(() => p(w.value.inheritedAttrs, [
+		props: () => S.value.componentProps
+	}), T = i(() => C.value.customProps), E = i(() => f(S.value.inheritedAttrs, [
 		"onApply",
 		"onCancel",
 		"onChange"
-	])), k = r({
-		entry: E,
-		props: () => w.value.componentProps
-	}), A = a(() => c(v)), j = a(() => !f(A.value.value)), M = s(T.value.defaultValue ?? null), N = a(() => j.value ? A.value.value ?? null : M.value), P = s(N.value);
-	u(() => [N.value, T.value.showFooter], ([e, t]) => {
-		t && (P.value = e);
+	])), D = n({
+		entry: w,
+		props: () => S.value.componentProps
+	}), O = i(() => s(_)), k = i(() => !d(O.value.value)), A = o(C.value.defaultValue ?? null), j = i(() => k.value ? O.value.value ?? null : A.value), M = o(j.value);
+	l(() => [j.value, C.value.showFooter], ([e, t]) => {
+		t && (M.value = e);
 	});
-	let F = a(() => T.value.showFooter ? P.value : N.value), I = (e) => {
-		j.value || (M.value = e), b("change", e);
+	let N = i(() => C.value.showFooter ? M.value : j.value), P = (e) => {
+		k.value || (A.value = e), y("change", e);
 	};
 	return {
-		merged: T,
-		rootBind: a(() => {
-			let e = d(m, T.value.rounded ?? "md");
-			return t(D.value?.root, O.value, h({
+		merged: C,
+		rootBind: i(() => {
+			let t = u(p, C.value.rounded ?? "md");
+			return e(T.value?.root, E.value, m({
 				"flex flex-col overflow-hidden bg-white shadow-lg dark:bg-dark-900": !0,
-				"w-full": T.value.fill,
-				"w-fit": !T.value.fill,
-				[e]: !0,
-				[k.value.root ?? ""]: !0
+				"w-full": C.value.fill,
+				"w-fit": !C.value.fill,
+				[t]: !0,
+				[D.value.root ?? ""]: !0
 			}));
 		}),
-		footerBind: a(() => t(D.value?.footer, {}, h({
+		footerBind: i(() => e(T.value?.footer, {}, m({
 			"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,
-			[k.value.footer ?? ""]: !0
+			[D.value.footer ?? ""]: !0
 		}))),
-		showFooter: a(() => !!T.value.showFooter),
+		showFooter: i(() => !!C.value.showFooter),
 		handleApply: () => {
-			I(P.value), b("apply"), S.apply();
+			P(M.value), y("apply"), x.apply();
 		},
-		displayValue: F,
+		displayValue: N,
 		handleCancel: () => {
-			P.value = N.value, b("cancel"), S.cancel();
+			M.value = j.value, y("cancel"), x.cancel();
 		},
 		handleCalendarChange: (e) => {
-			if (T.value.showFooter) {
-				P.value = e;
+			if (C.value.showFooter) {
+				M.value = e;
 				return;
 			}
-			I(e);
+			P(e);
 		},
-		applyLabel: a(() => C("Apply")),
-		cancelLabel: a(() => C("Cancel")),
-		applyButtonProps: a(() => D.value?.applyButton),
-		cancelButtonProps: a(() => D.value?.cancelButton)
+		applyButtonProps: i(() => T.value?.applyButton),
+		cancelButtonProps: i(() => T.value?.cancelButton)
 	};
 }
 //#endregion
-export { v as useDateRangePicker };
+export { _ as useDateRangePicker };

package/dist/Components/DateTimeField/DateTimeField.vue_vue_type_script_setup_true_lang.js

@@ -17,7 +17,7 @@ var M = { class: "flex min-w-0 flex-1 items-center gap-1" }, N = ["aria-label"],
 		classes: {},
 		clearable: {
 			type: Boolean,
-			default: !0
+			default: !1
 		},
 		customProps: {},
 		defaultValue: {},

package/dist/Components/DateTimeField/composables/useDateTimeField.d.ts

@@ -436,7 +436,7 @@ export declare function useDateTimeField(props: DateTimeFieldOwnProps, model: Re
             onTransitionend?: ((payload: TransitionEvent) => void) | undefined;
             onTransitionrun?: ((payload: TransitionEvent) => void) | undefined;
             onTransitionstart?: ((payload: TransitionEvent) => void) | undefined;
-        }, Partial<Omit<Omit<FormFieldOwnProps, "field">, "error" | "color" | "end" | "size" | "classes" | "customProps" | "rounded" | "variant" | "label" | "disabled" | "required" | "corner" | "description" | "errorMessage" | "start" | "endIcon" | "errorIcon" | "hideErrorMessage" | "readonly" | "showDescriptionOnError" | "showErrorIcon" | "startIcon">>>>;
+        }, Partial<Omit<Omit<FormFieldOwnProps, "field">, "error" | "color" | "end" | "size" | "classes" | "customProps" | "disabled" | "endIcon" | "rounded" | "startIcon" | "variant" | "label" | "start" | "required" | "corner" | "description" | "errorMessage" | "errorIcon" | "hideErrorMessage" | "readonly" | "showDescriptionOnError" | "showErrorIcon">>>>;
         isNotched: import('vue').ComputedRef<boolean>;
         isStacked: import('vue').ComputedRef<boolean>;
         startBind: import('vue').ComputedRef<import('@bridge-ui/core/Utils').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, {}>>;
@@ -687,7 +687,7 @@ export declare function useDateTimeField(props: DateTimeFieldOwnProps, model: Re
         onTransitionend?: ((payload: TransitionEvent) => void) | undefined;
         onTransitionrun?: ((payload: TransitionEvent) => void) | undefined;
         onTransitionstart?: ((payload: TransitionEvent) => void) | undefined;
-    }, Partial<Omit<Omit<FormFieldOwnProps, "field">, "error" | "color" | "end" | "size" | "classes" | "customProps" | "rounded" | "variant" | "label" | "disabled" | "required" | "corner" | "description" | "errorMessage" | "start" | "endIcon" | "errorIcon" | "hideErrorMessage" | "readonly" | "showDescriptionOnError" | "showErrorIcon" | "startIcon">>>, "class", {
+    }, Partial<Omit<Omit<FormFieldOwnProps, "field">, "error" | "color" | "end" | "size" | "classes" | "customProps" | "disabled" | "endIcon" | "rounded" | "startIcon" | "variant" | "label" | "start" | "required" | "corner" | "description" | "errorMessage" | "errorIcon" | "hideErrorMessage" | "readonly" | "showDescriptionOnError" | "showErrorIcon">>>, "class", {
         value: string;
         readonly: boolean;
         onFocus: (event: FocusEvent) => void;