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

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.
@@ -84,6 +84,7 @@ const preview = {
84
84
  // Optional configuration for the a11y addon
85
85
  config: {},
86
86
  options: {
87
+ runOnly: ['wcag2a', 'wcag2aa', 'wcag21a', 'wcag21aa', 'best-practice'],
87
88
  checks: { "color-contrast": { options: { noScroll: true } } },
88
89
  restoreScroll: true,
89
90
  },
package/README.md CHANGED
@@ -1,4 +1,5 @@
1
1
  # Queensland Government Design System - Bootstrap 5 - Edition
2
+
2
3
  A Queensland Online - Design System development space
3
4
 
4
5
  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/
7
8
  Qld Health edition can be found at [design-system.health.qld.gov.au](https://www.design-system.health.qld.gov.au/).
8
9
 
9
10
  This includes:
11
+
10
12
  - Public NPM Release packages:
11
13
  - https://www.npmjs.com/package/@qld-gov-au/qgds-bootstrap5
12
14
  - https://github.com/qld-gov-au/qgds-bootstrap5/pkgs/npm/qgds-bootstrap5
13
15
  - Squiz Git bridge dist/binary repo: https://github.com/qld-gov-au/qgds-bootstrap5-release
14
16
  - Git CDN repo: https://github.com/qld-gov-au/qgds-bootstrap5-cdn
15
17
 
16
-
17
18
  ## Technical overview
18
19
 
19
20
  - ES6 Javascript
@@ -24,36 +25,38 @@ This includes:
24
25
  - CSS/SCSS, extending Bootstrap 5.3 core components with custom CSS properties
25
26
  - NPM for package management
26
27
 
27
-
28
28
  ## Documentation
29
29
 
30
30
  - Storybook examples available at [https://qld-gov-au.github.io/qgds-bootstrap5/](https://qld-gov-au.github.io/qgds-bootstrap5/)
31
31
 
32
-
33
32
  ## Development Getting started
34
33
 
35
34
  ### Personal Development
36
- This repo is designed to allow easy forking. <br/>
37
- Do enable GitHub Actions post forking and GitHub pages via GitHub actions <br/>
35
+
36
+ This repo is designed to allow easy forking. <br/>
37
+ Do enable GitHub Actions post forking and GitHub pages via GitHub actions <br/>
38
38
  Also do configure your own personal chromatic to ease development in providing delta change diff-ing.
39
39
 
40
40
  We welcome external contributors, so don't be afraid to raise PR's back to this repo for inclusion into core deployment + cdn repo.
41
41
 
42
42
  ### GitHub Actions
43
+
43
44
  This repo includes many workflows to reduce developer overheads. This includes but not limited to:
44
- * CICD on all commit's and PR's
45
- * GitHub io static document deployment based on develop/main
46
- * Dependabot auto patching + storybook upgrade feature
47
- * One click npm versioning publish (patch, minor, major) **
48
- * Auto generate release notes based on PR's created (On version Tag)
49
- * Npm js package publish (On version Tag) ***
50
- * GitHub package Publish (On version Tag) ****
51
-
52
- ** Must configure GitHub service account ssh private key loaded into GitHub actions secret ``DEPLOY_KEY``<br/>
53
- *** Must have npm js token loaded into GitHub actions secrets ``NPM_TOKEN`` to allow publishing.<br/>
54
- **** 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``.
45
+
46
+ - CICD on all commit's and PR's
47
+ - GitHub io static document deployment based on develop/main
48
+ - Dependabot auto patching + storybook upgrade feature
49
+ - One click npm versioning publish (patch, minor, major) **
50
+ - Auto generate release notes based on PR's created (On version Tag)
51
+ - Npm js package publish (On version Tag) ***
52
+ - GitHub package Publish (On version Tag) ****
53
+
54
+ ** Must configure GitHub service account ssh private key loaded into GitHub actions secret `DEPLOY_KEY` <br>
55
+ *** Must have npm js token loaded into GitHub actions secrets `NPM_TOKEN` to allow publishing. <br>
56
+ **** 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`.
55
57
 
56
58
  ### Quick build
59
+
57
60
  If you hava java and maven installed. This will pull in a local node/npm version and run through the full lifecycle build.
58
61
 
59
62
  ```bash
@@ -63,59 +66,80 @@ mvn install
63
66
  ```
64
67
 
65
68
  ### Standard build
69
+
66
70
  1. Download
67
-
68
- ```bash
69
- git clone https://github.com/qld-gov-au/qgds-bootstrap5
70
- ```
71
+
72
+ ```bash
73
+ git clone https://github.com/qld-gov-au/qgds-bootstrap5
74
+ ```
71
75
 
72
76
  2. Setup
73
77
 
74
78
  Prerequisites
79
+
75
80
  - Node 18.17.1+
76
81
  - NPM 10.2.5+
77
82
 
78
83
  3. Install dependencies
79
-
80
- ```bash
81
- npm install
82
- ```
84
+
85
+ ```bash
86
+ npm install
87
+ ```
83
88
 
84
89
  4. Build the Design System CSS, Components and templates
85
-
86
- ```bash
87
- npm run build
88
- ```
89
-
90
- 6. Start Watch and Storybook for component development
91
-
92
- ```bash
93
- npm run dev-storybook
94
- ```
95
- Alt:
96
- ```bash
97
- npm run watch
98
- npm run storybook
99
- ```
100
-
101
- 7. Lint
90
+
91
+ ```bash
92
+ npm run build
93
+ ```
94
+
95
+ 5. Start Watch and Storybook for component development
96
+
97
+ ```bash
98
+ npm run dev-storybook
99
+ ```
100
+
101
+ Alt:
102
+
103
+ ```bash
104
+ npm run watch
105
+ npm run storybook
106
+ ```
107
+
108
+ 6. Lint
102
109
  ```bash
103
110
  npm run lint
104
111
  ```
105
112
 
106
- * Static view, start a local server from /dist folder
107
-
108
- ```bash
109
- npm run serve
110
- ```
113
+ - Static view, start a local server from /dist folder
114
+
115
+ ```bash
116
+ npm run serve
117
+ ```
118
+
119
+ - Next steps
120
+
121
+ - HTML templating using drop in components
122
+
123
+ If you wish to use the includes handle bars, please ensure
124
+ "handlebars": "4.7.8" + is loaded prior to running handlebars.helpers.bundle.js
111
125
 
112
- * Next steps
126
+ - Dev build and testing branching
113
127
 
114
- - HTML templating using drop in components
115
-
116
- If you wish to use the includes handle bars, please ensure
117
- "handlebars": "4.7.8" + is loaded prior to running handlebars.helpers.bundle.js
118
- - Dev build and testing branching
128
+ ### Unit Tests
129
+
130
+ In addition to manual testing via storybook, unit tests may be created and run via `vitest`.
131
+
132
+ ```
133
+ npm run test
134
+ ```
135
+
136
+ or use the browser based ui
137
+
138
+ ```
139
+ npm run test:ui
140
+ ```
141
+
142
+ See `src/components/bs5/accordion/accordion.test.js` for example unit test including snapshot and interaction tests with JSDOM.
119
143
 
120
144
  ### IDE Development suggestions
121
145
 
@@ -125,4 +149,15 @@ We recommend using VSCode as the IDE for development with the following plugins:
125
149
  - ESLint
126
150
  - Mustache JS or Handlebars JS template support
127
151
 
128
- Webstorm also works.
152
+ Webstorm also works.
153
+
154
+
155
+ ### Accessibility
156
+
157
+ We are committed to making this project accessible and inclusive for all users.
158
+
159
+ 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.
160
+
161
+ We follow the Queensland Government’s digital accessibility requirements to provide equal access to information, services, and opportunities for everyone.
162
+
163
+ 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 CHANGED
@@ -1,4 +1,5 @@
1
1
  # Queensland Government Design System - Bootstrap 5 - Edition
2
+
2
3
  A Queensland Online - Design System development space
3
4
 
4
5
  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/
7
8
  Qld Health edition can be found at [design-system.health.qld.gov.au](https://www.design-system.health.qld.gov.au/).
8
9
 
9
10
  This includes:
11
+
10
12
  - Public NPM Release packages:
11
13
  - https://www.npmjs.com/package/@qld-gov-au/qgds-bootstrap5
12
14
  - https://github.com/qld-gov-au/qgds-bootstrap5/pkgs/npm/qgds-bootstrap5
13
15
  - Squiz Git bridge dist/binary repo: https://github.com/qld-gov-au/qgds-bootstrap5-release
14
16
  - Git CDN repo: https://github.com/qld-gov-au/qgds-bootstrap5-cdn
15
17
 
16
-
17
18
  ## Technical overview
18
19
 
19
20
  - ES6 Javascript
@@ -24,36 +25,38 @@ This includes:
24
25
  - CSS/SCSS, extending Bootstrap 5.3 core components with custom CSS properties
25
26
  - NPM for package management
26
27
 
27
-
28
28
  ## Documentation
29
29
 
30
30
  - Storybook examples available at [https://qld-gov-au.github.io/qgds-bootstrap5/](https://qld-gov-au.github.io/qgds-bootstrap5/)
31
31
 
32
-
33
32
  ## Development Getting started
34
33
 
35
34
  ### Personal Development
36
- This repo is designed to allow easy forking. <br/>
37
- Do enable GitHub Actions post forking and GitHub pages via GitHub actions <br/>
35
+
36
+ This repo is designed to allow easy forking. <br/>
37
+ Do enable GitHub Actions post forking and GitHub pages via GitHub actions <br/>
38
38
  Also do configure your own personal chromatic to ease development in providing delta change diff-ing.
39
39
 
40
40
  We welcome external contributors, so don't be afraid to raise PR's back to this repo for inclusion into core deployment + cdn repo.
41
41
 
42
42
  ### GitHub Actions
43
+
43
44
  This repo includes many workflows to reduce developer overheads. This includes but not limited to:
44
- * CICD on all commit's and PR's
45
- * GitHub io static document deployment based on develop/main
46
- * Dependabot auto patching + storybook upgrade feature
47
- * One click npm versioning publish (patch, minor, major) **
48
- * Auto generate release notes based on PR's created (On version Tag)
49
- * Npm js package publish (On version Tag) ***
50
- * GitHub package Publish (On version Tag) ****
51
-
52
- ** Must configure GitHub service account ssh private key loaded into GitHub actions secret ``DEPLOY_KEY``<br/>
53
- *** Must have npm js token loaded into GitHub actions secrets ``NPM_TOKEN`` to allow publishing.<br/>
54
- **** 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``.
45
+
46
+ - CICD on all commit's and PR's
47
+ - GitHub io static document deployment based on develop/main
48
+ - Dependabot auto patching + storybook upgrade feature
49
+ - One click npm versioning publish (patch, minor, major) **
50
+ - Auto generate release notes based on PR's created (On version Tag)
51
+ - Npm js package publish (On version Tag) ***
52
+ - GitHub package Publish (On version Tag) ****
53
+
54
+ ** Must configure GitHub service account ssh private key loaded into GitHub actions secret `DEPLOY_KEY` <br>
55
+ *** Must have npm js token loaded into GitHub actions secrets `NPM_TOKEN` to allow publishing. <br>
56
+ **** 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`.
55
57
 
56
58
  ### Quick build
59
+
57
60
  If you hava java and maven installed. This will pull in a local node/npm version and run through the full lifecycle build.
58
61
 
59
62
  ```bash
@@ -63,59 +66,80 @@ mvn install
63
66
  ```
64
67
 
65
68
  ### Standard build
69
+
66
70
  1. Download
67
-
68
- ```bash
69
- git clone https://github.com/qld-gov-au/qgds-bootstrap5
70
- ```
71
+
72
+ ```bash
73
+ git clone https://github.com/qld-gov-au/qgds-bootstrap5
74
+ ```
71
75
 
72
76
  2. Setup
73
77
 
74
78
  Prerequisites
79
+
75
80
  - Node 18.17.1+
76
81
  - NPM 10.2.5+
77
82
 
78
83
  3. Install dependencies
79
-
80
- ```bash
81
- npm install
82
- ```
84
+
85
+ ```bash
86
+ npm install
87
+ ```
83
88
 
84
89
  4. Build the Design System CSS, Components and templates
85
-
86
- ```bash
87
- npm run build
88
- ```
89
-
90
- 6. Start Watch and Storybook for component development
91
-
92
- ```bash
93
- npm run dev-storybook
94
- ```
95
- Alt:
96
- ```bash
97
- npm run watch
98
- npm run storybook
99
- ```
100
-
101
- 7. Lint
90
+
91
+ ```bash
92
+ npm run build
93
+ ```
94
+
95
+ 5. Start Watch and Storybook for component development
96
+
97
+ ```bash
98
+ npm run dev-storybook
99
+ ```
100
+
101
+ Alt:
102
+
103
+ ```bash
104
+ npm run watch
105
+ npm run storybook
106
+ ```
107
+
108
+ 6. Lint
102
109
  ```bash
103
110
  npm run lint
104
111
  ```
105
112
 
106
- * Static view, start a local server from /dist folder
107
-
108
- ```bash
109
- npm run serve
110
- ```
113
+ - Static view, start a local server from /dist folder
114
+
115
+ ```bash
116
+ npm run serve
117
+ ```
118
+
119
+ - Next steps
120
+
121
+ - HTML templating using drop in components
122
+
123
+ If you wish to use the includes handle bars, please ensure
124
+ "handlebars": "4.7.8" + is loaded prior to running handlebars.helpers.bundle.js
111
125
 
112
- * Next steps
126
+ - Dev build and testing branching
113
127
 
114
- - HTML templating using drop in components
115
-
116
- If you wish to use the includes handle bars, please ensure
117
- "handlebars": "4.7.8" + is loaded prior to running handlebars.helpers.bundle.js
118
- - Dev build and testing branching
128
+ ### Unit Tests
129
+
130
+ In addition to manual testing via storybook, unit tests may be created and run via `vitest`.
131
+
132
+ ```
133
+ npm run test
134
+ ```
135
+
136
+ or use the browser based ui
137
+
138
+ ```
139
+ npm run test:ui
140
+ ```
141
+
142
+ See `src/components/bs5/accordion/accordion.test.js` for example unit test including snapshot and interaction tests with JSDOM.
119
143
 
120
144
  ### IDE Development suggestions
121
145
 
@@ -125,4 +149,15 @@ We recommend using VSCode as the IDE for development with the following plugins:
125
149
  - ESLint
126
150
  - Mustache JS or Handlebars JS template support
127
151
 
128
- Webstorm also works.
152
+ Webstorm also works.
153
+
154
+
155
+ ### Accessibility
156
+
157
+ We are committed to making this project accessible and inclusive for all users.
158
+
159
+ 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.
160
+
161
+ We follow the Queensland Government’s digital accessibility requirements to provide equal access to information, services, and opportunities for everyone.
162
+
163
+ If you encounter any accessibility issues or have suggestions for improvement, please feel free to raise an issue or contact the project team.
@@ -1,5 +1,5 @@
1
1
 
2
- <!-- VERSION_DETAILS={"project_id":"@qld-gov-au/qgds-bootstrap5","version":"1.1.34","branch":"HEAD","tag":"v1.1.34","commit":"306923061d7a6e658dd317f2bbb3e1b0ae852917","majorVersion":"v1"} -->
2
+ <!-- VERSION_DETAILS={"project_id":"@qld-gov-au/qgds-bootstrap5","version":"1.1.35","branch":"HEAD","tag":"v1.1.35","commit":"7da4102f39c5b2c4bbf5f64d5a57774a0f80d2dc","majorVersion":"v1"} -->
3
3
 
4
4
  {{! Select environment, used verbatium if not using predefind key
5
5
  cdn := PROD|STAGING|BETA|TEST|DEV|???
@@ -7,7 +7,7 @@
7
7
 
8
8
  {{!-- Header for mobile navigation --}}
9
9
  <div class="navbar__header">
10
- <h6 class="navbar__heading">Menu</h6>
10
+ <h3 class="navbar__heading">Menu</h3>
11
11
  <button aria-controls="main-nav" class="navbar__toggle navbar__toggle--close" data-bs-toggle="collapse"
12
12
  data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent"
13
13
  aria-expanded="false" aria-label="Close menu">
@@ -22,7 +22,7 @@
22
22
  <ul class="navbar-nav me-auto mb-2 mb-lg-0">
23
23
  <li class="nav-item nav-item-home">
24
24
  <a class="nav-link {{#if metadata.options.home-active}}nav-link-home-active{{/if}}"
25
- href="{{metadata.target_url}}">
25
+ href="{{metadata.target_url}}" {{#if metadata.options.home-active}}aria-label="Home"{{/if}}>
26
26
  <svg aria-hidden="true" focusable="false" xmlns="http://www.w3.org/2000/svg" class="qld__icon">
27
27
  <use
28
28
  href="{{#if metadata.options.icon-root}}{{metadata.options.icon-root}}#qld__icon__home{{/if}}">