govuk_publishing_components 24.8.0 → 24.9.4

Sign up to get free protection for your applications and to get access to all the features.
Files changed (47) hide show
  1. checksums.yaml +4 -4
  2. data/app/assets/javascripts/govuk_publishing_components/analytics/scroll-tracker.js +7 -0
  3. data/app/assets/javascripts/govuk_publishing_components/components/accordion.js +35 -4
  4. data/app/assets/javascripts/govuk_publishing_components/lib/govspeak/magna-charta.js +1 -1
  5. data/app/assets/stylesheets/govuk_publishing_components/components/_action-link.scss +0 -2
  6. data/app/assets/stylesheets/govuk_publishing_components/components/_button.scss +0 -8
  7. data/app/assets/stylesheets/govuk_publishing_components/components/_contextual-sidebar.scss +0 -37
  8. data/app/assets/stylesheets/govuk_publishing_components/components/_highlight-boxes.scss +1 -2
  9. data/app/assets/stylesheets/govuk_publishing_components/components/_image-card.scss +0 -4
  10. data/app/assets/stylesheets/govuk_publishing_components/components/_layout-header.scss +1 -11
  11. data/app/assets/stylesheets/govuk_publishing_components/components/_previous-and-next-navigation.scss +0 -1
  12. data/app/assets/stylesheets/govuk_publishing_components/components/_print-link.scss +0 -1
  13. data/app/assets/stylesheets/govuk_publishing_components/components/_related-navigation.scss +0 -1
  14. data/app/assets/stylesheets/govuk_publishing_components/components/_share-links.scss +0 -1
  15. data/app/assets/stylesheets/govuk_publishing_components/components/_step-by-step-nav-related.scss +0 -4
  16. data/app/assets/stylesheets/govuk_publishing_components/components/_subscription-links.scss +0 -1
  17. data/app/assets/stylesheets/govuk_publishing_components/components/_success-alert.scss +1 -32
  18. data/app/assets/stylesheets/govuk_publishing_components/components/_translation-nav.scss +0 -4
  19. data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_button.scss +16 -2
  20. data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_charts.scss +0 -1
  21. data/app/assets/stylesheets/govuk_publishing_components/govuk_frontend_support.scss +15 -0
  22. data/app/views/govuk_publishing_components/component_guide/index.html.erb +2 -2
  23. data/app/views/govuk_publishing_components/component_guide/show.html.erb +1 -1
  24. data/app/views/govuk_publishing_components/components/_accordion.html.erb +25 -0
  25. data/app/views/govuk_publishing_components/components/_highlight_boxes.html.erb +1 -1
  26. data/app/views/govuk_publishing_components/components/_image_card.html.erb +14 -11
  27. data/app/views/govuk_publishing_components/components/_layout_header.html.erb +2 -2
  28. data/app/views/govuk_publishing_components/components/_previous_and_next_navigation.html.erb +2 -2
  29. data/app/views/govuk_publishing_components/components/_print_link.html.erb +2 -2
  30. data/app/views/govuk_publishing_components/components/_share_links.html.erb +1 -1
  31. data/app/views/govuk_publishing_components/components/_step_by_step_nav_related.html.erb +4 -4
  32. data/app/views/govuk_publishing_components/components/_subscription_links.html.erb +3 -3
  33. data/app/views/govuk_publishing_components/components/_success_alert.html.erb +24 -8
  34. data/app/views/govuk_publishing_components/components/_translation_nav.html.erb +1 -1
  35. data/app/views/govuk_publishing_components/components/contextual_sidebar/_brexit_cta.html.erb +9 -27
  36. data/app/views/govuk_publishing_components/components/docs/accordion.yml +73 -73
  37. data/app/views/govuk_publishing_components/components/docs/image_card.yml +12 -0
  38. data/app/views/govuk_publishing_components/components/docs/modal_dialogue.yml +3 -0
  39. data/app/views/govuk_publishing_components/components/docs/success_alert.yml +17 -1
  40. data/app/views/govuk_publishing_components/components/feedback/_yes_no_banner.html.erb +1 -1
  41. data/app/views/govuk_publishing_components/components/related_navigation/_section.html.erb +2 -1
  42. data/config/locales/cy.yml +0 -5
  43. data/config/locales/en.yml +12 -6
  44. data/lib/govuk_publishing_components/presenters/contextual_navigation.rb +0 -4
  45. data/lib/govuk_publishing_components/presenters/shared_helper.rb +10 -0
  46. data/lib/govuk_publishing_components/version.rb +1 -1
  47. metadata +22 -2
@@ -35,6 +35,18 @@ examples:
35
35
  image_alt: "some meaningful alt text please"
36
36
  heading_text: "I am not a heading"
37
37
  heading_level: 0
38
+ with_different_link_size:
39
+ description: |
40
+ Set a different font size for the link. Uses the [GOV.UK Frontend heading sizes](https://design-system.service.gov.uk/styles/typography/#headings) but defaults to 19px for legacy reasons. Valid options are `xl`, `l`, `m` and `s`.
41
+
42
+ This option is not tied to the `heading_level` option in order to give flexibility.
43
+ data:
44
+ href: "/definitely-not-a-page"
45
+ image_src: "https://assets.publishing.service.gov.uk/government/uploads/system/uploads/feature/image/62756/s300_courts-of-justice.JPG"
46
+ image_alt: "some meaningful alt text please"
47
+ heading_text: "I am a big link"
48
+ heading_level: 0
49
+ font_size: 'xl'
38
50
  with_more_information:
39
51
  data:
40
52
  href: "/also-not-a-page"
@@ -8,6 +8,8 @@ body: |
8
8
  When the component is not limited to presenting information (e.g. an alert dialog or an informative dialog) and it contains interactive elements (e.g. form elements) you should use the `aria_label` attribute.
9
9
  This will provide context around what the modal dialogue is about and will prevent it from being too verbose for screen reader users (if `aria_label` is not specified the whole modal content will be read out).
10
10
 
11
+ Modal components must be a direct descendant of the `<body>` element; we recommend placing it toward the end of the document for performance considerations.
12
+
11
13
  This component is currently experimental. If you are using it, please feed back any research findings to the Content Publisher team.
12
14
  accessibility_criteria: |
13
15
  The modal dialogue box must:
@@ -21,6 +23,7 @@ accessibility_criteria: |
21
23
  - can be operable with a keyboard (allows the ESC key to close the dialogue)
22
24
  - return focus to last focused element on close
23
25
 
26
+ display_preview: false
24
27
  examples:
25
28
  default:
26
29
  embed: |
@@ -1,5 +1,7 @@
1
1
  name: Success alert
2
2
  description: Used at the top of the page, to summarise a successful user action.
3
+ govuk_frontend_components:
4
+ - notification-banner
3
5
  accessibility_criteria: |
4
6
  - should be focused on page load, to ensure the message is noticed by
5
7
  assistive tech
@@ -10,9 +12,23 @@ examples:
10
12
  data:
11
13
  message: Message to alert the user to a successful action goes here
12
14
  with_message_and_description:
15
+ description: Descriptions can be passed as plain text but it is strongly recommended that you pass these as html, cleaned using `raw` or `sanitize`.
13
16
  data:
14
17
  message: Message to alert the user to a successful action goes here
15
- description: A further description
18
+ description: <p class="govuk-body">A further description</p>
19
+ with_custom_title_id:
20
+ description: |
21
+ This is for the heading element at the head of the component (reading "Success" by default) where the id is used by an `aria-labelledby` on screen reader focus of the element.
22
+
23
+ Please ensure that this id is unique across the view you are building.
24
+ data:
25
+ message: Message to alert the user to a successful action goes here
26
+ title_id: my-custom-success-id
27
+ with_styled_link:
28
+ description: If you need to include a link in your success alert, you need to specify the `govuk-link` and `govuk-notification-banner__link` classes on that link element. This is in line with Design System guidance that the colour of the link in success notification banners can look jarring if any links are a different colour to the principal colour used by the success banner.
29
+ data:
30
+ message: Message to alert the user to a successful action goes here
31
+ description: <p class="govuk-body">A further description with <a href="/a-cool-page" class="govuk-link govuk-notification-banner__link">a link</a></p>
16
32
  long_example:
17
33
  data:
18
34
  message: |
@@ -28,7 +28,7 @@
28
28
  </div>
29
29
  <div class="gem-c-feedback__prompt-questions gem-c-feedback__prompt-questions--something-is-wrong js-prompt-questions">
30
30
  <button class="govuk-button gem-c-feedback__prompt-link js-toggle-form js-something-is-wrong" data-track-category="Onsite Feedback" data-track-action="GOV-UK Open Form" aria-controls="something-is-wrong" aria-expanded="false">
31
- <%= t("components.feedback.something_wrong", default: "There is something wrong with this page") %>
31
+ <%= t("components.feedback.something_wrong", default: "Report a problem with this page") %>
32
32
  </button>
33
33
  </div>
34
34
  </div>
@@ -23,10 +23,11 @@
23
23
 
24
24
  <% links.each.with_index(1) do |link, index| %>
25
25
  <%
26
+ link_class = "govuk-link #{related_nav_helper.section_css_class("govuk-link gem-c-related-navigation__section-link", section_title, link: link, link_is_inline: (index >= section_link_limit))}"
26
27
  link_element = link_to(
27
28
  link[:text],
28
29
  link[:path],
29
- class: related_nav_helper.section_css_class("gem-c-related-navigation__section-link", section_title, link: link, link_is_inline: (index >= section_link_limit)),
30
+ class: link_class,
30
31
  rel: link[:rel],
31
32
  lang: shared_helper.t_locale_check(link[:locale]),
32
33
  data: {
@@ -13,8 +13,3 @@ cy:
13
13
  title: "Brexit"
14
14
  link_path: "/transition.cy"
15
15
  link_text: "Gwiriwch beth sydd angen i chi ei wneud"
16
- take_action_list:
17
- red: Gwiriwch
18
- amber: Newidiwch
19
- green: Ewch
20
- aria_label: Ymgyrch slogan Brexit, Gwiriwch, Newidiwch, Ewch.
@@ -23,6 +23,12 @@ en:
23
23
  common:
24
24
  translations: "Translations"
25
25
  components:
26
+ accordion:
27
+ show: "Show"
28
+ hide: "Hide"
29
+ show_all: "Show all sections"
30
+ hide_all: "Hide all sections"
31
+ this_section_visually_hidden: " this section"
26
32
  attachment:
27
33
  opendocument_html: "This file is in an <a href='https://www.gov.uk/guidance/using-open-document-formats-odf-in-your-organisation' target=%{target} class='govuk-link'>OpenDocument</a> format"
28
34
  request_format_text: "This file may not be suitable for users of assistive technology."
@@ -44,7 +50,7 @@ en:
44
50
  is_useful: "this page is useful"
45
51
  is_not_useful: "this page is not useful"
46
52
  thank_you_for_feedback: "Thank you for your feedback"
47
- something_wrong: "There is something wrong with this page"
53
+ something_wrong: "Report a problem with this page"
48
54
  close: "Close"
49
55
  help_us_improve_govuk: "Help us improve GOV.UK"
50
56
  more_about_visit: "To help us improve GOV.UK, we’d like to know more about your visit today. We’ll send you a link to a feedback form. It will take only 2 minutes to fill in. Don’t worry we won’t send you spam or share your email address with anyone."
@@ -58,6 +64,9 @@ en:
58
64
  search_button: "Search GOV.UK"
59
65
  show_button: "Show search"
60
66
  hide_button: "Hide search"
67
+ top_level: "Top level"
68
+ nav_items_aria_label: "Show or hide Top Level Navigation"
69
+ menu: "Menu"
61
70
  organisation_schema:
62
71
  all_content_search_description: "Find all content from %{organisation}"
63
72
  radio:
@@ -79,11 +88,6 @@ en:
79
88
  title: "Brexit"
80
89
  link_path: "/transition"
81
90
  link_text: "Check what you need to do"
82
- take_action_list:
83
- red: "Check"
84
- amber: "Change"
85
- green: "Go"
86
- aria_label: "Brexit campaign slogan, Check, Change, Go."
87
91
  related_footer_navigation:
88
92
  collections: "Collections"
89
93
  policies: "Policies"
@@ -100,6 +104,8 @@ en:
100
104
  hide_password: "Hide password"
101
105
  announce_show: "Your password is shown"
102
106
  announce_hide: "Your password is hidden"
107
+ success_alert:
108
+ success: "Success"
103
109
  print_link:
104
110
  text: "Print this page"
105
111
  skip_link:
@@ -206,8 +206,6 @@ module GovukPublishingComponents
206
206
  # Environment
207
207
  # International
208
208
  # Defence and armed forces
209
- # Society and culture
210
- # Government
211
209
  # Work
212
210
  # Welfare
213
211
  # Money
@@ -225,8 +223,6 @@ module GovukPublishingComponents
225
223
  3cf97f69-84de-41ae-bc7b-7e2cc238fa58
226
224
  37d0fa26-abed-4c74-8835-b3b51ae1c8b2
227
225
  e491505c-77ae-45b2-84be-8c94b94f6a2b
228
- e2ca2f1a-0ff3-43ce-b813-16645ff27904
229
- e48ab80a-de80-4e83-bf59-26316856a5f9
230
226
  d0f1e5a3-c8f4-4780-8678-994f19104b21
231
227
  dded88e2-f92e-424f-b73e-6ad24a839c51
232
228
  6acc9db4-780e-4a46-92b4-1812e3c2c48a
@@ -31,6 +31,16 @@ module GovukPublishingComponents
31
31
  "span"
32
32
  end
33
33
 
34
+ def get_heading_size(option, fallback)
35
+ govuk_class = "govuk-heading-"
36
+
37
+ if %w[xl l m s].include? option
38
+ "#{govuk_class}#{option}"
39
+ else
40
+ "#{govuk_class}#{fallback}"
41
+ end
42
+ end
43
+
34
44
  def t_locale(content, options = {})
35
45
  # Check if the content string has a translation
36
46
  content_translation_available = translation_present?(content)
@@ -1,3 +1,3 @@
1
1
  module GovukPublishingComponents
2
- VERSION = "24.8.0".freeze
2
+ VERSION = "24.9.4".freeze
3
3
  end
metadata CHANGED
@@ -1,14 +1,14 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: govuk_publishing_components
3
3
  version: !ruby/object:Gem::Version
4
- version: 24.8.0
4
+ version: 24.9.4
5
5
  platform: ruby
6
6
  authors:
7
7
  - GOV.UK Dev
8
8
  autorequire:
9
9
  bindir: bin
10
10
  cert_chain: []
11
- date: 2021-03-29 00:00:00.000000000 Z
11
+ date: 2021-04-22 00:00:00.000000000 Z
12
12
  dependencies:
13
13
  - !ruby/object:Gem::Dependency
14
14
  name: govuk_app_config
@@ -192,6 +192,26 @@ dependencies:
192
192
  - - "~>"
193
193
  - !ruby/object:Gem::Version
194
194
  version: 3.0.0
195
+ - !ruby/object:Gem::Dependency
196
+ name: percy-capybara
197
+ requirement: !ruby/object:Gem::Requirement
198
+ requirements:
199
+ - - "~>"
200
+ - !ruby/object:Gem::Version
201
+ version: '4.0'
202
+ - - ">="
203
+ - !ruby/object:Gem::Version
204
+ version: 4.0.2
205
+ type: :development
206
+ prerelease: false
207
+ version_requirements: !ruby/object:Gem::Requirement
208
+ requirements:
209
+ - - "~>"
210
+ - !ruby/object:Gem::Version
211
+ version: '4.0'
212
+ - - ">="
213
+ - !ruby/object:Gem::Version
214
+ version: 4.0.2
195
215
  - !ruby/object:Gem::Dependency
196
216
  name: pry-byebug
197
217
  requirement: !ruby/object:Gem::Requirement