govuk_publishing_components 29.13.0 → 29.15.1

Sign up to get free protection for your applications and to get access to all the features.
Files changed (159) hide show
  1. checksums.yaml +4 -4
  2. data/app/assets/images/govuk_publishing_components/action-link-arrow--white.png +0 -0
  3. data/app/assets/images/govuk_publishing_components/action-link-arrow--white.svg +1 -0
  4. data/app/assets/javascripts/govuk_publishing_components/analytics-ga4/gtm-page-views.js +5 -3
  5. data/app/assets/javascripts/govuk_publishing_components/analytics-ga4/pii-remover.js +135 -0
  6. data/app/assets/javascripts/govuk_publishing_components/analytics-ga4.js +2 -0
  7. data/app/assets/javascripts/govuk_publishing_components/components/accordion.js +27 -22
  8. data/app/assets/javascripts/govuk_publishing_components/components/table.js +52 -0
  9. data/app/assets/stylesheets/govuk_publishing_components/components/_action-link.scss +7 -0
  10. data/app/assets/stylesheets/govuk_publishing_components/components/_previous-and-next-navigation.scss +1 -92
  11. data/app/models/govuk_publishing_components/audit_applications.rb +31 -9
  12. data/app/models/govuk_publishing_components/audit_comparer.rb +15 -9
  13. data/app/views/govuk_publishing_components/audit/_components.html.erb +20 -2
  14. data/app/views/govuk_publishing_components/components/_action_link.html.erb +2 -0
  15. data/app/views/govuk_publishing_components/components/_previous_and_next_navigation.html.erb +33 -36
  16. data/app/views/govuk_publishing_components/components/_table.html.erb +61 -30
  17. data/app/views/govuk_publishing_components/components/docs/accordion.yml +2 -1
  18. data/app/views/govuk_publishing_components/components/docs/action_link.yml +8 -0
  19. data/app/views/govuk_publishing_components/components/docs/back_link.yml +1 -1
  20. data/app/views/govuk_publishing_components/components/docs/big_number.yml +2 -2
  21. data/app/views/govuk_publishing_components/components/docs/breadcrumbs.yml +2 -2
  22. data/app/views/govuk_publishing_components/components/docs/button.yml +41 -40
  23. data/app/views/govuk_publishing_components/components/docs/cards.yml +2 -0
  24. data/app/views/govuk_publishing_components/components/docs/checkboxes.yml +216 -216
  25. data/app/views/govuk_publishing_components/components/docs/cookie_banner.yml +2 -1
  26. data/app/views/govuk_publishing_components/components/docs/copy_to_clipboard.yml +2 -2
  27. data/app/views/govuk_publishing_components/components/docs/details.yml +5 -1
  28. data/app/views/govuk_publishing_components/components/docs/document_list.yml +1 -2
  29. data/app/views/govuk_publishing_components/components/docs/error_alert.yml +4 -0
  30. data/app/views/govuk_publishing_components/components/docs/error_summary.yml +4 -6
  31. data/app/views/govuk_publishing_components/components/docs/image_card.yml +2 -1
  32. data/app/views/govuk_publishing_components/components/docs/intervention.yml +25 -25
  33. data/app/views/govuk_publishing_components/components/docs/organisation_logo.yml +1 -2
  34. data/app/views/govuk_publishing_components/components/docs/previous_and_next_navigation.yml +1 -1
  35. data/app/views/govuk_publishing_components/components/docs/print_link.yml +5 -1
  36. data/app/views/govuk_publishing_components/components/docs/select.yml +101 -98
  37. data/app/views/govuk_publishing_components/components/docs/table.yml +36 -1
  38. data/app/views/govuk_publishing_components/components/docs/tabs.yml +4 -0
  39. data/config/locales/ar.yml +6 -0
  40. data/config/locales/az.yml +6 -0
  41. data/config/locales/be.yml +6 -0
  42. data/config/locales/bg.yml +6 -0
  43. data/config/locales/bn.yml +6 -0
  44. data/config/locales/cs.yml +6 -0
  45. data/config/locales/cy.yml +6 -0
  46. data/config/locales/da.yml +6 -0
  47. data/config/locales/de.yml +6 -0
  48. data/config/locales/dr.yml +6 -0
  49. data/config/locales/el.yml +6 -0
  50. data/config/locales/en.yml +6 -0
  51. data/config/locales/es-419.yml +6 -0
  52. data/config/locales/es.yml +6 -0
  53. data/config/locales/et.yml +6 -0
  54. data/config/locales/fa.yml +6 -0
  55. data/config/locales/fi.yml +6 -0
  56. data/config/locales/fr.yml +6 -0
  57. data/config/locales/gd.yml +6 -0
  58. data/config/locales/gu.yml +6 -0
  59. data/config/locales/he.yml +6 -0
  60. data/config/locales/hi.yml +6 -0
  61. data/config/locales/hr.yml +6 -0
  62. data/config/locales/hu.yml +6 -0
  63. data/config/locales/hy.yml +6 -0
  64. data/config/locales/id.yml +6 -0
  65. data/config/locales/is.yml +6 -0
  66. data/config/locales/it.yml +6 -0
  67. data/config/locales/ja.yml +6 -0
  68. data/config/locales/ka.yml +6 -0
  69. data/config/locales/kk.yml +6 -0
  70. data/config/locales/ko.yml +6 -0
  71. data/config/locales/lt.yml +6 -0
  72. data/config/locales/lv.yml +6 -0
  73. data/config/locales/ms.yml +6 -0
  74. data/config/locales/mt.yml +6 -0
  75. data/config/locales/nl.yml +6 -0
  76. data/config/locales/no.yml +6 -0
  77. data/config/locales/pa-pk.yml +6 -0
  78. data/config/locales/pa.yml +6 -0
  79. data/config/locales/pl.yml +6 -0
  80. data/config/locales/ps.yml +6 -0
  81. data/config/locales/pt.yml +6 -0
  82. data/config/locales/ro.yml +6 -0
  83. data/config/locales/ru.yml +6 -0
  84. data/config/locales/si.yml +6 -0
  85. data/config/locales/sk.yml +6 -0
  86. data/config/locales/sl.yml +6 -0
  87. data/config/locales/so.yml +6 -0
  88. data/config/locales/sq.yml +6 -0
  89. data/config/locales/sr.yml +6 -0
  90. data/config/locales/sv.yml +6 -0
  91. data/config/locales/sw.yml +6 -0
  92. data/config/locales/ta.yml +6 -0
  93. data/config/locales/th.yml +6 -0
  94. data/config/locales/tk.yml +6 -0
  95. data/config/locales/tr.yml +6 -0
  96. data/config/locales/uk.yml +6 -0
  97. data/config/locales/ur.yml +6 -0
  98. data/config/locales/uz.yml +6 -0
  99. data/config/locales/vi.yml +6 -0
  100. data/config/locales/zh-hk.yml +6 -0
  101. data/config/locales/zh-tw.yml +6 -0
  102. data/config/locales/zh.yml +6 -0
  103. data/lib/govuk_publishing_components/app_helpers/table_helper.rb +4 -2
  104. data/lib/govuk_publishing_components/version.rb +1 -1
  105. data/node_modules/govuk-frontend/govuk/components/_all.scss +1 -0
  106. data/node_modules/govuk-frontend/govuk/components/accordion/_index.scss +1 -0
  107. data/node_modules/govuk-frontend/govuk/components/character-count/fixtures.json +2 -1
  108. data/node_modules/govuk-frontend/govuk/components/checkboxes/fixtures.json +102 -44
  109. data/node_modules/govuk-frontend/govuk/components/checkboxes/macro-options.json +7 -1
  110. data/node_modules/govuk-frontend/govuk/components/checkboxes/template.njk +3 -2
  111. data/node_modules/govuk-frontend/govuk/components/cookie-banner/fixtures.json +10 -10
  112. data/node_modules/govuk-frontend/govuk/components/fieldset/fixtures.json +92 -1
  113. data/node_modules/govuk-frontend/govuk/components/file-upload/fixtures.json +2 -1
  114. data/node_modules/govuk-frontend/govuk/components/header/_index.scss +3 -0
  115. data/node_modules/govuk-frontend/govuk/components/header/fixtures.json +14 -6
  116. data/node_modules/govuk-frontend/govuk/components/header/template.njk +9 -3
  117. data/node_modules/govuk-frontend/govuk/components/input/fixtures.json +2 -1
  118. data/node_modules/govuk-frontend/govuk/components/input/macro-options.json +1 -1
  119. data/node_modules/govuk-frontend/govuk/components/label/fixtures.json +76 -1
  120. data/node_modules/govuk-frontend/govuk/components/pagination/README.md +15 -0
  121. data/node_modules/govuk-frontend/govuk/components/pagination/_index.scss +244 -0
  122. data/node_modules/govuk-frontend/govuk/components/pagination/_pagination.scss +2 -0
  123. data/node_modules/govuk-frontend/govuk/components/pagination/fixtures.json +300 -0
  124. data/node_modules/govuk-frontend/govuk/components/pagination/macro-options.json +128 -0
  125. data/node_modules/govuk-frontend/govuk/components/pagination/macro.njk +3 -0
  126. data/node_modules/govuk-frontend/govuk/components/pagination/template.njk +62 -0
  127. data/node_modules/govuk-frontend/govuk/components/radios/fixtures.json +147 -43
  128. data/node_modules/govuk-frontend/govuk/components/radios/macro-options.json +7 -1
  129. data/node_modules/govuk-frontend/govuk/components/radios/template.njk +3 -2
  130. data/node_modules/govuk-frontend/govuk/components/select/fixtures.json +56 -2
  131. data/node_modules/govuk-frontend/govuk/components/select/macro-options.json +7 -1
  132. data/node_modules/govuk-frontend/govuk/components/select/template.njk +1 -1
  133. data/node_modules/govuk-frontend/govuk/components/textarea/fixtures.json +2 -1
  134. data/node_modules/govuk-frontend/govuk-esm/all.mjs +12 -12
  135. data/node_modules/govuk-frontend/govuk-esm/components/accordion/accordion.mjs +3 -3
  136. data/node_modules/govuk-frontend/govuk-esm/components/button/button.mjs +2 -2
  137. data/node_modules/govuk-frontend/govuk-esm/components/character-count/character-count.mjs +3 -3
  138. data/node_modules/govuk-frontend/govuk-esm/components/checkboxes/checkboxes.mjs +4 -4
  139. data/node_modules/govuk-frontend/govuk-esm/components/details/details.mjs +3 -3
  140. data/node_modules/govuk-frontend/govuk-esm/components/error-summary/error-summary.mjs +3 -3
  141. data/node_modules/govuk-frontend/govuk-esm/components/header/header.mjs +3 -3
  142. data/node_modules/govuk-frontend/govuk-esm/components/notification-banner/notification-banner.mjs +1 -1
  143. data/node_modules/govuk-frontend/govuk-esm/components/radios/radios.mjs +4 -4
  144. data/node_modules/govuk-frontend/govuk-esm/components/skip-link/skip-link.mjs +3 -3
  145. data/node_modules/govuk-frontend/govuk-esm/components/tabs/tabs.mjs +6 -6
  146. data/node_modules/govuk-frontend/govuk-esm/vendor/polyfills/{DOMTokenList.js → DOMTokenList.mjs} +0 -0
  147. data/node_modules/govuk-frontend/govuk-esm/vendor/polyfills/{Document.js → Document.mjs} +0 -0
  148. data/node_modules/govuk-frontend/govuk-esm/vendor/polyfills/Element/prototype/{classList.js → classList.mjs} +4 -4
  149. data/node_modules/govuk-frontend/govuk-esm/vendor/polyfills/Element/prototype/{closest.js → closest.mjs} +1 -1
  150. data/node_modules/govuk-frontend/govuk-esm/vendor/polyfills/Element/prototype/{matches.js → matches.mjs} +0 -0
  151. data/node_modules/govuk-frontend/govuk-esm/vendor/polyfills/Element/prototype/{nextElementSibling.js → nextElementSibling.mjs} +2 -2
  152. data/node_modules/govuk-frontend/govuk-esm/vendor/polyfills/Element/prototype/{previousElementSibling.js → previousElementSibling.mjs} +2 -2
  153. data/node_modules/govuk-frontend/govuk-esm/vendor/polyfills/{Element.js → Element.mjs} +1 -1
  154. data/node_modules/govuk-frontend/govuk-esm/vendor/polyfills/{Event.js → Event.mjs} +3 -3
  155. data/node_modules/govuk-frontend/govuk-esm/vendor/polyfills/Function/prototype/{bind.js → bind.mjs} +1 -1
  156. data/node_modules/govuk-frontend/govuk-esm/vendor/polyfills/Object/{defineProperty.js → defineProperty.mjs} +0 -0
  157. data/node_modules/govuk-frontend/govuk-esm/vendor/polyfills/{Window.js → Window.mjs} +0 -0
  158. data/node_modules/govuk-frontend/package.json +8 -2
  159. metadata +26 -15
@@ -23,16 +23,14 @@ examples:
23
23
  items:
24
24
  - text: Descriptive link to the question with an error 1
25
25
  href: '#example-error-1'
26
- data_attributes:
27
- tracking: GTM-123AA
28
26
  - text: Descriptive link to the question with an error 2
29
27
  href: '#example-error-2'
30
- data_attributes:
31
- tracking: GTM-123AB
32
28
  - text: Description of error without link
33
- data_attributes:
34
- tracking: GTM-123AC
35
29
  with_data_attributes:
30
+ description: |
31
+ The example shown applies a tracking attribute specifically for use by Google Tag Manager in [Content Publisher](https://github.com/alphagov/content-publisher).
32
+
33
+ Other data attributes can also be applied as required. Note that the component does not include built in tracking. If this is required consider using the [track click script](https://github.com/alphagov/govuk_publishing_components/blob/main/docs/analytics/track-click.md).
36
34
  data:
37
35
  title: Message to alert the user to a problem goes here
38
36
  description: Optional description of the errors and how to correct them
@@ -195,7 +195,8 @@ examples:
195
195
  text: "Announcement"
196
196
  heading_text: "Something has happened nearby possibly"
197
197
  description: "Following a news report that something has happened, further details are emerging of the thing that has happened and what that means for you."
198
- with_tracking:
198
+ with_data_attributes:
199
+ description: Data attributes can be applied as required. Note that the component does not include built in tracking. If this is required consider using the [track click script](https://github.com/alphagov/govuk_publishing_components/blob/main/docs/analytics/track-click.md).
199
200
  data:
200
201
  href: "/i-am-not-a-valid-link"
201
202
  href_data_attributes: {
@@ -20,31 +20,31 @@ shared_accessibility_criteria:
20
20
  examples:
21
21
  default:
22
22
  data:
23
- suggestion_text: "You should renew your permit every 6 months."
23
+ suggestion_text: You should renew your permit every 6 months.
24
24
 
25
25
  with_suggestion_link:
26
26
  data:
27
- suggestion_text: "Based on your browsing you might be interested in"
27
+ suggestion_text: Based on your browsing you might be interested in
28
28
  suggestion_link_text: "Travel abroad: step by step"
29
- suggestion_link_url: "/travel-abroad"
29
+ suggestion_link_url: /travel-abroad
30
30
 
31
31
  with_dismiss_link:
32
32
  data:
33
- suggestion_text: "You should renew your permit every 6 months."
34
- dismiss_text: "Hide this suggestion"
33
+ suggestion_text: You should renew your permit every 6 months.
34
+ dismiss_text: Hide this suggestion
35
35
 
36
36
  with_suggestion_link_only:
37
37
  data:
38
- suggestion_link_text: "You can now apply for a permit online."
39
- suggestion_link_url: "/permit"
38
+ suggestion_link_text: You can now apply for a permit online.
39
+ suggestion_link_url: /permit
40
40
 
41
41
  with_hide:
42
42
  description: |
43
43
  This example is for when we want to hide by default and display to the user based on some logic,
44
44
  either in the backend or with Javascript.
45
45
  data:
46
- suggestion_link_text: "You may be invited to fill in a questionnaire"
47
- suggestion_link_url: "/questionnaire"
46
+ suggestion_link_text: You may be invited to fill in a questionnaire
47
+ suggestion_link_url: /questionnaire
48
48
  hide: true
49
49
 
50
50
  open_suggestion_link_in_new_tab:
@@ -54,30 +54,30 @@ examples:
54
54
  Link text should tell the user that the link opens in a new tab.
55
55
  Note: "(opens in a new tab)" is added to link text if the phrase isn't included.
56
56
  data:
57
- suggestion_link_text: "You can now apply for a permit online"
58
- suggestion_link_url: "www.google.com/permit"
57
+ suggestion_link_text: You can now apply for a permit online
58
+ suggestion_link_url: www.google.com/permit
59
59
  new_tab: true
60
60
 
61
61
  with_data_attributes:
62
62
  description: |
63
63
  This example shows the use of `suggestion_data_attributes` and
64
64
  `dismiss_data_attributes` for click tracking.
65
+
66
+ Other data attributes can also be applied as required. Note that the component does not include built in tracking. If this is required consider using the [track click script](https://github.com/alphagov/govuk_publishing_components/blob/main/docs/analytics/track-click.md).
65
67
  data:
66
- suggestion_text: "Based on your browsing you might be interested in"
68
+ suggestion_text: Based on your browsing you might be interested in
67
69
  suggestion_link_text: "Travel abroad: step by step"
68
- suggestion_link_url: "/travel-abroad"
70
+ suggestion_link_url: /travel-abroad
69
71
  suggestion_data_attributes:
70
- module: "gem-track-click"
71
- track-category: "interventionBanner"
72
- track-action: "interventionClicked"
72
+ track-category: interventionBanner
73
+ track-action: interventionClicked
73
74
  track-dimension: "Travel abroad: step by step"
74
- track-dimension-index: "29"
75
- track-label: "clicked suggestion"
76
- dismiss_text: "Hide this suggestion"
75
+ track-dimension-index: 29
76
+ track-label: clicked suggestion
77
+ dismiss_text: Hide this suggestion
77
78
  dismiss_data_attributes:
78
- module: "gem-track-click"
79
- track-category: "interventionBanner"
80
- track-action: "interventionDismissed"
81
- track-dimension: "Hide this suggestion"
82
- track-dimension-index: "29"
83
- track-label: "hid the intervention"
79
+ track-category: interventionBanner
80
+ track-action: interventionDismissed
81
+ track-dimension: Hide this suggestion
82
+ track-dimension-index: 29
83
+ track-label: hide the intervention
@@ -6,8 +6,6 @@ body: |
6
6
 
7
7
  Alternatively a custom organisation logo can be provided as an image.
8
8
 
9
- Data tracking attributes can be provided to add tracking to each organisation logo. This will only apply to organisations with a link. Example here: [with_data_attributes](/component-guide/organisation_logo/with_data_attributes)
10
-
11
9
  The logo can optionally be wrapped in a heading.
12
10
 
13
11
  The logo can be set to not take up the full width of the parent container with the `inline` option.
@@ -147,6 +145,7 @@ examples:
147
145
  url: 'https://assets.publishing.service.gov.uk/government/uploads/system/uploads/organisation/logo/321/HMPS.jpg'
148
146
  alt_text: 'HM Prison Service'
149
147
  with_data_attributes:
148
+ description: Data attributes can be applied as required. Note that the component does not include built in tracking. If this is required consider using the [track click script](https://github.com/alphagov/govuk_publishing_components/blob/main/docs/analytics/track-click.md).
150
149
  data:
151
150
  organisation:
152
151
  name: Cabinet Office
@@ -22,7 +22,7 @@ accessibility_criteria: |
22
22
  shared_accessibility_criteria:
23
23
  - link
24
24
  examples:
25
- only_previous:
25
+ default:
26
26
  data:
27
27
  previous_page:
28
28
  url: previous-page
@@ -8,7 +8,7 @@ shared_accessibility_criteria:
8
8
  - link
9
9
  examples:
10
10
  default:
11
- description: This component calls `print()` via the browser's DOM API. By default it relies on JavaScript and is not shown in environments where JavaScript is disabled. The \"link\" here is actually a button tag because this is not a navigation event.
11
+ description: This component calls `print()` via the browser's DOM API. By default it relies on JavaScript and is not shown in environments where JavaScript is disabled. The \"link\" here is actually a button tag because this is not a navigation event.
12
12
  with_different_text:
13
13
  data:
14
14
  text: "Print this manual"
@@ -17,6 +17,10 @@ examples:
17
17
  data:
18
18
  href: "/print"
19
19
  with_data_attributes:
20
+ description: |
21
+ Data attributes can be passed to the component as shown.
22
+
23
+ Note that the component does not include built in tracking. If this is required consider using the [track click script](https://github.com/alphagov/govuk_publishing_components/blob/main/docs/analytics/track-click.md).
20
24
  data:
21
25
  data_attributes:
22
26
  track-category: "printButton"
@@ -10,160 +10,163 @@ accessibility_criteria: |
10
10
  examples:
11
11
  default:
12
12
  data:
13
- id: 'dropdown1'
14
- label: 'My Dropdown'
13
+ id: dropdown1
14
+ label: My Dropdown
15
15
  options:
16
- - text: 'Option one'
17
- value: 'option1'
18
- - text: 'Option two'
19
- value: 'option2'
20
- - text: 'Option three'
21
- value: 'option3'
16
+ - text: Option one
17
+ value: option1
18
+ - text: Option two
19
+ value: option2
20
+ - text: Option three
21
+ value: option3
22
22
  with_different_id_and_name:
23
23
  description: If no name is provided, name defaults to the (required) value of id.
24
24
  data:
25
- id: 'dropdown1-1'
26
- label: 'My Dropdown'
27
- name: 'dropdown[1]'
25
+ id: dropdown1-1
26
+ label: My Dropdown
27
+ name: dropdown[1]
28
28
  options:
29
- - text: 'Option one'
30
- value: 'option1'
31
- - text: 'Option two'
32
- value: 'option2'
29
+ - text: Option one
30
+ value: option1
31
+ - text: Option two
32
+ value: option2
33
33
  with_preselect:
34
34
  data:
35
- id: 'dropdown2'
36
- label: 'Option 2 preselected'
35
+ id: dropdown2
36
+ label: Option 2 preselected
37
37
  options:
38
- - text: 'Option one'
39
- value: 'option1'
40
- - text: 'Option two'
41
- value: 'option2'
38
+ - text: Option one
39
+ value: option1
40
+ - text: Option two
41
+ value: option2
42
42
  selected: true
43
- - text: 'Option three'
44
- value: 'option3'
43
+ - text: Option three
44
+ value: option3
45
45
  with_hint:
46
46
  description: When a hint is included the `aria-describedby` attribute of the select is included to point to the hint. When an error and a hint are present, that attribute includes the IDs of both the hint and the error.
47
47
  data:
48
- id: 'dropdown2-1'
49
- label: 'Choose your preferred thing'
50
- hint: 'You might need some more information here'
51
- hint_id: 'optional-hint-id'
48
+ id: dropdown2-1
49
+ label: Choose your preferred thing
50
+ hint: You might need some more information here
51
+ hint_id: optional-hint-id
52
52
  options:
53
- - text: 'Something'
54
- value: 'option1'
55
- - text: 'Something else'
56
- value: 'option2'
53
+ - text: Something
54
+ value: option1
55
+ - text: Something else
56
+ value: option2
57
57
  with_tracking:
58
- description: 'Tracking can be enabled on the select component by passing a minimum of `data_track_category` and `data_track_action`. Other tracking attributes are optional. Note: tracking events do not currently fire within the component guide.'
58
+ description: |
59
+ Tracking can be enabled on the select component by passing a minimum of `data_track_category` and `data_track_action`. Other tracking attributes are optional. Tracking is provided by the [track-select-change](https://github.com/alphagov/govuk_publishing_components/blob/main/app/assets/javascripts/govuk_publishing_components/analytics/track-select-change.js) module.
60
+
61
+ Note: tracking events do not fire within the component guide.
59
62
  data:
60
- id: 'dropdown3'
61
- label: 'With tracking enabled'
63
+ id: dropdown3
64
+ label: With tracking enabled
62
65
  options:
63
- - text: 'Option one'
64
- value: 'option1'
66
+ - text: Option one
67
+ value: option1
65
68
  data_attributes:
66
- track_category: 'relatedLinkClicked'
69
+ track_category: relatedLinkClicked
67
70
  track_action: 1.1
68
- track_label: '/link-1'
71
+ track_label: /link-1
69
72
  track_options:
70
73
  dimension28: 1
71
- dimension29: 'Link 1'
72
- - text: 'Option two'
73
- value: 'option2'
74
+ dimension29: Link 1
75
+ - text: Option two
76
+ value: option2
74
77
  data_attributes:
75
- track_category: 'relatedLinkClicked'
78
+ track_category: relatedLinkClicked
76
79
  track_action: 1.2
77
- track_label: '/link-2'
80
+ track_label: /link-2
78
81
  track_options:
79
82
  dimension28: 2
80
- dimension29: 'Link 2'
81
- - text: 'Option three'
82
- value: 'option3'
83
+ dimension29: Link 2
84
+ - text: Option three
85
+ value: option3
83
86
  data_attributes:
84
- track_category: 'relatedLinkClicked'
87
+ track_category: relatedLinkClicked
85
88
  track_action: 1.3
86
- track_label: '/link-3'
89
+ track_label: /link-3
87
90
  track_options:
88
91
  dimension28: 3
89
- dimension29: 'Link 3'
92
+ dimension29: Link 3
90
93
  with_data_attributes:
91
94
  description: Other data attributes can be passed to the component if needed.
92
95
  data:
93
- id: 'dropdown4'
94
- label: 'With data attributes'
96
+ id: dropdown4
97
+ label: With data attributes
95
98
  options:
96
- - text: 'Option one'
97
- value: 'option1'
99
+ - text: Option one
100
+ value: option1
98
101
  data_attributes:
99
- another_attribute: "attribute 1"
100
- something_else: "attribute 2"
101
- - text: 'Option two'
102
- value: 'option2'
103
- - text: 'Option three'
104
- value: 'option3'
102
+ another_attribute: attribute 1
103
+ something_else: attribute 2
104
+ - text: Option two
105
+ value: option2
106
+ - text: Option three
107
+ value: option3
105
108
  with_error:
106
109
  description: If the user has to select an option, it is recommended that a radio button is used instead of a select, but this is not always possible. Note that `error_id` is optional, if it is not passed one will be generated automatically.
107
110
  data:
108
- id: 'dropdown4-1'
109
- label: 'How will you be travelling to the conference?'
110
- error_message: 'Please choose an option'
111
- error_id: 'error_id'
111
+ id: dropdown4-1
112
+ label: How will you be travelling to the conference?
113
+ error_message: Please choose an option
114
+ error_id: error_id
112
115
  options:
113
116
  - text: ""
114
117
  value: ""
115
- - text: 'Public transport'
116
- value: 'option1'
117
- - text: 'Will make own arrangements'
118
- value: 'option2'
118
+ - text: Public transport
119
+ value: option1
120
+ - text: Will make own arrangements
121
+ value: option2
119
122
  with_error_id_but_no_message:
120
123
  description: For some selects the error message should be rendered separately but an error state is still required (currently required in smart answers). In this scenario an `error_id` can be passed without an `error_message` to highlight the component and set `aria-describedby` correctly.
121
124
  data:
122
- id: 'dropdown4-2'
123
- label: 'What lunch option would you like?'
124
- error_id: 'error_id'
125
+ id: dropdown4-2
126
+ label: What lunch option would you like?
127
+ error_id: error_id
125
128
  options:
126
129
  - text: ""
127
130
  value: ""
128
- - text: 'Vegetarian'
129
- value: 'option1'
130
- - text: 'Meat'
131
- value: 'option2'
131
+ - text: Vegetarian
132
+ value: option1
133
+ - text: Meat
134
+ value: option2
132
135
  full_width:
133
136
  description: Make the select width 100%. This is used for facets in finder-frontend's search.
134
137
  data:
135
- id: 'dropdown5'
136
- label: 'Really wide'
138
+ id: dropdown5
139
+ label: Really wide
137
140
  full_width: true
138
141
  options:
139
- - text: 'Option one'
140
- value: 'option1'
141
- - text: 'Option two'
142
- value: 'option2'
143
- - text: 'Option three'
144
- value: 'option3'
142
+ - text: Option one
143
+ value: option1
144
+ - text: Option two
145
+ value: option2
146
+ - text: Option three
147
+ value: option3
145
148
  with_custom_label_size:
146
149
  description: Make the label different sizes. Valid options are `s`, `m`, `l` and `xl`.
147
150
  data:
148
- id: 'dropdown6'
149
- label: 'Bigger!'
150
- heading_size: 'xl'
151
+ id: dropdown6
152
+ label: Bigger!
153
+ heading_size: xl
151
154
  options:
152
- - text: 'Option one'
153
- value: 'option1'
154
- - text: 'Option two'
155
- value: 'option2'
156
- - text: 'Option three'
157
- value: 'option3'
155
+ - text: Option one
156
+ value: option1
157
+ - text: Option two
158
+ value: option2
159
+ - text: Option three
160
+ value: option3
158
161
  with_page_heading:
159
162
  description: This adds a `h1` element with a label element inside containing the text supplied.
160
163
  data:
161
- id: 'select-with-heading'
162
- label: 'This is a page heading'
163
- heading_size: 'xl'
164
+ id: select-with-heading
165
+ label: This is a page heading
166
+ heading_size: xl
164
167
  is_page_heading: true
165
168
  options:
166
- - text: 'Option one'
167
- value: 'option1'
168
- - text: 'Option two'
169
- value: 'option2'
169
+ - text: Option one
170
+ value: option1
171
+ - text: Option two
172
+ value: option2
@@ -87,7 +87,12 @@ examples:
87
87
  - text: £125
88
88
  format: numeric
89
89
  with_sortable_head:
90
- description: This option allows links to be added to the table headers for sorting. Sorting must be handled server side, it is not done by the component.
90
+ description: |
91
+ This option allows links to be added to the table headers for sorting. Sorting must be handled server side, it is not done by the component.
92
+
93
+ The example shown applies a tracking attribute specifically for use by Google Tag Manager in [Content Publisher](https://github.com/alphagov/content-publisher).
94
+
95
+ Other data attributes can also be applied as required. Note that the component does not include built in tracking. If this is required consider using the [track click script](https://github.com/alphagov/govuk_publishing_components/blob/main/docs/analytics/track-click.md).
91
96
  data:
92
97
  sortable: true
93
98
  head:
@@ -134,3 +139,33 @@ examples:
134
139
  format: numeric
135
140
  - text: £80
136
141
  format: numeric
142
+ with_filter:
143
+ description: This option allows table rows to be filtered by user input. Since this filtering is implemented client-side the filter section is not displayed by default but displays only when JavaScript is enabled. The label for the input field can be set when the coponent is rendered via the `label` key. if this is not set a fallback value will display.
144
+ data:
145
+ filterable: true
146
+ label: Filter months
147
+ head:
148
+ - text: Month you apply
149
+ - text: Rate for bicycles
150
+ format: numeric
151
+ - text: Rate for vehicles
152
+ format: numeric
153
+ rows:
154
+ -
155
+ - text: January
156
+ - text: £85
157
+ format: numeric
158
+ - text: £95
159
+ format: numeric
160
+ -
161
+ - text: February
162
+ - text: £75
163
+ format: numeric
164
+ - text: £55
165
+ format: numeric
166
+ -
167
+ - text: March
168
+ - text: £165
169
+ format: numeric
170
+ - text: £125
171
+ format: numeric
@@ -64,6 +64,10 @@ examples:
64
64
  content: |
65
65
  <p class="govuk-body-m">Here is a single piece of content, there should be no tabs.</p>
66
66
  with_data_attributes:
67
+ description: |
68
+ The example shown applies a tracking attribute specifically for use by Google Tag Manager in [Content Publisher](https://github.com/alphagov/content-publisher).
69
+
70
+ Other data attributes can also be applied as required. Note that the component does not include built in tracking. If this is required consider using the [track click script](https://github.com/alphagov/govuk_publishing_components/blob/main/docs/analytics/track-click.md).
67
71
  data:
68
72
  tabs:
69
73
  - id: "tab-with-data-attributes-1"
@@ -135,7 +135,9 @@ ar:
135
135
  organisation_schema:
136
136
  all_content_search_description: العثور عن كل المحتوى من %{organisation}
137
137
  previous_and_next_navigation:
138
+ next:
138
139
  pagination: ترقيم الصفحات
140
+ previous:
139
141
  print_link:
140
142
  text: طباعة هذه الصفحة
141
143
  radio:
@@ -201,5 +203,9 @@ ar:
201
203
  summary_list:
202
204
  delete: حذف
203
205
  edit: تغيير
206
+ table:
207
+ filter_count:
208
+ filter_label:
209
+ filter_message:
204
210
  tabs:
205
211
  contents: المحتويات
@@ -131,7 +131,9 @@ az:
131
131
  organisation_schema:
132
132
  all_content_search_description: "%{organisation}-dan bütün məzmunu tap"
133
133
  previous_and_next_navigation:
134
+ next:
134
135
  pagination: Səhifələrə bölmə
136
+ previous:
135
137
  print_link:
136
138
  text: Bu səhifəni çap et
137
139
  radio:
@@ -197,5 +199,9 @@ az:
197
199
  summary_list:
198
200
  delete: Sil
199
201
  edit: Dəyiş
202
+ table:
203
+ filter_count:
204
+ filter_label:
205
+ filter_message:
200
206
  tabs:
201
207
  contents: Məzmunlar
@@ -138,7 +138,9 @@ be:
138
138
  organisation_schema:
139
139
  all_content_search_description: Шукаць увесь змест з %{organisation}
140
140
  previous_and_next_navigation:
141
+ next:
141
142
  pagination: Месцаванне старонак
143
+ previous:
142
144
  print_link:
143
145
  text: Надрукаваць гэтую странiцу
144
146
  radio:
@@ -204,5 +206,9 @@ be:
204
206
  summary_list:
205
207
  delete: Выдаліць
206
208
  edit: Змянiць
209
+ table:
210
+ filter_count:
211
+ filter_label:
212
+ filter_message:
207
213
  tabs:
208
214
  contents: Змест
@@ -136,7 +136,9 @@ bg:
136
136
  organisation_schema:
137
137
  all_content_search_description: Намиране на цялото съдържание от %{organisation}
138
138
  previous_and_next_navigation:
139
+ next:
139
140
  pagination: Страниране
141
+ previous:
140
142
  print_link:
141
143
  text: Отпечатване на страницата
142
144
  radio:
@@ -202,5 +204,9 @@ bg:
202
204
  summary_list:
203
205
  delete: Изтриване
204
206
  edit: Промяна
207
+ table:
208
+ filter_count:
209
+ filter_label:
210
+ filter_message:
205
211
  tabs:
206
212
  contents: Съдържание
@@ -133,7 +133,9 @@ bn:
133
133
  organisation_schema:
134
134
  all_content_search_description: "%{organisation}-এর সকল বিষয়বস্তু খুঁজে বের করুন"
135
135
  previous_and_next_navigation:
136
+ next:
136
137
  pagination: পেজিনেশন
138
+ previous:
137
139
  print_link:
138
140
  text: এই পৃষ্ঠাটি প্রিন্ট করুন
139
141
  radio:
@@ -199,5 +201,9 @@ bn:
199
201
  summary_list:
200
202
  delete: মুছে ফেলুন
201
203
  edit: পরিবর্তন
204
+ table:
205
+ filter_count:
206
+ filter_label:
207
+ filter_message:
202
208
  tabs:
203
209
  contents: বিষয়সূচী
@@ -137,7 +137,9 @@ cs:
137
137
  organisation_schema:
138
138
  all_content_search_description: Najít veškerý obsah z %{organisation}
139
139
  previous_and_next_navigation:
140
+ next:
140
141
  pagination: Stránkování
142
+ previous:
141
143
  print_link:
142
144
  text: Vytisknout tuto stránku
143
145
  radio:
@@ -203,5 +205,9 @@ cs:
203
205
  summary_list:
204
206
  delete: Odstranit
205
207
  edit: Změna
208
+ table:
209
+ filter_count:
210
+ filter_label:
211
+ filter_message:
206
212
  tabs:
207
213
  contents: Obsah
@@ -136,7 +136,9 @@ cy:
136
136
  organisation_schema:
137
137
  all_content_search_description: Dod o hyd i'r holl gynnwys gan %{organisation}
138
138
  previous_and_next_navigation:
139
+ next:
139
140
  pagination: Tudalennu
141
+ previous:
140
142
  print_link:
141
143
  text: Argraffu'r dudalen hon
142
144
  radio:
@@ -202,5 +204,9 @@ cy:
202
204
  summary_list:
203
205
  delete: Dileu
204
206
  edit: Newid
207
+ table:
208
+ filter_count:
209
+ filter_label:
210
+ filter_message:
205
211
  tabs:
206
212
  contents: Cynnwys
@@ -133,7 +133,9 @@ da:
133
133
  organisation_schema:
134
134
  all_content_search_description: Find alt indhold fra %{organisation}
135
135
  previous_and_next_navigation:
136
+ next:
136
137
  pagination: Paginering
138
+ previous:
137
139
  print_link:
138
140
  text: Udskriv denne side
139
141
  radio:
@@ -199,5 +201,9 @@ da:
199
201
  summary_list:
200
202
  delete: Slet
201
203
  edit: Ændre
204
+ table:
205
+ filter_count:
206
+ filter_label:
207
+ filter_message:
202
208
  tabs:
203
209
  contents: Indhold