npm - @tanstack/react-router - Versions diffs - 1.34.2 → 1.34.3 - Mend

@tanstack/react-router 1.34.2 → 1.34.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (21) hide show

package/dist/cjs/awaited.cjs CHANGED Viewed

@@ -96,8 +96,7 @@ function AwaitInner(props) {
   if (window.__TSR__ROUTER__) {
     let deferred = window.__TSR__ROUTER__.getDeferred('${state.uid}');
     if (deferred) deferred.resolve(window.__TSR__DEFERRED__${state.uid});
-  }
-  document.querySelectorAll('.tsr-script-once').forEach((el) => el.parentElement.removeChild(el));`
+  }`
       }
     ) : null,
     props.children(data)
@@ -114,11 +113,15 @@ function ScriptOnce({
       ...rest,
       className: `tsr-script-once ${className || ""}`,
       dangerouslySetInnerHTML: {
-        __html: children
+        __html: [
+          children,
+          `document.querySelectorAll('.tsr-script-once').forEach((el) => el.parentElement.removeChild(el));`
+        ].join("\n")
       }
     }
   );
 }
 exports.Await = Await;
+exports.ScriptOnce = ScriptOnce;
 exports.useAwaited = useAwaited;
 //# sourceMappingURL=awaited.cjs.map

package/dist/cjs/awaited.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"awaited.cjs","sources":["../../src/awaited.tsx"],"sourcesContent":["import * as React from 'react'\nimport warning from 'tiny-warning'\nimport { useRouter } from './useRouter'\nimport { defaultSerializeError } from './router'\nimport { isDehydratedDeferred } from './defer'\nimport { defaultDeserializeError, isServerSideError } from './Matches'\nimport type { DeferredPromise } from './defer'\n\nexport type AwaitOptions<T> = {\n promise: DeferredPromise<T>\n}\n\nexport function useAwaited<T>({\n promise,\n}: AwaitOptions<T>): [T, DeferredPromise<T>] {\n const router = useRouter()\n // const rerender = React.useReducer((x) => x + 1, 0)[1]\n\n const state = promise.__deferredState\n\n // Dehydrated promises only\n // Successful or errored deferred promises mean they\n // were resolved on the server and no further action is needed\n if (isDehydratedDeferred(promise) && state.status === 'pending') {\n const streamedData = (window as any)[`__TSR__DEFERRED__${state.uid}`]\n\n if (streamedData) {\n Object.assign(state, router.options.transformer.parse(streamedData))\n } else {\n let token = router.registeredDeferredsIds.get(state.uid)\n\n // If we haven't yet, create a promise and resolver that our streamed HTML can use\n // when the client-side data is streamed in and ready.\n if (!token) {\n token = {}\n router.registeredDeferredsIds.set(state.uid, token)\n router.registeredDeferreds.set(token, state)\n\n Object.assign(state, {\n resolve: () => {\n state.__resolvePromise?.()\n // rerender()\n },\n promise: new Promise((r) => {\n state.__resolvePromise = r as any\n }),\n __resolvePromise: () => {},\n })\n }\n }\n }\n\n // If the promise is pending, always throw the state.promise\n // For originating promises, this will be the original promise\n // For dehydrated promises, this will be the placeholder promise\n // that will be resolved when the server sends the real data\n if (state.status === 'pending') {\n throw isDehydratedDeferred(promise) ? state.promise : promise\n }\n\n if (state.status === 'error') {\n if (typeof document !== 'undefined') {\n if (isServerSideError(state.error)) {\n throw (\n router.options.errorSerializer?.deserialize ?? defaultDeserializeError\n )(state.error.data as any)\n } else {\n warning(\n false,\n \"Encountered a server-side error that doesn't fit the expected shape\",\n )\n throw state.error\n }\n } else {\n throw {\n data: (\n router.options.errorSerializer?.serialize ?? defaultSerializeError\n )(state.error),\n __isServerError: true,\n }\n }\n }\n\n return [promise.__deferredState.data as any, promise]\n}\n\nexport function Await<T>(\n props: AwaitOptions<T> & {\n fallback?: React.ReactNode\n children: (result: T) => React.ReactNode\n },\n) {\n const inner = <AwaitInner {...props} />\n if (props.fallback) {\n return <React.Suspense fallback={props.fallback}>{inner}</React.Suspense>\n }\n return inner\n}\n\nfunction AwaitInner<T>(\n props: AwaitOptions<T> & {\n fallback?: React.ReactNode\n children: (result: T) => React.ReactNode\n },\n) {\n const router = useRouter()\n const [data, promise] = useAwaited(props)\n const state = promise.__deferredState\n // If we are the originator of the promise,\n // inject the state into the HTML stream\n return (\n <>\n {!isDehydratedDeferred(promise) ? (\n <ScriptOnce\n children={`window.__TSR__DEFERRED__${state.uid} = ${JSON.stringify(router.options.transformer.stringify(state))}\n if (window.__TSR__ROUTER__) {\n let deferred = window.__TSR__ROUTER__.getDeferred('${state.uid}');\n if (deferred) deferred.resolve(window.__TSR__DEFERRED__${state.uid});\n }~~\n document.querySelectorAll('.tsr-script-once').forEach((el) => el.parentElement.removeChild(el));`~~}\n />\n ) : null}\n {props.children(data)}\n </>\n )\n}\n\~~nfunction~~ ScriptOnce({\n className,\n children,\n ...rest\n}: { children: string } & React.HTMLProps<HTMLScriptElement>) {\n return (\n <script\n {...rest}\n className={`tsr-script-once ${className \|\| ''}`}\n dangerouslySetInnerHTML={{\n __html: children,\n }}\n />\n )\n}\n"],"names":["router","useRouter","isDehydratedDeferred","_a","isServerSideError","defaultDeserializeError","defaultSerializeError","jsx","React","jsxs","Fragment"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAYO,SAAS,WAAc;AAAA,EAC5B;AACF,GAA6C;;AAC3C,QAAMA,WAASC,UAAAA;AAGf,QAAM,QAAQ,QAAQ;AAKtB,MAAIC,MAAqB,qBAAA,OAAO,KAAK,MAAM,WAAW,WAAW;AAC/D,UAAM,eAAgB,OAAe,oBAAoB,MAAM,GAAG,EAAE;AAEpE,QAAI,cAAc;AAChB,aAAO,OAAO,OAAOF,SAAO,QAAQ,YAAY,MAAM,YAAY,CAAC;AAAA,IAAA,OAC9D;AACL,UAAI,QAAQA,SAAO,uBAAuB,IAAI,MAAM,GAAG;AAIvD,UAAI,CAAC,OAAO;AACV,gBAAQ,CAAA;AACRA,iBAAO,uBAAuB,IAAI,MAAM,KAAK,KAAK;AAC3CA,iBAAA,oBAAoB,IAAI,OAAO,KAAK;AAE3C,eAAO,OAAO,OAAO;AAAA,UACnB,SAAS,MAAM;;AACb,aAAAG,MAAA,MAAM,qBAAN,gBAAAA,IAAA;AAAA,UAEF;AAAA,UACA,SAAS,IAAI,QAAQ,CAAC,MAAM;AAC1B,kBAAM,mBAAmB;AAAA,UAAA,CAC1B;AAAA,UACD,kBAAkB,MAAM;AAAA,UAAC;AAAA,QAAA,CAC1B;AAAA,MACH;AAAA,IACF;AAAA,EACF;AAMI,MAAA,MAAM,WAAW,WAAW;AAC9B,UAAMD,MAAqB,qBAAA,OAAO,IAAI,MAAM,UAAU;AAAA,EACxD;AAEI,MAAA,MAAM,WAAW,SAAS;AACxB,QAAA,OAAO,aAAa,aAAa;AAC/B,UAAAE,QAAA,kBAAkB,MAAM,KAAK,GAAG;AAClC,iBACEJ,cAAO,QAAQ,oBAAfA,mBAAgC,gBAAeK,QAAAA,yBAC/C,MAAM,MAAM,IAAW;AAAA,MAAA,OACpB;AACL;AAAA,UACE;AAAA,UACA;AAAA,QAAA;AAEF,cAAM,MAAM;AAAA,MACd;AAAA,IAAA,OACK;AACC,YAAA;AAAA,QACJ,SACEL,cAAO,QAAQ,oBAAfA,mBAAgC,cAAaM,OAAA,uBAC7C,MAAM,KAAK;AAAA,QACb,iBAAiB;AAAA,MAAA;AAAA,IAErB;AAAA,EACF;AAEA,SAAO,CAAC,QAAQ,gBAAgB,MAAa,OAAO;AACtD;AAEO,SAAS,MACd,OAIA;AACA,QAAM,QAAQC,2BAAAA,IAAC,YAAY,EAAA,GAAG,MAAO,CAAA;AACrC,MAAI,MAAM,UAAU;AAClB,0CAAQC,iBAAM,UAAN,EAAe,UAAU,MAAM,UAAW,UAAM,MAAA,CAAA;AAAA,EAC1D;AACO,SAAA;AACT;AAEA,SAAS,WACP,OAIA;AACA,QAAMR,UAASC,UAAAA;AACf,QAAM,CAAC,MAAM,OAAO,IAAI,WAAW,KAAK;AACxC,QAAM,QAAQ,QAAQ;AAGtB,SAEKQ,2BAAA,KAAAC,qBAAA,EAAA,UAAA;AAAA,IAAC,CAAAR,MAAA,qBAAqB,OAAO,IAC5BK,2BAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,UAAU,2BAA2B,MAAM,GAAG,MAAM,KAAK,UAAUP,QAAO,QAAQ,YAAY,UAAU,KAAK,CAAC,CAAC;AAAA;AAAA,yDAEhE,MAAM,GAAG;AAAA,6DACL,MAAM,GAAG;AAAA;AAAA~~;AAAA~~,MAAA;AAAA,IAAA,~~IAI5D~~;AAAA,IACH,MAAM,SAAS,IAAI;AAAA,EACtB,EAAA,CAAA;AAEJ;~~AAEA~~,SAAS,WAAW;AAAA,~~EAClB~~;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAA8D;AAE1D,SAAAO,2BAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACE,GAAG;AAAA,MACJ,WAAW,mBAAmB,aAAa,EAAE;AAAA,MAC7C,yBAAyB;AAAA,QACvB,QAAQ;AAAA,~~MACV~~;AAAA,IAAA;AAAA,EAAA;AAGN~~;;;~~"}
1	+ {"version":3,"file":"awaited.cjs","sources":["../../src/awaited.tsx"],"sourcesContent":["import * as React from 'react'\nimport warning from 'tiny-warning'\nimport { useRouter } from './useRouter'\nimport { defaultSerializeError } from './router'\nimport { isDehydratedDeferred } from './defer'\nimport { defaultDeserializeError, isServerSideError } from './Matches'\nimport type { DeferredPromise } from './defer'\n\nexport type AwaitOptions<T> = {\n promise: DeferredPromise<T>\n}\n\nexport function useAwaited<T>({\n promise,\n}: AwaitOptions<T>): [T, DeferredPromise<T>] {\n const router = useRouter()\n // const rerender = React.useReducer((x) => x + 1, 0)[1]\n\n const state = promise.__deferredState\n\n // Dehydrated promises only\n // Successful or errored deferred promises mean they\n // were resolved on the server and no further action is needed\n if (isDehydratedDeferred(promise) && state.status === 'pending') {\n const streamedData = (window as any)[`__TSR__DEFERRED__${state.uid}`]\n\n if (streamedData) {\n Object.assign(state, router.options.transformer.parse(streamedData))\n } else {\n let token = router.registeredDeferredsIds.get(state.uid)\n\n // If we haven't yet, create a promise and resolver that our streamed HTML can use\n // when the client-side data is streamed in and ready.\n if (!token) {\n token = {}\n router.registeredDeferredsIds.set(state.uid, token)\n router.registeredDeferreds.set(token, state)\n\n Object.assign(state, {\n resolve: () => {\n state.__resolvePromise?.()\n // rerender()\n },\n promise: new Promise((r) => {\n state.__resolvePromise = r as any\n }),\n __resolvePromise: () => {},\n })\n }\n }\n }\n\n // If the promise is pending, always throw the state.promise\n // For originating promises, this will be the original promise\n // For dehydrated promises, this will be the placeholder promise\n // that will be resolved when the server sends the real data\n if (state.status === 'pending') {\n throw isDehydratedDeferred(promise) ? state.promise : promise\n }\n\n if (state.status === 'error') {\n if (typeof document !== 'undefined') {\n if (isServerSideError(state.error)) {\n throw (\n router.options.errorSerializer?.deserialize ?? defaultDeserializeError\n )(state.error.data as any)\n } else {\n warning(\n false,\n \"Encountered a server-side error that doesn't fit the expected shape\",\n )\n throw state.error\n }\n } else {\n throw {\n data: (\n router.options.errorSerializer?.serialize ?? defaultSerializeError\n )(state.error),\n __isServerError: true,\n }\n }\n }\n\n return [promise.__deferredState.data as any, promise]\n}\n\nexport function Await<T>(\n props: AwaitOptions<T> & {\n fallback?: React.ReactNode\n children: (result: T) => React.ReactNode\n },\n) {\n const inner = <AwaitInner {...props} />\n if (props.fallback) {\n return <React.Suspense fallback={props.fallback}>{inner}</React.Suspense>\n }\n return inner\n}\n\nfunction AwaitInner<T>(\n props: AwaitOptions<T> & {\n fallback?: React.ReactNode\n children: (result: T) => React.ReactNode\n },\n) {\n const router = useRouter()\n const [data, promise] = useAwaited(props)\n const state = promise.__deferredState\n // If we are the originator of the promise,\n // inject the state into the HTML stream\n return (\n <>\n {!isDehydratedDeferred(promise) ? (\n <ScriptOnce\n children={`window.__TSR__DEFERRED__${state.uid} = ${JSON.stringify(router.options.transformer.stringify(state))}\n if (window.__TSR__ROUTER__) {\n let deferred = window.__TSR__ROUTER__.getDeferred('${state.uid}');\n if (deferred) deferred.resolve(window.__TSR__DEFERRED__${state.uid});\n }`}\n />\n ) : null}\n {props.children(data)}\n </>\n )\n}\n\nexport function ScriptOnce({\n className,\n children,\n ...rest\n}: { children: string } & React.HTMLProps<HTMLScriptElement>) {\n return (\n <script\n {...rest}\n className={`tsr-script-once ${className \|\| ''}`}\n dangerouslySetInnerHTML={{\n __html: [\n children,\n `document.querySelectorAll('.tsr-script-once').forEach((el) => el.parentElement.removeChild(el));`,\n ].join('\\n'),\n }}\n />\n )\n}\n"],"names":["router","useRouter","isDehydratedDeferred","_a","isServerSideError","defaultDeserializeError","defaultSerializeError","jsx","React","jsxs","Fragment"],"mappings":"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"}

package/dist/cjs/awaited.d.cts CHANGED Viewed

@@ -8,3 +8,6 @@ export declare function Await<T>(props: AwaitOptions<T> & {
     fallback?: React.ReactNode;
     children: (result: T) => React.ReactNode;
 }): React.JSX.Element;
+export declare function ScriptOnce({ className, children, ...rest }: {
+    children: string;
+} & React.HTMLProps<HTMLScriptElement>): React.JSX.Element;

package/dist/cjs/index.cjs CHANGED Viewed

@@ -52,6 +52,7 @@ Object.defineProperty(exports, "createMemoryHistory", {
 exports.invariant = invariant;
 exports.warning = warning;
 exports.Await = awaited.Await;
+exports.ScriptOnce = awaited.ScriptOnce;
 exports.useAwaited = awaited.useAwaited;
 exports.defer = defer.defer;
 exports.isDehydratedDeferred = defer.isDehydratedDeferred;

package/dist/cjs/index.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":"~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;~~"}
1	+ {"version":3,"file":"index.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/cjs/index.d.cts CHANGED Viewed

@@ -1,7 +1,7 @@
 export { createHistory, createBrowserHistory, createHashHistory, createMemoryHistory, type BlockerFn, type HistoryLocation, type RouterHistory, type ParsedPath, type HistoryState, } from '@tanstack/history';
 export { default as invariant } from 'tiny-invariant';
 export { default as warning } from 'tiny-warning';
-export { useAwaited, Await, type AwaitOptions } from './awaited.cjs';
+export { useAwaited, Await, type AwaitOptions, ScriptOnce } from './awaited.cjs';
 export { defer, isDehydratedDeferred, type DeferredPromiseState, type DeferredPromise, } from './defer.cjs';
 export { CatchBoundary, ErrorComponent } from './CatchBoundary.cjs';
 export { FileRoute, createFileRoute, FileRouteLoader, LazyRoute, createLazyRoute, createLazyFileRoute, type FileRoutesByPath, type LazyRouteOptions, } from './fileRoute.cjs';

package/dist/cjs/router.cjs CHANGED Viewed

@@ -1146,8 +1146,6 @@ class Router {
       }
       return match;
     };
-    this.injectHtml = async (html) => {
-    };
     this.registeredDeferredsIds = /* @__PURE__ */ new Map();
     this.registeredDeferreds = /* @__PURE__ */ new WeakMap();
     this.getDeferred = (uid) => {