@bridge-ui/vue 0.0.1-beta.7 → 0.0.2

package/dist/Components/Tab/composables/useTab.js

@@ -0,0 +1,88 @@
+import { mergePartBind as e, useBridgeUIComponent as t, useBridgeUIMergedRegistryClasses as n } from "../../../Utils/index.js";
+import { TABS_INJECTION_KEY as r } from "../../Tabs/tabsInjectionKey.js";
+import { computed as i, inject as a, onBeforeUnmount as o, onMounted as s, useAttrs as c, watch as l } from "vue";
+import { get as u } from "es-toolkit/compat";
+import { cn as d, getTabId as f, getTabPanelId as p, splitComponentProps as m } from "@bridge-ui/core";
+//#region src/Components/Tab/composables/useTab.ts
+var h = [
+	"value",
+	"classes",
+	"endIcon",
+	"disabled",
+	"startIcon",
+	"customProps"
+];
+function g(g) {
+	let _ = c(), v = a(r, null);
+	if (!v) throw Error("Tab must be used within a Tabs provider");
+	let y = v, b = i(() => m({
+		bridgeKeys: h,
+		props: {
+			..._,
+			...g
+		}
+	})), { merged: x, entry: S } = t({
+		componentName: "Tab",
+		props: () => b.value.componentProps
+	}), C = i(() => x.value.value), w = i(() => x.value.disabled === !0), T = i(() => y.value.selected === C.value), E = null;
+	function D() {
+		E?.(), E = y.value.registerTab(C.value, w.value);
+	}
+	s(D), l([C, w], D), o(() => {
+		E?.(), E = null;
+	});
+	let O = n({
+		entry: S,
+		props: () => b.value.componentProps
+	});
+	function k(e) {
+		w.value || (y.value.setSelected(C.value), b.value.inheritedAttrs.onClick?.(e));
+	}
+	function A(e) {
+		let t = y.value;
+		t.activation === "manual" && (e.key === "Enter" || e.key === " ") && (e.preventDefault(), w.value || t.setSelected(C.value)), b.value.inheritedAttrs.onKeydown?.(e);
+	}
+	let j = i(() => x.value.customProps);
+	return {
+		merged: x,
+		iconSize: i(() => y.value.tokenClasses.iconSize ?? "md"),
+		rootBind: i(() => {
+			let t = y.value;
+			return e(j.value?.root, b.value.inheritedAttrs, {
+				role: "tab",
+				type: "button",
+				onClick: k,
+				disabled: w.value,
+				onKeydown: A,
+				"aria-selected": T.value,
+				tabindex: T.value ? 0 : -1,
+				id: f(t.id, C.value),
+				"aria-controls": p(t.id, C.value),
+				class: d({
+					"inline-flex cursor-pointer items-center justify-center transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary-500/40 disabled:pointer-events-none disabled:opacity-50": !0,
+					[t.tokenClasses.iconGap ?? ""]: !0,
+					[t.tokenClasses.tabSize ?? ""]: !0,
+					[t.tokenClasses.tabVariant ?? ""]: !0,
+					[t.tokenClasses.tabOrientation ?? ""]: !0,
+					[t.tokenClasses.tabVariantSelected ?? ""]: T.value,
+					[t.tokenClasses.colorSelected ?? ""]: T.value,
+					[t.tokenClasses.colorSelectedSoft ?? ""]: T.value && t.tokenClasses.softFill === !0,
+					[u(O.value, "root") ?? ""]: !0
+				})
+			});
+		}),
+		selected: T,
+		endIconBind: i(() => e(j.value?.endIcon, {}, d({
+			"shrink-0": !0,
+			[u(O.value, "endIcon") ?? ""]: !0
+		}))),
+		endSlotBind: i(() => e(j.value?.end, {}, "inline-flex shrink-0 items-center")),
+		startIconBind: i(() => e(j.value?.startIcon, {}, d({
+			"shrink-0": !0,
+			[u(O.value, "startIcon") ?? ""]: !0
+		}))),
+		startSlotBind: i(() => e(j.value?.start, {}, "inline-flex shrink-0 items-center"))
+	};
+}
+//#endregion
+export { g as useTab };

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

@@ -0,0 +1,3 @@
+export { useTab } from './composables/useTab';
+export type { TabClasses, TabCustomProps, TabOwnProps, TabProps, TabSlots, } from './tab.types';
+export { default as Tab } from './Tab.vue';

package/dist/Components/Tab/index.js

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

package/dist/Components/Tab/tab.types.d.ts

@@ -0,0 +1,94 @@
+import { LucideIcon } from '@lucide/vue';
+import { ButtonHTMLAttributes, HTMLAttributes, Slot } from 'vue';
+import { MergeHtmlProps } from '@bridge-ui/core';
+import { IconProps } from '../Icon';
+export interface TabClasses {
+    /**
+     * Classes merged onto the end icon.
+     */
+    endIcon?: string;
+    /**
+     * Classes merged onto the tab button.
+     */
+    root?: string;
+    /**
+     * Classes merged onto the start icon.
+     */
+    startIcon?: string;
+}
+export interface TabCustomProps {
+    /**
+     * Props forwarded to the inline-end slot wrapper.
+     */
+    end?: HTMLAttributes;
+    /**
+     * Props forwarded to the end `Icon`.
+     */
+    endIcon?: Partial<Omit<IconProps, "icon">>;
+    /**
+     * Props forwarded to the tab button.
+     */
+    root?: ButtonHTMLAttributes;
+    /**
+     * Props forwarded to the inline-start slot wrapper.
+     */
+    start?: HTMLAttributes;
+    /**
+     * Props forwarded to the start `Icon`.
+     */
+    startIcon?: Partial<Omit<IconProps, "icon">>;
+}
+/**
+ * Tab trigger (`role="tab"`). Must be used inside `Tabs` / `TabList`.
+ */
+export interface TabOwnProps {
+    /**
+     * Classes for tab parts.
+     *
+     * @default undefined
+     */
+    classes?: TabClasses;
+    /**
+     * Props forwarded to each tab part.
+     *
+     * @default undefined
+     */
+    customProps?: TabCustomProps;
+    /**
+     * Whether the tab is disabled.
+     *
+     * @default false
+     */
+    disabled?: boolean;
+    /**
+     * Icon at the **inline end** (physical right in `ltr`, physical left in `rtl`).
+     *
+     * @default undefined
+     */
+    endIcon?: LucideIcon;
+    /**
+     * Icon at the **inline start** (physical left in `ltr`, physical right in `rtl`). Prefer over the `#start` slot.
+     *
+     * @default undefined
+     */
+    startIcon?: LucideIcon;
+    /**
+     * Stable value matching a `TabPanel`.
+     */
+    value: string;
+}
+export interface TabSlots {
+    /**
+     * The label content.
+     */
+    default?: Slot<undefined>;
+    /**
+     * Slot at the inline end (ignored when `endIcon` is set).
+     */
+    end?: Slot<undefined>;
+    /**
+     * Slot at the inline start (ignored when `startIcon` is set).
+     */
+    start?: Slot<undefined>;
+}
+export type TabProps = MergeHtmlProps<TabOwnProps, ButtonHTMLAttributes>;

package/dist/Components/TabItem/TabItem.js

@@ -0,0 +1,5 @@
+import e from "./TabItem.vue_vue_type_script_setup_true_lang.js";
+//#region src/Components/TabItem/TabItem.vue
+var t = e;
+//#endregion
+export { t as default };

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

@@ -0,0 +1,11 @@
+import { TabItemOwnProps, TabItemSlots } from './tabItem.types';
+type __VLS_Slots = TabItemSlots;
+declare const __VLS_base: import('vue').DefineComponent<TabItemOwnProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<TabItemOwnProps> & 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;
+    };
+};

package/dist/Components/TabItem/TabItem.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,25 @@
+import { useTabItem as e } from "./composables/useTabItem.js";
+import { createElementBlock as t, defineComponent as n, openBlock as r, useSlots as i } from "vue";
+//#region src/Components/TabItem/TabItem.vue?vue&type=script&setup=true&lang.ts
+var a = {
+	hidden: "",
+	"aria-hidden": "true"
+}, o = /* @__PURE__ */ n({
+	name: "TabItem",
+	inheritAttrs: !1,
+	__name: "TabItem",
+	props: {
+		classes: {},
+		disabled: { type: Boolean },
+		endIcon: { type: [Function, Object] },
+		keepMounted: { type: Boolean },
+		label: {},
+		startIcon: { type: [Function, Object] },
+		value: {}
+	},
+	setup(n) {
+		return e(n, i()), (e, n) => (r(), t("span", a));
+	}
+});
+//#endregion
+export { o as default };

package/dist/Components/TabItem/composables/useTabItem.d.ts

@@ -0,0 +1,3 @@
+import { SetupContext } from 'vue';
+import { TabItemOwnProps, TabItemSlots } from '../tabItem.types';
+export declare function useTabItem(props: TabItemOwnProps, slots: SetupContext<TabItemSlots>["slots"]): void;

package/dist/Components/TabItem/composables/useTabItem.js

@@ -0,0 +1,39 @@
+import { TABS_INJECTION_KEY as e } from "../../Tabs/tabsInjectionKey.js";
+import { inject as t, onBeforeUnmount as n, onMounted as r, watch as i } from "vue";
+//#region src/Components/TabItem/composables/useTabItem.ts
+function a(a, o) {
+	let s = t(e, null);
+	if (!s) throw Error("TabItem must be used within a Tabs provider");
+	let c = s, l;
+	function u() {
+		l?.(), l = c.value.registerTabItem({
+			value: a.value,
+			endIcon: a.endIcon,
+			disabled: a.disabled,
+			startIcon: a.startIcon,
+			keepMounted: a.keepMounted,
+			panel: () => o.default?.(),
+			label: a.label ?? (() => o.label?.()),
+			slots: o.start || o.end ? {
+				end: o.end ? () => o.end?.() : void 0,
+				start: o.start ? () => o.start?.() : void 0
+			} : void 0
+		});
+	}
+	r(u), i(() => [
+		a.label,
+		a.value,
+		a.endIcon,
+		a.disabled,
+		a.startIcon,
+		a.keepMounted,
+		!!o.end,
+		!!o.label,
+		!!o.start,
+		!!o.default
+	], u), n(() => {
+		l?.();
+	});
+}
+//#endregion
+export { a as useTabItem };

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

@@ -0,0 +1,3 @@
+export { useTabItem } from './composables/useTabItem';
+export type { TabItemClasses, TabItemOwnProps, TabItemProps, TabItemSlots, } from './tabItem.types';
+export { default as TabItem } from './TabItem.vue';

package/dist/Components/TabItem/index.js

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

package/dist/Components/TabItem/tabItem.types.d.ts

@@ -0,0 +1,72 @@
+import { LucideIcon } from '@lucide/vue';
+import { Slot } from 'vue';
+export interface TabItemClasses {
+    /**
+     * Unused on the registration-only root; reserved for overrides.
+     */
+    root?: string;
+}
+/**
+ * Ergonomic shortcut: registers a `Tab` label + `TabPanel` content with `Tabs`.
+ */
+export interface TabItemOwnProps {
+    /**
+     * Classes reserved for registry overrides.
+     *
+     * @default undefined
+     */
+    classes?: TabItemClasses;
+    /**
+     * Whether the tab is disabled.
+     *
+     * @default false
+     */
+    disabled?: boolean;
+    /**
+     * Icon at the **inline end** on the tab trigger.
+     *
+     * @default undefined
+     */
+    endIcon?: LucideIcon;
+    /**
+     * When set, overrides `Tabs` `keepMounted` for this panel.
+     *
+     * @default undefined
+     */
+    keepMounted?: boolean;
+    /**
+     * Label shown on the tab trigger (or use the `label` slot).
+     *
+     * @default undefined
+     */
+    label?: string;
+    /**
+     * Icon at the **inline start** on the tab trigger.
+     *
+     * @default undefined
+     */
+    startIcon?: LucideIcon;
+    /**
+     * Stable value for the tab / panel pair.
+     */
+    value: string;
+}
+export interface TabItemSlots {
+    /**
+     * Panel content for this tab.
+     */
+    default?: Slot<undefined>;
+    /**
+     * Trailing custom content on the tab trigger (ignored when `endIcon` is set).
+     */
+    end?: Slot<undefined>;
+    /**
+     * Label content when not using the `label` prop.
+     */
+    label?: Slot<undefined>;
+    /**
+     * Leading custom content on the tab trigger (ignored when `startIcon` is set).
+     */
+    start?: Slot<undefined>;
+}
+export type TabItemProps = TabItemOwnProps;

package/dist/Components/TabList/TabList.js

@@ -0,0 +1,5 @@
+import e from "./TabList.vue_vue_type_script_setup_true_lang.js";
+//#region src/Components/TabList/TabList.vue
+var t = e;
+//#endregion
+export { t as default };

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

@@ -0,0 +1,11 @@
+import { TabListOwnProps, TabListSlots } from './tabList.types';
+type __VLS_Slots = TabListSlots;
+declare const __VLS_base: import('vue').DefineComponent<TabListOwnProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<TabListOwnProps> & 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;
+    };
+};

package/dist/Components/TabList/TabList.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,18 @@
+import { resolveNamedSlot as e } from "../../Utils/slotOrProp.js";
+import { useTabList as t } from "./composables/useTabList.js";
+import { createBlock as n, createElementBlock as r, defineComponent as i, guardReactiveProps as a, normalizeProps as o, openBlock as s, resolveDynamicComponent as c, unref as l, useSlots as u } from "vue";
+//#region src/Components/TabList/TabList.vue?vue&type=script&setup=true&lang.ts
+var d = /* @__PURE__ */ i({
+	inheritAttrs: !1,
+	__name: "TabList",
+	props: {
+		classes: {},
+		customProps: {}
+	},
+	setup(i) {
+		let d = u(), { rootBind: f } = t(i);
+		return (t, i) => (s(), r("div", o(a(l(f))), [(s(), n(c(l(e)(l(d), "default"))))], 16));
+	}
+});
+//#endregion
+export { d as default };

package/dist/Components/TabList/composables/useTabList.d.ts

@@ -0,0 +1,10 @@
+import { TabListOwnProps, TabListProps } from '../tabList.types';
+export declare function useTabList(props: TabListOwnProps): {
+    merged: import('vue').ComputedRef<TabListOwnProps>;
+    rootBind: import('vue').ComputedRef<import('@bridge-ui/core').MergePartBind<{
+        role: string;
+        onKeydown: (event: KeyboardEvent) => void;
+        "aria-orientation": "horizontal" | "vertical";
+        class: string;
+    }, "class", import('vue').HTMLAttributes | undefined, Omit<TabListProps, "classes" | "customProps">>>;
+};

package/dist/Components/TabList/composables/useTabList.js

@@ -0,0 +1,65 @@
+import { mergePartBind as e, useBridgeUIComponent as t, useBridgeUIMergedRegistryClasses as n } from "../../../Utils/index.js";
+import { TABS_INJECTION_KEY as r } from "../../Tabs/tabsInjectionKey.js";
+import { computed as i, inject as a, useAttrs as o } from "vue";
+import { get as s } from "es-toolkit/compat";
+import { cn as c, getAdjacentTabValue as l, getTabId as u, splitComponentProps as d } from "@bridge-ui/core";
+//#region src/Components/TabList/composables/useTabList.ts
+var f = ["classes", "customProps"];
+function p(p) {
+	let m = o(), h = a(r, null);
+	if (!h) throw Error("TabList must be used within a Tabs provider");
+	let g = h, _ = i(() => d({
+		bridgeKeys: f,
+		props: {
+			...m,
+			...p
+		}
+	})), { merged: v, entry: y } = t({
+		componentName: "TabList",
+		props: () => _.value.componentProps
+	}), b = n({
+		entry: y,
+		props: () => _.value.componentProps
+	});
+	function x(e) {
+		let t = g.value, n = t.orientation === "horizontal", r = n ? "ArrowRight" : "ArrowDown", i = n ? "ArrowLeft" : "ArrowUp", a = typeof document < "u" ? document.activeElement?.id : void 0, o = t.tabValues.find((e) => u(t.id, e) === a) ?? t.selected;
+		if (e.key === r || e.key === i) {
+			e.preventDefault();
+			let n = e.key === r ? 1 : -1, i = l(t.tabValues, o, n, new Set(t.disabledValues));
+			t.focusTab(i), t.activation === "automatic" && t.setSelected(i);
+			return;
+		}
+		if (e.key === "Home") {
+			e.preventDefault();
+			let n = t.tabValues.find((e) => !t.disabledValues.includes(e)) ?? t.selected;
+			t.focusTab(n), t.activation === "automatic" && t.setSelected(n);
+			return;
+		}
+		if (e.key === "End") {
+			e.preventDefault();
+			let n = [...t.tabValues].reverse().find((e) => !t.disabledValues.includes(e)) ?? t.selected;
+			t.focusTab(n), t.activation === "automatic" && t.setSelected(n);
+		}
+	}
+	let S = i(() => v.value.customProps);
+	return {
+		merged: v,
+		rootBind: i(() => {
+			let t = g.value;
+			return e(S.value?.root, _.value.inheritedAttrs, {
+				role: "tablist",
+				onKeydown: x,
+				"aria-orientation": t.orientation,
+				class: c({
+					flex: !0,
+					[t.tokenClasses.listOrientation ?? ""]: !0,
+					[t.tokenClasses.listSize ?? ""]: !0,
+					[t.tokenClasses.listVariant ?? ""]: !0,
+					[s(b.value, "root") ?? ""]: !0
+				})
+			});
+		})
+	};
+}
+//#endregion
+export { p as useTabList };

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

@@ -0,0 +1,3 @@
+export { useTabList } from './composables/useTabList';
+export type { TabListClasses, TabListCustomProps, TabListOwnProps, TabListProps, TabListSlots, } from './tabList.types';
+export { default as TabList } from './TabList.vue';

package/dist/Components/TabList/index.js

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

package/dist/Components/TabList/tabList.types.d.ts

@@ -0,0 +1,38 @@
+import { HTMLAttributes, Slot } from 'vue';
+import { MergeHtmlProps } from '@bridge-ui/core';
+export interface TabListClasses {
+    /**
+     * Classes merged onto the tab list root.
+     */
+    root?: string;
+}
+export interface TabListCustomProps {
+    /**
+     * Props forwarded to the tab list root.
+     */
+    root?: HTMLAttributes;
+}
+/**
+ * Container for `Tab` triggers (`role="tablist"`). Must be used inside `Tabs`.
+ */
+export interface TabListOwnProps {
+    /**
+     * Classes for tab list parts.
+     *
+     * @default undefined
+     */
+    classes?: TabListClasses;
+    /**
+     * Props forwarded to each tab list part.
+     *
+     * @default undefined
+     */
+    customProps?: TabListCustomProps;
+}
+export interface TabListSlots {
+    /**
+     * The tab triggers to render.
+     */
+    default?: Slot<undefined>;
+}
+export type TabListProps = MergeHtmlProps<TabListOwnProps, HTMLAttributes>;

package/dist/Components/TabPanel/TabPanel.js

@@ -0,0 +1,5 @@
+import e from "./TabPanel.vue_vue_type_script_setup_true_lang.js";
+//#region src/Components/TabPanel/TabPanel.vue
+var t = e;
+//#endregion
+export { t as default };

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

@@ -0,0 +1,11 @@
+import { TabPanelOwnProps, TabPanelSlots } from './tabPanel.types';
+type __VLS_Slots = TabPanelSlots;
+declare const __VLS_base: import('vue').DefineComponent<TabPanelOwnProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<TabPanelOwnProps> & 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;
+    };
+};

package/dist/Components/TabPanel/TabPanel.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,20 @@
+import { resolveNamedSlot as e } from "../../Utils/slotOrProp.js";
+import { useTabPanel as t } from "./composables/useTabPanel.js";
+import { createBlock as n, createCommentVNode as r, createElementBlock as i, defineComponent as a, mergeProps as o, normalizeProps as s, openBlock as c, resolveDynamicComponent as l, unref as u, useSlots as d } from "vue";
+//#region src/Components/TabPanel/TabPanel.vue?vue&type=script&setup=true&lang.ts
+var f = /* @__PURE__ */ a({
+	inheritAttrs: !1,
+	__name: "TabPanel",
+	props: {
+		classes: {},
+		customProps: {},
+		keepMounted: { type: Boolean },
+		value: {}
+	},
+	setup(a) {
+		let f = d(), { rootBind: p, selected: m, keepMounted: h } = t(a);
+		return (t, a) => u(m) || u(h) ? (c(), i("div", s(o({ key: 0 }, u(p))), [(c(), n(l(u(e)(u(f), "default"))))], 16)) : r("", !0);
+	}
+});
+//#endregion
+export { f as default };

package/dist/Components/TabPanel/composables/useTabPanel.d.ts

@@ -0,0 +1,14 @@
+import { TabPanelOwnProps, TabPanelProps } from '../tabPanel.types';
+export declare function useTabPanel(props: TabPanelOwnProps): {
+    merged: import('vue').ComputedRef<TabPanelOwnProps>;
+    rootBind: import('vue').ComputedRef<import('@bridge-ui/core').MergePartBind<{
+        role: string;
+        hidden: boolean;
+        tabindex: number;
+        id: string;
+        "aria-labelledby": string;
+        class: string;
+    }, "class", import('vue').HTMLAttributes | undefined, Omit<TabPanelProps, "value" | "classes" | "customProps" | "keepMounted">>>;
+    selected: import('vue').ComputedRef<boolean>;
+    keepMounted: import('vue').ComputedRef<boolean>;
+};

package/dist/Components/TabPanel/composables/useTabPanel.js

@@ -0,0 +1,51 @@
+import { mergePartBind as e, useBridgeUIComponent as t, useBridgeUIMergedRegistryClasses as n } from "../../../Utils/index.js";
+import { TABS_INJECTION_KEY as r } from "../../Tabs/tabsInjectionKey.js";
+import { computed as i, getCurrentInstance as a, inject as o, useAttrs as s } from "vue";
+import { get as c } from "es-toolkit/compat";
+import { cn as l, getTabId as u, getTabPanelId as d, splitComponentProps as f } from "@bridge-ui/core";
+//#region src/Components/TabPanel/composables/useTabPanel.ts
+var p = [
+	"value",
+	"classes",
+	"customProps",
+	"keepMounted"
+];
+function m(m) {
+	let h = s(), g = o(r, null);
+	if (!g) throw Error("TabPanel must be used within a Tabs provider");
+	let _ = g, v = i(() => f({
+		props: {
+			...h,
+			...m
+		},
+		bridgeKeys: p
+	})), { merged: y, entry: b } = t({
+		componentName: "TabPanel",
+		props: () => v.value.componentProps
+	}), x = i(() => y.value.value), S = i(() => _.value.selected === x.value), C = i(() => "keepMounted" in (a()?.vnode.props ?? {}) ? y.value.keepMounted === !0 : _.value.keepMounted), w = n({
+		entry: b,
+		props: () => v.value.componentProps
+	}), T = i(() => y.value.customProps);
+	return {
+		merged: y,
+		rootBind: i(() => {
+			let t = _.value;
+			return e(T.value?.root, v.value.inheritedAttrs, {
+				role: "tabpanel",
+				hidden: !S.value,
+				tabindex: S.value ? 0 : -1,
+				id: d(t.id, x.value),
+				"aria-labelledby": u(t.id, x.value),
+				class: l({
+					[t.tokenClasses.panelSize ?? ""]: !0,
+					[t.tokenClasses.panelOrientation ?? ""]: !0,
+					[c(w.value, "root") ?? ""]: !0
+				})
+			});
+		}),
+		selected: S,
+		keepMounted: C
+	};
+}
+//#endregion
+export { m as useTabPanel };

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

@@ -0,0 +1,3 @@
+export { useTabPanel } from './composables/useTabPanel';
+export type { TabPanelClasses, TabPanelCustomProps, TabPanelOwnProps, TabPanelProps, TabPanelSlots, } from './tabPanel.types';
+export { default as TabPanel } from './TabPanel.vue';

package/dist/Components/TabPanel/index.js

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