Aedis UI

Alert

A callout for status, success, warnings and errors.

Approvals moved
Pending approvals now live in the sidebar.

Installation

Once per app, set up Aedis UI. The CLI verifies the signed release before writing anything and pins every dependency:

npx @aedis/cli@0.1.0 init

Import the theme once in your global CSS, after Tailwind:

app/globals.css
@import "tailwindcss";@import "./styles/aedis-theme.css";

Then add the component:

npx @aedis/cli@0.1.0 add alert# pnpm dlx @aedis/cli@0.1.0 add alert · yarn dlx @aedis/cli@0.1.0 add alert · bunx @aedis/cli@0.1.0 add alert

Props

PropTypeDefaultDescription
variant"default" | "success" | "warning" | "destructive""default"Only destructive uses role="alert"; the rest are role="status".
rolestring—Override when the default announcement is wrong for the context.

Security

  • Text only: no prop takes markup.
  • Write the message yourself; never show the server's error text as is (it can disclose internals).