Class: SdrViewComponents::Elements::Tabs::TabListComponent

Inherits:
BaseComponent
  • Object
show all
Defined in:
app/components/sdr_view_components/elements/tabs/tab_list_component.rb

Overview

Component for rendering a list of tabs in a tabbed interface.

Constant Summary collapse

BREAKPOINTS =
%i[sm md lg xl xxl].freeze

Instance Method Summary collapse

Methods inherited from BaseComponent

#args_for, #mark_label_required, #merge_actions, #merge_classes

Constructor Details

#initialize(classes: [], content_classes: [], variant: :default, collapse_below: nil) ⇒ TabListComponent

Returns a new instance of TabListComponent.

Parameters:

  • classes (Array<String>, String) (defaults to: [])

    additional classes for the tab list.

  • content_classes (Array<String>, String) (defaults to: [])

    additional classes for the tab content container.

  • variant (Symbol) (defaults to: :default)

    the visual style of the tabs (:default or :underline).

  • collapse_below (Symbol, nil) (defaults to: nil)

    if given, the tabs are replaced with a <select> below this Bootstrap breakpoint (one of :sm, :md, :lg, :xl, :xxl). The tabs remain fully functional (the <select> drives the same Bootstrap tab JavaScript) -- this only changes how they're presented at narrow viewports. Leave nil (the default) to always render the tabs.

Raises:

  • (ArgumentError)


22
23
24
25
26
27
28
29
30
31
32
33
34
# File 'app/components/sdr_view_components/elements/tabs/tab_list_component.rb', line 22

def initialize(classes: [], content_classes: [], variant: :default, collapse_below: nil)
  @classes = classes
  @content_classes = content_classes
  @variant = variant
  @collapse_below = collapse_below

  raise ArgumentError, "Invalid variant: #{variant}" unless %i[underline default].include?(variant)
  if collapse_below && BREAKPOINTS.exclude?(collapse_below)
    raise ArgumentError, "Invalid collapse_below: #{collapse_below}"
  end

  super()
end

Instance Method Details

#classesObject



40
41
42
# File 'app/components/sdr_view_components/elements/tabs/tab_list_component.rb', line 40

def classes
  merge_classes('nav', @classes, variant_classes, collapse_below? ? ['d-none', "d-#{@collapse_below}-flex"] : nil)
end

#collapse_below?Boolean

Returns:

  • (Boolean)


36
37
38
# File 'app/components/sdr_view_components/elements/tabs/tab_list_component.rb', line 36

def collapse_below?
  @collapse_below.present?
end

#content_classesObject



48
49
50
# File 'app/components/sdr_view_components/elements/tabs/tab_list_component.rb', line 48

def content_classes
  merge_classes('tab-content', @content_classes)
end

#select_classesObject



44
45
46
# File 'app/components/sdr_view_components/elements/tabs/tab_list_component.rb', line 44

def select_classes
  merge_classes('form-select', "d-#{@collapse_below}-none", @classes)
end