dynaura

Island toastsfor React

One pill that spring-morphs between states and swipes away. Zero dependencies, fully typed.

Get started
$ npm install dynaura

Press one. The island opens at the top of the page.

Everything a toast should be.

One island, real motion

A single pill morphs between compact and expanded with a CSS spring. No animation library.

dynaura.success({
  title: "Saved",
  description: "Your changes are live.",
});
Read the docs

One Toaster. Call it anywhere.

Three moves and every dynaura call works, from any file, with no provider and no hook.

  1. Mount onceOne Toaster per page, in your root layout.<Toaster />
  2. Import the stylesheetOnce, at the root.import "dynaura/styles.css"
  3. Call from anywhereState is a global, so there is no provider or hook.dynaura.success("Saved")
import { Toaster, dynaura } from "dynaura";
import "dynaura/styles.css";

export default function App() {
  return (
    <>
      <Toaster />
      <button onClick={() => dynaura.success({ title: "Saved", description: "Your changes are live." })}>
        Save
      </button>
    </>
  );
}

Read the docs.

Guides for every feature, a full API reference, and a playground to try each option.