diff --git a/CHANGELOG.md b/CHANGELOG.md index 9212104eb1..73c6ebfb24 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -14,6 +14,7 @@ * Remove govuk_frontend_toolkit sass dependencies (PR #1069) * Explicitly set focus states (PR #1071) * Override edit link text on summary-link component (#1076) +* Allow inset-text to take a block (PR #1078) ## 18.3.1 diff --git a/app/views/govuk_publishing_components/components/_inset_text.html.erb b/app/views/govuk_publishing_components/components/_inset_text.html.erb index e47a816e94..2032b78e13 100644 --- a/app/views/govuk_publishing_components/components/_inset_text.html.erb +++ b/app/views/govuk_publishing_components/components/_inset_text.html.erb @@ -1,7 +1,10 @@ <% id ||= "inset-text-#{SecureRandom.hex(4)}" %> - <%= tag.div id: id, class: "gem-c-inset-text govuk-inset-text" do %> - <%= text %> + <% if defined? text %> + <%= text %> + <% elsif block_given? %> + <%= yield %> + <% end %> <% end %> diff --git a/app/views/govuk_publishing_components/components/docs/inset_text.yml b/app/views/govuk_publishing_components/components/docs/inset_text.yml index 49455fd8ff..dae49417a6 100644 --- a/app/views/govuk_publishing_components/components/docs/inset_text.yml +++ b/app/views/govuk_publishing_components/components/docs/inset_text.yml @@ -8,3 +8,13 @@ examples: default: data: text: "It can take up to 8 weeks to register a lasting power of attorney if there are no mistakes in the application." + + with_block: + description: | + Note that the contents should be styled separately from the component, which takes no responsibility for what it is passed. + data: + block: | +
+

To publish this step by step you need to

+ Check for broken links +
diff --git a/spec/components/inset_text_spec.rb b/spec/components/inset_text_spec.rb index 389fbd244f..464ad3f5f1 100644 --- a/spec/components/inset_text_spec.rb +++ b/spec/components/inset_text_spec.rb @@ -10,4 +10,23 @@ def component_name assert_select(".govuk-inset-text", text: "It can take up to 8 weeks to register a lasting power of attorney if there are no mistakes in the application.") end + + it "renders a block" do + block = " +

To publish this step by step you need to

+ Check for broken links + ".html_safe + render_component({}) { block } + + assert_select(".govuk-inset-text h2#heading", text: "To publish this step by step you need to") + assert_select(".govuk-inset-text a[href='/foo']", text: "Check for broken links") + end + + it "renders only the text if both text and block are provided" do + block = "

Foo

".html_safe + render_component(text: 'Bar') { block } + + assert_select(".govuk-inset-text", text: "Bar") + assert_select(".govuk-inset-text p#foo", false, "Block should not have rendered") + end end