Class: Maglev::Uikit::TabsComponent
- Inherits:
-
BaseComponent
- Object
- ViewComponent::Base
- BaseComponent
- Maglev::Uikit::TabsComponent
- Defined in:
- app/components/maglev/uikit/tabs_component.rb
Defined Under Namespace
Classes: Tab
Instance Attribute Summary collapse
-
#active_tab ⇒ Object
readonly
Returns the value of attribute active_tab.
-
#active_tab_index ⇒ Object
readonly
Returns the value of attribute active_tab_index.
-
#container_classes ⇒ Object
readonly
Returns the value of attribute container_classes.
-
#disable_inputs ⇒ Object
readonly
Returns the value of attribute disable_inputs.
-
#variant ⇒ Object
readonly
Returns the value of attribute variant.
Instance Method Summary collapse
- #before_render ⇒ Object
- #default_label_classes ⇒ Object
- #disable_inputs? ⇒ Boolean
-
#initialize(container_classes: nil, active_tab_index: nil, disable_inputs: false, variant: :default) ⇒ TabsComponent
constructor
disable_inputs: true | false (default: false) if true, the inputs of hidden tabs will not be submitted.
- #label_classes ⇒ Object
- #pills_label_classes ⇒ Object
Methods inherited from BaseComponent
Constructor Details
#initialize(container_classes: nil, active_tab_index: nil, disable_inputs: false, variant: :default) ⇒ TabsComponent
disable_inputs: true | false (default: false) if true, the inputs of hidden tabs will not be submitted
13 14 15 16 17 18 |
# File 'app/components/maglev/uikit/tabs_component.rb', line 13 def initialize(container_classes: nil, active_tab_index: nil, disable_inputs: false, variant: :default) @container_classes = container_classes @active_tab_index = active_tab_index @disable_inputs = disable_inputs @variant = variant end |
Instance Attribute Details
#active_tab ⇒ Object (readonly)
Returns the value of attribute active_tab.
10 11 12 |
# File 'app/components/maglev/uikit/tabs_component.rb', line 10 def active_tab @active_tab end |
#active_tab_index ⇒ Object (readonly)
Returns the value of attribute active_tab_index.
10 11 12 |
# File 'app/components/maglev/uikit/tabs_component.rb', line 10 def active_tab_index @active_tab_index end |
#container_classes ⇒ Object (readonly)
Returns the value of attribute container_classes.
10 11 12 |
# File 'app/components/maglev/uikit/tabs_component.rb', line 10 def container_classes @container_classes end |
#disable_inputs ⇒ Object (readonly)
Returns the value of attribute disable_inputs.
10 11 12 |
# File 'app/components/maglev/uikit/tabs_component.rb', line 10 def disable_inputs @disable_inputs end |
#variant ⇒ Object (readonly)
Returns the value of attribute variant.
10 11 12 |
# File 'app/components/maglev/uikit/tabs_component.rb', line 10 def variant @variant end |
Instance Method Details
#before_render ⇒ Object
47 48 49 50 51 52 53 54 |
# File 'app/components/maglev/uikit/tabs_component.rb', line 47 def before_render @active_tab = tabs.find(&:active?) return unless !@active_tab && active_tab_index != -1 @active_tab = tabs[active_tab_index.to_i] @active_tab&.active = true end |
#default_label_classes ⇒ Object
24 25 26 27 28 29 30 31 32 33 34 35 |
# File 'app/components/maglev/uikit/tabs_component.rb', line 24 def default_label_classes(...) class_variants( base: %( relative py-1 pb-0 px-4 block focus:outline-none border-b-2 z-10 font-medium hover:text-editor-primary ), variants: { active: 'text-editor-primary border-editor-primary', '!active': 'text-gray-500 border-transparent' } ).render(...) end |
#disable_inputs? ⇒ Boolean
56 57 58 |
# File 'app/components/maglev/uikit/tabs_component.rb', line 56 def disable_inputs? @disable_inputs end |
#label_classes ⇒ Object
20 21 22 |
# File 'app/components/maglev/uikit/tabs_component.rb', line 20 def label_classes(...) variant == :pills ? pills_label_classes(...) : default_label_classes(...) end |
#pills_label_classes ⇒ Object
37 38 39 40 41 42 43 44 45 |
# File 'app/components/maglev/uikit/tabs_component.rb', line 37 def pills_label_classes(...) class_variants( base: %(rounded-md px-3 py-2 text-sm), variants: { active: 'rounded-md bg-editor-primary/10 font-semibold text-editor-primary', '!active': 'text-gray-500 hover:text-gray-700 font-medium' } ).render(...) end |