nsw-design-system 3.26.1 → 3.26.2

package/dist/js/components/main-nav/main-nav.d.ts

@@ -35,6 +35,7 @@ declare class Navigation {
     mobileToggleMainNav(e: any): void;
     buttonClickDesktop(event: any): void;
     buttonKeydownDesktop(event: any): void;
+    ensureSingleDesktopSubNav(currentTarget: any): void;
     escapeClose(e: any): void;
     saveElements(e: any): void;
     showSubNav({ propertyName }: {

package/dist/js/main.js

@@ -1,4 +1,4 @@
-/*! NSW Design System v3.26.1 | MIT License */
+/*! NSW Design System v3.26.2 | MIT License */
 (function (global, factory) {
     typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports) :
     typeof define === 'function' && define.amd ? define('NSW', ['exports'], factory) :
@@ -3500,6 +3500,7 @@
       buttonClickDesktop(event) {
         const isDesktop = this.breakpoint.matches;
         if (!isDesktop || !event.target.closest('.nsw-main-nav__sub-nav')) {
+          this.ensureSingleDesktopSubNav(event.currentTarget);
           this.saveElements(event);
           this.toggleSubNavDesktop();
           event.preventDefault();
@@ -3507,11 +3508,28 @@
       }
       buttonKeydownDesktop(event) {
         if (event.key === ' ' || event.key === 'Enter' || event.key === 'Spacebar') {
+          this.ensureSingleDesktopSubNav(event.currentTarget);
           this.saveElements(event);
           this.toggleSubNavDesktop();
           event.preventDefault();
         }
       }
+      ensureSingleDesktopSubNav(currentTarget) {
+        if (!this.breakpoint.matches) return;
+        while (this.openSubNavElements.length > 0) {
+          const {
+            link
+          } = this.whichSubNavLatest();
+          const isExpanded = link.getAttribute('aria-expanded') === 'true';
+          if (!isExpanded) {
+            this.openSubNavElements.pop();
+          } else if (link === currentTarget) {
+            return;
+          } else {
+            this.closeSubNav();
+          }
+        }
+      }
       escapeClose(e) {
         if (e.key === 'Escape') {
           // removes handleOutsideClick functionality from docs site
@@ -3536,6 +3554,11 @@
           link: currentTarget,
           linkParent: currentTarget.parentNode
         };
+        if (this.breakpoint.matches) {
+          this.openSubNavElements = this.openSubNavElements.filter(({
+            link
+          }) => link !== currentTarget);
+        }
         this.openSubNavElements.push(temp);
       }
       showSubNav({
@@ -7571,4 +7594,4 @@
 
 }));
 
-;(function(g){try{g.NSW=g.NSW||{};g.NSW.VERSION="3.26.1";}catch(e){} }(typeof globalThis!=='undefined'?globalThis:(typeof window!=='undefined'?window:self)));
+;(function(g){try{g.NSW=g.NSW||{};g.NSW.VERSION="3.26.2";}catch(e){} }(typeof globalThis!=='undefined'?globalThis:(typeof window!=='undefined'?window:self)));

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "nsw-design-system",
-  "version": "3.26.1",
+  "version": "3.26.2",
   "description": "Design system for Digital NSW",
   "main": "dist/js/main.js",
   "types": "dist/js/main.d.ts",

package/src/components/footer/_footer.scss

@@ -164,7 +164,9 @@
     margin: nsw.rem(12px) 0;
 
     @include nsw.breakpoint('md') {
+      flex: 0 0 auto;
       text-align: right;
+      white-space: nowrap;
     }
   }
 

package/src/components/main-nav/_main-nav.scss

@@ -96,7 +96,7 @@
         .nsw-material-icons {
           transform: rotate(90deg);
           margin-left: nsw.rem(6px);
-          transition: transform nsw.$nsw-transition-duration, color nsw.$nsw-transition-duration;
+          transition: transform nsw.$nsw-transition-duration-smooth, color nsw.$nsw-transition-duration-smooth;
         }
 
         &.active {
@@ -111,6 +111,12 @@
     }
   }
 
+  @include nsw.prefers-reduced-motion() {
+    &__list > li > a .nsw-material-icons {
+      transition: none;
+    }
+  }
+
   &__sub-list {
     list-style: none;
     padding: 0;

package/src/components/main-nav/main-nav.js

@@ -160,6 +160,7 @@ class Navigation {
   buttonClickDesktop(event) {
     const isDesktop = this.breakpoint.matches
     if (!isDesktop || !event.target.closest('.nsw-main-nav__sub-nav')) {
+      this.ensureSingleDesktopSubNav(event.currentTarget)
       this.saveElements(event)
       this.toggleSubNavDesktop()
       event.preventDefault()
@@ -168,12 +169,30 @@ class Navigation {
 
   buttonKeydownDesktop(event) {
     if (event.key === ' ' || event.key === 'Enter' || event.key === 'Spacebar') {
+      this.ensureSingleDesktopSubNav(event.currentTarget)
       this.saveElements(event)
       this.toggleSubNavDesktop()
       event.preventDefault()
     }
   }
 
+  ensureSingleDesktopSubNav(currentTarget) {
+    if (!this.breakpoint.matches) return
+
+    while (this.openSubNavElements.length > 0) {
+      const { link } = this.whichSubNavLatest()
+      const isExpanded = link.getAttribute('aria-expanded') === 'true'
+
+      if (!isExpanded) {
+        this.openSubNavElements.pop()
+      } else if (link === currentTarget) {
+        return
+      } else {
+        this.closeSubNav()
+      }
+    }
+  }
+
   escapeClose(e) {
     if (e.key === 'Escape') {
     // removes handleOutsideClick functionality from docs site
@@ -197,6 +216,10 @@ class Navigation {
       linkParent: currentTarget.parentNode,
     }
 
+    if (this.breakpoint.matches) {
+      this.openSubNavElements = this.openSubNavElements.filter(({ link }) => link !== currentTarget)
+    }
+
     this.openSubNavElements.push(temp)
   }
 

package/src/core/typography/_typography.scss

@@ -236,6 +236,8 @@ h6,
   margin: nsw.rem(16px) 0 0 0;
   
   @include nsw.font-size('md');
+
+  line-height: var(--nsw-line-height);
 }