Toast · @behivetech · Behive Tech Registry

Edit the code and the preview updates as you type. Every registry export is in scope — Toast, showToast from this package, plus React hooks and every other component in the registry.

Playground

const BasicToast = () => (
  <>
    <button
      type="button"
      onClick={() =>
        showToast({ title: "Saved", description: "Your changes were saved." })
      }
    >
      Show info toast
    </button>
    <button
      type="button"
      onClick={() => showToast({ title: "Published", variant: "success" })}
    >
      Show success toast
    </button>
    <button
      type="button"
      onClick={() => showToast({ title: "Failed to save", variant: "error" })}
    >
      Show error toast
    </button>
    <button
      type="button"
      onClick={() =>
        showToast({
          title: "Structure moved",
          action: {
            label: "Undo",
            onClick: () => showToast({ title: "Move undone" }),
          },
        })
      }
    >
      Show toast with an action
    </button>
    <Toast />
  </>
);

render(<BasicToast />);