Options
All
  • Public
  • Public/Protected
  • All
Menu

Interface SliderThumbPresentation

remarks

@since 2.5.0

Hierarchy

Index

Properties

animationDuration?: number

The duration that it takes for the slider animation to complete for a new value. This is just used to help make things look smoother while dragging compared to jumping to new values.

discrete?: boolean

Boolean if the slider should act as a discrete slider which will render a tooltip above the thumb while dragging to visualize the current value for the slider.

Methods

  • getValueText(value: number): string
  • A function that is used to help with accessibility by creating a better value string if just a number isn't representative enough of your range.

    Example:

    const [value, controls] = useSlider(0, {
    // format to be `$100`, etc
    getValueText: value => `$${value}`,
    });

    return <Slider baseId="price-slider" label="Price" {...controls} />;

    Parameters

    • value: number

    Returns string

Generated using TypeDoc