solid-js 1.5.6 → 1.6.0-beta.0

package/web/dist/dev.cjs

@@ -7,18 +7,16 @@ var solidJs = require('solid-js');
 const booleans = ["allowfullscreen", "async", "autofocus", "autoplay", "checked", "controls", "default", "disabled", "formnovalidate", "hidden", "indeterminate", "ismap", "loop", "multiple", "muted", "nomodule", "novalidate", "open", "playsinline", "readonly", "required", "reversed", "seamless", "selected"];
 const Properties = /*#__PURE__*/new Set(["className", "value", "readOnly", "formNoValidate", "isMap", "noModule", "playsInline", ...booleans]);
 const ChildProperties = /*#__PURE__*/new Set(["innerHTML", "textContent", "innerText", "children"]);
-const Aliases = {
-  className: "class",
-  htmlFor: "for"
-};
-const PropAliases = {
-  class: "className",
-  formnovalidate: "formNoValidate",
-  ismap: "isMap",
-  nomodule: "noModule",
-  playsinline: "playsInline",
-  readonly: "readOnly"
-};
+const Aliases = Object.create(null);
+Aliases.className = "class";
+Aliases.htmlFor = "for";
+const PropAliases = Object.create(null);
+PropAliases.class = "className";
+PropAliases.formnovalidate = "formNoValidate";
+PropAliases.ismap = "isMap";
+PropAliases.nomodule = "noModule";
+PropAliases.playsinline = "playsInline";
+PropAliases.readonly = "readOnly";
 const DelegatedEvents = /*#__PURE__*/new Set(["beforeinput", "click", "dblclick", "contextmenu", "focusin", "focusout", "input", "keydown", "keyup", "mousedown", "mousemove", "mouseout", "mouseover", "mouseup", "pointerdown", "pointermove", "pointerout", "pointerover", "pointerup", "touchend", "touchmove", "touchstart"]);
 const SVGElements = /*#__PURE__*/new Set([
 "altGlyph", "altGlyphDef", "altGlyphItem", "animate", "animateColor", "animateMotion", "animateTransform", "circle", "clipPath", "color-profile", "cursor", "defs", "desc", "ellipse", "feBlend", "feColorMatrix", "feComponentTransfer", "feComposite", "feConvolveMatrix", "feDiffuseLighting", "feDisplacementMap", "feDistantLight", "feFlood", "feFuncA", "feFuncB", "feFuncG", "feFuncR", "feGaussianBlur", "feImage", "feMerge", "feMergeNode", "feMorphology", "feOffset", "fePointLight", "feSpecularLighting", "feSpotLight", "feTile", "feTurbulence", "filter", "font", "font-face", "font-face-format", "font-face-name", "font-face-src", "font-face-uri", "foreignObject", "g", "glyph", "glyphRef", "hkern", "image", "line", "linearGradient", "marker", "mask", "metadata", "missing-glyph", "mpath", "path", "pattern", "polygon", "polyline", "radialGradient", "rect",
@@ -31,12 +29,6 @@ const SVGNamespace = {
 };
 const DOMElements = /*#__PURE__*/new Set(["html", "base", "head", "link", "meta", "style", "title", "body", "address", "article", "aside", "footer", "header", "main", "nav", "section", "body", "blockquote", "dd", "div", "dl", "dt", "figcaption", "figure", "hr", "li", "ol", "p", "pre", "ul", "a", "abbr", "b", "bdi", "bdo", "br", "cite", "code", "data", "dfn", "em", "i", "kbd", "mark", "q", "rp", "rt", "ruby", "s", "samp", "small", "span", "strong", "sub", "sup", "time", "u", "var", "wbr", "area", "audio", "img", "map", "track", "video", "embed", "iframe", "object", "param", "picture", "portal", "source", "svg", "math", "canvas", "noscript", "script", "del", "ins", "caption", "col", "colgroup", "table", "tbody", "td", "tfoot", "th", "thead", "tr", "button", "datalist", "fieldset", "form", "input", "label", "legend", "meter", "optgroup", "option", "output", "progress", "select", "textarea", "details", "dialog", "menu", "summary", "details", "slot", "template", "acronym", "applet", "basefont", "bgsound", "big", "blink", "center", "content", "dir", "font", "frame", "frameset", "hgroup", "image", "keygen", "marquee", "menuitem", "nobr", "noembed", "noframes", "plaintext", "rb", "rtc", "shadow", "spacer", "strike", "tt", "xmp", "a", "abbr", "acronym", "address", "applet", "area", "article", "aside", "audio", "b", "base", "basefont", "bdi", "bdo", "bgsound", "big", "blink", "blockquote", "body", "br", "button", "canvas", "caption", "center", "cite", "code", "col", "colgroup", "content", "data", "datalist", "dd", "del", "details", "dfn", "dialog", "dir", "div", "dl", "dt", "em", "embed", "fieldset", "figcaption", "figure", "font", "footer", "form", "frame", "frameset", "head", "header", "hgroup", "hr", "html", "i", "iframe", "image", "img", "input", "ins", "kbd", "keygen", "label", "legend", "li", "link", "main", "map", "mark", "marquee", "menu", "menuitem", "meta", "meter", "nav", "nobr", "noembed", "noframes", "noscript", "object", "ol", "optgroup", "option", "output", "p", "param", "picture", "plaintext", "portal", "pre", "progress", "q", "rb", "rp", "rt", "rtc", "ruby", "s", "samp", "script", "section", "select", "shadow", "slot", "small", "source", "spacer", "span", "strike", "strong", "style", "sub", "summary", "sup", "table", "tbody", "td", "template", "textarea", "tfoot", "th", "thead", "time", "title", "tr", "track", "tt", "u", "ul", "var", "video", "wbr", "xmp", "input"]);
 
-function memo(fn, equals) {
-  return solidJs.createMemo(fn, undefined, !equals ? {
-    equals
-  } : undefined);
-}
-
 function reconcileArrays(parentNode, a, b) {
   let bLength = b.length,
       aEnd = a.length,
@@ -95,12 +87,12 @@ function reconcileArrays(parentNode, a, b) {
 }
 
 const $$EVENTS = "_$DX_DELEGATE";
-function render(code, element, init) {
+function render(code, element, init, options = {}) {
   let disposer;
   solidJs.createRoot(dispose => {
     disposer = dispose;
     element === document ? code() : insert(element, code(), element.firstChild ? null : undefined, init);
-  });
+  }, options.owner);
   return () => {
     disposer();
     element.textContent = "";
@@ -169,11 +161,12 @@ function classList(node, value, prev = {}) {
   }
   return prev;
 }
-function style(node, value, prev = {}) {
+function style(node, value, prev) {
+  if (!value) return prev ? setAttribute(node, "style") : value;
   const nodeStyle = node.style;
-  const prevString = typeof prev === "string";
-  if (value == null && prevString || typeof value === "string") return nodeStyle.cssText = value;
-  prevString && (nodeStyle.cssText = undefined, prev = {});
+  if (typeof value === "string") return nodeStyle.cssText = value;
+  typeof prev === "string" && (nodeStyle.cssText = prev = undefined);
+  prev || (prev = {});
   value || (value = {});
   let v, s;
   for (s in prev) {
@@ -189,10 +182,14 @@ function style(node, value, prev = {}) {
   }
   return prev;
 }
-function spread(node, accessor, isSVG, skipChildren) {
-  if (typeof accessor === "function") {
-    solidJs.createRenderEffect(current => spreadExpression(node, accessor(), current, isSVG, skipChildren));
-  } else spreadExpression(node, accessor, undefined, isSVG, skipChildren);
+function spread(node, props = {}, isSVG, skipChildren) {
+  const prevProps = {};
+  if (!skipChildren) {
+    solidJs.createRenderEffect(() => prevProps.children = insertExpression(node, props.children, prevProps.children));
+  }
+  solidJs.createRenderEffect(() => props.ref && props.ref(node));
+  solidJs.createRenderEffect(() => assign(node, props, isSVG, true, prevProps, true));
+  return prevProps;
 }
 function dynamicProperty(props, key) {
   const src = props[key];
@@ -220,7 +217,7 @@ function assign(node, props, isSVG, skipChildren, prevProps = {}, skipRef = fals
   for (const prop in prevProps) {
     if (!(prop in props)) {
       if (prop === "children") continue;
-      assignProp(node, prop, null, prevProps[prop], isSVG, skipRef);
+      prevProps[prop] = assignProp(node, prop, null, prevProps[prop], isSVG, skipRef);
     }
   }
   for (const prop in props) {
@@ -243,7 +240,7 @@ function hydrate$1(code, element, options = {}) {
     count: 0
   };
   gatherHydratable(element, options.renderId);
-  const dispose = render(code, element, [...element.childNodes]);
+  const dispose = render(code, element, [...element.childNodes], options);
   solidJs.sharedConfig.context = null;
   return dispose;
 }
@@ -312,9 +309,7 @@ function assignProp(node, prop, value, prev, isSVG, skipRef) {
   if (prop === "classList") return classList(node, value, prev);
   if (value === prev) return prev;
   if (prop === "ref") {
-    if (!skipRef) {
-      value(node);
-    }
+    if (!skipRef) value(node);
   } else if (prop.slice(0, 3) === "on:") {
     const e = prop.slice(3);
     prev && node.removeEventListener(e, prev);
@@ -371,15 +366,6 @@ function eventHandler(e) {
     node = node.host && node.host !== node && node.host instanceof Node ? node.host : node.parentNode;
   }
 }
-function spreadExpression(node, props, prevProps = {}, isSVG, skipChildren) {
-  props || (props = {});
-  if (!skipChildren) {
-    solidJs.createRenderEffect(() => prevProps.children = insertExpression(node, props.children, prevProps.children));
-  }
-  solidJs.createRenderEffect(() => props.ref && props.ref(node));
-  solidJs.createRenderEffect(() => assign(node, props, isSVG, true, prevProps, true));
-  return prevProps;
-}
 function insertExpression(parent, value, current, marker, unwrapArray) {
   if (solidJs.sharedConfig.context && !current) current = [...parent.childNodes];
   while (typeof current === "function") current = current();
@@ -474,7 +460,7 @@ function normalizeIncomingArray(normalized, array, current, unwrap) {
   }
   return dynamic;
 }
-function appendNodes(parent, array, marker) {
+function appendNodes(parent, array, marker = null) {
   for (let i = 0, len = array.length; i < len; i++) parent.insertBefore(array[i], marker);
 }
 function cleanChildren(parent, current, marker, replacement) {
@@ -507,6 +493,9 @@ function getHydrationKey() {
 function NoHydration(props) {
   return solidJs.sharedConfig.context ? undefined : props.children;
 }
+function Hydration(props) {
+  return props.children;
+}
 function voidFn() {}
 
 function throwInBrowser(func) {
@@ -642,6 +631,10 @@ Object.defineProperty(exports, 'getOwner', {
   enumerable: true,
   get: function () { return solidJs.getOwner; }
 });
+Object.defineProperty(exports, 'memo', {
+  enumerable: true,
+  get: function () { return solidJs.createMemo; }
+});
 Object.defineProperty(exports, 'mergeProps', {
   enumerable: true,
   get: function () { return solidJs.mergeProps; }
@@ -656,6 +649,7 @@ exports.ChildProperties = ChildProperties;
 exports.DOMElements = DOMElements;
 exports.DelegatedEvents = DelegatedEvents;
 exports.Dynamic = Dynamic;
+exports.Hydration = Hydration;
 exports.HydrationScript = voidFn;
 exports.NoHydration = NoHydration;
 exports.Portal = Portal;
@@ -681,7 +675,6 @@ exports.hydrate = hydrate;
 exports.innerHTML = innerHTML;
 exports.insert = insert;
 exports.isServer = isServer;
-exports.memo = memo;
 exports.render = render;
 exports.renderToStream = renderToStream;
 exports.renderToString = renderToString;

package/web/dist/dev.js

@@ -1,21 +1,19 @@
-import { createMemo, createRoot, createRenderEffect, sharedConfig, untrack, enableHydration, createSignal, onCleanup, splitProps, $DEVCOMP } from 'solid-js';
-export { ErrorBoundary, For, Index, Match, Show, Suspense, SuspenseList, Switch, createComponent, createRenderEffect as effect, getOwner, mergeProps, untrack } from 'solid-js';
+import { createRoot, createRenderEffect, sharedConfig, untrack, enableHydration, createSignal, onCleanup, splitProps, createMemo, $DEVCOMP } from 'solid-js';
+export { ErrorBoundary, For, Index, Match, Show, Suspense, SuspenseList, Switch, createComponent, createRenderEffect as effect, getOwner, createMemo as memo, mergeProps, untrack } from 'solid-js';
 
 const booleans = ["allowfullscreen", "async", "autofocus", "autoplay", "checked", "controls", "default", "disabled", "formnovalidate", "hidden", "indeterminate", "ismap", "loop", "multiple", "muted", "nomodule", "novalidate", "open", "playsinline", "readonly", "required", "reversed", "seamless", "selected"];
 const Properties = /*#__PURE__*/new Set(["className", "value", "readOnly", "formNoValidate", "isMap", "noModule", "playsInline", ...booleans]);
 const ChildProperties = /*#__PURE__*/new Set(["innerHTML", "textContent", "innerText", "children"]);
-const Aliases = {
-  className: "class",
-  htmlFor: "for"
-};
-const PropAliases = {
-  class: "className",
-  formnovalidate: "formNoValidate",
-  ismap: "isMap",
-  nomodule: "noModule",
-  playsinline: "playsInline",
-  readonly: "readOnly"
-};
+const Aliases = Object.create(null);
+Aliases.className = "class";
+Aliases.htmlFor = "for";
+const PropAliases = Object.create(null);
+PropAliases.class = "className";
+PropAliases.formnovalidate = "formNoValidate";
+PropAliases.ismap = "isMap";
+PropAliases.nomodule = "noModule";
+PropAliases.playsinline = "playsInline";
+PropAliases.readonly = "readOnly";
 const DelegatedEvents = /*#__PURE__*/new Set(["beforeinput", "click", "dblclick", "contextmenu", "focusin", "focusout", "input", "keydown", "keyup", "mousedown", "mousemove", "mouseout", "mouseover", "mouseup", "pointerdown", "pointermove", "pointerout", "pointerover", "pointerup", "touchend", "touchmove", "touchstart"]);
 const SVGElements = /*#__PURE__*/new Set([
 "altGlyph", "altGlyphDef", "altGlyphItem", "animate", "animateColor", "animateMotion", "animateTransform", "circle", "clipPath", "color-profile", "cursor", "defs", "desc", "ellipse", "feBlend", "feColorMatrix", "feComponentTransfer", "feComposite", "feConvolveMatrix", "feDiffuseLighting", "feDisplacementMap", "feDistantLight", "feFlood", "feFuncA", "feFuncB", "feFuncG", "feFuncR", "feGaussianBlur", "feImage", "feMerge", "feMergeNode", "feMorphology", "feOffset", "fePointLight", "feSpecularLighting", "feSpotLight", "feTile", "feTurbulence", "filter", "font", "font-face", "font-face-format", "font-face-name", "font-face-src", "font-face-uri", "foreignObject", "g", "glyph", "glyphRef", "hkern", "image", "line", "linearGradient", "marker", "mask", "metadata", "missing-glyph", "mpath", "path", "pattern", "polygon", "polyline", "radialGradient", "rect",
@@ -28,12 +26,6 @@ const SVGNamespace = {
 };
 const DOMElements = /*#__PURE__*/new Set(["html", "base", "head", "link", "meta", "style", "title", "body", "address", "article", "aside", "footer", "header", "main", "nav", "section", "body", "blockquote", "dd", "div", "dl", "dt", "figcaption", "figure", "hr", "li", "ol", "p", "pre", "ul", "a", "abbr", "b", "bdi", "bdo", "br", "cite", "code", "data", "dfn", "em", "i", "kbd", "mark", "q", "rp", "rt", "ruby", "s", "samp", "small", "span", "strong", "sub", "sup", "time", "u", "var", "wbr", "area", "audio", "img", "map", "track", "video", "embed", "iframe", "object", "param", "picture", "portal", "source", "svg", "math", "canvas", "noscript", "script", "del", "ins", "caption", "col", "colgroup", "table", "tbody", "td", "tfoot", "th", "thead", "tr", "button", "datalist", "fieldset", "form", "input", "label", "legend", "meter", "optgroup", "option", "output", "progress", "select", "textarea", "details", "dialog", "menu", "summary", "details", "slot", "template", "acronym", "applet", "basefont", "bgsound", "big", "blink", "center", "content", "dir", "font", "frame", "frameset", "hgroup", "image", "keygen", "marquee", "menuitem", "nobr", "noembed", "noframes", "plaintext", "rb", "rtc", "shadow", "spacer", "strike", "tt", "xmp", "a", "abbr", "acronym", "address", "applet", "area", "article", "aside", "audio", "b", "base", "basefont", "bdi", "bdo", "bgsound", "big", "blink", "blockquote", "body", "br", "button", "canvas", "caption", "center", "cite", "code", "col", "colgroup", "content", "data", "datalist", "dd", "del", "details", "dfn", "dialog", "dir", "div", "dl", "dt", "em", "embed", "fieldset", "figcaption", "figure", "font", "footer", "form", "frame", "frameset", "head", "header", "hgroup", "hr", "html", "i", "iframe", "image", "img", "input", "ins", "kbd", "keygen", "label", "legend", "li", "link", "main", "map", "mark", "marquee", "menu", "menuitem", "meta", "meter", "nav", "nobr", "noembed", "noframes", "noscript", "object", "ol", "optgroup", "option", "output", "p", "param", "picture", "plaintext", "portal", "pre", "progress", "q", "rb", "rp", "rt", "rtc", "ruby", "s", "samp", "script", "section", "select", "shadow", "slot", "small", "source", "spacer", "span", "strike", "strong", "style", "sub", "summary", "sup", "table", "tbody", "td", "template", "textarea", "tfoot", "th", "thead", "time", "title", "tr", "track", "tt", "u", "ul", "var", "video", "wbr", "xmp", "input"]);
 
-function memo(fn, equals) {
-  return createMemo(fn, undefined, !equals ? {
-    equals
-  } : undefined);
-}
-
 function reconcileArrays(parentNode, a, b) {
   let bLength = b.length,
       aEnd = a.length,
@@ -92,12 +84,12 @@ function reconcileArrays(parentNode, a, b) {
 }
 
 const $$EVENTS = "_$DX_DELEGATE";
-function render(code, element, init) {
+function render(code, element, init, options = {}) {
   let disposer;
   createRoot(dispose => {
     disposer = dispose;
     element === document ? code() : insert(element, code(), element.firstChild ? null : undefined, init);
-  });
+  }, options.owner);
   return () => {
     disposer();
     element.textContent = "";
@@ -166,11 +158,12 @@ function classList(node, value, prev = {}) {
   }
   return prev;
 }
-function style(node, value, prev = {}) {
+function style(node, value, prev) {
+  if (!value) return prev ? setAttribute(node, "style") : value;
   const nodeStyle = node.style;
-  const prevString = typeof prev === "string";
-  if (value == null && prevString || typeof value === "string") return nodeStyle.cssText = value;
-  prevString && (nodeStyle.cssText = undefined, prev = {});
+  if (typeof value === "string") return nodeStyle.cssText = value;
+  typeof prev === "string" && (nodeStyle.cssText = prev = undefined);
+  prev || (prev = {});
   value || (value = {});
   let v, s;
   for (s in prev) {
@@ -186,10 +179,14 @@ function style(node, value, prev = {}) {
   }
   return prev;
 }
-function spread(node, accessor, isSVG, skipChildren) {
-  if (typeof accessor === "function") {
-    createRenderEffect(current => spreadExpression(node, accessor(), current, isSVG, skipChildren));
-  } else spreadExpression(node, accessor, undefined, isSVG, skipChildren);
+function spread(node, props = {}, isSVG, skipChildren) {
+  const prevProps = {};
+  if (!skipChildren) {
+    createRenderEffect(() => prevProps.children = insertExpression(node, props.children, prevProps.children));
+  }
+  createRenderEffect(() => props.ref && props.ref(node));
+  createRenderEffect(() => assign(node, props, isSVG, true, prevProps, true));
+  return prevProps;
 }
 function dynamicProperty(props, key) {
   const src = props[key];
@@ -217,7 +214,7 @@ function assign(node, props, isSVG, skipChildren, prevProps = {}, skipRef = fals
   for (const prop in prevProps) {
     if (!(prop in props)) {
       if (prop === "children") continue;
-      assignProp(node, prop, null, prevProps[prop], isSVG, skipRef);
+      prevProps[prop] = assignProp(node, prop, null, prevProps[prop], isSVG, skipRef);
     }
   }
   for (const prop in props) {
@@ -240,7 +237,7 @@ function hydrate$1(code, element, options = {}) {
     count: 0
   };
   gatherHydratable(element, options.renderId);
-  const dispose = render(code, element, [...element.childNodes]);
+  const dispose = render(code, element, [...element.childNodes], options);
   sharedConfig.context = null;
   return dispose;
 }
@@ -309,9 +306,7 @@ function assignProp(node, prop, value, prev, isSVG, skipRef) {
   if (prop === "classList") return classList(node, value, prev);
   if (value === prev) return prev;
   if (prop === "ref") {
-    if (!skipRef) {
-      value(node);
-    }
+    if (!skipRef) value(node);
   } else if (prop.slice(0, 3) === "on:") {
     const e = prop.slice(3);
     prev && node.removeEventListener(e, prev);
@@ -368,15 +363,6 @@ function eventHandler(e) {
     node = node.host && node.host !== node && node.host instanceof Node ? node.host : node.parentNode;
   }
 }
-function spreadExpression(node, props, prevProps = {}, isSVG, skipChildren) {
-  props || (props = {});
-  if (!skipChildren) {
-    createRenderEffect(() => prevProps.children = insertExpression(node, props.children, prevProps.children));
-  }
-  createRenderEffect(() => props.ref && props.ref(node));
-  createRenderEffect(() => assign(node, props, isSVG, true, prevProps, true));
-  return prevProps;
-}
 function insertExpression(parent, value, current, marker, unwrapArray) {
   if (sharedConfig.context && !current) current = [...parent.childNodes];
   while (typeof current === "function") current = current();
@@ -471,7 +457,7 @@ function normalizeIncomingArray(normalized, array, current, unwrap) {
   }
   return dynamic;
 }
-function appendNodes(parent, array, marker) {
+function appendNodes(parent, array, marker = null) {
   for (let i = 0, len = array.length; i < len; i++) parent.insertBefore(array[i], marker);
 }
 function cleanChildren(parent, current, marker, replacement) {
@@ -504,6 +490,9 @@ function getHydrationKey() {
 function NoHydration(props) {
   return sharedConfig.context ? undefined : props.children;
 }
+function Hydration(props) {
+  return props.children;
+}
 function voidFn() {}
 
 function throwInBrowser(func) {
@@ -595,4 +584,4 @@ function Dynamic(props) {
   });
 }
 
-export { Aliases, voidFn as Assets, ChildProperties, DOMElements, DelegatedEvents, Dynamic, voidFn as HydrationScript, NoHydration, Portal, PropAliases, Properties, SVGElements, SVGNamespace, addEventListener, assign, classList, className, clearDelegatedEvents, delegateEvents, dynamicProperty, escape, voidFn as generateHydrationScript, voidFn as getAssets, getHydrationKey, getNextElement, getNextMarker, getNextMatch, hydrate, innerHTML, insert, isServer, memo, render, renderToStream, renderToString, renderToStringAsync, resolveSSRNode, runHydrationEvents, setAttribute, setAttributeNS, spread, ssr, ssrAttribute, ssrClassList, ssrElement, ssrHydrationKey, ssrSpread, ssrStyle, style, template, use, voidFn as useAssets };
+export { Aliases, voidFn as Assets, ChildProperties, DOMElements, DelegatedEvents, Dynamic, Hydration, voidFn as HydrationScript, NoHydration, Portal, PropAliases, Properties, SVGElements, SVGNamespace, addEventListener, assign, classList, className, clearDelegatedEvents, delegateEvents, dynamicProperty, escape, voidFn as generateHydrationScript, voidFn as getAssets, getHydrationKey, getNextElement, getNextMarker, getNextMatch, hydrate, innerHTML, insert, isServer, render, renderToStream, renderToString, renderToStringAsync, resolveSSRNode, runHydrationEvents, setAttribute, setAttributeNS, spread, ssr, ssrAttribute, ssrClassList, ssrElement, ssrHydrationKey, ssrSpread, ssrStyle, style, template, use, voidFn as useAssets };

package/web/dist/server.cjs

@@ -8,10 +8,16 @@ const booleans = ["allowfullscreen", "async", "autofocus", "autoplay", "checked"
 const BooleanAttributes = /*#__PURE__*/new Set(booleans);
 /*#__PURE__*/new Set(["className", "value", "readOnly", "formNoValidate", "isMap", "noModule", "playsInline", ...booleans]);
 const ChildProperties = /*#__PURE__*/new Set(["innerHTML", "textContent", "innerText", "children"]);
-const Aliases = {
-  className: "class",
-  htmlFor: "for"
-};
+const Aliases = Object.create(null);
+Aliases.className = "class";
+Aliases.htmlFor = "for";
+const PropAliases = Object.create(null);
+PropAliases.class = "className";
+PropAliases.formnovalidate = "formNoValidate";
+PropAliases.ismap = "isMap";
+PropAliases.nomodule = "noModule";
+PropAliases.playsinline = "playsInline";
+PropAliases.readonly = "readOnly";
 
 const {
   hasOwnProperty
@@ -273,6 +279,7 @@ function renderToString(code, options = {}) {
     assets: [],
     nonce: options.nonce,
     writeResource(id, p, error) {
+      if (solidJs.sharedConfig.context.noHydrate) return;
       if (error) return scripts += `_$HY.set("${id}", ${serializeError(p)});`;
       scripts += `_$HY.set("${id}", ${stringify(p)});`;
     }
@@ -365,9 +372,11 @@ function renderToStream(code, options = {}) {
       html = html.replace(html.slice(first, last + placeholder.length + 1), resolveSSRNode(payloadFn()));
     },
     writeResource(id, p, error, wait) {
-      if (error) return pushTask(serializeSet(dedupe, id, p, serializeError));
-      if (!p || typeof p !== "object" || !("then" in p)) return pushTask(serializeSet(dedupe, id, p));
-      if (!firstFlushed) wait && blockingResources.push(p);else pushTask(`_$HY.init("${id}")`);
+      const serverOnly = solidJs.sharedConfig.context.noHydrate;
+      if (error) return !serverOnly && pushTask(serializeSet(dedupe, id, p, serializeError));
+      if (!p || typeof p !== "object" || !("then" in p)) return !serverOnly && pushTask(serializeSet(dedupe, id, p));
+      if (!firstFlushed) wait && blockingResources.push(p);else !serverOnly && pushTask(`_$HY.init("${id}")`);
+      if (serverOnly) return;
       p.then(d => {
         !completed && pushTask(serializeSet(dedupe, id, d));
       }).catch(() => {
@@ -466,9 +475,6 @@ function renderToStream(code, options = {}) {
     }
   };
 }
-function Assets(props) {
-  useAssets(() => props.children);
-}
 function HydrationScript(props) {
   const {
     nonce
@@ -478,13 +484,6 @@ function HydrationScript(props) {
     ...props
   }));
 }
-function NoHydration(props) {
-  const c = solidJs.sharedConfig.context;
-  c.noHydrate = true;
-  const children = props.children;
-  c.noHydrate = false;
-  return children;
-}
 function ssr(t, ...nodes) {
   if (nodes.length) {
     let result = "";
@@ -506,7 +505,7 @@ function ssrClassList(value) {
   for (let i = 0, len = classKeys.length; i < len; i++) {
     const key = classKeys[i],
           classValue = !!value[key];
-    if (!key || !classValue) continue;
+    if (!key || key === "undefined" || !classValue) continue;
     i && (result += " ");
     result += key;
   }
@@ -519,8 +518,11 @@ function ssrStyle(value) {
   const k = Object.keys(value);
   for (let i = 0; i < k.length; i++) {
     const s = k[i];
-    if (i) result += ";";
-    result += `${s}:${escape(value[s], true)}`;
+    const v = value[s];
+    if (v != undefined) {
+      if (i) result += ";";
+      result += `${s}:${escape(v, true)}`;
+    }
   }
   return result;
 }
@@ -644,6 +646,14 @@ function generateHydrationScript({
 } = {}) {
   return `<script${nonce ? ` nonce="${nonce}"` : ""}>var e,t;e=window._$HY||(_$HY={events:[],completed:new WeakSet,r:{}}),t=e=>e&&e.hasAttribute&&(e.hasAttribute("data-hk")?e:t(e.host&&e.host instanceof Node?e.host:e.parentNode)),["${eventNames.join('","')}"].forEach((o=>document.addEventListener(o,(o=>{let s=o.composedPath&&o.composedPath()[0]||o.target,a=t(s);a&&!e.completed.has(a)&&e.events.push([a,o])})))),e.init=(t,o)=>{e.r[t]=[new Promise(((e,t)=>o=e)),o]},e.set=(t,o,s)=>{(s=e.r[t])&&s[1](o),e.r[t]=[o]},e.unset=t=>{delete e.r[t]},e.load=t=>e.r[t];</script><!--xs-->`;
 }
+function Hydration(props) {
+  solidJs.sharedConfig.context.noHydrate = false;
+  return props.children;
+}
+function NoHydration(props) {
+  solidJs.sharedConfig.context.noHydrate = true;
+  return props.children;
+}
 function injectAssets(assets, html) {
   if (!assets || !assets.length) return html;
   let out = "";
@@ -705,6 +715,9 @@ function replacePlaceholder(html, key, value) {
   }
   return html.slice(0, first) + value + html.slice(nextRegex.lastIndex);
 }
+function Assets(props) {
+  useAssets(() => props.children);
+}
 function pipeToNodeWritable(code, writable, options = {}) {
   if (options.onReady) {
     options.onCompleteShell = ({
@@ -829,6 +842,7 @@ Object.defineProperty(exports, 'mergeProps', {
 });
 exports.Assets = Assets;
 exports.Dynamic = Dynamic;
+exports.Hydration = Hydration;
 exports.HydrationScript = HydrationScript;
 exports.NoHydration = NoHydration;
 exports.Portal = Portal;

package/web/dist/server.js

@@ -5,10 +5,16 @@ const booleans = ["allowfullscreen", "async", "autofocus", "autoplay", "checked"
 const BooleanAttributes = /*#__PURE__*/new Set(booleans);
 /*#__PURE__*/new Set(["className", "value", "readOnly", "formNoValidate", "isMap", "noModule", "playsInline", ...booleans]);
 const ChildProperties = /*#__PURE__*/new Set(["innerHTML", "textContent", "innerText", "children"]);
-const Aliases = {
-  className: "class",
-  htmlFor: "for"
-};
+const Aliases = Object.create(null);
+Aliases.className = "class";
+Aliases.htmlFor = "for";
+const PropAliases = Object.create(null);
+PropAliases.class = "className";
+PropAliases.formnovalidate = "formNoValidate";
+PropAliases.ismap = "isMap";
+PropAliases.nomodule = "noModule";
+PropAliases.playsinline = "playsInline";
+PropAliases.readonly = "readOnly";
 
 const {
   hasOwnProperty
@@ -270,6 +276,7 @@ function renderToString(code, options = {}) {
     assets: [],
     nonce: options.nonce,
     writeResource(id, p, error) {
+      if (sharedConfig.context.noHydrate) return;
       if (error) return scripts += `_$HY.set("${id}", ${serializeError(p)});`;
       scripts += `_$HY.set("${id}", ${stringify(p)});`;
     }
@@ -362,9 +369,11 @@ function renderToStream(code, options = {}) {
       html = html.replace(html.slice(first, last + placeholder.length + 1), resolveSSRNode(payloadFn()));
     },
     writeResource(id, p, error, wait) {
-      if (error) return pushTask(serializeSet(dedupe, id, p, serializeError));
-      if (!p || typeof p !== "object" || !("then" in p)) return pushTask(serializeSet(dedupe, id, p));
-      if (!firstFlushed) wait && blockingResources.push(p);else pushTask(`_$HY.init("${id}")`);
+      const serverOnly = sharedConfig.context.noHydrate;
+      if (error) return !serverOnly && pushTask(serializeSet(dedupe, id, p, serializeError));
+      if (!p || typeof p !== "object" || !("then" in p)) return !serverOnly && pushTask(serializeSet(dedupe, id, p));
+      if (!firstFlushed) wait && blockingResources.push(p);else !serverOnly && pushTask(`_$HY.init("${id}")`);
+      if (serverOnly) return;
       p.then(d => {
         !completed && pushTask(serializeSet(dedupe, id, d));
       }).catch(() => {
@@ -463,9 +472,6 @@ function renderToStream(code, options = {}) {
     }
   };
 }
-function Assets(props) {
-  useAssets(() => props.children);
-}
 function HydrationScript(props) {
   const {
     nonce
@@ -475,13 +481,6 @@ function HydrationScript(props) {
     ...props
   }));
 }
-function NoHydration(props) {
-  const c = sharedConfig.context;
-  c.noHydrate = true;
-  const children = props.children;
-  c.noHydrate = false;
-  return children;
-}
 function ssr(t, ...nodes) {
   if (nodes.length) {
     let result = "";
@@ -503,7 +502,7 @@ function ssrClassList(value) {
   for (let i = 0, len = classKeys.length; i < len; i++) {
     const key = classKeys[i],
           classValue = !!value[key];
-    if (!key || !classValue) continue;
+    if (!key || key === "undefined" || !classValue) continue;
     i && (result += " ");
     result += key;
   }
@@ -516,8 +515,11 @@ function ssrStyle(value) {
   const k = Object.keys(value);
   for (let i = 0; i < k.length; i++) {
     const s = k[i];
-    if (i) result += ";";
-    result += `${s}:${escape(value[s], true)}`;
+    const v = value[s];
+    if (v != undefined) {
+      if (i) result += ";";
+      result += `${s}:${escape(v, true)}`;
+    }
   }
   return result;
 }
@@ -641,6 +643,14 @@ function generateHydrationScript({
 } = {}) {
   return `<script${nonce ? ` nonce="${nonce}"` : ""}>var e,t;e=window._$HY||(_$HY={events:[],completed:new WeakSet,r:{}}),t=e=>e&&e.hasAttribute&&(e.hasAttribute("data-hk")?e:t(e.host&&e.host instanceof Node?e.host:e.parentNode)),["${eventNames.join('","')}"].forEach((o=>document.addEventListener(o,(o=>{let s=o.composedPath&&o.composedPath()[0]||o.target,a=t(s);a&&!e.completed.has(a)&&e.events.push([a,o])})))),e.init=(t,o)=>{e.r[t]=[new Promise(((e,t)=>o=e)),o]},e.set=(t,o,s)=>{(s=e.r[t])&&s[1](o),e.r[t]=[o]},e.unset=t=>{delete e.r[t]},e.load=t=>e.r[t];</script><!--xs-->`;
 }
+function Hydration(props) {
+  sharedConfig.context.noHydrate = false;
+  return props.children;
+}
+function NoHydration(props) {
+  sharedConfig.context.noHydrate = true;
+  return props.children;
+}
 function injectAssets(assets, html) {
   if (!assets || !assets.length) return html;
   let out = "";
@@ -702,6 +712,9 @@ function replacePlaceholder(html, key, value) {
   }
   return html.slice(0, first) + value + html.slice(nextRegex.lastIndex);
 }
+function Assets(props) {
+  useAssets(() => props.children);
+}
 function pipeToNodeWritable(code, writable, options = {}) {
   if (options.onReady) {
     options.onCompleteShell = ({
@@ -784,4 +797,4 @@ function Portal(props) {
   return "";
 }
 
-export { Assets, Dynamic, HydrationScript, NoHydration, Portal, delegateEvents, escape, generateHydrationScript, getAssets, getHydrationKey, insert, isServer, pipeToNodeWritable, pipeToWritable, renderToStream, renderToString, renderToStringAsync, resolveSSRNode, spread, ssr, ssrAttribute, ssrClassList, ssrElement, ssrHydrationKey, ssrSpread, ssrStyle, useAssets };
+export { Assets, Dynamic, Hydration, HydrationScript, NoHydration, Portal, delegateEvents, escape, generateHydrationScript, getAssets, getHydrationKey, insert, isServer, pipeToNodeWritable, pipeToWritable, renderToStream, renderToString, renderToStringAsync, resolveSSRNode, spread, ssr, ssrAttribute, ssrClassList, ssrElement, ssrHydrationKey, ssrSpread, ssrStyle, useAssets };