From f45179f9124fb002e910afb618911c79a4a1549f Mon Sep 17 00:00:00 2001 From: Hayleigh Thompson Date: Sun, 31 Mar 2024 10:56:36 +0100 Subject: =?UTF-8?q?=F0=9F=94=80=20Refactor=20vdom=20and=20add=20support=20?= =?UTF-8?q?for=20keyed=20vnodes.=20(#83)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * :truck: Keep around old vdom implementation for reference. * :sparkles: Add a keyed vdom node. * :alembic: Experiment with a different approach for handling component children. * :construction: Here be scary works in progress. * :sparkles: Implement keyed node diffing. * :recycle: Don't use deprecated 'isOk' checks. * :recycle: Remove separate Keyed node and add 'key' field to Element node. * :sparkles: Add support for server components into new vdom. * :bug: Fix broken build script. * :recycle: Don't emit data-lustre-key attributes for server component patches. * :package: Generate server component runtime. * :bug: Fixed a bug where server component keys were ambiguous when double digit. * :package: Generate server component runtime. * :recycle: Refactor 'keyed' element to force all children of a node to be keyed. * :memo: Consistently format '**Note**:'. * :bug: Fixed bug with falsey className/style/innerHTML attributes. * :bug: Fixed a bug not handling undefined 'prev' nodes correctly. * :package: Generate server component runtime. --- src/server-component.mjs | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) (limited to 'src/server-component.mjs') diff --git a/src/server-component.mjs b/src/server-component.mjs index 373f4cd..ab08801 100644 --- a/src/server-component.mjs +++ b/src/server-component.mjs @@ -136,13 +136,15 @@ export class LustreServerComponent extends HTMLElement { } morph(vdom) { - this.#root = morph(this.#root, vdom, (msg) => { + this.#root = morph(this.#root, vdom, (handler) => (event) => { + const msg = handler(event); this.#socket?.send(JSON.stringify([Constants.event, msg.tag, msg.data])); }); } diff([diff]) { - this.#root = patch(this.#root, diff, (msg) => { + this.#root = patch(this.#root, diff, (handler) => (event) => { + const msg = handler(event); this.#socket?.send(JSON.stringify([Constants.event, msg.tag, msg.data])); }); } -- cgit v1.2.3