The .gov.au means it’s official

Australian government websites always use a .gov.au domain. Before sharing sensitive information online, make sure you’re on a .gov.au site by inspecting your browser’s address (or 'location') bar.

This site is secure.

The https:// ensures that you are connecting to the official website and that any information you provide is encrypted and transmitted securely.

Page alerts


Page alerts are used to notify users of important information or changes on a page, in a way that attracts the user's attention without interrupting the user's task. Typically they appear at the top of a page following a submit action.


View changes
npm i @gov.au/page-alerts
  • Simon Pascal Klein avatar picture
  • Patrick De Young avatar picture
  • Dominik Wilkowski avatar picture
  • Alex Page avatar picture
  • Trevor Brennan avatar picture
  • Julian Fleetwood avatar picture
  • Gary Broadbent avatar picture

React Usage

import AUpageAlert from '@gov.au/page-alerts';

<AUpageAlert as='info'>
  Content of alert


Prop name Type Description
as string One of four kinds: 'info', 'success', 'warning', 'error'
alt boolean An alternate variation of the component
dark boolean A dark variation of the component

All other props are spread into the component


Name Type Description
AUpageAlert default The page alerts component

node_modules import

import AUpageAlert from '@gov.au/page-alerts';

pancake import

import AUpageAlert from './page-alerts';