Hole.js provides a diverse suite of web components made in TypeScript and Lit 🔌. These components are easy to configure and use 🧩, allowing you to modify the original design in a practical way. ✨ In addition, they can be seamlessly integrated into the most popular frameworks. 🚀
If you want to interact with the components, we have prepared a Demo.
Warning This package is under development and is not suitable for production environments due to possible changes in future versions. Thanks for your understanding. ❤️
To start using the suite of components it is necessary to install the package.
npm i @holejs/wcImport the component suite into your main input file. Generally the index.ts is used.
// Imports styles.
import '@holejs/wc/styles/elevations.css'
import '@holejs/wc/styles/colors.css'
// Import all components.
import '@holejs/wc'
// Import specific components.
import '@holejs/wc/button/button.js'
// Import via CDN's. (Not recommended for production environments)
import 'https://unpkg.com/@holejs/wc?module'
import 'https://unpkg.com/@holejs/[email protected]/dist/button.js?module'Once the components are imported, they can be used in the HTML file.
<hwc-button>Click me!</hwc-button>
<hwc-button appearance="outlined" color="orange-darken-2">Click me!</hwc-button>
<hwc-button appearance="text" color="#468D5A">Click me!</hwc-button>Bellow you can see the list of components that are currently available.
This project is licensed under the terms of the MIT license.