{#
  Transient success toast.

  The toast itself is Penguin UI's stacking toast notification, used straight
  from the library — `penguinui-components/toast-notification/`, included
  unmodified by ui/base.html, which is also where the demo trigger buttons that
  ship in that file are dealt with. It listens for a `notify` window event.

  This file is only the trigger. The library fires `notify` from a button's
  x-on:click; here the server decides, so the trigger is an empty element that
  dispatches the same event as Alpine initialises it. Alpine initialises
  htmx-swapped markup too, so a fragment carrying this shows a toast when it
  lands.

    {% import "ui/toast.html" as toast %}
    {% call toast::success("Draft updated", message) %}{% endcall %}

  `title` and `message` travel as data attributes rather than interpolated into
  the JS, because Askama escapes an attribute value correctly and a message
  containing a quote or an apostrophe would otherwise break the expression.
#}
{% macro success(title, message) %}
<div hidden data-title="{{ title }}" data-message="{{ message }}"
     x-data
     x-init="$dispatch('notify', { variant: 'success', title: $el.dataset.title, message: $el.dataset.message })"></div>
{% endmacro %}