Notification

A notification component to display messages to the user.

Installation

layout.tsx

import { Toaster } from '@aqqo/aqqo-ui'
 
export default function Layout({ children }: { children: React.ReactNode }) {
    return (
        <html>
            <body>
                {children}
                <Toaster />
            </body>
        </html>
    )
}

Usage

import { Button, notify } from "@aqqo/aqqo-ui";

<Button
    onClick={() => notify.success("This is a success notification")}
>
    Click me
</Button>

Examples

Warning

Error

Props

notify(message, variant?, options?) and notify.success|error|warning(message, options?):

Prop	Type	Default	Description
`message`	`string`	-	Notification text.
`variant`	`success` \| `error` \| `warning`	`success`	Visual variant.
`options.position`	`top-left` \| `top-center` \| `top-right` \| `bottom-left` \| `bottom-center` \| `bottom-right`	-	Toast position.
`options.duration`	`number`	-	Duration in ms.
`options` (other)	`ToastOptions`	-	Additional Sonner toast options.

See the Sonner documentation for more information on the available options: Sonner.