@civic/auth 0.0.1-beta.9 → 0.0.1-tsc.alpha.2

package/package.json

@@ -1,78 +1,72 @@
 {
   "name": "@civic/auth",
-  "version": "0.0.1-beta.9",
-  "files": [
-    "dist"
-  ],
+  "version": "0.0.1-tsc.alpha.2",
+  "type": "module",
+  "module": "dist/index.js",
+  "main": "dist/index.ts",
   "exports": {
     ".": {
       "import": {
-        "types": "./dist/index.d.mts",
-        "default": "./dist/index.mjs"
+        "types": "./dist/esm/src/index.d.ts",
+        "default": "./dist/esm/src/index.js"
       },
       "require": {
-        "types": "./dist/index.d.ts",
-        "default": "./dist/index.js"
+        "types": "./dist/cjs/src/index.d.ts",
+        "default": "./dist/cjs/src/index.js"
       }
     },
     "./react": {
       "import": {
-        "types": "./dist/react.d.mts",
-        "default": "./dist/react.mjs"
+        "types": "./dist/esm/src/reactjs/index.d.ts",
+        "default": "./dist/esm/src/reactjs/index.js"
       },
       "require": {
-        "types": "./dist/react.d.ts",
-        "default": "./dist/react.js"
+        "types": "./dist/cjs/src/reactjs/index.d.ts",
+        "default": "./dist/cjs/src/reactjs/index.js"
       }
     },
     "./nextjs": {
       "import": {
-        "types": "./dist/nextjs.d.mts",
-        "default": "./dist/nextjs.mjs"
+        "types": "./dist/esm/src/nextjs/index.d.ts",
+        "default": "./dist/esm/src/nextjs/index.js"
       },
       "require": {
-        "types": "./dist/nextjs.d.ts",
-        "default": "./dist/nextjs.js"
+        "types": "./dist/cjs/src/nextjs/index.d.ts",
+        "default": "./dist/cjs/src/nextjs/index.js"
       }
     },
-    "./server": {
+    "./nextjs/middleware": {
       "import": {
-        "types": "./dist/server.d.mts",
-        "default": "./dist/server.mjs"
+        "types": "./dist/esm/src/nextjs/middleware/index.d.ts",
+        "default": "./dist/esm/src/nextjs/middleware/index.js"
       },
       "require": {
-        "types": "./dist/server.d.ts",
-        "default": "./dist/server.js"
+        "types": "./dist/cjs/src/nextjs/middleware/index.d.ts",
+        "default": "./dist/cjs/src/nextjs/middleware/index.js"
       }
     },
-    "./styles.css": "./dist/index.css"
-  },
-  "scripts": {
-    "build": "tsup",
-    "prepublish": "tsup",
-    "dev:watch": "tsup --watch",
-    "test": "vitest",
-    "lint": "eslint \"src/**/*.ts*\"",
-    "lint:fix": "pnpm lint --fix",
-    "clean": "rm -rf .turbo dist node_modules",
-    "test:update": "vitest --update"
+    "./server": {
+      "import": {
+        "types": "./dist/esm/src/server/index.d.ts",
+        "default": "./dist/esm/src/server/index.js"
+      },
+      "require": {
+        "types": "./dist/cjs/src/server/index.d.ts",
+        "default": "./dist/cjs/src/server/index.js"
+      }
+    }
   },
   "dependencies": {
     "@tanstack/react-query": "^5.56.2",
-    "autoprefixer": "^10.4.20",
     "clsx": "^2.1.1",
     "debug": "^4.3.7",
     "jose": "^5.9.4",
     "oslo": "^1.2.1",
     "picomatch": "^4.0.2",
-    "postcss": "8.4.47",
-    "tailwind-merge": "^2.5.3",
-    "tailwindcss": "3.4.13",
     "uuid": "^10.0.0"
   },
   "devDependencies": {
-    "@repo/eslint-config": "workspace:*",
-    "@repo/typescript-config": "workspace:*",
+    "@rollup/plugin-typescript": "^12.1.1",
     "@testing-library/jest-dom": "^6.5.0",
     "@testing-library/react": "16.0.1",
     "@types/debug": "^4.1.12",
@@ -80,21 +74,37 @@
     "@types/picomatch": "^3.0.1",
     "@types/react": "18.3.11",
     "@types/react-dom": "18.3.0",
+    "@types/uuid": "^10.0.0",
     "@vitejs/plugin-react": "^4.3.2",
     "esbuild-plugin-css-modules": "^0.3.0",
     "eslint": "^8.57.1",
+    "eslint-plugin-require-extensions": "^0.1.3",
     "next": "14.2.15",
     "prettier": "^3.3.3",
-    "prettier-plugin-tailwindcss": "^0.6.8",
     "react": "18.3.1",
     "react-dom": "18.3.1",
     "ts-jest": "^29.2.5",
+    "tsc-alias": "^1.8.10",
     "tsup": "^8.3.0",
     "vite": "^5.4.8",
     "vite-plugin-dts": "^4.2.3",
-    "vitest": "^2.1.2"
+    "vitest": "^2.1.2",
+    "@repo/eslint-config": "0.0.0",
+    "@repo/typescript-config": "0.0.0"
   },
-  "optionalDependencies": {
+  "peerDependencies": {
     "next": "^14"
+  },
+  "scripts": {
+    "build": "pnpm build:cjs && pnpm build:esm",
+    "build:cjs": "tsc -p tsconfig.cjs.json --noEmit false && tsc-alias -p tsconfig.cjs.json",
+    "build:esm": "tsc -p tsconfig.esm.json --noEmit false && tsc-alias -p tsconfig.esm.json",
+    "prepublish": "pnpm build",
+    "dev": "tsc --watch",
+    "test": "vitest",
+    "lint": "eslint \"src/**/*.ts*\"",
+    "lint:fix": "pnpm lint --fix",
+    "clean": "rm -rf .turbo dist node_modules",
+    "test:update": "vitest --update"
   }
-}
+}

package/src/browser/storage.ts

@@ -0,0 +1,11 @@
+import type { AuthStorage } from "@/types.js";
+
+export class LocalStorageAdapter implements AuthStorage {
+  get(key: string): string {
+    return localStorage.getItem(key) || "";
+  }
+
+  set(key: string, value: string): void {
+    localStorage.setItem(key, value);
+  }
+}

package/src/config.ts

@@ -0,0 +1,6 @@
+import type { Config } from "@/types.js";
+import { DEFAULT_AUTH_SERVER } from "./constants.js";
+
+export const authConfig: Config = {
+  oauthServer: DEFAULT_AUTH_SERVER,
+};

package/src/constants.ts

@@ -0,0 +1,29 @@
+const DEFAULT_SCOPES = [
+  "openid",
+  "profile",
+  "email",
+  "forwardedTokens",
+  "offline_access",
+];
+const IFRAME_ID = "civic-auth-iframe";
+
+const DEFAULT_AUTH_SERVER = "https://auth.civic.com/oauth";
+
+const DEFAULT_OAUTH_GET_PARAMS = ["code", "state", "iss"];
+
+// The server's callback handler renders this text if it needs the front-end to make an additional token exchange call,
+// for the iframe case where cookies are not sent along with the initial redirect.
+const TOKEN_EXCHANGE_TRIGGER_TEXT = "sameDomainCodeExchangeRequired";
+
+const TOKEN_EXCHANGE_SUCCESS_TEXT = "serverSideTokenExchangeSuccess";
+
+const DEFAULT_DISPLAY_MODE = "iframe";
+export {
+  DEFAULT_SCOPES,
+  DEFAULT_OAUTH_GET_PARAMS,
+  DEFAULT_DISPLAY_MODE,
+  IFRAME_ID,
+  DEFAULT_AUTH_SERVER,
+  TOKEN_EXCHANGE_TRIGGER_TEXT,
+  TOKEN_EXCHANGE_SUCCESS_TEXT,
+};

package/src/index.ts

@@ -0,0 +1,16 @@
+// These are the default exports of the project.
+// They are limited by design to ensure that the public API does not expose any internal implementation details.
+// Do not change this without thinking carefully about the impact on the client-facing public API.
+export type {
+  Tokens,
+  Endpoints,
+  Config,
+  User,
+  DisplayMode,
+  ForwardedTokens,
+  AuthStorage,
+} from "@/types.js";
+
+export type * from "@/shared/lib/types.js";
+
+export type { UserContextType } from "@/shared/providers/UserProvider.js";

package/src/lib/cookies.ts

@@ -0,0 +1,28 @@
+const getWindowCookieValue = ({
+  key,
+  window,
+  parseJson = false,
+}: {
+  key: string;
+  window: Window;
+  parseJson?: boolean;
+}) => {
+  const cookie = window.document.cookie;
+  if (!cookie) return null;
+  const cookies = cookie.split(";");
+  for (const c of cookies) {
+    const [name, value] = c.trim().split("=");
+    if (value && name === key) {
+      try {
+        const decodeURIComponentValue = decodeURIComponent(value);
+        return parseJson
+          ? JSON.parse(decodeURIComponentValue)
+          : decodeURIComponentValue;
+      } catch {
+        return value;
+      }
+    }
+  }
+  return null;
+};
+export { getWindowCookieValue };

package/src/lib/jwt.ts

@@ -0,0 +1,15 @@
+import type { ForwardedTokens, ForwardedTokensJWT } from "@/types.js";
+
+export const convertForwardedTokenFormat = (
+  inputTokens: ForwardedTokensJWT,
+): ForwardedTokens =>
+  Object.fromEntries(
+    Object.entries(inputTokens).map(([source, tokens]) => [
+      source,
+      {
+        idToken: tokens?.id_token,
+        accessToken: tokens?.access_token,
+        refreshToken: tokens?.refresh_token,
+      },
+    ]),
+  );

package/src/lib/logger.ts

@@ -0,0 +1,72 @@
+import debug from "debug";
+
+const PACKAGE_NAME = "@civic/auth";
+
+export interface Logger {
+  debug(message: string, ...args: unknown[]): void;
+  info(message: string, ...args: unknown[]): void;
+  warn(message: string, ...args: unknown[]): void;
+  error(message: string, ...args: unknown[]): void;
+}
+
+class DebugLogger implements Logger {
+  private debugLogger: debug.Debugger;
+  private infoLogger: debug.Debugger;
+  private warnLogger: debug.Debugger;
+  private errorLogger: debug.Debugger;
+
+  constructor(namespace: string) {
+    // Format: @org/package:library:component:level
+    this.debugLogger = debug(`${PACKAGE_NAME}:${namespace}:debug`);
+    this.infoLogger = debug(`${PACKAGE_NAME}:${namespace}:info`);
+    this.warnLogger = debug(`${PACKAGE_NAME}:${namespace}:warn`);
+    this.errorLogger = debug(`${PACKAGE_NAME}:${namespace}:error`);
+
+    this.debugLogger.color = "4";
+    this.infoLogger.color = "2";
+    this.warnLogger.color = "3";
+    this.errorLogger.color = "1";
+  }
+
+  debug(message: string, ...args: unknown[]): void {
+    this.debugLogger(message, ...args);
+  }
+
+  info(message: string, ...args: unknown[]): void {
+    this.infoLogger(message, ...args);
+  }
+
+  warn(message: string, ...args: unknown[]): void {
+    this.warnLogger(message, ...args);
+  }
+
+  error(message: string, ...args: unknown[]): void {
+    this.errorLogger(message, ...args);
+  }
+}
+
+export const createLogger = (namespace: string): Logger =>
+  new DebugLogger(namespace);
+
+// Pre-configured loggers for different parts of your package
+export const loggers = {
+  // Next.js specific loggers
+  nextjs: {
+    routes: createLogger("api:routes"),
+    middleware: createLogger("api:middleware"),
+    handlers: {
+      auth: createLogger("api:handlers:auth"),
+    },
+  },
+  // React specific loggers
+  react: {
+    components: createLogger("react:components"),
+    hooks: createLogger("react:hooks"),
+    context: createLogger("react:context"),
+  },
+  // Shared utilities loggers
+  services: {
+    validation: createLogger("utils:validation"),
+    network: createLogger("utils:network"),
+  },
+} as const;

package/src/lib/oauth.ts

@@ -0,0 +1,83 @@
+import type { DisplayMode, Endpoints, OpenIdConfiguration } from "@/types.js";
+import { v4 as uuid } from "uuid";
+
+const getIssuerVariations = (issuer: string): string[] => {
+  const issuerWithoutSlash = issuer.endsWith("/")
+    ? issuer.slice(0, issuer.length - 1)
+    : issuer;
+
+  const issuerWithSlash = `${issuerWithoutSlash}/`;
+
+  return [issuerWithoutSlash, issuerWithSlash];
+};
+
+const addSlashIfNeeded = (url: string): string =>
+  url.endsWith("/") ? url : `${url}/`;
+
+const getOauthEndpoints = async (oauthServer: string): Promise<Endpoints> => {
+  const openIdConfigResponse = await fetch(
+    `${addSlashIfNeeded(oauthServer)}.well-known/openid-configuration`,
+  );
+  const openIdConfig =
+    (await openIdConfigResponse.json()) as OpenIdConfiguration;
+  return {
+    jwks: openIdConfig.jwks_uri,
+    auth: openIdConfig.authorization_endpoint,
+    token: openIdConfig.token_endpoint,
+    userinfo: openIdConfig.userinfo_endpoint,
+  };
+};
+
+/**
+ * creates a state string for the OAuth2 flow, encoding the display mode too for future use
+ * @param {DisplayMode} displayMode
+ * @returns {string}
+ */
+const generateState = (
+  displayMode: DisplayMode,
+  serverTokenExchange?: boolean,
+): string => {
+  const jsonString = JSON.stringify({
+    uuid: uuid(),
+    displayMode,
+    ...(serverTokenExchange ? { serverTokenExchange } : {}),
+  });
+  return btoa(jsonString);
+};
+
+/**
+ * parses the state string from the OAuth2 flow, decoding the display mode too
+ * @param state
+ * @param sessionDisplayMode
+ * @returns { uuid: string, displayMode: DisplayMode }
+ */
+const displayModeFromState = (
+  state: string,
+  sessionDisplayMode: DisplayMode | undefined,
+): DisplayMode | undefined => {
+  try {
+    const jsonString = atob(state);
+    return JSON.parse(jsonString).displayMode;
+  } catch (e) {
+    console.error("Failed to parse displayMode from state:", state, e);
+    return sessionDisplayMode;
+  }
+};
+
+const serverTokenExchangeFromState = (state: string): boolean | undefined => {
+  try {
+    const jsonString = atob(state);
+    return JSON.parse(jsonString).serverTokenExchange;
+  } catch {
+    console.error("Failed to parse serverTokenExchange from state:", state);
+    return undefined;
+  }
+};
+
+export {
+  serverTokenExchangeFromState,
+  getIssuerVariations,
+  getOauthEndpoints,
+  displayModeFromState,
+  generateState,
+};

package/src/lib/postMessage.ts

@@ -0,0 +1,22 @@
+import type { LoginPostMessage } from "@/types.js";
+
+const validateLoginAppPostMessage = (
+  event: LoginPostMessage,
+  clientId: string,
+): boolean => {
+  const caseEvent = event as LoginPostMessage;
+  console.log("caseEvent", caseEvent);
+  if (
+    !caseEvent.clientId ||
+    !caseEvent.data.url ||
+    !caseEvent.source ||
+    !caseEvent.type ||
+    caseEvent.clientId !== clientId ||
+    caseEvent.source !== "civicloginApp"
+  ) {
+    return false;
+  }
+  return true;
+};
+
+export { validateLoginAppPostMessage };

package/src/lib/windowUtil.ts

@@ -0,0 +1,29 @@
+const isWindowInIframe = (window: Window): boolean => {
+  if (typeof window !== "undefined") {
+    // use the window width to determine if we're in an iframe or not
+    try {
+      if (window?.frameElement?.id === "civic-auth-iframe") {
+        return true;
+      }
+      // eslint-disable-next-line @typescript-eslint/no-unused-vars
+    } catch (_e) {
+      // If we get an error, we're not in an iframe
+      return false;
+    }
+  }
+  return false;
+};
+
+const removeParamsWithoutReload = (paramsToRemove: string[]) => {
+  const url = new URL(window.location.href);
+  paramsToRemove.forEach((param: string) => {
+    url.searchParams.delete(param);
+  });
+  try {
+    window.history.replaceState({}, "", url);
+  } catch (error) {
+    console.warn("window.history.replaceState failed", error);
+  }
+};
+
+export { isWindowInIframe, removeParamsWithoutReload };

package/src/nextjs/GetUser.ts

@@ -0,0 +1,22 @@
+/**
+ * Used on the server-side to get the user object from the cookie
+ */
+import type { User } from "@/types.js";
+import { GenericUserSession } from "@/shared/lib/UserSession.js";
+import { NextjsClientStorage } from "@/nextjs/cookies.js";
+import { retrieveTokens } from "@/shared/lib/util.js";
+
+export const getUser = (): User | null => {
+  const clientStorage = new NextjsClientStorage();
+  const userSession = new GenericUserSession(clientStorage);
+  const tokens = retrieveTokens(clientStorage);
+  const user = userSession.get();
+  if (!user || !tokens) return null;
+
+  return {
+    ...user!,
+    idToken: tokens.id_token,
+    accessToken: tokens.access_token,
+    refreshToken: tokens.refresh_token ?? "",
+  } as User;
+};

package/src/nextjs/client/index.ts

@@ -0,0 +1,4 @@
+export {
+  CivicNextAuthProvider as CivicAuthProvider,
+  type NextCivicAuthProviderProps as AuthProviderProps,
+} from "@/nextjs/providers/NextAuthProvider.jsx";