Design SystemForm fields
Campos de formulario: texto, lista, campo con botón y mensaje de error.
GitHub
Storybook
FigmaAnatomía
Cada número es una parte del componente real: hacé clic para ver sus propiedades y tokens.
Hacé clic en un número para ver las propiedades y los tokens de esa parte.
Variantes
El componente real, en vivo. Con «Inspeccionar» ves las propiedades y los tokens de cada parte.
Componente real de la tienda, publicado en Storybook.
Abrir en StorybookProps
| Prop | Tipo | Descripción |
|---|---|---|
| form-label | clase | Etiqueta del campo; va asociada con `htmlFor`. |
| form-control | clase | Campo de texto. |
| form-select | clase | Lista desplegable nativa. |
| input-group | clase | Agrupa un campo con un botón, como el código de descuento. |
| invalid-feedback | clase | Mensaje de error: aparece cuando el campo es inválido (`was-validated` o `is-invalid` en el contenedor). |