ui/Slider

Called when the value is changed.

The orientation of the slider, either "horizontal" or "vertical".

A number between 0 and 1 representing the proportion of the value in terms of min and max props of the slider.

Adds a tooltip to the knob using the provided component.

The following props are forwarded to the tooltip:

• children - The value prop from the slider

• orientation - The value of the orientation prop from the slider

• proportion - The value of the proportion prop from the knob

This prop accepts either a Component (e.g. MyTooltip} which will be instantiated with the above props or a component instance (e.g. <MyTooltip customProp="value" />) which will have its props merged with the above props.

The value of the slider.

The component used to render the progress bar within the slider.

The provided component will receive the following props from Slider

• backgroundProgress - The value of backgroundProgress

• orientation - The value of orientation

• progress - The value as a proportion between min and max

• progressAnchor - The value of progressAnchor

This prop accepts either a Component (e.g. MyProgress} which will be instantiated with the above props or a component instance (e.g. <MyProgress customProp="value" />) which will have its props merged with the above props.

Background progress, as a proportion between 0 and 1.

Called with a reference to the root component.

When using ui/Slider.Slider, the ref prop is forwarded to this component as componentRef.

Customizes the component by mapping the supplied collection of CSS class names to the corresponding internal elements and states of this component.

The following classes are supported:

• slider - The root component class

• knob - The knob node

• horizontal - Applied when orientation prop is `"horizontal"

• pressed - Applied when pressed prop is true

• noFill - Applied when noFill prop is true

• vertical - Applied when orientation prop is "vertical"

Disables component and does not generate events.

Defines a custom knob component for the slider.

By default, Slider will use its own implementation, ui/Slider.Knob.

The following props are forwarded to the knob:

• className - A knob class applied by the slider

• disabled - The value of disabled

• orientation - The value of orientation

• proportion - The value as a proportion between min and max

• tooltipComponent - The value of tooltipComponent

• value - The value of value

This prop accepts either a Component (e.g. MyKnob} which will be instantiated with the above props or a component instance (e.g. <MyKnob customProp="value" />) which will have its props merged with the above props.

The maximum value of the slider.

The range between min and max should be evenly divisible by step.

The minimum value of the slider.

The range between min and max should be evenly divisible by step.

Applies the style where the slider bar does not display filled.

The orientation of the slider.

Allowed values include:

• 'horizontal' - A left and right orientation

• 'vertical' - An up and down orientation

Applies a pressed visual effect.

Sets the point, as a proportion between 0 and 1, from which the slider is filled.

Applies to both the slider's value and backgroundProgress. In both cases, setting the value of progressAnchor will cause the slider to fill from that point down, when value or backgroundProgress is proportionally less than the anchor, or up, when value or backgroundProgress is proportionally greater than the anchor, rather than always from the start of the slider.

The amount to increment or decrement the value.

It must evenly divide into the range designated by min and max.

Adds a tooltip to the slider using the provided component.

The following props are forwarded to the tooltip:

• children - The value prop from the slider

• orientation - The value of the orientation prop from the slider

• proportion - The value as a proportion between min and max

This prop accepts either a Component (e.g. MyTooltip} which will be instantiated with the above props or a component instance (e.g. <MyTooltip customProp="value" />) which will have its props merged with the above props.

The value of the slider.

Defaults to the value of min.