SGDS Alert Component Skill

<sgds-alert> displays short, contextual feedback messages — info, success, warnings, or errors. <sgds-alert-link> renders a styled inline link inside the alert body. Use this instead of building custom notification banners.

Prerequisites

See sgds-components-setup for installation and framework integration (React 19+ vs React ≤18, Vue, Angular).

No CSS styling modifications — custom properties and CSS parts are not exposed on these components.

Quick Decision Guide

Which variant?

• Informational → info (default)
• Positive / completed → success
• Error / destructive → danger
• Caution → warning
• Subdued / neutral → neutral