0.1.3 • Published 1 year ago
tesla-components v0.1.3
Tesla components ·
Tesla components is a set of Web Components aimed at recreating the Tesla Web App.
- They have been created with Lit
- Some components extend Lion
- Project has been created with Vite
How to install
To use tesla components within your project, you will first need to install it as a dependency.
npm i tesla-components
How to use
VanillaJS
// Import your component
<script type="module">
import 'tesla-components'
</script>
// Use the component
<tesla-button variant="dark">
Lorem ipsum
</tesla-button>
<script>
const button = document.querySelector('tesla-button');
button.addEventListener('click', () => {
console.log('clicked');
})
</script>
Angular
// Import your component
// ...
import 'tesla-components'
@NgModule({
declarations: [/* ... */],
imports: [/* ... */],
schemas: [CUSTOM_ELEMENTS_SCHEMA]
})
export class AppModule {}
// Use the component
<tesla-button variant="dark"
(click)="clickHandler()"
>
Lorem ipsum
</tesla-button>
clickHandler() {
console.log('clicked');
}
React
// Use the component
<TeslaButtonReact
variant="dark"
onClick={() => (console.log('clicked'))}
></TeslaButtonReact>