A library for writing Custom Elements with simple templates, reactivity, and full framework compatibility.
@lume/element is a JavaScript library that simplifies building Custom Elements (Web Components) with reactive properties, declarative templates, and scoped styling. It solves the complexity of vanilla Custom Elements APIs by providing a developer-friendly abstraction that works across all major frameworks.
Frontend developers building reusable UI components that need to work in multiple frameworks (React, Vue, Svelte, etc.) or vanilla web projects, especially those prioritizing web standards and cross-framework compatibility.
Developers choose @lume/element for its concise API, fine-grained reactivity without virtual DOM overhead, and seamless integration with any framework while maintaining full type safety and IDE support.
Fast and simple custom elements.
Open-Awesome is built by the community, for the community. Submit a project, suggest an awesome list, or help improve the catalog on GitHub.
Custom Elements work seamlessly in React, Vue, Svelte, and others with full type checking, enabling write-once, use-anywhere components as highlighted in the README.
Leverages Solid.js signals for declarative templates that update only changed DOM parts without virtual DOM diffing, ensuring efficient performance.
Supports JSX or Solid's html tag for readable templates, with reactive interpolation that automatically updates based on property changes.
Provides full autocompletion and intellisense in all major IDEs and framework templates, enhancing developer experience.
Decorators and JSX require compilation with TypeScript or Babel, adding setup complexity and a learning curve for teams avoiding build tools.
Relies on decorators not yet natively supported in browsers, forcing reliance on polyfills or builds, which the README admits as a temporary limitation.
Key sections like 'Install and Setup' are marked as stubs, requiring users to rely on community resources or trial-and-error for advanced configurations.