ColorPaletteControl

Usage

import { ColorPaletteControl } = gumponents.components;

...

attributes: {
	color: {
		type: 'object',
	},
},
...

<ColorPaletteControl
	label="Choose a color"
	value={ color ? color.color : null }
	onChange={ ( color ) => setAttributes( { color } ) }
/>

Props

label

The label for the control.

• Type: String
• Required: No

help

The help text for the control.

• Type: String
• Required: No

value

The selected hex color for this control.

• Type: String
• Required: Yes

onChange

A function that receives the values of the control. The return value is an object that looks like:

{
    color: '#ffffff',
    slug: 'white',
}

• Type: Function
• Required: Yes

colors

Pass in custom colors. If this isn't passed, it defaults to the global custom colors.

• Type: Array
• Required: No

disableCustomColors

Defaults to the global value. Pass in a boolean value to override this behavior.

• Type: Boolean
• Required: No