diff --git a/package-lock.json b/package-lock.json index 7b892fb..bc422df 100644 --- a/package-lock.json +++ b/package-lock.json @@ -665,20 +665,19 @@ }, "packages/core": { "name": "swtl", - "version": "0.3.2", + "version": "0.3.3", "license": "ISC", "devDependencies": { - "@swtl/lit": "^0.1.4" + "@swtl/lit": "^0.1.5" } }, "packages/lit": { "name": "@swtl/lit", - "version": "0.1.4", + "version": "0.1.5", "license": "ISC", "dependencies": { "@lit-labs/ssr": "^3.2.2", - "@lit-labs/ssr-dom-shim": "^1.2.0", - "swtl": "^0.3.2" + "@lit-labs/ssr-dom-shim": "^1.2.0" }, "devDependencies": {} } diff --git a/packages/core/package.json b/packages/core/package.json index 6b8fad1..eec463c 100644 --- a/packages/core/package.json +++ b/packages/core/package.json @@ -1,6 +1,6 @@ { "name": "swtl", - "version": "0.3.2", + "version": "0.3.3", "description": "", "main": "index.js", "type": "module", @@ -8,7 +8,7 @@ "dev": "esbuild ./demo/sw.js --bundle --outfile=./demo/bundled-sw.js --watch --format=iife --servedir=demo", "start": "node --watch dev.js", "test": "node --test test/*.test.js", - "test:watch": "node --watch --test tests/tests.js", + "test:watch": "node --watch --test test/*.test.js", "lint:types": "tsc", "lint:types:watch": "tsc --watch" }, @@ -63,7 +63,7 @@ "author": "", "license": "ISC", "devDependencies": { - "@swtl/lit": "^0.1.4" + "@swtl/lit": "^0.1.5" }, "dependencies": {} } diff --git a/packages/core/render.js b/packages/core/render.js index 3933bca..4f0b82f 100644 --- a/packages/core/render.js +++ b/packages/core/render.js @@ -109,7 +109,11 @@ async function* handle(chunk, promises, customElementRenderers) { } else if (chunk?.kind === CUSTOM_ELEMENT_SYMBOL) { const renderer = customElementRenderers.find(r => r.match(chunk)) if (renderer) { - yield* renderer.render({...chunk, renderers: customElementRenderers}); + /** + * @param {AsyncIterable | Iterable} children + */ + const renderChildren = (children) => _render(children, promises, customElementRenderers); + yield* renderer.render(chunk, renderChildren); } } else if (chunk?.kind === COMPONENT_SYMBOL) { const children = []; diff --git a/packages/core/ssr/default.js b/packages/core/ssr/default.js index 7540df8..bf61b23 100644 --- a/packages/core/ssr/default.js +++ b/packages/core/ssr/default.js @@ -1,4 +1,3 @@ -import { render as swtlRender } from '../render.js'; import { DEFAULT_RENDERER_SYMBOL } from '../symbol.js'; /** @@ -14,22 +13,20 @@ import { DEFAULT_RENDERER_SYMBOL } from '../symbol.js'; * tag: string, * children: Children, * attributes: Attribute[], - * renderers: CustomElementRenderer[] * }} args + * @param {(children: Children) => AsyncGenerator} renderChildren */ -async function* render({ tag, children, attributes, renderers }) { +async function* render({ tag, children, attributes }, renderChildren) { const attrs = attributes.reduce((acc, { name, value }, index) => { const attribute = typeof value === 'boolean' && value ? name : `${name}="${value}"`; return index < attributes.length - 1 ? `${acc}${attribute} ` : `${acc}${attribute}`; }, ''); yield attrs.length ? `<${tag} ${attrs}>` : `<${tag}>`; - yield* swtlRender(children, renderers); + yield* renderChildren(children); yield ``; } -/** - * @type {CustomElementRenderer} - */ +/** @type {CustomElementRenderer} */ export const defaultRenderer = { name: DEFAULT_RENDERER_SYMBOL, match() { diff --git a/packages/core/types.ts b/packages/core/types.ts index da15254..9a868b8 100644 --- a/packages/core/types.ts +++ b/packages/core/types.ts @@ -33,7 +33,9 @@ export interface CustomElementRenderer { children: Children, attributes: Attribute[], renderers: CustomElementRenderer[] - }) => AsyncGenerator; + }, + renderChildren: (children: Children) => AsyncGenerator + ) => AsyncGenerator; } export type RouteResult = void | Promise | Response | Promise | HtmlResult | Promise; diff --git a/packages/lit/index.js b/packages/lit/index.js index fced152..883b4ee 100644 --- a/packages/lit/index.js +++ b/packages/lit/index.js @@ -1,8 +1,6 @@ import './dom-shim.js'; import { LitElementRenderer } from "@lit-labs/ssr/lib/lit-element-renderer.js"; import { getElementRenderer } from "@lit-labs/ssr/lib/element-renderer.js"; -import { render as swtlRender } from 'swtl/render.js'; - /** * @typedef {import('swtl').CustomElementRenderer} CustomElementRenderer @@ -14,13 +12,13 @@ import { render as swtlRender } from 'swtl/render.js'; /** * @param {{ -* tag: string, -* children: Children, -* attributes: Attribute[], -* renderers: CustomElementRenderer[] -* }} args -*/ -async function* render({ tag, children, attributes, renderers }) { + * tag: string, + * children: Children, + * attributes: Attribute[], + * }} args + * @param {(children: Children) => AsyncGenerator} renderChildren + */ +async function* render({ tag, children, attributes }, renderChildren) { const renderInfo = { elementRenderers: [LitElementRenderer], customElementInstanceStack: [], @@ -42,7 +40,7 @@ async function* render({ tag, children, attributes, renderers }) { // @ts-expect-error yield* renderer.renderShadow(renderInfo); yield ``; - yield* swtlRender(children, renderers); + yield* renderChildren(children); yield ``; } diff --git a/packages/lit/package.json b/packages/lit/package.json index 8ddecc3..145f0aa 100644 --- a/packages/lit/package.json +++ b/packages/lit/package.json @@ -1,6 +1,6 @@ { "name": "@swtl/lit", - "version": "0.1.4", + "version": "0.1.5", "description": "", "type": "module", "main": "index.js", @@ -15,8 +15,7 @@ "license": "ISC", "dependencies": { "@lit-labs/ssr": "^3.2.2", - "@lit-labs/ssr-dom-shim": "^1.2.0", - "swtl": "^0.3.2" + "@lit-labs/ssr-dom-shim": "^1.2.0" }, "devDependencies": {} }