Alert Custom Action

<div class="btn-container">
  <button id="info" type="button" class="btn">Show Info Alert</button>
</div>

<sv-alert-stack swipe-dismiss></sv-alert-stack>

<script>
  const alertStack = document.querySelector("sv-alert-stack");
  const showInfoAlertButton = document.querySelector("#info");

  showInfoAlertButton.addEventListener("click", () => {
    const close = alertStack.create({
      severity: "info",
      title: "Your request has been processed",
      actionButton: {
        label: "Learn more",
        action: _event => {
          // window.location.href = "https://example.com";
          close();
        },
      },
    });
  });
</script>

15 collapsed lines
<style>
  .btn-container {
    display: flex;
    flex-direction: column;
  }

  .btn {
    padding: 0.5em 1em;
    color: var(--sb-note-text);
    cursor: pointer;
    background-color: var(--sb-note-background);
    border: solid 1px var(--sb-note-border);
    border-radius: 0.5em;
  }
</style>