Skip to content

Commit

Permalink
Added documentation for the Block Editor Color Palette
Browse files Browse the repository at this point in the history
  • Loading branch information
pbking authored and shail-mehta committed Feb 15, 2025
1 parent 1976565 commit 424c41d
Showing 1 changed file with 44 additions and 0 deletions.
44 changes: 44 additions & 0 deletions packages/block-editor/src/components/color-palette/README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,44 @@
## Color Palette

`Color Palette` allows the user to pick a color from a list of pre-defined color entries. It uses the core [`Color Palette`](https://github.com/WordPress/gutenberg/tree/trunk/packages/components/src/color-palette) component and provides default values for the `colors` and `disableCustomColors` props based on Global Styles values.

## Development guidelines

### Usage

```jsx
import { ColorPalette } from '@wordpress/block-editor';

const MyColorPalette = () => {

const paletteColor;
const setColor = (color) => {
paletteColor = color;
}

return (
<ColorPalette
value={ color }
onChange={ ( color ) => setColor( color ) }
/>
);
} );
```

### Props

### colors: PaletteObject[] | ColorObject[]

Array with the colors to be shown. When displaying multiple color palettes to choose from, the format of the array changes from an array of colors objects, to an array of color palettes.

* Required: No
* Default: The `color.palette` Global Styles value.

### disableCustomColors: boolean

Whether to allow the user to pick a custom color on top of the predefined choices (defined via the colors prop).

* Available: No
* Default: The `color.custom` Global Styles value.

The rest of the props are the same as those defined in the core [`Color Palette`](https://github.com/WordPress/gutenberg/tree/trunk/packages/components/src/color-palette#props) component including [clearable](https://github.com/WordPress/gutenberg/tree/trunk/packages/components/src/color-palette#clearable-boolean), [enableAlpha](https://github.com/WordPress/gutenberg/tree/trunk/packages/components/src/color-palette#clearable-boolean), [headingLevel](https://github.com/WordPress/gutenberg/tree/trunk/packages/components/src/color-palette#headinglevel-1--2--3--4--5--6--1--2--3--4--5--6), [value](https://github.com/WordPress/gutenberg/tree/trunk/packages/components/src/color-palette#value-string) and [onChange](https://github.com/WordPress/gutenberg/tree/trunk/packages/components/src/color-palette#onchange-oncolorchange).

0 comments on commit 424c41d

Please sign in to comment.