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.



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

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.



18
19
20
 
# File 'app/components/maglev/uikit/list/list_item_component.rb', line 18

def index
  @index
end

#link ⇒ Object (readonly)

Returns the value of attribute link.



18
19
20
 
# File 'app/components/maglev/uikit/list/list_item_component.rb', line 18

def link
  @link
end

#options ⇒ Object (readonly)

Returns the value of attribute options.



18
19
20
 
# File 'app/components/maglev/uikit/list/list_item_component.rb', line 18

def options
  @options
end

#variant ⇒ Object (readonly)

Returns the value of attribute variant.



18
19
20
 
# File 'app/components/maglev/uikit/list/list_item_component.rb', line 18

def variant
  @variant
end

#wrapper_tag_name ⇒ Object (readonly)

Returns the value of attribute wrapper_tag_name.



18
19
20
 
# File 'app/components/maglev/uikit/list/list_item_component.rb', line 18

def wrapper_tag_name
  @wrapper_tag_name
end

Instance Method Details

#big_image_classes ⇒ Object 



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

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

#content_classes ⇒ Object

rubocop:enable Metrics/MethodLength



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

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 



30
31
32
 
# File 'app/components/maglev/uikit/list/list_item_component.rb', line 30

def id
  @id || SecureRandom.uuid
end

#image_classes ⇒ Object 



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

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

#link? ⇒ Boolean

Returns:

  • (Boolean) 


34
35
36
 
# File 'app/components/maglev/uikit/list/list_item_component.rb', line 34

def link?
  link.present?
end

#link_data ⇒ Object 



42
43
44
 
# File 'app/components/maglev/uikit/list/list_item_component.rb', line 42

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

#link_url ⇒ Object 



38
39
40
 
# File 'app/components/maglev/uikit/list/list_item_component.rb', line 38

def link_url
  link[:url]
end

#sortable_handle ⇒ Object 



95
96
97
 
# File 'app/components/maglev/uikit/list/list_item_component.rb', line 95

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

#sortable_scope ⇒ Object 



87
88
89
 
# File 'app/components/maglev/uikit/list/list_item_component.rb', line 87

def sortable_scope
  options[:sortable_scope]
end

#sortable_target ⇒ Object 



91
92
93
 
# File 'app/components/maglev/uikit/list/list_item_component.rb', line 91

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

#wrapper_classes ⇒ Object

rubocop:disable Metrics/MethodLength



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

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