Dialog

<Button onclick={() => open = true}>Open dialog</Button>
<Dialog bind:open title="Hello" description="A simple modal.">
  <p>Body content goes here.</p>
</Dialog>

<Dialog bind:open title="Save changes?" description="Your work will be saved to the cloud.">
  <p>Body…</p>
  {#snippet footer()}
    <Button variant="ghost" onclick={() => open = false}>Cancel</Button>
    <Button onclick={() => open = false}>Save</Button>
  {/snippet}
</Dialog>

<Dialog bind:open size="lg" title="Wide dialog">…</Dialog>