Stacked headers and navigational search

docs/developer/plugin-list.asciidoc

@@ -337,6 +337,10 @@ and actions.
 or dashboards from the Kibana instance, from both server and client-side plugins
 
 
+|{kib-repo}blob/{branch}/x-pack/plugins/global_search_bar/README.md[globalSearchBar]
+|The GlobalSearchBar plugin provides a search interface for navigating Kibana. (It is the UI to the GlobalSearch plugin.)
+
+
 |{kib-repo}blob/{branch}/x-pack/plugins/global_search_providers[globalSearchProviders]
 |WARNING: Missing README.
 

docs/development/core/public/kibana-plugin-core-public.chromenavcontrols.md

@@ -30,6 +30,7 @@ chrome.navControls.registerLeft({
 
 |  Method | Description |
 |  --- | --- |
-|  [registerLeft(navControl)](./kibana-plugin-core-public.chromenavcontrols.registerleft.md) | Register a nav control to be presented on the left side of the chrome header. |
-|  [registerRight(navControl)](./kibana-plugin-core-public.chromenavcontrols.registerright.md) | Register a nav control to be presented on the right side of the chrome header. |
+|  [registerCenter(navControl)](./kibana-plugin-core-public.chromenavcontrols.registercenter.md) | Register a nav control to be presented on the top-center side of the chrome header. |
+|  [registerLeft(navControl)](./kibana-plugin-core-public.chromenavcontrols.registerleft.md) | Register a nav control to be presented on the bottom-left side of the chrome header. |
+|  [registerRight(navControl)](./kibana-plugin-core-public.chromenavcontrols.registerright.md) | Register a nav control to be presented on the top-right side of the chrome header. |
 

docs/development/core/public/kibana-plugin-core-public.chromenavcontrols.registercenter.md

@@ -0,0 +1,24 @@
+<!-- Do not edit this file. It is automatically generated by API Documenter. -->
+
+[Home](./index.md) &gt; [kibana-plugin-core-public](./kibana-plugin-core-public.md) &gt; [ChromeNavControls](./kibana-plugin-core-public.chromenavcontrols.md) &gt; [registerCenter](./kibana-plugin-core-public.chromenavcontrols.registercenter.md)
+
+## ChromeNavControls.registerCenter() method
+
+Register a nav control to be presented on the top-center side of the chrome header.
+
+<b>Signature:</b>
+
+```typescript
+registerCenter(navControl: ChromeNavControl): void;
+```
+
+## Parameters
+
+|  Parameter | Type | Description |
+|  --- | --- | --- |
+|  navControl | <code>ChromeNavControl</code> |  |
+
+<b>Returns:</b>
+
+`void`
+

docs/development/core/public/kibana-plugin-core-public.chromenavcontrols.registerleft.md

@@ -4,7 +4,7 @@
 
 ## ChromeNavControls.registerLeft() method
 
-Register a nav control to be presented on the left side of the chrome header.
+Register a nav control to be presented on the bottom-left side of the chrome header.
 
 <b>Signature:</b>
 

docs/development/core/public/kibana-plugin-core-public.chromenavcontrols.registerright.md

@@ -4,7 +4,7 @@
 
 ## ChromeNavControls.registerRight() method
 
-Register a nav control to be presented on the right side of the chrome header.
+Register a nav control to be presented on the top-right side of the chrome header.
 
 <b>Signature:</b>
 

docs/development/core/public/kibana-plugin-core-public.chromestart.md

@@ -59,7 +59,6 @@ core.chrome.setHelpExtension(elem => {
 |  [getHelpExtension$()](./kibana-plugin-core-public.chromestart.gethelpextension_.md) | Get an observable of the current custom help conttent |
 |  [getIsNavDrawerLocked$()](./kibana-plugin-core-public.chromestart.getisnavdrawerlocked_.md) | Get an observable of the current locked state of the nav drawer. |
 |  [getIsVisible$()](./kibana-plugin-core-public.chromestart.getisvisible_.md) | Get an observable of the current visibility state of the chrome. |
-|  [getNavType$()](./kibana-plugin-core-public.chromestart.getnavtype_.md) | Get the navigation type TODO \#64541 Can delete |
 |  [removeApplicationClass(className)](./kibana-plugin-core-public.chromestart.removeapplicationclass.md) | Remove a className added with <code>addApplicationClass()</code>. If className is unknown it is ignored. |
 |  [setAppTitle(appTitle)](./kibana-plugin-core-public.chromestart.setapptitle.md) | Sets the current app's title |
 |  [setBadge(badge)](./kibana-plugin-core-public.chromestart.setbadge.md) | Override the current badge |

packages/kbn-test/src/functional_test_runner/lib/config/schema.ts

@@ -262,7 +262,7 @@ export const schema = Joi.object()
     // settings for the find service
     layout: Joi.object()
       .keys({
-        fixedHeaderHeight: Joi.number().default(50),
+        fixedHeaderHeight: Joi.number().default(100),
       })
       .default(),
 

src/core/public/application/ui/app_container.tsx

@@ -94,8 +94,10 @@ export const AppContainer: FunctionComponent<Props> = ({
         // eslint-disable-next-line no-console
         console.error(e);
       } finally {
-        setShowSpinner(false);
-        setIsMounting(false);
+        if (elementRef.current) {
+          setShowSpinner(false);
+          setIsMounting(false);
+        }
       }
     };
 

src/core/public/chrome/chrome_service.mock.ts

@@ -17,14 +17,7 @@
  * under the License.
  */
 import { BehaviorSubject } from 'rxjs';
-import {
-  ChromeBadge,
-  ChromeBrand,
-  ChromeBreadcrumb,
-  ChromeService,
-  InternalChromeStart,
-  NavType,
-} from './';
+import { ChromeBadge, ChromeBrand, ChromeBreadcrumb, ChromeService, InternalChromeStart } from './';
 
 const createStartContractMock = () => {
   const startContract: DeeplyMockedKeys<InternalChromeStart> = {
@@ -50,8 +43,10 @@ const createStartContractMock = () => {
     },
     navControls: {
       registerLeft: jest.fn(),
+      registerCenter: jest.fn(),
       registerRight: jest.fn(),
       getLeft$: jest.fn(),
+      getCenter$: jest.fn(),
       getRight$: jest.fn(),
     },
     setAppTitle: jest.fn(),
@@ -70,7 +65,6 @@ const createStartContractMock = () => {
     setHelpExtension: jest.fn(),
     setHelpSupportUrl: jest.fn(),
     getIsNavDrawerLocked$: jest.fn(),
-    getNavType$: jest.fn(),
     getCustomNavLink$: jest.fn(),
     setCustomNavLink: jest.fn(),
   };
@@ -83,7 +77,6 @@ const createStartContractMock = () => {
   startContract.getCustomNavLink$.mockReturnValue(new BehaviorSubject(undefined));
   startContract.getHelpExtension$.mockReturnValue(new BehaviorSubject(undefined));
   startContract.getIsNavDrawerLocked$.mockReturnValue(new BehaviorSubject(false));
-  startContract.getNavType$.mockReturnValue(new BehaviorSubject('modern' as NavType));
   return startContract;
 };
 

src/core/public/chrome/chrome_service.tsx

@@ -37,7 +37,6 @@ import { ChromeNavControls, NavControlsService } from './nav_controls';
 import { ChromeNavLinks, NavLinksService, ChromeNavLink } from './nav_links';
 import { ChromeRecentlyAccessed, RecentlyAccessedService } from './recently_accessed';
 import { Header } from './ui';
-import { NavType } from './ui/header';
 import { ChromeHelpExtensionMenuLink } from './ui/header/header_help_menu';
 export { ChromeNavControls, ChromeRecentlyAccessed, ChromeDocTitle };
 
@@ -172,10 +171,6 @@ export class ChromeService {
 
     const getIsNavDrawerLocked$ = isNavDrawerLocked$.pipe(takeUntil(this.stop$));
 
-    // TODO #64541
-    // Can delete
-    const getNavType$ = uiSettings.get$('pageNavigation').pipe(takeUntil(this.stop$));
-
     const isIE = () => {
       const ua = window.navigator.userAgent;
       const msie = ua.indexOf('MSIE '); // IE 10 or older
@@ -241,10 +236,10 @@ export class ChromeService {
           navLinks$={navLinks.getNavLinks$()}
           recentlyAccessed$={recentlyAccessed.get$()}
           navControlsLeft$={navControls.getLeft$()}
+          navControlsCenter$={navControls.getCenter$()}
           navControlsRight$={navControls.getRight$()}
           onIsLockedUpdate={setIsNavDrawerLocked}
           isLocked$={getIsNavDrawerLocked$}
-          navType$={getNavType$}
         />
       ),
 
@@ -305,8 +300,6 @@ export class ChromeService {
 
       getIsNavDrawerLocked$: () => getIsNavDrawerLocked$,
 
-      getNavType$: () => getNavType$,
-
       getCustomNavLink$: () => customNavLink$.pipe(takeUntil(this.stop$)),
 
       setCustomNavLink: (customNavLink?: ChromeNavLink) => {
@@ -468,13 +461,6 @@ export interface ChromeStart {
    * Get an observable of the current locked state of the nav drawer.
    */
   getIsNavDrawerLocked$(): Observable<boolean>;
-
-  /**
-   * Get the navigation type
-   * TODO #64541
-   * Can delete
-   */
-  getNavType$(): Observable<NavType>;
 }
 
 /** @internal */

src/core/public/chrome/nav_controls/nav_controls_service.ts

@@ -45,14 +45,18 @@ export interface ChromeNavControl {
  * @public
  */
 export interface ChromeNavControls {
-  /** Register a nav control to be presented on the left side of the chrome header. */
+  /** Register a nav control to be presented on the bottom-left side of the chrome header. */
   registerLeft(navControl: ChromeNavControl): void;
-  /** Register a nav control to be presented on the right side of the chrome header. */
+  /** Register a nav control to be presented on the top-right side of the chrome header. */
   registerRight(navControl: ChromeNavControl): void;
+  /** Register a nav control to be presented on the top-center side of the chrome header. */
+  registerCenter(navControl: ChromeNavControl): void;
   /** @internal */
   getLeft$(): Observable<ChromeNavControl[]>;
   /** @internal */
   getRight$(): Observable<ChromeNavControl[]>;
+  /** @internal */
+  getCenter$(): Observable<ChromeNavControl[]>;
 }
 
 /** @internal */
@@ -62,6 +66,7 @@ export class NavControlsService {
   public start() {
     const navControlsLeft$ = new BehaviorSubject<ReadonlySet<ChromeNavControl>>(new Set());
     const navControlsRight$ = new BehaviorSubject<ReadonlySet<ChromeNavControl>>(new Set());
+    const navControlsCenter$ = new BehaviorSubject<ReadonlySet<ChromeNavControl>>(new Set());
 
     return {
       // In the future, registration should be moved to the setup phase. This
@@ -72,6 +77,9 @@ export class NavControlsService {
       registerRight: (navControl: ChromeNavControl) =>
         navControlsRight$.next(new Set([...navControlsRight$.value.values(), navControl])),
 
+      registerCenter: (navControl: ChromeNavControl) =>
+        navControlsCenter$.next(new Set([...navControlsCenter$.value.values(), navControl])),
+
       getLeft$: () =>
         navControlsLeft$.pipe(
           map((controls) => sortBy([...controls.values()], 'order')),
@@ -82,6 +90,11 @@ export class NavControlsService {
           map((controls) => sortBy([...controls.values()], 'order')),
           takeUntil(this.stop$)
         ),
+      getCenter$: () =>
+        navControlsCenter$.pipe(
+          map((controls) => sortBy([...controls.values()], 'order')),
+          takeUntil(this.stop$)
+        ),
     };
   }