@solidjs/web 2.0.0-experimental.1 → 2.0.0-experimental.3

package/dist/server.js

@@ -1,13 +1,78 @@
-import { sharedConfig, createRoot, splitProps } 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';
-import { Feature, Serializer, getCrossReferenceHeader } from 'seroval';
-import { CustomEventPlugin, DOMExceptionPlugin, EventPlugin, FormDataPlugin, HeadersPlugin, ReadableStreamPlugin, RequestPlugin, ResponsePlugin, URLSearchParamsPlugin, URLPlugin } from 'seroval-plugins/web';
+import { sharedConfig, createRoot, splitProps } 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";
+import { Feature, Serializer, getCrossReferenceHeader } from "seroval";
+import {
+  CustomEventPlugin,
+  DOMExceptionPlugin,
+  EventPlugin,
+  FormDataPlugin,
+  HeadersPlugin,
+  ReadableStreamPlugin,
+  RequestPlugin,
+  ResponsePlugin,
+  URLSearchParamsPlugin,
+  URLPlugin
+} from "seroval-plugins/web";
 
-const booleans = ["allowfullscreen", "async", "autofocus", "autoplay", "checked", "controls", "default", "disabled", "formnovalidate", "hidden", "indeterminate", "inert", "ismap", "loop", "multiple", "muted", "nomodule", "novalidate", "open", "playsinline", "readonly", "required", "reversed", "seamless", "selected"];
-const BooleanAttributes = /*#__PURE__*/new Set(booleans);
-const Properties = /*#__PURE__*/new Set(["value", "readOnly", "formNoValidate", "isMap", "noModule", "playsInline", ...booleans]);
-const ChildProperties = /*#__PURE__*/new Set(["innerHTML", "textContent", "innerText", "children"]);
-const PropAliases = /*#__PURE__*/Object.assign(Object.create(null), {
+const booleans = [
+  "allowfullscreen",
+  "async",
+  "autofocus",
+  "autoplay",
+  "checked",
+  "controls",
+  "default",
+  "disabled",
+  "formnovalidate",
+  "hidden",
+  "indeterminate",
+  "inert",
+  "ismap",
+  "loop",
+  "multiple",
+  "muted",
+  "nomodule",
+  "novalidate",
+  "open",
+  "playsinline",
+  "readonly",
+  "required",
+  "reversed",
+  "seamless",
+  "selected"
+];
+const BooleanAttributes = /*#__PURE__*/ new Set(booleans);
+const Properties = /*#__PURE__*/ new Set([
+  "value",
+  "readOnly",
+  "formNoValidate",
+  "isMap",
+  "noModule",
+  "playsInline",
+  ...booleans
+]);
+const ChildProperties = /*#__PURE__*/ new Set([
+  "innerHTML",
+  "textContent",
+  "innerText",
+  "children"
+]);
+const PropAliases = /*#__PURE__*/ Object.assign(Object.create(null), {
   class: "className",
   formnovalidate: {
     $: "formNoValidate",
@@ -34,34 +99,414 @@ const PropAliases = /*#__PURE__*/Object.assign(Object.create(null), {
 });
 function getPropAlias(prop, tagName) {
   const a = PropAliases[prop];
-  return typeof a === "object" ? a[tagName] ? a["$"] : undefined : a;
-}
-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", "feDropShadow", "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",
-"set", "stop",
-"svg", "switch", "symbol", "text", "textPath",
-"tref", "tspan", "use", "view", "vkern"]);
+  return typeof a === "object" ? (a[tagName] ? a["$"] : undefined) : a;
+}
+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",
+  "feDropShadow",
+  "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",
+  "set",
+  "stop",
+  "svg",
+  "switch",
+  "symbol",
+  "text",
+  "textPath",
+  "tref",
+  "tspan",
+  "use",
+  "view",
+  "vkern"
+]);
 const SVGNamespace = {
   xlink: "http://www.w3.org/1999/xlink",
   xml: "http://www.w3.org/XML/1998/namespace"
 };
-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", "h1", "h2", "h3", "h4", "h5", "h6"]);
+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",
+  "h1",
+  "h2",
+  "h3",
+  "h4",
+  "h5",
+  "h6"
+]);
 
-const ES2017FLAG = Feature.AggregateError
-| Feature.BigIntTypedArray;
-const GLOBAL_IDENTIFIER = '_$HY.r';
-function createSerializer({
-  onData,
-  onDone,
-  scopeId,
-  onError
-}) {
+const ES2017FLAG = Feature.AggregateError | Feature.BigIntTypedArray;
+const GLOBAL_IDENTIFIER = "_$HY.r";
+function createSerializer({ onData, onDone, scopeId, onError }) {
   return new Serializer({
     scopeId,
     plugins: [
-    CustomEventPlugin, DOMExceptionPlugin, EventPlugin,
-    FormDataPlugin, HeadersPlugin, ReadableStreamPlugin, RequestPlugin, ResponsePlugin, URLSearchParamsPlugin, URLPlugin],
+      CustomEventPlugin,
+      DOMExceptionPlugin,
+      EventPlugin,
+      FormDataPlugin,
+      HeadersPlugin,
+      ReadableStreamPlugin,
+      RequestPlugin,
+      ResponsePlugin,
+      URLSearchParamsPlugin,
+      URLPlugin
+    ],
     globalIdentifier: GLOBAL_IDENTIFIER,
     disabledFeatures: ES2017FLAG,
     onData,
@@ -70,15 +515,14 @@ function createSerializer({
   });
 }
 function getLocalHeaderScript(id) {
-  return getCrossReferenceHeader(id) + ';';
+  return getCrossReferenceHeader(id) + ";";
 }
 
-const VOID_ELEMENTS = /^(?:area|base|br|col|embed|hr|img|input|keygen|link|menuitem|meta|param|source|track|wbr)$/i;
+const VOID_ELEMENTS =
+  /^(?:area|base|br|col|embed|hr|img|input|keygen|link|menuitem|meta|param|source|track|wbr)$/i;
 const REPLACE_SCRIPT = `function $df(e,n,o,t){if(n=document.getElementById(e),o=document.getElementById("pl-"+e)){for(;o&&8!==o.nodeType&&o.nodeValue!=="pl-"+e;)t=o.nextSibling,o.remove(),o=t;_$HY.done?o.remove():o.replaceWith(n.content)}n.remove(),_$HY.fe(e)}`;
 function renderToString(code, options = {}) {
-  const {
-    renderId
-  } = options;
+  const { renderId } = options;
   let scripts = "";
   const serializer = createSerializer({
     scopeId: renderId,
@@ -116,9 +560,7 @@ function renderToString(code, options = {}) {
   return html;
 }
 function renderToStringAsync(code, options = {}) {
-  const {
-    timeoutMs = 30000
-  } = options;
+  const { timeoutMs = 30000 } = options;
   let timeoutHandle;
   const timeout = new Promise((_, reject) => {
     timeoutHandle = setTimeout(() => reject("renderToString timed out"), timeoutMs);
@@ -129,13 +571,7 @@ function renderToStringAsync(code, options = {}) {
   });
 }
 function renderToStream(code, options = {}) {
-  let {
-    nonce,
-    onCompleteShell,
-    onCompleteAll,
-    renderId,
-    noScripts
-  } = options;
+  let { nonce, onCompleteShell, onCompleteAll, renderId, noScripts } = options;
   let dispose;
   const blockingPromises = [];
   const pushTask = task => {
@@ -151,11 +587,12 @@ function renderToStream(code, options = {}) {
   const onDone = () => {
     writeTasks();
     doShell();
-    onCompleteAll && onCompleteAll({
-      write(v) {
-        !completed && buffer.write(v);
-      }
-    });
+    onCompleteAll &&
+      onCompleteAll({
+        write(v) {
+          !completed && buffer.write(v);
+        }
+      });
     writable && writable.end();
     completed = true;
     if (firstFlushed) dispose();
@@ -212,17 +649,23 @@ function renderToStream(code, options = {}) {
       const first = html.indexOf(placeholder);
       if (first === -1) return;
       const last = html.indexOf(`<!--!$/${id}-->`, first + placeholder.length);
-      html = html.slice(0, first) + resolveSSRNode(escape(payloadFn())) + html.slice(last + placeholder.length + 1);
+      html =
+        html.slice(0, first) +
+        resolveSSRNode(escape(payloadFn())) +
+        html.slice(last + placeholder.length + 1);
     },
     serialize(id, p, wait) {
       const serverOnly = sharedConfig.context.noHydrate;
       if (!firstFlushed && wait && typeof p === "object" && "then" in p) {
         blockingPromises.push(p);
-        !serverOnly && p.then(d => {
-          serializer.write(id, d);
-        }).catch(e => {
-          serializer.write(id, e);
-        });
+        !serverOnly &&
+          p
+            .then(d => {
+              serializer.write(id, d);
+            })
+            .catch(e => {
+              serializer.write(id, e);
+            });
       } else if (!serverOnly) serializer.write(id, p);
     },
     roots: 0,
@@ -232,11 +675,15 @@ function renderToStream(code, options = {}) {
     registerFragment(key) {
       if (!registry.has(key)) {
         let resolve, reject;
-        const p = new Promise((r, rej) => (resolve = r, reject = rej));
-        registry.set(key, err => queue(() => queue(() => {
-          err ? reject(err) : resolve(true);
-          queue(flushEnd);
-        })));
+        const p = new Promise((r, rej) => ((resolve = r), (reject = rej)));
+        registry.set(key, err =>
+          queue(() =>
+            queue(() => {
+              err ? reject(err) : resolve(true);
+              queue(flushEnd);
+            })
+          )
+        );
         serializer.write(key, p);
       }
       return (value, error) => {
@@ -249,7 +696,7 @@ function renderToStream(code, options = {}) {
           }
           if (!completed) {
             if (!firstFlushed) {
-              queue(() => html = replacePlaceholder(html, key, value !== undefined ? value : ""));
+              queue(() => (html = replacePlaceholder(html, key, value !== undefined ? value : "")));
               resolve(error);
             } else {
               buffer.write(`<template id="${key}">${value !== undefined ? value : " "}</template>`);
@@ -275,11 +722,12 @@ function renderToStream(code, options = {}) {
     if (tasks.length) html = injectScripts(html, tasks, nonce);
     buffer.write(html);
     tasks = "";
-    onCompleteShell && onCompleteShell({
-      write(v) {
-        !completed && buffer.write(v);
-      }
-    });
+    onCompleteShell &&
+      onCompleteShell({
+        write(v) {
+          !completed && buffer.write(v);
+        }
+      });
     shellCompleted = true;
   }
   return {
@@ -314,7 +762,7 @@ function renderToStream(code, options = {}) {
     pipeTo(w) {
       return allSettled(blockingPromises).then(() => {
         let resolve;
-        const p = new Promise(r => resolve = r);
+        const p = new Promise(r => (resolve = r));
         setTimeout(() => {
           doShell();
           const encoder = new TextEncoder();
@@ -344,13 +792,13 @@ function renderToStream(code, options = {}) {
   };
 }
 function HydrationScript(props) {
-  const {
-    nonce
-  } = sharedConfig.context;
-  return ssr(generateHydrationScript({
-    nonce,
-    ...props
-  }));
+  const { nonce } = sharedConfig.context;
+  return ssr(
+    generateHydrationScript({
+      nonce,
+      ...props
+    })
+  );
 }
 function ssr(t, ...nodes) {
   if (nodes.length) {
@@ -368,6 +816,8 @@ function ssr(t, ...nodes) {
 }
 function ssrClassName(value) {
   if (!value) return "";
+  if (typeof value === "string") return escape(value, true);
+  value = classListToObject(value);
   let classKeys = Object.keys(value),
     result = "";
   for (let i = 0, len = classKeys.length; i < len; i++) {
@@ -395,14 +845,19 @@ function ssrStyle(value) {
   return result;
 }
 function ssrElement(tag, props, children, needsId) {
-  if (props == null) props = {};else if (typeof props === "function") props = props();
+  if (props == null) props = {};
+  else if (typeof props === "function") props = props();
   const skipChildren = VOID_ELEMENTS.test(tag);
   const keys = Object.keys(props);
   let result = `<${tag}${needsId ? ssrHydrationKey() : ""} `;
   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];
@@ -411,8 +866,14 @@ function ssrElement(tag, props, children, needsId) {
     } else if (prop === "class") {
       result += `class="${ssrClassName(value)}"`;
     } else if (BooleanAttributes.has(prop)) {
-      if (value) result += prop;else continue;
-    } else if (value == undefined || prop === "ref" || prop.slice(0, 2) === "on" || prop.slice(0, 5) === "prop:") {
+      if (value) result += prop;
+      else continue;
+    } else if (
+      value == undefined ||
+      prop === "ref" ||
+      prop.slice(0, 2) === "on" ||
+      prop.slice(0, 5) === "prop:"
+    ) {
       continue;
     } else if (prop.slice(0, 5) === "bool:") {
       if (!value) continue;
@@ -420,20 +881,21 @@ function ssrElement(tag, props, children, needsId) {
     } else if (prop.slice(0, 5) === "attr:") {
       result += `${escape(prop.slice(5))}="${escape(value, true)}"`;
     } else {
-      result += `${Aliases[prop] || escape(prop)}="${escape(value, true)}"`;
+      result += `${escape(prop)}="${escape(value, true)}"`;
     }
     if (i !== keys.length - 1) result += " ";
   }
-  if (skipChildren) return {
-    t: result + "/>"
-  };
+  if (skipChildren)
+    return {
+      t: result + "/>"
+    };
   if (typeof children === "function") children = children();
   return {
     t: result + `>${resolveSSRNode(children, true)}</${tag}>`
   };
 }
 function ssrAttribute(key, value, isBoolean) {
-  return isBoolean ? value ? " " + key : "" : value != null ? ` ${key}="${value}"` : "";
+  return isBoolean ? (value ? " " + key : "") : value != null ? ` ${key}="${value}"` : "";
 }
 function ssrHydrationKey() {
   const hk = getHydrationKey();
@@ -477,12 +939,13 @@ function escape(s, attr) {
       left = iDelim + 1;
       iDelim = s.indexOf(delim, left);
     } while (iDelim >= 0);
-  } else while (iAmp >= 0) {
-    if (left < iAmp) out += s.substring(left, iAmp);
-    out += "&amp;";
-    left = iAmp + 1;
-    iAmp = s.indexOf("&", left);
-  }
+  } else
+    while (iAmp >= 0) {
+      if (left < iAmp) out += s.substring(left, iAmp);
+      out += "&amp;";
+      left = iAmp + 1;
+      iAmp = s.indexOf("&", left);
+    }
   return left < s.length ? out + s.substring(left) : out;
 }
 function resolveSSRNode(node, top) {
@@ -494,7 +957,7 @@ function resolveSSRNode(node, top) {
     let mapped = "";
     for (let i = 0, len = node.length; i < len; i++) {
       if (!top && typeof prev !== "object" && typeof node[i] !== "object") mapped += `<!--!$-->`;
-      mapped += resolveSSRNode(prev = node[i]);
+      mapped += resolveSSRNode((prev = node[i]));
     }
     return mapped;
   }
@@ -515,11 +978,12 @@ function getAssets() {
   for (let i = 0, len = assets.length; i < len; i++) out += assets[i]();
   return out;
 }
-function generateHydrationScript({
-  eventNames = ["click", "input"],
-  nonce
-} = {}) {
-  return `<script${nonce ? ` nonce="${nonce}"` : ""}>window._$HY||(e=>{let t=e=>e&&e.hasAttribute&&(e.hasAttribute("data-hk")?e:t(e.host&&e.host.nodeType?e.host:e.parentNode));["${eventNames.join('", "')}"].forEach((o=>document.addEventListener(o,(o=>{if(!e.events)return;let s=t(o.composedPath&&o.composedPath()[0]||o.target);s&&!e.completed.has(s)&&e.events.push([s,o])}))))})(_$HY={events:[],completed:new WeakSet,r:{},fe(){}});</script><!--xs-->`;
+function generateHydrationScript({ eventNames = ["click", "input"], nonce } = {}) {
+  return `<script${
+    nonce ? ` nonce="${nonce}"` : ""
+  }>window._$HY||(e=>{let t=e=>e&&e.hasAttribute&&(e.hasAttribute("data-hk")?e:t(e.host&&e.host.nodeType?e.host:e.parentNode));["${eventNames.join(
+    '", "'
+  )}"].forEach((o=>document.addEventListener(o,(o=>{if(!e.events)return;let s=t(o.composedPath&&o.composedPath()[0]||o.target);s&&!e.completed.has(s)&&e.events.push([s,o])}))))})(_$HY={events:[],completed:new WeakSet,r:{},fe(){}});</script><!--xs-->`;
 }
 function Hydration(props) {
   if (!sharedConfig.context.noHydrate) return props.children;
@@ -578,31 +1042,111 @@ function replacePlaceholder(html, key, value) {
   const last = html.indexOf(close, first + marker.length);
   return html.slice(0, first) + value + html.slice(last + close.length);
 }
+function classListToObject(classList) {
+  if (Array.isArray(classList)) {
+    const result = {};
+    flattenClassList(classList, result);
+    return result;
+  }
+  return classList;
+}
+function flattenClassList(list, result) {
+  for (let i = 0, len = list.length; i < len; i++) {
+    const item = list[i];
+    if (Array.isArray(item)) flattenClassList(item, result);
+    else if (typeof item === "object" && item != null) Object.assign(result, item);
+    else if (item || item === 0) result[item] = true;
+  }
+}
 const RequestContext = Symbol();
 function getRequestEvent() {
-  return globalThis[RequestContext] ? globalThis[RequestContext].getStore() || sharedConfig.context && sharedConfig.context.event || console.log("RequestEvent is missing. This is most likely due to accessing `getRequestEvent` non-managed async scope in a partially polyfilled environment. Try moving it above all `await` calls.") : undefined;
+  return globalThis[RequestContext]
+    ? globalThis[RequestContext].getStore() ||
+        (sharedConfig.context && sharedConfig.context.event) ||
+        console.log(
+          "RequestEvent is missing. This is most likely due to accessing `getRequestEvent` non-managed async scope in a partially polyfilled environment. Try moving it above all `await` calls."
+        )
+    : undefined;
 }
 function Assets(props) {
   useAssets(() => props.children);
 }
 function notSup() {
-  throw new Error("Client-only API called on the server side. Run client-only code in onMount, or conditionally run client-only component with <Show>.");
+  throw new Error(
+    "Client-only API called on the server side. Run client-only code in onMount, or conditionally run client-only component with <Show>."
+  );
 }
 
 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);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] = splitProps(props, ["component"]);
+  return createDynamic(() => props.component, others);
+}
 function Portal(props) {
   return "";
 }
 
-export { Assets, ChildProperties, DOMElements, DelegatedEvents, Dynamic, Hydration, HydrationScript, NoHydration, Portal, Properties, RequestContext, SVGElements, SVGNamespace, notSup as addEventListener, notSup as assign, notSup as className, notSup as delegateEvents, notSup as dynamicProperty, escape, generateHydrationScript, getAssets, getHydrationKey, notSup as getNextElement, notSup as getNextMarker, notSup as getNextMatch, getPropAlias, getRequestEvent, notSup as hydrate, notSup as insert, isDev, isServer, notSup as render, renderToStream, renderToString, renderToStringAsync, resolveSSRNode, notSup as runHydrationEvents, notSup as setAttribute, notSup as setAttributeNS, notSup as setProperty, notSup as spread, ssr, ssrAttribute, ssrClassName, ssrElement, ssrHydrationKey, ssrStyle, notSup as style, notSup as template, useAssets };
+export {
+  Assets,
+  ChildProperties,
+  DOMElements,
+  DelegatedEvents,
+  Dynamic,
+  Hydration,
+  HydrationScript,
+  NoHydration,
+  Portal,
+  Properties,
+  RequestContext,
+  SVGElements,
+  SVGNamespace,
+  notSup as addEventListener,
+  notSup as assign,
+  notSup as className,
+  createDynamic,
+  notSup as delegateEvents,
+  notSup as dynamicProperty,
+  escape,
+  generateHydrationScript,
+  getAssets,
+  getHydrationKey,
+  notSup as getNextElement,
+  notSup as getNextMarker,
+  notSup as getNextMatch,
+  getPropAlias,
+  getRequestEvent,
+  notSup as hydrate,
+  notSup as insert,
+  isDev,
+  isServer,
+  notSup as render,
+  renderToStream,
+  renderToString,
+  renderToStringAsync,
+  resolveSSRNode,
+  notSup as runHydrationEvents,
+  notSup as setAttribute,
+  notSup as setAttributeNS,
+  notSup as setProperty,
+  notSup as spread,
+  ssr,
+  ssrAttribute,
+  ssrClassName,
+  ssrElement,
+  ssrHydrationKey,
+  ssrStyle,
+  notSup as style,
+  notSup as template,
+  useAssets
+};