Creating a javascript file
To create a JavaScript file in a specific element folder (e.g. "organism," "molecule," or "atom"), follow these steps:
Determine which atom design folder you want to create the file in.
Examples of three javascript files in a specific atom, molecule, and organism folder:
src/patterns/01-atoms/misc/scroll-to-top-a/scroll-to-top-a-1/scroll-to-top-a-1.js
src/patterns/02-molecules/accordions/accordion-a/accordion-a-1.js
src/patterns/03-organisms/repeatable-custom/events-a/events-a-1/events-type-a-1.js
In your javascript file, make sure to add the class or function with the name of that file and export it:
class EventsTypeA {
//script goes here
}
export default eventsTypeA;
Next, go to the src/global/js/scripts.js file and import the javascript file under the proper comment (Organism, molecule or atom)
Example of an import:
import eventsTypeA from '../../patterns/03-organisms/repeatable-custom/events-a/events-a-1/events-type-a-1';
Inside src/global/js/scripts.js, add imported instance to the "module fire system" to ensure the script is fired on the page where the module is used.
const modules = {
eventsTypeA
}
As the final step, to fire the module when the page loads, add the following code to a HTML element: data-module="eventsTypeA"
Note : Read more about ECMAScript modules importing/exporting here.