ccs-frontend_helpers 0.1.0 → 0.1.1.rc.1

data/lib/ccs/components/govuk/field/inputs/item/radio/tag.rb

@@ -0,0 +1,43 @@
+require_relative '../radio'
+
+module CCS
+  module Components
+    module GovUK
+      class Field < Base
+        class Inputs < Field
+          class Item < Base
+            class Radio < Item
+              # = GOV.UK Field Inputs Radio tag
+              #
+              # This is used to generate an individual radio item using +radio_button_tag+
+
+              class Tag < Radio
+                # @param (see CCS::Components::GovUK::Field::Items::Item::Radio#initialize)
+                #
+                # @option (see CCS::Components::GovUK::Field::Items::Item::Radio#initialize)
+
+                def initialize(attribute:, label:, **options)
+                  super(attribute: attribute, label: label, **options)
+
+                  @options[:attributes][:id] ||= "#{sanitize_to_id(@attribute)}_#{sanitize_to_id(@value)}"
+
+                  @label = Label.new(attribute: @options[:attributes][:id], context: @context, **label)
+                end
+
+                # Generates the HTML for the radio input
+                #
+                # @return [ActiveSupport::SafeBuffer]
+
+                def render
+                  super() do
+                    context.radio_button_tag(@attribute, @value, @options[:checked], **@options[:attributes])
+                  end
+                end
+              end
+            end
+          end
+        end
+      end
+    end
+  end
+end

data/lib/ccs/components/govuk/field/inputs/item/radio.rb

@@ -0,0 +1,50 @@
+require_relative '../item'
+
+module CCS
+  module Components
+    module GovUK
+      class Field < Base
+        class Inputs < Field
+          class Item < Base
+            # = GOV.UK Field Inputs Radio
+            #
+            # This is used to generate an individual radio item
+
+            class Radio < Item
+              # @param (see CCS::Components::GovUK::Field::Items::Item#initialize)
+              # label [Hash] attributes for the radio label, see {CCS::Components::GovUK::Label#initialize Label#initialize} for more details.
+              #
+              # @option (see CCS::Components::GovUK::Field::Items::Item#initialize))
+
+              def initialize(attribute:, label:, **options)
+                super(attribute: attribute, **options)
+
+                label[:classes] = "govuk-radios__label #{label[:classes]}".rstrip
+              end
+
+              # Generates the HTML to wrap arround a radio input
+              #
+              # @yield the radio item input HTML
+              #
+              # @return [ActiveSupport::SafeBuffer]
+
+              def render(&block)
+                tag.div(class: 'govuk-radios__item') do
+                  super(&block)
+                end
+              end
+
+              # The default attributes for the radio
+
+              DEFAULT_ATTRIBUTES = { class: 'govuk-radios__input' }.freeze
+
+              # The type of the input item
+
+              ITEM_TYPE = 'radios'.freeze
+            end
+          end
+        end
+      end
+    end
+  end
+end

data/lib/ccs/components/govuk/field/inputs/item.rb

@@ -0,0 +1,111 @@
+require_relative '../inputs'
+require_relative '../../label'
+
+module CCS
+  module Components
+    module GovUK
+      class Field < Base
+        class Inputs < Field
+          # = GOV.UK Field Inputs Item
+          #
+          # This class is used to provided the shared HTML for a
+          # {Components::GovUK::Field::Inputs::Item::Checkbox checkbox item} or {Components::GovUK::Field::Inputs::Item::Radio radio item}.
+          # It wraps these items with the following:
+          # - Item label
+          # - Item hint
+          # - Item conditional content
+          #
+          # @!attribute [r] attribute
+          #   @return [String,Symbol] The attribute of the item
+          # @!attribute [r] value
+          #   @return [String] The value of the item
+          # @!attribute [r] label
+          #   @return [Label] The initialised item label
+          # @!attribute [r] hint
+          #   @return [Hint] The initialised item hint
+          # @!attribute [r] conditional_content
+          #   @return [ActiveSupport::SafeBuffer] The conditional HTML
+
+          class Item < Base
+            private
+
+            attr_reader :attribute, :value, :label, :hint, :conditional_content
+
+            public
+
+            # @param attribute [String,Symbol] the attribute of the item
+            # @param value [String] the value of the item
+            # @param hint [Hash] options for an item hint see {CCS::Components::GovUK::Hint#initialize Hint#initialize} for more details.
+            #                    If no hint is given then no hint will be rendered
+            # @param conditional [Hash] content that will appear if the item is checked.
+            #                           If no conditional is given then no conditional content will be rendered
+            #
+            # @option options [String] :classes additional CSS classes for the item HTML
+            # @option options [Boolean] :checked flag to indicate if the item is checked
+            # @option options [ActionView::Helpers::FormBuilder] :form (nil) optional form builder used to create item HTML
+            # @option options [Hash] :attributes ({}) any additional attributes that will be added as part of the item HTML
+            #
+            # @option conditional [ActiveSupport::SafeBuffer] content the HTML content
+            # @option conditional [Hash] attributes[:id] the id of the conditional section
+
+            def initialize(attribute:, value:, hint: nil, conditional: nil, **options)
+              super(**options)
+
+              initialise_item_hint(attribute, value, hint) if hint
+              initialize_item_conditional(attribute, value, conditional) if conditional
+              @attribute = attribute
+              @value = value
+            end
+
+            # Generates the HTML to wrap arround a input
+            #
+            # @yield the item input HTML
+            #
+            # @return [ActiveSupport::SafeBuffer]
+
+            def render
+              concat(yield)
+              concat(label.render)
+              concat(hint.render) if hint
+              concat(conditional_content) if conditional_content
+            end
+
+            private
+
+            # Initialises the item hint and adds the aira-describedby attribute for the item
+            #
+            # @param attribute [String, Symbol] the attribute of the item
+            # @param value [String] the value of the item
+            # @param hint [Hash] the options for the hint
+
+            def initialise_item_hint(attribute, value, hint)
+              hint[:attributes] ||= {}
+              hint[:classes] = "govuk-#{self.class::ITEM_TYPE}__hint #{hint[:classes]}".rstrip
+              hint[:attributes][:id] ||= "#{attribute}_#{value}-item-hint"
+
+              (@options[:attributes][:aria] ||= {})[:describedby] = hint[:attributes][:id]
+
+              @hint = Hint.new(context: @context, **hint)
+            end
+
+            # Generate the item conditional HTML and adds the data-aira-controls attribute for the item
+            #
+            # @param attribute [String, Symbol] the attribute of the item
+            # @param value [String] the value of the item
+            # @param conditional [Hash] the options for the conditional
+
+            def initialize_item_conditional(attribute, value, conditional)
+              conditional[:attributes] ||= {}
+              conditional[:attributes][:class] = "govuk-#{self.class::ITEM_TYPE}__conditional #{"govuk-#{self.class::ITEM_TYPE}__conditional--hidden" unless @options[:checked]}".rstrip
+              conditional[:attributes][:id] ||= sanitize_to_id("#{attribute}_#{value}_conditional")
+
+              (@options[:attributes][:data] ||= {})[:'aria-controls'] = conditional[:attributes][:id]
+
+              @conditional_content = tag.div(conditional[:content], class: conditional[:attributes][:class], id: conditional[:attributes][:id])
+            end
+          end
+        end
+      end
+    end
+  end
+end

data/lib/ccs/components/govuk/field/inputs/radios.rb

@@ -0,0 +1,69 @@
+require_relative '../input'
+require_relative 'item/divider'
+require_relative 'item/radio/form'
+require_relative 'item/radio/tag'
+
+module CCS
+  module Components
+    module GovUK
+      class Field < Base
+        class Inputs < Field
+          # = GOV.UK Radios
+          #
+          # This is used for generating the radios component from the
+          # {https://design-system.service.gov.uk/components/radios GDS - Components - Radios}
+          #
+          # @!attribute [r] radio_items
+          #   @return [Array<Item::Divider|Item::Radio|Item::Radio>] An array of the initialised radio items
+
+          class Radios < Inputs
+            private
+
+            attr_reader :radio_items
+
+            public
+
+            # rubocop:disable Metrics/CyclomaticComplexity, Metrics/PerceivedComplexity
+
+            # @param (see CCS::Components::GovUK::Field::Inputs#initialize)
+            # @param radio_items [Array<Hash>] an array of options for the radios.
+            #                                  See {Components::GovUK::Field::Inputs::Item::Radio#initialize Radio#initialize} for details of the items in the array.
+            #
+            # @option (see CCS::Components::GovUK::Field::Inputs#initialize)
+
+            def initialize(attribute:, radio_items:, **options)
+              super(attribute: attribute, **options)
+
+              if @options[:model] || @options[:form]
+                values = (@options[:model] || @options[:form].object).send(attribute) || []
+                radio_items.each { |radio_item| radio_item[:checked] = values.include?(radio_item[:value]) }
+              end
+
+              radio_item_class = @options[:form] ? Item::Radio::Form : Inputs::Item::Radio::Tag
+
+              @radio_items = radio_items.map { |radio_item| radio_item[:divider] ? Item::Divider.new(divider: radio_item[:divider], type: 'radios') : radio_item_class.new(attribute: attribute, form: @options[:form], context: @context, **radio_item) }
+            end
+
+            # rubocop:enable Metrics/CyclomaticComplexity, Metrics/PerceivedComplexity
+
+            # Generates the HTML for the GOV.UK Radios component
+            #
+            # @return [ActiveSupport::SafeBuffer]
+
+            def render
+              super() do
+                tag.div(**options[:attributes]) do
+                  radio_items.each { |radio_item| concat(radio_item.render) }
+                end
+              end
+            end
+
+            # The default attributes for the radios
+
+            DEFAULT_ATTRIBUTES = { class: 'govuk-radios', data: { module: 'govuk-radios' } }.freeze
+          end
+        end
+      end
+    end
+  end
+end

data/lib/ccs/components/govuk/field/inputs.rb

@@ -0,0 +1,57 @@
+require_relative '../field'
+require_relative '../fieldset'
+
+module CCS
+  module Components
+    module GovUK
+      class Field < Base
+        # = GOV.UK Field Inputs
+        #
+        # This class is used to create a form for a list of fields, e.g. radios or checkboxes.
+        # It will wrap the inputs in the form group and then the fieldset and:
+        # - display the hint (if there is one)
+        # - find and display the error message (if there is one)
+        #
+        # @!attribute [r] fieldset
+        #   @return [Fieldset] The initialised fieldset
+
+        class Inputs < Field
+          private
+
+          attr_reader :fieldset
+
+          public
+
+          # @param (see CCS::Components::GovUK::Field#initialize)
+          # @param fieldset [Hash] attributes for the fieldset, see {CCS::Components::GovUK::Fieldset#initialize Fieldset#initialize} for more details.
+          #
+          # @option (see CCS::Components::GovUK::Field#initialize)
+
+          def initialize(attribute:, fieldset:, **options)
+            super(attribute: attribute, **options)
+
+            set_described_by(fieldset, @attribute, @error_message, options[:hint])
+
+            @fieldset = Fieldset.new(context: @context, **fieldset)
+          end
+
+          # Generates the HTML to wrap arround a GDS form component
+          #
+          # @yield (see CCS::Components::GovUK::Field#render)
+          #
+          # @return [ActiveSupport::SafeBuffer]
+
+          def render
+            super() do |display_error_message|
+              fieldset.render do
+                concat(hint.render) if hint
+                concat(display_error_message)
+                concat(yield)
+              end
+            end
+          end
+        end
+      end
+    end
+  end
+end

data/lib/ccs/components/govuk/field.rb

@@ -0,0 +1,108 @@
+require_relative '../base'
+require_relative 'form_group'
+require_relative 'hint'
+
+module CCS
+  module Components
+    module GovUK
+      # = GOV.UK Field
+      #
+      # This class is used to create a form using the structure of a GDS input field components, e.g. text input.
+      # It will wrap the input within the form group as well as find if there are any error messages to display.
+      #
+      # @!attribute [r] attribute
+      #   @return [String,Symbol] The attribute of the field
+      # @!attribute [r] error_message
+      #   @return [String] The error message for the field
+      # @!attribute [r] form_group
+      #   @return [FormGroup] The initialised form group
+      # @!attribute [r] hint
+      #   @return [Hint] The initialised hint
+
+      class Field < Base
+        private
+
+        attr_reader :attribute, :error_message, :form_group, :hint
+
+        public
+
+        # @param attribute [String, Symbol] the attribute of the field
+        # @param hint [Hash] attributes for the hint, see {CCS::Components::GovUK::Hint#initialize Hint#initialize} for more details.
+        #                    If no hint is given then no hint will be rendered
+        # @param form_group [Hash] attributes for the form group, see {CCS::Components::GovUK::FormGroup#initialize FormGroup#initialize} for more details.
+        # @param options [Hash] options that will be used for the parts of the field
+        #
+        # @option options [String] :error_message (nil) the error message to be displayed
+        # @option options [ActiveModel] :model (nil) optional model that can be used to find an error message
+        # @option options [ActionView::Helpers::FormBuilder] :form (nil) optional form builder used to create
+        #                                                                the field and find the error message
+        # @option options [String] :classes additional CSS classes for the field HTML
+        # @option options [Hash] :attributes ({}) any additional attributes that will added as part of the HTML
+
+        def initialize(attribute:, form_group: nil, hint: nil, **options)
+          super(**options)
+
+          (hint[:attributes] ||= {})[:id] = "#{attribute}-hint" if hint && !hint.dig(:attributes, :id)
+
+          @attribute = attribute
+          @error_message = find_error_message(attribute)
+
+          @form_group = FormGroup.new(attribute: attribute, error_message: @error_message, context: @context, **(form_group || {}))
+          @hint = Hint.new(context: @context, **hint) if hint
+        end
+
+        # Generates the HTML to wrap arround a GDS form input component
+        #
+        # @yield the field HTML
+        #
+        # @yieldparam displayed_error_message [ActiveSupport::SafeBuffer] the error message HTML to display
+        #
+        # @return [ActiveSupport::SafeBuffer]
+
+        def render(&block)
+          form_group.render(&block)
+        end
+
+        private
+
+        # If one is present it will find the error message text for the field
+        #
+        # @param attribute [String, Symbol] the attribute of the field
+        #
+        # @return [String]
+
+        def find_error_message(attribute)
+          if @options[:model]
+            @options[:model].errors[attribute].first
+          elsif options[:form]
+            @options[:form].object.errors[attribute].first
+          else
+            @options[:error_message]
+          end
+        end
+
+        # Adds the aira-describedby attribute for the field
+        # if there is a hint or an error message
+        #
+        # @param field_options [Hash] the hash with the options to add the aria described by to
+        # @param attribute [String, Symbol] the attribute of the field
+        # @param error_message [String] used to indicate if there is an error
+        # @param hint [Hash] the hint attributes
+
+        def set_described_by(field_options, attribute, error_message, hint)
+          aria_described_by = [
+            field_options.dig(:attributes, :aria, :describedby),
+            (hint[:attributes][:id] if hint),
+            ("#{attribute}-error" if error_message)
+          ].compact
+
+          return unless aria_described_by.any?
+
+          ((field_options[:attributes] ||= {})[:aria] ||= {})[:describedby] = aria_described_by.join(' ')
+        end
+      end
+    end
+
+    ActionView::Base.field_error_proc = proc { |html_tag, _instance| html_tag }
+  end
+end

data/lib/ccs/components/govuk/fieldset/legend.rb

@@ -0,0 +1,65 @@
+require_relative '../../base'
+
+module CCS
+  module Components
+    module GovUK
+      class Fieldset < Base
+        # = GOV.UK Fieldset Legend
+        #
+        # The legend for the fieldset
+        #
+        # @!attribute [r] text
+        #   @return [String] Text for the fieldset legend
+        # @!attribute [r] is_page_heading
+        #   @return [Boolean] Flag to indicate of the legend is a the page heading
+        # @!attribute [r] caption
+        #   @return [Hash] The class for the li elements
+
+        class Legend < Base
+          private
+
+          attr_reader :text, :is_page_heading, :caption
+
+          public
+
+          # @param text [String] the text for the fieldset legend
+          # @param is_page_heading [Boolean]  if the legend is also the heading it will rendered in a h1
+          # @param caption [String] options for the caption to be rendered above the heading if +:is_page_heading+ is true
+          # @param options [Hash] options that will be used in customising the HTML
+          #
+          # @option options [String] :classes additional CSS classes for the legend HTML
+          #
+          # @option caption [String] :text text for the caption
+          # @option caption [String] :classes additional CSS classes for the caption HTML
+
+          def initialize(text:, is_page_heading: nil, caption: nil, **options)
+            super(**options)
+
+            @text = text
+            @is_page_heading = is_page_heading
+            @caption = caption
+          end
+
+          # Generates the HTML for the GOV.UK Fieldset legend
+          #
+          # @return [ActiveSupport::SafeBuffer]
+
+          def render
+            tag.legend(class: options[:attributes][:class]) do
+              if is_page_heading
+                concat(tag.span(caption[:text], class: caption[:classes])) if caption
+                concat(tag.h1(text, class: 'govuk-fieldset__heading'))
+              else
+                text
+              end
+            end
+          end
+
+          # The default attributes for the fieldset legend
+
+          DEFAULT_ATTRIBUTES = { class: 'govuk-fieldset__legend' }.freeze
+        end
+      end
+    end
+  end
+end

data/lib/ccs/components/govuk/fieldset.rb

@@ -0,0 +1,54 @@
+require_relative '../base'
+require_relative 'fieldset/legend'
+
+module CCS
+  module Components
+    module GovUK
+      # = GOV.UK Fieldset
+      #
+      # This is used to generate the fieldset component from the
+      # {https://design-system.service.gov.uk/components/fieldset GDS - Components - Fieldset}
+      #
+      # @!attribute [r] legend
+      #   @return [Legend] Initialised fieldset legend
+
+      class Fieldset < Base
+        private
+
+        attr_reader :legend
+
+        public
+
+        # @param legend [Hash] options for the fieldset legend.
+        #                      See {Components::GovUK::Fieldset::Legend#initialize Legend#initialize} for details of the options.
+        # @param options [Hash] options that will be used in customising the HTML
+        #
+        # @option options [String] :classes additional CSS classes for the fieldset HTML
+        # @option options [Hash] :attributes ({}) any additional attributes that will added as part of the HTML
+
+        def initialize(legend: nil, **options)
+          super(**options)
+
+          @legend = Legend.new(context: @context, **legend) if legend
+        end
+
+        # Generates the HTML for the GOV.UK Fieldset component
+        #
+        # @yield HTML that will be contained within the 'govuk-fieldset' div and under the legend
+        #
+        # @return [ActiveSupport::SafeBuffer]
+
+        def render
+          tag.fieldset(**options[:attributes]) do
+            concat(legend.render) if legend
+            yield
+          end
+        end
+
+        # The default attributes for the fieldset
+
+        DEFAULT_ATTRIBUTES = { class: 'govuk-fieldset' }.freeze
+      end
+    end
+  end
+end

data/lib/ccs/components/govuk/footer/link.rb

@@ -0,0 +1,55 @@
+require_relative '../../base'
+
+module CCS
+  module Components
+    module GovUK
+      class Footer < Base
+        # = GOV.UK Footer link
+        #
+        # The individual footer footer link item
+        #
+        # @!attribute [r] text
+        #   @return [String] Text for the footer link
+        # @!attribute [r] href
+        #   @return [String] The href for the footer link
+        # @!attribute [r] li_class
+        #   @return [String] The class for the li elements
+
+        class Link < Base
+          private
+
+          attr_reader :text, :href, :li_class
+
+          public
+
+          # @param text [String] the text for the footer link
+          # @param href [String] the href for the footer link
+          # @param li_class [String] class for the li elements
+          # @param options [Hash] options that will be used in customising the HTML
+          #
+          # @option options [Hash] :attributes any additional attributes that will added as part of the HTML
+
+          def initialize(text:, href:, li_class:, **options)
+            super(**options)
+
+            @text = text
+            @href = href
+            @li_class = li_class
+          end
+
+          # Generates the HTML for the GOV.UK Footer link
+          #
+          # @return [ActiveSupport::SafeBuffer]
+
+          def render
+            tag.li(class: li_class) do
+              options[:attributes][:class] = 'govuk-footer__link'
+
+              link_to(text, href, **options[:attributes])
+            end
+          end
+        end
+      end
+    end
+  end
+end

data/lib/ccs/components/govuk/footer/meta.rb

@@ -0,0 +1,59 @@
+require_relative 'link'
+
+module CCS
+  module Components
+    module GovUK
+      class Footer < Base
+        # = GOV.UK Footer Meta
+        #
+        # The footer meta section
+        #
+        # @!attribute [r] meta_links
+        #   @return [Array<Link>] An array of the initialised meta links
+        # @!attribute [r] visually_hidden_title
+        #   @return [String] Title for the meta section
+        # @!attribute [r] text
+        #   @return [String] Text to add to the meta section of the footer
+
+        class Meta
+          include ActionView::Context
+          include ActionView::Helpers
+
+          private
+
+          attr_reader :meta_links, :visually_hidden_title, :text
+
+          public
+
+          # @param items [Array<Hash>] an array of links for the meta section.
+          #                            See {Components::GovUK::Footer::Link#initialize Link#initialize} for details of the items in the array.
+          # @param visually_hidden_title [String] ('Support links') title for the meta section
+          # @param text [String] text to add to the meta section of the footer
+          # @param context [ActionView::Base] the view context
+
+          def initialize(context:, items: nil, visually_hidden_title: nil, text: nil)
+            @meta_links = items&.map { |meta_link| Link.new(li_class: 'govuk-footer__inline-list-item', context: context, **meta_link) }
+            @visually_hidden_title = visually_hidden_title || 'Support links'
+            @text = text
+          end
+
+          # Generates the HTML for the GOV.UK Footer Meta sections
+          #
+          # @return [ActiveSupport::SafeBuffer]
+
+          def render
+            capture do
+              concat(tag.h2(visually_hidden_title, class: 'govuk-visually-hidden'))
+              if meta_links
+                concat(tag.ul(class: 'govuk-footer__inline-list') do
+                  meta_links.each { |meta_link| concat(meta_link.render) }
+                end)
+              end
+              concat(tag.div(text, class: 'govuk-footer__meta-custom')) if text
+            end
+          end
+        end
+      end
+    end
+  end
+end