From fde00fb687cae6c0e0e16fb0b9870e04826b4fc9 Mon Sep 17 00:00:00 2001 From: Damien Flament Date: Mon, 20 May 2024 00:53:00 +0200 Subject: [PATCH 1/7] Add missing jsx-runtime.js Fixes #325 --- addons/van_jsx/src/jsx-runtime.js | 1 + 1 file changed, 1 insertion(+) create mode 100644 addons/van_jsx/src/jsx-runtime.js diff --git a/addons/van_jsx/src/jsx-runtime.js b/addons/van_jsx/src/jsx-runtime.js new file mode 100644 index 00000000..6d1e0ee8 --- /dev/null +++ b/addons/van_jsx/src/jsx-runtime.js @@ -0,0 +1 @@ +export * from "./index"; From 2a94032eebd5a5ee300dcf728f59816b1fea5c14 Mon Sep 17 00:00:00 2001 From: Damien Flament Date: Mon, 20 May 2024 01:33:10 +0200 Subject: [PATCH 2/7] Let style property be handled by setAttribute --- addons/van_jsx/src/createElement.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/addons/van_jsx/src/createElement.js b/addons/van_jsx/src/createElement.js index 16486003..b929bf02 100644 --- a/addons/van_jsx/src/createElement.js +++ b/addons/van_jsx/src/createElement.js @@ -1,6 +1,6 @@ import van from "vanjs-core"; import { setAttribute } from "./hyper"; -const createElement = (jsxTag, { children, style, ref, ...props }) => { +const createElement = (jsxTag, { children, ref, ...props }) => { if (typeof jsxTag === "string") { // TODO VanNode to VanElement const ele = van.tags[jsxTag](children); @@ -27,7 +27,7 @@ const createElement = (jsxTag, { children, style, ref, ...props }) => { return ele; } if (typeof jsxTag === "function") { - return jsxTag({ ...props, ref, style, children }); + return jsxTag({ ...props, ref, children }); } }; export default createElement; From c0b2900ca97e30e3972ee2e6c2722e3df7679cd8 Mon Sep 17 00:00:00 2001 From: Damien Flament Date: Mon, 20 May 2024 01:52:35 +0200 Subject: [PATCH 3/7] Destructure element properties only when necessary. When the *children* and *ref* properties don't exist in the properties object, destructuring initialize those variables to *undefined*. If the given *jsxTag* is a function (a component declared by the user), passing those properties make the resulting HTML element have those attributes rendered but with no value. --- addons/van_jsx/src/createElement.js | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/addons/van_jsx/src/createElement.js b/addons/van_jsx/src/createElement.js index b929bf02..4d8f4967 100644 --- a/addons/van_jsx/src/createElement.js +++ b/addons/van_jsx/src/createElement.js @@ -1,7 +1,8 @@ import van from "vanjs-core"; import { setAttribute } from "./hyper"; -const createElement = (jsxTag, { children, ref, ...props }) => { +const createElement = (jsxTag, allProps) => { if (typeof jsxTag === "string") { + const { children, ref, ...props } = allProps // TODO VanNode to VanElement const ele = van.tags[jsxTag](children); for (const [key, value] of Object.entries(props ?? {})) { @@ -27,7 +28,7 @@ const createElement = (jsxTag, { children, ref, ...props }) => { return ele; } if (typeof jsxTag === "function") { - return jsxTag({ ...props, ref, children }); + return jsxTag(allProps); } }; export default createElement; From 0b1708b2b6756687baaff13eae6d08e5ec7caa2e Mon Sep 17 00:00:00 2001 From: Damien Flament Date: Mon, 20 May 2024 01:53:24 +0200 Subject: [PATCH 4/7] Add missing jsxs function --- addons/van_jsx/src/index.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/addons/van_jsx/src/index.js b/addons/van_jsx/src/index.js index 2bf1dae9..80817875 100644 --- a/addons/van_jsx/src/index.js +++ b/addons/van_jsx/src/index.js @@ -2,4 +2,4 @@ import van from "vanjs-core"; export function createState(v) { return van.state(v); } -export { default as createElement, default as jsx, default as jsxDEV, } from "./createElement"; +export { default as createElement, default as jsx, default as jsxs, default as jsxDEV, } from "./createElement"; From 3e08b788f9a9593917bf63f2d3ddfc2bb6c25960 Mon Sep 17 00:00:00 2001 From: Damien Flament Date: Tue, 21 May 2024 23:00:17 +0200 Subject: [PATCH 5/7] Add missing jsxs function typing --- addons/van_jsx/src/index.d.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/addons/van_jsx/src/index.d.ts b/addons/van_jsx/src/index.d.ts index 14a10fa7..faae5849 100644 --- a/addons/van_jsx/src/index.d.ts +++ b/addons/van_jsx/src/index.d.ts @@ -2,5 +2,5 @@ import { State, StateView } from "vanjs-core"; export declare function createState(initialValue: T): State; export declare function createState(initialValue: T | null): StateView; export declare function createState(): State; -export { default as createElement, default as jsx, default as jsxDEV, } from "./createElement"; +export { default as createElement, default as jsx, default as jsxs, default as jsxDEV, } from "./createElement"; export * from "./type"; From 2234b760a6a77d55d828d30554680304fb9b5cfd Mon Sep 17 00:00:00 2001 From: Damien Flament Date: Wed, 22 May 2024 07:04:21 +0200 Subject: [PATCH 6/7] Add missing Fragment function. --- addons/van_jsx/src/index.js | 3 +++ 1 file changed, 3 insertions(+) diff --git a/addons/van_jsx/src/index.js b/addons/van_jsx/src/index.js index 80817875..b992ab24 100644 --- a/addons/van_jsx/src/index.js +++ b/addons/van_jsx/src/index.js @@ -2,4 +2,7 @@ import van from "vanjs-core"; export function createState(v) { return van.state(v); } +export function Fragment({children}) { + return children; +} export { default as createElement, default as jsx, default as jsxs, default as jsxDEV, } from "./createElement"; From 1d8646880a8bea5d110967e39afa192332c3c78e Mon Sep 17 00:00:00 2001 From: Damien Flament Date: Wed, 22 May 2024 07:07:13 +0200 Subject: [PATCH 7/7] Add missing Fragment function typing. Fixes #324. --- addons/van_jsx/src/index.d.ts | 1 + 1 file changed, 1 insertion(+) diff --git a/addons/van_jsx/src/index.d.ts b/addons/van_jsx/src/index.d.ts index faae5849..f222f5c7 100644 --- a/addons/van_jsx/src/index.d.ts +++ b/addons/van_jsx/src/index.d.ts @@ -2,5 +2,6 @@ import { State, StateView } from "vanjs-core"; export declare function createState(initialValue: T): State; export declare function createState(initialValue: T | null): StateView; export declare function createState(): State; +export declare function Fragment({ children }: { children?: VanNode | undefined }): VanNode | [VanNode] | undefined; export { default as createElement, default as jsx, default as jsxs, default as jsxDEV, } from "./createElement"; export * from "./type";