Soliguide

Textarea

Un champ de saisie multiligne, avec son intitulé, un texte d'aide et un message d'erreur. Huit couleurs, deux styles, cinq tailles.

Message

Décrivez votre demande en quelques mots.

Vue d'ensemble : color × size

Réglages

Chaque réglage correspond à une propriété du composant.

La couleur du contour. En erreur, elle devient rouge quelle que soit ce réglage.

Le style : avec contour, ou sans fond ni contour (ghost).

La taille, de très petit (xs) à très grand (xl).

Champ en erreur : contour rouge, et le message d'erreur remplace le texte d'aide.

Champ désactivé : grisé, et sans saisie possible.

Champ obligatoire pour envoyer le formulaire. Sans effet sur l'aspect.

L'intitulé au-dessus du champ. Vide, le champ n'a plus d'intitulé visible.

L'exemple grisé affiché tant que le champ est vide.

Le nombre de lignes visibles.

Un texte d'aide sous le champ.

Le message affiché sous le champ en erreur. Vide, SoliBook n'affiche rien : le vrai composant retomberait sur le texte d'aide.

Le nom lu par les lecteurs d'écran. Vide, c'est l'intitulé qui sert de nom.

Le nom du champ, envoyé avec le formulaire.

L'identifiant du champ.

Des classes en plus, pour tester une personnalisation.

Le code correspondant
import Textarea from "@neo/ui/components/Textarea.astro";

<Textarea />