@qld-gov-au/qgds-bootstrap5 1.1.38 → 1.1.39

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 (53) hide show
  1. package/.storybook/preview-head.html +16 -17
  2. package/.storybook/preview.js +4 -4
  3. package/dist/assets/components/bs5/globalAlert/globalAlert.hbs +26 -14
  4. package/dist/assets/components/bs5/head/head.hbs +1 -1
  5. package/dist/assets/components/bs5/icons/icon.hbs +3 -0
  6. package/dist/assets/components/bs5/searchInput/searchInput.hbs +1 -1
  7. package/dist/assets/components/bs5/skiplinks/skipLinks.hbs +5 -0
  8. package/dist/assets/css/qld.bootstrap.css +1 -1
  9. package/dist/assets/css/qld.bootstrap.css.map +3 -3
  10. package/dist/assets/js/handlebars.init.min.js +64 -47
  11. package/dist/assets/js/handlebars.init.min.js.map +4 -4
  12. package/dist/assets/js/handlebars.partials.js +4 -0
  13. package/dist/assets/js/qld.bootstrap.min.js +4 -4
  14. package/dist/assets/js/qld.bootstrap.min.js.map +4 -4
  15. package/dist/assets/node/handlebars.init.min.js +58 -3
  16. package/dist/assets/node/handlebars.init.min.js.map +3 -3
  17. package/dist/components/bs5/globalAlert/globalAlert.hbs +26 -14
  18. package/dist/components/bs5/head/head.hbs +1 -1
  19. package/dist/components/bs5/icons/icon.hbs +3 -0
  20. package/dist/components/bs5/searchInput/searchInput.hbs +1 -1
  21. package/dist/components/bs5/skiplinks/skipLinks.hbs +5 -0
  22. package/dist/components/handlebars.partials.js +4 -0
  23. package/dist/package.json +1 -1
  24. package/dist/sample-data/globalAlert/globalAlert.data.json +82 -61
  25. package/dist/sample-data/skiplinks/skipLinks.data.json +12 -0
  26. package/package.json +1 -1
  27. package/src/components/bs5/globalAlert/globalAlert.data.json +82 -61
  28. package/src/components/bs5/globalAlert/globalAlert.function.js +72 -0
  29. package/src/components/bs5/globalAlert/globalAlert.hbs +26 -14
  30. package/src/components/bs5/globalAlert/globalAlert.scss +193 -173
  31. package/src/components/bs5/globalAlert/globalAlert.test.js +348 -0
  32. package/src/components/bs5/icons/icon.hbs +3 -0
  33. package/src/components/bs5/searchInput/__snapshots__/searchInput.test.js.snap +46 -0
  34. package/src/components/bs5/searchInput/search.functions.js +12 -12
  35. package/src/components/bs5/searchInput/searchInput.hbs +1 -1
  36. package/src/components/bs5/searchInput/searchInput.scss +0 -1
  37. package/src/components/bs5/searchInput/searchInput.test.js +419 -0
  38. package/src/components/bs5/skiplinks/SkipLinks.js +11 -0
  39. package/src/components/bs5/skiplinks/SkipLinks.mdx +33 -0
  40. package/src/components/bs5/skiplinks/__snapshots__/skipLinks.test.js.snap +8 -0
  41. package/src/components/bs5/skiplinks/skipLinks.data.json +12 -0
  42. package/src/components/bs5/skiplinks/skipLinks.functions.js +29 -0
  43. package/src/components/bs5/skiplinks/skipLinks.hbs +5 -0
  44. package/src/components/bs5/skiplinks/skipLinks.scss +43 -0
  45. package/src/components/bs5/skiplinks/skipLinks.stories.js +29 -0
  46. package/src/components/bs5/skiplinks/skipLinks.test.js +80 -0
  47. package/src/css/main.scss +18 -6
  48. package/src/css/mixins/focusable.scss +1 -6
  49. package/src/js/handlebars.partials.js +4 -0
  50. package/src/js/qld.bootstrap.js +70 -25
  51. package/src/js/testingutils.js +80 -12
  52. package/src/js/utils.js +49 -0
  53. package/src/stories/integration/globalAlert.data.json +3 -2
@@ -1,24 +1,23 @@
1
1
  <!-- Refer: https://storybook.js.org/docs/configure/story-rendering#adding-to-head -->
2
2
 
3
3
  <style>
4
- #storybook-docs .docblock-argstable-head th:nth-of-type(1) {
5
- min-width: 20% !important;
6
- }
4
+ #storybook-docs .docblock-argstable-head th:nth-of-type(1) {
5
+ min-width: 20% !important;
6
+ }
7
7
 
8
- #storybook-docs .docblock-argstable-head th:nth-of-type(2) {
9
- min-width: 25% !important;
10
- }
8
+ #storybook-docs .docblock-argstable-head th:nth-of-type(2) {
9
+ min-width: 25% !important;
10
+ }
11
11
 
12
- #storybook-docs .docblock-argstable-head th:nth-of-type(3) {
13
- min-width: 20% !important;
14
- }
12
+ #storybook-docs .docblock-argstable-head th:nth-of-type(3) {
13
+ min-width: 20% !important;
14
+ }
15
15
 
16
- #storybook-docs .docblock-argstable-head th:nth-of-type(4) {
17
- min-width: 35% !important;
18
- }
16
+ #storybook-docs .docblock-argstable-head th:nth-of-type(4) {
17
+ min-width: 35% !important;
18
+ }
19
19
 
20
-
21
- #storybook-docs .docblock-argstable-body textarea {
22
- /* min-height: 100px; */
23
- }
24
- </style>
20
+ #storybook-docs .docblock-argstable-body textarea {
21
+ /* min-height: 100px; */
22
+ }
23
+ </style>
@@ -84,7 +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
+ runOnly: ["wcag2a", "wcag2aa", "wcag21a", "wcag21aa", "best-practice"],
88
88
  checks: { "color-contrast": { options: { noScroll: true } } },
89
89
  restoreScroll: true,
90
90
  },
@@ -103,11 +103,11 @@ const preview = {
103
103
  },
104
104
  defaultTheme: "None",
105
105
  }),
106
- (Story, { parameters }) => {
106
+ (Story, { parameters }) => {
107
107
  init(Handlebars);
108
- const { pageLayout, wrapperClasses} = parameters;
108
+ const { pageLayout, wrapperClasses } = parameters;
109
109
  switch (pageLayout) {
110
- case 'with-wrapper':
110
+ case "with-wrapper":
111
111
  return `
112
112
  <div class="${wrapperClasses}">
113
113
  ${Story()}
@@ -2,23 +2,35 @@
2
2
 
3
3
  <div class="global-alert-include">
4
4
  {{#each alertItems}}
5
- <section class="global-alert {{variant}}">
6
- <div class="container-fluid">
7
- <div class="qld-global-alert-main">
8
- <div class="global-alert-icon"></div>
9
- <div class="global-alert-content">
10
- <div class="global-alert-message">
11
- {{{content}}}
12
- </div>
13
- <div class="global-alert-action">
14
- {{{action}}}
15
- </div>
5
+ <section role="region" class="global-alert alert container-full d-none {{variant}}" data-variant="{{variant}}"
6
+ aria-label="{{ariaLabel}}" {{#if id}} data-id="{{id}}" {{/if}}{{#if dismissedExpiryDays}}
7
+ data-expiry-days="{{dismissedExpiryDays}}" {{/if}}>
8
+ <div class="qld-global-alert-main">
9
+ <div class="global-alert-icon">
10
+ {{#ifCond variant '==' 'global-alert-critical'}}
11
+ <span class="qld-icon qld-icon-sm qld-icon-alert-danger" aria-hidden="true"></span>
12
+ {{else ifCond variant '==' 'global-alert-info'}}
13
+ <span class="qld-icon qld-icon-sm qld-icon-alert-information" aria-hidden="true"></span>
14
+ {{else ifCond variant '==' 'global-alert-warning'}}
15
+ <span class="qld-icon qld-icon-sm qld-icon-alert-warning" aria-hidden="true"></span>
16
+ {{/ifCond}}
17
+ </div>
18
+
19
+ <div class="global-alert-content">
20
+ <div class="global-alert-message">
21
+ {{{content}}}
16
22
  </div>
17
- <div class="global-alert-close">
18
- <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
23
+ <div class="global-alert-action">
24
+ {{{action}}}
25
+ <span class="qld-icon qld-icon-sm qld-icon-arrow-right" aria-hidden="true"></span>
19
26
  </div>
20
27
  </div>
28
+ {{#unless preventDismiss}}
29
+ <div class="global-alert-close">
30
+ <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
31
+ </div>
32
+ {{/unless}}
21
33
  </div>
22
34
  </section>
23
35
  {{/each }}
24
- </div>
36
+ </div>
@@ -1,5 +1,5 @@
1
1
 
2
- <!-- VERSION_DETAILS={"project_id":"@qld-gov-au/qgds-bootstrap5","version":"1.1.38","branch":"HEAD","tag":"v1.1.38","commit":"53a0cabf2e516a0a3b538aaee73fd92256da4876","majorVersion":"v1"} -->
2
+ <!-- VERSION_DETAILS={"project_id":"@qld-gov-au/qgds-bootstrap5","version":"1.1.39","branch":"HEAD","tag":"v1.1.39","commit":"2c736f6031ec90b38234ebcca5143d85d60c1aa1","majorVersion":"v1"} -->
3
3
 
4
4
  {{! Select environment, used verbatium if not using predefind key
5
5
  cdn := PROD|STAGING|BETA|TEST|DEV|???
@@ -0,0 +1,3 @@
1
+ <svg class="qld-icon-{{size}}"{{#if ariaLabel}} aria-label="{{ariaLabel}}"{{/if}}{{#if ariaHidden}} aria-hidden="{{ariaHidden}}"{{/if}}>
2
+ <use href="./assets/img/icons-sprite.svg#qgds-icon-{{iconId}}"></use>
3
+ </svg>
@@ -7,7 +7,7 @@
7
7
  autocomplete="off" aria-label="{{ ariaLabel }}" {{#each tags}} data-{{@key}}="{{this}}" {{/each}} />
8
8
 
9
9
  {{#if suggestions}}
10
- <div class="suggestions suggestions__group">
10
+ <div class="suggestions suggestions__group d-none">
11
11
  <div class="default-suggestions">
12
12
  <div class="suggestions-category mt-2">
13
13
  <strong class="suggestions-category-label">Popular services</strong>
@@ -0,0 +1,5 @@
1
+ <nav class="qld-skip-links" aria-label="skip to content links">
2
+ {{#each skipLinks}}
3
+ <a class="qld-skip-links__item" href="#{{targetId}}">{{label}}</a>
4
+ {{/each}}
5
+ </nav>