Class: Daisy::DataInput::FileInputComponent

Inherits:
LocoMotion::BaseComponent show all
Defined in:
app/components/daisy/data_input/file_input_component.rb

Overview

Note:

File inputs have a border by default. Use ‘file-input-ghost` to remove the border.

The FileInput component renders a DaisyUI styled file input. It can be used standalone or with a form builder, and supports various styling options including different sizes and variants.

Constant Summary

Constants inherited from LocoMotion::BaseComponent

LocoMotion::BaseComponent::EMPTY_PART_IGNORED_TAGS, LocoMotion::BaseComponent::SELF_CLOSING_TAGS

Instance Attribute Summary collapse

Attributes inherited from LocoMotion::BaseComponent

#config, #loco_parent

Instance Method Summary collapse

Methods inherited from LocoMotion::BaseComponent

build, #component_ref, #config_option, #cssify, define_modifier, define_modifiers, define_part, define_parts, define_size, define_sizes, #empty_part_content, #inspect, #part, register_component_initializer, register_component_setup, #rendered_css, #rendered_data, #rendered_html, #rendered_stimulus_controllers, #rendered_tag_name, renders_many, renders_one, set_component_name, #set_loco_parent, #strip_spaces

Constructor Details

#initialize(**kws) ⇒ FileInputComponent

Instantiate a new FileInput component.

Parameters:

  • kws (Hash) —

    The keyword arguments for the component.

Options Hash (**kws):

  • name (String) —

    The name attribute for the file input.

  • id (String) —

    The ID attribute for the file input.

  • accept (String) —

    The accept attribute for the file input, specifying allowed file types.

  • multiple (Boolean) —

    Whether the file input allows multiple file selection. Defaults to false.

  • disabled (Boolean) —

    Whether the file input is disabled. Defaults to false.

  • required (Boolean) —

    Whether the file input is required for form validation. Defaults to false.



50
51
52
53
54
55
56
57
58
59
 
# File 'app/components/daisy/data_input/file_input_component.rb', line 50

def initialize(**kws)
  super

  @name = config_option(:name)
  @id = config_option(:id)
  @accept = config_option(:accept, nil)
  @multiple = config_option(:multiple, false)
  @disabled = config_option(:disabled, false)
  @required = config_option(:required, false)
end

Instance Attribute Details

#accept ⇒ Object (readonly)

Returns the value of attribute accept.



27
28
29
 
# File 'app/components/daisy/data_input/file_input_component.rb', line 27

def accept
  @accept
end

#disabled ⇒ Object (readonly)

Returns the value of attribute disabled.



27
28
29
 
# File 'app/components/daisy/data_input/file_input_component.rb', line 27

def disabled
  @disabled
end

#id ⇒ Object (readonly)

Returns the value of attribute id.



27
28
29
 
# File 'app/components/daisy/data_input/file_input_component.rb', line 27

def id
  @id
end

#multiple ⇒ Object (readonly)

Returns the value of attribute multiple.



27
28
29
 
# File 'app/components/daisy/data_input/file_input_component.rb', line 27

def multiple
  @multiple
end

#name ⇒ Object (readonly)

Returns the value of attribute name.



27
28
29
 
# File 'app/components/daisy/data_input/file_input_component.rb', line 27

def name
  @name
end

#required ⇒ Object (readonly)

Returns the value of attribute required.



27
28
29
 
# File 'app/components/daisy/data_input/file_input_component.rb', line 27

def required
  @required
end

Instance Method Details

#before_render ⇒ Object

Calls the #setup_component method before rendering the component.



64
65
66
 
# File 'app/components/daisy/data_input/file_input_component.rb', line 64

def before_render
  setup_component
end

#call ⇒ Object

Renders the component inline with no additional whitespace.



95
96
97
 
# File 'app/components/daisy/data_input/file_input_component.rb', line 95

def call
  part(:component)
end

#setup_component ⇒ Object

Sets up the component by configuring the tag name, CSS classes, and HTML attributes. Sets the tag to input with type ‘file’ and adds the ‘file-input’ CSS class.

This configures the name, id, accept attribute, multiple state, disabled state, and required state of the file input.



76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
 
# File 'app/components/daisy/data_input/file_input_component.rb', line 76

def setup_component
  set_tag_name(:component, :input)

  add_css(:component, "file-input")

  add_html(:component, {
    type: "file",
    name: @name,
    id: @id,
    accept: @accept,
    multiple: @multiple,
    disabled: @disabled,
    required: @required
  })
end