Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

The "dismissible" prop has no effect #434

Open
siiiiilvio opened this issue Jun 6, 2024 · 1 comment
Open

The "dismissible" prop has no effect #434

siiiiilvio opened this issue Jun 6, 2024 · 1 comment

Comments

@siiiiilvio
Copy link

siiiiilvio commented Jun 6, 2024

Describe the feature / bug 📝:

Using a variety of functions, such as toast() or toast.custom(), whether passing a jsx component or otherwise, adding the dismissible prop has no effect.

Steps to reproduce the bug 🔁:

  1. In terminal: npx create-react-app sonner && cd sonner
  2. npm i sonner
  3. In greenfield project (App.js):
import logo from './logo.svg';
import './App.css';
import { toast } from 'sonner';
import { Toaster } from 'sonner';

function App() {
  return (
    <div className="App">
      <Toaster />
      <header className="App-header">
        <img src={logo} className="App-logo" alt="logo" />
        <p>
          Edit <code>src/App.js</code> and save to reload.
        </p>
        <a
          className="App-link"
          href="https://reactjs.org"
          target="_blank"
          rel="noopener noreferrer"
        >
          Learn React
        </a>
        <button onClick={() => toast(<div>A custom toast with default styling</div>, { dismissible: false })}>Trigger toast</button>
      </header>
    </div>
  );
}

export default App;
  1. Click button.
  2. Toast is dismissed after default duration.
@axelhj
Copy link

axelhj commented Jun 7, 2024

I have the same issue at v1.4.41. I would prefer to not have to set duration as something very long just to have the toast stick around stay until being dismissed. (I know that sonner is opinionated and maybe this preference is not compatible with the vision). I checked the docs to make sure.

This bug concerns dismissible set as false though but the reproduction mentions the duration. I would like a dismissible prop with infinite duration. EDIT: Using { duration: Infinity } does seem to achieve this.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants