diff --git a/packages/editor/src/components/inserter/menu.js b/packages/editor/src/components/inserter/menu.js index 7fb3cb2ffdca6d..0c2a09ec1260fb 100644 --- a/packages/editor/src/components/inserter/menu.js +++ b/packages/editor/src/components/inserter/menu.js @@ -198,11 +198,16 @@ export class InserterMenu extends Component { if ( filterValue !== this.state.filterValue ) { if ( ! filterValue ) { openPanels = [ 'suggested' ]; - } else if ( reusableItems.length ) { - openPanels = [ 'reusable' ]; - } else if ( filteredItems.length ) { - const firstCategory = find( getCategories(), ( { slug } ) => itemsPerCategory[ slug ] && itemsPerCategory[ slug ].length ); - openPanels = [ firstCategory.slug ]; + } else { + openPanels = []; + if ( reusableItems.length ) { + openPanels.push( 'reusable' ); + } + if ( filteredItems.length ) { + openPanels = openPanels.concat( + Object.keys( itemsPerCategory ) + ); + } } } @@ -239,7 +244,6 @@ export class InserterMenu extends Component { const { instanceId, onSelect, rootClientId } = this.props; const { childItems, filterValue, hoveredItem, suggestedItems, reusableItems, itemsPerCategory, openPanels } = this.state; const isPanelOpen = ( panel ) => openPanels.indexOf( panel ) !== -1; - const isSearching = !! filterValue; // Disable reason (no-autofocus): The inserter menu is a modal display, not one which // is always visible, and one which already incurs this behavior of autoFocus via @@ -303,7 +307,7 @@ export class InserterMenu extends Component { key={ category.slug } title={ category.title } icon={ category.icon } - opened={ isSearching || isPanelOpen( category.slug ) } + opened={ isPanelOpen( category.slug ) } onToggle={ this.onTogglePanel( category.slug ) } ref={ this.bindPanel( category.slug ) } >