Class: Fluxbit::TabComponent

Inherits:
Component
  • Object
show all
Includes:
Config::TabComponent
Defined in:
app/components/fluxbit/tab_component.rb

Constant Summary

Constants inherited from Component

Component::ComponentObj

Instance Attribute Summary collapse

Instance Method Summary collapse

Methods inherited from Component

#add, #add_popover_or_tooltip, #anyicon, #element_name, #fx_id, #icon, #options, #popover?, #random_id, #remove_class, #remove_class_from_props, #render_popover_or_tooltip, #target, #tooltip?

Methods included from IconHelpers

#chevron_double_left, #chevron_double_right, #chevron_down, #chevron_left, #chevron_right, #chevron_up, #close_icon, #ellipsis_horizontal, #eye_icon, #eye_slash_icon, #plus_icon

Constructor Details

#initialize(**props) ⇒ TabComponent

Initializes the Tab component with the given properties.

Parameters:

  • props (Hash) —

    The properties to customize the Tab component.

Options Hash (**props):

  • :variant (Symbol) — default: :default —

    The variant style (:default, :underline, :pills, :full_width).

  • :color (Symbol) — default: :blue —

    The color theme for active tabs.

  • :vertical (Boolean) — default: false —

    Whether tabs should be displayed vertically.

  • :tab_panel (Symbol) — default: :default —

    The style for tab panels (:default, :none).

  • :align (Symbol) — default: :left —

    Horizontal alignment of tabs (:left, :center, :right). Only applies to horizontal tabs.

  • :ul_html (Hash) — default: {} —

    HTML attributes to apply to the ul element.

  • **props (Hash) —

    Remaining options declared as HTML attributes, applied to the tab container.



26
27
28
29
30
31
32
33
34
35
36
37
 
# File 'app/components/fluxbit/tab_component.rb', line 26

def initialize(**props)
  @variant = (props.delete(:variant) || @@variant).to_sym
  @color = props.delete(:color) || @@color
  @vertical = props.delete(:vertical) || @@vertical
  @tab_panel = (props.delete(:tab_panel) || @@tab_panel).to_sym
  @align = (props.delete(:align) || @@align).to_sym
  @tabs_group = []
  @ul_html = props.delete(:ul_html) || {}
  @props = props
  @vertical = false if @variant == :full_width
  super
end

Instance Attribute Details

#lazy_load ⇒ Object (readonly)

Returns the value of attribute lazy_load.



6
7
8
 
# File 'app/components/fluxbit/tab_component.rb', line 6

def lazy_load
  @lazy_load
end

#variant ⇒ Object (readonly)

Returns the value of attribute variant.



6
7
8
 
# File 'app/components/fluxbit/tab_component.rb', line 6

def variant
  @variant
end

Instance Method Details

#call ⇒ Object 



39
40
41
42
43
44
45
46
47
48
49
50
51
52
 
# File 'app/components/fluxbit/tab_component.rb', line 39

def call
  tabs
  @has_panels = @tabs_group.map(&:content).compact.present?
  add class: styles[:div][@vertical ? :vertical : :horizontal], to: @props, first_element: true

  if @has_panels
    tag.div(**@props) do
      concat(render_tab_list)
      concat(render_tab_panels)
    end
  else
    concat(render_tab_list)
  end
end