Class: InputComponent

Inherits:
Component show all
Defined in:
app/components/input_component.rb

Overview

Input — Fomantic UI input wrapper.

Renders <div class=“ui … input”> with optional icon. The actual <input> element comes from the block (e.g. a form builder TextField) or is auto-generated as a basic <input type=“text”> when no block is given.

Usage:

# Standalone (no form builder) — auto-generates <input>:
Input(icon: "search", placeholder: "Search...")

# Wrapping a form builder field:
Input(icon: "user", icon_position: "left") {
  TextField(:email, placeholder: "E-mail address")
}

# Labeled input:
Input(labeled: true) { Tag { "http://" } }

Constant Summary

Constants inherited from Component

Component::HTML_OPTIONS

Instance Method Summary collapse

Methods inherited from Component

default, #initialize, #render_in, slot

Constructor Details

This class inherits a constructor from Component

Instance Method Details

#to_sObject



36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
# File 'app/components/input_component.rb', line 36

def to_s
  classes = class_names(
    "ui",
    size,
    { "left icon" => icon && icon_position == "left",
      "icon" => icon && icon_position != "left",
      "labeled" => labeled, "action" => action,
      "transparent" => transparent, "fluid" => fluid,
      "loading" => loading, "disabled" => disabled,
      "error" => error, "inverted" => inverted },
    "input"
  )

  icon_el = icon ? tag.i(class: "#{icon} icon") : nil
  content = @content.present? ? @content : tag.input(type: "text", placeholder: placeholder)

  tag.div(**merge_html_options(class: classes)) {
    safe_join([ content, icon_el ].compact)
  }
end