import React from "react"; //#region src/rangeScrollbar/RangeScrollbar.d.ts /** * Controlled numeric range represented by a range scrollbar. * * `start` and `end` use the caller's domain units. For a timeline adapter those * units might be seconds; for a chart they might be indexes, prices, or pixels. */ interface RangeScrollbarValue { /** Inclusive start of the visible range. */ start: number; /** Inclusive end of the visible range. */ end: number; } /** * Side of the range scrollbar thumb controlled by a resize handle. */ type RangeScrollbarHandleSide = 'start' | 'end'; /** Visual and interaction axis used by a range scrollbar. */ type RangeScrollbarOrientation = 'horizontal' | 'vertical'; /** * Reason a range scrollbar requested a controlled value change. */ type RangeScrollbarChangeReason = 'set-value' | 'thumb-drag' | 'thumb-keyboard' | 'handle-drag' | 'handle-keyboard'; /** * Details passed with a controlled range scrollbar value change. */ interface RangeScrollbarValueChangeDetails { /** Interaction or imperative action that produced the next value. */ reason: RangeScrollbarChangeReason; /** Handle side when a resize handle produced the change. */ side?: RangeScrollbarHandleSide; /** Stable identifier for a single pointer drag interaction. */ dragSessionId?: number; /** Controlled value captured when the pointer drag interaction started. */ dragStartValue?: RangeScrollbarValue; } /** * Context passed to a range scrollbar `aria-valuetext` formatter. */ interface RangeScrollbarAriaValueTextDetails { /** Scrollbar part whose value is being described. */ part: 'thumb' | 'handle'; /** Handle side when `part` is `handle`. */ side?: RangeScrollbarHandleSide; /** Full controlled range represented by the scrollbar. */ value: RangeScrollbarValue; /** Current range span. */ rangeSpan: number; /** Minimum value in the full domain. */ min: number; /** Maximum value in the full domain. */ max: number; } /** * Options for deriving generic range scrollbar state and update helpers. */ interface UseRangeScrollbarOptions { /** Minimum value in the full scrollable domain. */ min: number; /** Maximum value in the full scrollable domain. */ max: number; /** Controlled visible range. */ value: RangeScrollbarValue; /** Smallest allowed visible range span. Defaults to 0. */ minSpan?: number; /** Called when range scrollbar interactions request a new controlled range. */ onValueChange?: (value: RangeScrollbarValue, details: RangeScrollbarValueChangeDetails) => void; } /** * Generic range scrollbar geometry and mutation helpers. */ interface UseRangeScrollbarResult { /** Minimum value in the full scrollable domain. */ min: number; /** Maximum value in the full scrollable domain. */ max: number; /** Controlled visible range after clamping to the domain. */ value: RangeScrollbarValue; /** Smallest allowed visible range span after clamping to the domain span. */ minSpan: number; /** Full domain span, equal to `max - min` when positive. */ domainSpan: number; /** Visible range span, equal to `value.end - value.start`. */ rangeSpan: number; /** CSS percent offset for the visible range thumb. */ /** CSS percent offset for the visible range thumb on the active axis. */ thumbOffsetPercent: number; /** CSS percent width for the visible range thumb. */ /** CSS percent size for the visible range thumb on the active axis. */ thumbSizePercent: number; /** Requests an explicit visible range. */ setValue: (value: RangeScrollbarValue, details?: RangeScrollbarValueChangeDetails) => void; /** Requests a pan by a domain-unit delta while preserving the current span. */ panBy: (delta: number, details?: RangeScrollbarValueChangeDetails) => void; /** Requests a resize by moving one side by a domain-unit delta. */ resizeBy: (side: RangeScrollbarHandleSide, delta: number, details?: RangeScrollbarValueChangeDetails) => void; } /** * Props for the controlled range scrollbar root. */ interface RangeScrollbarRootProps extends Omit, 'children' | 'onChange'> { /** Minimum value in the full scrollable domain. */ min: number; /** Maximum value in the full scrollable domain. */ max: number; /** Controlled visible range. */ value: RangeScrollbarValue; /** Visual and interaction axis. Defaults to `'horizontal'`. */ orientation?: RangeScrollbarOrientation; /** Smallest allowed visible range span. Defaults to 0. */ minSpan?: number; /** Domain-unit nudge used by arrow-key interactions. Defaults to 1. */ keyboardStep?: number; /** Domain-unit nudge used by page-key interactions. Defaults to 10. */ keyboardPageStep?: number; /** Disables pointer and keyboard interactions while keeping parts rendered. */ disabled?: boolean; /** Formats `aria-valuetext` for the thumb and handles. */ getAriaValueText?: (value: number, details: RangeScrollbarAriaValueTextDetails) => string; /** Called when range scrollbar interactions request a new controlled range. */ onValueChange?: (value: RangeScrollbarValue, details: RangeScrollbarValueChangeDetails) => void; /** Thumb and handle components rendered within the measured track. */ children: React.ReactNode; } /** * Props for the draggable range scrollbar thumb. */ interface RangeScrollbarThumbProps extends React.HTMLAttributes { /** Optional custom content rendered inside the draggable visible-range thumb. */ children?: React.ReactNode; } /** * Props for a range scrollbar resize handle. */ interface RangeScrollbarHandleProps extends React.HTMLAttributes { /** Side of the visible range controlled by this handle. */ side: RangeScrollbarHandleSide; /** Optional custom content rendered inside the resize handle. */ children?: React.ReactNode; } /** * Derives geometry and controlled update helpers for a generic range scrollbar. * * @param options - Controlled range, domain, minimum span, and change handler. * @returns Clamped range state, thumb percentages, and range mutation helpers. * * @example * ```tsx * const scrollbar = useRangeScrollbar({ * min: 0, * max: 100, * value, * minSpan: 5, * onValueChange: setValue, * }); * * return {scrollbar.thumbSizePercent}% visible; * ``` */ declare function useRangeScrollbar(options: UseRangeScrollbarOptions): UseRangeScrollbarResult; /** * Root element for a controlled generic range scrollbar. * * @param props - Controlled domain, visible range, keyboard options, and DOM props. * @returns A measured range scrollbar track that provides context to thumb and handles. * * @example * ```tsx * * * * * * * ``` */ declare const RangeScrollbarRoot: React.ForwardRefExoticComponent>; /** * Draggable thumb representing the visible range within a larger domain. * * @param props - DOM props and optional content for the visible range thumb. * @returns An absolutely positioned thumb with pointer and keyboard pan behavior. */ declare const RangeScrollbarThumb: React.ForwardRefExoticComponent>; /** * Resize handle for moving one side of the visible range. * * @param props - Handle side, DOM props, and optional custom content. * @returns An absolutely positioned range resize handle. */ declare const RangeScrollbarHandle: React.ForwardRefExoticComponent>; /** * Namespace of generic controlled range scrollbar primitives. */ declare const RangeScrollbar: { /** Root controlled range scrollbar track. */ Root: React.ForwardRefExoticComponent>; /** Draggable visible range thumb. */ Thumb: React.ForwardRefExoticComponent>; /** Resize handle for the start or end of the visible range. */ Handle: React.ForwardRefExoticComponent>; }; //#endregion export { RangeScrollbar, RangeScrollbarAriaValueTextDetails, RangeScrollbarChangeReason, RangeScrollbarHandle, RangeScrollbarHandleProps, RangeScrollbarHandleSide, RangeScrollbarOrientation, RangeScrollbarRoot, RangeScrollbarRootProps, RangeScrollbarThumb, RangeScrollbarThumbProps, RangeScrollbarValue, RangeScrollbarValueChangeDetails, UseRangeScrollbarOptions, UseRangeScrollbarResult, useRangeScrollbar }; //# sourceMappingURL=RangeScrollbar.d.mts.map