@bridge-ui/vue 0.7.0 → 0.9.0

package/dist/Components/Snackbar/composables/useSnackbar.js

@@ -1,12 +1,12 @@
-import { mergePartBind as e, useBridgeUIComponent as t, useBridgeUIMergedRegistryClasses as n } from "../../../Utils/index.js";
-import { snackbarDefaultIcons as ee } from "../snackbarDefaultIcons.js";
-import { computed as r, nextTick as te, onBeforeUnmount as ne, ref as i, toValue as re, useAttrs as ie, watch as a } from "vue";
-import { get as o, isNil as ae, isNull as s, isObject as c, omit as l } from "es-toolkit/compat";
-import { snackbarColorProps as u, snackbarPaddingProps as d, snackbarPositionProps as oe, snackbarRoundedProps as se, snackbarTransitionProps as ce } from "@bridge-ui/core/Tokens";
-import { cn as f, mergeBridgeUILayeredClasses as p, splitComponentProps as le } from "@bridge-ui/core/Utils";
-import { LAYER_STACK_BASE_Z_INDEX as m, acquireLayerStackOrder as ue, getLayerStackEntry as de, getSnackbarTransitionClass as fe, hasSnackbarTransition as pe, pushLayerStack as me, subscribeLayerStack as he } from "@bridge-ui/core/Layer";
+import { mergePartBind as e, resolveVnodeRefElement as t, useBridgeUIComponent as n, useBridgeUIMergedRegistryClasses as ee } from "../../../Utils/index.js";
+import { snackbarDefaultIcons as r } from "../snackbarDefaultIcons.js";
+import { computed as i, nextTick as a, onBeforeUnmount as te, ref as o, toValue as ne, useAttrs as re, watch as s } from "vue";
+import { get as c, isNil as ie, isNull as l, isObject as ae, omit as oe } from "es-toolkit/compat";
+import { snackbarColorProps as se, snackbarPaddingProps as ce, snackbarPositionProps as le, snackbarRoundedProps as ue, snackbarTransitionProps as de } from "@bridge-ui/core/Tokens";
+import { cn as u, mergeBridgeUILayeredClasses as d, splitComponentProps as f } from "@bridge-ui/core/Utils";
+import { LAYER_STACK_BASE_Z_INDEX as p, acquireLayerStackOrder as fe, getLayerStackEntry as pe, getSnackbarTransitionClass as me, hasSnackbarTransition as he, pushLayerStack as ge, subscribeLayerStack as _e } from "@bridge-ui/core/Layer";
 //#region src/Components/Snackbar/composables/useSnackbar.ts
-var ge = [
+var ve = [
 	"img",
 	"icon",
 	"color",
@@ -24,202 +24,209 @@ var ge = [
 	"description",
 	"progressbar"
 ];
-function h(h, _e, g = {}) {
-	let _ = ie(), v = i(!1), y = i(""), b = i(1), x = i(0), S = i(!1), C = i(!1), w = i(0), T = i(!1), E = i(0), D = i(m), O = i("closed"), k = i(null), A = null, j = null, M = null, N = r(() => le({
+function m(m, ye, h = {}) {
+	let be = re(), g = o(!1), _ = o(""), v = o(1), y = o(0), b = o(!1), x = o(!1), S = o(0), C = o(!1), w = o(0), T = o(null), E = o(p), D = o("closed"), O = o(null), k = null, A = null, j = null, M = i(() => f({
 		props: {
-			..._,
-			...h
+			...be,
+			...m
 		},
-		bridgeKeys: ge
-	})), { merged: P, entry: F } = t({
-		libDefaults: _e,
+		bridgeKeys: ve
+	})), { merged: N, entry: P } = n({
+		libDefaults: ye,
 		componentName: "Snackbar",
-		props: () => N.value.componentProps
-	}), I = r(() => P.value.customProps), L = r(() => l(N.value.inheritedAttrs, ["onShowChange"])), R = n({
-		entry: F,
-		props: () => N.value.componentProps
-	}), z = r(() => !ae(g.show) && re(g.show)), B = r(() => {
-		let e = P.value.transition ?? "none";
-		return e in ce ? e : "none";
-	}), V = r(() => pe(B.value)), ve = r(() => fe(B.value)), H = r(() => {
-		let e = p(u, F.value?.tokens?.color);
-		return o(e, P.value.color);
-	}), U = r(() => {
-		let e = p(d, F.value?.tokens?.padding);
-		return o(e, P.value.padding);
-	}), ye = r(() => {
-		let e = p(se, F.value?.tokens?.rounded);
-		return o(e, P.value.rounded);
-	}), be = r(() => s(P.value.icon) ? null : P.value.icon ? P.value.icon : o(H.value, "icon") ?? o(ee, P.value.color)), W = r(() => P.value.duration === !1 ? 0 : P.value.duration ?? 0), G = r(() => z.value && v.value && W.value > 0 && P.value.progressbar !== !1), K = r(() => P.value.teleportTo !== !1), xe = r(() => {
-		if (!K.value) return "";
-		let e = p(oe, F.value?.tokens?.position);
-		return o(e, P.value.position ?? "bottom-center");
+		props: () => M.value.componentProps
+	}), F = i(() => N.value.customProps), I = i(() => oe(M.value.inheritedAttrs, ["onShowChange"])), L = ee({
+		entry: P,
+		props: () => M.value.componentProps
+	}), R = i(() => !ie(h.show) && ne(h.show)), z = i(() => {
+		let e = N.value.transition ?? "none";
+		return e in de ? e : "none";
+	}), B = i(() => he(z.value)), xe = i(() => me(z.value)), V = i(() => {
+		let e = d(se, P.value?.tokens?.color);
+		return c(e, N.value.color);
+	}), H = i(() => {
+		let e = d(ce, P.value?.tokens?.padding);
+		return c(e, N.value.padding);
+	}), Se = i(() => {
+		let e = d(ue, P.value?.tokens?.rounded);
+		return c(e, N.value.rounded);
+	}), Ce = i(() => l(N.value.icon) ? null : N.value.icon ? N.value.icon : c(V.value, "icon") ?? c(r, N.value.color)), U = i(() => N.value.duration === !1 ? 0 : N.value.duration ?? 0), W = i(() => R.value && g.value && U.value > 0 && N.value.progressbar !== !1), G = i(() => N.value.teleportTo !== !1), K = i(() => {
+		if (!G.value) return "";
+		let e = d(le, P.value?.tokens?.position);
+		return c(e, N.value.position ?? "bottom-center");
 	});
 	function q() {
-		k.value &&= (clearTimeout(k.value), null);
+		O.value &&= (clearTimeout(O.value), null);
 	}
 	function J(e) {
-		e || g.onClose?.(), c(g.show) && "value" in g.show && (g.show.value = e), g.onShowChange?.(e);
+		e || h.onClose?.(), ae(h.show) && "value" in h.show && (h.show.value = e), h.onShowChange?.(e);
 	}
 	function Y() {
-		C.value && (C.value = !1, O.value = "closed", q(), z.value ? J(!1) : g.onLeaveComplete?.(), v.value = !1);
+		x.value && (x.value = !1, D.value = "closed", q(), R.value ? J(!1) : h.onLeaveComplete?.(), g.value = !1);
 	}
 	function X() {
-		if (q(), C.value = !0, !V.value) {
+		if (q(), x.value = !0, !B.value) {
 			Y();
 			return;
 		}
-		O.value = "closed";
+		D.value = "closed";
 	}
-	function Se() {
-		if (C.value = !1, !V.value) {
-			O.value = "open";
+	function we() {
+		if (x.value = !1, !B.value) {
+			D.value = "open";
 			return;
 		}
-		O.value = "closed", te(() => {
+		D.value = "closed", a(() => {
 			requestAnimationFrame(() => {
-				O.value = "open";
+				D.value = "open";
 			});
 		});
 	}
 	function Z() {
-		if (!V.value) {
+		if (!B.value) {
 			J(!1);
 			return;
 		}
-		v.value && X();
+		g.value && X();
 	}
 	function Q(e) {
-		q(), x.value = e, w.value = Date.now(), E.value = e, k.value = setTimeout(() => {
+		q(), y.value = e, S.value = Date.now(), w.value = e, O.value = setTimeout(() => {
 			Z();
 		}, e);
 	}
-	function Ce() {
-		!k.value || W.value <= 0 || (q(), x.value -= Date.now() - w.value, b.value = Math.max(x.value / W.value, 0), T.value = !1, S.value = !0);
+	function Te() {
+		!O.value || U.value <= 0 || (q(), y.value -= Date.now() - S.value, v.value = Math.max(y.value / U.value, 0), C.value = !1, b.value = !0);
 	}
-	function we() {
-		if (W.value <= 0 || !S.value) return;
-		let e = Math.max(x.value, 0);
-		S.value = !1, T.value = !1, requestAnimationFrame(() => {
-			T.value = !0;
+	function Ee() {
+		if (U.value <= 0 || !b.value) return;
+		let e = Math.max(y.value, 0);
+		b.value = !1, C.value = !1, requestAnimationFrame(() => {
+			C.value = !0;
 		}), Q(e);
 	}
-	function Te(e) {
-		!v.value || O.value !== "closed" || e.target === e.currentTarget && e.propertyName !== "none" && e.elapsedTime !== 0 && Y();
+	function De(e) {
+		!g.value || D.value !== "closed" || e.target === e.currentTarget && e.propertyName !== "none" && e.elapsedTime !== 0 && Y();
 	}
-	a(z, (e) => {
+	s(R, (e) => {
 		if (e) {
-			v.value = !0, Se();
+			g.value = !0, we();
 			return;
 		}
-		v.value && X();
-	}, { immediate: !0 }), a([
-		z,
-		v,
-		W
+		g.value && X();
+	}, { immediate: !0 }), s([
+		R,
+		g,
+		U
 	], ([e, t, n]) => {
 		if (!e || !t || n <= 0) {
 			q();
 			return;
 		}
-		S.value = !1, Q(n);
-	}, { immediate: !0 }), a([W, G], ([e]) => {
+		b.value = !1, Q(n);
+	}, { immediate: !0 }), s([U, W], ([e]) => {
 		if (!e) {
-			T.value = !1, b.value = 1;
+			C.value = !1, v.value = 1;
 			return;
 		}
-		T.value = !1, b.value = 1;
+		C.value = !1, v.value = 1;
 		let t = requestAnimationFrame(() => {
-			T.value = !0;
+			C.value = !0;
 		});
 		return () => {
 			cancelAnimationFrame(t);
 		};
 	}, { immediate: !0 });
 	function $() {
-		let e = de(y.value);
-		e && (D.value = e.zIndex);
+		let e = pe(_.value);
+		e && (E.value = e.zIndex);
+	}
+	function Oe(e) {
+		T.value = t(e), A?.setContainer(T.value);
 	}
-	a([v, K], ([e, t]) => {
-		t && (e ? (A = ue(), j = me({
-			order: A,
+	s([g, G], ([e, t]) => {
+		t && (e ? (k = fe(), A = ge({
+			order: k,
 			lockScroll: !1,
-			id: g.stackId,
+			id: h.stackId,
+			container: T.value ?? void 0,
 			onEscape: () => {
 				Z();
 			}
-		}), y.value = j.id, D.value = j.zIndex, $(), M = he($)) : (M?.(), M = null, j?.release(), j = null, A = null, y.value = "", D.value = m));
-	}, { immediate: !0 }), ne(() => {
-		q(), M?.(), M = null, j?.release(), j = null;
+		}), _.value = A.id, E.value = A.zIndex, $(), j = _e($), a(() => {
+			A?.setContainer(T.value);
+		})) : (j?.(), j = null, A?.release(), A = null, k = null, _.value = "", E.value = p));
+	}, { immediate: !0 }), te(() => {
+		q(), j?.(), j = null, A?.release(), A = null;
 	});
-	let Ee = r(() => e(I.value?.portal, {
+	let ke = i(() => e(F.value?.portal, {
 		"data-snackbar-layer": !0,
-		style: { zIndex: D.value }
-	}, f({
+		style: { zIndex: E.value }
+	}, u({
 		"fixed inset-0 flex pointer-events-none px-4 py-6 sm:p-5 sm:pt-4": !0,
-		[xe.value ?? ""]: !0,
-		[o(R.value, "portal") ?? ""]: !0
-	}))), De = r(() => e(I.value?.root, {
-		...L.value,
+		[K.value ?? ""]: !0,
+		[c(L.value, "portal") ?? ""]: !0
+	}))), Ae = i(() => e(F.value?.root, {
+		...I.value,
 		"data-snackbar-part": "panel",
-		onMouseenter: Ce,
-		onMouseleave: we,
-		"data-state": O.value,
-		onTransitionend: Te,
-		role: L.value.role ?? "status",
-		"aria-live": L.value["aria-live"] ?? "polite"
-	}, f({
+		onMouseenter: Te,
+		onMouseleave: Ee,
+		"data-state": D.value,
+		onTransitionend: De,
+		role: I.value.role ?? "status",
+		"aria-live": I.value["aria-live"] ?? "polite"
+	}, u({
 		"relative w-full max-w-sm overflow-hidden pointer-events-auto": !0,
 		"bg-white shadow-lg ring-1 ring-black/5": !0,
 		"dark:bg-dark-800 dark:border dark:border-dark-700": !0,
-		[o(ye.value, "base") ?? ""]: !0,
-		[ve.value]: V.value,
-		[o(R.value, "root") ?? ""]: !0
-	}))), Oe = r(() => e(I.value?.icon, {}, f({
+		[c(Se.value, "base") ?? ""]: !0,
+		[xe.value]: B.value,
+		[c(L.value, "root") ?? ""]: !0
+	}))), je = i(() => e(F.value?.icon, {}, u({
 		"w-6 h-6 shrink-0": !0,
-		[o(H.value, "iconColor") ?? ""]: !0,
-		[o(R.value, "icon") ?? ""]: !0
-	}))), ke = r(() => e(I.value?.title, {}, f({
+		[c(V.value, "iconColor") ?? ""]: !0,
+		[c(L.value, "icon") ?? ""]: !0
+	}))), Me = i(() => e(F.value?.title, {}, u({
 		"text-sm font-medium": !0,
-		[o(H.value, "titleColor") ?? ""]: !0,
-		[o(R.value, "title") ?? ""]: !0
-	}))), Ae = r(() => e(I.value?.description, {}, f({
+		[c(V.value, "titleColor") ?? ""]: !0,
+		[c(L.value, "title") ?? ""]: !0
+	}))), Ne = i(() => e(F.value?.description, {}, u({
 		"mt-1 text-sm text-dark-500 dark:text-dark-500": !0,
-		[o(R.value, "description") ?? ""]: !0
-	}))), je = r(() => e(I.value?.progress, {}, {
-		class: f({
+		[c(L.value, "description") ?? ""]: !0
+	}))), Pe = i(() => e(F.value?.progress, {}, {
+		class: u({
 			"absolute bottom-0 left-0 h-0.5 w-full rounded-full": !0,
-			[o(H.value, "progressColor") ?? ""]: !0,
-			[o(R.value, "progress") ?? ""]: !0
+			[c(V.value, "progressColor") ?? ""]: !0,
+			[c(L.value, "progress") ?? ""]: !0
 		}),
-		style: G.value ? {
+		style: W.value ? {
 			transformOrigin: "left center",
-			transform: `scaleX(${T.value && !S.value ? 0 : b.value})`,
-			transition: T.value && !S.value ? `transform ${E.value}ms linear` : "none"
+			transform: `scaleX(${C.value && !b.value ? 0 : v.value})`,
+			transition: C.value && !b.value ? `transform ${w.value}ms linear` : "none"
 		} : void 0
 	}));
-	function Me(t) {
-		return e(I.value?.content, {}, f({
-			[o(U.value, "contentRight") ?? ""]: t,
-			[o(U.value, "content") ?? ""]: !t,
-			[o(R.value, "content") ?? ""]: !0
+	function Fe(t) {
+		return e(F.value?.content, {}, u({
+			[c(H.value, "contentRight") ?? ""]: t,
+			[c(H.value, "content") ?? ""]: !t,
+			[c(L.value, "content") ?? ""]: !0
 		}));
 	}
 	return {
-		merged: P,
-		iconBind: Oe,
-		rendered: v,
-		panelBind: De,
-		titleBind: ke,
-		isPortaled: K,
-		portalBind: Ee,
-		contentBind: Me,
-		showProgress: G,
-		progressBind: je,
+		merged: N,
+		iconBind: je,
+		rendered: g,
+		panelBind: Ae,
+		titleBind: Me,
+		isPortaled: G,
+		portalBind: ke,
+		contentBind: Fe,
+		setPanelRef: Oe,
+		showProgress: W,
+		progressBind: Pe,
 		requestClose: Z,
-		resolvedIcon: be,
-		descriptionBind: Ae
+		resolvedIcon: Ce,
+		descriptionBind: Ne
 	};
 }
 //#endregion
-export { h as useSnackbar };
+export { m as useSnackbar };

package/dist/Components/Step/composables/useStep.d.ts

@@ -11,7 +11,7 @@ export declare function useStep(props: StepOwnProps): {
     iconSize: import('vue').ComputedRef<keyof IconSize>;
     rootBind: import('vue').ComputedRef<import('@bridge-ui/core/Utils').MergePartBind<{
         class: string;
-    }, "class", import('vue').HTMLAttributes | undefined, Omit<StepProps, "error" | "icon" | "classes" | "customProps" | "label" | "disabled" | "description" | "completed">>>;
+    }, "class", import('vue').HTMLAttributes | undefined, Omit<StepProps, "error" | "icon" | "classes" | "customProps" | "disabled" | "label" | "description" | "completed">>>;
     textBind: import('vue').ComputedRef<{
         class: string;
     }>;

package/dist/Components/TextField/TextField.vue_vue_type_script_setup_true_lang.js

@@ -27,6 +27,7 @@ var C = /*@__PURE__*/ c({
 		readonly: { type: Boolean },
 		required: { type: Boolean },
 		rounded: {},
+		showDescriptionOnError: { type: Boolean },
 		showErrorIcon: {
 			type: Boolean,
 			default: !0

package/dist/Components/TextField/composables/useTextField.d.ts

@@ -427,7 +427,7 @@ export declare function useTextField(props: TextFieldOwnProps): {
             onTransitionend?: ((payload: TransitionEvent) => void) | undefined;
             onTransitionrun?: ((payload: TransitionEvent) => void) | undefined;
             onTransitionstart?: ((payload: TransitionEvent) => void) | undefined;
-        }, Partial<Omit<Omit<import('../../FormField').FormFieldOwnProps, "field">, "error" | "color" | "end" | "size" | "classes" | "customProps" | "rounded" | "variant" | "label" | "disabled" | "required" | "corner" | "description" | "errorMessage" | "start" | "endIcon" | "errorIcon" | "hideErrorMessage" | "readonly" | "showErrorIcon" | "startIcon">>>>;
+        }, Partial<Omit<Omit<import('../../FormField').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, {}>>;
@@ -452,6 +452,8 @@ export declare function useTextField(props: TextFieldOwnProps): {
         hasInsetLabelRow: import('vue').ComputedRef<boolean>;
         insetLabelRowBind: import('vue').ComputedRef<import('@bridge-ui/core/Utils').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, {}>>;
         stackedInputRowBind: import('vue').ComputedRef<import('@bridge-ui/core/Utils').MergePartBind<object, "class", {}, {}>>;
+        showErrorMessageRow: import('vue').ComputedRef<boolean>;
+        showDescriptionContent: import('vue').ComputedRef<boolean>;
         showErrorMessageContent: import('vue').ComputedRef<boolean>;
         reservesErrorMessageSpace: import('vue').ComputedRef<boolean>;
     };
@@ -676,5 +678,5 @@ export declare function useTextField(props: TextFieldOwnProps): {
         onTransitionend?: ((payload: TransitionEvent) => void) | undefined;
         onTransitionrun?: ((payload: TransitionEvent) => void) | undefined;
         onTransitionstart?: ((payload: TransitionEvent) => void) | undefined;
-    }, Partial<Omit<Omit<import('../../FormField').FormFieldOwnProps, "field">, "error" | "color" | "end" | "size" | "classes" | "customProps" | "rounded" | "variant" | "label" | "disabled" | "required" | "corner" | "description" | "errorMessage" | "start" | "endIcon" | "errorIcon" | "hideErrorMessage" | "readonly" | "showErrorIcon" | "startIcon">>>>;
+    }, Partial<Omit<Omit<import('../../FormField').FormFieldOwnProps, "field">, "error" | "color" | "end" | "size" | "classes" | "customProps" | "disabled" | "endIcon" | "rounded" | "startIcon" | "variant" | "label" | "start" | "required" | "corner" | "description" | "errorMessage" | "errorIcon" | "hideErrorMessage" | "readonly" | "showDescriptionOnError" | "showErrorIcon">>>>;
 };

package/dist/Components/Textarea/Textarea.vue_vue_type_script_setup_true_lang.js

@@ -30,6 +30,7 @@ var T = /*@__PURE__*/ c({
 		readonly: { type: Boolean },
 		required: { type: Boolean },
 		rounded: {},
+		showDescriptionOnError: { type: Boolean },
 		showErrorIcon: {
 			type: Boolean,
 			default: !0

package/dist/Components/Textarea/composables/useTextarea.d.ts

@@ -428,7 +428,7 @@ export declare function useTextarea(props: TextareaOwnProps, textareaRef: Ref<nu
             onTransitionend?: ((payload: TransitionEvent) => void) | undefined;
             onTransitionrun?: ((payload: TransitionEvent) => void) | undefined;
             onTransitionstart?: ((payload: TransitionEvent) => void) | undefined;
-        }, Partial<Omit<Omit<import('../../FormField').FormFieldOwnProps, "field">, "error" | "color" | "end" | "size" | "classes" | "customProps" | "rounded" | "variant" | "label" | "disabled" | "required" | "corner" | "description" | "errorMessage" | "start" | "endIcon" | "errorIcon" | "hideErrorMessage" | "readonly" | "showErrorIcon" | "startIcon">>>>;
+        }, Partial<Omit<Omit<import('../../FormField').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, {}>>;
@@ -453,6 +453,8 @@ export declare function useTextarea(props: TextareaOwnProps, textareaRef: Ref<nu
         hasInsetLabelRow: import('vue').ComputedRef<boolean>;
         insetLabelRowBind: import('vue').ComputedRef<import('@bridge-ui/core/Utils').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, {}>>;
         stackedInputRowBind: import('vue').ComputedRef<import('@bridge-ui/core/Utils').MergePartBind<object, "class", {}, {}>>;
+        showErrorMessageRow: import('vue').ComputedRef<boolean>;
+        showDescriptionContent: import('vue').ComputedRef<boolean>;
         showErrorMessageContent: import('vue').ComputedRef<boolean>;
         reservesErrorMessageSpace: import('vue').ComputedRef<boolean>;
     };
@@ -678,7 +680,7 @@ export declare function useTextarea(props: TextareaOwnProps, textareaRef: Ref<nu
         onTransitionend?: ((payload: TransitionEvent) => void) | undefined;
         onTransitionrun?: ((payload: TransitionEvent) => void) | undefined;
         onTransitionstart?: ((payload: TransitionEvent) => void) | undefined;
-    }, Partial<Omit<Omit<import('../../FormField').FormFieldOwnProps, "field">, "error" | "color" | "end" | "size" | "classes" | "customProps" | "rounded" | "variant" | "label" | "disabled" | "required" | "corner" | "description" | "errorMessage" | "start" | "endIcon" | "errorIcon" | "hideErrorMessage" | "readonly" | "showErrorIcon" | "startIcon">>>, {
+    }, Partial<Omit<Omit<import('../../FormField').FormFieldOwnProps, "field">, "error" | "color" | "end" | "size" | "classes" | "customProps" | "disabled" | "endIcon" | "rounded" | "startIcon" | "variant" | "label" | "start" | "required" | "corner" | "description" | "errorMessage" | "errorIcon" | "hideErrorMessage" | "readonly" | "showDescriptionOnError" | "showErrorIcon">>>, {
         rows?: string | number | undefined;
         onInput?: ((event: Event) => void) | undefined;
     }>>;

package/dist/Components/TimeField/TimeField.vue_vue_type_script_setup_true_lang.js

@@ -17,7 +17,7 @@ var A = { class: "flex min-w-0 flex-1 items-center gap-1" }, j = ["aria-label"],
 		classes: {},
 		clearable: {
 			type: Boolean,
-			default: !0
+			default: !1
 		},
 		customProps: {},
 		defaultValue: {},
@@ -52,6 +52,7 @@ var A = { class: "flex min-w-0 flex-1 items-center gap-1" }, j = ["aria-label"],
 		readonly: { type: Boolean },
 		required: { type: Boolean },
 		rounded: {},
+		showDescriptionOnError: { type: Boolean },
 		showErrorIcon: {
 			type: Boolean,
 			default: !0

package/dist/Components/TimeField/composables/useTimeField.d.ts

@@ -10,7 +10,7 @@ export declare function useTimeField(props: TimeFieldOwnProps, model: Ref<null |
     fill: import('vue').ComputedRef<boolean>;
     overlay: import('vue').ComputedRef<import('@bridge-ui/core/Domain').FieldOverlayMode | undefined>;
     hasValue: import('vue').ComputedRef<boolean>;
-    timeOnly: import('vue').ComputedRef<Pick<TimeFieldOwnProps & Record<string, unknown>, "fill" | "classes" | "overlay" | "showFooter" | "customProps" | "clearable" | "defaultValue" | "timeZone" | "editable" | "ampm" | "disableTimes" | "interval" | "maxTime" | "minTime" | "showSeconds">>;
+    timeOnly: import('vue').ComputedRef<Pick<TimeFieldOwnProps & Record<string, unknown>, "fill" | "classes" | "overlay" | "showFooter" | "customProps" | "editable" | "timeZone" | "ampm" | "interval" | "showSeconds" | "defaultValue" | "clearable" | "disableTimes" | "maxTime" | "minTime">>;
     formField: {
         slots: Readonly<{
             [name: string]: import('vue').Slot<any> | undefined;
@@ -438,7 +438,7 @@ export declare function useTimeField(props: TimeFieldOwnProps, 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" | "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, {}>>;
@@ -463,6 +463,8 @@ export declare function useTimeField(props: TimeFieldOwnProps, model: Ref<null |
         hasInsetLabelRow: import('vue').ComputedRef<boolean>;
         insetLabelRowBind: import('vue').ComputedRef<import('@bridge-ui/core/Utils').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, {}>>;
         stackedInputRowBind: import('vue').ComputedRef<import('@bridge-ui/core/Utils').MergePartBind<object, "class", {}, {}>>;
+        showErrorMessageRow: import('vue').ComputedRef<boolean>;
+        showDescriptionContent: import('vue').ComputedRef<boolean>;
         showErrorMessageContent: import('vue').ComputedRef<boolean>;
         reservesErrorMessageSpace: import('vue').ComputedRef<boolean>;
     };
@@ -687,7 +689,7 @@ export declare function useTimeField(props: TimeFieldOwnProps, 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" | "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/TimeField/composables/useTimeField.js

@@ -39,7 +39,7 @@ function C(C, w, T) {
 			...C
 		},
 		bridgeKeys: S
-	})), P = u(() => N.value.componentProps), F = u(() => A(P.value.timeZone)), I = u(() => w.value ?? null), L = u(() => P.value.clearable !== !1), R = u(() => !h(I.value)), z = u(() => _(P.value.overlay, k.mobile)), B = s({
+	})), P = u(() => N.value.componentProps), F = u(() => A(P.value.timeZone)), I = u(() => w.value ?? null), L = u(() => P.value.clearable === !0), R = u(() => !h(I.value)), z = u(() => _(P.value.overlay, k.mobile)), B = s({
 		overlay: z,
 		componentName: "TimeField",
 		fill: () => P.value.fill

package/dist/Components/TimeField/timeField.types.d.ts

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

package/dist/Components/TimePanel/composables/useTimePanel.d.ts

@@ -22,7 +22,7 @@ export type TimePanelItem = {
  */
 export declare function useTimePanel(props: MaybeRefOrGetter<TimePanelOwnProps>, libDefaults: TimePanelLibDefaults, emit: (event: "change", value: Date | null) => void): {
     merged: import('vue').ComputedRef<TimePanelMerged>;
-    rootBind: import('vue').ComputedRef<import('@bridge-ui/core/Utils').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, Partial<Omit<TimePanelOwnProps, "error" | "color" | "fill" | "value" | "classes" | "customProps" | "rounded" | "disabled" | "readOnly" | "timeZone" | "ampm" | "disableTimes" | "interval" | "maxTime" | "minTime" | "showSeconds">>>>;
+    rootBind: import('vue').ComputedRef<import('@bridge-ui/core/Utils').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, Partial<Omit<TimePanelOwnProps, "error" | "color" | "fill" | "value" | "classes" | "customProps" | "disabled" | "rounded" | "timeZone" | "ampm" | "interval" | "showSeconds" | "readOnly" | "disableTimes" | "maxTime" | "minTime">>>>;
     hourItems: import('vue').ComputedRef<TimePanelItem[]>;
     columnBind: import('vue').ComputedRef<import('@bridge-ui/core/Utils').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, {}>>;
     getHourBind: (item: TimePanelItem) => import('@bridge-ui/core/Utils').MergePartBind<object, "class", import('vue').ButtonHTMLAttributes | undefined, {