@wordpress/block-editor/build-module/components/inserter/mobile-tab-navigation.js

Generic block editor.

import { createElement } from "@wordpress/element";

/**
 * WordPress dependencies
 */
import { __, isRTL } from '@wordpress/i18n';
import { __experimentalItemGroup as ItemGroup, __experimentalItem as Item, __experimentalHStack as HStack, __experimentalVStack as VStack, __experimentalSpacer as Spacer, __experimentalHeading as Heading, __experimentalView as View, __experimentalNavigatorProvider as NavigatorProvider, __experimentalNavigatorScreen as NavigatorScreen, __experimentalNavigatorButton as NavigatorButton, __experimentalNavigatorBackButton as NavigatorBackButton, FlexBlock } from '@wordpress/components';
import { Icon, chevronRight, chevronLeft } from '@wordpress/icons';

function ScreenHeader({
  title
}) {
  return createElement(VStack, {
    spacing: 0
  }, createElement(View, null, createElement(Spacer, {
    marginBottom: 0,
    paddingX: 4,
    paddingY: 3
  }, createElement(HStack, {
    spacing: 2
  }, createElement(NavigatorBackButton, {
    style: // TODO: This style override is also used in ToolsPanelHeader.
    // It should be supported out-of-the-box by Button.
    {
      minWidth: 24,
      padding: 0
    },
    icon: isRTL() ? chevronRight : chevronLeft,
    isSmall: true,
    "aria-label": __('Navigate to the previous view')
  }), createElement(Spacer, null, createElement(Heading, {
    level: 5
  }, title))))));
}

export default function MobileTabNavigation({
  categories,
  children
}) {
  return createElement(NavigatorProvider, {
    initialPath: "/",
    className: "block-editor-inserter__mobile-tab-navigation"
  }, createElement(NavigatorScreen, {
    path: "/"
  }, createElement(ItemGroup, null, categories.map(category => createElement(NavigatorButton, {
    key: category.name,
    path: `/category/${category.name}`,
    as: Item,
    isAction: true
  }, createElement(HStack, null, createElement(FlexBlock, null, category.label), createElement(Icon, {
    icon: isRTL() ? chevronLeft : chevronRight
  })))))), categories.map(category => createElement(NavigatorScreen, {
    key: category.name,
    path: `/category/${category.name}`
  }, createElement(ScreenHeader, {
    title: __('Back')
  }), children(category))));
}
//# sourceMappingURL=mobile-tab-navigation.js.map