ccs-frontend_helpers 0.1.0 → 0.1.1.rc.1

data/lib/ccs/{frontend_helpers/ccs_frontend → components/ccs}/logo.rb

@@ -1,25 +1,23 @@
-# frozen_string_literal: true
-
 require 'action_view'
 
 module CCS
-  module FrontendHelpers
-    module CCSFrontend
+  module Components
+    module CCS
       # = CCS Logo
       #
-      # This helper is used for generating the logo component from the
+      # This is used for generating the logo component from the
       # {https://github.com/tim-s-ccs/ts-ccs-frontend/tree/main/src/ccs/components/logo CCS - Components - Logo}
 
-      module Logo
-        include ActionView::Context
-        include ActionView::Helpers::TagHelper
-        include ActionView::Helpers::TextHelper
+      class Logo
+        extend ActionView::Context
+        extend ActionView::Helpers
 
-        # Generates the CCS logo used in {ccs_header} and {ccs_footer}
+        # Generates the HTML for the CCS Logo.
+        # Used in {CCS::Components::CCS::Header Header} and {CCS::Components::CCS::Footer Footer}
         #
-        # @return [ActiveSupport::SafeBuffer] the HTML for the logo used in {ccs_header} and {ccs_footer}
+        # @return [ActiveSupport::SafeBuffer]
 
-        def ccs_logo
+        def self.render
           tag.span(class: 'ccs-logo') do
             concat(tag.svg(class: 'ccs-logo__svg', xmlns: 'http://www.w3.org/2000/svg', height: '101', width: '121', aria: { hidden: 'true' }, focusable: 'false', viewBox: '0 0 121 101') do
               CCS_LOGO_PATHS.each { |ccs_logo_path_attributes| concat(tag.path(**ccs_logo_path_attributes)) }

data/lib/ccs/components/govuk/accordion/section/content.rb

@@ -0,0 +1,53 @@
+module CCS
+  module Components
+    module GovUK
+      class Accordion < Base
+        class Section
+          # = GOV.UK Accordion Section Content
+          #
+          # The individual accordion section content
+          #
+          # @!attribute [r] section
+          #   @return [Hash] Attributes for the accordion section
+          # @!attribute [r] accordion_id
+          #   @return [String] ID of the accordion
+          # @!attribute [r] index
+          #   @return [Integer] Index of the accordion section
+
+          class Content
+            include ActionView::Context
+            include ActionView::Helpers
+
+            private
+
+            attr_reader :section, :accordion_id, :index
+
+            public
+
+            # @param section [Hash] attributes for the accordion section
+            # @param accordion_id [String] ID of the accordion
+            # @param index [Integer] the index of the accordion section
+            #
+            # @option (see CCS::Components::GovUK::Accordion::Section)
+
+            def initialize(section:, accordion_id:, index:)
+              @section = section
+              @accordion_id = accordion_id
+              @index = index
+            end
+
+            # Generates the HTML for the GOV.UK Accordion Section Content
+            #
+            # @return [ActiveSupport::SafeBuffer]
+
+            def render
+              tag.div(class: 'govuk-accordion__section-content', id: "#{accordion_id}-content-#{index}", aria: { labelledby: "#{accordion_id}-heading-#{index}" }) do
+                section[:content] || tag.p(section[:text], class: 'govuk-body')
+              end
+            end
+          end
+        end
+      end
+    end
+  end
+end

data/lib/ccs/components/govuk/accordion/section/header.rb

@@ -0,0 +1,57 @@
+module CCS
+  module Components
+    module GovUK
+      class Accordion < Base
+        class Section
+          # = GOV.UK Accordion Section Header
+          #
+          # The individual accordion section header
+          #
+          # @!attribute [r] section
+          #   @return [Hash] Attributes for the accordion section
+          # @!attribute [r] accordion_id
+          #   @return [String] ID of the accordion
+          # @!attribute [r] index
+          #   @return [Integer] Index of the accordion section
+          # @!attribute [r] heading_level
+          #   @return [Integer] The heading level for the accordion section
+
+          class Header
+            include ActionView::Context
+            include ActionView::Helpers
+
+            private
+
+            attr_reader :section, :accordion_id, :index, :heading_level
+
+            public
+
+            # @param (see CCS::Components::GovUK::Accordion::Section)
+            #
+            # @option (see CCS::Components::GovUK::Accordion::Section)
+
+            def initialize(section:, accordion_id:, index:, heading_level:)
+              @section = section
+              @accordion_id = accordion_id
+              @index = index
+              @heading_level = heading_level
+            end
+
+            # Generates the HTML for the GOV.UK Accordion Section Header
+            #
+            # @return [ActiveSupport::SafeBuffer]
+
+            def render
+              tag.div(class: 'govuk-accordion__section-header') do
+                concat(tag.send("h#{heading_level}", class: 'govuk-accordion__section-heading') do
+                  tag.span(section[:heading], class: 'govuk-accordion__section-button', id: "#{accordion_id}-heading-#{index}")
+                end)
+                concat(tag.div(section[:summary], class: 'govuk-accordion__section-summary govuk-body', id: "#{accordion_id}-summary-#{index}")) if section[:summary]
+              end
+            end
+          end
+        end
+      end
+    end
+  end
+end

data/lib/ccs/components/govuk/accordion/section.rb

@@ -0,0 +1,61 @@
+require_relative 'section/header'
+require_relative 'section/content'
+
+module CCS
+  module Components
+    module GovUK
+      class Accordion < Base
+        # = GOV.UK Accordion Section
+        #
+        # The individual accordion section
+        #
+        # @!attribute [r] header
+        #   @return [Header] Initialised accordion section header
+        # @!attribute [r] content
+        #   @return [Content] Initialised accordion section content
+        # @!attribute [r] section_is_expanded
+        #   @return [Boolean] flag to indicate of the section should be expanded
+
+        class Section
+          include ActionView::Context
+          include ActionView::Helpers
+
+          private
+
+          attr_reader :header, :content, :section_is_expanded
+
+          public
+
+          # @param section [Hash] attributes for the accordion section
+          # @param accordion_id [String] ID of the accordion
+          # @param index [Integer] the index of the accordion section
+          # @param heading_level [Integer] heading level, from 1 to 6
+          #
+          # @option section [Boolean] :expanded sets whether the section should be expanded
+          #                                     when the page loads for the first time.
+          # @option section [String] :heading the heading text for the accordion
+          # @option section [String] :summary (nil) optional summary text for the accordion header
+          # @option section [ActiveSupport::SafeBuffer] :content the content within the accordion section
+          # @option section [String] : text if +:content+ is +nil+ then the text will be rendered
+
+          def initialize(section:, accordion_id:, index:, heading_level:)
+            @section_is_expanded = section[:expanded]
+            @header = Header.new(section: section, accordion_id: accordion_id, index: index, heading_level: heading_level)
+            @content = Content.new(section: section, accordion_id: accordion_id, index: index)
+          end
+
+          # Generates the HTML for the GOV.UK Accordion Section
+          #
+          # @return [ActiveSupport::SafeBuffer]
+
+          def render
+            tag.div(class: "govuk-accordion__section #{'govuk-accordion__section--expanded' if section_is_expanded}".rstrip) do
+              concat(header.render)
+              concat(content.render)
+            end
+          end
+        end
+      end
+    end
+  end
+end

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

@@ -0,0 +1,58 @@
+require_relative '../base'
+require_relative 'accordion/section'
+
+module CCS
+  module Components
+    module GovUK
+      # = GOV.UK Accordion
+      #
+      # This is used for generating the accordion component from the
+      # {https://design-system.service.gov.uk/accordion/back-link GDS - Components - Accordion}
+      #
+      # @!attribute [r] accordion_sections
+      #   @return [Array<Section>] An array of the initialised accordion sections
+
+      class Accordion < Base
+        private
+
+        attr_reader :accordion_sections
+
+        public
+
+        # @param accordion_id [String] used as an id in the HTML for the accordion as a whole,
+        #                              and also as a prefix for the ids of the section contents
+        #                              and the buttons that open them
+        # @param accordion_sections [Array<Hash>] an array of accordion section attributes.
+        #                                         See {Components::GovUK::Accordion::Section#initialize Section#initialize} for details of the items in the array.
+        # @param options [Hash] options that will be used in customising the HTML
+        #
+        # @option options [String] :classes additional CSS classes for the accordion HTML
+        # @option options [Integer] :heading_level (2) heading level, from 1 to 6
+        # @option options [Hash] :attributes any additional attributes that will added as part of the HTML
+
+        def initialize(accordion_id:, accordion_sections:, **options)
+          super(**options)
+
+          @options[:attributes][:id] = accordion_id
+          @options[:heading_level] ||= 2
+
+          @accordion_sections = accordion_sections.map.with_index(1) { |accordion_section, index| Section.new(section: accordion_section, accordion_id: accordion_id, index: index, heading_level: @options[:heading_level]) }
+        end
+
+        # Generates the HTML for the GOV.UK Accordion component
+        #
+        # @return [ActiveSupport::SafeBuffer]
+
+        def render
+          tag.div(**options[:attributes]) do
+            accordion_sections.each { |accordion_section| concat(accordion_section.render) }
+          end
+        end
+
+        # The default attributes for the accordion
+
+        DEFAULT_ATTRIBUTES = { class: 'govuk-accordion', data: { module: 'govuk-accordion' } }.freeze
+      end
+    end
+  end
+end

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

@@ -0,0 +1,51 @@
+require_relative '../base'
+
+module CCS
+  module Components
+    module GovUK
+      # = GOV.UK Back Link
+      #
+      # This is used to generate the back link component from the
+      # {https://design-system.service.gov.uk/components/back-link GDS - Components - Back link}
+      #
+      # @!attribute [r] text
+      #   @return [String] Text for the back link
+      # @!attribute [r] href
+      #   @return [String] The href for the back link
+
+      class BackLink < Base
+        private
+
+        attr_reader :text, :href
+
+        public
+
+        # @param text [String] the text for the back link
+        # @param href [String] the href for the back link
+        # @param options [Hash] options that will be used in customising the HTML
+        #
+        # @option options [String] :classes additional CSS classes for the back link HTML
+        # @option options [Hash] :attributes ({}) any additional attributes that will added as part of the HTML
+
+        def initialize(text:, href:, **options)
+          super(**options)
+
+          @text = text
+          @href = href
+        end
+
+        # Generates the HTML for the GOV.UK Back link component
+        #
+        # @return [ActiveSupport::SafeBuffer]
+
+        def render
+          link_to(text, href, **options[:attributes])
+        end
+
+        # The default attributes for the back link
+
+        DEFAULT_ATTRIBUTES = { class: 'govuk-back-link' }.freeze
+      end
+    end
+  end
+end

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

@@ -0,0 +1,57 @@
+require_relative '../../base'
+
+module CCS
+  module Components
+    module GovUK
+      class Breadcrumbs < Base
+        # = GOV.UK Breadcrumbs Link
+        #
+        # The individual list item for the breadcrumbs
+        #
+        # @!attribute [r] text
+        #   @return [String] Text for the breadcrumb link
+        # @!attribute [r] href
+        #   @return [String] The href for the breadcrumb link
+
+        class Link < Base
+          private
+
+          attr_reader :text, :href
+
+          public
+
+          # @param text [String] the text for the breadcrumb link
+          # @param href [String] the href for the breadcrumb link.
+          #                      If blank it is assumed that this item relates to current page
+          # @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.
+          #                                    If the link is blank then it defaults to +{ aria: { current: 'page' } }+
+
+          def initialize(text:, href: nil, **options)
+            super(**options)
+
+            @text = text
+            @href = href
+          end
+
+          # Generates the HTML for the GOV.UK Breadcrumbs link
+          #
+          # @return [ActiveSupport::SafeBuffer]
+
+          def render
+            if href.present?
+              options[:attributes][:class] = 'govuk-breadcrumbs__link'
+
+              tag.li(class: 'govuk-breadcrumbs__list-item') do
+                link_to(text, href, **options[:attributes])
+              end
+            else
+              tag.li(text, class: 'govuk-breadcrumbs__list-item', aria: { current: 'page' })
+            end
+          end
+        end
+      end
+    end
+  end
+end

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

@@ -0,0 +1,55 @@
+require_relative '../base'
+require_relative 'breadcrumbs/link'
+
+module CCS
+  module Components
+    module GovUK
+      # = GOV.UK Breadcrumbs
+      #
+      # This is used to generate the breadcrumbs component from the
+      # {https://design-system.service.gov.uk/components/breadcrumbs GDS - Components - Breadcrumbs}
+      #
+      # @!attribute [r] breadcrumb_links
+      #   @return [Array<Link>] An array of the initialised breadcrumb links
+
+      class Breadcrumbs < Base
+        private
+
+        attr_reader :breadcrumb_links
+
+        public
+
+        # @param breadcrumb_links [Array<Hash>] An array of links for the breadcrumbs list.
+        #                                       See {Components::GovUK::Breadcrumbs::Link#initialize Link#initialize} for details of the items in the array.
+        # @param options [Hash] options that will be used in customising the HTML
+        #
+        # @option options [String] :classes additional CSS classes for the breadcrumbs HTML
+        # @option options [Boolean] :collapse_on_mobile indicates if it is to colapse breadcrumbs on mobile
+        # @option options [Hash] :attributes any additional attributes that will added as part of the HTML
+
+        def initialize(breadcrumb_links:, **options)
+          super(**options)
+          @options[:attributes][:class] << ' govuk-breadcrumbs--collapse-on-mobile' if @options[:collapse_on_mobile]
+
+          @breadcrumb_links = breadcrumb_links.map { |breadcrumb_link| Link.new(context: @context, **breadcrumb_link) }
+        end
+
+        # Generates the HTML for the GOV.UK breadcrumbs component
+        #
+        # @return [ActiveSupport::SafeBuffer]
+
+        def render
+          tag.div(**options[:attributes]) do
+            tag.ol(class: 'govuk-breadcrumbs__list') do
+              breadcrumb_links.each { |breadcrumb_link| concat(breadcrumb_link.render) }
+            end
+          end
+        end
+
+        # The default attributes for the breadcrumbs
+
+        DEFAULT_ATTRIBUTES = { class: 'govuk-breadcrumbs' }.freeze
+      end
+    end
+  end
+end

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

@@ -0,0 +1,107 @@
+require_relative '../base'
+
+module CCS
+  module Components
+    module GovUK
+      # = GOV.UK Button
+      #
+      # This is used to generate the button component from the
+      # {https://design-system.service.gov.uk/components/button GDS - Components - Button}
+      #
+      # @!attribute [r] text
+      #   @return [String] Text for the button
+      # @!attribute [r] render_method
+      #   @return [String] The method that will be used to render the button
+
+      class Button < Base
+        private
+
+        attr_reader :text, :render_method
+
+        public
+
+        # @param text [String] the text that will be shown in the button
+        # @param options [Hash] options that will be used in customising the HTML
+        #
+        # @option options [String] :classes additional CSS classes for the button HTML
+        # @option options [Boolean] :is_start_button indicates if it is a start button
+        # @option options [String] :href the URI that will be used in anchor tag
+        # @option options [ActionView::Helpers::FormBuilder] :form the form builder used to create the submit button
+        # @option options [Hash] :attributes ({}) any additional attributes that will added as part of the HTML
+
+        def initialize(text:, **options)
+          super(**options)
+
+          @options[:attributes][:class] << ' govuk-button--disabled' if @options[:attributes][:disabled]
+          @options[:attributes][:class] << ' govuk-button--start' if @options[:is_start_button]
+
+          @text = text
+          @render_method = :"render_#{if @options[:href]
+                                        :link
+                                      elsif @options[:form]
+                                        :submit
+                                      else
+                                        :button
+                                      end}"
+        end
+
+        # Generates the HTML for the GOV.UK Back link component
+        #
+        # @return [ActiveSupport::SafeBuffer]
+
+        def render
+          send(@render_method)
+        end
+
+        # The default attributes for the button
+
+        DEFAULT_ATTRIBUTES = { class: 'govuk-button', data: { module: 'govuk-button' } }.freeze
+
+        private
+
+        # Generates the HTML for the GOV.UK button component as an anchor tag.
+        #
+        # @return [ActiveSupport::SafeBuffer]
+
+        def render_link
+          @options[:attributes][:role] = :button
+          @options[:attributes][:draggable] = false
+
+          link_to(@options[:href], **@options[:attributes]) do
+            concat(text)
+            concat(start_button_icon) if @options[:is_start_button]
+          end
+        end
+
+        # Generates the HTML for the GOV.UK button component as a button.
+        #
+        # @return [ActiveSupport::SafeBuffer]
+
+        def render_button
+          button_tag(**@options[:attributes]) do
+            concat(text)
+            concat(start_button_icon) if @options[:is_start_button]
+          end
+        end
+
+        # Generates the HTML for the GOV.UK button component as an input.
+        #
+        # @return [ActiveSupport::SafeBuffer]
+
+        def render_submit
+          @options[:form].submit(text, **@options[:attributes])
+        end
+
+        # Generates the arrow if the button is a start button
+        #
+        # @return [ActiveSupport::SafeBuffer]
+
+        def start_button_icon
+          tag.svg(class: 'govuk-button__start-icon', xmlns: 'http://www.w3.org/2000/svg', width: 17.5, height: 19, viewBox: '0 0 33 40', aria: { hidden: true }, focusable: false) do
+            tag.path(fill: 'currentColor', d: 'M0 0h13l20 20-20 20H0l20-20z')
+          end
+        end
+      end
+    end
+  end
+end

data/lib/ccs/components/govuk/cookie_banner/action.rb

@@ -0,0 +1,60 @@
+require_relative '../../base'
+require_relative '../button'
+
+module CCS
+  module Components
+    module GovUK
+      class CookieBanner < Base
+        # = GOV.UK Cookie Banner Action
+        #
+        # The individual cookie banner action.
+        # It defaults to creating button unless a +href+ is set which will create a link
+        #
+        # @!attribute [r] text
+        #   @return [String] Text for the action
+        # @!attribute [r] href
+        #   @return [String] The href for the action
+
+        class Action < Base
+          private
+
+          attr_reader :text, :href
+
+          public
+
+          # @param text [String] the button or link text
+          # @param href [String] the href for a link
+          # @param options [Hash] options that will be used in customising the HTML
+          #
+          # @option options [String] : classes additional CSS classes for the cookie action button or link
+          # @option options [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
+
+          def initialize(text:, href: nil, **options)
+            super(**options)
+
+            @text = text
+            @href = href
+          end
+
+          # Generates the HTML for a cookie banner message action
+          #
+          # @return [ActiveSupport::SafeBuffer]
+
+          def render
+            if href && options[:attributes][:type] != :button
+              link_to(text, href, **options[:attributes])
+            else
+              Button.new(text: text, href: href, context: context, **options).render
+            end
+          end
+
+          # The default attributes for the cookie banner action
+
+          DEFAULT_ATTRIBUTES = { class: 'govuk-link' }.freeze
+        end
+      end
+    end
+  end
+end

data/lib/ccs/components/govuk/cookie_banner/message.rb

@@ -0,0 +1,80 @@
+require_relative '../../base'
+require_relative 'action'
+
+module CCS
+  module Components
+    module GovUK
+      class CookieBanner < Base
+        # = GOV.UK Cookie Banner Message
+        #
+        # The individual cookie banner message
+        #
+        # @!attribute [r] heading_text
+        #   @return [String] Heading text for the message
+        # @!attribute [r] content
+        #   @return [ActiveSupport::SafeBuffer] HTML for the message
+        # @!attribute [r] text
+        #   @return [String] Text for the message
+        # @!attribute [r] actions
+        #   @return [Array<Action>] Array of initialised cookie banner actions
+
+        class Message < Base
+          private
+
+          attr_reader :heading_text, :content, :text, :actions
+
+          public
+
+          # @param heading_text [String] the heading text that displays in the message
+          # @param content [ActiveSupport::SafeBuffer] HTML to use as content for the message
+          # @param text [String] if +:content+ is blank then this is the text used for the message
+          # @param actions [Array<Hash>] the buttons and/or links that you want to display in the message.
+          #                              See {Components::GovUK::CookieBanner::Action#initialize Action#initialize} for details of the items in the array.
+          # @param options [Hash] options that will be used in customising the HTML
+          #
+          # @option options [String] :classes additional CSS classes for the cookie message HTML
+          # @option options [Hash] :attributes any additional attributes that will added as part of the HTML
+
+          def initialize(heading_text: nil, content: nil, text: nil, actions: nil, **options)
+            super(**options)
+
+            @heading_text = heading_text
+            @content = content
+            @text = text
+            @actions = actions.map { |action| Action.new(context: @context, **action) } if actions
+          end
+
+          # rubocop:disable Metrics/AbcSize
+
+          # Generates the HTML for the GOV.UK Cookie Banner Message
+          #
+          # @return [ActiveSupport::SafeBuffer]
+
+          def render
+            tag.div(**options[:attributes]) do
+              concat(tag.div(class: 'govuk-grid-row') do
+                tag.div(class: 'govuk-grid-column-two-thirds') do
+                  concat(tag.h2(heading_text, class: 'govuk-cookie-banner__heading govuk-heading-m')) if heading_text
+                  concat(tag.div(class: 'govuk-cookie-banner__content') do
+                    content || tag.p(text, class: 'govuk-body')
+                  end)
+                end
+              end)
+              if actions
+                concat(tag.div(class: 'govuk-button-group') do
+                  actions.each { |action| concat(action.render) }
+                end)
+              end
+            end
+          end
+
+          # rubocop:enable Metrics/AbcSize
+
+          # The default attributes for the cookie banner message
+
+          DEFAULT_ATTRIBUTES = { class: 'govuk-cookie-banner__message govuk-width-container' }.freeze
+        end
+      end
+    end
+  end
+end