Package Exports
- @wordpress/plugins
This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (@wordpress/plugins) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.
Readme
Plugins
Plugins module for WordPress.
Installation
Install the module
npm install @wordpress/plugins --save
This package assumes that your code will run in an ES2015+ environment. If you're using an environment that has limited or no support for ES2015+ such as lower versions of IE then using core-js or @babel/polyfill will add support for these methods. Learn more about it in Babel docs.
Plugins API
# getPlugin
Returns a registered plugin settings.
Parameters
- name
string
: Plugin name.
Returns
?WPPlugin
: Plugin setting.
# getPlugins
Returns all registered plugins.
Returns
Array<WPPlugin>
: Plugin settings.
# PluginArea
A component that renders all plugin fills in a hidden div.
Usage
// Using ES5 syntax
var el = wp.element.createElement;
var PluginArea = wp.plugins.PluginArea;
function Layout() {
return el(
'div',
{},
'Content of the page',
PluginArea
);
}
// Using ESNext syntax
import { PluginArea } from '@wordpress/plugins';
const Layout = () => (
<div>
Content of the page
<PluginArea />
</div>
);
Returns
WPComponent
: The component to be rendered.
# registerPlugin
Registers a plugin to the editor.
Usage
// Using ES5 syntax
var el = wp.element.createElement;
var Fragment = wp.element.Fragment;
var PluginSidebar = wp.editPost.PluginSidebar;
var PluginSidebarMoreMenuItem = wp.editPost.PluginSidebarMoreMenuItem;
var registerPlugin = wp.plugins.registerPlugin;
var moreIcon = wp.element.createElement( 'svg' ); //... svg element.
function Component() {
return el(
Fragment,
{},
el(
PluginSidebarMoreMenuItem,
{
target: 'sidebar-name',
},
'My Sidebar'
),
el(
PluginSidebar,
{
name: 'sidebar-name',
title: 'My Sidebar',
},
'Content of the sidebar'
)
);
}
registerPlugin( 'plugin-name', {
icon: moreIcon,
render: Component,
} );
// Using ESNext syntax
import { PluginSidebar, PluginSidebarMoreMenuItem } from '@wordpress/edit-post';
import { registerPlugin } from '@wordpress/plugins';
import { more } from '@wordpress/icons';
const Component = () => (
<>
<PluginSidebarMoreMenuItem
target="sidebar-name"
>
My Sidebar
</PluginSidebarMoreMenuItem>
<PluginSidebar
name="sidebar-name"
title="My Sidebar"
>
Content of the sidebar
</PluginSidebar>
</>
);
registerPlugin( 'plugin-name', {
icon: more,
render: Component,
} );
Parameters
- name
string
: A string identifying the plugin.Must be unique across all registered plugins. - settings
WPPlugin
: The settings for this plugin.
Returns
WPPlugin
: The final plugin settings object.
# unregisterPlugin
Unregisters a plugin by name.
Usage
// Using ES5 syntax
var unregisterPlugin = wp.plugins.unregisterPlugin;
unregisterPlugin( 'plugin-name' );
// Using ESNext syntax
import { unregisterPlugin } from '@wordpress/plugins';
unregisterPlugin( 'plugin-name' );
Parameters
- name
string
: Plugin name.
Returns
?WPPlugin
: The previous plugin settings object, if it has been successfully unregistered; otherwiseundefined
.
# withPluginContext
A Higher Order Component used to inject Plugin context to the wrapped component.
Parameters
- mapContextToProps
Function
: Function called on every context change, expected to return object of props to merge with the component's own props.
Returns
WPComponent
: Enhanced component with injected context as props.