@worksafevictoria/wcl7.5 1.5.0 → 1.6.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 (81) hide show
  1. package/.storybook/preview.js +20 -13
  2. package/bin/deploy.sh +1 -1
  3. package/lib/utility.js +10 -8
  4. package/package.json +4 -4
  5. package/src/assets/icons/AppFooter/x-ws-footer.svg +10 -0
  6. package/src/assets/icons/AppFooter/x-ww-footer.svg +28 -0
  7. package/src/assets/icons/SocialShare/x-icon-white.svg +28 -0
  8. package/src/assets/styles/modal.scss +51 -0
  9. package/src/components/Common/CardGrid/index.vue +56 -51
  10. package/src/components/Common/CardGridItem/card-grid-item-caret.vue +7 -4
  11. package/src/components/Common/CardGridItem/index.vue +77 -63
  12. package/src/components/Containers/Carousel/index.vue +14 -7
  13. package/src/components/Containers/HomepageHeader/index.stories.js +60 -36
  14. package/src/components/Containers/HomepageHeader/index.vue +2 -26
  15. package/src/components/Containers/HomepageHeaderNew/index.stories.js +15 -15
  16. package/src/components/Containers/HomepageHeaderNew/index.vue +97 -68
  17. package/src/components/Containers/SectionGroup/index.vue +1 -1
  18. package/src/components/Containers/Subheader/index.vue +5 -1
  19. package/src/components/Global/AppFooter/FooterSocialShare/index.vue +1 -1
  20. package/src/components/Global/AppFooter/index.vue +14 -7
  21. package/src/components/Global/AppHeaderNew/styles.scss +10 -15
  22. package/src/components/Global/BackToTop/index.vue +8 -8
  23. package/src/components/Global/Cookies/index.stories.js +16 -10
  24. package/src/components/Global/Cookies/index.vue +280 -243
  25. package/src/components/Global/Cookies/styles.scss +54 -54
  26. package/src/components/Global/DirectoryFilters/SingleTaxonomy/index.vue +50 -133
  27. package/src/components/Global/GlobalNotice/index.vue +79 -100
  28. package/src/components/Global/SocialShare/index.vue +1 -1
  29. package/src/components/Global/Strip/index.vue +1 -1
  30. package/src/components/Paragraphs/Accordion/AccordionItem/index.vue +8 -4
  31. package/src/components/Paragraphs/Accordion/StepperItem/index.vue +23 -23
  32. package/src/components/Paragraphs/Accordion/index.stories.js +21 -18
  33. package/src/components/Paragraphs/Accordion/index.vue +52 -48
  34. package/src/components/Paragraphs/BrowseContent/index.vue +1 -1
  35. package/src/components/Paragraphs/BrowseContent/setup.vue +284 -0
  36. package/src/components/Paragraphs/Chart/Constants.js +485 -485
  37. package/src/components/Paragraphs/Chart/index.vue +232 -241
  38. package/src/components/Paragraphs/Directory/Records/HSCP/index.stories.js +33 -0
  39. package/src/components/Paragraphs/Directory/Records/HSCP/index.vue +334 -0
  40. package/src/components/Paragraphs/Directory/Records/index.vue +63 -27
  41. package/src/components/Paragraphs/Directory/Records/styles.scss +1 -0
  42. package/src/components/Paragraphs/Directory/constants.js +23 -5
  43. package/src/components/Paragraphs/Directory/index.vue +14 -14
  44. package/src/components/Paragraphs/ListGroup/index.vue +5 -1
  45. package/src/components/Paragraphs/ScrollSpy/index.vue +23 -14
  46. package/src/components/Paragraphs/SelectableCards/index.vue +15 -12
  47. package/src/components/Paragraphs/TabbedCards/index.vue +13 -14
  48. package/src/components/Paragraphs/Tabs/index.vue +19 -17
  49. package/src/components/Paragraphs/TextMedia/MediaTypes/Video/index.vue +9 -9
  50. package/src/components/Paragraphs/TextMedia/index.vue +20 -16
  51. package/src/components/Paragraphs/VideoGrid/index.stories.js +43 -19
  52. package/src/components/Paragraphs/VideoGrid/index.vue +13 -13
  53. package/src/components/Paragraphs/Webform/index.stories.js +82 -69
  54. package/src/components/SubComponents/CardGroup/index.vue +5 -1
  55. package/src/components/SubComponents/FormAddressPostcode/index.vue +35 -37
  56. package/src/components/SubComponents/FormInstance/components/handler/index.vue +25 -29
  57. package/src/components/SubComponents/FormInstance/components/renderer/index.vue +63 -28
  58. package/src/components/SubComponents/FormInstance/models/overrides/file.js +33 -40
  59. package/src/components/SubComponents/FormInstance/services/form-submit-parser.js +22 -15
  60. package/src/components/SubComponents/FormInstance/services/registry-factory.js +1 -1
  61. package/src/components/SubComponents/FormInstance/stories/fileupload.stories.js +57 -0
  62. package/src/components/SubComponents/FormInstance/stories/mocks/fileupload.json +25 -0
  63. package/src/components/SubComponents/FormInstance/style.scss +2 -2
  64. package/src/components/SubComponents/FormInstance/tests/address.test.js +4 -4
  65. package/src/components/SubComponents/FormInstance/tests/checkboxes.test.js +7 -7
  66. package/src/components/SubComponents/FormInstance/tests/customcomposite.test.js +15 -15
  67. package/src/components/SubComponents/FormInstance/tests/date.test.js +8 -8
  68. package/src/components/SubComponents/FormInstance/tests/form-test-utils.js +9 -9
  69. package/src/components/SubComponents/FormInstance/tests/multiple.test.js +13 -13
  70. package/src/components/SubComponents/FormInstance/tests/rule-visible.test.js +120 -120
  71. package/src/components/SubComponents/FormInstance/tests/scale.test.js +6 -6
  72. package/src/components/SubComponents/FormInstance/tests/url.test.js +13 -10
  73. package/src/components/SubComponents/Pagination/index.vue +19 -18
  74. package/src/components/SubComponents/ResourceGroup/index.vue +5 -1
  75. package/src/components/SubComponents/Search/SearchListing/index.vue +20 -20
  76. package/src/components/SubComponents/Search/index.vue +35 -33
  77. package/src/components/SubComponents/VideoThumbnail/index.vue +48 -133
  78. package/src/includes/scss/vars/src/colors.module.scss +28 -1
  79. package/src/index.js +21 -3
  80. package/src/main.js +2 -10
  81. package/src/mock/carousel-items.js +71 -46
@@ -29,15 +29,15 @@ describe(`Form ${testComponent} parser`, () => {
29
29
  { checked: false, id: 0, label: '', value: 2 },
30
30
  { checked: true, id: 0, label: '', value: 3 },
31
31
  { checked: false, id: 0, label: '', value: 4 },
32
- { checked: false, id: 0, label: '', value: 5 }
33
- ]
34
- }
35
- ])
32
+ { checked: false, id: 0, label: '', value: 5 },
33
+ ],
34
+ },
35
+ ]),
36
36
  )
37
37
  })
38
38
 
39
- it(`should return a submission value`, () => {
40
- const submission = FormTestUtils.handleSubmission(json, 3)
39
+ it(`should return a submission value`, async () => {
40
+ const submission = await FormTestUtils.handleSubmission(json, 3)
41
41
  expect(submission).toEqual({ scale1: 3 })
42
42
  })
43
43
  })
@@ -20,26 +20,29 @@ describe(`Form ${testComponent} parser`, () => {
20
20
  labelPosition: 'top',
21
21
  mask: false,
22
22
  type: 'url',
23
- validate: { maxLength: 255, required: false }
24
- }
25
- ])
23
+ validate: { maxLength: 255, required: false },
24
+ },
25
+ ]),
26
26
  )
27
27
  })
28
28
 
29
- it(`should return a submission value with prefix`, () => {
30
- const submission = FormTestUtils.handleSubmission(
29
+ it(`should return a submission value with prefix`, async () => {
30
+ const submission = await FormTestUtils.handleSubmission(
31
31
  json,
32
- 'https://www.google.com'
32
+ 'https://www.google.com',
33
33
  )
34
34
  expect(submission).toEqual({
35
- url1: 'https://www.google.com'
35
+ url1: 'https://www.google.com',
36
36
  })
37
37
  })
38
38
 
39
- it(`should return a submission value without prefix`, () => {
40
- const submission = FormTestUtils.handleSubmission(json, 'www.google.com')
39
+ it(`should return a submission value without prefix`, async () => {
40
+ const submission = await FormTestUtils.handleSubmission(
41
+ json,
42
+ 'www.google.com',
43
+ )
41
44
  expect(submission).toEqual({
42
- url1: 'http://www.google.com'
45
+ url1: 'http://www.google.com',
43
46
  })
44
47
  })
45
48
  })
@@ -52,37 +52,37 @@ import CtaButton from '../../SubComponents/CtaButton/index.vue'
52
52
 
53
53
  export default {
54
54
  components: {
55
- CtaButton
55
+ CtaButton,
56
56
  },
57
57
  props: {
58
58
  ariaLabel: {
59
59
  type: String,
60
- required: true
60
+ required: true,
61
61
  },
62
62
  rows: {
63
63
  type: Number,
64
- required: true
64
+ required: true,
65
65
  },
66
66
  offset: {
67
67
  type: Number,
68
- required: true
68
+ required: true,
69
69
  },
70
70
  total: {
71
71
  type: Number,
72
- required: true
72
+ required: true,
73
73
  },
74
74
  align: {
75
75
  type: String,
76
- default: 'start'
76
+ default: 'start',
77
77
  },
78
78
  maxPages: {
79
79
  type: Number,
80
- default: 5
81
- }
80
+ default: 5,
81
+ },
82
82
  },
83
83
  data() {
84
84
  return {
85
- currentPage: 1
85
+ currentPage: 1,
86
86
  }
87
87
  },
88
88
  computed: {
@@ -91,27 +91,28 @@ export default {
91
91
  this.total,
92
92
  this.currentPage,
93
93
  this.rows,
94
- this.maxPages
94
+ this.maxPages,
95
95
  )
96
96
  return currentPaginationSnapshot
97
97
  },
98
98
  information() {
99
99
  const totalPages = this.pagination.totalPages
100
100
  return `${totalPages} pages of results`
101
- }
101
+ },
102
102
  },
103
103
  watch: {
104
104
  offset() {
105
105
  if (this.offset === 0 && this.total > 0) {
106
106
  this.currentPage = 1
107
107
  }
108
- }
108
+ },
109
109
  },
110
110
  mounted() {
111
111
  if (this.offset === 0) {
112
112
  this.currentPage = 1
113
113
  } else {
114
- this.currentPage = this.offset / this.rows + 1
114
+ // this.currentPage = this.offset / this.rows + 1
115
+ this.currentPage = this.offset
115
116
  }
116
117
  },
117
118
  methods: {
@@ -119,23 +120,23 @@ export default {
119
120
  if (this.currentPage !== currentPage) {
120
121
  this.currentPage = currentPage
121
122
  this.$emit('pageClicked', {
122
- ...this.pagination
123
+ ...this.pagination,
123
124
  })
124
125
  }
125
126
  },
126
127
  next(el) {
127
128
  this.currentPage += 1
128
129
  this.$emit('next', {
129
- ...this.pagination
130
+ ...this.pagination,
130
131
  })
131
132
  },
132
133
  previous() {
133
134
  this.currentPage -= 1
134
135
  this.$emit('prev', {
135
- ...this.pagination
136
+ ...this.pagination,
136
137
  })
137
- }
138
- }
138
+ },
139
+ },
139
140
  }
140
141
  </script>
141
142
  <style lang="scss" scoped>
@@ -438,7 +438,11 @@ export default {
438
438
  },
439
439
  selectedCard(card) {
440
440
  // Some custom logic for gov caretaker logic
441
- if (process.env.CARETAKER && process.env.CARETAKER === 'true') {
441
+ if (
442
+ (this.$config
443
+ ? this.$config.public.caretaker
444
+ : process.env.CARETAKER) === 'true'
445
+ ) {
442
446
  if (!isGovSite(card?.selectedCard?.link)) {
443
447
  // this.$store.commit('page/SET_CARETAKER_REF', 'list-group')
444
448
  // this.$root.$emit('caretaker-open', card?.selectedCard?.link)
@@ -45,7 +45,7 @@
45
45
  :taxonomies="{
46
46
  industry: card.industry,
47
47
  topic: card.topic,
48
- language: card.language
48
+ language: card.language,
49
49
  }"
50
50
  :is-card-title-selectable="isCardTitleSelectable"
51
51
  />
@@ -94,44 +94,44 @@ export default {
94
94
  props: {
95
95
  isTypeahead: {
96
96
  type: Boolean,
97
- required: false
97
+ required: false,
98
98
  },
99
99
  pageLimit: {
100
100
  type: Number,
101
101
  required: false,
102
- default: 20
102
+ default: 20,
103
103
  },
104
104
  numFound: {
105
105
  type: Number,
106
106
  required: false,
107
- default: 0
107
+ default: 0,
108
108
  },
109
109
  query: {
110
110
  type: String,
111
111
  required: false,
112
- default: ''
112
+ default: '',
113
113
  },
114
114
  results: {
115
115
  type: Array,
116
- default: () => []
116
+ default: () => [],
117
117
  },
118
118
  offset: {
119
119
  type: Number,
120
120
  required: false,
121
- default: 0
121
+ default: 0,
122
122
  },
123
123
  isLoading: {
124
124
  type: Boolean,
125
- required: false
125
+ required: false,
126
126
  },
127
127
  suggestion: {
128
128
  type: String,
129
- default: null
129
+ default: null,
130
130
  },
131
131
  isCardTitleSelectable: {
132
132
  type: Boolean,
133
- default: false
134
- }
133
+ default: false,
134
+ },
135
135
  },
136
136
  methods: {
137
137
  onClickItem(event, item, index) {
@@ -146,8 +146,8 @@ export default {
146
146
  onSelectCardTitle(card) {
147
147
  navigateToPath.call(
148
148
  this,
149
- card?.selectedCard?.link,
150
- card?.ev?.ctrlKey === true || card?.ev?.metaKey === true
149
+ card?.selectedCard?.link.match(/https?:\/\/[^\/]+(\/[^?#]*)/)[1], // open link in current environment
150
+ card?.ev?.ctrlKey === true || card?.ev?.metaKey === true,
151
151
  )
152
152
  this.$nextTick(() => this.$emit('selected-title'))
153
153
 
@@ -158,8 +158,8 @@ export default {
158
158
  onSelectResult(card) {
159
159
  navigateToPath.call(
160
160
  this,
161
- card?.selectedCard?.link,
162
- card?.ev?.ctrlKey === true || card?.ev?.metaKey === true
161
+ card?.selectedCard?.link.match(/https?:\/\/[^\/]+(\/[^?#]*)/)[1], // title click is used for search result, but change also included here
162
+ card?.ev?.ctrlKey === true || card?.ev?.metaKey === true,
163
163
  )
164
164
  this.$nextTick(() => this.$emit('selected'))
165
165
 
@@ -173,8 +173,8 @@ export default {
173
173
  this.$route?.path === '/'
174
174
  ? 'Homepage'
175
175
  : this.$route?.path === '/search'
176
- ? 'Search Page'
177
- : this.$route?.path,
176
+ ? 'Search Page'
177
+ : this.$route?.path,
178
178
  label: this.query,
179
179
  results: this.results.length,
180
180
  clickText: card.selectedCard.title,
@@ -183,7 +183,7 @@ export default {
183
183
  targetElement: card.ev.target,
184
184
  industry: card?.selectedCard?.industry,
185
185
  topic: card?.selectedCard?.topic,
186
- language: card?.selectedCard?.language
186
+ language: card?.selectedCard?.language,
187
187
  }
188
188
  this.$gtm.push({ event: 'custom.search.site.result', ...attrs })
189
189
  },
@@ -191,8 +191,8 @@ export default {
191
191
  if (this.$nuxt) {
192
192
  this.$router.push('/search?q=' + this.query)
193
193
  }
194
- }
195
- }
194
+ },
195
+ },
196
196
  }
197
197
  </script>
198
198
 
@@ -33,7 +33,7 @@
33
33
  v-if="loadSearchList && (searchResults || isLoading)"
34
34
  :class="{
35
35
  [`wcl-search__typeahead`]: isTypeahead,
36
- [`wcl-search__modal`]: isTypeahead
36
+ [`wcl-search__modal`]: isTypeahead,
37
37
  }"
38
38
  :is-loading="isLoading"
39
39
  :is-typeahead="isTypeahead"
@@ -63,28 +63,28 @@ export default {
63
63
  props: {
64
64
  pageLimit: {
65
65
  type: Number,
66
- required: true
66
+ required: true,
67
67
  },
68
68
  contentParser: {
69
69
  type: Function,
70
- required: true
70
+ required: true,
71
71
  },
72
72
  isTypeahead: {
73
73
  type: Boolean,
74
- required: true
74
+ required: true,
75
75
  },
76
76
  initialSearchQuery: {
77
77
  type: String,
78
- default: ''
78
+ default: '',
79
79
  },
80
80
  googleSearchFlag: {
81
81
  type: String,
82
- default: 'solar'
82
+ default: 'solar',
83
83
  },
84
84
  visibleSearchList: {
85
85
  type: Boolean,
86
- default: true
87
- }
86
+ default: true,
87
+ },
88
88
  },
89
89
  data() {
90
90
  return {
@@ -95,16 +95,16 @@ export default {
95
95
  field_language: '8671',
96
96
  searchType: this.googleSearchFlag,
97
97
  googleSearchScript: false,
98
- loadSearchList: this.visibleSearchList
98
+ loadSearchList: this.visibleSearchList,
99
99
  }
100
100
  },
101
101
  computed: {
102
102
  searchClass() {
103
103
  return {
104
104
  'wcl-search': true,
105
- 'wcl-search__google': this.searchType !== 'solar'
105
+ 'wcl-search__google': this.searchType !== 'solar',
106
106
  }
107
- }
107
+ },
108
108
  },
109
109
  mounted() {
110
110
  if (this.searchType === 'google') {
@@ -134,9 +134,9 @@ export default {
134
134
  key: apiKey,
135
135
  cx: searchEngineId,
136
136
  q: query,
137
- start: start
138
- }
139
- }
137
+ start: start,
138
+ },
139
+ },
140
140
  )
141
141
  return response
142
142
  } catch (error) {
@@ -156,7 +156,7 @@ export default {
156
156
  apiKey,
157
157
  searchEngineId,
158
158
  searchQuery,
159
- start
159
+ start,
160
160
  )
161
161
  let items = []
162
162
  let suggest = response?.data?.spelling?.correctedQuery || ''
@@ -165,7 +165,7 @@ export default {
165
165
  apiKey,
166
166
  searchEngineId,
167
167
  response?.data?.spelling?.correctedQuery,
168
- start
168
+ start,
169
169
  )
170
170
  items = response?.data?.items
171
171
  } else if (response?.data?.items) {
@@ -181,7 +181,7 @@ export default {
181
181
  // Return the modified item with the updated title
182
182
  return {
183
183
  ...item,
184
- title: modifiedTitle
184
+ title: modifiedTitle,
185
185
  }
186
186
  })
187
187
 
@@ -190,7 +190,7 @@ export default {
190
190
  numFound: Number(totalResults),
191
191
  query: this.searchQuery,
192
192
  results: modifiedResults,
193
- suggestion: suggest
193
+ suggestion: suggest,
194
194
  }
195
195
  } else {
196
196
  this.searchResults = {
@@ -198,7 +198,7 @@ export default {
198
198
  numFound: 0,
199
199
  query: this.searchQuery ?? '',
200
200
  results: [],
201
- suggestion: suggest
201
+ suggestion: suggest,
202
202
  }
203
203
  }
204
204
  this.$emit('loading', false)
@@ -214,10 +214,10 @@ export default {
214
214
  this.$route?.path === '/'
215
215
  ? 'Homepage'
216
216
  : this.$route?.path === '/search'
217
- ? 'Search Page'
218
- : this.$route?.path,
217
+ ? 'Search Page'
218
+ : this.$route?.path,
219
219
  label: this.searchQuery,
220
- results: this.searchResults.numFound
220
+ results: this.searchResults.numFound,
221
221
  }
222
222
  if (this.$gtm) {
223
223
  this.$gtm.push({ event: 'custom.search.site.submit', ...attrs })
@@ -291,7 +291,7 @@ export default {
291
291
  query: searchQuery,
292
292
  start: pageNr > 1 ? (pageNr - 1) * pageLimit : 0,
293
293
  rows: pageLimit,
294
- field_language: this.field_language
294
+ field_language: this.field_language,
295
295
  }).then((res) => {
296
296
  if (res.numFound) {
297
297
  this.searchResults = {
@@ -299,7 +299,7 @@ export default {
299
299
  numFound: Number(res.numFound),
300
300
  query: searchQuery,
301
301
  results: res.results,
302
- suggestion: null
302
+ suggestion: null,
303
303
  }
304
304
  } else {
305
305
  this.searchResults = {
@@ -307,7 +307,7 @@ export default {
307
307
  numFound: 0,
308
308
  query: this.searchQuery ?? '',
309
309
  results: [],
310
- suggestion: null
310
+ suggestion: null,
311
311
  }
312
312
  }
313
313
  this.$emit('loading', false)
@@ -322,10 +322,10 @@ export default {
322
322
  this.$route?.path === '/'
323
323
  ? 'Homepage'
324
324
  : this.$route?.path === '/search'
325
- ? 'Search Page'
326
- : this.$route?.path,
325
+ ? 'Search Page'
326
+ : this.$route?.path,
327
327
  label: this.searchQuery,
328
- results: this.searchResults.numFound
328
+ results: this.searchResults.numFound,
329
329
  }
330
330
  if (this.$gtm) {
331
331
  this.$gtm.push({ event: 'custom.search.site.submit', ...attrs })
@@ -340,7 +340,9 @@ export default {
340
340
  if (this.googleSearchScript === false) {
341
341
  const script = document.createElement('script')
342
342
  script.async = true
343
- script.src = process.env.GOOGLE__URL
343
+ script.src = this.$config
344
+ ? this.$config.public.googleSearch
345
+ : process.env.GOOGLE__URL
344
346
  document.head.appendChild(script)
345
347
  this.googleSearchScript = true
346
348
 
@@ -386,8 +388,8 @@ export default {
386
388
 
387
389
  this.setupPaginationEvent()
388
390
  }
389
- }
390
- }
391
+ },
392
+ },
391
393
  }
392
394
  </script>
393
395
  <style lang="scss" scoped>
@@ -454,8 +456,8 @@ export default {
454
456
  display: none;
455
457
  }
456
458
  }
457
- // Google Search styling
458
- &.wcl-search__google {
459
+ // Google Search styling
460
+ &.wcl-search__google {
459
461
  :deep(form.gsc-search-box) {
460
462
  position: relative;
461
463
  display: -ms-flexbox;