2a:null 2b:["$","title",null,{"children":"Svelte | Adam Bouhenguel | Observable"}] 30:T542,function _compiler(options) { return function (strings, ...values) { // Replace values with random strings... and then preprocess to either replace them with properties OR values in require // TODO(adamb) Choose a gensymPrefix that doesn't exist ANYWHERE in strings const genSymPrefix = "gensym_923wedsojasjq_" const rawSyms = [] const symVals = {} let ix = 0 for (const value of values) { const sym = genSymPrefix + ix++ rawSyms.push(`"${sym}"`) symVals[sym] = value } const s = strings.reduce((prev, next, i) => `${prev}${next}${rawSyms[i] || ''}`, '') const name = (s.match(/^\s*\n\n\n\n\n\n\n`)\n","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":791,"value":"getComponent(m).refresh()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":152,"value":"nested = svelte`

...don't affect this element

`","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":137,"value":"render(svelte`\n\n\n\n

These styles...

\n`)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":950,"value":"render(svelte`\n\n\n\n\t\n\tvisible\n\n\n{#if visible}\n\t

\n\t\tFades in and out\n\t

\n{/if}\n`)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":380,"value":"md `### More advanced`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":383,"value":"function* exampleTicker() {\n yield Promise.resolve(new Date())\n while (true) {\n yield Promises.delay(1000, new Date());\n }\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":516,"value":"exampleInput = html``","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":393,"value":"render(svelte`\nThe time is now {$now}
\nThe value is {$value}`, {\n now: generatedPromises(exampleTicker),\n value: readableInput(exampleInput),\n})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":1045,"value":"_svelte_both`\n\n\n

Styled {l} {m}!

`.ssr.default.render({l: 10})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":340,"value":"md `---\n## Under the hood`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":346,"value":"_compiler({generate: 'ssr'})`\n\n\n\n

These styles...

\n`.js.code\n","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":1019,"value":"$30","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":85,"value":"load = {\n const requires = ({\n \"svelte/internal\": internal,\n \"svelte\": core,\n \"svelte/store\": store,\n \"svelte/transition\": transition,\n })\n return function(compiled) {\n const css = compiled.css\n const bundledRequires = compiled.requires || {}\n const fn = new Function('require', 'exports', compiled.js.code)\n const exports = {}\n fn.call(\n window,\n name => requires[name] || bundledRequires[name],\n exports,\n )\n exports[CSSTag] = css\n return exports\n }\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":825,"value":"CSSTag = Symbol(\"css\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":799,"value":"componentTag = Symbol(\"svelte-component\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":351,"value":"md`---\n## API`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":100,"value":"function render(component, props, target) {\n let t = target || DOM.element('div')\n const css = component[CSSTag]\n let style\n if (css !== undefined) {\n const head = document.getElementsByTagName('head')[0]\n style = DOM.element('style')\n head.appendChild(style)\n style.innerHTML = css.code\n }\n \n let c = new component.default({target: t, props})\n t[componentTag] = c\n return Generators.disposable(t, () => {\n c.$destroy()\n if (t[componentTag] === c) {\n delete t[componentTag]\n }\n t = undefined\n c = undefined\n if (style !== undefined && style.parentNode) {\n style.parentNode.removeChild(style)\n }\n })\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":802,"value":"function getComponent(element) {\n return element[componentTag]\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":95,"value":"function svelte(strings, ...values) {\n return load(_compiler({css: true})(strings, ...values))\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":1035,"value":"// Experimental\nfunction _svelte_ssr(strings, ...values) {\n return load(_compiler({css: true, generate: \"ssr\"})(strings, ...values))\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":1037,"value":"// Experimental\nfunction _svelte_both(strings, ...values) {\n return {\n dom: svelte(strings, ...values),\n ssr: _svelte_ssr(strings, ...values),\n }\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":584,"value":"readable = store.readable","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":585,"value":"writable = store.writable","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":587,"value":"derived = store.derived","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":591,"value":"get = store.get","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":608,"value":"function generatedPromises(gen, initialValue, ...args) {\n return store.readable(initialValue, set => {\n const g = gen(...args)\n let cancelled = false\n function afn({value, done}) {\n if (done) {\n return\n }\n value.then(v => {\n if (!cancelled) {\n set(v)\n afn(g.next())\n }\n })\n }\n afn(g.next())\n\n return () => {\n // console.log(\"cleaning up generatedPromises\", gen, g)\n cancelled = true\n g.return()\n }\n })\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":959,"value":"function derivedPromises(upstream, gen, initialValue) {\n return store.derived(upstream, (current, set) => {\n const g = gen(current)\n let cancelled = false\n function afn({value, done}) {\n if (done) {\n return\n }\n value.then(v => {\n if (!cancelled) {\n set(v)\n afn(g.next())\n }\n })\n }\n afn(g.next())\n\n return () => {\n // console.log(\"cleaning up derivedPromises\", upstream, gen, g)\n cancelled = true\n g.return()\n }\n }, initialValue)\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":611,"value":"function readableInput(input) {\n return generatedPromises(() => Generators.input(input), input.value)\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":594,"value":"function observe(observable) {\n return readable(observable.value, set => {\n const inputted = () => set(observable.value)\n observable.addEventListener('input', inputted)\n return () => observable.removeEventListener('input', inputted)\n })\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":990,"value":"md`---\n## Internals\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":989,"value":"// A dumb and inefficient require that happens to work for Svelte.\nfunction _require(path, map = {}) {\n const resolved = require.resolve(path)\n return require.load ?\n require.load(resolved) :\n resolved\n .then(p => fetch(p))\n .then(res => res.text())\n .then(src => {\n const module = new Function('exports', 'require', src);\n const windowShim = {}, exportsShim = {}, requireShim = path => map[path];\n return module.call(windowShim, exportsShim, requireShim), exportsShim;\n });\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":988,"value":"md`---\n## Dependencies\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":987,"value":"VERSION = '3.6.9'","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":4,"value":"compiler = require(`svelte@${VERSION}/compiler`);","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":848,"value":"internal = _require(`svelte@${VERSION}/internal/index`)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":979,"value":"core = _require(`svelte@${VERSION}/index`, {'./internal': internal})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":978,"value":"store = _require(`svelte@${VERSION}/store/index`, {'../internal': internal})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":977,"value":"easing = _require(`svelte@${VERSION}/transition/index`)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":929,"value":"transition = _require(`svelte@${VERSION}/transition/index`, {\n '../internal': internal,\n '../easing': easing,\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"}],"files":"$W31","stdlib":"1","titling":"auto"}} 2f:"$2e:body"