@uqds/accordion - npm Package Compare versions

Comparing version 0.0.8-alpha.0 to 0.0.12-alpha.0

dist/js/uqds.js

 "use strict";
 
-function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
-
-function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
-
-function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
-
 var uq = function (exports) {
@@ -13,3 +7,3 @@ 'use strict';
    * @file
-   * UQ Accordion JS (instantiates an object that controls "accordion" nodes for 
+   * UQ Accordion JS (instantiates an object that controls "accordion" nodes for
    * the entire document). You need to make sure your accordion HTML is correctly
@@ -19,13 +13,11 @@ * formatted and the accompanying SCSS/CSS is loaded as well.
 
-  var accordion = /*#__PURE__*/function () {
+  class accordion {
     /**
      * @constructor
-     * @param {String} [className] - Class name of accordion wrappers (optional; 
+     * @param {String} [className] - Class name of accordion wrappers (optional;
      * default: "accordion").
      */
-    function accordion(className) {
-      _classCallCheck(this, accordion);
-
+    constructor(className) {
       if (!className) {
-        className = 'uq-accordion';
+        className = "uq-accordion";
       } else {
@@ -38,198 +30,181 @@ className = className;
     }
+    /**
+     * Method to replace jQuery's .next() method.
+     * See: https://gomakethings.com/finding-the-next-and-previous-sibling-elements-that-match-a-selector-with-vanilla-js/
+     * @static
+     * @param {HTMLElement} el - HTML element.
+     * @param {String} selector - CSS selector string.
+     */
 
-    _createClass(accordion, [{
-      key: "slideContentUp",
-      value:
-      /**
-       * Method to hide accordion content
-       * @method
-       * @param {HTMLElement} el - 'Toggler' HTML element.
-       */
-      function slideContentUp(el) {
-        var _this = this;
 
-        var content = accordion.getNextSibling(el, ".".concat(this.className, "__content"));
-        el.classList.remove("".concat(this.className, "__toggle--active"));
-        el.parentNode.classList.remove("".concat(this.className, "__item--is-open"));
-        el.setAttribute('aria-expanded', 'false');
-        content.style.height = '0px';
-        content.addEventListener('transitionend', function () {
-          content.classList.remove("".concat(_this.className, "__content--active"));
-        }, {
-          once: true
-        });
-        content.setAttribute('aria-hidden', 'true');
-      }
-      /**
-       * Method to show accordion content
-       * @method
-       * @param {HTMLElement} el - 'Toggler' HTML element.
-       */
+    static getNextSibling(el, selector) {
+      // Get the next sibling element
+      var sibling = el.nextElementSibling; // If there's no selector, return the first sibling
 
-    }, {
-      key: "slideContentDown",
-      value: function slideContentDown(el) {
-        var content = accordion.getNextSibling(el, ".".concat(this.className, "__content"));
-        el.classList.add("".concat(this.className, "__toggle--active"));
-        el.parentNode.classList.add("".concat(this.className, "__item--is-open"));
-        el.setAttribute('aria-expanded', 'true');
-        content.classList.add("".concat(this.className, "__content--active"));
-        content.style.height = 'auto';
-        var height = content.clientHeight + 'px';
-        content.style.height = '0px';
-        setTimeout(function () {
-          content.style.height = height;
-        }, 0);
-        content.setAttribute('aria-hidden', 'false');
-      }
-      /**
-       * Method to hide all other accordion content except for passed element.
-       * @method
-       * @param {HTMLElement} el - Excluded 'Toggler' HTML element.
-       * @param {HTMLElement[]} togglers - List of 'toggler' elements.
-       */
+      if (!selector) {
+        return sibling;
+      } // If the sibling matches our selector, use it
+      // If not, jump to the next sibling and continue the loop
 
-    }, {
-      key: "slideUpOthers",
-      value: function slideUpOthers(el, togglers) {
-        for (var i = 0; i < togglers.length; i++) {
-          if (togglers[i] !== el) {
-            if (togglers[i].classList.contains("".concat(this.className, "__toggle--active"))) {
-              this.slideContentUp(togglers[i]);
-            }
-          }
+
+      while (sibling) {
+        if (sibling.matches(selector)) {
+          return sibling;
         }
+
+        sibling = sibling.nextElementSibling;
       }
-      /**
-       * Click handler for 'togglers'
-       * @method
-       * @param {HTMLElement[]} togglers - List of 'toggler' elements.
-       */
+    }
+    /**
+     * Method to get previous sibling element.
+     * @static
+     * @param {HTMLElement} el - HTML element.
+     * @param {String} selector - CSS selector string.
+     */
 
-    }, {
-      key: "handleToggle",
-      value: function handleToggle(togglers) {
-        var _this2 = this;
 
-        return function (e) {
-          e.preventDefault();
-          var toggle = e.target.closest(".".concat(_this2.className, "__toggle"));
+    static getPrevSibling(el, selector) {
+      // Get the next sibling element
+      var sibling = el.previousElementSibling; // If there's no selector, return the first sibling
 
-          if (toggle.classList.contains("".concat(_this2.className, "__toggle--active"))) {
-            _this2.slideContentUp(toggle);
-          } else {
-            if (toggle.closest(".".concat(_this2.className)).classList.contains("".concat(_this2.className, "--is-manual"))) {
-              _this2.slideContentDown(toggle);
-            } else {
-              _this2.slideContentDown(toggle);
+      if (!selector) {
+        return sibling;
+      } // If the sibling matches our selector, use it
+      // If not, jump to the next sibling and continue the loop
 
-              _this2.slideUpOthers(toggle, togglers);
-            }
-          }
-        };
+
+      while (sibling) {
+        if (sibling.matches(selector)) {
+          return sibling;
+        }
+
+        sibling = sibling.previousElementSibling;
       }
-      /**
-       * Initialise accordion behavior
-       * @method
-       */
+    }
+    /**
+     * Method to hide accordion content
+     * @method
+     * @param {HTMLElement} el - 'Toggler' HTML element.
+     */
 
-    }, {
-      key: "init",
-      value: function init() {
-        var _this3 = this;
 
-        if (window.location.hash) {
-          this.hash = window.location.hash;
-        } // Scroll to hash (param string) selected accordion
+    slideContentUp(el) {
+      const content = accordion.getNextSibling(el, ".".concat(this.className, "__content"));
+      el.classList.remove("".concat(this.className, "__toggle--active"));
+      el.parentNode.classList.remove("".concat(this.className, "__item--is-open"));
+      el.setAttribute("aria-expanded", "false");
+      content.style.height = "0px";
+      content.addEventListener("transitionend", () => {
+        content.classList.remove("".concat(this.className, "__content--active"));
+      }, {
+        once: true
+      });
+      content.setAttribute("aria-hidden", "true");
+    }
+    /**
+     * Method to show accordion content
+     * @method
+     * @param {HTMLElement} el - 'Toggler' HTML element.
+     */
 
 
-        if (this.hash && this.hash !== '') {
-          var hashSelectedContent = document.querySelector("".concat(this.hash, ".").concat(this.className, "__content"));
+    slideContentDown(el) {
+      const content = accordion.getNextSibling(el, ".".concat(this.className, "__content"));
+      el.classList.add("".concat(this.className, "__toggle--active"));
+      el.parentNode.classList.add("".concat(this.className, "__item--is-open"));
+      el.setAttribute("aria-expanded", "true");
+      content.classList.add("".concat(this.className, "__content--active"));
+      content.style.height = "auto";
+      const height = content.clientHeight + "px";
+      content.style.height = "0px";
+      setTimeout(() => {
+        content.style.height = height;
+      }, 0);
+      content.setAttribute("aria-hidden", "false");
+    }
+    /**
+     * Method to hide all other accordion content except for passed element.
+     * @method
+     * @param {HTMLElement} el - Excluded 'Toggler' HTML element.
+     * @param {HTMLElement[]} togglers - List of 'toggler' elements.
+     */
 
-          if (hashSelectedContent) {
-            // Only apply classes on load when linking directly to an accordion item.
-            var hashSelected = accordion.getPrevSibling(hashSelectedContent, ".".concat(this.className, "__toggle"));
-            this.slideContentDown(hashSelected); // Scroll to top of selected item.
 
-            window.scrollTo(0, hashSelected.getBoundingClientRect().top);
+    slideUpOthers(el, togglers) {
+      for (let i = 0; i < togglers.length; i++) {
+        if (togglers[i] !== el) {
+          if (togglers[i].classList.contains("".concat(this.className, "__toggle--active"))) {
+            this.slideContentUp(togglers[i]);
           }
         }
-
-        var accordions = document.querySelectorAll(".".concat(this.className));
-        accordions.forEach(function (el) {
-          var togglers = el.querySelectorAll(".".concat(_this3.className, "__toggle"));
-          togglers.forEach(function (el) {
-            el.addEventListener('click', _this3.handleToggle(togglers));
-          });
-        }); // wrap contents of uq-accordion__content in a wrapper to apply padding and prevent animation jump
-
-        var accordionContents = document.querySelectorAll(".".concat(this.className, "__content"));
-        var accordionName = this.className;
-        accordionContents.forEach(function (accordionContent) {
-          var innerContent = accordionContent.innerHTML;
-          accordionContent.innerHTML = '';
-          var contentWrapper = "<div class =\"" + accordionName + "__content-wrapper\">".concat(innerContent, "</div>");
-          accordionContent.innerHTML = contentWrapper;
-        });
       }
-    }], [{
-      key: "getNextSibling",
-      value:
-      /**
-       * Method to replace jQuery's .next() method.
-       * See: https://gomakethings.com/finding-the-next-and-previous-sibling-elements-that-match-a-selector-with-vanilla-js/
-       * @static
-       * @param {HTMLElement} el - HTML element.
-       * @param {String} selector - CSS selector string.
-       */
-      function getNextSibling(el, selector) {
-        // Get the next sibling element
-        var sibling = el.nextElementSibling; // If there's no selector, return the first sibling
+    }
+    /**
+     * Click handler for 'togglers'
+     * @method
+     * @param {HTMLElement[]} togglers - List of 'toggler' elements.
+     */
 
-        if (!selector) {
-          return sibling;
-        } // If the sibling matches our selector, use it
-        // If not, jump to the next sibling and continue the loop
 
+    handleToggle(togglers) {
+      return e => {
+        e.preventDefault();
+        const toggle = e.target.closest(".".concat(this.className, "__toggle"));
 
-        while (sibling) {
-          if (sibling.matches(selector)) {
-            return sibling;
+        if (toggle.classList.contains("".concat(this.className, "__toggle--active"))) {
+          this.slideContentUp(toggle);
+        } else {
+          if (toggle.closest(".".concat(this.className)).classList.contains("".concat(this.className, "--is-manual"))) {
+            this.slideContentDown(toggle);
+          } else {
+            this.slideContentDown(toggle);
+            this.slideUpOthers(toggle, togglers);
           }
-
-          sibling = sibling.nextElementSibling;
         }
-      }
-      /**
-       * Method to get previous sibling element.
-       * @static
-       * @param {HTMLElement} el - HTML element.
-       * @param {String} selector - CSS selector string.
-       */
+      };
+    }
+    /**
+     * Initialise accordion behavior
+     * @method
+     */
 
-    }, {
-      key: "getPrevSibling",
-      value: function getPrevSibling(el, selector) {
-        // Get the next sibling element
-        var sibling = el.previousElementSibling; // If there's no selector, return the first sibling
 
-        if (!selector) {
-          return sibling;
-        } // If the sibling matches our selector, use it
-        // If not, jump to the next sibling and continue the loop
+    init() {
+      if (window.location.hash) {
+        this.hash = window.location.hash;
+      } // Scroll to hash (param string) selected accordion
 
 
-        while (sibling) {
-          if (sibling.matches(selector)) {
-            return sibling;
-          }
+      if (this.hash && this.hash !== "") {
+        const hashSelectedContent = document.querySelector("".concat(this.hash, ".").concat(this.className, "__content"));
 
-          sibling = sibling.previousElementSibling;
+        if (hashSelectedContent) {
+          // Only apply classes on load when linking directly to an accordion item.
+          const hashSelected = accordion.getPrevSibling(hashSelectedContent, ".".concat(this.className, "__toggle"));
+          this.slideContentDown(hashSelected); // Scroll to top of selected item.
+
+          window.scrollTo(0, hashSelected.getBoundingClientRect().top);
         }
       }
-    }]);
 
-    return accordion;
-  }();
+      const accordions = document.querySelectorAll(".".concat(this.className));
+      accordions.forEach(el => {
+        const togglers = el.querySelectorAll(".".concat(this.className, "__toggle"));
+        togglers.forEach(el => {
+          el.addEventListener("click", this.handleToggle(togglers));
+        });
+      }); // wrap contents of uq-accordion__content in a wrapper to apply padding and prevent animation jump
 
+      const accordionContents = document.querySelectorAll(".".concat(this.className, "__content"));
+      const accordionName = this.className;
+      accordionContents.forEach(function (accordionContent) {
+        let innerContent = accordionContent.innerHTML;
+        accordionContent.innerHTML = "";
+        let contentWrapper = "<div class =\"" + accordionName + "__content-wrapper\">".concat(innerContent, "</div>");
+        accordionContent.innerHTML = contentWrapper;
+      });
+    }
+
+  }
+
   exports.accordion = accordion;
@@ -236,0 +211,0 @@ Object.defineProperty(exports, '__esModule', {

dist/js/uqds.min.js

@@ -1,1 +0,1 @@
-"use strict";function _classCallCheck(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function _defineProperties(e,t){for(var n=0;n<t.length;n++){var a=t[n];a.enumerable=a.enumerable||!1,a.configurable=!0,"value"in a&&(a.writable=!0),Object.defineProperty(e,a.key,a)}}function _createClass(e,t,n){return t&&_defineProperties(e.prototype,t),n&&_defineProperties(e,n),Object.defineProperty(e,"prototype",{writable:!1}),e}var uq=function(e){var t=function(){function s(e){_classCallCheck(this,s),this.className=e=e||"uq-accordion",this.init()}return _createClass(s,[{key:"slideContentUp",value:function(e){var t=this,n=s.getNextSibling(e,".".concat(this.className,"__content"));e.classList.remove("".concat(this.className,"__toggle--active")),e.parentNode.classList.remove("".concat(this.className,"__item--is-open")),e.setAttribute("aria-expanded","false"),n.style.height="0px",n.addEventListener("transitionend",function(){n.classList.remove("".concat(t.className,"__content--active"))},{once:!0}),n.setAttribute("aria-hidden","true")}},{key:"slideContentDown",value:function(e){var t=s.getNextSibling(e,".".concat(this.className,"__content")),n=(e.classList.add("".concat(this.className,"__toggle--active")),e.parentNode.classList.add("".concat(this.className,"__item--is-open")),e.setAttribute("aria-expanded","true"),t.classList.add("".concat(this.className,"__content--active")),t.style.height="auto",t.clientHeight+"px");t.style.height="0px",setTimeout(function(){t.style.height=n},0),t.setAttribute("aria-hidden","false")}},{key:"slideUpOthers",value:function(e,t){for(var n=0;n<t.length;n++)t[n]!==e&&t[n].classList.contains("".concat(this.className,"__toggle--active"))&&this.slideContentUp(t[n])}},{key:"handleToggle",value:function(t){var n=this;return function(e){e.preventDefault();e=e.target.closest(".".concat(n.className,"__toggle"));e.classList.contains("".concat(n.className,"__toggle--active"))?n.slideContentUp(e):e.closest(".".concat(n.className)).classList.contains("".concat(n.className,"--is-manual"))?n.slideContentDown(e):(n.slideContentDown(e),n.slideUpOthers(e,t))}}},{key:"init",value:function(){var n=this;window.location.hash&&(this.hash=window.location.hash),this.hash&&""!==this.hash&&(e=document.querySelector("".concat(this.hash,".").concat(this.className,"__content")))&&(e=s.getPrevSibling(e,".".concat(this.className,"__toggle")),this.slideContentDown(e),window.scrollTo(0,e.getBoundingClientRect().top));document.querySelectorAll(".".concat(this.className)).forEach(function(e){var t=e.querySelectorAll(".".concat(n.className,"__toggle"));t.forEach(function(e){e.addEventListener("click",n.handleToggle(t))})});var e=document.querySelectorAll(".".concat(this.className,"__content")),a=this.className;e.forEach(function(e){var t=e.innerHTML,t=(e.innerHTML="",'<div class ="'+a+'__content-wrapper">'.concat(t,"</div>"));e.innerHTML=t})}}],[{key:"getNextSibling",value:function(e,t){var n=e.nextElementSibling;if(!t)return n;for(;n;){if(n.matches(t))return n;n=n.nextElementSibling}}},{key:"getPrevSibling",value:function(e,t){var n=e.previousElementSibling;if(!t)return n;for(;n;){if(n.matches(t))return n;n=n.previousElementSibling}}}]),s}();return e.accordion=t,Object.defineProperty(e,"__esModule",{value:!0}),e}({});
+"use strict";var uq=function(t){class a{constructor(t){this.className=t=t||"uq-accordion",this.init()}static getNextSibling(t,e){var s=t.nextElementSibling;if(!e)return s;for(;s;){if(s.matches(e))return s;s=s.nextElementSibling}}static getPrevSibling(t,e){var s=t.previousElementSibling;if(!e)return s;for(;s;){if(s.matches(e))return s;s=s.previousElementSibling}}slideContentUp(t){const e=a.getNextSibling(t,".".concat(this.className,"__content"));t.classList.remove("".concat(this.className,"__toggle--active")),t.parentNode.classList.remove("".concat(this.className,"__item--is-open")),t.setAttribute("aria-expanded","false"),e.style.height="0px",e.addEventListener("transitionend",()=>{e.classList.remove("".concat(this.className,"__content--active"))},{once:!0}),e.setAttribute("aria-hidden","true")}slideContentDown(t){const e=a.getNextSibling(t,".".concat(this.className,"__content")),s=(t.classList.add("".concat(this.className,"__toggle--active")),t.parentNode.classList.add("".concat(this.className,"__item--is-open")),t.setAttribute("aria-expanded","true"),e.classList.add("".concat(this.className,"__content--active")),e.style.height="auto",e.clientHeight+"px");e.style.height="0px",setTimeout(()=>{e.style.height=s},0),e.setAttribute("aria-hidden","false")}slideUpOthers(e,s){for(let t=0;t<s.length;t++)s[t]!==e&&s[t].classList.contains("".concat(this.className,"__toggle--active"))&&this.slideContentUp(s[t])}handleToggle(s){return t=>{t.preventDefault();const e=t.target.closest(".".concat(this.className,"__toggle"));e.classList.contains("".concat(this.className,"__toggle--active"))?this.slideContentUp(e):e.closest(".".concat(this.className)).classList.contains("".concat(this.className,"--is-manual"))?this.slideContentDown(e):(this.slideContentDown(e),this.slideUpOthers(e,s))}}init(){if(window.location.hash&&(this.hash=window.location.hash),this.hash&&""!==this.hash){var t=document.querySelector("".concat(this.hash,".").concat(this.className,"__content"));if(t){const n=a.getPrevSibling(t,".".concat(this.className,"__toggle"));this.slideContentDown(n),window.scrollTo(0,n.getBoundingClientRect().top)}}const e=document.querySelectorAll(".".concat(this.className)),s=(e.forEach(t=>{const e=t.querySelectorAll(".".concat(this.className,"__toggle"));e.forEach(t=>{t.addEventListener("click",this.handleToggle(e))})}),document.querySelectorAll(".".concat(this.className,"__content"))),i=this.className;s.forEach(function(t){var e=t.innerHTML,e=(t.innerHTML="",'<div class ="'+i+'__content-wrapper">'.concat(e,"</div>"));t.innerHTML=e})}}return t.accordion=a,Object.defineProperty(t,"__esModule",{value:!0}),t}({});

package.json

 {
   "name": "@uqds/accordion",
-  "version": "0.0.8-alpha.0",
+  "version": "0.0.12-alpha.0",
   "description": "Accordion component",
@@ -45,4 +45,4 @@ "keywords": [
   "dependencies": {
-    "@uqds/core": "^0.0.8-alpha.0",
-    "@uqds/icon": "^0.0.8-alpha.0"
+    "@uqds/core": "^0.0.12-alpha.0",
+    "@uqds/icon": "^0.0.12-alpha.0"
   },
@@ -52,3 +52,3 @@ "devDependencies": {
   },
-  "gitHead": "ec1e27ff2c58ae9bdcd0eef7516ad5d57a00bafb"
+  "gitHead": "125e487dfd2f7e46f2b29cc0e8646b92e61d6f2c"
 }

README.md

@@ -10,2 +10,3 @@ # `@uqds/accordion`
 With Yarn:
+
 ```shell
@@ -16,2 +17,3 @@ yarn add @uqds/accordion
 With NPM:
+
 ```shell
@@ -18,0 +20,0 @@ npm i @uqds/accordion

src/js/accordion.js

@@ -1,6 +0,6 @@
-'use strict';
+"use strict";
 
 /**
  * @file
- * UQ Accordion JS (instantiates an object that controls "accordion" nodes for 
+ * UQ Accordion JS (instantiates an object that controls "accordion" nodes for
  * the entire document). You need to make sure your accordion HTML is correctly
@@ -12,8 +12,8 @@ * formatted and the accompanying SCSS/CSS is loaded as well.
    * @constructor
-   * @param {String} [className] - Class name of accordion wrappers (optional; 
+   * @param {String} [className] - Class name of accordion wrappers (optional;
    * default: "accordion").
    */
-   constructor(className) {
+  constructor(className) {
     if (!className) {
-      className = 'uq-accordion';
+      className = "uq-accordion";
     } else {
@@ -26,3 +26,3 @@ className = className;
     this.init();
-  };
+  }
 
@@ -89,8 +89,12 @@ /**
     el.parentNode.classList.remove(`${this.className}__item--is-open`);
-    el.setAttribute('aria-expanded', 'false');
-    content.style.height = '0px';
-    content.addEventListener('transitionend', () => {
-      content.classList.remove(`${this.className}__content--active`);
-    }, {once: true});
-    content.setAttribute('aria-hidden', 'true');
+    el.setAttribute("aria-expanded", "false");
+    content.style.height = "0px";
+    content.addEventListener(
+      "transitionend",
+      () => {
+        content.classList.remove(`${this.className}__content--active`);
+      },
+      { once: true }
+    );
+    content.setAttribute("aria-hidden", "true");
   }
@@ -107,11 +111,11 @@
     el.parentNode.classList.add(`${this.className}__item--is-open`);
-    el.setAttribute('aria-expanded', 'true');
+    el.setAttribute("aria-expanded", "true");
     content.classList.add(`${this.className}__content--active`);
-    content.style.height = 'auto';
-    const height = content.clientHeight + 'px';
-    content.style.height = '0px';
+    content.style.height = "auto";
+    const height = content.clientHeight + "px";
+    content.style.height = "0px";
     setTimeout(() => {
       content.style.height = height;
     }, 0);
-    content.setAttribute('aria-hidden', 'false');
+    content.setAttribute("aria-hidden", "false");
   }
@@ -128,3 +132,5 @@
       if (togglers[i] !== el) {
-        if (togglers[i].classList.contains(`${this.className}__toggle--active`)) {
+        if (
+          togglers[i].classList.contains(`${this.className}__toggle--active`)
+        ) {
           this.slideContentUp(togglers[i]);
@@ -148,3 +154,7 @@ }
       } else {
-        if (toggle.closest(`.${this.className}`).classList.contains(`${this.className}--is-manual`)) {
+        if (
+          toggle
+            .closest(`.${this.className}`)
+            .classList.contains(`${this.className}--is-manual`)
+        ) {
           this.slideContentDown(toggle);
@@ -156,3 +166,3 @@ } else {
       }
-    }
+    };
   }
@@ -170,9 +180,14 @@
     // Scroll to hash (param string) selected accordion
-    if (this.hash && this.hash !== '') {
-      const hashSelectedContent = document.querySelector(`${this.hash}.${this.className}__content`);
+    if (this.hash && this.hash !== "") {
+      const hashSelectedContent = document.querySelector(
+        `${this.hash}.${this.className}__content`
+      );
 
       if (hashSelectedContent) {
         // Only apply classes on load when linking directly to an accordion item.
-        
-        const hashSelected = accordion.getPrevSibling(hashSelectedContent, `.${this.className}__toggle`);
+
+        const hashSelected = accordion.getPrevSibling(
+          hashSelectedContent,
+          `.${this.className}__toggle`
+        );
         this.slideContentDown(hashSelected);
@@ -191,3 +206,3 @@
       togglers.forEach((el) => {
-        el.addEventListener('click', this.handleToggle(togglers));
+        el.addEventListener("click", this.handleToggle(togglers));
       });
@@ -197,14 +212,19 @@ });
     // wrap contents of uq-accordion__content in a wrapper to apply padding and prevent animation jump
-    const accordionContents = document.querySelectorAll(`.${this.className}__content`);
+    const accordionContents = document.querySelectorAll(
+      `.${this.className}__content`
+    );
     const accordionName = this.className;
 
-    accordionContents.forEach(function(accordionContent) {
+    accordionContents.forEach(function (accordionContent) {
       let innerContent = accordionContent.innerHTML;
-      accordionContent.innerHTML = '';
-      let contentWrapper = `<div class ="` + accordionName + `__content-wrapper">${innerContent}</div>`;
+      accordionContent.innerHTML = "";
+      let contentWrapper =
+        `<div class ="` +
+        accordionName +
+        `__content-wrapper">${innerContent}</div>`;
       accordionContent.innerHTML = contentWrapper;
     });
   }
-};
+}
 
-export {accordion as default};
+export { accordion as default };

src/js/main.js

@@ -1,4 +0,2 @@
-import accordion from './accordion';
-export { 
-  accordion
-};
+import accordion from "./accordion";
+export { accordion };

No alert changes

Improved metrics

Number of lines in readme file

31

increased by6.9%

Worsened metrics

Total package byte prevSize

24628

decreased by-8.2%

Lines of code

375

decreased by-2.09%

Dependency changes

• + Added@uqds/core@0.0.12-alpha.0(transitive)

• + Added@uqds/icon@0.0.12-alpha.0(transitive)

• - Removed@uqds/core@0.0.8-alpha.0(transitive)

• - Removed@uqds/icon@0.0.8-alpha.0(transitive)

• Updated@uqds/core@^0.0.12-alpha.0

• Updated@uqds/icon@^0.0.12-alpha.0