30:T812,function nbs(selector = "[data-nb]", heading = "Notes") { return Generators.observe((notify) => { let headings = []; function observed() { let nbNum = 0; const h = Array.from(document.querySelectorAll(selector)); if (h.length !== headings.length || h.some((h, i) => headings[i] !== h)) { notify( html`${heading}

${Array.from((headings = h), (h) => { h.innerHTML = `[${++nbNum}]`; h.onclick = (e) => { e.preventDefault(); hashLinkCheck(e.target.href); }; let atag = Object.assign(html`${nbNum}.`, { onclick: (e) => (e.preventDefault(), h.scrollIntoView()) }); return html`

${atag} ${ document.getElementById(h.dataset.nb) ? document.getElementById(h.dataset.nb).innerHTML : "" }

`; })}` ); } } // >>> This little hack ensures the new target divs actually exist when the // generated html for a note reference is clicked, sending you to its note text. // This is (currently) required on the Observable platform itself to ensure // the back and forth links work for the note references and notes. function hashLinkCheck(hashLink) { let hashLinkChecks = 0; const hashLinkChecker = setInterval((checksLimit = 2) => { let div = document.getElementById( hashLink.substring(hashLink.indexOf("#") + 1) ); if (div) { div.scrollIntoView(); clearInterval(hashLinkChecker); } if (++hashLinkChecks >= checksLimit && !div) clearInterval(hashLinkChecker); // console.log(hashLinkChecks); // DEBUG }, 100); } // <<< const observer = new MutationObserver(observed); observer.observe(document.body, { childList: true, subtree: true }); observed(); return () => observer.disconnect(); }); }31:[] 2e:{"title":"NBS","cells":[{"id":0,"value":"md`# NBS\n#### *Numbered endnotes*\n\nBased on [@mbostock/toc](/@mbostock/toc), the \\`nbs()\\` function in this notebook automatically generates a set of numbered endnotes, with back and forth links, if you follow a few simple conventions.\n\nImport it with:\n\n\\`\\`\\`js\nimport {nbs} from \"@shadoof/nbs\"\n\\`\\`\\`\n\n---\n\n**How To Use It:**
\n*Here’s some text with notes:*`","pinned":false,"hidden":false,"mode":"ojs"},{"id":69,"value":"Laboris velit sint esse et. Laborum dolor proident pariatur est. Et voluptate ullamco ut fugiat. Consequat cupidatat ad id duis id sint aliquip. \n\nConsectetur elit culpa consequat qui tempor in cillum. Occaecat minim consequat consectetur ea aliqua mollit sunt. Consequat esse cupidatat incididunt est aliqua ipsum consectetur in ad fugiat anim eu duis. Elit cupidatat aliquip laboris voluptate quis exercitation aliquip elit dolor. \n\nPariatur nisi veniam sint Lorem duis in cillum sunt consectetur consequat dolore esse. Officia id nulla culpa aliquip nisi esse consectetur dolore ullamco. Fugiat minim ea dolore elit sint adipisicing ut laboris anim ut aliquip deserunt. Cillum aliquip voluptate enim labore sit nostrud duis. \n","pinned":true,"hidden":false,"mode":"md"},{"id":83,"value":"*And the following is the generated Notes cell:*","pinned":false,"hidden":false,"mode":"md"},{"id":30,"value":"nbs()","pinned":true,"hidden":false,"mode":"ojs"},{"id":201,"value":"*The following cell is where the texts of the notes are actually composed.*\n\n*The justification for this utility is that writers do not necessarily write texts or notes in a fixed order. Instead, we will make note references in our text from html tags with unique mnemonics as the value of a* `data-nb` *attribute, like this:*\n```\n\">\n```\n*Then make this value the* `id` *of a* `div` *that contains each note’s text. Now, the* NBS *utility will do any renumbering for you.*","pinned":false,"hidden":false,"mode":"md"},{"id":75,"value":"#### *Note Drafts*\n","pinned":true,"hidden":false,"mode":"md"},{"id":37,"value":"md`## Implementation`","pinned":false,"hidden":false,"mode":"ojs"},{"id":86,"value":"$30","pinned":true,"hidden":false,"mode":"ojs"}],"files":"$W31","stdlib":"1","titling":"auto"}