diff options
author | 2021-04-30 16:33:35 -0500 | |
---|---|---|
committer | 2021-04-30 16:33:35 -0500 | |
commit | 4df1347156cf2632ea2f3475d3a5f8f08d197cc3 (patch) | |
tree | 9d50de89dfe62827c32a8a4046120af4ab61dc0c /src/frontend/render/renderer.ts | |
parent | 1d498facc8f78a3ffbfecd05cc6ecd45e8a4a1ae (diff) | |
download | astro-4df1347156cf2632ea2f3475d3a5f8f08d197cc3.tar.gz astro-4df1347156cf2632ea2f3475d3a5f8f08d197cc3.tar.zst astro-4df1347156cf2632ea2f3475d3a5f8f08d197cc3.zip |
Migrate to `yarn` monorepo (#157)
* chore: use monorepo
* chore: scaffold astro-scripts
* chore: move tests inside packages/astro
* chore: refactor tests, add scripts
* chore: move parser to own module
* chore: move runtime to packages/astro
* fix: move parser to own package
* test: fix prettier-plugin-astro tests
* fix: tests
* chore: update package-lock
* chore: add changesets
* fix: cleanup examples
* fix: starter example
* chore: update changeset config
* chore: update changeset config
* chore: setup changeset release workflow
* chore: bump lockfiles
* chore: prism => astro-prism
* fix: tsc --emitDeclarationOnly
* chore: final cleanup, switch to yarn
* chore: add lerna
* chore: update workflows to yarn
* chore: update workflows
* chore: remove lint workflow
* chore: add astro-dev script
* chore: add symlinked README
Diffstat (limited to 'src/frontend/render/renderer.ts')
-rw-r--r-- | src/frontend/render/renderer.ts | 61 |
1 files changed, 0 insertions, 61 deletions
diff --git a/src/frontend/render/renderer.ts b/src/frontend/render/renderer.ts deleted file mode 100644 index a5cc9d581..000000000 --- a/src/frontend/render/renderer.ts +++ /dev/null @@ -1,61 +0,0 @@ -import type { DynamicRenderContext, DynamicRendererGenerator, SupportedComponentRenderer, StaticRendererGenerator } from '../../@types/renderer'; -import { childrenToH } from './utils'; - -/** Initialize Astro Component renderer for Static and Dynamic components */ -export function createRenderer(renderer: SupportedComponentRenderer) { - const _static: StaticRendererGenerator = (Component) => renderer.renderStatic(Component); - const _imports = (context: DynamicRenderContext) => { - const values = Object.values(renderer.imports ?? {}) - .reduce((acc, v) => { - return [...acc, `{ ${v.join(', ')} }`]; - }, []) - .join(', '); - const libs = Object.keys(renderer.imports ?? {}) - .reduce((acc: string[], lib: string) => { - return [...acc, `import("${context.frameworkUrls[lib as any]}")`]; - }, []) - .join(','); - return `const [{${context.componentExport}: Component}, ${values}] = await Promise.all([import("${context.componentUrl}")${renderer.imports ? ', ' + libs : ''}]);`; - }; - const serializeProps = ({ children: _, ...props }: Record<string, any>) => JSON.stringify(props); - const createContext = () => { - const astroId = `${Math.floor(Math.random() * 1e16)}`; - return { ['data-astro-id']: astroId, root: `document.querySelector('[data-astro-id="${astroId}"]')`, Component: 'Component' }; - }; - const createDynamicRender: DynamicRendererGenerator = (wrapperStart, wrapperEnd) => (Component, renderContext) => { - const innerContext = createContext(); - return async (props, ...children) => { - let value: string; - try { - value = await _static(Component)(props, ...children); - } catch (e) { - value = ''; - } - value = `<div data-astro-id="${innerContext['data-astro-id']}" style="display:contents">${value}</div>`; - - const script = ` - ${typeof wrapperStart === 'function' ? wrapperStart(innerContext) : wrapperStart} - ${_imports(renderContext)} - ${renderer.render({ - ...innerContext, - props: serializeProps(props), - children: `[${childrenToH(renderer, children) ?? ''}]`, - childrenAsString: `\`${children}\``, - })} - ${typeof wrapperEnd === 'function' ? wrapperEnd(innerContext) : wrapperEnd} - `; - - return [value, `<script type="module">${script.trim()}</script>`].join('\n'); - }; - }; - - return { - static: _static, - load: createDynamicRender('(async () => {', '})()'), - idle: createDynamicRender('requestIdleCallback(async () => {', '})'), - visible: createDynamicRender( - 'const o = new IntersectionObserver(async ([entry]) => { if (!entry.isIntersecting) { return; } o.disconnect();', - ({ root }) => `}); Array.from(${root}.children).forEach(child => o.observe(child))` - ), - }; -} |