@qld-gov-au/qgds-bootstrap5 2.0.1 → 2.0.3

package/dist/sample-data/accordion/accordion.data.json

@@ -1,24 +1,25 @@
 {
-	"groupid": "accordion-group-1",
-	"toggleAll": true,
-	"accordionItems": [
-		{
-			"id": "One",
-			"title": "Accordion item #1",
-			"expanded": true,
-			"content": "<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce dictum efficitur egestas.</p><p>Aenean sed pretium mauris. Quisque euismod in nisl et consequat.</p> "
-		},
-		{
-			"id": "Two",
-			"title": "Accordion item #2",
-			"expanded": false,
-			"content": "<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla vitae elit libero, a pharetra augue. Nullam id dolor id nibh ultricies vehicula ut id elit.</p><ul><li>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</li><li>Aliquam tincidunt mauris eu risus.</li><li>Vestibulum auctor dapibus neque.</li></ul>"
-		},
-		{
-			"id": "Three",
-			"title": "Accordion item #3",
-			"expanded": false,
-			"content": "<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla vitae elit libero, a pharetra augue. Nullam id dolor id nibh ultricies vehicula ut id elit.</p><ol><li>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</li><li>Aliquam tincidunt mauris eu risus.</li><li>Vestibulum auctor dapibus neque.</li></ol>"
-		}
-	]
-}
+  "groupid": "accordion-group-1",
+  "toggleAll": true,
+  "headingTag": "h2",
+  "accordionItems": [
+    {
+      "id": "One",
+      "title": "Accordion item #1",
+      "expanded": true,
+      "content": "<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce dictum efficitur egestas.</p><p>Aenean sed pretium mauris. Quisque euismod in nisl et consequat.</p> "
+    },
+    {
+      "id": "Two",
+      "title": "Accordion item #2",
+      "expanded": false,
+      "content": "<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla vitae elit libero, a pharetra augue. Nullam id dolor id nibh ultricies vehicula ut id elit.</p><ul><li>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</li><li>Aliquam tincidunt mauris eu risus.</li><li>Vestibulum auctor dapibus neque.</li></ul>"
+    },
+    {
+      "id": "Three",
+      "title": "Accordion item #3",
+      "expanded": false,
+      "content": "<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla vitae elit libero, a pharetra augue. Nullam id dolor id nibh ultricies vehicula ut id elit.</p><ol><li>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</li><li>Aliquam tincidunt mauris eu risus.</li><li>Vestibulum auctor dapibus neque.</li></ol>"
+    }
+  ]
+}

package/dist/sample-data/navbar/navbar.data.json

@@ -12,70 +12,87 @@
       "alternativeColor": false,
       "mobileOnly": false,
       "hideLabel": true,
+      "currentPage": true,
       "target": ""
     },
     {
       "text": "Simple list",
       "iconName": "",
-      "url": "index.html",
-      "alternativeColor": true,
+      "url": "https://www.wired.html",
+      "alternativeColor": false,
       "mobileOnly": false,
+      "currentPage": false,
       "hideLabel": false,
       "target": "_blank",
       "dropdownOptions": {
-        "alternativeText": "Patients and visitors",
-        "description": "Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa.",
-        "viewAllHref": "https://example.com"
+        "hasNoLink": false,
+        "alternativeText": "",
+        "description": "",
+        "viewAllHref": ""
       },
       "navigationItems": [
         {
           "text": "Find your reason",
           "description": "",
           "url": "index.html",
-          "mobileOnly": true,
-          "target": ""
+          "mobileOnly": false,
+          "target": "",
+          "isHTML": false,
+          "htmlContent": ""
         },
         {
           "text": "Quit stories",
           "description": "",
           "url": "index.html",
           "mobileOnly": false,
-          "target": ""
+          "target": "",
+          "isHTML": false,
+          "htmlContent": ""
         },
         {
           "text": "Vaping (e-cigarettes)",
           "description": "",
           "url": "index.html",
           "mobileOnly": false,
-          "target": ""
+          "target": "",
+          "isHTML": false,
+          "htmlContent": ""
         },
         {
           "text": "Choose your method",
           "description": "",
           "url": "index.html",
           "mobileOnly": false,
-          "target": ""
+          "target": "",
+          "isHTML": false,
+          "htmlContent": ""
         },
         {
           "text": "Pregnancy and smoking",
           "description": "",
           "url": "index.html",
           "mobileOnly": false,
-          "target": ""
+          "target": "",
+          "isHTML": false,
+          "htmlContent": ""
         },
         {
           "text": "Sign up for our support program",
           "description": "",
           "url": "index.html",
           "mobileOnly": false,
-          "target": ""
+          "target": "",
+          "isHTML": false,
+          "htmlContent": ""
         },
         {
           "text": "Plan your journey",
           "description": "",
           "url": "index.html",
           "mobileOnly": false,
-          "target": ""
+          "target": "",
+          "isHTML": false,
+          "htmlContent": ""
         }
       ]
     },
@@ -83,11 +100,13 @@
       "text": "Mega menu",
       "iconName": "qld-icon-calendar",
       "url": "https://example.com",
-      "alternativeColor": true,
+      "alternativeColor": false,
       "mobileOnly": false,
+      "currentPage": false,
       "hideLabel": false,
       "target": "",
       "dropdownOptions": {
+        "hasNoLink": true,
         "alternativeText": "Mega menu alt title",
         "description": "Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa.",
         "viewAllHref": "index.html"
@@ -98,56 +117,72 @@
           "description": "One of the best motivations for quitting is having a clear reason in mind so you know exactly why you’re doing it in the first place.",
           "url": "index.html",
           "mobileOnly": false,
-          "target": ""
+          "target": "",
+          "isHTML": false,
+          "htmlContent": ""
         },
         {
           "text": "Aboriginal and Torres Strait Islander support",
           "description": "Be encouraged and motivated by listening to stories of others who've quit smoking for life.",
           "url": "index.html",
           "mobileOnly": false,
-          "target": ""
+          "target": "",
+          "isHTML": false,
+          "htmlContent": ""
         },
         {
           "text": "Your healthcare rights and responsibilities",
           "description": "Vaping products are also known as e-cigarettes, e-cigars, vape pens or personal vapourisers. Vapes are harmful. The safest option is to not vape at all.",
           "url": "index.html",
           "mobileOnly": false,
-          "target": ""
+          "target": "",
+          "isHTML": false,
+          "htmlContent": ""
         },
         {
           "text": "Going to hospital",
           "description": "There are plenty of ways to quit smoking cigarettes and vapes. Find one that suits you best and commit to it.",
           "url": "index.html",
           "mobileOnly": false,
-          "target": ""
+          "target": "",
+          "isHTML": false,
+          "htmlContent": ""
         },
         {
           "text": "Interpreter services",
           "description": "Whether you’re thinking about getting pregnant, you're pregnant or have recently given birth, quitting smoking or vaping is the best thing you can do for the health of  you and your baby.",
           "url": "index.html",
           "mobileOnly": false,
-          "target": ""
+          "target": "",
+          "isHTML": false,
+          "htmlContent": ""
         },
         {
           "text": "Health costs, insurance and financial support",
           "description": "Sign up for My Quit Journey to support you to stop smoking.",
           "url": "index.html",
           "mobileOnly": false,
-          "target": ""
+          "target": "",
+          "isHTML": false,
+          "htmlContent": ""
         },
         {
           "text": "Leaving hospital",
           "description": "Congratulations on taking the first step in your journey and deciding to make one of the best choices of your life.",
           "url": "index.html",
           "mobileOnly": false,
-          "target": ""
+          "target": "",
+          "isHTML": false,
+          "htmlContent": ""
         },
         {
           "text": "Your health record",
           "description": "Congratulations on taking the first step in your journey and deciding to make one of the best choices of your life.",
           "url": "index.html",
           "mobileOnly": false,
-          "target": ""
+          "target": "",
+          "isHTML": false,
+          "htmlContent": ""
         }
       ]
     },
@@ -157,6 +192,7 @@
       "url": "/iframe.html?viewMode=story&id=3-components-navbar--default",
       "alternativeColor": false,
       "mobileOnly": false,
+      "currentPage": false,
       "hideLabel": false,
       "target": ""
     },
@@ -166,24 +202,54 @@
       "url": "/?path=/docs/3-components-navbar--overview",
       "alternativeColor": false,
       "mobileOnly": false,
+      "currentPage": false,
       "hideLabel": false,
       "target": ""
     },
     {
-      "text": "Mobile only",
+      "text": "Full screen view 2",
       "iconName": "",
       "url": "index.html",
-      "alternativeColor": false,
+      "alternativeColor": true,
       "mobileOnly": true,
+      "currentPage": false,
       "hideLabel": false,
       "target": ""
     },
+    {
+      "text": "Login",
+      "iconName": "qld-icon-login",
+      "url": "",
+      "alternativeColor": true,
+      "mobileOnly": true,
+      "currentPage": false,
+      "hideLabel": false,
+      "target": "",
+      "dropdownOptions": {
+        "hasNoLink": true,
+        "alternativeText": "",
+        "description": "",
+        "viewAllHref": ""
+      },
+      "navigationItems": [
+        {
+          "text": "",
+          "description": "",
+          "url": "",
+          "mobileOnly": true,
+          "target": "",
+          "isHTML": true,
+          "htmlContent": "<div class='someClass'><h4 class='mt-2 mb-3'>Log in to For government</h4><p>Most employees can log in using single sign on (SSO).</p><div class='someClass'><a class='btn btn-secondary justify-content-center' href='/someLink'>Log in with single sign-on</a><div class='group'><a class='mt-2 qld__header__cta-group-list' href='/somelink'>If your agency doesn't use SSO.</a></div></div><hr><h4 class='mt-2 mb-3'>Select your agency</h4><p>See information relevant to your agency.</p></div>"
+        }
+      ]
+    },
     {
       "text": "Mobile only with icon",
       "iconName": "qld-icon-chart",
       "url": "index.html",
-      "alternativeColor": false,
+      "alternativeColor": true,
       "mobileOnly": true,
+      "currentPage": false,
       "hideLabel": false,
       "target": ""
     }

package/dist/sample-data/pagination/pagination.data.json

@@ -1,21 +1,21 @@
 {
-    "arialabel" : "Pagination for search results",
-	"previous": {
-        "href": "#",
-        "linktext": "Back",
-        "arialabel": "Previous page"
-    },
-    "next": {
-        "href": "#",
-        "linktext": "Next",
-        "arialabel": "Next page"
-    },
-    
-	"pages": [
-        { "href": "#", "linktext": "1", "customClasses": "" },
-        { "href": "#", "linktext": "2", "customClasses": "active" },
-        { "href": "#", "linktext": "", "customClasses": "more", "more": true },
-        { "href": "#", "linktext": "6", "customClasses": "" },
-        { "href": "#", "linktext": "7", "customClasses": "" }
-    ]
+  "arialabel": "Pagination for search results",
+  "previous": {
+    "href": "#",
+    "linktext": "Back",
+    "arialabel": "Previous page"
+  },
+  "next": {
+    "href": "#",
+    "linktext": "Next",
+    "arialabel": "Next page"
+  },
+
+  "pages": [
+    { "href": "#", "linktext": "1", "customClasses": "" },
+    { "href": "#", "linktext": "2", "customClasses": "active" },
+    { "href": "#", "linktext": "3", "customClasses": "" },
+    { "href": "#", "linktext": "", "customClasses": "more", "more": true },
+    { "href": "#", "linktext": "7", "customClasses": "" }
+  ]
 }

package/dist/sample-data/sidenav/sidenav.data.json

@@ -1,88 +1,89 @@
 {
-    "navtitle": "In this section",
-    "navtitlelink": "#optionallink",
-    "navlist": [
+  "collapseTitle": "In this section",
+  "navtitle": "Parent page",
+  "navtitlelink": "#optionallink",
+  "navlist": [
+    {
+      "link": "https://www.qld.gov.au/transport/registration/register/heavy",
+      "label": "Sibling page",
+      "class": "",
+      "target": "",
+      "children": [
         {
-            "link": "https://www.qld.gov.au/transport/registration/register/heavy",
-            "label": "Heavy vehicles",
-            "class": "",
-            "target": "",
-            "children": [
-                {
-                    "link": "#",
-                    "class": "",
-                    "label": "Level two item",
-                    "children": []
-                },
-                {
-                    "link": "#",
-                    "class": "active",
-                    "label": "Level two item",
-                    "children": []
-                },
-                {
-                    "link": "#",
-                    "class": "",
-
-                    "label": "Level two item",
-                    "children": [
-                        {
-                            "link": "#",
-                            "class": "",
-                            "label": "Level three item",
-                            "children": []
-                        },
-                        {
-                            "link": "#",
-                            "class": "active",
-                            "label": "Level three item that wraps to another line",
-                            "children": []
-                        }
-                    ]
-                }
-            ]
-        },
-        {
-            "link": "#",
-            "label": "Renew registration",
-            "class": "",
-            "children": []
-        },
-        {
-            "link": "#",
-            "label": "Register a motorised mobility device",
-            "class": "active",
-            "children": []
-        },
-        {
-            "link": "#",
-            "label": "Register a boat",
-            "class": "",
-            "children": []
-        },
-        {
-            "link": "#",
-            "label": "Conditional registration",
-            "class": "",
-            "children": []
+          "link": "#",
+          "class": "",
+          "label": "Child page",
+          "children": []
         },
         {
-            "link": "#",
-            "label": "Vehicles registered overseas temporarily being used in Queensland",
-            "class": "",
-            "children": []
+          "link": "#",
+          "class": "active",
+          "label": "Child page",
+          "children": []
         },
         {
-            "link": "#",
-            "label": "Left hand drive vehicles",
-            "class": "",
-            "children": []
-        },
-        {
-            "link": "#",
-            "label": "Registration Help Tool—how to register a used motor vehicle or motorcycle",
-            "class": "",
-            "children": []
+          "link": "#",
+          "class": "",
+
+          "label": "Child page",
+          "children": [
+            {
+              "link": "#",
+              "class": "",
+              "label": "Grandchild page",
+              "children": []
+            },
+            {
+              "link": "#",
+              "class": "active",
+              "label": "Grandchild page",
+              "children": []
+            }
+          ]
         }
-    ]
+      ]
+    },
+    {
+      "link": "#",
+      "label": "Sibling page",
+      "class": "",
+      "children": []
+    },
+    {
+      "link": "#",
+      "label": "Sibling page",
+      "class": "active",
+      "children": []
+    },
+    {
+      "link": "#",
+      "label": "Sibling page",
+      "class": "",
+      "children": []
+    },
+    {
+      "link": "#",
+      "label": "Sibling page",
+      "class": "",
+      "children": []
+    },
+    {
+      "link": "#",
+      "label": "Sibling page",
+      "class": "",
+      "children": []
+    },
+    {
+      "link": "#",
+      "label": "Sibling page",
+      "class": "",
+      "children": []
+    },
+    {
+      "link": "#",
+      "label": "Sibling page",
+      "class": "",
+      "children": []
+    }
+  ]
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@qld-gov-au/qgds-bootstrap5",
-  "version": "2.0.1",
+  "version": "2.0.3",
   "description": "",
   "repository": {
     "type": "git",
@@ -43,9 +43,7 @@
     "vite.config.js"
   ],
   "dependencies": {
-    "@fortawesome/fontawesome-free": "^6.6.0",
-    "bootstrap": "^5.3.8",
-    "material-symbols": "^0.31.7"
+    "bootstrap": "^5.3.8"
   },
   "devDependencies": {
     "@chromatic-com/storybook": "^3.2.2",

package/src/components/bs5/accordion/Accordion.mdx

@@ -1,22 +1,44 @@
 import { Canvas, Meta, Story, Source } from "@storybook/blocks";
 import * as AccordionStories from "./accordion.stories";
 import defaultdata from "./accordion.data.json";
+import "../../../stories/documentation/storybook-documentation.scss";
+import { StorybookDocsTabs } from "../../../stories/documentation/_storybookDocsTabs.jsx";
+import DesignResources from "./mdx/_designResources.mdx";
+import UsageInstructions from "./mdx/_usageInstructions.mdx";
 
 <Meta of={AccordionStories} />
 
 # Accordion
 
-<Canvas>
-  <Story of={AccordionStories.Default} />
-</Canvas>
+> Accordions help users see only the content they need. Accordions expand and collapse sections of content.
 
-## Design resources
+<Canvas of={AccordionStories.Default} />
 
-- [Component library (Figma)](https://www.figma.com/file/qKsxl3ogIlBp7dafgxXuCA/QLD-GOV-DDS?type=design&node-id=6276-45691&mode=design&t=chjWFr1CLu6KQXzg-4)
-- [Master component file (Figma)](https://www.figma.com/file/qKsxl3ogIlBp7dafgxXuCA/QLD-GOV-DDS?type=design&node-id=5990-98109&mode=design&t=ORVHLonASEFQzPeD-0)
-- [Design System website](https://www.design-system.health.qld.gov.au/components/accordions)
-- [Bootstrap component](https://getbootstrap.com/docs/5.3/components/accordion/)
-
-## Example Component data
-
-<Source language="json" code={JSON.stringify(defaultdata, null, 2)} />
+<StorybookDocsTabs
+  tabs={[
+    {
+      label: "Code",
+      id: "code-doc",
+      heading: "Component code",
+      content: <Source language="html" id="accordion-default" />,
+    },
+    {
+      label: "JSON",
+      id: "json-doc",
+      heading: "Example Component data",
+      content: (
+        <Source language="json" code={JSON.stringify(defaultdata, null, 2)} />
+      ),
+    },
+    {
+      label: "Design Resources",
+      id: "design-resources-doc",
+      content: <DesignResources />,
+    },
+    /* {
+      label: "Usage Instructions",
+      id: "usage-instructions-doc",
+      content: <UsageInstructions />,
+    }, */
+  ]}
+></StorybookDocsTabs>

package/src/components/bs5/accordion/__snapshots__/accordion.test.js.snap

@@ -3,7 +3,6 @@
 exports[`Accordion > Renders as expected 1`] = `
 "<!-- QGDS Component: Accordion -->
 <div class="accordion-group">
-
         <div class="accordion-toggle">
             <button class="accordion-toggle-btn accordion-toggle-btn--closed" type="button">Open all</button>
         </div>
@@ -15,7 +14,7 @@ exports[`Accordion > Renders as expected 1`] = `
                 </button>
             </h2>
 
-            <div id="collapse-One" class="accordion-collapse collapse show" aria-labelledby="heading-One">
+            <div id="collapse-One" class="accordion-collapse collapse show" aria-labelledby="heading-One" role="region">
                 <div class="accordion-body">
                     <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce dictum efficitur egestas.</p><p>Aenean sed pretium mauris. Quisque euismod in nisl et consequat.</p> 
                 </div>
@@ -28,7 +27,7 @@ exports[`Accordion > Renders as expected 1`] = `
                 </button>
             </h2>
 
-            <div id="collapse-Two" class="accordion-collapse collapse " aria-labelledby="heading-Two">
+            <div id="collapse-Two" class="accordion-collapse collapse " aria-labelledby="heading-Two" role="region">
                 <div class="accordion-body">
                     <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla vitae elit libero, a pharetra augue. Nullam id dolor id nibh ultricies vehicula ut id elit.</p><ul><li>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</li><li>Aliquam tincidunt mauris eu risus.</li><li>Vestibulum auctor dapibus neque.</li></ul>
                 </div>
@@ -41,15 +40,13 @@ exports[`Accordion > Renders as expected 1`] = `
                 </button>
             </h2>
 
-            <div id="collapse-Three" class="accordion-collapse collapse " aria-labelledby="heading-Three">
+            <div id="collapse-Three" class="accordion-collapse collapse " aria-labelledby="heading-Three" role="region">
                 <div class="accordion-body">
                     <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla vitae elit libero, a pharetra augue. Nullam id dolor id nibh ultricies vehicula ut id elit.</p><ol><li>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</li><li>Aliquam tincidunt mauris eu risus.</li><li>Vestibulum auctor dapibus neque.</li></ol>
                 </div>
             </div>
         </div>
-
     </div>
-
 </div>
 "
 `;