bitboss-ui 3.0.0-beta.62 → 3.0.0-beta.64

package/dist/ai/source/BbTabs.md

@@ -20,7 +20,7 @@
 	>
 		<BbTabsList
 			v-bind="pickName(attrs)"
-			:pt="passthrough.forwardInstance(LIST_PARTS)"
+			:pt="passthrough.forwardInstance(LIST_PARTS, LIST_STATES)"
 		>
 			<template
 				v-for="(_, name) in forwardedSlots"
@@ -47,7 +47,12 @@
 <script setup lang="ts" generic="K extends string = string">
 import { useAttrs, useSlots } from 'vue';
 import { createTabsContext } from '@/composables/useBbTabsContext';
-import { usePassthrough } from '@/composables/usePassthrough';
+import {
+	registeredVariantNames,
+	usePassthrough,
+	variantPt,
+} from '@/composables/usePassthrough';
+import { TABS_VARIANTS } from '@/types/TabsVariant';
 import { removedPropsFor } from '@/deprecation/removedProps';
 import { warnRemovedAttrs } from '@/utilities/functions/warnRemovedAttrs';
 import BbTabsList from './BbTabsList.vue';
@@ -56,6 +61,7 @@ import { slotKey } from '@/utilities/functions/slotKey';
 import BbTabsPanels from './BbTabsPanels.vue';
 import {
 	BB_TABS_LIST_HOST_PARTS,
+	BB_TABS_LIST_PT,
 	BB_TABS_PANELS_HOST_PARTS,
 	BB_TABS_PT,
 	type BbTabsProps,
@@ -72,7 +78,11 @@ export type {
 	BbTabsSlots,
 } from './types';
 
-defineOptions({ inheritAttrs: false });
+defineOptions({
+	// An app's own variants as declared `pt:<part>:<name>` props (Q76.7).
+	mixins: [variantPt(BB_TABS_PT)],
+	inheritAttrs: false,
+});
 /**
  * All-in-one tabs: the shadcn-themed list of triggers followed by the panels.
  * Owns its own tabs context (shadowing any ancestor `BbTabsRoot`), so nested
@@ -137,7 +147,13 @@ const passthrough = usePassthrough<BbTabsPtPart, BbTabsPtState>({
 	parts: BB_TABS_PT.parts,
 	states: BB_TABS_PT.states,
 	active: { disabled: () => !!props.disabled },
+	variant: { ...BB_TABS_PT.variant, current: () => props.variant },
 });
+/** The strip resolves the variant itself (its own may differ): every name passes on. */
+const LIST_STATES = [
+	...BB_TABS_LIST_PT.states,
+	...registeredVariantNames(TABS_VARIANTS, 'tabsVariants'),
+];
 /**
  * The tab strip's name belongs on the element with `role="tablist"` (Q67.4):
  * an `aria-label` / `aria-labelledby` on `<BbTabs>` goes to `BbTabsList`,
@@ -169,8 +185,14 @@ import type {
 	PtMap,
 	PtNoInfer,
 	PtValue,
+	PtVariantAttrs,
 } from '@/types/passthrough';
-import type { TabsVariantType } from '@/types/TabsVariant';
+import {
+	TABS_VARIANTS,
+	type TabsVariantBuiltIn,
+	type TabsVariantRegistry,
+	type TabsVariantType,
+} from '@/types/TabsVariant';
 /**
  * Inertia-specific options shared between `BbTabsProps` (component-level defaults)
  * and `BbTabsItem` (per-item overrides). Item values always win over component values.
@@ -293,7 +315,7 @@ export type BbTabsItem<K extends string = string> = BbTabsInertiaOptions & {
  * Passthrough parts of `BbTabs` (plans/passthrough/BbTabs.md). Tabs do not
  * "open", so there is no `open` state.
  *
- * Per-item functions: on the instance, `item` also accepts `({ item, active, … }) => PtValue | false | null | undefined` — `item` is the tab's descriptor (the element of `items`: its `value`, `label`, anything else you put on it), and every state a boolean beside it, on for it (`active`, `disabled`, …) — in the `pt` object or the `:pt:item` attribute, never on a `item:<state>` key and never in the global map or a scope (they ship as JSON). Its result is merged last, after every state entry, through the same deduper; a falsy result leaves the trigger as it was. No other part takes a function. See the passthrough guide, _Per-item functions_.
+ * Per-item functions: on the instance, `item` also accepts `({ item, active, … }) => PtValue | false | null | undefined` — `item` is the tab's descriptor (the element of `items`: its `value`, `label`, anything else you put on it), every state a boolean beside it, on for it (`active`, `disabled`, …), and the strip's `variant` as a string — in the `pt` object or the `:pt:item` attribute, never on a `item:<state>` key and never in the global map or a scope (they ship as JSON). Its result is merged last, after every state entry, through the same deduper; a falsy result leaves the trigger as it was. No other part takes a function. See the passthrough guide, _Per-item functions_.
  *
  * @part root - The tabs' outer element, around the strip and the panels.
  * @part wrapper - The strip's outer element: the `wrapper:prepend` slot, the
@@ -333,10 +355,23 @@ export type BbTabsPtState = 'active' | 'disabled';
 export const BB_TABS_PT = {
 	parts: ['root', 'wrapper', 'list', 'item', 'indicator', 'panels', 'panel'],
 	states: ['disabled', 'active'],
+	// The `variant` is a state on the strip's parts (Q76.7), below the real ones.
+	variant: {
+		names: TABS_VARIANTS,
+		option: 'tabsVariants',
+		parts: ['wrapper', 'list', 'item', 'indicator'],
+	},
 } as const satisfies {
 	parts: readonly BbTabsPtPart[];
 	states: readonly BbTabsPtState[];
+	variant: {
+		names: readonly TabsVariantBuiltIn[];
+		option: string;
+		parts: readonly BbTabsStripPtPart[];
+	};
 };
+/** The strip's parts on `BbTabs`: the ones its `variant` styles. Spelled flat (T20). */
+export type BbTabsStripPtPart = 'wrapper' | 'list' | 'item' | 'indicator';
 
 /**
  * Passthrough parts of `BbTabsList` — the strip of a split layout. The same
@@ -362,9 +397,12 @@ export type BbTabsListPtState = BbTabsPtState;
 export const BB_TABS_LIST_PT = {
 	parts: ['root', 'list', 'item', 'indicator'],
 	states: ['disabled', 'active'],
+	// The strip's `variant` is a state on every part (Q76.7).
+	variant: { names: TABS_VARIANTS, option: 'tabsVariants' },
 } as const satisfies {
 	parts: readonly BbTabsListPtPart[];
 	states: readonly BbTabsListPtState[];
+	variant: { names: readonly TabsVariantBuiltIn[]; option: string };
 };
 /** Where each `BbTabsList` part reads a `BbTabs` global / scope entry. */
 export const BB_TABS_LIST_HOST_PARTS = {
@@ -406,21 +444,39 @@ export const BB_TABS_PANELS_HOST_PARTS = {
 export type BbTabsProps<K extends string = string> = {
 	[K2 in
 		| `pt:${BbTabsSurfacePtPart}`
-		| `pt:${BbTabsPtPart}:${BbTabsPtState}`]?: PtValue;
-} & {
-	// `item` also takes a per-item function, called with the tab descriptor.
-	// A literal function type, not `PtItemFn` (PASSTHROUGH.md T23).
-	'pt:item'?:
-		| PtValue
-		| ((
-				ctx: PtItemCtx<BbTabsItem<PtNoInfer<K>>, BbTabsPtState>
-		  ) => PtItemResult);
-	/**
-	 * Passthrough, object form: the same keys as the `pt:*` attributes
-	 * without the prefix. See the `pt:<part>` row.
-	 */
-	pt?: PtItemMap<BbTabsPtPart, 'item', BbTabsPtState, BbTabsItem<PtNoInfer<K>>>;
-} & BbTabsRootProps<K>;
+		| `pt:${BbTabsPtPart}:${BbTabsPtState}`
+		| `pt:${BbTabsStripPtPart}:${TabsVariantBuiltIn}`]?: PtValue;
+} & /* @vue-ignore */ PtVariantAttrs<
+	BbTabsStripPtPart,
+	keyof TabsVariantRegistry
+> & {
+		// `item` also takes a per-item function, called with the tab descriptor.
+		// A literal function type, not `PtItemFn` (PASSTHROUGH.md T23).
+		'pt:item'?:
+			| PtValue
+			| ((
+					ctx: PtItemCtx<
+						BbTabsItem<PtNoInfer<K>>,
+						BbTabsPtState,
+						TabsVariantBuiltIn | keyof TabsVariantRegistry
+					>
+			  ) => PtItemResult);
+		/**
+		 * Passthrough, object form: the same keys as the `pt:*` attributes
+		 * without the prefix. See the `pt:<part>` row.
+		 */
+		/* eslint-disable @typescript-eslint/consistent-indexed-object-style -- mapped, never Record (T23) */
+		pt?: PtItemMap<
+			BbTabsPtPart,
+			'item',
+			BbTabsPtState,
+			BbTabsItem<PtNoInfer<K>>,
+			TabsVariantBuiltIn | keyof TabsVariantRegistry
+		> & {
+			[K2 in `${BbTabsStripPtPart}:${TabsVariantBuiltIn | keyof TabsVariantRegistry}`]?: PtValue;
+		};
+		/* eslint-enable @typescript-eslint/consistent-indexed-object-style */
+	} & BbTabsRootProps<K>;
 
 /**
  * Props of `BbTabsRoot` — `BbTabsProps` without `pt`. The root owns the whole
@@ -536,25 +592,45 @@ export type BbTabsRootProps<K extends string = string> =
 export type BbTabsListProps = {
 	[K2 in
 		| `pt:${BbTabsListSurfacePtPart}`
-		| `pt:${BbTabsListPtPart}:${BbTabsListPtState}`]?: PtValue;
-} & {
-	// `item` also takes a per-item function, called with the tab descriptor.
-	// A literal function type, not `PtItemFn` (PASSTHROUGH.md T23).
-	'pt:item'?:
-		| PtValue
-		| ((ctx: PtItemCtx<BbTabsItem, BbTabsListPtState>) => PtItemResult);
-	/**
-	 * Passthrough, object form: the same keys as the `pt:*` attributes
-	 * without the prefix. See the `pt:<part>` row.
-	 */
-	pt?: PtItemMap<BbTabsListPtPart, 'item', BbTabsListPtState, BbTabsItem>;
-} & {
-	/**
-	 * Look of this strip — the `variant` of the owning `BbTabs` / `BbTabsRoot`
-	 * unless set here. See `BbTabsProps.variant` for the values.
-	 */
-	variant?: TabsVariantType;
-};
+		| `pt:${BbTabsListPtPart}:${BbTabsListPtState}`
+		| `pt:${BbTabsListPtPart}:${TabsVariantBuiltIn}`]?: PtValue;
+} & /* @vue-ignore */ PtVariantAttrs<
+	BbTabsListPtPart,
+	keyof TabsVariantRegistry
+> & {
+		// `item` also takes a per-item function, called with the tab descriptor.
+		// A literal function type, not `PtItemFn` (PASSTHROUGH.md T23).
+		'pt:item'?:
+			| PtValue
+			| ((
+					ctx: PtItemCtx<
+						BbTabsItem,
+						BbTabsListPtState,
+						TabsVariantBuiltIn | keyof TabsVariantRegistry
+					>
+			  ) => PtItemResult);
+		/**
+		 * Passthrough, object form: the same keys as the `pt:*` attributes
+		 * without the prefix. See the `pt:<part>` row.
+		 */
+		/* eslint-disable @typescript-eslint/consistent-indexed-object-style -- mapped, never Record (T23) */
+		pt?: PtItemMap<
+			BbTabsListPtPart,
+			'item',
+			BbTabsListPtState,
+			BbTabsItem,
+			TabsVariantBuiltIn | keyof TabsVariantRegistry
+		> & {
+			[K2 in `${BbTabsListPtPart}:${TabsVariantBuiltIn | keyof TabsVariantRegistry}`]?: PtValue;
+		};
+		/* eslint-enable @typescript-eslint/consistent-indexed-object-style */
+	} & {
+		/**
+		 * Look of this strip — the `variant` of the owning `BbTabs` / `BbTabsRoot`
+		 * unless set here. See `BbTabsProps.variant` for the values.
+		 */
+		variant?: TabsVariantType;
+	};
 
 /**
  * Props of `BbTabsPanels`: its `pt` only. Everything else — items,

package/dist/ai/source/BbTabsList.md

@@ -107,7 +107,7 @@ import {
 } from 'vue';
 import { useScroll, useResizeObserver, useThrottleFn } from '@vueuse/core';
 import { useLogger } from '@/composables/useLogger';
-import { usePassthrough } from '@/composables/usePassthrough';
+import { usePassthrough, variantPt } from '@/composables/usePassthrough';
 import BbBaseButton from '../BbBaseButton/BbBaseButton.vue';
 import { omitName, pickName } from './tablistName';
 import { useInternalTabsContext } from '@/composables/useBbTabsContext';
@@ -125,7 +125,11 @@ export type {
 	BbTabsScrollSlotProps,
 } from './types';
 
-defineOptions({ inheritAttrs: false });
+defineOptions({
+	// An app's own variants as declared `pt:<part>:<name>` props (Q76.7).
+	mixins: [variantPt(BB_TABS_LIST_PT)],
+	inheritAttrs: false,
+});
 /**
  * The strip of tab triggers. Renders from the nearest `BbTabsRoot`/`BbTabs`
  * context — discovery is automatic; the props are its `pt` and an optional
@@ -188,6 +192,10 @@ const passthrough = usePassthrough<BbTabsListPtPart, BbTabsListPtState>({
 	states: BB_TABS_LIST_PT.states,
 	active: { disabled: () => disabled.value },
 	inherit: { component: 'BbTabs', parts: BB_TABS_LIST_HOST_PARTS },
+	variant: {
+		...BB_TABS_LIST_PT.variant,
+		current: () => props.variant ?? context.variant.value,
+	},
 });
 
 /** The strip's look: this list's own `variant`, else the root's. */
@@ -421,8 +429,14 @@ import type {
 	PtMap,
 	PtNoInfer,
 	PtValue,
+	PtVariantAttrs,
 } from '@/types/passthrough';
-import type { TabsVariantType } from '@/types/TabsVariant';
+import {
+	TABS_VARIANTS,
+	type TabsVariantBuiltIn,
+	type TabsVariantRegistry,
+	type TabsVariantType,
+} from '@/types/TabsVariant';
 /**
  * Inertia-specific options shared between `BbTabsProps` (component-level defaults)
  * and `BbTabsItem` (per-item overrides). Item values always win over component values.
@@ -545,7 +559,7 @@ export type BbTabsItem<K extends string = string> = BbTabsInertiaOptions & {
  * Passthrough parts of `BbTabs` (plans/passthrough/BbTabs.md). Tabs do not
  * "open", so there is no `open` state.
  *
- * Per-item functions: on the instance, `item` also accepts `({ item, active, … }) => PtValue | false | null | undefined` — `item` is the tab's descriptor (the element of `items`: its `value`, `label`, anything else you put on it), and every state a boolean beside it, on for it (`active`, `disabled`, …) — in the `pt` object or the `:pt:item` attribute, never on a `item:<state>` key and never in the global map or a scope (they ship as JSON). Its result is merged last, after every state entry, through the same deduper; a falsy result leaves the trigger as it was. No other part takes a function. See the passthrough guide, _Per-item functions_.
+ * Per-item functions: on the instance, `item` also accepts `({ item, active, … }) => PtValue | false | null | undefined` — `item` is the tab's descriptor (the element of `items`: its `value`, `label`, anything else you put on it), every state a boolean beside it, on for it (`active`, `disabled`, …), and the strip's `variant` as a string — in the `pt` object or the `:pt:item` attribute, never on a `item:<state>` key and never in the global map or a scope (they ship as JSON). Its result is merged last, after every state entry, through the same deduper; a falsy result leaves the trigger as it was. No other part takes a function. See the passthrough guide, _Per-item functions_.
  *
  * @part root - The tabs' outer element, around the strip and the panels.
  * @part wrapper - The strip's outer element: the `wrapper:prepend` slot, the
@@ -585,10 +599,23 @@ export type BbTabsPtState = 'active' | 'disabled';
 export const BB_TABS_PT = {
 	parts: ['root', 'wrapper', 'list', 'item', 'indicator', 'panels', 'panel'],
 	states: ['disabled', 'active'],
+	// The `variant` is a state on the strip's parts (Q76.7), below the real ones.
+	variant: {
+		names: TABS_VARIANTS,
+		option: 'tabsVariants',
+		parts: ['wrapper', 'list', 'item', 'indicator'],
+	},
 } as const satisfies {
 	parts: readonly BbTabsPtPart[];
 	states: readonly BbTabsPtState[];
+	variant: {
+		names: readonly TabsVariantBuiltIn[];
+		option: string;
+		parts: readonly BbTabsStripPtPart[];
+	};
 };
+/** The strip's parts on `BbTabs`: the ones its `variant` styles. Spelled flat (T20). */
+export type BbTabsStripPtPart = 'wrapper' | 'list' | 'item' | 'indicator';
 
 /**
  * Passthrough parts of `BbTabsList` — the strip of a split layout. The same
@@ -614,9 +641,12 @@ export type BbTabsListPtState = BbTabsPtState;
 export const BB_TABS_LIST_PT = {
 	parts: ['root', 'list', 'item', 'indicator'],
 	states: ['disabled', 'active'],
+	// The strip's `variant` is a state on every part (Q76.7).
+	variant: { names: TABS_VARIANTS, option: 'tabsVariants' },
 } as const satisfies {
 	parts: readonly BbTabsListPtPart[];
 	states: readonly BbTabsListPtState[];
+	variant: { names: readonly TabsVariantBuiltIn[]; option: string };
 };
 /** Where each `BbTabsList` part reads a `BbTabs` global / scope entry. */
 export const BB_TABS_LIST_HOST_PARTS = {
@@ -658,21 +688,39 @@ export const BB_TABS_PANELS_HOST_PARTS = {
 export type BbTabsProps<K extends string = string> = {
 	[K2 in
 		| `pt:${BbTabsSurfacePtPart}`
-		| `pt:${BbTabsPtPart}:${BbTabsPtState}`]?: PtValue;
-} & {
-	// `item` also takes a per-item function, called with the tab descriptor.
-	// A literal function type, not `PtItemFn` (PASSTHROUGH.md T23).
-	'pt:item'?:
-		| PtValue
-		| ((
-				ctx: PtItemCtx<BbTabsItem<PtNoInfer<K>>, BbTabsPtState>
-		  ) => PtItemResult);
-	/**
-	 * Passthrough, object form: the same keys as the `pt:*` attributes
-	 * without the prefix. See the `pt:<part>` row.
-	 */
-	pt?: PtItemMap<BbTabsPtPart, 'item', BbTabsPtState, BbTabsItem<PtNoInfer<K>>>;
-} & BbTabsRootProps<K>;
+		| `pt:${BbTabsPtPart}:${BbTabsPtState}`
+		| `pt:${BbTabsStripPtPart}:${TabsVariantBuiltIn}`]?: PtValue;
+} & /* @vue-ignore */ PtVariantAttrs<
+	BbTabsStripPtPart,
+	keyof TabsVariantRegistry
+> & {
+		// `item` also takes a per-item function, called with the tab descriptor.
+		// A literal function type, not `PtItemFn` (PASSTHROUGH.md T23).
+		'pt:item'?:
+			| PtValue
+			| ((
+					ctx: PtItemCtx<
+						BbTabsItem<PtNoInfer<K>>,
+						BbTabsPtState,
+						TabsVariantBuiltIn | keyof TabsVariantRegistry
+					>
+			  ) => PtItemResult);
+		/**
+		 * Passthrough, object form: the same keys as the `pt:*` attributes
+		 * without the prefix. See the `pt:<part>` row.
+		 */
+		/* eslint-disable @typescript-eslint/consistent-indexed-object-style -- mapped, never Record (T23) */
+		pt?: PtItemMap<
+			BbTabsPtPart,
+			'item',
+			BbTabsPtState,
+			BbTabsItem<PtNoInfer<K>>,
+			TabsVariantBuiltIn | keyof TabsVariantRegistry
+		> & {
+			[K2 in `${BbTabsStripPtPart}:${TabsVariantBuiltIn | keyof TabsVariantRegistry}`]?: PtValue;
+		};
+		/* eslint-enable @typescript-eslint/consistent-indexed-object-style */
+	} & BbTabsRootProps<K>;
 
 /**
  * Props of `BbTabsRoot` — `BbTabsProps` without `pt`. The root owns the whole
@@ -788,25 +836,45 @@ export type BbTabsRootProps<K extends string = string> =
 export type BbTabsListProps = {
 	[K2 in
 		| `pt:${BbTabsListSurfacePtPart}`
-		| `pt:${BbTabsListPtPart}:${BbTabsListPtState}`]?: PtValue;
-} & {
-	// `item` also takes a per-item function, called with the tab descriptor.
-	// A literal function type, not `PtItemFn` (PASSTHROUGH.md T23).
-	'pt:item'?:
-		| PtValue
-		| ((ctx: PtItemCtx<BbTabsItem, BbTabsListPtState>) => PtItemResult);
-	/**
-	 * Passthrough, object form: the same keys as the `pt:*` attributes
-	 * without the prefix. See the `pt:<part>` row.
-	 */
-	pt?: PtItemMap<BbTabsListPtPart, 'item', BbTabsListPtState, BbTabsItem>;
-} & {
-	/**
-	 * Look of this strip — the `variant` of the owning `BbTabs` / `BbTabsRoot`
-	 * unless set here. See `BbTabsProps.variant` for the values.
-	 */
-	variant?: TabsVariantType;
-};
+		| `pt:${BbTabsListPtPart}:${BbTabsListPtState}`
+		| `pt:${BbTabsListPtPart}:${TabsVariantBuiltIn}`]?: PtValue;
+} & /* @vue-ignore */ PtVariantAttrs<
+	BbTabsListPtPart,
+	keyof TabsVariantRegistry
+> & {
+		// `item` also takes a per-item function, called with the tab descriptor.
+		// A literal function type, not `PtItemFn` (PASSTHROUGH.md T23).
+		'pt:item'?:
+			| PtValue
+			| ((
+					ctx: PtItemCtx<
+						BbTabsItem,
+						BbTabsListPtState,
+						TabsVariantBuiltIn | keyof TabsVariantRegistry
+					>
+			  ) => PtItemResult);
+		/**
+		 * Passthrough, object form: the same keys as the `pt:*` attributes
+		 * without the prefix. See the `pt:<part>` row.
+		 */
+		/* eslint-disable @typescript-eslint/consistent-indexed-object-style -- mapped, never Record (T23) */
+		pt?: PtItemMap<
+			BbTabsListPtPart,
+			'item',
+			BbTabsListPtState,
+			BbTabsItem,
+			TabsVariantBuiltIn | keyof TabsVariantRegistry
+		> & {
+			[K2 in `${BbTabsListPtPart}:${TabsVariantBuiltIn | keyof TabsVariantRegistry}`]?: PtValue;
+		};
+		/* eslint-enable @typescript-eslint/consistent-indexed-object-style */
+	} & {
+		/**
+		 * Look of this strip — the `variant` of the owning `BbTabs` / `BbTabsRoot`
+		 * unless set here. See `BbTabsProps.variant` for the values.
+		 */
+		variant?: TabsVariantType;
+	};
 
 /**
  * Props of `BbTabsPanels`: its `pt` only. Everything else — items,

package/dist/ai/source/BbTabsPanels.md

@@ -95,8 +95,14 @@ import type {
 	PtMap,
 	PtNoInfer,
 	PtValue,
+	PtVariantAttrs,
 } from '@/types/passthrough';
-import type { TabsVariantType } from '@/types/TabsVariant';
+import {
+	TABS_VARIANTS,
+	type TabsVariantBuiltIn,
+	type TabsVariantRegistry,
+	type TabsVariantType,
+} from '@/types/TabsVariant';
 /**
  * Inertia-specific options shared between `BbTabsProps` (component-level defaults)
  * and `BbTabsItem` (per-item overrides). Item values always win over component values.
@@ -219,7 +225,7 @@ export type BbTabsItem<K extends string = string> = BbTabsInertiaOptions & {
  * Passthrough parts of `BbTabs` (plans/passthrough/BbTabs.md). Tabs do not
  * "open", so there is no `open` state.
  *
- * Per-item functions: on the instance, `item` also accepts `({ item, active, … }) => PtValue | false | null | undefined` — `item` is the tab's descriptor (the element of `items`: its `value`, `label`, anything else you put on it), and every state a boolean beside it, on for it (`active`, `disabled`, …) — in the `pt` object or the `:pt:item` attribute, never on a `item:<state>` key and never in the global map or a scope (they ship as JSON). Its result is merged last, after every state entry, through the same deduper; a falsy result leaves the trigger as it was. No other part takes a function. See the passthrough guide, _Per-item functions_.
+ * Per-item functions: on the instance, `item` also accepts `({ item, active, … }) => PtValue | false | null | undefined` — `item` is the tab's descriptor (the element of `items`: its `value`, `label`, anything else you put on it), every state a boolean beside it, on for it (`active`, `disabled`, …), and the strip's `variant` as a string — in the `pt` object or the `:pt:item` attribute, never on a `item:<state>` key and never in the global map or a scope (they ship as JSON). Its result is merged last, after every state entry, through the same deduper; a falsy result leaves the trigger as it was. No other part takes a function. See the passthrough guide, _Per-item functions_.
  *
  * @part root - The tabs' outer element, around the strip and the panels.
  * @part wrapper - The strip's outer element: the `wrapper:prepend` slot, the
@@ -259,10 +265,23 @@ export type BbTabsPtState = 'active' | 'disabled';
 export const BB_TABS_PT = {
 	parts: ['root', 'wrapper', 'list', 'item', 'indicator', 'panels', 'panel'],
 	states: ['disabled', 'active'],
+	// The `variant` is a state on the strip's parts (Q76.7), below the real ones.
+	variant: {
+		names: TABS_VARIANTS,
+		option: 'tabsVariants',
+		parts: ['wrapper', 'list', 'item', 'indicator'],
+	},
 } as const satisfies {
 	parts: readonly BbTabsPtPart[];
 	states: readonly BbTabsPtState[];
+	variant: {
+		names: readonly TabsVariantBuiltIn[];
+		option: string;
+		parts: readonly BbTabsStripPtPart[];
+	};
 };
+/** The strip's parts on `BbTabs`: the ones its `variant` styles. Spelled flat (T20). */
+export type BbTabsStripPtPart = 'wrapper' | 'list' | 'item' | 'indicator';
 
 /**
  * Passthrough parts of `BbTabsList` — the strip of a split layout. The same
@@ -288,9 +307,12 @@ export type BbTabsListPtState = BbTabsPtState;
 export const BB_TABS_LIST_PT = {
 	parts: ['root', 'list', 'item', 'indicator'],
 	states: ['disabled', 'active'],
+	// The strip's `variant` is a state on every part (Q76.7).
+	variant: { names: TABS_VARIANTS, option: 'tabsVariants' },
 } as const satisfies {
 	parts: readonly BbTabsListPtPart[];
 	states: readonly BbTabsListPtState[];
+	variant: { names: readonly TabsVariantBuiltIn[]; option: string };
 };
 /** Where each `BbTabsList` part reads a `BbTabs` global / scope entry. */
 export const BB_TABS_LIST_HOST_PARTS = {
@@ -332,21 +354,39 @@ export const BB_TABS_PANELS_HOST_PARTS = {
 export type BbTabsProps<K extends string = string> = {
 	[K2 in
 		| `pt:${BbTabsSurfacePtPart}`
-		| `pt:${BbTabsPtPart}:${BbTabsPtState}`]?: PtValue;
-} & {
-	// `item` also takes a per-item function, called with the tab descriptor.
-	// A literal function type, not `PtItemFn` (PASSTHROUGH.md T23).
-	'pt:item'?:
-		| PtValue
-		| ((
-				ctx: PtItemCtx<BbTabsItem<PtNoInfer<K>>, BbTabsPtState>
-		  ) => PtItemResult);
-	/**
-	 * Passthrough, object form: the same keys as the `pt:*` attributes
-	 * without the prefix. See the `pt:<part>` row.
-	 */
-	pt?: PtItemMap<BbTabsPtPart, 'item', BbTabsPtState, BbTabsItem<PtNoInfer<K>>>;
-} & BbTabsRootProps<K>;
+		| `pt:${BbTabsPtPart}:${BbTabsPtState}`
+		| `pt:${BbTabsStripPtPart}:${TabsVariantBuiltIn}`]?: PtValue;
+} & /* @vue-ignore */ PtVariantAttrs<
+	BbTabsStripPtPart,
+	keyof TabsVariantRegistry
+> & {
+		// `item` also takes a per-item function, called with the tab descriptor.
+		// A literal function type, not `PtItemFn` (PASSTHROUGH.md T23).
+		'pt:item'?:
+			| PtValue
+			| ((
+					ctx: PtItemCtx<
+						BbTabsItem<PtNoInfer<K>>,
+						BbTabsPtState,
+						TabsVariantBuiltIn | keyof TabsVariantRegistry
+					>
+			  ) => PtItemResult);
+		/**
+		 * Passthrough, object form: the same keys as the `pt:*` attributes
+		 * without the prefix. See the `pt:<part>` row.
+		 */
+		/* eslint-disable @typescript-eslint/consistent-indexed-object-style -- mapped, never Record (T23) */
+		pt?: PtItemMap<
+			BbTabsPtPart,
+			'item',
+			BbTabsPtState,
+			BbTabsItem<PtNoInfer<K>>,
+			TabsVariantBuiltIn | keyof TabsVariantRegistry
+		> & {
+			[K2 in `${BbTabsStripPtPart}:${TabsVariantBuiltIn | keyof TabsVariantRegistry}`]?: PtValue;
+		};
+		/* eslint-enable @typescript-eslint/consistent-indexed-object-style */
+	} & BbTabsRootProps<K>;
 
 /**
  * Props of `BbTabsRoot` — `BbTabsProps` without `pt`. The root owns the whole
@@ -462,25 +502,45 @@ export type BbTabsRootProps<K extends string = string> =
 export type BbTabsListProps = {
 	[K2 in
 		| `pt:${BbTabsListSurfacePtPart}`
-		| `pt:${BbTabsListPtPart}:${BbTabsListPtState}`]?: PtValue;
-} & {
-	// `item` also takes a per-item function, called with the tab descriptor.
-	// A literal function type, not `PtItemFn` (PASSTHROUGH.md T23).
-	'pt:item'?:
-		| PtValue
-		| ((ctx: PtItemCtx<BbTabsItem, BbTabsListPtState>) => PtItemResult);
-	/**
-	 * Passthrough, object form: the same keys as the `pt:*` attributes
-	 * without the prefix. See the `pt:<part>` row.
-	 */
-	pt?: PtItemMap<BbTabsListPtPart, 'item', BbTabsListPtState, BbTabsItem>;
-} & {
-	/**
-	 * Look of this strip — the `variant` of the owning `BbTabs` / `BbTabsRoot`
-	 * unless set here. See `BbTabsProps.variant` for the values.
-	 */
-	variant?: TabsVariantType;
-};
+		| `pt:${BbTabsListPtPart}:${BbTabsListPtState}`
+		| `pt:${BbTabsListPtPart}:${TabsVariantBuiltIn}`]?: PtValue;
+} & /* @vue-ignore */ PtVariantAttrs<
+	BbTabsListPtPart,
+	keyof TabsVariantRegistry
+> & {
+		// `item` also takes a per-item function, called with the tab descriptor.
+		// A literal function type, not `PtItemFn` (PASSTHROUGH.md T23).
+		'pt:item'?:
+			| PtValue
+			| ((
+					ctx: PtItemCtx<
+						BbTabsItem,
+						BbTabsListPtState,
+						TabsVariantBuiltIn | keyof TabsVariantRegistry
+					>
+			  ) => PtItemResult);
+		/**
+		 * Passthrough, object form: the same keys as the `pt:*` attributes
+		 * without the prefix. See the `pt:<part>` row.
+		 */
+		/* eslint-disable @typescript-eslint/consistent-indexed-object-style -- mapped, never Record (T23) */
+		pt?: PtItemMap<
+			BbTabsListPtPart,
+			'item',
+			BbTabsListPtState,
+			BbTabsItem,
+			TabsVariantBuiltIn | keyof TabsVariantRegistry
+		> & {
+			[K2 in `${BbTabsListPtPart}:${TabsVariantBuiltIn | keyof TabsVariantRegistry}`]?: PtValue;
+		};
+		/* eslint-enable @typescript-eslint/consistent-indexed-object-style */
+	} & {
+		/**
+		 * Look of this strip — the `variant` of the owning `BbTabs` / `BbTabsRoot`
+		 * unless set here. See `BbTabsProps.variant` for the values.
+		 */
+		variant?: TabsVariantType;
+	};
 
 /**
  * Props of `BbTabsPanels`: its `pt` only. Everything else — items,