Class: BulmaPhlex::TabComponents::Tab

Inherits:
Base
  • Object
show all
Defined in:
lib/bulma_phlex/tab_components/tab.rb

Overview

Renders a single tab item within a BulmaPhlex::Tabs component.

Supports an optional icon and an active state. Can also be used standalone when you need to create or update a tab dynamically.

Class Method Summary collapse

Instance Method Summary collapse

Constructor Details

#initialize(id:, title:, icon:, active:, data_attributes_proc: BulmaPhlex::Tabs::StimulusDataAttributes.new("bulma-phlex--tabs").method(:for_tab)) ⇒ Tab

Returns a new instance of Tab.



22
23
24
25
26
27
28
29
 
# File 'lib/bulma_phlex/tab_components/tab.rb', line 22

def initialize(id:, title:, icon:, active:,
               data_attributes_proc: BulmaPhlex::Tabs::StimulusDataAttributes.new("bulma-phlex--tabs").method(:for_tab))
  @id = id
  @title = title
  @icon = icon
  @active = active
  @data_attributes_proc = data_attributes_proc
end

Class Method Details

.new(id:, title:, icon:, active:, data_attributes_proc: BulmaPhlex::Tabs::StimulusDataAttributes.new("bulma-phlex--tabs").method(:for_tab)) ⇒ Object

Parameters

  • ‘id` — Unique identifier for the tab

  • ‘title` — The text displayed on the tab

  • ‘icon` — Optional icon class to display on the tab (e.g. `“fas fa-cog”`)

  • ‘active` — If `true`, marks the tab as currently active

  • ‘data_attributes_proc` — A proc that generates data attributes for the tab



17
18
19
20
 
# File 'lib/bulma_phlex/tab_components/tab.rb', line 17

def self.new(id:, title:, icon:, active:,
             data_attributes_proc: BulmaPhlex::Tabs::StimulusDataAttributes.new("bulma-phlex--tabs").method(:for_tab))
  super
end

Instance Method Details

#view_template ⇒ Object 



31
32
33
34
35
36
37
38
39
40
41
42
 
# File 'lib/bulma_phlex/tab_components/tab.rb', line 31

def view_template(&)
  li(
    id: "#{@id}-tab",
    data: @data_attributes_proc.call(@id),
    class: @active ? "is-active" : ""
  ) do
    a do
      Icon(@icon, class: "mr-1") if @icon
      span { @title }
    end
  end
end