Alert

Alert defines how EnterUI handles semantic feedback with restrained surfaces, including default structure, accessible states, and token-driven styling.

#Default usage

<div className="docs-preview-stack">
  <Alert variant="info"><AlertTitle>Token driven</AlertTitle><AlertDescription>Components inherit FroggDesign variables.</AlertDescription></Alert>
  <Alert variant="warning"><AlertTitle>Check release notes</AlertTitle><AlertDescription>Public API changes should include migration notes.</AlertDescription></Alert>
</div>

#Import

import { Alert, AlertDescription, AlertTitle } from "@froggdesign/enter-ui-react";

#Patterns

#Accessibility

Alert uses role="status" by default and role="alert" for error variants unless you pass a custom role.

#API

• variant: info, success, warning, or error.
• AlertTitle and AlertDescription provide consistent text hierarchy.

#Styling

Every exported component accepts className when it renders an element. EnterUI styles use .eui-* classes and --eui-* variables mapped from FroggDesign theme tokens.