31:[] 2f:{"title":"Hello, @nanostores/query!","cells":[{"id":0,"value":"# Hello, @nanostores/query!","pinned":false,"hidden":false,"mode":"md"},{"id":14,"value":"nanoqueryContext = nanoquery.nanoquery({\n fetcher: n => fetch(`https://api.hnpwa.com/v0/news/${n}.json`).then(r => r.json()),\n cacheLifetime: 10000,\n})","pinned":true,"hidden":false,"mode":"ojs"},{"id":17,"value":"viewof page = Inputs.number([1, 10], {\n label: 'Page #',\n value: 1,\n})","pinned":true,"hidden":false,"mode":"ojs"},{"id":59,"value":"fetcherStore = nanoqueryContext[0]([pageIdxStore])","pinned":true,"hidden":false,"mode":"ojs"},{"id":80,"value":"{\n if (currentPage.data) {\n return html`Page ${pageIdx}:

${x.title} ${x.points}p

`\n }\n if (currentPage.loading) {\n return html`

Loading

`\n }\n if (currentPage.error) {\n return html`

Error: ${currentPage.error}

`\n }\n return html`?`\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":85,"value":"---","pinned":false,"hidden":false,"mode":"md"},{"id":22,"value":"pageIdxStore = {\n // bind to observable\n const store = nanostores.atom(1)\n function handler() {\n store.set(viewof page.value)\n }\n viewof page.addEventListener('input', handler)\n invalidation.then(() => viewof page.removeEventListener('input', handler))\n return store\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":65,"value":"pageIdx = storeToAsyncIter(pageIdxStore)","pinned":true,"hidden":false,"mode":"ojs"},{"id":61,"value":"currentPage = storeToAsyncIter(fetcherStore)","pinned":true,"hidden":false,"mode":"ojs"},{"id":26,"value":"function storeToAsyncIter(store) {\n return Generators.observe(store.subscribe)\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":12,"value":"---","pinned":false,"hidden":false,"mode":"md"},{"id":5,"value":"nanostores = import('https://esm.sh/nanostores')","pinned":true,"hidden":false,"mode":"ojs"},{"id":8,"value":"nanoquery = import('https://esm.sh/@nanostores/query')","pinned":true,"hidden":false,"mode":"ojs"}],"files":"$W31","stdlib":"1","titling":"auto"}