Class: UI::Toggle

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

Overview

Toggle - Phlex implementation

A two-state button that can be either on or off. Uses ToggleBehavior module for shared styling logic.

Examples:

Basic usage

render UI::Toggle.new { "Toggle" }

With icon

render UI::Toggle.new(variant: "outline", pressed: true) do
  render Icon.new("bookmark")
end

Disabled state

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

Instance Method Summary collapse

Methods included from ToggleBehavior

#render_toggle, #toggle_classes, #toggle_html_attributes

Constructor Details

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

Returns a new instance of Toggle.

Parameters:

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

    Visual style variant (default, outline)

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

    Size variant (default, sm, lg)

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

    Button type attribute (button, submit, reset)

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

    Whether the toggle is pressed/active

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

    Whether the toggle is disabled

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

    Additional CSS classes to merge

  • attributes (Hash) —

    Additional HTML attributes



28
29
30
31
32
33
34
35
36
# File 'app/components/ui/toggle.rb', line 28

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

Instance Method Details

#view_template(&block) ⇒ Object



38
39
40
41
42
# File 'app/components/ui/toggle.rb', line 38

def view_template(&block)
  button(**toggle_html_attributes.deep_merge(@attributes)) do
    yield if block_given?
  end
end