govuk-components 2.0.0rc1 → 2.0.1
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/README.md +74 -40
- data/app/components/govuk_component/cookie_banner_component/message_component.rb +10 -7
- data/app/components/govuk_component/header_component.html.erb +1 -5
- data/app/components/govuk_component/header_component.rb +8 -0
- data/app/components/govuk_component/summary_list_component/action_component.rb +1 -1
- data/app/components/govuk_component/summary_list_component/row_component.rb +1 -1
- data/app/components/govuk_component/summary_list_component/value_component.rb +1 -1
- data/lib/govuk/components/version.rb +1 -1
- metadata +6 -6
checksums.yaml
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
---
|
|
2
2
|
SHA256:
|
|
3
|
-
metadata.gz:
|
|
4
|
-
data.tar.gz:
|
|
3
|
+
metadata.gz: bc521c772f5513d62d1b8fd78e77a504c4c1eb913770ffc1dd5d2d3020946980
|
|
4
|
+
data.tar.gz: ee85598308825985ca7e84120562fbecb04c7b6f359aba0bc37386e2a33f8a9f
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: 0c20bba8e5c5b9457d2065edd6f496f8ad93f1baebc7206e5a89260629db9713b59385f61857312aff3947716bc2d1e14064843dd6543655a619e1a050a88f4c
|
|
7
|
+
data.tar.gz: 8f1c590b69e35bb0ba47840a7fc7f3b12eb6ec6ee30ef92e58cfb67852a1954633808911100160491a0fd1a1d8a1353603cdbcc2eae55fa0686782717a9aa250
|
data/README.md
CHANGED
|
@@ -4,61 +4,86 @@
|
|
|
4
4
|
[](https://codeclimate.com/github/DFE-Digital/govuk-components/maintainability)
|
|
5
5
|
[](https://codeclimate.com/github/DFE-Digital/govuk-components/test_coverage)
|
|
6
6
|
[](https://github.com/DFE-Digital/govuk-components/blob/master/LICENSE)
|
|
7
|
-
[](https://design-system.service.gov.uk)
|
|
7
|
+
[](https://design-system.service.gov.uk)
|
|
9
8
|
|
|
10
9
|
This gem provides a suite of reusable components for the [GOV.UK Design System](https://design-system.service.gov.uk/). It is intended to provide a lightweight alternative to the [GOV.UK Publishing Components](https://github.com/alphagov/govuk_publishing_components) library and is built with Github's [ViewComponent](https://github.com/github/view_component) framework.
|
|
11
10
|
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
*
|
|
36
|
-
*
|
|
37
|
-
*
|
|
38
|
-
|
|
39
|
-
|
|
11
|
+
It aims to implement the functionality from the original Nunjucks macros in a way that will feel more familiar to Rails developers. Blocks are preferred over strings of HTML, beneath the surface each component is just a Ruby object, everything is inheritable and overrideable.
|
|
12
|
+
|
|
13
|
+
## What's included?
|
|
14
|
+
|
|
15
|
+
All of the non-form components from the GOV.UK Design System are implmented by this library as ViewComponents. Form components are implemented by the [form builder](https://govuk-form-builder.netlify.app/).
|
|
16
|
+
|
|
17
|
+
The provided components are:
|
|
18
|
+
|
|
19
|
+
* [Accordion](https://dfe-digital.github.io/govuk-components/#accordion)
|
|
20
|
+
* [Back link](https://dfe-digital.github.io/govuk-components/#back-links)
|
|
21
|
+
* [Back to top link](https://dfe-digital.github.io/govuk-components/#back-to-top-link)
|
|
22
|
+
* [Breadcrumbs](https://dfe-digital.github.io/govuk-components/#breadcrumbs)
|
|
23
|
+
* [Cookie banner](https://dfe-digital.github.io/govuk-components/#cookie-banner)
|
|
24
|
+
* [Details](https://dfe-digital.github.io/govuk-components/#details)
|
|
25
|
+
* [Footer](https://dfe-digital.github.io/govuk-components/#footer)
|
|
26
|
+
* [Header](https://dfe-digital.github.io/govuk-components/#header)
|
|
27
|
+
* [Inset text](https://dfe-digital.github.io/govuk-components/#inset-text)
|
|
28
|
+
* [Notification banner](https://dfe-digital.github.io/govuk-components/#notification-banner)
|
|
29
|
+
* [Panel](https://dfe-digital.github.io/govuk-components/#panel)
|
|
30
|
+
* [Phase banner](https://dfe-digital.github.io/govuk-components/#phase-banner)
|
|
31
|
+
* [Skip link](https://dfe-digital.github.io/govuk-components/#skip-link)
|
|
32
|
+
* [Start button](https://dfe-digital.github.io/govuk-components/#start-button)
|
|
33
|
+
* [Summary list](https://dfe-digital.github.io/govuk-components/#summary-list)
|
|
34
|
+
* [Tabs](https://dfe-digital.github.io/govuk-components/#tabs)
|
|
35
|
+
* [Tags](https://dfe-digital.github.io/govuk-components/#tags)
|
|
36
|
+
* [Warning text](https://dfe-digital.github.io/govuk-components/#warning-text)
|
|
37
|
+
|
|
38
|
+
This library also provides [several link helpers](https://dfe-digital.github.io/govuk-components/#links-and-buttons) that are commonly used in services, including `#govuk_link_to` and `#govuk_button_to`.
|
|
39
|
+
|
|
40
|
+
## Alternative syntax
|
|
41
|
+
|
|
42
|
+
All of the components can be rendered in two ways:
|
|
43
|
+
|
|
44
|
+
* directly using Rails' `#render` method:
|
|
45
|
+
|
|
46
|
+
```erb
|
|
47
|
+
<%= render GovukComponent::GovukComponent::WarningTextComponent.new do %>
|
|
48
|
+
A serious warning
|
|
49
|
+
<% end %>
|
|
50
|
+
```
|
|
51
|
+
|
|
52
|
+
* via the helper wrapper:
|
|
53
|
+
|
|
54
|
+
```erb
|
|
55
|
+
<%= govuk_warning_text do %>
|
|
56
|
+
A serious warning
|
|
57
|
+
<% end %>
|
|
58
|
+
```
|
|
59
|
+
|
|
60
|
+
The naming convention for helpers is `govuk_` followed by the component's name in snake case. You can
|
|
61
|
+
see the full list in [GovukComponentsHelper](app/helpers/govuk_components_helper.rb).
|
|
40
62
|
|
|
41
63
|
## Example use
|
|
42
64
|
|
|
43
|
-
This library allows components to be rendered with Rails' `render` method or via the provided helpers. Here we'll use the `
|
|
65
|
+
This library allows components to be rendered with Rails' `render` method or via the provided helpers. Here we'll use the `govuk_tabs` to render three tabbed sections:
|
|
44
66
|
|
|
45
67
|
```erb
|
|
46
|
-
<%=
|
|
47
|
-
|
|
48
|
-
<p
|
|
68
|
+
<%= govuk_tabs(title: 'Days of the week') do |component| %>
|
|
69
|
+
<% component.tab(label: 'Monday') do %>
|
|
70
|
+
<p>Monday's child is fair of face</p>
|
|
49
71
|
<% end %>
|
|
50
|
-
|
|
51
|
-
|
|
72
|
+
|
|
73
|
+
<% component.tab(label: 'Tuesday') do %>
|
|
74
|
+
<p>Tuesday's child is full of grace</p>
|
|
52
75
|
<% end %>
|
|
53
|
-
|
|
54
|
-
|
|
76
|
+
|
|
77
|
+
<% component.tab(label: 'Wednesday') do %>
|
|
78
|
+
<p>Wednesday's child is full of woe</p>
|
|
55
79
|
<% end %>
|
|
56
80
|
<% end %>
|
|
81
|
+
|
|
57
82
|
```
|
|
58
83
|
|
|
59
|
-
Here
|
|
84
|
+
Here are the rendered tabs:
|
|
60
85
|
|
|
61
|
-
|
|
62
87
|
|
|
63
88
|
For examples on usage see the [guide page](https://dfe-digital.github.io/govuk-components/).
|
|
64
89
|
|
|
@@ -70,6 +95,15 @@ Add this line to your `config/application.rb`:
|
|
|
70
95
|
require "govuk/components"
|
|
71
96
|
```
|
|
72
97
|
|
|
98
|
+
## Services using this library
|
|
99
|
+
|
|
100
|
+
* [Apply for teacher training](https://github.com/DFE-Digital/apply-for-teacher-training)
|
|
101
|
+
* [Find postgraduate teacher training](https://github.com/DFE-Digital/find-teacher-training)
|
|
102
|
+
* [Get help with technology](https://github.com/DFE-Digital/get-help-with-tech)
|
|
103
|
+
* [Publish teacher training courses](https://github.com/DFE-Digital/publish-teacher-training)
|
|
104
|
+
* [Register trainee teachers](https://github.com/DFE-Digital/register-trainee-teachers)
|
|
105
|
+
* [Teaching Vacancies](https://github.com/DFE-Digital/teaching-vacancies)
|
|
106
|
+
|
|
73
107
|
## Installation
|
|
74
108
|
|
|
75
109
|
Add this line to your application's Gemfile:
|
|
@@ -15,11 +15,12 @@ class GovukComponent::CookieBannerComponent::MessageComponent < GovukComponent::
|
|
|
15
15
|
|
|
16
16
|
def call
|
|
17
17
|
tag.div(class: classes, role: role, hidden: hidden, **html_attributes) do
|
|
18
|
-
|
|
19
|
-
tag.div(class: "govuk-grid-
|
|
20
|
-
safe_join([heading_element, message_element
|
|
21
|
-
end
|
|
22
|
-
|
|
18
|
+
safe_join([
|
|
19
|
+
tag.div(class: "govuk-grid-row") do
|
|
20
|
+
tag.div(class: "govuk-grid-column-two-thirds") { safe_join([heading_element, message_element]) }
|
|
21
|
+
end,
|
|
22
|
+
actions_element
|
|
23
|
+
])
|
|
23
24
|
end
|
|
24
25
|
end
|
|
25
26
|
|
|
@@ -30,11 +31,13 @@ private
|
|
|
30
31
|
end
|
|
31
32
|
|
|
32
33
|
def heading_element
|
|
33
|
-
|
|
34
|
+
return if heading_content.blank?
|
|
35
|
+
|
|
36
|
+
tag.h2(heading_content, class: %w(govuk-cookie-banner__heading govuk-heading-m))
|
|
34
37
|
end
|
|
35
38
|
|
|
36
39
|
def heading_content
|
|
37
|
-
heading_html || heading_text
|
|
40
|
+
heading_html || heading_text
|
|
38
41
|
end
|
|
39
42
|
|
|
40
43
|
def message_element
|
|
@@ -33,11 +33,7 @@
|
|
|
33
33
|
<%= tag.ul(class: navigation_classes, id: "navigation", aria: { label: navigation_label }) do %>
|
|
34
34
|
<% navigation_items.each do |item| %>
|
|
35
35
|
<%= tag.li(class: item.classes.append(item.active_class), **item.html_attributes) do %>
|
|
36
|
-
|
|
37
|
-
<%= link_to(item.text, item.href, class: "govuk-header__link") %>
|
|
38
|
-
<% else %>
|
|
39
|
-
<%= item.text %>
|
|
40
|
-
<% end %>
|
|
36
|
+
<%= item %>
|
|
41
37
|
<% end %>
|
|
42
38
|
<% end %>
|
|
43
39
|
<% end %>
|
|
@@ -18,7 +18,7 @@ class GovukComponent::SummaryListComponent::ActionComponent < GovukComponent::Ba
|
|
|
18
18
|
link_classes = govuk_link_classes.append(classes).flatten
|
|
19
19
|
|
|
20
20
|
link_to(href, class: link_classes, **html_attributes) do
|
|
21
|
-
safe_join([action_text, visually_hidden_span])
|
|
21
|
+
safe_join([action_text, visually_hidden_span].compact, " ")
|
|
22
22
|
end
|
|
23
23
|
end
|
|
24
24
|
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
class GovukComponent::SummaryListComponent::RowComponent < GovukComponent::Base
|
|
2
|
-
attr_reader :href, :
|
|
2
|
+
attr_reader :href, :visually_hidden_text
|
|
3
3
|
|
|
4
4
|
renders_one :key, GovukComponent::SummaryListComponent::KeyComponent
|
|
5
5
|
renders_one :value, GovukComponent::SummaryListComponent::ValueComponent
|
metadata
CHANGED
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
|
2
2
|
name: govuk-components
|
|
3
3
|
version: !ruby/object:Gem::Version
|
|
4
|
-
version: 2.0.
|
|
4
|
+
version: 2.0.1
|
|
5
5
|
platform: ruby
|
|
6
6
|
authors:
|
|
7
7
|
- DfE developers
|
|
8
8
|
autorequire:
|
|
9
9
|
bindir: bin
|
|
10
10
|
cert_chain: []
|
|
11
|
-
date: 2021-08-
|
|
11
|
+
date: 2021-08-19 00:00:00.000000000 Z
|
|
12
12
|
dependencies:
|
|
13
13
|
- !ruby/object:Gem::Dependency
|
|
14
14
|
name: activemodel
|
|
@@ -44,14 +44,14 @@ dependencies:
|
|
|
44
44
|
requirements:
|
|
45
45
|
- - "~>"
|
|
46
46
|
- !ruby/object:Gem::Version
|
|
47
|
-
version: 2.
|
|
47
|
+
version: 2.36.0
|
|
48
48
|
type: :runtime
|
|
49
49
|
prerelease: false
|
|
50
50
|
version_requirements: !ruby/object:Gem::Requirement
|
|
51
51
|
requirements:
|
|
52
52
|
- - "~>"
|
|
53
53
|
- !ruby/object:Gem::Version
|
|
54
|
-
version: 2.
|
|
54
|
+
version: 2.36.0
|
|
55
55
|
- !ruby/object:Gem::Dependency
|
|
56
56
|
name: pry-byebug
|
|
57
57
|
requirement: !ruby/object:Gem::Requirement
|
|
@@ -220,9 +220,9 @@ required_ruby_version: !ruby/object:Gem::Requirement
|
|
|
220
220
|
version: '0'
|
|
221
221
|
required_rubygems_version: !ruby/object:Gem::Requirement
|
|
222
222
|
requirements:
|
|
223
|
-
- - "
|
|
223
|
+
- - ">="
|
|
224
224
|
- !ruby/object:Gem::Version
|
|
225
|
-
version:
|
|
225
|
+
version: '0'
|
|
226
226
|
requirements: []
|
|
227
227
|
rubygems_version: 3.1.6
|
|
228
228
|
signing_key:
|