feat(uishell): global header utilities

src/components/UIShell/UIShell.Story.svelte

@@ -3,6 +3,7 @@
 
   import UIShell from './UIShell.svelte';
   import SettingsAdjust20 from 'carbon-icons-svelte/lib/SettingsAdjust20';
+  import Help20 from 'carbon-icons-svelte/lib/Help20';
   import ChangeCatalog16 from 'carbon-icons-svelte/lib/ChangeCatalog16';
   import ManageProtection16 from 'carbon-icons-svelte/lib/ManageProtection16';
 
@@ -14,6 +15,9 @@
   import UIShellNav from './UIShellNav/UIShellNav.svelte';
   import UIShellNavItem from './UIShellNav/UIShellNavItem.svelte';
   import UIShellNavSubmenu from './UIShellNav/UIShellNavSubmenu.svelte';
+  import UIShellUtilities from './UIShellNav/UIShellUtilities.svelte';
+  import UtilitySearch from './UIShellNav/UtilitySearch.svelte';
+  import UtilityComponent from './UIShellNav/UtilityComponent.svelte';
 
   let iCatalog = {
     class: undefined,
@@ -25,6 +29,16 @@
     style: undefined
   };
 
+  let iHelp = {
+    class: undefined,
+    skeleton: false,
+    render: Help20,
+    title: 'Help',
+    tabindex: '0',
+    focusable: false,
+    style: undefined
+  };
+
   let iAdjust = {
     class: undefined,
     skeleton: false,
@@ -61,6 +75,13 @@
       </UIShellNav>
     </div>
   </UIShell>
+{:else if story === 'with-actions'}
+  <UIShell {...$$props}>
+    <UIShellUtilities>
+      <UtilitySearch />
+      <UtilityComponent type="Help" icon={iHelp} />
+    </UIShellUtilities>
+  </UIShell>
 {:else if story === 'with-actions-sidenav'}
   <UIShell {...$$props}>
     <div slot="SideNav">