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:

/**
 * This is the document which will be shown in your slidesk.link page
 *
 * You can write it in MarkDown.
 */
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.