Alert
@stellaria/nebula-webAlertPropsPreview
Props
11| Prop | Type | Default |
|---|---|---|
actions | ReactNode | — |
children | ReactNode | — |
className | string | — |
closeLabel | string | "Dismiss notice" |
color | ColorExtended | "info" |
icon | ReactNode | — |
live | "status" | "alert" | "off" | — |
onClose | (() => void) | — |
title | ReactNode | — |
variant | AlertVariant | "light" |
withCloseButton | boolean | false |
Slot props
5Each one spreads over an inner element, so you can restyle a region without forking the component.
| Prop | Type | Default |
|---|---|---|
actionsProps The action row. Only with `actions`. The close button does not land here and has no slot: `withCloseButton` and `closeLabel` govern it. | BoxSlotProps | — |
bodyProps The column that groups title, message and actions. Always rendered. | BoxSlotProps | — |
iconProps The glyph. Only rendered with `icon`, and it is `aria-hidden`: the text is what informs. | BoxSlotProps | — |
messageProps The message, which is `children`. It does not exist without them. | BoxSlotProps | — |
titleProps The title. Its `id` is what names the alert through `aria-labelledby`, and it is written AFTER the slot. Only rendered with `title`. | TextSlotProps | — |
Also accepts
On top of its own props, this component forwards these groups.