Support multiple <Toaster> elements

This might be outside of the scope for this project, but the ability to have multiple <Toaster> elements on a page (where toast() calls could have a ToasterID passed in) would be pretty cool and add a lot flexibility.

Example:

toast('This appears as a toast relative to the <div> parent', relativeToasterId)
toast('This appears as a normal toast')

...

return (
  <>
    <div>
      <Toaster id={relativeToasterId} />
    </div>

    <Toaster />
  </>
)

[mrmiguu]

https://github.com/timolins/react-hot-toast/pull/159 ☝️☝️☝️

This PR, if merged, essentially works like this:

toast('hello', { toasterId: 'unique-id-here' })

...

<Toaster toasterId="unique-id-here" />

This way, only that Toaster will be able to receive toasts to-and-from the string "unique-id-here".

[timolins]

Hi @mrmiguu! Great suggestion - considered this for v2, but decided not to do it atm.

Let’s use this issue to see how the demand is. 👍