Package Exports
- @ppci/custom-dialog
This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (@ppci/custom-dialog) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.
Readme
Dialog
A simple full screen dialog
Table of contents
Installation
CDN
<script type='module' src="https://unpkg.com/@ppci/custom-dialog@1.0.0/index.js" />NPM
npm i @ppci/custom-dialogUsage
// Javascript import
import '@ppci/custom-dialog'<!-- or module import -->
<script type="module" src="https://unpkg.com/@ppci/custom-dialog@1.0.0/index.js" />
const onClose = (event) => {
// place click logic here
}
<custom-dialog
loading
open
@close=${onClose}>
<div>Place dialog content here</div>
</custom-dialog>Theme | Styling.
custom-dialog {
--theme-dialog-backdrop: white;
}Properties
| Property | Type | Description | Possible Values |
| *open* | boolean | Show or hide dialog |
```html
|
| loading | boolean | Show or hide loading indicator |
```html
|
| Slotted | |||
| Unnamed slot | string | html | Add dialog content here |
```html
This is slotted content
|
Events
| Name | Description | Detail / Payload |
| @close | Dialog close icon has been clicked | ```{ target: ..., currentTarget: ..., ... }``` |
Changelog
1.0.1 | 1.0.2 | 1.0.3
- Bundle and minify related fixes
1.0.0 ( Major )
- Initial version of the custom dialog.