Class: UI::Button

Inherits:
Phlex::HTML
  • Object
show all
Includes:
ButtonBehavior
Defined in:
app/components/ui/button.rb

Overview

Button - Phlex implementation

A versatile button component with multiple variants and sizes. Uses ButtonBehavior module for shared styling logic.

Examples:

Basic usage

render UI::Button.new { "Click me" }

With variant and size

render UI::Button.new(variant: "destructive", size: "lg") { "Delete" }

Disabled state

render UI::Button.new(disabled: true) { "Disabled" }

Instance Method Summary collapse

Methods included from ButtonBehavior

#button_classes, #button_html_attributes, #render_button

Constructor Details

#initialize(variant: "default", size: "default", type: "button", disabled: false, classes: "", **attributes) ⇒ Button

Returns a new instance of Button.

Parameters:

  • variant (String) (defaults to: "default") —

    Visual style variant (default, destructive, outline, secondary, ghost, link)

  • size (String) (defaults to: "default") —

    Size variant (default, sm, lg, icon, icon-sm, icon-lg)

  • type (String) (defaults to: "button") —

    Button type attribute (button, submit, reset)

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

    Whether the button is disabled

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

    Additional CSS classes to merge

  • attributes (Hash) —

    Additional HTML attributes



25
26
27
28
29
30
31
32
 
# File 'app/components/ui/button.rb', line 25

def initialize(variant: "default", size: "default", type: "button", disabled: false, classes: "", **attributes)
  @variant = variant
  @size = size
  @type = type
  @disabled = disabled
  @classes = classes
  @attributes = attributes
end

Instance Method Details

#view_template(&block) ⇒ Object 



34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
 
# File 'app/components/ui/button.rb', line 34

def view_template(&block)
  all_attributes = button_html_attributes

  # Merge classes with TailwindMerge before deep_merge
  if @attributes.key?(:class)
    button_class = all_attributes[:class] || ""
    attr_class = @attributes[:class] || ""
    merged_class = TailwindMerge::Merger.new.merge([button_class, attr_class].join(" "))
    all_attributes = all_attributes.merge(class: merged_class)
  end

  # Deep merge other attributes (excluding class which we already handled)
  all_attributes = all_attributes.deep_merge(@attributes.except(:class))

  button(**all_attributes) do
    yield if block_given?
  end
end