Skip to main content

Components

SliDesk allows users to create their own components. For these to be taken into account, they must be in a "components" directory at the root of the presentation. A component consists of a ".mjs" file that can be dynamically imported by the javascript engine.

By convention, SliDesk often uses the syntax "!component()" to define a component. In the SliDesk example presentation, a "test" component is defined by the "test.mjs" file in the "components" directory:

export default (data) => {
let newData = data;
[...newData.matchAll(/!test\((.*)/g)].forEach((match) => {
newData = newData.replace(match[0], `Test: ${match[1]}`);
});
return newData;
};

The development of a component therefore consists of a function that takes a single "data" parameter, which will be the HTML code generated by the previous processes, and must return the new, modified HTML code.

In the example, !test(this is a test) will be replaced by Test: this is a test.