Skip to content

Latest commit

 

History

History
43 lines (26 loc) · 1.55 KB

README.md

File metadata and controls

43 lines (26 loc) · 1.55 KB
Raw

Block Alignment Toolbar

The BlockAlignmentToolbar component is used to render block alignment options in the editor. The different alignment options it provides are left, center, right, wide and full.

Image block alignment options

Development guidelines

Usage

Renders a block alignment toolbar with alignments options.

import { BlockAlignmentToolbar } from '@wordpress/block-editor';

const MyBlockAlignmentToolbar = () => (
	<BlockControls>
		<BlockAlignmentToolbar value={ align } onChange={ updateAlignment } />
	</BlockControls>
);

Note: In this example that we render BlockAlignmentToolbar as a child of the BlockControls component.

Props

value

  • Type: String
  • Default: undefined
  • Options:: left, center, right, wide, full

The current value of the alignment setting. You may only choose from the Options listed above.

onChange

  • Type: Function

A callback function invoked when the toolbar's alignment value is changed via an interaction with any of the toolbar's buttons. Called with the new alignment value (ie: left, center, right, wide, full) as the only argument.

Related components

Block Editor components are components that can be used to compose the UI of your block editor. Thus, they can only be used under a BlockEditorProvider in the components tree.