Class: BetterUi::General::Heading::Component

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

Constant Summary collapse

HEADING_BASE_CLASSES =

Classi base sempre presenti

"font-bold leading-tight"
HEADING_THEME_CLASSES =

Temi con classi Tailwind dirette - LOGICA CORRETTA

{
  default: "text-white",         # Testo bianco (per sfondi scuri)
  white: "text-gray-900",        # Testo nero (per sfondi chiari)
  red: "text-red-500",
  rose: "text-rose-500",
  orange: "text-orange-500",
  green: "text-green-500",
  blue: "text-blue-500",
  yellow: "text-yellow-600",
  violet: "text-violet-500",
  purple: "text-purple-500"
}
HEADING_ALIGN_CLASSES =

Allineamenti con classi Tailwind dirette

{
  left: "text-left",
  center: "text-center",
  right: "text-right"
}
HEADING_SIZE_CLASSES =

Dimensioni base (verranno combinate con level)

{
  small: {
    1 => "text-2xl sm:text-3xl",
    2 => "text-xl sm:text-2xl",
    3 => "text-lg sm:text-xl",
    4 => "text-base sm:text-lg",
    5 => "text-sm sm:text-base",
    6 => "text-xs sm:text-sm"
  },
  medium: {
    1 => "text-3xl sm:text-4xl",
    2 => "text-2xl sm:text-3xl",
    3 => "text-xl sm:text-2xl",
    4 => "text-lg sm:text-xl",
    5 => "text-base sm:text-lg",
    6 => "text-sm sm:text-base"
  },
  large: {
    1 => "text-4xl sm:text-5xl",
    2 => "text-3xl sm:text-4xl",
    3 => "text-2xl sm:text-3xl",
    4 => "text-xl sm:text-2xl",
    5 => "text-lg sm:text-xl",
    6 => "text-base sm:text-lg"
  }
}
HEADING_STYLE_CLASSES =

Stili con classi Tailwind dirette

{
  normal: "",
  bold: "font-extrabold",
  italic: "italic",
  underline: "underline"
}
HEADING_SUBTITLE_THEME_CLASSES =

Temi per subtitle - LOGICA CORRETTA

{
  default: "text-gray-300",      # Testo grigio chiaro (per sfondi scuri)
  white: "text-gray-600",        # Testo grigio scuro (per sfondi chiari)
  red: "text-red-400",
  rose: "text-rose-400",
  orange: "text-orange-400",
  green: "text-green-400",
  blue: "text-blue-400",
  yellow: "text-yellow-500",
  violet: "text-violet-400"
}
HEADING_DIVIDER_THEME_CLASSES =

Temi per divider - LOGICA CORRETTA

{
  default: "border-gray-700",      # Bordo grigio scuro (per sfondi scuri)
  white: "border-gray-200",        # Bordo grigio chiaro (per sfondi chiari)
  red: "border-red-200",
  rose: "border-rose-200",
  orange: "border-orange-200",
  green: "border-green-200",
  blue: "border-blue-200",
  yellow: "border-yellow-200",
  violet: "border-violet-200"
}

Instance Attribute Summary collapse

Instance Method Summary collapse

Constructor Details

#initialize(level: 2, theme: :white, align: :left, size: :medium, style: :normal, icon: nil, subtitle: nil, with_divider: false, **html_options) ⇒ Component

Returns a new instance of Component.

Parameters:

  • level (Integer) (defaults to: 2) —

    livello del heading (1-6)

  • theme (Symbol) (defaults to: :white) —

    tema del colore (:default, :white, etc.)

  • align (Symbol) (defaults to: :left) —

    allineamento (:left, :center, :right)

  • size (Symbol) (defaults to: :medium) —

    dimensione (:small, :medium, :large)

  • style (Symbol) (defaults to: :normal) —

    stile (:normal, :bold, :italic, :underline)

  • icon (String) (defaults to: nil) —

    icona opzionale

  • subtitle (String) (defaults to: nil) —

    sottotitolo opzionale

  • with_divider (Boolean) (defaults to: false) —

    mostra linea divisoria

  • html_options (Hash) —

    opzioni HTML per il container



102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
 
# File 'app/components/better_ui/general/heading/component.rb', line 102

def initialize(
  level: 2,
  theme: :white,
  align: :left,
  size: :medium,
  style: :normal,
  icon: nil,
  subtitle: nil,
  with_divider: false,
  **html_options
)
  @level = level.to_i.clamp(1, 6)
  @theme = theme.to_sym
  @align = align.to_sym
  @size = size.to_sym
  @style = style.to_sym
  @icon = icon
  @subtitle = subtitle
  @with_divider = with_divider
  @html_options = html_options

  validate_params
end

Instance Attribute Details

#align ⇒ Object (readonly)

Returns the value of attribute align.



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

def align
  @align
end

#icon ⇒ Object (readonly)

Returns the value of attribute icon.



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

def icon
  @icon
end

#level ⇒ Object (readonly)

Returns the value of attribute level.



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

def level
  @level
end

#size ⇒ Object (readonly)

Returns the value of attribute size.



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

def size
  @size
end

#style ⇒ Object (readonly)

Returns the value of attribute style.



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

def style
  @style
end

#subtitle ⇒ Object (readonly)

Returns the value of attribute subtitle.



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

def subtitle
  @subtitle
end

#theme ⇒ Object (readonly)

Returns the value of attribute theme.



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

def theme
  @theme
end

#with_divider ⇒ Object (readonly)

Returns the value of attribute with_divider.



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

def with_divider
  @with_divider
end

Instance Method Details

#container_classes ⇒ Object

Classi per il container principale



139
140
141
 
# File 'app/components/better_ui/general/heading/component.rb', line 139

def container_classes
  "mb-4"
end

#divider_classes ⇒ Object

Classi per il divider



155
156
157
158
159
160
161
162
 
# File 'app/components/better_ui/general/heading/component.rb', line 155

def divider_classes
  return "" unless @with_divider

  [
    "mt-2 border-t",
    get_divider_theme_class
  ].compact.join(" ")
end

#heading_attributes ⇒ Object

Restituisce gli attributi HTML per il heading



171
172
173
174
175
 
# File 'app/components/better_ui/general/heading/component.rb', line 171

def heading_attributes
  attrs = @html_options.except(:class)
  attrs[:class] = heading_classes
  attrs
end

#heading_classes ⇒ Object

Combina tutte le classi per il heading



127
128
129
130
131
132
133
134
135
136
 
# File 'app/components/better_ui/general/heading/component.rb', line 127

def heading_classes
  [
    HEADING_BASE_CLASSES,
    get_theme_class,
    get_align_class,
    get_size_class,
    get_style_class,
    @html_options[:class]
  ].compact.join(" ")
end

#heading_tag ⇒ Object

Tag del heading basato sul level



178
179
180
 
# File 'app/components/better_ui/general/heading/component.rb', line 178

def heading_tag
  "h#{@level}"
end

#icon_classes ⇒ Object

Classi per l’icona



165
166
167
168
 
# File 'app/components/better_ui/general/heading/component.rb', line 165

def icon_classes
  return "" unless @icon.present?
  "mr-2 inline-block"
end

#show_divider? ⇒ Boolean

Determina se mostrare il divider

Returns:

  • (Boolean) 


193
194
195
 
# File 'app/components/better_ui/general/heading/component.rb', line 193

def show_divider?
  @with_divider
end

#show_icon? ⇒ Boolean

Determina se mostrare l’icona

Returns:

  • (Boolean) 


183
184
185
 
# File 'app/components/better_ui/general/heading/component.rb', line 183

def show_icon?
  @icon.present?
end

#show_subtitle? ⇒ Boolean

Determina se mostrare il subtitle

Returns:

  • (Boolean) 


188
189
190
 
# File 'app/components/better_ui/general/heading/component.rb', line 188

def show_subtitle?
  @subtitle.present?
end

#subtitle_classes ⇒ Object

Classi per il subtitle



144
145
146
147
148
149
150
151
152
 
# File 'app/components/better_ui/general/heading/component.rb', line 144

def subtitle_classes
  return "" unless @subtitle.present?

  [
    "mt-1 text-sm",
    get_subtitle_theme_class,
    get_align_class
  ].compact.join(" ")
end