assignmentToc = function({headers = 'h2,h3', toggle = true, open = false, title = 'Table of Contents', hideStartingFrom = null} = {}) { const tags = headers + ',mark.question,mark.challenge'; return Generators.observe((notify) => { let previousTags = []; let renderedEmptyToC = false; function observed() { const currentTags = Array.from(document.querySelectorAll(tags)); // Check if there's anything to render if (!currentTags.length) { if (!renderedEmptyToC) { notify(html`Unable to generate ToC: no specified tags found`); renderedEmptyToC = true; } return; } // Check if anything changed from the previous render, and if not, bail if ( currentTags.length === previousTags.length && !currentTags.some((tag, index) => previousTags[index] !== tag) ) { return; } renderedEmptyToC = false; // The start indentation specifies the top-most header tag that will // be unindented in the ToC, and is effectively the 2 in h2 let startIndentation = tags .split(',') .map((tag) => { return parseInt(tag.replace(/h/g, '')); }) .sort()[0]; // The current indentation tracks what level of indentation we're at, // so we can add

and tags as needed to get the ToC to // indend/unindent properly let currentIndentation; previousTags = currentTags; const entries = ['

'); currentIndentation++; } while (currentIndentation > nodeIndentation) { entries.push('

${DOM.text(tag.textContent)}
${DOM.text(tag.textContent)}

${title}

` : `

${title ? `${title}` : ``}` } ${entries} ${(toggle && title) ? `