hr-design-system-handlebars 0.45.0 → 0.47.0

package/.storybook/preview.js

@@ -8,7 +8,7 @@ import { INITIAL_VIEWPORTS } from '@storybook/addon-viewport'
 
 import Initializer from '../build/webpack/feature-loader/initializer/initializer'
 import loadFeature from '../build/webpack/feature-loader/initializer/loader'
-import 'components/header/header_alpine'
+import 'components/site_header/header_alpine'
 
 function loadDelayedImages(){setTimeout((function(){var t,e=document.images,s=[],a=function(t){void 0!==window.picturefill&&window.picturefill({reevaluate:!0,elements:t})};for(var i=0;i<e.length;++i)(t=e[i].dataset?e[i].dataset.srcset:e[i].getAttribute("data-srcset"))&&(0===e[i].getBoundingClientRect().top?s.push(e[i]):e[i].setAttribute("srcset",t));a(e),setTimeout((function(){var t;for(var i=0;i<s.length;++i)t=s[i].dataset?s[i].dataset.srcset:s[i].getAttribute("data-srcset"),s[i].setAttribute("srcset",t);a(s)}),900)}),0)}
     

package/CHANGELOG.md

@@ -1,3 +1,39 @@
+# v0.47.0 (Fri May 20 2022)
+
+#### 🚀 Enhancement
+
+- Feature/dpe 1579 [#234](https://github.com/mumprod/hr-design-system-handlebars/pull/234) ([@szuelch](https://github.com/szuelch))
+
+#### Authors: 1
+
+- [@szuelch](https://github.com/szuelch)
+
+---
+
+# v0.46.0 (Fri May 13 2022)
+
+#### 🚀 Enhancement
+
+- renamed folders header and search to site_header and navigation_search [#233](https://github.com/mumprod/hr-design-system-handlebars/pull/233) ([@StefanVesper](https://github.com/StefanVesper))
+
+#### Authors: 1
+
+- SonicSoulSurfer ([@StefanVesper](https://github.com/StefanVesper))
+
+---
+
+# v0.45.1 (Fri May 13 2022)
+
+#### 🐛 Bug Fix
+
+- some refactoring [#232](https://github.com/mumprod/hr-design-system-handlebars/pull/232) ([@hanswurstsalat](https://github.com/hanswurstsalat))
+
+#### Authors: 1
+
+- Geraldo ([@hanswurstsalat](https://github.com/hanswurstsalat))
+
+---
+
 # v0.45.0 (Thu May 12 2022)
 
 #### 🚀 Enhancement

package/dist/assets/index.css

@@ -1554,6 +1554,9 @@ Ensure the default browser behavior of the `hidden` attribute.
 .\!mt-4 {
     margin-top: 1rem !important;
 }
+.ml-2 {
+    margin-left: 0.5rem;
+}
 .-mt-2 {
     margin-top: -0.5rem;
 }
@@ -1566,9 +1569,6 @@ Ensure the default browser behavior of the `hidden` attribute.
 .-mt-10 {
     margin-top: -2.5rem;
 }
-.ml-2 {
-    margin-left: 0.5rem;
-}
 .mr-4 {
     margin-right: 1rem;
 }
@@ -1590,12 +1590,6 @@ Ensure the default browser behavior of the `hidden` attribute.
 .mt-2\.5 {
     margin-top: 0.625rem;
 }
-.mr-2\.5 {
-    margin-right: 0.625rem;
-}
-.mr-2 {
-    margin-right: 0.5rem;
-}
 .mr-0\.5 {
     margin-right: 0.125rem;
 }
@@ -2030,17 +2024,6 @@ Ensure the default browser behavior of the `hidden` attribute.
     --tw-bg-opacity: 1;
     background-color: rgba(248, 113, 113, var(--tw-bg-opacity));
 }
-.bg-current {
-    background-color: currentColor;
-}
-.bg-blue-congress {
-    --tw-bg-opacity: 1;
-    background-color: rgba(0, 82, 147, var(--tw-bg-opacity));
-}
-.bg-gray-800 {
-    --tw-bg-opacity: 1;
-    background-color: rgba(31, 41, 55, var(--tw-bg-opacity));
-}
 .bg-labelMedia {
     background-color: #006dc1;
     background-color: var(--color-label-media);
@@ -2077,6 +2060,17 @@ Ensure the default browser behavior of the `hidden` attribute.
     background-color: #d34600;
     background-color: var(--color-label-live);
 }
+.bg-current {
+    background-color: currentColor;
+}
+.bg-blue-congress {
+    --tw-bg-opacity: 1;
+    background-color: rgba(0, 82, 147, var(--tw-bg-opacity));
+}
+.bg-gray-800 {
+    --tw-bg-opacity: 1;
+    background-color: rgba(31, 41, 55, var(--tw-bg-opacity));
+}
 .bg-gradient-to-r {
     background-image: -webkit-gradient(linear, left top, right top, from(var(--tw-gradient-stops)));
     background-image: linear-gradient(to right, var(--tw-gradient-stops));
@@ -2118,6 +2112,14 @@ Ensure the default browser behavior of the `hidden` attribute.
     padding-top: 2rem;
     padding-bottom: 2rem;
 }
+.px-1\.5 {
+    padding-left: 0.375rem;
+    padding-right: 0.375rem;
+}
+.px-1 {
+    padding-left: 0.25rem;
+    padding-right: 0.25rem;
+}
 .px-5 {
     padding-left: 1.25rem;
     padding-right: 1.25rem;
@@ -2130,14 +2132,6 @@ Ensure the default browser behavior of the `hidden` attribute.
     padding-top: 0.75rem;
     padding-bottom: 0.75rem;
 }
-.px-1\.5 {
-    padding-left: 0.375rem;
-    padding-right: 0.375rem;
-}
-.px-1 {
-    padding-left: 0.25rem;
-    padding-right: 0.25rem;
-}
 .px-3\.5 {
     padding-left: 0.875rem;
     padding-right: 0.875rem;
@@ -2170,15 +2164,15 @@ Ensure the default browser behavior of the `hidden` attribute.
     padding-left: 1rem;
     padding-right: 1rem;
 }
+.pt-px {
+    padding-top: 1px;
+}
 .pl-4 {
     padding-left: 1rem;
 }
 .pr-2 {
     padding-right: 0.5rem;
 }
-.pt-px {
-    padding-top: 1px;
-}
 .pt-1 {
     padding-top: 0.25rem;
 }
@@ -2315,14 +2309,14 @@ Ensure the default browser behavior of the `hidden` attribute.
     --tw-text-opacity: 1;
     color: rgba(255, 255, 255, var(--tw-text-opacity));
 }
-.text-blue-congress {
-    --tw-text-opacity: 1;
-    color: rgba(0, 82, 147, var(--tw-text-opacity));
-}
 .text-grey-scorpion {
     --tw-text-opacity: 1;
     color: rgba(96, 96, 96, var(--tw-text-opacity));
 }
+.text-blue-congress {
+    --tw-text-opacity: 1;
+    color: rgba(0, 82, 147, var(--tw-text-opacity));
+}
 .text-toplineColor {
     color: #006dc1;
     color: var(--color-topline);
@@ -2542,18 +2536,21 @@ Ensure the default browser behavior of the `hidden` attribute.
 .first-of-type\:border-none:first-of-type {
     border-style: none;
 }
+.last-of-type\:hidden:last-of-type {
+    display: none;
+}
 .hover\:bg-blue-congress:hover {
     --tw-bg-opacity: 1;
     background-color: rgba(0, 82, 147, var(--tw-bg-opacity));
 }
-.hover\:text-white:hover {
-    --tw-text-opacity: 1;
-    color: rgba(255, 255, 255, var(--tw-text-opacity));
-}
 .hover\:text-toplineColor:hover {
     color: #006dc1;
     color: var(--color-topline);
 }
+.hover\:text-white:hover {
+    --tw-text-opacity: 1;
+    color: rgba(255, 255, 255, var(--tw-text-opacity));
+}
 .hover\:underline:hover {
     -webkit-text-decoration-line: underline;
             text-decoration-line: underline;

package/dist/views/components/base/image/responsive_image.hbs

@@ -10,12 +10,12 @@
 '_disableNoScript' don't add no script fallback
 
 --}}
-{{#withParam this.responsiveImage _type _variant }}
+{{#withParam this.responsiveImage type variant }}
     {{#if this.asPicture}}
-        <picture class="picture {{~#if ../_addClass}} {{../_addClass}}{{/if}}">
+        <picture class="picture {{~#if ../addClass}} {{../addClass}}{{/if}}">
             {{#unless _disableNoScript}}
                 <noscript>
-                    <img class="image {{~#if ../_addClassImg}} {{../_addClassImg}}{{/if}}" src="{{this.fallback}}" alt="{{#if ../_alttext}}{{../_alttext}}{{else}}{{../this.alttext}}{{/if}}">
+                    <img class="image {{~#if ../addClassImg}} {{../addClassImg}}{{/if}}" src="{{this.fallback}}" alt="{{#if ../alttext}}{{../alttext}}{{else}}{{../this.alttext}}{{/if}}">
                 </noscript>
             {{/unless}}
             {{#with this.sources}}
@@ -25,24 +25,24 @@
                            {{#with this.srcset}} srcset="{{this}}"{{/with}}>
                 {{/each}}
             {{/with}}
-                <img class="image {{~#if ../_addClassImg}} {{../_addClassImg}}{{/if}}" loading="{{#if ../_noDelay}}auto{{else}}lazy{{/if}}" src="data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==" alt="{{#if ../_alttext}}{{../_alttext}}{{else}}{{../this.alttext}}{{/if}}" {{~#if ../_errorHandler }} onerror="this.onerror=null; {{../_errorHandler}}"{{/if}}>
+                <img class="image {{~#if ../addClassImg}} {{../addClassImg}}{{/if}}" loading="{{#if ../noDelay}}auto{{else}}lazy{{/if}}" src="data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==" alt="{{#if ../alttext}}{{../alttext}}{{else}}{{../this.alttext}}{{/if}}" {{~#if ../errorHandler }} onerror="this.onerror=null; {{../errorHandler}}"{{/if}}>
         </picture>
     {{/if}}
 
     {{#if this.asImage}}
         {{#with this.sources.[0]}}
-            {{~#with ../../_addClass }}<div class="{{this}}">{{/with}}
-            {{#unless ../../_disableNoScript}}
+            {{~#with ../../addClass }}<div class="{{this}}">{{/with}}
+            {{#unless ../../disableNoScript}}
                 <noscript>
-                    <img class="image {{~#if ../../_addClassImg}} {{../../_addClassImg}}{{/if}}" src="{{../this.fallback}}" alt="{{#if ../../_alttext}}{{../../_alttext}}{{else}}{{../../this.alttext}}{{/if}}">
+                    <img class="image {{~#if ../../addClassImg}} {{../../addClassImg}}{{/if}}" src="{{../this.fallback}}" alt="{{#if ../../alttext}}{{../../alttext}}{{else}}{{../../this.alttext}}{{/if}}">
                 </noscript>
             {{/unless}}
             <img {{#with this.sizes}}sizes="{{this}}" {{/with~}}
-                    loading="{{#if ../../_noDelay}}auto{{else}}lazy{{/if}}"
-                 {{#with this.srcset}} {{#if ../../../_noDelay}}srcset{{else}}data-srcset{{/if}}="{{this}}"{{/with}}
+                    loading="{{#if ../../noDelay}}auto{{else}}lazy{{/if}}"
+                 {{#with this.srcset}} {{#if ../../../noDelay}}srcset{{else}}data-srcset{{/if}}="{{this}}"{{/with}}
                 src="data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw=="
-                alt="{{#if ../../_alttext}}{{../../_alttext}}{{else}}{{../../this.alttext}}{{/if}}" class="image imageSimple {{~#with ../../_addClassImg }} {{this}}{{/with}}" {{~#if ../../_errorHandler}} onerror="this.onerror=null; {{../../_errorHandler}}" {{~/if}}>
-            {{~#with ../../_addClass }}</div>{{/with}}
+                alt="{{#if ../../alttext}}{{../../alttext}}{{else}}{{../../this.alttext}}{{/if}}" class="image imageSimple {{~#with ../../addClassImg }} {{this}}{{/with}}" {{~#if ../../errorHandler}} onerror="this.onerror=null; {{../../errorHandler}}" {{~/if}}>
+            {{~#with ../../addClass }}</div>{{/with}}
         {{/with}}
 
     {{/if}}

package/dist/views/components/base/link.hbs

@@ -1,19 +1,19 @@
 {{#with this.link}}
     <a {{#with this.webviewUrl}}data-webviewurl="{{this}}"{{/with}} href="{{this.url}}" {{#with this.webviewUrl}}{{/with}} 
-        class="sb-link {{#if ../_cssClasses}} {{../_cssClasses}}{{/if}}{{#if _doTracking}} js-load{{else}}{{#if ../this.content.isFileDownload}} js-loadScript{{/if}}{{/if}}{{#if _isSelected}} {{defaultIfEmpty _selectedCssClass "-current"}}{{/if}}"
-        {{#if ../_doNavigationTracking}}
-        data-new-hr-click-tracking='{"settings": [{"type":"uxAction","secondLevelId": "1","clickLabel":"{{../_clickLabelType}}{{#if ../_clickLabelPrefix1}}::{{../_clickLabelPrefix1}}{{/if}}::{{../_clickLabelPrefix2}}-Link geklickt"}]}'
+        class="sb-link{{#if ../css}} {{../css}}{{/if}}{{#if ../doTracking}} js-load{{else}}{{#if ../this.content.isFileDownload}} js-loadScript{{/if}}{{/if}}{{#if ../isSelected}} {{defaultIfEmpty ../selectedCssClass "-current"}}{{/if}}"
+        {{#if ../doNavigationTracking}}
+        data-new-hr-click-tracking='{"settings": [{"type":"uxAction","secondLevelId": "1","clickLabel":"{{../clickLabelType}}{{#if ../clickLabelPrefix1}}::{{../clickLabelPrefix1}}{{/if}}::{{../clickLabelPrefix2}}-Link geklickt"}]}'
         {{/if}}
-        {{#if ../_doTracking}}
-            {{#with this.content.trackingData}}data-new-hr-click-tracking='{"settings": [{"type":"uxAction","secondLevelId": "{{this.secondLevelId}}","clickLabel": "{{#if ../this.content.isFileDownload}}{{this.pageName}}{{else}}mediabuttonclick::{{_clickLabelPrefix1}}::{{_clickLabelPrefix2}}{{/if}}"}]}'{{/with}}
+        {{#if ../doTracking}}
+            {{#with this.content.trackingData}}data-new-hr-click-tracking='{"settings": [{"type":"uxAction","secondLevelId": "{{this.secondLevelId}}","clickLabel": "{{#if ../this.content.isFileDownload}}{{this.pageName}}{{else}}mediabuttonclick::{{../../clickLabelPrefix1}}::{{../../clickLabelPrefix2}}{{/if}}"}]}'{{/with}}
         {{else}}
             {{#if ../this.content.isFileDownload}}
                 {{#with this.content.trackingData}}data-new-hr-click-tracking='{"settings": [{"type":"download","secondLevelId": "{{this.secondLevelId}}","clickLabel": "{{this.pageName}}"}]}'{{/with}}
             {{/if}}
         {{/if}}
         {{#if this.isTargetBlank}} target="_blank"  rel="noopener{{#if this.hasNoReferrerFlag}} noreferrer{{/if}}"{{/if}}
-        {{#if _isAriaHidden}} aria-hidden="true" tabindex="-1"{{/if}}
+        {{#if ../isAriaHidden}} aria-hidden="true" tabindex="-1"{{/if}}
     >
+{{/with}}  
         {{> @partial-block }}     
-    </a>
-{{/with}}  
+    </a>

package/dist/views/components/base/load_dynamic.hbs

@@ -1,6 +1,6 @@
 {{#switch templatePath}}
-    {{#case "components/header/service_navigation/service_navigation_item"}}
-        {{> components/header/service_navigation/service_navigation_item}}
+    {{#case "components/site_header/service_navigation/service_navigation_item"}}
+        {{> components/site_header/service_navigation/service_navigation_item}}
     {{/case}}
     {{#case "components/teaser/group_teaser/group_teaser"}}
         {{> components/teaser/group_teaser/group_teaser}}
@@ -8,4 +8,7 @@
     {{#case "components/teaser/teaser_standard"}}
         {{> components/teaser/teaser_standard}}
     {{/case}}
+    {{#case "components/teaser/components/teaser_comments"}}
+        {{> components/teaser/components/teaser_comments}}
+    {{/case}}
 {{/switch}}

package/dist/views/components/page/page.hbs

@@ -20,7 +20,7 @@
     <body itemscope itemtype="http://schema.org/WebPage">
         <div class="js-pageSwap">
                       
-            {{> components/header/header }}          
+            {{> components/site_header/header }}          
             
             <main 
                 onclick="void(0)" 
@@ -33,27 +33,27 @@
                         {{> components/teaser/teaser_standard }}
                     </div>
                     <div class="grid grid-cols-12 py-6 col-full gap-x-6 gap-y-6 sm:px-8 sm:col-main">
-                        {{> components/teaser/teaser_standard teasersize="lg"}}
-                        {{> components/teaser/teaser_standard teasersize="lg"}}
+                        {{> components/teaser/teaser_standard teaserSize="50"}}
+                        {{> components/teaser/teaser_standard teaserSize="50"}}
                     </div>
                     <div class="grid grid-cols-12 py-6 col-full gap-x-6 gap-y-6 sm:px-8 sm:col-main">
-                        {{> components/teaser/teaser_standard teasersize="md"}}
-                        {{> components/teaser/teaser_standard teasersize="md"}}
-                        {{> components/teaser/teaser_standard teasersize="md"}}
+                        {{> components/teaser/teaser_standard teaserSize="33"}}
+                        {{> components/teaser/teaser_standard teaserSize="33"}}
+                        {{> components/teaser/teaser_standard teaserSize="33"}}
                     </div>
                     <div class="grid grid-cols-12 py-6 col-full gap-x-6 gap-y-6 sm:px-8 sm:col-main">
-                        {{> components/teaser/teaser_standard teasersize="lg"}}
-                        {{> components/teaser/teaser_standard teasersize="lg"}}
+                        {{> components/teaser/teaser_standard teaserSize="50"}}
+                        {{> components/teaser/teaser_standard teaserSize="50"}}
                     </div>               
                     <div class="grid grid-cols-12 py-6 col-full gap-x-6 gap-y-6 sm:px-8 sm:col-main">
-                        {{> components/teaser/teaser_standard teasersize="sm"}}
-                        {{> components/teaser/teaser_standard teasersize="sm"}}
-                        {{> components/teaser/teaser_standard teasersize="sm"}}
-                        {{> components/teaser/teaser_standard teasersize="sm"}}
+                        {{> components/teaser/teaser_standard teaserSize="25"}}
+                        {{> components/teaser/teaser_standard teaserSize="25"}}
+                        {{> components/teaser/teaser_standard teaserSize="25"}}
+                        {{> components/teaser/teaser_standard teaserSize="25"}}
                     </div>
                     <div class="grid grid-cols-12 py-6 col-full gap-x-6 gap-y-6 sm:px-8 sm:col-main">
-                        {{> components/teaser/teaser_standard teasersize="lg"}}
-                        {{> components/teaser/teaser_standard teasersize="lg"}}
+                        {{> components/teaser/teaser_standard teaserSize="50"}}
+                        {{> components/teaser/teaser_standard teaserSize="50"}}
                     </div>
                     
                 </div>

package/{src/stories/views/components/header → dist/views/components/site_header}/brand_navigation/brand_navigation.hbs

@@ -21,7 +21,7 @@
             {{#with this.brandNavigationItems}}
                 <ul class="flex pl-0.5 pr-3 md:px-0 flex-nowrap lg:mr-0">
                     {{#each this}}
-                        {{> components/header/brand_navigation/brand_navigation_item }}
+                        {{> components/site_header/brand_navigation/brand_navigation_item }}
                     {{/each}} 
                 </ul>
             {{/with}}

package/dist/views/components/{header → site_header}/header.hbs

@@ -9,12 +9,12 @@
             
             <div id="anchorNavWrapper" 
                 class="hidden">
-                {{> components/header/anchor_navigation/anchor_navigation }}
+                {{> components/site_header/anchor_navigation/anchor_navigation }}
             </div>
 
             <div id="brandNavWrapper" 
                 class="relative flex items-center justify-center order-1 w-full bg-white z-101 print:hidden">
-                {{> components/header/brand_navigation/brand_navigation }} 
+                {{> components/site_header/brand_navigation/brand_navigation }} 
             </div>
 
             <div id="serviceNavWrapper" 
@@ -28,22 +28,22 @@
 
                     <div id="serviceLogoWrapper" 
                         class="flex items-center order-1 w-full pl-4 pr-2 tablet:pl-5 lg:items-end lg:pb-3 bg-blue-congress md:px-0 md:h-12 lg:h-16 md:w-1/2 md:max-w-1/2 lg:w-1/4 lg:max-w-1/4">
-                        {{> components/header/service_logo }}
+                        {{> components/site_header/service_logo }}
                     </div>
                     
                     <div id="serviceItemsWrapper"                
                         class="flex items-center justify-end flex-initial order-2 inline-block w-full max-w-full align-top bg-blue-congress md:h-12 lg:h-16 lg:order-2 lg:w-3/4 lg:max-w-3/4 md:mt-0 md:w-1/2 md:max-w-1/2 md:order-2 md:border-0 print:hidden ">
-                        {{> components/header/service_navigation/service_list }}
+                        {{> components/site_header/service_navigation/service_list }}
 
-                        {{> components/header/search/quick_search_button }}
+                        {{> components/site_header/navigation_search/quick_search_button }}
 
                         <div class="hidden lg:flex">
-                            {{> components/header/search/quick_search_form }}
+                            {{> components/site_header/navigation_search/quick_search_form }}
                         </div>
                     
                         <div id="burgerWrapper" 
                             class="flex justify-end flex-none order-2 lg:order-4 md:order-4 lg:hidden "> 
-                            {{> components/header/burger }}    
+                            {{> components/site_header/burger }}    
                         </div>
                         
                     </div>
@@ -56,7 +56,7 @@
                 :class="shouldSectionNavBeHidden() ? '-mt-40 md:-mt-40 lg:-mt-40' : ''"  
                 class="flex justify-center order-3 w-full overflow-hidden duration-500 transition-max-height lg:transition-margin-top lg:duration-500 tablet:absolute tablet:top-22 tablet:w-half-screen tablet:ml-half-screen max-h-0 lg:overflow-visible md:mt-0 lg:flex lg:max-h-full lg:h-auto bg-blue-congress z-100 print:hidden"
             >
-                {{> components/header/section_navigation/section_navigation }}
+                {{> components/site_header/section_navigation/section_navigation }}
             </div>
             
             <div x-cloak :class="shouldServiceNavBeHidden() ? 'hidden -mt-40' : ''"
@@ -72,7 +72,7 @@
                 x-transition:leave-start="opacity-100 transform scale-y-100" 
                 x-transition:leave-end="opacity-0 transform scale-y-90">
 
-                {{> components/header/search/quick_search_form }}
+                {{> components/site_header/navigation_search/quick_search_form }}
 
             </div>
             

package/{src/stories/views/components/header → dist/views/components/site_header}/navigation_flyout/navigation_flyout.hbs

@@ -1,5 +1,4 @@
 {{#with this.subNavigation}}
-
     <div {{#unless ../this.selected}}x-cloak{{/unless}}
         x-data="flyoutHandler" 
         x-ref="{{getRandom}}"
@@ -44,11 +43,11 @@
         <div class="{{#if this.showAsFlyout}}lg:flex lg:flex-row -columnCount--{{this.columnCount}} lg:divide-x lg:divide-gray-200 {{else}} {{#if ../this.selected}} w-full lg:px-10 lg:container {{/if}}{{/if}}">
             {{#if this.showAsFlyout}}
                 {{#each this.columns}}
-                    {{> components/header/navigation_flyout/navigation_flyout_column count=../this.columnCount navtype=../../_navigationType _parent=../../_parent _flyout=true~}}
+                    {{> components/site_header/navigation_flyout/navigation_flyout_column count=../this.columnCount navtype=../../_navigationType _parent=../../_parent _flyout=true~}}
                 {{/each}}
             {{else}}
                 {{#with this.items}}
-                    {{> components/header/navigation_flyout/navigation_flyout_column selected=../../this.selected navtype=../../_navigationType _parent=../../_parent _flyout=false ~}}
+                    {{> components/site_header/navigation_flyout/navigation_flyout_column selected=../../this.selected navtype=../../_navigationType _parent=../../_parent _flyout=false ~}}
                 {{/with}}
             {{/if}}
         </div>

package/dist/views/components/{header → site_header}/navigation_flyout/navigation_flyout_column.hbs

@@ -1,8 +1,7 @@
 <ul class="{{inline-switch count '["1","2"]' '["md:w-1/1", "md:w-1/1 lg:w-1/2"]'}} {{inline-switch navtype '["ServiceNavigation","RubrikNavigation"]' '["border-b border-gray-200 md:border-0","border-0"]'}} lg:even:pl-4 lg:odd:pr-4 {{#if selected}} lg:container lg:flex lg:h-9 {{/if}} ">
-          
     {{~#each this ~}} 
         {{~#if this.title~}}
-            {{> components/header/navigation_flyout/navigation_flyout_item _parentselected=../selected _fromNav=../navtype _flyout=../_flyout _parent=../_parent ~}}
+            {{> components/site_header/navigation_flyout/navigation_flyout_item _parentselected=../selected _fromNav=../navtype _flyout=../_flyout _parent=../_parent ~}}
         {{~/if~}}       
     {{~/each~}}
     

package/dist/views/components/site_header/navigation_flyout/navigation_flyout_item.hbs

@@ -0,0 +1,7 @@
+<li :class="dropped ? 'h-auto' : 'h-10'"  
+    class="sb-navigation-flyout-item pl-4 {{#if _flyout}}lg:px-0 {{else}}lg:px-2 lg:first-of-type:pl-0 {{/if}}{{#if _parentselected}}lg:whitespace-nowrap{{/if}} flex h-auto text-base leading-6 border-b border-gray-200 lg:last:border-0 lg:border-0 text-blue-congress justify-start hover:underline">
+    {{#>components/base/link css=(inline-switch _fromNav '["RubrikNavigation","ServiceNavigation"]' '["link-focus-inset py-2 w-full","link-focus py-2 md:pl-0 lg:pl-0 lg:pr-0 break-words w-full"]') doNavigationTracking="true" clickLabelType=_fromNav clickLabelPrefix1=_parent clickLabelPrefix2=this.link.content.text }}
+        {{this.text}}      
+        {{~#if this.link.hasIcon}}{{> components/base/image/icon _icon=this.link.iconName _addClass="w-4 h-4 fill-current ml-2 inline-flex" _iconmap="icons" }} {{/if}}
+    {{/components/base/link}}  
+</li>

package/dist/views/components/{header → site_header}/section_navigation/section_navigation.hbs

@@ -10,7 +10,7 @@
                 <ul class="flex flex-col items-center w-full text-left text-white list-none lg:flex-row lg:h-auto lg:mt-1">
                     {{#each this}}   
                         {{#if (isStorybook)}}  
-                            {{> components/header/section_navigation/section_navigation_item }}   
+                            {{> components/site_header/section_navigation/section_navigation_item }}   
                         {{else}}
                             {{{this}}}
                         {{/if}}

package/{src/stories/views/components/header → dist/views/components/site_header}/section_navigation/section_navigation_item.hbs

@@ -94,7 +94,7 @@
 
         {{/if}}
         
-        {{> components/header/navigation_flyout/navigation_flyout _isSectionNav=true _navigationType="RubrikNavigation" _parent=this.text }}
+        {{> components/site_header/navigation_flyout/navigation_flyout _isSectionNav=true _navigationType="RubrikNavigation" _parent=this.text }}
 
     </li>
 {{/each}}

package/dist/views/components/{header → site_header}/service_navigation/service_list.hbs

@@ -8,7 +8,7 @@
     {{#with this.serviceNavigationSSILinks}}
         <ul class="flex justify-around w-full h-full -itemCount-{{ count }} lg:w-auto lg:justify-end lg:pt-1">
             {{#each this}}        
-                {{> components/base/loadSSI templatePath='components/header/service_navigation/service_navigation_item' }}               
+                {{> components/base/loadSSI templatePath='components/site_header/service_navigation/service_navigation_item' }}               
             {{/each}} 
         </ul>
     {{/with}}

package/dist/views/components/{header → site_header}/service_navigation/service_navigation_item.hbs

@@ -50,7 +50,7 @@
                 </div>
             </div>  
         {{#if this.subNavigation}}       
-            {{> components/header/navigation_flyout/navigation_flyout _isSectionNav=false  _navigationType="ServiceNavigation" _parent=this.text }}
+            {{> components/site_header/navigation_flyout/navigation_flyout _isSectionNav=false  _navigationType="ServiceNavigation" _parent=this.text }}
             </button>
         {{else}}       
             </a>