Make it possible to replace a toast whilst keeping its position in the stack

[MathiasWP]

Describe the feature

It would be nice if it was possible to replace a toast with a different one, similar to how toast.promise replaces the loading toast with a success or error toast.

Having this functionality would make it helpful to implement a more sophisticated stack of toasts, eg if you want to show a loader toast and then separate error/success/info toasts based on the outcome.

For example, we have multiple locations where an operation consists of making multiple calls to a server, but for the user it behaves as one transaction, so we want to show only one loading toast and then separate error messages based on where the operation failed.

[jaycdev]

Isn't this possible by updating the toastId of that toast?

<script>
	async function onClick() {
		const toastId = Math.random();
		toast.loading(`Loading with ${toastId}`, {id: toastId});
		await new Promise(resolve => setTimeout(resolve, 4000));
		toast.warning(`Warning with ${toastId}`, {id: toastId});
		await new Promise(resolve => setTimeout(resolve, 4000));
		toast.error(`Error with ${toastId}`, {id: toastId});
	}
</script>

<Button on:click={onClick}>Click me!</Button>

Click the button several times with delays and you'll see the toasts change to loading, warning and error with their respective id/text, while staying in the same position

[CNSeniorious000]

But this way it won't have the transition animation like toast.promise

#109