@bridge-ui/vue 0.0.9 → 0.0.11

package/dist/Components/Drawer/composables/useDrawer.js

@@ -1,11 +1,12 @@
-import { mergePartBind as e, resolveVnodeRefElement as t, useBridgeUIComponent as ee, useBridgeUIMergedRegistryClasses as te } from "../../../Utils/index.js";
-import { computed as n, nextTick as r, onBeforeUnmount as ne, ref as i, toValue as re, useAttrs as ie, watch as a } from "vue";
-import { DRAWER_LEAVE_FALLBACK_MS as o, LAYER_STACK_BASE_Z_INDEX as s, acquireLayerStackOrder as ae, cn as c, countDrawerTransitionLayers as l, createFocusTrap as u, getDrawerOverlayTransitionClass as oe, getDrawerPanelTransitionClass as se, getLayerStackEntry as ce, hasDrawerTransition as le, mergeBridgeUILayeredClasses as d, pushLayerStack as f, resolveEffectiveDrawerTransition as p, splitComponentProps as m, subscribeLayerStack as h } from "@bridge-ui/core";
-import { get as g } from "es-toolkit/compat";
-import { isModalBackdropClick as ue } from "@bridge-ui/core/Utils";
-import { blurProps as de, placementPanelProps as fe, placementProps as pe, sizeProps as me } from "@bridge-ui/core/Tokens/Drawer";
+import { mergePartBind as e, resolveVnodeRefElement as t, useBridgeUIComponent as n, useBridgeUIMergedRegistryClasses as ee } from "../../../Utils/index.js";
+import { computed as r, nextTick as i, onBeforeUnmount as te, ref as a, toValue as ne, useAttrs as re, watch as o } from "vue";
+import { get as s } from "es-toolkit/compat";
+import { drawerBlurProps as c, drawerPlacementPanelProps as ie, drawerPlacementProps as ae, drawerSizeProps as oe } from "@bridge-ui/core/Tokens";
+import { cn as l, mergeBridgeUILayeredClasses as u, splitComponentProps as d } from "@bridge-ui/core/Utils";
+import { createFocusTrap as f, isModalBackdropClick as p } from "@bridge-ui/core/Runtime";
+import { DRAWER_LEAVE_FALLBACK_MS as se, LAYER_STACK_BASE_Z_INDEX as m, acquireLayerStackOrder as ce, countDrawerTransitionLayers as le, getDrawerOverlayTransitionClass as ue, getDrawerPanelTransitionClass as de, getLayerStackEntry as fe, hasDrawerTransition as pe, pushLayerStack as me, resolveEffectiveDrawerTransition as he, subscribeLayerStack as ge } from "@bridge-ui/core/Layer";
 //#region src/Components/Drawer/composables/useDrawer.ts
-var he = [
+var _e = [
 	"blur",
 	"size",
 	"scroll",
@@ -27,58 +28,58 @@ var he = [
 	"disableEnforceFocus",
 	"disableRestoreFocus"
 ];
-function _(_, ge, v = {}) {
-	let _e = ie(), y = i(!1), b = i(!1), x = i(""), S = 0, C = null, w = null, T = i(null), E = null, D = i(s), O = null, k = i("closed"), A = null, j = n(() => re(v.show ?? !1));
+function h(h, g, _ = {}) {
+	let ve = re(), v = a(!1), y = a(!1), b = a(""), x = !1, S = 0, C = null, w = null, T = a(null), E = null, D = a(m), O = null, k = a("closed"), A = null, j = r(() => ne(_.show ?? !1));
 	function M(e) {
-		e || v.onClose?.(), v.show && (v.show.value = e), v.onShowChange?.(e);
+		e || _.onClose?.(), _.show && (_.show.value = e), _.onShowChange?.(e);
 	}
-	let N = n(() => m({
-		bridgeKeys: he,
+	let N = r(() => d({
+		bridgeKeys: _e,
 		props: {
-			..._e,
-			..._
+			...ve,
+			...h
 		}
-	})), { merged: P, entry: F } = ee({
-		libDefaults: ge,
+	})), { merged: P, entry: F } = n({
+		libDefaults: g,
 		componentName: "Drawer",
 		props: () => N.value.componentProps
-	}), I = n(() => P.value.customProps), L = te({
+	}), I = r(() => P.value.customProps), L = ee({
 		entry: F,
 		props: () => N.value.componentProps
-	}), R = n(() => p(P.value.transition ?? "none")), z = n(() => le(R.value)), B = n(() => P.value.scroll ?? "paper"), V = n(() => P.value.keepMounted && !y.value), H = n(() => P.value.placement ?? "left"), U = n(() => H.value === "left" || H.value === "right" ? "horizontal" : "vertical"), ve = n(() => {
-		let e = d(pe, F.value?.tokens?.placement);
-		return g(e, H.value);
-	}), ye = n(() => g(fe, H.value)), be = n(() => {
-		let e = d(de, F.value?.tokens?.blur);
-		return g(e, P.value.blur);
-	}), xe = n(() => {
-		let e = d(me, F.value?.tokens?.size);
-		return g(e, [P.value.size, U.value]);
-	}), Se = n(() => oe(R.value)), Ce = n(() => se(R.value, H.value)), W = n(() => !P.value.persistent), we = n(() => N.value.inheritedAttrs), Te = n(() => e(I.value?.root, we.value, {
-		onTransitionend: je,
+	}), R = r(() => he(P.value.transition ?? "none")), z = r(() => pe(R.value)), B = r(() => P.value.scroll ?? "paper"), V = r(() => P.value.keepMounted && !v.value), H = r(() => P.value.placement ?? "left"), U = r(() => H.value === "left" || H.value === "right" ? "horizontal" : "vertical"), ye = r(() => {
+		let e = u(ae, F.value?.tokens?.placement);
+		return s(e, H.value);
+	}), be = r(() => s(ie, H.value)), xe = r(() => {
+		let e = u(c, F.value?.tokens?.blur);
+		return s(e, P.value.blur);
+	}), Se = r(() => {
+		let e = u(oe, F.value?.tokens?.size);
+		return s(e, [P.value.size, U.value]);
+	}), Ce = r(() => ue(R.value)), we = r(() => de(R.value, H.value)), W = r(() => !P.value.persistent), Te = r(() => N.value.inheritedAttrs), Ee = r(() => e(I.value?.root, Te.value, {
+		onTransitionend: Me,
 		style: { zIndex: D.value },
 		"aria-hidden": V.value ? !0 : void 0,
-		class: c({
+		class: l({
 			"fixed inset-0": !0,
 			"overflow-y-auto": B.value === "body",
 			"overflow-hidden": B.value === "paper",
 			"invisible pointer-events-none": V.value,
-			[g(L.value, "root") ?? ""]: !0
+			[s(L.value, "root") ?? ""]: !0
 		})
-	})), Ee = n(() => e(I.value?.overlay, { onClick: Z }, {
+	})), De = r(() => e(I.value?.overlay, { onClick: Z }, {
 		"data-drawer-part": "overlay",
 		"data-state": k.value,
-		class: c({
+		class: l({
 			"fixed inset-0 bg-black/50": !0,
-			[be.value ?? ""]: !0,
-			[Se.value]: z.value,
-			[g(L.value, "overlay") ?? ""]: !0
+			[xe.value ?? ""]: !0,
+			[Ce.value]: z.value,
+			[s(L.value, "overlay") ?? ""]: !0
 		})
-	})), De = n(() => e(I.value?.wrapper, { onClick: Q }, c({
+	})), Oe = r(() => e(I.value?.wrapper, { onClick: Q }, l({
 		"flex min-h-full w-full transform": !0,
-		[ve.value ?? ""]: !0,
-		[g(L.value, "wrapper") ?? ""]: !0
-	}))), Oe = n(() => e(I.value?.panel, {
+		[ye.value ?? ""]: !0,
+		[s(L.value, "wrapper") ?? ""]: !0
+	}))), ke = r(() => e(I.value?.panel, {
 		role: "dialog",
 		"aria-modal": !0,
 		"aria-label": P.value.ariaLabel,
@@ -86,65 +87,65 @@ function _(_, ge, v = {}) {
 	}, {
 		"data-drawer-part": "panel",
 		"data-state": k.value,
-		class: c({
+		class: l({
 			"relative rounded-none": !0,
-			[ye.value ?? ""]: !0,
-			[xe.value ?? ""]: !0,
+			[be.value ?? ""]: !0,
+			[Se.value ?? ""]: !0,
 			"overflow-y-auto": B.value === "paper",
-			[Ce.value]: z.value,
-			[g(L.value, "panel") ?? ""]: !0
+			[we.value]: z.value,
+			[s(L.value, "panel") ?? ""]: !0
 		})
 	}));
 	function G() {
 		w?.release(), w = null;
 	}
 	function K() {
-		if (!y.value || k.value !== "open" || !T.value) {
+		if (!v.value || k.value !== "open" || !T.value) {
 			G();
 			return;
 		}
-		G(), w = u({
+		G(), w = f({
 			container: T.value,
 			disableAutoFocus: !P.value.autoFocus,
 			disableEnforceFocus: P.value.disableEnforceFocus,
 			disableRestoreFocus: P.value.disableRestoreFocus
 		});
 	}
-	function ke(e) {
+	function Ae(e) {
 		T.value = t(e), K();
 	}
 	function q() {
 		A !== null && (clearTimeout(A), A = null);
 	}
 	function J() {
-		q(), S = 0, y.value = !1, G(), j.value ? M(!1) : v.onShowChange?.(!1), k.value = "closed", P.value.keepMounted || (b.value = !1);
+		x && (x = !1, q(), S = 0, v.value = !1, G(), j.value ? M(!1) : _.onShowChange?.(!1), k.value = "closed", P.value.keepMounted || (y.value = !1));
 	}
 	function Y() {
-		if (E?.releaseScrollLock(), !z.value) {
+		if (E?.releaseScrollLock(), x = !0, !z.value) {
 			J();
 			return;
 		}
-		if (k.value = "closed", S = l(R.value, { hideBackdrop: P.value.hideBackdrop }), S === 0) {
+		if (k.value = "closed", S = le(R.value, { hideBackdrop: P.value.hideBackdrop }), S === 0) {
 			J();
 			return;
 		}
 		q(), A = setTimeout(() => {
 			A = null, S > 0 && J();
-		}, o);
+		}, se);
 	}
-	function Ae() {
-		if (!z.value) {
+	function je() {
+		if (x = !1, q(), S = 0, !z.value) {
 			k.value = "open";
 			return;
 		}
-		k.value = "closed", r(() => {
+		k.value = "closed", i(() => {
 			requestAnimationFrame(() => {
 				k.value = "open";
 			});
 		});
 	}
-	function je(e) {
-		if (!b.value || k.value !== "closed") return;
+	function Me(e) {
+		if (!x || !y.value || k.value !== "closed") return;
 		let t = e.target;
 		(t?.dataset.drawerPart === "overlay" || t?.dataset.drawerPart === "panel") && e.propertyName !== "none" && e.elapsedTime !== 0 && (--S, S <= 0 && J());
 	}
@@ -154,64 +155,64 @@ function _(_, ge, v = {}) {
 				M(!1);
 				return;
 			}
-			b.value && Y();
+			y.value && Y();
 		}
 	}
 	function Z() {
 		P.value.closeOnOverlay === !1 || !W.value || X();
 	}
 	function Q(e) {
-		ue(e) && Z();
+		p(e) && Z();
 	}
-	function Me() {
+	function Ne() {
 		!j.value || P.value.closeOnEscape === !1 || !W.value || X();
 	}
-	a(j, (e) => {
+	o(j, (e) => {
 		if (e) {
-			b.value = !0, y.value = !0, Ae();
+			y.value = !0, v.value = !0, je();
 			return;
 		}
-		b.value && Y();
-	}, { immediate: !0 }), a([
-		y,
+		y.value && Y();
+	}, { immediate: !0 }), o([
+		v,
 		k,
 		() => P.value.autoFocus,
 		() => P.value.disableEnforceFocus,
 		() => P.value.disableRestoreFocus
 	], () => {
-		r(() => {
+		i(() => {
 			K();
 		});
 	});
 	function $() {
-		let e = ce(x.value);
+		let e = fe(b.value);
 		e && (D.value = e.zIndex);
 	}
-	return a(y, (e) => {
+	return o(v, (e) => {
 		if (e) {
-			C === null && (C = ae()), E = f({
+			C === null && (C = ce()), E = me({
 				order: C,
-				id: v.stackId,
-				onEscape: Me,
+				id: _.stackId,
+				onEscape: Ne,
 				lockScroll: P.value.disableScrollLock !== !0
-			}), x.value = E.id, D.value = E.zIndex, $(), O = h($);
+			}), b.value = E.id, D.value = E.zIndex, $(), O = ge($);
 			return;
 		}
-		O?.(), O = null, E?.release(), E = null, x.value = "", D.value = s, b.value || (C = null);
-	}, { immediate: !0 }), ne(() => {
+		O?.(), O = null, E?.release(), E = null, b.value = "", D.value = m, y.value || (C = null);
+	}, { immediate: !0 }), te(() => {
 		q(), O?.(), O = null, G(), E?.release(), E = null, C = null;
 	}), {
 		merged: P,
-		mounted: b,
-		rootBind: Te,
-		panelBind: Oe,
-		overlayBind: Ee,
-		wrapperBind: De,
-		setPanelRef: ke,
-		layerStackId: x,
+		mounted: y,
+		rootBind: Ee,
+		panelBind: ke,
+		overlayBind: De,
+		wrapperBind: Oe,
+		setPanelRef: Ae,
+		layerStackId: b,
 		handleOverlayClick: Z,
 		handleWrapperClick: Q
 	};
 }
 //#endregion
-export { _ as useDrawer };
+export { h as useDrawer };

package/dist/Components/Drawer/drawer.types.d.ts

@@ -1,5 +1,6 @@
 import { HTMLAttributes, Slot } from 'vue';
-import { DrawerBlur, DrawerPlacement, DrawerScroll, DrawerSize, DrawerTransition, MergeHtmlProps, MergeProps } from '@bridge-ui/core';
+import { DrawerBlur, DrawerPlacement, DrawerScroll, DrawerSize, DrawerTransition } from '@bridge-ui/core/Tokens';
+import { MergeHtmlProps, MergeProps } from '@bridge-ui/core/Utils';
 export interface DrawerBlurOverrides {}
 export interface DrawerSizeOverrides {}
 export interface DrawerScrollOverrides {}

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

@@ -14,7 +14,7 @@ declare const __VLS_base: import('vue').DefineComponent<__VLS_PublicProps, {}, {
     "onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
     "onShow-change"?: ((show: boolean) => any) | undefined;
 }>, {
-    overlay: import('@bridge-ui/core').FieldOverlayMode;
+    overlay: import('@bridge-ui/core/Domain').FieldOverlayMode;
 }, {}, {}, {}, 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/FieldOverlay/FieldOverlay.vue_vue_type_script_setup_true_lang.js

@@ -1,13 +1,14 @@
 import { useFieldOverlay as e } from "./composables/useFieldOverlay.js";
 import t from "../Drawer/Drawer.js";
-import n from "../Menu/Menu.js";
-import r from "../Modal/Modal.js";
-import { createBlock as i, defineComponent as a, mergeModels as o, mergeProps as s, openBlock as c, renderSlot as l, unref as u, useModel as d, withCtx as f } from "vue";
+import { FIELD_OVERLAY_INJECTION_KEY as n } from "./fieldOverlayInjectionKey.js";
+import r from "../Menu/Menu.js";
+import i from "../Modal/Modal.js";
+import { createBlock as a, defineComponent as o, mergeModels as s, mergeProps as c, openBlock as l, provide as u, renderSlot as d, unref as f, useModel as p, withCtx as m } from "vue";
 //#region src/Components/FieldOverlay/FieldOverlay.vue?vue&type=script&setup=true&lang.ts
-var p = /*@__PURE__*/ a({
+var h = /*@__PURE__*/ o({
 	inheritAttrs: !1,
 	__name: "FieldOverlay",
-	props: /*@__PURE__*/ o({
+	props: /*@__PURE__*/ s({
 		customProps: {},
 		overlay: { default: "auto" }
 	}, {
@@ -17,47 +18,55 @@ var p = /*@__PURE__*/ a({
 		},
 		modelModifiers: {}
 	}),
-	emits: /*@__PURE__*/ o(["close", "show-change"], ["update:modelValue"]),
-	setup(a, { emit: o }) {
-		let p = o, m = a, h = d(a, "modelValue"), { menuBind: g, modalBind: _, drawerBind: v, resolvedOverlay: y } = e(m);
-		function b(e) {
-			p("show-change", e);
+	emits: /*@__PURE__*/ s(["close", "show-change"], ["update:modelValue"]),
+	setup(o, { emit: s }) {
+		let h = s, g = o, _ = p(o, "modelValue"), { menuBind: v, modalBind: y, drawerBind: b, resolvedOverlay: x } = e(g);
+		u(n, {
+			apply: () => {
+				_.value = !1;
+			},
+			cancel: () => {
+				_.value = !1;
+			}
+		});
+		function S(e) {
+			h("show-change", e);
 		}
-		function x() {
-			p("close");
+		function C() {
+			h("close");
 		}
-		return (e, a) => u(y) === "menu" ? (c(), i(u(n), s({
+		return (e, n) => f(x) === "menu" ? (l(), a(f(r), c({
 			key: 0,
-			modelValue: h.value,
-			"onUpdate:modelValue": a[0] ||= (e) => h.value = e
-		}, u(g), {
-			onClose: x,
-			"onUpdate:modelValue": b
+			modelValue: _.value,
+			"onUpdate:modelValue": n[0] ||= (e) => _.value = e
+		}, f(v), {
+			onClose: C,
+			"onUpdate:modelValue": S
 		}), {
-			default: f(() => [l(e.$slots, "default")]),
+			default: m(() => [d(e.$slots, "default")]),
 			_: 3
-		}, 16, ["modelValue"])) : u(y) === "modal" ? (c(), i(u(r), s({
+		}, 16, ["modelValue"])) : f(x) === "modal" ? (l(), a(f(i), c({
 			key: 1,
-			modelValue: h.value,
-			"onUpdate:modelValue": a[1] ||= (e) => h.value = e
-		}, u(_), {
-			onClose: x,
-			onShowChange: b
+			modelValue: _.value,
+			"onUpdate:modelValue": n[1] ||= (e) => _.value = e
+		}, f(y), {
+			onClose: C,
+			onShowChange: S
 		}), {
-			default: f(() => [l(e.$slots, "default")]),
+			default: m(() => [d(e.$slots, "default")]),
 			_: 3
-		}, 16, ["modelValue"])) : (c(), i(u(t), s({
+		}, 16, ["modelValue"])) : (l(), a(f(t), c({
 			key: 2,
-			modelValue: h.value,
-			"onUpdate:modelValue": a[2] ||= (e) => h.value = e
-		}, u(v), {
-			onClose: x,
-			onShowChange: b
+			modelValue: _.value,
+			"onUpdate:modelValue": n[2] ||= (e) => _.value = e
+		}, f(b), {
+			onClose: C,
+			onShowChange: S
 		}), {
-			default: f(() => [l(e.$slots, "default")]),
+			default: m(() => [d(e.$slots, "default")]),
 			_: 3
 		}, 16, ["modelValue"]));
 	}
 });
 //#endregion
-export { p as default };
+export { h as default };

package/dist/Components/FieldOverlay/composables/useFieldOverlay.d.ts

@@ -1,4 +1,4 @@
-import { ResolvedFieldOverlay } from '@bridge-ui/core';
+import { ResolvedFieldOverlay } from '@bridge-ui/core/Domain';
 import { DrawerOwnProps } from '../../Drawer/drawer.types';
 import { FieldOverlayOwnProps } from '../fieldOverlay.types';
 import { MenuOwnProps } from '../../Menu/menu.types';

package/dist/Components/FieldOverlay/composables/useFieldOverlay.js

@@ -1,33 +1,38 @@
 import { useBreakpoint as e } from "../../../Utils/useBreakpoint.js";
 import { computed as t } from "vue";
-import { cn as n, resolveFieldOverlay as r } from "@bridge-ui/core";
+import { resolveFieldOverlay as n } from "@bridge-ui/core/Domain";
+import { cn as r } from "@bridge-ui/core/Utils";
 import { toMerged as i } from "es-toolkit/object";
 //#region src/Components/FieldOverlay/composables/useFieldOverlay.ts
 function a(e, t) {
-	let r = e.customProps?.panel;
+	let n = e.customProps?.panel;
 	return i(e, { customProps: { panel: {
-		...r,
-		class: n(t, r?.class)
+		...n,
+		class: r(t, n?.class)
 	} } });
 }
-function o(n) {
-	let i = e(), o = t(() => r(n.overlay, i.mobile));
+function o(r) {
+	let i = e(), o = t(() => n(r.overlay, i.mobile));
 	return {
 		menuBind: t(() => ({
 			closeOnClickAway: !0,
 			placement: "bottom-start",
-			...n.customProps?.menu
+			...r.customProps?.menu
 		})),
 		modalBind: t(() => a({
 			size: "md",
 			scroll: "paper",
+			closeOnOverlay: !0,
 			align: "middle-center",
-			...n.customProps?.modal
-		}, "flex flex-col items-stretch p-0")),
+			disableRestoreFocus: !0,
+			...r.customProps?.modal
+		}, "flex w-fit max-w-full flex-col items-stretch p-0")),
 		drawerBind: t(() => a({
 			size: "md",
 			placement: "bottom",
-			...n.customProps?.drawer
+			closeOnOverlay: !0,
+			disableRestoreFocus: !0,
+			...r.customProps?.drawer
 		}, "flex h-auto max-h-[90dvh] flex-col items-stretch p-0")),
 		resolvedOverlay: o
 	};

package/dist/Components/FieldOverlay/fieldOverlay.types.d.ts

@@ -1,5 +1,5 @@
 import { Slot } from 'vue';
-import { FieldOverlayMode } from '@bridge-ui/core';
+import { FieldOverlayMode } from '@bridge-ui/core/Domain';
 import { DrawerOwnProps } from '../Drawer/drawer.types';
 import { MenuOwnProps } from '../Menu/menu.types';
 import { ModalOwnProps } from '../Modal/modal.types';

package/dist/Components/FieldOverlay/fieldOverlayInjectionKey.d.ts

@@ -0,0 +1,17 @@
+import { InjectionKey } from 'vue';
+/**
+ * Footer Apply / Cancel actions for the nearest FieldOverlay.
+ * These only close the overlay. Picker and listbox `footer` slot
+ * `apply` / `cancel` commit or discard first, then call these.
+ */
+export type FieldOverlayFooterApi = {
+    /**
+     * Closes the overlay. Call after committing draft state.
+     */
+    apply: () => void;
+    /**
+     * Closes the overlay. Call after discarding draft state.
+     */
+    cancel: () => void;
+};
+export declare const FIELD_OVERLAY_INJECTION_KEY: InjectionKey<FieldOverlayFooterApi>;

package/dist/Components/FieldOverlay/fieldOverlayInjectionKey.js

@@ -0,0 +1,4 @@
+//#region src/Components/FieldOverlay/fieldOverlayInjectionKey.ts
+var e = Symbol("bridge-field-overlay");
+//#endregion
+export { e as FIELD_OVERLAY_INJECTION_KEY };

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

@@ -2,3 +2,4 @@ export { useFieldOverlay } from './composables/useFieldOverlay';
 export type { FieldOverlayOptions } from './composables/useFieldOverlay';
 export type { FieldOverlayCustomProps, FieldOverlayEmits, FieldOverlayOwnProps, FieldOverlayProps, FieldOverlaySlots, } from './fieldOverlay.types';
 export { default as FieldOverlay } from './FieldOverlay.vue';
+export { FIELD_OVERLAY_INJECTION_KEY, type FieldOverlayFooterApi, } from './fieldOverlayInjectionKey';

package/dist/Components/FieldOverlay/index.js

@@ -1,3 +1,4 @@
 import { useFieldOverlay as e } from "./composables/useFieldOverlay.js";
-import t from "./FieldOverlay.js";
-export { t as FieldOverlay, e as useFieldOverlay };
+import { FIELD_OVERLAY_INJECTION_KEY as t } from "./fieldOverlayInjectionKey.js";
+import n from "./FieldOverlay.js";
+export { t as FIELD_OVERLAY_INJECTION_KEY, n as FieldOverlay, e as useFieldOverlay };

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

@@ -1,11 +1,9 @@
 import { UseFormControlReturn } from './composables/useFormControl';
+import { FormControlSlots } from './formControl.types';
+type __VLS_Slots = FormControlSlots;
 type __VLS_Props = {
     field: UseFormControlReturn;
 };
-declare var __VLS_6: {};
-type __VLS_Slots = {} & {
-    default?: (props: typeof __VLS_6) => any;
-};
 declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, 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/FormControl/FormControl.vue_vue_type_script_setup_true_lang.js

@@ -1,37 +1,51 @@
-import { hasSlotOrProp as e, resolveSlotOrProp as t } from "../../Utils/slotOrProp.js";
-import n from "./FormControlLabel.js";
-import { computed as r, createBlock as i, createCommentVNode as a, createElementBlock as o, createElementVNode as s, createVNode as c, defineComponent as l, guardReactiveProps as u, mergeProps as d, normalizeProps as f, openBlock as p, renderSlot as m, resolveDynamicComponent as h, unref as g } from "vue";
+import { hasNamedSlot as e, hasSlotOrProp as t, isPropPresent as n } from "../../Utils/slotOrProp.js";
+import r from "./FormControlLabel.js";
+import { Fragment as i, computed as a, createCommentVNode as o, createElementBlock as s, createElementVNode as c, createSlots as l, createTextVNode as u, createVNode as d, defineComponent as f, guardReactiveProps as p, mergeProps as m, normalizeProps as h, openBlock as g, renderSlot as _, toDisplayString as v, unref as y, useSlots as b, withCtx as x } from "vue";
 //#region src/Components/FormControl/FormControl.vue?vue&type=script&setup=true&lang.ts
-var _ = [
+var S = [
 	"data-invalid",
 	"aria-disabled",
 	"aria-readonly"
-], v = ["aria-hidden"], y = /*@__PURE__*/ l({
+], C = ["aria-hidden"], w = /*@__PURE__*/ f({
 	inheritAttrs: !1,
 	__name: "FormControl",
 	props: { field: {} },
-	setup(l) {
-		let y = l, b = r(() => y.field);
-		return (r, l) => (p(), o("div", d(b.value.rootBind.value, {
-			"data-invalid": b.value.invalidated.value || void 0,
-			"aria-disabled": b.value.isDisabled.value || void 0,
-			"aria-readonly": b.value.isReadonly.value || void 0
+	setup(f) {
+		let w = f, T = b(), E = a(() => ({
+			...w.field,
+			slots: {
+				...w.field.slots,
+				...T
+			}
+		}));
+		return (a, f) => (g(), s("div", m(E.value.rootBind.value, {
+			"data-invalid": E.value.invalidated.value || void 0,
+			"aria-disabled": E.value.isDisabled.value || void 0,
+			"aria-readonly": E.value.isReadonly.value || void 0
 		}), [
-			s("div", f(u(b.value.rowBind.value)), [
-				c(n, {
-					api: b.value,
+			c("div", h(p(E.value.rowBind.value)), [
+				d(r, {
+					api: E.value,
 					name: "startLabel"
-				}, null, 8, ["api"]),
-				m(r.$slots, "default"),
-				c(n, {
-					api: b.value,
+				}, l({ _: 2 }, [y(e)(y(T), "startLabel") ? {
+					name: "startLabel",
+					fn: x(() => [_(a.$slots, "startLabel")]),
+					key: "0"
+				} : void 0]), 1032, ["api"]),
+				_(a.$slots, "default"),
+				d(r, {
+					api: E.value,
 					name: "endLabel"
-				}, null, 8, ["api"])
+				}, l({ _: 2 }, [y(e)(y(T), "endLabel") ? {
+					name: "endLabel",
+					fn: x(() => [_(a.$slots, "endLabel")]),
+					key: "0"
+				} : void 0]), 1032, ["api"])
 			], 16),
-			!b.value.invalidated.value && g(e)(b.value.slots, "description", b.value.merged.value.description) ? (p(), o("p", f(d({ key: 0 }, b.value.descriptionBind.value)), [(p(), i(h(g(t)(b.value.slots, "description", b.value.merged.value.description))))], 16)) : a("", !0),
-			b.value.merged.value.hideErrorMessage ? a("", !0) : (p(), o("p", d({ key: 1 }, b.value.errorMessageBind.value, { "aria-hidden": !b.value.showErrorMessageContent.value || void 0 }), [b.value.showErrorMessageContent.value ? (p(), i(h(g(t)(b.value.slots, "errorMessage", b.value.merged.value.errorMessage)), { key: 0 })) : a("", !0)], 16, v))
-		], 16, _));
+			!E.value.invalidated.value && y(t)(y(T), "description", E.value.merged.value.description) ? (g(), s("p", h(m({ key: 0 }, E.value.descriptionBind.value)), [y(e)(y(T), "description") ? _(a.$slots, "description", {}, void 0, void 0, 0) : y(n)(E.value.merged.value.description) ? (g(), s(i, { key: 1 }, [u(v(E.value.merged.value.description), 1)], 64)) : o("", !0)], 16)) : o("", !0),
+			E.value.merged.value.hideErrorMessage ? o("", !0) : (g(), s("p", m({ key: 1 }, E.value.errorMessageBind.value, { "aria-hidden": !E.value.showErrorMessageContent.value || void 0 }), [E.value.showErrorMessageContent.value ? (g(), s(i, { key: 0 }, [y(e)(y(T), "errorMessage") ? _(a.$slots, "errorMessage", {}, void 0, void 0, 0) : y(n)(E.value.merged.value.errorMessage) ? (g(), s(i, { key: 1 }, [u(v(E.value.merged.value.errorMessage), 1)], 64)) : o("", !0)], 64)) : o("", !0)], 16, C))
+		], 16, S));
 	}
 });
 //#endregion
-export { y as default };
+export { w as default };

package/dist/Components/FormControl/FormControlLabel.vue.d.ts

@@ -3,6 +3,16 @@ type __VLS_Props = {
     api: UseFormControlReturn;
     name: "endLabel" | "startLabel";
 };
-declare const __VLS_export: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare var __VLS_9: "endLabel" | "startLabel", __VLS_10: {};
+type __VLS_Slots = {} & {
+    [K in NonNullable<typeof __VLS_9>]?: (props: typeof __VLS_10) => any;
+};
+declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
 declare const _default: typeof __VLS_export;
 export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};