View Source LightningWeb.Components.NewInputs (Lightning v2.10.4)

A temporary module that will serve as a place to put new inputs that conform with the newer CoreComponents conventions introduced in Phoenix 1.7.

Summary

Functions

Renders a button.

Renders a checkbox input element.

Generates a generic error message.

Generic wrapper for rendering error messages in custom input components.

Generates hidden inputs for a form. Adapted from PhoenixHTMLHelpers.Form.html#hidden_inputs_for/1

Renders an input with label and error messages.

Renders an input element.

Renders a label.

Functions

Renders a button.

Examples

<.button>Send!</.button>
<.button phx-click="go" class="ml-2">Send!</.button>

Attributes

  • id (:string) - Defaults to "".
  • type (:string) - Defaults to "button".
  • class (:any) - Defaults to "".
  • color_class (:any) - Defaults to "bg-primary-600 hover:bg-primary-700 text-white focus:ring-primary-500 disabled:bg-primary-300".
  • tooltip (:any) - Defaults to nil.
  • Global attributes are accepted. Supports all globals plus: ["disabled", "form", "name", "value"].

Slots

  • inner_block (required)
Link to this function

checkbox_element(assigns)

View Source

Renders a checkbox input element.

This function is used internally by input/1 and generally should not be used directly.

Look at input type="checkbox" to see how these values attr get populated

Attributes

  • id (:string) - Defaults to nil.
  • name (:string) (required)
  • value (:any) (required)
  • class (:string)
  • checked (:boolean) - the checked flag for checkbox inputs.
  • checked_value (:any) - Defaults to "true".
  • unchecked_value (:any) - Defaults to "false".
  • hidden_input (:boolean) - Defaults to true.
  • Global attributes are accepted. Supports all globals plus: ["disabled", "form", "readonly", "required"].

Generates a generic error message.

Slots

  • inner_block (required)

Generic wrapper for rendering error messages in custom input components.

Attributes

Link to this function

form_hidden_inputs(assigns)

View Source

Generates hidden inputs for a form. Adapted from PhoenixHTMLHelpers.Form.html#hidden_inputs_for/1

Attributes

Renders an input with label and error messages.

A Phoenix.HTML.FormField may be passed as argument, which is used to retrieve the input name, id, and values. Otherwise all attributes may be passed explicitly.

Types

This function accepts all HTML input types, considering that:

  • You may also set type="select" to render a <select> tag

  • type="checkbox" is used exclusively to render boolean values

  • For live file uploads, see Phoenix.Component.live_file_input/1

See https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input for more information.

Examples

<.input field={@form[:email]} type="email" />
<.input name="my-input" errors={["oh no!"]} />

Attributes

  • id (:any) - Defaults to nil.
  • name (:any)
  • label (:string) - Defaults to nil.
  • value (:any)
  • type (:string) - Defaults to "text".
  • field (Phoenix.HTML.FormField) - a form field struct retrieved from the form, for example: @form[:email].
  • errors (:list) - Defaults to [].
  • checked (:boolean) - the checked flag for checkbox/radio inputs.
  • checked_value (:any) - the value to be sent when the checkbox is checked. Defaults to 'true'. Defaults to "true".
  • unchecked_value (:any) - the value to be sent when the checkbox is unchecked, Defaults to 'false'. Defaults to "false".
  • hidden_input (:boolean) - controls if this function will generate a hidden input to submit the unchecked value or not. Defaults to 'true'. Defaults to true.
  • prompt (:string) - the prompt for select inputs. Defaults to nil.
  • options (:list) - the options to pass to Phoenix.HTML.Form.options_for_select/2.
  • multiple (:boolean) - the multiple flag for select inputs. Defaults to false.
  • button_placement (:string) - Defaults to nil.
  • class (:string) - Defaults to "".
  • stretch (:boolean) - control the wrapping div classes of some components like the textarea. Defaults to false.
  • display_errors (:boolean) - Defaults to true.
  • tooltip (:any) - Defaults to nil.
  • Global attributes are accepted. Supports all globals plus: ["accept", "autocomplete", "capture", "cols", "disabled", "form", "list", "max", "maxlength", "min", "minlength", "multiple", "pattern", "placeholder", "readonly", "required", "rows", "size", "step"].

Slots

  • inner_block

Renders an input element.

This function is used internally by input/1 and generally should not be used directly.

In the case of inputs that are different enough to warrant a new function, this component can be used to maintain style consistency.

Attributes

  • id (:string) - Defaults to nil.
  • name (:string) (required)
  • type (:string) (required)
  • value (:any)
  • errors (:list) - Defaults to [].
  • class (:string) - Defaults to "".
  • Global attributes are accepted. Supports all globals plus: ["accept", "autocomplete", "capture", "cols", "disabled", "form", "list", "max", "maxlength", "min", "minlength", "multiple", "pattern", "placeholder", "readonly", "required", "rows", "size", "step"].

Renders a label.

Attributes

  • for (:any) - Defaults to nil.
  • class (:any) - Defaults to "".
  • Global attributes are accepted.

Slots

  • inner_block (required)