EN
|
DE
Diggi Docs
Notification
Notifications verdeutlichen, ob die Aktion des Benutzers erfolgreich war oder nicht. Außerdem können sie weiterführende Informationen abbilden. Beispielhafte Anwendungsfälle können sein: Kontaktformulare, Upload- oder Bestellprozesse. Notifications variations:
  • Notification bar (default) for inline display
  • Notification banner
  • Notification text shown in form fields
Notifications types:
  • neutral (default)
  • success
  • warning
  • error
For the notification text variant, go to Form Field . The notification banner and default variants are showcased here. The neutral level does have an optional Icon, the other three levels uses the outlined icons from the icon-font as showcased here.

Eigenschaften

NameTypeDefault ValueDescription

notificationId

string

undefined

Unique ID , unique id will be generated if not set.

name

string

undefined

Name of the element

variant

'banner' | 'text'

undefined

optional if not passed 'bar' type will be generated. Other variants are 'banner', 'text'

type

'neutral' | 'success' | 'warning' | 'error'

undefined

optional default will be neutral, other types are 'success', 'warning', 'error'

iconName

string

undefined

optional icon name will only be used when type is neutral

content

string

undefined

Text to be displayed in the notification, this is also the default slot

isShown

boolean

false

If variant is 'banner', show or hide the banner

style

string

undefined

Additional css styles

Events

NameDescription

closeClicked

If type is banner this will trigger, when the banner is dismissed/closed

Beispiele

Notification Text

Notification texts are usually used in combination with form fields. The following example shows the combination with a text field.

See Form Field

Notification Bar

Notification Banner

Do's and Don'ts

do

Do

Notification Text im Formularkontext als Warning

do

Do

Notification Text innerhalb einer Abfrage als Zusatzinformation