Alert

Feedback messages for user actions

<Alert>

import { Alert } from '@strum/react';
name
type
default
Icon
ComponentType<IconProps>
-
color
"accent" | "error" | "success" | "warning"
accent
emphasis
never
false
iconAccessibilityLabel
string
-
size
"medium" | "small" | "large" | "extraLarge" | "extraSmall"
medium

A bit more saturation on the background, and a bright left border to draw attention.

The alert component takes an Icon prop that expects a React.ComponentType. It works perfectly with any icon that ships with Strum, though you can pass a custom React component type if you prefer. You should also pass an iconAccessibilityLabel string to provide meaning for the icon you selected.

Links within an alert will take on custom styles.