ccs-frontend_helpers 0.1.0.rc.7 → 0.1.0

data/lib/ccs/frontend_helpers/govuk_frontend/cookie_banner.rb

@@ -1,6 +1,6 @@
 # frozen_string_literal: true
 
-require_relative '../../components/govuk/cookie_banner'
+require_relative 'button'
 
 module CCS
   module FrontendHelpers
@@ -11,16 +11,124 @@ module CCS
       # {https://design-system.service.gov.uk/components/cookie-banner GDS - Components - Cookie banner}
 
       module CookieBanner
+        include ActionView::Context
+        include ActionView::Helpers::TagHelper
+        include ActionView::Helpers::TextHelper
+        include Button
+
         # Generates the HTML for the GOV.UK Cookie banner component
         #
-        # @param (see CCS::Components::GovUK::CookieBanner#initialize)
+        # @param messages [Array] the different messages you can pass into the cookie banner. See {govuk_cookie_banner_message_content}
+        # @param govuk_cookie_banner_options [Hash] options that will be used in customising the HTML
+        #
+        # @option govuk_cookie_banner_options [String] :classes additional CSS classes for the cookie banner HTML
+        # @option govuk_cookie_banner_options [Hash] :attributes any additional attributes that will added as part of the HTML
+        #
+        # @return [ActiveSupport::SafeBuffer] the HTML for the GOV.UK Cookie banner
+        #                                     which can then be rendered on the page
+
+        def govuk_cookie_banner(messages, **govuk_cookie_banner_options)
+          determine_govuk_cookie_banner_attributes(govuk_cookie_banner_options)
+
+          tag.div(**govuk_cookie_banner_options[:attributes]) do
+            messages.each do |message|
+              initialise_attributes_and_set_classes(message, 'govuk-cookie-banner__message govuk-width-container')
+
+              concat(tag.div(**message[:attributes]) do
+                concat(govuk_cookie_banner_message_content(message))
+                concat(govuk_cookie_banner_message_actions(message[:actions])) if message[:actions]
+              end)
+            end
+          end
+        end
+
+        private
+
+        # Generates the HTML for a cookie banner message content used in {govuk_cookie_banner}
+        #
+        # @param message [Hash] the options for the cookie banner message
+        #
+        # @option message [String] :heading_text the heading text that displays in the message
+        # @option message [ActiveSupport::SafeBuffer] :content HTML to use as content for the message
+        # @option message [String] :text if +:content+ is blank then this is the text used for the message
+        # @option message [Array] :actions the buttons and links that you want to display in the message. See {govuk_cookie_banner_message_actions}
+        # @option message [String] :classes additional CSS classes for the cookie message HTML
+        # @option message [Hash] :attributes any additional attributes that will added as part of the HTML
+        #
+        # @return [ActiveSupport::SafeBuffer] the HTML for a cookie banner message content used in {govuk_cookie_banner}
+
+        def govuk_cookie_banner_message_content(message)
+          tag.div(class: 'govuk-grid-row') do
+            tag.div(class: 'govuk-grid-column-two-thirds') do
+              concat(tag.h2(message[:heading_text], class: 'govuk-cookie-banner__heading govuk-heading-m')) if message[:heading_text]
+              concat(tag.div(class: 'govuk-cookie-banner__content') do
+                message[:content] || tag.p(message[:text], class: 'govuk-body')
+              end)
+            end
+          end
+        end
+
+        # rubocop:disable Metrics/AbcSize
+
+        # Generates the HTML for the cookie banner message actions used in {govuk_cookie_banner}
+        # It defaults to creating button unless a +href+ is set which will create a link
+        #
+        # @param message_actions [Hash] the options for the cookie banner message actions
         #
-        # @option (see CCS::Components::GovUK::CookieBanner#initialize)
+        # @option message_actions [String] :text the button or link text
+        # @option message_actions [String] :href the href for a link
+        # @option message_actions [String] :classes additional CSS classes for the cookie action button or link
+        # @option message_actions [Hash] :attributes any additional attributes that will added as part of the HTML.
+        #                                            If the +:type+ key is present with a value of +:button+,
+        #                                            the action will be rendered as a button
         #
-        # @return (see CCS::Components::GovUK::CookieBanner#render)
+        # @return [ActiveSupport::SafeBuffer] the HTML for the cookie banner message actions used in {govuk_cookie_banner}
+
+        def govuk_cookie_banner_message_actions(message_actions)
+          tag.div(class: 'govuk-button-group') do
+            message_actions.each do |message_action|
+              message_action[:attributes] ||= {}
+
+              concat(
+                if message_action[:href]
+                  if message_action[:attributes][:type] == :button
+                    govuk_button(
+                      message_action[:text],
+                      href: message_action[:href],
+                      classes: message_action[:classes],
+                      attributes: message_action[:attributes]
+                    )
+                  else
+                    message_action[:attributes][:class] = "govuk-link #{message_action[:classes]}".rstrip
+
+                    link_to(message_action[:text], message_action[:href], **message_action[:attributes])
+                  end
+                else
+                  govuk_button(
+                    message_action[:text],
+                    classes: message_action[:classes],
+                    attributes: message_action[:attributes]
+                  )
+                end
+              )
+            end
+          end
+        end
+
+        # rubocop:enable Metrics/AbcSize
+
+        # Sets the default attributes for {govuk_cookie_banner}
+        #
+        # @param govuk_cookie_banner_options [Hash] options that will be used in customising the HTML
+        #
+        # @option (see govuk_cookie_banner)
+
+        def determine_govuk_cookie_banner_attributes(govuk_cookie_banner_options)
+          initialise_attributes_and_set_classes(govuk_cookie_banner_options, 'govuk-cookie-banner')
 
-        def govuk_cookie_banner(messages, **options)
-          Components::GovUK::CookieBanner.new(context: self, messages: messages, **options).render
+          (govuk_cookie_banner_options[:attributes][:data] ||= {})[:nosnippet] = 'true'
+          govuk_cookie_banner_options[:attributes][:role] = 'region'
+          (govuk_cookie_banner_options[:attributes][:aria] ||= {})[:label] ||= 'Cookie banner'
         end
       end
     end

data/lib/ccs/frontend_helpers/govuk_frontend/details.rb

@@ -1,6 +1,8 @@
 # frozen_string_literal: true
 
-require_relative '../../components/govuk/details'
+require 'action_view'
+
+require_relative '../shared_methods'
 
 module CCS
   module FrontendHelpers
@@ -11,18 +13,32 @@ module CCS
       # {https://design-system.service.gov.uk/components/details GDS - Components - Details}
 
       module Details
+        include SharedMethods
+        include ActionView::Context
+        include ActionView::Helpers::TagHelper
+        include ActionView::Helpers::TextHelper
+
         # Generates the HTML for the GOV.UK Details component
         #
-        # @param (see CCS::Components::GovUK::Details#initialize)
+        # @param summary_text [String] the summary text for the details element
+        # @param govuk_details_options [Hash] options that will be used in customising the HTML
         #
-        # @option (see CCS::Components::GovUK::Details#initialize)
+        # @option govuk_details_options [String] :classes additional CSS classes for the details HTML
+        # @option govuk_details_options [Hash] :attributes ({ data: { module: 'govuk-details' } }) any additional attributes that will added as part of the HTML
         #
-        # @yield (see CCS::Components::GovUK::Details#render)
+        # @yield HTML that will be contained within the 'govuk-details__text' div
         #
-        # @return (see CCS::Components::GovUK::Details#render)
+        # @return [ActiveSupport::SafeBuffer] the HTML for the GOV.UK Details
+        #                                     which can then be rendered on the page
+
+        def govuk_details(summary_text, **govuk_details_options, &block)
+          initialise_attributes_and_set_classes(govuk_details_options, 'govuk-details')
+          set_data_module(govuk_details_options, 'govuk-details')
 
-        def govuk_details(summary_text, **options, &block)
-          Components::GovUK::Details.new(context: self, summary_text: summary_text, **options).render(&block)
+          tag.details(**govuk_details_options[:attributes]) do
+            concat(tag.summary(tag.span(summary_text, class: 'govuk-details__summary-text'), class: 'govuk-details__summary'))
+            concat(tag.div(class: 'govuk-details__text', &block))
+          end
         end
       end
     end

data/lib/ccs/frontend_helpers/govuk_frontend/error_message.rb

@@ -1,6 +1,8 @@
 # frozen_string_literal: true
 
-require_relative '../../components/govuk/back_link'
+require 'action_view'
+
+require_relative '../shared_methods'
 
 module CCS
   module FrontendHelpers
@@ -11,34 +13,53 @@ module CCS
       # {https://design-system.service.gov.uk/components/error-message GDS - Components - Error message}
 
       module ErrorMessage
+        include SharedMethods
+        include ActionView::Context
+        include ActionView::Helpers::TagHelper
+        include ActionView::Helpers::TextHelper
+
         # Generates the HTML for the GOV.UK Error message component
         #
-        # @param (see CCS::Components::GovUK::ErrorMessage#initialize)
+        # @param message [String] the message to be displayed
+        # @param attribute [String, Symbol] the attribute that has an error
+        # @param govuk_error_message_options [Hash] options that will be used in customising the HTML
         #
-        # @option (see CCS::Components::GovUK::ErrorMessage#initialize)
+        # @option govuk_error_message_options [String] :classes additional CSS classes for the error message HTML
+        # @option govuk_error_message_options [String] :visually_hidden_text ('Error') visualy hidden text before the error message
+        # @option govuk_error_message_options [Hash] :attributes ({}) any additional attributes that will be added as part of the HTML
         #
-        # @return (see CCS::Components::GovUK::ErrorMessage#render)
+        # @return [ActiveSupport::SafeBuffer] the HTML for the GOV.UK Error message
+        #                                     which can then be rendered on the page
+
+        def govuk_error_message(message, attribute, **govuk_error_message_options)
+          initialise_attributes_and_set_classes(govuk_error_message_options, 'govuk-error-message')
+
+          govuk_error_message_options[:attributes][:id] ||= "#{attribute}-error"
+          visually_hidden_text = govuk_error_message_options[:visually_hidden_text] || 'Error'
 
-        def govuk_error_message(error_message, attribute, **options)
-          Components::GovUK::ErrorMessage.new(context: self, message: error_message, attribute: attribute, **options).render
+          tag.p(**govuk_error_message_options[:attributes]) do
+            concat(tag.span("#{visually_hidden_text}: ", class: 'govuk-visually-hidden')) if visually_hidden_text.present?
+            concat(message)
+          end
         end
 
         # Generates the HTML for the GOV.UK Error message component using the error messages in an ActiveModel
         #
         # @param model [ActiveModel] model that will be used to find the error message
         # @param attribute [String, Symbol] the attribute that has an error
-        # @param options [Hash] options that will be used in customising the HTML
+        # @param govuk_error_message_options [Hash] options that will be used in customising the HTML
         #
-        # @option (see CCS::Components::GovUK::ErrorMessage#initialize)
+        # @option (see #govuk_error_message)
         #
         # @return [NilClass, ActiveSupport::SafeBuffer] if the error message is not on the model it will return nil,
-        #                                               otherwise it returns the error message HTML
+        #                                               otherwise the HTML for the GOV.UK Error message
+        #                                               which can then be rendered on the page is returned
 
-        def govuk_error_message_with_model(model, attribute, **options)
+        def govuk_error_message_with_model(model, attribute, **govuk_error_message_options)
           error_message = model.errors[attribute].first
           return unless error_message
 
-          Components::GovUK::ErrorMessage.new(context: self, message: error_message, attribute: attribute, **options).render
+          govuk_error_message(error_message, attribute, **govuk_error_message_options)
         end
       end
     end

data/lib/ccs/frontend_helpers/govuk_frontend/error_summary.rb

@@ -1,6 +1,8 @@
 # frozen_string_literal: true
 
-require_relative '../../components/govuk/error_summary'
+require 'action_view'
+
+require_relative '../shared_methods'
 
 module CCS
   module FrontendHelpers
@@ -11,16 +13,38 @@ module CCS
       # {https://design-system.service.gov.uk/components/error-summary GDS - Components - Error summary}
 
       module ErrorSummary
+        include SharedMethods
+        include ActionView::Context
+        include ActionView::Helpers::TagHelper
+        include ActionView::Helpers::TextHelper
+        include ActionView::Helpers::UrlHelper
+
         # Generates the HTML for the GOV.UK Error summary component
         #
-        # @param (see CCS::Components::GovUK::ErrorSummary#initialize)
+        # @param title [String] text to use for the heading of the error summary block
+        # @param error_list [Array] the list of errors to include in the summary. See {govuk_error_summary_list}
+        # @param description [String] optional text to use for the description of the errors
+        # @param govuk_error_summary_options [Hash] options that will be used in customising the HTML
         #
-        # @option (see CCS::Components::GovUK::ErrorSummary#initialize)
+        # @option govuk_error_summary_options [String] :classes additional CSS classes for the error summary HTML
+        # @option govuk_error_summary_options [Hash] :attributes ({}) any additional attributes that will be added as part of the HTML
         #
-        # @return (see CCS::Components::GovUK::ErrorSummary#render)
+        # @return [ActiveSupport::SafeBuffer] the HTML for the GOV.UK Error summary
+        #                                     which can then be rendered on the page
 
-        def govuk_error_summary(title, error_summary_items, description = nil, **options)
-          Components::GovUK::ErrorSummary.new(context: self, title: title, error_summary_items: error_summary_items, description: description, **options).render
+        def govuk_error_summary(title, error_list, description = nil, **govuk_error_summary_options)
+          initialise_attributes_and_set_classes(govuk_error_summary_options, 'govuk-error-summary')
+          set_data_module(govuk_error_summary_options, 'govuk-error-summary')
+
+          tag.div(**govuk_error_summary_options[:attributes]) do
+            tag.div(role: 'alert') do
+              concat(tag.h2(title, class: 'govuk-error-summary__title'))
+              concat(tag.div(class: 'govuk-error-summary__body') do
+                concat(tag.p(description)) if description
+                concat(govuk_error_summary_list(error_list))
+              end)
+            end
+          end
         end
 
         # Generates the HTML for the GOV.UK Error summary component using the error messages in an ActiveModel
@@ -28,19 +52,47 @@ module CCS
         # @param model [ActiveModel] model that will be used to find the error messages to list
         # @param title [String] text to use for the heading of the error summary block
         # @param description [String] (nil) optional text to use for the description of the errors
-        # @param options [Hash] options that will be used in customising the HTML
+        # @param govuk_error_summary_options [Hash] options that will be used in customising the HTML
         #
-        # @option (see CCS::Components::GovUK::ErrorSummary#initialize)
+        # @option (see #govuk_error_summary)
         #
-        # @return [NilClass, ActiveSupport::SafeBuffer] if error messages are not on the model it will return nil,
-        #                                               otherwise it returns the error summary HTML.
+        # @return [NilClass, ActiveSupport::SafeBuffer] if there are no errors on the model it will return nil,
+        #                                               otherwise the HTML for the GOV.UK Error summary
+        #                                               which can then be rendered on the page is returned
 
-        def govuk_error_summary_with_model(model, title, description = nil, **options)
+        def govuk_error_summary_with_model(model, title, description = nil, **govuk_error_summary_options)
           return if model.errors.blank?
 
-          error_summary_items = model.errors.map { |error| { text: error.message, href: "##{error.attribute}-error" } }
+          error_list = model.errors.map { |error| { text: error.message, href: "##{error.attribute}-error" } }
+
+          govuk_error_summary(title, error_list, description, **govuk_error_summary_options)
+        end
+
+        private
+
+        # Generates the HTML for the error list in {govuk_error_summary}
+        #
+        # @param error_list [Array] The list of errors to include in the summary. See {#govuk_error_summary_list}
+        #
+        # @option error_list [String] :href href for the error link item. If provided item will be a link
+        # @option error_list [String] :text Text for the error link item
+        # @option error_list [Hash] :attributes ({}) any additional attributes that will be added as part of the link item
+        #
+        # @return [ActiveSupport::SafeBuffer] the HTML for the error list
+        #                                     which is used in {govuk_error_summary}
 
-          Components::GovUK::ErrorSummary.new(context: self, title: title, error_summary_items: error_summary_items, description: description, **options).render
+        def govuk_error_summary_list(error_list)
+          tag.ul(class: 'govuk-list govuk-error-summary__list') do
+            error_list.each do |error|
+              concat(tag.li do
+                if error[:href]
+                  link_to(error[:text], error[:href], **(error[:attributes] || {}))
+                else
+                  error[:text]
+                end
+              end)
+            end
+          end
         end
       end
     end

data/lib/ccs/frontend_helpers/govuk_frontend/field/character_count.rb

@@ -0,0 +1,165 @@
+# frozen_string_literal: true
+
+require_relative 'textarea'
+
+module CCS
+  module FrontendHelpers
+    module GovUKFrontend
+      module Field
+        # = GOV.UK Character count
+        #
+        # This helper is used for generating the character count component from the
+        # {https://design-system.service.gov.uk/components/character-count GDS - Components - Character count}
+        #
+        # This is a wrapper around a Textarea module and so makes use of the methods in {Textarea}
+
+        module CharacterCount
+          include Textarea
+
+          # Generates the HTML for the GOV.UK character count component.
+          # It works by warpping the govuk_textarea in HTML which will trigger the JavaScript to do the character count.
+          #
+          # @param attribute [String, Symbol] the attribute of the character count text area
+          # @param govuk_character_count_options [Hash] options that will be used for the parts of the form group, label, hint, textarea and the character count
+          #
+          # @option govuk_character_count_options [String] :error_message (nil) the error message to be displayed
+          # @option govuk_character_count_options [ActiveModel] :model (nil) optional model that can be used to find an error message
+          # @option govuk_character_count_options [ActionView::Helpers::FormBuilder] :form (nil) optional form builder used to create
+          #                                                                                 the textarea tag and find the error message
+          # @option govuk_character_count_options [Hash] :form_group see {govuk_field}
+          # @option govuk_character_count_options [Hash] :label see {govuk_field}
+          # @option govuk_character_count_options [Hash] :hint see {govuk_field}
+          # @option govuk_character_count_options [Hash] :textarea see {govuk_textarea}
+          # @option govuk_character_count_options [Hash] :character_count ({}) the options that will be used when rendering the textarea.
+          #                                                                    See {_govuk_character_count} for more details.
+          #
+          # @return [ActiveSupport::SafeBuffer] the HTML for the GOV.UK chracter count
+          #                                     which can then be rendered on the page
+
+          def govuk_character_count(attribute, **govuk_character_count_options)
+            character_count_attribute = govuk_character_count_options[:form] ? "#{form.object_name}_#{attribute}" : attribute
+
+            _govuk_character_count(character_count_attribute, **govuk_character_count_options) do |govuk_textarea_options|
+              govuk_textarea(
+                attribute,
+                error_message: govuk_character_count_options[:error_message],
+                model: govuk_character_count_options[:model],
+                form: govuk_character_count_options[:form],
+                **govuk_textarea_options
+              )
+            end
+          end
+
+          private
+
+          # Wrapper method used by {govuk_character_count} to generate the character count HTML
+          #
+          # @param attribute [String, Symbol] the attribute of the character count
+          # @param govuk_character_count_options [Hash] options that will be used in customising the HTML.
+          #                                             This includes everything described in {govuk_character_count}
+          #                                             with the addition of the +:character_count+ which are described below
+          #
+          # @option govuk_character_count_options [String] :maxlength (required) - if +maxwords+ is set, this is not required.
+          #                                                           The maximum number of characters.
+          #                                                           If +maxwords+ is provided, the +maxlength+ option will be ignored.
+          # @option govuk_character_count_options [String] :maxwords (required) - if maxlength is set, this is not required.
+          #                                                          The maximum number of words.
+          #                                                          If +maxwords+ is provided, the +maxlength+ option will be ignored.
+          # @option govuk_character_count_options [String] :threshold the percentage value of the limit at which point the count message is displayed.
+          #                                                           If this attribute is set, the count message will be hidden by default.
+          # @option govuk_textarea_options [Hash] :fallback_hint ({}) additional parameters that will be used to create the hint containing the character count text.
+          #                                                                This includes all the options in {govuk_hint} plus +:count_message+.
+          #                                                                This will replace the default text for the count message.
+          #                                                                If you want the count number to appear, put %<count>s in the string and it will be replaced with the number
+          #
+          # @yield the textarea HTML generated by {govuk_character_count}
+          #
+          # @yieldparam govuk_textarea_options [Hash] the options used in the textarea called by {govuk_character_count}
+          #
+          # @return [ActiveSupport::SafeBuffer] the HTML for the chracter count which wrpas arround {govuk_character_count}
+
+          def _govuk_character_count(attribute, **govuk_character_count_options)
+            deep_init_hash(govuk_character_count_options, :textarea, :attributes, :aria)
+            govuk_character_count_options[:textarea][:attributes][:aria][:describedby] = [govuk_character_count_options.dig(:textarea, :attributes, :aria, :describedby), "#{attribute}-info"].compact.join(' ')
+
+            govuk_character_count_options[:textarea][:classes] = "#{govuk_character_count_options[:textarea][:classes]} govuk-js-character-count".lstrip
+
+            tag.div(**get_character_count_attributes(**govuk_character_count_options)) do
+              concat(yield(govuk_character_count_options))
+              concat(character_count_hint(attribute, **govuk_character_count_options))
+            end
+          end
+
+          # Generates the fallback hint HTML for {_govuk_character_count}
+          #
+          # @param (see _govuk_character_count)
+          #
+          # @option (see _govuk_character_count)
+          #
+          # @return [ActiveSupport::SafeBuffer] the HTML for the fullback hint used in {_govuk_character_count}
+
+          def character_count_hint(attribute, **govuk_character_count_options)
+            fallback_hint_length = govuk_character_count_options[:character_count][:maxwords] || govuk_character_count_options[:character_count][:maxlength]
+            fallback_hint_default = "You can enter up to %<count>s #{govuk_character_count_options[:character_count][:maxwords] ? 'words' : 'characters'}"
+
+            deep_init_hash(govuk_character_count_options, :character_count, :fallback_hint, :attributes)
+
+            fallback_hint_text = format(govuk_character_count_options[:character_count][:fallback_hint][:count_message] || fallback_hint_default, count: fallback_hint_length)
+
+            govuk_character_count_options[:character_count][:fallback_hint][:classes] = "#{govuk_character_count_options.dig(:character_count, :fallback_hint, :classes)} govuk-character-count__message".lstrip
+            govuk_character_count_options[:character_count][:fallback_hint][:attributes].merge!(id: "#{attribute}-info")
+
+            govuk_hint(fallback_hint_text, **govuk_character_count_options[:character_count][:fallback_hint])
+          end
+
+          # Generates a hash with the character count attributes used in {_govuk_character_count}
+          #
+          # @param govuk_character_count_options [Hash] options that will be used in customising the HTML.
+          #                                             This includes everything described in {govuk_character_count}
+          #                                             with the addition of the +:character_count+ which are described below
+          #
+          # @option (see _govuk_character_count)
+          #
+          # @return [Hash] contains the HTMl attributes used in {_govuk_character_count}
+
+          def get_character_count_attributes(**govuk_character_count_options)
+            govuk_character_count_attributes = { class: 'govuk-character-count', data: { module: 'govuk-character-count' } }
+
+            %i[maxlength threshold maxwords].each do |data_attribute|
+              govuk_character_count_attributes[:data][data_attribute] = govuk_character_count_options[:character_count][data_attribute].to_s if govuk_character_count_options[:character_count][data_attribute]
+            end
+
+            govuk_character_count_attributes
+          end
+
+          # Method to initialise hashes within hashes if it is not already initialised
+          #
+          # @param hash [Hash] the hash that is going to be initialised
+          # @param keys [Array] the keys that are going to be initialised in the hash
+          #
+          # @example When the hash is completely empty
+          #   hash = { }
+          #   keys = [:a, :b, :c]
+          #
+          #   deep_init_hash(hash, *keys)
+          #
+          #   hash = { a: { b: { c: { } } } }
+          #
+          # @example When the hash has already been initialised
+          #   hash = { a: { b: { d: 'hello' } } }
+          #   keys = [:a, :b, :c]
+          #
+          #   deep_init_hash(hash, *keys)
+          #
+          #   hash = { a: { b: { d: 'hello', c: { } } } }
+
+          def deep_init_hash(hash, *keys)
+            current_hash = hash
+
+            keys.each { |key| current_hash = (current_hash[key] ||= {}) }
+          end
+        end
+      end
+    end
+  end
+end