@bridge-ui/vue 0.6.0 → 0.8.0

package/dist/Components/BaseField/composables/useBaseField.js

@@ -18,7 +18,8 @@ var g = [
 	"customProps",
 	"description",
 	"errorMessage",
-	"hideErrorMessage"
+	"hideErrorMessage",
+	"showDescriptionOnError"
 ];
 function _(_, v = {
 	size: "md",
@@ -31,99 +32,101 @@ function _(_, v = {
 			...b,
 			...o(_)
 		}
-	})), { merged: w, entry: T } = r({
+	})), w = y.componentName ?? "BaseField", { merged: T, entry: E, chromeEntry: D } = r({
 		libDefaults: v,
-		componentName: y.componentName,
+		componentName: w,
 		props: () => C.value.componentProps
-	}), E = i({
-		entry: T,
+	}), O = i({
+		entry: E,
+		chromeEntry: D,
 		props: () => C.value.componentProps
-	}), D = a(() => w.value.customProps), O = a(() => w.value.error === !0), k = a(() => !!w.value.disabled), A = a(() => !!w.value.readonly), j = a(() => w.value.controlId ?? C.value.inheritedAttrs.id ?? S), M = a(() => {
-		let e = m(f, u(T.value, [
-			"tokens",
-			"baseField",
-			"size"
-		]));
-		return u(e, w.value.size ?? "md");
-	}), N = a(() => !w.value.hideErrorMessage), P = a(() => O.value && e(x, "errorMessage", w.value.errorMessage)), F = a(() => {
-		let t = [];
-		return !O.value && e(x, "description", w.value.description) && t.push(`${j.value}-description`), O.value && !w.value.hideErrorMessage && e(x, "errorMessage", w.value.errorMessage) && t.push(`${j.value}-error`), t.length > 0 ? t.join(" ") : void 0;
-	}), I = a(() => n(D.value?.root, {
+	}), k = a(() => T.value.customProps), A = a(() => T.value.error === !0), j = a(() => !!T.value.disabled), M = a(() => !!T.value.readonly), N = a(() => T.value.controlId ?? C.value.inheritedAttrs.id ?? S), P = a(() => {
+		let e = w !== "BaseField", t = m(f, u(D.value, ["tokens", "size"]), e ? void 0 : u(E.value, ["tokens", "size"]));
+		return u(t, T.value.size ?? "md");
+	}), F = a(() => !T.value.hideErrorMessage && !e(x, "description", T.value.description)), I = a(() => A.value && !T.value.hideErrorMessage && e(x, "errorMessage", T.value.errorMessage)), L = a(() => e(x, "description", T.value.description) ? !I.value || T.value.showDescriptionOnError === !0 : !1), R = a(() => I.value || F.value), z = a(() => {
+		let e = [];
+		return L.value && e.push(`${N.value}-description`), I.value && e.push(`${N.value}-error`), e.length > 0 ? e.join(" ") : void 0;
+	}), B = a(() => n(k.value?.root, {
 		class: p(C.value.inheritedAttrs.class),
 		...d(C.value.inheritedAttrs, ["class", "id"])
 	}, p({
 		"group w-full relative": !0,
 		"aria-disabled:pointer-events-none aria-disabled:select-none aria-disabled:opacity-60": !0,
 		"aria-readonly:pointer-events-none aria-readonly:select-none": !0,
-		[E.value.root ?? ""]: !0
-	}))), L = a(() => n(D.value?.header, {}, p({
+		[O.value.root ?? ""]: !0
+	}))), V = a(() => n(k.value?.header, {}, p({
 		"flex w-full gap-x-2 mb-1.5": !0,
-		"justify-between items-end": e(x, "label", w.value.label),
-		"justify-end": !e(x, "label", w.value.label),
-		[E.value.header ?? ""]: !0
-	}))), R = a(() => n(D.value?.corner, {}, p({
-		"text-dark-500 dark:text-dark-400": !0,
-		[M.value?.text ?? ""]: !0,
-		[E.value.corner ?? ""]: !0
-	}))), z = a(() => n(D.value?.group, {
+		"justify-between items-end": e(x, "label", T.value.label),
+		"justify-end": !e(x, "label", T.value.label),
+		[O.value.header ?? ""]: !0
+	}))), H = a(() => {
+		let e = y.labelHtmlFor ?? ((e) => e);
+		return t(k.value?.corner, {
+			size: T.value.size,
+			for: e(N.value),
+			classes: { root: p({ [O.value.corner ?? ""]: !0 }) }
+		});
+	}), U = a(() => n(k.value?.group, {
 		role: "group",
-		id: j.value,
-		"aria-describedby": F.value,
-		"aria-disabled": k.value || void 0,
-		"aria-invalid": O.value || void 0
+		id: N.value,
+		"aria-describedby": z.value,
+		"aria-disabled": j.value || void 0,
+		"aria-invalid": A.value || void 0
 	}, p({
 		"flex flex-wrap items-center": !0,
-		[M.value?.group ?? ""]: !0,
-		[E.value.group ?? ""]: !0
-	}))), B = a(() => n(D.value?.start, {}, p({
+		[P.value?.group ?? ""]: !0,
+		[O.value.group ?? ""]: !0
+	}))), W = a(() => n(k.value?.start, {}, p({
 		"group/start wrapper-start-slot shrink-0 flex items-center [&>*]:min-h-0": !0,
-		[E.value.start ?? ""]: !0
-	}))), V = a(() => n(D.value?.end, {}, p({
+		[O.value.start ?? ""]: !0
+	}))), G = a(() => n(k.value?.end, {}, p({
 		"group/end wrapper-end-slot shrink-0 flex items-center [&>*]:min-h-0": !0,
-		[E.value.end ?? ""]: !0
-	}))), H = a(() => n(D.value?.description, {}, p({
-		"mt-2 text-dark-500 dark:text-dark-400": !0,
-		[M.value?.text ?? ""]: !0,
-		[E.value.description ?? ""]: !0
+		[O.value.end ?? ""]: !0
+	}))), K = a(() => n(k.value?.description, {}, p({
+		"mt-1 px-1 text-dark-500 dark:text-dark-400": !0,
+		[P.value?.text ?? ""]: !0,
+		[O.value.description ?? ""]: !0
 	})));
 	return {
 		slots: x,
-		merged: w,
-		rootBind: I,
-		errorBind: a(() => n(D.value?.errorMessage, {}, p({
-			"mt-2": !0,
-			"min-h-[1lh]": N.value,
+		merged: T,
+		rootBind: B,
+		errorBind: a(() => n(k.value?.errorMessage, {}, p({
+			"mt-1 px-1": !0,
+			"min-h-[1lh]": F.value,
 			"text-error-600 dark:text-error-400": !0,
-			[M.value?.text ?? ""]: !0,
-			[E.value.errorMessage ?? ""]: !0
+			[P.value?.text ?? ""]: !0,
+			[O.value.errorMessage ?? ""]: !0
 		}))),
-		groupBind: z,
-		controlId: j,
-		headerBind: L,
-		cornerBind: R,
-		isDisabled: k,
-		isReadonly: A,
-		sizeClasses: M,
-		endSlotBind: V,
-		invalidated: O,
-		startSlotBind: B,
-		mergedClasses: E,
-		ariaDescribedBy: F,
+		groupBind: U,
+		controlId: N,
+		headerBind: V,
+		isDisabled: j,
+		isReadonly: M,
+		sizeClasses: P,
+		endSlotBind: G,
+		invalidated: A,
+		startSlotBind: W,
+		mergedClasses: O,
+		ariaDescribedBy: z,
 		fieldLabelProps: a(() => {
 			let e = y.labelHtmlFor ?? ((e) => e);
-			return t(D.value?.label, {
-				size: w.value.size,
-				error: O.value,
-				required: w.value.required,
-				for: e(j.value),
+			return t(k.value?.label, {
+				size: T.value.size,
+				error: A.value,
+				required: T.value.required,
+				for: e(N.value),
 				classes: {
-					required: E.value.required,
-					root: p({ [E.value.label ?? ""]: !0 })
+					required: O.value.required,
+					root: p({ [O.value.label ?? ""]: !0 })
 				}
 			});
 		}),
-		descriptionBind: H,
-		showErrorMessageContent: P
+		descriptionBind: K,
+		fieldCornerProps: H,
+		showErrorMessageRow: R,
+		showDescriptionContent: L,
+		showErrorMessageContent: I
 	};
 }
 //#endregion

package/dist/Components/Button/Button.vue_vue_type_script_setup_true_lang.js

@@ -1,9 +1,9 @@
 import { hasNamedSlot as e, isPropPresent as t } from "../../Utils/slotOrProp.js";
 import n from "../Icon/Icon.js";
 import { useButton as r } from "./composables/useButton.js";
-import { Fragment as i, createBlock as a, createCommentVNode as o, createElementBlock as s, createTextVNode as c, defineComponent as l, mergeProps as u, normalizeProps as d, openBlock as f, renderSlot as p, resolveDynamicComponent as m, toDisplayString as h, unref as g, useSlots as _, withCtx as v } from "vue";
+import { Fragment as i, createBlock as a, createCommentVNode as o, createElementBlock as s, createElementVNode as c, createTextVNode as l, createVNode as u, defineComponent as d, guardReactiveProps as f, mergeProps as p, normalizeProps as m, openBlock as h, renderSlot as g, resolveDynamicComponent as _, toDisplayString as v, unref as y, useSlots as b, withCtx as x } from "vue";
 //#region src/Components/Button/Button.vue?vue&type=script&setup=true&lang.ts
-var y = /*@__PURE__*/ l({
+var S = /*@__PURE__*/ d({
 	inheritAttrs: !1,
 	__name: "Button",
 	props: {
@@ -25,8 +25,8 @@ var y = /*@__PURE__*/ l({
 		text: {},
 		variant: {}
 	},
-	setup(l) {
-		let y = l, b = _(), { tag: x, merged: S, isMini: C, iconBind: w, rootBind: T, rootHref: E, rootType: D, endIconBind: O, endSlotBind: k, rootAriaBusy: A, rootDisabled: j, startIconBind: M, startSlotBind: N, loadingIconBind: P, rootAriaDisabled: F } = r(y, {
+	setup(d) {
+		let S = d, C = b(), { tag: w, merged: T, isMini: E, iconBind: D, rootBind: O, rootHref: k, rootType: A, endIconBind: j, contentBind: M, endSlotBind: N, rootAriaBusy: P, rootDisabled: F, startIconBind: I, startSlotBind: L, loadingIconBind: R, loadingWrapBind: z, rootAriaDisabled: B } = r(S, {
 			size: "md",
 			as: "button",
 			rounded: "md",
@@ -34,30 +34,29 @@ var y = /*@__PURE__*/ l({
 			variant: "solid",
 			density: "default"
 		});
-		return (r, l) => (f(), a(m(g(x)), u({ href: g(E) }, g(T), {
-			type: g(D),
-			disabled: g(j),
-			"aria-busy": g(A),
-			"aria-disabled": g(F)
+		return (r, d) => (h(), a(_(y(w)), p({ href: y(k) }, y(O), {
+			type: y(A),
+			disabled: y(F),
+			"aria-busy": y(P),
+			"aria-disabled": y(B)
 		}), {
-			default: v(() => [g(S).loading ? (f(), a(g(n), u({
-				key: 0,
+			default: x(() => [y(T).loading ? (h(), s("span", m(p({ key: 0 }, y(z))), [u(y(n), p({
 				icon: "loader",
-				size: g(S).size
-			}, g(P)), null, 16, ["size"])) : g(C) ? (f(), s(i, { key: 1 }, [g(e)(g(b), "default") ? p(r.$slots, "default", {}, void 0, void 0, 0) : g(S).icon ? (f(), a(g(n), u({ key: 1 }, g(w), {
-				icon: g(S).icon,
-				size: g(S).size
-			}), null, 16, ["icon", "size"])) : o("", !0)], 64)) : (f(), s(i, { key: 2 }, [
-				g(S).startIcon ? (f(), a(g(n), u({
+				size: y(T).size
+			}, y(R)), null, 16, ["size"])], 16)) : o("", !0), c("span", m(f(y(M))), [y(E) ? (h(), s(i, { key: 0 }, [y(e)(y(C), "default") ? g(r.$slots, "default", {}, void 0, void 0, 0) : y(T).icon ? (h(), a(y(n), p({ key: 1 }, y(D), {
+				icon: y(T).icon,
+				size: y(T).size
+			}), null, 16, ["icon", "size"])) : o("", !0)], 64)) : (h(), s(i, { key: 1 }, [
+				y(T).startIcon ? (h(), a(y(n), p({
 					key: 0,
-					size: g(S).size
-				}, g(M), { icon: g(S).startIcon }), null, 16, ["size", "icon"])) : g(e)(g(b), "start") ? (f(), s("div", d(u({ key: 1 }, g(N))), [p(r.$slots, "start")], 16)) : o("", !0),
-				g(t)(g(S).text) ? (f(), s(i, { key: 2 }, [c(h(g(S).text), 1)], 64)) : g(e)(g(b), "default") ? p(r.$slots, "default", {}, void 0, void 0, 3) : o("", !0),
-				g(S).endIcon ? (f(), a(g(n), u({
+					size: y(T).size
+				}, y(I), { icon: y(T).startIcon }), null, 16, ["size", "icon"])) : y(e)(y(C), "start") ? (h(), s("div", m(p({ key: 1 }, y(L))), [g(r.$slots, "start")], 16)) : o("", !0),
+				y(t)(y(T).text) ? (h(), s(i, { key: 2 }, [l(v(y(T).text), 1)], 64)) : y(e)(y(C), "default") ? g(r.$slots, "default", {}, void 0, void 0, 3) : o("", !0),
+				y(T).endIcon ? (h(), a(y(n), p({
 					key: 4,
-					size: g(S).size
-				}, g(O), { icon: g(S).endIcon }), null, 16, ["size", "icon"])) : g(e)(g(b), "end") ? (f(), s("div", d(u({ key: 5 }, g(k))), [p(r.$slots, "end")], 16)) : o("", !0)
-			], 64))]),
+					size: y(T).size
+				}, y(j), { icon: y(T).endIcon }), null, 16, ["size", "icon"])) : y(e)(y(C), "end") ? (h(), s("div", m(p({ key: 5 }, y(N))), [g(r.$slots, "end")], 16)) : o("", !0)
+			], 64))], 16)]),
 			_: 3
 		}, 16, [
 			"href",
@@ -69,4 +68,4 @@ var y = /*@__PURE__*/ l({
 	}
 });
 //#endregion
-export { y as default };
+export { S as default };

package/dist/Components/Button/composables/useButton.d.ts

@@ -10,16 +10,18 @@ export declare function useButton(props: ButtonOwnProps, libDefaults: ButtonLibD
     rootBind: import('vue').ComputedRef<import('@bridge-ui/core/Utils').MergePartBind<{
         "aria-pressed": boolean | undefined;
         class: string;
-    }, "class", import('vue').HTMLAttributes | undefined, Omit<ButtonProps, "color" | "href" | "icon" | "size" | "classes" | "customProps" | "full" | "rounded" | "variant" | "text" | "disabled" | "endIcon" | "startIcon" | "as" | "density" | "loading" | "selected">>>;
+    }, "class", import('vue').HTMLAttributes | undefined, Omit<ButtonProps, "color" | "href" | "icon" | "size" | "classes" | "customProps" | "full" | "rounded" | "variant" | "text" | "disabled" | "endIcon" | "startIcon" | "loading" | "as" | "density" | "selected">>>;
     rootHref: import('vue').ComputedRef<string | undefined>;
     rootType: import('vue').ComputedRef<"button" | undefined>;
     endIconBind: import('vue').ComputedRef<import('@bridge-ui/core/Utils').MergePartBind<object, "class", Partial<Omit<import('../../Icon').IconProps, "icon">> | undefined, {}>>;
+    contentBind: import('vue').ComputedRef<import('@bridge-ui/core/Utils').MergePartBind<object, "class", {}, {}>>;
     endSlotBind: import('vue').ComputedRef<import('@bridge-ui/core/Utils').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, {}>>;
     rootAriaBusy: import('vue').ComputedRef<true | undefined>;
     rootDisabled: import('vue').ComputedRef<boolean | undefined>;
     startIconBind: import('vue').ComputedRef<import('@bridge-ui/core/Utils').MergePartBind<object, "class", Partial<Omit<import('../../Icon').IconProps, "icon">> | undefined, {}>>;
     startSlotBind: import('vue').ComputedRef<import('@bridge-ui/core/Utils').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, {}>>;
     loadingIconBind: import('vue').ComputedRef<import('@bridge-ui/core/Utils').MergePartBind<object, "class", Partial<Omit<import('../../Icon').IconProps, "icon">> | undefined, {}>>;
+    loadingWrapBind: import('vue').ComputedRef<import('@bridge-ui/core/Utils').MergePartBind<object, "class", {}, {}>>;
     rootAriaDisabled: import('vue').ComputedRef<true | undefined>;
 };
 export {};

package/dist/Components/Button/composables/useButton.js

@@ -67,59 +67,65 @@ function _(_, v) {
 	}), B = i(() => {
 		let e = m(d, w.value?.tokens?.rounded);
 		return s(e, C.value.rounded);
-	});
+	}), V = i(() => e(T.value?.icon, {}, p({
+		"shrink-0": !0,
+		[E.value.icon ?? ""]: !0
+	}))), H = i(() => e(T.value?.root, x.value.inheritedAttrs, {
+		"aria-pressed": l(C.value.selected) ? void 0 : C.value.selected,
+		class: p({
+			"inline-flex items-center justify-center": !0,
+			"cursor-pointer outline-none outline-hidden": !0,
+			"shrink-0": A.value,
+			[L.value ?? ""]: !0,
+			[B.value ?? ""]: !0,
+			"h-auto": A.value && !l(b) && b.value?.density !== "mini",
+			"border border-transparent": !l(b) && R.value !== "outline",
+			"w-full": !A.value && C.value.full,
+			"w-fit": !A.value && !C.value.full,
+			"group hover:shadow-xs": !A.value,
+			[s(z.value, "base") ?? ""]: !0,
+			[s(z.value, "hover") ?? ""]: !0,
+			[s(z.value, "focus") ?? ""]: !0,
+			[s(z.value, "selected") ?? ""]: C.value.selected === !0,
+			relative: !0,
+			"z-10": C.value.selected === !0,
+			"transition-all ease-in-out duration-200": !0,
+			"focus:ring-2": !0,
+			"focus:ring-offset-background-white dark:focus:ring-offset-background-dark": !0,
+			"disabled:opacity-80 disabled:cursor-not-allowed": !0,
+			"aria-disabled:opacity-80 aria-disabled:cursor-not-allowed aria-disabled:pointer-events-none": !0,
+			[E.value.root ?? ""]: !0
+		})
+	})), U = i(() => e(T.value?.endIcon, {}, p({
+		"shrink-0": !0,
+		[E.value.endIcon ?? ""]: !0
+	}))), W = i(() => e(T.value?.end, {}, "inline-flex shrink-0 items-center")), G = i(() => e(T.value?.startIcon, {}, p({
+		"shrink-0": !0,
+		[E.value.startIcon ?? ""]: !0
+	}))), K = i(() => e(T.value?.start, {}, "inline-flex shrink-0 items-center")), q = i(() => e({}, {}, "pointer-events-none absolute inset-0 flex items-center justify-center"));
 	return {
 		tag: D,
 		merged: C,
 		isMini: A,
-		iconBind: i(() => e(T.value?.icon, {}, p({
-			"shrink-0": !0,
-			[E.value.icon ?? ""]: !0
-		}))),
-		rootBind: i(() => e(T.value?.root, x.value.inheritedAttrs, {
-			"aria-pressed": l(C.value.selected) ? void 0 : C.value.selected,
-			class: p({
-				"inline-flex items-center justify-center": !0,
-				"cursor-pointer outline-none outline-hidden": !0,
-				"shrink-0": A.value,
-				[L.value ?? ""]: !0,
-				[B.value ?? ""]: !0,
-				"h-auto": A.value && !l(b) && b.value?.density !== "mini",
-				"border border-transparent": !l(b) && R.value !== "outline",
-				"w-full": !A.value && C.value.full,
-				"w-fit": !A.value && !C.value.full,
-				"group hover:shadow-xs": !A.value,
-				[s(z.value, "base") ?? ""]: !0,
-				[s(z.value, "hover") ?? ""]: !0,
-				[s(z.value, "focus") ?? ""]: !0,
-				[s(z.value, "selected") ?? ""]: C.value.selected === !0,
-				"relative z-10": C.value.selected === !0,
-				"transition-all ease-in-out duration-200": !0,
-				"focus:ring-2": !0,
-				"focus:ring-offset-background-white dark:focus:ring-offset-background-dark": !0,
-				"disabled:opacity-80 disabled:cursor-not-allowed": !0,
-				"aria-disabled:opacity-80 aria-disabled:cursor-not-allowed aria-disabled:pointer-events-none": !0,
-				[E.value.root ?? ""]: !0
-			})
-		})),
+		iconBind: V,
+		rootBind: H,
 		rootHref: F,
 		rootType: I,
-		endIconBind: i(() => e(T.value?.endIcon, {}, p({
-			"shrink-0": !0,
-			[E.value.endIcon ?? ""]: !0
+		endIconBind: U,
+		contentBind: i(() => e({}, {}, p({
+			contents: !0,
+			invisible: C.value.loading
 		}))),
-		endSlotBind: i(() => e(T.value?.end, {}, "inline-flex shrink-0 items-center")),
+		endSlotBind: W,
 		rootAriaBusy: N,
 		rootDisabled: M,
-		startIconBind: i(() => e(T.value?.startIcon, {}, p({
-			"shrink-0": !0,
-			[E.value.startIcon ?? ""]: !0
-		}))),
-		startSlotBind: i(() => e(T.value?.start, {}, "inline-flex shrink-0 items-center")),
+		startIconBind: G,
+		startSlotBind: K,
 		loadingIconBind: i(() => e(T.value?.loading, {}, p({
 			"shrink-0 animate-spin": !0,
 			[E.value.loading ?? ""]: !0
 		}))),
+		loadingWrapBind: q,
 		rootAriaDisabled: P
 	};
 }

package/dist/Components/Calendar/composables/useCalendar.d.ts

@@ -26,7 +26,7 @@ export declare function useCalendar(props: MaybeRefOrGetter<CalendarOwnProps>, l
     }>;
     context: import('vue').ComputedRef<DateAdapterContext>;
     showNav: import('vue').ComputedRef<boolean>;
-    rootBind: import('vue').ComputedRef<import('@bridge-ui/core/Utils').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, Partial<Omit<CalendarOwnProps, "error" | "color" | "fill" | "value" | "classes" | "customProps" | "rounded" | "view" | "disabled" | "multiple" | "range" | "defaultValue" | "readOnly" | "disableDates" | "disableMonths" | "disableYears" | "hideOutsideDays" | "hideWeekdays" | "maxDate" | "minDate" | "previewDate" | "startOfWeek" | "timeZone" | "viewDate" | "defaultView" | "hideMonths" | "hideYears">>>>;
+    rootBind: import('vue').ComputedRef<import('@bridge-ui/core/Utils').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, Partial<Omit<CalendarOwnProps, "error" | "color" | "fill" | "value" | "classes" | "customProps" | "rounded" | "view" | "disabled" | "hideMonths" | "hideOutsideDays" | "hideWeekdays" | "hideYears" | "multiple" | "range" | "startOfWeek" | "timeZone" | "defaultValue" | "readOnly" | "disableDates" | "disableMonths" | "disableYears" | "maxDate" | "minDate" | "previewDate" | "viewDate" | "defaultView">>>>;
     viewDate: import('vue').ComputedRef<Date>;
     viewYear: import('vue').ComputedRef<number>;
     bodyBind: import('vue').ComputedRef<import('@bridge-ui/core/Utils').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, {}>>;

package/dist/Components/CalendarDate/composables/useCalendarDate.d.ts

@@ -15,7 +15,7 @@ export declare function useCalendarDate(props: MaybeRefOrGetter<CalendarDateOwnP
     value: import('vue').ComputedRef<DatePickerModel>;
     merged: import('vue').ComputedRef<CalendarDateMerged>;
     context: import('vue').ComputedRef<DateAdapterContext>;
-    rootBind: import('vue').ComputedRef<import('@bridge-ui/core/Utils').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, Partial<Omit<CalendarDateOwnProps, "error" | "color" | "value" | "classes" | "customProps" | "rounded" | "disabled" | "multiple" | "range" | "defaultValue" | "readOnly" | "disableDates" | "disableMonths" | "disableYears" | "hideOutsideDays" | "hideWeekdays" | "maxDate" | "minDate" | "previewDate" | "startOfWeek" | "timeZone" | "viewDate">>>>;
+    rootBind: import('vue').ComputedRef<import('@bridge-ui/core/Utils').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, Partial<Omit<CalendarDateOwnProps, "error" | "color" | "value" | "classes" | "customProps" | "rounded" | "disabled" | "hideOutsideDays" | "hideWeekdays" | "multiple" | "range" | "startOfWeek" | "timeZone" | "defaultValue" | "readOnly" | "disableDates" | "disableMonths" | "disableYears" | "maxDate" | "minDate" | "previewDate" | "viewDate">>>>;
     gridBind: import('vue').ComputedRef<import('@bridge-ui/core/Utils').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, {
         role: string;
         onMouseleave: () => void;

package/dist/Components/CalendarMonth/composables/useCalendarMonth.d.ts

@@ -15,7 +15,7 @@ export declare function useCalendarMonth(props: MaybeRefOrGetter<CalendarMonthOw
     year: import('vue').ComputedRef<number>;
     merged: import('vue').ComputedRef<CalendarMonthMerged>;
     months: import('vue').ComputedRef<CalendarMonthCell[]>;
-    rootBind: import('vue').ComputedRef<import('@bridge-ui/core/Utils').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, Partial<Omit<CalendarMonthOwnProps, "error" | "color" | "value" | "classes" | "customProps" | "rounded" | "disabled" | "readOnly" | "disableMonths" | "maxDate" | "minDate" | "timeZone" | "year">>>>;
+    rootBind: import('vue').ComputedRef<import('@bridge-ui/core/Utils').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, Partial<Omit<CalendarMonthOwnProps, "error" | "color" | "value" | "classes" | "customProps" | "rounded" | "disabled" | "timeZone" | "readOnly" | "disableMonths" | "maxDate" | "minDate" | "year">>>>;
     gridBind: import('vue').ComputedRef<import('@bridge-ui/core/Utils').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, {
         role: string;
     }>>;

package/dist/Components/CalendarRange/composables/useCalendarRange.d.ts

@@ -24,7 +24,7 @@ export declare function useCalendarRange(props: MaybeRefOrGetter<CalendarRangeOw
     merged: import('vue').ComputedRef<CalendarRangeMerged>;
     showNav: import('vue').ComputedRef<boolean>;
     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<CalendarRangeOwnProps, "error" | "color" | "fill" | "orientation" | "value" | "classes" | "customProps" | "rounded" | "disabled" | "defaultValue" | "readOnly" | "disableDates" | "disableMonths" | "disableYears" | "hideOutsideDays" | "hideWeekdays" | "maxDate" | "minDate" | "previewDate" | "startOfWeek" | "timeZone" | "viewDate" | "hideMonths" | "hideYears">>>>;
+    rootBind: import('vue').ComputedRef<import('@bridge-ui/core/Utils').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, Partial<Omit<CalendarRangeOwnProps, "error" | "color" | "fill" | "orientation" | "value" | "classes" | "customProps" | "rounded" | "disabled" | "hideMonths" | "hideOutsideDays" | "hideWeekdays" | "hideYears" | "startOfWeek" | "timeZone" | "defaultValue" | "readOnly" | "disableDates" | "disableMonths" | "disableYears" | "maxDate" | "minDate" | "previewDate" | "viewDate">>>>;
     bodyBind: import('vue').ComputedRef<import('@bridge-ui/core/Utils').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, {}>>;
     viewDate: import('vue').ComputedRef<Date>;
     viewYear: import('vue').ComputedRef<number>;

package/dist/Components/CalendarYear/composables/useCalendarYear.d.ts

@@ -14,7 +14,7 @@ export type CalendarYearCell = {
 export declare function useCalendarYear(props: MaybeRefOrGetter<CalendarYearOwnProps>, libDefaults: CalendarYearLibDefaults, emit: (event: "change", year: number) => void): {
     years: import('vue').ComputedRef<CalendarYearCell[]>;
     merged: import('vue').ComputedRef<CalendarYearMerged>;
-    rootBind: import('vue').ComputedRef<import('@bridge-ui/core/Utils').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, Partial<Omit<CalendarYearOwnProps, "error" | "color" | "value" | "classes" | "customProps" | "rounded" | "disabled" | "readOnly" | "disableYears" | "maxDate" | "minDate" | "timeZone" | "pageSize" | "startYear">>>>;
+    rootBind: import('vue').ComputedRef<import('@bridge-ui/core/Utils').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, Partial<Omit<CalendarYearOwnProps, "error" | "color" | "value" | "classes" | "customProps" | "rounded" | "disabled" | "timeZone" | "readOnly" | "disableYears" | "maxDate" | "minDate" | "pageSize" | "startYear">>>>;
     gridBind: import('vue').ComputedRef<import('@bridge-ui/core/Utils').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, {
         role: string;
     }>>;

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

@@ -25,8 +25,8 @@ declare const __VLS_base: import('vue').DefineComponent<__VLS_PublicProps, {}, {
     fill: boolean;
     showFooter: boolean;
     showErrorIcon: boolean;
-    clearable: boolean;
     showSwatch: boolean;
+    clearable: boolean;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
 declare const _default: typeof __VLS_export;

package/dist/Components/ColorField/ColorField.vue_vue_type_script_setup_true_lang.js

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

package/dist/Components/ColorField/composables/useColorField.d.ts

@@ -10,7 +10,7 @@ export declare function useColorField(props: ColorFieldOwnProps, model: Ref<null
     format: import('vue').ComputedRef<"hex" | "hsl" | "rgb" | "hexa" | "hsla" | "rgba">;
     overlay: import('vue').ComputedRef<import('@bridge-ui/core/Domain').FieldOverlayMode | undefined>;
     hasValue: import('vue').ComputedRef<boolean>;
-    colorOnly: import('vue').ComputedRef<Pick<ColorFieldOwnProps & Record<string, unknown>, "fill" | "format" | "classes" | "overlay" | "showFooter" | "customProps" | "clearable" | "defaultValue" | "alpha" | "swatches" | "editable" | "showSwatch">>;
+    colorOnly: import('vue').ComputedRef<Pick<ColorFieldOwnProps & Record<string, unknown>, "fill" | "format" | "classes" | "overlay" | "showFooter" | "customProps" | "alpha" | "editable" | "showSwatch" | "defaultValue" | "clearable" | "swatches">>;
     formField: {
         slots: Readonly<{
             [name: string]: import('vue').Slot<any> | undefined;
@@ -438,11 +438,10 @@ export declare function useColorField(props: ColorFieldOwnProps, 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" | "rounded" | "variant" | "label" | "disabled" | "required" | "corner" | "description" | "errorMessage" | "start" | "endIcon" | "errorIcon" | "hideErrorMessage" | "readonly" | "showDescriptionOnError" | "showErrorIcon" | "startIcon">>>>;
         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, {}>>;
-        cornerBind: import('vue').ComputedRef<import('@bridge-ui/core/Utils').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, {}>>;
         headerBind: import('vue').ComputedRef<import('@bridge-ui/core/Utils').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, {}>>;
         isDisabled: import('vue').ComputedRef<boolean>;
         isReadonly: import('vue').ComputedRef<boolean>;
@@ -460,9 +459,12 @@ export declare function useColorField(props: ColorFieldOwnProps, model: Ref<null
         ariaDescribedBy: import('vue').ComputedRef<string | undefined>;
         descriptionBind: import('vue').ComputedRef<import('@bridge-ui/core/Utils').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, {}>>;
         stackedBodyBind: import('vue').ComputedRef<import('@bridge-ui/core/Utils').MergePartBind<object, "class", {}, {}>>;
+        fieldCornerProps: import('vue').ComputedRef<import('../../Label').LabelProps>;
         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 useColorField(props: ColorFieldOwnProps, 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" | "rounded" | "variant" | "label" | "disabled" | "required" | "corner" | "description" | "errorMessage" | "start" | "endIcon" | "errorIcon" | "hideErrorMessage" | "readonly" | "showDescriptionOnError" | "showErrorIcon" | "startIcon">>>, "class", {
         value: string;
         readonly: boolean;
         onFocus: (event: FocusEvent) => void;

package/dist/Components/ColorPicker/composables/useColorPicker.d.ts

@@ -22,7 +22,7 @@ export declare function useColorPicker(props: MaybeRefOrGetter<ColorPickerOwnPro
         onPointerdown: (event: PointerEvent) => void;
         onPointermove: (event: PointerEvent) => void;
     }>>;
-    rootBind: import('vue').ComputedRef<import('@bridge-ui/core/Utils').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, Partial<Omit<ColorPickerOwnProps, "fill" | "format" | "value" | "classes" | "showFooter" | "customProps" | "rounded" | "disabled" | "defaultValue" | "readOnly" | "alpha" | "swatches">>>>;
+    rootBind: import('vue').ComputedRef<import('@bridge-ui/core/Utils').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, Partial<Omit<ColorPickerOwnProps, "fill" | "format" | "value" | "classes" | "showFooter" | "customProps" | "rounded" | "disabled" | "alpha" | "defaultValue" | "readOnly" | "swatches">>>>;
     areaBind: import('vue').ComputedRef<import('@bridge-ui/core/Utils').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, {
         role: string;
         onKeydown: (event: KeyboardEvent) => void;