bitboss-ui 3.0.0-beta.48 → 3.0.0-beta.49

package/dist/ai/source/BbOffCanvas.md

@@ -1428,12 +1428,14 @@ export type BbOffCanvasSlots = {
 	}
 	&.bb-offcanvas--right::after {
 		bottom: 0;
+		/* stylelint-disable-next-line property-disallowed-list -- geometry: the `side` prop names a physical edge */
 		left: 100%;
 		top: 0;
 		width: var(--stack-fill);
 	}
 	&.bb-offcanvas--left::after {
 		bottom: 0;
+		/* stylelint-disable-next-line property-disallowed-list -- geometry: the `side` prop names a physical edge */
 		right: 100%;
 		top: 0;
 		width: var(--stack-fill);
@@ -1441,13 +1443,13 @@ export type BbOffCanvasSlots = {
 	&.bb-offcanvas--top::after {
 		bottom: 100%;
 		height: var(--stack-fill);
-		left: 0;
-		right: 0;
+		inset-inline-end: 0;
+		inset-inline-start: 0;
 	}
 	&.bb-offcanvas--bottom::after {
 		height: var(--stack-fill);
-		left: 0;
-		right: 0;
+		inset-inline-end: 0;
+		inset-inline-start: 0;
 		top: 100%;
 	}
 
@@ -1474,6 +1476,7 @@ export type BbOffCanvasSlots = {
 		--inset-left: var(--safe-left);
 		--translate-x: -100%;
 		border-radius: 0 var(--bb-radius-surface) var(--bb-radius-surface) 0;
+		/* stylelint-disable-next-line property-disallowed-list -- geometry: the `side` prop names a physical edge */
 		left: 0px;
 		transform-origin: left center;
 	}
@@ -1483,14 +1486,17 @@ export type BbOffCanvasSlots = {
 		--inset-bottom: var(--safe-bottom);
 		--translate-x: 100%;
 		border-radius: var(--bb-radius-surface) 0 0 var(--bb-radius-surface);
+		/* stylelint-disable-next-line property-disallowed-list -- geometry: the `side` prop names a physical edge */
 		left: auto;
+		/* stylelint-disable-next-line property-disallowed-list -- geometry: the `side` prop names a physical edge */
 		right: 0px;
 		transform-origin: right center;
 	}
 	&.bb-offcanvas--top,
 	&.bb-offcanvas--bottom {
 		height: var(--max-size);
-		left: 0;
+		inset-inline-end: 0;
+		inset-inline-start: 0;
 		/* `height` already applies `--max-size` (a length or the `fit-content`
 		   keyword for `size="auto"`); this only caps the panel to the viewport so a
 		   tall/auto sheet scrolls internally instead of overflowing off-screen. Must
@@ -1498,7 +1504,6 @@ export type BbOffCanvasSlots = {
 		   drop the cap entirely, letting a bottom sheet run past the top edge. */
 		max-height: 100%;
 		max-width: 100%;
-		right: 0;
 		width: 100%;
 	}
 	&.bb-offcanvas--top {
@@ -1630,10 +1635,12 @@ export type BbOffCanvasSlots = {
 		   top-right), a right drawer (its top-left). */
 		&.bb-offcanvas--bottom > .bb-offcanvas__header,
 		&.bb-offcanvas--bottom.bb-offcanvas--no-header > .bb-offcanvas__content {
+			/* stylelint-disable-next-line property-disallowed-list -- geometry: the `side` prop names a physical edge */
 			border-top-left-radius: max(
 				0px,
 				calc(var(--bb-radius-surface) - var(--bb-border-w))
 			);
+			/* stylelint-disable-next-line property-disallowed-list -- geometry: the `side` prop names a physical edge */
 			border-top-right-radius: max(
 				0px,
 				calc(var(--bb-radius-surface) - var(--bb-border-w))
@@ -1641,6 +1648,7 @@ export type BbOffCanvasSlots = {
 		}
 		&.bb-offcanvas--left > .bb-offcanvas__header,
 		&.bb-offcanvas--left.bb-offcanvas--no-header > .bb-offcanvas__content {
+			/* stylelint-disable-next-line property-disallowed-list -- geometry: the `side` prop names a physical edge */
 			border-top-right-radius: max(
 				0px,
 				calc(var(--bb-radius-surface) - var(--bb-border-w))
@@ -1648,6 +1656,7 @@ export type BbOffCanvasSlots = {
 		}
 		&.bb-offcanvas--right > .bb-offcanvas__header,
 		&.bb-offcanvas--right.bb-offcanvas--no-header > .bb-offcanvas__content {
+			/* stylelint-disable-next-line property-disallowed-list -- geometry: the `side` prop names a physical edge */
 			border-top-left-radius: max(
 				0px,
 				calc(var(--bb-radius-surface) - var(--bb-border-w))
@@ -1660,10 +1669,12 @@ export type BbOffCanvasSlots = {
 		&.bb-offcanvas--top > .bb-offcanvas__footer,
 		&.bb-offcanvas--top:not(:has(> .bb-offcanvas__footer:not(:empty)))
 			> .bb-offcanvas__content {
+			/* stylelint-disable-next-line property-disallowed-list -- geometry: the `side` prop names a physical edge */
 			border-bottom-left-radius: max(
 				0px,
 				calc(var(--bb-radius-surface) - var(--bb-border-w))
 			);
+			/* stylelint-disable-next-line property-disallowed-list -- geometry: the `side` prop names a physical edge */
 			border-bottom-right-radius: max(
 				0px,
 				calc(var(--bb-radius-surface) - var(--bb-border-w))
@@ -1672,6 +1683,7 @@ export type BbOffCanvasSlots = {
 		&.bb-offcanvas--left > .bb-offcanvas__footer,
 		&.bb-offcanvas--left:not(:has(> .bb-offcanvas__footer:not(:empty)))
 			> .bb-offcanvas__content {
+			/* stylelint-disable-next-line property-disallowed-list -- geometry: the `side` prop names a physical edge */
 			border-bottom-right-radius: max(
 				0px,
 				calc(var(--bb-radius-surface) - var(--bb-border-w))
@@ -1680,6 +1692,7 @@ export type BbOffCanvasSlots = {
 		&.bb-offcanvas--right > .bb-offcanvas__footer,
 		&.bb-offcanvas--right:not(:has(> .bb-offcanvas__footer:not(:empty)))
 			> .bb-offcanvas__content {
+			/* stylelint-disable-next-line property-disallowed-list -- geometry: the `side` prop names a physical edge */
 			border-bottom-left-radius: max(
 				0px,
 				calc(var(--bb-radius-surface) - var(--bb-border-w))
@@ -1789,6 +1802,7 @@ export type BbOffCanvasSlots = {
 	&.bb-offcanvas--bottom .bb-offcanvas__handle,
 	&.bb-offcanvas--top .bb-offcanvas__handle {
 		height: var(--handle-h);
+		/* stylelint-disable-next-line property-disallowed-list -- geometry: centred with a physical translate */
 		left: 50%;
 		translate: -50% 0;
 		width: var(--handle-w);
@@ -1808,9 +1822,11 @@ export type BbOffCanvasSlots = {
 		width: var(--handle-h);
 	}
 	&.bb-offcanvas--left .bb-offcanvas__handle {
+		/* stylelint-disable-next-line property-disallowed-list -- geometry: the `side` prop names a physical edge */
 		right: 8px;
 	}
 	&.bb-offcanvas--right .bb-offcanvas__handle {
+		/* stylelint-disable-next-line property-disallowed-list -- geometry: the `side` prop names a physical edge */
 		left: 8px;
 	}
 
@@ -1866,7 +1882,7 @@ export type BbOffCanvasSlots = {
 			 * the space here instead — only when there is actually a control to
 			 * clear, so `hideClose` keeps the full width. */
 			&:has(~ .bb-close-button) {
-				padding-right: calc(var(--close-size) + 4px);
+				padding-inline-end: calc(var(--close-size) + 4px);
 			}
 		}
 		/* Only when a description is present. A header without one keeps its
@@ -1888,7 +1904,7 @@ export type BbOffCanvasSlots = {
 			   does. The × sits at the top-right, and a one-line title is short
 			   enough that the description's first line can still run under it. */
 			&:has(~ .bb-close-button) {
-				padding-right: calc(var(--close-size) + 4px);
+				padding-inline-end: calc(var(--close-size) + 4px);
 			}
 		}
 
@@ -1900,8 +1916,8 @@ export type BbOffCanvasSlots = {
 		> .bb-close-button {
 			--size: var(--close-size);
 			--p: 7px;
+			inset-inline-end: calc(var(--px) - var(--p));
 			position: absolute;
-			right: calc(var(--px) - var(--p));
 			top: calc(var(--py) - var(--p));
 		}
 	}
@@ -1956,8 +1972,8 @@ export type BbOffCanvasSlots = {
 			> .bb-close-button {
 				--size: 28px;
 				--p: 7px;
+				inset-inline-end: calc(var(--px) - var(--p));
 				position: absolute;
-				right: calc(var(--px) - var(--p));
 				top: calc(var(--py) - var(--p));
 			}
 		}
@@ -2042,7 +2058,7 @@ export type BbOffCanvasSlots = {
 
 body:has(.bb-offcanvas--visible) {
 	overflow: hidden;
-	padding-right: var(--scrollbar-width);
+	padding-inline-end: var(--scrollbar-width);
 }
 
 @keyframes bb-offcanvas-deny-bounce-x {

package/dist/ai/source/BbPagination.md

@@ -864,13 +864,13 @@ export type BbPaginationSlots = {
 
 	&--right {
 		.bb-pagination__pages {
-			margin-left: auto;
+			margin-inline-start: auto;
 		}
 	}
 	&--center {
 		.bb-pagination__pages {
-			margin-left: auto;
-			margin-right: auto;
+			margin-inline-end: auto;
+			margin-inline-start: auto;
 		}
 	}
 

package/dist/ai/source/BbPopover.md

@@ -92,7 +92,7 @@
 		:boundary="boundary"
 		:bubble-attrs="panelAttrs"
 		class="bb-popover"
-		dialog
+		:dialog="modal"
 		:eager="eager"
 		hide-arrow
 		:offset="offset"
@@ -100,7 +100,7 @@
 		:placement="placement === 'cursor' ? 'bottom-start' : placement"
 		:style="{ width: parsedWidth }"
 		:transition-duration="transitionDuration"
-		v-bind="mergeProps($attrs, passthrough.root)"
+		v-bind="mergeProps(nonModalAttrs, $attrs, passthrough.root)"
 		@hidden="onPanelHidden"
 		@shown="emit('shown')"
 	>
@@ -150,7 +150,7 @@
 </template>
 
 <script setup lang="ts">
-// Attributes land on the floating panel's `<dialog>` on desktop, the sheet's `<dialog>` on a phone (without `class` there).
+// Attributes land on the floating panel on desktop (a `<dialog>` when `modal`, else a `<div role="dialog">`), the sheet's `<dialog>` on a phone (without `class` there).
 // Measured 2026-09-23 (Q49.23); read by components.json.
 // @attrTargets dialog
 import {
@@ -168,6 +168,7 @@ import {
 	pushEscapeEntry,
 	removeEscapeEntry,
 	isTopEscapeEntry,
+	topDeliberateSurface,
 } from '@/utils/overlayEscapeStack';
 import { useId } from '@/composables/useId';
 import { useElementSize, useIntersectionObserver } from '@vueuse/core';
@@ -209,6 +210,7 @@ const props = withDefaults(defineProps<BbPopoverProps>(), {
 	// A declared default disables that absent→false cast while still keeping the
 	// Boolean type — so the `<Popover adaptive>` shorthand (valueless→`true`) works.
 	adaptive: undefined,
+	modal: false,
 	offset: 4,
 	padding: 10,
 	placement: 'bottom',
@@ -485,6 +487,113 @@ const onDocumentClick = (event: MouseEvent) => {
 	}
 };
 
+// --- Non-modal dismissal (Q60.10) ---
+//
+// Without `modal` the panel is a plain top-layer popover: the page stays live,
+// so leaving the panel is how it closes. A press outside (the press itself
+// still lands on what it hit: nothing here prevents it), or focus moving out
+// (Tab past the last control, Shift+Tab before the first, a click that focuses
+// something else), closes it. Neither returns focus to the activator, which
+// would steal it from where the user just went.
+
+/** The `role` a non-modal panel needs: a `<div>` is no dialog on its own. */
+const nonModalAttrs = computed(() =>
+	props.modal ? {} : { role: 'dialog' as const }
+);
+
+/** Set by an outside dismissal, so the close leaves focus where it went. */
+let dismissedOutside = false;
+
+/**
+ * True from a press on the activator until the task that delivers it ends.
+ * The press focuses the activator before its click toggles the panel; that
+ * `focusin` is not the user leaving (the click owns the toggle). A keyboard
+ * move onto the activator (Shift+Tab out of the panel) is not a press, and
+ * still closes. Same guard as BbDropdown.
+ */
+let activatorPress = false;
+
+/**
+ * Whether `target` belongs to an overlay opened on top of this panel (a menu or
+ * a dialog launched from inside it): that overlay owns the interaction, as it
+ * owns Escape. A press outside everything still closes both.
+ */
+const ownedByOverlayOnTop = (target: Node) => {
+	if (isTopEscapeEntry(escapeKey)) return false;
+	const top = topDeliberateSurface();
+	if (!top) return false;
+	return !top.element || top.element.contains(target);
+};
+
+/**
+ * The `<dialog>`s around the activator that were already open when the panel
+ * opened. One that opens later (a dialog mounted open with this popover open
+ * inside it) moves focus to its own first control: that is the dialog's
+ * initial focus, not the user leaving, so its first `focusin` is let through.
+ */
+let hostDialogs = new Set<HTMLDialogElement>();
+const collectHostDialogs = () => {
+	hostDialogs = new Set();
+	let dialog = activatorEl.value?.closest('dialog');
+	while (dialog) {
+		if (dialog.open) hostDialogs.add(dialog);
+		dialog = dialog.parentElement?.closest('dialog');
+	}
+};
+
+const dismissOutside = () => {
+	dismissedOutside = true;
+	close();
+};
+
+const onDocumentPointerDown = (event: PointerEvent) => {
+	if (event.timeStamp <= listenersAddedAt) return;
+	const target = event.target;
+	if (!(target instanceof Node)) return;
+	if (activatorEl.value?.contains(target)) {
+		activatorPress = true;
+		setTimeout(() => (activatorPress = false), 0);
+		return;
+	}
+	if (popoverEl.value?.contains(target)) return;
+	if (ownedByOverlayOnTop(target)) return;
+	dismissOutside();
+};
+
+/**
+ * A click outside with no press before it (a scripted `.click()`, a keyboard
+ * activation of an outside control) closes too. After a real press the panel
+ * is already closed and this does nothing.
+ */
+const onDocumentOutsideClick = (event: MouseEvent) => {
+	if (!isOpen.value || event.timeStamp <= listenersAddedAt) return;
+	const target = event.target;
+	if (!(target instanceof Node)) return;
+	if (activatorEl.value?.contains(target)) return;
+	if (popoverEl.value?.contains(target)) return;
+	if (ownedByOverlayOnTop(target)) return;
+	dismissOutside();
+};
+
+const onDocumentFocusIn = (event: FocusEvent) => {
+	const target = event.target;
+	if (!(target instanceof Node)) return;
+	const panel = popoverEl.value;
+	if (panel?.contains(target)) return;
+	if (activatorPress && activatorEl.value?.contains(target)) return;
+	// Focus landing on an ANCESTOR of the panel is the browser's fallback for a
+	// press on non-focusable panel content (the panel renders in place), not
+	// the user going elsewhere.
+	if (target instanceof Element && panel && target.contains(panel)) return;
+	const host = target instanceof Element ? target.closest('dialog') : null;
+	if (host && panel && host.contains(panel) && !hostDialogs.has(host)) {
+		hostDialogs.add(host);
+		return;
+	}
+	if (ownedByOverlayOnTop(target)) return;
+	dismissOutside();
+};
+
 // Identifies this popover instance in the module-level Escape stack.
 const escapeKey = Symbol('bb-popover');
 
@@ -503,8 +612,26 @@ const addGlobalListeners = () => {
 	// inside it (Q63.7).
 	pushEscapeEntry(escapeKey, { element: () => popoverEl.value });
 	listenersAddedAt = performance.now();
-	document.addEventListener('click', onDocumentClick, { passive: true });
-	document.addEventListener('contextmenu', onDocumentClick, { passive: true });
+	if (props.modal) {
+		document.addEventListener('click', onDocumentClick, { passive: true });
+		document.addEventListener('contextmenu', onDocumentClick, {
+			passive: true,
+		});
+	} else {
+		dismissedOutside = false;
+		collectHostDialogs();
+		document.addEventListener('pointerdown', onDocumentPointerDown, {
+			passive: true,
+			capture: true,
+		});
+		document.addEventListener('focusin', onDocumentFocusIn, { passive: true });
+		document.addEventListener('click', onDocumentOutsideClick, {
+			passive: true,
+		});
+		document.addEventListener('contextmenu', onDocumentOutsideClick, {
+			passive: true,
+		});
+	}
 	document.addEventListener('keydown', onKeydown, { capture: true });
 };
 
@@ -512,6 +639,12 @@ const removeGlobalListeners = () => {
 	removeEscapeEntry(escapeKey);
 	document.removeEventListener('click', onDocumentClick);
 	document.removeEventListener('contextmenu', onDocumentClick);
+	document.removeEventListener('pointerdown', onDocumentPointerDown, {
+		capture: true,
+	});
+	document.removeEventListener('focusin', onDocumentFocusIn);
+	document.removeEventListener('click', onDocumentOutsideClick);
+	document.removeEventListener('contextmenu', onDocumentOutsideClick);
 	document.removeEventListener('keydown', onKeydown, { capture: true });
 };
 
@@ -567,9 +700,9 @@ const runCloseEffects = () => {
 
 	removeGlobalListeners();
 
-	if (activatorEl.value) {
-		activatorEl.value.focus();
-	}
+	// An outside dismissal leaves focus where the user took it (Q60.10).
+	if (dismissedOutside) dismissedOutside = false;
+	else if (activatorEl.value) activatorEl.value.focus();
 };
 
 // Set by a floating close until CommonPopover reports `hidden`. A close that
@@ -869,6 +1002,17 @@ export type BbPopoverProps = {
 	 * Generated when omitted.
 	 */
 	id?: HTMLAttributes['id'];
+	/**
+	 * Makes the floating panel modal: the page behind it goes inert and
+	 * cannot scroll, and Tab stays inside the panel until it closes. Off by
+	 * default, the panel is a non-modal dialog: the page stays usable, a
+	 * click outside closes it and still reaches what was clicked, and Tab
+	 * past its last control (or Shift+Tab before its first) leaves it and
+	 * closes it. The phone sheet is modal either way.
+	 *
+	 * @defaultValue `false`
+	 */
+	modal?: boolean;
 	/**
 	 * Space the floating container will maintain from the activator.
 	 *

package/dist/ai/source/BbPopoverPortal.md

@@ -145,6 +145,17 @@ export type BbPopoverProps = {
 	 * Generated when omitted.
 	 */
 	id?: HTMLAttributes['id'];
+	/**
+	 * Makes the floating panel modal: the page behind it goes inert and
+	 * cannot scroll, and Tab stays inside the panel until it closes. Off by
+	 * default, the panel is a non-modal dialog: the page stays usable, a
+	 * click outside closes it and still reaches what was clicked, and Tab
+	 * past its last control (or Shift+Tab before its first) leaves it and
+	 * closes it. The phone sheet is modal either way.
+	 *
+	 * @defaultValue `false`
+	 */
+	modal?: boolean;
 	/**
 	 * Space the floating container will maintain from the activator.
 	 *

package/dist/ai/source/BbProgress.md

@@ -10,15 +10,16 @@
 		:aria-label="label || undefined"
 		:aria-valuemax="max"
 		:aria-valuemin="min"
-		:aria-valuenow="ariaValueNow"
+		:aria-valuenow="indeterminate ? undefined : ariaValueNow"
 		class="bb-progress"
+		:class="{ 'bb-progress--indeterminate': indeterminate }"
 		role="progressbar"
 		:style="containerStyle"
-		v-bind="passthrough.rootAttrs"
+		v-bind="rootAttrs"
 	>
 		<div
 			class="bb-progress__bar"
-			:style="barStyle"
+			:style="indeterminate ? undefined : barStyle"
 			v-bind="passthrough.bar"
 		></div>
 	</div>
@@ -44,7 +45,7 @@ const props = withDefaults(defineProps<BbProgressProps>(), {
 });
 
 /**
- * Passthrough (plans/passthrough/BbProgress.md). `root` (the track) and `bar` (the fill); no states — everything it paints is configuration.
+ * Passthrough (plans/passthrough/BbProgress.md). `root` (the track) and `bar` (the fill); one state, `indeterminate`.
  */
 const passthrough = usePassthrough({
 	component: 'BbProgress',
@@ -52,14 +53,25 @@ const passthrough = usePassthrough({
 	props,
 	parts: BB_PROGRESS_PT.parts,
 	states: BB_PROGRESS_PT.states,
-	active: {},
+	active: { indeterminate: () => !!props.indeterminate },
+});
+
+/*
+ * Q60.29: an indeterminate bar reports no value, so a consumer's
+ * `aria-valuetext` (the guide suggests one for units) is held back while it is
+ * on and returns with the value.
+ */
+const rootAttrs = computed(() => {
+	const attrs = passthrough.rootAttrs as Record<string, unknown>;
+	if (!props.indeterminate || !('aria-valuetext' in attrs)) return attrs;
+	const { 'aria-valuetext': _valuetext, ...rest } = attrs;
+	return rest;
 });
 
 // aria-valuenow must sit within [valuemin, valuemax], so it mirrors the
-// clamped visual fill. There is no indeterminate mode (BbSpinner is the
-// indeterminate affordance): a `null` value reports `min`, matching the
-// empty bar it renders — never omit the attribute, as omission would signal
-// "indeterminate" to assistive tech.
+// clamped visual fill. Only `indeterminate` omits it (Q60.29: omission is how
+// a progressbar says "indeterminate" to assistive tech): a `null` value
+// reports `min`, matching the empty bar it renders.
 // NaN (a calc glitch upstream) degrades like `null`: `clamp` would pass it
 // through to aria-valuenow="NaN" and a dropped transform (a full bar).
 // ±Infinity already clamps to an end.
@@ -110,8 +122,7 @@ import type { PtMap, PtValue } from '@/types/passthrough';
  * Props for BbProgress.
  */
 /**
- * Passthrough parts of `BbProgress` (plans/passthrough/BbProgress.md). Nothing
- * it paints is a state.
+ * Passthrough parts of `BbProgress` (plans/passthrough/BbProgress.md).
  *
  * @part root - The track (the `progressbar` element); the bar follows it
  *   through its locals (`--track`, `--track-color`, `--accent`, `--r`, the
@@ -121,27 +132,45 @@ import type { PtMap, PtValue } from '@/types/passthrough';
  *   never its position.
  */
 export type BbProgressPtPart = 'root' | 'bar';
-/** The runtime lists the resolver is wired with — no states: nothing this component paints is a state. */
+/**
+ * Passthrough states of `BbProgress`.
+ *
+ * @state indeterminate - Component-wide: `indeterminate` is on; the bar
+ *   slides (pulses under reduced motion) instead of showing a value.
+ */
+export type BbProgressPtState = 'indeterminate';
+/** The runtime lists the resolver is wired with. */
 export const BB_PROGRESS_PT = {
 	parts: ['root', 'bar'],
-	states: [],
+	states: ['indeterminate'],
 } as const satisfies {
 	parts: readonly BbProgressPtPart[];
-	states: readonly never[];
+	states: readonly BbProgressPtState[];
 };
 
 // Spelled INLINE with this component's own union (Vue's SFC type resolver
 // does not substitute a generic alias's type parameters — PASSTHROUGH.md T20).
-// No state axis: a `never` state does not resolve to finite keys.
 // eslint-disable-next-line @typescript-eslint/consistent-indexed-object-style
 export type BbProgressProps = {
-	[K in `pt:${BbProgressPtPart}`]?: PtValue;
+	[K in
+		| `pt:${BbProgressPtPart}`
+		| `pt:${BbProgressPtPart}:${BbProgressPtState}`]?: PtValue;
 } & {
 	/**
 	 * Passthrough, object form: the same keys as the `pt:*` attributes
-	 * without the prefix. See the `pt:<part>` row.
+	 * without the prefix. Parts: `root`, `bar`; state: `indeterminate`.
+	 */
+	pt?: PtMap<BbProgressPtPart, BbProgressPtState>;
+	/**
+	 * A wait you cannot measure yet: the bar slides back and forth (a calm
+	 * pulse under `prefers-reduced-motion`) and the progressbar reports no
+	 * value (`aria-valuenow` is omitted, as the ARIA pattern asks). The
+	 * `modelValue` is kept and shows again when this turns off. A `null`
+	 * `modelValue` alone is still an empty bar, not this.
+	 *
+	 * @defaultValue `false`
 	 */
-	pt?: PtMap<BbProgressPtPart, never>;
+	indeterminate?: boolean;
 	/**
 	 * The current progress value — a number between `min` and `max`. This is a
 	 * one-way input prop (BbProgress is a display component and never emits
@@ -215,4 +244,39 @@ export type BbProgressProps = {
 	transition: transform var(--transition-duration);
 	width: 100%;
 }
+
+/*
+ * Q60.29 — `indeterminate`: a wait with no measurable end. A short bar slides
+ * across the track (transform only: composited). Under reduced motion the
+ * full bar breathes instead, slowly, without moving.
+ */
+.bb-progress--indeterminate > .bb-progress__bar {
+	animation: bb-progress-slide 1.6s var(--bb-ease) infinite;
+	transition: none;
+	width: 40%;
+
+	@media (prefers-reduced-motion: reduce) {
+		animation: bb-progress-pulse 2.4s ease-in-out infinite;
+		width: 100%;
+	}
+}
+
+@keyframes bb-progress-slide {
+	from {
+		transform: translateX(-100%);
+	}
+	to {
+		transform: translateX(250%);
+	}
+}
+
+@keyframes bb-progress-pulse {
+	0%,
+	100% {
+		opacity: 1;
+	}
+	50% {
+		opacity: 0.4;
+	}
+}
 ```

package/dist/ai/source/BbRadioGroup.md

@@ -29,7 +29,7 @@
 		:loading="loading"
 		:name="resolvedName"
 		:passthrough="containerPassthrough"
-		:readonly="readonly"
+		:readonly="fieldReadonly"
 		:reverse="reverse"
 		:show-asterisk="showAsterisk"
 		:show-hint="showHint"
@@ -53,7 +53,7 @@
 			<OptionsContainer
 				:ref="setOptionsElement"
 				:aria-labelledby="hasLegend() ? `${fieldId}__label` : undefined"
-				:aria-readonly="hasLegend() && readonly ? true : undefined"
+				:aria-readonly="hasLegend() && fieldReadonly ? true : undefined"
 				:aria-required="hasLegend() ? fieldAriaRequired : undefined"
 				block="bb-radio-group"
 				:empty-text="emptyText"
@@ -115,7 +115,7 @@
 							:focused="rowFocus.focused(option.valueHash)"
 							:has-errors="!!fieldHasErrors"
 							:has-warnings="!!fieldHasWarnings && !fieldHasErrors"
-							:readonly="!!readonly"
+							:readonly="!!fieldReadonly"
 							v-bind="passthrough.part('icon', rowStates, option.item)"
 						/>
 						<!-- eslint-enable vue/attributes-order -->
@@ -196,6 +196,7 @@ const {
 	showAsterisk,
 	errors: fieldErrors,
 	ariaRequired: fieldAriaRequired,
+	readonly: fieldReadonly,
 } = useFormBinding(declaredProps, declaredEmit, {
 	componentName: 'BbRadioGroup',
 	identifierFallback: () => declaredProps.legend,
@@ -321,6 +322,7 @@ const { options } = useBaseOptions({
 	itemText: props.itemText as any,
 	itemProps: toRef(props, 'itemProps'),
 	itemValue: props.itemValue as any,
+	optionDefaults: true,
 	max: Infinity,
 	selectable: toRef(props, 'selectable'),
 	selectedIndexedByHash: modelValueIndexedByHash,
@@ -740,14 +742,18 @@ export type BbRadioGroupProps<T> = {
 	/**
 	 * Defines a path that returns a property of the object to use as text or a function that returns a string.
 	 *
-	 * @defaultValue `JSON.stringify(item)`
+	 * Unset: own `label`, else `text` (`{ label, value }` needs no accessor).
+	 *
+	 * @defaultValue own `label`, else `text`, else `JSON.stringify(item)`
 	 */
 	itemText?: ItemAccessor<T, string>;
 
 	/**
 	 * Defines a path that returns a property of the object to use as value or a function that returns any value.
 	 *
-	 * @defaultValue the whole item
+	 * Unset: own `value`, even `null`.
+	 *
+	 * @defaultValue own `value`, else the whole item
 	 */
 	itemValue?: ItemAccessor<T>;
 
@@ -1054,6 +1060,7 @@ export type BbRadioGroupSlots<T> = {
 .bb-radio-group {
 	.bb-field__layout--horizontal {
 		.bb-field__label {
+			/* stylelint-disable-next-line declaration-property-value-disallowed-list -- support: `float: inline-start` needs Chrome 118, above the 114 floor */
 			float: left;
 		}
 	}