SheetXL - v0.8.0-beta.9+sites.210.e2d420901
    Preparing search index...

    Interface VirtualScrollbarProps

    interface VirtualScrollbarProps {
        endGap?: number;
        endScrollIncrement?: number;
        maxThumbSize?: number;
        minSize?: number;
        minThumbSize?: number;
        offset: number;
        onScrollOffset: (
            offset: number,
            viewportSize: number,
            totalSize: number,
        ) => void;
        onThumbDrag?: (event: ThumbDragEvent) => void;
        onThumbEdgeHold?: (edge: -1 | 1, tick: TrackEdgeTick) => boolean;
        orientation: ScrollbarOrientation;
        precisionFactor?: number;
        propsThumb?: HTMLAttributes<HTMLElement>;
        propsTouchThumb?: Partial<TouchThumbHandleProps>;
        ref?: Ref<IScrollbarElement>;
        renderScrollbar?: (props: ScrollbarProps) => ReactNode;
        renderScrollButtonEnd?: (props: ScrollButtonProps) => ReactElement;
        renderScrollButtonStart?: (props: ScrollButtonProps) => ReactElement;
        scaleFactor?: number;
        scaleLimit?: number;
        scrollButtonAdditionalRepeatDelay?: number;
        scrollButtonIncrement?:
            | number
            | ((offset: number, viewport: number, totalSize: number) => number);
        scrollButtonInitialRepeatDelay?: number;
        showCustomScrollButtons?: boolean;
        totalSize: number;
        viewportSize: number;
    }

    Hierarchy

    Index
    endGap? endScrollIncrement? maxThumbSize? minSize? minThumbSize? offset onScrollOffset onThumbDrag? onThumbEdgeHold? orientation precisionFactor? propsThumb? propsTouchThumb? ref? renderScrollbar? renderScrollButtonEnd? renderScrollButtonStart? scaleFactor? scaleLimit? scrollButtonAdditionalRepeatDelay? scrollButtonIncrement? scrollButtonInitialRepeatDelay? showCustomScrollButtons? totalSize viewportSize
    endGap?: number

    Amount of scrollbar between minSize and totalSize. This is mean to show that there is more scroll area.

    100
    endScrollIncrement?: number

    Determines the increment amount when the scrollbar has been dragged to the end but is not scrolled to total size.

    100;
    maxThumbSize?: number

    The maximum size of the thumb in pixels.

    undefined (no maximum size)
    minSize?: number

    If this is the minimum scrollbar size. By default this is the bottom of the viewport but can be extended.

    0
    minThumbSize?: number

    The minimum size of the thumb in pixels.

    24
    offset: number
    onScrollOffset: (
        offset: number,
        viewportSize: number,
        totalSize: number,
    ) => void
    onThumbDrag?: (event: ThumbDragEvent) => void

    Thumb-drag lifecycle — fired for both the desktop thumb and the touch grip (raw DOM events can't represent this faithfully: pointer capture retargets the release, and the engine filters non-primary/disabled presses). A virtual/elastic wrapper pins its region while a drag is in flight; a client anchors drag UI (tooltips) to ThumbDragEvent.element.

    onThumbEdgeHold?: (edge: -1 | 1, tick: TrackEdgeTick) => boolean

    Called on a repeating tick while the thumb is dragged past a track end and held there. Advance the scroll one step and return whether more scroll remains (false stops the ticking).

    This is how an elastic/virtual wrapper (e.g. VirtualScrollbar) extends its region under a held thumb — the scrollbar itself has no elastic knowledge. Leave unset for a linear scrollbar: its thumb at the track end IS the real end, so there is nothing to extend.

    orientation: ScrollbarOrientation
    precisionFactor?: number

    The default precision. This is a factor of the scale factor.

    50
    propsThumb?: HTMLAttributes<HTMLElement>
    propsTouchThumb?: Partial<TouchThumbHandleProps>
    ref?: Ref<IScrollbarElement>

    Reference to the underling element

    renderScrollbar?: (props: ScrollbarProps) => ReactNode
    renderScrollButtonEnd?: (props: ScrollButtonProps) => ReactElement
    renderScrollButtonStart?: (props: ScrollButtonProps) => ReactElement
    scaleFactor?: number

    The factor amount for physical scaling

    100
    scaleLimit?: number

    The max size of the area before scaling is implemented.

    1000000
    scrollButtonAdditionalRepeatDelay?: number
    scrollButtonIncrement?:
        | number
        | ((offset: number, viewport: number, totalSize: number) => number)

    The amount to increment the scroll position when the scroll button is clicked. This can be a fixed number or a function that takes the current offset, viewport size, and total size and returns the increment amount.

    scrollButtonInitialRepeatDelay?: number
    showCustomScrollButtons?: boolean

    Add custom scrollButtons. This should only be set to true if you have used css styling to hide the default scrollButtons using: ::-webkit-scrollbar-button: { display: 'none' }

    false
    totalSize: number
    viewportSize: number

    Settings
    Member Visibility

    On This Page
    Properties