Slider

Component: Sliders allow users to make selections from a range of values as either a single value, or dual value in a high/low situation. Inner element spacing is used for dynamic resizing along with a background surface.

Styleguide Link

• Parent: Form (Container)

• Child: Slider - Ctrl, Label, FC - Leading, FC - Trailing

Properties

Label

The component can be presented with a label to give context to the form control. This label can be positioned above (top), left, or not at all (none). NOTE: Label left for a slider is represented as an icon which has a fixed width, we do not use text content that would have variable lengths, as that would alter the slider lengths randomly.

Helper Text

To provide additional context for the component a sentence can be added to the component for examples, how the input will be used, or as further clarification to the label.

Note: The structure and spacing of this component is the same between Textfield, Textarea, Selectlist, Chiplist, Slider, Userlist, and Toggle Button.

Note: Each of the nested elements and primitives of this form component have properties that can be adjusted to customize the component.