nfg_ui 0.9.8.15

data/lib/nfg_ui/components/elements/slat_item.rb

@@ -0,0 +1,62 @@
+# frozen_string_literal: true
+
+module NfgUi
+  module Components
+    module Elements
+      # Slat doc coming soon
+      class SlatItem < NfgUi::Components::Base
+        include Bootstrap::Utilities::Headable
+        include Bootstrap::Utilities::Sizable
+
+        include NfgUi::Components::Traits::Size
+        include NfgUi::Components::Traits::SlatItem
+
+        def component_family
+          :slats
+        end
+
+        def slat_header
+          options.fetch(:slat_header, nil)
+        end
+
+        def caption
+          options.fetch(:caption, nil)
+        end
+
+        def render
+          super do
+            if slat_header
+              concat(content_tag(:h6, slat_header, class: 'display-4'))
+            end
+            if heading
+              if href
+                concat(content_tag(:a, href: href) {
+                  NfgUi::Components::Foundations::Typeface.new({ subheading: heading }, view_context).render
+                })
+              else
+                concat(NfgUi::Components::Foundations::Typeface.new({ subheading: heading }, view_context).render)
+              end
+            end
+            concat(block_given? ? yield : body)
+            if caption
+              concat(NfgUi::Components::Foundations::Typeface.new({ caption: caption, class: 'mb-0' }, view_context).render)
+            end
+          end
+        end
+
+        private
+
+        def css_classes
+          [
+            super,
+            ('text-word-wrap' if size == :lg)
+          ]
+        end
+
+        def non_html_attribute_options
+          super.push(:slat_header, :caption)
+        end
+      end
+    end
+  end
+end

data/lib/nfg_ui/components/elements/stat.rb

@@ -0,0 +1,11 @@
+# frozen_string_literal: true
+
+module NfgUi
+  module Components
+    module Elements
+      # Stat doc coming soon
+      class Stat < NfgUi::Components::Base
+      end
+    end
+  end
+end

data/lib/nfg_ui/components/elements/step.rb

@@ -0,0 +1,55 @@
+# frozen_string_literal: true
+
+module NfgUi
+  module Components
+    module Elements
+      # Step doc coming soon
+      class Step < NfgUi::Components::Elements::NavItem
+        include Bootstrap::Utilities::Activatable
+
+        include NfgUi::Components::Utilities::Iconable
+
+        include NfgUi::Components::Traits::Step
+
+        def component_family
+          :steps
+        end
+
+        def step
+          options.fetch(:step, nil)
+        end
+
+        def visited
+          options.fetch(:visited, false)
+        end
+
+        def disabled
+          options[:disabled] || (!visited && !active)
+        end
+
+        def render
+          content_tag(as, html_options) do
+            NfgUi::Components::Elements::StepIndicator.new({ step: step.to_s, body: (block_given? ? yield : body), icon: icon, href: href, disabled: disabled }, view_context).render
+          end
+        end
+
+        private
+
+        def base_element
+          as
+        end
+
+        def css_classes
+          [
+            super,
+            ('visited' if visited)
+          ].join(' ').squish
+        end
+
+        def non_html_attribute_options
+          super.push(:visited, :step)
+        end
+      end
+    end
+  end
+end

data/lib/nfg_ui/components/elements/step_indicator.rb

@@ -0,0 +1,41 @@
+# frozen_string_literal: true
+
+module NfgUi
+  module Components
+    module Elements
+      # Step doc coming soon
+      class StepIndicator < NfgUi::Components::Elements::NavLink
+        def component_family
+          :steps
+        end
+
+        def href
+          options.fetch(:href, '#')
+        end
+
+        def step
+          options.fetch(:step, nil)
+        end
+
+        def render
+          content_tag(:a, html_options) do
+            concat(content_tag(:div, class: 'step-indicator') {
+              if icon
+                NfgUi::Components::Foundations::Icon.new({ traits: [icon,] }, view_context).render
+              else
+                step
+              end
+            })
+            concat(NfgUi::Components::Foundations::Typeface.new({ traits: [:muted], caption: (block_given? ? yield : body), class: 'mt-1 mb-0 step-text' }, view_context).render)
+          end
+        end
+
+        private
+
+        def non_html_attribute_options
+          super.push(:step)
+        end
+      end
+    end
+  end
+end

data/lib/nfg_ui/components/elements/tab_pane.rb

@@ -0,0 +1,15 @@
+# frozen_string_literal: true
+
+module NfgUi
+  module Components
+    module Elements
+      class TabPane < NfgUi::Bootstrap::Components::TabPane
+        include NfgUi::Components::Utilities::Traitable
+        include NfgUi::Components::Utilities::Describable
+        include NfgUi::Components::Utilities::Renderable
+
+        include NfgUi::Components::Traits::Active
+      end
+    end
+  end
+end

data/lib/nfg_ui/components/elements/table.rb

@@ -0,0 +1,14 @@
+# frozen_string_literal: true
+
+module NfgUi
+  module Components
+    module Elements
+      # Table doc coming soon
+      class Table < NfgUi::Bootstrap::Components::Table
+        include NfgUi::Components::Utilities::Traitable
+        include NfgUi::Components::Utilities::Describable
+        include NfgUi::Components::Utilities::Renderable
+      end
+    end
+  end
+end

data/lib/nfg_ui/components/elements/task.rb

@@ -0,0 +1,11 @@
+# frozen_string_literal: true
+
+module NfgUi
+  module Components
+    module Elements
+      # Task doc coming soon
+      class Task < NfgUi::Components::Base
+      end
+    end
+  end
+end

data/lib/nfg_ui/components/elements.rb

@@ -0,0 +1,58 @@
+# frozen_string_literal: true
+
+module NfgUi
+  module Components
+    # This is the authoritative document for 'Elements'
+    module Elements
+      require_relative 'elements/activity'
+      require_relative 'elements/alert'
+      require_relative 'elements/badge'
+      require_relative 'elements/breadcrumb'
+      require_relative 'elements/breadcrumb_item'
+      require_relative 'elements/button'
+      require_relative 'elements/card_body'
+      require_relative 'elements/card_footer'
+      require_relative 'elements/card_header'
+      require_relative 'elements/card_image'
+      require_relative 'elements/card_image_overlay'
+      require_relative 'elements/carousel_caption'
+      require_relative 'elements/carousel_control'
+      require_relative 'elements/carousel_indicators'
+      require_relative 'elements/carousel_item'
+      require_relative 'elements/chart'
+      require_relative 'elements/dropdown_divider'
+      require_relative 'elements/dropdown_header'
+      require_relative 'elements/dropdown_item'
+      require_relative 'elements/dropdown_toggle'
+      require_relative 'elements/embed'
+      require_relative 'elements/form_control'
+      require_relative 'elements/input_group'
+      require_relative 'elements/key'
+      require_relative 'elements/list_group_item'
+      require_relative 'elements/loader'
+      require_relative 'elements/media_body'
+      require_relative 'elements/media_object'
+      require_relative 'elements/modal_body'
+      require_relative 'elements/modal_footer'
+      require_relative 'elements/modal_header'
+      require_relative 'elements/nav'
+      require_relative 'elements/nav_item'
+      require_relative 'elements/nav_link'
+      require_relative 'elements/navbar_brand'
+      require_relative 'elements/navbar_text'
+      require_relative 'elements/navbar_toggler'
+      require_relative 'elements/page_item'
+      require_relative 'elements/popover'
+      require_relative 'elements/progress_bar'
+      require_relative 'elements/slat_action'
+      require_relative 'elements/slat_body'
+      require_relative 'elements/slat_item'
+      require_relative 'elements/stat'
+      require_relative 'elements/step'
+      require_relative 'elements/step_indicator'
+      require_relative 'elements/tab_pane'
+      require_relative 'elements/table'
+      require_relative 'elements/task'
+    end
+  end
+end

data/lib/nfg_ui/components/foundations/color.rb

@@ -0,0 +1,11 @@
+# frozen_string_literal: true
+
+module NfgUi
+  module Components
+    module Foundations
+      # Color doc coming soon
+      class Color < NfgUi::Components::Base
+      end
+    end
+  end
+end

data/lib/nfg_ui/components/foundations/grid.rb

@@ -0,0 +1,11 @@
+# frozen_string_literal: true
+
+module NfgUi
+  module Components
+    module Foundations
+      # Grid doc coming soon
+      class Grid < NfgUi::Components::Base
+      end
+    end
+  end
+end

data/lib/nfg_ui/components/foundations/icon.rb

@@ -0,0 +1,82 @@
+# frozen_string_literal: true
+
+module NfgUi
+  module Components
+    module Foundations
+      # Icon doc coming soon
+      # Implementation and usage is designed to mimic the font_awesome_rails gem
+      #
+      # Example usage:
+      # = ui.nfg :icon, 'rocket', :right, text: 'Example text with icon on the right'
+      class Icon < NfgUi::Components::Base
+        include Bootstrap::Utilities::Themeable
+        include Bootstrap::Utilities::Tooltipable
+
+        include NfgUi::Components::Traits::Icon
+        include NfgUi::Components::Traits::Muted
+        include NfgUi::Components::Traits::Theme
+        include NfgUi::Components::Traits::Alignment
+
+        # Officially declare the icon spacer classes
+        # so that other iconable components that have more than one icon
+        # e.g.: :left_icon & :icon can use the spacer class manually
+        LEFT_ICON_SPACER_CSS_CLASS  = 'mr-1'
+        RIGHT_ICON_SPACER_CSS_CLASS = 'ml-1'
+
+        def render
+          view_context.fa_icon icon, **html_options, text: text, right: right
+        end
+
+        def icon
+          options[:icon] || (traits.slice!(0).to_s if traits.first.is_a?(String))
+        end
+
+        def text
+          options.fetch(:text, nil)
+        end
+
+        def right
+          options.fetch(:right, false)
+        end
+
+        private
+
+        def css_classes
+          return super unless update_css_classes?
+          [
+            super,
+            (NfgUi::Components::Foundations::Icon::LEFT_ICON_SPACER_CSS_CLASS unless right),
+            (NfgUi::Components::Foundations::Icon::RIGHT_ICON_SPACER_CSS_CLASS if right)
+          ].join(' ').squish
+        end
+
+        def theme_css_class_prefix
+          'text-'
+        end
+
+        def component_css_class
+          ''
+        end
+
+        def default_theme
+          nil
+        end
+
+        def non_html_attribute_options
+          super.push(:right, :text, :icon)
+        end
+
+        def outlineable?
+          false
+        end
+
+        # Several components need to utilize the icon with a spacer css class
+        # where text is supplied in the #render, and not passed to the icon
+        # thus, icons with :right trait are allowed through
+        def update_css_classes?
+          text || right
+        end
+      end
+    end
+  end
+end

data/lib/nfg_ui/components/foundations/image.rb

@@ -0,0 +1,14 @@
+# frozen_string_literal: true
+
+module NfgUi
+  module Components
+    module Foundations
+      # Image doc coming soon
+      class Image < NfgUi::Components::Base
+        def render
+          content_tag(:img, html_options) {}
+        end
+      end
+    end
+  end
+end

data/lib/nfg_ui/components/foundations/input.rb

@@ -0,0 +1,11 @@
+# frozen_string_literal: true
+
+module NfgUi
+  module Components
+    module Foundations
+      # Input doc coming soon
+      class Input < NfgUi::Components::Base
+      end
+    end
+  end
+end

data/lib/nfg_ui/components/foundations/typeface.rb

@@ -0,0 +1,122 @@
+# frozen_string_literal: true
+
+module NfgUi
+  module Components
+    module Foundations
+      # Typeface doc coming soon
+      class Typeface < NfgUi::Components::Base
+        include Bootstrap::Utilities::Wrappable
+        include Bootstrap::Utilities::Themeable
+        include Bootstrap::Utilities::Tooltipable
+
+        include NfgUi::Components::Utilities::Iconable
+        include NfgUi::Components::Utilities::Titleable
+
+        include NfgUi::Components::Traits::Muted
+        include NfgUi::Components::Traits::Theme
+        include NfgUi::Components::Traits::Typeface
+
+        def render
+          super do
+            if icon
+              NfgUi::Components::Foundations::Icon.new({ icon: icon, text: body }, view_context).render
+            else
+              body
+            end
+          end
+        end
+
+        def as
+          if heading
+            heading_tag
+          elsif subheading
+            subheading_tag
+          elsif title
+            title_tag
+          elsif caption
+            caption_tag
+          else
+            super
+          end
+        end
+
+        def heading
+          options.fetch(:heading, nil)
+        end
+
+        def subheading
+          options.fetch(:subheading, nil)
+        end
+
+        def caption
+          options.fetch(:caption, nil)
+        end
+
+        def body
+          super || heading || title || caption || subheading
+        end
+
+        # def text_or_icon
+        #   icon ? view_context.ui.nfg(:icon, icon, text: text) : text
+        # end
+
+        private
+
+        def base_element
+          as
+        end
+
+        def theme_css_class_prefix
+          'text-'
+        end
+
+        def css_classes
+          [
+            super,
+            ('font-size-sm' if caption)
+          ].join(' ').squish
+        end
+
+        def default_theme
+          nil
+        end
+
+        def component_css_class
+          ''
+        end
+
+        def non_html_attribute_options
+          super.push(:heading, :body, :title, :caption, :subheading)
+        end
+
+        def caption_tag
+          :p
+        end
+
+        def body_tag
+          :p
+        end
+
+        def heading_tag
+          :h5
+        end
+
+        def title_tag
+          :h6
+        end
+
+        def subheading_tag
+          :h6
+        end
+
+        def default_html_wrapper_element
+          body_tag
+        end
+
+        def outlineable?
+          false
+        end
+      end
+    end
+  end
+end

data/lib/nfg_ui/components/patterns/activity_feed.rb

@@ -0,0 +1,11 @@
+# frozen_string_literal: true
+
+module NfgUi
+  module Components
+    module Patterns
+      # ActivityFeed doc coming soon
+      class ActivityFeed < NfgUi::Components::Base
+      end
+    end
+  end
+end

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

@@ -0,0 +1,23 @@
+# frozen_string_literal: true
+
+module NfgUi
+  module Components
+    module Patterns
+      # Button Group doesn't have any customizations unique to the design system yet
+      # As such, the NFG UI button group is simply a bootstrap button group behind the scenes.
+      # Traits will eventually be connected here.
+      class ButtonGroup < NfgUi::Bootstrap::Components::ButtonGroup
+        include NfgUi::Components::Utilities::Traitable
+        include NfgUi::Components::Utilities::Describable
+        include NfgUi::Components::Utilities::Renderable
+
+        include NfgUi::Components::Traits::Size
+        include NfgUi::Components::Traits::Vertical
+
+        # TODO It's not clear to me whether the traits listed above actually do anything
+        # I think the note above implies that they don't, but then why include them? If they don't
+        # actually do anything yet, they should be removed, or at least commented out
+      end
+    end
+  end
+end

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

@@ -0,0 +1,20 @@
+# frozen_string_literal: true
+
+module NfgUi
+  module Components
+    module Patterns
+      # Button Toolbar doesn't have any customizations unique to the design system yet
+      # As such, the NFG UI button group is simply a bootstrap button group behind the scenes.
+      # Traits will eventually be connected here.
+      class ButtonToolbar < NfgUi::Bootstrap::Components::ButtonToolbar
+        include NfgUi::Components::Utilities::Traitable
+        include NfgUi::Components::Utilities::Describable
+        include NfgUi::Components::Utilities::Renderable
+
+        # TODO It's not clear to me whether the traits listed above actually do anything
+        # I think the note above implies that they don't, but then why include them? If they don't
+        # actually do anything yet, they should be removed, or at least commented out
+      end
+    end
+  end
+end

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

@@ -0,0 +1,39 @@
+# frozen_string_literal: true
+
+module NfgUi
+  module Components
+    module Patterns
+      # Card doesn't have any customizations unique to the design system yet
+      # As such, the NFG UI card is simply a bootstrap card behind the scenes.
+      # Traits will eventually be connected here.
+      class Card < NfgUi::Bootstrap::Components::Card
+        include NfgUi::Components::Utilities::Traitable
+        include NfgUi::Components::Utilities::Describable
+        include NfgUi::Components::Utilities::Renderable
+
+        include NfgUi::Components::Traits::Theme
+
+        # TODO: Confirm that the image overlays are correct. The tops are not being rounded. Should they be?
+        def render
+          if render_in_body
+            super
+          else
+            content_tag(:div, html_options) do
+              body
+            end
+          end
+        end
+
+        def render_in_body
+          options.fetch(:render_in_body, true)
+        end
+
+        private
+
+        def non_html_attribute_options
+          super.push(:render_in_body)
+        end
+      end
+    end
+  end
+end

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

@@ -0,0 +1,31 @@
+# frozen_string_literal: true
+
+module NfgUi
+  module Components
+    module Patterns
+      # Carousel doesn't have any customizations unique to the design system yet
+      # As such, the NFG UI carousel is simply a bootstrap carousel behind the scenes.
+      # Traits will eventually be connected here.
+      class Carousel < NfgUi::Bootstrap::Components::Carousel
+        include NfgUi::Components::Utilities::Traitable
+        include NfgUi::Components::Utilities::Describable
+        include NfgUi::Components::Utilities::Renderable
+
+        def render
+          content_tag(:div, html_options) do
+            content_tag(:div, class: 'carousel-inner pb-3') do
+              concat((block_given? ? yield : body))
+              if controls
+                concat(NfgUi::Components::Elements::CarouselControl.new({ control: :next, carousel: "##{id}" }, view_context).render)
+                concat(NfgUi::Components::Elements::CarouselControl.new({ control: :prev, carousel: "##{id}" }, view_context).render)
+              end
+              if indicators > 0
+                concat(NfgUi::Components::Elements::CarouselIndicators.new({ count: indicators, carousel: "##{id}" }, view_context).render)
+              end
+            end
+          end
+        end
+      end
+    end
+  end
+end