Function join

Join multiple components, so that they can be applied as one component. Can reduce repetitive markup in many cases. If you specify a returnValue the new component will return it, else it will return the return value of the last joined component.

Example

import ( join, Actribute ) from 'deleight/actribute';

document.body.innerHTML = `
<div>I am not a component</div>
<main c-comp><p>I am inside a joined component</p></main>
<section>I am not a component</section>
 <article>I am not a component</article>
 `;

 const act = new Actribute();
 const comps = [];
 const baseComp = (node) => comps.push(node.tagName);
 const comp = join([baseComp, baseComp, baseComp]);
 act.register({ comp });

act.process(document.body);

 console.log(comps.length);  // 3
 console.log(comps[0]);      // "MAIN"
 console.log(comps[1]);      // "MAIN"
 console.log(comps[2]);      // "MAIN"
Copy