Forms

Componentes de formularios del Kit Digital USS

uss-form

El componente uss-form es un contenedor de elementos de formulario. Este componente es el contenedor de todos los elementos de formulario, y es el que se encarga de manejar el envío de los datos.

Para agrupar elementos de un formulario, se debe utilizar la etiqueta <div class="uss-form__group"></div>.

uss-form__input

El componente uss-form__input es un elemento de formulario que permite ingresar texto. Este componente se utiliza para ingresar texto, números, correos, etc.

Ejemplos de uso

uss-form__input - Text

Input de texto
Cargando componente...

uss-form__input - Email

Input de email
Cargando componente...

uss-form__input - Password

Input de contraseña
Cargando componente...

uss-form__input - Select

Select input
Cargando componente...

uss-form__input - Textarea

Textarea input
Cargando componente...

uss-form__input - Date

Input de fecha
Cargando componente...

uss-form__input - Time

Input de tiempo
Cargando componente...

Checkbox

Checkboxes
Cargando componente...

Radio group

Radio buttons
Cargando componente...

Switch

Switch toggle
Cargando componente...

Todos los tipos de input

Todos los tipos de input
Cargando componente...

Estados de los elementos de formulario

Los elementos de formulario pueden tener diferentes estados, los cuales se muestran a continuación:

  • Normal: El elemento de formulario se encuentra en su estado normal, es decir, no se ha interactuado con él.

  • Success: El elemento de formulario se encuentra en un estado de éxito, es decir, se ha interactuado con él y cumple con las validaciones establecidas.

  • Warning: El elemento de formulario se encuentra en un estado de advertencia, es decir, se ha interactuado con él y no cumple con las validaciones establecidas.

  • Error: El elemento de formulario se encuentra en un estado de error, es decir, se ha interactuado con él y no cumple con las validaciones establecidas.

  • Disabled: El elemento de formulario se encuentra deshabilitado, es decir, no se puede interactuar con él.

Estados de input
Cargando componente...

Contenido