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

Added an extension slot for inserter menu. #17183

Closed
wants to merge 1 commit into from
Closed

Added an extension slot for inserter menu. #17183

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
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
1 change: 1 addition & 0 deletions packages/block-editor/src/components/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -41,6 +41,7 @@ export { default as withColorContext } from './color-palette/with-color-context'

export { default as __experimentalBlockSettingsMenuFirstItem } from './block-settings-menu/block-settings-menu-first-item';
export { default as __experimentalBlockSettingsMenuPluginsExtension } from './block-settings-menu/block-settings-menu-plugins-extension';
export { default as __experimentalInserterMenuExtension } from './inserter-menu-extension';
export { default as BlockEditorKeyboardShortcuts } from './block-editor-keyboard-shortcuts';
export { default as BlockInspector } from './block-inspector';
export { default as BlockList } from './block-list';
Expand Down
10 changes: 10 additions & 0 deletions packages/block-editor/src/components/inserter-menu-extension/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,10 @@
/**
* WordPress dependencies
*/
import { createSlotFill } from '@wordpress/components';

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

__experimentalInserterMenuExtension.Slot = Slot;

export default __experimentalInserterMenuExtension;
25 changes: 22 additions & 3 deletions packages/block-editor/src/components/inserter/menu.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -47,6 +47,7 @@ import BlockPreview from '../block-preview';
import BlockTypesList from '../block-types-list';
import BlockCard from '../block-card';
import ChildBlocks from './child-blocks';
import __experimentalInserterMenuExtension from '../inserter-menu-extension';

const MAX_SUGGESTED_ITEMS = 9;

Expand Down Expand Up @@ -263,6 +264,7 @@ export class InserterMenu extends Component {
suggestedItems,
} = this.state;
const isPanelOpen = ( panel ) => openPanels.indexOf( panel ) !== -1;
const isMenuEmpty = isEmpty( suggestedItems ) && isEmpty( reusableItems ) && isEmpty( itemsPerCategory );
const hoveredItemBlockType = hoveredItem ? getBlockType( hoveredItem.name ) : null;

// Disable reason (no-autofocus): The inserter menu is a modal display, not one which
Expand Down Expand Up @@ -355,9 +357,26 @@ export class InserterMenu extends Component {
</a>
</PanelBody>
) }
{ isEmpty( suggestedItems ) && isEmpty( reusableItems ) && isEmpty( itemsPerCategory ) && (
<p className="editor-inserter__no-results block-editor-inserter__no-results">{ __( 'No blocks found.' ) }</p>
) }
<__experimentalInserterMenuExtension.Slot
fillProps={ {
onSelect,
onHover: this.onHover,
filterValue: this.state.filterValue,
isMenuEmpty,
} }
>
{ ( fills ) => {
if ( fills.length ) {
return fills;
}
if ( isMenuEmpty ) {
return (
<p className="editor-inserter__no-results block-editor-inserter__no-results">{ __( 'No blocks found.' ) }</p>
);
}
return null;
} }
</__experimentalInserterMenuExtension.Slot>
</div>
</div>

Expand Down