Back to Consul

FormInput

ui/packages/consul-ui/app/components/form-input/README.mdx

1.22.71.4 KB
Original Source

FormInput

Base component for making all types of form components.

This component should 'generally' not be used in application code, but instead be used as a base component for creating application form components/elements.

This component should contain the shared functionality for all form components, such as labels, errors, notes/messages/notices etc etc. Specific input types should be provided using the input slot.

The following example shows how to create new form input components and 'generally' shouldn't be used in application code.

hbs
  <FormInput
    @name="single"
    @help="Help me if you can, I'm feeling down"
  >
    <:label>
      Single Line Text Input
    </:label>
    <:input>
      <input type="text" />
    </:input>
  </FormInput>

Arguments

ArgumentTypeDefaultDescription
nameString''An identifier for retriving values/errors etc for this input
helpStringProvide some help text for the input (consider using @validations instead)
validationsObjectA validations object
chartObjectA StateChart object (implementing state and dispatch to be passed to the underlying validate modifier

Slots

NameDescription
inputSlot to hold the specific input element
labelThe label to be rendered

See