react-streaming - npm Package Compare versions

Comparing version 0.3.22 to 0.3.23

dist/cjs/server/renderToStream.d.ts

@@ -6,3 +6,3 @@ export { renderToStream };
 import React from 'react';
-import type { renderToPipeableStream as RenderToPipeableStream, renderToReadableStream as RenderToReadableStream } from 'react-dom/server';
+import type { renderToPipeableStream as RenderToPipeableStream, RenderToPipeableStreamOptions, renderToReadableStream as RenderToReadableStream, RenderToReadableStreamOptions } from 'react-dom/server';
 import type { Pipe } from './renderToStream/createPipeWrapper';
@@ -12,2 +12,3 @@ import { SeoStrategy } from './renderToStream/resolveSeoStrategy';
 import type { renderToWebStream as renderToWebStream_ } from './renderToStream/renderToWebStream';
+export declare type StreamOptions = Omit<RenderToPipeableStreamOptions, 'onShellReady' | 'onShellError' | 'onError' | 'onAllReady'> | Omit<RenderToReadableStreamOptions, 'onError'>;
 declare type Options = {
@@ -19,2 +20,3 @@ webStream?: boolean;
     onBoundaryError?: (err: unknown) => void;
+    streamOptions?: StreamOptions;
     renderToReadableStream?: typeof RenderToReadableStream;
@@ -26,4 +28,6 @@ renderToPipeableStream?: typeof RenderToPipeableStream;
     readable: null;
+    abort: () => void;
 } | {
     pipe: null;
+    abort: null;
     readable: ReadableStream;
@@ -30,0 +34,0 @@ }) & {

dist/cjs/server/renderToStream.js

@@ -53,3 +53,3 @@ "use strict";
     // Let's see if a user complains
-    (0, utils_1.assert)(!options.renderToPipeableStream && !options.renderToReadableStream, 'using deprecated options');
+    (0, utils_1.assertUsage)(!options.renderToPipeableStream && !options.renderToReadableStream, 'using deprecated options');
     element = react_1.default.createElement(useSuspenseData_1.SuspenseData, null, element);
@@ -56,0 +56,0 @@ let injectToStream = (chunk) => buffer.push(chunk);

dist/cjs/server/renderToStream/renderToNodeStream.d.ts

 export { renderToNodeStream };
 import React from 'react';
 import type { renderToPipeableStream as renderToPipeableStream__ } from 'react-dom/server';
+import type { StreamOptions } from '../renderToStream';
 declare function renderToNodeStream(element: React.ReactNode, disable: boolean, options: {
     debug?: boolean;
     onBoundaryError?: (err: unknown) => void;
+    streamOptions?: StreamOptions;
     renderToPipeableStream?: typeof renderToPipeableStream__;
 }): Promise<{
     pipe: import("./createPipeWrapper").Pipe;
+    abort: (this: void) => void;
     readable: null;
@@ -11,0 +14,0 @@ streamEnd: Promise<boolean>;

dist/cjs/server/renderToStream/renderToNodeStream.js

@@ -39,4 +39,3 @@ "use strict";
     }
-    const { pipe: pipeOriginal } = renderToPipeableStream(element, {
-        onShellReady() {
+    const { pipe: pipeOriginal, abort } = renderToPipeableStream(element, Object.assign(Object.assign({}, options.streamOptions), { onShellReady() {
             (0, misc_1.debugFlow)('[react] onShellReady()');
@@ -49,6 +48,3 @@ onShellReady();
             onAllReady();
-        },
-        onShellError: onError,
-        onError
-    });
+        }, onShellError: onError, onError }));
     let promiseResolved = false;
@@ -77,2 +73,3 @@ const { pipeForUser, injectToStream, streamEnd } = await (0, createPipeWrapper_1.createPipeWrapper)(pipeOriginal, {
         pipe: pipeForUser,
+        abort,
         readable: null,
@@ -79,0 +76,0 @@ streamEnd: (0, misc_1.wrapStreamEnd)(streamEnd, didError),

dist/cjs/server/renderToStream/renderToWebStream.d.ts

 export { renderToWebStream };
 import React from 'react';
 import type { renderToReadableStream as renderToReadableStream__ } from 'react-dom/server';
+import type { StreamOptions } from '../renderToStream';
 declare function renderToWebStream(element: React.ReactNode, disable: boolean, options: {
     debug?: boolean;
     onBoundaryError?: (err: unknown) => void;
+    streamOptions?: StreamOptions;
     renderToReadableStream?: typeof renderToReadableStream__;
@@ -11,4 +13,5 @@ }): Promise<{
     pipe: null;
+    abort: null;
     streamEnd: Promise<boolean>;
     injectToStream: import("./createBuffer").InjectToStream;
 }>;

dist/cjs/server/renderToStream/renderToWebStream.js

@@ -29,3 +29,3 @@ "use strict";
     }
-    const readableOriginal = await renderToReadableStream(element, { onError });
+    const readableOriginal = await renderToReadableStream(element, Object.assign({ onError }, options.streamOptions));
     const { allReady } = readableOriginal;
@@ -56,2 +56,3 @@ let promiseResolved = false;
         pipe: null,
+        abort: null,
         streamEnd: (0, misc_1.wrapStreamEnd)(streamEnd, didError),
@@ -58,0 +59,0 @@ injectToStream

dist/cjs/utils/projectInfo.js

@@ -5,3 +5,3 @@ "use strict";
 const getGlobalObject_1 = require("./getGlobalObject");
-const PROJECT_VERSION = '0.3.22';
+const PROJECT_VERSION = '0.3.23';
 const projectInfo = {
@@ -8,0 +8,0 @@ projectName: 'react-streaming',

dist/esm/server/renderToStream.d.ts

@@ -6,3 +6,3 @@ export { renderToStream };
 import React from 'react';
-import type { renderToPipeableStream as RenderToPipeableStream, renderToReadableStream as RenderToReadableStream } from 'react-dom/server';
+import type { renderToPipeableStream as RenderToPipeableStream, RenderToPipeableStreamOptions, renderToReadableStream as RenderToReadableStream, RenderToReadableStreamOptions } from 'react-dom/server';
 import type { Pipe } from './renderToStream/createPipeWrapper';
@@ -12,2 +12,3 @@ import { SeoStrategy } from './renderToStream/resolveSeoStrategy';
 import type { renderToWebStream as renderToWebStream_ } from './renderToStream/renderToWebStream';
+export declare type StreamOptions = Omit<RenderToPipeableStreamOptions, 'onShellReady' | 'onShellError' | 'onError' | 'onAllReady'> | Omit<RenderToReadableStreamOptions, 'onError'>;
 declare type Options = {
@@ -19,2 +20,3 @@ webStream?: boolean;
     onBoundaryError?: (err: unknown) => void;
+    streamOptions?: StreamOptions;
     renderToReadableStream?: typeof RenderToReadableStream;
@@ -26,4 +28,6 @@ renderToPipeableStream?: typeof RenderToPipeableStream;
     readable: null;
+    abort: () => void;
 } | {
     pipe: null;
+    abort: null;
     readable: ReadableStream;
@@ -30,0 +34,0 @@ }) & {

dist/esm/server/renderToStream.js

@@ -27,3 +27,3 @@ export { renderToStream };
     // Let's see if a user complains
-    assert(!options.renderToPipeableStream && !options.renderToReadableStream, 'using deprecated options');
+    assertUsage(!options.renderToPipeableStream && !options.renderToReadableStream, 'using deprecated options');
     element = React.createElement(SuspenseData, null, element);
@@ -30,0 +30,0 @@ let injectToStream = (chunk) => buffer.push(chunk);

dist/esm/server/renderToStream/renderToNodeStream.d.ts

 export { renderToNodeStream };
 import React from 'react';
 import type { renderToPipeableStream as renderToPipeableStream__ } from 'react-dom/server';
+import type { StreamOptions } from '../renderToStream';
 declare function renderToNodeStream(element: React.ReactNode, disable: boolean, options: {
     debug?: boolean;
     onBoundaryError?: (err: unknown) => void;
+    streamOptions?: StreamOptions;
     renderToPipeableStream?: typeof renderToPipeableStream__;
 }): Promise<{
     pipe: import("./createPipeWrapper").Pipe;
+    abort: (this: void) => void;
     readable: null;
@@ -11,0 +14,0 @@ streamEnd: Promise<boolean>;

dist/esm/server/renderToStream/renderToNodeStream.js

@@ -37,3 +37,4 @@ export { renderToNodeStream };
     }
-    const { pipe: pipeOriginal } = renderToPipeableStream(element, {
+    const { pipe: pipeOriginal, abort } = renderToPipeableStream(element, {
+        ...options.streamOptions,
         onShellReady() {
@@ -74,2 +75,3 @@ debugFlow('[react] onShellReady()');
         pipe: pipeForUser,
+        abort,
         readable: null,
@@ -76,0 +78,0 @@ streamEnd: wrapStreamEnd(streamEnd, didError),

dist/esm/server/renderToStream/renderToWebStream.d.ts

 export { renderToWebStream };
 import React from 'react';
 import type { renderToReadableStream as renderToReadableStream__ } from 'react-dom/server';
+import type { StreamOptions } from '../renderToStream';
 declare function renderToWebStream(element: React.ReactNode, disable: boolean, options: {
     debug?: boolean;
     onBoundaryError?: (err: unknown) => void;
+    streamOptions?: StreamOptions;
     renderToReadableStream?: typeof renderToReadableStream__;
@@ -11,4 +13,5 @@ }): Promise<{
     pipe: null;
+    abort: null;
     streamEnd: Promise<boolean>;
     injectToStream: import("./createBuffer").InjectToStream;
 }>;

dist/esm/server/renderToStream/renderToWebStream.js

@@ -27,3 +27,3 @@ export { renderToWebStream };
     }
-    const readableOriginal = await renderToReadableStream(element, { onError });
+    const readableOriginal = await renderToReadableStream(element, { onError, ...options.streamOptions });
     const { allReady } = readableOriginal;
@@ -54,2 +54,3 @@ let promiseResolved = false;
         pipe: null,
+        abort: null,
         streamEnd: wrapStreamEnd(streamEnd, didError),
@@ -56,0 +57,0 @@ injectToStream

dist/esm/utils/projectInfo.js

 export { projectInfo };
 import { getGlobalObject } from './getGlobalObject';
-const PROJECT_VERSION = '0.3.22';
+const PROJECT_VERSION = '0.3.23';
 const projectInfo = {
@@ -5,0 +5,0 @@ projectName: 'react-streaming',

package.json

 {
   "name": "react-streaming",
   "description": "React 18 Streaming. Full-fledged & Easy.",
-  "version": "0.3.22",
+  "version": "0.3.23",
   "peerDependencies": {
@@ -6,0 +6,0 @@ "react": ">=18",

README.md

@@ -127,3 +127,4 @@ <p align="center">
 - `options.userAgent?: string`: The HTTP User-Agent request header. (Needed for `options.seoStrategy`.)
-- `options.webStream?: boolean`: Use Web Streams instead of Node.js Streams in Node.js. ([Node.js 18 released Web Streams support](https://nodejs.org/en/blog/announcements/v18-release-announce/#web-streams-api-experimental).)
+- `options.webStream?: boolean`: In Node.js, use a Web Stream instead of a Node.js Stream. ([Node.js 18 released Web Streams support](https://nodejs.org/en/blog/announcements/v18-release-announce/#web-streams-api-experimental).)
+- `options.streamOptions`: Options passed to React's [renderToReadableStream()](https://react.dev/reference/react-dom/server/renderToReadableStream#parameters) and [`renderToPipeableStream()`](https://react.dev/reference/react-dom/server/renderToPipeableStream#parameters). Use this to pass `nonce`, bootstrap scripts, etc. It excludes error handling options, use [Error Handling](#error-handling) instead.
 - `options.onBoundaryError?: (err: unknown) => void`: Called when a `<Suspense>` boundary fails. See [Error Handling](#error-handling).
@@ -145,3 +146,2 @@ -  ```tsx
 
-
 ### Error Handling
@@ -168,6 +168,16 @@
 >
-> This means that errros occuring during the stream are handled by React and there is nothing for you to do on the server-side. That said, you may want to gracefully handle the error on the client-side e.g. with [`react-error-boundary`](https://www.npmjs.com/package/react-error-boundary).
+> This means that errors occuring during the stream are handled by React and there is nothing for you to do on the server-side. That said, you may want to gracefully handle the error on the client-side e.g. with [`react-error-boundary`](https://www.npmjs.com/package/react-error-boundary).
 >
 > You can use `options.onBoundaryError()` for error tracking purposes.
 
+#### Aborting server rendering
+
+You may want to set a timeout for React rendering as mentioned [here](https://react.dev/reference/react-dom/server/renderToPipeableStream#aborting-server-rendering) and [here](https://react.dev/reference/react-dom/server/renderToReadableStream#aborting-server-rendering).
+
+When `react-streaming` uses a:
+ - Node.js Stream then you can use the `abort()` function (`const { abort } = await renderToStream(<Page />)`.
+ - Web Stream then you can use the `streamOptions.signal` parameter (`await renderToStream(<Page />, { streamOptions })`).
+
+The `abort()` function and the `signal` parameter work as per the linked React docs.
+
 ### `useAsync()`
@@ -174,0 +184,0 @@

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

132444

increased by1.84%

Lines of code

2862

increased by0.74%

Number of lines in readme file

311

increased by3.32%

No dependency changes