@civic/auth 0.0.1-beta.2 → 0.0.1-beta.20

package/README.md

@@ -118,6 +118,32 @@ function Header() {
 }
 ```
 
+### Embedding the login iframe in your page
+
+The default displayMode for user login is 'iframe' which will show a modal containing the login page for users, when the `signIn` hook is called. If you want to customize where this page is shown and embed it into your page instead i.e. in the case where you have a landing page and don't want users to have to click on a 'sign-in' button, you can embed the login iframe directly inside your page and it will work just like in the modal, as long as it is a child of a <CivicAuthProvider>. In this mode, the iframe auto-loads the login page.
+
+To enable this mode, you need to set the parameter 'modalIframe' to `false` (it defaults to `true` in normal operation).
+
+The example below shows the iframe centered inside a div embedded on the page:
+```tsx
+import { CivicAuthProvider } from "@civic/auth/react";
+
+function App({ children }) {
+  return (
+    <CivicAuthProvider
+      clientId="your-client-id"
+      redirectUrl="https://your-app.com/callback"
+      modalIframe={false}
+    >
+      {children}
+      <div className="flex min-h-[200px] items-center justify-center">
+        <CivicAuthIframeContainer />
+      </div>
+    </CivicAuthProvider>
+  );
+}
+```
+
 ### Token Management with useToken Hook
 
 The `useToken` hook can be used to access and manage tokens within your application. This hook provides the current access and ID tokens, a refresh function, and token loading/error states.

package/dist/AuthProvider-Bj_Prt1x.d.ts

@@ -0,0 +1,21 @@
+import { ReactNode } from 'react';
+import { C as Config, S as SessionData } from './types-HdCjGldB.js';
+
+interface PKCEConsumer {
+    getCodeChallenge(): Promise<string>;
+}
+
+type AuthProviderProps = {
+    children: ReactNode;
+    clientId: string;
+    redirectUrl?: string;
+    nonce?: string;
+    config?: Config;
+    onSignIn?: (error?: Error) => void;
+    onSignOut?: () => Promise<void>;
+    pkceConsumer?: PKCEConsumer;
+    modalIframe?: boolean;
+    sessionData?: SessionData;
+};
+
+export type { AuthProviderProps as A };

package/dist/AuthProvider-DUAoX4G9.d.mts

@@ -0,0 +1,21 @@
+import { ReactNode } from 'react';
+import { C as Config, S as SessionData } from './types-HdCjGldB.mjs';
+
+interface PKCEConsumer {
+    getCodeChallenge(): Promise<string>;
+}
+
+type AuthProviderProps = {
+    children: ReactNode;
+    clientId: string;
+    redirectUrl?: string;
+    nonce?: string;
+    config?: Config;
+    onSignIn?: (error?: Error) => void;
+    onSignOut?: () => Promise<void>;
+    pkceConsumer?: PKCEConsumer;
+    modalIframe?: boolean;
+    sessionData?: SessionData;
+};
+
+export type { AuthProviderProps as A };

package/dist/UserProvider-CMLaYOUD.d.ts

@@ -0,0 +1,16 @@
+import { JWT } from 'oslo/jwt';
+import { D as DisplayMode, U as User } from './types-HdCjGldB.js';
+
+type AuthContextType = {
+    signIn: (displayMode?: DisplayMode) => Promise<void>;
+    isAuthenticated: boolean;
+    isLoading: boolean;
+    error: Error | null;
+    signOut: () => Promise<void>;
+};
+
+type UserContextType<T extends Record<string, unknown> & JWT["payload"] = Record<string, unknown> & JWT["payload"]> = {
+    user: User<T> | null;
+} & Omit<AuthContextType, "isAuthenticated">;
+
+export type { AuthContextType as A, UserContextType as U };

package/dist/UserProvider-Cbm8MZkJ.d.mts

@@ -0,0 +1,16 @@
+import { JWT } from 'oslo/jwt';
+import { D as DisplayMode, U as User } from './types-HdCjGldB.mjs';
+
+type AuthContextType = {
+    signIn: (displayMode?: DisplayMode) => Promise<void>;
+    isAuthenticated: boolean;
+    isLoading: boolean;
+    error: Error | null;
+    signOut: () => Promise<void>;
+};
+
+type UserContextType<T extends Record<string, unknown> & JWT["payload"] = Record<string, unknown> & JWT["payload"]> = {
+    user: User<T> | null;
+} & Omit<AuthContextType, "isAuthenticated">;
+
+export type { AuthContextType as A, UserContextType as U };

package/dist/chunk-5UQQYXCX.js

@@ -0,0 +1 @@
+"use strict";//# sourceMappingURL=chunk-5UQQYXCX.js.map

package/dist/chunk-5UQQYXCX.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["/Users/kevincolgan/code/civic-auth/packages/civic-auth-client/dist/chunk-5UQQYXCX.js"],"names":[],"mappings":"AAAA","file":"/Users/kevincolgan/code/civic-auth/packages/civic-auth-client/dist/chunk-5UQQYXCX.js"}

package/dist/chunk-BFESCRFK.mjs

@@ -0,0 +1,118 @@
+import {
+  CookieStorage
+} from "./chunk-HTTTZ2BP.mjs";
+import {
+  GenericUserSession,
+  clearTokens
+} from "./chunk-CBQ3HKRV.mjs";
+import {
+  __async,
+  __spreadProps,
+  __spreadValues
+} from "./chunk-RGHW4PYM.mjs";
+
+// src/nextjs/cookies.ts
+import { cookies } from "next/headers.js";
+var createTokenCookies = (response, sessionData, config) => {
+  var _a, _b;
+  const maxAge = (_a = sessionData.expiresIn) != null ? _a : 3600;
+  const cookieOptions = __spreadProps(__spreadValues({}, (_b = config.cookies) == null ? void 0 : _b.tokens), {
+    maxAge
+  });
+  if (sessionData.accessToken) {
+    response.cookies.set("access_token", sessionData.accessToken, __spreadProps(__spreadValues({}, cookieOptions), {
+      httpOnly: true
+    }));
+  }
+  if (sessionData.idToken) {
+    response.cookies.set("id_token", sessionData.idToken, __spreadProps(__spreadValues({}, cookieOptions), {
+      httpOnly: true
+    }));
+  }
+  if (sessionData.refreshToken) {
+    response.cookies.set("refresh_token", sessionData.refreshToken, __spreadProps(__spreadValues({}, cookieOptions), {
+      httpOnly: true
+    }));
+  }
+};
+var createUserInfoCookie = (response, user, sessionData, config) => {
+  var _a, _b, _c;
+  if (!user) {
+    response.cookies.set("user", "", __spreadProps(__spreadValues({}, (_a = config.cookies) == null ? void 0 : _a.user), {
+      maxAge: 0
+    }));
+    return;
+  }
+  const maxAge = (_b = sessionData.expiresIn) != null ? _b : 3600;
+  const frontendUser = __spreadValues({}, user);
+  response.cookies.set("user", JSON.stringify(frontendUser), __spreadProps(__spreadValues({}, (_c = config.cookies) == null ? void 0 : _c.user), {
+    maxAge
+  }));
+};
+var clearAuthCookies = (config) => __async(void 0, null, function* () {
+  var _a;
+  const cookieStorage = new NextjsCookieStorage((_a = config.cookies) == null ? void 0 : _a.tokens);
+  clearTokens(cookieStorage);
+  const clientStorage = new NextjsClientStorage();
+  const userSession = new GenericUserSession(clientStorage);
+  userSession.set(null);
+});
+var NextjsCookieStorage = class extends CookieStorage {
+  constructor(config = {}) {
+    super({
+      secure: true,
+      httpOnly: true
+    });
+    this.config = config;
+  }
+  get(key) {
+    var _a;
+    return ((_a = cookies().get(key)) == null ? void 0 : _a.value) || null;
+  }
+  set(key, value) {
+    var _a;
+    const cookieSettings = ((_a = this.config) == null ? void 0 : _a[key]) || __spreadValues({}, this.settings);
+    console.log(
+      "NextjsCookieStorage.set",
+      JSON.stringify(
+        { key, value, config: this.config, cookieSettings },
+        null,
+        2
+      )
+    );
+    cookies().set(key, value, cookieSettings);
+  }
+};
+var NextjsClientStorage = class extends CookieStorage {
+  constructor(config = {}) {
+    super(__spreadProps(__spreadValues({}, config), {
+      secure: false,
+      httpOnly: false
+    }));
+  }
+  get(key) {
+    var _a;
+    return ((_a = cookies().get(key)) == null ? void 0 : _a.value) || null;
+  }
+  set(key, value) {
+    cookies().set(key, value, this.settings);
+  }
+};
+
+// src/nextjs/utils.ts
+var resolveCallbackUrl = (config, alternativeUrl) => {
+  var _a;
+  const baseUrl = (_a = config.appUrl) != null ? _a : alternativeUrl;
+  const callbackUrl = new URL(config == null ? void 0 : config.callbackUrl, baseUrl).toString();
+  return callbackUrl.toString();
+};
+
+export {
+  createTokenCookies,
+  createUserInfoCookie,
+  clearAuthCookies,
+  NextjsCookieStorage,
+  NextjsClientStorage,
+  resolveCallbackUrl
+};
+//# sourceMappingURL=chunk-BFESCRFK.mjs.map

package/dist/chunk-BFESCRFK.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/nextjs/cookies.ts","../src/nextjs/utils.ts"],"sourcesContent":["import { SessionData, UnknownObject, User } from \"@/types\";\nimport { NextResponse } from \"next/server\";\nimport { AuthConfig, CookiesConfigObject } from \"@/nextjs/config\";\nimport { CookieStorage, CookieStorageSettings } from \"@/server\";\nimport { cookies } from \"next/headers.js\";\nimport { GenericUserSession } from \"@/shared/UserSession\";\nimport { clearTokens } from \"@/shared/util\";\nimport { CodeVerifier, OAuthTokens, TokensCookieConfig } from \"@/shared/types\";\n\n/**\n * Creates HTTP-only cookies for authentication tokens\n */\nconst createTokenCookies = (\n  response: NextResponse,\n  sessionData: SessionData,\n  config: AuthConfig,\n) => {\n  const maxAge = sessionData.expiresIn ?? 3600;\n  const cookieOptions = {\n    ...config.cookies?.tokens,\n    maxAge,\n  };\n\n  if (sessionData.accessToken) {\n    response.cookies.set(\"access_token\", sessionData.accessToken, {\n      ...cookieOptions,\n      httpOnly: true,\n    });\n  }\n\n  if (sessionData.idToken) {\n    response.cookies.set(\"id_token\", sessionData.idToken, {\n      ...cookieOptions,\n      httpOnly: true,\n    });\n  }\n\n  if (sessionData.refreshToken) {\n    response.cookies.set(\"refresh_token\", sessionData.refreshToken, {\n      ...cookieOptions,\n      httpOnly: true,\n    });\n  }\n};\n\n/**\n * Creates a client-readable cookie with user info\n */\nconst createUserInfoCookie = (\n  response: NextResponse,\n  user: User<UnknownObject> | null,\n  sessionData: SessionData,\n  config: AuthConfig,\n) => {\n  if (!user) {\n    response.cookies.set(\"user\", \"\", {\n      ...config.cookies?.user,\n      maxAge: 0,\n    });\n    return;\n  }\n  const maxAge = sessionData.expiresIn ?? 3600;\n\n  // TODO select fields to include in the user cookie\n  const frontendUser = {\n    ...user,\n  };\n\n  // TODO make call to get user info from the\n  // auth server /userinfo endpoint when it's available\n  // then add to the default claims above\n\n  response.cookies.set(\"user\", JSON.stringify(frontendUser), {\n    ...config.cookies?.user,\n    maxAge,\n  });\n};\n\n/**\n * Clears all authentication cookies\n */\nconst clearAuthCookies = async (config: AuthConfig) => {\n  // clear session, and tokens\n  const cookieStorage = new NextjsCookieStorage(config.cookies?.tokens);\n  clearTokens(cookieStorage);\n\n  // clear user\n  const clientStorage = new NextjsClientStorage();\n  const userSession = new GenericUserSession(clientStorage);\n  userSession.set(null);\n};\n\ntype KeySetter = OAuthTokens | CodeVerifier;\nclass NextjsCookieStorage extends CookieStorage {\n  constructor(readonly config: Partial<TokensCookieConfig> = {}) {\n    super({\n      secure: true,\n      httpOnly: true,\n    });\n  }\n\n  get(key: string): string | null {\n    return cookies().get(key)?.value || null;\n  }\n\n  set(key: KeySetter, value: string): void {\n    const cookieSettings = this.config?.[key as KeySetter] || {\n      ...this.settings,\n    };\n    console.log(\n      \"NextjsCookieStorage.set\",\n      JSON.stringify(\n        { key, value, config: this.config, cookieSettings },\n        null,\n        2,\n      ),\n    );\n    cookies().set(key, value, cookieSettings);\n  }\n}\n\nclass NextjsClientStorage extends CookieStorage {\n  constructor(config: Partial<CookieStorageSettings> = {}) {\n    super({\n      ...config,\n      secure: false,\n      httpOnly: false,\n    });\n  }\n\n  get(key: string): string | null {\n    return cookies().get(key)?.value || null;\n  }\n\n  set(key: string, value: string): void {\n    cookies().set(key, value, this.settings);\n  }\n}\n\nexport {\n  createTokenCookies,\n  createUserInfoCookie,\n  clearAuthCookies,\n  NextjsCookieStorage,\n  NextjsClientStorage,\n};\n","import { AuthConfigWithDefaults } from \"@/nextjs/config\";\n\nexport const resolveCallbackUrl = (\n  config: AuthConfigWithDefaults,\n  alternativeUrl?: string,\n): string => {\n  const baseUrl = config.appUrl ?? alternativeUrl;\n  const callbackUrl = new URL(config?.callbackUrl, baseUrl).toString();\n  return callbackUrl.toString();\n};\n"],"mappings":";;;;;;;;;;;;;;AAIA,SAAS,eAAe;AAQxB,IAAM,qBAAqB,CACzB,UACA,aACA,WACG;AAhBL;AAiBE,QAAM,UAAS,iBAAY,cAAZ,YAAyB;AACxC,QAAM,gBAAgB,kCACjB,YAAO,YAAP,mBAAgB,SADC;AAAA,IAEpB;AAAA,EACF;AAEA,MAAI,YAAY,aAAa;AAC3B,aAAS,QAAQ,IAAI,gBAAgB,YAAY,aAAa,iCACzD,gBADyD;AAAA,MAE5D,UAAU;AAAA,IACZ,EAAC;AAAA,EACH;AAEA,MAAI,YAAY,SAAS;AACvB,aAAS,QAAQ,IAAI,YAAY,YAAY,SAAS,iCACjD,gBADiD;AAAA,MAEpD,UAAU;AAAA,IACZ,EAAC;AAAA,EACH;AAEA,MAAI,YAAY,cAAc;AAC5B,aAAS,QAAQ,IAAI,iBAAiB,YAAY,cAAc,iCAC3D,gBAD2D;AAAA,MAE9D,UAAU;AAAA,IACZ,EAAC;AAAA,EACH;AACF;AAKA,IAAM,uBAAuB,CAC3B,UACA,MACA,aACA,WACG;AArDL;AAsDE,MAAI,CAAC,MAAM;AACT,aAAS,QAAQ,IAAI,QAAQ,IAAI,kCAC5B,YAAO,YAAP,mBAAgB,OADY;AAAA,MAE/B,QAAQ;AAAA,IACV,EAAC;AACD;AAAA,EACF;AACA,QAAM,UAAS,iBAAY,cAAZ,YAAyB;AAGxC,QAAM,eAAe,mBAChB;AAOL,WAAS,QAAQ,IAAI,QAAQ,KAAK,UAAU,YAAY,GAAG,kCACtD,YAAO,YAAP,mBAAgB,OADsC;AAAA,IAEzD;AAAA,EACF,EAAC;AACH;AAKA,IAAM,mBAAmB,CAAO,WAAuB;AAjFvD;AAmFE,QAAM,gBAAgB,IAAI,qBAAoB,YAAO,YAAP,mBAAgB,MAAM;AACpE,cAAY,aAAa;AAGzB,QAAM,gBAAgB,IAAI,oBAAoB;AAC9C,QAAM,cAAc,IAAI,mBAAmB,aAAa;AACxD,cAAY,IAAI,IAAI;AACtB;AAGA,IAAM,sBAAN,cAAkC,cAAc;AAAA,EAC9C,YAAqB,SAAsC,CAAC,GAAG;AAC7D,UAAM;AAAA,MACJ,QAAQ;AAAA,MACR,UAAU;AAAA,IACZ,CAAC;AAJkB;AAAA,EAKrB;AAAA,EAEA,IAAI,KAA4B;AArGlC;AAsGI,aAAO,aAAQ,EAAE,IAAI,GAAG,MAAjB,mBAAoB,UAAS;AAAA,EACtC;AAAA,EAEA,IAAI,KAAgB,OAAqB;AAzG3C;AA0GI,UAAM,mBAAiB,UAAK,WAAL,mBAAc,SAAqB,mBACrD,KAAK;AAEV,YAAQ;AAAA,MACN;AAAA,MACA,KAAK;AAAA,QACH,EAAE,KAAK,OAAO,QAAQ,KAAK,QAAQ,eAAe;AAAA,QAClD;AAAA,QACA;AAAA,MACF;AAAA,IACF;AACA,YAAQ,EAAE,IAAI,KAAK,OAAO,cAAc;AAAA,EAC1C;AACF;AAEA,IAAM,sBAAN,cAAkC,cAAc;AAAA,EAC9C,YAAY,SAAyC,CAAC,GAAG;AACvD,UAAM,iCACD,SADC;AAAA,MAEJ,QAAQ;AAAA,MACR,UAAU;AAAA,IACZ,EAAC;AAAA,EACH;AAAA,EAEA,IAAI,KAA4B;AAlIlC;AAmII,aAAO,aAAQ,EAAE,IAAI,GAAG,MAAjB,mBAAoB,UAAS;AAAA,EACtC;AAAA,EAEA,IAAI,KAAa,OAAqB;AACpC,YAAQ,EAAE,IAAI,KAAK,OAAO,KAAK,QAAQ;AAAA,EACzC;AACF;;;ACvIO,IAAM,qBAAqB,CAChC,QACA,mBACW;AALb;AAME,QAAM,WAAU,YAAO,WAAP,YAAiB;AACjC,QAAM,cAAc,IAAI,IAAI,iCAAQ,aAAa,OAAO,EAAE,SAAS;AACnE,SAAO,YAAY,SAAS;AAC9B;","names":[]}