@radix-ng/primitives 0.51.0 → 1.0.0-beta.1

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

@@ -1,106 +1,121 @@
-import * as i0 from '@angular/core';
-import { InputSignalWithTransform, Signal, InputSignal } from '@angular/core';
-import { BooleanInput } from '@angular/cdk/coercion';
-import * as i1 from '@radix-ng/primitives/core';
-import { RdxControlValueAccessor } from '@radix-ng/primitives/core';
 import * as _radix_ng_primitives_switch from '@radix-ng/primitives/switch';
+import * as _angular_core from '@angular/core';
+import { Signal } from '@angular/core';
+import * as i1 from '@radix-ng/primitives/core';
+import { RdxFormCheckboxControl, RdxControlValueAccessor, BooleanInput } from '@radix-ng/primitives/core';
 
-interface SwitchContext {
-    required: InputSignalWithTransform<boolean, BooleanInput>;
-    checked: Signal<boolean | undefined>;
-    disabled: Signal<boolean | undefined>;
-    ariaLabel: InputSignal<string | undefined>;
-    ariaLabelledBy: InputSignal<string | undefined>;
-    markAsTouched: () => void;
-    toggle: () => void;
+/**
+ * The hidden native checkbox that mirrors the switch state for form submission and screen readers.
+ *
+ * @see https://base-ui.com/react/components/switch
+ */
+declare class RdxSwitchInput {
+    protected readonly rootContext: _radix_ng_primitives_switch.RdxSwitchContext;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<RdxSwitchInput, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxSwitchInput, "input[rdxSwitchInput]", ["rdxSwitchInput"], {}, {}, never, never, true, never>;
 }
-declare const injectSwitchRootContext: (optional?: boolean) => SwitchContext | null;
-declare const provideSwitchRootContext: (useFactory: () => SwitchContext) => i0.Provider;
+
 /**
- * @group Components
+ * A control that toggles between on and off.
+ *
+ * @see https://base-ui.com/react/components/switch
  */
-declare class RdxSwitchRootDirective {
+declare class RdxSwitchRoot implements RdxFormCheckboxControl {
+    /** @ignore */
     protected readonly cva: RdxControlValueAccessor<boolean | undefined>;
-    readonly id: InputSignal<string>;
+    readonly id: _angular_core.InputSignal<string>;
     /**
-     * When true, indicates that the user must check the switch before the owning form can be submitted.
+     * The state of the switch when it is initially rendered. Use when you do not need to control its state.
      *
      * @default false
-     * @group Props
-     */
-    readonly required: InputSignalWithTransform<boolean, BooleanInput>;
-    /**
-     * Establishes relationships between the component and label(s) where its value should be one or more element IDs.
-     * @default null
-     * @group Props
      */
-    readonly ariaLabelledBy: InputSignal<string | undefined>;
+    readonly defaultChecked: _angular_core.InputSignalWithTransform<boolean, BooleanInput>;
     /**
-     * Used to define a string that autocomplete attribute the current element.
-     * @default null
-     * @group Props
+     * The controlled checked state. Use with `(onCheckedChange)` or two-way `[(checked)]`.
      */
-    readonly ariaLabel: InputSignal<string | undefined>;
+    readonly checked: _angular_core.ModelSignal<boolean>;
     /**
-     * The state of the switch when it is initially rendered. Use when you do not need to control its state.
+     * When `true`, prevents the user from interacting with the switch.
+     *
      * @default false
-     * @group Props
      */
-    readonly defaultChecked: InputSignalWithTransform<boolean, BooleanInput>;
+    readonly disabled: _angular_core.InputSignalWithTransform<boolean, BooleanInput>;
     /**
-     * The controlled state of the switch. Must be used in conjunction with onCheckedChange.
-     * @defaultValue false
-     * @group Props
-     */
-    readonly checked: i0.ModelSignal<boolean>;
-    /**
-     * When `true`, prevents the user from interacting with the switch.
+     * When `true`, the switch is focusable but cannot be toggled.
+     *
      * @default false
-     * @group Props
      */
-    readonly disabled: InputSignalWithTransform<boolean, BooleanInput>;
+    readonly readonly: _angular_core.InputSignalWithTransform<boolean, BooleanInput>;
     /**
-     * Event handler called when the state of the switch changes.
+     * When `true`, the switch must be on before the owning form can be submitted.
      *
-     * @param {boolean} value - Boolean value indicates that the option is changed.
-     * @group Emits
+     * @default false
      */
-    readonly onCheckedChange: i0.OutputRef<boolean | undefined>;
+    readonly required: _angular_core.InputSignalWithTransform<boolean, BooleanInput>;
+    /** Name of the hidden form input rendered by `[rdxSwitchInput]`. */
+    readonly name: _angular_core.InputSignal<string | undefined>;
     /**
-     * Toggles the checked state of the switch.
-     * If the switch is disabled, the function returns early.
-     * @ignore
+     * Value submitted with the form when the switch is on.
+     *
+     * Bound publicly as `[value]`; the TS member is named `submitValue` so the
+     * directive can satisfy `RdxFormCheckboxControl`, whose contract reserves a
+     * `value` member for `RdxFormValueControl` and forbids it on checkbox-style
+     * controls.
+     *
+     * @default 'on'
      */
+    readonly submitValue: _angular_core.InputSignal<string>;
+    readonly ariaLabelledBy: _angular_core.InputSignal<string | undefined>;
+    readonly ariaLabel: _angular_core.InputSignal<string | undefined>;
+    /** Event handler called when the checked state of the switch changes. */
+    readonly onCheckedChange: _angular_core.OutputEmitterRef<boolean>;
+    /** @ignore */
+    readonly checkedState: _angular_core.Signal<boolean>;
+    /** @ignore */
+    protected readonly isDisabled: _angular_core.Signal<boolean>;
+    /** @ignore Toggles the checked state unless disabled or read-only. */
     toggle(): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<RdxSwitchRootDirective, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<RdxSwitchRootDirective, "button[rdxSwitchRoot]", ["rdxSwitchRoot"], { "id": { "alias": "id"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "ariaLabelledBy": { "alias": "aria-labelledby"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "aria-label"; "required": false; "isSignal": true; }; "defaultChecked": { "alias": "defaultChecked"; "required": false; "isSignal": true; }; "checked": { "alias": "checked"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; }, { "checked": "checkedChange"; "onCheckedChange": "onCheckedChange"; }, never, never, true, [{ directive: typeof i1.RdxControlValueAccessor; inputs: { "value": "checked"; "disabled": "disabled"; }; outputs: {}; }]>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<RdxSwitchRoot, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxSwitchRoot, "button[rdxSwitchRoot]", ["rdxSwitchRoot"], { "id": { "alias": "id"; "required": false; "isSignal": true; }; "defaultChecked": { "alias": "defaultChecked"; "required": false; "isSignal": true; }; "checked": { "alias": "checked"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; "submitValue": { "alias": "value"; "required": false; "isSignal": true; }; "ariaLabelledBy": { "alias": "aria-labelledby"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "aria-label"; "required": false; "isSignal": true; }; }, { "checked": "checkedChange"; "onCheckedChange": "onCheckedChange"; }, never, never, true, [{ directive: typeof i1.RdxControlValueAccessor; inputs: { "value": "checked"; "disabled": "disabled"; }; outputs: {}; }]>;
 }
 
 /**
- * @group Components
+ * The moving part of the switch that indicates whether it is on or off.
+ *
+ * @see https://base-ui.com/react/components/switch
  */
-declare class RdxSwitchInputDirective {
-    protected readonly rootContext: _radix_ng_primitives_switch.SwitchContext;
-    /** @ignore */
-    protected onBlur(): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<RdxSwitchInputDirective, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<RdxSwitchInputDirective, "input[rdxSwitchInput]", ["rdxSwitchInput"], {}, {}, never, never, true, never>;
+declare class RdxSwitchThumb {
+    protected readonly rootContext: _radix_ng_primitives_switch.RdxSwitchContext;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<RdxSwitchThumb, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxSwitchThumb, "span[rdxSwitchThumb]", ["rdxSwitchThumb"], {}, {}, never, never, true, never>;
 }
 
-/**
- * @group Components
- */
-declare class RdxSwitchThumbDirective {
-    protected readonly rootContext: _radix_ng_primitives_switch.SwitchContext | null;
-    static ɵfac: i0.ɵɵFactoryDeclaration<RdxSwitchThumbDirective, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<RdxSwitchThumbDirective, "span[rdxSwitchThumb]", ["rdxSwitchThumb"], {}, {}, never, never, true, never>;
+interface RdxSwitchContext {
+    /** Whether the switch is on. */
+    readonly checked: Signal<boolean>;
+    /** Whether the switch is disabled. */
+    readonly disabled: Signal<boolean>;
+    /** Whether the switch is read-only (focusable, but cannot be toggled). */
+    readonly readonly: Signal<boolean>;
+    /** Whether the switch must be on to submit the owning form. */
+    readonly required: Signal<boolean>;
+    /** Name of the hidden form input. */
+    readonly name: Signal<string | undefined>;
+    /** Value submitted with the form when the switch is on. */
+    readonly value: Signal<string>;
+    readonly ariaLabel: Signal<string | undefined>;
+    readonly ariaLabelledBy: Signal<string | undefined>;
+    markAsTouched(): void;
 }
+declare const injectSwitchContext: i1.InjectContext<RdxSwitchContext>;
+declare const provideSwitchContext: (useFactory: () => RdxSwitchContext) => _angular_core.Provider;
 
+declare const switchImports: (typeof RdxSwitchInput | typeof RdxSwitchRoot | typeof RdxSwitchThumb)[];
 declare class RdxSwitchModule {
-    static ɵfac: i0.ɵɵFactoryDeclaration<RdxSwitchModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<RdxSwitchModule, never, [typeof RdxSwitchRootDirective, typeof RdxSwitchInputDirective, typeof RdxSwitchThumbDirective], [typeof RdxSwitchRootDirective, typeof RdxSwitchInputDirective, typeof RdxSwitchThumbDirective]>;
-    static ɵinj: i0.ɵɵInjectorDeclaration<RdxSwitchModule>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<RdxSwitchModule, never>;
+    static ɵmod: _angular_core.ɵɵNgModuleDeclaration<RdxSwitchModule, never, [typeof RdxSwitchRoot, typeof RdxSwitchInput, typeof RdxSwitchThumb], [typeof RdxSwitchRoot, typeof RdxSwitchInput, typeof RdxSwitchThumb]>;
+    static ɵinj: _angular_core.ɵɵInjectorDeclaration<RdxSwitchModule>;
 }
 
-export { RdxSwitchInputDirective, RdxSwitchModule, RdxSwitchRootDirective, RdxSwitchThumbDirective, injectSwitchRootContext, provideSwitchRootContext };
-export type { SwitchContext };
+export { RdxSwitchInput, RdxSwitchModule, RdxSwitchRoot, RdxSwitchThumb, injectSwitchContext, provideSwitchContext, switchImports };
+export type { RdxSwitchContext };

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

@@ -1,113 +1,247 @@
 import * as _angular_core from '@angular/core';
-import { InjectionToken, OnInit, InputSignalWithTransform } from '@angular/core';
+import { Signal } from '@angular/core';
+import * as i1 from '@radix-ng/primitives/presence';
+import * as _radix_ng_primitives_core from '@radix-ng/primitives/core';
+import { DataOrientation, BooleanInput } from '@radix-ng/primitives/core';
 import * as _radix_ng_primitives_tabs from '@radix-ng/primitives/tabs';
-import * as i1 from '@radix-ng/primitives/roving-focus';
-import { BooleanInput } from '@angular/cdk/coercion';
+import * as i1$1 from '@radix-ng/primitives/roving-focus';
 
-interface TabsProps {
-    /** The value for the selected tab, if controlled */
-    value?: string;
-    /** The value of the tab to select by default, if uncontrolled */
-    defaultValue?: string;
-    /** A function called when a new tab is selected */
-    onValueChange?: (value: string) => void;
-    /**
-     * The orientation the tabs are layed out.
-     * Mainly so arrow navigation is done accordingly (left & right vs. up & down)
-     * @defaultValue horizontal
-     */
-    orientation?: string;
-    /**
-     * The direction of navigation between toolbar items.
-     */
-    dir?: string;
-    /**
-     * Whether a tab is activated automatically or manually.
-     * @defaultValue automatic
-     * */
-    activationMode?: 'automatic' | 'manual';
+/**
+ * Structural directive that mounts the tab panel contents only while the panel is active,
+ * unmounting them once the exit animation finishes. Apply it inside an `[rdxTabsPanel]` to get
+ * Base UI's default unmounting behavior; combine with `keepMounted` on the panel to keep the
+ * contents mounted instead.
+ *
+ * The presence state is read from the parent panel through {@link RdxPresenceDirective}.
+ */
+declare class RdxTabsPanelPresence {
+    constructor();
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<RdxTabsPanelPresence, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxTabsPanelPresence, "ng-template[rdxTabsPanelPresence]", never, {}, {}, never, never, true, [{ directive: typeof i1.RdxPresenceDirective; inputs: {}; outputs: {}; }]>;
 }
-type DataOrientation = 'vertical' | 'horizontal';
-declare const RDX_TABS_ROOT_TOKEN: InjectionToken<RdxTabsRootDirective>;
-declare class RdxTabsRootDirective implements OnInit {
+
+/**
+ * The direction in which the active tab moved relative to the previously active tab.
+ * Mirrors Base UI's `Tabs.Tab.ActivationDirection`.
+ */
+type RdxTabsActivationDirection = 'left' | 'right' | 'up' | 'down' | 'none';
+/** A value that identifies a tab / panel pair. */
+type RdxTabsValue = string | number | null;
+
+/**
+ * Groups the tabs and the corresponding panels.
+ *
+ * @see https://base-ui.com/react/components/tabs
+ */
+declare class RdxTabsRoot {
+    /** @ignore */
+    readonly baseId: string;
     /**
-     * The controlled value of the tab to activate. Should be used in conjunction with `onValueChange`.
+     * The value of the currently selected tab. Use together with `(onValueChange)` for controlled state.
      */
-    readonly value: _angular_core.ModelSignal<string | undefined>;
-    readonly defaultValue: _angular_core.InputSignal<string | undefined>;
+    readonly value: _angular_core.ModelSignal<RdxTabsValue | undefined>;
     /**
-     * When automatic, tabs are activated when receiving focus. When manual, tabs are activated when clicked.
+     * The value of the tab that should be initially selected when uncontrolled.
      */
-    readonly activationMode: _angular_core.InputSignal<"automatic" | "manual">;
+    readonly defaultValue: _angular_core.InputSignal<RdxTabsValue | undefined>;
     /**
-     * The orientation of the component.
+     * The orientation the tabs are laid out. Controls arrow-key navigation
+     * (left/right vs. up/down).
+     *
+     * @default 'horizontal'
      */
     readonly orientation: _angular_core.InputSignal<DataOrientation>;
-    readonly dir: _angular_core.InputSignal<string>;
     /**
-     * Event handler called when the value changes.
+     * Event emitted when the selected tab changes.
      */
-    readonly onValueChange: _angular_core.OutputEmitterRef<string>;
-    ngOnInit(): void;
-    select(value: string): void;
+    readonly onValueChange: _angular_core.OutputEmitterRef<RdxTabsValue>;
+    /** @ignore Set by `[rdxTabsList]`. */
+    readonly activateOnFocus: _angular_core.WritableSignal<boolean>;
+    /** @ignore Set by `[rdxTabsList]`. */
+    readonly tabListElement: _angular_core.WritableSignal<HTMLElement | null>;
+    /** @ignore */
+    readonly activationDirection: _angular_core.WritableSignal<RdxTabsActivationDirection>;
+    constructor();
     /** @ignore */
-    getBaseId(): string;
-    static ɵfac: _angular_core.ɵɵFactoryDeclaration<RdxTabsRootDirective, never>;
-    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxTabsRootDirective, "[rdxTabsRoot]", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "defaultValue": { "alias": "defaultValue"; "required": false; "isSignal": true; }; "activationMode": { "alias": "activationMode"; "required": false; "isSignal": true; }; "orientation": { "alias": "orientation"; "required": false; "isSignal": true; }; "dir": { "alias": "dir"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "onValueChange": "onValueChange"; }, never, never, true, never>;
+    setValue(value: RdxTabsValue): void;
+    private computeDirection;
+    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>;
 }
 
-declare class RdxTabsContentDirective {
-    protected readonly tabsContext: _radix_ng_primitives_tabs.RdxTabsRootDirective;
+/**
+ * Groups the individual tab buttons and manages keyboard navigation.
+ *
+ * @see https://base-ui.com/react/components/tabs
+ */
+declare class RdxTabsList {
+    protected readonly rootContext: _radix_ng_primitives_tabs.RdxTabsRootContext;
+    private readonly elementRef;
+    private readonly rovingFocusGroup;
     /**
-     * A unique value that associates the content with a trigger.
+     * Whether a tab is activated when it receives focus (automatic activation).
+     * When `false`, tabs are only activated on click or Enter/Space.
+     *
+     * @default false
      */
-    readonly value: _angular_core.InputSignal<string>;
-    protected readonly contentId: _angular_core.Signal<string>;
-    protected readonly triggerId: _angular_core.Signal<string>;
-    protected readonly selected: _angular_core.Signal<boolean>;
-    static ɵfac: _angular_core.ɵɵFactoryDeclaration<RdxTabsContentDirective, never>;
-    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxTabsContentDirective, "[rdxTabsContent]", never, { "value": { "alias": "value"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>;
+    readonly activateOnFocus: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /**
+     * Whether keyboard navigation should loop from the last tab back to the first.
+     *
+     * @default true
+     */
+    readonly loopFocus: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    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: {}; }]>;
 }
 
-interface TabsListProps {
-    loop?: boolean;
-}
-declare class RdxTabsListDirective {
-    protected readonly tabsContext: _radix_ng_primitives_tabs.RdxTabsRootDirective;
-    static ɵfac: _angular_core.ɵɵFactoryDeclaration<RdxTabsListDirective, never>;
-    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxTabsListDirective, "[rdxTabsList]", never, {}, {}, never, never, true, [{ directive: typeof i1.RdxRovingFocusGroupDirective; inputs: { "dir": "dir"; "orientation": "orientation"; "loop": "loop"; }; outputs: {}; }]>;
+/**
+ * An individual interactive tab button that activates its corresponding panel.
+ *
+ * @see https://base-ui.com/react/components/tabs
+ */
+declare class RdxTabsTab {
+    protected readonly rootContext: _radix_ng_primitives_tabs.RdxTabsRootContext;
+    private readonly rovingFocusItem;
+    /**
+     * 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.
+     */
+    readonly disabled: _angular_core.InputSignalWithTransform<boolean, BooleanInput>;
+    /** @ignore */
+    protected readonly tabId: _angular_core.Signal<string>;
+    /** @ignore */
+    protected readonly panelId: _angular_core.Signal<string>;
+    /** @ignore */
+    protected readonly active: _angular_core.Signal<boolean>;
+    constructor();
+    /** @ignore */
+    protected onMouseDown(event: MouseEvent): void;
+    /** @ignore */
+    protected onKeyDown(event: KeyboardEvent): void;
+    /** @ignore */
+    protected onFocus(): 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: {}; }]>;
 }
 
-interface TabsTriggerProps {
-    disabled: InputSignalWithTransform<boolean, BooleanInput>;
-}
-declare class RdxTabsTriggerDirective implements TabsTriggerProps {
-    private readonly rdxRovingFocusItemDirective;
-    protected readonly tabsContext: _radix_ng_primitives_tabs.RdxTabsRootDirective;
+/**
+ * A panel displayed when its corresponding tab is active.
+ *
+ * By default the panel stays in the DOM and is toggled with the `hidden` attribute. To unmount the
+ * contents while inactive (Base UI's default `keepMounted: false`), nest a `*rdxTabsPanelPresence`
+ * structural directive inside it; set `keepMounted` to keep the contents mounted regardless.
+ *
+ * @see https://base-ui.com/react/components/tabs
+ */
+declare class RdxTabsPanel {
+    private readonly elementRef;
+    protected readonly rootContext: _radix_ng_primitives_tabs.RdxTabsRootContext;
+    /**
+     * A unique value that associates the panel with a tab.
+     */
+    readonly value: _angular_core.InputSignal<RdxTabsValue>;
     /**
-     * A unique value that associates the trigger with a content.
+     * Keep the panel contents mounted in the DOM while inactive (the contents are still hidden).
+     * Only relevant together with `*rdxTabsPanelPresence`, which otherwise unmounts them.
+     *
+     * @default false
      */
-    readonly value: _angular_core.InputSignal<string>;
+    readonly keepMounted: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    private readonly transition;
+    /** Reactive enter/exit transition phase (`'starting'` | `'ending'` | `undefined`). */
+    readonly transitionStatus: _angular_core.Signal<_radix_ng_primitives_core.RdxTransitionStatus>;
+    /** @ignore */
+    protected readonly panelId: _angular_core.Signal<string>;
+    /** @ignore */
+    protected readonly tabId: _angular_core.Signal<string>;
+    /** Whether this panel's tab is currently selected. */
+    readonly active: _angular_core.Signal<boolean>;
+    /** `true` once a `*rdxTabsPanelPresence` child takes over mounting. */
+    private readonly hasPresence;
     /**
-     * When true, prevents the user from interacting with the tab.
+     * Whether the contents should be present for `*rdxTabsPanelPresence`. Flips with `active` so the
+     * presence directive owns the exit-animation timing (it keeps the node mounted until its exit
+     * `@keyframes` finishes); `keepMounted` keeps them mounted regardless.
      */
-    readonly disabled: InputSignalWithTransform<boolean, BooleanInput>;
-    protected readonly contentId: _angular_core.Signal<string>;
-    protected readonly triggerId: _angular_core.Signal<string>;
-    protected readonly isSelected: _angular_core.Signal<boolean>;
+    readonly present: _angular_core.Signal<boolean>;
+    /**
+     * The `hidden` attribute value. The panel is shown while active or while its exit transition
+     * runs. When a presence child unmounts the contents we no longer force `hidden` (the empty
+     * 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>;
+    private previousActive;
+    private isFirstRun;
     constructor();
-    protected onMouseDown(event: Event): void;
-    protected onKeyDown(event: Event): void;
-    protected onFocus(): void;
-    static ɵfac: _angular_core.ɵɵFactoryDeclaration<RdxTabsTriggerDirective, never>;
-    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxTabsTriggerDirective, "[rdxTabsTrigger]", never, { "value": { "alias": "value"; "required": true; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; }, {}, never, never, true, [{ directive: typeof i1.RdxRovingFocusItemDirective; inputs: { "focusable": "focusable"; "active": "active"; "allowShiftKey": "allowShiftKey"; }; outputs: {}; }]>;
+    /** @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>;
+}
+
+interface TabGeometry {
+    top: number;
+    right: number;
+    bottom: number;
+    left: number;
+    width: number;
+    height: number;
+}
+/**
+ * A visual element that tracks the position and size of the active tab. Exposes the active tab
+ * geometry as CSS variables (`--active-tab-{top,right,bottom,left,width,height}`) so it can be
+ * animated with CSS.
+ *
+ * @see https://base-ui.com/react/components/tabs
+ */
+declare class RdxTabsIndicator {
+    protected readonly rootContext: _radix_ng_primitives_tabs.RdxTabsRootContext;
+    private readonly destroyRef;
+    /** @ignore */
+    protected readonly geometry: _angular_core.WritableSignal<TabGeometry | null>;
+    constructor();
+    private scheduleMeasure;
+    private measure;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<RdxTabsIndicator, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxTabsIndicator, "[rdxTabsIndicator]", ["rdxTabsIndicator"], {}, {}, never, never, true, never>;
+}
+
+interface RdxTabsRootContext {
+    /** Stable id used to derive tab / panel ids. */
+    readonly baseId: string;
+    /** The value of the currently selected tab. */
+    readonly value: Signal<RdxTabsValue | undefined>;
+    /** The orientation of the tabs. */
+    readonly orientation: Signal<DataOrientation>;
+    /** Direction the selection moved relative to the previously active tab. */
+    readonly activationDirection: Signal<RdxTabsActivationDirection>;
+    /** Whether tabs are activated on focus (set by the list). */
+    readonly activateOnFocus: Signal<boolean>;
+    /** The `[rdxTabsList]` host element, used to resolve tab order and indicator geometry. */
+    readonly tabListElement: Signal<HTMLElement | null>;
+    /** Select a tab by value. No-op when the value is unchanged. */
+    setValue(value: RdxTabsValue): 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;
 }
+declare const injectTabsRootContext: _radix_ng_primitives_core.InjectContext<RdxTabsRootContext>;
+declare const provideTabsRootContext: (useFactory: () => RdxTabsRootContext) => _angular_core.Provider;
 
+declare const tabsImports: (typeof RdxTabsPanelPresence)[];
 declare class RdxTabsModule {
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<RdxTabsModule, never>;
-    static ɵmod: _angular_core.ɵɵNgModuleDeclaration<RdxTabsModule, never, [typeof RdxTabsRootDirective, typeof RdxTabsContentDirective, typeof RdxTabsListDirective, typeof RdxTabsTriggerDirective], [typeof RdxTabsRootDirective, typeof RdxTabsContentDirective, typeof RdxTabsListDirective, typeof RdxTabsTriggerDirective]>;
+    static ɵmod: _angular_core.ɵɵNgModuleDeclaration<RdxTabsModule, never, [typeof RdxTabsRoot, typeof RdxTabsList, typeof RdxTabsTab, typeof RdxTabsPanel, typeof RdxTabsPanelPresence, typeof RdxTabsIndicator], [typeof RdxTabsRoot, typeof RdxTabsList, typeof RdxTabsTab, typeof RdxTabsPanel, typeof RdxTabsPanelPresence, typeof RdxTabsIndicator]>;
     static ɵinj: _angular_core.ɵɵInjectorDeclaration<RdxTabsModule>;
 }
 
-export { RDX_TABS_ROOT_TOKEN, RdxTabsContentDirective, RdxTabsListDirective, RdxTabsModule, RdxTabsRootDirective, RdxTabsTriggerDirective };
-export type { DataOrientation, TabsListProps, TabsProps };
+export { RdxTabsIndicator, RdxTabsList, RdxTabsModule, RdxTabsPanel, RdxTabsPanelPresence, RdxTabsRoot, RdxTabsTab, injectTabsRootContext, provideTabsRootContext, tabsImports };
+export type { RdxTabsActivationDirection, RdxTabsRootContext, RdxTabsValue };