bitboss-ui 3.0.0-beta.63 → 3.0.0-beta.65

package/dist/components/BbRadioGroup/BbRadioGroup.vue_vue_type_script_setup_true_lang.js

@@ -1,30 +1,32 @@
 import { isNotEmpty as e } from "../../utilities/functions/isNotEmpty.js";
-import { aliasParts as t, formControlPtActive as n, pickActive as r, usePassthrough as i } from "../../composables/usePassthrough.js";
-import { hash as a } from "../../utilities/functions/hash.js";
-import { useId as o } from "../../composables/useId.js";
-import { removedPropsFor as s } from "../../deprecation/removedProps.js";
-import { warnRemovedAttrs as c } from "../../utilities/functions/warnRemovedAttrs.js";
-import { useItemsGetter as l } from "../../composables/useItemsGetter.js";
-import { withItemDescribedby as u } from "../../utilities/functions/itemProps.js";
-import { useHashedWatcher as d } from "../../composables/useHashedWatcher.js";
-import { vAutofocus as ee } from "../../utilities/misc/autofocus.js";
-import te from "../CommonField/CommonField.vue.js";
-import { preventReadonlyClick as ne, preventReadonlyKeydown as re, revertReadonlyChange as ie, toggleInputAttrs as ae, toggleInputValue as oe } from "../../utilities/functions/toggleInput.js";
-import { useToggleListFocus as se } from "../../composables/useToggleInput.js";
-import { useFormBinding as ce } from "../../composables/useFormBinding.js";
-import le from "../OptionsContainer/OptionsContainer.vue.js";
-import { useIndexById as f } from "../../composables/useIndexById.js";
-import { useBaseOptions as p } from "../../composables/useBaseOptions.js";
-import { useCoherence as m } from "../../composables/useCoherence.js";
-import { usePrefill as ue } from "../../composables/usePrefill.js";
-import { useActiveInactiveState as de } from "../../composables/useActiveInactiveState.js";
-import { useOnFalsy as fe } from "../../composables/useOnFalsy.js";
-import { useOnTruthy as pe } from "../../composables/useOnTruthy.js";
-import me from "../BbBaseRadioIcon/BbBaseRadioIcon.vue.js";
+import { aliasParts as t, formControlPtActive as n, pickActive as r, usePassthrough as i, variantPt as a } from "../../composables/usePassthrough.js";
+import { hash as o } from "../../utilities/functions/hash.js";
+import { useId as s } from "../../composables/useId.js";
+import { removedPropsFor as c } from "../../deprecation/removedProps.js";
+import { warnRemovedAttrs as l } from "../../utilities/functions/warnRemovedAttrs.js";
+import { useItemsGetter as ee } from "../../composables/useItemsGetter.js";
+import { withItemDescribedby as te } from "../../utilities/functions/itemProps.js";
+import { useHashedWatcher as u } from "../../composables/useHashedWatcher.js";
+import { vAutofocus as d } from "../../utilities/misc/autofocus.js";
+import f from "../CommonField/CommonField.vue.js";
+import { preventReadonlyClick as p, preventReadonlyKeydown as ne, revertReadonlyChange as re, toggleInputAttrs as ie, toggleInputValue as ae } from "../../utilities/functions/toggleInput.js";
+import { useToggleListFocus as oe } from "../../composables/useToggleInput.js";
+import { useFormBinding as se } from "../../composables/useFormBinding.js";
+import ce from "../OptionsContainer/OptionsContainer.vue.js";
+import { useChoiceIndicator as le } from "../../composables/useChoiceIndicator.js";
+import { useIndexById as m } from "../../composables/useIndexById.js";
+import { useBaseOptions as ue } from "../../composables/useBaseOptions.js";
+import { useCoherence as de } from "../../composables/useCoherence.js";
+import { usePrefill as fe } from "../../composables/usePrefill.js";
+import { useActiveInactiveState as pe } from "../../composables/useActiveInactiveState.js";
+import { useOnFalsy as me } from "../../composables/useOnFalsy.js";
+import { useOnTruthy as he } from "../../composables/useOnTruthy.js";
+import ge from "../BbBaseRadioIcon/BbBaseRadioIcon.vue.js";
 import { BB_RADIO_GROUP_PT as h } from "./types.js";
-import { computed as g, createBlock as he, createElementVNode as ge, createSlots as _e, createVNode as _, defineComponent as v, guardReactiveProps as y, mergeProps as b, nextTick as ve, normalizeProps as x, openBlock as ye, ref as be, renderSlot as S, shallowRef as xe, toRef as C, unref as w, useAttrs as T, useSlots as E, withCtx as D, withDirectives as O } from "vue";
+import { Fragment as _e, computed as g, createBlock as ve, createElementBlock as _, createElementVNode as v, createSlots as ye, createVNode as y, defineComponent as b, guardReactiveProps as x, mergeProps as S, nextTick as be, normalizeProps as C, openBlock as w, ref as xe, renderList as Se, renderSlot as T, shallowRef as E, toRef as D, unref as O, useAttrs as k, useSlots as A, withCtx as j, withDirectives as Ce } from "vue";
 //#region src/components/BbRadioGroup/BbRadioGroup.vue?vue&type=script&setup=true&lang.ts
-var k = /*@__PURE__*/ v({
+var M = /*@__PURE__*/ b({
+	mixins: [a(h)],
 	inheritAttrs: !1,
 	__name: "BbRadioGroup",
 	props: {
@@ -34,6 +36,7 @@ var k = /*@__PURE__*/ v({
 		"pt:message": {},
 		"pt:hint": {},
 		"pt:list": {},
+		"pt:indicator": {},
 		"pt:root:hasValue": {},
 		"pt:root:readonly": {},
 		"pt:root:disabled": {},
@@ -70,6 +73,26 @@ var k = /*@__PURE__*/ v({
 		"pt:list:warnings": {},
 		"pt:list:errors": {},
 		"pt:list:loading": {},
+		"pt:indicator:hasValue": {},
+		"pt:indicator:readonly": {},
+		"pt:indicator:disabled": {},
+		"pt:indicator:warnings": {},
+		"pt:indicator:errors": {},
+		"pt:indicator:loading": {},
+		"pt:root:pill": {},
+		"pt:root:line": {},
+		"pt:legend:pill": {},
+		"pt:legend:line": {},
+		"pt:description:pill": {},
+		"pt:description:line": {},
+		"pt:message:pill": {},
+		"pt:message:line": {},
+		"pt:hint:pill": {},
+		"pt:hint:line": {},
+		"pt:list:pill": {},
+		"pt:list:line": {},
+		"pt:indicator:pill": {},
+		"pt:indicator:line": {},
 		"pt:item:hasValue": {},
 		"pt:item:checked": {},
 		"pt:item:readonly": {},
@@ -106,6 +129,14 @@ var k = /*@__PURE__*/ v({
 		"pt:itemDescription:focused": {},
 		"pt:itemDescription:focusVisible": {},
 		"pt:itemDescription:loading": {},
+		"pt:item:pill": {},
+		"pt:item:line": {},
+		"pt:icon:pill": {},
+		"pt:icon:line": {},
+		"pt:label:pill": {},
+		"pt:label:line": {},
+		"pt:itemDescription:pill": {},
+		"pt:itemDescription:line": {},
 		"pt:item": {},
 		"pt:icon": {},
 		"pt:label": {},
@@ -141,6 +172,7 @@ var k = /*@__PURE__*/ v({
 		legendPosition: {},
 		legend: {},
 		legendMode: {},
+		variant: {},
 		listLayout: {},
 		loadingText: {},
 		modelValue: {},
@@ -174,66 +206,70 @@ var k = /*@__PURE__*/ v({
 		"mouseup",
 		"update:modelValue"
 	],
-	setup(v, { emit: k }) {
-		let A = v, j = k, M = E(), { props: N, emit: P, showAsterisk: Se, errors: Ce, ariaRequired: we, readonly: F } = ce(A, j, {
+	setup(a, { emit: b }) {
+		let M = a, we = b, Te = A(), { props: N, emit: P, showAsterisk: Ee, errors: De, ariaRequired: Oe, readonly: F } = se(M, we, {
 			componentName: "BbRadioGroup",
-			identifierFallback: () => A.legend,
+			identifierFallback: () => M.legend,
 			leaveOn: "inactive"
-		}), I = () => !!N.legend || !!M.legend;
-		process.env.NODE_ENV !== "production" && c("BbRadioGroup", s("BbRadioGroup"));
-		let Te = o().id, L = g(() => N.name || Te.value), Ee = [], R = g(() => N.items === void 0 ? Ee : N.items), z = xe(null), De = (e) => {
+		}), I = () => !!N.legend || !!Te.legend;
+		process.env.NODE_ENV !== "production" && l("BbRadioGroup", c("BbRadioGroup"));
+		let ke = s().id, L = g(() => N.name || ke.value), Ae = [], R = g(() => N.items === void 0 ? Ae : N.items), z = E(null), je = (e) => {
 			z.value = e?.$el ?? null;
-		}, { active: B } = de(z), V = be(!1), Oe = g(() => N.persistentHint || V.value);
-		fe(B, () => {
+		}, { active: B } = pe(z), V = xe(!1), Me = g(() => N.persistentHint || V.value);
+		me(B, () => {
 			V.value = !1, P("inactive");
-		}), pe(B, () => {
+		}), he(B, () => {
 			V.value = !0, P("active");
 		});
-		let { getter: H, clientReproducible: ke, hydratedFromSsr: Ae, items: je, loading: U, error: Me, ssrMarker: Ne } = l({
+		let { getter: H, clientReproducible: Ne, hydratedFromSsr: Pe, items: Fe, loading: U, error: Ie, ssrMarker: Le } = ee({
 			items: R,
 			marker: !0
 		}), W = () => {
-			N.enforceCoherence && !J.value && P("update:modelValue", null);
-		}, { hasPrefilled: G, whenPrefilled: Pe } = ue({
-			alreadyLoaded: Ae,
-			clientReproducible: ke,
+			N.enforceCoherence && !q.value && P("update:modelValue", null);
+		}, { hasPrefilled: G, whenPrefilled: Re } = fe({
+			alreadyLoaded: Pe,
+			clientReproducible: Ne,
 			trigger: !0,
 			currentValue: N.modelValue,
 			multiple: !1,
 			fn: async () => {
 				await H(void 0, "initial", N.modelValue) === "applied" && W();
 			}
-		}), { data: K } = f({ items: g(() => [N.modelValue]) }), { options: q } = p({
-			disabled: C(N, "disabled"),
-			items: je,
+		}), { data: ze } = m({ items: g(() => [N.modelValue]) }), { options: K } = ue({
+			disabled: D(N, "disabled"),
+			items: Fe,
 			itemText: N.itemText,
-			itemProps: C(N, "itemProps"),
+			itemProps: D(N, "itemProps"),
 			itemValue: N.itemValue,
 			optionDefaults: !0,
 			max: Infinity,
-			selectable: C(N, "selectable"),
-			selectedIndexedByHash: K
-		}), { data: Fe } = f({
-			items: q,
+			selectable: D(N, "selectable"),
+			selectedIndexedByHash: ze
+		}), { data: Be } = m({
+			items: K,
 			key: "valueHash"
-		}), { coherent: J } = m({
-			modelValue: C(N, "modelValue"),
+		}), { coherent: q } = de({
+			modelValue: D(N, "modelValue"),
 			multiple: !1,
-			iteratee: (e) => !!Fe.value[a(e)]
-		}), Y = 0;
-		d(() => N.modelValue, async () => {
-			Y++, J.value || await H(void 0, "model", N.modelValue) === "applied" && W(), Y--;
-		}, { debounce: N.modelValueDebounceTime === void 0 ? 0 : N.modelValueDebounceTime }), d(() => [N.dependencies, R.value], async () => {
-			G.value || await Pe(), G.value && (Y++, await H(void 0, "dependencies", N.modelValue) === "applied" && Y === 1 && W(), Y--);
+			iteratee: (e) => !!Be.value[o(e)]
+		}), J = 0;
+		u(() => N.modelValue, async () => {
+			J++, q.value || await H(void 0, "model", N.modelValue) === "applied" && W(), J--;
+		}, { debounce: N.modelValueDebounceTime === void 0 ? 0 : N.modelValueDebounceTime }), u(() => [N.dependencies, R.value], async () => {
+			G.value || await Re(), G.value && (J++, await H(void 0, "dependencies", N.modelValue) === "applied" && J === 1 && W(), J--);
 		}, { debounce: N.depsDebounceTime === void 0 ? 0 : N.depsDebounceTime });
-		let X = g(() => e(N.modelValue)), Z = i({
+		let Y = g(() => e(N.modelValue)), X = i({
 			component: "BbRadioGroup",
-			attrs: T(),
+			attrs: k(),
 			props: N,
 			parts: h.parts,
 			states: h.states,
+			variant: {
+				...h.variant,
+				current: () => N.variant
+			},
 			active: {
-				...r(n(N, () => X.value), [
+				...r(n(N, () => Y.value), [
 					"errors",
 					"warnings",
 					"disabled",
@@ -242,39 +278,46 @@ var k = /*@__PURE__*/ v({
 				]),
 				loading: () => U.value
 			}
-		}), Ie = t(Z, { label: "legend" }), Q = se(), $ = (e, t) => {
+		}), Z = g(() => N.listLayout === "vertical" || N.listLayout === "vertical-stretch"), { boxes: Ve, ready: He, styleOf: Ue } = le({
+			kind: "radio",
+			variant: () => N.variant,
+			vertical: () => Z.value,
+			list: () => z.value,
+			rows: () => K.value,
+			rowClass: "bb-radio-group__item"
+		}), We = t(X, { label: "legend" }), Q = oe(), $ = (e, t) => {
 			if (t) return [t, e.valueHash].filter(Boolean).join("-");
-		}, Le = () => {
+		}, Ge = () => {
 			let e = z.value?.querySelectorAll("input[type=\"radio\"]") ?? [];
-			e.length === q.value.length && q.value.forEach((t, n) => {
+			e.length === K.value.length && K.value.forEach((t, n) => {
 				e[n].checked = !!t.selected;
 			});
-		}, Re = (e) => ({
+		}, Ke = (e) => ({
 			onBlur: (t) => {
 				Q.onBlur(e.valueHash), P("blur", t);
 			},
 			onChange: (t) => {
 				if (N.readonly) {
-					t.target instanceof HTMLInputElement && ie(t.target, N.readonly, !!e.selected);
+					t.target instanceof HTMLInputElement && re(t.target, N.readonly, !!e.selected);
 					return;
 				}
-				P("change", t), P("update:modelValue", e.value), ve(Le);
+				P("change", t), P("update:modelValue", e.value), be(Ge);
 			},
 			onClick: (e) => {
-				ne(e, N.readonly), P("click", e);
+				p(e, N.readonly), P("click", e);
 			},
 			onFocus: (t) => {
 				Q.onFocus(e.valueHash, t), V.value = !0, P("focus", t);
 			},
 			onInput: (e) => P("input", e),
 			onKeydown: (e) => {
-				re(e, N.readonly), P("keydown", e);
+				ne(e, N.readonly), P("keydown", e);
 			},
 			onMousedown: (e) => P("mousedown", e),
 			onMouseup: (e) => P("mouseup", e)
-		}), ze = (e, t, n, r, i, a) => ({
-			...ae("radio", {
-				ariaDescribedby: u(r, a),
+		}), qe = (e, t, n, r, i, a) => ({
+			...ie("radio", {
+				ariaDescribedby: te(r, a),
 				ariaLabelledby: i,
 				autofocus: N.autofocus && !t,
 				checked: !!e.selected,
@@ -285,8 +328,8 @@ var k = /*@__PURE__*/ v({
 				required: N.required,
 				value: e.value
 			}),
-			...Re(e)
-		}), Be = (e, t, n, r) => ({
+			...Ke(e)
+		}), Je = (e, t, n, r) => ({
 			checked: !!e.selected,
 			disabled: !!e.disabled,
 			focused: Q.focused(e.valueHash),
@@ -295,19 +338,19 @@ var k = /*@__PURE__*/ v({
 			hasWarnings: !!r && !n,
 			id: $(e, t),
 			name: L.value,
-			parsedValue: oe("radio", e.value),
+			parsedValue: ae("radio", e.value),
 			readonly: !!N.readonly,
 			value: e.value
 		});
-		return (e, t) => (ye(), he(te, b({
+		return (e, t) => (w(), ve(f, S({
 			id: e.id,
 			class: "bb-radio-group",
 			compact: e.compact,
 			description: e.description,
 			disabled: e.disabled,
-			errors: w(Ce),
+			errors: O(De),
 			"has-errors": e.hasErrors,
-			"has-value": X.value,
+			"has-value": Y.value,
 			"has-warnings": e.hasWarnings,
 			"hide-label": e.hideLegend,
 			hint: e.hint,
@@ -319,57 +362,65 @@ var k = /*@__PURE__*/ v({
 			"label-position": e.legendPosition,
 			"label-tag": "legend",
 			layout: e.layout,
-			loading: w(U),
+			loading: O(U),
 			name: L.value,
-			passthrough: w(Ie),
-			readonly: w(F),
+			passthrough: O(We),
+			readonly: O(F),
 			reverse: e.reverse,
-			"show-asterisk": w(Se),
-			"show-hint": Oe.value,
-			"ssr-marker": w(Ne),
+			"show-asterisk": O(Ee),
+			"show-hint": Me.value,
+			"ssr-marker": O(Le),
 			tag: "fieldset",
 			warnings: e.warnings
-		}, w(Z).forwardAttrs), _e({
-			label: D((t) => [S(e.$slots, "legend", x(y(t)))]),
-			input: D(({ id: t, hasErrors: n, hasWarnings: r, ariaDescribedby: i }) => [_(le, {
-				ref: De,
+		}, O(X).forwardAttrs), ye({
+			label: j((t) => [T(e.$slots, "legend", C(x(t)))]),
+			input: j(({ id: t, hasErrors: n, hasWarnings: r, ariaDescribedby: i }) => [y(ce, {
+				ref: je,
 				"aria-labelledby": I() ? `${t}__label` : void 0,
-				"aria-readonly": I() && w(F) ? !0 : void 0,
-				"aria-required": I() ? w(we) : void 0,
+				"aria-readonly": I() && O(F) ? !0 : void 0,
+				"aria-required": I() ? O(Oe) : void 0,
 				block: "bb-radio-group",
 				"empty-text": e.emptyText,
-				error: w(Me),
+				error: O(Ie),
 				"failed-text": e.failedText,
 				"has-errors": n,
 				"has-warnings": r,
 				"hide-label": e.hideLabel,
+				"indicator-ready": O(He),
 				"item-input-align": e.itemInputAlign,
 				"item-label-align": e.itemLabelAlign,
 				"item-layout": e.itemLayout,
 				"item-reverse": e.itemReverse,
 				"list-layout": e.listLayout,
-				loading: !!w(U),
+				loading: !!O(U),
 				"loading-text": e.loadingText,
-				options: w(q),
-				passthrough: w(Z),
-				role: I() ? "radiogroup" : void 0
+				options: O(K),
+				passthrough: O(X),
+				role: I() ? "radiogroup" : void 0,
+				variant: e.variant
 			}, {
-				prepend: D(() => [S(e.$slots, "prepend")]),
-				loading: D(() => [S(e.$slots, "loading")]),
-				empty: D((t) => [S(e.$slots, "empty", x(y(t)))]),
-				label: D((t) => [S(e.$slots, "label", x(y(t)))]),
-				input: D(({ option: a, index: o, labelId: s, descriptionId: c, rowStates: l }) => [O(ge("input", x(y(ze(a, o, t, i, s, c))), null, 16), [[w(ee)]]), S(e.$slots, "icon", b({
+				prepend: j(() => [(w(!0), _(_e, null, Se(O(Ve), (e) => (w(), _("span", S({
+					key: e.key,
+					"aria-hidden": "true",
+					class: "bb-radio-group__indicator",
+					style: O(Ue)(e),
+					ref_for: !0
+				}, O(X).indicator), null, 16))), 128)), T(e.$slots, "prepend")]),
+				loading: j(() => [T(e.$slots, "loading")]),
+				empty: j((t) => [T(e.$slots, "empty", C(x(t)))]),
+				label: j((t) => [T(e.$slots, "label", C(x(t)))]),
+				input: j(({ option: a, index: o, labelId: s, descriptionId: c, rowStates: l }) => [Ce(v("input", C(x(qe(a, o, t, i, s, c))), null, 16), [[O(d)]]), T(e.$slots, "icon", S({
 					item: a.item,
 					text: a.text
-				}, Be(a, t, n, r)), () => [_(me, b({
+				}, Je(a, t, n, r)), () => [y(ge, S({
 					checked: !!a.selected,
 					disabled: !!a.disabled,
-					"focus-visible": w(Q).focusVisible(a.valueHash),
-					focused: w(Q).focused(a.valueHash),
+					"focus-visible": O(Q).focusVisible(a.valueHash),
+					focused: O(Q).focused(a.valueHash),
 					"has-errors": !!n,
 					"has-warnings": !!r && !n,
-					readonly: !!w(F)
-				}, w(Z).part("icon", l, a.item)), null, 16, [
+					readonly: !!O(F)
+				}, O(X).part("icon", l, a.item)), null, 16, [
 					"checked",
 					"disabled",
 					"focus-visible",
@@ -378,7 +429,7 @@ var k = /*@__PURE__*/ v({
 					"has-warnings",
 					"readonly"
 				])])]),
-				append: D(() => [S(e.$slots, "append")]),
+				append: j(() => [T(e.$slots, "append")]),
 				_: 2
 			}, 1032, [
 				"aria-labelledby",
@@ -390,6 +441,7 @@ var k = /*@__PURE__*/ v({
 				"has-errors",
 				"has-warnings",
 				"hide-label",
+				"indicator-ready",
 				"item-input-align",
 				"item-label-align",
 				"item-layout",
@@ -399,15 +451,16 @@ var k = /*@__PURE__*/ v({
 				"loading-text",
 				"options",
 				"passthrough",
-				"role"
+				"role",
+				"variant"
 			])]),
 			_: 2
 		}, [e.$slots.description ? {
 			name: "description",
-			fn: D((t) => [S(e.$slots, "description", x(y(t)))]),
+			fn: j((t) => [T(e.$slots, "description", C(x(t)))]),
 			key: "0"
 		} : void 0]), 1040, /* @__PURE__ */ "id.compact.description.disabled.errors.has-errors.has-value.has-warnings.hide-label.hint.input-align.input-position.label.label-align.label-mode.label-position.layout.loading.name.passthrough.readonly.reverse.show-asterisk.show-hint.ssr-marker.warnings".split(".")));
 	}
 });
 //#endregion
-export { k as default };
+export { M as default };

package/dist/components/BbRadioGroup/types.d.ts

@@ -1,7 +1,8 @@
 import { Responsive } from '../../types/ResponsiveSize';
+import { RadioVariantBuiltIn, RadioVariantRegistry, RadioVariantType } from '../../types/RadioVariant';
 import { BbOptionGroupItemProps } from '../../types/ItemProps';
 import { HTMLAttributes, InputHTMLAttributes } from 'vue';
-import { GroupFieldPtPart, GroupPtMap, GroupRowPtPart, GroupWidePtState, GroupPtPart, GroupPtState, PtItemCtx, PtNoInfer, PtItemResult, PtValue } from '../../types/passthrough';
+import { PtVariantAttrs, ChoiceFieldPtPart, ChoicePtMap, ChoicePtPart, GroupRowPtPart, GroupWidePtState, GroupPtState, PtItemCtx, PtNoInfer, PtItemResult, PtValue } from '../../types/passthrough';
 import { FieldCrossAlign, FieldLayout, ListLayout } from '../../types/FieldLayout';
 import { ItemAccessor } from '../../types/ItemAccessor';
 import { BbRadioGroupItemsContext } from '../../types/ItemsProvider';
@@ -13,27 +14,33 @@ import { CommonFieldAsteriskSlotProps } from '../CommonField/types';
  *
  * Per-item functions: on the instance, a row part (`item`, `icon`, `label`, `itemDescription`) also accepts `({ item, checked, … }) => PtValue | false | null | undefined` — `item` is the raw item of that row, and every state a boolean beside it, on for it (`checked`, `disabled`, …) — in the `pt` object or the `:pt:<part>` attribute, never on a `<part>:<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 row as it was. See the passthrough guide, _Per-item functions_.
  */
-export type BbRadioGroupPtPart = GroupPtPart;
+export type BbRadioGroupPtPart = ChoicePtPart;
 /** Passthrough states of `BbRadioGroup`, true while the matching `--` modifier is on. */
 export type BbRadioGroupPtState = GroupPtState;
 /** The runtime lists the resolver is wired with — kept next to the types so the two cannot drift. */
 export declare const BB_RADIO_GROUP_PT: {
-    readonly parts: readonly ["root", "legend", "description", "message", "hint", "list", "item", "icon", "label", "itemDescription"];
+    readonly parts: readonly ["root", "legend", "description", "message", "hint", "list", "item", "icon", "label", "itemDescription", "indicator"];
     readonly states: readonly ["hasValue", "checked", "readonly", "disabled", "warnings", "errors", "focused", "focusVisible", "loading"];
     /** `rowStates` are declared on `rowParts` only — the field parts never have them. */
     readonly rowParts: readonly ["item", "icon", "label", "itemDescription"];
     readonly rowStates: readonly ["checked", "focused", "focusVisible"];
+    readonly variant: {
+        readonly names: readonly ["pill", "line"];
+        readonly option: "radioVariants";
+    };
 };
 export type BbRadioGroupProps<T> = {
-    [K in `pt:${GroupFieldPtPart}` | `pt:${GroupFieldPtPart}:${GroupWidePtState}` | `pt:${GroupRowPtPart}:${BbRadioGroupPtState}`]?: PtValue;
-} & {
-    [K in `pt:${GroupRowPtPart}`]?: PtValue | ((ctx: PtItemCtx<PtNoInfer<T>, BbRadioGroupPtState>) => PtItemResult);
+    [K in `pt:${ChoiceFieldPtPart}` | `pt:${ChoiceFieldPtPart}:${GroupWidePtState}` | `pt:${ChoiceFieldPtPart}:${RadioVariantBuiltIn}` | `pt:${GroupRowPtPart}:${BbRadioGroupPtState}` | `pt:${GroupRowPtPart}:${RadioVariantBuiltIn}`]?: PtValue;
+} & /* @vue-ignore */ PtVariantAttrs<ChoicePtPart, keyof RadioVariantRegistry> & {
+    [K in `pt:${GroupRowPtPart}`]?: PtValue | ((ctx: PtItemCtx<PtNoInfer<T>, BbRadioGroupPtState, RadioVariantBuiltIn | keyof RadioVariantRegistry>) => PtItemResult);
 } & {
     /**
      * Passthrough, object form: the same keys as the `pt:*` attributes
      * without the prefix. See the `pt:<part>` row.
      */
-    pt?: GroupPtMap<PtNoInfer<T>>;
+    pt?: ChoicePtMap<PtNoInfer<T>> & {
+        [K in `${ChoicePtPart}:${RadioVariantBuiltIn | keyof RadioVariantRegistry}`]?: PtValue;
+    };
     /**
      * Focuses the field when it mounts (a dialog already open included), unless the user is typing in another field.
      */
@@ -202,6 +209,13 @@ export type BbRadioGroupProps<T> = {
      * Floating mode is not supported for radio groups.
      */
     legendMode?: 'outside' | 'inside';
+    /**
+     * A tab-strip look (Q76.11 d): `'pill'` (a raised pill under the pick) or
+     * `'line'` (a bar on a baseline); the indicator slides like a tab strip's.
+     * `list-layout="vertical"` stacks it. Register more with `radioVariants`.
+     * Unset: the group's own rows.
+     */
+    variant?: RadioVariantType;
     /**
      * How the rows sit in the list: `'horizontal'` (on a line, wrapping),
      * `'vertical'` (stacked), `'vertical-stretch'` (stacked, as wide as the

package/dist/components/BbRadioGroup/types.js

@@ -1,10 +1,15 @@
-import { GROUP_PT_PARTS as e, GROUP_PT_STATES as t, GROUP_ROW_PT_PARTS as n, GROUP_ROW_PT_STATES as r } from "../../types/passthrough.js";
+import { CHOICE_PT_PARTS as e, GROUP_PT_STATES as t, GROUP_ROW_PT_PARTS as n, GROUP_ROW_PT_STATES as r } from "../../types/passthrough.js";
+import { RADIO_VARIANTS as i } from "../../types/RadioVariant.js";
 //#region src/components/BbRadioGroup/types.ts
-var i = {
+var a = {
 	parts: e,
 	states: t,
 	rowParts: n,
-	rowStates: r
+	rowStates: r,
+	variant: {
+		names: i,
+		option: "radioVariants"
+	}
 };
 //#endregion
-export { i as BB_RADIO_GROUP_PT };
+export { a as BB_RADIO_GROUP_PT };

package/dist/components/BbSelect/BbSelect.vue.d.ts

@@ -1,6 +1,7 @@
+import { BbSelectKnownItems } from '../BbSelectPopover/types';
 import { BbSelectProps, BbSelectEvents, BbSelectSlots } from './types';
-declare const __VLS_export: <T = any>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_exposed?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
-    props: import('vue').PublicProps & __VLS_PrettifyLocal<BbSelectProps<T> & {
+declare const __VLS_export: <T = any, Known extends BbSelectKnownItems | undefined = undefined>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_exposed?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
+    props: import('vue').PublicProps & __VLS_PrettifyLocal<BbSelectProps<T, Known> & {
         onActive?: (() => any) | undefined;
         onInput?: ((event: Event) => any) | undefined;
         onBlur?: ((event: FocusEvent) => any) | undefined;
@@ -19,7 +20,7 @@ declare const __VLS_export: <T = any>(__VLS_props: NonNullable<Awaited<typeof __
     } ? P : {});
     expose: (exposed: {}) => void;
     attrs: any;
-    slots: BbSelectSlots<T>;
+    slots: BbSelectSlots<T, Known>;
     emit: BbSelectEvents;
 }>) => import('vue').VNode & {
     __ctx?: Awaited<typeof __VLS_setup>;