Le risorse JS sono condivise tra Core e Servizi: il bundle è generato da tutti i componenti del progetto, 08-servizi/ incluso — a differenza del CSS, che è splittato in core.css/servizi.css, il JS non ha un bundle “solo core” o “solo servizi” (vedi Bundle unico vs file singoli sotto). Componenti Servizi con JS proprio: 08-servizi/popover, 08-servizi/table-interactive.
I file js singoli sono inclusi nelle sezioni dei singoli componenti:
components/{PERCORSO}/{nome-componente}/{nome-componente}.js (sorgente)dist/{core|servizi}/components/raw/{nome-componente}/{nome-componente}.js (build)Un ambiente ospite ha due opzioni per integrare il JS dei componenti, a seconda dell’approccio scelto:
Bundle completo — un unico file generato da tutti i .js dei componenti (build-entries.js + webpack.config.js):
public/js/componentsJs.js
dist/{core|servizi}/js/componentsJs.jscomponentsJs.js - file js completo
Comodo per chi integra l’intero design system, ma carica anche il JS di componenti non usati.
File JS singoli per componente (vedi sopra) — un ambiente che integra solo alcuni componenti (es. solo accordion e tablist) può includere singolarmente questi file al posto del bundle completo, evitando di caricare JS di componenti non utilizzati.
I file js delle librerie figurano in:
dist/{core|servizi}/js/libraries/{nome-libreria}public/js/libraries/{nome-libreria}Libreria Splide.js per il componente carousel/slider.
Libreria Tobii.js per il componente lightbox.
Vedi anche documentazione Tobii.js
Libreria Accessible Autocomplete