feat(uishell): add right panel links

src/components/UIShell/GlobalHeader/HeaderAction.svelte

@@ -18,12 +18,6 @@
   }
 </script>
 
-<style>
-  .component-form {
-    margin: 1rem;
-  }
-</style>
-
 <svelte:window on:mouseup={mouseUp} />
 
 <div id="right-panel-action-component">
@@ -42,9 +36,7 @@
       id="right-panel-action-component-form"
       class={cx('--header-panel', '--header-panel--expanded')}
       transition:slide={{ duration: 200 }}>
-      <div class="component-form">
-        <slot />
-      </div>
+      <slot />
     </div>
   {/if}
 </div>

src/components/UIShell/GlobalHeader/HeaderPanelDivider.svelte

@@ -0,0 +1,21 @@
+<style>
+  .subject-divider {
+    color: #525252;
+    padding-bottom: 4px;
+    border-bottom: 1px solid #525252;
+    margin: 32px 1rem 8px;
+  }
+  .subject-divider span {
+    font-size: 0.75rem;
+    font-weight: 400;
+    line-height: 1rem;
+    letter-spacing: 0.32px;
+    color: #c6c6c6;
+  }
+</style>
+
+<li class="subject-divider">
+  <span>
+    <slot />
+  </span>
+</li>

src/components/UIShell/GlobalHeader/HeaderPanelLink.svelte

@@ -0,0 +1,11 @@
+<script>
+  export let href;
+
+  import { cx } from '../../../lib';
+</script>
+
+<li class={cx('--switcher__item')}>
+  <a class={cx('--switcher__item-link')} {href}>
+    <slot />
+  </a>
+</li>

src/components/UIShell/GlobalHeader/HeaderPanelLinks.svelte

@@ -0,0 +1,7 @@
+<script>
+  import { cx } from '../../../lib';
+</script>
+
+<ul class={cx('--switcher__item')}>
+  <slot />
+</ul>

src/components/UIShell/index.js

@@ -14,3 +14,6 @@ export { default as HeaderUtilities } from './GlobalHeader/HeaderUtilities.svelt
 export { default as HeaderAction } from './GlobalHeader/HeaderAction.svelte';
 export { default as HeaderActionLink } from './GlobalHeader/HeaderActionLink.svelte';
 export { default as HeaderActionSearch } from './GlobalHeader/HeaderActionSearch.svelte';
+export { default as HeaderPanelDivider } from './GlobalHeader/HeaderPanelDivider.svelte';
+export { default as HeaderPanelLink } from './GlobalHeader/HeaderPanelLink.svelte';
+export { default as HeaderPanelLinks } from './GlobalHeader/HeaderPanelLinks.svelte';