@auth0/auth0-react 1.11.0 → 2.0.0-beta.0

package/dist/index.d.ts

@@ -2,7 +2,7 @@ export { default as Auth0Provider, Auth0ProviderOptions, AppState, } from './aut
 export { default as useAuth0 } from './use-auth0';
 export { default as withAuth0, WithAuth0Props } from './with-auth0';
 export { default as withAuthenticationRequired, WithAuthenticationRequiredOptions, } from './with-authentication-required';
-export { default as Auth0Context, Auth0ContextInterface, RedirectLoginOptions, } from './auth0-context';
-export { PopupLoginOptions, PopupConfigOptions, GetIdTokenClaimsOptions, GetTokenWithPopupOptions, LogoutOptions, LogoutUrlOptions, CacheLocation, GetTokenSilentlyOptions, IdToken, User, ICache, InMemoryCache, LocalStorageCache, Cacheable, } from '@auth0/auth0-spa-js';
+export { default as Auth0Context, Auth0ContextInterface, initialContext, LogoutOptions, RedirectLoginOptions, } from './auth0-context';
+export { AuthorizationParams, PopupLoginOptions, PopupConfigOptions, GetTokenWithPopupOptions, LogoutUrlOptions, CacheLocation, GetTokenSilentlyOptions, IdToken, User, ICache, InMemoryCache, LocalStorageCache, Cacheable, } from '@auth0/auth0-spa-js';
 export { OAuthError } from './errors';
 //# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,OAAO,IAAI,aAAa,EACxB,oBAAoB,EACpB,QAAQ,GACT,MAAM,kBAAkB,CAAC;AAC1B,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,aAAa,CAAC;AAClD,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AACpE,OAAO,EACL,OAAO,IAAI,0BAA0B,EACrC,iCAAiC,GAClC,MAAM,gCAAgC,CAAC;AACxC,OAAO,EACL,OAAO,IAAI,YAAY,EACvB,qBAAqB,EACrB,oBAAoB,GACrB,MAAM,iBAAiB,CAAC;AACzB,OAAO,EACL,iBAAiB,EACjB,kBAAkB,EAClB,uBAAuB,EACvB,wBAAwB,EACxB,aAAa,EACb,gBAAgB,EAChB,aAAa,EACb,uBAAuB,EACvB,OAAO,EACP,IAAI,EACJ,MAAM,EACN,aAAa,EACb,iBAAiB,EACjB,SAAS,GACV,MAAM,qBAAqB,CAAC;AAC7B,OAAO,EAAE,UAAU,EAAE,MAAM,UAAU,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,OAAO,IAAI,aAAa,EACxB,oBAAoB,EACpB,QAAQ,GACT,MAAM,kBAAkB,CAAC;AAC1B,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,aAAa,CAAC;AAClD,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AACpE,OAAO,EACL,OAAO,IAAI,0BAA0B,EACrC,iCAAiC,GAClC,MAAM,gCAAgC,CAAC;AACxC,OAAO,EACL,OAAO,IAAI,YAAY,EACvB,qBAAqB,EACrB,cAAc,EACd,aAAa,EACb,oBAAoB,GACrB,MAAM,iBAAiB,CAAC;AACzB,OAAO,EACL,mBAAmB,EACnB,iBAAiB,EACjB,kBAAkB,EAClB,wBAAwB,EACxB,gBAAgB,EAChB,aAAa,EACb,uBAAuB,EACvB,OAAO,EACP,IAAI,EACJ,MAAM,EACN,aAAa,EACb,iBAAiB,EACjB,SAAS,GACV,MAAM,qBAAqB,CAAC;AAC7B,OAAO,EAAE,UAAU,EAAE,MAAM,UAAU,CAAC"}

package/dist/reducer.d.ts

@@ -1,6 +1,6 @@
 import { User } from '@auth0/auth0-spa-js';
 import { AuthState } from './auth-state';
-declare type Action = {
+type Action = {
     type: 'LOGIN_POPUP_STARTED';
 } | {
     type: 'INITIALISED' | 'LOGIN_POPUP_COMPLETE' | 'GET_ACCESS_TOKEN_COMPLETE' | 'HANDLE_REDIRECT_COMPLETE';

package/dist/reducer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"reducer.d.ts","sourceRoot":"","sources":["../src/reducer.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,qBAAqB,CAAC;AAC3C,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAEzC,aAAK,MAAM,GACP;IAAE,IAAI,EAAE,qBAAqB,CAAA;CAAE,GAC/B;IACE,IAAI,EACA,aAAa,GACb,sBAAsB,GACtB,2BAA2B,GAC3B,0BAA0B,CAAC;IAC/B,IAAI,CAAC,EAAE,IAAI,CAAC;CACb,GACD;IAAE,IAAI,EAAE,QAAQ,CAAA;CAAE,GAClB;IAAE,IAAI,EAAE,OAAO,CAAC;IAAC,KAAK,EAAE,KAAK,CAAA;CAAE,CAAC;AAEpC;;GAEG;AACH,eAAO,MAAM,OAAO,UAAW,SAAS,UAAU,MAAM,KAAG,SAuC1D,CAAC"}
+{"version":3,"file":"reducer.d.ts","sourceRoot":"","sources":["../src/reducer.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,qBAAqB,CAAC;AAC3C,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAEzC,KAAK,MAAM,GACP;IAAE,IAAI,EAAE,qBAAqB,CAAA;CAAE,GAC/B;IACE,IAAI,EACA,aAAa,GACb,sBAAsB,GACtB,2BAA2B,GAC3B,0BAA0B,CAAC;IAC/B,IAAI,CAAC,EAAE,IAAI,CAAC;CACb,GACD;IAAE,IAAI,EAAE,QAAQ,CAAA;CAAE,GAClB;IAAE,IAAI,EAAE,OAAO,CAAC;IAAC,KAAK,EAAE,KAAK,CAAA;CAAE,CAAC;AAEpC;;GAEG;AACH,eAAO,MAAM,OAAO,UAAW,SAAS,UAAU,MAAM,KAAG,SAuC1D,CAAC"}

package/dist/use-auth0.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { User } from '@auth0/auth0-spa-js';
 import { Auth0ContextInterface } from './auth0-context';
 /**
@@ -22,6 +23,6 @@ import { Auth0ContextInterface } from './auth0-context';
  *
  * TUser is an optional type param to provide a type to the `user` field.
  */
-declare const useAuth0: <TUser extends User = User>() => Auth0ContextInterface<TUser>;
+declare const useAuth0: <TUser extends User = User>(context?: import("react").Context<Auth0ContextInterface<User>>) => Auth0ContextInterface<TUser>;
 export default useAuth0;
 //# sourceMappingURL=use-auth0.d.ts.map

package/dist/use-auth0.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"use-auth0.d.ts","sourceRoot":"","sources":["../src/use-auth0.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,IAAI,EAAE,MAAM,qBAAqB,CAAC;AAC3C,OAAqB,EAAE,qBAAqB,EAAE,MAAM,iBAAiB,CAAC;AAEtE;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,QAAA,MAAM,QAAQ,+DAC4C,CAAC;AAE3D,eAAe,QAAQ,CAAC"}
+{"version":3,"file":"use-auth0.d.ts","sourceRoot":"","sources":["../src/use-auth0.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,IAAI,EAAE,MAAM,qBAAqB,CAAC;AAC3C,OAAqB,EAAE,qBAAqB,EAAE,MAAM,iBAAiB,CAAC;AAEtE;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,QAAA,MAAM,QAAQ,6HAGuC,CAAC;AAEtD,eAAe,QAAQ,CAAC"}

package/dist/with-auth0.d.ts

@@ -19,8 +19,11 @@ export interface WithAuth0Props {
  * export default withAuth0(MyComponent);
  * ```
  *
- * Wrap your class components in this Higher Order Component to give them access to the Auth0Context
+ * Wrap your class components in this Higher Order Component to give them access to the Auth0Context.
+ *
+ * Providing a context as the second argument allows you to configure the Auth0Provider the Auth0Context
+ * should come from f you have multiple within your application.
  */
-declare const withAuth0: <P extends WithAuth0Props>(Component: React.ComponentType<P>) => React.ComponentType<Omit<P, "auth0">>;
+declare const withAuth0: <P extends WithAuth0Props>(Component: React.ComponentType<P>, context?: React.Context<Auth0ContextInterface<import("@auth0/auth0-spa-js").User>>) => React.ComponentType<Omit<P, "auth0">>;
 export default withAuth0;
 //# sourceMappingURL=with-auth0.d.ts.map

package/dist/with-auth0.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"with-auth0.d.ts","sourceRoot":"","sources":["../src/with-auth0.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAC7C,OAAqB,EAAE,qBAAqB,EAAE,MAAM,iBAAiB,CAAC;AAEtE;;GAEG;AACH,MAAM,WAAW,cAAc;IAC7B,KAAK,EAAE,qBAAqB,CAAC;CAC9B;AAED;;;;;;;;;;;;;;GAcG;AACH,QAAA,MAAM,SAAS,wGAYd,CAAC;AAEF,eAAe,SAAS,CAAC"}
+{"version":3,"file":"with-auth0.d.ts","sourceRoot":"","sources":["../src/with-auth0.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAC7C,OAAqB,EAAE,qBAAqB,EAAE,MAAM,iBAAiB,CAAC;AAEtE;;GAEG;AACH,MAAM,WAAW,cAAc;IAC7B,KAAK,EAAE,qBAAqB,CAAC;CAC9B;AAED;;;;;;;;;;;;;;;;;GAiBG;AACH,QAAA,MAAM,SAAS,4LAad,CAAC;AAEF,eAAe,SAAS,CAAC"}

package/dist/with-authentication-required.d.ts

@@ -1,5 +1,5 @@
 import React, { ComponentType, FC } from 'react';
-import { RedirectLoginOptions, User } from '@auth0/auth0-spa-js';
+import { Auth0ContextInterface, RedirectLoginOptions } from './auth0-context';
 /**
  * Options for the withAuthenticationRequired Higher Order Component
  */
@@ -48,10 +48,11 @@ export interface WithAuthenticationRequiredOptions {
      */
     loginOptions?: RedirectLoginOptions;
     /**
-     * Check the user object for JWT claims and return a boolean indicating
-     * whether or not they are authorized to view the component.
+     * The context to be used when calling useAuth0, this should only be provided if you are using multiple Auth0Providers
+     * within your application and you wish to tie a specific component to a Auth0Provider other than the Auth0Provider
+     * associated with the default Auth0Context.
      */
-    claimCheck?: (claims?: User) => boolean;
+    context?: React.Context<Auth0ContextInterface>;
 }
 /**
  * ```js

package/dist/with-authentication-required.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"with-authentication-required.d.ts","sourceRoot":"","sources":["../src/with-authentication-required.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,aAAa,EAAa,EAAE,EAAE,MAAM,OAAO,CAAC;AAC5D,OAAO,EAAE,oBAAoB,EAAE,IAAI,EAAE,MAAM,qBAAqB,CAAC;AAcjE;;GAEG;AACH,MAAM,WAAW,iCAAiC;IAChD;;;;;;;;;;;;;;;;OAgBG;IACH,QAAQ,CAAC,EAAE,MAAM,GAAG,CAAC,MAAM,MAAM,CAAC,CAAC;IACnC;;;;;;;;OAQG;IACH,aAAa,CAAC,EAAE,MAAM,GAAG,CAAC,OAAO,CAAC;IAClC;;;;;;;;;;;;;OAaG;IACH,YAAY,CAAC,EAAE,oBAAoB,CAAC;IACpC;;;OAGG;IACH,UAAU,CAAC,EAAE,CAAC,MAAM,CAAC,EAAE,IAAI,KAAK,OAAO,CAAC;CACzC;AAED;;;;;;;GAOG;AACH,QAAA,MAAM,0BAA0B,kEAErB,iCAAiC,gBAyC3C,CAAC;AAEF,eAAe,0BAA0B,CAAC"}
+{"version":3,"file":"with-authentication-required.d.ts","sourceRoot":"","sources":["../src/with-authentication-required.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,aAAa,EAAa,EAAE,EAAE,MAAM,OAAO,CAAC;AAE5D,OAAqB,EACnB,qBAAqB,EACrB,oBAAoB,EACrB,MAAM,iBAAiB,CAAC;AAazB;;GAEG;AACH,MAAM,WAAW,iCAAiC;IAChD;;;;;;;;;;;;;;;;OAgBG;IACH,QAAQ,CAAC,EAAE,MAAM,GAAG,CAAC,MAAM,MAAM,CAAC,CAAC;IACnC;;;;;;;;OAQG;IACH,aAAa,CAAC,EAAE,MAAM,GAAG,CAAC,OAAO,CAAC;IAClC;;;;;;;;;;;;;OAaG;IACH,YAAY,CAAC,EAAE,oBAAoB,CAAC;IACpC;;;;OAIG;IACH,OAAO,CAAC,EAAE,KAAK,CAAC,OAAO,CAAC,qBAAqB,CAAC,CAAC;CAChD;AAED;;;;;;;GAOG;AACH,QAAA,MAAM,0BAA0B,kEAErB,iCAAiC,gBAqC3C,CAAC;AAEF,eAAe,0BAA0B,CAAC"}

package/package.json

@@ -1,7 +1,7 @@
 {
   "author": "Auth0",
   "name": "@auth0/auth0-react",
-  "version": "1.11.0",
+  "version": "2.0.0-beta.0",
   "description": "Auth0 SDK for React Single Page Applications (SPA)",
   "keywords": [
     "auth0",
@@ -31,7 +31,7 @@
     "start:gatsby": "npm start --prefix=examples/gatsby-app",
     "start:nextjs": "npm run dev --prefix=examples/nextjs-app",
     "start:api": "npm start --prefix=examples/users-api",
-    "test:cra": "start-server-and-test start:api 3001 start:cra 3000 cypress:run",
+    "test:cra": "start-server-and-test start:api 3001 start:cra http-get://127.0.0.1:3000 cypress:run",
     "test:cra:watch": "start-server-and-test start:api 3001 start:cra 3000 cypress:open",
     "test:gatsby": "start-server-and-test start:api 3001 start:gatsby 3000 cypress:run",
     "test:gatsby:watch": "start-server-and-test start:api 3001 start:gatsby 3000 cypress:open",
@@ -51,44 +51,45 @@
   },
   "homepage": "https://github.com/auth0/auth0-react#readme",
   "devDependencies": {
-    "@rollup/plugin-node-resolve": "^13.1.3",
-    "@rollup/plugin-replace": "^4.0.0",
-    "@testing-library/jest-dom": "^5.16.3",
-    "@testing-library/react": "^13.0.0",
+    "@rollup/plugin-node-resolve": "^15.0.1",
+    "@rollup/plugin-replace": "^5.0.1",
+    "@rollup/plugin-terser": "^0.1.0",
+    "@testing-library/jest-dom": "^5.16.5",
+    "@testing-library/react": "^13.4.0",
     "@testing-library/react-hooks": "^7.0.2",
-    "@types/jest": "^27.4.1",
-    "@types/react": "^17.0.43",
-    "@types/react-dom": "^17.0.14",
-    "@typescript-eslint/eslint-plugin": "^5.17.0",
-    "@typescript-eslint/parser": "^5.17.0",
-    "browserstack-cypress-cli": "^1.1.2",
-    "cypress": "^9.5.3",
-    "eslint": "^8.12.0",
-    "eslint-plugin-react": "^7.29.4",
-    "eslint-plugin-react-hooks": "^4.4.0",
-    "husky": "^4.2.5",
-    "jest": "^27.5.1",
-    "jest-junit": "^13.0.0",
-    "oidc-provider": "^7.10.6",
-    "prettier": "2.6.2",
+    "@types/jest": "^29.2.3",
+    "@types/react": "^17.0.52",
+    "@types/react-dom": "^17.0.18",
+    "@typescript-eslint/eslint-plugin": "^5.45.0",
+    "@typescript-eslint/parser": "^5.45.0",
+    "browserstack-cypress-cli": "^1.19.1",
+    "cypress": "^9.7.0",
+    "eslint": "^8.28.0",
+    "eslint-plugin-react": "^7.31.11",
+    "eslint-plugin-react-hooks": "^4.6.0",
+    "husky": "^4.3.8",
+    "jest": "^29.3.1",
+    "jest-environment-jsdom": "^29.3.1",
+    "jest-junit": "^15.0.0",
+    "oidc-provider": "^8.0.0",
+    "prettier": "^2.8.1",
     "pretty-quick": "^3.1.3",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
-    "react-test-renderer": "^18.0.0",
-    "rollup": "^2.70.1",
+    "react-test-renderer": "^18.2.0",
+    "rollup": "^3.7.0",
     "rollup-plugin-analyzer": "^4.0.0",
     "rollup-plugin-delete": "^2.0.0",
     "rollup-plugin-dev": "^1.1.3",
     "rollup-plugin-livereload": "^2.0.5",
     "rollup-plugin-peer-deps-external": "^2.2.4",
-    "rollup-plugin-serve": "^1.1.0",
-    "rollup-plugin-terser": "^7.0.2",
-    "rollup-plugin-typescript2": "^0.31.2",
-    "start-server-and-test": "^1.14.0",
-    "ts-jest": "^27.1.4",
-    "tslib": "^2.3.1",
-    "typedoc": "^0.22.13",
-    "typescript": "^4.6.3"
+    "rollup-plugin-serve": "^2.0.2",
+    "rollup-plugin-typescript2": "^0.34.1",
+    "start-server-and-test": "^1.15.2",
+    "ts-jest": "^29.0.3",
+    "tslib": "^2.4.1",
+    "typedoc": "^0.23.21",
+    "typescript": "^4.9.4"
   },
   "peerDependencies": {
     "react": "^16.11.0 || ^17 || ^18",
@@ -100,6 +101,6 @@
     }
   },
   "dependencies": {
-    "@auth0/auth0-spa-js": "^1.22.2"
+    "@auth0/auth0-spa-js": "^2.0.1"
   }
 }

package/src/auth0-context.tsx

@@ -1,40 +1,24 @@
 import {
-  BaseLoginOptions,
-  GetIdTokenClaimsOptions,
   GetTokenSilentlyOptions,
   GetTokenWithPopupOptions,
   IdToken,
-  LogoutOptions,
-  LogoutUrlOptions,
+  LogoutOptions as SPALogoutOptions,
   PopupLoginOptions,
   PopupConfigOptions,
-  RedirectLoginOptions as Auth0RedirectLoginOptions,
   RedirectLoginResult,
   User,
   GetTokenSilentlyVerboseResponse,
+  RedirectLoginOptions as SPARedirectLoginOptions,
 } from '@auth0/auth0-spa-js';
 import { createContext } from 'react';
 import { AuthState, initialAuthState } from './auth-state';
+import { AppState } from './auth0-provider';
 
-export interface RedirectLoginOptions extends BaseLoginOptions {
-  /**
-   * The URL where Auth0 will redirect your browser to with
-   * the authentication result. It must be whitelisted in
-   * the "Allowed Callback URLs" field in your Auth0 Application's
-   * settings.
-   */
-  redirectUri?: string;
-
-  /**
-   * Used to store state before doing the redirect
-   */
-  appState?: any; // eslint-disable-line @typescript-eslint/no-explicit-any
-
-  /**
-   * Used to add to the URL fragment before redirecting
-   */
-  fragment?: string;
-}
+// eslint-disable-next-line @typescript-eslint/no-empty-interface
+export interface LogoutOptions extends Omit<SPALogoutOptions, 'onRedirect'> {}
+// eslint-disable-next-line @typescript-eslint/no-empty-interface
+export interface RedirectLoginOptions<TAppState = AppState>
+  extends Omit<SPARedirectLoginOptions<TAppState>, 'onRedirect'> {}
 
 /**
  * Contains the authenticated state and authentication methods provided by the `useAuth0` hook.
@@ -66,9 +50,9 @@ export interface Auth0ContextInterface<TUser extends User = User>
    * the `auth0` cookie.
    */
   getAccessTokenSilently: {
-    (options: GetTokenSilentlyOptions & { detailedResponse: true }): Promise<
-      GetTokenSilentlyVerboseResponse
-    >;
+    (
+      options: GetTokenSilentlyOptions & { detailedResponse: true }
+    ): Promise<GetTokenSilentlyVerboseResponse>;
     (options?: GetTokenSilentlyOptions): Promise<string>;
     (options: GetTokenSilentlyOptions): Promise<
       GetTokenSilentlyVerboseResponse | string
@@ -90,7 +74,7 @@ export interface Auth0ContextInterface<TUser extends User = User>
   getAccessTokenWithPopup: (
     options?: GetTokenWithPopupOptions,
     config?: PopupConfigOptions
-  ) => Promise<string>;
+  ) => Promise<string | undefined>;
 
   /**
    * ```js
@@ -99,9 +83,7 @@ export interface Auth0ContextInterface<TUser extends User = User>
    *
    * Returns all claims from the id_token if available.
    */
-  getIdTokenClaims: (
-    options?: GetIdTokenClaimsOptions
-  ) => Promise<IdToken | undefined>;
+  getIdTokenClaims: () => Promise<IdToken | undefined>;
 
   /**
    * ```js
@@ -112,7 +94,9 @@ export interface Auth0ContextInterface<TUser extends User = User>
    * provided as arguments. Random and secure `state` and `nonce`
    * parameters will be auto-generated.
    */
-  loginWithRedirect: (options?: RedirectLoginOptions) => Promise<void>;
+  loginWithRedirect: (
+    options?: RedirectLoginOptions<AppState>
+  ) => Promise<void>;
 
   /**
    * ```js
@@ -140,35 +124,11 @@ export interface Auth0ContextInterface<TUser extends User = User>
    *
    * Clears the application session and performs a redirect to `/v2/logout`, using
    * the parameters provided as arguments, to clear the Auth0 session.
-   * If the `federated` option is specified, it also clears the Identity Provider session.
-   * If the `localOnly` option is specified, it only clears the application session.
-   * It is invalid to set both the `federated` and `localOnly` options to `true`,
-   * and an error will be thrown if you do.
+   * If the `logoutParams.federated` option is specified, it also clears the Identity Provider session.
    * [Read more about how Logout works at Auth0](https://auth0.com/docs/logout).
    */
   logout: (options?: LogoutOptions) => void;
 
-  /**
-   * ```js
-   * const authUrl = await buildAuthorizeUrl();
-   * ```
-   *
-   * Builds an `/authorize` URL for loginWithRedirect using the parameters
-   * provided as arguments. Random and secure `state` and `nonce`
-   * parameters will be auto-generated.
-   */
-  buildAuthorizeUrl: (options?: Auth0RedirectLoginOptions) => Promise<string>;
-
-  /**
-   * ```js
-   * const logoutUrl = buildLogoutUrl();
-   * ```
-   *
-   * returns a URL to the logout endpoint using the parameters provided as arguments.
-   * @param options
-   */
-  buildLogoutUrl: (options?: LogoutUrlOptions) => string;
-
   /**
    * After the browser redirects back to the callback page,
    * call `handleRedirectCallback` to handle success and error
@@ -190,7 +150,7 @@ const stub = (): never => {
 /**
  * @ignore
  */
-const initialContext = {
+export const initialContext = {
   ...initialAuthState,
   buildAuthorizeUrl: stub,
   buildLogoutUrl: stub,

package/src/auth0-provider.tsx

@@ -9,19 +9,18 @@ import React, {
 import {
   Auth0Client,
   Auth0ClientOptions,
-  CacheLocation,
-  LogoutOptions,
-  LogoutUrlOptions,
   PopupLoginOptions,
   PopupConfigOptions,
-  RedirectLoginOptions as Auth0RedirectLoginOptions,
   GetTokenWithPopupOptions,
   RedirectLoginResult,
-  ICache,
   GetTokenSilentlyOptions,
   User,
 } from '@auth0/auth0-spa-js';
-import Auth0Context, { RedirectLoginOptions } from './auth0-context';
+import Auth0Context, {
+  Auth0ContextInterface,
+  LogoutOptions,
+  RedirectLoginOptions,
+} from './auth0-context';
 import { hasAuthParams, loginError, tokenError } from './utils';
 import { reducer } from './reducer';
 import { initialAuthState } from './auth-state';
@@ -37,7 +36,7 @@ export type AppState = {
 /**
  * The main configuration to instantiate the `Auth0Provider`.
  */
-export interface Auth0ProviderOptions {
+export interface Auth0ProviderOptions extends Auth0ClientOptions {
   /**
    * The child nodes your Provider has wrapped
    */
@@ -63,108 +62,23 @@ export interface Auth0ProviderOptions {
    */
   skipRedirectCallback?: boolean;
   /**
-   * Your Auth0 account domain such as `'example.auth0.com'`,
-   * `'example.eu.auth0.com'` or , `'example.mycompany.com'`
-   * (when using [custom domains](https://auth0.com/docs/custom-domains))
-   */
-  domain: string;
-  /**
-   * The issuer to be used for validation of JWTs, optionally defaults to the domain above
-   */
-  issuer?: string;
-  /**
-   * The Client ID found on your Application settings page
-   */
-  clientId: string;
-  /**
-   * The default URL where Auth0 will redirect your browser to with
-   * the authentication result. It must be whitelisted in
-   * the "Allowed Callback URLs" field in your Auth0 Application's
-   * settings. If not provided here, it should be provided in the other
-   * methods that provide authentication.
-   */
-  redirectUri?: string;
-  /**
-   * The value in seconds used to account for clock skew in JWT expirations.
-   * Typically, this value is no more than a minute or two at maximum.
-   * Defaults to 60s.
-   */
-  leeway?: number;
-  /**
-   * The location to use when storing cache data. Valid values are `memory` or `localstorage`.
-   * The default setting is `memory`.
+   * Context to be used when creating the Auth0Provider, defaults to the internally created context.
    *
-   * Read more about [changing storage options in the Auth0 docs](https://auth0.com/docs/libraries/auth0-single-page-app-sdk#change-storage-options)
-   */
-  cacheLocation?: CacheLocation;
-  /**
-   * Specify a custom cache implementation to use for token storage and retrieval. This setting takes precedence over `cacheLocation` if they are both specified.
+   * This allows multiple Auth0Providers to be nested within the same application, the context value can then be
+   * passed to useAuth0, withAuth0, or withAuthenticationRequired to use that specific Auth0Provider to access
+   * auth state and methods specifically tied to the provider that the context belongs to.
    *
-   * Read more about [creating a custom cache](https://github.com/auth0/auth0-spa-js#creating-a-custom-cache)
-   */
-  cache?: ICache;
-  /**
-   * If true, refresh tokens are used to fetch new access tokens from the Auth0 server. If false, the legacy technique of using a hidden iframe and the `authorization_code` grant with `prompt=none` is used.
-   * The default setting is `false`.
+   * When using multiple Auth0Providers in a single application you should do the following to ensure sessions are not
+   * overwritten:
    *
-   * **Note**: Use of refresh tokens must be enabled by an administrator on your Auth0 client application.
-   */
-  useRefreshTokens?: boolean;
-  /**
-   * A maximum number of seconds to wait before declaring background calls to /authorize as failed for timeout
-   * Defaults to 60s.
-   */
-  authorizeTimeoutInSeconds?: number;
-  /**
-   * Changes to recommended defaults, like defaultScope
-   */
-  advancedOptions?: {
-    /**
-     * The default scope to be included with all requests.
-     * If not provided, 'openid profile email' is used. This can be set to `null` in order to effectively remove the default scopes.
-     *
-     * Note: The `openid` scope is **always applied** regardless of this setting.
-     */
-    defaultScope?: string;
-  };
-  /**
-   * Maximum allowable elapsed time (in seconds) since authentication.
-   * If the last time the user authenticated is greater than this value,
-   * the user must be reauthenticated.
-   */
-  maxAge?: string | number;
-  /**
-   * The default scope to be used on authentication requests.
-   * The defaultScope defined in the Auth0Client is included
-   * along with this scope
-   */
-  scope?: string;
-  /**
-   * The default audience to be used for requesting API access.
-   */
-  audience?: string;
-  /**
-   * The Id of an organization to log in to.
+   * * Configure a different redirect_uri for each Auth0Provider, and set skipRedirectCallback for each provider to ignore
+   * the others redirect_uri
+   * * If using localstorage for both Auth0Providers, ensure that the audience and scope are different for so that the key
+   * used to store data is different
    *
-   * This will specify an `organization` parameter in your user's login request and will add a step to validate
-   * the `org_id` claim in your user's ID Token.
-   */
-  organization?: string;
-  /**
-   * The Id of an invitation to accept. This is available from the user invitation URL that is given when participating in a user invitation flow.
-   */
-  invitation?: string;
-  /**
-   * The name of the connection configured for your application.
-   * If null, it will redirect to the Auth0 Login Page and show
-   * the Login Widget.
+   * For a sample on using multiple Auth0Providers review the [React Account Linking Sample](https://github.com/auth0-samples/auth0-link-accounts-sample/tree/react-variant)
    */
-  connection?: string;
-  /**
-   * If you need to send custom parameters to the Authorization Server,
-   * make sure to use the original parameter name.
-   */
-  [key: string]: any; // eslint-disable-line @typescript-eslint/no-explicit-any
+  context?: React.Context<Auth0ContextInterface>;
 }
 
 /**
@@ -179,12 +93,8 @@ declare const __VERSION__: string;
 const toAuth0ClientOptions = (
   opts: Auth0ProviderOptions
 ): Auth0ClientOptions => {
-  const { clientId, redirectUri, maxAge, ...validOpts } = opts;
   return {
-    ...validOpts,
-    client_id: clientId,
-    redirect_uri: redirectUri,
-    max_age: maxAge,
+    ...opts,
     auth0Client: {
       name: 'auth0-react',
       version: __VERSION__,
@@ -192,22 +102,6 @@ const toAuth0ClientOptions = (
   };
 };
 
-/**
- * @ignore
- */
-const toAuth0LoginRedirectOptions = (
-  opts?: RedirectLoginOptions
-): Auth0RedirectLoginOptions | undefined => {
-  if (!opts) {
-    return;
-  }
-  const { redirectUri, ...validOpts } = opts;
-  return {
-    ...validOpts,
-    redirect_uri: redirectUri,
-  };
-};
-
 /**
  * @ignore
  */
@@ -236,6 +130,7 @@ const Auth0Provider = (opts: Auth0ProviderOptions): JSX.Element => {
     children,
     skipRedirectCallback,
     onRedirectCallback = defaultOnRedirectCallback,
+    context = Auth0Context,
     ...clientOpts
   } = opts;
   const [client] = useState(
@@ -267,20 +162,9 @@ const Auth0Provider = (opts: Auth0ProviderOptions): JSX.Element => {
     })();
   }, [client, onRedirectCallback, skipRedirectCallback]);
 
-  const buildAuthorizeUrl = useCallback(
-    (opts?: RedirectLoginOptions): Promise<string> =>
-      client.buildAuthorizeUrl(toAuth0LoginRedirectOptions(opts)),
-    [client]
-  );
-
-  const buildLogoutUrl = useCallback(
-    (opts?: LogoutUrlOptions): string => client.buildLogoutUrl(opts),
-    [client]
-  );
-
   const loginWithRedirect = useCallback(
     (opts?: RedirectLoginOptions): Promise<void> =>
-      client.loginWithRedirect(toAuth0LoginRedirectOptions(opts)),
+      client.loginWithRedirect(opts),
     [client]
   );
 
@@ -303,15 +187,11 @@ const Auth0Provider = (opts: Auth0ProviderOptions): JSX.Element => {
   );
 
   const logout = useCallback(
-    (opts: LogoutOptions = {}): Promise<void> | void => {
-      const maybePromise = client.logout(opts);
-      if (opts.localOnly) {
-        if (maybePromise && typeof maybePromise.then === 'function') {
-          return maybePromise.then(() => dispatch({ type: 'LOGOUT' }));
-        }
+    async (opts: LogoutOptions = {}): Promise<void> => {
+      await client.logout(opts);
+      if (opts.openUrl || opts.openUrl === false) {
         dispatch({ type: 'LOGOUT' });
       }
-      return maybePromise;
     },
     [client]
   );
@@ -339,7 +219,7 @@ const Auth0Provider = (opts: Auth0ProviderOptions): JSX.Element => {
     async (
       opts?: GetTokenWithPopupOptions,
       config?: PopupConfigOptions
-    ): Promise<string> => {
+    ): Promise<string | undefined> => {
       let token;
       try {
         token = await client.getTokenWithPopup(opts, config);
@@ -357,7 +237,7 @@ const Auth0Provider = (opts: Auth0ProviderOptions): JSX.Element => {
   );
 
   const getIdTokenClaims = useCallback(
-    (opts) => client.getIdTokenClaims(opts),
+    () => client.getIdTokenClaims(),
     [client]
   );
 
@@ -380,8 +260,6 @@ const Auth0Provider = (opts: Auth0ProviderOptions): JSX.Element => {
   const contextValue = useMemo(() => {
     return {
       ...state,
-      buildAuthorizeUrl,
-      buildLogoutUrl,
       getAccessTokenSilently,
       getAccessTokenWithPopup,
       getIdTokenClaims,
@@ -392,8 +270,6 @@ const Auth0Provider = (opts: Auth0ProviderOptions): JSX.Element => {
     };
   }, [
     state,
-    buildAuthorizeUrl,
-    buildLogoutUrl,
     getAccessTokenSilently,
     getAccessTokenWithPopup,
     getIdTokenClaims,
@@ -403,11 +279,7 @@ const Auth0Provider = (opts: Auth0ProviderOptions): JSX.Element => {
     handleRedirectCallback,
   ]);
 
-  return (
-    <Auth0Context.Provider value={contextValue}>
-      {children}
-    </Auth0Context.Provider>
-  );
+  return <context.Provider value={contextValue}>{children}</context.Provider>;
 };
 
 export default Auth0Provider;

package/src/index.tsx

@@ -12,14 +12,15 @@ export {
 export {
   default as Auth0Context,
   Auth0ContextInterface,
+  initialContext,
+  LogoutOptions,
   RedirectLoginOptions,
 } from './auth0-context';
 export {
+  AuthorizationParams,
   PopupLoginOptions,
   PopupConfigOptions,
-  GetIdTokenClaimsOptions,
   GetTokenWithPopupOptions,
-  LogoutOptions,
   LogoutUrlOptions,
   CacheLocation,
   GetTokenSilentlyOptions,

package/src/reducer.tsx

@@ -35,7 +35,7 @@ export const reducer = (state: AuthState, action: Action): AuthState => {
       };
     case 'HANDLE_REDIRECT_COMPLETE':
     case 'GET_ACCESS_TOKEN_COMPLETE':
-      if (state.user?.updated_at === action.user?.updated_at) {
+      if (state.user === action.user) {
         return state;
       }
       return {