- Install elements-x,
$ npm install elements-X -D
- Import into your code to define all custom elements,
import 'elements-x
- Use it like html tags, e.g.
<x-clock run></x-clock>
<head>
<script type="module" src="https://unpkg.com/elements-x"></script>
</head>
<body>
<x-calendar></x-calendar>
</body>
/* To import all elements and define custom elements */
import 'elements-x';
/* To import and define all core elements */
import 'elements-x/dist/lib/core.umd.js';
/* To import and define all extended elements */
import 'elements-x/dist/lib/extended.umd.js';
/* To import and define only one element */
window.X = {override: true};
import { Calendar } from 'elements-x';
// import { Calendar } from './my-own-calendar';
customElements.define('x-calendar', Calendar);
- Calendar
- ComboBox (Input with dropdown)
- Dropdown (Display as dropdown underneath of input or button)
- File
- List (Show hierarchy and select from it)
- Map (Openlayer map)
- Masked (Input with mask)
- Pagination
- Resize
- SideBar
- Table (array of inputs, or table-structured inputs)
- BarCode
- Clock
- Highlight (Code syntax prettifier)
- Json (Collapsible JSON viewer)
- Monaco (Code editor)
- QRCode
- Stepper(form stepper)
- Formflow (Form flow diagram with Reactflow)
- Formdesigner (A page designer with GrapesJs)