@qld-gov-au/qgds-bootstrap5 1.1.34 → 1.1.36

package/.storybook/preview.js

@@ -84,6 +84,7 @@ const preview = {
       // Optional configuration for the a11y addon
       config: {},
       options: {
+        runOnly: ['wcag2a', 'wcag2aa', 'wcag21a', 'wcag21aa', 'best-practice'],
         checks: { "color-contrast": { options: { noScroll: true } } },
         restoreScroll: true,
       },

package/README.md

@@ -1,4 +1,5 @@
 # Queensland Government Design System - Bootstrap 5 - Edition
+
 A Queensland Online - Design System development space
 
 Please see [For Gov - Queensland Government Design System](https://www.forgov.qld.gov.au/information-and-communication-technology/communication-and-publishing/website-and-digital-publishing/website-standards-guidelines-and-templates/queensland-government-design-system) for more details.
@@ -7,13 +8,13 @@ This is a BS5 flavour based on [QGDS Figma Design](https://www.figma.com/design/
 Qld Health edition can be found at [design-system.health.qld.gov.au](https://www.design-system.health.qld.gov.au/).
 
 This includes:
+
 - Public NPM Release packages:
   - https://www.npmjs.com/package/@qld-gov-au/qgds-bootstrap5
   - https://github.com/qld-gov-au/qgds-bootstrap5/pkgs/npm/qgds-bootstrap5
 - Squiz Git bridge dist/binary repo: https://github.com/qld-gov-au/qgds-bootstrap5-release
 - Git CDN repo: https://github.com/qld-gov-au/qgds-bootstrap5-cdn
 
-
 ## Technical overview
 
 - ES6 Javascript
@@ -24,36 +25,38 @@ This includes:
 - CSS/SCSS, extending Bootstrap 5.3 core components with custom CSS properties
 - NPM for package management
 
-
 ## Documentation
 
 - Storybook examples available at [https://qld-gov-au.github.io/qgds-bootstrap5/](https://qld-gov-au.github.io/qgds-bootstrap5/)
 
-
 ## Development Getting started
 
 ### Personal Development
-This repo is designed to allow easy forking.  <br/>
-Do enable GitHub Actions post forking and GitHub pages via GitHub actions  <br/>
+
+This repo is designed to allow easy forking. <br/>
+Do enable GitHub Actions post forking and GitHub pages via GitHub actions <br/>
 Also do configure your own personal chromatic to ease development in providing delta change diff-ing.
 
 We welcome external contributors, so don't be afraid to raise PR's back to this repo for inclusion into core deployment + cdn repo.
 
 ### GitHub Actions
+
 This repo includes many workflows to reduce developer overheads. This includes but not limited to:
-* CICD on all commit's and PR's
-* GitHub io static document deployment based on develop/main
-* Dependabot auto patching + storybook upgrade feature
-* One click npm versioning publish (patch, minor, major) **
-* Auto generate release notes based on PR's created (On version Tag)
-* Npm js package publish (On version Tag) ***
-* GitHub package Publish (On version Tag) ****
-
-** Must configure GitHub service account ssh private key loaded into GitHub actions secret ``DEPLOY_KEY``<br/>
-*** Must have npm js token loaded into GitHub actions secrets ``NPM_TOKEN`` to allow publishing.<br/>
-**** Switch's @qld-gov-au with forked username (lowercase) and publish to your account see .github/workflows/githubPackage.yml step ``Update package scope, export package name``.
+
+- CICD on all commit's and PR's
+- GitHub io static document deployment based on develop/main
+- Dependabot auto patching + storybook upgrade feature
+- One click npm versioning publish (patch, minor, major) **
+- Auto generate release notes based on PR's created (On version Tag)
+- Npm js package publish (On version Tag) ***
+- GitHub package Publish (On version Tag) ****
+
+** Must configure GitHub service account ssh private key loaded into GitHub actions secret `DEPLOY_KEY` <br>
+*** Must have npm js token loaded into GitHub actions secrets `NPM_TOKEN` to allow publishing. <br>
+**** Switch's @qld-gov-au with forked username (lowercase) and publish to your account see .github/workflows/githubPackage.yml step `Update package scope, export package name`.
 
 ### Quick build
+
 If you hava java and maven installed. This will pull in a local node/npm version and run through the full lifecycle build.
 
 ```bash
@@ -63,59 +66,80 @@ mvn install
 ```
 
 ### Standard build
+
 1. Download
-  
-    ```bash
-    git clone https://github.com/qld-gov-au/qgds-bootstrap5
-    ```
+
+   ```bash
+   git clone https://github.com/qld-gov-au/qgds-bootstrap5
+   ```
 
 2. Setup
 
    Prerequisites
+
    - Node 18.17.1+
    - NPM 10.2.5+
 
 3. Install dependencies
-    
-    ```bash
-    npm install
-    ```
+
+   ```bash
+   npm install
+   ```
 
 4. Build the Design System CSS, Components and templates
-    
-    ```bash
-    npm run build
-    ```
-
-6.  Start Watch and Storybook for component development
-        
-    ```bash
-    npm run dev-storybook
-    ```
-     Alt:
-     ```bash
-     npm run watch
-     npm run storybook
-     ```
-
-7. Lint
+
+   ```bash
+   npm run build
+   ```
+
+5. Start Watch and Storybook for component development
+
+   ```bash
+   npm run dev-storybook
+   ```
+
+   Alt:
+
+   ```bash
+   npm run watch
+   npm run storybook
+   ```
+
+6. Lint
    ```bash
    npm run lint
    ```
 
-* Static view, start a local server from /dist folder
-    
-    ```bash
-    npm run serve
-    ```
+- Static view, start a local server from /dist folder
+
+  ```bash
+  npm run serve
+  ```
+
+- Next steps
+
+  - HTML templating using drop in components
+
+    If you wish to use the includes handle bars, please ensure
+    "handlebars": "4.7.8" + is loaded prior to running handlebars.helpers.bundle.js
 
-* Next steps
+  - Dev build and testing branching
 
-   - HTML templating using drop in components 
-  
-     If you wish to use the includes handle bars, please ensure 
-   "handlebars": "4.7.8" + is loaded prior to running handlebars.helpers.bundle.js
-   - Dev build and testing branching
+### Unit Tests
+
+In addition to manual testing via storybook, unit tests may be created and run via `vitest`.
+
+```
+npm run test
+```
+
+or use the browser based ui
+
+```
+npm run test:ui
+```
+
+See `src/components/bs5/accordion/accordion.test.js` for example unit test including snapshot and interaction tests with JSDOM.
 
 ### IDE Development suggestions
 
@@ -125,4 +149,15 @@ We recommend using VSCode as the IDE for development with the following plugins:
 - ESLint
 - Mustache JS or Handlebars JS template support
 
-Webstorm also works.
+Webstorm also works.
+
+
+### Accessibility
+ 
+We are committed to making this project accessible and inclusive for all users.
+ 
+This project is tested against the Web Content Accessibility Guidelines (WCAG) 2.1 at Level AA to ensure it meets a high standard of accessibility.
+ 
+We follow the Queensland Government’s digital accessibility requirements to provide equal access to information, services, and opportunities for everyone.
+ 
+If you encounter any accessibility issues or have suggestions for improvement, please feel free to raise an issue or contact the project team.

package/dist/README.md

@@ -1,4 +1,5 @@
 # Queensland Government Design System - Bootstrap 5 - Edition
+
 A Queensland Online - Design System development space
 
 Please see [For Gov - Queensland Government Design System](https://www.forgov.qld.gov.au/information-and-communication-technology/communication-and-publishing/website-and-digital-publishing/website-standards-guidelines-and-templates/queensland-government-design-system) for more details.
@@ -7,13 +8,13 @@ This is a BS5 flavour based on [QGDS Figma Design](https://www.figma.com/design/
 Qld Health edition can be found at [design-system.health.qld.gov.au](https://www.design-system.health.qld.gov.au/).
 
 This includes:
+
 - Public NPM Release packages:
   - https://www.npmjs.com/package/@qld-gov-au/qgds-bootstrap5
   - https://github.com/qld-gov-au/qgds-bootstrap5/pkgs/npm/qgds-bootstrap5
 - Squiz Git bridge dist/binary repo: https://github.com/qld-gov-au/qgds-bootstrap5-release
 - Git CDN repo: https://github.com/qld-gov-au/qgds-bootstrap5-cdn
 
-
 ## Technical overview
 
 - ES6 Javascript
@@ -24,36 +25,38 @@ This includes:
 - CSS/SCSS, extending Bootstrap 5.3 core components with custom CSS properties
 - NPM for package management
 
-
 ## Documentation
 
 - Storybook examples available at [https://qld-gov-au.github.io/qgds-bootstrap5/](https://qld-gov-au.github.io/qgds-bootstrap5/)
 
-
 ## Development Getting started
 
 ### Personal Development
-This repo is designed to allow easy forking.  <br/>
-Do enable GitHub Actions post forking and GitHub pages via GitHub actions  <br/>
+
+This repo is designed to allow easy forking. <br/>
+Do enable GitHub Actions post forking and GitHub pages via GitHub actions <br/>
 Also do configure your own personal chromatic to ease development in providing delta change diff-ing.
 
 We welcome external contributors, so don't be afraid to raise PR's back to this repo for inclusion into core deployment + cdn repo.
 
 ### GitHub Actions
+
 This repo includes many workflows to reduce developer overheads. This includes but not limited to:
-* CICD on all commit's and PR's
-* GitHub io static document deployment based on develop/main
-* Dependabot auto patching + storybook upgrade feature
-* One click npm versioning publish (patch, minor, major) **
-* Auto generate release notes based on PR's created (On version Tag)
-* Npm js package publish (On version Tag) ***
-* GitHub package Publish (On version Tag) ****
-
-** Must configure GitHub service account ssh private key loaded into GitHub actions secret ``DEPLOY_KEY``<br/>
-*** Must have npm js token loaded into GitHub actions secrets ``NPM_TOKEN`` to allow publishing.<br/>
-**** Switch's @qld-gov-au with forked username (lowercase) and publish to your account see .github/workflows/githubPackage.yml step ``Update package scope, export package name``.
+
+- CICD on all commit's and PR's
+- GitHub io static document deployment based on develop/main
+- Dependabot auto patching + storybook upgrade feature
+- One click npm versioning publish (patch, minor, major) **
+- Auto generate release notes based on PR's created (On version Tag)
+- Npm js package publish (On version Tag) ***
+- GitHub package Publish (On version Tag) ****
+
+** Must configure GitHub service account ssh private key loaded into GitHub actions secret `DEPLOY_KEY` <br>
+*** Must have npm js token loaded into GitHub actions secrets `NPM_TOKEN` to allow publishing. <br>
+**** Switch's @qld-gov-au with forked username (lowercase) and publish to your account see .github/workflows/githubPackage.yml step `Update package scope, export package name`.
 
 ### Quick build
+
 If you hava java and maven installed. This will pull in a local node/npm version and run through the full lifecycle build.
 
 ```bash
@@ -63,59 +66,80 @@ mvn install
 ```
 
 ### Standard build
+
 1. Download
-  
-    ```bash
-    git clone https://github.com/qld-gov-au/qgds-bootstrap5
-    ```
+
+   ```bash
+   git clone https://github.com/qld-gov-au/qgds-bootstrap5
+   ```
 
 2. Setup
 
    Prerequisites
+
    - Node 18.17.1+
    - NPM 10.2.5+
 
 3. Install dependencies
-    
-    ```bash
-    npm install
-    ```
+
+   ```bash
+   npm install
+   ```
 
 4. Build the Design System CSS, Components and templates
-    
-    ```bash
-    npm run build
-    ```
-
-6.  Start Watch and Storybook for component development
-        
-    ```bash
-    npm run dev-storybook
-    ```
-     Alt:
-     ```bash
-     npm run watch
-     npm run storybook
-     ```
-
-7. Lint
+
+   ```bash
+   npm run build
+   ```
+
+5. Start Watch and Storybook for component development
+
+   ```bash
+   npm run dev-storybook
+   ```
+
+   Alt:
+
+   ```bash
+   npm run watch
+   npm run storybook
+   ```
+
+6. Lint
    ```bash
    npm run lint
    ```
 
-* Static view, start a local server from /dist folder
-    
-    ```bash
-    npm run serve
-    ```
+- Static view, start a local server from /dist folder
+
+  ```bash
+  npm run serve
+  ```
+
+- Next steps
+
+  - HTML templating using drop in components
+
+    If you wish to use the includes handle bars, please ensure
+    "handlebars": "4.7.8" + is loaded prior to running handlebars.helpers.bundle.js
 
-* Next steps
+  - Dev build and testing branching
 
-   - HTML templating using drop in components 
-  
-     If you wish to use the includes handle bars, please ensure 
-   "handlebars": "4.7.8" + is loaded prior to running handlebars.helpers.bundle.js
-   - Dev build and testing branching
+### Unit Tests
+
+In addition to manual testing via storybook, unit tests may be created and run via `vitest`.
+
+```
+npm run test
+```
+
+or use the browser based ui
+
+```
+npm run test:ui
+```
+
+See `src/components/bs5/accordion/accordion.test.js` for example unit test including snapshot and interaction tests with JSDOM.
 
 ### IDE Development suggestions
 
@@ -125,4 +149,15 @@ We recommend using VSCode as the IDE for development with the following plugins:
 - ESLint
 - Mustache JS or Handlebars JS template support
 
-Webstorm also works.
+Webstorm also works.
+
+
+### Accessibility
+ 
+We are committed to making this project accessible and inclusive for all users.
+ 
+This project is tested against the Web Content Accessibility Guidelines (WCAG) 2.1 at Level AA to ensure it meets a high standard of accessibility.
+ 
+We follow the Queensland Government’s digital accessibility requirements to provide equal access to information, services, and opportunities for everyone.
+ 
+If you encounter any accessibility issues or have suggestions for improvement, please feel free to raise an issue or contact the project team.

package/dist/assets/components/bs5/head/head.hbs

@@ -1,5 +1,5 @@
 
-<!-- VERSION_DETAILS={"project_id":"@qld-gov-au/qgds-bootstrap5","version":"1.1.34","branch":"HEAD","tag":"v1.1.34","commit":"306923061d7a6e658dd317f2bbb3e1b0ae852917","majorVersion":"v1"} -->
+<!-- VERSION_DETAILS={"project_id":"@qld-gov-au/qgds-bootstrap5","version":"1.1.36","branch":"HEAD","tag":"v1.1.36","commit":"f8912c5d402fe41524ddf37d6a38401e4344b832","majorVersion":"v1"} -->
 
 {{! Select environment, used verbatium if not using predefind key
 cdn := PROD|STAGING|BETA|TEST|DEV|???

package/dist/assets/components/bs5/navbar/navbar.hbs

@@ -7,7 +7,7 @@
 
             {{!-- Header for mobile navigation --}}
             <div class="navbar__header">
-                <h6 class="navbar__heading">Menu</h6>
+                <h3 class="navbar__heading">Menu</h3>
                 <button aria-controls="main-nav" class="navbar__toggle navbar__toggle--close" data-bs-toggle="collapse"
                     data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent"
                     aria-expanded="false" aria-label="Close menu">
@@ -22,7 +22,7 @@
             <ul class="navbar-nav me-auto mb-2 mb-lg-0">
                 <li class="nav-item nav-item-home">
                     <a class="nav-link {{#if metadata.options.home-active}}nav-link-home-active{{/if}}"
-                        href="{{metadata.target_url}}">
+                        href="{{metadata.target_url}}" {{#if metadata.options.home-active}}aria-label="Home"{{/if}}>
                         <svg aria-hidden="true" focusable="false" xmlns="http://www.w3.org/2000/svg" class="qld__icon">
                             <use
                                 href="{{#if metadata.options.icon-root}}{{metadata.options.icon-root}}#qld__icon__home{{/if}}">