solid-js 2.0.0-beta.11 → 2.0.0-beta.13

package/CHEATSHEET.md

@@ -216,9 +216,12 @@ const rest = omit(props, "class", "style"); // replaces splitProps
 const user = createMemo(() => fetchUser(id()));
 // Reading user() suspends until ready; wrap in <Loading>.
 
-// "Refreshing…" indicator (false during initial Loading)
+// "Refreshing…" indicator (false on the Loading path)
 isPending(() => user());
 
+// Render guard: pending read follows the Loading path
+isPending(() => user(), true);
+
 // Peek at the in-flight value during a transition
 latest(id);
 
@@ -255,12 +258,12 @@ Optimistic writes revert when the transition completes.
 ```tsx
 // List, keyed by identity (default)
 <For each={items()}>
-  {(item, i) => <Row item={item()} index={i()} />}
+  {(item, i) => <Row item={item} index={i()} />}
 </For>
 
 // List, non-keyed (replaces <Index>)
 <For each={items()} keyed={false}>
-  {(item, i) => <Row item={item()} index={i()} />}
+  {(item, i) => <Row item={item()} index={i} />}
 </For>
 
 // List with custom key
@@ -290,7 +293,7 @@ Optimistic writes revert when the transition completes.
 </Loading>
 
 // Error boundary (replaces <ErrorBoundary>)
-<Errored fallback={(err, reset) => <button onClick={reset}>retry</button>}>
+<Errored fallback={(err, reset) => <button onClick={reset}>retry {String(err())}</button>}>
   <Page />
 </Errored>
 
@@ -316,7 +319,8 @@ import { Dynamic } from "@solidjs/web";
 <Dynamic component={isEditing() ? Editor : Viewer} value={value()} />
 ```
 
-`<For>` non-keyed: `item` and `i` are **accessors** — call them: `item()`, `i()`.
+`<For>` non-keyed: `item` is an **accessor** and `i` is a plain number.
+`<For>` default/keyed-by-identity: `item` is a **plain value** and `i` is an accessor.
 `<Repeat>`: `i` is a **plain number**.
 
 ---
@@ -434,7 +438,15 @@ function titleDirective(source) {
 <some-element enabled="true" />     // when platform requires the string
 ```
 
-Lowercase HTML attribute names. No `attr:` / `bool:` / `oncapture:` namespaces. Event handlers stay camelCase (`onClick`).
+Lowercase HTML attribute names. No `attr:` / `bool:` / `on:` / `oncapture:` namespaces. Event handlers stay camelCase (`onClick`).
+
+For native listener options, use a ref callback:
+
+```jsx
+const on = (type, handler, options) => el => el.addEventListener(type, handler, options);
+
+<button ref={on("click", handleClick, { capture: true })} />;
+```
 
 ### Conditional classes — always use the array/object form
 
@@ -607,7 +619,7 @@ If your training data is 1.x, these are the corrections. **Read this before gene
 | `indexArray`                       | `mapArray` (handles non-keyed too)                                  |
 | `use:foo={x}` directives           | `ref={foo(x)}` (or array `ref={[a, b(x)]}`)                         |
 | `attr:` / `bool:` namespaces       | Standard attribute behavior                                         |
-| `oncapture:`                       | `addEventListener(..., { capture: true })`                          |
+| `on:` / `oncapture:`               | `onClick` for Solid events; ref callbacks for native listener opts  |
 | `resetErrorBoundaries`             | Boundaries heal automatically                                       |
 
 ### Behavior changes
@@ -618,12 +630,12 @@ If your training data is 1.x, these are the corrections. **Read this before gene
 - **No top-level reactive reads in component body** — reading signals/props directly at the top of a component warns. Read inside JSX, a memo, or `untrack`.
 - **Props are values, not accessors** — at the call site call accessors (`<X v={count()} />`, not `<X v={count} />`). The single most common AI-generated bug.
 - **Don't destructure props** — `function Comp({ name })` warns; use `props.name` to keep reactivity. (Same root cause as above; see the Props section.)
-- **`<For>` non-keyed children are accessors** — `(item, i) => ...` where `item` and `i` are functions. Call them: `item()`, `i()`.
-- **`<Show>` / `<Match>` function children receive narrowed accessors** — also call them.
+- **`<For>` callback shape follows keying** — default/keyed-by-identity receives a raw item and index accessor; `keyed={false}` receives an item accessor and stable numeric index; custom keys receive accessors.
+- **`<Show>` / `<Match>` function children narrow values** — non-keyed children receive accessors; keyed children receive raw values.
 - **Stores: setters take a draft callback** — mutate the draft in place by default. Returning a new value is shallow (array index-replace, object top-level diff); reach for it for filter/remove. Keyed reconcile is a _projection-fn_ feature, not a setter feature.
 - **`undefined` is a real value in `merge`** — it overrides rather than "skip this key".
-- **Async lives in computations** — return a Promise/AsyncIterable from `createMemo`/`createStore(fn)`/`createProjection`. Reads suspend; wrap in `<Loading>`.
-- **`Loading` is initial-only by default** — once content has rendered, revalidation keeps it visible. Use `isPending(() => x())` for "refreshing…" indicators. Use `<Loading on={key}>` to re-show fallback on key changes.
+- **Async lives in computations** — return a Promise/AsyncIterable from `createMemo`/`createStore(fn)`/`createProjection`. Pending reads participate in `<Loading>`.
+- **`Loading` covers unresolved branches** — once content has rendered, revalidation keeps it visible. Use `isPending(() => x())` for "refreshing…" indicators, or `isPending(() => x(), true)` when a render guard should follow the Loading path. Use `<Loading on={key}>` to re-show fallback on key changes.
 - **No `Suspense.Provider` or single error path** — async errors flow to `<Errored>` (or effect `error`); no inline `resource.error` branching.
 - **`createRoot` is owned by parent by default** — disposed when parent disposes. To detach: `runWithOwner(null, fn)`.
 - **Refs are functions** — `ref={el => ...}`. No `useRef`-style ref objects. Compose with arrays: `ref={[a, b]}`.

package/dist/dev.cjs

@@ -809,7 +809,7 @@ function Show(props) {
     if (c) {
       const child = props.children;
       const fn = typeof child === "function" && child.length > 0;
-      return fn ? signals.untrack(() => child(() => {
+      return fn ? keyed ? signals.untrack(() => child(c), "<Show>") : signals.untrack(() => child(() => {
         if (!signals.untrack(condition)) throw narrowedError("Show");
         return conditionValue();
       }), "<Show>") : child;
@@ -837,7 +837,12 @@ function Switch(props) {
         name: "condition",
         sync: true
       } );
-      func = () => prevFunc() || (condition() ? [index, conditionValue, mp] : undefined);
+      func = () => {
+        const prev = prevFunc();
+        if (prev) return prev;
+        const c = condition();
+        return c ? [index, c, conditionValue, mp] : undefined;
+      };
     }
     return func;
   }, {
@@ -846,10 +851,10 @@ function Switch(props) {
   return signals.createMemo(() => {
     const sel = switchFunc()();
     if (!sel) return props.fallback;
-    const [index, conditionValue, mp] = sel;
+    const [index, value, conditionValue, mp] = sel;
     const child = mp.children;
     const fn = typeof child === "function" && child.length > 0;
-    return fn ? signals.untrack(() => child(() => {
+    return fn ? mp.keyed ? signals.untrack(() => child(value), "<Match>") : signals.untrack(() => child(() => {
       if (signals.untrack(switchFunc)()?.[0] !== index) throw narrowedError("Match");
       return conditionValue();
     }), "<Match>") : child;
@@ -864,7 +869,7 @@ function Match(props) {
 function Errored(props) {
   return createErrorBoundary(() => props.children, (err, reset) => {
     const f = props.fallback;
-    if ((typeof f !== "function" || f.length == 0)) console.error(err);
+    if ((typeof f !== "function" || f.length == 0)) console.error(err());
     return typeof f === "function" && f.length ? f(err, reset) : f;
   });
 }

package/dist/dev.js

@@ -808,7 +808,7 @@ function Show(props) {
     if (c) {
       const child = props.children;
       const fn = typeof child === "function" && child.length > 0;
-      return fn ? untrack(() => child(() => {
+      return fn ? keyed ? untrack(() => child(c), "<Show>") : untrack(() => child(() => {
         if (!untrack(condition)) throw narrowedError("Show");
         return conditionValue();
       }), "<Show>") : child;
@@ -836,7 +836,12 @@ function Switch(props) {
         name: "condition",
         sync: true
       } );
-      func = () => prevFunc() || (condition() ? [index, conditionValue, mp] : undefined);
+      func = () => {
+        const prev = prevFunc();
+        if (prev) return prev;
+        const c = condition();
+        return c ? [index, c, conditionValue, mp] : undefined;
+      };
     }
     return func;
   }, {
@@ -845,10 +850,10 @@ function Switch(props) {
   return createMemo$1(() => {
     const sel = switchFunc()();
     if (!sel) return props.fallback;
-    const [index, conditionValue, mp] = sel;
+    const [index, value, conditionValue, mp] = sel;
     const child = mp.children;
     const fn = typeof child === "function" && child.length > 0;
-    return fn ? untrack(() => child(() => {
+    return fn ? mp.keyed ? untrack(() => child(value), "<Match>") : untrack(() => child(() => {
       if (untrack(switchFunc)()?.[0] !== index) throw narrowedError("Match");
       return conditionValue();
     }), "<Match>") : child;
@@ -863,7 +868,7 @@ function Match(props) {
 function Errored(props) {
   return createErrorBoundary(() => props.children, (err, reset) => {
     const f = props.fallback;
-    if ((typeof f !== "function" || f.length == 0)) console.error(err);
+    if ((typeof f !== "function" || f.length == 0)) console.error(err());
     return typeof f === "function" && f.length ? f(err, reset) : f;
   });
 }

package/dist/server.cjs

@@ -32,6 +32,9 @@ function nextChildIdFor(owner, consume) {
   }
   throw new Error("Cannot get child id from owner without an id");
 }
+function consumeClientComputedSlot(owner) {
+  if (owner?.id != null) nextChildIdFor(owner);
+}
 function getNextChildId(owner) {
   return nextChildIdFor(owner);
 }
@@ -116,6 +119,7 @@ function disposeOwner(owner, self = true) {
     if (self) {
       node._disposed = true;
       if (ownerPool.length < OWNER_POOL_MAX) {
+        node.id = undefined;
         node._parent = null;
         node._nextSibling = null;
         ownerPool.push(node);
@@ -142,6 +146,7 @@ function disposeOwner(owner, self = true) {
     node._disposal = null;
   }
   if (self && ownerPool.length < OWNER_POOL_MAX) {
+    node.id = undefined;
     node._parent = null;
     node._nextSibling = null;
     ownerPool.push(node);
@@ -744,8 +749,43 @@ function reconcile(value) {
 function deep(store) {
   return store;
 }
+function proxySource(read) {
+  return new Proxy({}, {
+    get(_, property, receiver) {
+      if (property === signals.$PROXY) return receiver;
+      const source = read() || {};
+      return source[property];
+    },
+    has(_, property) {
+      if (property === signals.$PROXY) return true;
+      return property in (read() || {});
+    },
+    ownKeys() {
+      return Object.keys(read() || {});
+    },
+    getOwnPropertyDescriptor(_, property) {
+      return {
+        configurable: true,
+        enumerable: true,
+        get() {
+          return (read() || {})[property];
+        }
+      };
+    }
+  });
+}
+function merge(...sources) {
+  for (let i = 0; i < sources.length; i++) {
+    if (typeof sources[i] === "function") {
+      sources[i] = proxySource(createMemo(sources[i]));
+    }
+  }
+  return signals.merge(...sources);
+}
 function mapArray(list, mapFn, options = {}) {
-  return createMemo(() => {
+  const indexes = mapFn.length > 1;
+  const parent = currentOwner;
+  const read = createMemo(() => {
     const items = list();
     const s = [];
     if (items && items.length) {
@@ -758,7 +798,7 @@ function mapArray(list, mapFn, options = {}) {
             parent.id = formatChildId(origId, origChildCount + i);
           }
           parent._childCount = 0;
-          s.push(mapFn(() => items[i], () => i));
+          s.push(options.keyed === false ? indexes ? mapFn(() => items[i], i) : mapFn(() => items[i]) : typeof options.keyed === "function" ? indexes ? mapFn(() => items[i], () => i) : mapFn(() => items[i]) : indexes ? mapFn(items[i], () => i) : mapFn(items[i]));
         }
       } finally {
         parent.id = origId;
@@ -772,9 +812,12 @@ function mapArray(list, mapFn, options = {}) {
   }, {
     sync: true
   });
+  consumeClientComputedSlot(parent);
+  return read;
 }
 function repeat(count, mapFn, options = {}) {
-  return createMemo(() => {
+  const parent = currentOwner;
+  const read = createMemo(() => {
     const len = count();
     const offset = options.from?.() || 0;
     if (!len) {
@@ -802,6 +845,8 @@ function repeat(count, mapFn, options = {}) {
   }, {
     sync: true
   });
+  consumeClientComputedSlot(parent);
+  return read;
 }
 const ErrorContext = {
   id: Symbol("ErrorContext"),
@@ -838,8 +883,8 @@ function createErrorBoundary(fn, fallback) {
   };
   const renderFallback = err => ctx ? runWithOwner(parent, () => {
     const fallbackOwner = createOwner();
-    return runWithOwner(fallbackOwner, () => fallback(err, () => {}));
-  }) : fallback(err, () => {});
+    return runWithOwner(fallbackOwner, () => fallback(() => err, () => {}));
+  }) : fallback(() => err, () => {});
   const serializeError = err => {
     if (ctx && owner.id && !runWithOwner(owner, () => getContext(NoHydrateContext))) {
       ctx.serialize(owner.id, err);
@@ -889,15 +934,13 @@ function flush() {}
 function resolve(fn) {
   throw new Error("resolve is not implemented on the server");
 }
-function isPending(fn, fallback) {
+function isPending(fn, loading) {
   try {
     fn();
     return false;
   } catch (err) {
-    if (err instanceof signals.NotReadyError && arguments.length > 1) {
-      return fallback;
-    }
-    throw err;
+    if (!(err instanceof signals.NotReadyError) || loading) throw err;
+    return false;
   }
 }
 function latest(fn) {
@@ -1185,7 +1228,7 @@ function Show(props) {
     if (when) {
       const child = props.children;
       if (typeof child === "function" && child.length > 0) {
-        return child(() => when);
+        return props.keyed ? child(when) : child(() => when);
       }
       return child;
     }
@@ -1205,7 +1248,7 @@ function Switch(props) {
       const w = conds[i].when;
       if (w) {
         const c = conds[i].children;
-        return typeof c === "function" && c.length > 0 ? c(() => w) : c;
+        return typeof c === "function" && c.length > 0 ? conds[i].keyed ? c(w) : c(() => w) : c;
       }
     }
     return props.fallback;
@@ -1436,10 +1479,6 @@ Object.defineProperty(exports, "isWrappable", {
   enumerable: true,
   get: function () { return signals.isWrappable; }
 });
-Object.defineProperty(exports, "merge", {
-  enumerable: true,
-  get: function () { return signals.merge; }
-});
 Object.defineProperty(exports, "omit", {
   enumerable: true,
   get: function () { return signals.omit; }
@@ -1498,6 +1537,7 @@ exports.isRefreshing = isRefreshing;
 exports.latest = latest;
 exports.lazy = lazy;
 exports.mapArray = mapArray;
+exports.merge = merge;
 exports.onCleanup = onCleanup;
 exports.onSettled = onSettled;
 exports.reconcile = reconcile;

package/dist/server.js

@@ -1,5 +1,5 @@
-import { NotReadyError, $REFRESH, isWrappable, NoOwnerError, ContextNotFoundError, flatten } from '@solidjs/signals';
-export { $PROXY, $REFRESH, $TRACK, NotReadyError, enableExternalSource, enforceLoadingBoundary, flatten, isEqual, isWrappable, merge, omit, snapshot, storePath } from '@solidjs/signals';
+import { NotReadyError, $REFRESH, merge as merge$1, isWrappable, NoOwnerError, ContextNotFoundError, $PROXY, flatten } from '@solidjs/signals';
+export { $PROXY, $REFRESH, $TRACK, NotReadyError, enableExternalSource, enforceLoadingBoundary, flatten, isEqual, isWrappable, omit, snapshot, storePath } from '@solidjs/signals';
 
 const NoHydrateContext = {
   id: Symbol("NoHydrateContext"),
@@ -31,6 +31,9 @@ function nextChildIdFor(owner, consume) {
   }
   throw new Error("Cannot get child id from owner without an id");
 }
+function consumeClientComputedSlot(owner) {
+  if (owner?.id != null) nextChildIdFor(owner);
+}
 function getNextChildId(owner) {
   return nextChildIdFor(owner);
 }
@@ -115,6 +118,7 @@ function disposeOwner(owner, self = true) {
     if (self) {
       node._disposed = true;
       if (ownerPool.length < OWNER_POOL_MAX) {
+        node.id = undefined;
         node._parent = null;
         node._nextSibling = null;
         ownerPool.push(node);
@@ -141,6 +145,7 @@ function disposeOwner(owner, self = true) {
     node._disposal = null;
   }
   if (self && ownerPool.length < OWNER_POOL_MAX) {
+    node.id = undefined;
     node._parent = null;
     node._nextSibling = null;
     ownerPool.push(node);
@@ -743,8 +748,43 @@ function reconcile(value) {
 function deep(store) {
   return store;
 }
+function proxySource(read) {
+  return new Proxy({}, {
+    get(_, property, receiver) {
+      if (property === $PROXY) return receiver;
+      const source = read() || {};
+      return source[property];
+    },
+    has(_, property) {
+      if (property === $PROXY) return true;
+      return property in (read() || {});
+    },
+    ownKeys() {
+      return Object.keys(read() || {});
+    },
+    getOwnPropertyDescriptor(_, property) {
+      return {
+        configurable: true,
+        enumerable: true,
+        get() {
+          return (read() || {})[property];
+        }
+      };
+    }
+  });
+}
+function merge(...sources) {
+  for (let i = 0; i < sources.length; i++) {
+    if (typeof sources[i] === "function") {
+      sources[i] = proxySource(createMemo(sources[i]));
+    }
+  }
+  return merge$1(...sources);
+}
 function mapArray(list, mapFn, options = {}) {
-  return createMemo(() => {
+  const indexes = mapFn.length > 1;
+  const parent = currentOwner;
+  const read = createMemo(() => {
     const items = list();
     const s = [];
     if (items && items.length) {
@@ -757,7 +797,7 @@ function mapArray(list, mapFn, options = {}) {
             parent.id = formatChildId(origId, origChildCount + i);
           }
           parent._childCount = 0;
-          s.push(mapFn(() => items[i], () => i));
+          s.push(options.keyed === false ? indexes ? mapFn(() => items[i], i) : mapFn(() => items[i]) : typeof options.keyed === "function" ? indexes ? mapFn(() => items[i], () => i) : mapFn(() => items[i]) : indexes ? mapFn(items[i], () => i) : mapFn(items[i]));
         }
       } finally {
         parent.id = origId;
@@ -771,9 +811,12 @@ function mapArray(list, mapFn, options = {}) {
   }, {
     sync: true
   });
+  consumeClientComputedSlot(parent);
+  return read;
 }
 function repeat(count, mapFn, options = {}) {
-  return createMemo(() => {
+  const parent = currentOwner;
+  const read = createMemo(() => {
     const len = count();
     const offset = options.from?.() || 0;
     if (!len) {
@@ -801,6 +844,8 @@ function repeat(count, mapFn, options = {}) {
   }, {
     sync: true
   });
+  consumeClientComputedSlot(parent);
+  return read;
 }
 const ErrorContext = {
   id: Symbol("ErrorContext"),
@@ -837,8 +882,8 @@ function createErrorBoundary(fn, fallback) {
   };
   const renderFallback = err => ctx ? runWithOwner(parent, () => {
     const fallbackOwner = createOwner();
-    return runWithOwner(fallbackOwner, () => fallback(err, () => {}));
-  }) : fallback(err, () => {});
+    return runWithOwner(fallbackOwner, () => fallback(() => err, () => {}));
+  }) : fallback(() => err, () => {});
   const serializeError = err => {
     if (ctx && owner.id && !runWithOwner(owner, () => getContext(NoHydrateContext))) {
       ctx.serialize(owner.id, err);
@@ -888,15 +933,13 @@ function flush() {}
 function resolve(fn) {
   throw new Error("resolve is not implemented on the server");
 }
-function isPending(fn, fallback) {
+function isPending(fn, loading) {
   try {
     fn();
     return false;
   } catch (err) {
-    if (err instanceof NotReadyError && arguments.length > 1) {
-      return fallback;
-    }
-    throw err;
+    if (!(err instanceof NotReadyError) || loading) throw err;
+    return false;
   }
 }
 function latest(fn) {
@@ -1184,7 +1227,7 @@ function Show(props) {
     if (when) {
       const child = props.children;
       if (typeof child === "function" && child.length > 0) {
-        return child(() => when);
+        return props.keyed ? child(when) : child(() => when);
       }
       return child;
     }
@@ -1204,7 +1247,7 @@ function Switch(props) {
       const w = conds[i].when;
       if (w) {
         const c = conds[i].children;
-        return typeof c === "function" && c.length > 0 ? c(() => w) : c;
+        return typeof c === "function" && c.length > 0 ? conds[i].keyed ? c(w) : c(() => w) : c;
       }
     }
     return props.fallback;
@@ -1399,4 +1442,4 @@ function Reveal(props) {
 
 const DEV = undefined;
 
-export { $DEVCOMP, DEV, Errored, For, Hydration, Loading, Match, NoHydrateContext, NoHydration, Repeat, Reveal, Show, Switch, action, children, createComponent, createContext, createDeepProxy, createEffect, createErrorBoundary, createLoadingBoundary, createMemo, createOptimistic, createOptimisticStore, createOwner, createProjection, createReaction, createRenderEffect, createRevealOrder, createRoot, createSignal, createStore, createTrackedEffect, createUniqueId, deep, enableHydration, flush, getNextChildId, getObserver, getOwner, isDisposed, isPending, isRefreshing, latest, lazy, mapArray, onCleanup, onSettled, reconcile, refresh, repeat, resolve, runWithOwner, sharedConfig, ssrHandleError, untrack, useContext };
+export { $DEVCOMP, DEV, Errored, For, Hydration, Loading, Match, NoHydrateContext, NoHydration, Repeat, Reveal, Show, Switch, action, children, createComponent, createContext, createDeepProxy, createEffect, createErrorBoundary, createLoadingBoundary, createMemo, createOptimistic, createOptimisticStore, createOwner, createProjection, createReaction, createRenderEffect, createRevealOrder, createRoot, createSignal, createStore, createTrackedEffect, createUniqueId, deep, enableHydration, flush, getNextChildId, getObserver, getOwner, isDisposed, isPending, isRefreshing, latest, lazy, mapArray, merge, onCleanup, onSettled, reconcile, refresh, repeat, resolve, runWithOwner, sharedConfig, ssrHandleError, untrack, useContext };

package/dist/solid.cjs

@@ -784,7 +784,7 @@ function Show(props) {
     if (c) {
       const child = props.children;
       const fn = typeof child === "function" && child.length > 0;
-      return fn ? signals.untrack(() => child(() => {
+      return fn ? keyed ? signals.untrack(() => child(c), IS_DEV) : signals.untrack(() => child(() => {
         if (!signals.untrack(condition)) throw narrowedError("Show");
         return conditionValue();
       }), IS_DEV) : child;
@@ -808,7 +808,12 @@ function Switch(props) {
         equals: (a, b) => !a === !b,
         sync: true
       });
-      func = () => prevFunc() || (condition() ? [index, conditionValue, mp] : undefined);
+      func = () => {
+        const prev = prevFunc();
+        if (prev) return prev;
+        const c = condition();
+        return c ? [index, c, conditionValue, mp] : undefined;
+      };
     }
     return func;
   }, {
@@ -817,10 +822,10 @@ function Switch(props) {
   return signals.createMemo(() => {
     const sel = switchFunc()();
     if (!sel) return props.fallback;
-    const [index, conditionValue, mp] = sel;
+    const [index, value, conditionValue, mp] = sel;
     const child = mp.children;
     const fn = typeof child === "function" && child.length > 0;
-    return fn ? signals.untrack(() => child(() => {
+    return fn ? mp.keyed ? signals.untrack(() => child(value), IS_DEV) : signals.untrack(() => child(() => {
       if (signals.untrack(switchFunc)()?.[0] !== index) throw narrowedError("Match");
       return conditionValue();
     }), IS_DEV) : child;

package/dist/solid.js

@@ -783,7 +783,7 @@ function Show(props) {
     if (c) {
       const child = props.children;
       const fn = typeof child === "function" && child.length > 0;
-      return fn ? untrack(() => child(() => {
+      return fn ? keyed ? untrack(() => child(c), IS_DEV) : untrack(() => child(() => {
         if (!untrack(condition)) throw narrowedError("Show");
         return conditionValue();
       }), IS_DEV) : child;
@@ -807,7 +807,12 @@ function Switch(props) {
         equals: (a, b) => !a === !b,
         sync: true
       });
-      func = () => prevFunc() || (condition() ? [index, conditionValue, mp] : undefined);
+      func = () => {
+        const prev = prevFunc();
+        if (prev) return prev;
+        const c = condition();
+        return c ? [index, c, conditionValue, mp] : undefined;
+      };
     }
     return func;
   }, {
@@ -816,10 +821,10 @@ function Switch(props) {
   return createMemo$1(() => {
     const sel = switchFunc()();
     if (!sel) return props.fallback;
-    const [index, conditionValue, mp] = sel;
+    const [index, value, conditionValue, mp] = sel;
     const child = mp.children;
     const fn = typeof child === "function" && child.length > 0;
-    return fn ? untrack(() => child(() => {
+    return fn ? mp.keyed ? untrack(() => child(value), IS_DEV) : untrack(() => child(() => {
       if (untrack(switchFunc)()?.[0] !== index) throw narrowedError("Match");
       return conditionValue();
     }), IS_DEV) : child;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "solid-js",
   "description": "Reactive JavaScript library for building user interfaces. Compiles JSX to real DOM with fine-grained signal-based updates — no virtual DOM.",
-  "version": "2.0.0-beta.11",
+  "version": "2.0.0-beta.13",
   "author": "Ryan Carniato",
   "license": "MIT",
   "homepage": "https://solidjs.com",
@@ -107,7 +107,7 @@
     "performance"
   ],
   "dependencies": {
-    "@solidjs/signals": "^2.0.0-beta.11",
+    "@solidjs/signals": "^2.0.0-beta.13",
     "csstype": "^3.1.0",
     "seroval": "~1.5.0",
     "seroval-plugins": "~1.5.0"