input function

Component input(
  1. List<Component> children, {
  2. InputType? type,
  3. String? name,
  4. String? value,
  5. bool? disabled,
  6. ValueChanged? onInput,
  7. ValueChanged? onChange,
  8. Key? key,
  9. String? id,
  10. String? classes,
  11. Styles? styles,
  12. Map<String, String>? attributes,
  13. Map<String, EventCallback>? events,
})

The <input> HTML element is used to create interactive controls for web-based forms in order to accept data from the user; a wide variety of types of input data and control widgets are available, depending on the device and user agent. The <input> element is one of the most powerful and complex in all of HTML due to the sheer number of combinations of input types and attributes.

  • type: Defines how an <input> works. If this attribute is not specified, the default type adopted is text.
  • name: Name of the form control. Submitted with the form as part of a name/value pair
  • value: The initial value of the control
  • disabled: Indicates that the user should not be able to interact with the input. Disabled inputs are typically rendered with a dimmer color or using some other form of indication that the field is not available for use.
  • onInput: Callback for the 'input' event. The type of value depends on type.
  • onChange: Callback for the 'change' event. The type of value depends on type.

Implementation

Component input(List<Component> children,
    {InputType? type,
    String? name,
    String? value,
    bool? disabled,
    ValueChanged<dynamic>? onInput,
    ValueChanged<dynamic>? onChange,
    Key? key,
    String? id,
    String? classes,
    Styles? styles,
    Map<String, String>? attributes,
    Map<String, EventCallback>? events}) {
  return DomComponent(
    tag: 'input',
    key: key,
    id: id,
    classes: classes,
    styles: styles,
    attributes: {
      ...attributes ?? {},
      if (type != null) 'type': type.value,
      if (name != null) 'name': name,
      if (value != null) 'value': value,
      if (disabled == true) 'disabled': '',
    },
    events: {
      ...?events,
      ..._events(onInput: onInput, onChange: onChange),
    },
    children: children,
  );
}