Upgrade to GOV.UK Frontend version 3.11.0

README.md

@@ -7,7 +7,7 @@
 [![Test Coverage](https://api.codeclimate.com/v1/badges/fde73b5dc9476197281b/test_coverage)](https://codeclimate.com/github/DFE-Digital/govuk_design_system_formbuilder/test_coverage)
 [![Dependabot Status](https://api.dependabot.com/badges/status?host=github&repo=DFE-Digital/govuk_design_system_formbuilder)](https://dependabot.com)
 [![GitHub license](https://img.shields.io/github/license/DFE-Digital/govuk_design_system_formbuilder)](https://github.com/DFE-Digital/govuk_design_system_formbuilder/blob/master/LICENSE)
-[![GOV.UK Design System Version](https://img.shields.io/badge/GOV.UK%20Design%20System-3.10.2-brightgreen)](https://design-system.service.gov.uk)
+[![GOV.UK Design System Version](https://img.shields.io/badge/GOV.UK%20Design%20System-3.11.0-brightgreen)](https://design-system.service.gov.uk)
 [![Rails](https://img.shields.io/badge/Ruby-2.5.8%20%E2%95%B1%202.6.6%20%E2%95%B1%202.7.2-E16D6D)](https://weblog.rubyonrails.org/releases/)
 [![Ruby](https://img.shields.io/badge/Rails-5.2.4%20%E2%95%B1%206.0.3%20%E2%95%B1%206.1.0-E16D6D)](https://www.ruby-lang.org/en/downloads/)
 

guide/content/form-elements/submit.slim

@@ -40,7 +40,7 @@ section
     code: submit_button_disabled)
 
   == render('/partials/example-fig.*',
-    caption: "A submit button with an accompanying call to action",
+    caption: "A group of buttons",
     code: multiple_buttons) do
 
     p.govuk-body

guide/content/introduction/supported-versions.slim

@@ -16,7 +16,7 @@ dl.govuk-summary-list
       ul.govuk-list
         li
           span.govuk-tag.govuk-tag-govuk
-            | Version 3.10.2
+            | Version 3.11.0
 
   .govuk-summary-list__row
     dt.govuk-summary-list__key

guide/lib/examples/submit.rb

@@ -29,6 +29,9 @@ def multiple_buttons
         = f.govuk_submit 'Save and continue' do
           a.govuk-button.govuk-button--secondary href='/#'
             ' Safe as draft
+          button.govuk-button.govuk-button--warning Delete and start again
+          a.govuk-link href="#"
+            ' View recent changes
       SNIPPET
     end
   end

guide/package.json

@@ -12,6 +12,6 @@
   "author": "",
   "license": "ISC",
   "dependencies": {
-    "govuk-frontend": "^3.10.2"
+    "govuk-frontend": "^3.11.0"
   }
 }

lib/govuk_design_system_formbuilder/builder.rb

@@ -811,9 +811,9 @@ def govuk_check_box(attribute_name, value, unchecked_value = false, hint: {}, la
     #   client-side validation provided by the browser. This is to provide a more consistent and accessible user
     #   experience
     # @param disabled [Boolean] makes the button disabled when true
-    # @param block [Block] Any supplied HTML will be inserted immediately after
-    #   the submit button. It is intended for other buttons directly related to
-    #   the form's operation, such as 'Cancel' or 'Safe draft'
+    # @param block [Block] When content is passed in via a block the submit element and the block content will
+    #   be wrapped in a +<div class="govuk-button-group">+ which will space the buttons and links within
+    #   evenly.
     # @raise [ArgumentError] raised if both +warning+ and +secondary+ are true
     # @return [ActiveSupport::SafeBuffer] HTML output
     # @note Only the first additional button or link (passed in via a block) will be given the

lib/govuk_design_system_formbuilder/containers/button_group.rb

@@ -0,0 +1,15 @@
+module GOVUKDesignSystemFormBuilder
+  module Containers
+    class ButtonGroup < Base
+      def initialize(builder, buttons)
+        super(builder, nil, nil)
+
+        @buttons = buttons
+      end
+
+      def html
+        tag.div(@buttons, class: %(#{brand}-button-group))
+      end
+    end
+  end
+end

lib/govuk_design_system_formbuilder/elements/submit.rb

@@ -19,19 +19,27 @@ def initialize(builder, text, warning:, secondary:, classes:, prevent_double_cli
       end
 
       def html
-        safe_join([submit, @block_content])
+        @block_content.present? ? button_group : buttons
       end
 
     private
 
+      def buttons
+        safe_join([submit, @block_content])
+      end
+
+      def button_group
+        Containers::ButtonGroup.new(@builder, buttons).html
+      end
+
       def submit
         @builder.submit(@text, class: classes, **options)
       end
 
       def classes
         %w(button)
           .prefix(brand)
-          .push(warning_class, secondary_class, disabled_class, padding_class, custom_classes)
+          .push(warning_class, secondary_class, disabled_class, custom_classes)
           .flatten
           .compact
       end
@@ -55,10 +63,6 @@ def secondary_class
         %(#{brand}-button--secondary) if @secondary
       end
 
-      def padding_class
-        %(#{brand}-!-margin-right-1) if @block_content
-      end
-
       def disabled_class
         %(#{brand}-button--disabled) if @disabled
       end

spec/govuk_design_system_formbuilder/builder/submit_spec.rb

@@ -92,20 +92,24 @@
     end
 
     describe 'extra buttons passed in via a block' do
-      let(:target) { '#' }
+      let(:text) { 'Cancel' }
+      let(:target) { '/some-amazing-page' }
       let(:classes) { %w(govuk-button govuk-button--secondary) }
       subject do
         builder.send(method) do
-          builder.link_to('Cancel', target, class: classes)
+          builder.link_to(text, target, class: classes)
         end
       end
 
       specify 'should display the extra content' do
         expect(subject).to have_tag('a', with: { href: target, class: classes })
       end
 
-      specify 'should add an extra margin class to the submit' do
-        expect(subject).to have_tag('input', with: { class: 'govuk-\!-margin-right-1' })
+      specify 'should wrap the buttons and extra content in a button group' do
+        expect(subject).to have_tag('div', with: { class: 'govuk-button-group' }) do
+          with_tag('input', value: text)
+          with_tag('a', with: { href: target })
+        end
       end
     end