<ipl-sidebar
v-model:is-open="sidebarOpen"
:persistent="persistent"
>
<div class="width-capped-content">
<ipl-space
color="light"
class="vertical-layout"
>
<div>Hello!</div>
<ipl-button
label="Button!"
/>
<ipl-button
label="Close sidebar"
color="red"
@click="sidebarOpen = false"
/>
</ipl-space>
</div>
</ipl-sidebar>
<ipl-button
label="Open sidebar"
@click="sidebarOpen = true"
/>
<ipl-dialog
v-model:is-open="dialogOpen"
style="width: 500px"
:persistent="persistent"
>
<div class="width-capped-content">
<ipl-space
color="light"
class="vertical-layout"
>
<div>Hello!</div>
<ipl-button
label="Button!"
/>
<ipl-button
label="Close dialog"
color="red"
@click="dialogOpen = false"
/>
</ipl-space>
</div>
</ipl-dialog>
<ipl-button
label="Open dialog"
@click="dialogOpen = true"
/>
esc
will close it without an animation (Chromium bug)