solid-js 1.5.7 → 1.6.0-beta.0

package/dist/dev.cjs

@@ -682,7 +682,9 @@ function updateComputation(node) {
     queueMicrotask(() => {
       runUpdates(() => {
         Transition && (Transition.running = true);
+        Listener = Owner = node;
         runComputation(node, node.tValue, time);
+        Listener = Owner = null;
       }, false);
     });
   }
@@ -1257,29 +1259,41 @@ function resolveSource(s) {
   return (s = typeof s === "function" ? s() : s) == null ? {} : s;
 }
 function mergeProps(...sources) {
-  return new Proxy({
-    get(property) {
-      for (let i = sources.length - 1; i >= 0; i--) {
-        const v = resolveSource(sources[i])[property];
-        if (v !== undefined) return v;
-      }
-    },
-    has(property) {
-      for (let i = sources.length - 1; i >= 0; i--) {
-        if (property in resolveSource(sources[i])) return true;
+  if (sources.some(s => s && ($PROXY in s || typeof s === "function"))) {
+    return new Proxy({
+      get(property) {
+        for (let i = sources.length - 1; i >= 0; i--) {
+          const v = resolveSource(sources[i])[property];
+          if (v !== undefined) return v;
+        }
+      },
+      has(property) {
+        for (let i = sources.length - 1; i >= 0; i--) {
+          if (property in resolveSource(sources[i])) return true;
+        }
+        return false;
+      },
+      keys() {
+        const keys = [];
+        for (let i = 0; i < sources.length; i++) keys.push(...Object.keys(resolveSource(sources[i])));
+        return [...new Set(keys)];
       }
-      return false;
-    },
-    keys() {
-      const keys = [];
-      for (let i = 0; i < sources.length; i++) keys.push(...Object.keys(resolveSource(sources[i])));
-      return [...new Set(keys)];
+    }, propTraps);
+  }
+  const target = {};
+  for (let i = 0; i < sources.length; i++) {
+    if (sources[i]) {
+      const descriptors = Object.getOwnPropertyDescriptors(sources[i]);
+      Object.defineProperties(target, descriptors);
     }
-  }, propTraps);
+  }
+  return target;
 }
 function splitProps(props, ...keys) {
   const blocked = new Set(keys.flat());
   const descriptors = Object.getOwnPropertyDescriptors(props);
+  const isProxy = ($PROXY in props);
+  if (!isProxy) keys.push(Object.keys(descriptors).filter(k => !blocked.has(k)));
   const res = keys.map(k => {
     const clone = {};
     for (let i = 0; i < k.length; i++) {
@@ -1295,17 +1309,19 @@ function splitProps(props, ...keys) {
     }
     return clone;
   });
-  res.push(new Proxy({
-    get(property) {
-      return blocked.has(property) ? undefined : props[property];
-    },
-    has(property) {
-      return blocked.has(property) ? false : property in props;
-    },
-    keys() {
-      return Object.keys(props).filter(k => !blocked.has(k));
-    }
-  }, propTraps));
+  if (isProxy) {
+    res.push(new Proxy({
+      get(property) {
+        return blocked.has(property) ? undefined : props[property];
+      },
+      has(property) {
+        return blocked.has(property) ? false : property in props;
+      },
+      keys() {
+        return Object.keys(props).filter(k => !blocked.has(k));
+      }
+    }, propTraps));
+  }
   return res;
 }
 function lazy(fn) {

package/dist/dev.js

@@ -678,7 +678,9 @@ function updateComputation(node) {
     queueMicrotask(() => {
       runUpdates(() => {
         Transition && (Transition.running = true);
+        Listener = Owner = node;
         runComputation(node, node.tValue, time);
+        Listener = Owner = null;
       }, false);
     });
   }
@@ -1253,29 +1255,41 @@ function resolveSource(s) {
   return (s = typeof s === "function" ? s() : s) == null ? {} : s;
 }
 function mergeProps(...sources) {
-  return new Proxy({
-    get(property) {
-      for (let i = sources.length - 1; i >= 0; i--) {
-        const v = resolveSource(sources[i])[property];
-        if (v !== undefined) return v;
-      }
-    },
-    has(property) {
-      for (let i = sources.length - 1; i >= 0; i--) {
-        if (property in resolveSource(sources[i])) return true;
+  if (sources.some(s => s && ($PROXY in s || typeof s === "function"))) {
+    return new Proxy({
+      get(property) {
+        for (let i = sources.length - 1; i >= 0; i--) {
+          const v = resolveSource(sources[i])[property];
+          if (v !== undefined) return v;
+        }
+      },
+      has(property) {
+        for (let i = sources.length - 1; i >= 0; i--) {
+          if (property in resolveSource(sources[i])) return true;
+        }
+        return false;
+      },
+      keys() {
+        const keys = [];
+        for (let i = 0; i < sources.length; i++) keys.push(...Object.keys(resolveSource(sources[i])));
+        return [...new Set(keys)];
       }
-      return false;
-    },
-    keys() {
-      const keys = [];
-      for (let i = 0; i < sources.length; i++) keys.push(...Object.keys(resolveSource(sources[i])));
-      return [...new Set(keys)];
+    }, propTraps);
+  }
+  const target = {};
+  for (let i = 0; i < sources.length; i++) {
+    if (sources[i]) {
+      const descriptors = Object.getOwnPropertyDescriptors(sources[i]);
+      Object.defineProperties(target, descriptors);
     }
-  }, propTraps);
+  }
+  return target;
 }
 function splitProps(props, ...keys) {
   const blocked = new Set(keys.flat());
   const descriptors = Object.getOwnPropertyDescriptors(props);
+  const isProxy = ($PROXY in props);
+  if (!isProxy) keys.push(Object.keys(descriptors).filter(k => !blocked.has(k)));
   const res = keys.map(k => {
     const clone = {};
     for (let i = 0; i < k.length; i++) {
@@ -1291,17 +1305,19 @@ function splitProps(props, ...keys) {
     }
     return clone;
   });
-  res.push(new Proxy({
-    get(property) {
-      return blocked.has(property) ? undefined : props[property];
-    },
-    has(property) {
-      return blocked.has(property) ? false : property in props;
-    },
-    keys() {
-      return Object.keys(props).filter(k => !blocked.has(k));
-    }
-  }, propTraps));
+  if (isProxy) {
+    res.push(new Proxy({
+      get(property) {
+        return blocked.has(property) ? undefined : props[property];
+      },
+      has(property) {
+        return blocked.has(property) ? false : property in props;
+      },
+      keys() {
+        return Object.keys(props).filter(k => !blocked.has(k));
+      }
+    }, propTraps));
+  }
   return res;
 }
 function lazy(fn) {

package/dist/solid.cjs

@@ -621,7 +621,9 @@ function updateComputation(node) {
     queueMicrotask(() => {
       runUpdates(() => {
         Transition && (Transition.running = true);
+        Listener = Owner = node;
         runComputation(node, node.tValue, time);
+        Listener = Owner = null;
       }, false);
     });
   }
@@ -1171,29 +1173,41 @@ function resolveSource(s) {
   return (s = typeof s === "function" ? s() : s) == null ? {} : s;
 }
 function mergeProps(...sources) {
-  return new Proxy({
-    get(property) {
-      for (let i = sources.length - 1; i >= 0; i--) {
-        const v = resolveSource(sources[i])[property];
-        if (v !== undefined) return v;
-      }
-    },
-    has(property) {
-      for (let i = sources.length - 1; i >= 0; i--) {
-        if (property in resolveSource(sources[i])) return true;
+  if (sources.some(s => s && ($PROXY in s || typeof s === "function"))) {
+    return new Proxy({
+      get(property) {
+        for (let i = sources.length - 1; i >= 0; i--) {
+          const v = resolveSource(sources[i])[property];
+          if (v !== undefined) return v;
+        }
+      },
+      has(property) {
+        for (let i = sources.length - 1; i >= 0; i--) {
+          if (property in resolveSource(sources[i])) return true;
+        }
+        return false;
+      },
+      keys() {
+        const keys = [];
+        for (let i = 0; i < sources.length; i++) keys.push(...Object.keys(resolveSource(sources[i])));
+        return [...new Set(keys)];
       }
-      return false;
-    },
-    keys() {
-      const keys = [];
-      for (let i = 0; i < sources.length; i++) keys.push(...Object.keys(resolveSource(sources[i])));
-      return [...new Set(keys)];
+    }, propTraps);
+  }
+  const target = {};
+  for (let i = 0; i < sources.length; i++) {
+    if (sources[i]) {
+      const descriptors = Object.getOwnPropertyDescriptors(sources[i]);
+      Object.defineProperties(target, descriptors);
     }
-  }, propTraps);
+  }
+  return target;
 }
 function splitProps(props, ...keys) {
   const blocked = new Set(keys.flat());
   const descriptors = Object.getOwnPropertyDescriptors(props);
+  const isProxy = ($PROXY in props);
+  if (!isProxy) keys.push(Object.keys(descriptors).filter(k => !blocked.has(k)));
   const res = keys.map(k => {
     const clone = {};
     for (let i = 0; i < k.length; i++) {
@@ -1209,17 +1223,19 @@ function splitProps(props, ...keys) {
     }
     return clone;
   });
-  res.push(new Proxy({
-    get(property) {
-      return blocked.has(property) ? undefined : props[property];
-    },
-    has(property) {
-      return blocked.has(property) ? false : property in props;
-    },
-    keys() {
-      return Object.keys(props).filter(k => !blocked.has(k));
-    }
-  }, propTraps));
+  if (isProxy) {
+    res.push(new Proxy({
+      get(property) {
+        return blocked.has(property) ? undefined : props[property];
+      },
+      has(property) {
+        return blocked.has(property) ? false : property in props;
+      },
+      keys() {
+        return Object.keys(props).filter(k => !blocked.has(k));
+      }
+    }, propTraps));
+  }
   return res;
 }
 function lazy(fn) {

package/dist/solid.js

@@ -617,7 +617,9 @@ function updateComputation(node) {
     queueMicrotask(() => {
       runUpdates(() => {
         Transition && (Transition.running = true);
+        Listener = Owner = node;
         runComputation(node, node.tValue, time);
+        Listener = Owner = null;
       }, false);
     });
   }
@@ -1167,29 +1169,41 @@ function resolveSource(s) {
   return (s = typeof s === "function" ? s() : s) == null ? {} : s;
 }
 function mergeProps(...sources) {
-  return new Proxy({
-    get(property) {
-      for (let i = sources.length - 1; i >= 0; i--) {
-        const v = resolveSource(sources[i])[property];
-        if (v !== undefined) return v;
-      }
-    },
-    has(property) {
-      for (let i = sources.length - 1; i >= 0; i--) {
-        if (property in resolveSource(sources[i])) return true;
+  if (sources.some(s => s && ($PROXY in s || typeof s === "function"))) {
+    return new Proxy({
+      get(property) {
+        for (let i = sources.length - 1; i >= 0; i--) {
+          const v = resolveSource(sources[i])[property];
+          if (v !== undefined) return v;
+        }
+      },
+      has(property) {
+        for (let i = sources.length - 1; i >= 0; i--) {
+          if (property in resolveSource(sources[i])) return true;
+        }
+        return false;
+      },
+      keys() {
+        const keys = [];
+        for (let i = 0; i < sources.length; i++) keys.push(...Object.keys(resolveSource(sources[i])));
+        return [...new Set(keys)];
       }
-      return false;
-    },
-    keys() {
-      const keys = [];
-      for (let i = 0; i < sources.length; i++) keys.push(...Object.keys(resolveSource(sources[i])));
-      return [...new Set(keys)];
+    }, propTraps);
+  }
+  const target = {};
+  for (let i = 0; i < sources.length; i++) {
+    if (sources[i]) {
+      const descriptors = Object.getOwnPropertyDescriptors(sources[i]);
+      Object.defineProperties(target, descriptors);
     }
-  }, propTraps);
+  }
+  return target;
 }
 function splitProps(props, ...keys) {
   const blocked = new Set(keys.flat());
   const descriptors = Object.getOwnPropertyDescriptors(props);
+  const isProxy = ($PROXY in props);
+  if (!isProxy) keys.push(Object.keys(descriptors).filter(k => !blocked.has(k)));
   const res = keys.map(k => {
     const clone = {};
     for (let i = 0; i < k.length; i++) {
@@ -1205,17 +1219,19 @@ function splitProps(props, ...keys) {
     }
     return clone;
   });
-  res.push(new Proxy({
-    get(property) {
-      return blocked.has(property) ? undefined : props[property];
-    },
-    has(property) {
-      return blocked.has(property) ? false : property in props;
-    },
-    keys() {
-      return Object.keys(props).filter(k => !blocked.has(k));
-    }
-  }, propTraps));
+  if (isProxy) {
+    res.push(new Proxy({
+      get(property) {
+        return blocked.has(property) ? undefined : props[property];
+      },
+      has(property) {
+        return blocked.has(property) ? false : property in props;
+      },
+      keys() {
+        return Object.keys(props).filter(k => !blocked.has(k));
+      }
+    }, propTraps));
+  }
   return res;
 }
 function lazy(fn) {

package/html/dist/html.cjs

@@ -196,7 +196,7 @@ function createHTML(r, {
       templates[i].innerHTML = html[i];
       const nomarkers = templates[i].content.querySelectorAll("script,style");
       for (let j = 0; j < nomarkers.length; j++) {
-        const d = nomarkers[j].firstChild.data || "";
+        const d = nomarkers[j].firstChild?.data || "";
         if (d.indexOf(marker) > -1) {
           const parts = d.split(marker).reduce((memo, p, i) => {
             i && memo.push("");
@@ -405,15 +405,35 @@ function createHTML(r, {
       const isSVG = r.SVGElements.has(node.name);
       const isCE = node.name.includes("-");
       options.hasCustomElement = isCE;
-      for (let i = 0; i < keys.length; i++) {
-        const name = keys[i],
-              value = node.attrs[name];
-        if (value.includes("###")) {
-          delete node.attrs[name];
-          parseAttribute(tag, name, value, isSVG, isCE, options);
-        } else if (name === "###") {
-          delete node.attrs[name];
-          options.exprs.push(`r.spread(${tag},exprs[${options.counter++}],${isSVG},${!!node.children.length})`);
+      if (keys.includes("###")) {
+        const spreadArgs = [];
+        let current = "";
+        for (let i = 0; i < keys.length; i++) {
+          const name = keys[i],
+                value = node.attrs[name];
+          if (value.includes("###")) {
+            let count = options.counter++;
+            current += `${name}: ${name !== "ref" ? `typeof exprs[${count}] === "function" ? exprs[${count}]() : ` : ""}exprs[${count}],`;
+            delete node.attrs[name];
+          } else if (name === "###") {
+            if (current.length) {
+              spreadArgs.push(`()=>({${current}})`);
+              current = "";
+            }
+            spreadArgs.push(`exprs[${options.counter++}]`);
+            delete node.attrs[name];
+          }
+        }
+        if (current.length) spreadArgs.push(`()=>({${current}})`);
+        options.exprs.push(`r.spread(${tag},${spreadArgs.length === 1 ? `typeof ${spreadArgs[0]} === "function" ? r.mergeProps(${spreadArgs[0]}) : ${spreadArgs[0]}` : `r.mergeProps(${spreadArgs.join(",")})`},${isSVG},${!!node.children.length})`);
+      } else {
+        for (let i = 0; i < keys.length; i++) {
+          const name = keys[i],
+                value = node.attrs[name];
+          if (value.includes("###")) {
+            delete node.attrs[name];
+            parseAttribute(tag, name, value, isSVG, isCE, options);
+          }
         }
       }
       options.path = tag;

package/html/dist/html.js

@@ -194,7 +194,7 @@ function createHTML(r, {
       templates[i].innerHTML = html[i];
       const nomarkers = templates[i].content.querySelectorAll("script,style");
       for (let j = 0; j < nomarkers.length; j++) {
-        const d = nomarkers[j].firstChild.data || "";
+        const d = nomarkers[j].firstChild?.data || "";
         if (d.indexOf(marker) > -1) {
           const parts = d.split(marker).reduce((memo, p, i) => {
             i && memo.push("");
@@ -403,15 +403,35 @@ function createHTML(r, {
       const isSVG = r.SVGElements.has(node.name);
       const isCE = node.name.includes("-");
       options.hasCustomElement = isCE;
-      for (let i = 0; i < keys.length; i++) {
-        const name = keys[i],
-              value = node.attrs[name];
-        if (value.includes("###")) {
-          delete node.attrs[name];
-          parseAttribute(tag, name, value, isSVG, isCE, options);
-        } else if (name === "###") {
-          delete node.attrs[name];
-          options.exprs.push(`r.spread(${tag},exprs[${options.counter++}],${isSVG},${!!node.children.length})`);
+      if (keys.includes("###")) {
+        const spreadArgs = [];
+        let current = "";
+        for (let i = 0; i < keys.length; i++) {
+          const name = keys[i],
+                value = node.attrs[name];
+          if (value.includes("###")) {
+            let count = options.counter++;
+            current += `${name}: ${name !== "ref" ? `typeof exprs[${count}] === "function" ? exprs[${count}]() : ` : ""}exprs[${count}],`;
+            delete node.attrs[name];
+          } else if (name === "###") {
+            if (current.length) {
+              spreadArgs.push(`()=>({${current}})`);
+              current = "";
+            }
+            spreadArgs.push(`exprs[${options.counter++}]`);
+            delete node.attrs[name];
+          }
+        }
+        if (current.length) spreadArgs.push(`()=>({${current}})`);
+        options.exprs.push(`r.spread(${tag},${spreadArgs.length === 1 ? `typeof ${spreadArgs[0]} === "function" ? r.mergeProps(${spreadArgs[0]}) : ${spreadArgs[0]}` : `r.mergeProps(${spreadArgs.join(",")})`},${isSVG},${!!node.children.length})`);
+      } else {
+        for (let i = 0; i < keys.length; i++) {
+          const name = keys[i],
+                value = node.attrs[name];
+          if (value.includes("###")) {
+            delete node.attrs[name];
+            parseAttribute(tag, name, value, isSVG, isCE, options);
+          }
         }
       }
       options.path = tag;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "solid-js",
   "description": "A declarative JavaScript library for building user interfaces.",
-  "version": "1.5.7",
+  "version": "1.6.0-beta.0",
   "author": "Ryan Carniato",
   "license": "MIT",
   "homepage": "https://solidjs.com",

package/types/reactive/signal.d.ts

@@ -173,7 +173,7 @@ export declare function createEffect<Next, Init = Next>(fn: EffectFunction<Init
  * @description https://www.solidjs.com/docs/latest/api#createreaction
  */
 export declare function createReaction(onInvalidate: () => void, options?: EffectOptions): (tracking: () => void) => void;
-interface Memo<Prev, Next = Prev> extends SignalState<Next>, Computation<Next> {
+export interface Memo<Prev, Next = Prev> extends SignalState<Next>, Computation<Next> {
     tOwned?: Computation<Prev | Next, Next>[];
 }
 export interface MemoOptions<T> extends EffectOptions {

package/universal/dist/dev.cjs

@@ -4,12 +4,6 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var solidJs = require('solid-js');
 
-function memo(fn, equals) {
-  return solidJs.createMemo(fn, undefined, !equals ? {
-    equals
-  } : undefined);
-}
-
 function createRenderer$1({
   createElement,
   createTextNode,
@@ -195,10 +189,10 @@ function createRenderer$1({
   }
   function spreadExpression(node, props, prevProps = {}, skipChildren) {
     props || (props = {});
-    if (!skipChildren && "children" in props) {
+    if (!skipChildren) {
       solidJs.createRenderEffect(() => prevProps.children = insertExpression(node, props.children, prevProps.children));
     }
-    props.ref && props.ref(node);
+    solidJs.createRenderEffect(() => props.ref && props.ref(node));
     solidJs.createRenderEffect(() => {
       for (const prop in props) {
         if (prop === "children" || prop === "ref") continue;
@@ -232,25 +226,15 @@ function createRenderer$1({
       setProperty(node, name, value, prev);
       return value;
     },
-    mergeProps,
+    mergeProps: solidJs.mergeProps,
     effect: solidJs.createRenderEffect,
-    memo,
+    memo: solidJs.createMemo,
     createComponent: solidJs.createComponent,
     use(fn, element, arg) {
       return solidJs.untrack(() => fn(element, arg));
     }
   };
 }
-function mergeProps(...sources) {
-  const target = {};
-  for (let i = 0; i < sources.length; i++) {
-    let source = sources[i];
-    if (typeof source === "function") source = source();
-    const descriptors = Object.getOwnPropertyDescriptors(source);
-    Object.defineProperties(target, descriptors);
-  }
-  return target;
-}
 
 function createRenderer(options) {
   const renderer = createRenderer$1(options);

package/universal/dist/dev.js

@@ -1,10 +1,4 @@
-import { createMemo, createRoot, createRenderEffect, createComponent, untrack, mergeProps as mergeProps$1 } from 'solid-js';
-
-function memo(fn, equals) {
-  return createMemo(fn, undefined, !equals ? {
-    equals
-  } : undefined);
-}
+import { createRoot, createRenderEffect, mergeProps, createMemo, createComponent, untrack } from 'solid-js';
 
 function createRenderer$1({
   createElement,
@@ -191,10 +185,10 @@ function createRenderer$1({
   }
   function spreadExpression(node, props, prevProps = {}, skipChildren) {
     props || (props = {});
-    if (!skipChildren && "children" in props) {
+    if (!skipChildren) {
       createRenderEffect(() => prevProps.children = insertExpression(node, props.children, prevProps.children));
     }
-    props.ref && props.ref(node);
+    createRenderEffect(() => props.ref && props.ref(node));
     createRenderEffect(() => {
       for (const prop in props) {
         if (prop === "children" || prop === "ref") continue;
@@ -230,27 +224,17 @@ function createRenderer$1({
     },
     mergeProps,
     effect: createRenderEffect,
-    memo,
+    memo: createMemo,
     createComponent,
     use(fn, element, arg) {
       return untrack(() => fn(element, arg));
     }
   };
 }
-function mergeProps(...sources) {
-  const target = {};
-  for (let i = 0; i < sources.length; i++) {
-    let source = sources[i];
-    if (typeof source === "function") source = source();
-    const descriptors = Object.getOwnPropertyDescriptors(source);
-    Object.defineProperties(target, descriptors);
-  }
-  return target;
-}
 
 function createRenderer(options) {
   const renderer = createRenderer$1(options);
-  renderer.mergeProps = mergeProps$1;
+  renderer.mergeProps = mergeProps;
   return renderer;
 }