x
1
2
3
4
5
6
7
8
9
10
11
12
13
14
<button type="button" class="btn" data-testid="dialog-title-btn" commandfor="unique-id" command="show-modal"> Show Dialog</button><dialog aria-labelledby="dialog-title" class="open:flex overflow-visible flex-col p-0 bg-white shadow-lg backdrop:bg-gray-950/50 w-[36rem] rounded-lg m-auto" data-controller="dialog" data-action="close->dialog#reset" data-testid="dialog-title" id="unique-id"> <header class="px-6 pt-6 pb-3 flex gap-4 justify-between items-center bg-white rounded-t-lg"> <h1 id="dialog-title" data-testid="dialog-title" class="text-xl leading-6 font-semibold">Dialog Title</h1> <button aria-label="Close" class="text-secondary hover:text-primary" type="button" data-action="dialog#close"> <!-- Source: Iconoir, added via `bin/add_icon` --> <svg width="24" height="24" stroke-width="1.5" viewbox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" class="shrink-0" aria-hidden="true"> <path d="M6.75827 17.2426L12.0009 12M17.2435 6.75736L12.0009 12M12.0009 12L6.75827 6.75736M12.0009 12L17.2435 17.2426" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"></path> </svg> </button> </header> <div class="px-6 pt-3 flex-auto bg-white pb-6 rounded-b-lg" data-testid="dialog-body">Content</div></dialog>1
2
3
4
anchor_dialog(id:, title:, position:) do |c| c.with_show_button_content("Show Dialog") c.with_body_content(body_text)endNo notes provided.
| Param | Description | Input |
|---|---|---|
|
— |
|
|
|
— |
|
|
|
— |
|
|
|
— |
|