@auth0/auth0-react 1.8.0 → 1.10.1

package/dist/reducer.d.ts

@@ -14,6 +14,6 @@ declare type Action = {
 /**
  * Handles how that state changes in the `useAuth0` hook.
  */
-export declare const reducer: (state: AuthState<User>, action: Action) => AuthState<User>;
+export declare const reducer: (state: AuthState, action: Action) => AuthState;
 export {};
 //# sourceMappingURL=reducer.d.ts.map

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,6DAuCnB,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,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"}

package/dist/utils.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../src/utils.tsx"],"names":[],"mappings":"AAMA,eAAO,MAAM,aAAa,oCAEG,CAAC;AAc9B,eAAO,MAAM,UAAU;;;wCAAmC,CAAC;AAE3D,eAAO,MAAM,UAAU;;;wCAA8C,CAAC"}
+{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../src/utils.tsx"],"names":[],"mappings":"AAMA,eAAO,MAAM,aAAa,6BAA4C,OAEzC,CAAC;AAc9B,eAAO,MAAM,UAAU;WAXG,MAAM;;mCAC7B,KAUuD,CAAC;AAE3D,eAAO,MAAM,UAAU;WAbG,MAAM;;mCAC7B,KAYkE,CAAC"}

package/dist/with-auth0.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { ComponentType } from 'react';
 import { Auth0ContextInterface } from './auth0-context';
 /**
  * Components wrapped in `withAuth0` will have an additional `auth0` prop
@@ -21,6 +21,6 @@ export interface WithAuth0Props {
  *
  * Wrap your class components in this Higher Order Component to give them access to the Auth0Context
  */
-declare const withAuth0: <P extends WithAuth0Props>(Component: React.ComponentType<P>) => React.ComponentType<Pick<P, Exclude<keyof P, "auth0">>>;
+declare const withAuth0: <P extends WithAuth0Props>(Component: React.ComponentType<P>) => 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,KAAwB,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,0HAQd,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;;;;;;;;;;;;;;GAcG;AACH,QAAA,MAAM,SAAS,wGAYd,CAAC;AAEF,eAAe,SAAS,CAAC"}

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

@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { ComponentType, FC } from 'react';
 import { RedirectLoginOptions, User } from '@auth0/auth0-spa-js';
 /**
  * Options for the withAuthenticationRequired Higher Order Component

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,KAAuC,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,mHA2C/B,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;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"}

package/package.json

@@ -1,7 +1,7 @@
 {
   "author": "Auth0",
   "name": "@auth0/auth0-react",
-  "version": "1.8.0",
+  "version": "1.10.1",
   "description": "Auth0 SDK for React Single Page Applications (SPA)",
   "keywords": [
     "auth0",
@@ -26,7 +26,7 @@
     "test": "jest --coverage",
     "prepack": "npm run build",
     "docs": "typedoc --options typedoc.js src",
-    "install:examples": "npm i --prefix=examples/cra-react-router --no-package-lock && npm i --prefix=examples/gatsby-app --no-package-lock && npm i --prefix=examples/nextjs-app --no-package-lock && npm ci --prefix=examples/users-api",
+    "install:examples": "npm i --prefix=examples/cra-react-router --no-package-lock && npm i --prefix=examples/gatsby-app --no-package-lock --legacy-peer-deps && npm i --prefix=examples/nextjs-app --no-package-lock --legacy-peer-deps && npm ci --prefix=examples/users-api",
     "start:cra": "npm start --prefix=examples/cra-react-router",
     "start:gatsby": "npm start --prefix=examples/gatsby-app",
     "start:nextjs": "npm run dev --prefix=examples/nextjs-app",
@@ -52,49 +52,49 @@
   },
   "homepage": "https://github.com/auth0/auth0-react#readme",
   "devDependencies": {
-    "@rollup/plugin-node-resolve": "^7.1.3",
-    "@rollup/plugin-replace": "^2.3.2",
-    "@testing-library/jest-dom": "^5.5.0",
-    "@testing-library/react": "^10.0.4",
-    "@testing-library/react-hooks": "^3.2.1",
-    "@types/jest": "^25.2.1",
-    "@types/react": "^16.9.34",
-    "@types/react-dom": "^16.9.6",
-    "@typescript-eslint/eslint-plugin": "^2.30.0",
-    "@typescript-eslint/parser": "^2.30.0",
-    "browserstack-cypress-cli": "^1.8.1",
-    "codecov": "^3.7.2",
-    "cypress": "^7.2.0",
-    "eslint": "^6.8.0",
-    "eslint-plugin-react": "^7.19.0",
-    "eslint-plugin-react-hooks": "^4.0.0",
+    "@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",
+    "@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",
+    "codecov": "^3.8.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": "^26.6.3",
-    "jest-junit": "^10.0.0",
-    "oidc-provider": "^7.6.0",
-    "prettier": "2.0.5",
-    "pretty-quick": "^2.0.1",
-    "react": "^16.14.0",
-    "react-dom": "^16.14.0",
-    "react-test-renderer": "^16.13.1",
-    "rollup": "^2.7.2",
-    "rollup-plugin-analyzer": "^3.3.0",
-    "rollup-plugin-delete": "^1.2.0",
+    "jest": "^27.5.1",
+    "jest-junit": "^13.0.0",
+    "oidc-provider": "^7.10.6",
+    "prettier": "2.6.2",
+    "pretty-quick": "^3.1.3",
+    "react": "^18.0.0",
+    "react-dom": "^18.0.0",
+    "react-test-renderer": "^18.0.0",
+    "rollup": "^2.70.1",
+    "rollup-plugin-analyzer": "^4.0.0",
+    "rollup-plugin-delete": "^2.0.0",
     "rollup-plugin-dev": "^1.1.3",
-    "rollup-plugin-livereload": "^1.2.0",
-    "rollup-plugin-peer-deps-external": "^2.2.2",
-    "rollup-plugin-serve": "^1.0.1",
-    "rollup-plugin-terser": "^7.0.0",
-    "rollup-plugin-typescript2": "^0.27.0",
-    "start-server-and-test": "^1.11.0",
-    "ts-jest": "^26.5.0",
-    "tslib": "^1.11.1",
-    "typedoc": "^0.20.32",
-    "typescript": "^3.8.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"
   },
   "peerDependencies": {
-    "react": "^16.11.0 || ^17",
-    "react-dom": "^16.11.0 || ^17"
+    "react": "^16.11.0 || ^17 || ^18",
+    "react-dom": "^16.11.0 || ^17 || ^18"
   },
   "husky": {
     "hooks": {
@@ -102,6 +102,6 @@
     }
   },
   "dependencies": {
-    "@auth0/auth0-spa-js": "^1.18.0"
+    "@auth0/auth0-spa-js": "^1.21.0"
   }
 }

package/src/auth0-context.tsx

@@ -11,6 +11,7 @@ import {
   RedirectLoginOptions as Auth0RedirectLoginOptions,
   RedirectLoginResult,
   User,
+  GetTokenSilentlyVerboseResponse,
 } from '@auth0/auth0-spa-js';
 import { createContext } from 'react';
 import { AuthState, initialAuthState } from './auth-state';
@@ -64,9 +65,15 @@ export interface Auth0ContextInterface<TUser extends User = User>
    * Note that in all cases, falling back to an iframe requires access to
    * the `auth0` cookie.
    */
-  getAccessTokenSilently: (
-    options?: GetTokenSilentlyOptions
-  ) => Promise<string>;
+  getAccessTokenSilently: {
+    (options: GetTokenSilentlyOptions & { detailedResponse: true }): Promise<
+      GetTokenSilentlyVerboseResponse
+    >;
+    (options?: GetTokenSilentlyOptions): Promise<string>;
+    (options: GetTokenSilentlyOptions): Promise<
+      GetTokenSilentlyVerboseResponse | string
+    >;
+  };
 
   /**
    * ```js
@@ -92,7 +99,9 @@ export interface Auth0ContextInterface<TUser extends User = User>
    *
    * Returns all claims from the id_token if available.
    */
-  getIdTokenClaims: (options?: GetIdTokenClaimsOptions) => Promise<IdToken>;
+  getIdTokenClaims: (
+    options?: GetIdTokenClaimsOptions
+  ) => Promise<IdToken | undefined>;
 
   /**
    * ```js

package/src/auth0-provider.tsx

@@ -1,19 +1,24 @@
-import React, { useCallback, useEffect, useReducer, useState } from 'react';
+import React, {
+  useCallback,
+  useEffect,
+  useMemo,
+  useReducer,
+  useRef,
+  useState,
+} from 'react';
 import {
   Auth0Client,
   Auth0ClientOptions,
   CacheLocation,
-  IdToken,
   LogoutOptions,
   LogoutUrlOptions,
   PopupLoginOptions,
   PopupConfigOptions,
   RedirectLoginOptions as Auth0RedirectLoginOptions,
   GetTokenWithPopupOptions,
-  GetTokenSilentlyOptions,
-  GetIdTokenClaimsOptions,
   RedirectLoginResult,
   ICache,
+  GetTokenSilentlyOptions,
 } from '@auth0/auth0-spa-js';
 import Auth0Context, { RedirectLoginOptions } from './auth0-context';
 import { hasAuthParams, loginError, tokenError } from './utils';
@@ -41,7 +46,7 @@ export interface Auth0ProviderOptions {
    * It uses `window.history` but you might want to overwrite this if you are using a custom router, like `react-router-dom`
    * See the EXAMPLES.md for more info.
    */
-  onRedirectCallback?: (appState: AppState) => void;
+  onRedirectCallback?: (appState?: AppState) => void;
   /**
    * By default, if the page url has code/state params, the SDK will treat them as Auth0's and attempt to exchange the
    * code for a token. In some cases the code might be for something else (another OAuth SDK perhaps). In these
@@ -148,6 +153,12 @@ export interface Auth0ProviderOptions {
    * 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.
+   */
+  connection?: string;
   /**
    * If you need to send custom parameters to the Authorization Server,
    * make sure to use the original parameter name.
@@ -230,8 +241,13 @@ const Auth0Provider = (opts: Auth0ProviderOptions): JSX.Element => {
     () => new Auth0Client(toAuth0ClientOptions(clientOpts))
   );
   const [state, dispatch] = useReducer(reducer, initialAuthState);
+  const didInitialise = useRef(false);
 
   useEffect(() => {
+    if (didInitialise.current) {
+      return;
+    }
+    didInitialise.current = true;
     (async (): Promise<void> => {
       try {
         if (hasAuthParams() && !skipRedirectCallback) {
@@ -298,7 +314,8 @@ const Auth0Provider = (opts: Auth0ProviderOptions): JSX.Element => {
   );
 
   const getAccessTokenSilently = useCallback(
-    async (opts?: GetTokenSilentlyOptions): Promise<string> => {
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    async (opts?: GetTokenSilentlyOptions): Promise<any> => {
       let token;
       try {
         token = await client.getTokenSilently(opts);
@@ -337,8 +354,7 @@ const Auth0Provider = (opts: Auth0ProviderOptions): JSX.Element => {
   );
 
   const getIdTokenClaims = useCallback(
-    (opts?: GetIdTokenClaimsOptions): Promise<IdToken> =>
-      client.getIdTokenClaims(opts),
+    (opts) => client.getIdTokenClaims(opts),
     [client]
   );
 
@@ -358,21 +374,34 @@ const Auth0Provider = (opts: Auth0ProviderOptions): JSX.Element => {
     [client]
   );
 
+  const contextValue = useMemo(() => {
+    return {
+      ...state,
+      buildAuthorizeUrl,
+      buildLogoutUrl,
+      getAccessTokenSilently,
+      getAccessTokenWithPopup,
+      getIdTokenClaims,
+      loginWithRedirect,
+      loginWithPopup,
+      logout,
+      handleRedirectCallback,
+    };
+  }, [
+    state,
+    buildAuthorizeUrl,
+    buildLogoutUrl,
+    getAccessTokenSilently,
+    getAccessTokenWithPopup,
+    getIdTokenClaims,
+    loginWithRedirect,
+    loginWithPopup,
+    logout,
+    handleRedirectCallback,
+  ]);
+
   return (
-    <Auth0Context.Provider
-      value={{
-        ...state,
-        buildAuthorizeUrl,
-        buildLogoutUrl,
-        getAccessTokenSilently,
-        getAccessTokenWithPopup,
-        getIdTokenClaims,
-        loginWithRedirect,
-        loginWithPopup,
-        logout,
-        handleRedirectCallback,
-      }}
-    >
+    <Auth0Context.Provider value={contextValue}>
       {children}
     </Auth0Context.Provider>
   );

package/src/with-auth0.tsx

@@ -25,12 +25,16 @@ export interface WithAuth0Props {
  */
 const withAuth0 = <P extends WithAuth0Props>(
   Component: ComponentType<P>
-): ComponentType<Omit<P, keyof WithAuth0Props>> => (props): JSX.Element => (
-  <Auth0Context.Consumer>
-    {(auth: Auth0ContextInterface): JSX.Element => (
-      <Component auth0={auth} {...(props as P)} />
-    )}
-  </Auth0Context.Consumer>
-);
+): ComponentType<Omit<P, keyof WithAuth0Props>> => {
+  return function WithAuth(props): JSX.Element {
+    return (
+      <Auth0Context.Consumer>
+        {(auth: Auth0ContextInterface): JSX.Element => (
+          <Component {...(props as P)} auth0={auth} />
+        )}
+      </Auth0Context.Consumer>
+    );
+  };
+};
 
 export default withAuth0;

package/src/with-authentication-required.tsx

@@ -84,8 +84,8 @@ const withAuthenticationRequired = <P extends object>(
     const {
       returnTo = defaultReturnTo,
       onRedirecting = defaultOnRedirecting,
-      loginOptions = {},
       claimCheck = (): boolean => true,
+      loginOptions,
     } = options;
 
     /**
@@ -101,7 +101,7 @@ const withAuthenticationRequired = <P extends object>(
       const opts = {
         ...loginOptions,
         appState: {
-          ...loginOptions.appState,
+          ...(loginOptions && loginOptions.appState),
           returnTo: typeof returnTo === 'function' ? returnTo() : returnTo,
         },
       };