@gately/react 1.0.0

package/dist/hooks/useUser.d.ts

@@ -0,0 +1,42 @@
+/**
+ * useUser Hook
+ * Dedicated hook for accessing user information
+ */
+import type { User } from '@gately/sdk';
+export interface UseUserReturn {
+    user: User | null;
+    profile: any | null;
+    isLoading: boolean;
+    error: Error | null;
+    refetch: () => Promise<void>;
+    update: (updates: any) => Promise<any>;
+    delete: () => Promise<void>;
+}
+/**
+ * Hook to access and manage user information
+ *
+ * @returns {UseUserReturn} User data with loading and error states
+ *
+ * @example
+ * ```tsx
+ * function UserProfile() {
+ *   const { user, profile, isLoading, error, update } = useUser()
+ *
+ *   if (isLoading) return <p>Loading...</p>
+ *   if (error) return <p>Error: {error.message}</p>
+ *   if (!user) return <p>Not logged in</p>
+ *
+ *   return (
+ *     <div>
+ *       <p>Email: {user.email}</p>
+ *       <button onClick={() => update({ name: 'New Name' })}>
+ *         Update Profile
+ *       </button>
+ *     </div>
+ *   )
+ * }
+ * ```
+ */
+export declare function useUser(): UseUserReturn;
+export default useUser;
+//# sourceMappingURL=useUser.d.ts.map

package/dist/hooks/useUser.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useUser.d.ts","sourceRoot":"","sources":["../../src/hooks/useUser.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAIH,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,aAAa,CAAA;AAEvC,MAAM,WAAW,aAAa;IAC5B,IAAI,EAAE,IAAI,GAAG,IAAI,CAAA;IACjB,OAAO,EAAE,GAAG,GAAG,IAAI,CAAA;IACnB,SAAS,EAAE,OAAO,CAAA;IAClB,KAAK,EAAE,KAAK,GAAG,IAAI,CAAA;IACnB,OAAO,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAA;IAC5B,MAAM,EAAE,CAAC,OAAO,EAAE,GAAG,KAAK,OAAO,CAAC,GAAG,CAAC,CAAA;IACtC,MAAM,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAA;CAC5B;AAED;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AACH,wBAAgB,OAAO,IAAI,aAAa,CAoGvC;AAED,eAAe,OAAO,CAAA"}

package/dist/index.d.ts

@@ -0,0 +1,10 @@
+/**
+ * @gately/react
+ * React SDK for Gately authentication and user management
+ */
+export { GatelyProvider, GatelyContext } from './context';
+export type { GatelyContextValue, GatelyProviderProps } from './context';
+export { useAuth, useUser, useProtected } from './hooks';
+export type { UseUserReturn, UseProtectedReturn } from './hooks';
+export type { User, Session, AuthResponse } from '@gately/sdk';
+//# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAGH,OAAO,EAAE,cAAc,EAAE,aAAa,EAAE,MAAM,WAAW,CAAA;AACzD,YAAY,EAAE,kBAAkB,EAAE,mBAAmB,EAAE,MAAM,WAAW,CAAA;AAGxE,OAAO,EAAE,OAAO,EAAE,OAAO,EAAE,YAAY,EAAE,MAAM,SAAS,CAAA;AACxD,YAAY,EAAE,aAAa,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAA;AAGhE,YAAY,EAAE,IAAI,EAAE,OAAO,EAAE,YAAY,EAAE,MAAM,aAAa,CAAA"}

package/dist/index.js

@@ -0,0 +1,397 @@
+'use strict';
+
+var React = require('react');
+var sdk = require('@gately/sdk');
+
+/**
+ * Gately React Context
+ * Provides authentication state and methods to React components
+ */
+const GatelyContext = React.createContext(undefined);
+function GatelyProvider({ projectId, apiUrl, children, autoRefresh = true }) {
+    const [client] = React.useState(() => {
+        if (typeof window === 'undefined')
+            return null;
+        try {
+            return new sdk.GatelyClient(projectId, { apiUrl, autoRefresh });
+        }
+        catch (error) {
+            console.error('Failed to initialize Gately client:', error);
+            return null;
+        }
+    });
+    const [user, setUser] = React.useState(null);
+    const [session, setSession] = React.useState(null);
+    const [isLoading, setIsLoading] = React.useState(true);
+    const [error, setError] = React.useState(null);
+    React.useEffect(() => {
+        if (!client)
+            return;
+        setIsLoading(true);
+        setUser(client.getUser());
+        setSession(client.getSession());
+        setIsLoading(false);
+        const handleAuthStateChange = (newUser, newSession) => {
+            setUser(newUser);
+            setSession(newSession);
+            setError(null);
+        };
+        client.onAuthStateChange(handleAuthStateChange);
+        return () => {
+            client.offAuthStateChange(handleAuthStateChange);
+        };
+    }, [client]);
+    const login = React.useCallback(async (email, password) => {
+        if (!client)
+            throw new Error('Gately client not initialized');
+        setError(null);
+        try {
+            return await client.login(email, password);
+        }
+        catch (err) {
+            const error = err instanceof Error ? err : new Error(String(err));
+            setError(error);
+            throw error;
+        }
+    }, [client]);
+    const signup = React.useCallback(async (email, password, metadata) => {
+        if (!client)
+            throw new Error('Gately client not initialized');
+        setError(null);
+        try {
+            return await client.signup(email, password, metadata);
+        }
+        catch (err) {
+            const error = err instanceof Error ? err : new Error(String(err));
+            setError(error);
+            throw error;
+        }
+    }, [client]);
+    const logout = React.useCallback(async () => {
+        if (!client)
+            throw new Error('Gately client not initialized');
+        setError(null);
+        try {
+            await client.logout();
+        }
+        catch (err) {
+            const error = err instanceof Error ? err : new Error(String(err));
+            setError(error);
+            throw error;
+        }
+    }, [client]);
+    const sendMagicLink = React.useCallback(async (email, redirectTo) => {
+        if (!client)
+            throw new Error('Gately client not initialized');
+        setError(null);
+        try {
+            await client.sendMagicLink(email, { redirectTo });
+        }
+        catch (err) {
+            const error = err instanceof Error ? err : new Error(String(err));
+            setError(error);
+            throw error;
+        }
+    }, [client]);
+    const resetPassword = React.useCallback(async (email) => {
+        if (!client)
+            throw new Error('Gately client not initialized');
+        setError(null);
+        try {
+            await client.resetPassword(email);
+        }
+        catch (err) {
+            const error = err instanceof Error ? err : new Error(String(err));
+            setError(error);
+            throw error;
+        }
+    }, [client]);
+    const fetchSession = React.useCallback(async () => {
+        if (!client)
+            throw new Error('Gately client not initialized');
+        setError(null);
+        try {
+            return await client.fetchSession();
+        }
+        catch (err) {
+            const error = err instanceof Error ? err : new Error(String(err));
+            setError(error);
+            throw error;
+        }
+    }, [client]);
+    const getUserProfile = React.useCallback(async () => {
+        if (!client)
+            throw new Error('Gately client not initialized');
+        setError(null);
+        try {
+            return await client.getUserProfile();
+        }
+        catch (err) {
+            const error = err instanceof Error ? err : new Error(String(err));
+            setError(error);
+            throw error;
+        }
+    }, [client]);
+    const updateUserProfile = React.useCallback(async (updates) => {
+        if (!client)
+            throw new Error('Gately client not initialized');
+        setError(null);
+        try {
+            return await client.updateUserProfile(updates);
+        }
+        catch (err) {
+            const error = err instanceof Error ? err : new Error(String(err));
+            setError(error);
+            throw error;
+        }
+    }, [client]);
+    const deleteUserAccount = React.useCallback(async () => {
+        if (!client)
+            throw new Error('Gately client not initialized');
+        setError(null);
+        try {
+            await client.deleteUserAccount();
+        }
+        catch (err) {
+            const error = err instanceof Error ? err : new Error(String(err));
+            setError(error);
+            throw error;
+        }
+    }, [client]);
+    const changePassword = React.useCallback(async (current, newPassword) => {
+        if (!client)
+            throw new Error('Gately client not initialized');
+        setError(null);
+        try {
+            await client.changePassword(current, newPassword);
+        }
+        catch (err) {
+            const error = err instanceof Error ? err : new Error(String(err));
+            setError(error);
+            throw error;
+        }
+    }, [client]);
+    const value = {
+        user,
+        session,
+        isLoading,
+        isAuthenticated: !!session && new Date(session.expires_at) > new Date(),
+        error,
+        login,
+        signup,
+        logout,
+        sendMagicLink,
+        resetPassword,
+        fetchSession,
+        getUserProfile,
+        updateUserProfile,
+        deleteUserAccount,
+        changePassword,
+        client
+    };
+    return React.createElement(GatelyContext.Provider, { value }, children);
+}
+
+/**
+ * useAuth Hook
+ * Main hook for accessing Gately auth context
+ */
+/**
+ * Hook to access Gately authentication context
+ * Must be used inside a GatelyProvider
+ *
+ * @returns {GatelyContextValue} Auth context with user, session, and auth methods
+ *
+ * @example
+ * ```tsx
+ * function LoginForm() {
+ *   const { login, isLoading, error } = useAuth()
+ *
+ *   const handleSubmit = async (email, password) => {
+ *     try {
+ *       await login(email, password)
+ *     } catch (err) {
+ *       console.error(err)
+ *     }
+ *   }
+ *
+ *   return (
+ *     <>
+ *       {error && <p>{error.message}</p>}
+ *       <button disabled={isLoading} onClick={() => handleSubmit('test@example.com', 'pass')}>
+ *         {isLoading ? 'Logging in...' : 'Log In'}
+ *       </button>
+ *     </>
+ *   )
+ * }
+ * ```
+ */
+function useAuth() {
+    const context = React.useContext(GatelyContext);
+    if (context === undefined) {
+        throw new Error('useAuth must be used within a GatelyProvider');
+    }
+    return context;
+}
+
+/**
+ * useUser Hook
+ * Dedicated hook for accessing user information
+ */
+/**
+ * Hook to access and manage user information
+ *
+ * @returns {UseUserReturn} User data with loading and error states
+ *
+ * @example
+ * ```tsx
+ * function UserProfile() {
+ *   const { user, profile, isLoading, error, update } = useUser()
+ *
+ *   if (isLoading) return <p>Loading...</p>
+ *   if (error) return <p>Error: {error.message}</p>
+ *   if (!user) return <p>Not logged in</p>
+ *
+ *   return (
+ *     <div>
+ *       <p>Email: {user.email}</p>
+ *       <button onClick={() => update({ name: 'New Name' })}>
+ *         Update Profile
+ *       </button>
+ *     </div>
+ *   )
+ * }
+ * ```
+ */
+function useUser() {
+    const { user, isAuthenticated, getUserProfile, updateUserProfile, deleteUserAccount } = useAuth();
+    const [profile, setProfile] = React.useState(null);
+    const [isLoading, setIsLoading] = React.useState(false);
+    const [error, setError] = React.useState(null);
+    // Fetch user profile on mount or when auth state changes
+    React.useEffect(() => {
+        if (!isAuthenticated || !user) {
+            setProfile(null);
+            return;
+        }
+        const fetchProfile = async () => {
+            setIsLoading(true);
+            setError(null);
+            try {
+                const profileData = await getUserProfile();
+                setProfile(profileData);
+            }
+            catch (err) {
+                setError(err instanceof Error ? err : new Error(String(err)));
+                setProfile(null);
+            }
+            finally {
+                setIsLoading(false);
+            }
+        };
+        fetchProfile();
+    }, [isAuthenticated, user, getUserProfile]);
+    const refetch = React.useCallback(async () => {
+        if (!isAuthenticated) {
+            throw new Error('User must be authenticated to fetch profile');
+        }
+        setIsLoading(true);
+        setError(null);
+        try {
+            const profileData = await getUserProfile();
+            setProfile(profileData);
+        }
+        catch (err) {
+            const error = err instanceof Error ? err : new Error(String(err));
+            setError(error);
+            throw error;
+        }
+        finally {
+            setIsLoading(false);
+        }
+    }, [isAuthenticated, getUserProfile]);
+    const update = React.useCallback(async (updates) => {
+        if (!isAuthenticated) {
+            throw new Error('User must be authenticated to update profile');
+        }
+        setIsLoading(true);
+        setError(null);
+        try {
+            const updatedProfile = await updateUserProfile(updates);
+            setProfile(updatedProfile);
+            return updatedProfile;
+        }
+        catch (err) {
+            const error = err instanceof Error ? err : new Error(String(err));
+            setError(error);
+            throw error;
+        }
+        finally {
+            setIsLoading(false);
+        }
+    }, [isAuthenticated, updateUserProfile]);
+    const deleteUser = React.useCallback(async () => {
+        if (!isAuthenticated) {
+            throw new Error('User must be authenticated to delete account');
+        }
+        setIsLoading(true);
+        setError(null);
+        try {
+            await deleteUserAccount();
+            setProfile(null);
+        }
+        catch (err) {
+            const error = err instanceof Error ? err : new Error(String(err));
+            setError(error);
+            throw error;
+        }
+        finally {
+            setIsLoading(false);
+        }
+    }, [isAuthenticated, deleteUserAccount]);
+    return {
+        user,
+        profile,
+        isLoading,
+        error,
+        refetch,
+        update,
+        delete: deleteUser
+    };
+}
+
+/**
+ * useProtected Hook
+ * Hook for protecting components that require authentication
+ */
+/**
+ * Hook to check if user is authenticated and protect a component
+ *
+ * @returns {UseProtectedReturn} Authentication status
+ *
+ * @example
+ * ```tsx
+ * function ProtectedPage() {
+ *   const { isAuthenticated, isLoading } = useProtected()
+ *
+ *   if (isLoading) return <p>Loading...</p>
+ *   if (!isAuthenticated) return <p>Please log in to access this page</p>
+ *
+ *   return <div>Protected content</div>
+ * }
+ * ```
+ */
+function useProtected() {
+    const { isAuthenticated, isLoading, user } = useAuth();
+    return {
+        isAuthenticated,
+        isLoading,
+        user
+    };
+}
+
+exports.GatelyContext = GatelyContext;
+exports.GatelyProvider = GatelyProvider;
+exports.useAuth = useAuth;
+exports.useProtected = useProtected;
+exports.useUser = useUser;