Drag to remove

You can drag the toast to remove it:

drag

Define the width percentage to remove the toast

You need to drag 80% of the toast width to remove it. This can be changed to fit your need:

  • Replace the default one:
<ToastContainer draggablePercent={60} />
  • Replace per toast:
toast('Hello', {
draggablePercent: 60
});

Disable it

  • Disable by default for all toast:
<ToastContainer draggable={false} />
  • Disable per toast:
toast('Hello', {
draggable: false
});

Drag vertically

If you want the notification to be draggable vertically instead of horizontally this is possible as well

Edit this page