Class: BetterUi::General::Divider::Component

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

Constant Summary collapse

DIVIDER_BASE_CLASSES =

Classi base sempre presenti

"my-4"
DIVIDER_THEME_CLASSES =

Temi con classi Tailwind dirette - LOGICA CORRETTA

{
  default: "border-white",         # Bordo bianco (per sfondi scuri)
  white: "border-gray-300",        # Bordo grigio (per sfondi chiari)
  red: "border-red-500",
  rose: "border-rose-500",
  orange: "border-orange-500",
  green: "border-green-500",
  blue: "border-blue-500",
  yellow: "border-yellow-500",
  violet: "border-violet-500"
}
DIVIDER_ORIENTATION_CLASSES =

Orientamento con classi Tailwind dirette

{
  horizontal: "w-full border-t",
  vertical: "h-full border-l"
}
DIVIDER_STYLE_CLASSES =

Stili di linea con classi Tailwind dirette

{
  solid: "border-solid",
  dashed: "border-dashed",
  dotted: "border-dotted",
  double: "border-double"
}
DIVIDER_SIZE_CLASSES =

Dimensioni con classi Tailwind dirette

{
  thin: {
    horizontal: "border-t",
    vertical: "border-l"
  },
  medium: {
    horizontal: "border-t-2",
    vertical: "border-l-2"
  },
  thick: {
    horizontal: "border-t-4",
    vertical: "border-l-4"
  }
}
DIVIDER_LABEL_THEME_CLASSES =

Classi per label con classi Tailwind dirette - LOGICA CORRETTA

{
  default: "text-white bg-transparent px-3",     # Testo bianco trasparente (per sfondi scuri)
  white: "text-gray-900 bg-white px-3",          # Testo nero su bianco (per sfondi chiari)
  red: "text-red-500 bg-white px-3",
  rose: "text-rose-500 bg-white px-3",
  orange: "text-orange-500 bg-white px-3",
  green: "text-green-500 bg-white px-3",
  blue: "text-blue-500 bg-white px-3",
  yellow: "text-yellow-600 bg-white px-3",
  violet: "text-violet-500 bg-white px-3"
}

Instance Attribute Summary collapse

Instance Method Summary collapse

Constructor Details

#initialize(theme: :white, orientation: :horizontal, style: :solid, size: :medium, label: nil, height: nil, classes: nil, **html_options) ⇒ Component

Returns a new instance of Component.

Parameters:

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

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

  • orientation (Symbol) (defaults to: :horizontal) —

    orientamento del divider (:horizontal, :vertical)

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

    stile della linea (:solid, :dashed, :dotted, :double)

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

    dimensione della linea (:thin, :medium, :thick)

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

    testo opzionale da mostrare al centro del divider

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

    altezza per divider verticale (es. “100px”, “100%”)

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

    classi CSS aggiuntive

  • html_options (Hash) —

    opzioni HTML per il container



74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
 
# File 'app/components/better_ui/general/divider/component.rb', line 74

def initialize(
  theme: :white,
  orientation: :horizontal,
  style: :solid,
  size: :medium,
  label: nil,
  height: nil,
  classes: nil,
  **html_options
)
  @theme = theme.to_sym
  @orientation = orientation.to_sym
  @style = style.to_sym
  @size = size.to_sym
  @label = label
  @height = height
  @classes = classes
  @html_options = html_options

  validate_params
end

Instance Attribute Details

#classes ⇒ Object (readonly)

Returns the value of attribute classes.



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

def classes
  @classes
end

#height ⇒ Object (readonly)

Returns the value of attribute height.



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

def height
  @height
end

#label ⇒ Object (readonly)

Returns the value of attribute label.



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

def label
  @label
end

#orientation ⇒ Object (readonly)

Returns the value of attribute orientation.



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

def orientation
  @orientation
end

#size ⇒ Object (readonly)

Returns the value of attribute size.



5
6
7
 
# File 'app/components/better_ui/general/divider/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/divider/component.rb', line 5

def style
  @style
end

#theme ⇒ Object (readonly)

Returns the value of attribute theme.



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

def theme
  @theme
end

Instance Method Details

#combined_classes ⇒ Object

Combina tutte le classi per il container



97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
 
# File 'app/components/better_ui/general/divider/component.rb', line 97

def combined_classes
  base_classes = []

  if @label.present? && @orientation == :horizontal
    # Per divider con label orizzontale: flex layout
    base_classes = [
      "flex items-center text-center",
      get_theme_class,
      get_style_class
    ]
  else
    # Per divider normale
    base_classes = [
      DIVIDER_BASE_CLASSES,
      get_orientation_class,
      get_theme_class,
      get_style_class,
      get_size_class
    ]
  end

  [ *base_classes, @classes, @html_options[:class] ].compact.join(" ")
end

#divider_attributes ⇒ Object

Restituisce gli attributi per il divider



149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
 
# File 'app/components/better_ui/general/divider/component.rb', line 149

def divider_attributes
  attrs = {
    class: combined_classes
  }

  # Aggiungi stile inline se presente
  attrs[:style] = inline_styles if inline_styles.present?

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

  attrs
end

#inline_styles ⇒ Object

Genera gli attributi di stile inline necessari



143
144
145
146
 
# File 'app/components/better_ui/general/divider/component.rb', line 143

def inline_styles
  return nil unless @orientation == :vertical && @height.present?
  "height: #{@height};"
end

#label_classes ⇒ Object

Classi per il label



122
123
124
125
126
127
128
129
 
# File 'app/components/better_ui/general/divider/component.rb', line 122

def label_classes
  return "" unless @label.present?

  [
    "relative z-10 text-sm font-medium",
    get_label_theme_class
  ].compact.join(" ")
end

#label_line_classes ⇒ Object

Classi per le linee before/after quando c’è un label



132
133
134
135
136
137
138
139
140
 
# File 'app/components/better_ui/general/divider/component.rb', line 132

def label_line_classes
  return "" unless @label.present? && @orientation == :horizontal

  [
    "flex-1 h-px",
    get_theme_class,
    get_style_class
  ].compact.join(" ")
end

#show_label? ⇒ Boolean

Determina se mostrare il label

Returns:

  • (Boolean) 


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

def show_label?
  @label.present? && @orientation == :horizontal
end