diff --git a/packages/block-editor/src/components/inserter/index.js b/packages/block-editor/src/components/inserter/index.js index 8d431290b3124d..a5f74fd02f2970 100644 --- a/packages/block-editor/src/components/inserter/index.js +++ b/packages/block-editor/src/components/inserter/index.js @@ -136,6 +136,7 @@ class Inserter extends Component { /> ); } + return ( { showInserterHelpPanel && hoveredItem && ( -
- -
+ ) } ); diff --git a/packages/block-editor/src/components/inserter/preview-panel.js b/packages/block-editor/src/components/inserter/preview-panel.js index 763edbbd506377..b27dedbcf24426 100644 --- a/packages/block-editor/src/components/inserter/preview-panel.js +++ b/packages/block-editor/src/components/inserter/preview-panel.js @@ -18,7 +18,7 @@ import BlockPreview from '../block-preview'; function InserterPreviewPanel( { item } ) { const hoveredItemBlockType = getBlockType( item.name ); return ( -
+
{ isReusableBlock( item ) || hoveredItemBlockType.example ? (
diff --git a/packages/block-editor/src/components/inserter/search-items.js b/packages/block-editor/src/components/inserter/search-items.js index dfa575cd28cbaa..58b964d579bef1 100644 --- a/packages/block-editor/src/components/inserter/search-items.js +++ b/packages/block-editor/src/components/inserter/search-items.js @@ -110,7 +110,7 @@ export const searchBlockItems = ( * @param {Object} config Search Config. * @return {Array} Filtered item list. */ -export const searchItems = ( items, searchTerm, config = {} ) => { +export const searchItems = ( items = [], searchTerm = '', config = {} ) => { const normalizedSearchTerms = normalizeSearchTerm( searchTerm ); if ( normalizedSearchTerms.length === 0 ) { return items; diff --git a/packages/block-editor/src/components/inserter/style.scss b/packages/block-editor/src/components/inserter/style.scss index 9cc9e596a6745b..74b579e329b090 100644 --- a/packages/block-editor/src/components/inserter/style.scss +++ b/packages/block-editor/src/components/inserter/style.scss @@ -19,10 +19,6 @@ $block-inserter-tabs-height: 44px; .block-editor-inserter__popover .block-editor-inserter__menu { margin: -$grid-unit-15; - .block-editor-inserter__search { - top: -$grid-unit-15; - } - .block-editor-inserter__tabs .components-tab-panel__tabs { top: $grid-unit-10 + $grid-unit-20 + $grid-unit-60 - $grid-unit-15; } @@ -31,6 +27,10 @@ $block-inserter-tabs-height: 44px; overflow: visible; height: auto; } + + .block-editor-inserter__preview-container { + display: none; + } } .block-editor-inserter__toggle.components-button { diff --git a/packages/edit-widgets/src/components/header/index.js b/packages/edit-widgets/src/components/header/index.js index e2185b97771808..24feb8b2a57574 100644 --- a/packages/edit-widgets/src/components/header/index.js +++ b/packages/edit-widgets/src/components/header/index.js @@ -10,6 +10,7 @@ import { } from '@wordpress/block-editor'; import { PinnedItems } from '@wordpress/interface'; import { useViewportMatch } from '@wordpress/compose'; +import { useSelect } from '@wordpress/data'; /** * Internal dependencies @@ -22,6 +23,13 @@ const inserterToggleProps = { isPrimary: true }; function Header( { isCustomizer } ) { const isLargeViewport = useViewportMatch( 'medium' ); + const rootClientId = useSelect( ( select ) => { + const { getBlockRootClientId, getBlockSelectionEnd } = select( + 'core/block-editor' + ); + return getBlockRootClientId( getBlockSelectionEnd() ); + }, [] ); + return ( <>
@@ -30,6 +38,7 @@ function Header( { isCustomizer } ) { position="bottom right" showInserterHelpPanel toggleProps={ inserterToggleProps } + rootClientId={ rootClientId } />