react-toastify icon indicating copy to clipboard operation
react-toastify copied to clipboard

Show error in Toast Container

Open mk016 opened this issue 6 months ago • 0 comments

The ToastContainer example in the react-toastify documentation has a syntax error. The transition prop is incorrectly assigned using the colon : instead of the equals = sign, which causes a syntax error.

Incorrect Code Example <ToastContainer position="top-right" autoClose={5000} hideProgressBar={false} newestOnTop={false} closeOnClick rtl={false} pauseOnFocusLoss draggable pauseOnHover theme="light" transition: Bounce, /> {/* Same as */} <ToastContainer />

Correction The transition prop should be assigned using the equals = sign and the value should be enclosed in quotes.

Correct Code Example

<ToastContainer position="top-right" autoClose={5000} hideProgressBar={false} newestOnTop={false} closeOnClick rtl={false} pauseOnFocusLoss draggable pauseOnHover theme="light" transition="Bounce" /> {/* Same as */} <ToastContainer />

Steps to Reproduce Copy the incorrect code example from the documentation. Attempt to use it in a React component. Observe the syntax error related to the transition prop. Suggested Fix Update the documentation to use the correct syntax for the transition prop as shown in the correct code example above.

Screenshot 2024-08-06 at 1 05 35 PM Screenshot 2024-08-06 at 1 05 57 PM

mk016 avatar Aug 06 '24 07:08 mk016