feat(ui): #1807: add Toast v2 UI component

[VanishMax]

Closes #1807

Implements Toasts v2. The new API looks like this:

const ToastRenderer = () => {
  const openToast = useToast();

  const onOpen = () => {
    const toast = openToast({
      title: 'Re-rendering toast',
      actionType: 'destructive',
      description: 'This is a toast message. It will re-render in 2 second',
      icon: AlertCircle,
    });

    setTimeout(() => {
      toast.update({
        title: 'Re-rendering toast',
        icon: CheckCircle,
        actionType: 'accent',
        description: 'Wow, not it is updated!',
      });
    }, 2000);
  };

  return <Button onClick={onOpen}>Open re-rendering toast</Button>;
};

As you can see, this API supports not only opening toasts but also mutating their props dynamically.

[changeset-bot]

⚠️ No Changeset found

Latest commit: b0264f0

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

[github-actions]

Visit the preview URL for this PR (updated for commit b0264f0):

https://penumbra-ui-preview--pr1817-feat-toasts-v2-zd445xs6.web.app

_{(expires Mon, 07 Oct 2024 13:40:27 GMT)}

_{🔥 via Firebase Hosting GitHub Action 🌎}

_{Sign: 709d729610ef7a6369b23f1cb2b820a60cc685b1}