@witsauth/react-client 1.0.0 → 1.2.0

package/README.md

@@ -17,6 +17,9 @@ pnpm add @witsauth/react-client
 - Hooks (`useAuth`) for accessing user session state securely.
 - Built-in Axios interceptors for automatic Bearer token injection.
 - Seamless integration with Witsauth Console.
+- Automatic Token Refresh with configurable thresholds.
+- Configurable Storage (localStorage, sessionStorage, or custom).
+- Flexible Routing Redirects for login and logout.
 
 ## Setup
 
@@ -49,6 +52,32 @@ function App() {
 }
 ```
 
+## Configuration Options
+
+```typescript
+interface OAuth2Config {
+  clientId: string;                    // OAuth2 Client ID
+  authorizationEndpoint: string;       // Authorization endpoint URL
+  tokenEndpoint: string;               // Token endpoint URL
+  redirectUri: string;                 // Redirect URI for callback
+  revokeEndpoint?: string;             // Token revocation endpoint (optional)
+  userInfoEndpoint?: string;           // OIDC UserInfo endpoint (optional)
+  audience?: string;                   // OAuth2 audience parameter (optional)
+  scope?: string;                      // OAuth2 scope parameter
+  responseType?: string;               // Response type (default: 'code')
+  codeChallengeMethod?: 'S256';        // PKCE method (default: 'S256')
+  storage?: 'localStorage' | 'sessionStorage' | 'custom'; // Storage strategy
+  customStorage?: OAuth2Storage;       // Custom storage implementation
+  autoRefresh?: boolean;               // Enable auto token refresh (default: true)
+  refreshThreshold?: number;           // Seconds before expiry to refresh (default: 60)
+  logLevel?: 'none' | 'error' | 'warn' | 'info' | 'debug'; // Logging level
+  nonce?: string;                      // Custom nonce (optional)
+  redirectRoute?: string;              // Route to redirect to after login (optional)
+  logoutRedirectRoute?: string;        // Route to redirect to after logout (optional)
+  oAuthProvider?: 'witsauth' | string; // OAuth provider identifier
+}
+```
+
 ## Usage
 
 Use the `useAuth` hook to access user state and login/logout functions.
@@ -76,6 +105,50 @@ function Profile() {
 }
 ```
 
+## Advanced Usage
+
+### Custom Storage
+
+You can configure the library to use `sessionStorage` or provide your own custom storage implementation (e.g., for React Native).
+
+```typescript
+import { OAuth2Storage } from '@witsauth/react-client';
+
+class CustomStorage implements OAuth2Storage {
+  getItem(key: string): string | null {
+    // Your custom storage logic
+    return null;
+  }
+  
+  setItem(key: string, value: string): void {
+    // Your custom storage logic
+  }
+  
+  removeItem(key: string): void {
+    // Your custom storage logic
+  }
+}
+
+// Use in configuration
+const config = {
+  // ... other config
+  storage: 'custom',
+  customStorage: new CustomStorage()
+};
+```
+
+### Custom Redirect Routes For Login And Logout
+
+If you want the library to automatically redirect the user after a successful login or logout, you can configure the redirect routes. The library will use `window.location.assign` to perform a full page navigation.
+
+```typescript
+const authConfig = {
+  // ... other config
+  redirectRoute: '/dashboard',
+  logoutRedirectRoute: '/login'
+};
+```
+
 ## API Interceptors
 
 To automatically attach the Bearer token to your secure API requests, use the `setupAxiosInterceptors` helper.

package/dist/core/AuthClient.d.ts

@@ -4,11 +4,13 @@ export declare class AuthClient {
     private config;
     private storage;
     constructor(config: OAuth2Config, storage?: TokenStorage);
+    log(level: 'error' | 'warn' | 'info' | 'debug', ...args: any[]): void;
     startAuthorization(): Promise<void>;
     exchangeCodeForTokens(code: string, state: string): Promise<TokenInfo>;
     refreshAccessToken(): Promise<TokenInfo>;
     private saveTokenInfo;
     getAccessToken(): string | null;
+    getExpiresAt(): number | null;
     isAuthenticated(): boolean;
-    logout(): void;
+    logout(): Promise<void>;
 }

package/dist/core/storage.d.ts

@@ -1,5 +1,9 @@
+import { OAuth2Storage } from '../models/types';
 export declare class TokenStorage {
+    private storageType?;
+    private customStorage?;
     private memoryStorage;
+    constructor(storageType?: "localStorage" | "sessionStorage" | "custom" | undefined, customStorage?: OAuth2Storage | undefined);
     private getStorage;
     setItem(key: string, value: string): void;
     getItem(key: string): string | null;

package/dist/index.es.js

@@ -28,9 +28,18 @@ async function d(e) {
 //#endregion
 //#region src/core/storage.ts
 var f = class {
+	storageType;
+	customStorage;
 	memoryStorage = /* @__PURE__ */ new Map();
+	constructor(e, t) {
+		this.storageType = e, this.customStorage = t;
+	}
 	getStorage() {
-		if (typeof window < "u" && window.localStorage) return window.localStorage;
+		if (this.storageType === "custom" && this.customStorage) return this.customStorage;
+		if (typeof window < "u") {
+			if (this.storageType === "sessionStorage" && window.sessionStorage) return window.sessionStorage;
+			if ((!this.storageType || this.storageType === "localStorage") && window.localStorage) return window.localStorage;
+		}
 		let e = this.memoryStorage;
 		return {
 			getItem: (t) => e.has(t) ? e.get(t) : null,
@@ -42,11 +51,7 @@ var f = class {
 			},
 			clear: () => {
 				e.clear();
-			},
-			get length() {
-				return e.size;
-			},
-			key: (t) => Array.from(e.keys())[t] || null
+			}
 		};
 	}
 	setItem(e, t) {
@@ -70,16 +75,26 @@ var f = class {
 	config;
 	storage;
 	constructor(e, t) {
-		this.config = e, this.storage = t || new f();
+		this.config = e, this.storage = t || new f(e.storage, e.customStorage);
+	}
+	log(e, ...t) {
+		let n = {
+			none: 0,
+			error: 1,
+			warn: 2,
+			info: 3,
+			debug: 4
+		}, r = n[this.config.logLevel || "warn"] || 0, i = n[e] || 0;
+		i > 0 && r >= i && console[e](...t);
 	}
 	async startAuthorization() {
-		let e = l(), t = await d(e), n = u(), r = u();
+		let e = l(), t = await d(e), n = u(), r = this.config.nonce || u();
 		this.storage.setItem(c.CODE_VERIFIER, e), this.storage.setItem(c.STATE, n), this.storage.setItem(c.NONCE, r);
 		let i = new URLSearchParams({
 			client_id: this.config.clientId,
 			redirect_uri: this.config.redirectUri,
 			response_type: this.config.responseType || "code",
-			code_challenge_method: "S256",
+			code_challenge_method: this.config.codeChallengeMethod || "S256",
 			code_challenge: t,
 			state: n,
 			nonce: r
@@ -144,18 +159,33 @@ var f = class {
 	getAccessToken() {
 		return this.storage.getItem(c.ACCESS_TOKEN);
 	}
-	isAuthenticated() {
+	getExpiresAt() {
 		let e = this.storage.getItem(c.TOKEN_EXPIRES_AT);
-		return e ? Date.now() < parseInt(e, 10) - 3e4 && !!this.getAccessToken() : !1;
+		if (!e) return null;
+		let t = Number(e);
+		return Number.isFinite(t) ? t : null;
+	}
+	isAuthenticated() {
+		let e = this.getExpiresAt();
+		return e !== null && Date.now() < e - 3e4 && !!this.getAccessToken();
 	}
-	logout() {
-		this.storage.clearTokens(), this.storage.clearTemporary();
+	async logout() {
+		let e = this.getAccessToken();
+		if (this.storage.clearTokens(), this.storage.clearTemporary(), this.config.revokeEndpoint && e) try {
+			await fetch(this.config.revokeEndpoint, {
+				method: "POST",
+				headers: { "Content-Type": "application/x-www-form-urlencoded" },
+				body: new URLSearchParams({ token: e }).toString()
+			});
+		} catch (e) {
+			this.log("error", "Failed to revoke token during logout", e);
+		}
 	}
 }, m = e(null), h = ({ config: e, children: t }) => {
 	let [i, o] = a({
 		isAuthenticated: !1,
 		isLoading: !0
-	}), c = r(() => new p(e, new f()), [e]);
+	}), c = r(() => new p(e), [e]);
 	n(() => {
 		(async () => {
 			try {
@@ -182,29 +212,72 @@ var f = class {
 				});
 			}
 		})();
-	}, [c]);
+	}, [c]), n(() => {
+		if (e.autoRefresh === !1 || !i.isAuthenticated) return;
+		let t = !1, n = setInterval(async () => {
+			if (!t) try {
+				let n = c.getExpiresAt();
+				if (!n) return;
+				let r = (e.refreshThreshold ?? 60) * 1e3;
+				if (Date.now() >= n - r) {
+					t = !0;
+					try {
+						let e = await c.refreshAccessToken();
+						o((t) => ({
+							...t,
+							tokenInfo: e
+						}));
+					} catch {
+						u();
+					} finally {
+						t = !1;
+					}
+				}
+			} catch (e) {
+				c.log("error", "Auto-refresh error:", e);
+			}
+		}, 1e4);
+		return () => clearInterval(n);
+	}, [
+		e.autoRefresh,
+		e.refreshThreshold,
+		i.isAuthenticated,
+		c
+	]);
 	let l = async () => {
 		o((e) => ({
 			...e,
 			isLoading: !0
 		})), await c.startAuthorization();
-	}, u = () => {
-		c.logout(), o({
-			isAuthenticated: !1,
-			isLoading: !1
-		});
-	}, d = async (e, t) => {
+	}, u = async () => {
+		o((e) => ({
+			...e,
+			isLoading: !0
+		}));
+		try {
+			await c.logout();
+		} catch (e) {
+			c.log("error", "Logout error:", e);
+		} finally {
+			o({
+				isAuthenticated: !1,
+				isLoading: !1
+			}), e.logoutRedirectRoute && typeof window < "u" && window.location.assign(e.logoutRedirectRoute);
+		}
+	}, d = async (t, n) => {
 		o((e) => ({
 			...e,
 			isLoading: !0
 		}));
 		try {
-			let n = await c.exchangeCodeForTokens(e, t);
+			let r = await c.exchangeCodeForTokens(t, n);
 			return o({
 				isAuthenticated: !0,
 				isLoading: !1,
-				tokenInfo: n
-			}), n;
+				tokenInfo: r
+			}), e.redirectRoute && typeof window < "u" && setTimeout(() => {
+				window.location.assign(e.redirectRoute);
+			}, 0), r;
 		} catch (e) {
 			throw o({
 				isAuthenticated: !1,
@@ -212,7 +285,7 @@ var f = class {
 				error: e instanceof Error ? e.message : String(e)
 			}), e;
 		}
-	}, h = {
+	}, f = {
 		...i,
 		login: l,
 		logout: u,
@@ -220,7 +293,7 @@ var f = class {
 		client: c
 	};
 	return /* @__PURE__ */ s(m.Provider, {
-		value: h,
+		value: f,
 		children: t
 	});
 }, g = () => {

package/dist/index.umd.js

@@ -1 +1 @@
-(function(e,t){typeof exports==`object`&&typeof module<`u`?t(exports,require("react"),require("react/jsx-runtime")):typeof define==`function`&&define.amd?define([`exports`,`react`,`react/jsx-runtime`],t):(e=typeof globalThis<`u`?globalThis:e||self,t(e.WitsAuthReactClient={},e.React,e.react_jsx_runtime))})(this,function(e,t,n){Object.defineProperty(e,Symbol.toStringTag,{value:`Module`});var r=Object.create,i=Object.defineProperty,a=Object.getOwnPropertyDescriptor,o=Object.getOwnPropertyNames,s=Object.getPrototypeOf,c=Object.prototype.hasOwnProperty,l=(e,t,n,r)=>{if(t&&typeof t==`object`||typeof t==`function`)for(var s=o(t),l=0,u=s.length,d;l<u;l++)d=s[l],!c.call(e,d)&&d!==n&&i(e,d,{get:(e=>t[e]).bind(null,d),enumerable:!(r=a(t,d))||r.enumerable});return e};t=((e,t,n)=>(n=e==null?{}:r(s(e)),l(t||!e||!e.__esModule?i(n,`default`,{value:e,enumerable:!0}):n,e)))(t,1);var u={ACCESS_TOKEN:`witsauth_access_token`,REFRESH_TOKEN:`witsauth_refresh_token`,TOKEN_EXPIRES_AT:`witsauth_expires_at`,TOKEN_TYPE:`witsauth_token_type`,SCOPE:`witsauth_scope`,CODE_VERIFIER:`witsauth_code_verifier`,STATE:`witsauth_state`,NONCE:`witsauth_nonce`};function d(){let e=new Uint8Array(32);return crypto.getRandomValues(e),btoa(String.fromCharCode(...e)).replace(/\+/g,`-`).replace(/\//g,`_`).replace(/=/g,``)}function f(){let e=new Uint8Array(32);return crypto.getRandomValues(e),btoa(String.fromCharCode(...e)).replace(/\+/g,`-`).replace(/\//g,`_`).replace(/=/g,``)}async function p(e){let t=new TextEncoder().encode(e),n=await crypto.subtle.digest(`SHA-256`,t),r=new Uint8Array(n);return btoa(String.fromCharCode(...r)).replace(/\+/g,`-`).replace(/\//g,`_`).replace(/=/g,``)}var m=class{memoryStorage=new Map;getStorage(){if(typeof window<`u`&&window.localStorage)return window.localStorage;let e=this.memoryStorage;return{getItem:t=>e.has(t)?e.get(t):null,setItem:(t,n)=>{e.set(t,n)},removeItem:t=>{e.delete(t)},clear:()=>{e.clear()},get length(){return e.size},key:t=>Array.from(e.keys())[t]||null}}setItem(e,t){this.getStorage().setItem(e,t)}getItem(e){return this.getStorage().getItem(e)}removeItem(e){this.getStorage().removeItem(e)}clearTokens(){let e=this.getStorage();e.removeItem(u.ACCESS_TOKEN),e.removeItem(u.REFRESH_TOKEN),e.removeItem(u.TOKEN_EXPIRES_AT),e.removeItem(u.TOKEN_TYPE),e.removeItem(u.SCOPE)}clearTemporary(){let e=this.getStorage();e.removeItem(u.CODE_VERIFIER),e.removeItem(u.STATE),e.removeItem(u.NONCE)}},h=class{config;storage;constructor(e,t){this.config=e,this.storage=t||new m}async startAuthorization(){let e=d(),t=await p(e),n=f(),r=f();this.storage.setItem(u.CODE_VERIFIER,e),this.storage.setItem(u.STATE,n),this.storage.setItem(u.NONCE,r);let i=new URLSearchParams({client_id:this.config.clientId,redirect_uri:this.config.redirectUri,response_type:this.config.responseType||`code`,code_challenge_method:`S256`,code_challenge:t,state:n,nonce:r});this.config.scope&&i.append(`scope`,this.config.scope),this.config.audience&&i.append(`audience`,this.config.audience);let a=`${this.config.authorizationEndpoint}?${i.toString()}`;if(typeof window>`u`||!window.location)throw Error(`startAuthorization requires a browser environment to redirect the user.`);window.location.href=a}async exchangeCodeForTokens(e,t){let n=this.storage.getItem(u.STATE),r=this.storage.getItem(u.CODE_VERIFIER);if(t!==n)throw Error(`Invalid state parameter. Possible CSRF attack.`);if(!r)throw Error(`Code verifier missing from storage.`);let i=new URLSearchParams({grant_type:`authorization_code`,client_id:this.config.clientId,redirect_uri:this.config.redirectUri,code:e,code_verifier:r}),a=await fetch(this.config.tokenEndpoint,{method:`POST`,headers:{"Content-Type":`application/x-www-form-urlencoded`},body:i.toString()});if(!a.ok)throw Error(`Failed to exchange code for tokens`);let o=await a.json(),s={accessToken:o.access_token,refreshToken:o.refresh_token,tokenType:o.token_type||`Bearer`,expiresAt:Date.now()+o.expires_in*1e3,scope:o.scope,idToken:o.id_token};return this.saveTokenInfo(s),this.storage.clearTemporary(),s}async refreshAccessToken(){let e=this.storage.getItem(u.REFRESH_TOKEN);if(!e)throw Error(`No refresh token available`);let t=new URLSearchParams({grant_type:`refresh_token`,client_id:this.config.clientId,refresh_token:e}),n=await fetch(this.config.tokenEndpoint,{method:`POST`,headers:{"Content-Type":`application/x-www-form-urlencoded`},body:t.toString()});if(!n.ok)throw this.storage.clearTokens(),Error(`Failed to refresh token`);let r=await n.json(),i={accessToken:r.access_token,refreshToken:r.refresh_token||e,tokenType:r.token_type||`Bearer`,expiresAt:Date.now()+r.expires_in*1e3,scope:r.scope,idToken:r.id_token};return this.saveTokenInfo(i),i}saveTokenInfo(e){this.storage.setItem(u.ACCESS_TOKEN,e.accessToken),this.storage.setItem(u.TOKEN_EXPIRES_AT,e.expiresAt.toString()),this.storage.setItem(u.TOKEN_TYPE,e.tokenType),e.refreshToken&&this.storage.setItem(u.REFRESH_TOKEN,e.refreshToken),e.scope&&this.storage.setItem(u.SCOPE,e.scope)}getAccessToken(){return this.storage.getItem(u.ACCESS_TOKEN)}isAuthenticated(){let e=this.storage.getItem(u.TOKEN_EXPIRES_AT);return e?Date.now()<parseInt(e,10)-3e4&&!!this.getAccessToken():!1}logout(){this.storage.clearTokens(),this.storage.clearTemporary()}},g=(0,t.createContext)(null),_=({config:e,children:r})=>{let[i,a]=(0,t.useState)({isAuthenticated:!1,isLoading:!0}),o=(0,t.useMemo)(()=>new h(e,new m),[e]);(0,t.useEffect)(()=>{(async()=>{try{if(o.isAuthenticated())a({isAuthenticated:!0,isLoading:!1});else try{await o.refreshAccessToken(),a({isAuthenticated:!0,isLoading:!1})}catch{a({isAuthenticated:!1,isLoading:!1})}}catch(e){a({isAuthenticated:!1,isLoading:!1,error:e instanceof Error?e.message:String(e)})}})()},[o]);let s=async()=>{a(e=>({...e,isLoading:!0})),await o.startAuthorization()},c=()=>{o.logout(),a({isAuthenticated:!1,isLoading:!1})},l=async(e,t)=>{a(e=>({...e,isLoading:!0}));try{let n=await o.exchangeCodeForTokens(e,t);return a({isAuthenticated:!0,isLoading:!1,tokenInfo:n}),n}catch(e){throw a({isAuthenticated:!1,isLoading:!1,error:e instanceof Error?e.message:String(e)}),e}},u={...i,login:s,logout:c,handleCallback:l,client:o};return(0,n.jsx)(g.Provider,{value:u,children:r})},v=()=>{let e=(0,t.useContext)(g);if(!e)throw Error(`useAuth must be used within an AuthProvider`);return e},y=({onSuccess:e,onError:r,loadingComponent:i=(0,n.jsx)(`div`,{children:`Processing authentication...`})})=>{let{handleCallback:a}=v(),o=(0,t.useRef)(!1);return(0,t.useEffect)(()=>{o.current||(o.current=!0,(async()=>{let t=new URLSearchParams(window.location.search),n=new URLSearchParams(window.location.hash.substring(1)),i=t.get(`code`)||n.get(`code`),o=t.get(`state`)||n.get(`state`),s=t.get(`error`)||n.get(`error`);if(s){let e=Error(`OAuth Error: ${s}`);r&&r(e);return}if(i&&o)try{await a(i,o),e&&e()}catch(e){r&&r(e instanceof Error?e:Error(String(e)))}})())},[a,e,r]),(0,n.jsx)(n.Fragment,{children:i})};function b(e,t){e.interceptors.request.use(e=>{let n=t.getAccessToken();return n&&e.headers&&(e.headers.Authorization=`Bearer ${n}`),e},e=>Promise.reject(e)),e.interceptors.response.use(e=>e,async n=>{let r=n.config;if(n.response?.status===401&&r&&!r._retry){r._retry=!0;try{let n=await t.refreshAccessToken();return r.headers&&(r.headers.Authorization=`Bearer ${n.accessToken}`),e(r)}catch(e){return t.logout(),Promise.reject(e)}}return Promise.reject(n)})}e.AuthCallback=y,e.AuthClient=h,e.AuthProvider=_,e.STORAGE_KEYS=u,e.TokenStorage=m,e.createCodeChallenge=p,e.generateCodeVerifier=d,e.generateState=f,e.setupAxiosInterceptors=b,e.useAuth=v});
+(function(e,t){typeof exports==`object`&&typeof module<`u`?t(exports,require("react"),require("react/jsx-runtime")):typeof define==`function`&&define.amd?define([`exports`,`react`,`react/jsx-runtime`],t):(e=typeof globalThis<`u`?globalThis:e||self,t(e.WitsAuthReactClient={},e.React,e.react_jsx_runtime))})(this,function(e,t,n){Object.defineProperty(e,Symbol.toStringTag,{value:`Module`});var r=Object.create,i=Object.defineProperty,a=Object.getOwnPropertyDescriptor,o=Object.getOwnPropertyNames,s=Object.getPrototypeOf,c=Object.prototype.hasOwnProperty,l=(e,t,n,r)=>{if(t&&typeof t==`object`||typeof t==`function`)for(var s=o(t),l=0,u=s.length,d;l<u;l++)d=s[l],!c.call(e,d)&&d!==n&&i(e,d,{get:(e=>t[e]).bind(null,d),enumerable:!(r=a(t,d))||r.enumerable});return e};t=((e,t,n)=>(n=e==null?{}:r(s(e)),l(t||!e||!e.__esModule?i(n,`default`,{value:e,enumerable:!0}):n,e)))(t,1);var u={ACCESS_TOKEN:`witsauth_access_token`,REFRESH_TOKEN:`witsauth_refresh_token`,TOKEN_EXPIRES_AT:`witsauth_expires_at`,TOKEN_TYPE:`witsauth_token_type`,SCOPE:`witsauth_scope`,CODE_VERIFIER:`witsauth_code_verifier`,STATE:`witsauth_state`,NONCE:`witsauth_nonce`};function d(){let e=new Uint8Array(32);return crypto.getRandomValues(e),btoa(String.fromCharCode(...e)).replace(/\+/g,`-`).replace(/\//g,`_`).replace(/=/g,``)}function f(){let e=new Uint8Array(32);return crypto.getRandomValues(e),btoa(String.fromCharCode(...e)).replace(/\+/g,`-`).replace(/\//g,`_`).replace(/=/g,``)}async function p(e){let t=new TextEncoder().encode(e),n=await crypto.subtle.digest(`SHA-256`,t),r=new Uint8Array(n);return btoa(String.fromCharCode(...r)).replace(/\+/g,`-`).replace(/\//g,`_`).replace(/=/g,``)}var m=class{storageType;customStorage;memoryStorage=new Map;constructor(e,t){this.storageType=e,this.customStorage=t}getStorage(){if(this.storageType===`custom`&&this.customStorage)return this.customStorage;if(typeof window<`u`){if(this.storageType===`sessionStorage`&&window.sessionStorage)return window.sessionStorage;if((!this.storageType||this.storageType===`localStorage`)&&window.localStorage)return window.localStorage}let e=this.memoryStorage;return{getItem:t=>e.has(t)?e.get(t):null,setItem:(t,n)=>{e.set(t,n)},removeItem:t=>{e.delete(t)},clear:()=>{e.clear()}}}setItem(e,t){this.getStorage().setItem(e,t)}getItem(e){return this.getStorage().getItem(e)}removeItem(e){this.getStorage().removeItem(e)}clearTokens(){let e=this.getStorage();e.removeItem(u.ACCESS_TOKEN),e.removeItem(u.REFRESH_TOKEN),e.removeItem(u.TOKEN_EXPIRES_AT),e.removeItem(u.TOKEN_TYPE),e.removeItem(u.SCOPE)}clearTemporary(){let e=this.getStorage();e.removeItem(u.CODE_VERIFIER),e.removeItem(u.STATE),e.removeItem(u.NONCE)}},h=class{config;storage;constructor(e,t){this.config=e,this.storage=t||new m(e.storage,e.customStorage)}log(e,...t){let n={none:0,error:1,warn:2,info:3,debug:4},r=n[this.config.logLevel||`warn`]||0,i=n[e]||0;i>0&&r>=i&&console[e](...t)}async startAuthorization(){let e=d(),t=await p(e),n=f(),r=this.config.nonce||f();this.storage.setItem(u.CODE_VERIFIER,e),this.storage.setItem(u.STATE,n),this.storage.setItem(u.NONCE,r);let i=new URLSearchParams({client_id:this.config.clientId,redirect_uri:this.config.redirectUri,response_type:this.config.responseType||`code`,code_challenge_method:this.config.codeChallengeMethod||`S256`,code_challenge:t,state:n,nonce:r});this.config.scope&&i.append(`scope`,this.config.scope),this.config.audience&&i.append(`audience`,this.config.audience);let a=`${this.config.authorizationEndpoint}?${i.toString()}`;if(typeof window>`u`||!window.location)throw Error(`startAuthorization requires a browser environment to redirect the user.`);window.location.href=a}async exchangeCodeForTokens(e,t){let n=this.storage.getItem(u.STATE),r=this.storage.getItem(u.CODE_VERIFIER);if(t!==n)throw Error(`Invalid state parameter. Possible CSRF attack.`);if(!r)throw Error(`Code verifier missing from storage.`);let i=new URLSearchParams({grant_type:`authorization_code`,client_id:this.config.clientId,redirect_uri:this.config.redirectUri,code:e,code_verifier:r}),a=await fetch(this.config.tokenEndpoint,{method:`POST`,headers:{"Content-Type":`application/x-www-form-urlencoded`},body:i.toString()});if(!a.ok)throw Error(`Failed to exchange code for tokens`);let o=await a.json(),s={accessToken:o.access_token,refreshToken:o.refresh_token,tokenType:o.token_type||`Bearer`,expiresAt:Date.now()+o.expires_in*1e3,scope:o.scope,idToken:o.id_token};return this.saveTokenInfo(s),this.storage.clearTemporary(),s}async refreshAccessToken(){let e=this.storage.getItem(u.REFRESH_TOKEN);if(!e)throw Error(`No refresh token available`);let t=new URLSearchParams({grant_type:`refresh_token`,client_id:this.config.clientId,refresh_token:e}),n=await fetch(this.config.tokenEndpoint,{method:`POST`,headers:{"Content-Type":`application/x-www-form-urlencoded`},body:t.toString()});if(!n.ok)throw this.storage.clearTokens(),Error(`Failed to refresh token`);let r=await n.json(),i={accessToken:r.access_token,refreshToken:r.refresh_token||e,tokenType:r.token_type||`Bearer`,expiresAt:Date.now()+r.expires_in*1e3,scope:r.scope,idToken:r.id_token};return this.saveTokenInfo(i),i}saveTokenInfo(e){this.storage.setItem(u.ACCESS_TOKEN,e.accessToken),this.storage.setItem(u.TOKEN_EXPIRES_AT,e.expiresAt.toString()),this.storage.setItem(u.TOKEN_TYPE,e.tokenType),e.refreshToken&&this.storage.setItem(u.REFRESH_TOKEN,e.refreshToken),e.scope&&this.storage.setItem(u.SCOPE,e.scope)}getAccessToken(){return this.storage.getItem(u.ACCESS_TOKEN)}getExpiresAt(){let e=this.storage.getItem(u.TOKEN_EXPIRES_AT);if(!e)return null;let t=Number(e);return Number.isFinite(t)?t:null}isAuthenticated(){let e=this.getExpiresAt();return e!==null&&Date.now()<e-3e4&&!!this.getAccessToken()}async logout(){let e=this.getAccessToken();if(this.storage.clearTokens(),this.storage.clearTemporary(),this.config.revokeEndpoint&&e)try{await fetch(this.config.revokeEndpoint,{method:`POST`,headers:{"Content-Type":`application/x-www-form-urlencoded`},body:new URLSearchParams({token:e}).toString()})}catch(e){this.log(`error`,`Failed to revoke token during logout`,e)}}},g=(0,t.createContext)(null),_=({config:e,children:r})=>{let[i,a]=(0,t.useState)({isAuthenticated:!1,isLoading:!0}),o=(0,t.useMemo)(()=>new h(e),[e]);(0,t.useEffect)(()=>{(async()=>{try{if(o.isAuthenticated())a({isAuthenticated:!0,isLoading:!1});else try{await o.refreshAccessToken(),a({isAuthenticated:!0,isLoading:!1})}catch{a({isAuthenticated:!1,isLoading:!1})}}catch(e){a({isAuthenticated:!1,isLoading:!1,error:e instanceof Error?e.message:String(e)})}})()},[o]),(0,t.useEffect)(()=>{if(e.autoRefresh===!1||!i.isAuthenticated)return;let t=!1,n=setInterval(async()=>{if(!t)try{let n=o.getExpiresAt();if(!n)return;let r=(e.refreshThreshold??60)*1e3;if(Date.now()>=n-r){t=!0;try{let e=await o.refreshAccessToken();a(t=>({...t,tokenInfo:e}))}catch{c()}finally{t=!1}}}catch(e){o.log(`error`,`Auto-refresh error:`,e)}},1e4);return()=>clearInterval(n)},[e.autoRefresh,e.refreshThreshold,i.isAuthenticated,o]);let s=async()=>{a(e=>({...e,isLoading:!0})),await o.startAuthorization()},c=async()=>{a(e=>({...e,isLoading:!0}));try{await o.logout()}catch(e){o.log(`error`,`Logout error:`,e)}finally{a({isAuthenticated:!1,isLoading:!1}),e.logoutRedirectRoute&&typeof window<`u`&&window.location.assign(e.logoutRedirectRoute)}},l=async(t,n)=>{a(e=>({...e,isLoading:!0}));try{let r=await o.exchangeCodeForTokens(t,n);return a({isAuthenticated:!0,isLoading:!1,tokenInfo:r}),e.redirectRoute&&typeof window<`u`&&setTimeout(()=>{window.location.assign(e.redirectRoute)},0),r}catch(e){throw a({isAuthenticated:!1,isLoading:!1,error:e instanceof Error?e.message:String(e)}),e}},u={...i,login:s,logout:c,handleCallback:l,client:o};return(0,n.jsx)(g.Provider,{value:u,children:r})},v=()=>{let e=(0,t.useContext)(g);if(!e)throw Error(`useAuth must be used within an AuthProvider`);return e},y=({onSuccess:e,onError:r,loadingComponent:i=(0,n.jsx)(`div`,{children:`Processing authentication...`})})=>{let{handleCallback:a}=v(),o=(0,t.useRef)(!1);return(0,t.useEffect)(()=>{o.current||(o.current=!0,(async()=>{let t=new URLSearchParams(window.location.search),n=new URLSearchParams(window.location.hash.substring(1)),i=t.get(`code`)||n.get(`code`),o=t.get(`state`)||n.get(`state`),s=t.get(`error`)||n.get(`error`);if(s){let e=Error(`OAuth Error: ${s}`);r&&r(e);return}if(i&&o)try{await a(i,o),e&&e()}catch(e){r&&r(e instanceof Error?e:Error(String(e)))}})())},[a,e,r]),(0,n.jsx)(n.Fragment,{children:i})};function b(e,t){e.interceptors.request.use(e=>{let n=t.getAccessToken();return n&&e.headers&&(e.headers.Authorization=`Bearer ${n}`),e},e=>Promise.reject(e)),e.interceptors.response.use(e=>e,async n=>{let r=n.config;if(n.response?.status===401&&r&&!r._retry){r._retry=!0;try{let n=await t.refreshAccessToken();return r.headers&&(r.headers.Authorization=`Bearer ${n.accessToken}`),e(r)}catch(e){return t.logout(),Promise.reject(e)}}return Promise.reject(n)})}e.AuthCallback=y,e.AuthClient=h,e.AuthProvider=_,e.STORAGE_KEYS=u,e.TokenStorage=m,e.createCodeChallenge=p,e.generateCodeVerifier=d,e.generateState=f,e.setupAxiosInterceptors=b,e.useAuth=v});

package/dist/models/types.d.ts

@@ -1,14 +1,28 @@
+export interface OAuth2Storage {
+    getItem(key: string): string | null;
+    setItem(key: string, value: string): void;
+    removeItem(key: string): void;
+    clear?(): void;
+}
 export interface OAuth2Config {
     clientId: string;
     authorizationEndpoint: string;
     tokenEndpoint: string;
     redirectUri: string;
+    revokeEndpoint?: string;
     userInfoEndpoint?: string;
     scope?: string;
     audience?: string;
     responseType?: string;
+    codeChallengeMethod?: 'S256';
+    storage?: 'localStorage' | 'sessionStorage' | 'custom';
+    customStorage?: OAuth2Storage;
     autoRefresh?: boolean;
     refreshThreshold?: number;
+    logLevel?: 'none' | 'error' | 'warn' | 'info' | 'debug';
+    nonce?: string;
+    redirectRoute?: string;
+    logoutRedirectRoute?: string;
     oAuthProvider?: 'witsauth' | string;
 }
 export interface TokenInfo {

package/dist/react/AuthContext.d.ts

@@ -3,7 +3,7 @@ import { OAuth2Config, AuthState, TokenInfo } from '../models/types';
 import { AuthClient } from '../core/AuthClient';
 interface AuthContextValue extends AuthState {
     login: () => Promise<void>;
-    logout: () => void;
+    logout: () => Promise<void>;
     client: AuthClient;
     handleCallback: (code: string, state: string) => Promise<TokenInfo>;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@witsauth/react-client",
-  "version": "1.0.0",
+  "version": "1.2.0",
   "description": "Official React client library for integrating Witsauth Single Sign-On (SSO) authentication or similar services into your React applications.",
   "main": "./dist/index.umd.js",
   "module": "./dist/index.es.js",