@bridge-ui/vue 0.3.0 → 0.5.0

package/dist/Components/Sidebar/composables/useSidebarTrigger.d.ts

@@ -0,0 +1,10 @@
+import { useSlots } from 'vue';
+export declare function useSidebarTrigger(slots: ReturnType<typeof useSlots>): {
+    expanded: import('vue').ComputedRef<boolean>;
+    iconClass: import('vue').ComputedRef<"rotate-180 rtl:rotate-0" | "rtl:rotate-180">;
+    ariaLabel: import('vue').ComputedRef<string>;
+    handleClick: (event: MouseEvent) => void;
+    hasDefaultSlot: import('vue').ComputedRef<boolean>;
+    attrs: import('vue').ComputedRef<Omit<import('vue').Attrs, "onClick" | "aria-label">>;
+    panelId: import('vue').ComputedRef<string>;
+};

package/dist/Components/Sidebar/composables/useSidebarTrigger.js

@@ -0,0 +1,25 @@
+import { hasNamedSlot as e } from "../../../Utils/slotOrProp.js";
+import { useSidebar as t } from "./useSidebar.js";
+import { computed as n, useAttrs as r } from "vue";
+import { omit as i } from "es-toolkit/compat";
+//#region src/Components/Sidebar/composables/useSidebarTrigger.ts
+function a(a) {
+	let o = t(), s = r(), c = n(() => e(a, "default"));
+	return {
+		expanded: n(() => o.value.isMobile ? o.value.openMobile : o.value.open),
+		iconClass: n(() => o.value.side === "right" ? "rotate-180 rtl:rotate-0" : "rtl:rotate-180"),
+		ariaLabel: n(() => {
+			let e = s["aria-label"];
+			return typeof e == "string" ? e : "Toggle sidebar";
+		}),
+		handleClick: (e) => {
+			let t = s.onClick;
+			typeof t == "function" && t(e), !e.defaultPrevented && o.value.toggleSidebar();
+		},
+		hasDefaultSlot: c,
+		attrs: n(() => i(s, ["onClick", "aria-label"])),
+		panelId: n(() => o.value.panelId)
+	};
+}
+//#endregion
+export { a as useSidebarTrigger };

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

@@ -0,0 +1,15 @@
+export { useSidebar } from './composables/useSidebar';
+export { useSidebarInset } from './composables/useSidebarInset';
+export { useSidebarList } from './composables/useSidebarList';
+export { useSidebarListItem } from './composables/useSidebarListItem';
+export { useSidebarProvider } from './composables/useSidebarProvider';
+export { useSidebarShell } from './composables/useSidebarShell';
+export { useSidebarTrigger } from './composables/useSidebarTrigger';
+export type { SidebarClasses, SidebarCollapsibleOverrides, SidebarCustomProps, SidebarInsetClasses, SidebarInsetCustomProps, SidebarInsetOwnProps, SidebarInsetProps, SidebarInsetSlots, SidebarListItemOwnProps, SidebarListItemProps, SidebarListOwnProps, SidebarListProps, SidebarOwnProps, SidebarProps, SidebarProviderClasses, SidebarProviderCustomProps, SidebarProviderEmits, SidebarProviderOwnProps, SidebarProviderProps, SidebarProviderSlots, SidebarSideOverrides, SidebarSlots, SidebarTriggerOwnProps, SidebarTriggerProps, SidebarTriggerSlots, SidebarVariantOverrides, } from './sidebar.types';
+export { default as Sidebar } from './Sidebar.vue';
+export { SIDEBAR_INJECTION_KEY, type SidebarContextValue, type SidebarLayout, } from './sidebarInjectionKey';
+export { default as SidebarInset } from './SidebarInset.vue';
+export { default as SidebarList } from './SidebarList.vue';
+export { default as SidebarListItem } from './SidebarListItem.vue';
+export { default as SidebarProvider } from './SidebarProvider.vue';
+export { default as SidebarTrigger } from './SidebarTrigger.vue';

package/dist/Components/Sidebar/index.js

@@ -0,0 +1,15 @@
+import { SIDEBAR_INJECTION_KEY as e } from "./sidebarInjectionKey.js";
+import { useSidebar as t } from "./composables/useSidebar.js";
+import { useSidebarInset as n } from "./composables/useSidebarInset.js";
+import { useSidebarList as r } from "./composables/useSidebarList.js";
+import { useSidebarListItem as i } from "./composables/useSidebarListItem.js";
+import { useSidebarProvider as a } from "./composables/useSidebarProvider.js";
+import { useSidebarShell as o } from "./composables/useSidebarShell.js";
+import { useSidebarTrigger as s } from "./composables/useSidebarTrigger.js";
+import c from "./Sidebar.js";
+import l from "./SidebarInset.js";
+import u from "./SidebarList.js";
+import d from "./SidebarListItem.js";
+import f from "./SidebarProvider.js";
+import p from "./SidebarTrigger.js";
+export { e as SIDEBAR_INJECTION_KEY, c as Sidebar, l as SidebarInset, u as SidebarList, d as SidebarListItem, f as SidebarProvider, p as SidebarTrigger, t as useSidebar, n as useSidebarInset, r as useSidebarList, i as useSidebarListItem, a as useSidebarProvider, o as useSidebarShell, s as useSidebarTrigger };

package/dist/Components/Sidebar/sidebar.types.d.ts

@@ -0,0 +1,244 @@
+import { ButtonHTMLAttributes, HTMLAttributes, Slot } from 'vue';
+import { PositionPlacement } from '@bridge-ui/core/Runtime';
+import { SidebarCollapsible, SidebarSide, SidebarVariant } from '@bridge-ui/core/Tokens';
+import { MergeHtmlProps, MergeProps } from '@bridge-ui/core/Utils';
+import { ListProps } from '../List/list.types';
+import { ListItemProps } from '../ListItem/listItem.types';
+export interface SidebarSideOverrides {}
+export interface SidebarVariantOverrides {}
+export interface SidebarCollapsibleOverrides {}
+export interface SidebarClasses {
+    /**
+     * The classes to apply to the scrollable content region.
+     */
+    content?: string;
+    /**
+     * The classes to apply to the footer.
+     */
+    footer?: string;
+    /**
+     * The classes to apply to the in-flow gap spacer.
+     */
+    gap?: string;
+    /**
+     * The classes to apply to the header.
+     */
+    header?: string;
+    /**
+     * The classes to apply to the inner panel surface.
+     */
+    panel?: string;
+    /**
+     * The classes to apply to the desktop rail chrome (gap + fixed panel).
+     */
+    root?: string;
+}
+export interface SidebarCustomProps {
+    /**
+     * Props forwarded to the scrollable content region.
+     */
+    content?: HTMLAttributes;
+    /**
+     * Props forwarded to the footer.
+     */
+    footer?: HTMLAttributes;
+    /**
+     * Props forwarded to the in-flow gap spacer.
+     */
+    gap?: HTMLAttributes;
+    /**
+     * Props forwarded to the header.
+     */
+    header?: HTMLAttributes;
+    /**
+     * Props forwarded to the inner panel surface.
+     */
+    panel?: HTMLAttributes;
+    /**
+     * Props forwarded to the desktop rail chrome.
+     */
+    root?: HTMLAttributes;
+}
+export interface SidebarInsetClasses {
+    /**
+     * The classes to apply to the inset root.
+     */
+    root?: string;
+}
+export interface SidebarInsetCustomProps {
+    /**
+     * Props forwarded to the inset root.
+     */
+    root?: HTMLAttributes;
+}
+export interface SidebarInsetOwnProps {
+    /**
+     * The classes to apply to the inset.
+     *
+     * @default undefined
+     */
+    classes?: SidebarInsetClasses;
+    /**
+     * Extra props for internal parts.
+     *
+     * @default undefined
+     */
+    customProps?: SidebarInsetCustomProps;
+}
+export interface SidebarInsetSlots {
+    /**
+     * Main content.
+     */
+    default?: Slot;
+}
+export interface SidebarListItemOwnProps {
+    /**
+     * Tooltip label while the icon rail is collapsed. When omitted, string
+     * `primary` is used. Has no effect on the mobile drawer or an expanded rail.
+     *
+     * @default undefined
+     */
+    tooltip?: string;
+    /**
+     * Placement of {@link SidebarListItemOwnProps.tooltip}. Defaults to the
+     * side opposite the rail.
+     *
+     * @default undefined
+     */
+    tooltipPlacement?: PositionPlacement;
+}
+export interface SidebarListOwnProps {
+    /**
+     * Collapse items to leading icons. Defaults to the collapsed icon rail.
+     * Nested `SidebarList` is hidden. `ListSection` labels are hidden.
+     *
+     * @default undefined
+     */
+    iconOnly?: boolean;
+}
+/**
+ * Persistent app-shell sidebar panel. Mount under `SidebarProvider` with
+ * `SidebarInset`. Put `SidebarList` / `Accordion` in the default slot.
+ */
+export interface SidebarOwnProps {
+    /**
+     * Accessible name for the desktop `aside` and the mobile drawer.
+     *
+     * @default "Sidebar"
+     */
+    ariaLabel?: string;
+    /**
+     * The classes to apply to the sidebar.
+     *
+     * @default undefined
+     */
+    classes?: SidebarClasses;
+    /**
+     * How the desktop rail hides.
+     *
+     * @default "offcanvas"
+     */
+    collapsible?: MergeProps<SidebarCollapsible, SidebarCollapsibleOverrides>;
+    /**
+     * Extra props for internal parts (`header`, `content`, `footer`, etc.).
+     * Root HTML attributes stay on the component top level.
+     *
+     * @default undefined
+     */
+    customProps?: SidebarCustomProps;
+    /**
+     * Which edge the rail docks to.
+     *
+     * @default "left"
+     */
+    side?: MergeProps<SidebarSide, SidebarSideOverrides>;
+    /**
+     * Visual layout of the rail and inset.
+     *
+     * @default "sidebar"
+     */
+    variant?: MergeProps<SidebarVariant, SidebarVariantOverrides>;
+}
+export interface SidebarProviderClasses {
+    /**
+     * The classes to apply to the layout wrapper.
+     */
+    root?: string;
+}
+export interface SidebarProviderCustomProps {
+    /**
+     * Props forwarded to the layout wrapper.
+     */
+    root?: HTMLAttributes;
+}
+export interface SidebarProviderEmits {
+    /**
+     * Emitted when the desktop `open` state should change.
+     */
+    openChange: [open: boolean];
+    /**
+     * Emitted when `v-model` should update.
+     */
+    "update:modelValue": [open: boolean];
+}
+export interface SidebarProviderOwnProps {
+    /**
+     * The classes to apply to the provider wrapper.
+     *
+     * @default undefined
+     */
+    classes?: SidebarProviderClasses;
+    /**
+     * Extra props for the layout wrapper.
+     *
+     * @default undefined
+     */
+    customProps?: SidebarProviderCustomProps;
+    /**
+     * Initial desktop expanded state when `v-model` is omitted.
+     *
+     * @default true
+     */
+    defaultOpen?: boolean;
+}
+export interface SidebarProviderSlots {
+    /**
+     * App shell (`Sidebar`, `SidebarInset`, …).
+     */
+    default?: Slot;
+}
+export interface SidebarSlots {
+    /**
+     * Scrollable rail (`List`, `Accordion`, …).
+     */
+    default?: Slot;
+    /**
+     * Sticky footer (user menu, settings).
+     */
+    footer?: Slot;
+    /**
+     * Sticky header (branding, workspace switcher).
+     */
+    header?: Slot;
+}
+export interface SidebarTriggerOwnProps {}
+export interface SidebarTriggerSlots {
+    /**
+     * Replaces the default toggle icon.
+     */
+    default?: Slot;
+}
+export type SidebarInsetProps = MergeHtmlProps<SidebarInsetOwnProps, HTMLAttributes>;
+export type SidebarProps = MergeHtmlProps<SidebarOwnProps, HTMLAttributes>;
+export type SidebarProviderProps = MergeHtmlProps<SidebarProviderOwnProps, HTMLAttributes>;
+export type SidebarTriggerProps = MergeHtmlProps<SidebarTriggerOwnProps, ButtonHTMLAttributes>;
+/**
+ * `List` bound to the nearest `Sidebar`. Sets `iconOnly` when the icon rail
+ * is collapsed on desktop.
+ */
+export type SidebarListProps = ListProps & SidebarListOwnProps;
+/**
+ * `ListItem` bound to the nearest `Sidebar`. Shows `primary` in a tooltip
+ * when the icon rail is collapsed.
+ */
+export type SidebarListItemProps = ListItemProps & SidebarListItemOwnProps;

package/dist/Components/Sidebar/sidebarInjectionKey.d.ts

@@ -0,0 +1,80 @@
+import { ComputedRef, InjectionKey } from 'vue';
+import { SidebarState } from '@bridge-ui/core/Domain';
+import { SidebarCollapsible, SidebarSide, SidebarVariant } from '@bridge-ui/core/Tokens';
+/**
+ * Layout fields registered by `Sidebar` for inset / trigger consumers.
+ */
+export type SidebarLayout = {
+    /**
+     * Desktop collapse mode.
+     */
+    collapsible: keyof SidebarCollapsible;
+    /**
+     * Id of the visible panel (`aria-controls`).
+     */
+    panelId: string;
+    /**
+     * Dock edge.
+     */
+    side: keyof SidebarSide;
+    /**
+     * Visual variant.
+     */
+    variant: keyof SidebarVariant;
+};
+/**
+ * Shared sidebar state for `Sidebar`, `SidebarInset`, and `SidebarTrigger`.
+ */
+export type SidebarContextValue = {
+    /**
+     * Desktop collapse mode from the nearest `Sidebar`.
+     */
+    collapsible: keyof SidebarCollapsible;
+    /**
+     * Whether the viewport is below the mobile breakpoint.
+     */
+    isMobile: boolean;
+    /**
+     * Desktop expanded state.
+     */
+    open: boolean;
+    /**
+     * Mobile drawer visibility.
+     */
+    openMobile: boolean;
+    /**
+     * Id of the visible panel for `aria-controls`.
+     */
+    panelId: string;
+    /**
+     * Sets layout fields from the `Sidebar` panel.
+     *
+     * @internal
+     */
+    setLayout: (layout: Partial<SidebarLayout>) => void;
+    /**
+     * Sets the desktop expanded state.
+     */
+    setOpen: (open: boolean) => void;
+    /**
+     * Sets the mobile drawer visibility.
+     */
+    setOpenMobile: (open: boolean) => void;
+    /**
+     * Dock edge from the nearest `Sidebar`.
+     */
+    side: keyof SidebarSide;
+    /**
+     * Desktop visual state (`expanded` / `collapsed`).
+     */
+    state: SidebarState;
+    /**
+     * Toggles desktop `open` or mobile `openMobile` based on viewport.
+     */
+    toggleSidebar: () => void;
+    /**
+     * Visual variant from the nearest `Sidebar`.
+     */
+    variant: keyof SidebarVariant;
+};
+export declare const SIDEBAR_INJECTION_KEY: InjectionKey<ComputedRef<SidebarContextValue>>;

package/dist/Components/Sidebar/sidebarInjectionKey.js

@@ -0,0 +1,4 @@
+//#region src/Components/Sidebar/sidebarInjectionKey.ts
+var e = Symbol("bridge-sidebar");
+//#endregion
+export { e as SIDEBAR_INJECTION_KEY };

package/dist/Components/Sidebar/sidebarListInjectionKey.d.ts

@@ -0,0 +1,5 @@
+import { ComputedRef, InjectionKey } from 'vue';
+export type SidebarListContextValue = {
+    iconOnly: boolean;
+};
+export declare const SIDEBAR_LIST_INJECTION_KEY: InjectionKey<ComputedRef<SidebarListContextValue>>;

package/dist/Components/Sidebar/sidebarListInjectionKey.js

@@ -0,0 +1,4 @@
+//#region src/Components/Sidebar/sidebarListInjectionKey.ts
+var e = Symbol("bridge-sidebar-list");
+//#endregion
+export { e as SIDEBAR_LIST_INJECTION_KEY };

package/dist/Components/Slider/Slider.vue_vue_type_script_setup_true_lang.js

@@ -1,13 +1,13 @@
 import { presentSlotNames as e } from "../../Utils/slotOrProp.js";
-import { BASE_FIELD_CHROME_SLOT_NAMES as t } from "../BaseField/baseField.types.js";
-import n from "../BaseField/BaseField.js";
-import { useSlider as r } from "./composables/useSlider.js";
+import { useOptionalModel as t } from "../../Utils/useOptionalModel.js";
+import { BASE_FIELD_CHROME_SLOT_NAMES as n } from "../BaseField/baseField.types.js";
+import r from "../BaseField/BaseField.js";
 import i from "../Tooltip/Tooltip.js";
-import { Fragment as a, computed as o, createBlock as s, createCommentVNode as c, createElementBlock as l, createElementVNode as u, createSlots as d, defineComponent as f, guardReactiveProps as p, mergeModels as m, mergeProps as h, normalizeProps as g, openBlock as _, ref as v, renderList as y, renderSlot as b, toDisplayString as x, unref as S, useModel as C, withCtx as w } from "vue";
-import { isUndefined as T } from "es-toolkit/compat";
-import { resolveSliderBounds as E, resolveSliderDefaultValue as D } from "@bridge-ui/core/Domain";
+import { useSlider as a } from "./composables/useSlider.js";
+import { Fragment as o, createBlock as s, createCommentVNode as c, createElementBlock as l, createElementVNode as u, createSlots as d, defineComponent as f, guardReactiveProps as p, mergeModels as m, mergeProps as h, normalizeProps as g, openBlock as _, ref as v, renderList as y, renderSlot as b, toDisplayString as x, unref as S, useModel as C, withCtx as w } from "vue";
+import { resolveSliderBounds as T, resolveSliderDefaultValue as E } from "@bridge-ui/core/Domain";
 //#region src/Components/Slider/Slider.vue?vue&type=script&setup=true&lang.ts
-var O = /*@__PURE__*/ f({
+var D = /*@__PURE__*/ f({
 	inheritAttrs: !1,
 	__name: "Slider",
 	props: /*@__PURE__*/ m({
@@ -43,7 +43,7 @@ var O = /*@__PURE__*/ f({
 	}),
 	emits: /*@__PURE__*/ m(["change", "update:modelValue"], ["update:modelValue"]),
 	setup(f, { emit: m }) {
-		let O = m, k = f, A = C(f, "modelValue"), j = {
+		let D = m, O = f, k = C(f, "modelValue"), A = {
 			min: 0,
 			step: 1,
 			max: 100,
@@ -52,67 +52,62 @@ var O = /*@__PURE__*/ f({
 			color: "primary",
 			showStops: !1,
 			showTooltip: !0
-		}, M = E({
-			min: k.min ?? j.min,
-			max: k.max ?? j.max,
-			step: k.step ?? j.step
-		}), N = v(D({
-			min: M.min,
-			max: M.max,
-			step: M.step,
-			range: !!k.range,
-			defaultValue: k.defaultValue
-		})), P = o({
-			set: (e) => {
-				A.value = e, N.value = e;
-			},
-			get: () => T(A.value) ? N.value : A.value
-		}), F = v([null, null]), { barBind: I, trackRef: L, baseField: R, trackBind: z, controlBind: B, getStopBind: V, thumbIndexes: H, tooltipProps: U, getThumbBind: W, resolvedStops: G, isTooltipOpen: K, hasStopLabels: q, readThumbValue: J, stopLabelsBind: Y, getStopLabelBind: X, getThumbKnobBind: Z, showTooltip: Q } = r(() => k, j, P, { onChange: (e) => {
-			O("change", e);
+		}, j = T({
+			min: O.min ?? A.min,
+			max: O.max ?? A.max,
+			step: O.step ?? A.step
+		}), M = v(E({
+			min: j.min,
+			max: j.max,
+			step: j.step,
+			range: !!O.range,
+			defaultValue: O.defaultValue
+		})), N = t(k, M), P = v([null, null]), { barBind: F, trackRef: I, baseField: L, trackBind: R, controlBind: z, getStopBind: B, thumbIndexes: V, tooltipProps: H, getThumbBind: U, resolvedStops: W, isTooltipOpen: G, hasStopLabels: K, readThumbValue: q, stopLabelsBind: J, getStopLabelBind: Y, getThumbKnobBind: X, showTooltip: Z } = a(() => O, A, N, { onChange: (e) => {
+			D("change", e);
 		} });
-		function $(e) {
-			L.value = e instanceof HTMLDivElement ? e : e?.$el ?? null;
+		function Q(e) {
+			I.value = e instanceof HTMLDivElement ? e : e?.$el ?? null;
 		}
-		function ee(e, t) {
+		function $(e, t) {
 			let n = t instanceof HTMLButtonElement ? t : t?.$el ?? null;
-			F.value[e] = n;
+			P.value[e] = n;
 		}
-		return (r, o) => (_(), s(n, { field: S(R) }, d({
-			default: w(() => [u("div", g(p(S(B))), [
-				u("div", h({ ref: $ }, S(z)), [
-					u("div", g(p(S(I))), null, 16),
-					(_(!0), l(a, null, y(S(G), (e) => (_(), l("div", h({ key: `stop-${e.value}` }, { ref_for: !0 }, S(V)(e)), null, 16))), 128)),
-					(_(!0), l(a, null, y(S(H), (e) => (_(), l("button", h({ key: e }, { ref_for: !0 }, S(W)(e), {
+		return (t, a) => (_(), s(r, { field: S(L) }, d({
+			default: w(() => [u("div", g(p(S(z))), [
+				u("div", h({ ref: Q }, S(R)), [
+					u("div", g(p(S(F))), null, 16),
+					(_(!0), l(o, null, y(S(W), (e) => (_(), l("div", h({ key: `stop-${e.value}` }, { ref_for: !0 }, S(B)(e)), null, 16))), 128)),
+					(_(!0), l(o, null, y(S(V), (e) => (_(), l("button", h({ key: e }, { ref_for: !0 }, S(U)(e), {
 						ref_for: !0,
-						ref: (t) => ee(e, t)
-					}), [b(r.$slots, "thumb", {}, () => [u("span", h({ ref_for: !0 }, S(Z)(e)), null, 16)])], 16))), 128))
+						ref: (t) => $(e, t)
+					}), [b(t.$slots, "thumb", {}, () => [u("span", h({ ref_for: !0 }, S(X)(e)), null, 16)])], 16))), 128))
 				], 16),
-				S(Q) ? (_(!0), l(a, { key: 0 }, y(S(H), (e) => (_(), s(S(i), h({
+				S(Z) ? (_(!0), l(o, { key: 0 }, y(S(V), (e) => (_(), s(S(i), h({
 					arrow: "",
 					size: "sm",
 					"open-delay": 0,
 					placement: "top",
 					"close-delay": 0,
 					key: `tooltip-${e}`,
-					"anchor-el": F.value[e],
-					"model-value": S(K)(e),
-					content: String(S(J)(e))
-				}, { ref_for: !0 }, S(U)), null, 16, [
+					"anchor-el": P.value[e],
+					"model-value": S(G)(e),
+					content: String(S(q)(e))
+				}, { ref_for: !0 }, S(H)), null, 16, [
 					"anchor-el",
 					"model-value",
 					"content"
 				]))), 128)) : c("", !0),
-				S(q) ? (_(), l("div", g(h({ key: 1 }, S(Y))), [(_(!0), l(a, null, y(S(G), (e) => (_(), l(a, { key: `label-${e.value}` }, [e.label ? (_(), l("div", h({
+				S(K) ? (_(), l("div", g(h({ key: 1 }, S(J))), [(_(!0), l(o, null, y(S(W), (e) => (_(), l(o, { key: `label-${e.value}` }, [e.label ? (_(), l("div", h({
 					key: 0,
 					ref_for: !0
-				}, S(X)(e)), x(e.label), 17)) : c("", !0)], 64))), 128))], 16)) : c("", !0)
+				}, S(Y)(e)), x(e.label), 17)) : c("", !0)], 64))), 128))], 16)) : c("", !0)
 			], 16)]),
 			_: 2
-		}, [y(S(e)(S(t), r.$slots), (e) => ({
+		}, [y(S(e)(S(n), t.$slots), (e) => ({
 			name: e,
-			fn: w((t) => [b(r.$slots, e, g(p(t || {})))])
+			fn: w((n) => [b(t.$slots, e, g(p(n || {})))])
 		}))]), 1032, ["field"]));
 	}
 });
 //#endregion
-export { O as default };
+export { D as default };

package/dist/Components/Slider/composables/useSlider.d.ts

@@ -479,7 +479,7 @@ export declare function useSlider(props: MaybeRefOrGetter<SliderOwnProps>, libDe
     getThumbKnobBind: (thumbIndex: 0 | 1) => import('@bridge-ui/core/Utils').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, {
         "aria-hidden": boolean;
     }>;
-    tooltipProps: import('vue').ComputedRef<Partial<Omit<import('../../Tooltip').TooltipOwnProps, "slots" | "anchorEl" | "content" | "modelValue">> | undefined>;
+    tooltipProps: import('vue').ComputedRef<Partial<Omit<import('../../Tooltip').TooltipOwnProps, "slots" | "modelValue" | "anchorEl" | "content">> | undefined>;
     readThumbValue: (thumbIndex: 0 | 1) => number;
 };
 export type UseSliderReturn = ReturnType<typeof useSlider>;

package/dist/Components/Table/Table.vue_vue_type_script_setup_true_lang.js

@@ -28,7 +28,7 @@ var l = /*@__PURE__*/ r({
 		variant: {}
 	},
 	setup(r) {
-		let { rootBind: l, tableBind: u } = e(r, {
+		let { wrapBind: l, rootBind: u, tableBind: d } = e(r, {
 			size: "md",
 			full: !0,
 			rounded: "lg",
@@ -37,7 +37,7 @@ var l = /*@__PURE__*/ r({
 			hoverable: !1,
 			stickyHeader: !1
 		});
-		return (e, r) => (o(), t("div", a(i(c(l))), [n("table", a(i(c(u))), [s(e.$slots, "default")], 16)], 16));
+		return (e, r) => (o(), t("div", a(i(c(l))), [n("div", a(i(c(u))), [n("table", a(i(c(d))), [s(e.$slots, "default")], 16)], 16)], 16));
 	}
 });
 //#endregion

package/dist/Components/Table/composables/useTable.d.ts

@@ -5,6 +5,9 @@ type TableLibDefaults = LibDefaultsShape<TableOwnProps, "full" | "size" | "round
 type TableMerged = MergeLibDefaults<TableOwnProps, TableLibDefaults>;
 export declare function useTable(props: TableOwnProps, libDefaults: TableLibDefaults): {
     merged: import('vue').ComputedRef<TableMerged>;
+    wrapBind: import('vue').ComputedRef<import('@bridge-ui/core/Utils').MergePartBind<{
+        class: string;
+    }, "class", {}, {}>>;
     rootBind: import('vue').ComputedRef<import('@bridge-ui/core/Utils').MergePartBind<{
         class: string;
     }, "class", import('vue').HTMLAttributes | undefined, Omit<TableProps, "size" | "classes" | "customProps" | "full" | "rounded" | "variant" | "hoverable" | "stickyHeader" | "striped">>>;

package/dist/Components/Table/composables/useTable.js

@@ -65,6 +65,7 @@ function g(g, _) {
 	}));
 	return a(r, A), {
 		merged: b,
+		wrapBind: i(() => e({}, {}, { class: f({ "w-fit min-w-0 max-w-full": b.value.full === !1 }) })),
 		rootBind: i(() => e(b.value.customProps?.root, y.value.inheritedAttrs, { class: f({
 			"overflow-x-auto": b.value.stickyHeader !== !0,
 			[s(D.value, "root") ?? ""]: !0,

package/dist/Components/Table/table.types.d.ts

@@ -321,7 +321,8 @@ export interface TableOwnProps {
      */
     customProps?: TableCustomProps;
     /**
-     * Stretch the table to at least the wrapper width.
+     * Stretch the table to at least the wrapper width. When `false`, the
+     * wrapper hugs column content instead of spanning the parent.
      *
      * @default true
      */

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

@@ -1,14 +1,14 @@
 import { presentSlotNames as e } from "../../Utils/slotOrProp.js";
-import { FORM_FIELD_CHROME_SLOT_NAMES as t } from "../FormField/formField.types.js";
-import n from "../FormField/FormField.js";
-import { useTextField as r } from "./composables/useTextField.js";
-import { computed as i, createBlock as a, createElementVNode as o, createSlots as s, defineComponent as c, guardReactiveProps as l, mergeModels as u, mergeProps as d, normalizeProps as f, openBlock as p, ref as m, renderList as h, renderSlot as g, unref as _, useModel as v, vModelDynamic as y, withCtx as b, withDirectives as x } from "vue";
-import { isUndefined as S } from "es-toolkit/compat";
+import { useOptionalModel as t } from "../../Utils/useOptionalModel.js";
+import { FORM_FIELD_CHROME_SLOT_NAMES as n } from "../FormField/formField.types.js";
+import r from "../FormField/FormField.js";
+import { useTextField as i } from "./composables/useTextField.js";
+import { createBlock as a, createElementVNode as o, createSlots as s, defineComponent as c, guardReactiveProps as l, isRef as u, mergeModels as d, mergeProps as f, normalizeProps as p, openBlock as m, ref as h, renderList as g, renderSlot as _, unref as v, useModel as y, vModelDynamic as b, withCtx as x, withDirectives as S } from "vue";
 //#region src/Components/TextField/TextField.vue?vue&type=script&setup=true&lang.ts
 var C = /*@__PURE__*/ c({
 	inheritAttrs: !1,
 	__name: "TextField",
-	props: /*@__PURE__*/ u({
+	props: /*@__PURE__*/ d({
 		defaultValue: {},
 		classes: {},
 		color: {},
@@ -42,18 +42,13 @@ var C = /*@__PURE__*/ c({
 	}),
 	emits: ["update:modelValue"],
 	setup(c) {
-		let u = v(c, "modelValue"), C = c, w = m(C.defaultValue), T = i({
-			set: (e) => {
-				u.value = e, w.value = e;
-			},
-			get: () => S(u.value) ? w.value : u.value
-		}), { formField: E, inputBind: D } = r(C);
-		return (r, i) => (p(), a(_(n), { field: _(E) }, s({
-			default: b(() => [x(o("input", d({ "onUpdate:modelValue": i[0] ||= (e) => T.value = e }, _(D)), null, 16), [[y, T.value]])]),
+		let d = y(c, "modelValue"), C = c, w = h(C.defaultValue), T = t(d, w), { formField: E, inputBind: D } = i(C);
+		return (t, i) => (m(), a(v(r), { field: v(E) }, s({
+			default: x(() => [S(o("input", f({ "onUpdate:modelValue": i[0] ||= (e) => u(T) ? T.value = e : null }, v(D)), null, 16), [[b, v(T)]])]),
 			_: 2
-		}, [h(_(e)(_(t), r.$slots), (e) => ({
+		}, [g(v(e)(v(n), t.$slots), (e) => ({
 			name: e,
-			fn: b((t) => [g(r.$slots, e, f(l(t || {})))])
+			fn: x((n) => [_(t.$slots, e, p(l(n || {})))])
 		}))]), 1032, ["field"]));
 	}
 });