solid-js 1.3.14 → 1.3.17

package/dist/dev.cjs

@@ -388,7 +388,7 @@ function createSelector(source, fn = equalFn, options) {
   const subs = new Map();
   const node = createComputation(p => {
     const v = source();
-    for (const key of subs.keys()) if (fn(key, v) !== (p !== undefined && fn(key, p))) {
+    for (const key of subs.keys()) if (fn(key, v) !== fn(key, p)) {
       const l = subs.get(key);
       for (const c of l.values()) {
         c.state = STALE;
@@ -448,8 +448,8 @@ options) {
   return prevValue => {
     let input;
     if (isArray) {
-      input = [];
-      for (let i = 0; i < deps.length; i++) input.push(deps[i]());
+      input = Array(deps.length);
+      for (let i = 0; i < deps.length; i++) input[i] = deps[i]();
     } else input = deps();
     if (defer) {
       defer = false;
@@ -880,6 +880,7 @@ function runUserEffects(queue) {
     const e = queue[i];
     if (!e.user) runTop(e);else queue[userLength++] = e;
   }
+  if (sharedConfig.context) setHydrateContext();
   const resume = queue.length;
   for (i = 0; i < userLength; i++) runTop(queue[i]);
   for (i = resume; i < queue.length; i++) runTop(queue[i]);
@@ -1532,7 +1533,7 @@ function Suspense(props) {
       });
       flicker = s;
       p.then(err => {
-        if (error = err) return set();
+        if ((error = err) || sharedConfig.done) return set();
         sharedConfig.gather(key);
         setHydrateContext(ctx);
         set();

package/dist/dev.js

@@ -384,7 +384,7 @@ function createSelector(source, fn = equalFn, options) {
   const subs = new Map();
   const node = createComputation(p => {
     const v = source();
-    for (const key of subs.keys()) if (fn(key, v) !== (p !== undefined && fn(key, p))) {
+    for (const key of subs.keys()) if (fn(key, v) !== fn(key, p)) {
       const l = subs.get(key);
       for (const c of l.values()) {
         c.state = STALE;
@@ -444,8 +444,8 @@ options) {
   return prevValue => {
     let input;
     if (isArray) {
-      input = [];
-      for (let i = 0; i < deps.length; i++) input.push(deps[i]());
+      input = Array(deps.length);
+      for (let i = 0; i < deps.length; i++) input[i] = deps[i]();
     } else input = deps();
     if (defer) {
       defer = false;
@@ -876,6 +876,7 @@ function runUserEffects(queue) {
     const e = queue[i];
     if (!e.user) runTop(e);else queue[userLength++] = e;
   }
+  if (sharedConfig.context) setHydrateContext();
   const resume = queue.length;
   for (i = 0; i < userLength; i++) runTop(queue[i]);
   for (i = resume; i < queue.length; i++) runTop(queue[i]);
@@ -1528,7 +1529,7 @@ function Suspense(props) {
       });
       flicker = s;
       p.then(err => {
-        if (error = err) return set();
+        if ((error = err) || sharedConfig.done) return set();
         sharedConfig.gather(key);
         setHydrateContext(ctx);
         set();

package/dist/server.cjs

@@ -221,7 +221,11 @@ function resolveSSRNode(node) {
   const t = typeof node;
   if (t === "string") return node;
   if (node == null || t === "boolean") return "";
-  if (Array.isArray(node)) return node.map(resolveSSRNode).join("");
+  if (Array.isArray(node)) {
+    let mapped = "";
+    for (let i = 0, len = node.length; i < len; i++) mapped += resolveSSRNode(node[i]);
+    return mapped;
+  }
   if (t === "object") return resolveSSRNode(node.t);
   if (t === "function") return resolveSSRNode(node());
   return String(node);
@@ -279,13 +283,11 @@ function simpleMap(props, wrap) {
         len = list.length,
         fn = props.children;
   if (len) {
-    let mapped = "";
-    for (let i = 0; i < len; i++) mapped += resolveSSRNode(wrap(fn, list[i], i));
-    return {
-      t: mapped
-    };
+    let mapped = Array(len);
+    for (let i = 0; i < len; i++) mapped[i] = wrap(fn, list[i], i);
+    return mapped;
   }
-  return props.fallback || "";
+  return props.fallback;
 }
 function For(props) {
   return simpleMap(props, (fn, item, i) => fn(item, () => i));
@@ -508,7 +510,7 @@ function Suspense(props) {
   if (ctx.streaming) {
     setHydrateContext(undefined);
     const res = {
-      t: `<span id="pl${id}">${resolveSSRNode(props.fallback)}</span>`
+      t: `<span id="pl-${id}">${resolveSSRNode(props.fallback)}</span>`
     };
     setHydrateContext(ctx);
     return res;

package/dist/server.js

@@ -217,7 +217,11 @@ function resolveSSRNode(node) {
   const t = typeof node;
   if (t === "string") return node;
   if (node == null || t === "boolean") return "";
-  if (Array.isArray(node)) return node.map(resolveSSRNode).join("");
+  if (Array.isArray(node)) {
+    let mapped = "";
+    for (let i = 0, len = node.length; i < len; i++) mapped += resolveSSRNode(node[i]);
+    return mapped;
+  }
   if (t === "object") return resolveSSRNode(node.t);
   if (t === "function") return resolveSSRNode(node());
   return String(node);
@@ -275,13 +279,11 @@ function simpleMap(props, wrap) {
         len = list.length,
         fn = props.children;
   if (len) {
-    let mapped = "";
-    for (let i = 0; i < len; i++) mapped += resolveSSRNode(wrap(fn, list[i], i));
-    return {
-      t: mapped
-    };
+    let mapped = Array(len);
+    for (let i = 0; i < len; i++) mapped[i] = wrap(fn, list[i], i);
+    return mapped;
   }
-  return props.fallback || "";
+  return props.fallback;
 }
 function For(props) {
   return simpleMap(props, (fn, item, i) => fn(item, () => i));
@@ -504,7 +506,7 @@ function Suspense(props) {
   if (ctx.streaming) {
     setHydrateContext(undefined);
     const res = {
-      t: `<span id="pl${id}">${resolveSSRNode(props.fallback)}</span>`
+      t: `<span id="pl-${id}">${resolveSSRNode(props.fallback)}</span>`
     };
     setHydrateContext(ctx);
     return res;

package/dist/solid.cjs

@@ -385,7 +385,7 @@ function createSelector(source, fn = equalFn, options) {
   const subs = new Map();
   const node = createComputation(p => {
     const v = source();
-    for (const key of subs.keys()) if (fn(key, v) !== (p !== undefined && fn(key, p))) {
+    for (const key of subs.keys()) if (fn(key, v) !== fn(key, p)) {
       const l = subs.get(key);
       for (const c of l.values()) {
         c.state = STALE;
@@ -445,8 +445,8 @@ options) {
   return prevValue => {
     let input;
     if (isArray) {
-      input = [];
-      for (let i = 0; i < deps.length; i++) input.push(deps[i]());
+      input = Array(deps.length);
+      for (let i = 0; i < deps.length; i++) input[i] = deps[i]();
     } else input = deps();
     if (defer) {
       defer = false;
@@ -822,6 +822,7 @@ function runUserEffects(queue) {
     const e = queue[i];
     if (!e.user) runTop(e);else queue[userLength++] = e;
   }
+  if (sharedConfig.context) setHydrateContext();
   const resume = queue.length;
   for (i = 0; i < userLength; i++) runTop(queue[i]);
   for (i = resume; i < queue.length; i++) runTop(queue[i]);
@@ -1447,7 +1448,7 @@ function Suspense(props) {
       });
       flicker = s;
       p.then(err => {
-        if (error = err) return set();
+        if ((error = err) || sharedConfig.done) return set();
         sharedConfig.gather(key);
         setHydrateContext(ctx);
         set();

package/dist/solid.js

@@ -381,7 +381,7 @@ function createSelector(source, fn = equalFn, options) {
   const subs = new Map();
   const node = createComputation(p => {
     const v = source();
-    for (const key of subs.keys()) if (fn(key, v) !== (p !== undefined && fn(key, p))) {
+    for (const key of subs.keys()) if (fn(key, v) !== fn(key, p)) {
       const l = subs.get(key);
       for (const c of l.values()) {
         c.state = STALE;
@@ -441,8 +441,8 @@ options) {
   return prevValue => {
     let input;
     if (isArray) {
-      input = [];
-      for (let i = 0; i < deps.length; i++) input.push(deps[i]());
+      input = Array(deps.length);
+      for (let i = 0; i < deps.length; i++) input[i] = deps[i]();
     } else input = deps();
     if (defer) {
       defer = false;
@@ -818,6 +818,7 @@ function runUserEffects(queue) {
     const e = queue[i];
     if (!e.user) runTop(e);else queue[userLength++] = e;
   }
+  if (sharedConfig.context) setHydrateContext();
   const resume = queue.length;
   for (i = 0; i < userLength; i++) runTop(queue[i]);
   for (i = resume; i < queue.length; i++) runTop(queue[i]);
@@ -1443,7 +1444,7 @@ function Suspense(props) {
       });
       flicker = s;
       p.then(err => {
-        if (error = err) return set();
+        if ((error = err) || sharedConfig.done) return set();
         sharedConfig.gather(key);
         setHydrateContext(ctx);
         set();

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "solid-js",
   "description": "A declarative JavaScript library for building user interfaces.",
-  "version": "1.3.14",
+  "version": "1.3.17",
   "author": "Ryan Carniato",
   "license": "MIT",
   "homepage": "https://solidjs.com",
@@ -144,5 +144,5 @@
     "compiler",
     "performance"
   ],
-  "gitHead": "9a41feafea10717e785c603eadb96c6133cd2988"
+  "gitHead": "88ce357264a4966d38d143143a3efe8a394e57c0"
 }

package/types/jsx.d.ts

@@ -23,7 +23,9 @@ export namespace JSX {
   interface ElementClass {
     // empty, libs can define requirements downstream
   }
-  type LibraryManagedAttributes<Component, Props> = Props;
+  interface ElementAttributesProperty {
+    // empty, libs can define requirements downstream
+  }
   interface ElementChildrenAttribute {
     children: {};
   }
@@ -1997,6 +1999,7 @@ export namespace JSX {
       | "treegrid"
       | "treeitem";
     autocapitalize?: HTMLAutocapitalize;
+    slot?: string;
     color?: string;
     itemprop?: string;
     itemscope?: boolean;

package/types/reactive/signal.d.ts

@@ -201,7 +201,7 @@ export interface Resource<T> extends Accessor<T> {
 }
 export declare type ResourceActions<T> = {
     mutate: Setter<T>;
-    refetch: (info?: unknown) => void;
+    refetch: (info?: unknown) => T | Promise<T> | undefined | null;
 };
 export declare type ResourceReturn<T> = [Resource<T>, ResourceActions<T>];
 export declare type ResourceSource<S> = S | false | null | undefined | (() => S | false | null | undefined);

package/types/render/hydration.d.ts

@@ -10,6 +10,7 @@ declare type SharedConfig = {
     load?: (id: string) => Promise<any> | undefined;
     gather?: (key: string) => void;
     registry?: Map<string, Element>;
+    done?: boolean;
 };
 export declare const sharedConfig: SharedConfig;
 export declare function setHydrateContext(context?: HydrationContext): void;

package/types/server/rendering.d.ts

@@ -32,16 +32,12 @@ export declare function For<T>(props: {
     each: T[];
     fallback?: string;
     children: (item: T, index: () => number) => string;
-}): string | {
-    t: string;
-};
+}): string | any[] | undefined;
 export declare function Index<T>(props: {
     each: T[];
     fallback?: string;
     children: (item: () => T, index: number) => string;
-}): string | {
-    t: string;
-};
+}): string | any[] | undefined;
 export declare function Show<T>(props: {
     when: T | false;
     fallback?: string;

package/web/dist/dev.cjs

@@ -29,6 +29,7 @@ const SVGNamespace = {
   xlink: "http://www.w3.org/1999/xlink",
   xml: "http://www.w3.org/XML/1998/namespace"
 };
+const DOMElements = 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 ? {
@@ -337,6 +338,10 @@ function eventHandler(e) {
       return node || document;
     }
   });
+  if (solidJs.sharedConfig.registry && !solidJs.sharedConfig.done) {
+    solidJs.sharedConfig.done = true;
+    document.querySelectorAll("[id^=pl-]").forEach(elem => elem.remove());
+  }
   while (node !== null) {
     const handler = node[key];
     if (handler && !node.disabled) {
@@ -621,6 +626,7 @@ Object.defineProperty(exports, 'mergeProps', {
 exports.Aliases = Aliases;
 exports.Assets = Assets;
 exports.ChildProperties = ChildProperties;
+exports.DOMElements = DOMElements;
 exports.DelegatedEvents = DelegatedEvents;
 exports.Dynamic = Dynamic;
 exports.HydrationScript = Assets;

package/web/dist/dev.js

@@ -26,6 +26,7 @@ const SVGNamespace = {
   xlink: "http://www.w3.org/1999/xlink",
   xml: "http://www.w3.org/XML/1998/namespace"
 };
+const DOMElements = 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 ? {
@@ -334,6 +335,10 @@ function eventHandler(e) {
       return node || document;
     }
   });
+  if (sharedConfig.registry && !sharedConfig.done) {
+    sharedConfig.done = true;
+    document.querySelectorAll("[id^=pl-]").forEach(elem => elem.remove());
+  }
   while (node !== null) {
     const handler = node[key];
     if (handler && !node.disabled) {
@@ -567,4 +572,4 @@ function Dynamic(props) {
   });
 }
 
-export { Aliases, Assets, ChildProperties, DelegatedEvents, Dynamic, Assets as HydrationScript, NoHydration, Portal, PropAliases, Properties, SVGElements, SVGNamespace, addEventListener, assign, classList, clearDelegatedEvents, delegateEvents, dynamicProperty, escape, generateHydrationScript, getHydrationKey, getNextElement, getNextMarker, getNextMatch, hydrate, innerHTML, insert, isServer, memo, render, renderToStream, renderToString, renderToStringAsync, resolveSSRNode, runHydrationEvents, setAttribute, setAttributeNS, spread, ssr, ssrBoolean, ssrClassList, ssrHydrationKey, ssrSpread, ssrStyle, style, template };
+export { Aliases, Assets, ChildProperties, DOMElements, DelegatedEvents, Dynamic, Assets as HydrationScript, NoHydration, Portal, PropAliases, Properties, SVGElements, SVGNamespace, addEventListener, assign, classList, clearDelegatedEvents, delegateEvents, dynamicProperty, escape, generateHydrationScript, getHydrationKey, getNextElement, getNextMarker, getNextMatch, hydrate, innerHTML, insert, isServer, memo, render, renderToStream, renderToString, renderToStringAsync, resolveSSRNode, runHydrationEvents, setAttribute, setAttributeNS, spread, ssr, ssrBoolean, ssrClassList, ssrHydrationKey, ssrSpread, ssrStyle, style, template };

package/web/dist/server.cjs

@@ -232,7 +232,7 @@ function stringifyString(str) {
   return result;
 }
 
-const REPLACE_SCRIPT = `function $df(e,y,t,g){t=document.getElementById(e),g=document.getElementById("pl"+e),g&&g.replaceWith(...t.childNodes),_$HY.set(e,y||null)}`;
+const REPLACE_SCRIPT = `function $df(e,t,d,l){d=document.getElementById(e),(l=document.getElementById("pl-"+e))&&l.replaceWith(...d.childNodes),d.remove(),_$HY.set(e,t||null)}`;
 const FRAGMENT_REPLACE = /<!\[([\d-]+)\]>/;
 function renderToString(code, options = {}) {
   let scripts = "";
@@ -499,6 +499,7 @@ function ssrSpread(props, isSVG, skipChildren) {
   if (typeof props === "function") props = props();
   const keys = Object.keys(props);
   let result = "";
+  let classResolved;
   for (let i = 0; i < keys.length; i++) {
     const prop = keys[i];
     if (prop === "children") {
@@ -508,8 +509,11 @@ function ssrSpread(props, isSVG, skipChildren) {
     const value = props[prop];
     if (prop === "style") {
       result += `style="${ssrStyle(value)}"`;
-    } else if (prop === "classList") {
-      result += `class="${ssrClassList(value)}"`;
+    } else if (prop === "class" || prop === "className" || prop === "classList") {
+      if (classResolved) continue;
+      let n;
+      result += `class="${(n = props.class) ? n + " " : ""}${(n = props.className) ? n + " " : ""}${ssrClassList(props.classList)}"`;
+      classResolved = true;
     } else if (BooleanAttributes.has(prop)) {
       if (value) result += prop;else continue;
     } else if (prop === "ref" || prop.slice(0, 2) === "on") {
@@ -574,7 +578,11 @@ function resolveSSRNode(node) {
   const t = typeof node;
   if (t === "string") return node;
   if (node == null || t === "boolean") return "";
-  if (Array.isArray(node)) return node.map(resolveSSRNode).join("");
+  if (Array.isArray(node)) {
+    let mapped = "";
+    for (let i = 0, len = node.length; i < len; i++) mapped += resolveSSRNode(node[i]);
+    return mapped;
+  }
   if (t === "object") return resolveSSRNode(node.t);
   if (t === "function") return resolveSSRNode(node());
   return String(node);
@@ -675,7 +683,7 @@ function Dynamic(props) {
   if (comp) {
     if (t === "function") return comp(others);else if (t === "string") {
       const [local, sOthers] = solidJs.splitProps(others, ["children"]);
-      return ssr([`<${comp}`, ' ', ">", `</${comp}>`], ssrHydrationKey(), ssrSpread(sOthers), local.children || "");
+      return ssr([`<${comp}`, ' ', ">", `</${comp}>`], ssrHydrationKey(), ssrSpread(sOthers), escape(local.children || ""));
     }
   }
 }

package/web/dist/server.js

@@ -229,7 +229,7 @@ function stringifyString(str) {
   return result;
 }
 
-const REPLACE_SCRIPT = `function $df(e,y,t,g){t=document.getElementById(e),g=document.getElementById("pl"+e),g&&g.replaceWith(...t.childNodes),_$HY.set(e,y||null)}`;
+const REPLACE_SCRIPT = `function $df(e,t,d,l){d=document.getElementById(e),(l=document.getElementById("pl-"+e))&&l.replaceWith(...d.childNodes),d.remove(),_$HY.set(e,t||null)}`;
 const FRAGMENT_REPLACE = /<!\[([\d-]+)\]>/;
 function renderToString(code, options = {}) {
   let scripts = "";
@@ -496,6 +496,7 @@ function ssrSpread(props, isSVG, skipChildren) {
   if (typeof props === "function") props = props();
   const keys = Object.keys(props);
   let result = "";
+  let classResolved;
   for (let i = 0; i < keys.length; i++) {
     const prop = keys[i];
     if (prop === "children") {
@@ -505,8 +506,11 @@ function ssrSpread(props, isSVG, skipChildren) {
     const value = props[prop];
     if (prop === "style") {
       result += `style="${ssrStyle(value)}"`;
-    } else if (prop === "classList") {
-      result += `class="${ssrClassList(value)}"`;
+    } else if (prop === "class" || prop === "className" || prop === "classList") {
+      if (classResolved) continue;
+      let n;
+      result += `class="${(n = props.class) ? n + " " : ""}${(n = props.className) ? n + " " : ""}${ssrClassList(props.classList)}"`;
+      classResolved = true;
     } else if (BooleanAttributes.has(prop)) {
       if (value) result += prop;else continue;
     } else if (prop === "ref" || prop.slice(0, 2) === "on") {
@@ -571,7 +575,11 @@ function resolveSSRNode(node) {
   const t = typeof node;
   if (t === "string") return node;
   if (node == null || t === "boolean") return "";
-  if (Array.isArray(node)) return node.map(resolveSSRNode).join("");
+  if (Array.isArray(node)) {
+    let mapped = "";
+    for (let i = 0, len = node.length; i < len; i++) mapped += resolveSSRNode(node[i]);
+    return mapped;
+  }
   if (t === "object") return resolveSSRNode(node.t);
   if (t === "function") return resolveSSRNode(node());
   return String(node);
@@ -672,7 +680,7 @@ function Dynamic(props) {
   if (comp) {
     if (t === "function") return comp(others);else if (t === "string") {
       const [local, sOthers] = splitProps(others, ["children"]);
-      return ssr([`<${comp}`, ' ', ">", `</${comp}>`], ssrHydrationKey(), ssrSpread(sOthers), local.children || "");
+      return ssr([`<${comp}`, ' ', ">", `</${comp}>`], ssrHydrationKey(), ssrSpread(sOthers), escape(local.children || ""));
     }
   }
 }

package/web/dist/web.cjs

@@ -29,6 +29,7 @@ const SVGNamespace = {
   xlink: "http://www.w3.org/1999/xlink",
   xml: "http://www.w3.org/XML/1998/namespace"
 };
+const DOMElements = 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 ? {
@@ -336,6 +337,10 @@ function eventHandler(e) {
       return node || document;
     }
   });
+  if (solidJs.sharedConfig.registry && !solidJs.sharedConfig.done) {
+    solidJs.sharedConfig.done = true;
+    document.querySelectorAll("[id^=pl-]").forEach(elem => elem.remove());
+  }
   while (node !== null) {
     const handler = node[key];
     if (handler && !node.disabled) {
@@ -617,6 +622,7 @@ Object.defineProperty(exports, 'mergeProps', {
 exports.Aliases = Aliases;
 exports.Assets = Assets;
 exports.ChildProperties = ChildProperties;
+exports.DOMElements = DOMElements;
 exports.DelegatedEvents = DelegatedEvents;
 exports.Dynamic = Dynamic;
 exports.HydrationScript = Assets;

package/web/dist/web.js

@@ -26,6 +26,7 @@ const SVGNamespace = {
   xlink: "http://www.w3.org/1999/xlink",
   xml: "http://www.w3.org/XML/1998/namespace"
 };
+const DOMElements = 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 ? {
@@ -333,6 +334,10 @@ function eventHandler(e) {
       return node || document;
     }
   });
+  if (sharedConfig.registry && !sharedConfig.done) {
+    sharedConfig.done = true;
+    document.querySelectorAll("[id^=pl-]").forEach(elem => elem.remove());
+  }
   while (node !== null) {
     const handler = node[key];
     if (handler && !node.disabled) {
@@ -563,4 +568,4 @@ function Dynamic(props) {
   });
 }
 
-export { Aliases, Assets, ChildProperties, DelegatedEvents, Dynamic, Assets as HydrationScript, NoHydration, Portal, PropAliases, Properties, SVGElements, SVGNamespace, addEventListener, assign, classList, clearDelegatedEvents, delegateEvents, dynamicProperty, escape, generateHydrationScript, getHydrationKey, getNextElement, getNextMarker, getNextMatch, hydrate, innerHTML, insert, isServer, memo, render, renderToStream, renderToString, renderToStringAsync, resolveSSRNode, runHydrationEvents, setAttribute, setAttributeNS, spread, ssr, ssrBoolean, ssrClassList, ssrHydrationKey, ssrSpread, ssrStyle, style, template };
+export { Aliases, Assets, ChildProperties, DOMElements, DelegatedEvents, Dynamic, Assets as HydrationScript, NoHydration, Portal, PropAliases, Properties, SVGElements, SVGNamespace, addEventListener, assign, classList, clearDelegatedEvents, delegateEvents, dynamicProperty, escape, generateHydrationScript, getHydrationKey, getNextElement, getNextMarker, getNextMatch, hydrate, innerHTML, insert, isServer, memo, render, renderToStream, renderToString, renderToStringAsync, resolveSSRNode, runHydrationEvents, setAttribute, setAttributeNS, spread, ssr, ssrBoolean, ssrClassList, ssrHydrationKey, ssrSpread, ssrStyle, style, template };

package/web/types/client.d.ts

@@ -4,6 +4,7 @@ export const PropAliases: Record<string, string>;
 export const Properties: Set<string>;
 export const ChildProperties: Set<string>;
 export const DelegatedEvents: Set<string>;
+export const DOMElements: Set<string>;
 export const SVGElements: Set<string>;
 export const SVGNamespace: Record<string, string>;