npm - @qld-gov-au/qgds-bootstrap5 - Versions diffs - 1.1.40 → 2.0.0 - Mend

@qld-gov-au/qgds-bootstrap5 1.1.40 → 2.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (184) hide show

package/.eslintrc.cjs +27 -27
package/.vscode/settings.json +5 -5
package/dist/assets/components/bs5/button/button.hbs +48 -30
package/dist/assets/components/bs5/card/card.hbs +3 -17
package/dist/assets/components/bs5/containerLayout/containerLayout.hbs +100 -0
package/dist/assets/components/bs5/footer/customLinks.hbs +7 -0
package/dist/assets/components/bs5/footer/feedbackForm.hbs +25 -0
package/dist/assets/components/bs5/footer/followLinks.hbs +14 -0
package/dist/assets/components/bs5/footer/footer.hbs +229 -346
package/dist/assets/components/bs5/formcheck/formcheck.hbs +1 -1
package/dist/assets/components/bs5/head/head.hbs +4 -4
package/dist/assets/components/bs5/header/header.hbs +124 -878
package/dist/assets/components/bs5/header/headerBrand.hbs +35 -0
package/dist/assets/components/bs5/link/link.hbs +41 -0
package/dist/assets/components/bs5/logo/logoCOALandscape.hbs +110 -55
package/dist/assets/components/bs5/logo/logoCOALandscape2Lines.hbs +2 -1
package/dist/assets/components/bs5/navbar/navbar.hbs +65 -245
package/dist/assets/components/bs5/pageLayout/templates/contentPageWithForm.hbs +53 -22
package/dist/assets/components/bs5/pageLayout/templates/contentPageWithSideNavigation.hbs +79 -59
package/dist/assets/components/bs5/pageLayout/templates/homePage.hbs +111 -0
package/dist/assets/components/bs5/searchInput/searchInput.hbs +9 -11
package/dist/assets/css/qld.bootstrap.css +1 -1
package/dist/assets/css/qld.bootstrap.css.map +3 -3
package/dist/assets/js/bootstrap.bundle.js +3 -6
package/dist/assets/js/bootstrap.bundle.js.map +1 -1
package/dist/assets/js/bootstrap.bundle.min.js +2 -2
package/dist/assets/js/bootstrap.bundle.min.js.map +1 -1
package/dist/assets/js/bootstrap.js +3 -6
package/dist/assets/js/bootstrap.min.js +2 -2
package/dist/assets/js/bootstrap.min.js.map +1 -1
package/dist/assets/js/handlebars.helpers.bundle.js.map +2 -2
package/dist/assets/js/handlebars.helpers.js +34 -34
package/dist/assets/js/handlebars.init.min.js +1055 -2041
package/dist/assets/js/handlebars.init.min.js.map +4 -4
package/dist/assets/js/handlebars.partials.js +14 -6
package/dist/assets/js/qld.bootstrap.min.js +9 -9
package/dist/assets/js/qld.bootstrap.min.js.map +4 -4
package/dist/assets/node/handlebars.init.min.js +538 -108
package/dist/assets/node/handlebars.init.min.js.map +3 -3
package/dist/components/bs5/button/button.hbs +48 -30
package/dist/components/bs5/card/card.hbs +3 -17
package/dist/components/bs5/containerLayout/containerLayout.hbs +100 -0
package/dist/components/bs5/footer/customLinks.hbs +7 -0
package/dist/components/bs5/footer/feedbackForm.hbs +25 -0
package/dist/components/bs5/footer/followLinks.hbs +14 -0
package/dist/components/bs5/footer/footer.hbs +229 -346
package/dist/components/bs5/formcheck/formcheck.hbs +1 -1
package/dist/components/bs5/head/head.hbs +4 -4
package/dist/components/bs5/header/header.hbs +124 -878
package/dist/components/bs5/header/headerBrand.hbs +35 -0
package/dist/components/bs5/link/link.hbs +41 -0
package/dist/components/bs5/logo/logoCOALandscape.hbs +110 -55
package/dist/components/bs5/logo/logoCOALandscape2Lines.hbs +2 -1
package/dist/components/bs5/navbar/navbar.hbs +65 -245
package/dist/components/bs5/pageLayout/templates/contentPageWithForm.hbs +53 -22
package/dist/components/bs5/pageLayout/templates/contentPageWithSideNavigation.hbs +79 -59
package/dist/components/bs5/pageLayout/templates/homePage.hbs +111 -0
package/dist/components/bs5/searchInput/searchInput.hbs +9 -11
package/dist/components/handlebars.helpers.js +34 -34
package/dist/components/handlebars.partials.js +14 -6
package/dist/package.json +2 -2
package/dist/sample-data/button/button.data.json +10 -8
package/dist/sample-data/footer/footer.data.json +128 -84
package/dist/sample-data/formcheck/stories/checkbox/checkbox.data.json +51 -46
package/dist/sample-data/formcheck/stories/radio/radio.data.json +51 -46
package/dist/sample-data/header/header.variant.coBrand.data.json +28 -40
package/dist/sample-data/header/header.variant.endorsed.data.json +116 -150
package/dist/sample-data/header/header.variant.masterBrand.data.json +116 -152
package/dist/sample-data/header/header.variant.standAlone.data.json +118 -150
package/dist/sample-data/header/header.variant.subBrand.data.json +32 -159
package/dist/sample-data/inpageAlert/inpageAlert.data.json +6 -6
package/dist/sample-data/link/link.data.json +77 -0
package/dist/sample-data/logo/logo.data.json +1 -0
package/dist/sample-data/navbar/navbar.data.json +191 -0
package/dist/sample-data/searchInput/searchInput.data.json +2 -3
package/dist/sample-data/tabs/tabs.data.json +45 -44
package/package.json +2 -2
package/src/components/bs5/accordion/Accordion.mdx +8 -2
package/src/components/bs5/banner/Banner.mdx +6 -1
package/src/components/bs5/banner/banner.scss +16 -9
package/src/components/bs5/banner/banner.stories.js +17 -17
package/src/components/bs5/breadcrumbs/Breadcrumbs.mdx +8 -2
package/src/components/bs5/breadcrumbs/breadcrumbs.functions.js +2 -0
package/src/components/bs5/breadcrumbs/breadcrumbs.scss +1 -1
package/src/components/bs5/button/button.data.json +10 -8
package/src/components/bs5/button/button.hbs +48 -30
package/src/components/bs5/button/button.scss +61 -0
package/src/components/bs5/button/button.stories.js +29 -10
package/src/components/bs5/callToAction/callToAction.mdx +8 -3
package/src/components/bs5/card/Card.mdx +8 -2
package/src/components/bs5/card/card.hbs +3 -17
package/src/components/bs5/card/card.scss +103 -103
package/src/components/bs5/containerLayout/containerLayout.hbs +100 -0
package/src/components/bs5/containerLayout/containerLayout.stories.js +83 -0
package/src/components/bs5/footer/Footer.js +3 -3
package/src/components/bs5/footer/Footer.mdx +8 -2
package/src/components/bs5/footer/customLinks.hbs +7 -0
package/src/components/bs5/footer/feedbackForm.hbs +25 -0
package/src/components/bs5/footer/followLinks.hbs +14 -0
package/src/components/bs5/footer/footer.data.json +128 -84
package/src/components/bs5/footer/footer.functions.js +2 -1
package/src/components/bs5/footer/footer.hbs +229 -346
package/src/components/bs5/footer/footer.scss +262 -272
package/src/components/bs5/footer/footer.stories.js +4 -92
package/src/components/bs5/footer/footer_formio.scss +219 -0
package/src/components/bs5/formcheck/formcheck.hbs +1 -1
package/src/components/bs5/formcheck/formcheck.scss +161 -139
package/src/components/bs5/formcheck/stories/checkbox/checkbox.data.json +51 -46
package/src/components/bs5/formcheck/stories/radio/radio.data.json +51 -46
package/src/components/bs5/globalAlert/GlobalAlert.mdx +8 -2
package/src/components/bs5/globalAlert/globalAlert.test.js +3 -11
package/src/components/bs5/header/_header-variables.scss +272 -0
package/src/components/bs5/header/header.functions.js +9 -9
package/src/components/bs5/header/header.hbs +124 -878
package/src/components/bs5/header/header.scss +279 -411
package/src/components/bs5/header/header.stories.js +8 -28
package/src/components/bs5/header/header.variant.coBrand.data.json +28 -40
package/src/components/bs5/header/header.variant.endorsed.data.json +116 -150
package/src/components/bs5/header/header.variant.masterBrand.data.json +116 -152
package/src/components/bs5/header/header.variant.standAlone.data.json +118 -150
package/src/components/bs5/header/header.variant.subBrand.data.json +32 -159
package/src/components/bs5/header/headerBrand.hbs +35 -0
package/src/components/bs5/icons/icons.scss +79 -72
package/src/components/bs5/inpageAlert/InpageAlert.mdx +8 -2
package/src/components/bs5/inpageAlert/inpageAlert.data.json +6 -6
package/src/components/bs5/inpagenav/inpagenav.scss +37 -37
package/src/components/bs5/link/link.data.json +77 -0
package/src/components/bs5/link/link.hbs +41 -0
package/src/components/bs5/{pageLayout/pageLayout.js → link/link.js} +4 -5
package/src/components/bs5/link/link.mdx +16 -0
package/src/components/bs5/link/link.scss +81 -0
package/src/components/bs5/link/link.stories.js +126 -0
package/src/components/bs5/linkColumns/linkColumns.mdx +8 -3
package/src/components/bs5/logo/logo.data.json +1 -0
package/src/components/bs5/logo/logoCOALandscape.hbs +110 -55
package/src/components/bs5/logo/logoCOALandscape2Lines.hbs +2 -1
package/src/components/bs5/navbar/Navbar.js +2 -9
package/src/components/bs5/navbar/navbar.data.json +191 -0
package/src/components/bs5/navbar/navbar.functions.js +48 -196
package/src/components/bs5/navbar/navbar.hbs +65 -245
package/src/components/bs5/navbar/navbar.scss +684 -562
package/src/components/bs5/navbar/navbar.stories.js +533 -0
package/src/components/bs5/pageLayout/{FullWidthLandingPage.js → HomePage.js} +2 -2
package/src/components/bs5/pageLayout/pageLayout.stories.js +242 -98
package/src/components/bs5/pageLayout/templates/contentPageWithForm.hbs +53 -22
package/src/components/bs5/pageLayout/templates/contentPageWithSideNavigation.hbs +79 -59
package/src/components/bs5/pageLayout/templates/homePage.hbs +111 -0
package/src/components/bs5/promotionalPanel/PromotionalPanel.mdx +8 -3
package/src/components/bs5/searchInput/__snapshots__/searchInput.test.js.snap +10 -9
package/src/components/bs5/searchInput/search.functions.js +94 -63
package/src/components/bs5/searchInput/searchInput.data.json +2 -3
package/src/components/bs5/searchInput/searchInput.hbs +9 -11
package/src/components/bs5/searchInput/searchInput.scss +297 -255
package/src/components/bs5/searchInput/searchInput.test.js +98 -90
package/src/components/bs5/tabs/tabs.data.json +45 -44
package/src/components/bs5/tabs/tabs.scss +544 -500
package/src/components/bs5/tabs/tabs.stories.js +81 -51
package/src/components/common/layout/container.scss +22 -0
package/src/components/common/layout/content.scss +11 -4
package/src/components/common/layout/grid.scss +26 -0
package/src/css/main.scss +7 -2
package/src/css/mixins/_index.scss +2 -1
package/src/css/mixins/register-vars.scss +23 -0
package/src/css/qld-variables.scss +106 -83
package/src/css/utilities/_index.scss +1 -0
package/src/css/utilities/responsive-visually-hidden.scss +10 -0
package/src/js/handlebars.helpers.js +34 -34
package/src/js/handlebars.partials.js +14 -6
package/src/js/qld.bootstrap.js +10 -11
package/dist/assets/components/bs5/footer/footerForgov.hbs +0 -279
package/dist/assets/components/bs5/pageLayout/pageLayout.hbs +0 -34
package/dist/assets/components/bs5/pageLayout/templates/fullWidthLandingPage.hbs +0 -61
package/dist/components/bs5/footer/footerForgov.hbs +0 -279
package/dist/components/bs5/pageLayout/pageLayout.hbs +0 -34
package/dist/components/bs5/pageLayout/templates/fullWidthLandingPage.hbs +0 -61
package/src/components/bs5/footer/_colours.scss +0 -149
package/src/components/bs5/footer/_measurements.scss +0 -32
package/src/components/bs5/footer/footerForgov.hbs +0 -279
package/src/components/bs5/header/_colours.scss +0 -271
package/src/components/bs5/header/_icons.scss +0 -10
package/src/components/bs5/navbar/_colours.scss +0 -85
package/src/components/bs5/navbar/_icons.scss +0 -64
package/src/components/bs5/pageLayout/pageLayout.hbs +0 -34
package/src/components/bs5/pageLayout/templates/fullWidthLandingPage.hbs +0 -61

package/src/components/bs5/searchInput/searchInput.test.js CHANGED Viewed

@@ -43,7 +43,6 @@ describe("SearchInput", () => {
       <html>
         <head>
           <meta charset="utf-8">
-          <link rel="stylesheet" href="${__dirname}/../../../../dist/assets/css/qld.bootstrap.css">
         </head>
         <body>
           <form class="site-search" action="https://example.com/search">
@@ -73,7 +72,7 @@ describe("SearchInput", () => {
     // Ensure elements exist
     if (!form || !searchInput || !suggestions) {
-      throw new Error('Required elements not found in DOM');
+      throw new Error("Required elements not found in DOM");
     }
   });
@@ -84,7 +83,6 @@ describe("SearchInput", () => {
   test("Search input element and Suggestions container exists and has correct attributes", () => {
     expect(searchInput).toBeTruthy();
-    expect(searchInput.getAttribute("placeholder")).toBe(mockData.placeholder);
     expect(searchInput.getAttribute("id")).toBe(mockData.inputID);
     expect(searchInput.getAttribute("name").trim()).toBe(mockData.inputName);
     expect(suggestions).toBeTruthy();
@@ -94,28 +92,32 @@ describe("SearchInput", () => {
   test("Focus event shows suggestions", async () => {
     // Initially suggestions are hidden
     expect(isElementVisible(suggestions)).toBe(false);
     // Ensure input is empty to trigger default suggestions display
     searchInput.value = "";
     // Instead of relying on event dispatching, directly call the showSuggestions function
     // that should be available in the window scope after bootstrap loads
     if (window.showSuggestions || dom.window.showSuggestions) {
-      await (window.showSuggestions || dom.window.showSuggestions)("", true, form);
+      await (window.showSuggestions || dom.window.showSuggestions)(
+        "",
+        true,
+        form,
+      );
     } else {
       // If showSuggestions is not available globally, manually show suggestions
       // as the focus event handler would do
-      const defaultSuggestions = form.querySelector('.default-suggestions');
-      const dynamicSuggestions = form.querySelector('.dynamic-suggestions');
+      const defaultSuggestions = form.querySelector(".default-suggestions");
+      const dynamicSuggestions = form.querySelector(".dynamic-suggestions");
       if (defaultSuggestions) {
-        defaultSuggestions.classList.remove('d-none');
+        defaultSuggestions.classList.remove("d-none");
       }
       if (dynamicSuggestions) {
-        dynamicSuggestions.innerHTML = '';
-        dynamicSuggestions.classList.add('d-none');
+        dynamicSuggestions.innerHTML = "";
+        dynamicSuggestions.classList.add("d-none");
       }
-      suggestions.classList.remove('d-none');
+      suggestions.classList.remove("d-none");
     }
     // Wait for any asynchronous operations
@@ -131,18 +133,18 @@ describe("SearchInput", () => {
     // Initially suggestions should be hidden using the d-none class
-    // Directly simulate the focus event behavior
-    const defaultSuggestions = form.querySelector('.default-suggestions');
-    const dynamicSuggestions = form.querySelector('.dynamic-suggestions');
+    // Directly simulate the focus event behavior
+    const defaultSuggestions = form.querySelector(".default-suggestions");
+    const dynamicSuggestions = form.querySelector(".dynamic-suggestions");
     if (defaultSuggestions) {
-      defaultSuggestions.classList.remove('d-none');
+      defaultSuggestions.classList.remove("d-none");
     }
     if (dynamicSuggestions) {
-      dynamicSuggestions.innerHTML = '';
-      dynamicSuggestions.classList.add('d-none');
+      dynamicSuggestions.innerHTML = "";
+      dynamicSuggestions.classList.add("d-none");
     }
-    suggestions.classList.remove('d-none');
+    suggestions.classList.remove("d-none");
     // Wait for any asynchronous operations
     await waitFor();
@@ -156,9 +158,11 @@ describe("SearchInput", () => {
     searchInput.value = "test query";
     // Initially suggestions should be hidden
     // Ensure no dynamic suggestions exist initially
-    const dynamicSuggestionsContainer = form.querySelector('.dynamic-suggestions');
+    const dynamicSuggestionsContainer = form.querySelector(
+      ".dynamic-suggestions",
+    );
     if (dynamicSuggestionsContainer) {
       dynamicSuggestionsContainer.innerHTML = "";
     }
@@ -168,43 +172,45 @@ describe("SearchInput", () => {
       bubbles: true,
       cancelable: true,
     });
     searchInput.dispatchEvent(focusEvent);
     // Wait for any asynchronous operations
     await waitFor();
-    // Suggestions should remain hidden because
+    // Suggestions should remain hidden because
     // input has value but no dynamic suggestions exist
     expect(isElementVisible(suggestions)).toBe(false);
   });
   test("Focus back to UI should show dynamic suggestions if input is not empty", async () => {
-    const dynamicSuggestionsContainer = form.querySelector('.dynamic-suggestions');
+    const dynamicSuggestionsContainer = form.querySelector(
+      ".dynamic-suggestions",
+    );
     // Step 1: Focus on empty input - should show default suggestions
     searchInput.value = "";
     // Directly simulate showing default suggestions
-    const defaultSuggestions = form.querySelector('.default-suggestions');
+    const defaultSuggestions = form.querySelector(".default-suggestions");
     if (defaultSuggestions) {
-      defaultSuggestions.classList.remove('d-none');
+      defaultSuggestions.classList.remove("d-none");
     }
     if (dynamicSuggestionsContainer) {
-      dynamicSuggestionsContainer.innerHTML = '';
-      dynamicSuggestionsContainer.classList.add('d-none');
+      dynamicSuggestionsContainer.innerHTML = "";
+      dynamicSuggestionsContainer.classList.add("d-none");
     }
-    suggestions.classList.remove('d-none');
+    suggestions.classList.remove("d-none");
     await waitFor();
     // Verify default suggestions are shown
     expect(isElementVisible(suggestions)).toBe(true);
     // Step 2: Simulate having typed text and having suggestions populated
     // (Skip the actual input/fetch process and directly simulate the end state)
     searchInput.value = "test query";
     // Manually simulate what would happen after successful fetch
     if (dynamicSuggestionsContainer) {
       dynamicSuggestionsContainer.innerHTML = `
@@ -216,10 +222,10 @@ describe("SearchInput", () => {
           </ul>
         </div>
       `;
-      dynamicSuggestionsContainer.classList.remove('d-none');
+      dynamicSuggestionsContainer.classList.remove("d-none");
     }
-    suggestions.classList.remove('d-none');
+    suggestions.classList.remove("d-none");
     // Step 3: Simulate focusout event to hide suggestions
     const focusoutEvent = new window.FocusEvent("focusout", {
       relatedTarget: null,
@@ -227,27 +233,29 @@ describe("SearchInput", () => {
       cancelable: true,
     });
     searchInput.dispatchEvent(focusoutEvent);
     // Manually ensure suggestions are hidden (simulating the focusout behavior)
-    suggestions.classList.add('d-none');
+    suggestions.classList.add("d-none");
     // Verify suggestions are hidden after focusout
     expect(isElementVisible(suggestions)).toBe(false);
     // Step 4: Focus back into input with existing text
     // This should trigger the focus event listener which checks if input has value
     // Since we have non-empty input and existing dynamic suggestions, just show them again
-    suggestions.classList.remove('d-none');
+    suggestions.classList.remove("d-none");
     await waitFor();
     // Verify that suggestions are shown again without refetching
     expect(searchInput.value).toBe("test query"); // Input still has the text
     // The key assertion: existing dynamic suggestions content should still be there
     // (not refetched, just made visible again)
     if (dynamicSuggestionsContainer) {
-      expect(dynamicSuggestionsContainer.innerHTML).toContain("test <strong>query</strong> result 1");
+      expect(dynamicSuggestionsContainer.innerHTML).toContain(
+        "test <strong>query</strong> result 1",
+      );
       expect(isElementVisible(suggestions)).toBe(true);
     }
   });
@@ -257,24 +265,24 @@ describe("SearchInput", () => {
     // Simulate typing in input
     searchInput.value = "test";
-    const inputEvent = new window.InputEvent("input", {
+    const inputEvent = new window.InputEvent("input", {
       data: "t",
       bubbles: true,
-      cancelable: true,
+      cancelable: true,
     });
     // Set the target property correctly for the event
-    Object.defineProperty(inputEvent, 'target', {
+    Object.defineProperty(inputEvent, "target", {
       value: searchInput,
       enumerable: true,
     });
     searchInput.dispatchEvent(inputEvent);
     // Suggestions should not show immediately due to 300ms debounce
     expect(isElementVisible(suggestions)).toBe(false);
     // Wait and confirm it's still hidden (debounce should prevent immediate display)
     await waitFor();
     expect(isElementVisible(suggestions)).toBe(false);
@@ -287,22 +295,22 @@ describe("SearchInput", () => {
     // Show suggestions first by simulating focus on empty input
     searchInput.value = "";
     // Directly simulate showing default suggestions
-    const defaultSuggestions = form.querySelector('.default-suggestions');
-    const dynamicSuggestions = form.querySelector('.dynamic-suggestions');
+    const defaultSuggestions = form.querySelector(".default-suggestions");
+    const dynamicSuggestions = form.querySelector(".dynamic-suggestions");
     if (defaultSuggestions) {
-      defaultSuggestions.classList.remove('d-none');
+      defaultSuggestions.classList.remove("d-none");
     }
     if (dynamicSuggestions) {
-      dynamicSuggestions.innerHTML = '';
-      dynamicSuggestions.classList.add('d-none');
+      dynamicSuggestions.innerHTML = "";
+      dynamicSuggestions.classList.add("d-none");
     }
-    suggestions.classList.remove('d-none');
+    suggestions.classList.remove("d-none");
     await waitFor();
     expect(isElementVisible(suggestions)).toBe(true);
     // Test that focusout events can be dispatched without throwing errors
@@ -332,23 +340,23 @@ describe("SearchInput", () => {
   test("Document click outside hides suggestions", async () => {
     // Ensure input is empty so focus will show default suggestions
     searchInput.value = "";
     // First show suggestions by simulating focus on empty input
     // Directly simulate showing default suggestions
-    const defaultSuggestions = form.querySelector('.default-suggestions');
-    const dynamicSuggestions = form.querySelector('.dynamic-suggestions');
+    const defaultSuggestions = form.querySelector(".default-suggestions");
+    const dynamicSuggestions = form.querySelector(".dynamic-suggestions");
     if (defaultSuggestions) {
-      defaultSuggestions.classList.remove('d-none');
+      defaultSuggestions.classList.remove("d-none");
     }
     if (dynamicSuggestions) {
-      dynamicSuggestions.innerHTML = '';
-      dynamicSuggestions.classList.add('d-none');
+      dynamicSuggestions.innerHTML = "";
+      dynamicSuggestions.classList.add("d-none");
     }
-    suggestions.classList.remove('d-none');
+    suggestions.classList.remove("d-none");
     await waitFor();
     expect(isElementVisible(suggestions)).toBe(true);
     // Simulate clicking outside by dispatching focusout event
@@ -357,12 +365,12 @@ describe("SearchInput", () => {
       bubbles: true,
       cancelable: true,
     });
     searchInput.dispatchEvent(focusoutEvent);
     // Wait for event processing
     await waitFor();
     // Manually simulate the focusout behavior since JSDOM might not handle it exactly like browsers
     suggestions.classList.add("d-none");
@@ -373,26 +381,26 @@ describe("SearchInput", () => {
   test("Document click inside suggestions keeps them visible", async () => {
     // First show suggestions by simulating focus on empty input
     searchInput.value = "";
     // Directly simulate showing default suggestions
-    const defaultSuggestions = form.querySelector('.default-suggestions');
-    const dynamicSuggestions = form.querySelector('.dynamic-suggestions');
+    const defaultSuggestions = form.querySelector(".default-suggestions");
+    const dynamicSuggestions = form.querySelector(".dynamic-suggestions");
     if (defaultSuggestions) {
-      defaultSuggestions.classList.remove('d-none');
+      defaultSuggestions.classList.remove("d-none");
     }
     if (dynamicSuggestions) {
-      dynamicSuggestions.innerHTML = '';
-      dynamicSuggestions.classList.add('d-none');
+      dynamicSuggestions.innerHTML = "";
+      dynamicSuggestions.classList.add("d-none");
     }
-    suggestions.classList.remove('d-none');
+    suggestions.classList.remove("d-none");
     await waitFor();
     expect(isElementVisible(suggestions)).toBe(true);
     // Click inside suggestions
-    const suggestionLink = suggestions.querySelector("a");
+    const suggestionLink = suggestions.querySelector("li");
     if (suggestionLink) {
       const clickEvent = new window.MouseEvent("click", {
         bubbles: true,

package/src/components/bs5/tabs/tabs.data.json CHANGED Viewed

@@ -1,45 +1,46 @@
 {
-    "type_variant": "section-tabs",
-    "variant": "dark",
-    "tab_variant": "default",
-    "unique_id": "1234",
-    "sibiling_section_title": "Heading (H2)",
-    "sibling_section_content":"<p>Lorem ipsum dolor sit amet consectetur. Viverra eu pulvinar a eu mauris ac at ultricies est. Tincidunt ultrices commodo vestibulum non netus. Mauris maecenas lacus hendrerit urna ultricies auctor. Sed tristique nascetur sapien condimentum adipiscing augue quisque eu. Facilisi ligula quam faucibus feugiat. Sapien at at eget malesuada senectus donec pellentesque pellentesque odio.</p>",
-    "data": {
-        "items": [
-            {
-                "tab_text": "Tab label 1",
-                "title": "Section Heading (H2)",
-                "icon": "btn-icon fa-solid fa-arrow-up-right-from-square",
-                "content": "<p>Lorem ipsum dolor sit amet consectetur. Viverra eu pulvinar a eu mauris ac at ultricies est. Tincidunt ultrices commodo vestibulum non netus. Mauris maecenas lacus hendrerit urna ultricies auctor. Sed tristique nascetur sapien condimentum adipiscing augue quisque eu. Facilisi ligula quam faucibus feugiat. Sapien at at eget malesuada senectus donec pellentesque pellentesque odio.</p><a class=\"qld-cta-link\" href=\"#\" target=\"_blank\" aria-label=\"Call to action\">Call to action<span class=\"icon\" aria-hidden=\"true\"></span></a>"
-            },
-            {
-                "tab_text":"Tab label 2",
-                "title": "Section Heading Item 2",
-                "icon": "btn-icon fa-solid fa-arrow-up-right-from-square",
-                "content": "<p>Lorem ipsum dolor sit amet consectetur. Viverra eu pulvinar a eu mauris ac at ultricies est. Tincidunt ultrices commodo vestibulum non netus. Mauris maecenas lacus hendrerit urna ultricies auctor. Sed tristique nascetur sapien condimentum adipiscing augue quisque eu. Facilisi ligula quam faucibus feugiat. Sapien at at eget malesuada senectus donec pellentesque pellentesque odio.</p>"
-            },
-            {
-                "tab_text": "Tab label 3",
-                "title": "Section Heading Item 3",
-                "content": "<p>Lorem ipsum dolor sit amet consectetur. Viverra eu pulvinar a eu mauris ac at ultricies est. Tincidunt ultrices commodo vestibulum non netus. Mauris maecenas lacus hendrerit urna ultricies auctor. Sed tristique nascetur sapien condimentum adipiscing augue quisque eu. Facilisi ligula quam faucibus feugiat. Sapien at at eget malesuada senectus donec pellentesque pellentesque odio.</p>"
-            },
-            {
-                "tab_text": "Tab label 4",
-                "title": "Section Heading Item 4",
-                "content": "<p>Lorem ipsum dolor sit amet consectetur. Viverra eu pulvinar a eu mauris ac at ultricies est. Tincidunt ultrices commodo vestibulum non netus. Mauris maecenas lacus hendrerit urna ultricies auctor. Sed tristique nascetur sapien condimentum adipiscing augue quisque eu. Facilisi ligula quam faucibus feugiat. Sapien at at eget malesuada senectus donec pellentesque pellentesque odio.</p>",
-                "disabled": true
-            },
-            {
-                "tab_text": "Tab label 5",
-                "title": "Section Heading Item 5",
-                "content": "<p>Lorem ipsum dolor sit amet consectetur. Viverra eu pulvinar a eu mauris ac at ultricies est. Tincidunt ultrices commodo vestibulum non netus. Mauris maecenas lacus hendrerit urna ultricies auctor. Sed tristique nascetur sapien condimentum adipiscing augue quisque eu. Facilisi ligula quam faucibus feugiat. Sapien at at eget malesuada senectus donec pellentesque pellentesque odio.</p>"
-            },
-            {
-                "tab_text": "Tab label 6",
-                "title": "Section Heading Item 6",
-                "content": "<p>Lorem ipsum dolor sit amet consectetur. Viverra eu pulvinar a eu mauris ac at ultricies est. Tincidunt ultrices commodo vestibulum non netus. Mauris maecenas lacus hendrerit urna ultricies auctor. Sed tristique nascetur sapien condimentum adipiscing augue quisque eu. Facilisi ligula quam faucibus feugiat. Sapien at at eget malesuada senectus donec pellentesque pellentesque odio.</p>"
-            }
-        ]
-    }
-}
+  "type_variant": "section-tabs",
+  "variant": "dark",
+  "tab_variant": "default",
+  "unique_id": "1234",
+  "sibiling_section_title": "Heading (H2)",
+  "sibling_section_content": "<p>Lorem ipsum dolor sit amet consectetur. Viverra eu pulvinar a eu mauris ac at ultricies est. Tincidunt ultrices commodo vestibulum non netus. Mauris maecenas lacus hendrerit urna ultricies auctor. Sed tristique nascetur sapien condimentum adipiscing augue quisque eu. Facilisi ligula quam faucibus feugiat. Sapien at at eget malesuada senectus donec pellentesque pellentesque odio.</p>",
+  "data": {
+    "items": [
+      {
+        "tab_text": "Tab label 1",
+        "title": "Section Heading (H2)",
+        "icon": "qld-icon qld-icon-md qld-icon-calendar",
+        "content": "<p>Lorem ipsum dolor sit amet consectetur. Viverra eu pulvinar a eu mauris ac at ultricies est. Tincidunt ultrices commodo vestibulum non netus. Mauris maecenas lacus hendrerit urna ultricies auctor. Sed tristique nascetur sapien condimentum adipiscing augue quisque eu. Facilisi ligula quam faucibus feugiat. Sapien at at eget malesuada senectus donec pellentesque pellentesque odio.</p><a class=\"qld-cta-link\" href=\"#\" target=\"_blank\" aria-label=\"Call to action\">Call to action<span class=\"icon\" aria-hidden=\"true\"></span></a>"
+      },
+      {
+        "tab_text": "Tab label 2",
+        "title": "Section Heading Item 2",
+        "icon": "qld-icon qld-icon-md qld-icon-calendar",
+        "content": "<p>Lorem ipsum dolor sit amet consectetur. Viverra eu pulvinar a eu mauris ac at ultricies est. Tincidunt ultrices commodo vestibulum non netus. Mauris maecenas lacus hendrerit urna ultricies auctor. Sed tristique nascetur sapien condimentum adipiscing augue quisque eu. Facilisi ligula quam faucibus feugiat. Sapien at at eget malesuada senectus donec pellentesque pellentesque odio.</p>"
+      },
+      {
+        "tab_text": "Tab label 3",
+        "title": "Section Heading Item 3",
+        "icon": "qld-icon qld-icon-md qld-icon-calendar",
+        "content": "<p>Lorem ipsum dolor sit amet consectetur. Viverra eu pulvinar a eu mauris ac at ultricies est. Tincidunt ultrices commodo vestibulum non netus. Mauris maecenas lacus hendrerit urna ultricies auctor. Sed tristique nascetur sapien condimentum adipiscing augue quisque eu. Facilisi ligula quam faucibus feugiat. Sapien at at eget malesuada senectus donec pellentesque pellentesque odio.</p>"
+      },
+      {
+        "tab_text": "Tab label 4",
+        "title": "Section Heading Item 4",
+        "content": "<p>Lorem ipsum dolor sit amet consectetur. Viverra eu pulvinar a eu mauris ac at ultricies est. Tincidunt ultrices commodo vestibulum non netus. Mauris maecenas lacus hendrerit urna ultricies auctor. Sed tristique nascetur sapien condimentum adipiscing augue quisque eu. Facilisi ligula quam faucibus feugiat. Sapien at at eget malesuada senectus donec pellentesque pellentesque odio.</p>",
+        "disabled": true
+      },
+      {
+        "tab_text": "Tab label 5",
+        "title": "Section Heading Item 5",
+        "content": "<p>Lorem ipsum dolor sit amet consectetur. Viverra eu pulvinar a eu mauris ac at ultricies est. Tincidunt ultrices commodo vestibulum non netus. Mauris maecenas lacus hendrerit urna ultricies auctor. Sed tristique nascetur sapien condimentum adipiscing augue quisque eu. Facilisi ligula quam faucibus feugiat. Sapien at at eget malesuada senectus donec pellentesque pellentesque odio.</p>"
+      },
+      {
+        "tab_text": "Tab label 6",
+        "title": "Section Heading Item 6",
+        "content": "<p>Lorem ipsum dolor sit amet consectetur. Viverra eu pulvinar a eu mauris ac at ultricies est. Tincidunt ultrices commodo vestibulum non netus. Mauris maecenas lacus hendrerit urna ultricies auctor. Sed tristique nascetur sapien condimentum adipiscing augue quisque eu. Facilisi ligula quam faucibus feugiat. Sapien at at eget malesuada senectus donec pellentesque pellentesque odio.</p>"
+      }
+    ]
+  }
+}