Class: Tramway::Form::CheckboxComponent

Inherits:
TailwindComponent show all
Defined in:
app/components/tramway/form/checkbox_component.rb

Overview

Tailwind-styled checkbox field

Constant Summary collapse

CHECKBOX_BUTTON_BASE_STYLES = 
{
  display: 'inline-flex',
  'align-items': 'center',
  'justify-content': 'center',
  padding: '0',
  'line-height': '1',
  'box-sizing': 'border-box'
}.freeze
CHECKBOX_BUTTON_SIZES = 
{
  small: '1rem',
  medium: '1.25rem',
  large: '1.5rem'
}.freeze

Constants inherited from TailwindComponent

TailwindComponent::SIZE_CLASSES

Constants included from Helpers::ViewsHelper

Helpers::ViewsHelper::FORM_SIZES

Instance Method Summary collapse

Methods included from Helpers::ViewsHelper

#tramway_back_button, #tramway_badge, #tramway_button, #tramway_cell, #tramway_chat, #tramway_container, #tramway_flash, #tramway_form_for, #tramway_header, #tramway_main_container, #tramway_row, #tramway_table, #tramway_title, #tramway_tooltip

Methods included from Helpers::ComponentHelper

#component

Methods included from Helpers::DecorateHelper

#tramway_decorate

Instance Method Details

#checkbox_button_classes ⇒ Object 



22
23
24
25
26
 
# File 'app/components/tramway/form/checkbox_component.rb', line 22

def checkbox_button_classes
  "peer #{size_class(:checkbox_input)} #{checkbox_base_classes} " \
    'data-[state=checked]:border-zinc-50 data-[state=checked]:bg-zinc-50 ' \
    'data-[state=checked]:text-zinc-950'
end

#checkbox_button_style ⇒ Object 



32
33
34
 
# File 'app/components/tramway/form/checkbox_component.rb', line 32

def checkbox_button_style
  checkbox_button_style_attributes.map { |key, value| "#{key}: #{value}" }.join('; ')
end

#checkbox_indicator_classes ⇒ Object 



28
29
30
 
# File 'app/components/tramway/form/checkbox_component.rb', line 28

def checkbox_indicator_classes
  "flex hidden #{size_class(:checkbox_indicator)} items-center justify-center text-current"
end

#checked? ⇒ Boolean

Returns:

  • (Boolean) 


36
37
38
 
# File 'app/components/tramway/form/checkbox_component.rb', line 36

def checked?
  !!ActiveModel::Type::Boolean.new.cast(options.fetch(:checked, value))
end

#hidden_checkbox_id ⇒ Object 



50
51
52
 
# File 'app/components/tramway/form/checkbox_component.rb', line 50

def hidden_checkbox_id
  "#{@for}_input"
end

#hidden_checkbox_options ⇒ Object 



40
41
42
43
44
45
46
47
48
 
# File 'app/components/tramway/form/checkbox_component.rb', line 40

def hidden_checkbox_options
  options.merge(
    id: hidden_checkbox_id,
    class: 'hidden',
    data: options.fetch(:data, {}).merge('ui--checkbox-target' => 'input'),
    tabindex: -1,
    aria: { hidden: true }
  )
end

#label_classes ⇒ Object 



54
55
56
57
58
59
60
61
62
63
64
65
66
67
 
# File 'app/components/tramway/form/checkbox_component.rb', line 54

def label_classes
  default_classes = 'cursor-pointer mb-0'

  case size
  when :small
    default_classes += ' text-sm leading-5'
  when :medium
    default_classes += ' text-base leading-6'
  when :large
    default_classes += ' text-lg leading-7'
  end

  default_classes
end

#label_style ⇒ Object 



69
70
71
72
73
74
75
 
# File 'app/components/tramway/form/checkbox_component.rb', line 69

def label_style
  {
    'align-self': 'center',
    'line-height': checkbox_button_size,
    'margin-bottom': '0'
  }.map { |key, value| "#{key}: #{value}" }.join('; ')
end