ToolbarButton Edit

A ToolbarButton can be used to add actions to your block control, usually inside a ToolbarGroup. It has similar features to the Button component. Using ToolbarButton will ensure the correct styling for a button in a toolbar, and also that keyboard interactions in a toolbar are consistent with the WAI ARIA toolbar pattern.

Usage Usage

import { ToolbarButton } from "@wordpress/components";
import { edit } from "@wordpress/icons";

const MyToolbarButton = () => (
    <MyToolbarButton
        title="Edit"
        icon={ edit }
        onClick={ onEdit } />
);

Top ↑

Props Props

This component accepts the same API of the Button component.

Top ↑

  • If you wish to implement a control to select options grouped as icon buttons you can use the Toolbar component, which already handles this strategy.
  • The ToolbarButton may be used with other elements such as Dropdown to display options in a popover.