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

Extensibility: support the PluginDocumentSettingPanel slot in the site editor #59985

Merged
merged 2 commits into from
Mar 20, 2024
Merged

Extensibility: support the PluginDocumentSettingPanel slot in the site editor #59985

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
3e2d95f
Extensibility: support the PluginDocumentSettingPanel slot in the sit…
youknowriad Mar 19, 2024
74dbfce
Update lock
youknowriad Mar 19, 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
2 changes: 1 addition & 1 deletion docs/reference-guides/slotfills/plugin-document-setting-panel.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,7 @@ This SlotFill allows registering a UI to edit Document settings.

```js
import { registerPlugin } from '@wordpress/plugins';
import { PluginDocumentSettingPanel } from '@wordpress/edit-post';
import { PluginDocumentSettingPanel } from '@wordpress/editor';

const PluginDocumentSettingPanelDemo = () => (
<PluginDocumentSettingPanel
Expand Down
4 changes: 4 additions & 0 deletions package-lock.json
View file
Open in desktop

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

59 changes: 1 addition & 58 deletions packages/edit-post/README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -99,64 +99,7 @@ _Returns_

### PluginDocumentSettingPanel

Renders items below the Status & Availability panel in the Document Sidebar.

_Usage_

```js
// Using ES5 syntax
var el = React.createElement;
var __ = wp.i18n.__;
var registerPlugin = wp.plugins.registerPlugin;
var PluginDocumentSettingPanel = wp.editPost.PluginDocumentSettingPanel;

function MyDocumentSettingPlugin() {
return el(
PluginDocumentSettingPanel,
{
className: 'my-document-setting-plugin',
title: 'My Panel',
name: 'my-panel',
},
__( 'My Document Setting Panel' )
);
}

registerPlugin( 'my-document-setting-plugin', {
render: MyDocumentSettingPlugin,
} );
```

```jsx
// Using ESNext syntax
import { registerPlugin } from '@wordpress/plugins';
import { PluginDocumentSettingPanel } from '@wordpress/edit-post';

const MyDocumentSettingTest = () => (
<PluginDocumentSettingPanel
className="my-document-setting-plugin"
title="My Panel"
name="my-panel"
>
<p>My Document Setting Panel</p>
</PluginDocumentSettingPanel>
);

registerPlugin( 'document-setting-test', { render: MyDocumentSettingTest } );
```

_Parameters_

- _props_ `Object`: Component properties.
- _props.name_ `string`: Required. A machine-friendly name for the panel.
- _props.className_ `[string]`: An optional class name added to the row.
- _props.title_ `[string]`: The title of the panel
- _props.icon_ `[WPBlockTypeIconRender]`: The [Dashicon](https://developer.wordpress.org/resource/dashicons/) icon slug string, or an SVG WP element, to be rendered when the sidebar is pinned to toolbar.
- _props.children_ `Element`: Children to be rendered

_Returns_

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

### PluginMoreMenuItem

Expand Down
2 changes: 1 addition & 1 deletion packages/edit-post/src/components/sidebar/settings-sidebar/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -20,6 +20,7 @@ import { store as keyboardShortcutsStore } from '@wordpress/keyboard-shortcuts';
import {
store as editorStore,
PageAttributesPanel,
PluginDocumentSettingPanel,
PostDiscussionPanel,
PostExcerptPanel,
PostLastRevisionPanel,
Expand All @@ -32,7 +33,6 @@ import {
import SettingsHeader from '../settings-header';
import PostStatus from '../post-status';
import MetaBoxes from '../../meta-boxes';
import PluginDocumentSettingPanel from '../plugin-document-setting-panel';
import PluginSidebarEditPost from '../plugin-sidebar';
import TemplateSummary from '../template-summary';
import { store as editPostStore } from '../../../store';
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 {
PluginDocumentSettingPanel,
privateApis as editorPrivateApis,
store as editorStore,
} from '@wordpress/editor';
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 { default as PluginDocumentSettingPanel } from './components/sidebar/plugin-document-setting-panel';
export { PluginDocumentSettingPanel };
Copy link
Member

Choose a reason for hiding this comment

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

Should we wrap this in a deprecated call to let extenders know about the change so they can change their implementations?

I don't think we would need a removal timeframe for now. But from what I can tell here it doesn't make sense to use the version exported through there going forward.

It's definitely important that it is here though to not break anything :)

Copy link
Contributor Author

Choose a reason for hiding this comment

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

Yes, I wondering about it. Should we deprecate now or give it some time (maybe move more slots and check feedback)

export { default as PluginMoreMenuItem } from './components/header/plugin-more-menu-item';
export { default as PluginPostPublishPanel } from './components/sidebar/plugin-post-publish-panel';
export { default as PluginPostStatusInfo } from './components/sidebar/plugin-post-status-info';
Expand Down
2 changes: 2 additions & 0 deletions packages/edit-site/src/components/sidebar-edit-mode/page-panels/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,7 @@ import { store as coreStore } from '@wordpress/core-data';
import { decodeEntities } from '@wordpress/html-entities';
import {
PageAttributesPanel,
PluginDocumentSettingPanel,
PostDiscussionPanel,
PostExcerptPanel,
PostLastRevisionPanel,
Expand Down Expand Up @@ -96,6 +97,7 @@ export default function PagePanels() {
postType={ type }
/>
</PanelBody>
<PluginDocumentSettingPanel.Slot />
{ renderingMode !== 'post-only' && (
<PanelBody title={ __( 'Content' ) }>
<PageContent />
Expand Down
2 changes: 2 additions & 0 deletions packages/editor/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -54,12 +54,14 @@
"@wordpress/media-utils": "file:../media-utils",
"@wordpress/notices": "file:../notices",
"@wordpress/patterns": "file:../patterns",
"@wordpress/plugins": "file:../plugins",
"@wordpress/preferences": "file:../preferences",
"@wordpress/private-apis": "file:../private-apis",
"@wordpress/reusable-blocks": "file:../reusable-blocks",
"@wordpress/rich-text": "file:../rich-text",
"@wordpress/server-side-render": "file:../server-side-render",
"@wordpress/url": "file:../url",
"@wordpress/warning": "file:../warning",
"@wordpress/wordcount": "file:../wordcount",
"classnames": "^2.3.1",
"date-fns": "^2.28.0",
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 @@ -26,6 +26,7 @@ export { default as PageAttributesOrder } from './page-attributes/order';
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 PostTemplatePanel } from './post-template/panel';
export { default as PostAuthor } from './post-author';
export { default as PostAuthorCheck } from './post-author/check';
Expand Down
12 changes: 4 additions & 8 deletions ...ar/plugin-document-setting-panel/index.js → ...ts/plugin-document-setting-panel/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,18 +5,14 @@ import { createSlotFill, PanelBody } from '@wordpress/components';
import { usePluginContext } from '@wordpress/plugins';
import { useDispatch, useSelect } from '@wordpress/data';
import warning from '@wordpress/warning';
import {
store as editorStore,
privateApis as editorPrivateApis,
} from '@wordpress/editor';

/**
* Internal dependencies
*/
import { unlock } from '../../../lock-unlock';
import EnablePluginDocumentSettingPanelOption from '../preferences-modal/enable-plugin-document-setting-panel';
import { store as editorStore } from '../../store';

const { Fill, Slot } = createSlotFill( 'PluginDocumentSettingPanel' );
const { EnablePluginDocumentSettingPanelOption } = unlock( editorPrivateApis );

/**
* Renders items below the Status & Availability panel in the Document Sidebar.
Expand All @@ -34,7 +30,7 @@ const { EnablePluginDocumentSettingPanelOption } = unlock( editorPrivateApis );
* var el = React.createElement;
* var __ = wp.i18n.__;
* var registerPlugin = wp.plugins.registerPlugin;
* var PluginDocumentSettingPanel = wp.editPost.PluginDocumentSettingPanel;
* var PluginDocumentSettingPanel = wp.editor.PluginDocumentSettingPanel;
*
* function MyDocumentSettingPlugin() {
* return el(
Expand All @@ -57,7 +53,7 @@ const { EnablePluginDocumentSettingPanelOption } = unlock( editorPrivateApis );
* ```jsx
* // Using ESNext syntax
* import { registerPlugin } from '@wordpress/plugins';
* import { PluginDocumentSettingPanel } from '@wordpress/edit-post';
* import { PluginDocumentSettingPanel } from '@wordpress/editor';
*
* const MyDocumentSettingTest = () => (
* <PluginDocumentSettingPanel className="my-document-setting-plugin" title="My Panel" name="my-panel">
Expand Down
2 changes: 0 additions & 2 deletions packages/editor/src/private-apis.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,6 @@
import EditorCanvas from './components/editor-canvas';
import { ExperimentalEditorProvider } from './components/provider';
import { lock } from './lock-unlock';
import EnablePluginDocumentSettingPanelOption from './components/preferences-modal/enable-plugin-document-setting-panel';
import { EntitiesSavedStatesExtensible } from './components/entities-saved-states';
import useBlockEditorSettings from './components/provider/use-block-editor-settings';
import DocumentTools from './components/document-tools';
Expand All @@ -22,7 +21,6 @@ lock( privateApis, {
DocumentTools,
EditorCanvas,
ExperimentalEditorProvider,
EnablePluginDocumentSettingPanelOption,
EntitiesSavedStatesExtensible,
InserterSidebar,
ListViewSidebar,
Expand Down
Loading