Modal
<script lang="ts">
import { Modal, Portal, Card } from 'stwui';
let open = false;
function openModal() {
open = true;
}
function closeModal() {
open = false;
}
</script>
<Button type="primary" on:click={openModal}>Open Modal</Button>
<Portal>
{#if open}
<Modal handleClose={closeModal}>
<Modal.Content slot="content">
<Card>
<Card.Header slot="header">Modal</Card.Header>
<Card.Content slot="content">I am the content</Card.Content>
</Card>
</Modal.Content>
</Modal>
{/if}
</Portal>
Modal Props
handleClose | () => void |
Modal Slots
backdrop | <Modal.Backdrop slot="backdrop" /> |
content | <Modal.Content slot="content" /> |
default |
Modal.Backdrop Props
handleClose | () => void |
Modal.Content Slots
default |