Class: BulmaPhlex::FormField

Inherits:
Base
  • Object
show all
Defined in:
lib/bulma_phlex/form_field.rb

Overview

A field container that groups a label, control input, and optional help text using the Bulma form field pattern.

Supports an optional label (provided as a string or block via the label method), optional help text, optional icons (left and/or right), and layout options for integrating with Bulma's column and grid systems. The form control content is set via the control method (or a block passed directly to the component).

If the label is passes as a string argument, the any additional html attributes can also be included as arguments.

References

Class Method Summary collapse

Instance Method Summary collapse

Constructor Details

#initialize(help: nil, icon_left: nil, icon_right: nil, column: nil, grid: nil) ⇒ FormField

Returns a new instance of FormField.



33
34
35
36
37
38
39
 
# File 'lib/bulma_phlex/form_field.rb', line 33

def initialize(help: nil, icon_left: nil, icon_right: nil, column: nil, grid: nil)
  @help = help
  @icon_left = icon_left
  @icon_right = icon_right
  @column = column
  @grid = grid
end

Class Method Details

.new(help: nil, icon_left: nil, icon_right: nil, column: nil, grid: nil) ⇒ Object

Parameters

  • help — Optional help text displayed below the input
  • icon_left — Icon class for an icon to the left of the input (e.g. "fas fa-user")
  • icon_right — Icon class for an icon to the right of the input (e.g. "fas fa-check")
  • column — If true, makes the field a column; a size string (e.g. "half") sets the size for all breakpoints; a hash (e.g. { mobile: "full", desktop: "half" }) sets responsive sizes
  • grid — If true, makes the field a grid cell; a size string sets the cell size


29
30
31
 
# File 'lib/bulma_phlex/form_field.rb', line 29

def self.new(help: nil, icon_left: nil, icon_right: nil, column: nil, grid: nil)
  super
end

Instance Method Details

#control(&block) ⇒ Object

Sets the form control content for the field (e.g. an <input>, <select>, or <textarea>). If not called explicitly, the block passed directly to the component is used as the control.

Expects a block that renders the form control element.



61
62
63
 
# File 'lib/bulma_phlex/form_field.rb', line 61

def control(&block)
  @control_builder = block
end

#html_label ⇒ Object

in order to use the method name label, we need to grab a reference to the method on the base class so it is still available to us



43
 
# File 'lib/bulma_phlex/form_field.rb', line 43

alias html_label label

#label(label_string = nil, **html_attributes, &block) ⇒ Object

Sets the label for the field.

  • label_string — A plain text label string. If omitted, a block must be provided instead.

Optionally expects a block that renders a custom label (e.g. with a link or icon inside). Only one of label_string or a block should be provided.



51
52
53
54
55
 
# File 'lib/bulma_phlex/form_field.rb', line 51

def label(label_string = nil, **html_attributes, &block)
  @label_string = label_string
  @label_attributes = html_attributes
  @label_builder = block
end

#view_template(&implicit_control) ⇒ Object 



65
66
67
68
69
70
71
72
73
74
75
76
 
# File 'lib/bulma_phlex/form_field.rb', line 65

def view_template(&implicit_control)
  @control_builder = implicit_control if @control_builder.nil? && implicit_control
  vanish(&implicit_control)

  div(class: field_classes) do
    render_label
    render FormControl.new(icon_left: @icon_left, icon_right: @icon_right) do
      raw @control_builder.call
    end
    p(class: "help") { @help } if @help
  end
end