melden v0.0.9

Robust headless React notifications.

Quickstart guide

melden is designed for you to bring your own notification component. However, by default melden uses a bare-bones notification component animated with Framer Motion.

All you have to do is import NotificationsProvider to start pushing notifications.

import {FC} from "react";
import {NotificationsProvider, useNotifier} from "melden";

/** A button which will push a "Hello world!" notification on click. */
const HelloWorldButton: FC = () => {
	const {notify} = useNotifier();
	const handleClick = () => notify("Hello world!");
	return <button onClick={handleClick}>Push notification</button>;
};

/** Our application allows you to push and interact with notifications. */
const App: FC = () => (
	<NotificationsProvider>
		<HelloWorldButton />
	</NotificationsProvider>
);