untitled

Modal Sample Usage

<Modal bind:open on:close={onClose}>
  <span slot="header">Modal Header</span>
  Modal Content With Close Button
</Modal>

Modal Additional Props

<Modal bind:open={open2} escapeable={false} duration={1000}>
  <span slot="header">Modal Header</span>
  Modal Content
  <Flex row gap={2} slot="footer">
    <Button on:click={cancel} type="info">Cancel</Button>
    <Button on:click={accept} type="success">Accept</Button>
    <Button on:click={decline} type="danger">Decline</Button>
  </Flex>
</Modal>

Modal with Alert

<Modal bind:open={alert} on:close={onClose} duration={300}>
  <Alert type="warning" slot="alert">Modal Header</Alert>
  Modal content With built-in close button
  <Flex row gap={2} slot="footer">
    <Button on:click={cancel} type="info" width={'100%'}>Cancel</Button>
    <Button on:click={accept} type="success" width={'100%'}>Confirm</Button>
  </Flex>
</Modal>