fix(vital-layout): Add outer Utility menu

johnsonandjohnson · Apr 17, 2023 · 26711f4 · 26711f4
1 parent dade4e3
commit 26711f4
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 0 deletions.
diff --git a/packages/vital-layout/src/components/Header/HeaderClean.tsx b/packages/vital-layout/src/components/Header/HeaderClean.tsx
@@ -42,6 +42,8 @@ const headerComponents: HeaderComponents = {
   BurgerMenu: BurgerMenuClean,
   Logo: LogoClean,
   ActionMenuContainer: Div,
+  OuterUtilityMenuWrapper: Fragment,
+  OuterUtilityMenu: Fragment,
   UtilityMenuWrapper: Fragment,
   UtilityMenu: MenuClean,
   DesktopSearch: Fragment,
@@ -55,6 +57,9 @@ const headerComponents: HeaderComponents = {
 
 const HeaderCleanBase: FC<HeaderProps> = ({ components: C, ...rest }) => (
   <C.Wrapper {...rest}>
+    <C.OuterUtilityMenuWrapper>
+      <C.OuterUtilityMenu />
+    </C.OuterUtilityMenuWrapper>
     <C.Container>
       <C.MenuTogglerWrapper>
         <C.MenuToggler />

diff --git a/packages/vital-layout/src/components/Header/types.ts b/packages/vital-layout/src/components/Header/types.ts
@@ -73,6 +73,16 @@ export interface HeaderComponents extends DesignableComponents {
    * Wrapper container fo user interactions in header
    */
   ActionMenuContainer: ComponentOrTag<any>,
+  /**
+   * Wrapper around utility menu that is shown above the Header.
+   * Not used by Default.
+   */
+  OuterUtilityMenuWrapper: ComponentOrTag<any>,
+  /**
+   * Used for secondary/utility menu that is shown above the Header.
+   * Not used by Default.
+   */
+  OuterUtilityMenu: ComponentOrTag<any>,
   /**
    * Wrapper around utility menu
    */