@solidjs/web 2.0.0-rc.3 → 2.0.0-rc.4

package/dist/dev.js

@@ -1,4 +1,4 @@
-import { createRenderEffect, createMemo, sharedConfig, enableHydration, untrack, runWithOwner, resetErrorHalt, enforceLoadingBoundary, createRoot, flatten, flush, createComponent, omit, createOwner, createSignal, $DEVCOMP, onCleanup, getOwner, createEffect } from 'solid-js';
+import { createRenderEffect, createMemo, sharedConfig, enableHydration, untrack, runWithOwner, resetErrorHalt, enforceLoadingBoundary, createRoot, flatten, flush, getOwner, createOwner, patchableRaw, storeHasOptimisticFamily, storeIsShallow, registerRowOps, registerSlotPatch, onCleanup, registerPatch, createComponent, omit, createSignal, $DEVCOMP, createEffect } from 'solid-js';
 export { Errored, For, Hydration, Loading, Match, NoHydration, Repeat, Reveal, Show, Switch, createComponent, getOwner, merge as mergeProps, untrack } from 'solid-js';
 
 const DOMWithState = {
@@ -333,6 +333,10 @@ const waitAsset = promise => {
   }
   gate();
 };
+let listDriver;
+function installListDriver(driver) {
+  listDriver = driver;
+}
 const $$EVENT_OWNER = "_$SOLID_EVENT_OWNER";
 const INNER_OWNED = {};
 const delegatedEvents = new Set();
@@ -616,11 +620,6 @@ function ref(fn, element) {
   const resolved = untrack(fn);
   runWithOwner(null, () => applyRef(resolved, element));
 }
-const PURE_ROW = Symbol.for("solid.pure-row");
-function rowProof(fn) {
-  fn[PURE_ROW] = true;
-  return fn;
-}
 function scope(fn) {
   fn.$s = true;
   return fn;
@@ -684,16 +683,16 @@ function stripTextSeparators(nodes) {
   nodes.length = j;
   return nodes;
 }
-function patchDriver(subject, body) {
-  {
-    effect(() => body(subject, subject, false), () => body(subject, undefined, true));
-  }
-}
 function insert(parent, accessor, marker, initial, options) {
   const multi = marker !== undefined;
   const host = options && options.host;
   if (multi && !initial) initial = [];
   if (hydrationRt !== null) initial = hydrationRt.claimInitial(parent, multi, initial);
+  if (listDriver !== undefined && typeof accessor === "function" && accessor.$ll !== undefined) {
+    const listAccessor = accessor;
+    const owner = getOwner();
+    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);
     if (typeof accessor !== "function") {
@@ -1172,6 +1171,15 @@ function hydrate(code, element, options = {}) {
   enableHydration();
   installHydrationRuntime();
   if (globalThis._$HY.done) return render(code, element, [...element.childNodes], options);
+  const head = (element.nodeType === 9 ? element : element.ownerDocument).head;
+  if (head && element.contains(head)) {
+    let n = head.firstChild;
+    while (n && n.nodeType === 1 && n.hasAttribute("data-dh") && !n.hasAttribute("data-dhf")) {
+      const next = n.nextSibling;
+      head.appendChild(n);
+      n = next;
+    }
+  }
   options.renderId ||= "";
   if (!globalThis._$HY.modules) globalThis._$HY.modules = {};
   if (!globalThis._$HY.loading) globalThis._$HY.loading = {};
@@ -1685,6 +1693,331 @@ function getHydrationKey() {
 }
 const RequestContext = Symbol();
 
+const PURE_ROW = Symbol.for("solid.pure-row");
+const arm = () => {
+  installListDriver(driveList);
+};
+function rowProof(fn) {
+  arm();
+  fn[PURE_ROW] = true;
+  return fn;
+}
+let rowCollector = null;
+const lisPositions = sources => {
+  const n = sources.length;
+  const tails = [];
+  const tailsIdx = [];
+  const prev = new Array(n).fill(-1);
+  for (let j = 0; j < n; j++) {
+    const v = sources[j];
+    if (v === -1) continue;
+    let lo = 0,
+      hi = tails.length;
+    while (lo < hi) {
+      const mid = lo + hi >> 1;
+      if (tails[mid] < v) lo = mid + 1;else hi = mid;
+    }
+    if (lo > 0) prev[j] = tailsIdx[lo - 1];
+    tails[lo] = v;
+    tailsIdx[lo] = j;
+  }
+  const stable = new Set();
+  let k = tailsIdx.length ? tailsIdx[tails.length - 1] : -1;
+  while (k >= 0) {
+    stable.add(k);
+    k = prev[k];
+  }
+  return stable;
+};
+const driveList = (parent, listFn, marker, lateClassic) => {
+  const meta = listFn.$ll;
+  if (meta.row?.[PURE_ROW] !== true) return false;
+  if (typeof meta.keyed === "function") return false;
+  const evalOwner = createOwner({
+    id: "&each"
+  });
+  let subject = runWithOwner(evalOwner, () => untrack(meta.each));
+  evalOwner.dispose();
+  let raw = subject != null ? patchableRaw(subject) : undefined;
+  if (raw === undefined || !Array.isArray(raw)) return false;
+  const optimistic = storeHasOptimisticFamily(subject);
+  if (optimistic) raw = untrack(() => Array.from(subject));
+  const hydrating = !!sharedConfig.hydrating;
+  if (hydrating && raw.length === 0) return false;
+  let domRows;
+  let rowIds;
+  if (hydrating) {
+    if (marker !== undefined) return false;
+    domRows = Array.from(parent.children);
+    if (domRows.length !== raw.length) return false;
+    rowIds = new Array(raw.length);
+    for (let i = 0; i < domRows.length; i++) {
+      const key = domRows[i].getAttribute("_hk");
+      if (key === null || !key.endsWith("0") || key.length < 2) return false;
+      rowIds[i] = key.slice(0, -1);
+    }
+  }
+  const rowFn = meta.row;
+  const endAnchor = marker ?? null;
+  const shallow = storeIsShallow(subject);
+  let lastBodies = null;
+  let lastUnbinds = null;
+  const collectBind = (abs, build) => {
+    const prevC = rowCollector;
+    rowCollector = {
+      row: shallow ? subject[abs] : undefined,
+      bodies: [],
+      unbinds: []
+    };
+    try {
+      return build();
+    } finally {
+      lastBodies = rowCollector.bodies;
+      lastUnbinds = rowCollector.unbinds;
+      rowCollector = prevC;
+    }
+  };
+  const listOwner = createOwner();
+  let declined = false;
+  const bindRow = (abs, claimId) => {
+    {
+      const o = listOwner;
+      const prevChild = o._firstChild;
+      const prevDisposal = o._disposal;
+      const node = collectBind(abs, () => runWithOwner(listOwner, () => claimId !== undefined ? runWithOwner(createOwner({
+        id: claimId
+      }), () => untrack(() => rowFn(subject[abs]))) : untrack(() => rowFn(subject[abs]))));
+      if (o._firstChild !== prevChild || o._disposal !== prevDisposal) {
+        console.warn("A patch-mode list row created reactive computations or cleanups " + "during build (likely a handler/attribute value expression calling " + "createEffect/onCleanup). This work attaches to the LIST, not the " + "row, and will not dispose when the row is removed. Move owned " + "work into effects/refs (which opt the row out of patch mode).");
+      }
+      return node;
+    }
+  };
+  let entries = new Array(raw.length);
+  let rowBodies = shallow ? new Array(raw.length) : null;
+  let rowUnbinds = new Array(raw.length);
+  const runUnbinds = list => {
+    if (list !== undefined) for (let u = 0; u < list.length; u++) list[u]();
+  };
+  const unbindAllRows = () => {
+    for (let j = 0; j < rowUnbinds.length; j++) runUnbinds(rowUnbinds[j]);
+    rowUnbinds = [];
+  };
+  let prevRaws = raw.slice();
+  try {
+    if (hydrating) {
+      for (let i = 0; i < raw.length; i++) {
+        entries[i] = bindRow(i, rowIds[i]);
+        if (rowBodies !== null) rowBodies[i] = lastBodies;
+        rowUnbinds[i] = lastUnbinds;
+      }
+    } else {
+      for (let i = 0; i < raw.length; i++) {
+        const node = bindRow(i);
+        entries[i] = node;
+        if (rowBodies !== null) rowBodies[i] = lastBodies;
+        rowUnbinds[i] = lastUnbinds;
+        parent.insertBefore(node, endAnchor);
+      }
+    }
+  } catch (err) {
+    unbindAllRows();
+    runUnbinds(lastUnbinds ?? undefined);
+    for (let j = 0; j < entries.length; j++) {
+      const n = entries[j];
+      if (n !== undefined && n.parentNode === parent) n.remove();
+    }
+    listOwner.dispose();
+    throw err;
+  }
+  const identityOps = nextArr => {
+    const keyOf = r => {
+      const w = r != null ? patchableRaw(r) : undefined;
+      return w !== undefined ? w : r;
+    };
+    const oldIndex = new Map();
+    for (let j = 0; j < prevRaws.length; j++) {
+      const k = keyOf(prevRaws[j]);
+      const existing = oldIndex.get(k);
+      if (existing === undefined) oldIndex.set(k, j);else if (Array.isArray(existing)) existing.push(j);else oldIndex.set(k, [existing, j]);
+    }
+    const sources = new Array(nextArr.length);
+    for (let k = 0; k < nextArr.length; k++) {
+      const m = oldIndex.get(keyOf(nextArr[k]));
+      if (m === undefined) sources[k] = -1;else if (Array.isArray(m)) {
+        sources[k] = m.shift();
+        if (m.length === 1) oldIndex.set(keyOf(nextArr[k]), m[0]);
+      } else {
+        sources[k] = m;
+        oldIndex.delete(keyOf(nextArr[k]));
+      }
+    }
+    return {
+      prefix: 0,
+      sources
+    };
+  };
+  let resyncNeeded = false;
+  const applyOps = (next, ops) => {
+    if (declined) return;
+    if (resyncNeeded) ops = null;
+    if (ops === null) ops = identityOps(next);
+    const {
+      prefix,
+      sources
+    } = ops;
+    const built = new Array(sources.length);
+    const builtBodies = rowBodies !== null ? new Array(sources.length) : null;
+    const builtUnbinds = new Array(sources.length);
+    let j = 0;
+    try {
+      for (; j < sources.length; j++) {
+        const abs = prefix + j;
+        const src = sources[j];
+        if (src === -1 || refRebuild && src >= 0 && next[abs] !== prevRaws[src]) {
+          built[j] = bindRow(abs);
+          if (builtBodies !== null) builtBodies[j] = lastBodies;
+          builtUnbinds[j] = lastUnbinds;
+        }
+      }
+    } catch (err) {
+      for (let k = 0; k < j; k++) runUnbinds(builtUnbinds[k]);
+      runUnbinds(lastUnbinds ?? undefined);
+      resyncNeeded = true;
+      throw err;
+    }
+    const retained = new Set();
+    for (let k = 0; k < sources.length; k++) {
+      if (sources[k] >= 0 && built[k] === undefined) retained.add(sources[k]);
+    }
+    for (let k = prefix; k < entries.length; k++) {
+      if (!retained.has(k)) {
+        entries[k].remove();
+        runUnbinds(rowUnbinds[k]);
+      }
+    }
+    const newEntries = new Array(prefix + sources.length);
+    const newBodies = rowBodies !== null ? new Array(prefix + sources.length) : null;
+    const newUnbinds = new Array(prefix + sources.length);
+    for (let i = 0; i < prefix; i++) {
+      newEntries[i] = entries[i];
+      if (newBodies !== null) newBodies[i] = rowBodies[i];
+      newUnbinds[i] = rowUnbinds[i];
+    }
+    const stable = lisPositions(sources);
+    let anchor = endAnchor;
+    for (let k = sources.length - 1; k >= 0; k--) {
+      const abs = prefix + k;
+      const src = sources[k];
+      let node;
+      if (built[k] !== undefined) {
+        node = built[k];
+        if (newBodies !== null) newBodies[abs] = builtBodies[k];
+        newUnbinds[abs] = builtUnbinds[k];
+        parent.insertBefore(node, anchor);
+      } else {
+        node = entries[src];
+        if (newBodies !== null) newBodies[abs] = rowBodies[src];
+        newUnbinds[abs] = rowUnbinds[src];
+        if (!stable.has(k)) parent.insertBefore(node, anchor);
+      }
+      newEntries[abs] = node;
+      anchor = node;
+    }
+    entries = newEntries;
+    if (newBodies !== null) rowBodies = newBodies;
+    rowUnbinds = newUnbinds;
+    prevRaws = next.slice();
+    resyncNeeded = false;
+  };
+  let unbindOps = runWithOwner(listOwner, () => registerRowOps(subject, applyOps));
+  const refRebuild = shallow && typeof meta.keyed !== "function";
+  const rebuildSlot = i => {
+    runUnbinds(rowUnbinds[i]);
+    const old = entries[i];
+    const node = bindRow(i);
+    rowBodies[i] = lastBodies;
+    rowUnbinds[i] = lastUnbinds;
+    parent.insertBefore(node, old);
+    old.remove();
+    entries[i] = node;
+  };
+  const applySlot = (i, next, prev) => {
+    if (declined) return;
+    if (resyncNeeded) {
+      const live = subject != null ? patchableRaw(subject) : undefined;
+      if (live !== undefined && Array.isArray(live)) applyOps(live, null);
+      return;
+    }
+    if (refRebuild) {
+      rebuildSlot(i);
+      prevRaws[i] = next;
+      return;
+    }
+    const bodies = rowBodies[i];
+    if (bodies !== undefined) {
+      for (let b = 0; b < bodies.length; b++) bodies[b](next, prev, false);
+    }
+    prevRaws[i] = next;
+  };
+  let unbindSlots = shallow ? runWithOwner(listOwner, () => registerSlotPatch(subject, applySlot)) : null;
+  runWithOwner(listOwner, () => effect(() => meta.each(), value => {
+    if (declined || value === subject) return;
+    const nextRaw = value != null ? patchableRaw(value) : undefined;
+    unbindOps();
+    unbindSlots?.();
+    if (nextRaw !== undefined && Array.isArray(nextRaw) && storeIsShallow(value) !== shallow) {
+      for (let j = 0; j < entries.length; j++) entries[j].remove();
+      entries = [];
+      prevRaws = [];
+      unbindAllRows();
+      subject = value;
+      declined = true;
+      listOwner.dispose();
+      lateClassic?.();
+      return;
+    }
+    if (nextRaw === undefined || !Array.isArray(nextRaw)) {
+      for (let j = 0; j < entries.length; j++) entries[j].remove();
+      entries = [];
+      prevRaws = [];
+      unbindAllRows();
+      subject = value;
+      declined = true;
+      listOwner.dispose();
+      lateClassic?.();
+      return;
+    }
+    const swapOps = identityOps(nextRaw);
+    subject = value;
+    unbindOps = runWithOwner(listOwner, () => registerRowOps(subject, applyOps));
+    if (shallow) unbindSlots = runWithOwner(listOwner, () => registerSlotPatch(subject, applySlot));
+    applyOps(nextRaw, swapOps);
+  }));
+  onCleanup(() => {
+    unbindOps();
+    unbindSlots?.();
+    unbindAllRows();
+    listOwner.dispose();
+  });
+  return true;
+};
+const patchDriver = (subject, body) => {
+  const raw = patchableRaw(subject);
+  if (raw !== undefined) {
+    if (!sharedConfig.hydrating) body(raw, undefined, true);
+    const unbind = registerPatch(subject, body);
+    if (rowCollector !== null) rowCollector.unbinds.push(unbind);
+    else onCleanup(unbind);
+  } else if (rowCollector !== null && subject === rowCollector.row) {
+    rowCollector.bodies.push(body);
+    if (!sharedConfig.hydrating) body(subject, undefined, true);
+  } else {
+    effect(() => body(subject, subject, false),
+    () => untrack(() => body(subject, undefined, true)));
+  }
+};
+
 function throwInBrowser(func) {
   const err = new Error(`${func.name} is not supported in the browser, returning undefined`);
   console.error(err);
@@ -1795,7 +2128,8 @@ function redirect(url, init = 302) {
   if (responseInit.status === undefined) {
     responseInit.status = 302;
   }
-  headers.set("Location", String(url));
+  const target = typeof url === "string" ? url : url[HREF];
+  headers.set("Location", typeof target === "string" ? target : String(url));
   return new Response(null, {
     ...responseInit,
     headers
@@ -1969,4 +2303,4 @@ _moduleUrl) {
 function httpStatus(_code, _text) {}
 function httpHeader(_name, _value, _options) {}
 
-export { ChildProperties, DOMElements, DOMWithState, DelegatedEvents, Dynamic, HREF, HydrationScript, MathMLElements, Namespaces, Portal, REVALIDATE_HEADER, RawTextElements, RequestContext, ResponseEnvelope, SAFE_ERROR, SVGElements, VoidElements, acquireAsset, addEvent, applyRef, assign, claimElement, claimElementTree, className, clearFlashCookie, clientOnly, commitEventResponse, composeMiddleware, createRequestEvent, createResponseStub, createSSRResponse, delegateEvents, dynamic, dynamicProperty, effect, escape, generateHydrationScript, getDelegatedRoot, getExpectedRedirectStatus, getFirstChild, getHydrationKey, getNextElement, getNextMarker, getNextMatch, getNextSibling, getRequestEvent, getServerFunctionMetadata, getServerFunctionRPC, hasFlashCookie, httpHeader, httpStatus, hydrate, insert, installHydrationRuntime, isDev, isHref, isResponseEnvelope, isSafeError, isServer, isServerFunction, 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, Namespaces, Portal, 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 };

package/dist/server.cjs

@@ -251,7 +251,8 @@ function redirect(url, init = 302) {
   if (responseInit.status === undefined) {
     responseInit.status = 302;
   }
-  headers.set("Location", String(url));
+  const target = typeof url === "string" ? url : url[HREF];
+  headers.set("Location", typeof target === "string" ? target : String(url));
   return new Response(null, {
     ...responseInit,
     headers
@@ -2479,7 +2480,7 @@ function ssrClaim(map) {
 function decodeSSREntities(s) {
   return s.indexOf("&") < 0 ? s : s.replace(/&quot;/g, '"').replace(/&lt;/g, "<").replace(/&amp;/g, "&");
 }
-const SELECT_VALUE_ATTR = /\svalue="([^"]*)"/;
+const SELECT_VALUE_ATTR = /\svalue(?:="([^"]*)")?(?=[\s>]|$)/;
 function tagEnd(html, i) {
   for (let j = i + 1; j < html.length; j++) {
     const c = html.charCodeAt(j);
@@ -2531,7 +2532,7 @@ function resolveSSRSelectValues(html) {
       cand = html.indexOf("<select", e0 + 1);
       continue;
     }
-    const bound = decodeSSREntities(m[1]);
+    const bound = decodeSSREntities(m[1] ?? "");
     const sel = {
       values: /\smultiple(?=[\s>=])/.test(open) ? bound.split(",") : [bound],
       strip: cand + m.index,
@@ -2568,7 +2569,7 @@ function resolveSSRSelectValues(html) {
           const attrs = html.slice(i + 7, e);
           if (/\sselected(?=[\s=]|$)/.test(attrs)) sel.defaulted = true;else {
             const vm = SELECT_VALUE_ATTR.exec(attrs);
-            const value = vm ? decodeSSREntities(vm[1]) : decodeSSREntities(optionText(html, e + 1)).replace(/\s+/g, " ").trim();
+            const value = vm ? decodeSSREntities(vm[1] ?? "") : decodeSSREntities(optionText(html, e + 1)).replace(/\s+/g, " ").trim();
             if (sel.values.includes(value)) sel.marks.push(e);
           }
         }

package/dist/server.js

@@ -250,7 +250,8 @@ function redirect(url, init = 302) {
   if (responseInit.status === undefined) {
     responseInit.status = 302;
   }
-  headers.set("Location", String(url));
+  const target = typeof url === "string" ? url : url[HREF];
+  headers.set("Location", typeof target === "string" ? target : String(url));
   return new Response(null, {
     ...responseInit,
     headers
@@ -2478,7 +2479,7 @@ function ssrClaim(map) {
 function decodeSSREntities(s) {
   return s.indexOf("&") < 0 ? s : s.replace(/&quot;/g, '"').replace(/&lt;/g, "<").replace(/&amp;/g, "&");
 }
-const SELECT_VALUE_ATTR = /\svalue="([^"]*)"/;
+const SELECT_VALUE_ATTR = /\svalue(?:="([^"]*)")?(?=[\s>]|$)/;
 function tagEnd(html, i) {
   for (let j = i + 1; j < html.length; j++) {
     const c = html.charCodeAt(j);
@@ -2530,7 +2531,7 @@ function resolveSSRSelectValues(html) {
       cand = html.indexOf("<select", e0 + 1);
       continue;
     }
-    const bound = decodeSSREntities(m[1]);
+    const bound = decodeSSREntities(m[1] ?? "");
     const sel = {
       values: /\smultiple(?=[\s>=])/.test(open) ? bound.split(",") : [bound],
       strip: cand + m.index,
@@ -2567,7 +2568,7 @@ function resolveSSRSelectValues(html) {
           const attrs = html.slice(i + 7, e);
           if (/\sselected(?=[\s=]|$)/.test(attrs)) sel.defaulted = true;else {
             const vm = SELECT_VALUE_ATTR.exec(attrs);
-            const value = vm ? decodeSSREntities(vm[1]) : decodeSSREntities(optionText(html, e + 1)).replace(/\s+/g, " ").trim();
+            const value = vm ? decodeSSREntities(vm[1] ?? "") : decodeSSREntities(optionText(html, e + 1)).replace(/\s+/g, " ").trim();
             if (sel.values.includes(value)) sel.marks.push(e);
           }
         }