0.0.10 • Published 4 months ago
course-clear v0.0.10
Course Clear
A small web component that opens a dialog with a fun animation similar to that in Super Mario Maker.
Install
Install from NPM with:
npm install course-clear
Usage
From JavaScript
Use the .open setter (or the attribute's) presence to open and close.
import { CourseClear } from "course-clear";
const courseClear = new CourseClear();
document.body.appendChild(courseClear);
courseClear.greeting = "My Greeting!";
courseClear.innerHTML = "In the dialog.";
courseClear.open = "My Greeting!";From HTML
Importing course-clear into a module will automatically define it as a custom HTML element. This is a side-effect of the import. After that, use it like a normal element. Toggle the open attribute to open or close. Add close-on-esc to support closing with the escape key.
<body>
<course-clear greeting="My Greeting!" open close-on-esc> In the dialog. </course-clear>
</body>