ECL webcomponents is an implementation of the vanilla ECL components as vanilla web-components. All the available resources in ECL will be used to build the web-components, retrieving styles, scripts, resources like icons from the ECL packages and then used to produce the needed bundle for a specific component. This means that ECL webcomponents have dependencies on the ECL pacakges, therefore a package version need to be released before it can be used in this library. The components are written in typescript, using stencil and then bundled as vanilla webcomponents.
ECL webcomponents is on github as a public repository.
The library uses storybook as a UI development tool and as a website to showcase the components. The showcase includes controls to interact with the component and explore all the available features. The master branch is deployed on https://ecl-webcomponents.netlify.app/
The library is distributed on npm, in the @ecl
organisation, as a single package named @ecl/webcomponents
.
The distributed package contains all that is needed, including resources like images, icons, scripts, styles.
The main entrypoint for the library is a single js, in dist/ecl-webcomponents/ecl-webcomponents.esm.js
which enables
the usage of any of the custom elements exported, but only the ones really used will be loaded.
Everywhere the ECL visual identity needs to be used and there is javascript available, basically. Vanilla web-components are widely supported, only old browser might not be capable of using them, for this polyfills exists, but at the moment there is no clear definition of the browsers to support.
We release two packages which are meant to offer a seamless usage of the library in React and Angular.