@auth/solid-start 0.6.0 → 0.6.1

package/adapters.d.ts

@@ -0,0 +1,2 @@
+export type * from "@auth/core/adapters";
+//# sourceMappingURL=adapters.d.ts.map

package/adapters.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"adapters.d.ts","sourceRoot":"","sources":["src/adapters.ts"],"names":[],"mappings":"AAAA,mBAAmB,qBAAqB,CAAA"}

package/adapters.js

@@ -0,0 +1 @@
+export {};

package/client.d.ts

@@ -1,5 +1,4 @@
-import { RedirectableProviderType, BuiltInProviderType } from '@auth/core/providers';
-
+import type { BuiltInProviderType, RedirectableProviderType } from "@auth/core/providers";
 type LiteralUnion<T extends U, U = string> = T | (U & Record<never, never>);
 interface SignInOptions extends Record<string, unknown> {
     /**
@@ -18,7 +17,7 @@ interface SignOutParams<R extends boolean = true> {
     redirect?: R;
 }
 /** Match `inputType` of `new URLSearchParams(inputType)` */
-type SignInAuthorizationParams = string | string[][] | Record<string, string> | URLSearchParams;
+export type SignInAuthorizationParams = string | string[][] | Record<string, string> | URLSearchParams;
 /**
  * Client-side method to initiate a signin flow
  * or send the user to the signin page listing all possible providers.
@@ -30,7 +29,7 @@ type SignInAuthorizationParams = string | string[][] | Record<string, string> |
  * signIn("provider") // example: signIn("github")
  * ```
  */
-declare function signIn<P extends RedirectableProviderType | undefined = undefined>(providerId?: LiteralUnion<P extends RedirectableProviderType ? P | BuiltInProviderType : BuiltInProviderType>, options?: SignInOptions, authorizationParams?: SignInAuthorizationParams): Promise<Response | undefined>;
+export declare function signIn<P extends RedirectableProviderType | undefined = undefined>(providerId?: LiteralUnion<P extends RedirectableProviderType ? P | BuiltInProviderType : BuiltInProviderType>, options?: SignInOptions, authorizationParams?: SignInAuthorizationParams): Promise<Response | undefined>;
 /**
  * Signs the user out, by removing the session cookie.
  * Automatically adds the CSRF token to the request.
@@ -40,6 +39,6 @@ declare function signIn<P extends RedirectableProviderType | undefined = undefin
  * signOut()
  * ```
  */
-declare function signOut(options?: SignOutParams): Promise<void>;
-
-export { SignInAuthorizationParams, signIn, signOut };
+export declare function signOut(options?: SignOutParams): Promise<void>;
+export {};
+//# sourceMappingURL=client.d.ts.map

package/client.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"client.d.ts","sourceRoot":"","sources":["src/client.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,mBAAmB,EACnB,wBAAwB,EACzB,MAAM,sBAAsB,CAAA;AAE7B,KAAK,YAAY,CAAC,CAAC,SAAS,CAAC,EAAE,CAAC,GAAG,MAAM,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,MAAM,CAAC,KAAK,EAAE,KAAK,CAAC,CAAC,CAAA;AAE3E,UAAU,aAAc,SAAQ,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC;IACrD;;;;OAIG;IACH,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,uGAAuG;IACvG,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB;AAED,UAAU,aAAa,CAAC,CAAC,SAAS,OAAO,GAAG,IAAI;IAC9C,kGAAkG;IAClG,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,wGAAwG;IACxG,QAAQ,CAAC,EAAE,CAAC,CAAA;CACb;AAED,4DAA4D;AAC5D,MAAM,MAAM,yBAAyB,GACjC,MAAM,GACN,MAAM,EAAE,EAAE,GACV,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,GACtB,eAAe,CAAA;AAEnB;;;;;;;;;;GAUG;AACH,wBAAsB,MAAM,CAC1B,CAAC,SAAS,wBAAwB,GAAG,SAAS,GAAG,SAAS,EAE1D,UAAU,CAAC,EAAE,YAAY,CACvB,CAAC,SAAS,wBAAwB,GAC9B,CAAC,GAAG,mBAAmB,GACvB,mBAAmB,CACxB,EACD,OAAO,CAAC,EAAE,aAAa,EACvB,mBAAmB,CAAC,EAAE,yBAAyB,iCA4ChD;AAED;;;;;;;;GAQG;AACH,wBAAsB,OAAO,CAAC,OAAO,CAAC,EAAE,aAAa,iBAsBpD"}

package/client.js

@@ -1,62 +1,80 @@
-import {
-  __name
-} from "./chunk-HXRSFH6L.js";
-async function signIn(providerId, options, authorizationParams) {
-  const { callbackUrl = window.location.href, redirect = true } = options ?? {};
-  const isCredentials = providerId === "credentials";
-  const isEmail = providerId === "email";
-  const isSupportingReturn = isCredentials || isEmail;
-  const signInUrl = `/api/auth/${isCredentials ? "callback" : "signin"}/${providerId}`;
-  const _signInUrl = `${signInUrl}?${new URLSearchParams(authorizationParams)}`;
-  const csrfTokenResponse = await fetch("/api/auth/csrf");
-  const { csrfToken } = await csrfTokenResponse.json();
-  const res = await fetch(_signInUrl, {
-    method: "post",
-    headers: {
-      "Content-Type": "application/x-www-form-urlencoded",
-      "X-Auth-Return-Redirect": "1"
-    },
-    // @ts-ignore
-    body: new URLSearchParams({
-      ...options,
-      csrfToken,
-      callbackUrl
-    })
-  });
-  const data = await res.clone().json();
-  const error = new URL(data.url).searchParams.get("error");
-  if (redirect || !isSupportingReturn || !error) {
-    window.location.href = data.url ?? data.redirect ?? callbackUrl;
-    if (data.url.includes("#"))
-      window.location.reload();
-    return;
-  }
-  return res;
+/**
+ * Client-side method to initiate a signin flow
+ * or send the user to the signin page listing all possible providers.
+ * Automatically adds the CSRF token to the request.
+ *
+ * ```ts
+ * import { signIn } from "@auth/solid-start/client"
+ * signIn()
+ * signIn("provider") // example: signIn("github")
+ * ```
+ */
+export async function signIn(providerId, options, authorizationParams) {
+    const { callbackUrl = window.location.href, redirect = true } = options ?? {};
+    // TODO: Support custom providers
+    const isCredentials = providerId === "credentials";
+    const isEmail = providerId === "email";
+    const isSupportingReturn = isCredentials || isEmail;
+    // TODO: Handle custom base path
+    const signInUrl = `/api/auth/${isCredentials ? "callback" : "signin"}/${providerId}`;
+    const _signInUrl = `${signInUrl}?${new URLSearchParams(authorizationParams)}`;
+    // TODO: Handle custom base path
+    const csrfTokenResponse = await fetch("/api/auth/csrf");
+    const { csrfToken } = await csrfTokenResponse.json();
+    const res = await fetch(_signInUrl, {
+        method: "post",
+        headers: {
+            "Content-Type": "application/x-www-form-urlencoded",
+            "X-Auth-Return-Redirect": "1",
+        },
+        // @ts-ignore
+        body: new URLSearchParams({
+            ...options,
+            csrfToken,
+            callbackUrl,
+        }),
+    });
+    const data = await res.clone().json();
+    const error = new URL(data.url).searchParams.get("error");
+    if (redirect || !isSupportingReturn || !error) {
+        // TODO: Do not redirect for Credentials and Email providers by default in next major
+        window.location.href = data.url ?? data.redirect ?? callbackUrl;
+        // If url contains a hash, the browser does not reload the page. We reload manually
+        if (data.url.includes("#"))
+            window.location.reload();
+        return;
+    }
+    return res;
 }
-__name(signIn, "signIn");
-async function signOut(options) {
-  const { callbackUrl = window.location.href } = options ?? {};
-  const csrfTokenResponse = await fetch("/api/auth/csrf");
-  const { csrfToken } = await csrfTokenResponse.json();
-  const res = await fetch(`/api/auth/signout`, {
-    method: "post",
-    headers: {
-      "Content-Type": "application/x-www-form-urlencoded",
-      "X-Auth-Return-Redirect": "1"
-    },
-    body: new URLSearchParams({
-      csrfToken,
-      callbackUrl
-    })
-  });
-  const data = await res.json();
-  const url = data.url ?? data.redirect ?? callbackUrl;
-  window.location.href = url;
-  if (url.includes("#"))
-    window.location.reload();
+/**
+ * Signs the user out, by removing the session cookie.
+ * Automatically adds the CSRF token to the request.
+ *
+ * ```ts
+ * import { signOut } from "@auth/solid-start/client"
+ * signOut()
+ * ```
+ */
+export async function signOut(options) {
+    const { callbackUrl = window.location.href } = options ?? {};
+    // TODO: Custom base path
+    const csrfTokenResponse = await fetch("/api/auth/csrf");
+    const { csrfToken } = await csrfTokenResponse.json();
+    const res = await fetch(`/api/auth/signout`, {
+        method: "post",
+        headers: {
+            "Content-Type": "application/x-www-form-urlencoded",
+            "X-Auth-Return-Redirect": "1",
+        },
+        body: new URLSearchParams({
+            csrfToken,
+            callbackUrl,
+        }),
+    });
+    const data = await res.json();
+    const url = data.url ?? data.redirect ?? callbackUrl;
+    window.location.href = url;
+    // If url contains a hash, the browser does not reload the page. We reload manually
+    if (url.includes("#"))
+        window.location.reload();
 }
-__name(signOut, "signOut");
-export {
-  signIn,
-  signOut
-};

package/index.d.ts

@@ -1,5 +1,3 @@
-import { AuthConfig, Session } from '@auth/core/types';
-
 /**
  *
  * :::warning
@@ -19,8 +17,8 @@ import { AuthConfig, Session } from '@auth/core/types';
  *
  * @module @auth/solid-start
  */
-
-interface SolidAuthConfig extends AuthConfig {
+import type { AuthConfig, Session } from "@auth/core/types";
+export interface SolidAuthConfig extends AuthConfig {
     /**
      * Defines the base path for the auth routes.
      * @default '/api/auth'
@@ -203,11 +201,10 @@ interface SolidAuthConfig extends AuthConfig {
  * :::
  *
  */
-declare function SolidAuth(config: SolidAuthConfig): {
+export declare function SolidAuth(config: SolidAuthConfig): {
     GET(event: any): Promise<Response | undefined>;
     POST(event: any): Promise<Response | undefined>;
 };
-type GetSessionResult = Promise<Session | null>;
-declare function getSession(req: Request, options: Omit<AuthConfig, "raw">): GetSessionResult;
-
-export { GetSessionResult, SolidAuth, SolidAuthConfig, getSession };
+export type GetSessionResult = Promise<Session | null>;
+export declare function getSession(req: Request, options: Omit<AuthConfig, "raw">): GetSessionResult;
+//# sourceMappingURL=index.d.ts.map

package/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["src/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;GAkBG;AAGH,OAAO,KAAK,EAAc,UAAU,EAAE,OAAO,EAAE,MAAM,kBAAkB,CAAA;AAEvE,MAAM,WAAW,eAAgB,SAAQ,UAAU;IACjD;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,CAAA;CAChB;AA6BD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+KG;AACH,wBAAgB,SAAS,CAAC,MAAM,EAAE,eAAe;eAU5B,GAAG;gBAGF,GAAG;EAIxB;AAED,MAAM,MAAM,gBAAgB,GAAG,OAAO,CAAC,OAAO,GAAG,IAAI,CAAC,CAAA;AAEtD,wBAAsB,UAAU,CAC9B,GAAG,EAAE,OAAO,EACZ,OAAO,EAAE,IAAI,CAAC,UAAU,EAAE,KAAK,CAAC,GAC/B,gBAAgB,CAiBlB"}

package/index.js

@@ -1,61 +1,248 @@
-import {
-  __name
-} from "./chunk-HXRSFH6L.js";
+/**
+ *
+ * :::warning
+ * `@auth/solid-start` is currently experimental. The API _will_ change in the future.
+ * :::
+ *
+ * SolidStart Auth is the official SolidStart integration for Auth.js.
+ * It provides a simple way to add authentication to your SolidStart app in a few lines of code.
+ *
+ * ## Installation
+ *
+ * ```bash npm2yarn
+ * npm install @auth/core @auth/solid-start
+ * ```
+ *
+ * We recommended to using [create-jd-app](https://github.com/OrJDev/create-jd-app)
+ *
+ * @module @auth/solid-start
+ */
 import { Auth } from "@auth/core";
 const actions = [
-  "providers",
-  "session",
-  "csrf",
-  "signin",
-  "signout",
-  "callback",
-  "verify-request",
-  "error"
+    "providers",
+    "session",
+    "csrf",
+    "signin",
+    "signout",
+    "callback",
+    "verify-request",
+    "error",
 ];
 function SolidAuthHandler(prefix, authOptions) {
-  return async (event) => {
-    const { request } = event;
-    const url = new URL(request.url);
-    const action = url.pathname.slice(prefix.length + 1).split("/")[0];
-    if (!actions.includes(action) || !url.pathname.startsWith(prefix + "/")) {
-      return;
-    }
-    return await Auth(request, authOptions);
-  };
+    return async (event) => {
+        const { request } = event;
+        const url = new URL(request.url);
+        const action = url.pathname
+            .slice(prefix.length + 1)
+            .split("/")[0];
+        if (!actions.includes(action) || !url.pathname.startsWith(prefix + "/")) {
+            return;
+        }
+        return await Auth(request, authOptions);
+    };
 }
-__name(SolidAuthHandler, "SolidAuthHandler");
-function SolidAuth(config) {
-  const { prefix = "/api/auth", ...authOptions } = config;
-  authOptions.secret ??= process.env.AUTH_SECRET;
-  authOptions.trustHost ??= !!(process.env.AUTH_TRUST_HOST ?? process.env.VERCEL ?? process.env.NODE_ENV !== "production");
-  const handler = SolidAuthHandler(prefix, authOptions);
-  return {
-    async GET(event) {
-      return await handler(event);
-    },
-    async POST(event) {
-      return await handler(event);
-    }
-  };
+/**
+ * ## Setup
+ *
+ * [Generate an auth secret](https://generate-secret.vercel.app/32), then set it as an environment variable:
+ *
+ * ```
+ * AUTH_SECRET=your_auth_secret
+ * ```
+ *
+ * ## Creating the API handler
+ *
+ * in this example we are using github so make sure to set the following environment variables:
+ *
+ * ```
+ * GITHUB_ID=your_github_oauth_id
+ * GITHUB_SECRET=your_github_oauth_secret
+ * ```
+ *
+ * ```ts
+ * // routes/api/auth/[...solidauth].ts
+ * import { SolidAuth, type SolidAuthConfig } from "@auth/solid-start"
+ * import GitHub from "@auth/core/providers/github"
+ *
+ * export const authOpts: SolidAuthConfig = {
+ *   providers: [
+ *     GitHub({
+ *       clientId: process.env.GITHUB_ID,
+ *       clientSecret: process.env.GITHUB_SECRET,
+ *     }),
+ *   ],
+ *   debug: false,
+ * }
+ *
+ * export const { GET, POST } = SolidAuth(authOpts)
+ * ```
+ *
+ * ## Getting the current session
+ *
+ * ```ts
+ * import { getSession } from "@auth/solid-start"
+ * import { createServerData$ } from "solid-start/server"
+ * import { authOpts } from "~/routes/api/auth/[...solidauth]"
+ *
+ * export const useSession = () => {
+ *   return createServerData$(
+ *     async (_, { request }) => {
+ *       return await getSession(request, authOpts)
+ *     },
+ *     { key: () => ["auth_user"] }
+ *   )
+ * }
+ *
+ * // useSession returns a resource:
+ * const session = useSession()
+ * const loading = session.loading
+ * const user = () => session()?.user
+ * ```
+ * ## Protected Routes
+ *
+ * ### When Using SSR
+ *
+ * When using SSR, I recommend creating a `Protected` component that will trigger suspense using the `Show` component. It should look like this:
+ *
+ *
+ * ```tsx
+ * // components/Protected.tsx
+ * import { type Session } from "@auth/core/types";
+ * import { getSession } from "@auth/solid-start";
+ * import { Component, Show } from "solid-js";
+ * import { useRouteData } from "solid-start";
+ * import { createServerData$, redirect } from "solid-start/server";
+ * import { authOpts } from "~/routes/api/auth/[...solidauth]";
+ *
+ * const Protected = (Comp: IProtectedComponent) => {
+ *   const routeData = () => {
+ *     return createServerData$(
+ *       async (_, event) => {
+ *         const session = await getSession(event.request, authOpts);
+ *         if (!session || !session.user) {
+ *           throw redirect("/");
+ *         }
+ *         return session;
+ *       },
+ *       { key: () => ["auth_user"] }
+ *     );
+ *   };
+ *
+ *   return {
+ *     routeData,
+ *     Page: () => {
+ *       const session = useRouteData<typeof routeData>();
+ *       return (
+ *         <Show when={session()} keyed>
+ *           {(sess) => <Comp {...sess} />}
+ *         </Show>
+ *       );
+ *     },
+ *   };
+ * };
+ *
+ * type IProtectedComponent = Component<Session>;
+ *
+ * export default Protected;
+ * ```
+ *
+ * It can be used like this:
+ *
+ *
+ * ```tsx
+ * // routes/protected.tsx
+ * import Protected from "~/components/Protected";
+ *
+ * export const { routeData, Page } = Protected((session) => {
+ *   return (
+ *     <main class="flex flex-col gap-2 items-center">
+ *       <h1>This is a protected route</h1>
+ *     </main>
+ *   );
+ * });
+ *
+ * export default Page;
+ * ```
+ *
+ * ### When Using CSR
+ *
+ * When using CSR, the `Protected` component will not work as expected and will cause the screen to flash, so I had to come up with a tricky solution, we will use a Solid-Start middleware:
+ *
+ * ```tsx
+ * // entry-server.tsx
+ * import { Session } from "@auth/core";
+ * import { getSession } from "@auth/solid-start";
+ * import { redirect } from "solid-start";
+ * import {
+ *   StartServer,
+ *   createHandler,
+ *   renderAsync,
+ * } from "solid-start/entry-server";
+ * import { authOpts } from "./routes/api/auth/[...solidauth]";
+ *
+ * const protectedPaths = ["/protected"]; // add any route you wish in here
+ *
+ * export default createHandler(
+ *   ({ forward }) => {
+ *     return async (event) => {
+ *       if (protectedPaths.includes(new URL(event.request.url).pathname)) {
+ *         const session = await getSession(event.request, authOpts);
+ *         if (!session) {
+ *           return redirect("/");
+ *         }
+ *       }
+ *       return forward(event);
+ *     };
+ *   },
+ *   renderAsync((event) => <StartServer event={event} />)
+ * );
+ * ```
+ *
+ * And now you can easily create a protected route:
+ *
+ *
+ * ```tsx
+ * // routes/protected.tsx
+ * export default () => {
+ *   return (
+ *     <main class="flex flex-col gap-2 items-center">
+ *       <h1>This is a protected route</h1>
+ *     </main>
+ *   );
+ * };
+ * ```
+ *
+ * :::note
+ * The CSR method should also work when using SSR, the SSR method shouldn't work when using CSR
+ * :::
+ *
+ */
+export function SolidAuth(config) {
+    const { prefix = "/api/auth", ...authOptions } = config;
+    authOptions.secret ?? (authOptions.secret = process.env.AUTH_SECRET);
+    authOptions.trustHost ?? (authOptions.trustHost = !!(process.env.AUTH_TRUST_HOST ??
+        process.env.VERCEL ??
+        process.env.NODE_ENV !== "production"));
+    const handler = SolidAuthHandler(prefix, authOptions);
+    return {
+        async GET(event) {
+            return await handler(event);
+        },
+        async POST(event) {
+            return await handler(event);
+        },
+    };
 }
-__name(SolidAuth, "SolidAuth");
-async function getSession(req, options) {
-  options.secret ??= process.env.AUTH_SECRET;
-  options.trustHost ??= true;
-  const url = new URL("/api/auth/session", req.url);
-  const response = await Auth(new Request(url, {
-    headers: req.headers
-  }), options);
-  const { status = 200 } = response;
-  const data = await response.json();
-  if (!data || !Object.keys(data).length)
-    return null;
-  if (status === 200)
-    return data;
-  throw new Error(data.message);
+export async function getSession(req, options) {
+    options.secret ?? (options.secret = process.env.AUTH_SECRET);
+    options.trustHost ?? (options.trustHost = true);
+    const url = new URL("/api/auth/session", req.url);
+    const response = await Auth(new Request(url, { headers: req.headers }), options);
+    const { status = 200 } = response;
+    const data = await response.json();
+    if (!data || !Object.keys(data).length)
+        return null;
+    if (status === 200)
+        return data;
+    throw new Error(data.message);
 }
-__name(getSession, "getSession");
-export {
-  SolidAuth,
-  getSession
-};

package/package.json

@@ -1,11 +1,11 @@
 {
   "name": "@auth/solid-start",
   "description": "Authentication for SolidStart.",
-  "version": "0.6.0",
+  "version": "0.6.1",
   "type": "module",
   "files": [
-    "client.*",
-    "index.*",
+    "*.js",
+    "*.d.ts*",
     "src"
   ],
   "exports": {
@@ -32,8 +32,7 @@
     "@solidjs/meta": "^0.28.0",
     "@types/node": "^18.7.14",
     "solid-js": "^1.5.7",
-    "solid-start": "^0.2.14",
-    "tsup": "^6.5.0"
+    "solid-start": "^0.2.14"
   },
   "peerDependencies": {
     "solid-js": "^1.5.7",
@@ -48,9 +47,9 @@
   "repository": "https://github.com/nextauthjs/next-auth",
   "license": "ISC",
   "scripts": {
-    "build": "tsup --config ./tsup.config.js && node scripts/postbuild",
+    "build": "tsc",
     "patch": "npm version patch --no-git-tag-version",
     "test": "vitest -c ../utils/vitest.config.ts",
-    "clean": "rm -rf client.* index.*"
+    "clean": "rm -rf *.js *.d.ts*"
   }
 }