Toaster

Aquí tienes la traducción del archivo fuente de la guía de diseño al español, manteniendo un tono natural y conservando los componentes MDX, bloques de código y términos técnicos:

El Toaster es una pequeña notificación que aparece en pantalla para proporcionar información importante o una advertencia. Se puede usar para notificar al usuario sobre un evento o acción, como cuando se envía un formulario o se descarga un archivo.

§Tipos principales

Predeterminado

Se utiliza cuando no hay necesidad de una acción inmediata o cuando el mensaje no está relacionado con ninguna acción o evento específico.

Info

Se utiliza para informar al usuario sobre un proceso, evento o acción. Por ejemplo, en caso de una transferencia de datos exitosa o la carga de una página.

Éxito

Indica que una operación o acción se ha completado con éxito. Por ejemplo, cuando los datos se guardan correctamente o cuando el usuario está autorizado.

Advertencia

Informa al usuario sobre un problema o error potencial. Por ejemplo, si necesita completar un campo obligatorio en un formulario o si no hay conexión a Internet.

Error

Se utiliza para indicar un error y que se requiere la atención del usuario para solucionarlo. Por ejemplo, si los datos se ingresaron incorrectamente o hay un error del servidor. Este estado se combina mejor con un botón de acción que le permite corregir un error u obtener más información.

§Modificaciones

El Toast se compone de cinco elementos principales:

1. Icono del tipo de Toast. Se puede usar un componente con o sin icono. El icono es un elemento opcional.
2. El encabezado informa al usuario sobre la acción que se está realizando. Si se incluye la descripción, el uso del encabezado es opcional.
3. La descripción aclara el título y se puede usar de forma independiente.
4. Botones. El Toast puede tener uno o dos botones; se recomienda que el primer botón se use como botón de acción. Los botones son elementos opcionales.
5. Icono de salida. El icono de salida es un elemento opcional. El botón de cierre es obligatorio si no hay una duración de ocultación establecida en el toast.

§Cuándo usar

Se recomienda usar Toasters en los siguientes escenarios:

• Al enviar un formulario o realizar una acción, si desea que el usuario vea el progreso. Como un mensaje que indica que los datos se enviaron correctamente o que hubo un error.
• Cuando no desea interrumpir el flujo de trabajo del usuario o bloquear la pantalla. Los Toasters se muestran en una esquina y no cubren toda la pantalla, lo que permite al usuario continuar usando la interfaz.
• Cuando se requiere más información sobre una acción específica. Los Toasts pueden incluir enlaces a contenido o información adicional que ayudará al usuario a comprender lo que sucedió.

§Cuándo no usar

No se recomienda usar Toasters en los siguientes escenarios:

• Cuando se requiere una respuesta inmediata del usuario.
• Cuando la acción que se está realizando en el momento de mostrar el toaster puede causar problemas o consecuencias no deseadas.
• Cuando el mensaje requiere una gran cantidad de información o una explicación más detallada.
• Cuando la información ya se muestra en la pantalla de otra forma.

§Posición en pantalla

El Toaster se muestra en la esquina inferior derecha.

Sus márgenes externos son: inferior M (8px), derecho XL (20px).

§Personalización

El contenido del Toast puede diferir del estándar; puede incluir cualquier componente disponible de la biblioteca, si el caso de uso lo requiere.