Class: NfgUi::Components::Foundations::Icon

Inherits:
Base show all
Includes:
Bootstrap::Utilities::Themeable, Bootstrap::Utilities::Tooltipable, Traits::Alignment, Traits::Icon, Traits::Muted, Traits::Theme
Defined in:
lib/nfg_ui/components/foundations/icon.rb

Overview

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’

Constant Summary collapse

LEFT_ICON_SPACER_CSS_CLASS =

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

'mr-1'
RIGHT_ICON_SPACER_CSS_CLASS =
'ml-1'

Constants included from Traits::Alignment

Traits::Alignment::TRAITS

Constants included from Traits::Theme

Traits::Theme::COLOR_TRAITS, Traits::Theme::TRAITS

Constants included from Traits::Muted

Traits::Muted::TRAITS

Constants included from Traits::Icon

Traits::Icon::TRAITS

Constants included from Traits

Traits::REGISTERED_TRAITS, Traits::TRAIT_MODULES

Instance Attribute Summary

Attributes included from Bootstrap::Utilities::Disableable

#as

Attributes inherited from Bootstrap::Components::Base

#body, #options, #view_context

Instance Method Summary collapse

Methods included from Traits::Alignment

#center_trait, #left_trait, #right_trait

Methods included from Traits::Theme

#danger_trait, #dark_trait, #info_trait, #light_trait, #outlined_trait, #primary_trait, #secondary_trait, #success_trait, #warning_trait, #white_trait

Methods included from Traits::Muted

#muted_trait

Methods included from Traits::Icon

#loader_trait, #tip_trait

Methods included from Bootstrap::Utilities::Tooltipable

#data, #disabled_component_tooltip_wrapper_html_options, #html_options, #tooltip

Methods included from Bootstrap::Utilities::Disableable

#disabled

Methods included from Bootstrap::Utilities::Themeable

#outlined, #theme

Methods included from Utilities::Traitable

#traits, #utility_initialize

Methods included from Utilities::Renderable

#render_if, #render_unless

Methods included from Utilities::Describable

#data, #describe

Methods inherited from Bootstrap::Components::Base

#component_family, #data, #href, #html_options, #id, #initialize, #style

Constructor Details

This class inherits a constructor from NfgUi::Bootstrap::Components::Base

Instance Method Details

#iconObject

Utilize a trait or ‘:icon` within options. When setting the icon as a trait, you must pass in a string. If a symbol is detected, the component assumes it’s a registered trait

Example usage as a trait:

ui.nfg :icon, ‘heart’

Example usage as an option:

ui.nfg :icon, icon: ‘heart’

This is useful in syncing up the ability to pass in ‘:icon` to components that accept `:icon` in options and automatically render an icon.



38
39
40
# File 'lib/nfg_ui/components/foundations/icon.rb', line 38

def icon
  options[:icon] || (traits.slice!(0).to_s if traits.first.is_a?(String))
end

#renderObject

Outputs a Font Awesome icon using the #fa_icon method.



43
44
45
# File 'lib/nfg_ui/components/foundations/icon.rb', line 43

def render
  view_context.fa_icon icon, **html_options, text: text, right: right
end

#rightObject

Tap into the font_awesome_rails :right method to place the icon on the right side of the text. This also automatically adds the right side css spacer class to the icon <i> tag.



50
51
52
# File 'lib/nfg_ui/components/foundations/icon.rb', line 50

def right
  options.fetch(:right, false)
end

#textObject

Tap into the font_awesome_rails :text method to insert text into the rendered component.



56
57
58
# File 'lib/nfg_ui/components/foundations/icon.rb', line 56

def text
  options.fetch(:text, nil)
end