@wordpress/edit-post
Version:
Edit Post module for WordPress.
65 lines (62 loc) • 2.01 kB
JavaScript
/**
* WordPress dependencies
*/
import { ComplementaryAreaMoreMenuItem } from '@wordpress/interface';
/**
* Renders a menu item in `Plugins` group in `More Menu` drop down,
* and can be used to activate the corresponding `PluginSidebar` component.
* The text within the component appears as the menu item label.
*
* @param {Object} props Component props.
* @param {string} props.target A string identifying the target sidebar you wish to be activated by this menu item. Must be the same as the `name` prop you have given to that sidebar.
* @param {WPBlockTypeIconRender} [props.icon=inherits from the plugin] The [Dashicon](https://developer.wordpress.org/resource/dashicons/) icon slug string, or an SVG WP element, to be rendered to the left of the menu item label.
*
* @example
* ```js
* // Using ES5 syntax
* var __ = wp.i18n.__;
* var PluginSidebarMoreMenuItem = wp.editPost.PluginSidebarMoreMenuItem;
* var moreIcon = wp.element.createElement( 'svg' ); //... svg element.
*
* function MySidebarMoreMenuItem() {
* return wp.element.createElement(
* PluginSidebarMoreMenuItem,
* {
* target: 'my-sidebar',
* icon: moreIcon,
* },
* __( 'My sidebar title' )
* )
* }
* ```
*
* @example
* ```jsx
* // Using ESNext syntax
* import { __ } from '@wordpress/i18n';
* import { PluginSidebarMoreMenuItem } from '@wordpress/edit-post';
* import { more } from '@wordpress/icons';
*
* const MySidebarMoreMenuItem = () => (
* <PluginSidebarMoreMenuItem
* target="my-sidebar"
* icon={ more }
* >
* { __( 'My sidebar title' ) }
* </PluginSidebarMoreMenuItem>
* );
* ```
*
* @return {WPComponent} The component to be rendered.
*/
export default function PluginSidebarMoreMenuItem( props ) {
return (
<ComplementaryAreaMoreMenuItem
// Menu item is marked with unstable prop for backward compatibility.
// @see https://github.com/WordPress/gutenberg/issues/14457
__unstableExplicitMenuItem
scope="core/edit-post"
{ ...props }
/>
);
}