UNPKG

@wordpress/components

Version:
36 lines (19 loc) 1.05 kB
# ColorIndicator ColorIndicator is a React component that renders a specific color in a circle. It's often used to summarize a collection of used colors in a child component. ### Single component ![simple color indicator](https://user-images.githubusercontent.com/881729/147558034-cba09db5-2f06-458b-a7b1-fd2f2ffb982a.png) ### Used in sidebar ![multiple color indicator](https://user-images.githubusercontent.com/881729/147559177-69ce52e1-30dc-4f24-8483-ca2a580f434f.png) ## Usage ```jsx import { ColorIndicator } from '@wordpress/components'; const MyColorIndicator = () => <ColorIndicator colorValue="#0073aa" />; ``` ## Props The component accepts the following props: ### `className`: `string` Extra classes for the used `<span>` element. By default only `component-color-indicator` is added. - Required: No ### `colorValue`: `CSSProperties[ 'background' ]` The color of the indicator. Any value from the CSS [`background`](https://developer.mozilla.org/en-US/docs/Web/CSS/background) property is supported. - Required: Yes