@cagovweb/state-template 6.3.4 → 6.4.1

package/dist/js/cagov.core.js

@@ -1,4 +1,4 @@
-var StateTemplateNpmPackageVersion="6.3.4";
+var StateTemplateNpmPackageVersion="6.4.1";
 /*!
   * Bootstrap v5.3.3 (https://getbootstrap.com/)
   * Copyright 2011-2024 The Bootstrap Authors (https://github.com/twbs/bootstrap/graphs/contributors)
@@ -6670,9 +6670,9 @@ window.addEventListener("load", () => {
       // provide the heading with a class for styling
       heading.classList.add(widgetHeadingClass);
 
-      newButton.setAttribute("type", "button");
+      newButton.type = "button";
       newButton.setAttribute("aria-controls", targetID);
-      newButton.setAttribute("id", `${targetID}_trigger`);
+      newButton.id = `${targetID}_trigger`;
       newButton.classList.add(widgetTriggerClass);
 
       /**
@@ -7835,6 +7835,7 @@ window.addEventListener("load", () => {
       }
       // Create a 'copy code' button, insert it after the <pre> tag
       const newDiv = document.createElement("button");
+      newDiv.type = "button";
       newDiv.onclick = function () {
         copyCode(/** @type {HTMLElement} */ (this));
       };
@@ -8107,11 +8108,15 @@ window.addEventListener("load", () => {
 
 window.addEventListener("load", () => {
   const siteHeader = document.querySelector("header");
-  const sidenavigation = document.querySelector(".side-navigation");
+  const sidenavigation = /** @type {HTMLElement} */ (
+    document.querySelector(".side-navigation")
+  );
   if (!sidenavigation || !siteHeader) return;
-  const allSidenavLinks = sidenavigation.querySelectorAll(".side-navigation a");
+  const allSidenavLinks = /** @type {NodeListOf<HTMLElement>} */ (
+    sidenavigation.querySelectorAll(".side-navigation a")
+  );
   const mainContentSideNavCont = sidenavigation.closest("div");
-  sidenavigation.setAttribute("id", "side-navigation");
+  sidenavigation.id = "side-navigation";
   const topposition = localStorage.getItem("sidebar-scroll");
   const mobileCntls = document.querySelector(".global-header .mobile-controls");
   if (!mobileCntls) return;
@@ -8138,20 +8143,21 @@ window.addEventListener("load", () => {
       btnText = btnText.replace(btnTextSpan, "").trim();
       // create button container
       const sidenavMobile = document.createElement("aside");
-      sidenavMobile.setAttribute("class", "sidenav-mobile-btn");
+      sidenavMobile.className = "sidenav-mobile-btn";
       const sidenavMobileCont = document.createElement("div");
-      sidenavMobileCont.setAttribute("class", "container");
+      sidenavMobileCont.className = "container";
       sidenavMobile.append(sidenavMobileCont);
       // create button
       sidenavToggleBtn = document.createElement("button");
-      sidenavToggleBtn.setAttribute("class", "sidenav-toggle");
-      sidenavToggleBtn.setAttribute("aria-expanded", "false");
+      sidenavToggleBtn.type = "button";
+      sidenavToggleBtn.className = "sidenav-toggle";
+      sidenavToggleBtn.ariaExpanded = "false";
       sidenavToggleBtn.setAttribute("aria-controls", "side-navigation");
       sidenavToggleBtn.innerText = btnText;
       // create icon
       const arrowIcon = document.createElement("span");
-      arrowIcon.setAttribute("aria-hidden", "true");
-      arrowIcon.setAttribute("class", "ca-gov-icon-caret-down");
+      arrowIcon.ariaHidden = "true";
+      arrowIcon.className = "ca-gov-icon-caret-down";
       sidenavToggleBtn.append(arrowIcon);
       // append button into the header
       sidenavMobileCont.append(sidenavToggleBtn);
@@ -8163,9 +8169,9 @@ window.addEventListener("load", () => {
 
   const createmobileSideNavDiv = () => {
     mobileSideNavDiv = document.createElement("aside");
-    mobileSideNavDiv.setAttribute("class", "mobile-sidenav");
+    mobileSideNavDiv.className = "mobile-sidenav";
     mobileSideNavCont = document.createElement("div");
-    mobileSideNavCont.setAttribute("class", "container");
+    mobileSideNavCont.className = "container";
     mobileSideNavDiv.append(mobileSideNavCont);
     siteHeader.after(mobileSideNavDiv);
   };
@@ -8176,9 +8182,9 @@ window.addEventListener("load", () => {
       mobileSideNavCont.append(sidenavigation);
     }
 
-    sidenavigation.setAttribute("aria-hidden", "true");
+    sidenavigation.ariaHidden = "true";
     allSidenavLinks?.forEach(el => {
-      el.setAttribute("tabindex", "-1");
+      el.tabIndex = -1;
     });
   };
 
@@ -8199,22 +8205,24 @@ window.addEventListener("load", () => {
     // Open
     if (mobileSideNavDiv.classList.contains("visible")) {
       sidenavigation.removeAttribute("aria-hidden");
-      sidenavToggleBtn.setAttribute("aria-expanded", "true");
+      sidenavToggleBtn.ariaExpanded = "true";
       allSidenavLinks?.forEach(el => {
         el.removeAttribute("tabindex");
       });
 
       // Closed
     } else {
-      sidenavToggleBtn.setAttribute("aria-expanded", "false");
-      sidenavigation.setAttribute("aria-hidden", "true");
+      sidenavToggleBtn.ariaExpanded = "false";
+      sidenavigation.ariaHidden = "true";
       allSidenavLinks?.forEach(el => {
-        el.setAttribute("tabindex", "-1");
+        el.tabIndex = -1;
       });
     }
   };
 
-  // Set active class on nav-heading links
+  /**
+   * Set active class on nav-heading links
+   */
   function addActiveClass() {
     /** @type {NodeListOf<HTMLAnchorElement>} */
     const active_link = document.querySelectorAll("a.nav-heading"),
@@ -8679,6 +8687,7 @@ window.addEventListener("load", () => {
 
   // Create close mobile meu button
   const navMobileMenuToggleBtn = document.createElement("button");
+  navMobileMenuToggleBtn.type = "button";
   navMobileMenuToggleBtn.classList.add("mobile-control", "toggle-menu");
   navMobileMenuToggleBtn.ariaExpanded = "false";
   navMobileMenuToggleBtn.setAttribute("aria-controls", "navigation");
@@ -8705,7 +8714,7 @@ window.addEventListener("load", () => {
 
   //Used for hiding/showing main elements
   const mainElements = document.querySelectorAll(
-    ".main-content, footer, .site-footer, .utility-header, .branding, header"
+    ".main-content, footer, .site-footer, .utility-header, .branding"
   );
 
   const regularHeader = document.querySelector("header");