Alerts

Svelte Component

Display customizable alerts to garner attention and provide critical actions.

Examples

Usage

This component makes use of role="alert" and aria-live="polite".

typescript
let visible: boolean = true;
html
<Alert {visible}>
	<svelte:fragment slot="lead">(icon)</svelte:fragment>
	<svelte:fragment slot="title">(title)</svelte:fragment>
	<span>(message)</span>
	<svelte:fragment slot="trail">(trail)</svelte:fragment>
</Alert>