solid-js 1.5.8 → 1.6.0-beta.1

package/dist/dev.cjs

@@ -564,11 +564,11 @@ function serializeGraph(owner) {
     ...(owner.owned ? serializeChildren(owner) : {})
   };
 }
-function createContext(defaultValue) {
+function createContext(defaultValue, options) {
   const id = Symbol("context");
   return {
     id,
-    Provider: createProvider(id),
+    Provider: createProvider(id, options),
     defaultValue
   };
 }
@@ -962,7 +962,7 @@ function resolveChildren(children) {
   }
   return children;
 }
-function createProvider(id) {
+function createProvider(id, options) {
   return function provider(props) {
     let res;
     createRenderEffect(() => res = untrack(() => {
@@ -970,7 +970,7 @@ function createProvider(id) {
         [id]: props.value
       };
       return children(() => props.children);
-    }));
+    }), undefined, options);
     return res;
   };
 }
@@ -1259,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++) {
@@ -1297,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

@@ -560,11 +560,11 @@ function serializeGraph(owner) {
     ...(owner.owned ? serializeChildren(owner) : {})
   };
 }
-function createContext(defaultValue) {
+function createContext(defaultValue, options) {
   const id = Symbol("context");
   return {
     id,
-    Provider: createProvider(id),
+    Provider: createProvider(id, options),
     defaultValue
   };
 }
@@ -958,7 +958,7 @@ function resolveChildren(children) {
   }
   return children;
 }
-function createProvider(id) {
+function createProvider(id, options) {
   return function provider(props) {
     let res;
     createRenderEffect(() => res = untrack(() => {
@@ -966,7 +966,7 @@ function createProvider(id) {
         [id]: props.value
       };
       return children(() => props.children);
-    }));
+    }), undefined, options);
     return res;
   };
 }
@@ -1255,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++) {
@@ -1293,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

@@ -503,7 +503,7 @@ function resumeEffects(e) {
   Effects.push.apply(Effects, e);
   e.length = 0;
 }
-function createContext(defaultValue) {
+function createContext(defaultValue, options) {
   const id = Symbol("context");
   return {
     id,
@@ -899,7 +899,7 @@ function resolveChildren(children) {
   }
   return children;
 }
-function createProvider(id) {
+function createProvider(id, options) {
   return function provider(props) {
     let res;
     createRenderEffect(() => res = untrack(() => {
@@ -907,7 +907,7 @@ function createProvider(id) {
         [id]: props.value
       };
       return children(() => props.children);
-    }));
+    }), undefined);
     return res;
   };
 }
@@ -1173,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++) {
@@ -1211,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

@@ -499,7 +499,7 @@ function resumeEffects(e) {
   Effects.push.apply(Effects, e);
   e.length = 0;
 }
-function createContext(defaultValue) {
+function createContext(defaultValue, options) {
   const id = Symbol("context");
   return {
     id,
@@ -895,7 +895,7 @@ function resolveChildren(children) {
   }
   return children;
 }
-function createProvider(id) {
+function createProvider(id, options) {
   return function provider(props) {
     let res;
     createRenderEffect(() => res = untrack(() => {
@@ -903,7 +903,7 @@ function createProvider(id) {
         [id]: props.value
       };
       return children(() => props.children);
-    }));
+    }), undefined);
     return res;
   };
 }
@@ -1169,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++) {
@@ -1207,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.8",
+  "version": "1.6.0-beta.1",
   "author": "Ryan Carniato",
   "license": "MIT",
   "homepage": "https://solidjs.com",

package/store/dist/dev.cjs

@@ -69,7 +69,7 @@ function getDataNodes(target) {
 function getDataNode(nodes, property, value) {
   return nodes[property] || (nodes[property] = createDataNode(value));
 }
-function proxyDescriptor(target, property) {
+function proxyDescriptor$1(target, property) {
   const desc = Reflect.getOwnPropertyDescriptor(target, property);
   if (!desc || desc.get || !desc.configurable || property === solidJs.$PROXY || property === $NODE || property === $NAME) return desc;
   delete desc.value;
@@ -128,7 +128,7 @@ const proxyTraps$1 = {
     return true;
   },
   ownKeys: ownKeys,
-  getOwnPropertyDescriptor: proxyDescriptor
+  getOwnPropertyDescriptor: proxyDescriptor$1
 };
 function setProperty(state, property, value, deleting = false) {
   if (!deleting && state[property] === value) return;
@@ -228,6 +228,15 @@ function createStore(...[store, options]) {
   return [wrappedStore, setStore];
 }
 
+function proxyDescriptor(target, property) {
+  const desc = Reflect.getOwnPropertyDescriptor(target, property);
+  if (!desc || desc.get || desc.set || !desc.configurable || property === solidJs.$PROXY || property === $NODE || property === $NAME) return desc;
+  delete desc.value;
+  delete desc.writable;
+  desc.get = () => target[solidJs.$PROXY][property];
+  desc.set = v => target[solidJs.$PROXY][property] = v;
+  return desc;
+}
 const proxyTraps = {
   get(target, property, receiver) {
     if (property === $RAW) return target;

package/store/dist/dev.js

@@ -65,7 +65,7 @@ function getDataNodes(target) {
 function getDataNode(nodes, property, value) {
   return nodes[property] || (nodes[property] = createDataNode(value));
 }
-function proxyDescriptor(target, property) {
+function proxyDescriptor$1(target, property) {
   const desc = Reflect.getOwnPropertyDescriptor(target, property);
   if (!desc || desc.get || !desc.configurable || property === $PROXY || property === $NODE || property === $NAME) return desc;
   delete desc.value;
@@ -124,7 +124,7 @@ const proxyTraps$1 = {
     return true;
   },
   ownKeys: ownKeys,
-  getOwnPropertyDescriptor: proxyDescriptor
+  getOwnPropertyDescriptor: proxyDescriptor$1
 };
 function setProperty(state, property, value, deleting = false) {
   if (!deleting && state[property] === value) return;
@@ -224,6 +224,15 @@ function createStore(...[store, options]) {
   return [wrappedStore, setStore];
 }
 
+function proxyDescriptor(target, property) {
+  const desc = Reflect.getOwnPropertyDescriptor(target, property);
+  if (!desc || desc.get || desc.set || !desc.configurable || property === $PROXY || property === $NODE || property === $NAME) return desc;
+  delete desc.value;
+  delete desc.writable;
+  desc.get = () => target[$PROXY][property];
+  desc.set = v => target[$PROXY][property] = v;
+  return desc;
+}
 const proxyTraps = {
   get(target, property, receiver) {
     if (property === $RAW) return target;