@radix-ng/primitives 1.0.0-beta.5 → 1.0.2

package/types/radix-ng-primitives-slider.d.ts

@@ -3,6 +3,7 @@ import { Signal } from '@angular/core';
 import * as _radix_ng_primitives_core from '@radix-ng/primitives/core';
 import { RdxControlValueAccessor, NumberInput, BooleanInput, RdxCancelableChangeEventDetails } from '@radix-ng/primitives/core';
 export { clamp } from '@radix-ng/primitives/core';
+import * as i1 from '@radix-ng/primitives/composite';
 import * as _radix_ng_primitives_slider from '@radix-ng/primitives/slider';
 
 type SliderOrientation = 'horizontal' | 'vertical';
@@ -120,6 +121,9 @@ interface RdxSliderThumbRef {
     /** Whether this thumb is disabled (own state OR root disabled). */
     readonly disabled: Signal<boolean>;
 }
+interface RdxSliderThumbMetadata {
+    inputId?: string | undefined;
+}
 /**
  * Groups all parts of the slider and owns its state, value-change logic and
  * thumb registration. A single directive drives both orientations — there are no
@@ -131,6 +135,7 @@ declare class RdxSliderRoot {
     /** @ignore */
     protected readonly cva: RdxControlValueAccessor<SliderValue>;
     private readonly document;
+    private readonly compositeList;
     readonly id: _angular_core.InputSignal<string>;
     /**
      * The minimum value of the slider.
@@ -239,6 +244,8 @@ declare class RdxSliderRoot {
     private readonly thumbs;
     /** Registered thumbs in DOM order. */
     readonly thumbList: Signal<RdxSliderThumbRef[]>;
+    /** Input ids registered by thumbs, in DOM order. */
+    readonly thumbInputIds: Signal<string[]>;
     /** @ignore */
     registerThumb(thumb: RdxSliderThumbRef): void;
     /** @ignore */
@@ -274,7 +281,7 @@ declare class RdxSliderRoot {
     /** @ignore */
     getOwnerWindow(): Window | undefined;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<RdxSliderRoot, never>;
-    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxSliderRoot, "div[rdxSliderRoot]", ["rdxSliderRoot"], { "id": { "alias": "id"; "required": false; "isSignal": true; }; "min": { "alias": "min"; "required": false; "isSignal": true; }; "max": { "alias": "max"; "required": false; "isSignal": true; }; "step": { "alias": "step"; "required": false; "isSignal": true; }; "largeStep": { "alias": "largeStep"; "required": false; "isSignal": true; }; "minStepsBetweenValues": { "alias": "minStepsBetweenValues"; "required": false; "isSignal": true; }; "orientation": { "alias": "orientation"; "required": false; "isSignal": true; }; "dirInput": { "alias": "dir"; "required": false; "isSignal": true; }; "thumbCollisionBehavior": { "alias": "thumbCollisionBehavior"; "required": false; "isSignal": true; }; "thumbAlignment": { "alias": "thumbAlignment"; "required": false; "isSignal": true; }; "format": { "alias": "format"; "required": false; "isSignal": true; }; "locale": { "alias": "locale"; "required": false; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; "form": { "alias": "form"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "defaultValue": { "alias": "defaultValue"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "ariaLabelledBy": { "alias": "aria-labelledby"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "onValueChange": "onValueChange"; "onValueCommitted": "onValueCommitted"; }, never, never, true, [{ directive: typeof _radix_ng_primitives_core.RdxControlValueAccessor; inputs: { "value": "value"; "disabled": "disabled"; }; outputs: {}; }]>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxSliderRoot, "div[rdxSliderRoot]", ["rdxSliderRoot"], { "id": { "alias": "id"; "required": false; "isSignal": true; }; "min": { "alias": "min"; "required": false; "isSignal": true; }; "max": { "alias": "max"; "required": false; "isSignal": true; }; "step": { "alias": "step"; "required": false; "isSignal": true; }; "largeStep": { "alias": "largeStep"; "required": false; "isSignal": true; }; "minStepsBetweenValues": { "alias": "minStepsBetweenValues"; "required": false; "isSignal": true; }; "orientation": { "alias": "orientation"; "required": false; "isSignal": true; }; "dirInput": { "alias": "dir"; "required": false; "isSignal": true; }; "thumbCollisionBehavior": { "alias": "thumbCollisionBehavior"; "required": false; "isSignal": true; }; "thumbAlignment": { "alias": "thumbAlignment"; "required": false; "isSignal": true; }; "format": { "alias": "format"; "required": false; "isSignal": true; }; "locale": { "alias": "locale"; "required": false; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; "form": { "alias": "form"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "defaultValue": { "alias": "defaultValue"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "ariaLabelledBy": { "alias": "aria-labelledby"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "onValueChange": "onValueChange"; "onValueCommitted": "onValueCommitted"; }, never, never, true, [{ directive: typeof i1.RdxCompositeList; inputs: {}; outputs: {}; }, { directive: typeof _radix_ng_primitives_core.RdxControlValueAccessor; inputs: { "value": "value"; "disabled": "disabled"; }; outputs: {}; }]>;
 }
 
 /**
@@ -346,9 +353,11 @@ declare class RdxSliderIndicator {
  */
 declare class RdxSliderThumb implements RdxSliderThumbRef {
     protected readonly root: _radix_ng_primitives_slider.RdxSliderRoot;
+    private readonly listItem;
     readonly element: HTMLElement;
     /** The nested range input, set by `[rdxSliderThumbInput]`. */
     inputElement: HTMLInputElement | null;
+    private readonly inputId;
     /** Explicit index for this thumb (required for SSR range sliders). */
     readonly indexInput: _angular_core.InputSignalWithTransform<number | undefined, NumberInput>;
     /** Disables this individual thumb. */
@@ -365,8 +374,12 @@ declare class RdxSliderThumb implements RdxSliderThumbRef {
     constructor();
     private updateInsetPosition;
     protected onPointerDown(event: PointerEvent): void;
+    /** @ignore */
+    setInputElement(input: HTMLInputElement, id: string): void;
+    /** @ignore */
+    clearInputElement(input: HTMLInputElement): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<RdxSliderThumb, never>;
-    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxSliderThumb, "div[rdxSliderThumb]", ["rdxSliderThumb"], { "indexInput": { "alias": "index"; "required": false; "isSignal": true; }; "thumbDisabled": { "alias": "disabled"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxSliderThumb, "div[rdxSliderThumb]", ["rdxSliderThumb"], { "indexInput": { "alias": "index"; "required": false; "isSignal": true; }; "thumbDisabled": { "alias": "disabled"; "required": false; "isSignal": true; }; }, {}, never, never, true, [{ directive: typeof i1.RdxCompositeListItem; inputs: {}; outputs: {}; }]>;
 }
 
 /**
@@ -380,6 +393,7 @@ declare class RdxSliderThumbInput {
     protected readonly root: _radix_ng_primitives_slider.RdxSliderRoot;
     protected readonly thumb: RdxSliderThumb;
     private readonly element;
+    readonly id: _angular_core.InputSignal<string>;
     readonly ariaLabel: _angular_core.InputSignal<string | undefined>;
     readonly ariaValueTextInput: _angular_core.InputSignal<string | undefined>;
     protected readonly writingMode: _angular_core.Signal<"vertical-rl" | "vertical-lr" | undefined>;
@@ -391,7 +405,7 @@ declare class RdxSliderThumbInput {
     protected onBlur(): void;
     protected onKeyDown(event: KeyboardEvent): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<RdxSliderThumbInput, never>;
-    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxSliderThumbInput, "input[rdxSliderThumbInput]", ["rdxSliderThumbInput"], { "ariaLabel": { "alias": "aria-label"; "required": false; "isSignal": true; }; "ariaValueTextInput": { "alias": "aria-valuetext"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxSliderThumbInput, "input[rdxSliderThumbInput]", ["rdxSliderThumbInput"], { "id": { "alias": "id"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "aria-label"; "required": false; "isSignal": true; }; "ariaValueTextInput": { "alias": "aria-valuetext"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
 }
 
 /**
@@ -404,6 +418,7 @@ declare class RdxSliderValue {
     protected readonly root: _radix_ng_primitives_slider.RdxSliderRoot;
     /** The separator placed between values of a range slider. */
     readonly separator: _angular_core.InputSignal<string>;
+    protected readonly forAttr: _angular_core.Signal<string | undefined>;
     protected readonly display: _angular_core.Signal<string>;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<RdxSliderValue, never>;
     static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxSliderValue, "output[rdxSliderValue]", ["rdxSliderValue"], { "separator": { "alias": "separator"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
@@ -426,4 +441,4 @@ declare class RdxSliderModule {
 }
 
 export { ALL_KEYS, ARROW_KEYS, COMPOSITE_KEYS, RdxSliderControl, RdxSliderIndicator, RdxSliderModule, RdxSliderRoot, RdxSliderThumb, RdxSliderThumbInput, RdxSliderTrack, RdxSliderValue, areValuesEqual, asc, formatNumber, getControlOffset, getDecimalPrecision, getDefaultAriaValueText, getInsetThumbPositionPercent, getMidpoint, getNewValue, getPushedThumbValues, getSliderValue, injectSliderRootContext, provideSliderRootContext, replaceArrayItemAtIndex, resolveThumbCollision, roundValueToStep, validateMinimumDistance, valueArrayToPercentages, valueToPercent };
-export type { RdxSliderThumbAlignment, RdxSliderThumbRef, RdxSliderValueChangeEvent, RdxSliderValueChangeEventDetails, RdxSliderValueChangeReason, RdxSliderValueCommitEvent, RdxSliderValueCommitEventDetails, RdxSliderValueCommitReason, ResolveThumbCollisionParams, ResolveThumbCollisionResult, SliderOrientation, SliderValue, ThumbCollisionBehavior };
+export type { RdxSliderThumbAlignment, RdxSliderThumbMetadata, RdxSliderThumbRef, RdxSliderValueChangeEvent, RdxSliderValueChangeEventDetails, RdxSliderValueChangeReason, RdxSliderValueCommitEvent, RdxSliderValueCommitEventDetails, RdxSliderValueCommitReason, ResolveThumbCollisionParams, ResolveThumbCollisionResult, SliderOrientation, SliderValue, ThumbCollisionBehavior };

package/types/radix-ng-primitives-tabs.d.ts

@@ -1,10 +1,11 @@
 import * as _angular_core from '@angular/core';
 import { Signal } from '@angular/core';
 import * as i1 from '@radix-ng/primitives/presence';
+import * as i1$1 from '@radix-ng/primitives/composite';
+import { RdxCompositeMetadata } from '@radix-ng/primitives/composite';
 import * as _radix_ng_primitives_core from '@radix-ng/primitives/core';
 import { DataOrientation, RdxCancelableChangeEventDetails, BooleanInput } from '@radix-ng/primitives/core';
 import * as _radix_ng_primitives_tabs from '@radix-ng/primitives/tabs';
-import * as i1$1 from '@radix-ng/primitives/roving-focus';
 
 /**
  * Structural directive that mounts the tab panel contents only while the panel is active,
@@ -27,9 +28,18 @@ declare class RdxTabsPanelPresence {
 type RdxTabsActivationDirection = 'left' | 'right' | 'up' | 'down' | 'none';
 /** A value that identifies a tab / panel pair. */
 type RdxTabsValue = string | number | null;
+/** Metadata registered for each tab in the composite list. */
+interface RdxTabsTabMetadata {
+    [key: string]: unknown;
+    disabled: boolean;
+    id: string;
+    value: RdxTabsValue;
+}
 
-type RdxTabsValueChangeReason = 'trigger-press' | 'keyboard' | 'focus' | 'none';
-type RdxTabsValueChangeEventDetails = RdxCancelableChangeEventDetails<RdxTabsValueChangeReason>;
+type RdxTabsValueChangeReason = 'none' | 'disabled' | 'missing' | 'initial';
+type RdxTabsValueChangeEventDetails = RdxCancelableChangeEventDetails<RdxTabsValueChangeReason> & {
+    activationDirection: RdxTabsActivationDirection;
+};
 interface RdxTabsValueChangeEvent {
     value: RdxTabsValue;
     eventDetails: RdxTabsValueChangeEventDetails;
@@ -48,6 +58,9 @@ declare class RdxTabsRoot {
     readonly value: _angular_core.ModelSignal<RdxTabsValue | undefined>;
     /**
      * The value of the tab that should be initially selected when uncontrolled.
+     * When omitted, Base UI parity uses `0` as the implicit default and falls back to the first enabled tab.
+     *
+     * @default 0
      */
     readonly defaultValue: _angular_core.InputSignal<RdxTabsValue | undefined>;
     /**
@@ -59,20 +72,38 @@ declare class RdxTabsRoot {
     readonly orientation: _angular_core.InputSignal<DataOrientation>;
     /**
      * Event emitted when the selected tab changes.
+     *
+     * `eventDetails.reason` is `'none'` for user-initiated changes, `'initial'` for the first automatic
+     * uncontrolled selection, `'disabled'` when an uncontrolled selection falls back from a disabled tab,
+     * and `'missing'` when it falls back from a removed tab. Automatic changes are not cancelable.
      */
     readonly onValueChange: _angular_core.OutputEmitterRef<RdxTabsValueChangeEvent>;
     /** @ignore Set by `[rdxTabsList]`. */
     readonly activateOnFocus: _angular_core.WritableSignal<boolean>;
     /** @ignore Set by `[rdxTabsList]`. */
     readonly tabListElement: _angular_core.WritableSignal<HTMLElement | null>;
+    /** @ignore Set by `[rdxTabsList]`. */
+    readonly tabMap: _angular_core.WritableSignal<Map<HTMLElement, RdxCompositeMetadata<RdxTabsTabMetadata>>>;
     /** @ignore */
     readonly activationDirection: _angular_core.WritableSignal<RdxTabsActivationDirection>;
+    private readonly externallyControlled;
+    private hasObservedValue;
+    private previousObservedValue;
+    private internalValueCommit;
+    private hasAppliedDefaultValue;
+    private initialDefaultValue;
+    private shouldNotifyInitialValueChange;
+    private shouldHonorDisabledDefaultValue;
+    private didRegisterTabs;
+    private lastKnownTabElement;
     constructor();
     /** @ignore */
     setValue(value: RdxTabsValue, event?: Event, reason?: RdxTabsValueChangeReason): void;
-    private computeDirection;
+    private commitValue;
+    private commitAutomaticValueChange;
+    private notifyAutomaticValueChange;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<RdxTabsRoot, never>;
-    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxTabsRoot, "[rdxTabsRoot]", ["rdxTabsRoot"], { "value": { "alias": "value"; "required": false; "isSignal": true; }; "defaultValue": { "alias": "defaultValue"; "required": false; "isSignal": true; }; "orientation": { "alias": "orientation"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "onValueChange": "onValueChange"; }, never, never, true, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxTabsRoot, "[rdxTabsRoot]", ["rdxTabsRoot"], { "value": { "alias": "value"; "required": false; "isSignal": true; }; "defaultValue": { "alias": "defaultValue"; "required": false; "isSignal": true; }; "orientation": { "alias": "orientation"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "onValueChange": "onValueChange"; }, never, never, true, [{ directive: typeof i1$1.RdxCompositeList; inputs: {}; outputs: {}; }]>;
 }
 
 /**
@@ -83,7 +114,7 @@ declare class RdxTabsRoot {
 declare class RdxTabsList {
     protected readonly rootContext: _radix_ng_primitives_tabs.RdxTabsRootContext;
     private readonly elementRef;
-    private readonly rovingFocusGroup;
+    private readonly compositeRoot;
     /**
      * Whether a tab is activated when it receives focus (automatic activation).
      * When `false`, tabs are only activated on click or Enter/Space.
@@ -97,9 +128,13 @@ declare class RdxTabsList {
      * @default true
      */
     readonly loopFocus: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    private readonly tabMap;
+    private readonly tabMetadata;
+    private readonly disabledIndices;
+    private readonly activeIndex;
     constructor();
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<RdxTabsList, never>;
-    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxTabsList, "[rdxTabsList]", ["rdxTabsList"], { "activateOnFocus": { "alias": "activateOnFocus"; "required": false; "isSignal": true; }; "loopFocus": { "alias": "loopFocus"; "required": false; "isSignal": true; }; }, {}, never, never, true, [{ directive: typeof i1$1.RdxRovingFocusGroupDirective; inputs: {}; outputs: {}; }]>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxTabsList, "[rdxTabsList]", ["rdxTabsList"], { "activateOnFocus": { "alias": "activateOnFocus"; "required": false; "isSignal": true; }; "loopFocus": { "alias": "loopFocus"; "required": false; "isSignal": true; }; }, {}, never, never, true, [{ directive: typeof i1$1.RdxCompositeRoot; inputs: {}; outputs: {}; }]>;
 }
 
 /**
@@ -109,30 +144,45 @@ declare class RdxTabsList {
  */
 declare class RdxTabsTab {
     protected readonly rootContext: _radix_ng_primitives_tabs.RdxTabsRootContext;
-    private readonly rovingFocusItem;
+    private readonly compositeItem;
     /**
      * A unique value that associates the tab with a panel.
      */
     readonly value: _angular_core.InputSignal<RdxTabsValue>;
     /**
      * When `true`, prevents the user from interacting with the tab.
+     * Disabled tabs remain focusable during composite keyboard navigation, matching Base UI.
      */
     readonly disabled: _angular_core.InputSignalWithTransform<boolean, BooleanInput>;
+    /**
+     * Whether the host element is a native button. When `true`, `type="button"` is applied.
+     *
+     * @default true
+     */
+    readonly nativeButton: _angular_core.InputSignalWithTransform<boolean, BooleanInput>;
+    /**
+     * Optional id for the tab element. When omitted, an id is derived from the root id and tab value.
+     */
+    readonly id: _angular_core.InputSignal<string | undefined>;
     /** @ignore */
     protected readonly tabId: _angular_core.Signal<string>;
     /** @ignore */
     protected readonly panelId: _angular_core.Signal<string>;
     /** @ignore */
     protected readonly active: _angular_core.Signal<boolean>;
+    private isPressing;
+    private isMainButton;
     constructor();
     /** @ignore */
-    protected onMouseDown(event: MouseEvent): void;
+    protected onClick(event: MouseEvent): void;
     /** @ignore */
     protected onKeyDown(event: KeyboardEvent): void;
     /** @ignore */
+    protected onPointerDown(event: PointerEvent): void;
+    /** @ignore */
     protected onFocus(event: FocusEvent): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<RdxTabsTab, never>;
-    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxTabsTab, "[rdxTabsTab]", ["rdxTabsTab"], { "value": { "alias": "value"; "required": true; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; }, {}, never, never, true, [{ directive: typeof i1$1.RdxRovingFocusItemDirective; inputs: { "allowShiftKey": "allowShiftKey"; }; outputs: {}; }]>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxTabsTab, "[rdxTabsTab]", ["rdxTabsTab"], { "value": { "alias": "value"; "required": true; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "nativeButton": { "alias": "nativeButton"; "required": false; "isSignal": true; }; "id": { "alias": "id"; "required": false; "isSignal": true; }; }, {}, never, never, true, [{ directive: typeof i1$1.RdxCompositeItem; inputs: {}; outputs: {}; }]>;
 }
 
 /**
@@ -146,6 +196,7 @@ declare class RdxTabsTab {
  */
 declare class RdxTabsPanel {
     private readonly elementRef;
+    private readonly listItem;
     protected readonly rootContext: _radix_ng_primitives_tabs.RdxTabsRootContext;
     /**
      * A unique value that associates the panel with a tab.
@@ -181,15 +232,15 @@ declare class RdxTabsPanel {
      * element renders nothing), unless `keepMounted` keeps the inactive contents around.
      */
     protected readonly hidden: _angular_core.Signal<boolean>;
-    /** @ignore Index of the panel, derived from the order of its associated tab. */
-    protected readonly index: _angular_core.Signal<number | null>;
+    /** @ignore Index of the panel in DOM order. */
+    protected readonly index: _angular_core.Signal<number>;
     private previousActive;
     private isFirstRun;
     constructor();
     /** @ignore Called by `RdxTabsPanelPresence` so the panel stops forcing `hidden`. */
     markHasPresence(): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<RdxTabsPanel, never>;
-    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxTabsPanel, "[rdxTabsPanel]", ["rdxTabsPanel"], { "value": { "alias": "value"; "required": true; "isSignal": true; }; "keepMounted": { "alias": "keepMounted"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxTabsPanel, "[rdxTabsPanel]", ["rdxTabsPanel"], { "value": { "alias": "value"; "required": true; "isSignal": true; }; "keepMounted": { "alias": "keepMounted"; "required": false; "isSignal": true; }; }, {}, never, never, true, [{ directive: typeof i1$1.RdxCompositeListItem; inputs: {}; outputs: {}; }]>;
 }
 
 interface TabGeometry {
@@ -232,12 +283,16 @@ interface RdxTabsRootContext {
     readonly activateOnFocus: Signal<boolean>;
     /** The `[rdxTabsList]` host element, used to resolve tab order and indicator geometry. */
     readonly tabListElement: Signal<HTMLElement | null>;
+    /** Registered tabs in DOM order. */
+    readonly tabMap: Signal<Map<HTMLElement, RdxCompositeMetadata<RdxTabsTabMetadata>>>;
     /** Select a tab by value. No-op when the value is unchanged. */
-    setValue(value: RdxTabsValue, event?: Event, reason?: string): void;
+    setValue(value: RdxTabsValue, event?: Event, reason?: RdxTabsValueChangeReason): void;
     /** Mirror the list's `activateOnFocus` input onto the root context. */
     setActivateOnFocus(value: boolean): void;
     /** Register the list host element. */
     setTabListElement(element: HTMLElement | null): void;
+    /** Register the tab composite map. */
+    setTabMap(map: Map<HTMLElement, RdxCompositeMetadata<RdxTabsTabMetadata>>): void;
 }
 declare const injectTabsRootContext: _radix_ng_primitives_core.InjectContext<RdxTabsRootContext>;
 declare const provideTabsRootContext: (useFactory: () => RdxTabsRootContext) => _angular_core.Provider;

package/types/radix-ng-primitives-toggle-group.d.ts

@@ -1,11 +1,11 @@
-import * as _radix_ng_primitives_core from '@radix-ng/primitives/core';
-import { DataOrientation, BooleanInput, RdxCancelableChangeEventDetails } from '@radix-ng/primitives/core';
 import * as _angular_core from '@angular/core';
 import { Signal } from '@angular/core';
-import * as i1 from '@radix-ng/primitives/roving-focus';
-import { Direction } from '@radix-ng/primitives/roving-focus';
+import * as _radix_ng_primitives_core from '@radix-ng/primitives/core';
+import { DataOrientation, RdxCancelableChangeEventDetails, BooleanInput, Direction } from '@radix-ng/primitives/core';
 import { ControlValueAccessor } from '@angular/forms';
+import * as i1 from '@radix-ng/primitives/composite';
 
+type RdxToggleGroupContextChangeReason = 'none';
 /**
  * Shared state a {@link RdxToggle} reads when it participates in a toggle group.
  */
@@ -14,17 +14,17 @@ interface RdxToggleGroupContext {
     readonly value: Signal<string[]>;
     /** Whether the whole group is disabled. */
     readonly disabled: Signal<boolean>;
-    /** Whether more than one item can be pressed at a time. */
-    readonly multiple: Signal<boolean>;
     /** The orientation of the group. */
     readonly orientation: Signal<DataOrientation>;
+    /** Whether the group value was initialized by `value` or `defaultValue`. */
+    readonly isValueInitialized: Signal<boolean>;
     /** Toggle the pressed state of `value` within the group. */
-    toggle(value: string, event?: Event): void;
+    toggle(value: string, event?: Event, eventDetails?: RdxCancelableChangeEventDetails<RdxToggleGroupContextChangeReason>): void;
 }
 declare const injectToggleGroupContext: _radix_ng_primitives_core.InjectContext<RdxToggleGroupContext>;
 declare const provideToggleGroupContext: (useFactory: () => RdxToggleGroupContext) => _angular_core.Provider;
 
-type RdxToggleGroupValueChangeReason = 'trigger-press' | 'none';
+type RdxToggleGroupValueChangeReason = 'none';
 type RdxToggleGroupValueChangeEventDetails = RdxCancelableChangeEventDetails<RdxToggleGroupValueChangeReason>;
 interface RdxToggleGroupValueChangeEvent {
     value: string[];
@@ -33,7 +33,7 @@ interface RdxToggleGroupValueChangeEvent {
 /** Builds the shared context a {@link RdxToggle} reads when it belongs to this group. */
 declare function toggleGroupContext(instance: RdxToggleGroupBase): RdxToggleGroupContext;
 /**
- * Shared state and behavior for the toggle group. Concrete directives add the roving-focus group
+ * Shared state and behavior for the toggle group. Concrete directives add the composite root
  * ({@link RdxToggleGroup}) or omit it when an ancestor already owns focus, e.g. a toolbar
  * ({@link RdxToggleGroupWithoutFocus}).
  */
@@ -67,14 +67,18 @@ declare abstract class RdxToggleGroupBase implements ControlValueAccessor {
     readonly onValueChange: _angular_core.OutputEmitterRef<RdxToggleGroupValueChangeEvent>;
     /** @ignore */
     readonly pressedValues: _angular_core.Signal<string[]>;
+    /** @ignore */
+    readonly isValueInitialized: _angular_core.Signal<boolean>;
     protected readonly accessorDisabled: _angular_core.WritableSignal<boolean>;
     /** @ignore */
     readonly isDisabled: _angular_core.Signal<boolean>;
     private onChange?;
     protected onTouched?: () => void;
     constructor();
+    /** @ignore Extra disabled state inherited from composite parents such as Toolbar. */
+    protected isExternallyDisabled(): boolean;
     /** @ignore */
-    toggle(value: string, event?: Event): void;
+    toggle(value: string, event?: Event, eventDetails?: RdxToggleGroupValueChangeEventDetails): void;
     /** @ignore */
     writeValue(value: string[] | string | null): void;
     /** @ignore */
@@ -88,34 +92,41 @@ declare abstract class RdxToggleGroupBase implements ControlValueAccessor {
 }
 
 /**
- * A set of two-state buttons that can be toggled on or off. Owns roving keyboard focus over its
+ * A set of two-state buttons that can be toggled on or off. Owns composite keyboard focus over its
  * `[rdxToggle]` children.
  *
  * @see https://base-ui.com/react/components/toggle-group
  */
 declare class RdxToggleGroup extends RdxToggleGroupBase {
+    private readonly elementRef;
     /** Text direction for arrow-key navigation. */
     readonly dirInput: _angular_core.InputSignal<Direction | undefined>;
-    readonly dir: _angular_core.Signal<_radix_ng_primitives_core.Direction>;
+    readonly dir: _angular_core.Signal<Direction>;
     /**
      * Whether keyboard navigation should loop from the last item back to the first.
      *
      * @default true
      */
     readonly loopFocus: _angular_core.InputSignalWithTransform<boolean, BooleanInput>;
-    private readonly rovingFocusGroup;
+    private readonly compositeRoot;
+    private readonly itemMetadata;
+    private readonly disabledIndices;
+    private readonly activeIndex;
     constructor();
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<RdxToggleGroup, never>;
-    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxToggleGroup, "[rdxToggleGroup]", ["rdxToggleGroup"], { "dirInput": { "alias": "dir"; "required": false; "isSignal": true; }; "loopFocus": { "alias": "loopFocus"; "required": false; "isSignal": true; }; }, {}, never, never, true, [{ directive: typeof i1.RdxRovingFocusGroupDirective; inputs: {}; outputs: {}; }]>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxToggleGroup, "[rdxToggleGroup]", ["rdxToggleGroup"], { "dirInput": { "alias": "dir"; "required": false; "isSignal": true; }; "loopFocus": { "alias": "loopFocus"; "required": false; "isSignal": true; }; }, {}, never, never, true, [{ directive: typeof i1.RdxCompositeRoot; inputs: {}; outputs: {}; }]>;
 }
 
 /**
- * A toggle group that does NOT create its own roving-focus group, for use inside a container that
+ * A toggle group that does NOT create its own composite root, for use inside a container that
  * already owns keyboard focus (e.g. a toolbar). The `[rdxToggle]` children register with the nearest
- * ancestor roving-focus group instead. Mirrors Base UI's behavior of skipping its composite root
+ * ancestor composite root instead. Mirrors Base UI's behavior of skipping its composite root
  * when nested in a toolbar.
  */
 declare class RdxToggleGroupWithoutFocus extends RdxToggleGroupBase {
+    private readonly toolbarRootContext;
+    private readonly toolbarGroupContext;
+    protected isExternallyDisabled(): boolean;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<RdxToggleGroupWithoutFocus, never>;
     static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxToggleGroupWithoutFocus, "[rdxToggleGroupWithoutFocus]", ["rdxToggleGroupWithoutFocus"], {}, {}, never, never, true, never>;
 }

package/types/radix-ng-primitives-toggle.d.ts

@@ -1,9 +1,9 @@
 import * as _angular_core from '@angular/core';
 import { BooleanInput, RdxCancelableChangeEventDetails } from '@radix-ng/primitives/core';
-import * as i1 from '@radix-ng/primitives/roving-focus';
+import * as i1 from '@radix-ng/primitives/composite';
 import * as i1$1 from '@radix-ng/primitives/visually-hidden';
 
-type RdxTogglePressedChangeReason = 'trigger-press' | 'none';
+type RdxTogglePressedChangeReason = 'none';
 type RdxTogglePressedChangeEventDetails = RdxCancelableChangeEventDetails<RdxTogglePressedChangeReason>;
 interface RdxTogglePressedChangeEvent {
     pressed: boolean;
@@ -13,13 +13,13 @@ interface RdxTogglePressedChangeEvent {
  * A two-state button that can be either on (pressed) or off.
  *
  * Works standalone or as an item of a `[rdxToggleGroup]`: inside a group it derives its pressed
- * state from the group's value (matched by `value`) and participates in the group's roving focus.
+ * state from the group's value (matched by `value`) and participates in the group's composite focus.
  *
  * @see https://base-ui.com/react/components/toggle
  */
 declare class RdxToggle {
     private readonly group;
-    private readonly rovingItem;
+    private readonly compositeItem;
     /**
      * A value identifying this toggle inside a `[rdxToggleGroup]`. Required when used in a group.
      */
@@ -60,7 +60,7 @@ declare class RdxToggle {
     /** @ignore */
     protected onKeyDown(event: KeyboardEvent): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<RdxToggle, never>;
-    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxToggle, "[rdxToggle]", ["rdxToggle"], { "value": { "alias": "value"; "required": false; "isSignal": true; }; "defaultPressed": { "alias": "defaultPressed"; "required": false; "isSignal": true; }; "pressed": { "alias": "pressed"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "nativeButton": { "alias": "nativeButton"; "required": false; "isSignal": true; }; }, { "pressed": "pressedChange"; "onPressedChange": "onPressedChange"; }, never, never, true, [{ directive: typeof i1.RdxRovingFocusItemDirective; inputs: {}; outputs: {}; }]>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxToggle, "[rdxToggle]", ["rdxToggle"], { "value": { "alias": "value"; "required": false; "isSignal": true; }; "defaultPressed": { "alias": "defaultPressed"; "required": false; "isSignal": true; }; "pressed": { "alias": "pressed"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "nativeButton": { "alias": "nativeButton"; "required": false; "isSignal": true; }; }, { "pressed": "pressedChange"; "onPressedChange": "onPressedChange"; }, never, never, true, [{ directive: typeof i1.RdxCompositeItem; inputs: {}; outputs: {}; }]>;
 }
 
 declare class RdxToggleVisuallyHiddenInputDirective {