Class: BetterUi::General::Button::Component

Inherits:
ViewComponent::Base
  • Object
show all
Defined in:
app/components/better_ui/general/button/component.rb

Constant Summary collapse

BUTTON_BASE_CLASSES =

Classi base sempre presenti

"inline-flex items-center justify-center font-medium transition-colors duration-200 focus:outline-none focus:ring-2 focus:ring-offset-2"
BUTTON_THEME =

Temi di bottoni con classi Tailwind dirette

{
  default: "bg-black text-white hover:bg-gray-900 focus:ring-gray-900",
  white: "bg-white text-black border border-gray-300 hover:bg-gray-50 focus:ring-gray-400",
  red: "bg-red-500 text-white hover:bg-red-600 focus:ring-red-500",
  rose: "bg-rose-500 text-white hover:bg-rose-600 focus:ring-rose-500",
  orange: "bg-orange-500 text-white hover:bg-orange-600 focus:ring-orange-500",
  green: "bg-green-500 text-white hover:bg-green-600 focus:ring-green-500",
  blue: "bg-blue-500 text-white hover:bg-blue-600 focus:ring-blue-500",
  yellow: "bg-yellow-500 text-black hover:bg-yellow-600 focus:ring-yellow-500",
  violet: "bg-violet-500 text-white hover:bg-violet-600 focus:ring-violet-500",
  purple: "bg-purple-500 text-white hover:bg-purple-600 focus:ring-purple-500"
}
BUTTON_SIZES =

Dimensioni con classi Tailwind dirette

{
  small: "px-2.5 py-1.5 text-xs",
  medium: "px-4 py-2 text-sm",
  large: "px-6 py-3 text-base"
}
BUTTON_RADIUS =

Border radius con classi Tailwind dirette

{
  none: "rounded-none",
  small: "rounded-md",
  medium: "rounded-lg",
  large: "rounded-xl",
  full: "rounded-full"
}

Instance Attribute Summary collapse

Instance Method Summary collapse

Constructor Details

#initialize(text: nil, theme: :white, size: :medium, full_width: false, disabled: false, icon: nil, icon_position: :left, href: nil, method: nil, data: {}, classes: nil, id: nil, rounded: :medium, button_type: :button, **html_options) ⇒ Component

Inizializzazione del componente



42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
 
# File 'app/components/better_ui/general/button/component.rb', line 42

def initialize(
  text: nil,
  theme: :white,
  size: :medium,
  full_width: false,
  disabled: false,
  icon: nil,
  icon_position: :left,
  href: nil,
  method: nil,
  data: {},
  classes: nil,
  id: nil,
  rounded: :medium,
  button_type: :button,
  **html_options
)
  @text = text
  @theme = theme.to_sym
  @size = size.to_sym
  @full_width = full_width
  @disabled = disabled
  @icon = icon
  @icon_position = icon_position.to_sym
  @href = href
  @method = method
  @data = data
  @classes = classes
  @id = id
  @rounded = rounded.to_sym
  @button_type = button_type.to_sym
  @html_options = html_options

  validate_params
end

Instance Attribute Details

#button_type ⇒ Object (readonly)

Returns the value of attribute button_type.



5
6
7
 
# File 'app/components/better_ui/general/button/component.rb', line 5

def button_type
  @button_type
end

#classes ⇒ Object (readonly)

Returns the value of attribute classes.



5
6
7
 
# File 'app/components/better_ui/general/button/component.rb', line 5

def classes
  @classes
end

#data ⇒ Object (readonly)

Returns the value of attribute data.



5
6
7
 
# File 'app/components/better_ui/general/button/component.rb', line 5

def data
  @data
end

#disabled ⇒ Object (readonly)

Returns the value of attribute disabled.



5
6
7
 
# File 'app/components/better_ui/general/button/component.rb', line 5

def disabled
  @disabled
end

#full_width ⇒ Object (readonly)

Returns the value of attribute full_width.



5
6
7
 
# File 'app/components/better_ui/general/button/component.rb', line 5

def full_width
  @full_width
end

#href ⇒ Object (readonly)

Returns the value of attribute href.



5
6
7
 
# File 'app/components/better_ui/general/button/component.rb', line 5

def href
  @href
end

#html_options ⇒ Object (readonly)

Returns the value of attribute html_options.



5
6
7
 
# File 'app/components/better_ui/general/button/component.rb', line 5

def html_options
  @html_options
end

#icon ⇒ Object (readonly)

Returns the value of attribute icon.



5
6
7
 
# File 'app/components/better_ui/general/button/component.rb', line 5

def icon
  @icon
end

#icon_position ⇒ Object (readonly)

Returns the value of attribute icon_position.



5
6
7
 
# File 'app/components/better_ui/general/button/component.rb', line 5

def icon_position
  @icon_position
end

#id ⇒ Object (readonly)

Returns the value of attribute id.



5
6
7
 
# File 'app/components/better_ui/general/button/component.rb', line 5

def id
  @id
end

#method ⇒ Object (readonly)

Returns the value of attribute method.



5
6
7
 
# File 'app/components/better_ui/general/button/component.rb', line 5

def method
  @method
end

#rounded ⇒ Object (readonly)

Returns the value of attribute rounded.



5
6
7
 
# File 'app/components/better_ui/general/button/component.rb', line 5

def rounded
  @rounded
end

#size ⇒ Object (readonly)

Returns the value of attribute size.



5
6
7
 
# File 'app/components/better_ui/general/button/component.rb', line 5

def size
  @size
end

#text ⇒ Object (readonly)

Returns the value of attribute text.



5
6
7
 
# File 'app/components/better_ui/general/button/component.rb', line 5

def text
  @text
end

#theme ⇒ Object (readonly)

Returns the value of attribute theme.



5
6
7
 
# File 'app/components/better_ui/general/button/component.rb', line 5

def theme
  @theme
end

Instance Method Details

#button_attributes ⇒ Object

Restituisce gli attributi per il bottone



110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
 
# File 'app/components/better_ui/general/button/component.rb', line 110

def button_attributes
  attrs = {
    class: combined_classes,
    type: button_type,
    id: @id
  }

  attrs[:disabled] = true if @disabled
  attrs[:data] = @data if @data.present?

  # Aggiungi altri attributi HTML se presenti
  @html_options.except(:class).each do |key, value|
    attrs[key] = value
  end

  attrs
end

#combined_classes ⇒ Object

Combina tutte le classi



84
85
86
87
88
89
90
91
92
93
94
95
 
# File 'app/components/better_ui/general/button/component.rb', line 84

def combined_classes
  [
    BUTTON_BASE_CLASSES,
    get_button_type_classes,
    get_button_size_classes,
    get_border_radius_class,
    @full_width ? "w-full" : nil,
    @disabled ? "opacity-50 cursor-not-allowed" : nil,
    @classes,
    @html_options[:class]
  ].compact.join(" ")
end

#get_border_radius_class ⇒ Object 



101
102
103
 
# File 'app/components/better_ui/general/button/component.rb', line 101

def get_border_radius_class
  BUTTON_RADIUS[@rounded] || BUTTON_RADIUS[:medium]
end

#get_button_size_classes ⇒ Object 



105
106
107
 
# File 'app/components/better_ui/general/button/component.rb', line 105

def get_button_size_classes
  BUTTON_SIZES[@size] || BUTTON_SIZES[:medium]
end

#get_button_type_classes ⇒ Object 



97
98
99
 
# File 'app/components/better_ui/general/button/component.rb', line 97

def get_button_type_classes
  BUTTON_THEME[@theme] || BUTTON_THEME[:white]
end

#link? ⇒ Boolean

Determina se il bottone è un link o un button

Returns:

  • (Boolean) 


79
80
81
 
# File 'app/components/better_ui/general/button/component.rb', line 79

def link?
  @href.present?
end

#link_attributes ⇒ Object

Restituisce gli attributi per il link



129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
 
# File 'app/components/better_ui/general/button/component.rb', line 129

def link_attributes
  attrs = {
    class: combined_classes,
    id: @id
  }

  attrs[:data] = @data.merge(turbo_method: @method) if @method.present?
  attrs[:data] = @data if @data.present? && !@method.present?
  attrs[:href] = @disabled ? nil : @href
  attrs[:role] = "button"
  attrs[:tabindex] = @disabled ? "-1" : "0"
  attrs[:aria] = { disabled: @disabled } if @disabled

  # Aggiungi altri attributi HTML se presenti
  @html_options.except(:class).each do |key, value|
    attrs[key] = value
  end

  attrs
end

#render? ⇒ Boolean

Verifica se rendere il componente

Returns:

  • (Boolean) 


175
176
177
 
# File 'app/components/better_ui/general/button/component.rb', line 175

def render?
  @text.present? || @icon.present? || content.present?
end

#render_icon(icon_name) ⇒ Object

Helper per renderizzare le icone



155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
 
# File 'app/components/better_ui/general/button/component.rb', line 155

def render_icon(icon_name)
  # Mappa le dimensioni del bottone alle dimensioni dell'icona
  icon_size = case @size
  when :large
               :large
  when :small
               :small
  else
               :medium
  end

  # Utilizziamo il componente Icon
  render BetterUi::General::Icon::Component.new(
    name: icon_name,
    size: icon_size,
    fixed_width: true
  )
end