37 lines
901 B
YAML
37 lines
901 B
YAML
name: Modal
|
|
purpose: Present slotted content in a controllable Bootstrap modal.
|
|
|
|
binding:
|
|
behavior: Bind a boolean with $bind to show or hide the modal.
|
|
|
|
layout:
|
|
behavior: Long body content scrolls inside the modal; the header and footer remain visible.
|
|
|
|
state:
|
|
title: Default header title.
|
|
type: Bootstrap contextual type. Default is primary.
|
|
|
|
methods:
|
|
show: Show the Bootstrap modal.
|
|
hide: Hide the Bootstrap modal.
|
|
|
|
events:
|
|
change:
|
|
detail: false when the modal is hidden.
|
|
|
|
slots:
|
|
header: Replace the modal header.
|
|
body: Replace the modal body.
|
|
footer: Replace the modal footer.
|
|
|
|
examples:
|
|
basic: |
|
|
<Modal id="editModal" title="Edit user">
|
|
<div slot="body"><input id="nameInput"></div>
|
|
<div slot="footer"><button $onclick="editModal.hide()">Close</button></div>
|
|
</Modal>
|
|
<button $onclick="editModal.show()">Edit</button>
|
|
|
|
tests:
|
|
- Modal.test.html
|