@rsc-kit/core 0.30.34 → 0.30.35

package/dist/js/SlotBoundary.d.ts

@@ -13,6 +13,13 @@ import type { ReactNode } from "react";
  * under the SegmentBoundary above it, which carries one; a slot of the root
  * layout sits under nothing, and without this its redirect would unmount
  * the document.
+ *
+ * A refresh is swapped in as a transition. Read through useSyncExternalStore it
+ * was applied at once - React never treats that store's update as one it can
+ * hold back - so content still arriving suspended to the nearest fallback, and
+ * a team picker and its breadcrumb blinked to their skeleton on every save.
+ * Held in this boundary's state instead, React keeps what is on screen until
+ * the new content is ready, and one that is ready shows at once.
  */
 export declare function SlotBoundary({ name, children }: {
     name: string;

package/dist/js/SlotBoundary.js

@@ -1,6 +1,6 @@
 "use client";
 import { jsx as _jsx } from "react/jsx-runtime";
-import { useContext, useSyncExternalStore } from "react";
+import { startTransition, useContext, useEffect, useState } from "react";
 import { getSlotState, subscribeToSlot } from "./slotStore";
 import { RedirectBoundary } from "./RedirectBoundary";
 import { SegmentDepthContext } from "./segmentDepth";
@@ -18,11 +18,26 @@ import { SegmentDepthContext } from "./segmentDepth";
  * under the SegmentBoundary above it, which carries one; a slot of the root
  * layout sits under nothing, and without this its redirect would unmount
  * the document.
+ *
+ * A refresh is swapped in as a transition. Read through useSyncExternalStore it
+ * was applied at once - React never treats that store's update as one it can
+ * hold back - so content still arriving suspended to the nearest fallback, and
+ * a team picker and its breadcrumb blinked to their skeleton on every save.
+ * Held in this boundary's state instead, React keeps what is on screen until
+ * the new content is ready, and one that is ready shows at once.
  */
 export function SlotBoundary({ name, children }) {
     // Which navigation replaces this region - see clearSlots.
     const depth = useContext(SegmentDepthContext);
-    const state = useSyncExternalStore((listener) => subscribeToSlot(name, listener, depth), () => getSlotState(name), () => getSlotState(name));
+    const [state, setState] = useState(() => getSlotState(name));
+    useEffect(() => {
+        const sync = () => startTransition(() => setState(getSlotState(name)));
+        const unsubscribe = subscribeToSlot(name, sync, depth);
+        // A write between the render and this subscription would otherwise wait
+        // for the next one.
+        sync();
+        return unsubscribe;
+    }, [name, depth]);
     return (_jsx(RedirectBoundary, { children: (state.tree === undefined ? children : state.tree) }));
 }
 //# sourceMappingURL=SlotBoundary.js.map

package/dist/js/SlotBoundary.js.map

@@ -1 +1 @@
-{"version":3,"file":"SlotBoundary.js","sourceRoot":"","sources":["../../src/js/SlotBoundary.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,EAAE,UAAU,EAAE,oBAAoB,EAAE,MAAM,OAAO,CAAC;AAEzD,OAAO,EAAE,YAAY,EAAE,eAAe,EAAE,MAAM,aAAa,CAAC;AAC5D,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AACtD,OAAO,EAAE,mBAAmB,EAAE,MAAM,gBAAgB,CAAC;AAErD;;;;;;;;;;;;;;GAcG;AACH,MAAM,UAAU,YAAY,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAyC;IACpF,0DAA0D;IAC1D,MAAM,KAAK,GAAG,UAAU,CAAC,mBAAmB,CAAC,CAAC;IAC9C,MAAM,KAAK,GAAG,oBAAoB,CAChC,CAAC,QAAQ,EAAE,EAAE,CAAC,eAAe,CAAC,IAAI,EAAE,QAAQ,EAAE,KAAK,CAAC,EACpD,GAAG,EAAE,CAAC,YAAY,CAAC,IAAI,CAAC,EACxB,GAAG,EAAE,CAAC,YAAY,CAAC,IAAI,CAAC,CACzB,CAAC;IAEF,OAAO,CACL,KAAC,gBAAgB,cACd,CAAC,KAAK,CAAC,IAAI,KAAK,SAAS,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,IAAI,CAAc,GAC/C,CACpB,CAAC;AACJ,CAAC","sourcesContent":["\"use client\";\n\nimport { useContext, useSyncExternalStore } from \"react\";\nimport type { ReactNode } from \"react\";\nimport { getSlotState, subscribeToSlot } from \"./slotStore\";\nimport { RedirectBoundary } from \"./RedirectBoundary\";\nimport { SegmentDepthContext } from \"./segmentDepth\";\n\n/**\n * The seam a re-rendered slot is swapped in at.\n *\n * Server components cannot be re-rendered in the browser, so the swap point\n * has to be a client component reading from a store. With nothing stored it\n * renders what the server sent with the page — which is the behaviour that\n * existed before slots could be revalidated, and is what makes this safe to\n * wrap every slot in.\n *\n * Inside a RedirectBoundary, because a slot is a page too and may decide a\n * redirect inside its own Suspense boundary. A slot of a nested layout sits\n * under the SegmentBoundary above it, which carries one; a slot of the root\n * layout sits under nothing, and without this its redirect would unmount\n * the document.\n */\nexport function SlotBoundary({ name, children }: { name: string; children: ReactNode }) {\n  // Which navigation replaces this region - see clearSlots.\n  const depth = useContext(SegmentDepthContext);\n  const state = useSyncExternalStore(\n    (listener) => subscribeToSlot(name, listener, depth),\n    () => getSlotState(name),\n    () => getSlotState(name),\n  );\n\n  return (\n    <RedirectBoundary>\n      {(state.tree === undefined ? children : state.tree) as ReactNode}\n    </RedirectBoundary>\n  );\n}\n"]}
+{"version":3,"file":"SlotBoundary.js","sourceRoot":"","sources":["../../src/js/SlotBoundary.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,EAAE,eAAe,EAAE,UAAU,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEzE,OAAO,EAAE,YAAY,EAAE,eAAe,EAAE,MAAM,aAAa,CAAC;AAC5D,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AACtD,OAAO,EAAE,mBAAmB,EAAE,MAAM,gBAAgB,CAAC;AAErD;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,MAAM,UAAU,YAAY,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAyC;IACpF,0DAA0D;IAC1D,MAAM,KAAK,GAAG,UAAU,CAAC,mBAAmB,CAAC,CAAC;IAC9C,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAC,GAAG,EAAE,CAAC,YAAY,CAAC,IAAI,CAAC,CAAC,CAAC;IAE7D,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,IAAI,GAAG,GAAG,EAAE,CAAC,eAAe,CAAC,GAAG,EAAE,CAAC,QAAQ,CAAC,YAAY,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;QACvE,MAAM,WAAW,GAAG,eAAe,CAAC,IAAI,EAAE,IAAI,EAAE,KAAK,CAAC,CAAC;QAEvD,wEAAwE;QACxE,oBAAoB;QACpB,IAAI,EAAE,CAAC;QAEP,OAAO,WAAW,CAAC;IACrB,CAAC,EAAE,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC,CAAC;IAElB,OAAO,CACL,KAAC,gBAAgB,cACd,CAAC,KAAK,CAAC,IAAI,KAAK,SAAS,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,IAAI,CAAc,GAC/C,CACpB,CAAC;AACJ,CAAC","sourcesContent":["\"use client\";\n\nimport { startTransition, useContext, useEffect, useState } from \"react\";\nimport type { ReactNode } from \"react\";\nimport { getSlotState, subscribeToSlot } from \"./slotStore\";\nimport { RedirectBoundary } from \"./RedirectBoundary\";\nimport { SegmentDepthContext } from \"./segmentDepth\";\n\n/**\n * The seam a re-rendered slot is swapped in at.\n *\n * Server components cannot be re-rendered in the browser, so the swap point\n * has to be a client component reading from a store. With nothing stored it\n * renders what the server sent with the page — which is the behaviour that\n * existed before slots could be revalidated, and is what makes this safe to\n * wrap every slot in.\n *\n * Inside a RedirectBoundary, because a slot is a page too and may decide a\n * redirect inside its own Suspense boundary. A slot of a nested layout sits\n * under the SegmentBoundary above it, which carries one; a slot of the root\n * layout sits under nothing, and without this its redirect would unmount\n * the document.\n *\n * A refresh is swapped in as a transition. Read through useSyncExternalStore it\n * was applied at once - React never treats that store's update as one it can\n * hold back - so content still arriving suspended to the nearest fallback, and\n * a team picker and its breadcrumb blinked to their skeleton on every save.\n * Held in this boundary's state instead, React keeps what is on screen until\n * the new content is ready, and one that is ready shows at once.\n */\nexport function SlotBoundary({ name, children }: { name: string; children: ReactNode }) {\n  // Which navigation replaces this region - see clearSlots.\n  const depth = useContext(SegmentDepthContext);\n  const [state, setState] = useState(() => getSlotState(name));\n\n  useEffect(() => {\n    const sync = () => startTransition(() => setState(getSlotState(name)));\n    const unsubscribe = subscribeToSlot(name, sync, depth);\n\n    // A write between the render and this subscription would otherwise wait\n    // for the next one.\n    sync();\n\n    return unsubscribe;\n  }, [name, depth]);\n\n  return (\n    <RedirectBoundary>\n      {(state.tree === undefined ? children : state.tree) as ReactNode}\n    </RedirectBoundary>\n  );\n}\n"]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rsc-kit/core",
-  "version": "0.30.34",
+  "version": "0.30.35",
   "description": "React Server Components as a Vite plugin. Routing, streaming, server actions, typed urls and build-time prerendering — deploy to Bun, Node, Workers, Vercel or Deno.",
   "license": "MIT",
   "type": "module",