@tanstack/react-router 0.0.1-beta.9 → 1.0.0

package/build/cjs/react/CatchBoundary.js

@@ -0,0 +1,123 @@
+/**
+ * @tanstack/react-router/src/index.tsx
+ *
+ * Copyright (c) TanStack
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE.md file in the root directory of this source tree.
+ *
+ * @license MIT
+ */
+'use strict';
+
+var React = require('react');
+
+function _interopNamespaceDefault(e) {
+  var n = Object.create(null);
+  if (e) {
+    Object.keys(e).forEach(function (k) {
+      if (k !== 'default') {
+        var d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: function () { return e[k]; }
+        });
+      }
+    });
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+
+var React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
+
+function CatchBoundary(props) {
+  const errorComponent = props.errorComponent ?? ErrorComponent;
+  return /*#__PURE__*/React__namespace.createElement(CatchBoundaryImpl, {
+    resetKey: props.resetKey,
+    onCatch: props.onCatch,
+    children: ({
+      error
+    }) => {
+      if (error) {
+        return /*#__PURE__*/React__namespace.createElement(errorComponent, {
+          error
+        });
+      }
+      return props.children;
+    }
+  });
+}
+class CatchBoundaryImpl extends React__namespace.Component {
+  state = {
+    error: null
+  };
+  static getDerivedStateFromError(error) {
+    return {
+      error
+    };
+  }
+  componentDidUpdate(prevProps, prevState) {
+    if (prevState.error && prevProps.resetKey !== this.props.resetKey) {
+      this.setState({
+        error: null
+      });
+    }
+  }
+  componentDidCatch(error) {
+    console.error(error);
+    this.props.onCatch?.(error);
+  }
+  render() {
+    return this.props.children(this.state);
+  }
+}
+function ErrorComponent({
+  error
+}) {
+  const [show, setShow] = React__namespace.useState(process.env.NODE_ENV !== 'production');
+  return /*#__PURE__*/React__namespace.createElement("div", {
+    style: {
+      padding: '.5rem',
+      maxWidth: '100%'
+    }
+  }, /*#__PURE__*/React__namespace.createElement("div", {
+    style: {
+      display: 'flex',
+      alignItems: 'center',
+      gap: '.5rem'
+    }
+  }, /*#__PURE__*/React__namespace.createElement("strong", {
+    style: {
+      fontSize: '1rem'
+    }
+  }, "Something went wrong!"), /*#__PURE__*/React__namespace.createElement("button", {
+    style: {
+      appearance: 'none',
+      fontSize: '.6em',
+      border: '1px solid currentColor',
+      padding: '.1rem .2rem',
+      fontWeight: 'bold',
+      borderRadius: '.25rem'
+    },
+    onClick: () => setShow(d => !d)
+  }, show ? 'Hide Error' : 'Show Error')), /*#__PURE__*/React__namespace.createElement("div", {
+    style: {
+      height: '.25rem'
+    }
+  }), show ? /*#__PURE__*/React__namespace.createElement("div", null, /*#__PURE__*/React__namespace.createElement("pre", {
+    style: {
+      fontSize: '.7em',
+      border: '1px solid red',
+      borderRadius: '.25rem',
+      padding: '.3rem',
+      color: 'red',
+      overflow: 'auto'
+    }
+  }, error.message ? /*#__PURE__*/React__namespace.createElement("code", null, error.message) : null)) : null);
+}
+
+exports.CatchBoundary = CatchBoundary;
+exports.CatchBoundaryImpl = CatchBoundaryImpl;
+exports.ErrorComponent = ErrorComponent;
+//# sourceMappingURL=CatchBoundary.js.map

package/build/cjs/react/CatchBoundary.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CatchBoundary.js","sources":["../../../src/react/CatchBoundary.tsx"],"sourcesContent":["import * as React from 'react'\n\nexport function CatchBoundary(props: {\n  resetKey: string\n  children: any\n  errorComponent?: any\n  onCatch: (error: any) => void\n}) {\n  const errorComponent = props.errorComponent ?? ErrorComponent\n\n  return (\n    <CatchBoundaryImpl\n      resetKey={props.resetKey}\n      onCatch={props.onCatch}\n      children={({ error }) => {\n        if (error) {\n          return React.createElement(errorComponent, {\n            error,\n          })\n        }\n\n        return props.children\n      }}\n    />\n  )\n}\n\nexport class CatchBoundaryImpl extends React.Component<{\n  resetKey: string\n  children: (props: { error: any; reset: () => void }) => any\n  onCatch?: (error: any) => void\n}> {\n  state = { error: null } as any\n  static getDerivedStateFromError(error: any) {\n    return { error }\n  }\n  componentDidUpdate(\n    prevProps: Readonly<{\n      resetKey: string\n      children: (props: { error: any; reset: () => void }) => any\n      onCatch?: ((error: any, info: any) => void) | undefined\n    }>,\n    prevState: any,\n  ): void {\n    if (prevState.error && prevProps.resetKey !== this.props.resetKey) {\n      this.setState({ error: null })\n    }\n  }\n  componentDidCatch(error: any) {\n    console.error(error)\n    this.props.onCatch?.(error)\n  }\n  render() {\n    return this.props.children(this.state)\n  }\n}\n\nexport function ErrorComponent({ error }: { error: any }) {\n  const [show, setShow] = React.useState(process.env.NODE_ENV !== 'production')\n\n  return (\n    <div style={{ padding: '.5rem', maxWidth: '100%' }}>\n      <div style={{ display: 'flex', alignItems: 'center', gap: '.5rem' }}>\n        <strong style={{ fontSize: '1rem' }}>Something went wrong!</strong>\n        <button\n          style={{\n            appearance: 'none',\n            fontSize: '.6em',\n            border: '1px solid currentColor',\n            padding: '.1rem .2rem',\n            fontWeight: 'bold',\n            borderRadius: '.25rem',\n          }}\n          onClick={() => setShow((d) => !d)}\n        >\n          {show ? 'Hide Error' : 'Show Error'}\n        </button>\n      </div>\n      <div style={{ height: '.25rem' }} />\n      {show ? (\n        <div>\n          <pre\n            style={{\n              fontSize: '.7em',\n              border: '1px solid red',\n              borderRadius: '.25rem',\n              padding: '.3rem',\n              color: 'red',\n              overflow: 'auto',\n            }}\n          >\n            {error.message ? <code>{error.message}</code> : null}\n          </pre>\n        </div>\n      ) : null}\n    </div>\n  )\n}\n"],"names":["CatchBoundary","props","errorComponent","ErrorComponent","React","createElement","CatchBoundaryImpl","resetKey","onCatch","children","error","Component","state","getDerivedStateFromError","componentDidUpdate","prevProps","prevState","setState","componentDidCatch","console","render","show","setShow","useState","process","env","NODE_ENV","style","padding","maxWidth","display","alignItems","gap","fontSize","appearance","border","fontWeight","borderRadius","onClick","d","height","color","overflow","message"],"mappings":"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"}

package/build/cjs/react/awaited.js

@@ -0,0 +1,43 @@
+/**
+ * @tanstack/react-router/src/index.tsx
+ *
+ * Copyright (c) TanStack
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE.md file in the root directory of this source tree.
+ *
+ * @license MIT
+ */
+'use strict';
+
+var RouterProvider = require('../RouterProvider.js');
+var defer = require('../defer.js');
+
+function useAwaited({
+  promise
+}) {
+  const router = RouterProvider.useRouter();
+  let state = promise.__deferredState;
+  const key = `__TSR__DEFERRED__${state.uid}`;
+  if (defer.isDehydratedDeferred(promise)) {
+    state = router.hydrateData(key);
+    promise = Promise.resolve(state.data);
+    promise.__deferredState = state;
+  }
+  if (state.status === 'pending') {
+    throw new Promise(r => setTimeout(r, 1)).then(() => promise);
+  }
+  if (state.status === 'error') {
+    throw state.error;
+  }
+  router.dehydrateData(key, state);
+  return [state.data];
+}
+function Await(props) {
+  const awaited = useAwaited(props);
+  return props.children(...awaited);
+}
+
+exports.Await = Await;
+exports.useAwaited = useAwaited;
+//# sourceMappingURL=awaited.js.map

package/build/cjs/react/awaited.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"awaited.js","sources":["../../../src/react/awaited.tsx"],"sourcesContent":["import { useRouter } from '../RouterProvider'\nimport { DeferredPromise, isDehydratedDeferred } from '../defer'\n\nexport type AwaitOptions<T> = {\n  promise: DeferredPromise<T>\n}\n\nexport function useAwaited<T>({ promise }: AwaitOptions<T>): [T] {\n  const router = useRouter()\n\n  let state = promise.__deferredState\n  const key = `__TSR__DEFERRED__${state.uid}`\n\n  if (isDehydratedDeferred(promise)) {\n    state = router.hydrateData(key)!\n    promise = Promise.resolve(state.data) as DeferredPromise<any>\n    promise.__deferredState = state\n  }\n\n  if (state.status === 'pending') {\n    throw new Promise((r) => setTimeout(r, 1)).then(() => promise)\n  }\n\n  if (state.status === 'error') {\n    throw state.error\n  }\n\n  router.dehydrateData(key, state)\n\n  return [state.data]\n}\n\nexport function Await<T>(\n  props: AwaitOptions<T> & {\n    children: (result: T) => JSX.Element\n  },\n) {\n  const awaited = useAwaited(props)\n  return props.children(...awaited)\n}\n"],"names":["useAwaited","promise","router","useRouter","state","__deferredState","key","uid","isDehydratedDeferred","hydrateData","Promise","resolve","data","status","r","setTimeout","then","error","dehydrateData","Await","props","awaited","children"],"mappings":";;;;;;;;;;;;;;;AAOO,SAASA,UAAUA,CAAI;AAAEC,EAAAA,OAAAA;AAAyB,CAAC,EAAO;AAC/D,EAAA,MAAMC,MAAM,GAAGC,wBAAS,EAAE,CAAA;AAE1B,EAAA,IAAIC,KAAK,GAAGH,OAAO,CAACI,eAAe,CAAA;AACnC,EAAA,MAAMC,GAAG,GAAI,CAAA,iBAAA,EAAmBF,KAAK,CAACG,GAAI,CAAC,CAAA,CAAA;AAE3C,EAAA,IAAIC,0BAAoB,CAACP,OAAO,CAAC,EAAE;AACjCG,IAAAA,KAAK,GAAGF,MAAM,CAACO,WAAW,CAACH,GAAG,CAAE,CAAA;IAChCL,OAAO,GAAGS,OAAO,CAACC,OAAO,CAACP,KAAK,CAACQ,IAAI,CAAyB,CAAA;IAC7DX,OAAO,CAACI,eAAe,GAAGD,KAAK,CAAA;AACjC,GAAA;AAEA,EAAA,IAAIA,KAAK,CAACS,MAAM,KAAK,SAAS,EAAE;AAC9B,IAAA,MAAM,IAAIH,OAAO,CAAEI,CAAC,IAAKC,UAAU,CAACD,CAAC,EAAE,CAAC,CAAC,CAAC,CAACE,IAAI,CAAC,MAAMf,OAAO,CAAC,CAAA;AAChE,GAAA;AAEA,EAAA,IAAIG,KAAK,CAACS,MAAM,KAAK,OAAO,EAAE;IAC5B,MAAMT,KAAK,CAACa,KAAK,CAAA;AACnB,GAAA;AAEAf,EAAAA,MAAM,CAACgB,aAAa,CAACZ,GAAG,EAAEF,KAAK,CAAC,CAAA;AAEhC,EAAA,OAAO,CAACA,KAAK,CAACQ,IAAI,CAAC,CAAA;AACrB,CAAA;AAEO,SAASO,KAAKA,CACnBC,KAEC,EACD;AACA,EAAA,MAAMC,OAAO,GAAGrB,UAAU,CAACoB,KAAK,CAAC,CAAA;AACjC,EAAA,OAAOA,KAAK,CAACE,QAAQ,CAAC,GAAGD,OAAO,CAAC,CAAA;AACnC;;;;;"}

package/build/cjs/react/defer.js

@@ -0,0 +1,37 @@
+/**
+ * @tanstack/react-router/src/index.tsx
+ *
+ * Copyright (c) TanStack
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE.md file in the root directory of this source tree.
+ *
+ * @license MIT
+ */
+'use strict';
+
+function defer(_promise) {
+  const promise = _promise;
+  if (!promise.__deferredState) {
+    promise.__deferredState = {
+      uid: Math.random().toString(36).slice(2),
+      status: 'pending'
+    };
+    const state = promise.__deferredState;
+    promise.then(data => {
+      state.status = 'success';
+      state.data = data;
+    }).catch(error => {
+      state.status = 'error';
+      state.error = error;
+    });
+  }
+  return promise;
+}
+function isDehydratedDeferred(obj) {
+  return typeof obj === 'object' && obj !== null && !(obj instanceof Promise) && !obj.then && '__deferredState' in obj;
+}
+
+exports.defer = defer;
+exports.isDehydratedDeferred = isDehydratedDeferred;
+//# sourceMappingURL=defer.js.map

package/build/cjs/react/defer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"defer.js","sources":["../../../src/react/defer.ts"],"sourcesContent":["export type DeferredPromiseState<T> = { uid: string } & (\n  | {\n      status: 'pending'\n      data?: T\n      error?: unknown\n    }\n  | {\n      status: 'success'\n      data: T\n    }\n  | {\n      status: 'error'\n      data?: T\n      error: unknown\n    }\n)\n\nexport type DeferredPromise<T> = Promise<T> & {\n  __deferredState: DeferredPromiseState<T>\n}\n\nexport function defer<T>(_promise: Promise<T>) {\n  const promise = _promise as DeferredPromise<T>\n\n  if (!promise.__deferredState) {\n    promise.__deferredState = {\n      uid: Math.random().toString(36).slice(2),\n      status: 'pending',\n    }\n\n    const state = promise.__deferredState\n\n    promise\n      .then((data) => {\n        state.status = 'success' as any\n        state.data = data\n      })\n      .catch((error) => {\n        state.status = 'error' as any\n        state.error = error\n      })\n  }\n\n  return promise\n}\n\nexport function isDehydratedDeferred(obj: any): boolean {\n  return (\n    typeof obj === 'object' &&\n    obj !== null &&\n    !(obj instanceof Promise) &&\n    !obj.then &&\n    '__deferredState' in obj\n  )\n}\n"],"names":["defer","_promise","promise","__deferredState","uid","Math","random","toString","slice","status","state","then","data","catch","error","isDehydratedDeferred","obj","Promise"],"mappings":";;;;;;;;;;;;AAqBO,SAASA,KAAKA,CAAIC,QAAoB,EAAE;EAC7C,MAAMC,OAAO,GAAGD,QAA8B,CAAA;AAE9C,EAAA,IAAI,CAACC,OAAO,CAACC,eAAe,EAAE;IAC5BD,OAAO,CAACC,eAAe,GAAG;AACxBC,MAAAA,GAAG,EAAEC,IAAI,CAACC,MAAM,EAAE,CAACC,QAAQ,CAAC,EAAE,CAAC,CAACC,KAAK,CAAC,CAAC,CAAC;AACxCC,MAAAA,MAAM,EAAE,SAAA;KACT,CAAA;AAED,IAAA,MAAMC,KAAK,GAAGR,OAAO,CAACC,eAAe,CAAA;AAErCD,IAAAA,OAAO,CACJS,IAAI,CAAEC,IAAI,IAAK;MACdF,KAAK,CAACD,MAAM,GAAG,SAAgB,CAAA;MAC/BC,KAAK,CAACE,IAAI,GAAGA,IAAI,CAAA;AACnB,KAAC,CAAC,CACDC,KAAK,CAAEC,KAAK,IAAK;MAChBJ,KAAK,CAACD,MAAM,GAAG,OAAc,CAAA;MAC7BC,KAAK,CAACI,KAAK,GAAGA,KAAK,CAAA;AACrB,KAAC,CAAC,CAAA;AACN,GAAA;AAEA,EAAA,OAAOZ,OAAO,CAAA;AAChB,CAAA;AAEO,SAASa,oBAAoBA,CAACC,GAAQ,EAAW;EACtD,OACE,OAAOA,GAAG,KAAK,QAAQ,IACvBA,GAAG,KAAK,IAAI,IACZ,EAAEA,GAAG,YAAYC,OAAO,CAAC,IACzB,CAACD,GAAG,CAACL,IAAI,IACT,iBAAiB,IAAIK,GAAG,CAAA;AAE5B;;;;;"}