Elemental Component #

Your regular HTMLElement (aka. Web Component) but on steroid 💪

Empower your web development with advanced custom elements 🚀

✅ Features #

• No DSL (Domain Specific Language) to learn... Use the regular JS & DOM APIs
• Create and manage custom elements with ease using ElementalComponent
• Streamline state management with StatefulElementalComponent and ValueObjects
• Flexibility to use the regular DOM or the powerful Shadow DOM
• Create reusable and inheritable HTML Templates for your components
• Supports Inheritance - Inherit and extend functionalities from parent elements with ease
• Manage native and custom events with ease
• Supports Decorators to reduce boilerplate code and make life even simpler
• And much more fun 😃

✍️ Basic Usage #

import { Component, ElementalComponent } from '@sohailalam2/elemental-web';

@Component()
export class Paragraph extends ElementalComponent {
  protected render(): void {
    // do something with the dom
  }
}

import { Component, ElementalComponent } from '@sohailalam2/elemental-web';

@Component()
export class Paragraph extends ElementalComponent {
  protected render(): void {
    // do something with the dom
  }
}