Skip to content

Add dismiss toast button #355

@chelojimenez

Description

@chelojimenez

Issue

Help us add a X button that deletes toasts!

Image

How to fix

  1. The toast system is through sonner. Go to sonner.tsx and see how there's a Toaster component.
  2. Set the closeButton prop to true. The component should look have the below code
    <Sonner
      theme={theme as ToasterProps["theme"]}
      className="toaster group"
      closeButton={true}
      style={
        {
          "--normal-bg": "var(--popover)",
          "--normal-text": "var(--popover-foreground)",
          "--normal-border": "var(--border)",
        } as React.CSSProperties
      }
      {...props}
    />

First time contributing?

Please checkout our CONTRIBUTIONS.md for instructions on how to set up as a contributor.

Metadata

Metadata

Labels

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions