@bridge-ui/vue 0.0.7 → 0.0.8

package/dist/Components/Slider/composables/useSlider.js

@@ -0,0 +1,287 @@
+import { useBridgeUI as e } from "../../../Provider/useBridgeUI.js";
+import { mergePartBind as t, useBridgeUIComponent as n, useBridgeUIMergedRegistryClasses as r } from "../../../Utils/index.js";
+import { baseFieldBridgeKeys as i, useBaseField as a } from "../../BaseField/composables/useBaseField.js";
+import { computed as o, ref as s, toValue as ee, useAttrs as te, watch as ne } from "vue";
+import { cn as c, getSliderBarGeometry as re, getSliderPointerClientX as l, isSliderStopCovered as ie, mergeBridgeUILayeredClasses as u, normalizeSliderStops as ae, percentFromSliderPointer as d, percentToValue as f, pickClosestSliderThumb as oe, resolveSliderBounds as se, snapSliderValue as p, sortSliderRangeValue as ce, splitComponentProps as le, stepSliderValue as m, valueToPercent as h, writeSliderRangeThumb as g } from "@bridge-ui/core";
+import { get as _, omit as v, pick as y } from "es-toolkit/compat";
+import { colorProps as ue, invalidatedProps as de, roundedProps as fe, sizeProps as b } from "@bridge-ui/core/Tokens/Slider";
+//#region src/Components/Slider/composables/useSlider.ts
+var x = [
+	"max",
+	"min",
+	"step",
+	"color",
+	"range",
+	"stops",
+	"rounded",
+	"showStops",
+	"showTooltip",
+	"defaultValue"
+], pe = [...i, ...x];
+function S(e, t, n) {
+	return n && Array.isArray(e) ? e[t] : Array.isArray(e) ? e[0] : e;
+}
+function C(e, t, n, r) {
+	return !r || !Array.isArray(e) ? {
+		thumbIndex: t,
+		value: n
+	} : g(e, t, n);
+}
+function w(g, w, T, E = {}) {
+	let me = te(), he = e(), D = s(null), O = s(null), k = s(null), A = s(null), j = o(() => le({
+		bridgeKeys: pe,
+		props: {
+			...me,
+			...ee(g)
+		}
+	})), M = a(o(() => y(j.value.componentProps, i)), {
+		error: !1,
+		hideErrorMessage: !1,
+		size: w.size ?? "md"
+	}, {
+		componentName: "Slider",
+		labelHtmlFor: (e) => `${e}-thumb-0`
+	}), { merged: N, entry: P } = n({
+		libDefaults: w,
+		componentName: "Slider",
+		props: () => ({
+			...y(j.value.componentProps, x),
+			size: M.merged.value.size,
+			classes: j.value.componentProps.classes,
+			customProps: j.value.componentProps.customProps
+		})
+	}), F = o(() => N.value.customProps), I = r({
+		entry: P,
+		props: () => j.value.componentProps
+	}), L = o(() => se({
+		min: N.value.min,
+		max: N.value.max,
+		step: N.value.step
+	})), R = o(() => !!N.value.range), z = o(() => N.value.showTooltip !== !1), B = o(() => he?.global.value.direction === "rtl"), { controlId: V, isDisabled: H, isReadonly: U, invalidated: W, ariaDescribedBy: ge } = M, G = o(() => {
+		let e = T.value, t = L.value;
+		if (R.value) {
+			if (Array.isArray(e)) return ce(p(e[0], t.min, t.max, t.step), p(e[1], t.min, t.max, t.step));
+			let n = p(typeof e == "number" ? e : t.min, t.min, t.max, t.step);
+			return [n, n];
+		}
+		return p(Array.isArray(e) ? e[0] : typeof e == "number" ? e : t.min, t.min, t.max, t.step);
+	}), K = o(() => ae({
+		min: L.value.min,
+		max: L.value.max,
+		step: L.value.step,
+		stops: N.value.stops,
+		showStops: N.value.showStops
+	})), q = o(() => re({
+		range: R.value,
+		min: L.value.min,
+		max: L.value.max,
+		value: G.value
+	})), _e = o(() => _(u(ue, P.value?.tokens?.color), N.value.color ?? "primary")), J = o(() => u(de, P.value?.tokens?.invalidated, N.value.customProps?.invalidated)), Y = o(() => W.value ? J.value : _e.value), X = o(() => _(u(b, P.value?.tokens?.size), N.value.size ?? "md")), Z = o(() => _(u(fe, P.value?.tokens?.rounded), N.value.rounded ?? "full")), ve = o(() => K.value.some((e) => !!e.label)), Q = (e) => {
+		T.value = e, E.onChange?.(e);
+	}, ye = (e) => {
+		D.value &&= { thumbIndex: e }, O.value !== null && (O.value = e);
+	}, be = (e, t) => {
+		if (H.value || U.value) return;
+		let n = L.value, r = f(t, n.min, n.max, n.step), i = C(G.value, e, r, R.value);
+		i.thumbIndex !== e && ye(i.thumbIndex), Q(i.value);
+	}, $ = (e, t) => {
+		H.value || U.value || (e.preventDefault(), D.value = { thumbIndex: t }, O.value = t);
+	}, xe = (e) => {
+		if (H.value || U.value || e.target.closest("[data-bridge-slider-thumb]")) return;
+		let t = A.value?.getBoundingClientRect();
+		if (!t) return;
+		let n = d({
+			rect: t,
+			isRtl: B.value,
+			clientX: l(e)
+		}), r = L.value, i = f(n, r.min, r.max, r.step), a = 0, o = G.value;
+		R.value && Array.isArray(o) && (a = oe(i, o[0], o[1]));
+		let s = C(o, a, i, R.value);
+		Q(s.value), $(e, s.thumbIndex);
+	}, Se = (e) => (t) => {
+		$(t, e);
+	}, Ce = (e) => (t) => {
+		if (H.value || U.value) return;
+		let n = L.value, r = S(G.value, e, R.value), i = null, a = B.value;
+		switch (t.key) {
+			case "ArrowRight":
+				i = m(r, a ? -1 : 1, n.min, n.max, n.step);
+				break;
+			case "ArrowLeft":
+				i = m(r, a ? 1 : -1, n.min, n.max, n.step);
+				break;
+			case "ArrowUp":
+				i = m(r, 1, n.min, n.max, n.step);
+				break;
+			case "ArrowDown":
+				i = m(r, -1, n.min, n.max, n.step);
+				break;
+			case "Home":
+				i = n.min;
+				break;
+			case "End":
+				i = n.max;
+				break;
+			case "PageUp":
+				i = m(r, 1, n.min, n.max, n.step * 10);
+				break;
+			case "PageDown":
+				i = m(r, -1, n.min, n.max, n.step * 10);
+				break;
+			default: break;
+		}
+		if (i === null) return;
+		t.preventDefault();
+		let o = C(G.value, e, i, R.value);
+		Q(o.value), o.thumbIndex !== e && document.getElementById(`${V.value}-thumb-${o.thumbIndex}`)?.focus();
+	};
+	ne(O, (e, t, n) => {
+		if (e === null) return;
+		let r = (e) => {
+			let t = A.value?.getBoundingClientRect();
+			if (!t || D.value === null) return;
+			let n = d({
+				rect: t,
+				isRtl: B.value,
+				clientX: l(e)
+			});
+			be(D.value.thumbIndex, n);
+		}, i = () => {
+			D.value = null, O.value = null;
+		};
+		window.addEventListener("pointermove", r), window.addEventListener("pointerup", i), window.addEventListener("pointercancel", i), n(() => {
+			window.removeEventListener("pointermove", r), window.removeEventListener("pointerup", i), window.removeEventListener("pointercancel", i);
+		});
+	});
+	let we = o(() => t({}, {}, c({
+		"relative w-full min-w-0 flex-1": !0,
+		"mb-6": ve.value
+	}))), Te = o(() => t({
+		...v(F.value?.track ?? {}, ["style"]),
+		onPointerdown: xe
+	}, {}, c({
+		"relative w-full select-none touch-none": !0,
+		"cursor-pointer": !H.value && !U.value,
+		"cursor-not-allowed": H.value,
+		[X.value?.track ?? ""]: !0,
+		[Z.value ?? ""]: !0,
+		[Y.value?.track ?? ""]: !0,
+		[I.value.track ?? ""]: !0
+	})));
+	return {
+		bounds: L,
+		merged: N,
+		barBind: o(() => t(v(F.value?.bar ?? {}, ["style"]), {
+			"aria-hidden": !0,
+			style: {
+				width: q.value.width,
+				insetInlineStart: q.value.start
+			}
+		}, c({
+			"absolute top-0 h-full": !0,
+			[Z.value ?? ""]: !0,
+			[Y.value?.bar ?? ""]: !0,
+			[I.value.bar ?? ""]: !0
+		}))),
+		isRange: R,
+		trackRef: A,
+		baseField: M,
+		trackBind: Te,
+		controlBind: we,
+		showTooltip: z,
+		getStopBind: (e) => {
+			let n = h(e.value, L.value.min, L.value.max), r = ie({
+				range: R.value,
+				min: L.value.min,
+				max: L.value.max,
+				stopValue: e.value,
+				value: G.value
+			});
+			return t(v(F.value?.stop ?? {}, ["style"]), {
+				"aria-hidden": !0,
+				style: {
+					insetInlineStart: `${n}%`,
+					display: r ? "none" : void 0
+				}
+			}, c({
+				"absolute top-1/2 h-2 w-2 -translate-x-1/2 -translate-y-1/2 rounded-full bg-white dark:bg-gray-400": !0,
+				[I.value.stop ?? ""]: !0
+			}));
+		},
+		thumbIndexes: o(() => R.value ? [0, 1] : [0]),
+		getThumbBind: (e) => {
+			let n = S(G.value, e, R.value), r = h(n, L.value.min, L.value.max), i = O.value === e;
+			return t({
+				...v(F.value?.thumb ?? {}, ["style"]),
+				role: "slider",
+				type: "button",
+				"aria-valuenow": n,
+				"aria-valuemin": L.value.min,
+				"aria-valuemax": L.value.max,
+				tabIndex: H.value ? -1 : 0,
+				"data-bridge-slider-thumb": e,
+				disabled: H.value || void 0,
+				"aria-orientation": "horizontal",
+				"aria-describedby": ge.value,
+				onKeydown: Ce(e),
+				id: `${V.value}-thumb-${e}`,
+				"aria-disabled": H.value || void 0,
+				"aria-readonly": U.value || void 0,
+				"aria-invalid": W.value || void 0,
+				onPointerdown: Se(e),
+				style: { insetInlineStart: `${r}%` },
+				onFocus: () => {
+					k.value = e;
+				},
+				onPointerenter: () => {
+					k.value = e;
+				},
+				onBlur: () => {
+					O.value !== e && (k.value = k.value === e ? null : k.value);
+				},
+				onPointerleave: () => {
+					O.value !== e && (k.value = k.value === e ? null : k.value);
+				},
+				"aria-label": F.value?.thumb?.["aria-label"] ?? (R.value ? e === 0 ? "Minimum" : "Maximum" : M.merged.value.label || "Slider")
+			}, {}, c({
+				"absolute z-10 flex -translate-x-1/2 items-center justify-center bg-transparent leading-none outline-none": !0,
+				"cursor-grab": !H.value && !U.value,
+				"cursor-grabbing": i,
+				"cursor-not-allowed": H.value,
+				"focus-visible:ring-2 focus-visible:ring-offset-2": !0,
+				[Y.value?.focus ?? ""]: !0,
+				[X.value?.thumb ?? ""]: !0,
+				[I.value.thumb ?? ""]: !0
+			}));
+		},
+		resolvedStops: K,
+		resolvedValue: G,
+		isTooltipOpen: (e) => z.value && (O.value === e || k.value === e),
+		getStopLabelBind: (e) => {
+			let n = h(e.value, L.value.min, L.value.max);
+			return t(v(F.value?.stopLabel ?? {}, ["style"]), {
+				"aria-hidden": !0,
+				style: { insetInlineStart: `${n}%` }
+			}, c({
+				"absolute mt-5 -translate-x-1/2 text-xs whitespace-nowrap": !0,
+				"text-gray-700 dark:text-gray-400": !W.value,
+				[J.value.stopLabel ?? ""]: W.value,
+				[I.value.stopLabel ?? ""]: !0
+			}));
+		},
+		getThumbKnobBind: (e) => {
+			let n = O.value === e;
+			return t(F.value?.thumbKnob, { "aria-hidden": !0 }, c({
+				"block rounded-full border-2 shadow-sm transition-transform duration-100": !0,
+				"scale-120": n,
+				[X.value?.thumbKnob ?? ""]: !0,
+				[Y.value?.thumb ?? ""]: !0,
+				[I.value.thumbKnob ?? ""]: !0
+			}));
+		},
+		tooltipProps: o(() => F.value?.tooltip),
+		readThumbValue: (e) => S(G.value, e, R.value)
+	};
+}
+//#endregion
+export { w as useSlider };

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

@@ -0,0 +1,4 @@
+export { useSlider } from './composables/useSlider';
+export type { UseSliderOptions, UseSliderReturn, } from './composables/useSlider';
+export type { SliderClasses, SliderColorOverrides, SliderCustomProps, SliderEmits, SliderOwnProps, SliderProps, SliderRangeValue, SliderRoundedOverrides, SliderSizeOverrides, SliderSlots, SliderStop, SliderStopInput, } from './slider.types';
+export { default as Slider } from './Slider.vue';

package/dist/Components/Slider/index.js

@@ -0,0 +1,3 @@
+import { useSlider as e } from "./composables/useSlider.js";
+import t from "./Slider.js";
+export { t as Slider, e as useSlider };

package/dist/Components/Slider/slider.types.d.ts

@@ -0,0 +1,169 @@
+import { ButtonHTMLAttributes, HTMLAttributes, Slot } from 'vue';
+import { BaseFieldInvalidated, MergeHtmlProps, MergeProps, SliderColor, SliderInvalidated, SliderRangeValue, SliderRounded, SliderStopInput } from '@bridge-ui/core';
+import { BaseFieldClasses, BaseFieldCustomProps, BaseFieldOwnProps, BaseFieldSlots } from '../BaseField/baseField.types';
+import { TooltipOwnProps } from '../Tooltip/tooltip.types';
+export type { SliderRangeValue, SliderStop, SliderStopInput, } from '@bridge-ui/core';
+export interface SliderSizeOverrides {}
+export interface SliderColorOverrides {}
+export interface SliderRoundedOverrides {}
+export interface SliderClasses extends BaseFieldClasses {
+    /**
+     * Classes for the filled bar.
+     */
+    bar?: string;
+    /**
+     * Classes for stop markers.
+     */
+    stop?: string;
+    /**
+     * Classes for stop labels.
+     */
+    stopLabel?: string;
+    /**
+     * Classes for thumb hit-area wrappers.
+     */
+    thumb?: string;
+    /**
+     * Classes for the visible thumb knob.
+     */
+    thumbKnob?: string;
+    /**
+     * Classes for the track.
+     */
+    track?: string;
+}
+export interface SliderCustomProps extends Omit<BaseFieldCustomProps, "invalidated"> {
+    /**
+     * Props forwarded to the filled bar.
+     */
+    bar?: HTMLAttributes;
+    /**
+     * Control error chrome (`bar`, `thumb`, `track`, …). Error message color comes
+     * from {@link BaseField}; pass `errorMessage` here to override.
+     *
+     * @default undefined
+     */
+    invalidated?: Partial<SliderInvalidated & BaseFieldInvalidated>;
+    /**
+     * Props forwarded to stop markers.
+     */
+    stop?: HTMLAttributes;
+    /**
+     * Props forwarded to stop labels.
+     */
+    stopLabel?: HTMLAttributes;
+    /**
+     * Props forwarded to thumb hit-area buttons.
+     */
+    thumb?: Partial<ButtonHTMLAttributes>;
+    /**
+     * Props forwarded to the visible thumb knob.
+     */
+    thumbKnob?: HTMLAttributes;
+    /**
+     * Props forwarded to each value `Tooltip` (`content` is owned by the slider).
+     */
+    tooltip?: Partial<Omit<TooltipOwnProps, "slots" | "content" | "anchorEl" | "modelValue">>;
+    /**
+     * Props forwarded to the track element.
+     */
+    track?: HTMLAttributes;
+}
+export interface SliderEmits {
+    /**
+     * Emitted when the slider value changes.
+     * Listen with `@change` / `v-on:change`.
+     */
+    change: [value: number | SliderRangeValue];
+    /**
+     * Emitted when `v-model` should update.
+     */
+    "update:modelValue": [value: number | SliderRangeValue];
+}
+export interface SliderOwnProps extends Omit<BaseFieldOwnProps, "field" | "slots" | "classes" | "children" | "customProps"> {
+    /**
+     * Classes for the field chrome and the slider control.
+     *
+     * @default undefined
+     */
+    classes?: SliderClasses;
+    /**
+     * The color to apply to the slider bar and thumbs.
+     *
+     * @default "primary"
+     */
+    color?: MergeProps<SliderColor, SliderColorOverrides>;
+    /**
+     * Extra props for internal parts (`track`, `thumb`, `tooltip`, …).
+     *
+     * @default undefined
+     */
+    customProps?: SliderCustomProps;
+    /**
+     * Uncontrolled initial value. Use a tuple when `range` is enabled.
+     *
+     * @default min (or `[min, min]` when `range`)
+     */
+    defaultValue?: number | SliderRangeValue;
+    /**
+     * Maximum value of the slider.
+     *
+     * @default 100
+     */
+    max?: number;
+    /**
+     * Minimum value of the slider.
+     *
+     * @default 0
+     */
+    min?: number;
+    /**
+     * When `true`, the slider selects a range with two thumbs.
+     *
+     * @default false
+     */
+    range?: boolean;
+    /**
+     * The roundedness of the track and bar.
+     *
+     * @default "full"
+     */
+    rounded?: MergeProps<SliderRounded, SliderRoundedOverrides>;
+    /**
+     * When `true`, renders stop marks (from `stops`, or every `step` when
+     * `stops` is empty).
+     *
+     * @default false
+     */
+    showStops?: boolean;
+    /**
+     * When `true`, shows a Tooltip with the current value on each thumb.
+     *
+     * @default true
+     */
+    showTooltip?: boolean;
+    /**
+     * Step increment between values.
+     *
+     * @default 1
+     */
+    step?: number;
+    /**
+     * Custom stop marks. Numbers are treated as `{ value }`.
+     *
+     * @default undefined
+     */
+    stops?: readonly SliderStopInput[];
+}
+export interface SliderSlots extends BaseFieldSlots {
+    /**
+     * Optional custom thumb content (replaces the default knob).
+     */
+    thumb?: Slot;
+}
+export type SliderProps = MergeHtmlProps<SliderOwnProps, Omit<HTMLAttributes, "color" | "defaultValue">> & {
+    /**
+     * Bound with `v-model` on the component (`defineModel` internally).
+     */
+    modelValue?: number | SliderRangeValue;
+};

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

@@ -6,13 +6,13 @@ type __VLS_ModelProps = {
 };
 type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
 declare const __VLS_base: import('vue').DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
-    "update:modelValue": (value: boolean) => any;
     close: () => any;
+    "update:modelValue": (value: boolean) => any;
     "show-change": (show: boolean) => any;
     "leave-complete": () => any;
 }, string, import('vue').PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
-    "onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
     onClose?: (() => any) | undefined;
+    "onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
     "onShow-change"?: ((show: boolean) => any) | undefined;
     "onLeave-complete"?: (() => any) | undefined;
 }>, {

package/dist/Components/Switch/composables/useSwitch.d.ts

@@ -243,7 +243,7 @@ export declare function useSwitch(props: MaybeRefOrGetter<SwitchOwnProps>, libDe
             hideErrorMessage: NonNullable<boolean | undefined>;
         }>;
         rowBind: import('vue').ComputedRef<import('@bridge-ui/core').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, {}>>;
-        rootBind: import('vue').ComputedRef<import('@bridge-ui/core').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, Partial<Omit<Omit<import('../../FormControl').FormControlOwnProps, "field">, "error" | "size" | "classes" | "customProps" | "disabled" | "required" | "controlId" | "description" | "endLabel" | "errorMessage" | "hideErrorMessage" | "readonly" | "startLabel">>>>;
+        rootBind: import('vue').ComputedRef<import('@bridge-ui/core').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, Partial<Omit<Omit<import('../../FormControl').FormControlOwnProps, "field">, "error" | "size" | "classes" | "customProps" | "disabled" | "required" | "description" | "errorMessage" | "controlId" | "hideErrorMessage" | "readonly" | "endLabel" | "startLabel">>>>;
         controlId: import('vue').ComputedRef<string>;
         isDisabled: import('vue').ComputedRef<boolean>;
         isReadonly: import('vue').ComputedRef<boolean>;

package/dist/Components/Switch/composables/useSwitch.js

@@ -21,7 +21,7 @@ function _(_, v, y) {
 		error: !1,
 		hideErrorMessage: !1,
 		size: v.size ?? "sm"
-	}), S = i(() => l({
+	}, { componentName: "Switch" }), S = i(() => l({
 		bridgeKeys: g,
 		props: {
 			...b,

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

@@ -6,11 +6,11 @@ type __VLS_ModelProps = {
 };
 type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
 declare const __VLS_base: import('vue').DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
-    "update:modelValue": (...args: unknown[]) => any;
     change: (value: string) => any;
+    "update:modelValue": (...args: unknown[]) => any;
 }, string, import('vue').PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
-    "onUpdate:modelValue"?: ((...args: unknown[]) => any) | undefined;
     onChange?: ((value: string) => any) | undefined;
+    "onUpdate:modelValue"?: ((...args: unknown[]) => any) | undefined;
 }>, {
     keepMounted: boolean;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;

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" | "endIcon" | "startIcon" | "start" | "required" | "description" | "errorMessage" | "hideErrorMessage" | "readonly" | "errorIcon" | "showErrorIcon" | "corner">>>>;
+        }, 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">>>>;
         isNotched: import('vue').ComputedRef<boolean>;
         isStacked: import('vue').ComputedRef<boolean>;
         startBind: import('vue').ComputedRef<import('@bridge-ui/core').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, {}>>;
@@ -675,5 +675,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" | "endIcon" | "startIcon" | "start" | "required" | "description" | "errorMessage" | "hideErrorMessage" | "readonly" | "errorIcon" | "showErrorIcon" | "corner">>>>;
+    }, 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">>>>;
 };

package/dist/Components/TextField/composables/useTextField.js

@@ -14,7 +14,7 @@ function n(n) {
 		color: "primary",
 		variant: "outline",
 		showErrorIcon: !0
-	});
+	}, { componentName: "TextField" });
 	return {
 		formField: i,
 		inputBind: i.inputBind

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" | "endIcon" | "startIcon" | "start" | "required" | "description" | "errorMessage" | "hideErrorMessage" | "readonly" | "errorIcon" | "showErrorIcon" | "corner">>>>;
+        }, 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">>>>;
         isNotched: import('vue').ComputedRef<boolean>;
         isStacked: import('vue').ComputedRef<boolean>;
         startBind: import('vue').ComputedRef<import('@bridge-ui/core').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, {}>>;
@@ -677,7 +677,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" | "endIcon" | "startIcon" | "start" | "required" | "description" | "errorMessage" | "hideErrorMessage" | "readonly" | "errorIcon" | "showErrorIcon" | "corner">>>, {
+    }, 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">>>, {
         rows?: string | number | undefined;
         onInput?: ((event: Event) => void) | undefined;
     }>>;

package/dist/Components/Textarea/composables/useTextarea.js

@@ -39,6 +39,7 @@ function h(h, g) {
 		variant: "outline",
 		showErrorIcon: !0
 	}, {
+		componentName: "Textarea",
 		control: () => "textarea",
 		likeInput: () => S.value
 	}), E = i(() => C.value ? "none" : b.value.resize ?? "none"), D = i(() => d(u(m, y.value?.tokens?.resize), E.value ?? "none")), O = i(() => _.onInput), k = (e) => {

package/dist/Utils/index.d.ts

@@ -4,7 +4,7 @@ import { FormFieldSize } from '@bridge-ui/core/Tokens/FormField';
 import { IconSize } from '@bridge-ui/core/Tokens/Icon';
 import { useBridgeUI } from '../Provider/useBridgeUI';
 type RegistryEntryFor<K extends keyof BridgeUIComponentsConfig> = NonNullable<BridgeUIComponentsConfig[K]>;
-export type UseBridgeUIComponentReturn<P extends object, K extends keyof BridgeUIComponentsConfig> = {
+export type UseBridgeUIComponentReturn<P extends object, K extends keyof BridgeUIComponentsConfig = keyof BridgeUIComponentsConfig> = {
     bridge: ReturnType<typeof useBridgeUI>;
     components: ComputedRef<null | BridgeUIComponentsConfig>;
     entry: ComputedRef<undefined | RegistryEntryFor<K>>;
@@ -28,8 +28,8 @@ export declare const mergeNestedComponentProps: <P extends {
 /**
  * Registry entry + props merged with Bridge defaults for a named component.
  */
-export declare function useBridgeUIComponent<P extends object, K extends keyof BridgeUIComponentsConfig>({ props, libDefaults, componentName, }: {
-    componentName: K;
+export declare function useBridgeUIComponent<P extends object, K extends keyof BridgeUIComponentsConfig = keyof BridgeUIComponentsConfig>({ props, libDefaults, componentName, }: {
+    componentName?: K;
     libDefaults?: Partial<P>;
     props: MaybeRefOrGetter<Partial<P>>;
 }): UseBridgeUIComponentReturn<P, K>;

package/dist/Utils/index.js

@@ -19,13 +19,16 @@ var y = p("class"), b = f(y);
 function x({ props: t, libDefaults: n, componentName: r }) {
 	let i = e(), a = c(() => h(i) ? null : d(i.components));
 	return {
-		entry: c(() => m(a.value, r)),
+		entry: c(() => {
+			if (r) return m(a.value, r);
+		}),
 		bridge: i,
 		merged: c(() => _({
 			libDefaults: n,
 			componentName: r,
 			props: u(t),
-			components: a.value
+			components: a.value,
+			formDefaults: i?.global.value.formDefaults
 		})),
 		components: a
 	};