@pylo/react 0.7.0 → 0.8.0

package/dist/{chunk-SBMMJYJT.js → chunk-XCHM5XBY.js}

@@ -18,7 +18,9 @@ import {
   extractErrorMessage,
   isUnauthorizedError,
   shouldRefreshToken,
+  safeRedirectPath,
   LOGIN_MUTATION,
+  REDEEM_LOGIN_HANDOFF_MUTATION,
   REFRESH_TOKEN_MUTATION
 } from "@pylo/auth";
 function createSessionStore(options) {
@@ -41,6 +43,11 @@ function createSessionStore(options) {
     await options.storage.setItem(REFRESH_KEY, refresh2);
     setState({ status: "signedIn", token: auth });
   }
+  async function signIn(auth, refresh2) {
+    var _a2;
+    await persist(auth, refresh2);
+    (_a2 = options.onSignIn) == null ? void 0 : _a2.call(options);
+  }
   async function clear() {
     var _a2;
     refreshToken = null;
@@ -51,6 +58,7 @@ function createSessionStore(options) {
   }
   async function runRefresh() {
     await init();
+    if (state.status !== "signedIn") return null;
     if (!refreshToken) {
       await clear();
       return null;
@@ -110,7 +118,7 @@ function createSessionStore(options) {
     },
     refresh,
     async login(email, password) {
-      var _a2, _b;
+      var _a2;
       const response = await graphqlRequest(
         options.endpoint,
         LOGIN_MUTATION,
@@ -138,14 +146,105 @@ function createSessionStore(options) {
         };
       }
       const { auth_token, refresh_token } = response.data.login.data;
-      await persist(auth_token, refresh_token);
-      (_b = options.onSignIn) == null ? void 0 : _b.call(options);
+      await signIn(auth_token, refresh_token);
       return { success: true, authToken: auth_token, refreshToken: refresh_token };
     },
+    async redeemHandoff(code, verifier) {
+      var _a2;
+      const response = await graphqlRequest(
+        options.endpoint,
+        REDEEM_LOGIN_HANDOFF_MUTATION,
+        { input: { code, handoff_verifier: verifier } }
+      );
+      if (hasErrors(response) || !response.data) {
+        return {
+          success: false,
+          error: {
+            code: "SIGN_IN_FAILED",
+            message: (_a2 = extractErrorMessage(response.errors)) != null ? _a2 : "Sign-in failed"
+          }
+        };
+      }
+      const { auth_token, refresh_token, redirect } = response.data.redeemLoginHandoff.data;
+      await signIn(auth_token, refresh_token);
+      const safe = safeRedirectPath(redirect);
+      return {
+        success: true,
+        authToken: auth_token,
+        refreshToken: refresh_token,
+        ...safe !== null ? { redirect: safe } : {}
+      };
+    },
     logout: clear
   };
 }
 
+// src/session/social.ts
+import {
+  buildSocialStartUrl,
+  createHandoffChallenge,
+  createHandoffVerifier,
+  parseHandoffCallback
+} from "@pylo/auth";
+function failed(code, message) {
+  return { success: false, error: { code, message } };
+}
+function createSocialSignIn(o) {
+  const verifierKey = `${o.keyPrefix}.handoff_verifier`;
+  function redeem(parsed, verifier) {
+    if (!parsed) return failed("SIGN_IN_FAILED", "No sign-in response in this URL");
+    if ("error" in parsed) return failed("SIGN_IN_FAILED", parsed.error);
+    if (!verifier) {
+      return failed("SIGN_IN_FAILED", "No sign-in was started in this browser session");
+    }
+    return o.store.redeemHandoff(parsed.code, verifier);
+  }
+  return {
+    async signInWith(provider, { returnUrl, redirect, invite }) {
+      const verifier = createHandoffVerifier(o.crypto);
+      const challenge = await createHandoffChallenge(verifier, o.crypto);
+      const startUrl = buildSocialStartUrl({
+        endpoint: o.endpoint,
+        provider,
+        appId: o.appId,
+        returnUrl,
+        challenge,
+        ...redirect !== void 0 ? { redirect } : {},
+        ...invite !== void 0 ? { invite } : {}
+      });
+      if (o.openAuthSession) {
+        let finalUrl;
+        try {
+          finalUrl = await o.openAuthSession(startUrl, returnUrl);
+        } catch (error) {
+          return failed(
+            "SIGN_IN_FAILED",
+            error instanceof Error ? error.message : "Sign-in failed"
+          );
+        }
+        if (finalUrl === null) return failed("CANCELLED", "Sign-in was cancelled");
+        return redeem(parseHandoffCallback(finalUrl), verifier);
+      }
+      sessionStorage.setItem(verifierKey, verifier);
+      location.assign(startUrl);
+      return new Promise(() => {
+      });
+    },
+    async completeSignIn(url = location.href) {
+      const verifier = sessionStorage.getItem(verifierKey);
+      sessionStorage.removeItem(verifierKey);
+      const parsed = parseHandoffCallback(url);
+      if (parsed) {
+        const clean = new URL(url);
+        clean.searchParams.delete("code");
+        clean.searchParams.delete("error");
+        history.replaceState(history.state, "", clean.toString());
+      }
+      return redeem(parsed, verifier);
+    }
+  };
+}
+
 // src/session/storage.ts
 function createMemoryStorage() {
   const store = /* @__PURE__ */ new Map();
@@ -249,10 +348,13 @@ var SIGNED_OUT = { status: "signedOut", token: null };
 var NO_OP = () => () => {
 };
 function PyloProvider(props) {
-  var _a;
+  var _a, _b;
   const queryClient = useQueryClient();
   const endpoint = resolveEndpoint(props.endpoint);
   const storeRef = useRef(null);
+  const socialRef = useRef(null);
+  const openAuthSessionRef = useRef(props.openAuthSession);
+  openAuthSessionRef.current = props.openAuthSession;
   if (storeRef.current === null && !props.getToken) {
     storeRef.current = createSessionStore({
       endpoint,
@@ -262,8 +364,19 @@ function PyloProvider(props) {
       onSignOut: () => queryClient.clear(),
       onSignIn: () => void queryClient.invalidateQueries({ queryKey: ["pylo"] })
     });
+    if (props.appId !== void 0) {
+      socialRef.current = createSocialSignIn({
+        endpoint,
+        appId: props.appId,
+        keyPrefix: (_b = props.keyPrefix) != null ? _b : "pylo",
+        store: storeRef.current,
+        ...props.openAuthSession ? { openAuthSession: (url, returnUrl) => openAuthSessionRef.current(url, returnUrl) } : {},
+        ...props.handoffCrypto ? { crypto: props.handoffCrypto } : {}
+      });
+    }
   }
   const store = storeRef.current;
+  const social = socialRef.current;
   const state = useSyncExternalStore(
     store ? store.subscribe : NO_OP,
     store ? store.getState : () => SIGNED_OUT,
@@ -283,8 +396,8 @@ function PyloProvider(props) {
       getToken,
       ...store ? { onUnauthorized: () => store.refresh() } : {}
     });
-    return { transport, endpoint, state, store, getToken };
-  }, [endpoint, state, store, isEscapeHatch]);
+    return { transport, endpoint, state, store, social, getToken };
+  }, [endpoint, state, store, social, isEscapeHatch]);
   return /* @__PURE__ */ jsx(PyloContext.Provider, { value, children: props.children });
 }
 function usePyloTransport() {
@@ -304,7 +417,7 @@ function usePyloClient() {
   );
 }
 function usePyloAuth() {
-  const { state, store, transport, getToken } = usePyloContext();
+  const { state, store, social, transport, getToken } = usePyloContext();
   const isSignedIn = state.status === "signedIn";
   const me = useQuery({
     queryKey: ["pylo", "me"],
@@ -330,8 +443,17 @@ function usePyloAuth() {
       }
       await store.logout();
     },
+    signInWith: async (provider, options) => requireSocial("signInWith").signInWith(provider, options),
+    completeSignIn: async (url) => requireSocial("completeSignIn").completeSignIn(url),
     getToken
   };
+  function requireSocial(method) {
+    if (!store) {
+      throw new Error(`${method} is unavailable when PyloProvider is given getToken`);
+    }
+    if (!social) throw new Error(`${method} requires PyloProvider's appId`);
+    return social;
+  }
 }
 
 export {

package/dist/chunk-XR5CLHMS.js

@@ -0,0 +1,470 @@
+// src/provider.tsx
+import {
+  createContext,
+  useContext,
+  useEffect,
+  useMemo,
+  useRef,
+  useSyncExternalStore
+} from "react";
+import { useQuery, useQueryClient } from "@tanstack/react-query";
+import { createPyloClient, resolveEndpoint } from "@pylo/core";
+import { ME_QUERY } from "@pylo/auth";
+
+// src/session/store.ts
+import {
+  graphqlRequest,
+  hasErrors,
+  extractErrorMessage,
+  isUnauthorizedError,
+  shouldRefreshToken,
+  safeRedirectPath,
+  LOGIN_MUTATION,
+  REDEEM_LOGIN_HANDOFF_MUTATION,
+  REFRESH_TOKEN_MUTATION
+} from "@pylo/auth";
+function createSessionStore(options) {
+  var _a;
+  const prefix = (_a = options.keyPrefix) != null ? _a : "pylo";
+  const AUTH_KEY = `${prefix}.auth_token`;
+  const REFRESH_KEY = `${prefix}.refresh_token`;
+  let state = { status: "loading", token: null };
+  let refreshToken = null;
+  let inFlight = null;
+  let ready = null;
+  const listeners = /* @__PURE__ */ new Set();
+  function setState(next) {
+    state = next;
+    for (const listener of listeners) listener();
+  }
+  async function persist(auth, refresh2) {
+    refreshToken = refresh2;
+    await options.storage.setItem(AUTH_KEY, auth);
+    await options.storage.setItem(REFRESH_KEY, refresh2);
+    setState({ status: "signedIn", token: auth });
+  }
+  async function signIn(auth, refresh2) {
+    var _a2;
+    await persist(auth, refresh2);
+    (_a2 = options.onSignIn) == null ? void 0 : _a2.call(options);
+  }
+  async function clear() {
+    var _a2;
+    refreshToken = null;
+    await options.storage.removeItem(AUTH_KEY);
+    await options.storage.removeItem(REFRESH_KEY);
+    setState({ status: "signedOut", token: null });
+    (_a2 = options.onSignOut) == null ? void 0 : _a2.call(options);
+  }
+  async function runRefresh() {
+    await init();
+    if (state.status !== "signedIn") return null;
+    if (!refreshToken) {
+      await clear();
+      return null;
+    }
+    const response = await graphqlRequest(
+      options.endpoint,
+      REFRESH_TOKEN_MUTATION,
+      { input: { refresh_token: refreshToken } }
+    );
+    if (hasErrors(response) || !response.data) {
+      if (isUnauthorizedError(response)) {
+        await clear();
+        return null;
+      }
+      return state.token;
+    }
+    const { auth_token, refresh_token } = response.data.refreshToken.data;
+    await persist(auth_token, refresh_token);
+    return auth_token;
+  }
+  function init() {
+    ready != null ? ready : ready = (async () => {
+      try {
+        const [auth, stored] = await Promise.all([
+          options.storage.getItem(AUTH_KEY),
+          options.storage.getItem(REFRESH_KEY)
+        ]);
+        refreshToken = stored;
+        setState(
+          auth ? { status: "signedIn", token: auth } : { status: "signedOut", token: null }
+        );
+      } catch {
+        refreshToken = null;
+        setState({ status: "signedOut", token: null });
+      }
+    })();
+    return ready;
+  }
+  function refresh() {
+    inFlight != null ? inFlight : inFlight = runRefresh().finally(() => {
+      inFlight = null;
+    });
+    return inFlight;
+  }
+  return {
+    getState: () => state,
+    subscribe(listener) {
+      listeners.add(listener);
+      return () => void listeners.delete(listener);
+    },
+    init,
+    async getToken() {
+      await init();
+      if (!state.token) return null;
+      if (shouldRefreshToken(state.token)) return refresh();
+      return state.token;
+    },
+    refresh,
+    async login(email, password) {
+      var _a2;
+      const response = await graphqlRequest(
+        options.endpoint,
+        LOGIN_MUTATION,
+        {
+          input: {
+            email,
+            password,
+            ...options.appId !== void 0 ? { pylo_app_id: options.appId } : {}
+          }
+        }
+      );
+      if (hasErrors(response)) {
+        return {
+          success: false,
+          error: {
+            code: "INVALID_CREDENTIALS",
+            message: (_a2 = extractErrorMessage(response.errors)) != null ? _a2 : "Login failed"
+          }
+        };
+      }
+      if (!response.data) {
+        return {
+          success: false,
+          error: { code: "SERVER_ERROR", message: "No data returned" }
+        };
+      }
+      const { auth_token, refresh_token } = response.data.login.data;
+      await signIn(auth_token, refresh_token);
+      return { success: true, authToken: auth_token, refreshToken: refresh_token };
+    },
+    async redeemHandoff(code, verifier) {
+      var _a2;
+      const response = await graphqlRequest(
+        options.endpoint,
+        REDEEM_LOGIN_HANDOFF_MUTATION,
+        { input: { code, handoff_verifier: verifier } }
+      );
+      if (hasErrors(response) || !response.data) {
+        return {
+          success: false,
+          error: {
+            code: "SIGN_IN_FAILED",
+            message: (_a2 = extractErrorMessage(response.errors)) != null ? _a2 : "Sign-in failed"
+          }
+        };
+      }
+      const { auth_token, refresh_token, redirect } = response.data.redeemLoginHandoff.data;
+      await signIn(auth_token, refresh_token);
+      const safe = safeRedirectPath(redirect);
+      return {
+        success: true,
+        authToken: auth_token,
+        refreshToken: refresh_token,
+        ...safe !== null ? { redirect: safe } : {}
+      };
+    },
+    logout: clear
+  };
+}
+
+// src/session/social.ts
+import {
+  buildSocialStartUrl,
+  createHandoffChallenge,
+  createHandoffVerifier,
+  parseHandoffCallback
+} from "@pylo/auth";
+function failed(code, message) {
+  return { success: false, error: { code, message } };
+}
+function createSocialSignIn(o) {
+  const verifierKey = `${o.keyPrefix}.handoff_verifier`;
+  function redeem(parsed, verifier) {
+    if (!parsed) return failed("SIGN_IN_FAILED", "No sign-in response in this URL");
+    if ("error" in parsed) return failed("SIGN_IN_FAILED", parsed.error);
+    if (!verifier) {
+      return failed("SIGN_IN_FAILED", "No sign-in was started in this browser session");
+    }
+    return o.store.redeemHandoff(parsed.code, verifier);
+  }
+  return {
+    async signInWith(provider, { returnUrl, redirect, invite }) {
+      const verifier = createHandoffVerifier(o.crypto);
+      const challenge = await createHandoffChallenge(verifier, o.crypto);
+      const startUrl = buildSocialStartUrl({
+        endpoint: o.endpoint,
+        provider,
+        appId: o.appId,
+        returnUrl,
+        challenge,
+        ...redirect !== void 0 ? { redirect } : {},
+        ...invite !== void 0 ? { invite } : {}
+      });
+      if (o.openAuthSession) {
+        let finalUrl;
+        try {
+          finalUrl = await o.openAuthSession(startUrl, returnUrl);
+        } catch (error) {
+          return failed(
+            "SIGN_IN_FAILED",
+            error instanceof Error ? error.message : "Sign-in failed"
+          );
+        }
+        if (finalUrl === null) return failed("CANCELLED", "Sign-in was cancelled");
+        return redeem(parseHandoffCallback(finalUrl), verifier);
+      }
+      sessionStorage.setItem(verifierKey, verifier);
+      location.assign(startUrl);
+      return new Promise(() => {
+      });
+    },
+    async completeSignIn(url = location.href) {
+      const verifier = sessionStorage.getItem(verifierKey);
+      sessionStorage.removeItem(verifierKey);
+      const parsed = parseHandoffCallback(url);
+      if (parsed) {
+        const clean = new URL(url);
+        clean.searchParams.delete("code");
+        clean.searchParams.delete("error");
+        history.replaceState(history.state, "", clean.toString());
+      }
+      return redeem(parsed, verifier);
+    }
+  };
+}
+
+// src/session/storage.ts
+function createMemoryStorage() {
+  const store = /* @__PURE__ */ new Map();
+  return {
+    getItem: async (key) => {
+      var _a;
+      return (_a = store.get(key)) != null ? _a : null;
+    },
+    setItem: async (key, value) => void store.set(key, value),
+    removeItem: async (key) => void store.delete(key)
+  };
+}
+function createLocalStorageAdapter() {
+  let web;
+  try {
+    web = globalThis.localStorage;
+  } catch {
+    web = void 0;
+  }
+  if (!web) return createMemoryStorage();
+  const fallback = createMemoryStorage();
+  return {
+    getItem: async (key) => {
+      try {
+        const value = web.getItem(key);
+        if (value !== null) return value;
+      } catch {
+      }
+      return fallback.getItem(key);
+    },
+    setItem: async (key, value) => {
+      try {
+        web.setItem(key, value);
+      } catch {
+        await fallback.setItem(key, value);
+      }
+    },
+    removeItem: async (key) => {
+      try {
+        web.removeItem(key);
+      } catch {
+      }
+      await fallback.removeItem(key);
+    }
+  };
+}
+
+// src/transport.ts
+import {
+  graphqlRequest as graphqlRequest2,
+  hasErrors as hasErrors2,
+  extractErrorMessage as extractErrorMessage2,
+  isUnauthorizedError as isUnauthorizedError2
+} from "@pylo/auth";
+import { PyloError } from "@pylo/core";
+function createDirectTransport(options) {
+  function send(query, variables, headers, token) {
+    return graphqlRequest2(
+      options.endpoint,
+      query,
+      variables,
+      {
+        ...token !== null ? { token } : {},
+        ...headers !== void 0 ? { headers } : {}
+      }
+    );
+  }
+  return async (query, variables, headers) => {
+    var _a;
+    let response = await send(query, variables, headers, await options.getToken());
+    if (isUnauthorizedError2(response) && options.onUnauthorized) {
+      const token = await options.onUnauthorized();
+      if (token !== null) {
+        response = await send(query, variables, headers, token);
+      }
+    }
+    if (hasErrors2(response)) {
+      throw new PyloError(
+        (_a = extractErrorMessage2(response.errors)) != null ? _a : "GraphQL request failed",
+        response.errors
+      );
+    }
+    if (!response.data) {
+      throw new PyloError("No data returned from GraphQL request");
+    }
+    return response.data;
+  };
+}
+
+// src/provider.tsx
+import { jsx } from "react/jsx-runtime";
+var PyloContext = createContext(null);
+function usePyloContext() {
+  const value = useContext(PyloContext);
+  if (!value) {
+    throw new Error("usePylo* must be used inside <PyloProvider>");
+  }
+  return value;
+}
+var SIGNED_OUT = { status: "signedOut", token: null };
+var NO_OP = () => () => {
+};
+function PyloProvider(props) {
+  var _a, _b;
+  const queryClient = useQueryClient();
+  const endpoint = resolveEndpoint(props.endpoint);
+  const storeRef = useRef(null);
+  const socialRef = useRef(null);
+  const openAuthSessionRef = useRef(props.openAuthSession);
+  openAuthSessionRef.current = props.openAuthSession;
+  if (storeRef.current === null && !props.getToken) {
+    storeRef.current = createSessionStore({
+      endpoint,
+      storage: (_a = props.storage) != null ? _a : createLocalStorageAdapter(),
+      ...props.appId !== void 0 ? { appId: props.appId } : {},
+      ...props.keyPrefix !== void 0 ? { keyPrefix: props.keyPrefix } : {},
+      onSignOut: () => queryClient.clear(),
+      onSignIn: () => void queryClient.invalidateQueries({ queryKey: ["pylo"] })
+    });
+    if (props.appId !== void 0) {
+      socialRef.current = createSocialSignIn({
+        endpoint,
+        appId: props.appId,
+        keyPrefix: (_b = props.keyPrefix) != null ? _b : "pylo",
+        store: storeRef.current,
+        ...props.openAuthSession ? {
+          openAuthSession: (url, returnUrl) => openAuthSessionRef.current(url, returnUrl)
+        } : {},
+        ...props.handoffCrypto ? { crypto: props.handoffCrypto } : {}
+      });
+    }
+  }
+  const store = storeRef.current;
+  const social = socialRef.current;
+  const state = useSyncExternalStore(
+    store ? store.subscribe : NO_OP,
+    store ? store.getState : () => SIGNED_OUT,
+    store ? store.getState : () => SIGNED_OUT
+  );
+  useEffect(() => {
+    void (store == null ? void 0 : store.init());
+  }, [store]);
+  const getTokenProp = props.getToken;
+  const getTokenRef = useRef(getTokenProp);
+  getTokenRef.current = getTokenProp;
+  const isEscapeHatch = getTokenProp !== void 0;
+  const value = useMemo(() => {
+    const getToken = isEscapeHatch ? () => getTokenRef.current() : () => store.getToken();
+    const transport = createDirectTransport({
+      endpoint,
+      getToken,
+      ...store ? { onUnauthorized: () => store.refresh() } : {}
+    });
+    return { transport, endpoint, state, store, social, getToken };
+  }, [endpoint, state, store, social, isEscapeHatch]);
+  return /* @__PURE__ */ jsx(PyloContext.Provider, { value, children: props.children });
+}
+function usePyloTransport() {
+  return usePyloContext().transport;
+}
+function usePyloClient() {
+  const { endpoint, getToken } = usePyloContext();
+  return useMemo(
+    () => createPyloClient({
+      endpoint,
+      auth: async () => {
+        const token = await getToken();
+        return token !== null ? { token } : {};
+      }
+    }),
+    [endpoint, getToken]
+  );
+}
+function usePyloAuth() {
+  const { state, store, social, transport, getToken } = usePyloContext();
+  const isSignedIn = state.status === "signedIn";
+  const me = useQuery({
+    queryKey: ["pylo", "me"],
+    queryFn: async () => {
+      const data = await transport(ME_QUERY, {});
+      return data.me.current_user.data;
+    },
+    enabled: isSignedIn
+  });
+  return {
+    isLoading: state.status === "loading" || isSignedIn && me.isLoading,
+    isSignedIn,
+    user: me.data,
+    login: async (email, password) => {
+      if (!store) {
+        throw new Error("login is unavailable when PyloProvider is given getToken");
+      }
+      return store.login(email, password);
+    },
+    logout: async () => {
+      if (!store) {
+        throw new Error("logout is unavailable when PyloProvider is given getToken");
+      }
+      await store.logout();
+    },
+    signInWith: async (provider, options) => requireSocial("signInWith").signInWith(provider, options),
+    completeSignIn: async (url) => requireSocial("completeSignIn").completeSignIn(url),
+    getToken
+  };
+  function requireSocial(method) {
+    if (!store) {
+      throw new Error(`${method} is unavailable when PyloProvider is given getToken`);
+    }
+    if (!social) throw new Error(`${method} requires PyloProvider's appId`);
+    return social;
+  }
+}
+
+export {
+  createSessionStore,
+  createMemoryStorage,
+  createLocalStorageAdapter,
+  createDirectTransport,
+  PyloProvider,
+  usePyloTransport,
+  usePyloClient,
+  usePyloAuth
+};