Sonner

An opinionated toast component for React.

@@directive("'use client'")

@react.component

About

Sonner is built and maintained by emilkowalski.

Installation

Run the following command:


npx shadcn@latest add @rescript-shadcn/Sonner

Add the Toaster component

app/layout.res

module RootLayout = {
  @react.component 
  let make = (~children) => 
    <html lang="en">
      <head />
      <body>
        <main>{children}</main>
        <Sonner />
      </body>
    </html>
}

Usage

Sonner.toast("Event has been created"->React.string)

Examples

Types

@@directive("'use client'")

type res = {name: string}

Description

@@directive("'use client'")

@react.component

Position

Use the position prop to change the position of the toast.

@@directive("'use client'")

@react.component

API Reference

See the Sonner API Reference for more information.