Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Extensibility: Support PluginBlockSettingsMenuItem in the site editor #60033

Merged
merged 2 commits into from
Mar 22, 2024
Merged

Extensibility: Support PluginBlockSettingsMenuItem in the site editor #60033

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
9a5bd5a
Extensibiltiy: Support PluginBlockSettingsMenuItem in the site editor
youknowriad Mar 20, 2024
a3b5025
Small fix
youknowriad Mar 20, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
56 changes: 1 addition & 55 deletions packages/edit-post/README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -41,61 +41,7 @@ _Parameters_

### PluginBlockSettingsMenuItem

Renders a new item in the block settings menu.
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It's unfortunate that we don't have the automatic documentation in the editor package's README too but it should be considered separately from this PR.

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I noticed that, too. It's probably related to the configuration.


_Usage_

```js
// Using ES5 syntax
var __ = wp.i18n.__;
var PluginBlockSettingsMenuItem = wp.editPost.PluginBlockSettingsMenuItem;

function doOnClick() {
// To be called when the user clicks the menu item.
}

function MyPluginBlockSettingsMenuItem() {
return React.createElement( PluginBlockSettingsMenuItem, {
allowedBlocks: [ 'core/paragraph' ],
icon: 'dashicon-name',
label: __( 'Menu item text' ),
onClick: doOnClick,
} );
}
```

```jsx
// Using ESNext syntax
import { __ } from '@wordpress/i18n';
import { PluginBlockSettingsMenuItem } from '@wordpress/edit-post';

const doOnClick = () => {
// To be called when the user clicks the menu item.
};

const MyPluginBlockSettingsMenuItem = () => (
<PluginBlockSettingsMenuItem
allowedBlocks={ [ 'core/paragraph' ] }
icon="dashicon-name"
label={ __( 'Menu item text' ) }
onClick={ doOnClick }
/>
);
```

_Parameters_

- _props_ `Object`: Component props.
- _props.allowedBlocks_ `[Array]`: An array containing a list of block names for which the item should be shown. If not present, it'll be rendered for any block. If multiple blocks are selected, it'll be shown if and only if all of them are in the allowed list.
- _props.icon_ `[WPBlockTypeIconRender]`: The [Dashicon](https://developer.wordpress.org/resource/dashicons/) icon slug string, or an SVG WP element.
- _props.label_ `string`: The menu item text.
- _props.onClick_ `Function`: Callback function to be executed when the user click the menu item.
- _props.small_ `[boolean]`: Whether to render the label or not.
- _props.role_ `[string]`: The ARIA role for the menu item.

_Returns_

- `Component`: The component to be rendered.
Undocumented declaration.

### PluginDocumentSettingPanel

Expand Down
3 changes: 2 additions & 1 deletion packages/edit-post/src/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,7 @@ import {
registerWidgetGroupBlock,
} from '@wordpress/widgets';
import {
PluginBlockSettingsMenuItem,
PluginDocumentSettingPanel,
privateApis as editorPrivateApis,
store as editorStore,
Expand Down Expand Up @@ -161,7 +162,7 @@ export function reinitializeEditor() {
} );
}

export { default as PluginBlockSettingsMenuItem } from './components/block-settings-menu/plugin-block-settings-menu-item';
export { PluginBlockSettingsMenuItem };
export { PluginDocumentSettingPanel };
export { default as PluginMoreMenuItem } from './components/header/plugin-more-menu-item';
export { default as PluginPostPublishPanel } from './components/sidebar/plugin-post-publish-panel';
Expand Down
4 changes: 2 additions & 2 deletions ...s-menu/plugin-block-settings-menu-item.js → ...s-menu/plugin-block-settings-menu-item.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -38,7 +38,7 @@ const shouldRenderItem = ( selectedBlocks, allowedBlocks ) =>
* ```js
* // Using ES5 syntax
* var __ = wp.i18n.__;
* var PluginBlockSettingsMenuItem = wp.editPost.PluginBlockSettingsMenuItem;
* var PluginBlockSettingsMenuItem = wp.editor.PluginBlockSettingsMenuItem;
*
* function doOnClick(){
* // To be called when the user clicks the menu item.
Expand All @@ -61,7 +61,7 @@ const shouldRenderItem = ( selectedBlocks, allowedBlocks ) =>
* ```jsx
* // Using ESNext syntax
* import { __ } from '@wordpress/i18n';
* import { PluginBlockSettingsMenuItem } from '@wordpress/edit-post';
* import { PluginBlockSettingsMenuItem } from '@wordpress/editor';
*
* const doOnClick = ( ) => {
* // To be called when the user clicks the menu item.
Expand Down
1 change: 1 addition & 0 deletions packages/editor/src/components/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -27,6 +27,7 @@ export { default as PageAttributesPanel } from './page-attributes/panel';
export { default as PageAttributesParent } from './page-attributes/parent';
export { default as PageTemplate } from './post-template/classic-theme';
export { default as PluginDocumentSettingPanel } from './plugin-document-setting-panel';
export { default as PluginBlockSettingsMenuItem } from './block-settings-menu/plugin-block-settings-menu-item';
export { default as PostTemplatePanel } from './post-template/panel';
export { default as PostAuthor } from './post-author';
export { default as PostAuthorCheck } from './post-author/check';
Expand Down
Loading