ColorSwatches API
API reference docs for theColorSwatchescomponent. For examples and details on the usage of this component, visit the component demo page.
Props
| Props | Type | Description | Default |
|---|---|---|---|
ariaLabelPrefix? | string | Used as a prefix for the aria-label of each swatch | _ |
colors | string[] | A list of colors (hex codes) for the user to pick from | _ |
customFirstSwatch? | ReactNode | Allows the consumer to provide a custom element for the first swatch | _ |
customLastSwatch? | ReactNode | Allows the consumer to provide a custom element for the last swatch | _ |
inputName? | string | Used as the HTML 'name' attribute for each swatch input | _ |
onChange? | (value: string) => void | Callback function that is called when the color changes | _ |
rows? | number | The number of rows to display | 1 |
size | '20' | '24' | '28' | '32' | '36' | '40' | The width and height of the options | '32' |
value | string | The currently selected color | _ |