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

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

@@ -1,263 +1,377 @@
 import * as _angular_core from '@angular/core';
-import { OnInit, OnDestroy } from '@angular/core';
-import { NumberInput, BooleanInput } from '@angular/cdk/coercion';
+import { Signal } from '@angular/core';
+import * as i1 from '@radix-ng/primitives/core';
+import { RdxControlValueAccessor, NumberInput, BooleanInput } from '@radix-ng/primitives/core';
+export { clamp } from '@radix-ng/primitives/core';
+import * as _radix_ng_primitives_slider from '@radix-ng/primitives/slider';
 
-interface OrientationContext {
-    startEdge: string;
-    endEdge: string;
-    direction: number;
-    size: string;
+type SliderOrientation = 'horizontal' | 'vertical';
+type ThumbCollisionBehavior = 'push' | 'swap' | 'none';
+/** Ascending comparator. */
+declare function asc(a: number, b: number): number;
+/** Maps a value within `[min, max]` to a 0–100 percentage. */
+declare function valueToPercent(value: number, min: number, max: number): number;
+/** Replaces the item at `index` then re-sorts the array ascending. */
+declare function replaceArrayItemAtIndex(array: readonly number[], index: number, newValue: number): number[];
+/** The center point of an element in client coordinates. */
+declare function getMidpoint(element: Element): {
+    x: number;
+    y: number;
+};
+/** Converts an array of values into clamped 0–100 percentages. */
+declare function valueArrayToPercentages(values: readonly number[], min: number, max: number): number[];
+/** Number of decimal places in `num`, handling exponential notation for tiny values. */
+declare function getDecimalPrecision(num: number): number;
+/** Snaps `value` to the nearest step, using `min` as the origin of the step grid. */
+declare function roundValueToStep(value: number, step: number, min: number): number;
+/**
+ * Resolves the value(s) for the keyboard / hidden-input path: clamps to the
+ * bounds, and for range sliders also clamps to neighbouring thumbs and re-sorts.
+ * Returns a `number` for single sliders and a sorted `number[]` for range sliders.
+ */
+declare function getSliderValue(valueInput: number, index: number, min: number, max: number, range: boolean, values: readonly number[]): number | number[];
+/** Returns `false` if any adjacent pair of values is closer than the minimum distance. */
+declare function validateMinimumDistance(values: number | number[], step: number, minStepsBetweenValues: number): boolean;
+/** Keyboard step helper: increments/decrements `thumbValue` and clamps to bounds. */
+declare function getNewValue(thumbValue: number, increment: number, direction: 1 | -1, min: number, max: number): number;
+interface GetPushedThumbValuesParams {
+    values: readonly number[];
+    index: number;
+    nextValue: number;
+    min: number;
+    max: number;
+    step: number;
+    minStepsBetweenValues: number;
+    initialValues?: readonly number[];
+}
+/**
+ * The "push" collision algorithm: moves the pressed thumb and pushes its
+ * neighbours only as far as needed, letting them spring back toward their
+ * initial positions as the pressed thumb retreats.
+ */
+declare function getPushedThumbValues(params: GetPushedThumbValuesParams): number[];
+interface ResolveThumbCollisionParams {
+    behavior: ThumbCollisionBehavior;
+    values: readonly number[];
+    currentValues?: readonly number[];
+    initialValues?: readonly number[] | null;
+    pressedIndex: number;
+    nextValue: number;
+    min: number;
+    max: number;
+    step: number;
+    minStepsBetweenValues: number;
 }
-declare class RdxSliderOrientationContextService {
-    private contextSignal;
-    get context(): OrientationContext;
-    updateContext(context: Partial<OrientationContext>): void;
-    static ɵfac: _angular_core.ɵɵFactoryDeclaration<RdxSliderOrientationContextService, never>;
-    static ɵprov: _angular_core.ɵɵInjectableDeclaration<RdxSliderOrientationContextService>;
+interface ResolveThumbCollisionResult {
+    value: number | number[];
+    thumbIndex: number;
+    didSwap: boolean;
 }
+/** Dispatches the pressed thumb's new value through the configured collision behavior. */
+declare function resolveThumbCollision(params: ResolveThumbCollisionParams): ResolveThumbCollisionResult;
+/**
+ * Border + padding on the leading/trailing edge of the control along the active
+ * axis. Uses physical longhands (`left`/`right`/`top`/`bottom`) rather than
+ * logical ones (`inline-start`/…) because `getComputedStyle` resolves the
+ * physical properties in every browser, whereas logical longhands return an
+ * empty string in some engines.
+ */
+declare function getControlOffset(styles: CSSStyleDeclaration | null, vertical: boolean, rtl: boolean): {
+    start: number;
+    end: number;
+};
+/** Formats a number with a cached `Intl.NumberFormat` instance. */
+declare function formatNumber(value: number | null | undefined, locale: string | undefined, options: Intl.NumberFormatOptions | undefined): string;
+/** Default `aria-valuetext` for a two-thumb range, or a formatted value when `format` is set. */
+declare function getDefaultAriaValueText(values: readonly number[], index: number, format: Intl.NumberFormatOptions | undefined, locale: string | undefined): string | undefined;
+declare const ARROW_KEYS: string[];
+declare const COMPOSITE_KEYS: Set<string>;
+declare const ALL_KEYS: Set<string>;
+declare function areValuesEqual(a: number | number[], b: number | number[]): boolean;
 
+type SliderValue = number | number[];
+/** Minimal shape a thumb registers with the root, used for hit-testing and focus. */
+interface RdxSliderThumbRef {
+    /** The thumb wrapper element. */
+    readonly element: HTMLElement;
+    /** The nested `input[type=range]`, registered once it is initialised. */
+    inputElement: HTMLInputElement | null;
+    /** Whether this thumb is disabled (own state OR root disabled). */
+    readonly disabled: Signal<boolean>;
+}
 /**
- * @group Components
+ * 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
+ * separate horizontal/vertical components.
+ *
+ * @see https://base-ui.com/react/components/slider
  */
-declare class RdxSliderRootComponent implements OnInit {
+declare class RdxSliderRoot {
     /** @ignore */
-    readonly orientationContext: RdxSliderOrientationContextService;
+    protected readonly cva: RdxControlValueAccessor<SliderValue>;
+    readonly id: _angular_core.InputSignal<string>;
     /**
-     * The minimum value for the range.
-     *
-     * @group Props
-     * @defaultValue 0
+     * The minimum value of the slider.
+     * @default 0
      */
     readonly min: _angular_core.InputSignalWithTransform<number, NumberInput>;
     /**
-     * The maximum value for the range.
-     *
-     * @group Props
-     * @defaultValue 100
+     * The maximum value of the slider.
+     * @default 100
      */
     readonly max: _angular_core.InputSignalWithTransform<number, NumberInput>;
     /**
-     * The stepping interval.
-     *
-     * @group Props
-     * @defaultValue 1
+     * The granularity with which the value can change through user interaction.
+     * @default 1
      */
     readonly step: _angular_core.InputSignalWithTransform<number, NumberInput>;
     /**
-     * The minimum permitted steps between multiple thumbs.
-     *
-     * @group Props
-     * @defaultValue 0
+     * The granularity with which the value changes on Page Up / Page Down keys and Shift + Arrow keys.
+     * @default 10
      */
-    readonly minStepsBetweenThumbs: _angular_core.InputSignalWithTransform<number, NumberInput>;
+    readonly largeStep: _angular_core.InputSignalWithTransform<number, NumberInput>;
     /**
-     * The orientation of the slider.
-     *
-     * @group Props
-     * @defaultValue 'horizontal'
-     */
-    readonly orientation: _angular_core.InputSignal<"horizontal" | "vertical">;
-    /**
-     * When true, prevents the user from interacting with the slider.
-     *
-     * @group Props
-     * @defaultValue false
+     * The minimum number of steps that must separate two thumbs in a range slider.
+     * @default 0
      */
-    readonly disabled: _angular_core.InputSignalWithTransform<boolean, BooleanInput>;
+    readonly minStepsBetweenValues: _angular_core.InputSignalWithTransform<number, NumberInput>;
     /**
-     * Whether the slider is visually inverted.
-     *
-     * @group Props
-     * @defaultValue false
+     * The orientation of the slider.
+     * @default 'horizontal'
      */
-    readonly inverted: _angular_core.InputSignalWithTransform<boolean, BooleanInput>;
+    readonly orientation: _angular_core.InputSignal<SliderOrientation>;
     /**
-     * The reading direction of the combobox when applicable.
-     *
-     * @group Props
-     * @defaultValue 'ltr'
+     * The reading direction. Mirrors the horizontal axis when set to `'rtl'`.
+     * @default 'ltr'
      */
     readonly dir: _angular_core.InputSignal<"ltr" | "rtl">;
-    className: string;
-    /**
-     * Style class of the component.
-     *
-     * @group Props
-     */
-    readonly styleClass: _angular_core.InputSignal<string | undefined>;
-    /**
-     * The controlled value of the slider.
-     *
-     * @group Props
-     */
-    readonly modelValue: _angular_core.ModelSignal<number[]>;
     /**
-     * Event handler called when the slider value changes.
-     *
-     * @group Emits
+     * How thumbs behave when they meet in a range slider.
+     * @default 'push'
      */
-    readonly valueChange: _angular_core.OutputEmitterRef<number[]>;
+    readonly thumbCollisionBehavior: _angular_core.InputSignal<ThumbCollisionBehavior>;
+    /** Options forwarded to `Intl.NumberFormat` when displaying and announcing values. */
+    readonly format: _angular_core.InputSignal<Intl.NumberFormatOptions | undefined>;
+    /** Locale used for value formatting. */
+    readonly locale: _angular_core.InputSignal<string | undefined>;
+    /** Name of the hidden inputs rendered by each thumb, for form submission. */
+    readonly name: _angular_core.InputSignal<string | undefined>;
+    /** Id of the form the slider belongs to. */
+    readonly form: _angular_core.InputSignal<string | undefined>;
     /**
-     * Event handler called when the value changes at the end of an interaction.
-     *
-     * Useful when you only need to capture a final value e.g. to update a backend service.
-     *
-     * @group Emits
+     * When `true`, the user cannot interact with the slider.
+     * @default false
      */
-    readonly valueCommit: _angular_core.OutputEmitterRef<number[]>;
+    readonly disabled: _angular_core.InputSignalWithTransform<boolean, BooleanInput>;
+    /** The uncontrolled value of the slider when it is initially rendered. */
+    readonly defaultValue: _angular_core.InputSignal<SliderValue | undefined>;
+    /** The controlled value of the slider. Use with `(onValueChange)` or two-way `[(value)]`. */
+    readonly value: _angular_core.ModelSignal<SliderValue | undefined>;
+    readonly ariaLabelledBy: _angular_core.InputSignal<string | undefined>;
+    /** Emitted when the value changes (during interaction). */
+    readonly onValueChange: _angular_core.OutputEmitterRef<SliderValue>;
+    /** Emitted when interaction ends, with the final value — useful for committing to a backend. */
+    readonly onValueCommitted: _angular_core.OutputEmitterRef<SliderValue>;
     /** @ignore */
-    readonly valueIndexToChange: _angular_core.ModelSignal<number>;
+    readonly controlRef: _angular_core.WritableSignal<HTMLElement | null>;
+    /** @ignore Active thumb index (-1 when none). */
+    readonly active: _angular_core.WritableSignal<number>;
+    /** @ignore Last thumb index that was focused/used, drives z-index stacking. */
+    readonly lastUsedThumbIndex: _angular_core.WritableSignal<number>;
+    /** @ignore Whether a pointer drag is in progress. */
+    readonly dragging: _angular_core.WritableSignal<boolean>;
+    /** @ignore Pointer-drag scratch state (not reactive). */
+    pressedThumbIndex: number;
     /** @ignore */
-    readonly valuesBeforeSlideStart: _angular_core.ModelSignal<number[]>;
+    pressedThumbCenterOffset: number | null;
     /** @ignore */
-    readonly isSlidingFromLeft: _angular_core.Signal<boolean>;
+    pressedInput: HTMLInputElement | null;
+    /** @ignore Snapshot of values at drag start, the baseline for push/swap. */
+    pressedValues: number[] | null;
     /** @ignore */
-    readonly isSlidingFromBottom: _angular_core.Signal<boolean>;
+    lastChangeReason: string;
     /** @ignore */
-    thumbElements: HTMLElement[];
+    readonly isDisabled: Signal<boolean>;
+    /** @ignore The current value source (controlled value, else default, else min). */
+    private readonly currentRaw;
+    /** Whether the slider has multiple thumbs (the value is an array). */
+    readonly range: Signal<boolean>;
+    /** The clamped values rendered to the user, sorted ascending for range sliders. */
+    readonly values: Signal<number[]>;
+    private readonly thumbs;
+    /** Registered thumbs in DOM order. */
+    readonly thumbList: Signal<RdxSliderThumbRef[]>;
     /** @ignore */
-    ngOnInit(): void;
+    registerThumb(thumb: RdxSliderThumbRef): void;
     /** @ignore */
-    onPointerDown(): void;
+    unregisterThumb(thumb: RdxSliderThumbRef): void;
     /** @ignore */
-    handleSlideStart(value: number): void;
+    thumbIndexOf(thumb: RdxSliderThumbRef): number;
     /** @ignore */
-    handleSlideMove(value: number): void;
+    setActive(index: number): void;
     /** @ignore */
-    handleSlideEnd(): void;
+    focusThumb(index: number): void;
     /** @ignore */
-    handleStepKeyDown(event: {
-        event: KeyboardEvent;
-        direction: number;
-    }): void;
+    formatValue(value: number): string;
+    /** @ignore Output value matching the original value shape (number vs array). */
+    private outputValue;
+    /**
+     * @ignore
+     * Applies a new full set of values, preserving the single/range value shape.
+     * Returns `false` when the value did not change.
+     */
+    setValue(nextValues: number[], reason: string): boolean;
+    /** @ignore Keyboard / native input path: clamps to neighbours, commits immediately. */
+    handleInputChange(valueInput: number, index: number, reason?: string): void;
+    /** @ignore Emits the committed value at the end of a pointer drag. */
+    commitValue(): void;
     /** @ignore */
-    updateValues(value: number, atIndex: number, commit?: boolean): void;
-    static ɵfac: _angular_core.ɵɵFactoryDeclaration<RdxSliderRootComponent, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<RdxSliderRootComponent, "rdx-slider", never, { "min": { "alias": "min"; "required": false; "isSignal": true; }; "max": { "alias": "max"; "required": false; "isSignal": true; }; "step": { "alias": "step"; "required": false; "isSignal": true; }; "minStepsBetweenThumbs": { "alias": "minStepsBetweenThumbs"; "required": false; "isSignal": true; }; "orientation": { "alias": "orientation"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "inverted": { "alias": "inverted"; "required": false; "isSignal": true; }; "dir": { "alias": "dir"; "required": false; "isSignal": true; }; "className": { "alias": "className"; "required": false; }; "styleClass": { "alias": "styleClass"; "required": false; "isSignal": true; }; "modelValue": { "alias": "modelValue"; "required": false; "isSignal": true; }; "valueIndexToChange": { "alias": "valueIndexToChange"; "required": false; "isSignal": true; }; "valuesBeforeSlideStart": { "alias": "valuesBeforeSlideStart"; "required": false; "isSignal": true; }; }, { "modelValue": "modelValueChange"; "valueChange": "valueChange"; "valueCommit": "valueCommit"; "valueIndexToChange": "valueIndexToChangeChange"; "valuesBeforeSlideStart": "valuesBeforeSlideStartChange"; }, never, ["*"], true, never>;
+    markAsTouched(): void;
+    /** @ignore */
+    setDragging(dragging: boolean): void;
+    /** @ignore */
+    resetPressedThumb(): void;
+    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; }; "dir": { "alias": "dir"; "required": false; "isSignal": true; }; "thumbCollisionBehavior": { "alias": "thumbCollisionBehavior"; "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.RdxControlValueAccessor; inputs: { "value": "value"; "disabled": "disabled"; }; outputs: {}; }]>;
 }
 
-declare class RdxSliderTrackComponent {
-    protected readonly rootContext: RdxSliderRootComponent;
-    static ɵfac: _angular_core.ɵɵFactoryDeclaration<RdxSliderTrackComponent, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<RdxSliderTrackComponent, "rdx-slider-track", never, {}, {}, never, ["*"], true, never>;
+/**
+ * The interactive area of the slider. Handles pointer presses and drags on the
+ * track, mapping pointer position to a value and moving the closest thumb.
+ *
+ * @see https://base-ui.com/react/components/slider
+ */
+declare class RdxSliderControl {
+    protected readonly root: _radix_ng_primitives_slider.RdxSliderRoot;
+    private readonly elementRef;
+    private readonly document;
+    private styles;
+    private moveCount;
+    private currentInteractionValue;
+    private readonly onMove;
+    private readonly onUp;
+    private readonly onCancel;
+    constructor();
+    protected onPointerDown(event: PointerEvent): void;
+    private handleMove;
+    private handleUp;
+    private stopListening;
+    private startPressing;
+    private setValueFromPointer;
+    /** Projects a pointer position onto the track and resolves it to a value (+ collision). */
+    private getFingerState;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<RdxSliderControl, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxSliderControl, "div[rdxSliderControl]", ["rdxSliderControl"], {}, {}, never, never, true, never>;
 }
 
-declare class RdxSliderRangeComponent {
-    protected readonly rootContext: RdxSliderRootComponent;
-    percentages: _angular_core.Signal<number[]>;
-    offsetStart: _angular_core.Signal<number>;
-    offsetEnd: _angular_core.Signal<number>;
-    rangeStyles: _angular_core.Signal<{
-        [x: string]: string;
-    }>;
-    static ɵfac: _angular_core.ɵɵFactoryDeclaration<RdxSliderRangeComponent, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<RdxSliderRangeComponent, "rdx-slider-range", never, {}, {}, never, ["*"], true, never>;
+/**
+ * The track of the slider — the positioning context for the indicator and thumbs.
+ *
+ * @see https://base-ui.com/react/components/slider
+ */
+declare class RdxSliderTrack {
+    protected readonly root: _radix_ng_primitives_slider.RdxSliderRoot;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<RdxSliderTrack, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxSliderTrack, "div[rdxSliderTrack]", ["rdxSliderTrack"], {}, {}, never, never, true, never>;
 }
 
-declare class RdxSliderThumbImplDirective implements OnInit, OnDestroy {
-    protected readonly rootContext: RdxSliderRootComponent;
-    private readonly elementRef;
-    private readonly platformId;
-    private resizeObserver;
-    isMounted: _angular_core.WritableSignal<boolean>;
-    thumbIndex: _angular_core.Signal<number | null>;
-    value: _angular_core.Signal<number | undefined>;
-    percent: _angular_core.Signal<number>;
-    transform: _angular_core.Signal<string>;
-    orientationSize: _angular_core.WritableSignal<number>;
-    thumbInBoundsOffset: _angular_core.Signal<number>;
-    combinedStyles: _angular_core.Signal<{
-        [x: string]: string | undefined;
-        position: string;
-        transform: string;
-        display: string | undefined;
-    }>;
-    onFocus(): void;
-    ngOnInit(): void;
-    ngOnDestroy(): void;
-    static ɵfac: _angular_core.ɵɵFactoryDeclaration<RdxSliderThumbImplDirective, never>;
-    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxSliderThumbImplDirective, "[rdxSliderThumbImpl]", never, {}, {}, never, never, true, never>;
+/**
+ * Visualises the portion of the track between the slider's minimum (or the first
+ * thumb in a range) and the active value.
+ *
+ * @see https://base-ui.com/react/components/slider
+ */
+declare class RdxSliderIndicator {
+    protected readonly root: _radix_ng_primitives_slider.RdxSliderRoot;
+    protected readonly indicatorStyle: _angular_core.Signal<Record<string, string | number>>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<RdxSliderIndicator, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxSliderIndicator, "div[rdxSliderIndicator]", ["rdxSliderIndicator"], {}, {}, never, never, true, never>;
 }
 
-declare class RdxSliderThumbComponent {
-    static ɵfac: _angular_core.ɵɵFactoryDeclaration<RdxSliderThumbComponent, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<RdxSliderThumbComponent, "rdx-slider-thumb", never, {}, {}, never, ["*"], true, [{ directive: typeof RdxSliderThumbImplDirective; inputs: {}; outputs: {}; }]>;
+/**
+ * A draggable handle. Render one per value; place an `input[rdxSliderThumbInput]`
+ * inside it for keyboard, accessibility and form submission.
+ *
+ * @see https://base-ui.com/react/components/slider
+ */
+declare class RdxSliderThumb implements RdxSliderThumbRef {
+    protected readonly root: _radix_ng_primitives_slider.RdxSliderRoot;
+    readonly element: HTMLElement;
+    /** The nested range input, set by `[rdxSliderThumbInput]`. */
+    inputElement: HTMLInputElement | null;
+    /** Explicit index for this thumb (required for SSR range sliders). */
+    readonly indexInput: _angular_core.InputSignalWithTransform<number | undefined, NumberInput>;
+    /** Disables this individual thumb. */
+    readonly thumbDisabled: _angular_core.InputSignalWithTransform<boolean, BooleanInput>;
+    /** The position of this thumb among its siblings. */
+    readonly index: _angular_core.Signal<number>;
+    /** Whether this thumb is disabled (own state OR root disabled). */
+    readonly disabled: _angular_core.Signal<boolean>;
+    /** The value represented by this thumb. */
+    readonly value: _angular_core.Signal<number | undefined>;
+    private readonly percent;
+    protected readonly thumbStyle: _angular_core.Signal<Record<string, string | number>>;
+    constructor();
+    protected onPointerDown(event: PointerEvent): 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>;
 }
 
-declare class RdxSliderHorizontalComponent {
-    private readonly rootContext;
-    dir: 'ltr' | 'rtl';
-    readonly inverted: _angular_core.InputSignalWithTransform<boolean, BooleanInput>;
-    min: number;
-    max: number;
-    className: string;
-    readonly slideStart: _angular_core.OutputEmitterRef<number>;
-    readonly slideMove: _angular_core.OutputEmitterRef<number>;
-    readonly slideEnd: _angular_core.OutputEmitterRef<void>;
-    readonly stepKeyDown: _angular_core.OutputEmitterRef<{
-        event: KeyboardEvent;
-        direction: number;
-    }>;
-    readonly endKeyDown: _angular_core.OutputEmitterRef<KeyboardEvent>;
-    readonly homeKeyDown: _angular_core.OutputEmitterRef<KeyboardEvent>;
-    private readonly sliderElement;
-    private readonly rect;
-    onSlideStart(event: PointerEvent): void;
-    onSlideMove(event: PointerEvent): void;
-    onSlideEnd(): void;
-    onStepKeyDown(event: KeyboardEvent): void;
-    private getValueFromPointer;
-    static ɵfac: _angular_core.ɵɵFactoryDeclaration<RdxSliderHorizontalComponent, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<RdxSliderHorizontalComponent, "rdx-slider-horizontal", never, { "dir": { "alias": "dir"; "required": false; }; "inverted": { "alias": "inverted"; "required": false; "isSignal": true; }; "min": { "alias": "min"; "required": false; }; "max": { "alias": "max"; "required": false; }; "className": { "alias": "className"; "required": false; }; }, { "slideStart": "slideStart"; "slideMove": "slideMove"; "slideEnd": "slideEnd"; "stepKeyDown": "stepKeyDown"; "endKeyDown": "endKeyDown"; "homeKeyDown": "homeKeyDown"; }, never, ["*"], true, never>;
+/**
+ * The native `input[type=range]` nested inside a thumb. It is visually hidden but
+ * remains the focusable element that drives keyboard interaction, accessibility
+ * and form submission.
+ *
+ * @see https://base-ui.com/react/components/slider
+ */
+declare class RdxSliderThumbInput {
+    protected readonly root: _radix_ng_primitives_slider.RdxSliderRoot;
+    protected readonly thumb: RdxSliderThumb;
+    private readonly element;
+    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>;
+    protected readonly ariaLabelledBy: _angular_core.Signal<string | undefined>;
+    protected readonly valueText: _angular_core.Signal<string | undefined>;
+    constructor();
+    protected onChange(event: Event): void;
+    protected onFocus(): void;
+    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>;
 }
 
-declare class RdxSliderImplDirective {
-    protected readonly rootContext: RdxSliderRootComponent;
-    readonly slideStart: _angular_core.OutputEmitterRef<PointerEvent>;
-    readonly slideMove: _angular_core.OutputEmitterRef<PointerEvent>;
-    readonly slideEnd: _angular_core.OutputEmitterRef<PointerEvent>;
-    readonly homeKeyDown: _angular_core.OutputEmitterRef<KeyboardEvent>;
-    readonly endKeyDown: _angular_core.OutputEmitterRef<KeyboardEvent>;
-    readonly stepKeyDown: _angular_core.OutputEmitterRef<KeyboardEvent>;
-    onKeyDown(event: Event): void;
-    onPointerDown(event: Event): void;
-    onPointerMove(event: Event): void;
-    onPointerUp(event: Event): void;
-    static ɵfac: _angular_core.ɵɵFactoryDeclaration<RdxSliderImplDirective, never>;
-    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxSliderImplDirective, "[rdxSliderImpl]", never, {}, { "slideStart": "slideStart"; "slideMove": "slideMove"; "slideEnd": "slideEnd"; "homeKeyDown": "homeKeyDown"; "endKeyDown": "endKeyDown"; "stepKeyDown": "stepKeyDown"; }, never, never, true, never>;
+/**
+ * Displays the slider's current value(s) as formatted text. Renders into an
+ * `output` element; the displayed value honours the root `format` and `locale`.
+ *
+ * @see https://base-ui.com/react/components/slider
+ */
+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 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>;
 }
 
-declare class RdxSliderVerticalComponent {
-    private readonly rootContext;
-    dir: 'ltr' | 'rtl';
-    readonly inverted: _angular_core.InputSignalWithTransform<boolean, BooleanInput>;
-    min: number;
-    max: number;
-    className: string;
-    readonly slideStart: _angular_core.OutputEmitterRef<number>;
-    readonly slideMove: _angular_core.OutputEmitterRef<number>;
-    readonly slideEnd: _angular_core.OutputEmitterRef<void>;
-    readonly stepKeyDown: _angular_core.OutputEmitterRef<{
-        event: KeyboardEvent;
-        direction: number;
-    }>;
-    readonly endKeyDown: _angular_core.OutputEmitterRef<KeyboardEvent>;
-    readonly homeKeyDown: _angular_core.OutputEmitterRef<KeyboardEvent>;
-    private readonly sliderElement;
-    private readonly rect;
-    onSlideStart(event: PointerEvent): void;
-    onSlideMove(event: PointerEvent): void;
-    onSlideEnd(): void;
-    onStepKeyDown(event: KeyboardEvent): void;
-    private getValueFromPointer;
-    static ɵfac: _angular_core.ɵɵFactoryDeclaration<RdxSliderVerticalComponent, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<RdxSliderVerticalComponent, "rdx-slider-vertical", never, { "dir": { "alias": "dir"; "required": false; }; "inverted": { "alias": "inverted"; "required": false; "isSignal": true; }; "min": { "alias": "min"; "required": false; }; "max": { "alias": "max"; "required": false; }; "className": { "alias": "className"; "required": false; }; }, { "slideStart": "slideStart"; "slideMove": "slideMove"; "slideEnd": "slideEnd"; "stepKeyDown": "stepKeyDown"; "endKeyDown": "endKeyDown"; "homeKeyDown": "homeKeyDown"; }, never, ["*"], true, never>;
-}
+/**
+ * The Slider context exposes the root directive instance to every child part.
+ * The root owns all state, value-change logic and thumb registration; parts read
+ * signals and call methods off it.
+ *
+ * @see https://base-ui.com/react/components/slider
+ */
+declare const injectSliderRootContext: i1.InjectContext<RdxSliderRoot>;
+declare const provideSliderRootContext: (useFactory: () => RdxSliderRoot) => _angular_core.Provider;
 
 declare class RdxSliderModule {
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<RdxSliderModule, never>;
-    static ɵmod: _angular_core.ɵɵNgModuleDeclaration<RdxSliderModule, never, [typeof RdxSliderRootComponent, typeof RdxSliderTrackComponent, typeof RdxSliderRangeComponent, typeof RdxSliderThumbComponent], [typeof RdxSliderRootComponent, typeof RdxSliderTrackComponent, typeof RdxSliderRangeComponent, typeof RdxSliderThumbComponent]>;
+    static ɵmod: _angular_core.ɵɵNgModuleDeclaration<RdxSliderModule, never, [typeof RdxSliderRoot, typeof RdxSliderControl, typeof RdxSliderTrack, typeof RdxSliderIndicator, typeof RdxSliderThumb, typeof RdxSliderThumbInput, typeof RdxSliderValue], [typeof RdxSliderRoot, typeof RdxSliderControl, typeof RdxSliderTrack, typeof RdxSliderIndicator, typeof RdxSliderThumb, typeof RdxSliderThumbInput, typeof RdxSliderValue]>;
     static ɵinj: _angular_core.ɵɵInjectorDeclaration<RdxSliderModule>;
 }
 
-export { RdxSliderHorizontalComponent, RdxSliderImplDirective, RdxSliderModule, RdxSliderRangeComponent, RdxSliderRootComponent, RdxSliderThumbComponent, RdxSliderThumbImplDirective, RdxSliderTrackComponent, RdxSliderVerticalComponent };
+export { ALL_KEYS, ARROW_KEYS, COMPOSITE_KEYS, RdxSliderControl, RdxSliderIndicator, RdxSliderModule, RdxSliderRoot, RdxSliderThumb, RdxSliderThumbInput, RdxSliderTrack, RdxSliderValue, areValuesEqual, asc, formatNumber, getControlOffset, getDecimalPrecision, getDefaultAriaValueText, getMidpoint, getNewValue, getPushedThumbValues, getSliderValue, injectSliderRootContext, provideSliderRootContext, replaceArrayItemAtIndex, resolveThumbCollision, roundValueToStep, validateMinimumDistance, valueArrayToPercentages, valueToPercent };
+export type { RdxSliderThumbRef, ResolveThumbCollisionParams, ResolveThumbCollisionResult, SliderOrientation, SliderValue, ThumbCollisionBehavior };

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

@@ -1,9 +1,8 @@
 import * as _angular_core from '@angular/core';
-import { InputSignalWithTransform, Signal, ModelSignal, InputSignal, WritableSignal, InjectionToken, OnInit, OnDestroy } from '@angular/core';
-import { NumberInput, BooleanInput } from '@angular/cdk/coercion';
+import { InputSignalWithTransform, Signal, ModelSignal, InputSignal, WritableSignal, InjectionToken } from '@angular/core';
+import { NumberInput, BooleanInput, Direction } from '@radix-ng/primitives/core';
 import * as _radix_ng_primitives_stepper from '@radix-ng/primitives/stepper';
 import * as i1 from '@radix-ng/primitives/separator';
-import { Direction } from '@angular/cdk/bidi';
 
 type StepperState = 'completed' | 'active' | 'inactive';
 
@@ -34,7 +33,7 @@ declare class RdxStepperSeparatorDirective {
     private readonly rdxSeparator;
     constructor();
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<RdxStepperSeparatorDirective, never>;
-    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxStepperSeparatorDirective, "[rdxStepperSeparator]", never, {}, {}, never, never, true, [{ directive: typeof i1.RdxSeparatorRootDirective; inputs: { "orientation": "orientation"; "decorative": "decorative"; }; outputs: {}; }]>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxStepperSeparatorDirective, "[rdxStepperSeparator]", never, {}, {}, never, never, true, [{ directive: typeof i1.RdxSeparatorRootDirective; inputs: { "orientation": "orientation"; }; outputs: {}; }]>;
 }
 
 declare class RdxStepperItemDirective implements StepperItemContext {
@@ -101,13 +100,12 @@ declare class RdxStepperRootDirective implements StepperRootContext {
     static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxStepperRootDirective, "[rdxStepperRoot]", ["rdxStepperRoot"], { "defaultValue": { "alias": "defaultValue"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "linear": { "alias": "linear"; "required": false; "isSignal": true; }; "dir": { "alias": "dir"; "required": false; "isSignal": true; }; "orientation": { "alias": "orientation"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "onValueChange": "onValueChange"; }, never, never, true, never>;
 }
 
-declare class RdxStepperTriggerDirective implements OnInit, OnDestroy {
+declare class RdxStepperTriggerDirective {
     protected readonly rootContext: _radix_ng_primitives_stepper.StepperRootContext;
     protected readonly itemContext: StepperItemContext;
     private readonly elementRef;
     readonly stepperItems: _angular_core.Signal<HTMLElement[]>;
-    ngOnInit(): void;
-    ngOnDestroy(): void;
+    constructor();
     handleMouseDown(event: Event): void;
     handleKeyDown(event: Event): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<RdxStepperTriggerDirective, never>;