@wordpress/plugins

インストール

モジュールをインストールします

npm install @wordpress/plugins --save

このパッケージは、あなたのコードがES2015+環境で実行されることを前提としています。そのような言語機能やAPIのサポートが限られているか、まったくない環境を使用している場合は、コードに@wordpress/babel-preset-defaultで提供されるポリフィルを含める必要があります。

プラグインAPI

getPlugin

登録されたプラグインの設定を返します。

パラメータ

• name string: プラグイン名。

返り値

• WPPlugin | undefined: プラグイン設定。

getPlugins

スコープなしまたは指定されたスコープのすべての登録されたプラグインを返します。

パラメータ

• scope string: プラグインエリア内でレンダリングする際に使用されるスコープ。デフォルトではスコープなし。

返り値

• WPPlugin[]: スコープなしまたは指定されたスコープのプラグインのリスト。

PluginArea

すべてのプラグインフィルを隠れたdivにレンダリングするコンポーネントです。

使用法

// Using ES5 syntax
var el = React.createElement;
var PluginArea = wp.plugins.PluginArea;
function Layout() {
   return el( 'div', { scope: 'my-page' }, 'Content of the page', PluginArea );
}

// Using ESNext syntax
import { PluginArea } from '@wordpress/plugins';
const Layout = () => (
   <div>
   Content of the page
   <PluginArea scope="my-page" />
   </div>
);

パラメータ

• props { scope?: string; onError?: ( name: WPPlugin[ 'name' ], error: Error ) => void; }:
• props.scope string:
• props.onError ( name: WPPlugin[ 'name' ], error: Error ) => void:

返り値

• Component: レンダリングされるコンポーネント。

registerPlugin

エディタにプラグインを登録します。

使用法

// Using ES5 syntax
var el = React.createElement;
var Fragment = wp.element.Fragment;
var PluginSidebar = wp.editor.PluginSidebar;
var PluginSidebarMoreMenuItem = wp.editor.PluginSidebarMoreMenuItem;
var registerPlugin = wp.plugins.registerPlugin;
var moreIcon = React.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,
   scope: 'my-page',
} );

// Using ESNext syntax
import { PluginSidebar, PluginSidebarMoreMenuItem } from '@wordpress/editor';
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,
   scope: 'my-page',
} );

パラメータ

• name string: プラグインを識別する文字列。すべての登録されたプラグインの中で一意である必要があります。
• settings PluginSettings: このプラグインの設定。

返り値

• PluginSettings | null: 最終的なプラグイン設定オブジェクト。

unregisterPlugin

名前でプラグインの登録を解除します。

使用法

// Using ES5 syntax
var unregisterPlugin = wp.plugins.unregisterPlugin;
unregisterPlugin( 'plugin-name' );

// Using ESNext syntax
import { unregisterPlugin } from '@wordpress/plugins';
unregisterPlugin( 'plugin-name' );

パラメータ

• name string: プラグイン名。

返り値

• WPPlugin | undefined: 以前のプラグイン設定オブジェクト。正常に登録解除された場合はそれを返し、そうでない場合はundefinedを返します。

usePluginContext

プラグインコンテキストを返すフックです。

返り値

• PluginContext: プラグインコンテキスト

withPluginContext

ラップされたコンポーネントにプラグインコンテキストを注入するために使用される高階コンポーネントです。

パラメータ

• mapContextToProps ( context: PluginContext, props: T ) => T & PluginContext: コンテキストが変更されるたびに呼び出される関数で、コンポーネントの独自のプロパティとマージするためのプロパティのオブジェクトを返すことが期待されます。

返り値

• Component: 注入されたコンテキストをプロパティとして持つ強化されたコンポーネント。

このパッケージへの貢献

これはGutenbergプロジェクトの一部である個別のパッケージです。このプロジェクトはモノレポとして整理されています。特定の目的を持つ複数の自己完結型ソフトウェアパッケージで構成されています。このモノレポ内のパッケージは[https://www.npmjs.com/]に公開され、[https://make.wordpress.org/core/]や他のソフトウェアプロジェクトで使用されています。

このパッケージやGutenberg全体への貢献について詳しく知りたい場合は、プロジェクトの主要な[https://github.com/WordPress/gutenberg/tree/HEAD/CONTRIBUTING.md]をお読みください。