# Cloudlet

> Cloudlet (`@cloudlet/toast`) is a React notification stack that drifts in, stacks softly and opens into a card when it matters; every motion runs on springs and every frame is interruptible.

Every page is Markdown at its address plus `.md`; all of them in one file: https://cloudlet.dev/llms-full.txt.

## Getting started

- [Introduction](https://cloudlet.dev/toaster/docs.md): What Cloudlet is, how a notification lives in it, and what your application keeps deciding.
- [Installation](https://cloudlet.dev/toaster/docs/installation.md): Add Cloudlet from npm or the shadcn registry, check the peers, and import the CSS once.
- [Quick start](https://cloudlet.dev/toaster/docs/quick-start.md): Install Cloudlet, mount the Toaster and show the first notification.
- [Playground](https://cloudlet.dev/toaster/playground)

## Guides

- [Notifications & time](https://cloudlet.dev/toaster/docs/notifications.md): Show, update and dismiss notifications, what the stack holds, and how long each one stays.
- [Operations & cancellation](https://cloudlet.dev/toaster/docs/operations.md): Follow a promise to its result, retry or cancel it, and attach actions to a notification.
- [Forms](https://cloudlet.dev/toaster/docs/forms.md): Put one to three text fields in a notification and send them from the Island.
- [Positioning & offsets](https://cloudlet.dev/toaster/docs/positioning.md): Where the stack sits, how it avoids notches, navigation bars and the keyboard, when the Island opens on its own, and which element it renders into.
- [Styling](https://cloudlet.dev/toaster/docs/styling.md): Theme Cloudlet with tokens and class names, and try them in the Style editor.
- [SSR & Next.js](https://cloudlet.dev/toaster/docs/ssr.md): What renders on the server, who owns the controller, and complete setups for Next.js and Vite.
- [Content Security Policy](https://cloudlet.dev/toaster/docs/csp.md): Run Cloudlet under a strict Content Security Policy, pass the request's nonce to the Toaster, and set it up in the Next.js App Router.
- [Accessibility](https://cloudlet.dev/toaster/docs/accessibility.md): How the pill and the Island are named, announced and focused, and what is tested and what stays with you.

## Reference

- [createCloudlet](https://cloudlet.dev/toaster/docs/api/create-cloudlet.md): Create a controller, the object that owns every notification, its timing and its operations.
- [Controller](https://cloudlet.dev/toaster/docs/api/controller.md): Every method of the controller, what it accepts and the exact result it returns.
- [Toaster props](https://cloudlet.dev/toaster/docs/api/toaster.md): Every prop of the Toaster component, when it is read, and the provider and hook around it.
- [Labels & announcements](https://cloudlet.dev/toaster/docs/api/labels.md): Every text Cloudlet writes itself, where to localize it, and a complete translation.
- [Types](https://cloudlet.dev/toaster/docs/api/types.md): Every other public type, grouped as the contracts define them, with the page that uses it.