Skip to main content

Introduction to WebJET Elements

WebJET Elements are a modern set of UI components built on web components. They provide encapsulated and reusable elements that you can use in pure HTML/JavaScript and in applications built on React or Vue.

Once the library is loaded, the components are registered as custom elements, so you can use them directly in the markup, for example as <wje-button>, <wje-card> or <wje-dialog>.

Start creating your application by installing WebJET elements.

Installation Guide

A detailed guide to installing WebJET elements.

Elements

Take a look at the library of available WebJET elements.

Layout

Find out how to create a page layout to suit your needs.

Editing styles

Learn how to easily customize your Elements visual.

Overview

WebJET Elements is a library of components for modern web applications and micro-frontend solutions. It is built on web platform standards, so it is not tied to a single framework or runtime model.

Key features of WebJET Elements:

Comprehensive set of user interface tools

WebJET Elements includes a wide range of controls and user interface components that are optimized for web interfaces. These components cover a variety of functions and are designed to be easily integrated into any web application.

You can use the components on their own or integrate them into projects in React and Vue. This simplifies adoption in both existing applications and hybrid architectures.

Stable and independent foundation

WebJET Elements uses standards such as Custom Elements, Shadow DOM and ES modules. Thanks to this, the components have a stable API and can be used for a long time even outside one particular framework.

Using Shadow DOM

WebJET Elements leverages the Shadow DOM and provides encapsulation of the style and behavior of its components, supporting a cleaner and more maintainable codebase.

Customisation and flexibility

The appearance of the components is customized mainly through CSS variables, ready light/dark themes and, where appropriate, CSS Shadow Parts.

Optimised for performance and reuse

The components are designed to be easily reusable, self-contained and work well in larger applications.

In the WebJET Elements documentation you will find detailed examples to help you create exceptional web applications quickly and efficiently.

License

Elements is a free and open source project, released under the MIT permissive license. This means that it can be used for free in personal or commercial projects. MIT is the same license used by such popular projects as jQuery and Ruby on Rails.

This documentation content (located in the WJ Elements repository) is licensed under the Apache 2. license.