@solidjs/web 2.0.0-rc.5 → 2.0.0-rc.6

package/dist/dev.cjs

@@ -49,6 +49,7 @@ const Namespaces = {
 const VoidElements = /*#__PURE__*/new Set(["area", "base", "br", "col", "embed", "hr", "img", "input", "link", "meta", "param", "source", "track", "wbr"]);
 const RawTextElements = /*#__PURE__*/new Set(["style", "script", "noscript", "template", "textarea", "title"]);
 const DOMElements = /*#__PURE__*/new Set(/*#__PURE__*/"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,h1,h2,h3,h4,h5,h6,head,header,hgroup,hr,html,i,iframe,image,img,input,ins,isindex,kbd,keygen,label,legend,li,link,listing,main,map,mark,marquee,math,menu,menuitem,meta,meter,multicol,nav,nextid,nobr,noembed,noframes,noindex,noscript,object,ol,optgroup,option,output,p,param,picture,plaintext,portal,pre,progress,q,rb,rp,rt,rtc,ruby,s,samp,script,search,section,select,shadow,slot,small,source,spacer,span,strike,strong,style,sub,summary,sup,svg,table,tbody,td,template,textarea,tfoot,th,thead,time,title,tr,track,tt,u,ul,var,video,wbr,webview,xmp".split(","));
+const COMPOSED_BODY_FRAMING = /*#__PURE__*/new Set(["content-length", "content-encoding", "transfer-encoding"]);
 
 const transparentOptions = {
   transparent: true,
@@ -361,6 +362,8 @@ function installListDriver(driver) {
   exports.listDriver = driver;
 }
 const $$EVENT_OWNER = "_$SOLID_EVENT_OWNER";
+const $$EVENT_TUPLE = Symbol();
+const hasOwn = Object.prototype.hasOwnProperty;
 const INNER_OWNED = {};
 const delegatedEvents = new Set();
 const delegatedContainers = new Map();
@@ -486,7 +489,8 @@ function findOwner(target, state) {
 }
 function setProperty(node, name, value) {
   if (isHydrating(node)) return;
-  node[name] = value;
+  const nodeName = node.nodeName;
+  if (name === "value" && nodeName === "SELECT") queueMicrotask(() => node.value = value) || (node.value = value);else if ((name === "value" || name === "defaultValue") && (nodeName === "INPUT" || nodeName === "TEXTAREA")) node[name] = value ?? "";else node[name] = value;
 }
 let claimHandlers = null;
 const CLAIM_SEAM = Symbol.for("solid.element-claims");
@@ -520,7 +524,17 @@ function claimElement(node) {
 }
 function setAttribute(node, name, value) {
   if (isHydrating(node)) return;
-  if (value == null || value === false) node.removeAttribute(name);else node.setAttribute(name, value === true ? "" : value);
+  const selectMultiple = name === "multiple" && node.localName === "select";
+  if (value == null || value === false) node.removeAttribute(name);else {
+    node.setAttribute(name, value === true ? "" : value);
+    if (selectMultiple && !node._$multiple) {
+      const options = node.options;
+      for (let i = 0; i < options.length; i++) {
+        if (options[i].defaultSelected) options[i].selected = true;
+      }
+    }
+  }
+  if (selectMultiple) node._$multiple = true;
   if (claimHandlers !== null && (name === "href" || name === "action")) claimElement(node);
 }
 function setAttributeNS(node, namespace, name, value) {
@@ -528,22 +542,32 @@ function setAttributeNS(node, namespace, name, value) {
   if (value == null || value === false) node.removeAttributeNS(namespace, name.indexOf(":") > -1 ? name.split(":").pop() : name);else node.setAttributeNS(namespace, name, value === true ? "" : value);
 }
 function className(node, value, prev) {
-  if (isHydrating(node)) return;
+  if (typeof value === "number") value = "" + value;
+  if (typeof prev === "number") prev = "" + prev;
+  if (isHydrating(node)) {
+    node._$classes = value && typeof value === "object" ? classListToObject(value) : undefined;
+    return;
+  }
   if (value == null || value === false) {
-    prev && node.removeAttribute("class");
+    if (prev || node._$classes) {
+      node.removeAttribute("class");
+      node._$classes = undefined;
+    }
     return;
   }
   if (typeof value === "string") {
+    node._$classes = undefined;
     value !== prev && node.setAttribute("class", value);
     return;
   }
+  let applied;
   if (typeof prev === "string") {
-    prev = {};
+    applied = {};
     node.removeAttribute("class");
-  } else prev = classListToObject(prev || {});
+  } else applied = node._$classes || classListToObject(prev || {});
   value = classListToObject(value);
-  const classKeys = Object.keys(value || {});
-  const prevKeys = Object.keys(prev);
+  const classKeys = Object.keys(value);
+  const prevKeys = Object.keys(applied);
   let i, len;
   for (i = 0, len = prevKeys.length; i < len; i++) {
     const key = prevKeys[i];
@@ -553,22 +577,34 @@ function className(node, value, prev) {
   for (i = 0, len = classKeys.length; i < len; i++) {
     const key = classKeys[i],
       classValue = !!value[key];
-    if (!key || key === "undefined" || prev[key] === classValue || !classValue) continue;
+    if (!key || key === "undefined" || applied[key] === classValue || !classValue) continue;
     node.classList.add(key);
   }
+  node._$classes = value;
 }
 function addEvent(node, name, handler, delegate) {
   if (delegate) {
+    const key = `$$${name}`;
+    let data;
     if (Array.isArray(handler)) {
-      node[`$$${name}`] = handler[0];
-      node[`$$${name}Data`] = handler[1];
-    } else node[`$$${name}`] = handler;
-  } else if (Array.isArray(handler)) {
+      data = handler[1];
+      node[key] = handler[0];
+    } else node[key] = handler;
+    node[`${key}Data`] = data;
+    return;
+  }
+  if (Array.isArray(handler)) {
     const handlerFn = handler[0];
-    node.addEventListener(name, handler[0] = e => handlerFn.call(node, handler[1], e));
-  } else node.addEventListener(name, handler, typeof handler !== "function" && handler);
+    const listener = e => handlerFn.call(node, handler[1], e);
+    listener[$$EVENT_TUPLE] = handler;
+    node.addEventListener(name, listener);
+    return listener;
+  }
+  node.addEventListener(name, handler, typeof handler !== "function" && handler);
+  return handler;
 }
 function style(node, value, prev) {
+  if (isHydrating(node)) return;
   if (!value) {
     if (prev || node._$styles) {
       setAttribute(node, "style");
@@ -593,12 +629,13 @@ function style(node, value, prev) {
   }
   let v, s;
   for (s in applied) {
-    if (value[s] == null) {
+    if (!hasOwn.call(value, s) || value[s] == null) {
       nodeStyle.removeProperty(s);
       delete applied[s];
     }
   }
   for (s in value) {
+    if (!hasOwn.call(value, s)) continue;
     v = value[s];
     if (v != null && v !== applied[s]) {
       nodeStyle.setProperty(s, v);
@@ -607,20 +644,26 @@ function style(node, value, prev) {
   }
 }
 function setStyleProperty(node, name, value) {
+  if (isHydrating(node)) return;
   value != null ? node.style.setProperty(name, value) : node.style.removeProperty(name);
 }
 function spread(node, props = {}, skipChildren) {
   const prevProps = {};
   const get = typeof props === "function" ? props : () => props;
-  if (!skipChildren) insert(node, () => get().children);
+  if (!skipChildren) insert(node, () => {
+    const source = get();
+    return hasOwn.call(source, "children") ? source.children : undefined;
+  });
   effect(() => {
-    const r = get().ref;
+    const source = get();
+    const r = hasOwn.call(source, "ref") && source.ref;
     (typeof r === "function" || Array.isArray(r)) && ref(() => r, node);
   }, () => {});
   effect(() => {
     const source = get();
     const newProps = {};
     for (const prop in source) {
+      if (!hasOwn.call(source, prop)) continue;
       if (prop === "children" || prop === "ref") continue;
       newProps[prop] = source[prop];
     }
@@ -652,6 +695,19 @@ function scope(fn) {
 const SCOPE_OPTIONS = {
   scope: true
 };
+let insertionParent = null;
+function getInsertionParent() {
+  return insertionParent;
+}
+function withInsertionParent(parent, fn) {
+  const prev = insertionParent;
+  insertionParent = parent;
+  try {
+    return fn();
+  } finally {
+    insertionParent = prev;
+  }
+}
 let hydrationRt = null;
 function installHydrationRuntime() {
   hydrationRt = {
@@ -719,7 +775,7 @@ function insert(parent, accessor, marker, initial, options) {
     if (exports.listDriver(parent, accessor, marker, () => solidJs.runWithOwner(owner, () => insert(parent, () => listAccessor(), marker, marker !== undefined ? [] : undefined, options)))) return;
   }
   if (typeof accessor !== "function") {
-    accessor = normalize(accessor, initial, multi, true);
+    accessor = withInsertionParent(parent, () => normalize(accessor, initial, multi, true));
     if (typeof accessor !== "function") {
       insertExpression(parent, accessor, initial, marker);
       host && tagHost(accessor, host);
@@ -734,9 +790,9 @@ function insert(parent, accessor, marker, initial, options) {
   let current = initial;
   effect(prev => {
     if (hydrationRt !== null) current = hydrationRt.reclaimRegion(current, parent, marker);
-    const value = normalize(accessor(), current, multi, true);
+    const value = withInsertionParent(parent, () => normalize(accessor(), current, multi, true));
     if (typeof value !== "function") return value;
-    effect(() => (hydrationRt !== null && (current = hydrationRt.reclaimRegion(current, parent, marker)), normalize(value, current, multi)), inner => {
+    effect(() => (hydrationRt !== null && (current = hydrationRt.reclaimRegion(current, parent, marker)), withInsertionParent(parent, () => normalize(value, current, multi))), inner => {
       current = insertExpression(parent, inner, current, marker);
       host && tagHost(current, host);
     }, prev !== undefined && !(options && options.schedule) ? {
@@ -1454,7 +1510,8 @@ function classListToObject(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;
+    if (Array.isArray(item)) flattenClassList(item, result);else if (typeof item === "object" && item != null) Object.assign(result, item);
+    else if (typeof item !== "boolean" && (item || item === 0)) result[item] = true;
   }
 }
 function assignProp(node, prop, value, prev, skipRef, nodeName) {
@@ -1470,12 +1527,13 @@ function assignProp(node, prop, value, prev, skipRef, nodeName) {
     const name = prop.slice(2).toLowerCase();
     const delegate = DelegatedEvents.has(name);
     if (!delegate && prev) {
-      const h = Array.isArray(prev) ? prev[0] : prev;
-      node.removeEventListener(name, h);
+      if (Array.isArray(value) && typeof prev === "function" && prev[$$EVENT_TUPLE] === value) return prev;
+      node.removeEventListener(name, prev, typeof prev !== "function" && prev);
     }
     if (delegate || value) {
-      addEvent(node, name, value, delegate);
+      const attached = addEvent(node, name, value, delegate);
       delegate && delegateEvents([name]);
+      if (!delegate) return attached;
     }
   } else if (hasNamespace && prop.slice(0, 5) === "prop:" || ChildProperties.has(prop) || DOMWithState[nodeName]?.[prop]) {
     if (hasNamespace) prop = prop.slice(5);else if (isHydrating(node)) return value;
@@ -1515,7 +1573,7 @@ function eventHandler(e, container, state) {
     }
     if (handler && !node.disabled) {
       const data = node[`${key}Data`];
-      data !== undefined ? handler.call(node, data, e) : handler.call(node, e);
+      data !== undefined ? handler.call(node, data, e) : typeof handler === "function" ? handler.call(node, e) : handler.handleEvent(e);
       if (e.cancelBubble) return;
     }
     node.host && typeof node.host !== "string" && !node.host._$host && node.contains(e.target) && retarget(node.host);
@@ -1635,7 +1693,7 @@ function normalize(value, current, multi, doNotUnwrap) {
       const item = value[i],
         prev = current && current[i],
         t = typeof item;
-      if ((t === "string" || t === "number") && prev && prev.nodeType === 3) value[i] = prev;
+      if ((t === "string" || t === "number") && prev && prev.nodeType === 3 && isHydrating(prev)) value[i] = prev;
     }
   }
   return value;
@@ -2188,6 +2246,7 @@ function respond(value, init = {}) {
     responseInit,
     headers
   } = initWithRevalidate(init);
+  for (const header of COMPOSED_BODY_FRAMING) headers.delete(header);
   if (NULL_BODY_STATUSES.has(responseInit.status)) {
     return new ResponseEnvelope(new Response(null, {
       ...responseInit,
@@ -2303,9 +2362,24 @@ function dynamic(source) {
             return solidJs.untrack(() => component(props));
           }
         case "string":
-          const el = solidJs.sharedConfig.hydrating ? getNextElement() : createElement(component, solidJs.untrack(() => props.is));
-          spread(el, props);
-          return el;
+          {
+            if (solidJs.sharedConfig.hydrating) {
+              const el = getNextElement();
+              spread(el, props);
+              return el;
+            }
+            const owner = solidJs.getOwner();
+            let el;
+            return () => {
+              if (!el) {
+                solidJs.runWithOwner(owner, () => {
+                  el = createElement(component, solidJs.untrack(() => props.is));
+                  spread(el, props);
+                });
+              }
+              return el;
+            };
+          }
       }
     });
   };
@@ -2314,8 +2388,15 @@ function Dynamic(props) {
   const Comp = dynamic(() => props.component);
   return solidJs.createComponent(Comp, solidJs.omit(props, "component"));
 }
+const AmbiguousSVGElements = /*#__PURE__*/new Set(["a", "script", "style", "title"]);
 function createElement(tagName, is = undefined) {
-  return SVGElements.has(tagName) ? document.createElementNS(Namespaces.svg, tagName) : MathMLElements.has(tagName) ? document.createElementNS(Namespaces.mathml, tagName) : document.createElement(tagName, {
+  if (SVGElements.has(tagName)) return document.createElementNS(Namespaces.svg, tagName);
+  if (MathMLElements.has(tagName)) return document.createElementNS(Namespaces.mathml, tagName);
+  if (AmbiguousSVGElements.has(tagName)) {
+    const parent = getInsertionParent();
+    if (parent && parent.namespaceURI === Namespaces.svg && parent.localName !== "foreignObject") return document.createElementNS(Namespaces.svg, tagName);
+  }
+  return document.createElement(tagName, {
     is
   });
 }
@@ -2447,6 +2528,7 @@ exports.getDelegatedRoot = getDelegatedRoot;
 exports.getExpectedRedirectStatus = getExpectedRedirectStatus;
 exports.getFirstChild = getFirstChild;
 exports.getHydrationKey = getHydrationKey;
+exports.getInsertionParent = getInsertionParent;
 exports.getNextElement = getNextElement;
 exports.getNextMarker = getNextMarker;
 exports.getNextMatch = getNextMatch;

package/dist/dev.js

@@ -48,6 +48,7 @@ const Namespaces = {
 const VoidElements = /*#__PURE__*/new Set(["area", "base", "br", "col", "embed", "hr", "img", "input", "link", "meta", "param", "source", "track", "wbr"]);
 const RawTextElements = /*#__PURE__*/new Set(["style", "script", "noscript", "template", "textarea", "title"]);
 const DOMElements = /*#__PURE__*/new Set(/*#__PURE__*/"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,h1,h2,h3,h4,h5,h6,head,header,hgroup,hr,html,i,iframe,image,img,input,ins,isindex,kbd,keygen,label,legend,li,link,listing,main,map,mark,marquee,math,menu,menuitem,meta,meter,multicol,nav,nextid,nobr,noembed,noframes,noindex,noscript,object,ol,optgroup,option,output,p,param,picture,plaintext,portal,pre,progress,q,rb,rp,rt,rtc,ruby,s,samp,script,search,section,select,shadow,slot,small,source,spacer,span,strike,strong,style,sub,summary,sup,svg,table,tbody,td,template,textarea,tfoot,th,thead,time,title,tr,track,tt,u,ul,var,video,wbr,webview,xmp".split(","));
+const COMPOSED_BODY_FRAMING = /*#__PURE__*/new Set(["content-length", "content-encoding", "transfer-encoding"]);
 
 const transparentOptions = {
   transparent: true,
@@ -360,6 +361,8 @@ function installListDriver(driver) {
   listDriver = driver;
 }
 const $$EVENT_OWNER = "_$SOLID_EVENT_OWNER";
+const $$EVENT_TUPLE = Symbol();
+const hasOwn = Object.prototype.hasOwnProperty;
 const INNER_OWNED = {};
 const delegatedEvents = new Set();
 const delegatedContainers = new Map();
@@ -485,7 +488,8 @@ function findOwner(target, state) {
 }
 function setProperty(node, name, value) {
   if (isHydrating(node)) return;
-  node[name] = value;
+  const nodeName = node.nodeName;
+  if (name === "value" && nodeName === "SELECT") queueMicrotask(() => node.value = value) || (node.value = value);else if ((name === "value" || name === "defaultValue") && (nodeName === "INPUT" || nodeName === "TEXTAREA")) node[name] = value ?? "";else node[name] = value;
 }
 let claimHandlers = null;
 const CLAIM_SEAM = Symbol.for("solid.element-claims");
@@ -519,7 +523,17 @@ function claimElement(node) {
 }
 function setAttribute(node, name, value) {
   if (isHydrating(node)) return;
-  if (value == null || value === false) node.removeAttribute(name);else node.setAttribute(name, value === true ? "" : value);
+  const selectMultiple = name === "multiple" && node.localName === "select";
+  if (value == null || value === false) node.removeAttribute(name);else {
+    node.setAttribute(name, value === true ? "" : value);
+    if (selectMultiple && !node._$multiple) {
+      const options = node.options;
+      for (let i = 0; i < options.length; i++) {
+        if (options[i].defaultSelected) options[i].selected = true;
+      }
+    }
+  }
+  if (selectMultiple) node._$multiple = true;
   if (claimHandlers !== null && (name === "href" || name === "action")) claimElement(node);
 }
 function setAttributeNS(node, namespace, name, value) {
@@ -527,22 +541,32 @@ function setAttributeNS(node, namespace, name, value) {
   if (value == null || value === false) node.removeAttributeNS(namespace, name.indexOf(":") > -1 ? name.split(":").pop() : name);else node.setAttributeNS(namespace, name, value === true ? "" : value);
 }
 function className(node, value, prev) {
-  if (isHydrating(node)) return;
+  if (typeof value === "number") value = "" + value;
+  if (typeof prev === "number") prev = "" + prev;
+  if (isHydrating(node)) {
+    node._$classes = value && typeof value === "object" ? classListToObject(value) : undefined;
+    return;
+  }
   if (value == null || value === false) {
-    prev && node.removeAttribute("class");
+    if (prev || node._$classes) {
+      node.removeAttribute("class");
+      node._$classes = undefined;
+    }
     return;
   }
   if (typeof value === "string") {
+    node._$classes = undefined;
     value !== prev && node.setAttribute("class", value);
     return;
   }
+  let applied;
   if (typeof prev === "string") {
-    prev = {};
+    applied = {};
     node.removeAttribute("class");
-  } else prev = classListToObject(prev || {});
+  } else applied = node._$classes || classListToObject(prev || {});
   value = classListToObject(value);
-  const classKeys = Object.keys(value || {});
-  const prevKeys = Object.keys(prev);
+  const classKeys = Object.keys(value);
+  const prevKeys = Object.keys(applied);
   let i, len;
   for (i = 0, len = prevKeys.length; i < len; i++) {
     const key = prevKeys[i];
@@ -552,22 +576,34 @@ function className(node, value, prev) {
   for (i = 0, len = classKeys.length; i < len; i++) {
     const key = classKeys[i],
       classValue = !!value[key];
-    if (!key || key === "undefined" || prev[key] === classValue || !classValue) continue;
+    if (!key || key === "undefined" || applied[key] === classValue || !classValue) continue;
     node.classList.add(key);
   }
+  node._$classes = value;
 }
 function addEvent(node, name, handler, delegate) {
   if (delegate) {
+    const key = `$$${name}`;
+    let data;
     if (Array.isArray(handler)) {
-      node[`$$${name}`] = handler[0];
-      node[`$$${name}Data`] = handler[1];
-    } else node[`$$${name}`] = handler;
-  } else if (Array.isArray(handler)) {
+      data = handler[1];
+      node[key] = handler[0];
+    } else node[key] = handler;
+    node[`${key}Data`] = data;
+    return;
+  }
+  if (Array.isArray(handler)) {
     const handlerFn = handler[0];
-    node.addEventListener(name, handler[0] = e => handlerFn.call(node, handler[1], e));
-  } else node.addEventListener(name, handler, typeof handler !== "function" && handler);
+    const listener = e => handlerFn.call(node, handler[1], e);
+    listener[$$EVENT_TUPLE] = handler;
+    node.addEventListener(name, listener);
+    return listener;
+  }
+  node.addEventListener(name, handler, typeof handler !== "function" && handler);
+  return handler;
 }
 function style(node, value, prev) {
+  if (isHydrating(node)) return;
   if (!value) {
     if (prev || node._$styles) {
       setAttribute(node, "style");
@@ -592,12 +628,13 @@ function style(node, value, prev) {
   }
   let v, s;
   for (s in applied) {
-    if (value[s] == null) {
+    if (!hasOwn.call(value, s) || value[s] == null) {
       nodeStyle.removeProperty(s);
       delete applied[s];
     }
   }
   for (s in value) {
+    if (!hasOwn.call(value, s)) continue;
     v = value[s];
     if (v != null && v !== applied[s]) {
       nodeStyle.setProperty(s, v);
@@ -606,20 +643,26 @@ function style(node, value, prev) {
   }
 }
 function setStyleProperty(node, name, value) {
+  if (isHydrating(node)) return;
   value != null ? node.style.setProperty(name, value) : node.style.removeProperty(name);
 }
 function spread(node, props = {}, skipChildren) {
   const prevProps = {};
   const get = typeof props === "function" ? props : () => props;
-  if (!skipChildren) insert(node, () => get().children);
+  if (!skipChildren) insert(node, () => {
+    const source = get();
+    return hasOwn.call(source, "children") ? source.children : undefined;
+  });
   effect(() => {
-    const r = get().ref;
+    const source = get();
+    const r = hasOwn.call(source, "ref") && source.ref;
     (typeof r === "function" || Array.isArray(r)) && ref(() => r, node);
   }, () => {});
   effect(() => {
     const source = get();
     const newProps = {};
     for (const prop in source) {
+      if (!hasOwn.call(source, prop)) continue;
       if (prop === "children" || prop === "ref") continue;
       newProps[prop] = source[prop];
     }
@@ -651,6 +694,19 @@ function scope(fn) {
 const SCOPE_OPTIONS = {
   scope: true
 };
+let insertionParent = null;
+function getInsertionParent() {
+  return insertionParent;
+}
+function withInsertionParent(parent, fn) {
+  const prev = insertionParent;
+  insertionParent = parent;
+  try {
+    return fn();
+  } finally {
+    insertionParent = prev;
+  }
+}
 let hydrationRt = null;
 function installHydrationRuntime() {
   hydrationRt = {
@@ -718,7 +774,7 @@ function insert(parent, accessor, marker, initial, options) {
     if (listDriver(parent, accessor, marker, () => runWithOwner(owner, () => insert(parent, () => listAccessor(), marker, marker !== undefined ? [] : undefined, options)))) return;
   }
   if (typeof accessor !== "function") {
-    accessor = normalize(accessor, initial, multi, true);
+    accessor = withInsertionParent(parent, () => normalize(accessor, initial, multi, true));
     if (typeof accessor !== "function") {
       insertExpression(parent, accessor, initial, marker);
       host && tagHost(accessor, host);
@@ -733,9 +789,9 @@ function insert(parent, accessor, marker, initial, options) {
   let current = initial;
   effect(prev => {
     if (hydrationRt !== null) current = hydrationRt.reclaimRegion(current, parent, marker);
-    const value = normalize(accessor(), current, multi, true);
+    const value = withInsertionParent(parent, () => normalize(accessor(), current, multi, true));
     if (typeof value !== "function") return value;
-    effect(() => (hydrationRt !== null && (current = hydrationRt.reclaimRegion(current, parent, marker)), normalize(value, current, multi)), inner => {
+    effect(() => (hydrationRt !== null && (current = hydrationRt.reclaimRegion(current, parent, marker)), withInsertionParent(parent, () => normalize(value, current, multi))), inner => {
       current = insertExpression(parent, inner, current, marker);
       host && tagHost(current, host);
     }, prev !== undefined && !(options && options.schedule) ? {
@@ -1453,7 +1509,8 @@ function classListToObject(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;
+    if (Array.isArray(item)) flattenClassList(item, result);else if (typeof item === "object" && item != null) Object.assign(result, item);
+    else if (typeof item !== "boolean" && (item || item === 0)) result[item] = true;
   }
 }
 function assignProp(node, prop, value, prev, skipRef, nodeName) {
@@ -1469,12 +1526,13 @@ function assignProp(node, prop, value, prev, skipRef, nodeName) {
     const name = prop.slice(2).toLowerCase();
     const delegate = DelegatedEvents.has(name);
     if (!delegate && prev) {
-      const h = Array.isArray(prev) ? prev[0] : prev;
-      node.removeEventListener(name, h);
+      if (Array.isArray(value) && typeof prev === "function" && prev[$$EVENT_TUPLE] === value) return prev;
+      node.removeEventListener(name, prev, typeof prev !== "function" && prev);
     }
     if (delegate || value) {
-      addEvent(node, name, value, delegate);
+      const attached = addEvent(node, name, value, delegate);
       delegate && delegateEvents([name]);
+      if (!delegate) return attached;
     }
   } else if (hasNamespace && prop.slice(0, 5) === "prop:" || ChildProperties.has(prop) || DOMWithState[nodeName]?.[prop]) {
     if (hasNamespace) prop = prop.slice(5);else if (isHydrating(node)) return value;
@@ -1514,7 +1572,7 @@ function eventHandler(e, container, state) {
     }
     if (handler && !node.disabled) {
       const data = node[`${key}Data`];
-      data !== undefined ? handler.call(node, data, e) : handler.call(node, e);
+      data !== undefined ? handler.call(node, data, e) : typeof handler === "function" ? handler.call(node, e) : handler.handleEvent(e);
       if (e.cancelBubble) return;
     }
     node.host && typeof node.host !== "string" && !node.host._$host && node.contains(e.target) && retarget(node.host);
@@ -1634,7 +1692,7 @@ function normalize(value, current, multi, doNotUnwrap) {
       const item = value[i],
         prev = current && current[i],
         t = typeof item;
-      if ((t === "string" || t === "number") && prev && prev.nodeType === 3) value[i] = prev;
+      if ((t === "string" || t === "number") && prev && prev.nodeType === 3 && isHydrating(prev)) value[i] = prev;
     }
   }
   return value;
@@ -2187,6 +2245,7 @@ function respond(value, init = {}) {
     responseInit,
     headers
   } = initWithRevalidate(init);
+  for (const header of COMPOSED_BODY_FRAMING) headers.delete(header);
   if (NULL_BODY_STATUSES.has(responseInit.status)) {
     return new ResponseEnvelope(new Response(null, {
       ...responseInit,
@@ -2302,9 +2361,24 @@ function dynamic(source) {
             return untrack(() => component(props));
           }
         case "string":
-          const el = sharedConfig.hydrating ? getNextElement() : createElement(component, untrack(() => props.is));
-          spread(el, props);
-          return el;
+          {
+            if (sharedConfig.hydrating) {
+              const el = getNextElement();
+              spread(el, props);
+              return el;
+            }
+            const owner = getOwner();
+            let el;
+            return () => {
+              if (!el) {
+                runWithOwner(owner, () => {
+                  el = createElement(component, untrack(() => props.is));
+                  spread(el, props);
+                });
+              }
+              return el;
+            };
+          }
       }
     });
   };
@@ -2313,8 +2387,15 @@ function Dynamic(props) {
   const Comp = dynamic(() => props.component);
   return createComponent(Comp, omit(props, "component"));
 }
+const AmbiguousSVGElements = /*#__PURE__*/new Set(["a", "script", "style", "title"]);
 function createElement(tagName, is = undefined) {
-  return SVGElements.has(tagName) ? document.createElementNS(Namespaces.svg, tagName) : MathMLElements.has(tagName) ? document.createElementNS(Namespaces.mathml, tagName) : document.createElement(tagName, {
+  if (SVGElements.has(tagName)) return document.createElementNS(Namespaces.svg, tagName);
+  if (MathMLElements.has(tagName)) return document.createElementNS(Namespaces.mathml, tagName);
+  if (AmbiguousSVGElements.has(tagName)) {
+    const parent = getInsertionParent();
+    if (parent && parent.namespaceURI === Namespaces.svg && parent.localName !== "foreignObject") return document.createElementNS(Namespaces.svg, tagName);
+  }
+  return document.createElement(tagName, {
     is
   });
 }
@@ -2346,4 +2427,4 @@ _moduleUrl) {
 function httpStatus(_code, _text) {}
 function httpHeader(_name, _value, _options) {}
 
-export { ChildProperties, DOMElements, DOMWithState, DelegatedEvents, Dynamic, HREF, HydrationScript, MathMLElements, NULL_BODY_STATUSES, Namespaces, Portal, RESPONSE_HEADER_VALUE_LIMIT, REVALIDATE_HEADER, RawTextElements, RequestContext, ResponseEnvelope, SAFE_ERROR, SVGElements, VoidElements, acquireAsset, addEvent, applyRef, assign, claimElement, claimElementTree, className, clearFlashCookie, clientOnly, commitEventResponse, composeMiddleware, createRequestEvent, createResponseStub, createSSRResponse, delegateEvents, driveList, dynamic, dynamicProperty, effect, escape, generateHydrationScript, getDelegatedRoot, getExpectedRedirectStatus, getFirstChild, getHydrationKey, getNextElement, getNextMarker, getNextMatch, getNextSibling, getRequestEvent, getServerFunctionMetadata, getServerFunctionRPC, hasFlashCookie, httpHeader, httpStatus, hydrate, insert, installHydrationRuntime, installListDriver, isDev, isHref, isResponseEnvelope, isSafeError, isServer, isServerFunction, listDriver, markSafeError, memo, parseCookieHeader, patchDriver, redirect, ref, registerDelegatedContainer, registerDelegatedRoot, registerElementClaim, reload, render, renderToStream, renderToString, resolveSSRNode, respond, rowProof, runHydrationEvents, scope, serializeCookie, setAttribute, setAttributeNS, setProperty, setStyleProperty, spread, ssr, ssrAttribute, ssrClassName, ssrElement, ssrGroup, ssrHydrationKey, ssrStyle, ssrStyleProperty, style, template, unregisterDelegatedContainer, unregisterDelegatedRoot, useHead, waitAsset, warmAsset };
+export { ChildProperties, DOMElements, DOMWithState, DelegatedEvents, Dynamic, HREF, HydrationScript, MathMLElements, NULL_BODY_STATUSES, Namespaces, Portal, RESPONSE_HEADER_VALUE_LIMIT, REVALIDATE_HEADER, RawTextElements, RequestContext, ResponseEnvelope, SAFE_ERROR, SVGElements, VoidElements, acquireAsset, addEvent, applyRef, assign, claimElement, claimElementTree, className, clearFlashCookie, clientOnly, commitEventResponse, composeMiddleware, createRequestEvent, createResponseStub, createSSRResponse, delegateEvents, driveList, dynamic, dynamicProperty, effect, escape, generateHydrationScript, getDelegatedRoot, getExpectedRedirectStatus, getFirstChild, getHydrationKey, getInsertionParent, getNextElement, getNextMarker, getNextMatch, getNextSibling, getRequestEvent, getServerFunctionMetadata, getServerFunctionRPC, hasFlashCookie, httpHeader, httpStatus, hydrate, insert, installHydrationRuntime, installListDriver, isDev, isHref, isResponseEnvelope, isSafeError, isServer, isServerFunction, listDriver, markSafeError, memo, parseCookieHeader, patchDriver, redirect, ref, registerDelegatedContainer, registerDelegatedRoot, registerElementClaim, reload, render, renderToStream, renderToString, resolveSSRNode, respond, rowProof, runHydrationEvents, scope, serializeCookie, setAttribute, setAttributeNS, setProperty, setStyleProperty, spread, ssr, ssrAttribute, ssrClassName, ssrElement, ssrGroup, ssrHydrationKey, ssrStyle, ssrStyleProperty, style, template, unregisterDelegatedContainer, unregisterDelegatedRoot, useHead, waitAsset, warmAsset };