Skip to content

Commit

Permalink
Editor: Move PluginPostPublishPanel and PluginPrePublishPanel to edit…
Browse files Browse the repository at this point in the history
…or package
  • Loading branch information
ntsekouras committed Apr 2, 2024
1 parent 24e550f commit 77248eb
Show file tree
Hide file tree
Showing 7 changed files with 163 additions and 207 deletions.
76 changes: 4 additions & 72 deletions packages/edit-post/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -106,43 +106,9 @@ _Returns_

### PluginPostPublishPanel

Renders provided content to the post-publish panel in the publish flow (side panel that opens after a user publishes the post).

_Usage_

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

function MyPluginPostPublishPanel() {
return React.createElement(
PluginPostPublishPanel,
{
className: 'my-plugin-post-publish-panel',
title: __( 'My panel title' ),
initialOpen: true,
},
__( 'My panel content' )
);
}
```
> **Deprecated** since 6.6, use `wp.editor.PluginPostPublishPanel` instead.
```jsx
// Using ESNext syntax
import { __ } from '@wordpress/i18n';
import { PluginPostPublishPanel } from '@wordpress/edit-post';

const MyPluginPostPublishPanel = () => (
<PluginPostPublishPanel
className="my-plugin-post-publish-panel"
title={ __( 'My panel title' ) }
initialOpen={ true }
>
{ __( 'My panel content' ) }
</PluginPostPublishPanel>
);
```
Renders provided content to the post-publish panel in the publish flow (side panel that opens after a user publishes the post).

_Parameters_

Expand Down Expand Up @@ -203,43 +169,9 @@ _Returns_

### PluginPrePublishPanel

Renders provided content to the pre-publish side panel in the publish flow (side panel that opens when a user first pushes "Publish" from the main editor).

_Usage_

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

function MyPluginPrePublishPanel() {
return React.createElement(
PluginPrePublishPanel,
{
className: 'my-plugin-pre-publish-panel',
title: __( 'My panel title' ),
initialOpen: true,
},
__( 'My panel content' )
);
}
```
> **Deprecated** since 6.6, use `wp.editor.PluginPrePublishPanel` instead.
```jsx
// Using ESNext syntax
import { __ } from '@wordpress/i18n';
import { PluginPrePublishPanel } from '@wordpress/edit-post';

const MyPluginPrePublishPanel = () => (
<PluginPrePublishPanel
className="my-plugin-pre-publish-panel"
title={ __( 'My panel title' ) }
initialOpen={ true }
>
{ __( 'My panel content' ) }
</PluginPrePublishPanel>
);
```
Renders provided content to the pre-publish side panel in the publish flow (side panel that opens when a user first pushes "Publish" from the main editor).

_Parameters_

Expand Down
4 changes: 2 additions & 2 deletions packages/edit-post/src/components/layout/actions-panel.js
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,8 @@
import {
EntitiesSavedStates,
PostPublishPanel,
PluginPrePublishPanel,
PluginPostPublishPanel,
store as editorStore,
} from '@wordpress/editor';
import { useSelect, useDispatch } from '@wordpress/data';
Expand All @@ -14,8 +16,6 @@ import { useCallback } from '@wordpress/element';
/**
* Internal dependencies
*/
import PluginPostPublishPanel from '../sidebar/plugin-post-publish-panel';
import PluginPrePublishPanel from '../sidebar/plugin-pre-publish-panel';
import { store as editPostStore } from '../../store';

const { Fill, Slot } = createSlotFill( 'ActionsPanel' );
Expand Down
Original file line number Diff line number Diff line change
@@ -1,83 +1,28 @@
/**
* WordPress dependencies
*/
import { usePluginContext } from '@wordpress/plugins';
import { createSlotFill, PanelBody } from '@wordpress/components';

const { Fill, Slot } = createSlotFill( 'PluginPostPublishPanel' );
import deprecated from '@wordpress/deprecated';
import { PluginPostPublishPanel } from '@wordpress/editor';

/**
* Renders provided content to the post-publish panel in the publish flow
* (side panel that opens after a user publishes the post).
*
* @deprecated since 6.6, use `wp.editor.PluginPostPublishPanel` instead.
*
* @param {Object} props Component properties.
* @param {string} [props.className] An optional class name added to the panel.
* @param {string} [props.title] Title displayed at the top of the panel.
* @param {boolean} [props.initialOpen=false] Whether to have the panel initially opened. When no title is provided it is always opened.
* @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 when the sidebar is pinned to toolbar.
* @param {Element} props.children Children to be rendered
*
* @example
* ```js
* // Using ES5 syntax
* var __ = wp.i18n.__;
* var PluginPostPublishPanel = wp.editPost.PluginPostPublishPanel;
*
* function MyPluginPostPublishPanel() {
* return React.createElement(
* PluginPostPublishPanel,
* {
* className: 'my-plugin-post-publish-panel',
* title: __( 'My panel title' ),
* initialOpen: true,
* },
* __( 'My panel content' )
* );
* }
* ```
*
* @example
* ```jsx
* // Using ESNext syntax
* import { __ } from '@wordpress/i18n';
* import { PluginPostPublishPanel } from '@wordpress/edit-post';
*
* const MyPluginPostPublishPanel = () => (
* <PluginPostPublishPanel
* className="my-plugin-post-publish-panel"
* title={ __( 'My panel title' ) }
* initialOpen={ true }
* >
* { __( 'My panel content' ) }
* </PluginPostPublishPanel>
* );
* ```
*
* @return {Component} The component to be rendered.
*/
const PluginPostPublishPanel = ( {
children,
className,
title,
initialOpen = false,
icon,
} ) => {
const { icon: pluginIcon } = usePluginContext();

return (
<Fill>
<PanelBody
className={ className }
initialOpen={ initialOpen || ! title }
title={ title }
icon={ icon ?? pluginIcon }
>
{ children }
</PanelBody>
</Fill>
);
};

PluginPostPublishPanel.Slot = Slot;

export default PluginPostPublishPanel;
export default function EditPostPluginPostPublishPanel( props ) {
deprecated( 'wp.editPost.PluginPostPublishPanel', {
since: '6.6',
version: '6.8',
alternative: 'wp.editor.PluginPostPublishPanel',
} );
return <PluginPostPublishPanel { ...props } />;
}
Original file line number Diff line number Diff line change
@@ -1,15 +1,15 @@
/**
* WordPress dependencies
*/
import { createSlotFill, PanelBody } from '@wordpress/components';
import { usePluginContext } from '@wordpress/plugins';

const { Fill, Slot } = createSlotFill( 'PluginPrePublishPanel' );
import deprecated from '@wordpress/deprecated';
import { PluginPrePublishPanel } from '@wordpress/editor';

/**
* Renders provided content to the pre-publish side panel in the publish flow
* (side panel that opens when a user first pushes "Publish" from the main editor).
*
* @deprecated since 6.6, use `wp.editor.PluginPrePublishPanel` instead.
*
* @param {Object} props Component props.
* @param {string} [props.className] An optional class name added to the panel.
* @param {string} [props.title] Title displayed at the top of the panel.
Expand All @@ -20,67 +20,13 @@ const { Fill, Slot } = createSlotFill( 'PluginPrePublishPanel' );
* the sidebar is pinned to toolbar.
* @param {Element} props.children Children to be rendered
*
* @example
* ```js
* // Using ES5 syntax
* var __ = wp.i18n.__;
* var PluginPrePublishPanel = wp.editPost.PluginPrePublishPanel;
*
* function MyPluginPrePublishPanel() {
* return React.createElement(
* PluginPrePublishPanel,
* {
* className: 'my-plugin-pre-publish-panel',
* title: __( 'My panel title' ),
* initialOpen: true,
* },
* __( 'My panel content' )
* );
* }
* ```
*
* @example
* ```jsx
* // Using ESNext syntax
* import { __ } from '@wordpress/i18n';
* import { PluginPrePublishPanel } from '@wordpress/edit-post';
*
* const MyPluginPrePublishPanel = () => (
* <PluginPrePublishPanel
* className="my-plugin-pre-publish-panel"
* title={ __( 'My panel title' ) }
* initialOpen={ true }
* >
* { __( 'My panel content' ) }
* </PluginPrePublishPanel>
* );
* ```
*
* @return {Component} The component to be rendered.
*/
const PluginPrePublishPanel = ( {
children,
className,
title,
initialOpen = false,
icon,
} ) => {
const { icon: pluginIcon } = usePluginContext();

return (
<Fill>
<PanelBody
className={ className }
initialOpen={ initialOpen || ! title }
title={ title }
icon={ icon ?? pluginIcon }
>
{ children }
</PanelBody>
</Fill>
);
};

PluginPrePublishPanel.Slot = Slot;

export default PluginPrePublishPanel;
export default function EditPostPluginPrePublishPanel( props ) {
deprecated( 'wp.editPost.PluginPrePublishPanel', {
since: '6.6',
version: '6.8',
alternative: 'wp.editor.PluginPrePublishPanel',
} );
return <PluginPrePublishPanel { ...props } />;
}
2 changes: 2 additions & 0 deletions packages/editor/src/components/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -28,6 +28,8 @@ 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 PluginPostPublishPanel } from './plugin-post-publish-panel';
export { default as PluginPrePublishPanel } from './plugin-pre-publish-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
64 changes: 64 additions & 0 deletions packages/editor/src/components/plugin-post-publish-panel/index.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,64 @@
/**
* WordPress dependencies
*/
import { usePluginContext } from '@wordpress/plugins';
import { createSlotFill, PanelBody } from '@wordpress/components';

const { Fill, Slot } = createSlotFill( 'PluginPostPublishPanel' );

/**
* Renders provided content to the post-publish panel in the publish flow
* (side panel that opens after a user publishes the post).
*
* @param {Object} props Component properties.
* @param {string} [props.className] An optional class name added to the panel.
* @param {string} [props.title] Title displayed at the top of the panel.
* @param {boolean} [props.initialOpen=false] Whether to have the panel initially opened. When no title is provided it is always opened.
* @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 when the sidebar is pinned to toolbar.
* @param {Element} props.children Children to be rendered
*
* @example
* ```jsx
* // Using ESNext syntax
* import { __ } from '@wordpress/i18n';
* import { PluginPostPublishPanel } from '@wordpress/edit-post';
*
* const MyPluginPostPublishPanel = () => (
* <PluginPostPublishPanel
* className="my-plugin-post-publish-panel"
* title={ __( 'My panel title' ) }
* initialOpen={ true }
* >
* { __( 'My panel content' ) }
* </PluginPostPublishPanel>
* );
* ```
*
* @return {Component} The component to be rendered.
*/
const PluginPostPublishPanel = ( {
children,
className,
title,
initialOpen = false,
icon,
} ) => {
const { icon: pluginIcon } = usePluginContext();

return (
<Fill>
<PanelBody
className={ className }
initialOpen={ initialOpen || ! title }
title={ title }
icon={ icon ?? pluginIcon }
>
{ children }
</PanelBody>
</Fill>
);
};

PluginPostPublishPanel.Slot = Slot;

export default PluginPostPublishPanel;
Loading

0 comments on commit 77248eb

Please sign in to comment.