solid-js 1.1.7 → 1.2.0-beta.0

package/dist/dev.cjs

@@ -455,6 +455,11 @@ function enableScheduling(scheduler = requestCallback) {
   Scheduler = scheduler;
 }
 function startTransition(fn, cb) {
+  if (Transition && Transition.running) {
+    fn();
+    cb && Transition.cb.push(cb);
+    return;
+  }
   queueMicrotask(() => {
     if (Scheduler || SuspenseContext) {
       Transition || (Transition = {
@@ -1166,23 +1171,26 @@ const propTraps = {
     return _.keys();
   }
 };
+function resolveSource(s) {
+  return typeof s === "function" ? s() : s;
+}
 function mergeProps(...sources) {
   return new Proxy({
     get(property) {
       for (let i = sources.length - 1; i >= 0; i--) {
-        const v = sources[i][property];
+        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 sources[i]) return true;
+        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(sources[i]));
+      for (let i = 0; i < sources.length; i++) keys.push(...Object.keys(resolveSource(sources[i])));
       return [...new Set(keys)];
     }
   }, propTraps);

package/dist/dev.js

@@ -451,6 +451,11 @@ function enableScheduling(scheduler = requestCallback) {
   Scheduler = scheduler;
 }
 function startTransition(fn, cb) {
+  if (Transition && Transition.running) {
+    fn();
+    cb && Transition.cb.push(cb);
+    return;
+  }
   queueMicrotask(() => {
     if (Scheduler || SuspenseContext) {
       Transition || (Transition = {
@@ -1162,23 +1167,26 @@ const propTraps = {
     return _.keys();
   }
 };
+function resolveSource(s) {
+  return typeof s === "function" ? s() : s;
+}
 function mergeProps(...sources) {
   return new Proxy({
     get(property) {
       for (let i = sources.length - 1; i >= 0; i--) {
-        const v = sources[i][property];
+        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 sources[i]) return true;
+        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(sources[i]));
+      for (let i = 0; i < sources.length; i++) keys.push(...Object.keys(resolveSource(sources[i])));
       return [...new Set(keys)];
     }
   }, propTraps);

package/dist/solid.cjs

@@ -452,6 +452,11 @@ function enableScheduling(scheduler = requestCallback) {
   Scheduler = scheduler;
 }
 function startTransition(fn, cb) {
+  if (Transition && Transition.running) {
+    fn();
+    cb && Transition.cb.push(cb);
+    return;
+  }
   queueMicrotask(() => {
     if (Scheduler || SuspenseContext) {
       Transition || (Transition = {
@@ -1090,23 +1095,26 @@ const propTraps = {
     return _.keys();
   }
 };
+function resolveSource(s) {
+  return typeof s === "function" ? s() : s;
+}
 function mergeProps(...sources) {
   return new Proxy({
     get(property) {
       for (let i = sources.length - 1; i >= 0; i--) {
-        const v = sources[i][property];
+        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 sources[i]) return true;
+        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(sources[i]));
+      for (let i = 0; i < sources.length; i++) keys.push(...Object.keys(resolveSource(sources[i])));
       return [...new Set(keys)];
     }
   }, propTraps);

package/dist/solid.js

@@ -448,6 +448,11 @@ function enableScheduling(scheduler = requestCallback) {
   Scheduler = scheduler;
 }
 function startTransition(fn, cb) {
+  if (Transition && Transition.running) {
+    fn();
+    cb && Transition.cb.push(cb);
+    return;
+  }
   queueMicrotask(() => {
     if (Scheduler || SuspenseContext) {
       Transition || (Transition = {
@@ -1086,23 +1091,26 @@ const propTraps = {
     return _.keys();
   }
 };
+function resolveSource(s) {
+  return typeof s === "function" ? s() : s;
+}
 function mergeProps(...sources) {
   return new Proxy({
     get(property) {
       for (let i = sources.length - 1; i >= 0; i--) {
-        const v = sources[i][property];
+        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 sources[i]) return true;
+        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(sources[i]));
+      for (let i = 0; i < sources.length; i++) keys.push(...Object.keys(resolveSource(sources[i])));
       return [...new Set(keys)];
     }
   }, propTraps);

package/html/dist/html.cjs

@@ -213,7 +213,7 @@ function createHTML(r, {
       markup = markup + statics[i] + "<!--#-->";
     }
     markup = markup + statics[i];
-    markup = markup.replace(selfClosing, fullClosing).replace(/<(<!--#-->)/g, "<###").replace(attrSeeker, attrReplacer).replace(/>\n+\s*/g, ">").replace(/\n+\s*</g, "<").replace(/\s+</g, " <").replace(/>\s+/g, "> ");
+    markup = markup.replace(selfClosing, fullClosing).replace(/<(<!--#-->)/g, "<###").replace(/\.\.\.(<!--#-->)/g, "###").replace(attrSeeker, attrReplacer).replace(/>\n+\s*/g, ">").replace(/\n+\s*</g, "<").replace(/\s+</g, " <").replace(/>\s+/g, "> ");
     const [html, code] = parseTemplate(parse(markup)),
           templates = [];
     for (let i = 0; i < html.length; i++) {
@@ -323,16 +323,29 @@ function createHTML(r, {
     options.counter = childOptions.counter;
     options.templateId = childOptions.templateId;
   }
+  function processComponentProps(propGroups) {
+    let result = [];
+    for (const props of propGroups) {
+      if (Array.isArray(props)) {
+        if (!props.length) continue;
+        result.push(`r.wrapProps({${props.join(",") || ""}})`);
+      } else result.push(props);
+    }
+    return result.length > 1 ? `r.mergeProps(${result.join(",")})` : result[0];
+  }
   function processComponent(node, options) {
+    let props = [];
     const keys = Object.keys(node.attrs),
-          props = [],
+          propGroups = [props],
           componentIdentifier = options.counter++;
     for (let i = 0; i < keys.length; i++) {
       const name = keys[i],
             value = node.attrs[name];
-      if (value === "###") {
-        let count = options.counter++;
-        props.push(`${name}: exprs[${count}]`);
+      if (name === "###") {
+        propGroups.push(`exprs[${options.counter++}]`);
+        propGroups.push(props = []);
+      } else if (value === "###") {
+        props.push(`${name}: exprs[${options.counter++}]`);
       } else props.push(`${name}: "${value}"`);
     }
     if (node.children.length === 1 && node.children[0].type === "comment" && node.children[0].content === "#") {
@@ -357,7 +370,7 @@ function createHTML(r, {
       tag = `_$el${uuid++}`;
       options.decl.push(`${tag} = ${options.path}.${options.first ? "firstChild" : "nextSibling"}`);
     }
-    if (options.parent) options.exprs.push(`r.insert(${options.parent}, r.createComponent(exprs[${componentIdentifier}], r.wrapProps({${props.join(", ") || ""}}))${tag ? `, ${tag}` : ""})`);else options.exprs.push(`${options.fragment ? "" : "return "}r.createComponent(exprs[${componentIdentifier}], r.wrapProps({${props.join(", ") || ""}}))`);
+    if (options.parent) options.exprs.push(`r.insert(${options.parent}, r.createComponent(exprs[${componentIdentifier}],${processComponentProps(propGroups)})${tag ? `, ${tag}` : ""})`);else options.exprs.push(`${options.fragment ? "" : "return "}r.createComponent(exprs[${componentIdentifier}],${processComponentProps(propGroups)})`);
     options.path = tag;
     options.first = false;
   }
@@ -410,6 +423,9 @@ function createHTML(r, {
         if (value === "###") {
           delete node.attrs[name];
           parseAttribute(tag, name, isSVG, isCE, options);
+        } else if (name === "###") {
+          delete node.attrs[name];
+          options.exprs.push(`r.spread(${tag},exprs[${options.counter++}],${isSVG},${!!node.children.length})`);
         }
       }
       options.path = tag;
@@ -470,9 +486,11 @@ var index = createHTML({
   effect: web.effect,
   style: web.style,
   insert: web.insert,
+  spread: web.spread,
   createComponent: web.createComponent,
   delegateEvents: web.delegateEvents,
   classList: web.classList,
+  mergeProps: web.mergeProps,
   dynamicProperty: web.dynamicProperty,
   setAttribute: web.setAttribute,
   setAttributeNS: web.setAttributeNS,

package/html/dist/html.js

@@ -1,4 +1,4 @@
-import { effect, style, insert, createComponent, delegateEvents, classList, dynamicProperty, setAttribute, setAttributeNS, addEventListener, Aliases, PropAliases, Properties, ChildProperties, DelegatedEvents, SVGElements, SVGNamespace } from 'solid-js/web';
+import { effect, style, insert, spread, createComponent, delegateEvents, classList, mergeProps, dynamicProperty, setAttribute, setAttributeNS, addEventListener, Aliases, PropAliases, Properties, ChildProperties, DelegatedEvents, SVGElements, SVGNamespace } from 'solid-js/web';
 
 var attrRE, lookup, parseTag, pushCommentNode, pushTextNode, tagRE;
 tagRE = /(?:<!--[\S\s]*?-->|<(?:"[^"]*"['"]*|'[^']*'['"]*|[^'">])+>)/g;
@@ -211,7 +211,7 @@ function createHTML(r, {
       markup = markup + statics[i] + "<!--#-->";
     }
     markup = markup + statics[i];
-    markup = markup.replace(selfClosing, fullClosing).replace(/<(<!--#-->)/g, "<###").replace(attrSeeker, attrReplacer).replace(/>\n+\s*/g, ">").replace(/\n+\s*</g, "<").replace(/\s+</g, " <").replace(/>\s+/g, "> ");
+    markup = markup.replace(selfClosing, fullClosing).replace(/<(<!--#-->)/g, "<###").replace(/\.\.\.(<!--#-->)/g, "###").replace(attrSeeker, attrReplacer).replace(/>\n+\s*/g, ">").replace(/\n+\s*</g, "<").replace(/\s+</g, " <").replace(/>\s+/g, "> ");
     const [html, code] = parseTemplate(parse(markup)),
           templates = [];
     for (let i = 0; i < html.length; i++) {
@@ -321,16 +321,29 @@ function createHTML(r, {
     options.counter = childOptions.counter;
     options.templateId = childOptions.templateId;
   }
+  function processComponentProps(propGroups) {
+    let result = [];
+    for (const props of propGroups) {
+      if (Array.isArray(props)) {
+        if (!props.length) continue;
+        result.push(`r.wrapProps({${props.join(",") || ""}})`);
+      } else result.push(props);
+    }
+    return result.length > 1 ? `r.mergeProps(${result.join(",")})` : result[0];
+  }
   function processComponent(node, options) {
+    let props = [];
     const keys = Object.keys(node.attrs),
-          props = [],
+          propGroups = [props],
           componentIdentifier = options.counter++;
     for (let i = 0; i < keys.length; i++) {
       const name = keys[i],
             value = node.attrs[name];
-      if (value === "###") {
-        let count = options.counter++;
-        props.push(`${name}: exprs[${count}]`);
+      if (name === "###") {
+        propGroups.push(`exprs[${options.counter++}]`);
+        propGroups.push(props = []);
+      } else if (value === "###") {
+        props.push(`${name}: exprs[${options.counter++}]`);
       } else props.push(`${name}: "${value}"`);
     }
     if (node.children.length === 1 && node.children[0].type === "comment" && node.children[0].content === "#") {
@@ -355,7 +368,7 @@ function createHTML(r, {
       tag = `_$el${uuid++}`;
       options.decl.push(`${tag} = ${options.path}.${options.first ? "firstChild" : "nextSibling"}`);
     }
-    if (options.parent) options.exprs.push(`r.insert(${options.parent}, r.createComponent(exprs[${componentIdentifier}], r.wrapProps({${props.join(", ") || ""}}))${tag ? `, ${tag}` : ""})`);else options.exprs.push(`${options.fragment ? "" : "return "}r.createComponent(exprs[${componentIdentifier}], r.wrapProps({${props.join(", ") || ""}}))`);
+    if (options.parent) options.exprs.push(`r.insert(${options.parent}, r.createComponent(exprs[${componentIdentifier}],${processComponentProps(propGroups)})${tag ? `, ${tag}` : ""})`);else options.exprs.push(`${options.fragment ? "" : "return "}r.createComponent(exprs[${componentIdentifier}],${processComponentProps(propGroups)})`);
     options.path = tag;
     options.first = false;
   }
@@ -408,6 +421,9 @@ function createHTML(r, {
         if (value === "###") {
           delete node.attrs[name];
           parseAttribute(tag, name, isSVG, isCE, options);
+        } else if (name === "###") {
+          delete node.attrs[name];
+          options.exprs.push(`r.spread(${tag},exprs[${options.counter++}],${isSVG},${!!node.children.length})`);
         }
       }
       options.path = tag;
@@ -468,9 +484,11 @@ var index = createHTML({
   effect,
   style,
   insert,
+  spread,
   createComponent,
   delegateEvents,
   classList,
+  mergeProps,
   dynamicProperty,
   setAttribute,
   setAttributeNS,

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "solid-js",
   "description": "A declarative JavaScript library for building user interfaces.",
-  "version": "1.1.7",
+  "version": "1.2.0-beta.0",
   "author": "Ryan Carniato",
   "license": "MIT",
   "homepage": "https://github.com/solidjs/solid#readme",
@@ -29,6 +29,8 @@
     "h/types",
     "html/dist",
     "html/types",
+    "universal/dist",
+    "universal/types",
     "types",
     "jsx-runtime.d.ts"
   ],
@@ -84,6 +86,15 @@
       "require": "./web/dist/web.cjs"
     },
     "./web/dist/*": "./web/dist/*",
+    "./universal": {
+      "development": {
+        "import": "./universal/dist/dev.js",
+        "require": "./universal/dist/dev.cjs"
+      },
+      "import": "./universal/dist/universal.js",
+      "require": "./universal/dist/universal.cjs"
+    },
+    "./universal/dist/*": "./universal/dist/*",
     "./h": {
       "import": "./h/dist/h.js",
       "require": "./h/dist/h.cjs"
@@ -106,6 +117,7 @@
     "build:types-web": "tsc --project ./web/tsconfig.json && tsconfig-replace-paths --project ./web/tsconfig.types.json",
     "build:types-html": "tsc --project ./html/tsconfig.json",
     "build:types-h": "tsc --project ./h/tsconfig.json",
+    "build:types-universal": "tsc --project ./universal/tsconfig.json",
     "bench": "node --allow-natives-syntax bench/bench.cjs",
     "test": "jest && npm run test:types",
     "test:coverage": "jest --coverage && npm run test:types",
@@ -120,5 +132,5 @@
     "compiler",
     "performance"
   ],
-  "gitHead": "a135f8b621f4b223145df4d5687051d187acd045"
+  "gitHead": "ec5bfa3adc09c0efd9210be6ff5096ec18c06d02"
 }

package/types/jsx.d.ts

@@ -1674,6 +1674,7 @@ export namespace JSX {
     | "unsafe-url";
   type HTMLIframeSandbox =
     | "allow-downloads-without-user-activation"
+    | "allow-downloads"
     | "allow-forms"
     | "allow-modals"
     | "allow-orientation-lock"

package/types/render/component.d.ts

@@ -15,7 +15,7 @@ export declare function createComponent<T>(Comp: (props: T) => JSX.Element, prop
 declare type BoxedTupleTypes<T extends any[]> = {
     [P in keyof T]: [T[P]];
 }[Exclude<keyof T, keyof any[]>];
-declare type UnionToIntersection<U> = (U extends any ? (k: U) => void : never) extends ((k: infer I) => void) ? I : never;
+declare type UnionToIntersection<U> = (U extends any ? (k: U) => void : never) extends (k: infer I) => void ? I : never;
 declare type UnboxIntersection<T> = T extends {
     0: infer U;
 } ? U : never;

package/universal/dist/dev.cjs

@@ -0,0 +1,258 @@
+'use strict';
+
+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,
+  isTextNode,
+  replaceText,
+  insertNode,
+  removeNode,
+  setProperty,
+  getParentNode,
+  getFirstChild,
+  getNextSibling
+}) {
+  function insert(parent, accessor, marker, initial) {
+    if (marker !== undefined && !initial) initial = [];
+    if (typeof accessor !== "function") return insertExpression(parent, accessor, initial, marker);
+    solidJs.createRenderEffect(current => insertExpression(parent, accessor(), current, marker), initial);
+  }
+  function insertExpression(parent, value, current, marker, unwrapArray) {
+    while (typeof current === "function") current = current();
+    if (value === current) return current;
+    const t = typeof value,
+          multi = marker !== undefined;
+    if (t === "string" || t === "number") {
+      if (t === "number") value = value.toString();
+      if (multi) {
+        let node = current[0];
+        if (node && isTextNode(node)) {
+          replaceText(node, value);
+        } else node = createTextNode(value);
+        current = cleanChildren(parent, current, marker, node);
+      } else {
+        if (current !== "" && typeof current === "string") {
+          replaceText(getFirstChild(parent), current = value);
+        } else {
+          cleanChildren(parent, current, marker, createTextNode(value));
+          current = value;
+        }
+      }
+    } else if (value == null || t === "boolean") {
+      current = cleanChildren(parent, current, marker);
+    } else if (t === "function") {
+      solidJs.createRenderEffect(() => {
+        let v = value();
+        while (typeof v === "function") v = v();
+        current = insertExpression(parent, v, current, marker);
+      });
+      return () => current;
+    } else if (Array.isArray(value)) {
+      const array = [];
+      if (normalizeIncomingArray(array, value, unwrapArray)) {
+        solidJs.createRenderEffect(() => current = insertExpression(parent, array, current, marker, true));
+        return () => current;
+      }
+      if (array.length === 0) {
+        const replacement = cleanChildren(parent, current, marker);
+        if (multi) return current = replacement;
+      } else {
+        if (Array.isArray(current)) {
+          if (current.length === 0) {
+            appendNodes(parent, array, marker);
+          } else reconcileArrays(parent, current, array);
+        } else if (current == null || current === "") {
+          appendNodes(parent, array);
+        } else {
+          reconcileArrays(parent, multi && current || [getFirstChild(parent)], array);
+        }
+      }
+      current = array;
+    } else {
+      if (Array.isArray(current)) {
+        if (multi) return current = cleanChildren(parent, current, marker, value);
+        cleanChildren(parent, current, null, value);
+      } else if (current == null || current === "" || !getFirstChild(parent)) {
+        insertNode(parent, value);
+      } else replaceNode(parent, value, getFirstChild(parent));
+      current = value;
+    }
+    return current;
+  }
+  function normalizeIncomingArray(normalized, array, unwrap) {
+    let dynamic = false;
+    for (let i = 0, len = array.length; i < len; i++) {
+      let item = array[i],
+          t;
+      if (item == null || item === true || item === false) ; else if (Array.isArray(item)) {
+        dynamic = normalizeIncomingArray(normalized, item) || dynamic;
+      } else if ((t = typeof item) === "string" || t === "number") {
+        normalized.push(createTextNode(item));
+      } else if (t === "function") {
+        if (unwrap) {
+          while (typeof item === "function") item = item();
+          dynamic = normalizeIncomingArray(normalized, Array.isArray(item) ? item : [item]) || dynamic;
+        } else {
+          normalized.push(item);
+          dynamic = true;
+        }
+      } else normalized.push(item);
+    }
+    return dynamic;
+  }
+  function reconcileArrays(parentNode, a, b) {
+    let bLength = b.length,
+        aEnd = a.length,
+        bEnd = bLength,
+        aStart = 0,
+        bStart = 0,
+        after = getNextSibling(a[aEnd - 1]),
+        map = null;
+    while (aStart < aEnd || bStart < bEnd) {
+      if (a[aStart] === b[bStart]) {
+        aStart++;
+        bStart++;
+        continue;
+      }
+      while (a[aEnd - 1] === b[bEnd - 1]) {
+        aEnd--;
+        bEnd--;
+      }
+      if (aEnd === aStart) {
+        const node = bEnd < bLength ? bStart ? getNextSibling(b[bStart - 1]) : b[bEnd - bStart] : after;
+        while (bStart < bEnd) insertNode(parentNode, b[bStart++], node);
+      } else if (bEnd === bStart) {
+        while (aStart < aEnd) {
+          if (!map || !map.has(a[aStart])) removeNode(parentNode, a[aStart]);
+          aStart++;
+        }
+      } else if (a[aStart] === b[bEnd - 1] && b[bStart] === a[aEnd - 1]) {
+        const node = getNextSibling(a[--aEnd]);
+        insertNode(parentNode, b[bStart++], getNextSibling(a[aStart++]));
+        insertNode(parentNode, b[--bEnd], node);
+        a[aEnd] = b[bEnd];
+      } else {
+        if (!map) {
+          map = new Map();
+          let i = bStart;
+          while (i < bEnd) map.set(b[i], i++);
+        }
+        const index = map.get(a[aStart]);
+        if (index != null) {
+          if (bStart < index && index < bEnd) {
+            let i = aStart,
+                sequence = 1,
+                t;
+            while (++i < aEnd && i < bEnd) {
+              if ((t = map.get(a[i])) == null || t !== index + sequence) break;
+              sequence++;
+            }
+            if (sequence > index - bStart) {
+              const node = a[aStart];
+              while (bStart < index) insertNode(parentNode, b[bStart++], node);
+            } else replaceNode(parentNode, b[bStart++], a[aStart++]);
+          } else aStart++;
+        } else removeNode(parentNode, a[aStart++]);
+      }
+    }
+  }
+  function cleanChildren(parent, current, marker, replacement) {
+    if (marker === undefined) {
+      let removed;
+      while (removed = getFirstChild(parent)) removeNode(parent, removed);
+      replacement && insertNode(parent, replacement);
+      return "";
+    }
+    const node = replacement || createTextNode("");
+    if (current.length) {
+      let inserted = false;
+      for (let i = current.length - 1; i >= 0; i--) {
+        const el = current[i];
+        if (node !== el) {
+          const isParent = getParentNode(el) === parent;
+          if (!inserted && !i) isParent ? replaceNode(parent, node, el) : insertNode(parent, node, marker);else isParent && removeNode(parent, el);
+        } else inserted = true;
+      }
+    } else insertNode(parent, node, marker);
+    return [node];
+  }
+  function appendNodes(parent, array, marker) {
+    for (let i = 0, len = array.length; i < len; i++) insertNode(parent, array[i], marker);
+  }
+  function replaceNode(parent, newNode, oldNode) {
+    insertNode(parent, newNode, oldNode);
+    removeNode(parent, oldNode);
+  }
+  function spreadExpression(node, props, prevProps = {}, skipChildren) {
+    if (!skipChildren && "children" in props) {
+      solidJs.createRenderEffect(() => prevProps.children = insertExpression(node, props.children, prevProps.children));
+    }
+    solidJs.createRenderEffect(() => {
+      for (const prop in props) {
+        if (prop === "children") continue;
+        const value = props[prop];
+        if (value === prevProps[prop]) continue;
+        if (prop === "ref") value(node);else {
+          setProperty(node, prop, value, prevProps[prop]);
+          prevProps[prop] = value;
+        }
+      }
+    });
+    return prevProps;
+  }
+  return {
+    render(code, element) {
+      let disposer;
+      solidJs.createRoot(dispose => {
+        disposer = dispose;
+        insert(element, code());
+      });
+      return disposer;
+    },
+    insert,
+    spread(node, accessor, skipChildren) {
+      if (typeof accessor === "function") {
+        solidJs.createRenderEffect(current => spreadExpression(node, accessor(), current, skipChildren));
+      } else spreadExpression(node, accessor, undefined, skipChildren);
+    },
+    createElement,
+    createTextNode,
+    insertNode,
+    setProp(node, name, value, prev) {
+      setProperty(node, name, value, prev);
+      return value;
+    },
+    mergeProps,
+    effect: solidJs.createRenderEffect,
+    memo,
+    createComponent: solidJs.createComponent
+  };
+}
+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 = solidJs.mergeProps;
+  return renderer;
+}
+
+exports.createRenderer = createRenderer;