Class: TabGroupComponent

Inherits:
Component show all
Defined in:
app/components/tab_group_component.rb

Overview

TabGroup — wrapper for tab navigation with content panes.

Renders a <div data-controller=“fui-tab”> that wraps a Menu and Tab panes. The fui-tab Stimulus controller finds .item elements within and initializes Fomantic-UI’s $.fn.tab plugin for click-based switching.

Usage:

TabGroup {
  Menu(tabular: true, attached: "top") {
    MenuItem(active: true, tab: "first") { text "First" }
    MenuItem(tab: "second") { text "Second" }
  }
  Tab(active: true, path: "first", attached: true, segment: true) {
    text "First tab content"
  }
  Tab(path: "second", attached: true, segment: true) {
    text "Second tab content"
  }
}

Constant Summary

Constants inherited from Component

Component::HTML_OPTIONS

Instance Method Summary collapse

Methods inherited from Component

default, #initialize, #render_in, slot

Constructor Details

This class inherits a constructor from Component

Instance Method Details

#to_sObject



27
28
29
30
31
32
33
# File 'app/components/tab_group_component.rb', line 27

def to_s
  data = { controller: "fui-tab" }
  data[:fui_tab_history_value] = history if history
  data[:fui_tab_history_type_value] = history_type if history

  tag.div(**merge_html_options(data: data)) { @content }
end