30:[] 2e:{"title":"TOC","cells":[{"id":0,"value":"md`# TOC\n\nThis notebook can generate a table of contents automatically for your notebook.\n\n\\`\\`\\`js\nimport {toc} from \"@harrystevens/toc\"\n\\`\\`\\`\n\nHere’s an example:`","pinned":false,"hidden":false,"mode":"ojs"},{"id":375,"value":"import { toc } from \"@harrystevens/toc\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":385,"value":"md`## _important: implementation currently broken, using fork above ^_`","pinned":false,"hidden":false,"mode":"ojs"},{"id":30,"value":"_toc({levels: [2,3,4,5,6], heading: \"Jump to:\"});","pinned":true,"hidden":false,"mode":"ojs"},{"id":124,"value":"_toc()","pinned":true,"hidden":false,"mode":"ojs"},{"id":172,"value":"import { Debug } from \"@trebor/debug-tool\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":175,"value":"viewof db = Debug()","pinned":true,"hidden":false,"mode":"ojs"},{"id":298,"value":"html`\n

1\n
- 2\n
  - 3\n
    - 4
    \n
  \n
`","pinned":true,"hidden":false,"mode":"ojs"},{"id":37,"value":"md`## Implementation`","pinned":false,"hidden":false,"mode":"ojs"},{"id":323,"value":"makeToc([\n {tagName: 'h1', textContent: '1', id: 'id'},\n {tagName: 'h2', textContent: '2', id: 'id'},\n {tagName: 'h3', textContent: '3', id: 'id'},\n {tagName: 'h5', textContent: '5', id: 'id'},\n {tagName: 'h4', textContent: '4', id: 'id'},\n {tagName: 'h2', textContent: '2', id: 'id'},\n {tagName: 'h4', textContent: '4', id: 'id'},\n])","pinned":true,"hidden":false,"mode":"ojs"},{"id":200,"value":"function makeToc(arr, prevLevel) {\n let stack = [...arr];\n const h = stack.shift();\n const {textContent, id, tagName} = h;\n const level = tagName.slice(1);\n\n const link = Object.assign(html`${DOM.text(textContent)}`, {onclick: e => (h.scrollIntoView())});\n const next = () => stack.length > 0 ? makeToc(stack, level) : '';\n \n // top-level\n if(!prevLevel) {\n return html`
- ${link}
`\n }\n\n const delta = level - prevLevel;\n // h +1? open a new ol, add an li\n // h ==? add a new li\n // h -1? close the ol, add an li\n\n if(delta === 1) {\n return html`
- ${link}
'.repeat(Math.abs(delta))}
${link}