Implementation
Announcement Props
Common Examples
import { Announcement } from "@servicetitan/anvil2";
function ExampleComponent() {
return (
<Announcement
status="info"
title="We have an announcement for you. Hopefully you find it informational."
/>
);
}
Announcement Status
Use the status prop to update the colors and icon of the Announcement.Pass in a Button as the children of the Announcement to add an action. Multiple actions are allowed, but discouraged.Closing Announcements
Add the onClose callback prop to the Announcement to include a close button.<Announcement
title="We have an announcement for you"
status="info"
onClose={(e) => console.log("Announcement closed")}
>
<Button size="small">Learn More</Button>
</Announcement>
Announcement Props
Providing this prop will render a close button on the announcement.
status
"info" | "success" | "warning" | "danger"
default:"info"
Last modified on January 23, 2026
