hr-design-system-handlebars 1.50.39 → 1.50.40

package/CHANGELOG.md

@@ -1,3 +1,15 @@
+# v1.50.40 (Thu Dec 07 2023)
+
+#### 🐛 Bug Fix
+
+- Dpe 2174 part2 add alpine plugin [#784](https://github.com/mumprod/hr-design-system-handlebars/pull/784) ([@StefanVesper](https://github.com/StefanVesper))
+
+#### Authors: 1
+
+- SonicSoulSurfer ([@StefanVesper](https://github.com/StefanVesper))
+
+---
+
 # v1.50.39 (Thu Dec 07 2023)
 
 #### 🐛 Bug Fix

package/dist/assets/index.css

@@ -1139,6 +1139,9 @@ article.indexText ul {
 .z-120 {
   z-index: 120;
 }
+.z-130 {
+  z-index: 130;
+}
 .z-20 {
   z-index: 20;
 }
@@ -3170,6 +3173,15 @@ article.indexText ul {
   transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
   transition-duration: 150ms;
 }
+.delay-0 {
+  transition-delay: 0s;
+}
+.delay-300 {
+  transition-delay: 300ms;
+}
+.duration-0 {
+  transition-duration: 0ms;
+}
 .duration-100 {
   transition-duration: 100ms;
 }
@@ -3205,7 +3217,7 @@ article.indexText ul {
   border-bottom-color: var(--color-secondary-ds);
 }
 .counter-reset {
-  counter-reset: cnt1701957159274;
+  counter-reset: cnt1701959613343;
 }
 .hyphens-auto {
   -webkit-hyphens: auto;
@@ -3466,7 +3478,7 @@ article.indexText ul {
   --tw-ring-color: rgba(255, 255, 255, 0.5);
 }
 .-ordered {
-  counter-increment: cnt1701957159274 1;
+  counter-increment: cnt1701959613343 1;
 }
 .-ordered::before {
   position: absolute;
@@ -3482,7 +3494,7 @@ article.indexText ul {
   letter-spacing: .0125em;
   --tw-text-opacity: 1;
   color: rgba(0, 0, 0, var(--tw-text-opacity));
-  content: counter(cnt1701957159274);
+  content: counter(cnt1701959613343);
 }
 /*! ****************************/
 /*! DataPolicy stuff           */

package/dist/assets/js/alpine.js

@@ -1,8 +1,11 @@
 import AsyncAlpine from 'async-alpine'
+
 import collapse from '@alpinejs/collapse'
 import Toolkit from '@alpine-collective/toolkit'
 import Alpine from 'alpinejs'
+import anchor from '@alpinejs/anchor'
 import intersect from '@alpinejs/intersect'
+
 import mainNavigationHandler from 'components/site_header/mainNavigationHandler.alpine'
 import flyoutHandler from 'components/site_header/flyoutHandler.alpine'
 import overlayHandler from 'components/site_header/overlayHandler.alpine'
@@ -46,6 +49,6 @@ Alpine.data('dropdown', dropdown)
 Alpine.plugin(Toolkit)
 Alpine.plugin(collapse)
 Alpine.plugin(intersect)
-
+Alpine.plugin(anchor)
 
 Alpine.start()

package/dist/views/components/site_header/header.hbs

@@ -13,7 +13,7 @@
             </div>
 
             <div id="brandNavWrapper" 
-                class="box-content relative flex items-center justify-center order-1 w-full bg-white border-b border-brandnavigation-border-color z-110">
+                class="box-content relative flex items-center justify-center order-1 w-full bg-white border-b border-brandnavigation-border-color z-130">
                 {{> components/site_header/brand_navigation/brand_navigation }} 
             </div>
 

package/dist/views/components/site_header/service_navigation/service_list.hbs

@@ -2,8 +2,8 @@
     id="serviceList"
     @click.outside="$store.serviceNavIsOpen = false; toggleScrolling(!$store.searchFieldOpen && !$store.burgeropen)"
     x-ref="serviceList"
-    :class="shouldServiceIconsBeHidden() ? '-mt-40' : ''"
-    class="absolute left-0 flex justify-center flex-initial w-full h-10 max-w-full align-top duration-500 ease-in-out border-b border-navigation-border-color sb-service-list transition-[margin-top] -z-40 md:z-100 md:h-12 top-[41px] bg-navigation-bg md:border-0 md:top-auto md:w-auto md:left-auto md:static md:justify-end md:flex md:flex-auto lg:h-16 lg:pl-0 lg:pr-4 lg:w-3/4 "
+    :class="shouldServiceIconsBeHidden() ? 'delay-300 -mt-40' : 'delay-0 duration-0 mt-0'"
+    class="absolute transition-[margin-top] ease-in duration-500 left-0 flex justify-center flex-initial w-full h-10 max-w-full align-top ease-in border-b border-navigation-border-color sb-service-list -z-40 md:z-100 md:h-12 top-[41px] bg-navigation-bg md:border-0 md:top-auto md:w-auto md:left-auto md:static md:justify-end md:flex md:flex-auto lg:h-16 lg:pl-0 lg:pr-4 lg:w-3/4 "
 >
     {{#with this.serviceNavigationSSILinks}}
         <ul class="flex justify-around w-full h-full -itemCount-{{ count }} lg:w-auto lg:justify-end lg:pt-1">

package/dist/views_static/components/site_header/header.hbs

@@ -13,7 +13,7 @@
             </div>
 
             <div id="brandNavWrapper" 
-                class="box-content relative flex items-center justify-center order-1 w-full bg-white border-b border-brandnavigation-border-color z-110">
+                class="box-content relative flex items-center justify-center order-1 w-full bg-white border-b border-brandnavigation-border-color z-130">
                 {{> components/site_header/brand_navigation/brand_navigation }} 
             </div>
 

package/dist/views_static/components/site_header/service_navigation/service_list.hbs

@@ -2,8 +2,8 @@
     id="serviceList"
     @click.outside="$store.serviceNavIsOpen = false; toggleScrolling(!$store.searchFieldOpen && !$store.burgeropen)"
     x-ref="serviceList"
-    :class="shouldServiceIconsBeHidden() ? '-mt-40' : ''"
-    class="absolute left-0 flex justify-center flex-initial w-full h-10 max-w-full align-top duration-500 ease-in-out border-b border-navigation-border-color sb-service-list transition-[margin-top] -z-40 md:z-100 md:h-12 top-[41px] bg-navigation-bg md:border-0 md:top-auto md:w-auto md:left-auto md:static md:justify-end md:flex md:flex-auto lg:h-16 lg:pl-0 lg:pr-4 lg:w-3/4 "
+    :class="shouldServiceIconsBeHidden() ? 'delay-300 -mt-40' : 'delay-0 duration-0 mt-0'"
+    class="absolute transition-[margin-top] ease-in duration-500 left-0 flex justify-center flex-initial w-full h-10 max-w-full align-top ease-in border-b border-navigation-border-color sb-service-list -z-40 md:z-100 md:h-12 top-[41px] bg-navigation-bg md:border-0 md:top-auto md:w-auto md:left-auto md:static md:justify-end md:flex md:flex-auto lg:h-16 lg:pl-0 lg:pr-4 lg:w-3/4 "
 >
     {{#with this.serviceNavigationSSILinks}}
         <ul class="flex justify-around w-full h-full -itemCount-{{ count }} lg:w-auto lg:justify-end lg:pt-1">

package/package.json

@@ -6,7 +6,7 @@
     "license": "MIT",
     "main": "dist/index.js",
     "repository": "https://github.com/szuelch/hr-design-system-handlebars",
-    "version": "1.50.39",
+    "version": "1.50.40",
     "scripts": {
         "test": "echo \"Error: no test specified\" && exit 1",
         "storybook": "storybook dev -p 6006 public",
@@ -105,6 +105,7 @@
     },
     "dependencies": {
         "@alpine-collective/toolkit": "^1.0.0",
+        "@alpinejs/anchor": "^3.13.3",
         "@alpinejs/collapse": "^3.8.1",
         "@alpinejs/intersect": "^3.13.3",
         "@tailwindcss/line-clamp": "^0.4.2",

package/src/assets/js/alpine.js

@@ -1,8 +1,11 @@
 import AsyncAlpine from 'async-alpine'
+
 import collapse from '@alpinejs/collapse'
 import Toolkit from '@alpine-collective/toolkit'
 import Alpine from 'alpinejs'
+import anchor from '@alpinejs/anchor'
 import intersect from '@alpinejs/intersect'
+
 import mainNavigationHandler from 'components/site_header/mainNavigationHandler.alpine'
 import flyoutHandler from 'components/site_header/flyoutHandler.alpine'
 import overlayHandler from 'components/site_header/overlayHandler.alpine'
@@ -46,6 +49,6 @@ Alpine.data('dropdown', dropdown)
 Alpine.plugin(Toolkit)
 Alpine.plugin(collapse)
 Alpine.plugin(intersect)
-
+Alpine.plugin(anchor)
 
 Alpine.start()

package/src/stories/views/components/site_header/header.hbs

@@ -13,7 +13,7 @@
             </div>
 
             <div id="brandNavWrapper" 
-                class="box-content relative flex items-center justify-center order-1 w-full bg-white border-b border-brandnavigation-border-color z-110">
+                class="box-content relative flex items-center justify-center order-1 w-full bg-white border-b border-brandnavigation-border-color z-130">
                 {{> components/site_header/brand_navigation/brand_navigation }} 
             </div>
 

package/src/stories/views/components/site_header/service_navigation/service_list.hbs

@@ -2,8 +2,8 @@
     id="serviceList"
     @click.outside="$store.serviceNavIsOpen = false; toggleScrolling(!$store.searchFieldOpen && !$store.burgeropen)"
     x-ref="serviceList"
-    :class="shouldServiceIconsBeHidden() ? '-mt-40' : ''"
-    class="absolute left-0 flex justify-center flex-initial w-full h-10 max-w-full align-top duration-500 ease-in-out border-b border-navigation-border-color sb-service-list transition-[margin-top] -z-40 md:z-100 md:h-12 top-[41px] bg-navigation-bg md:border-0 md:top-auto md:w-auto md:left-auto md:static md:justify-end md:flex md:flex-auto lg:h-16 lg:pl-0 lg:pr-4 lg:w-3/4 "
+    :class="shouldServiceIconsBeHidden() ? 'delay-300 -mt-40' : 'delay-0 duration-0 mt-0'"
+    class="absolute transition-[margin-top] ease-in duration-500 left-0 flex justify-center flex-initial w-full h-10 max-w-full align-top ease-in border-b border-navigation-border-color sb-service-list -z-40 md:z-100 md:h-12 top-[41px] bg-navigation-bg md:border-0 md:top-auto md:w-auto md:left-auto md:static md:justify-end md:flex md:flex-auto lg:h-16 lg:pl-0 lg:pr-4 lg:w-3/4 "
 >
     {{#with this.serviceNavigationSSILinks}}
         <ul class="flex justify-around w-full h-full -itemCount-{{ count }} lg:w-auto lg:justify-end lg:pt-1">

package/tailwind.config.js

@@ -116,6 +116,7 @@ module.exports = {
                 '100': '100',
                 '110': '110',
                 '120': '120',
+                '130': '130',
                 '300': '300'
             },
             spacing: {