@armco/iam-client 0.1.1

package/dist/react.mjs

@@ -0,0 +1,649 @@
+// src/react/index.tsx
+import {
+  createContext,
+  useContext,
+  useState,
+  useEffect,
+  useCallback,
+  useMemo
+} from "react";
+
+// src/utils.ts
+function generateRandomString(length = 32) {
+  const array = new Uint8Array(length);
+  crypto.getRandomValues(array);
+  return Array.from(array, (byte) => byte.toString(16).padStart(2, "0")).join("");
+}
+function generateCodeVerifier() {
+  const array = new Uint8Array(32);
+  crypto.getRandomValues(array);
+  return base64UrlEncode(array);
+}
+async function generateCodeChallenge(verifier) {
+  const encoder = new TextEncoder();
+  const data = encoder.encode(verifier);
+  const digest = await crypto.subtle.digest("SHA-256", data);
+  return base64UrlEncode(new Uint8Array(digest));
+}
+function base64UrlEncode(buffer) {
+  let binary = "";
+  for (let i = 0; i < buffer.length; i++) {
+    binary += String.fromCharCode(buffer[i]);
+  }
+  return btoa(binary).replace(/\+/g, "-").replace(/\//g, "_").replace(/=+$/, "");
+}
+function decodeJwtPayload(token) {
+  try {
+    const parts = token.split(".");
+    if (parts.length !== 3) return null;
+    const payload = parts[1];
+    const decoded = atob(payload.replace(/-/g, "+").replace(/_/g, "/"));
+    return JSON.parse(decoded);
+  } catch {
+    return null;
+  }
+}
+function isTokenExpired(token, thresholdSeconds = 0) {
+  const payload = decodeJwtPayload(token);
+  if (!payload?.exp) return true;
+  const now = Math.floor(Date.now() / 1e3);
+  return payload.exp - thresholdSeconds <= now;
+}
+function parseUrlParams(url) {
+  const params = {};
+  const hashIndex = url.indexOf("#");
+  const queryIndex = url.indexOf("?");
+  let paramString = "";
+  if (hashIndex !== -1) {
+    paramString = url.substring(hashIndex + 1);
+  } else if (queryIndex !== -1) {
+    paramString = url.substring(queryIndex + 1);
+  }
+  if (!paramString) return params;
+  const searchParams = new URLSearchParams(paramString);
+  searchParams.forEach((value, key) => {
+    params[key] = value;
+  });
+  return params;
+}
+function buildUrl(base, params) {
+  const url = new URL(base);
+  Object.entries(params).forEach(([key, value]) => {
+    if (value !== void 0 && value !== null) {
+      url.searchParams.append(key, value);
+    }
+  });
+  return url.toString();
+}
+
+// src/storage.ts
+var STORAGE_PREFIX = "stuffle_iam_";
+var LocalStorageAdapter = class {
+  get(key) {
+    try {
+      return localStorage.getItem(STORAGE_PREFIX + key);
+    } catch {
+      return null;
+    }
+  }
+  set(key, value) {
+    try {
+      localStorage.setItem(STORAGE_PREFIX + key, value);
+    } catch {
+      console.warn("LocalStorage not available");
+    }
+  }
+  remove(key) {
+    try {
+      localStorage.removeItem(STORAGE_PREFIX + key);
+    } catch {
+    }
+  }
+  clear() {
+    try {
+      Object.keys(localStorage).filter((k) => k.startsWith(STORAGE_PREFIX)).forEach((k) => localStorage.removeItem(k));
+    } catch {
+    }
+  }
+};
+var SessionStorageAdapter = class {
+  get(key) {
+    try {
+      return sessionStorage.getItem(STORAGE_PREFIX + key);
+    } catch {
+      return null;
+    }
+  }
+  set(key, value) {
+    try {
+      sessionStorage.setItem(STORAGE_PREFIX + key, value);
+    } catch {
+      console.warn("SessionStorage not available");
+    }
+  }
+  remove(key) {
+    try {
+      sessionStorage.removeItem(STORAGE_PREFIX + key);
+    } catch {
+    }
+  }
+  clear() {
+    try {
+      Object.keys(sessionStorage).filter((k) => k.startsWith(STORAGE_PREFIX)).forEach((k) => sessionStorage.removeItem(k));
+    } catch {
+    }
+  }
+};
+var MemoryStorageAdapter = class {
+  constructor() {
+    this.store = /* @__PURE__ */ new Map();
+  }
+  get(key) {
+    return this.store.get(key) ?? null;
+  }
+  set(key, value) {
+    this.store.set(key, value);
+  }
+  remove(key) {
+    this.store.delete(key);
+  }
+  clear() {
+    this.store.clear();
+  }
+};
+function getStorage(type) {
+  switch (type) {
+    case "localStorage":
+      return new LocalStorageAdapter();
+    case "sessionStorage":
+      return new SessionStorageAdapter();
+    case "memory":
+      return new MemoryStorageAdapter();
+    default:
+      return new SessionStorageAdapter();
+  }
+}
+
+// src/client.ts
+var STORAGE_KEYS = {
+  ACCESS_TOKEN: "access_token",
+  REFRESH_TOKEN: "refresh_token",
+  ID_TOKEN: "id_token",
+  CODE_VERIFIER: "code_verifier",
+  STATE: "state",
+  NONCE: "nonce",
+  USER: "user",
+  EXPIRES_AT: "expires_at"
+};
+var StuffleIAMClient = class {
+  constructor(config) {
+    this.discovery = null;
+    this.refreshTimer = null;
+    this.listeners = /* @__PURE__ */ new Set();
+    this.config = {
+      issuer: config.issuer.replace(/\/$/, ""),
+      // Remove trailing slash
+      clientId: config.clientId,
+      redirectUri: config.redirectUri,
+      scopes: config.scopes ?? ["openid", "profile", "email"],
+      postLogoutRedirectUri: config.postLogoutRedirectUri ?? config.redirectUri,
+      usePkce: config.usePkce ?? true,
+      storage: config.storage ?? "sessionStorage",
+      autoRefresh: config.autoRefresh ?? true,
+      refreshThreshold: config.refreshThreshold ?? 60
+    };
+    this.storage = getStorage(this.config.storage);
+  }
+  /**
+   * Fetch OIDC discovery document
+   */
+  async getDiscovery() {
+    if (this.discovery) return this.discovery;
+    const response = await fetch(
+      `${this.config.issuer}/.well-known/openid-configuration`
+    );
+    if (!response.ok) {
+      throw new Error(`Failed to fetch OIDC discovery: ${response.status}`);
+    }
+    this.discovery = await response.json();
+    return this.discovery;
+  }
+  /**
+   * Start login flow - redirects to authorization endpoint
+   */
+  async login(options = {}) {
+    const discovery = await this.getDiscovery();
+    const state = options.state ?? generateRandomString();
+    const nonce = options.nonce ?? generateRandomString();
+    const scopes = [...this.config.scopes, ...options.scopes ?? []];
+    this.storage.set(STORAGE_KEYS.STATE, state);
+    this.storage.set(STORAGE_KEYS.NONCE, nonce);
+    const params = {
+      client_id: this.config.clientId,
+      redirect_uri: this.config.redirectUri,
+      response_type: "code",
+      scope: scopes.join(" "),
+      state,
+      nonce,
+      prompt: options.prompt,
+      login_hint: options.loginHint
+    };
+    if (this.config.usePkce) {
+      const codeVerifier = generateCodeVerifier();
+      const codeChallenge = await generateCodeChallenge(codeVerifier);
+      this.storage.set(STORAGE_KEYS.CODE_VERIFIER, codeVerifier);
+      params.code_challenge = codeChallenge;
+      params.code_challenge_method = "S256";
+    }
+    const endpoint = options.signup ? discovery.authorization_endpoint.replace("/authorize", "/authorize/signup") : discovery.authorization_endpoint;
+    const authUrl = buildUrl(endpoint, params);
+    window.location.href = authUrl;
+  }
+  /**
+   * Alias for login({ signup: true })
+   */
+  async signup(options = {}) {
+    return this.login({ ...options, signup: true });
+  }
+  /**
+   * Handle callback from authorization server
+   */
+  async handleCallback(url) {
+    const callbackUrl = url ?? window.location.href;
+    const params = parseUrlParams(callbackUrl);
+    if (params.error) {
+      return {
+        success: false,
+        error: params.error,
+        errorDescription: params.error_description
+      };
+    }
+    const storedState = this.storage.get(STORAGE_KEYS.STATE);
+    if (!storedState || storedState !== params.state) {
+      return {
+        success: false,
+        error: "invalid_state",
+        errorDescription: "State mismatch - possible CSRF attack"
+      };
+    }
+    if (!params.code) {
+      return {
+        success: false,
+        error: "missing_code",
+        errorDescription: "No authorization code received"
+      };
+    }
+    try {
+      const tokens = await this.exchangeCode(params.code);
+      if (tokens.id_token) {
+        const payload = decodeJwtPayload(tokens.id_token);
+        const storedNonce = this.storage.get(STORAGE_KEYS.NONCE);
+        if (payload?.nonce !== storedNonce) {
+          return {
+            success: false,
+            error: "invalid_nonce",
+            errorDescription: "Nonce mismatch - possible replay attack"
+          };
+        }
+      }
+      this.storeTokens(tokens);
+      this.storage.remove(STORAGE_KEYS.STATE);
+      this.storage.remove(STORAGE_KEYS.NONCE);
+      this.storage.remove(STORAGE_KEYS.CODE_VERIFIER);
+      const user = await this.fetchUserInfo(tokens.access_token);
+      if (this.config.autoRefresh && tokens.refresh_token) {
+        this.setupAutoRefresh();
+      }
+      this.notifyListeners();
+      return {
+        success: true,
+        user: user || void 0,
+        accessToken: tokens.access_token,
+        idToken: tokens.id_token,
+        refreshToken: tokens.refresh_token
+      };
+    } catch (error) {
+      return {
+        success: false,
+        error: "token_exchange_failed",
+        errorDescription: error instanceof Error ? error.message : "Unknown error"
+      };
+    }
+  }
+  /**
+   * Exchange authorization code for tokens
+   */
+  async exchangeCode(code) {
+    const discovery = await this.getDiscovery();
+    const body = {
+      grant_type: "authorization_code",
+      client_id: this.config.clientId,
+      code,
+      redirect_uri: this.config.redirectUri
+    };
+    if (this.config.usePkce) {
+      const codeVerifier = this.storage.get(STORAGE_KEYS.CODE_VERIFIER);
+      if (codeVerifier) {
+        body.code_verifier = codeVerifier;
+      }
+    }
+    const response = await fetch(discovery.token_endpoint, {
+      method: "POST",
+      headers: {
+        "Content-Type": "application/x-www-form-urlencoded"
+      },
+      body: new URLSearchParams(body)
+    });
+    if (!response.ok) {
+      const error = await response.json().catch(() => ({}));
+      throw new Error(error.error_description || error.error || "Token exchange failed");
+    }
+    return response.json();
+  }
+  /**
+   * Refresh access token using refresh token
+   */
+  async refreshToken() {
+    const refreshToken = this.storage.get(STORAGE_KEYS.REFRESH_TOKEN);
+    if (!refreshToken) return null;
+    const discovery = await this.getDiscovery();
+    const response = await fetch(discovery.token_endpoint, {
+      method: "POST",
+      headers: {
+        "Content-Type": "application/x-www-form-urlencoded"
+      },
+      body: new URLSearchParams({
+        grant_type: "refresh_token",
+        client_id: this.config.clientId,
+        refresh_token: refreshToken
+      })
+    });
+    if (!response.ok) {
+      this.clearTokens();
+      this.notifyListeners();
+      return null;
+    }
+    const tokens = await response.json();
+    this.storeTokens(tokens);
+    this.notifyListeners();
+    return tokens;
+  }
+  /**
+   * Logout - end session
+   */
+  async logout(options = {}) {
+    const discovery = await this.getDiscovery();
+    const idToken = this.storage.get(STORAGE_KEYS.ID_TOKEN);
+    this.clearTokens();
+    this.notifyListeners();
+    if (discovery.end_session_endpoint) {
+      const params = {
+        post_logout_redirect_uri: options.returnTo ?? this.config.postLogoutRedirectUri,
+        id_token_hint: options.idTokenHint ?? idToken ?? void 0,
+        client_id: this.config.clientId
+      };
+      const logoutUrl = buildUrl(discovery.end_session_endpoint, params);
+      window.location.href = logoutUrl;
+    }
+  }
+  /**
+   * Get current access token (refreshes if needed)
+   */
+  async getAccessToken() {
+    const accessToken = this.storage.get(STORAGE_KEYS.ACCESS_TOKEN);
+    if (!accessToken) return null;
+    if (isTokenExpired(accessToken, this.config.refreshThreshold)) {
+      const tokens = await this.refreshToken();
+      return tokens?.access_token ?? null;
+    }
+    return accessToken;
+  }
+  /**
+   * Get current user from stored ID token
+   */
+  getUser() {
+    const idToken = this.storage.get(STORAGE_KEYS.ID_TOKEN);
+    if (!idToken) return null;
+    return decodeJwtPayload(idToken);
+  }
+  /**
+   * Fetch user info from userinfo endpoint
+   */
+  async fetchUserInfo(accessToken) {
+    const token = accessToken ?? await this.getAccessToken();
+    if (!token) return null;
+    const discovery = await this.getDiscovery();
+    const response = await fetch(discovery.userinfo_endpoint, {
+      headers: {
+        Authorization: `Bearer ${token}`
+      }
+    });
+    if (!response.ok) return null;
+    const user = await response.json();
+    this.storage.set(STORAGE_KEYS.USER, JSON.stringify(user));
+    return user;
+  }
+  /**
+   * Check if user is authenticated
+   */
+  isAuthenticated() {
+    const accessToken = this.storage.get(STORAGE_KEYS.ACCESS_TOKEN);
+    if (!accessToken) return false;
+    return !isTokenExpired(accessToken);
+  }
+  /**
+   * Get current auth state
+   */
+  getAuthState() {
+    const accessToken = this.storage.get(STORAGE_KEYS.ACCESS_TOKEN);
+    const idToken = this.storage.get(STORAGE_KEYS.ID_TOKEN);
+    const user = this.getUser();
+    return {
+      isAuthenticated: this.isAuthenticated(),
+      isLoading: false,
+      user,
+      accessToken,
+      idToken,
+      error: null
+    };
+  }
+  /**
+   * Subscribe to auth state changes
+   */
+  subscribe(listener) {
+    this.listeners.add(listener);
+    return () => this.listeners.delete(listener);
+  }
+  /**
+   * Store tokens in storage
+   */
+  storeTokens(tokens) {
+    this.storage.set(STORAGE_KEYS.ACCESS_TOKEN, tokens.access_token);
+    if (tokens.refresh_token) {
+      this.storage.set(STORAGE_KEYS.REFRESH_TOKEN, tokens.refresh_token);
+    }
+    if (tokens.id_token) {
+      this.storage.set(STORAGE_KEYS.ID_TOKEN, tokens.id_token);
+    }
+    const expiresAt = Date.now() + tokens.expires_in * 1e3;
+    this.storage.set(STORAGE_KEYS.EXPIRES_AT, expiresAt.toString());
+  }
+  /**
+   * Clear all stored tokens
+   */
+  clearTokens() {
+    if (this.refreshTimer) {
+      clearTimeout(this.refreshTimer);
+      this.refreshTimer = null;
+    }
+    this.storage.clear();
+  }
+  /**
+   * Setup auto-refresh timer
+   */
+  setupAutoRefresh() {
+    if (this.refreshTimer) {
+      clearTimeout(this.refreshTimer);
+    }
+    const expiresAt = this.storage.get(STORAGE_KEYS.EXPIRES_AT);
+    if (!expiresAt) return;
+    const expiresAtMs = parseInt(expiresAt, 10);
+    const refreshAt = expiresAtMs - this.config.refreshThreshold * 1e3;
+    const delay = refreshAt - Date.now();
+    if (delay > 0) {
+      this.refreshTimer = setTimeout(async () => {
+        await this.refreshToken();
+        this.setupAutoRefresh();
+      }, delay);
+    }
+  }
+  /**
+   * Notify all listeners of state change
+   */
+  notifyListeners() {
+    const state = this.getAuthState();
+    this.listeners.forEach((listener) => listener(state));
+  }
+};
+function createStuffleIAMClient(config) {
+  return new StuffleIAMClient(config);
+}
+
+// src/react/index.tsx
+import { jsx } from "react/jsx-runtime";
+var StuffleIAMContext = createContext(null);
+function StuffleIAMProvider({
+  children,
+  onLoginSuccess,
+  onLoginError,
+  autoHandleCallback = true,
+  ...config
+}) {
+  const [client] = useState(() => createStuffleIAMClient(config));
+  const [state, setState] = useState(() => ({
+    isAuthenticated: false,
+    isLoading: true,
+    user: null,
+    accessToken: null,
+    idToken: null,
+    error: null
+  }));
+  useEffect(() => {
+    const unsubscribe = client.subscribe(setState);
+    const initialState = client.getAuthState();
+    setState({ ...initialState, isLoading: false });
+    return unsubscribe;
+  }, [client]);
+  useEffect(() => {
+    if (!autoHandleCallback) return;
+    const url = window.location.href;
+    const hasCode = url.includes("code=");
+    const hasError = url.includes("error=");
+    if (hasCode || hasError) {
+      setState((prev) => ({ ...prev, isLoading: true }));
+      client.handleCallback(url).then((result) => {
+        setState((prev) => ({ ...prev, isLoading: false }));
+        if (result.success) {
+          onLoginSuccess?.(result);
+          window.history.replaceState({}, "", window.location.pathname);
+        } else {
+          const error = new Error(result.errorDescription || result.error || "Login failed");
+          onLoginError?.(error);
+          setState((prev) => ({ ...prev, error }));
+        }
+      });
+    }
+  }, [client, autoHandleCallback, onLoginSuccess, onLoginError]);
+  const login = useCallback(
+    (options) => client.login(options),
+    [client]
+  );
+  const signup = useCallback(
+    (options) => client.signup(options),
+    [client]
+  );
+  const logout = useCallback(
+    (options) => client.logout(options),
+    [client]
+  );
+  const handleCallback = useCallback(
+    (url) => client.handleCallback(url),
+    [client]
+  );
+  const getAccessToken = useCallback(
+    () => client.getAccessToken(),
+    [client]
+  );
+  const value = useMemo(
+    () => ({
+      client,
+      isAuthenticated: state.isAuthenticated,
+      isLoading: state.isLoading,
+      user: state.user,
+      accessToken: state.accessToken,
+      error: state.error,
+      login,
+      signup,
+      logout,
+      handleCallback,
+      getAccessToken
+    }),
+    [client, state, login, signup, logout, handleCallback, getAccessToken]
+  );
+  return /* @__PURE__ */ jsx(StuffleIAMContext.Provider, { value, children });
+}
+function useAuth() {
+  const context = useContext(StuffleIAMContext);
+  if (!context) {
+    throw new Error("useAuth must be used within a StuffleIAMProvider");
+  }
+  return context;
+}
+function useUser() {
+  const { user } = useAuth();
+  return user;
+}
+function useIsAuthenticated() {
+  const { isAuthenticated } = useAuth();
+  return isAuthenticated;
+}
+function useAccessToken() {
+  const { getAccessToken } = useAuth();
+  return getAccessToken;
+}
+function useHasRole(roles) {
+  const { user } = useAuth();
+  if (!user?.roles) return false;
+  const requiredRoles = Array.isArray(roles) ? roles : [roles];
+  return requiredRoles.some((role) => user.roles?.includes(role));
+}
+function withAuth(WrappedComponent, options) {
+  return function AuthenticatedComponent(props) {
+    const { isAuthenticated, isLoading, user } = useAuth();
+    const LoadingComp = options?.LoadingComponent;
+    const UnauthorizedComp = options?.UnauthorizedComponent;
+    if (isLoading) {
+      return LoadingComp ? /* @__PURE__ */ jsx(LoadingComp, {}) : null;
+    }
+    if (!isAuthenticated) {
+      return UnauthorizedComp ? /* @__PURE__ */ jsx(UnauthorizedComp, {}) : null;
+    }
+    if (options?.roles && options.roles.length > 0) {
+      const hasRequiredRole = options.roles.some((role) => user?.roles?.includes(role));
+      if (!hasRequiredRole) {
+        return UnauthorizedComp ? /* @__PURE__ */ jsx(UnauthorizedComp, {}) : null;
+      }
+    }
+    return /* @__PURE__ */ jsx(WrappedComponent, { ...props });
+  };
+}
+export {
+  StuffleIAMProvider,
+  useAccessToken,
+  useAuth,
+  useHasRole,
+  useIsAuthenticated,
+  useUser,
+  withAuth
+};
+//# sourceMappingURL=react.mjs.map