Skip to content

Latest commit

 

History

History
30 lines (28 loc) · 3.86 KB

README.md

File metadata and controls

30 lines (28 loc) · 3.86 KB

<Slider />

import { Slider } from 'ihme-ui'

Property Required Type(s) Defaults Description
disabled bool false Disable slider visually and functionally.
fill bool Include fill in the track to indicate value.
fillClassName CommonPropTypes.className Class name applied to fill.
fillStyle object Inline styles applied to fill.
fontSize string Font size of handle labels.
handleClassName CommonPropTypes.className Class name applied to slider handle.
handleStyle object Inline styles applied to slider handle.
labelFunc func identity Function applied to label prior to rendering.
Signature: (value): string => {...}
onDrag true func noop dragmove callback.
Called when slider value is changed.
Signature: (SyntheticEvent, values, Slider) => {...}
- {Object} SyntheticEvent - the triggered action
- {Object} values - { high: ..., low: ... }
- {Object} Slider - the slider object (class instance)
onDragEnd func noop dragend callback.
Called when slider handle is released.
Signature: (SyntheticEvent, values, Slider) => {...}
- {Object} SyntheticEvent - the triggered action
- {Object} values - { high: ..., low: ... }
- {Object} Slider - the slider object (class instance)
onKey func noop onKeyDown callback. Named for consistency with onDrag and onDragEnd.
Signature: (SyntheticEvent, values, Slider) => {...}
- {Object} SyntheticEvent - the triggered action
- {Object} values - { high: ..., low: ... }
- {Object} Slider - the slider object (class instance)
onKeyEnd func noop onKeyUp callback. Named for consistency with onDrag and onDragEnd.
Signature: (SyntheticEvent, values, Slider) => {...}
- {Object} SyntheticEvent - the triggered action
- {Object} values - { high: ..., low: ... }
- {Object} Slider - the slider object (class instance)
onTrackClick func noop onClick callback for slider track.
Signature: (SyntheticEvent, values, Slider) => {...}
- {Object} SyntheticEvent - the triggered action
- {Object} values - { high: ..., low: ... }
- {Object} Slider - the slider object (class instance)
range true array, object Extent of slider values. Can be either an array of [min, max] or a configuration object.
Config:
- low: min value
- high: max value
- steps: number of steps between low and high
- precision: rounding precision
ticks bool Show ticks in track.
tickClassName CommonPropTypes.className Class name applied to each tick marking within the track, if applicable.
tickStyle object Inline styles applied to each tick marking within the track, if applicable.
trackClassName CommonPropTypes.className Class name applied to slider track.
trackStyle object Inline styles applied to slider track.
value true number, string, array, object Selected value.
If number, a single slider handle will be rendered.
If object with keys 'low' and 'high', two slider handles (a "range slider") will be rendered.
width number 200 Width of slider (in pixels).
className CommonPropTypes.className Class name applied to outermost wrapper.
style object Inline styles applied to outermost wrapper.