nfg_ui 0.9.8.15

data/lib/nfg_ui/bootstrap/components/base.rb

@@ -0,0 +1,151 @@
+# frozen_string_literal: true
+
+module NfgUi
+  module Bootstrap
+    module Components
+      # Base Component
+      # Defines conventional, shared behavior across
+      # Bootstrap components
+      class Base
+        include ActionView::Helpers::TagHelper
+        include ActionView::Helpers::TextHelper
+        include ActionView::Helpers::AssetTagHelper
+        include ActionView::Context
+
+        attr_reader   :body
+
+        attr_accessor :options,
+                      :view_context
+
+        def initialize(component_options, view_context)
+          self.options = defaults.merge!(component_options)
+          self.view_context = view_context
+          @body = options.fetch(:body, '')
+          utility_initialize
+          component_initialize
+        end
+
+
+        # This base render handles many of the components and
+        # can be changed to have a different base element by
+        # overriding the base_element.
+        # in some cases, the child component can also call
+        # super with a block to have this render as the wrapping
+        # element.
+        def render
+          content_tag(base_element, html_options) do
+            (block_given? ? yield : body)
+          end
+        end
+
+        # This is used to help identify where to find partials for rendering components.
+        #
+        # Set the component family, e.g.: :breadcrumb
+        # on any sibling components.
+        #
+        # For example:
+        # BreadcrumbItem & Breadcrumb are members of the :breadcrumb component_family
+        def component_family
+          nil
+        end
+
+        def data
+          options[:data] || {}
+        end
+
+        def html_options
+          options.except(*non_html_attribute_options)
+                 .merge!(id: id,
+                         class: css_classes,
+                         data: data,
+                         href: href,
+                         style: style,
+                         **assistive_html_attributes)
+                 .reject { |_k, v| v.blank? } # prevent empty attributes from showing up
+                                              # Example: <div class>Text</div>
+        end
+
+        def href
+          options[:href]
+        end
+
+        def id
+          options[:id]
+        end
+
+        # For components that inherit bootstrap, provide a second
+        # layer of initialization, for example:
+        # to initialize traits on design system components
+        # (which are not available on bootstrap)
+        def component_initialize; end
+        def utility_initialize; end
+
+        def style
+          options[:style]
+        end
+
+        private
+
+        # Assigned on individual components as needed
+        # Ex: { role: 'alert' }
+        #
+        # If aria assistive html is needed, see:
+        # Bootstrap::Utilities::AriaAssistable
+        # avoid passing aria to assistive_html_attributes directly
+        def assistive_html_attributes
+          @assistive_html_attributes ||= {}
+        end
+
+        # the base_element is used in the default render for all components
+        # as the outer wrapping element. Typically, this is a div, but
+        # can be overriddent as a different static element in a child class
+        # or as a dynamic element in the child class.
+        # this allows most child components to not have to have their
+        # own render statement if their wrapping element is not a div
+        def base_element
+          :div
+        end
+
+        # Fallback component css class name.
+        # Overwritten within individual classes for situations like
+        # Button's css class is 'btn'...
+        # Example: returns 'alert' from NfgUi::Bootstrap::Components::Alert
+        def component_css_class
+          @component_css_class ||= component_class_name_string.underscore.dasherize.downcase
+        end
+
+        def component_class_name_string
+          self.class.name.demodulize.to_s
+        end
+
+        # Manage or adjust the css_classes of the component by
+        # adding a new string of css classes to this method
+        # ex: super.push('new-class')
+        def css_classes
+          @css_classes ||= [component_css_class, options[:class]].join(' ').squish
+        end
+
+        def defaults
+          {
+            # HTML Defaults
+            class: '',
+            id: nil,
+
+            # Content
+            # heading: (nil if heading.present?),
+            body: nil,
+            data: {},
+
+            # Configuration
+            # traits: ([] if traits.present?)
+          }
+        end
+        # Remove attributes from html_options that shouldn't show up in the
+        # html element, ex: <div body='should not be here'>
+        def non_html_attribute_options
+          @non_html_attribute_options ||= %i[body heading traits]
+        end
+      end
+    end
+  end
+end

data/lib/nfg_ui/bootstrap/components/breadcrumb.rb

@@ -0,0 +1,23 @@
+# frozen_string_literal: true
+
+module NfgUi
+  module Bootstrap
+    module Components
+      # Bootstrap Breadcrumb Component
+      # https://getbootstrap.com/docs/4.1/components/breadcrumb/
+      class Breadcrumb < NfgUi::Bootstrap::Components::Base
+        def component_family
+          :breadcrumb
+        end
+
+        def render
+          content_tag(:nav, aria: { label: 'breadcrumb' }) do
+            content_tag(:ol, html_options) do
+              (block_given? ? yield : body)
+            end
+          end
+        end
+      end
+    end
+  end
+end

data/lib/nfg_ui/bootstrap/components/breadcrumb_item.rb

@@ -0,0 +1,28 @@
+# frozen_string_literal: true
+
+module NfgUi
+  module Bootstrap
+    module Components
+      # Bootstrap Breadcrumb Item
+      # Subcomponent of Breadcrumb
+      # https://getbootstrap.com/docs/4.1/components/breadcrumb/
+      class BreadcrumbItem < NfgUi::Bootstrap::Components::Base
+        include Bootstrap::Utilities::Activatable
+
+        def component_family
+          :breadcrumb
+        end
+
+        private
+
+        def base_element
+          :li
+        end
+
+        def assistive_html_attributes
+          active ? super.merge!(aria: { current: 'page' }) : super
+        end
+      end
+    end
+  end
+end

data/lib/nfg_ui/bootstrap/components/button.rb

@@ -0,0 +1,74 @@
+# frozen_string_literal: true
+
+module NfgUi
+  module Bootstrap
+    module Components
+      # Bootstrap Button Component
+      # https://getbootstrap.com/docs/4.1/components/buttons/
+      class Button < NfgUi::Bootstrap::Components::Base
+        include Bootstrap::Utilities::Activatable
+        include Bootstrap::Utilities::CollapseToggleable
+        include Bootstrap::Utilities::Disableable
+        include Bootstrap::Utilities::Remotable
+        include Bootstrap::Utilities::Sizable
+        include Bootstrap::Utilities::Modalable
+        include Bootstrap::Utilities::Themeable
+        include Bootstrap::Utilities::Tooltipable
+        include Bootstrap::Utilities::Wrappable
+
+        def render
+          if tooltip && disabled
+            content_tag(:span, disabled_component_tooltip_wrapper_html_options) do
+              content_tag(as, html_options) do
+                (block_given? ? yield : body)
+              end
+            end
+          else
+            content_tag(as, html_options) do
+              (block_given? ? yield : body)
+            end
+          end
+        end
+
+        def block
+          options.fetch(:block, false)
+        end
+
+        def href
+          return if as != :a
+          collapse ? collapse : (options[:href] || '#')
+        end
+
+        def remove_component_css_classes
+          options.fetch(:remove_component_css_classes, false)
+        end
+
+        private
+
+        def assistive_html_attributes
+          active ? super.merge(aria: { pressed: true }) : super
+        end
+
+        def css_classes
+          block ? super + " #{component_css_class}-block" : super
+        end
+
+        def collapse_data_attributes
+          as == :a ? super.except!(:target) : super
+        end
+
+        def component_css_class
+          remove_component_css_classes ? '' : 'btn'
+        end
+
+        def default_html_wrapper_element
+          :a
+        end
+
+        def non_html_attribute_options
+          super.push(:block, :remove_component_css_classes)
+        end
+      end
+    end
+  end
+end

data/lib/nfg_ui/bootstrap/components/button_group.rb

@@ -0,0 +1,36 @@
+# frozen_string_literal: true
+
+module NfgUi
+  module Bootstrap
+    module Components
+      # Bootstrap Button Group Component
+      # An optional parent of the Button component
+      # https://getbootstrap.com/docs/4.1/components/breadcrumb/
+      class ButtonGroup < NfgUi::Bootstrap::Components::Base
+        include Bootstrap::Utilities::DropdownDirectionable
+        include Bootstrap::Utilities::Sizable
+
+        def vertical
+          options.fetch(:vertical, false)
+        end
+
+        private
+
+        def assistive_html_attributes
+          super.merge!(role: 'group', aria: { label: 'action buttons' })
+        end
+
+        def component_css_class
+          'btn-group'
+        end
+
+        def css_classes
+          [
+            super,
+            ("#{component_css_class}-vertical" if vertical)
+          ].join(' ').squish
+        end
+      end
+    end
+  end
+end

data/lib/nfg_ui/bootstrap/components/button_toolbar.rb

@@ -0,0 +1,21 @@
+# frozen_string_literal: true
+
+module NfgUi
+  module Bootstrap
+    module Components
+      # Bootstrap Button Toolbar Component
+      # https://getbootstrap.com/docs/4.1/components/button-group/#button-toolbar
+      class ButtonToolbar < NfgUi::Bootstrap::Components::Base
+        private
+
+        def component_css_class
+          'btn-toolbar'
+        end
+
+        def assistive_html_attributes
+          super.merge!(role: 'toolbar')
+        end
+      end
+    end
+  end
+end

data/lib/nfg_ui/bootstrap/components/card.rb

@@ -0,0 +1,81 @@
+# frozen_string_literal: true
+
+module NfgUi
+  module Bootstrap
+    module Components
+      # Bootstrap Card Component
+      # https://getbootstrap.com/docs/4.1/components/cards/
+      class Card < NfgUi::Bootstrap::Components::Base
+        include Bootstrap::Utilities::Themeable
+
+        def component_family
+          :card
+        end
+
+        def footer
+          options.fetch(:footer, '')
+        end
+
+        def heading
+          options.fetch(:heading, '')
+        end
+
+        def subtitle
+          options.fetch(:subtitle, '')
+        end
+
+        def title
+          options.fetch(:title, '')
+        end
+
+        def render
+          content_tag(:div, html_options) do
+            capture do
+              if heading.present?
+                concat(NfgUi::Bootstrap::Components::CardHeader.new({ heading: heading }, view_context).render)
+              end
+
+              concat(NfgUi::Bootstrap::Components::CardBody.new({}, view_context).render {
+                capture do
+                  concat(content_tag(:h5, title, class: 'card-title')) if title.present?
+                  concat(content_tag(:h6, subtitle, class: 'card-subtitle')) if subtitle.present?
+                  concat(block_given? ? yield : body)
+                end
+              })
+
+              if footer.present?
+                concat(NfgUi::Bootstrap::Components::CardFooter.new({ body: footer }, view_context).render)
+              end
+            end
+          end
+        end
+
+        private
+
+        def css_classes
+          return super unless theme.presence && theme != :light
+          [
+            super,
+            (outlined ? "text-#{theme}" : 'text-white')
+          ].join(' ').squish
+        end
+
+        def default_theme
+          nil
+        end
+
+        def non_html_attribute_options
+          super.push(:footer, :heading, :subtitle, :title)
+        end
+
+        def outlined_css_class_prefix
+          'border-'
+        end
+
+        def theme_css_class_prefix
+          outlined ? '' : 'bg-'
+        end
+      end
+    end
+  end
+end

data/lib/nfg_ui/bootstrap/components/card_body.rb

@@ -0,0 +1,15 @@
+# frozen_string_literal: true
+
+module NfgUi
+  module Bootstrap
+    module Components
+      # Bootstrap Card Header
+      # https://getbootstrap.com/docs/4.1/components/card/#header-and-footer
+      class CardBody < NfgUi::Bootstrap::Components::Base
+        def component_family
+          :card
+        end
+      end
+    end
+  end
+end

data/lib/nfg_ui/bootstrap/components/card_footer.rb

@@ -0,0 +1,15 @@
+# frozen_string_literal: true
+
+module NfgUi
+  module Bootstrap
+    module Components
+      # Bootstrap Card Header
+      # https://getbootstrap.com/docs/4.1/components/card/#header-and-footer
+      class CardFooter < NfgUi::Bootstrap::Components::Base
+        def component_family
+          :card
+        end
+      end
+    end
+  end
+end

data/lib/nfg_ui/bootstrap/components/card_header.rb

@@ -0,0 +1,35 @@
+# frozen_string_literal: true
+
+module NfgUi
+  module Bootstrap
+    module Components
+      # Bootstrap Card Header
+      # https://getbootstrap.com/docs/4.1/components/card/#header-and-footer
+      class CardHeader < NfgUi::Bootstrap::Components::Base
+        def component_family
+          :card
+        end
+
+        def heading
+          options.fetch(:heading, nil)
+        end
+
+        def render
+          super do
+            if heading.present?
+              heading
+            else
+              (block_given? ? yield : body)
+            end
+          end
+        end
+
+        private
+
+        def non_html_attribute_options
+          super.push(:heading)
+        end
+      end
+    end
+  end
+end

data/lib/nfg_ui/bootstrap/components/card_image.rb

@@ -0,0 +1,33 @@
+# frozen_string_literal: true
+
+module NfgUi
+  module Bootstrap
+    module Components
+      # Bootstrap Card Header
+      # https://getbootstrap.com/docs/4.1/components/card/#header-and-footer
+      class CardImage < NfgUi::Bootstrap::Components::Base
+        def component_family
+          :card
+        end
+
+        def image
+          options.fetch(:image, '')
+        end
+
+        def render
+          image_tag image, **html_options
+        end
+
+        private
+
+        def component_css_class
+          'card-img'
+        end
+
+        def non_html_attribute_options
+          super.push(:image)
+        end
+      end
+    end
+  end
+end

data/lib/nfg_ui/bootstrap/components/card_image_overlay.rb

@@ -0,0 +1,46 @@
+# frozen_string_literal: true
+
+module NfgUi
+  module Bootstrap
+    module Components
+      # Bootstrap Card Header
+      # https://getbootstrap.com/docs/4.1/components/card/#header-and-footer
+      class CardImageOverlay < NfgUi::Bootstrap::Components::Base
+        include NfgUi::Components::Utilities::Titleable
+
+        def component_family
+          :card
+        end
+
+        def image
+          options.fetch(:image, '')
+        end
+
+        def render
+          capture do
+            if image
+              concat(NfgUi::Bootstrap::Components::CardImage.new({ image: image }, view_context).render)
+            end
+
+            concat(content_tag(:div, html_options) {
+              capture do
+                concat(content_tag(:h5, title, class: 'card-title')) if title
+                concat(block_given? ? yield : body)
+              end
+            })
+          end
+        end
+
+        private
+
+        def component_css_class
+          'card-img-overlay'
+        end
+
+        def non_html_attribute_options
+          super.push(:image)
+        end
+      end
+    end
+  end
+end

data/lib/nfg_ui/bootstrap/components/carousel.rb

@@ -0,0 +1,57 @@
+# frozen_string_literal: true
+
+module NfgUi
+  module Bootstrap
+    module Components
+      # Bootstrap Carousel Component
+      # https://getbootstrap.com/docs/4.1/components/carousel/
+      class Carousel < NfgUi::Bootstrap::Components::Base
+        def component_family
+          :carousel
+        end
+
+        def controls
+          options.fetch(:controls, false)
+        end
+
+        def data
+          super.merge!(ride: 'carousel')
+        end
+
+        def indicators
+          options[:indicators] || 0 # return 0 on nil
+        end
+
+        def render
+          super do
+            capture do
+              content_tag(:div, class: 'carousel-inner') do
+                if indicators > 0
+                  concat(NfgUi::Bootstrap::Components::CarouselIndicators.new({ count: indicators, carousel: "##{id}" }, view_context).render)
+                end
+                concat(block_given? ? yield : body)
+                if controls
+                  concat(NfgUi::Bootstrap::Components::CarouselControl.new({ control: :next, carousel: "##{id}" }, view_context).render)
+                  concat(NfgUi::Bootstrap::Components::CarouselControl.new({ control: :prev, carousel: "##{id}" }, view_context).render)
+                end
+              end
+            end
+          end
+        end
+
+        private
+
+        def css_classes
+          [
+            super,
+            'slide'
+          ].join(' ').squish
+        end
+
+        def non_html_attribute_options
+          super.push(:indicators, :controls)
+        end
+      end
+    end
+  end
+end

data/lib/nfg_ui/bootstrap/components/carousel_caption.rb

@@ -0,0 +1,34 @@
+# frozen_string_literal: true
+
+module NfgUi
+  module Bootstrap
+    module Components
+      # Bootstrap Carousel Caption Component
+      # https://getbootstrap.com/docs/4.1/components/carousel/#with-captions
+      class CarouselCaption < NfgUi::Bootstrap::Components::Base
+        def component_family
+          :carousel
+        end
+
+        def label
+          options.fetch(:label, nil)
+        end
+
+        def render
+          super do
+            capture do
+              concat(content_tag(:h5, label)) if label
+              concat(block_given? ? yield : body)
+            end
+          end
+        end
+
+        private
+
+        def non_html_attribute_options
+          super.push(:label)
+        end
+      end
+    end
+  end
+end