nsw-design-system 3.5.2 → 3.5.3

package/dist/js/main.js

@@ -788,38 +788,43 @@
       }
     }
     selectedItems() {
-      this.filtersItems.forEach(filter => {
-        const button = filter.querySelector('.nsw-filters__item-name');
-        const content = filter.querySelector('.nsw-filters__item-content');
-        const text = content ? content.querySelectorAll('input[type="text"]') : null;
-        const selects = content ? content.querySelectorAll('select') : null;
-        const checkboxes = content ? content.querySelectorAll('input[type="checkbox"]') : null;
-        if (!content) return;
-        this.updateCount({
-          array: text,
-          title: button
-        });
-        this.updateCount({
-          array: selects,
-          title: button
-        });
-        this.updateCount({
-          array: checkboxes,
-          title: button
-        });
-        this.updateStatus({
-          array: text,
-          title: button
-        });
-        this.updateStatus({
-          array: selects,
-          title: button
-        });
-        this.updateStatus({
-          array: checkboxes,
-          title: button
-        });
-      });
+      const stateCheck = setInterval(() => {
+        if (document.readyState === 'complete') {
+          clearInterval(stateCheck);
+          this.filtersItems.forEach(filter => {
+            const button = filter.querySelector('.nsw-filters__item-name');
+            const content = filter.querySelector('.nsw-filters__item-content');
+            const text = content ? content.querySelectorAll('input[type="text"]') : null;
+            const selects = content ? content.querySelectorAll('select') : null;
+            const checkboxes = content ? content.querySelectorAll('input[type="checkbox"]:not([id$="-all"])') : null;
+            if (!content) return;
+            this.updateCount({
+              array: text,
+              title: button
+            });
+            this.updateCount({
+              array: selects,
+              title: button
+            });
+            this.updateCount({
+              array: checkboxes,
+              title: button
+            });
+            this.updateStatus({
+              array: text,
+              title: button
+            });
+            this.updateStatus({
+              array: selects,
+              title: button
+            });
+            this.updateStatus({
+              array: checkboxes,
+              title: button
+            });
+          });
+        }
+      }, 100);
     }
     clearAllFilters(e) {
       e.preventDefault();
@@ -829,7 +834,7 @@
         const content = filter.querySelector('.nsw-filters__item-content');
         const text = content.querySelectorAll('input[type="text"]');
         const selects = content.querySelectorAll('select');
-        const checkboxes = content.querySelectorAll('input[type="checkbox"]');
+        const checkboxes = content.querySelectorAll('input[type="checkbox"]:not([id$="-all"])');
         const allFields = [...text, ...selects, ...checkboxes];
         if (!content) return;
         if (allFields.length > 0) {
@@ -838,6 +843,7 @@
             if (this.constructor.getCondition(field) && (field.type === 'text' || field.type === 'select-one')) {
               field.value = '';
             } else {
+              field.click();
               field.checked = false;
             }
           });
@@ -1205,11 +1211,13 @@
       this.customOptions.forEach(check => {
         const input = check.querySelector('.nsw-form__checkbox-input');
         if (count === this.options.length) {
+          input.click();
           input.checked = false;
           input.removeAttribute('checked');
           check.setAttribute('aria-selected', 'false');
           this.updateNativeSelect(check.getAttribute('data-index'), false);
         } else {
+          input.click();
           input.checked = true;
           input.setAttribute('checked', '');
           check.setAttribute('aria-selected', 'true');

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "nsw-design-system",
-  "version": "3.5.2",
+  "version": "3.5.3",
   "description": "Design system for Digital NSW",
   "main": "dist/main.js",
   "style": "dist/main.css",

package/src/components/filters/filters.js

@@ -231,6 +231,7 @@ class Filters {
   updateCount(options) {
     const id = uniqueId()
     const GroupArray = []
+
     if (options.array.length > 0) {
       options.array.forEach((element, index) => {
         const getEventType = this.constructor.getEventType(element.type)
@@ -307,22 +308,27 @@ class Filters {
   }
 
   selectedItems() {
-    this.filtersItems.forEach((filter) => {
-      const button = filter.querySelector('.nsw-filters__item-name')
-      const content = filter.querySelector('.nsw-filters__item-content')
-      const text = content ? content.querySelectorAll('input[type="text"]') : null
-      const selects = content ? content.querySelectorAll('select') : null
-      const checkboxes = content ? content.querySelectorAll('input[type="checkbox"]') : null
-
-      if (!content) return
-
-      this.updateCount({ array: text, title: button })
-      this.updateCount({ array: selects, title: button })
-      this.updateCount({ array: checkboxes, title: button })
-      this.updateStatus({ array: text, title: button })
-      this.updateStatus({ array: selects, title: button })
-      this.updateStatus({ array: checkboxes, title: button })
-    })
+    const stateCheck = setInterval(() => {
+      if (document.readyState === 'complete') {
+        clearInterval(stateCheck)
+        this.filtersItems.forEach((filter) => {
+          const button = filter.querySelector('.nsw-filters__item-name')
+          const content = filter.querySelector('.nsw-filters__item-content')
+          const text = content ? content.querySelectorAll('input[type="text"]') : null
+          const selects = content ? content.querySelectorAll('select') : null
+          const checkboxes = content ? content.querySelectorAll('input[type="checkbox"]:not([id$="-all"])') : null
+
+          if (!content) return
+
+          this.updateCount({ array: text, title: button })
+          this.updateCount({ array: selects, title: button })
+          this.updateCount({ array: checkboxes, title: button })
+          this.updateStatus({ array: text, title: button })
+          this.updateStatus({ array: selects, title: button })
+          this.updateStatus({ array: checkboxes, title: button })
+        })
+      }
+    }, 100)
   }
 
   clearAllFilters(e) {
@@ -333,7 +339,7 @@ class Filters {
       const content = filter.querySelector('.nsw-filters__item-content')
       const text = content.querySelectorAll('input[type="text"]')
       const selects = content.querySelectorAll('select')
-      const checkboxes = content.querySelectorAll('input[type="checkbox"]')
+      const checkboxes = content.querySelectorAll('input[type="checkbox"]:not([id$="-all"])')
       const allFields = [...text, ...selects, ...checkboxes]
 
       if (!content) return
@@ -344,6 +350,7 @@ class Filters {
           if (this.constructor.getCondition(field) && (field.type === 'text' || field.type === 'select-one')) {
             field.value = ''
           } else {
+            field.click()
             field.checked = false
           }
         })

package/src/components/select/select.js

@@ -160,12 +160,14 @@ class Select {
       const input = check.querySelector('.nsw-form__checkbox-input')
 
       if (count === this.options.length) {
+        input.click()
         input.checked = false
         input.removeAttribute('checked')
         check.setAttribute('aria-selected', 'false')
 
         this.updateNativeSelect(check.getAttribute('data-index'), false)
       } else {
+        input.click()
         input.checked = true
         input.setAttribute('checked', '')
         check.setAttribute('aria-selected', 'true')