# Message.

## Übersicht

### Was macht die Komponente?

- Anzeige von Meldungen.

### Wann soll die Komponente eingesetzt werden?

- Bei Informationen zum Status der Applikation.
- Beim Auftreten von technischen oder fachlichen Fehlern.
- Beim Durchführen von länger dauernden Aktionen.

### Regeln

- Für Fehleingaben werden Feldvalidierungen (z.B. beim [text input](https://digital.sbb.ch/de/design-system/mobile/components/text-input/)) verwendet.
- Wird die Illustration von SBB Mitarbeitenden verwendet, wird zufällig eine Frau oder ein Mann dargestellt.

## Varianten

### Zustände

Die Komponente hat folgende Zustände:

- Default
- Error
- Loading

### Varianten

Die Komponente hat folgende Varianten:

- Illustration: Optional
- Fehlercode: Optional
- Retry-Button: Optional

#### Message mit Illustration

![Message, mit Illustration](https://digital.sbb.ch/assets/images/mobile/message-with-illustration-light.webp "Message, mit Illustration")

![Message, mit Illustration](https://digital.sbb.ch/assets/images/mobile/message-with-illustration-dark.webp "Message, mit Illustration")

#### Message ohne Illustration

![Message, mit Illustration](https://digital.sbb.ch/assets/images/mobile/message-without-illustration-light.webp "Message, mit Illustration")

![Message, mit Illustration](https://digital.sbb.ch/assets/images/mobile/message-without-illustration-dark.webp "Message, mit Illustration")

### Spezifikationen

[Design](https://www.figma.com/design/ZBotr4yqcEKqqVEJTQfSUa/Design-System-Mobile?node-id=284-3296&t=OQ7s4wE6eWI2fLGh-1)

---

Source: https://digital.sbb.ch/de/design-system/mobile/components/message/