Class: Maglev::Uikit::List::ListItemComponent

Inherits:
BaseComponent
  • Object
show all
Defined in:
app/components/maglev/uikit/list/list_item_component.rb

Instance Attribute Summary collapse

Instance Method Summary collapse

Methods inherited from BaseComponent

#button_class_names

Constructor Details

#initialize(id: nil, link: nil, options: {}) ⇒ ListItemComponent

Returns a new instance of ListItemComponent.



18
19
20
21
22
23
24
25
26
 
# File 'app/components/maglev/uikit/list/list_item_component.rb', line 18

def initialize(id: nil, link: nil, options: {})
  @id = id
  @link = link
  @variant = options.fetch(:variant, :filled).to_sym
  @custom_wrapper_classes = options[:wrapper_classes]
  @wrapper_tag_name = options[:wrapper_tag] || :div
  @index = options[:index]
  @options = options
end

Instance Attribute Details

#index ⇒ Object (readonly)

Returns the value of attribute index.



16
17
18
 
# File 'app/components/maglev/uikit/list/list_item_component.rb', line 16

def index
  @index
end

#link ⇒ Object (readonly)

Returns the value of attribute link.



16
17
18
 
# File 'app/components/maglev/uikit/list/list_item_component.rb', line 16

def link
  @link
end

#options ⇒ Object (readonly)

Returns the value of attribute options.



16
17
18
 
# File 'app/components/maglev/uikit/list/list_item_component.rb', line 16

def options
  @options
end

#variant ⇒ Object (readonly)

Returns the value of attribute variant.



16
17
18
 
# File 'app/components/maglev/uikit/list/list_item_component.rb', line 16

def variant
  @variant
end

#wrapper_tag_name ⇒ Object (readonly)

Returns the value of attribute wrapper_tag_name.



16
17
18
 
# File 'app/components/maglev/uikit/list/list_item_component.rb', line 16

def wrapper_tag_name
  @wrapper_tag_name
end

Instance Method Details

#big_image_classes ⇒ Object 



79
80
81
82
83
 
# File 'app/components/maglev/uikit/list/list_item_component.rb', line 79

def big_image_classes(...)
  class_variants(
    base: 'w-full'
  ).render(...)
end

#content_classes ⇒ Object

rubocop:enable Metrics/MethodLength



60
61
62
63
64
65
66
67
68
69
70
71
 
# File 'app/components/maglev/uikit/list/list_item_component.rb', line 60

def content_classes
  class_variants(
    base: 'flex flex-1 gap-3 overflow-hidden',
    variants: {
      disposition: {
        row: 'flex-row items-center px-2',
        col: 'flex-col'
      }
    },
    default: { disposition: :col }
  ).render(disposition: big_image? ? :col : :row)
end

#id ⇒ Object 



28
29
30
 
# File 'app/components/maglev/uikit/list/list_item_component.rb', line 28

def id
  @id || SecureRandom.uuid
end

#image_classes ⇒ Object 



73
74
75
76
77
 
# File 'app/components/maglev/uikit/list/list_item_component.rb', line 73

def image_classes(...)
  class_variants(
    base: 'object-cover w-full h-full'
  ).render(...)
end

#link? ⇒ Boolean

Returns:

  • (Boolean) 


32
33
34
 
# File 'app/components/maglev/uikit/list/list_item_component.rb', line 32

def link?
  link.present?
end

#link_data ⇒ Object 



40
41
42
 
# File 'app/components/maglev/uikit/list/list_item_component.rb', line 40

def link_data
  link[:data] || {}
end

#link_url ⇒ Object 



36
37
38
 
# File 'app/components/maglev/uikit/list/list_item_component.rb', line 36

def link_url
  link[:url]
end

#sortable_handle ⇒ Object 



93
94
95
 
# File 'app/components/maglev/uikit/list/list_item_component.rb', line 93

def sortable_handle
  sortable_scope.present? ? "handle-#{sortable_scope}" : 'handle'
end

#sortable_scope ⇒ Object 



85
86
87
 
# File 'app/components/maglev/uikit/list/list_item_component.rb', line 85

def sortable_scope
  options[:sortable_scope]
end

#sortable_target ⇒ Object 



89
90
91
 
# File 'app/components/maglev/uikit/list/list_item_component.rb', line 89

def sortable_target
  sortable_scope.present? ? "item-#{sortable_scope}" : 'item'
end

#wrapper_classes ⇒ Object

rubocop:disable Metrics/MethodLength



45
46
47
48
49
50
51
52
53
54
55
56
57
 
# File 'app/components/maglev/uikit/list/list_item_component.rb', line 45

def wrapper_classes
  class_variants(
    base: 'rounded-md flex text-gray-800',
    variants: {
      variant: {
        filled: 'bg-gray-100',
        ghost: 'hover:bg-gray-50 transition-colors duration-200'
      },
      padding: { default: 'p-2', medium: 'p-3' }
    },
    default: { variant: :filled, padding: :default }
  ).render(variant: variant, padding: big_image? ? :medium : :default, class: @custom_wrapper_classes)
end