A color picker + input combo component
You can click the swatch to pick a color or type a hexadecimal value in the text input.
color picker
1import ColorPicker from '@tempoplatform/tpds/components/color-picker'
2const [selectedColor, setSelectedColor] = React.useState('#ff0000')
3
4<ColorPicker
5 hexColor={selectedColor}
6 onChangeHandler={value => setSelectedColor(value)}
7/>
Prop Name
Type
Default
Required
Description
selectedColor
string
null
Yes
The selected color to display, hexadecimal format
onChangeHandler
Function
null
Yes
Handler function to pass updates to the host component.
omitTextInput
boolean
false
No
If true, the text input will not be displayed.
swatchSide
string
right
No
The side of the swatch to display, left or right.
placeholder
string
Hex
No
The placeholder text for the text input.