The ESL Web
Components Library

Speak with us

Exadel Smart Library (ESL) is our open-source framework-agnostic web components library that can be applied to any project. Front-end developers around the world use the ESL reusable web components to create websites, Chrome extensions, and even desktop applications. All ESL components can be easily customized to create a wide range of interactive content that works like a charm across a large variety of devices.

Get
Started

with ESL
for free on GitHub

Github repository

The ESL Reusable Web Components

Exadel Smart Library contains a number of ultra-light reusable UI components, each with multiple varieties along with utilities for additional development customization.

ESLImage

Take the headache out of showing images, and reduce data transfer with our automatic image displaying features including auto-formatting and device-friendly display; ESLImage also supports the lazy loading image technique

ESLMedia

Gain control of how video and audio content is played and displayed with our UI component library! ESLMedia, one of its core components, gives you the same API for different providers and includes helpers like lazy loading, active query, and cropping

ESLScrollbar

Display any large block of content in vertical or horizontal format with our scrollbar component. To create a custom scrollbar, you only need to customize this component with CSS, and it will look the same on any device, independent of the browser and operating system

ESLAlert

Show users dynamic notifications with our simple, yet powerful alert web component

ESLSelect

Use our custom form element to display lists of items with single and multiple sections

ESLSelectList

Display lists of items with single and multiple selections with our form-creation custom element

ESLToggleable

Show and hide content with our base container component, which supports a host of customizable options like timeouts, groups, and dynamic CSS classes, with out-of-the-box accessibility (ARIA) built-in

ESLTrigger

Change the state of ESLToggleable web components through hover, click and keyboard interactions, depending on the device; our component comes with a11ty out-of-the box

ESLPanel

Expand on your control of ESLToggleable through additional management options like collapse and expand animations and control over content height

ESLPanelGroup

Combine Panels into groups, that can create custom UI experiences like accordions and tabs for different content blocks, depending on the device your users are on

ESLTabs

Gain easy control over navigation for Tab elements including scrollable, grid, and other custom UX options

ESLA11tyGroup

Combine sets of controls on a page into manageable groups with specialized keyboard control and a11ty roles

new

ESLPopup

Expand on your ESLToggleable options with popups that automatically calculate their position based on predetermined anchors

new

ESLTooltip

Link helpful text to pages or elements with this addition to the ESLPopup interface

new

ESL Footnotes & ESL Note

Add automatically numbered, collected, and containered footnotes to any text, and gain control of where your footnote is displayed

ESL Utilities

We’ve built a set of helper modules that simplify the process of developing applications with our UI component library. The Exadel Smart Library utilities include:

ESL Traversing Query

A utility that supports simplified but powerful syntax that lets you find web components on pages — letting you define relationships, for example, between triggers and toggleables

ESL Media Query

A JS media query utility to support extended syntax to define conditions for devices and/or values per device type, screen size, or browser

ESL Base Element

Our base custom element wrapper, which comes with a set of common decorators for properties, that help you easily define UI component settings

ESLUtils

A range of additional features that includes tools for working with Objects, Arrays, and other formats, as well as commonly used typescript decorators and patterns

Why the ESL Web Components Library

Efficient

Our team has reduced the work needed to create reusable UI components by giving you a reliable base to customize and expand on for fast and accurate development

Light

We specially designed our reusable web components to work quickly and efficiently in browsers, cutting out the unnecessary code that takes a toll on user experience

Versatile

ESL doesn’t introduce any additional restrictions as it offers library and framework-agnostic web components that work with any tech stack of your choice

Powerful

While our web components may be small, they’re also universal, allowing you to mix and match them at will to create large components

Tested

We test all of our utilities with unit tests, which means every new addition works just as expected

Fast

With ESL, there’s no need to write lengthy markup — our reusable UI components are small, but they’re designed to be the optimal building blocks for your content

How can we help you?
Contact Us