ropav 0.1.5 → 0.1.7

package/dist/components/scroll-area/useScrollArea.d.ts

@@ -1,58 +1,76 @@
-import { ScrollAreaPosition, ScrollAreaProps } from './types.js';
-interface UseScrollAreaOptions {
-    props: Readonly<ScrollAreaProps>;
-    emitScroll: (event: Event) => void;
-    emitPositionChange: (position: ScrollAreaPosition) => void;
-    emitReachTop: (event: Event) => void;
-    emitReachBottom: (event: Event) => void;
-    emitReachLeft: (event: Event) => void;
-    emitReachRight: (event: Event) => void;
+import { ScrollAxis } from '../../utils/dom/scroll.js';
+import { ScrollAreaPosition, ScrollAreaProps, ScrollAreaSlotProps } from './types.js';
+interface ScrollAreaEmit {
+    (event: 'scroll', value: Event): void;
+    (event: 'scrollPositionChange', value: ScrollAreaPosition): void;
+    (event: 'reachTop', value: Event): void;
+    (event: 'reachBottom', value: Event): void;
+    (event: 'reachLeft', value: Event): void;
+    (event: 'reachRight', value: Event): void;
 }
-export declare function useScrollArea(options: UseScrollAreaOptions): {
-    onScrollbarPointerdown: (axis: import('./scrollAreaCore.js').ScrollAxis, event: PointerEvent) => void;
-    onThumbPointerdown: (axis: import('./scrollAreaCore.js').ScrollAxis, event: PointerEvent) => void;
-    onViewportScroll: (event: Event) => void;
-    onScrollbarKeydown: (axis: import('./scrollAreaCore.js').ScrollAxis, event: KeyboardEvent) => void;
-    onScrollbarWheel: (axis: import('./scrollAreaCore.js').ScrollAxis, event: WheelEvent) => void;
-    writeAxisPosition: (axis: import('./scrollAreaCore.js').ScrollAxis, value: number) => void;
-    scrollTo: (scrollOptions: ScrollToOptions) => void;
-    scrollBy: (scrollOptions: ScrollToOptions) => void;
+export declare function useScrollArea(props: Readonly<ScrollAreaProps>, emit: ScrollAreaEmit): {
+    templateRefs: {
+        root: import('vue').Ref<HTMLElement | null, HTMLElement | null>;
+        viewport: import('vue').Ref<HTMLElement | null, HTMLElement | null>;
+        content: import('vue').Ref<HTMLElement | null, HTMLElement | null>;
+        horizontalScrollbar: import('vue').Ref<HTMLElement | null, HTMLElement | null>;
+        verticalScrollbar: import('vue').Ref<HTMLElement | null, HTMLElement | null>;
+    };
     renderHorizontalScrollbar: import('vue').ComputedRef<boolean>;
     renderVerticalScrollbar: import('vue').ComputedRef<boolean>;
-    horizontalScrollbarActive: import('vue').ComputedRef<boolean>;
-    verticalScrollbarActive: import('vue').ComputedRef<boolean>;
-    horizontalScrollbarVisible: import('vue').ComputedRef<boolean>;
-    verticalScrollbarVisible: import('vue').ComputedRef<boolean>;
-    showDuringScroll: () => void;
-    setDraggingAxis: (axis: import('./scrollAreaCore.js').ScrollAxis | null) => void;
-    onPointerenter: () => void;
-    onPointerleave: () => void;
-    onFocusin: () => void;
-    onFocusout: (event: FocusEvent) => void;
-    rootRef: import('vue').Ref<HTMLElement | null, HTMLElement | null>;
-    viewportRef: import('vue').Ref<HTMLElement | null, HTMLElement | null>;
-    contentRef: import('vue').Ref<HTMLElement | null, HTMLElement | null>;
-    horizontalScrollbarRef: import('vue').Ref<HTMLElement | null, HTMLElement | null>;
-    verticalScrollbarRef: import('vue').Ref<HTMLElement | null, HTMLElement | null>;
-    metrics: {
-        clientWidth: number;
-        clientHeight: number;
-        scrollWidth: number;
-        scrollHeight: number;
-        x: number;
-        y: number;
-        overflowX: boolean;
-        overflowY: boolean;
-        horizontalThumbSize: number;
-        horizontalThumbOffset: number;
-        verticalThumbSize: number;
-        verticalThumbOffset: number;
-    };
-    position: import('vue').ComputedRef<ScrollAreaPosition>;
+    rootAttrs: import('vue').ComputedRef<Record<string, unknown>>;
+    viewportAttrs: import('vue').ComputedRef<import('vue').HTMLAttributes>;
+    contentAttrs: import('vue').ComputedRef<import('vue').HTMLAttributes>;
+    horizontalScrollbarAttrs: import('vue').ComputedRef<{
+        role: string;
+        tabindex: number;
+        'aria-controls': string | undefined;
+        'aria-orientation': import('./types.js').ScrollAreaOrientation;
+        'aria-valuemin': number;
+        'aria-valuemax': number;
+        'aria-valuenow': number;
+        'aria-disabled': true | undefined;
+        'aria-hidden': true | undefined;
+        'data-orientation': string;
+        'data-direction': import('../../utils/dom/scroll.js').ScrollDirection;
+        'data-active': "" | undefined;
+        'data-visible': "" | undefined;
+        class?: import('vue').ClassValue;
+        style?: import('vue').StyleValue;
+    }>;
+    verticalScrollbarAttrs: import('vue').ComputedRef<{
+        role: string;
+        tabindex: number;
+        'aria-controls': string | undefined;
+        'aria-orientation': import('./types.js').ScrollAreaOrientation;
+        'aria-valuemin': number;
+        'aria-valuemax': number;
+        'aria-valuenow': number;
+        'aria-disabled': true | undefined;
+        'aria-hidden': true | undefined;
+        'data-orientation': string;
+        'data-direction': import('../../utils/dom/scroll.js').ScrollDirection;
+        'data-active': "" | undefined;
+        'data-visible': "" | undefined;
+        class?: import('vue').ClassValue;
+        style?: import('vue').StyleValue;
+    }>;
+    horizontalThumbAttrs: import('vue').ComputedRef<Pick<import('vue').HTMLAttributes, "class" | "style">>;
+    verticalThumbAttrs: import('vue').ComputedRef<Pick<import('vue').HTMLAttributes, "class" | "style">>;
+    cornerAttrs: import('vue').ComputedRef<{
+        'aria-hidden': boolean;
+        'data-direction': import('../../utils/dom/scroll.js').ScrollDirection;
+        'data-visible': "" | undefined;
+        class?: import('vue').ClassValue;
+        style?: import('vue').StyleValue;
+    }>;
+    slotProps: import('vue').ComputedRef<ScrollAreaSlotProps>;
+    onScrollbarKeydown: (axis: ScrollAxis, event: KeyboardEvent) => void;
+    onScrollbarWheel: (axis: ScrollAxis, event: WheelEvent) => void;
+    onScrollbarPointerdown: (axis: ScrollAxis, event: PointerEvent) => void;
+    onThumbPointerdown: (axis: ScrollAxis, event: PointerEvent) => void;
+    scrollTo: (scrollOptions: ScrollToOptions) => void;
+    scrollBy: (scrollOptions: ScrollToOptions) => void;
     update: () => void;
-    getPosition: (axis: import('./scrollAreaCore.js').ScrollAxis) => number;
-    getMaxPosition: (axis: import('./scrollAreaCore.js').ScrollAxis) => number;
-    getOverflow: (axis: import('./scrollAreaCore.js').ScrollAxis) => boolean;
 };
-export type ScrollAreaController = ReturnType<typeof useScrollArea>;
 export {};

package/dist/components/scroll-area/{useScrollAreaPresentation.d.ts → useScrollAreaAttributes.d.ts}

@@ -1,10 +1,35 @@
-import { HTMLAttributes } from 'vue';
-import { ScrollAreaController } from './useScrollArea.js';
-import { ScrollAreaOrientation, ScrollAreaProps, ScrollAreaSlotProps } from './types.js';
-export declare function useScrollAreaPresentation(props: Readonly<ScrollAreaProps>, scrollArea: ScrollAreaController): {
-    rootAttrs: import('vue').ComputedRef<Record<string, unknown>>;
-    viewportAttrs: import('vue').ComputedRef<HTMLAttributes>;
+import { HTMLAttributes, Ref } from 'vue';
+import { ScrollAreaMetrics } from './scrollAreaModel.js';
+import { ScrollAreaOrientation, ScrollAreaProps } from './types.js';
+interface ScrollAreaRootHandlers {
+    onFocusin: () => void;
+    onFocusout: (event: FocusEvent) => void;
+    onPointerenter: () => void;
+    onPointerleave: () => void;
+}
+interface ScrollAreaAttributeState {
+    horizontalActive: Readonly<Ref<boolean>>;
+    horizontalVisible: Readonly<Ref<boolean>>;
+    verticalActive: Readonly<Ref<boolean>>;
+    verticalVisible: Readonly<Ref<boolean>>;
+}
+interface UseScrollAreaAttributesOptions {
+    metrics: ScrollAreaMetrics;
+    onViewportScroll: (event: Event) => void;
+    props: Readonly<ScrollAreaProps>;
+    rootHandlers: ScrollAreaRootHandlers;
+    state: ScrollAreaAttributeState;
+    viewport: Ref<HTMLElement | null>;
+}
+export declare function useScrollAreaAttributes({ metrics, onViewportScroll, props, rootHandlers, state, viewport, }: UseScrollAreaAttributesOptions): {
     contentAttrs: import('vue').ComputedRef<HTMLAttributes>;
+    cornerAttrs: import('vue').ComputedRef<{
+        'aria-hidden': boolean;
+        'data-direction': import('../../utils/dom/scroll.js').ScrollDirection;
+        'data-visible': "" | undefined;
+        class?: import('vue').ClassValue;
+        style?: import('vue').StyleValue;
+    }>;
     horizontalScrollbarAttrs: import('vue').ComputedRef<{
         role: string;
         tabindex: number;
@@ -16,11 +41,14 @@ export declare function useScrollAreaPresentation(props: Readonly<ScrollAreaProp
         'aria-disabled': true | undefined;
         'aria-hidden': true | undefined;
         'data-orientation': string;
+        'data-direction': import('../../utils/dom/scroll.js').ScrollDirection;
         'data-active': "" | undefined;
         'data-visible': "" | undefined;
         class?: import('vue').ClassValue;
         style?: import('vue').StyleValue;
     }>;
+    horizontalThumbAttrs: import('vue').ComputedRef<Pick<HTMLAttributes, "class" | "style">>;
+    rootAttrs: import('vue').ComputedRef<Record<string, unknown>>;
     verticalScrollbarAttrs: import('vue').ComputedRef<{
         role: string;
         tabindex: number;
@@ -32,18 +60,13 @@ export declare function useScrollAreaPresentation(props: Readonly<ScrollAreaProp
         'aria-disabled': true | undefined;
         'aria-hidden': true | undefined;
         'data-orientation': string;
+        'data-direction': import('../../utils/dom/scroll.js').ScrollDirection;
         'data-active': "" | undefined;
         'data-visible': "" | undefined;
         class?: import('vue').ClassValue;
         style?: import('vue').StyleValue;
     }>;
-    horizontalThumbAttrs: import('vue').ComputedRef<Pick<HTMLAttributes, "class" | "style">>;
     verticalThumbAttrs: import('vue').ComputedRef<Pick<HTMLAttributes, "class" | "style">>;
-    cornerAttrs: import('vue').ComputedRef<{
-        'aria-hidden': boolean;
-        'data-visible': "" | undefined;
-        class?: import('vue').ClassValue;
-        style?: import('vue').StyleValue;
-    }>;
-    slotProps: import('vue').ComputedRef<ScrollAreaSlotProps>;
+    viewportAttrs: import('vue').ComputedRef<HTMLAttributes>;
 };
+export {};

package/dist/components/scroll-area/useScrollAreaDerivedState.d.ts

@@ -0,0 +1,8 @@
+import { ScrollAreaMetrics } from './scrollAreaModel.js';
+import { ScrollAreaProps } from './types.js';
+export declare function useScrollAreaDerivedState(props: Readonly<ScrollAreaProps>, metrics: ScrollAreaMetrics): {
+    horizontalScrollbarActive: import('vue').ComputedRef<boolean>;
+    renderHorizontalScrollbar: import('vue').ComputedRef<boolean>;
+    renderVerticalScrollbar: import('vue').ComputedRef<boolean>;
+    verticalScrollbarActive: import('vue').ComputedRef<boolean>;
+};

package/dist/components/scroll-area/useScrollAreaMeasurement.d.ts

@@ -0,0 +1,35 @@
+import { Ref } from 'vue';
+import { ScrollAxis } from '../../utils/dom/scroll.js';
+interface ScrollAreaMeasurementElements {
+    content: Ref<HTMLElement | null>;
+    horizontalScrollbar: Ref<HTMLElement | null>;
+    verticalScrollbar: Ref<HTMLElement | null>;
+    viewport: Ref<HTMLElement | null>;
+}
+interface UseScrollAreaMeasurementOptions {
+    elements: ScrollAreaMeasurementElements;
+    isAxisEnabled: (axis: ScrollAxis) => boolean;
+    minimumThumbSize: number;
+}
+export declare function useScrollAreaMeasurement({ elements, isAxisEnabled, minimumThumbSize, }: UseScrollAreaMeasurementOptions): {
+    metrics: {
+        direction: import('../../utils/dom/scroll.js').ScrollDirection;
+        clientWidth: number;
+        clientHeight: number;
+        scrollWidth: number;
+        scrollHeight: number;
+        x: number;
+        y: number;
+        overflowX: boolean;
+        overflowY: boolean;
+        horizontalThumbSize: number;
+        horizontalThumbOffset: number;
+        verticalThumbSize: number;
+        verticalThumbOffset: number;
+    };
+    schedulePositionUpdate: () => void;
+    scheduleUpdate: () => void;
+    update: () => void;
+    updatePosition: (viewport?: HTMLElement | null) => void;
+};
+export {};

package/dist/components/scroll-area/useScrollAreaPointer.d.ts

@@ -1,14 +1,16 @@
 import { Ref } from 'vue';
-import { ScrollAxis } from './scrollAreaCore.js';
-import { ScrollAreaControlsController } from './useScrollAreaControls.js';
-import { ScrollAreaMetricsController } from './useScrollAreaMetrics.js';
+import { ScrollAxis } from '../../utils/dom/scroll.js';
+import { ScrollAreaAxisState } from './scrollAreaModel.js';
+interface ScrollAreaPointerElements {
+    horizontalScrollbar: Ref<HTMLElement | null>;
+    verticalScrollbar: Ref<HTMLElement | null>;
+}
 interface UseScrollAreaPointerOptions {
-    horizontalScrollbarRef: Ref<HTMLElement | null>;
-    verticalScrollbarRef: Ref<HTMLElement | null>;
-    metrics: ScrollAreaMetricsController;
-    controls: ScrollAreaControlsController;
+    elements: ScrollAreaPointerElements;
+    isEmbedded: () => boolean;
+    refreshAxis: (axis: ScrollAxis) => ScrollAreaAxisState;
     setDraggingAxis: (axis: ScrollAxis | null) => void;
-    shouldFocusScrollbar: () => boolean;
+    writeAxisPosition: (axis: ScrollAxis, position: number) => void;
 }
 export declare function useScrollAreaPointer(options: UseScrollAreaPointerOptions): {
     onScrollbarPointerdown: (axis: ScrollAxis, event: PointerEvent) => void;

package/dist/components/scroll-area/useScrollAreaVisibility.d.ts

@@ -1,27 +1,22 @@
 import { Ref } from 'vue';
-import { ScrollAxis } from './scrollAreaCore.js';
-import { ScrollAreaProps } from './types.js';
+import { ScrollAxis } from '../../utils/dom/scroll.js';
+import { ScrollAreaType } from './types.js';
 interface UseScrollAreaVisibilityOptions {
-    props: Readonly<ScrollAreaProps>;
-    rootRef: Ref<HTMLElement | null>;
-    horizontalEnabled: Readonly<Ref<boolean>>;
-    verticalEnabled: Readonly<Ref<boolean>>;
-    overflowX: () => boolean;
-    overflowY: () => boolean;
+    getHideDelay: () => number | undefined;
+    getType: () => ScrollAreaType;
+    isScrollbarActive: (axis: ScrollAxis) => boolean;
+    root: Ref<HTMLElement | null>;
 }
 export declare function useScrollAreaVisibility(options: UseScrollAreaVisibilityOptions): {
-    renderHorizontalScrollbar: import('vue').ComputedRef<boolean>;
-    renderVerticalScrollbar: import('vue').ComputedRef<boolean>;
-    horizontalScrollbarActive: import('vue').ComputedRef<boolean>;
-    verticalScrollbarActive: import('vue').ComputedRef<boolean>;
-    horizontalScrollbarVisible: import('vue').ComputedRef<boolean>;
-    verticalScrollbarVisible: import('vue').ComputedRef<boolean>;
-    showDuringScroll: () => void;
+    horizontalVisible: import('vue').ComputedRef<boolean>;
+    rootHandlers: {
+        onPointerenter(): void;
+        onPointerleave(): void;
+        onFocusin(): void;
+        onFocusout(event: FocusEvent): void;
+    };
     setDraggingAxis: (axis: ScrollAxis | null) => void;
-    onPointerenter: () => void;
-    onPointerleave: () => void;
-    onFocusin: () => void;
-    onFocusout: (event: FocusEvent) => void;
+    showDuringScroll: () => void;
+    verticalVisible: import('vue').ComputedRef<boolean>;
 };
-export type ScrollAreaVisibilityController = ReturnType<typeof useScrollAreaVisibility>;
 export {};

package/dist/components/select/useSelect.d.ts

@@ -7,8 +7,9 @@ export declare function useSelect(props: Readonly<SelectBehaviorProps>, emitUpda
     triggerRef: Ref<HTMLElement | null, HTMLElement | null>;
     isOpen: Ref<boolean, boolean>;
     selectId: string;
+    popupId: string;
     listboxId: string;
-    control: import('../../composables/useControlState.js').ControlState;
+    control: import('../../internal/composables/useControlState.js').ControlState;
     visibleOptions: import('vue').ComputedRef<SelectOption[]>;
     focusedIndex: import('vue').ComputedRef<number>;
     activeDescendantId: import('vue').ComputedRef<string | undefined>;

package/dist/components/select/useSelectNativeValue.d.ts

@@ -2,13 +2,7 @@ import { SelectProps } from './types.js';
 export type SelectValue = string | number | null;
 export declare function useSelectNativeValue(props: Readonly<SelectProps>, emitUpdate: (value: SelectValue) => void): {
     nativeSelectRef: import('vue').Ref<HTMLSelectElement | null, HTMLSelectElement | null>;
-    controllable: {
-        initialValue: SelectValue;
-        isControlled: import('vue').ComputedRef<boolean>;
-        value: import('vue').ComputedRef<SelectValue>;
-        setValue: (nextValue: SelectValue) => void;
-        resetValue: (nextValue?: SelectValue) => void;
-    };
+    controllable: import('../../composables/useControllableValue.js').UseControllableValueReturn<SelectValue>;
     getNativeValue: (select: HTMLSelectElement) => string | number | null;
     syncNativeSelection: (value: SelectValue) => void;
     requestValueUpdate: (value: SelectValue) => void;

package/dist/components/slider/rangeSliderModel.d.ts

@@ -0,0 +1,41 @@
+import { RangeSliderProps, RangeSliderThumb, RangeSliderValue } from './types.js';
+import { SliderBounds } from './sliderModel.js';
+export interface RangeSliderPointerGeometry {
+    length: number;
+    start: number;
+    vertical: boolean;
+}
+export interface RangeSliderPointerCoordinates {
+    clientX: number;
+    clientY: number;
+}
+interface RangeSliderThumbUpdateOptions {
+    thumb: RangeSliderThumb;
+    value: number;
+    currentValue: RangeSliderValue;
+    bounds: SliderBounds;
+    step: number | 'any';
+    minRange: number;
+    nativeMin: RangeSliderValue;
+    nativeMax: RangeSliderValue;
+    anchorValue?: number;
+}
+export declare function normalizeRangeSliderMinRange(minRange: number, min: number, max: number): number;
+export declare function normalizeRangeSliderValue(value: RangeSliderValue, min: number, max: number, step: number | 'any', minRange?: number): RangeSliderValue;
+export declare function getClosestRangeSliderThumb(value: number, range: RangeSliderValue, activeThumb?: RangeSliderThumb): RangeSliderThumb;
+export declare function getRangeSliderNativeStep(bounds: SliderBounds, step: number | 'any'): number | "any";
+export declare function getRangeSliderNativeLimits(value: RangeSliderValue, bounds: SliderBounds, step: number | 'any', minRange: number): {
+    min: RangeSliderValue;
+    max: RangeSliderValue;
+};
+export declare function getRangeSliderThumbUpdate({ thumb, value, currentValue, bounds, step, minRange, nativeMin, nativeMax, anchorValue, }: RangeSliderThumbUpdateOptions): {
+    thumb: RangeSliderThumb;
+    value: RangeSliderValue;
+};
+export declare function getFormattedRangeSliderValue(value: RangeSliderValue, formatter: RangeSliderProps['formatValue']): [string | number, string | number];
+export declare function getRangeSliderAriaValueText(value: RangeSliderValue, ariaValueText: RangeSliderProps['ariaValueText'], formatter: RangeSliderProps['formatValue']): [string | undefined, string | undefined];
+export declare function getRangeSliderThumbIndex(thumb: RangeSliderThumb): 0 | 1;
+export declare function getOppositeRangeSliderThumb(thumb: RangeSliderThumb): RangeSliderThumb;
+export declare function getRangeSliderKeyboardValue(key: string, currentValue: number, step: number, min: number, max: number): number | undefined;
+export declare function getRangeSliderPointerValue(pointer: RangeSliderPointerCoordinates, geometry: RangeSliderPointerGeometry, bounds: SliderBounds): number;
+export {};

package/dist/components/slider/{sliderCore.d.ts → sliderModel.d.ts}

@@ -6,7 +6,8 @@ export interface SliderBounds {
 }
 interface SliderMarkStyleProperties {
     position: `--_rp-${string}`;
-    colors: readonly `--_rp-${string}`[];
+    decorativeColors: readonly `--_rp-${string}`[];
+    foregroundColors: readonly `--_rp-${string}`[];
 }
 interface SliderThumbStyleProperties {
     size: `--${string}`;
@@ -17,7 +18,6 @@ interface SliderThumbStyleProperties {
 export declare function normalizeSliderBounds(min: number, max: number): SliderBounds;
 export declare function normalizeSliderStep(step: number | 'any'): number | "any";
 export declare function normalizeSliderValue(value: number, min: number, max: number, step: number | 'any'): number;
-export declare function getSliderValuePercent(value: number, min: number, max: number): number;
 export declare function setSliderStyleValue(style: CSSProperties, property: `--${string}`, value: string | undefined): void;
 export declare function applySliderThumbStyle(style: CSSProperties, thumb: RangeSliderThumbOptions | undefined, properties: SliderThumbStyleProperties): void;
 export declare function getSliderThumbOptions(thumb: SliderThumb): SliderThumbOptions;

package/dist/components/slider/useRangeSlider.d.ts

@@ -1,19 +1,12 @@
 import { CSSProperties } from 'vue';
-import { RangeSliderProps, RangeSliderTrackSlotProps, RangeSliderThumb, RangeSliderValue } from './types.js';
-type RangeSliderStateProps = Readonly<RangeSliderProps & {
-    min: number;
-    max: number;
-    step: number | 'any';
-    minRange: number;
-    tooltip: NonNullable<RangeSliderProps['tooltip']>;
-    orientation: NonNullable<RangeSliderProps['orientation']>;
-    ariaLabel: [string, string];
-}>;
-export declare function normalizeRangeSliderMinRange(minRange: number, min: number, max: number): number;
-export declare function normalizeRangeSliderValue(value: RangeSliderValue, min: number, max: number, step: number | 'any', minRange?: number): RangeSliderValue;
-export declare function getClosestRangeSliderThumb(value: number, range: RangeSliderValue, activeThumb?: RangeSliderThumb): RangeSliderThumb;
-export declare function useRangeSlider(props: RangeSliderStateProps, emitUpdate: (value: RangeSliderValue) => void, getValue?: () => RangeSliderValue): {
-    control: import('../../composables/useControlState.js').ControlState;
+import { RangeSliderThumb, RangeSliderValue } from './types.js';
+import { RangeSliderStateProps } from './useRangeSliderValueState.js';
+export { getClosestRangeSliderThumb, normalizeRangeSliderMinRange, normalizeRangeSliderValue, } from './rangeSliderModel.js';
+export declare function useRangeSlider(props: RangeSliderStateProps, onChange: (value: RangeSliderValue) => void): {
+    nativeElements: import('vue').ComputedRef<[HTMLInputElement | null, HTMLInputElement | null]>;
+    setInputRef: (index: number, element: unknown) => void;
+    focus: (options?: FocusOptions) => void;
+    control: import('../../internal/composables/useControlState.js').ControlState;
     nativeMin: import('vue').ComputedRef<RangeSliderValue>;
     nativeMax: import('vue').ComputedRef<RangeSliderValue>;
     nativeStep: import('vue').ComputedRef<number | "any">;
@@ -33,7 +26,7 @@ export declare function useRangeSlider(props: RangeSliderStateProps, emitUpdate:
         filled: boolean;
         style: CSSProperties;
     }[]>;
-    trackSlotProps: import('vue').ComputedRef<RangeSliderTrackSlotProps>;
+    trackSlotProps: import('vue').ComputedRef<import('./types.js').RangeSliderTrackSlotProps>;
     trackStyle: import('vue').ComputedRef<CSSProperties>;
     activeThumb: import('vue').Ref<RangeSliderThumb | undefined, RangeSliderThumb | undefined>;
     tooltipVisible: import('vue').ComputedRef<boolean>;
@@ -57,4 +50,3 @@ export declare function useRangeSlider(props: RangeSliderStateProps, emitUpdate:
     onTooltipTrackMouseLeave: () => void;
     onTooltipKeydown: (thumb: RangeSliderThumb, event: KeyboardEvent) => void;
 };
-export {};

package/dist/components/slider/useRangeSliderValueState.d.ts

@@ -0,0 +1,40 @@
+import { RangeSliderProps, RangeSliderThumb, RangeSliderTrackSlotProps, RangeSliderValue } from './types.js';
+export type RangeSliderStateProps = Readonly<RangeSliderProps & {
+    min: number;
+    max: number;
+    step: number | 'any';
+    minRange: number;
+    tooltip: NonNullable<RangeSliderProps['tooltip']>;
+    orientation: NonNullable<RangeSliderProps['orientation']>;
+    ariaLabel: [string, string];
+}>;
+export declare function useRangeSliderValueState(props: RangeSliderStateProps, onChange: (value: RangeSliderValue) => void, setActiveThumb: (thumb: RangeSliderThumb) => void): {
+    nativeElements: import('vue').ComputedRef<[HTMLInputElement | null, HTMLInputElement | null]>;
+    setInputRef: (index: number, element: unknown) => void;
+    focus: (options?: FocusOptions) => void;
+    control: import('../../internal/composables/useControlState.js').ControlState;
+    bounds: import('vue').ComputedRef<import('./sliderModel.js').SliderBounds>;
+    valueStep: import('vue').ComputedRef<number | "any">;
+    hasManualNativeKeyboard: import('vue').ComputedRef<boolean>;
+    nativeMin: import('vue').ComputedRef<RangeSliderValue>;
+    nativeMax: import('vue').ComputedRef<RangeSliderValue>;
+    nativeStep: import('vue').ComputedRef<number | "any">;
+    nativeNames: import('vue').ComputedRef<[string | undefined, string | undefined]>;
+    nativeIds: import('vue').ComputedRef<[string | undefined, string | undefined]>;
+    normalizedValue: import('vue').ComputedRef<RangeSliderValue>;
+    valuePercent: import('vue').ComputedRef<RangeSliderValue>;
+    formattedValue: import('vue').ComputedRef<[string | number, string | number]>;
+    ariaLabels: import('vue').ComputedRef<[string, string]>;
+    ariaValueText: import('vue').ComputedRef<[string | undefined, string | undefined]>;
+    markItems: import('vue').ComputedRef<{
+        key: string;
+        value: number;
+        label: string | number | undefined;
+        hasLabel: boolean;
+        filled: boolean;
+        style: import('vue').CSSProperties;
+    }[]>;
+    hasMarkLabels: import('vue').ComputedRef<boolean>;
+    trackSlotProps: import('vue').ComputedRef<RangeSliderTrackSlotProps>;
+    updateThumb: (thumb: RangeSliderThumb, value: number, anchorValue?: number) => RangeSliderThumb;
+};

package/dist/components/slider/useSlider.d.ts

@@ -1,16 +1,10 @@
 import { CSSProperties } from 'vue';
-import { SliderProps, SliderTrackSlotProps } from './types.js';
-export { getSliderValuePercent, normalizeSliderBounds, normalizeSliderStep, normalizeSliderValue, } from './sliderCore.js';
-type SliderStateProps = Readonly<SliderProps & {
-    min: number;
-    max: number;
-    step: number | 'any';
-    tooltip: NonNullable<SliderProps['tooltip']>;
-    thumb: NonNullable<SliderProps['thumb']>;
-    orientation: NonNullable<SliderProps['orientation']>;
-}>;
-export declare function useSlider(props: SliderStateProps, emitUpdate: (value: number) => void, getValue?: () => number): {
-    control: import('../../composables/useControlState.js').ControlState;
+import { SliderStateProps } from './useSliderValueState.js';
+export { normalizeSliderBounds, normalizeSliderStep, normalizeSliderValue } from './sliderModel.js';
+export declare function useSlider(props: SliderStateProps, onChange: (value: number) => void): {
+    inputRef: import('vue').Ref<HTMLInputElement | null, HTMLInputElement | null>;
+    focus: (options?: FocusOptions) => void;
+    control: import('../../internal/composables/useControlState.js').ControlState;
     nativeMin: import('vue').ComputedRef<number>;
     nativeMax: import('vue').ComputedRef<number>;
     nativeStep: import('vue').ComputedRef<number | "any">;
@@ -28,7 +22,7 @@ export declare function useSlider(props: SliderStateProps, emitUpdate: (value: n
         style: CSSProperties;
     }[]>;
     thumbMode: import('vue').ComputedRef<false | import('./types.js').SliderThumbMode>;
-    trackSlotProps: import('vue').ComputedRef<SliderTrackSlotProps>;
+    trackSlotProps: import('vue').ComputedRef<import('./types.js').SliderTrackSlotProps>;
     trackStyle: import('vue').ComputedRef<CSSProperties>;
     trackHovered: import('vue').Ref<boolean, boolean>;
     dragging: import('vue').Ref<boolean, boolean>;
@@ -47,7 +41,7 @@ export declare function useSlider(props: SliderStateProps, emitUpdate: (value: n
     tooltipPercent: import('vue').ComputedRef<number>;
     tooltipFormattedValue: import('vue').ComputedRef<string | number>;
     tooltipContent: import('vue').ComputedRef<string>;
-    onInput: (e: Event) => void;
+    onInput: (event: Event) => void;
     onTooltipPointerDown: (event: PointerEvent) => void;
     onTooltipPointerMove: (event: PointerEvent) => void;
     onTooltipTrackEnter: (event: PointerEvent) => void;

package/dist/components/slider/useSliderPointerPreview.d.ts

@@ -0,0 +1,22 @@
+import { ComputedRef } from 'vue';
+import { SliderBounds } from './sliderModel.js';
+import { SliderOrientation } from './types.js';
+interface UseSliderPointerPreviewOptions {
+    enabled: () => boolean;
+    disabled: () => boolean;
+    orientation: () => SliderOrientation;
+    bounds: ComputedRef<SliderBounds>;
+    step: ComputedRef<number | 'any'>;
+    initialValue: number;
+    onStateChange: () => void;
+}
+export declare function useSliderPointerPreview(options: UseSliderPointerPreviewOptions): {
+    dragging: import('vue').Ref<boolean, boolean>;
+    previewAvailable: import('vue').Ref<boolean, boolean>;
+    previewValue: import('vue').Ref<number, number>;
+    onPointerDown: (event: PointerEvent) => boolean;
+    onPointerMove: (event: PointerEvent) => void;
+    onTrackEnter: (event: PointerEvent) => void;
+    onTrackLeave: () => void;
+};
+export {};

package/dist/components/slider/useSliderTooltipState.d.ts

@@ -0,0 +1,40 @@
+import { ComputedRef } from 'vue';
+import { SliderBounds } from './sliderModel.js';
+import { SliderOrientation, SliderProps, SliderTooltip } from './types.js';
+interface UseSliderTooltipStateOptions {
+    tooltip: () => SliderTooltip;
+    orientation: () => SliderOrientation;
+    disabled: () => boolean;
+    value: ComputedRef<number>;
+    bounds: ComputedRef<SliderBounds>;
+    step: ComputedRef<number | 'any'>;
+    formatValue: () => SliderProps['formatValue'];
+}
+export declare function useSliderTooltipState(options: UseSliderTooltipStateOptions): {
+    trackHovered: import('vue').Ref<boolean, boolean>;
+    dragging: import('vue').Ref<boolean, boolean>;
+    tooltipVisible: ComputedRef<boolean>;
+    tooltipOpen: ComputedRef<boolean>;
+    tooltipAlwaysVisible: ComputedRef<boolean>;
+    tooltipAnchor: ComputedRef<import('./types.js').SliderTooltipAnchor>;
+    tooltipPlacement: ComputedRef<import('../tooltip/index.js').TooltipPlacement>;
+    tooltipId: ComputedRef<string | undefined>;
+    tooltipColor: ComputedRef<import('../../utils/componentColors.js').ComponentColorValue | undefined>;
+    tooltipAutoContrast: ComputedRef<boolean | undefined>;
+    tooltipContrastColor: ComputedRef<string | undefined>;
+    tooltipOffset: ComputedRef<import('../floating/index.js').FloatingOffset | undefined>;
+    tooltipOpenDelay: ComputedRef<number>;
+    tooltipArrow: ComputedRef<boolean>;
+    tooltipValue: ComputedRef<number>;
+    tooltipPercent: ComputedRef<number>;
+    tooltipFormattedValue: ComputedRef<string | number>;
+    tooltipContent: ComputedRef<string>;
+    onTooltipPointerDown: (event: PointerEvent) => void;
+    onTooltipPointerMove: (event: PointerEvent) => void;
+    onTooltipTrackEnter: (event: PointerEvent) => void;
+    onTooltipTrackLeave: () => void;
+    onTooltipFocusIn: () => void;
+    onTooltipFocusOut: () => void;
+    onTooltipKeydown: (event: KeyboardEvent) => void;
+};
+export {};