UI Components
Table of Content
UI Extensions
Vue Components
Abstract Design System
Abstract Design Systems (ADS) are an approach to User Interface (UI) implementation where developers are incentivized to use abstract UI component interfaces instead of directly using a specific Design System (DS).
The main benefit of such an approach is that it allows the possibility to switch the concrete DS use to display the UI.
For instance, users of Cristal can freely choose between Vuetify and Shoelace without programming efforts.
Note that supporting a new DS requires development efforts. Moreover, the goal of ADS is not to allow for the redefinition of the layout and positioning of visual elements, but to allow for the seamless integration of various DS inside Cristal.
See the new documentation.
| Component | Description | Vuetify | Shoelace |
|---|---|---|---|
| Alert |  | | |
| Avatar | | | |
| Breadcrumb | | | |
| btn | | | |
| card | | | |
| dialog | Also known as modal. | | |
| divider | | | |
| file input | | | |
| form | | | |
| img | | | |
| load | Component with no visual content. This is where CSS for a given design system must be loaded. | | |
| menu, menu-item, menu-label | | | |
| tab, tab group, tab panel | | | |
| textfield | | | |
| tree | Generic tree component. | | |
This project is being financed by the French State as part of the France 2030 program
Ce projet est financé par l’État Français dans le cadre de France 2030
