solid-js 1.9.3 → 1.9.5

package/web/dist/dev.cjs

@@ -122,13 +122,13 @@ function render(code, element, init, options = {}) {
     element.textContent = "";
   };
 }
-function template(html, isImportNode, isSVG) {
+function template(html, isImportNode, isSVG, isMathML) {
   let node;
   const create = () => {
     if (isHydrating()) throw new Error("Failed attempt to create new DOM elements during hydration. Check that the libraries you are using support hydration.");
-    const t = document.createElement("template");
+    const t = isMathML ? document.createElementNS("http://www.w3.org/1998/Math/MathML", "template") : document.createElement("template");
     t.innerHTML = html;
-    return isSVG ? t.content.firstChild.firstChild : t.content.firstChild;
+    return isSVG ? t.content.firstChild.firstChild : isMathML ? t.firstChild : t.content.firstChild;
   };
   const fn = isImportNode ? () => solidJs.untrack(() => document.importNode(node || (node = create()), true)) : () => (node || (node = create())).cloneNode(true);
   fn.cloneNode = fn;
@@ -385,7 +385,7 @@ function assignProp(node, prop, value, prev, isSVG, skipRef, props) {
     setAttribute(node, prop.slice(5), value);
   } else if (prop.slice(0, 5) === "bool:") {
     setBoolAttribute(node, prop.slice(5), value);
-  } else if ((forceProp = prop.slice(0, 5) === "prop:") || (isChildProp = ChildProperties.has(prop)) || !isSVG && ((propAlias = getPropAlias(prop, node.tagName)) || (isProp = Properties.has(prop))) || (isCE = node.nodeName.includes("-") || 'is' in props)) {
+  } else if ((forceProp = prop.slice(0, 5) === "prop:") || (isChildProp = ChildProperties.has(prop)) || !isSVG && ((propAlias = getPropAlias(prop, node.tagName)) || (isProp = Properties.has(prop))) || (isCE = node.nodeName.includes("-") || "is" in props)) {
     if (forceProp) {
       prop = prop.slice(5);
       isProp = true;
@@ -669,9 +669,8 @@ function Portal(props) {
   });
   return marker;
 }
-function Dynamic(props) {
-  const [p, others] = solidJs.splitProps(props, ["component"]);
-  const cached = solidJs.createMemo(() => p.component);
+function createDynamic(component, props) {
+  const cached = solidJs.createMemo(component);
   return solidJs.createMemo(() => {
     const component = cached();
     switch (typeof component) {
@@ -679,15 +678,19 @@ function Dynamic(props) {
         Object.assign(component, {
           [solidJs.$DEVCOMP]: true
         });
-        return solidJs.untrack(() => component(others));
+        return solidJs.untrack(() => component(props));
       case "string":
         const isSvg = SVGElements.has(component);
         const el = solidJs.sharedConfig.context ? getNextElement() : createElement(component, isSvg);
-        spread(el, others, isSvg);
+        spread(el, props, isSvg);
         return el;
     }
   });
 }
+function Dynamic(props) {
+  const [, others] = solidJs.splitProps(props, ["component"]);
+  return createDynamic(() => props.component, others);
+}
 
 Object.defineProperty(exports, "ErrorBoundary", {
   enumerable: true,
@@ -764,6 +767,7 @@ exports.assign = assign;
 exports.classList = classList;
 exports.className = className;
 exports.clearDelegatedEvents = clearDelegatedEvents;
+exports.createDynamic = createDynamic;
 exports.delegateEvents = delegateEvents;
 exports.dynamicProperty = dynamicProperty;
 exports.escape = escape;

package/web/dist/dev.js

@@ -10,8 +10,8 @@ import {
   createMemo,
   createSignal,
   onCleanup,
-  splitProps,
-  $DEVCOMP
+  $DEVCOMP,
+  splitProps
 } from "solid-js";
 export {
   ErrorBoundary,
@@ -571,16 +571,18 @@ function render(code, element, init, options = {}) {
     element.textContent = "";
   };
 }
-function template(html, isImportNode, isSVG) {
+function template(html, isImportNode, isSVG, isMathML) {
   let node;
   const create = () => {
     if (isHydrating())
       throw new Error(
         "Failed attempt to create new DOM elements during hydration. Check that the libraries you are using support hydration."
       );
-    const t = document.createElement("template");
+    const t = isMathML
+      ? document.createElementNS("http://www.w3.org/1998/Math/MathML", "template")
+      : document.createElement("template");
     t.innerHTML = html;
-    return isSVG ? t.content.firstChild.firstChild : t.content.firstChild;
+    return isSVG ? t.content.firstChild.firstChild : isMathML ? t.firstChild : t.content.firstChild;
   };
   const fn = isImportNode
     ? () => untrack(() => document.importNode(node || (node = create()), true))
@@ -1160,9 +1162,8 @@ function Portal(props) {
   );
   return marker;
 }
-function Dynamic(props) {
-  const [p, others] = splitProps(props, ["component"]);
-  const cached = createMemo(() => p.component);
+function createDynamic(component, props) {
+  const cached = createMemo(component);
   return createMemo(() => {
     const component = cached();
     switch (typeof component) {
@@ -1170,15 +1171,19 @@ function Dynamic(props) {
         Object.assign(component, {
           [$DEVCOMP]: true
         });
-        return untrack(() => component(others));
+        return untrack(() => component(props));
       case "string":
         const isSvg = SVGElements.has(component);
         const el = sharedConfig.context ? getNextElement() : createElement(component, isSvg);
-        spread(el, others, isSvg);
+        spread(el, props, isSvg);
         return el;
     }
   });
 }
+function Dynamic(props) {
+  const [, others] = splitProps(props, ["component"]);
+  return createDynamic(() => props.component, others);
+}
 
 export {
   Aliases,
@@ -1200,6 +1205,7 @@ export {
   classList,
   className,
   clearDelegatedEvents,
+  createDynamic,
   delegateEvents,
   dynamicProperty,
   escape,

package/web/dist/server.cjs

@@ -217,7 +217,7 @@ function renderToStream(code, options = {}) {
       const first = html.indexOf(placeholder);
       if (first === -1) return;
       const last = html.indexOf(`<!--!$/${id}-->`, first + placeholder.length);
-      html = html.replace(html.slice(first, last + placeholder.length + 1), resolveSSRNode(payloadFn()));
+      html = html.slice(0, first) + resolveSSRNode(escape(payloadFn())) + html.slice(last + placeholder.length + 1);
     },
     serialize(id, p, wait) {
       const serverOnly = solidJs.sharedConfig.context.noHydrate;
@@ -408,7 +408,7 @@ function ssrElement(tag, props, children, needsId) {
   for (let i = 0; i < keys.length; i++) {
     const prop = keys[i];
     if (ChildProperties.has(prop)) {
-      if (children === undefined && !skipChildren) children = prop === "innerHTML" ? props[prop] : escape(props[prop]);
+      if (children === undefined && !skipChildren) children = tag === "script" || tag === "style" || prop === "innerHTML" ? props[prop] : escape(props[prop]);
       continue;
     }
     const value = props[prop];
@@ -516,7 +516,7 @@ function getHydrationKey() {
   return hydrate && !hydrate.noHydrate && solidJs.sharedConfig.getNextContextId();
 }
 function useAssets(fn) {
-  solidJs.sharedConfig.context.assets.push(() => resolveSSRNode(fn()));
+  solidJs.sharedConfig.context.assets.push(() => resolveSSRNode(escape(fn())));
 }
 function getAssets() {
   const assets = solidJs.sharedConfig.context.assets;
@@ -561,7 +561,9 @@ function injectAssets(assets, html) {
   if (!assets || !assets.length) return html;
   let out = "";
   for (let i = 0, len = assets.length; i < len; i++) out += assets[i]();
-  return html.replace(`</head>`, out + `</head>`);
+  const index = html.indexOf("</head>");
+  if (index === -1) return html;
+  return html.slice(0, index) + out + html.slice(index);
 }
 function injectScripts(html, scripts, nonce) {
   const tag = `<script${nonce ? ` nonce="${nonce}"` : ""}>${scripts}</script>`;
@@ -666,16 +668,19 @@ function notSup() {
 
 const isServer = true;
 const isDev = false;
-function Dynamic(props) {
-  const [p, others] = solidJs.splitProps(props, ["component"]);
-  const comp = p.component,
+function createDynamic(component, props) {
+  const comp = component(),
     t = typeof comp;
   if (comp) {
-    if (t === "function") return comp(others);else if (t === "string") {
-      return ssrElement(comp, others, undefined, true);
+    if (t === "function") return comp(props);else if (t === "string") {
+      return ssrElement(comp, props, undefined, true);
     }
   }
 }
+function Dynamic(props) {
+  const [, others] = solidJs.splitProps(props, ["component"]);
+  return createDynamic(() => props.component, others);
+}
 function Portal(props) {
   return "";
 }
@@ -754,6 +759,7 @@ exports.addEventListener = notSup;
 exports.assign = notSup;
 exports.classList = notSup;
 exports.className = notSup;
+exports.createDynamic = createDynamic;
 exports.delegateEvents = notSup;
 exports.dynamicProperty = notSup;
 exports.escape = escape;

package/web/dist/server.js

@@ -654,10 +654,10 @@ function renderToStream(code, options = {}) {
       const first = html.indexOf(placeholder);
       if (first === -1) return;
       const last = html.indexOf(`<!--!$/${id}-->`, first + placeholder.length);
-      html = html.replace(
-        html.slice(first, last + placeholder.length + 1),
-        resolveSSRNode(payloadFn())
-      );
+      html =
+        html.slice(0, first) +
+        resolveSSRNode(escape(payloadFn())) +
+        html.slice(last + placeholder.length + 1);
     },
     serialize(id, p, wait) {
       const serverOnly = sharedConfig.context.noHydrate;
@@ -858,7 +858,10 @@ function ssrElement(tag, props, children, needsId) {
     const prop = keys[i];
     if (ChildProperties.has(prop)) {
       if (children === undefined && !skipChildren)
-        children = prop === "innerHTML" ? props[prop] : escape(props[prop]);
+        children =
+          tag === "script" || tag === "style" || prop === "innerHTML"
+            ? props[prop]
+            : escape(props[prop]);
       continue;
     }
     const value = props[prop];
@@ -977,7 +980,7 @@ function getHydrationKey() {
   return hydrate && !hydrate.noHydrate && sharedConfig.getNextContextId();
 }
 function useAssets(fn) {
-  sharedConfig.context.assets.push(() => resolveSSRNode(fn()));
+  sharedConfig.context.assets.push(() => resolveSSRNode(escape(fn())));
 }
 function getAssets() {
   const assets = sharedConfig.context.assets;
@@ -1023,7 +1026,9 @@ function injectAssets(assets, html) {
   if (!assets || !assets.length) return html;
   let out = "";
   for (let i = 0, len = assets.length; i < len; i++) out += assets[i]();
-  return html.replace(`</head>`, out + `</head>`);
+  const index = html.indexOf("</head>");
+  if (index === -1) return html;
+  return html.slice(0, index) + out + html.slice(index);
 }
 function injectScripts(html, scripts, nonce) {
   const tag = `<script${nonce ? ` nonce="${nonce}"` : ""}>${scripts}</script>`;
@@ -1140,17 +1145,20 @@ function notSup() {
 
 const isServer = true;
 const isDev = false;
-function Dynamic(props) {
-  const [p, others] = splitProps(props, ["component"]);
-  const comp = p.component,
+function createDynamic(component, props) {
+  const comp = component(),
     t = typeof comp;
   if (comp) {
-    if (t === "function") return comp(others);
+    if (t === "function") return comp(props);
     else if (t === "string") {
-      return ssrElement(comp, others, undefined, true);
+      return ssrElement(comp, props, undefined, true);
     }
   }
 }
+function Dynamic(props) {
+  const [, others] = splitProps(props, ["component"]);
+  return createDynamic(() => props.component, others);
+}
 function Portal(props) {
   return "";
 }
@@ -1174,6 +1182,7 @@ export {
   notSup as assign,
   notSup as classList,
   notSup as className,
+  createDynamic,
   notSup as delegateEvents,
   notSup as dynamicProperty,
   escape,

package/web/dist/web.cjs

@@ -119,12 +119,12 @@ function render(code, element, init, options = {}) {
     element.textContent = "";
   };
 }
-function template(html, isImportNode, isSVG) {
+function template(html, isImportNode, isSVG, isMathML) {
   let node;
   const create = () => {
-    const t = document.createElement("template");
+    const t = isMathML ? document.createElementNS("http://www.w3.org/1998/Math/MathML", "template") : document.createElement("template");
     t.innerHTML = html;
-    return isSVG ? t.content.firstChild.firstChild : t.content.firstChild;
+    return isSVG ? t.content.firstChild.firstChild : isMathML ? t.firstChild : t.content.firstChild;
   };
   const fn = isImportNode ? () => solidJs.untrack(() => document.importNode(node || (node = create()), true)) : () => (node || (node = create())).cloneNode(true);
   fn.cloneNode = fn;
@@ -377,7 +377,7 @@ function assignProp(node, prop, value, prev, isSVG, skipRef, props) {
     setAttribute(node, prop.slice(5), value);
   } else if (prop.slice(0, 5) === "bool:") {
     setBoolAttribute(node, prop.slice(5), value);
-  } else if ((forceProp = prop.slice(0, 5) === "prop:") || (isChildProp = ChildProperties.has(prop)) || !isSVG && ((propAlias = getPropAlias(prop, node.tagName)) || (isProp = Properties.has(prop))) || (isCE = node.nodeName.includes("-") || 'is' in props)) {
+  } else if ((forceProp = prop.slice(0, 5) === "prop:") || (isChildProp = ChildProperties.has(prop)) || !isSVG && ((propAlias = getPropAlias(prop, node.tagName)) || (isProp = Properties.has(prop))) || (isCE = node.nodeName.includes("-") || "is" in props)) {
     if (forceProp) {
       prop = prop.slice(5);
       isProp = true;
@@ -661,22 +661,25 @@ function Portal(props) {
   });
   return marker;
 }
-function Dynamic(props) {
-  const [p, others] = solidJs.splitProps(props, ["component"]);
-  const cached = solidJs.createMemo(() => p.component);
+function createDynamic(component, props) {
+  const cached = solidJs.createMemo(component);
   return solidJs.createMemo(() => {
     const component = cached();
     switch (typeof component) {
       case "function":
-        return solidJs.untrack(() => component(others));
+        return solidJs.untrack(() => component(props));
       case "string":
         const isSvg = SVGElements.has(component);
         const el = solidJs.sharedConfig.context ? getNextElement() : createElement(component, isSvg);
-        spread(el, others, isSvg);
+        spread(el, props, isSvg);
         return el;
     }
   });
 }
+function Dynamic(props) {
+  const [, others] = solidJs.splitProps(props, ["component"]);
+  return createDynamic(() => props.component, others);
+}
 
 Object.defineProperty(exports, "ErrorBoundary", {
   enumerable: true,
@@ -753,6 +756,7 @@ exports.assign = assign;
 exports.classList = classList;
 exports.className = className;
 exports.clearDelegatedEvents = clearDelegatedEvents;
+exports.createDynamic = createDynamic;
 exports.delegateEvents = delegateEvents;
 exports.dynamicProperty = dynamicProperty;
 exports.escape = escape;

package/web/dist/web.js

@@ -565,12 +565,14 @@ function render(code, element, init, options = {}) {
     element.textContent = "";
   };
 }
-function template(html, isImportNode, isSVG) {
+function template(html, isImportNode, isSVG, isMathML) {
   let node;
   const create = () => {
-    const t = document.createElement("template");
+    const t = isMathML
+      ? document.createElementNS("http://www.w3.org/1998/Math/MathML", "template")
+      : document.createElement("template");
     t.innerHTML = html;
-    return isSVG ? t.content.firstChild.firstChild : t.content.firstChild;
+    return isSVG ? t.content.firstChild.firstChild : isMathML ? t.firstChild : t.content.firstChild;
   };
   const fn = isImportNode
     ? () => untrack(() => document.importNode(node || (node = create()), true))
@@ -1142,22 +1144,25 @@ function Portal(props) {
   );
   return marker;
 }
-function Dynamic(props) {
-  const [p, others] = splitProps(props, ["component"]);
-  const cached = createMemo(() => p.component);
+function createDynamic(component, props) {
+  const cached = createMemo(component);
   return createMemo(() => {
     const component = cached();
     switch (typeof component) {
       case "function":
-        return untrack(() => component(others));
+        return untrack(() => component(props));
       case "string":
         const isSvg = SVGElements.has(component);
         const el = sharedConfig.context ? getNextElement() : createElement(component, isSvg);
-        spread(el, others, isSvg);
+        spread(el, props, isSvg);
         return el;
     }
   });
 }
+function Dynamic(props) {
+  const [, others] = splitProps(props, ["component"]);
+  return createDynamic(() => props.component, others);
+}
 
 export {
   Aliases,
@@ -1179,6 +1184,7 @@ export {
   classList,
   className,
   clearDelegatedEvents,
+  createDynamic,
   delegateEvents,
   dynamicProperty,
   escape,

package/web/types/index.d.ts

@@ -44,6 +44,22 @@ export type DynamicProps<T extends ValidComponent, P = ComponentProps<T>> = {
 } & {
   component: T | undefined;
 };
+/**
+ * Renders an arbitrary component or element with the given props
+ *
+ * This is a lower level version of the `Dynamic` component, useful for
+ * performance optimizations in libraries. Do not use this unless you know
+ * what you are doing.
+ * ```typescript
+ * const element = () => multiline() ? 'textarea' : 'input';
+ * createDynamic(element, { value: value() });
+ * ```
+ * @description https://docs.solidjs.com/reference/components/dynamic
+ */
+export declare function createDynamic<T extends ValidComponent>(
+  component: () => T | undefined,
+  props: ComponentProps<T>
+): JSX.Element;
 /**
  * Renders an arbitrary custom or native component and passes the other props
  * ```typescript

package/web/storage/types/index.js

@@ -1,13 +0,0 @@
-"use strict";
-exports.__esModule = true;
-exports.provideRequestEvent = void 0;
-var node_async_hooks_1 = require("node:async_hooks");
-var web_1 = require("solid-js/web");
-// using global on a symbol for locating it later and detaching for environments that don't support it.
-function provideRequestEvent(init, cb) {
-  if (!web_1.isServer) throw new Error("Attempting to use server context in non-server build");
-  var ctx = (globalThis[web_1.RequestContext] =
-    globalThis[web_1.RequestContext] || new node_async_hooks_1.AsyncLocalStorage());
-  return ctx.run(init, cb);
-}
-exports.provideRequestEvent = provideRequestEvent;