@quiltt/react 5.0.0 → 5.0.2

package/dist/components/useSession-12s-BNotXj5T.cjs

@@ -0,0 +1,90 @@
+'use client';
+var react = require('react');
+var core = require('@quiltt/core');
+var useStorage12s = require('./useStorage-12s-D7nllsrI.cjs');
+
+// Initialize JWT parser with our specific claims type
+const parse = core.JsonWebTokenParse;
+// Global timer to manage token expiration across all hook instances
+const sessionTimer = new core.Timeoutable();
+/**
+ * Custom hook to manage JWT session state with automatic expiration handling.
+ * Provides global singleton access to the session across components and windows.
+ *
+ * TODO: Support Rotation before Expiry
+ *
+ * Handles two types of data flow:
+ * 1. Bottom-up (Login): Token passed through setSession callback
+ * 2. Top-down (Refresh): State reinitialized on page reload
+ *
+ * @param storageKey - Key used for storing session in useStorage (defaults to 'session')
+ * @returns [session, setSession] - Current session state and setter function
+ */ const useSession = (storageKey = 'session')=>{
+    const [token, setToken] = useStorage12s.useStorage(storageKey);
+    // Parse token into session data, updates when token changes
+    const session = react.useMemo(()=>parse(token), [
+        token
+    ]);
+    // Handle session expiration
+    react.useEffect(()=>{
+        if (!session) return;
+        const expirationMS = session.claims.exp * 1000;
+        const expire = ()=>setToken(null);
+        const checkExpiration = ()=>{
+            if (Date.now() >= expirationMS) {
+                expire();
+                return true;
+            }
+            return false;
+        };
+        // Clear immediately if already expired
+        if (checkExpiration()) {
+            return;
+        }
+        // Set timer to clear session at expiration time
+        sessionTimer.set(expire, expirationMS - Date.now());
+        // Also check expiration when tab becomes visible (handles idle sessions)
+        const handleVisibilityChange = ()=>{
+            if (!document.hidden) {
+                checkExpiration();
+            }
+        };
+        // Only add listener in browser environment
+        if (typeof document !== 'undefined') {
+            document.addEventListener('visibilitychange', handleVisibilityChange);
+        }
+        return ()=>{
+            sessionTimer.clear(expire);
+            if (typeof document !== 'undefined') {
+                document.removeEventListener('visibilitychange', handleVisibilityChange);
+            }
+        };
+    }, [
+        session,
+        setToken
+    ]);
+    /**
+   * Validates and updates the session token.
+   * - Handles both direct values and updater functions
+   * - Validates new tokens before setting them
+   * - Prevents unnecessary updates for same token value
+   * - Allows clearing the session with null/undefined
+   */ const setSession = react.useCallback((nextState)=>{
+        const newState = nextState instanceof Function ? nextState(token) : nextState;
+        // Only update if:
+        // 1. The token has actually changed AND
+        // 2. Either the new state is falsy (clearing session) OR it's a valid token
+        if (token !== newState && (!newState || parse(newState))) {
+            setToken(newState);
+        }
+    }, [
+        token,
+        setToken
+    ]);
+    return [
+        session,
+        setSession
+    ];
+};
+
+exports.useSession = useSession;

package/dist/components/useStorage-12s-D7nllsrI.cjs

@@ -0,0 +1,61 @@
+'use client';
+var react = require('react');
+var core = require('@quiltt/core');
+
+/**
+ * Attempt to persist state with local storage, so it remains after refresh and
+ * across open documents. Falls back to in memory storage when localStorage is
+ * unavailable.
+ *
+ * This hook is used in the same way as useState except that you must pass the
+ * storage key in the 1st parameter. If the window object is not present (as in SSR),
+ * useStorage() will return the default nextState.
+ *
+ * Expect values to remain in sync
+ *   Across Hooks
+ *   Across Reloads
+ *   Across Windows (Documents)
+ *
+ * @param key
+ * @param initialState
+ * @returns {Array} [storage, setStorage]
+ */ const useStorage = (key, initialState)=>{
+    const getStorage = react.useCallback(()=>{
+        const state = core.GlobalStorage.get(key);
+        if (state !== undefined) {
+            return state;
+        }
+        return initialState;
+    }, [
+        key,
+        initialState
+    ]);
+    const [hookState, setHookState] = react.useState(getStorage());
+    const setStorage = react.useCallback((nextState)=>{
+        const newState = nextState instanceof Function ? nextState(hookState) : nextState;
+        if (hookState !== newState) {
+            core.GlobalStorage.set(key, newState);
+            // Immediately update hook state as well
+            setHookState(newState);
+        }
+    }, [
+        key,
+        hookState
+    ]);
+    react.useEffect(()=>{
+        // Subscribe to storage changes from other sources (e.g., other hook instances, browser tabs)
+        const handleStorageChange = (newValue)=>{
+            setHookState(newValue);
+        };
+        core.GlobalStorage.subscribe(key, handleStorageChange);
+        return ()=>core.GlobalStorage.unsubscribe(key, handleStorageChange);
+    }, [
+        key
+    ]);
+    return [
+        hookState,
+        setStorage
+    ];
+};
+
+exports.useStorage = useStorage;

package/dist/contexts/QuilttSettings-12s-BK-0SQME.js

@@ -0,0 +1,6 @@
+'use client';
+import { createContext } from 'react';
+
+const QuilttSettings = createContext({});
+
+export { QuilttSettings as Q };

package/dist/contexts/QuilttSettings-12s-cLPT_GLC.cjs

@@ -0,0 +1,6 @@
+'use client';
+var react = require('react');
+
+const QuilttSettings = react.createContext({});
+
+exports.QuilttSettings = QuilttSettings;

package/dist/contexts/index.cjs

@@ -0,0 +1,7 @@
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var QuilttSettings12s = require('./QuilttSettings-12s-cLPT_GLC.cjs');
+
+
+
+exports.QuilttSettings = QuilttSettings12s.QuilttSettings;

package/dist/contexts/index.d.ts

@@ -0,0 +1,8 @@
+import * as react from 'react';
+
+type QuilttSettingsContext = {
+    clientId?: string;
+};
+declare const QuilttSettings: react.Context<QuilttSettingsContext>;
+
+export { QuilttSettings };

package/dist/contexts/index.js

@@ -0,0 +1 @@
+export { Q as QuilttSettings } from './QuilttSettings-12s-BK-0SQME.js';

package/dist/hooks/QuilttProviderRender-12s-DtQtubjL.js

@@ -0,0 +1,6 @@
+'use client';
+import { createContext } from 'react';
+
+const QuilttProviderRender = createContext({});
+
+export { QuilttProviderRender as Q };

package/dist/hooks/QuilttProviderRender-12s-pvnc98Lj.cjs

@@ -0,0 +1,6 @@
+'use client';
+var react = require('react');
+
+const QuilttProviderRender = react.createContext({});
+
+exports.QuilttProviderRender = QuilttProviderRender;

package/dist/hooks/QuilttSettings-12s-BK-0SQME.js

@@ -0,0 +1,6 @@
+'use client';
+import { createContext } from 'react';
+
+const QuilttSettings = createContext({});
+
+export { QuilttSettings as Q };

package/dist/hooks/QuilttSettings-12s-cLPT_GLC.cjs

@@ -0,0 +1,6 @@
+'use client';
+var react = require('react');
+
+const QuilttSettings = react.createContext({});
+
+exports.QuilttSettings = QuilttSettings;

package/dist/hooks/index.cjs

@@ -0,0 +1,31 @@
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var useEventListener12s = require('./useEventListener-12s-CV8cLxWu.cjs');
+var useIsomorphicLayoutEffect12s = require('./useIsomorphicLayoutEffect-12s-B8KjaroI.cjs');
+var useQuilttSession12s = require('./useQuilttSession-12s-C8kq5S2Y.cjs');
+var useQuilttClient12s = require('./useQuilttClient-12s-flQYSVdG.cjs');
+var useQuilttConnector12s = require('./useQuilttConnector-12s-sP-k4D3J.cjs');
+var useQuilttInstitutions12s = require('./useQuilttInstitutions-12s-BU_Vm7TY.cjs');
+var useQuilttRenderGuard12s = require('./useQuilttRenderGuard-12s-D9WbRzZO.cjs');
+var useQuilttResolvable12s = require('./useQuilttResolvable-12s-CGEfKPVU.cjs');
+var useQuilttSettings12s = require('./useQuilttSettings-12s-aDLXY6z3.cjs');
+var useSession12s = require('./useSession-12s-BNotXj5T.cjs');
+var useStorage12s = require('./useStorage-12s-D7nllsrI.cjs');
+
+
+
+exports.useEventListener = useEventListener12s.useEventListener;
+exports.useIsomorphicLayoutEffect = useIsomorphicLayoutEffect12s.useIsomorphicLayoutEffect;
+exports.useAuthenticateSession = useQuilttSession12s.useAuthenticateSession;
+exports.useIdentifySession = useQuilttSession12s.useIdentifySession;
+exports.useImportSession = useQuilttSession12s.useImportSession;
+exports.useQuilttSession = useQuilttSession12s.useQuilttSession;
+exports.useRevokeSession = useQuilttSession12s.useRevokeSession;
+exports.useQuilttClient = useQuilttClient12s.useQuilttClient;
+exports.useQuilttConnector = useQuilttConnector12s.useQuilttConnector;
+exports.useQuilttInstitutions = useQuilttInstitutions12s.useQuilttInstitutions;
+exports.useQuilttRenderGuard = useQuilttRenderGuard12s.useQuilttRenderGuard;
+exports.useQuilttResolvable = useQuilttResolvable12s.useQuilttResolvable;
+exports.useQuilttSettings = useQuilttSettings12s.useQuilttSettings;
+exports.useSession = useSession12s.useSession;
+exports.useStorage = useStorage12s.useStorage;

package/dist/hooks/index.d.ts

@@ -0,0 +1,142 @@
+import { RefObject, useEffect, Dispatch, SetStateAction } from 'react';
+import { Maybe, QuilttJWT, PasscodePayload, UnprocessableData, AuthAPI, UsernamePayload, ConnectorSDKConnectorOptions, InstitutionsData } from '@quiltt/core';
+import { useApolloClient } from '@apollo/client/react';
+
+declare function useEventListener<K extends keyof MediaQueryListEventMap>(eventName: K, handler: (event: MediaQueryListEventMap[K]) => void, element: RefObject<MediaQueryList>, options?: boolean | AddEventListenerOptions): void;
+declare function useEventListener<K extends keyof WindowEventMap>(eventName: K, handler: (event: WindowEventMap[K]) => void, element?: undefined, options?: boolean | AddEventListenerOptions): void;
+declare function useEventListener<K extends keyof HTMLElementEventMap, T extends HTMLElement = HTMLDivElement>(eventName: K, handler: (event: HTMLElementEventMap[K]) => void, element: RefObject<T>, options?: boolean | AddEventListenerOptions): void;
+declare function useEventListener<K extends keyof DocumentEventMap>(eventName: K, handler: (event: DocumentEventMap[K]) => void, element: RefObject<Document>, options?: boolean | AddEventListenerOptions): void;
+
+/**
+ * This hook is a browser hook. But React code could be generated from the server without the Window API.
+ * This hook switches between useEffect and useLayoutEffect following the execution environment.
+ */
+declare const useIsomorphicLayoutEffect: typeof useEffect;
+
+type SetSession = Dispatch<SetStateAction<Maybe<string> | undefined>>;
+/**
+ * Custom hook to manage JWT session state with automatic expiration handling.
+ * Provides global singleton access to the session across components and windows.
+ *
+ * TODO: Support Rotation before Expiry
+ *
+ * Handles two types of data flow:
+ * 1. Bottom-up (Login): Token passed through setSession callback
+ * 2. Top-down (Refresh): State reinitialized on page reload
+ *
+ * @param storageKey - Key used for storing session in useStorage (defaults to 'session')
+ * @returns [session, setSession] - Current session state and setter function
+ */
+declare const useSession: (storageKey?: string) => [Maybe<QuilttJWT> | undefined, SetSession];
+
+type AuthenticateSessionCallbacks = {
+    onSuccess?: () => unknown;
+    onFailure?: () => unknown;
+    onError?: (errors: UnprocessableData) => unknown;
+};
+type AuthenticateSession = (payload: PasscodePayload, callbacks: AuthenticateSessionCallbacks) => Promise<unknown>;
+type UseAuthenticateSession = (auth: AuthAPI, setSession: SetSession) => AuthenticateSession;
+declare const useAuthenticateSession: UseAuthenticateSession;
+
+type IdentifySessionCallbacks = {
+    onSuccess?: () => unknown;
+    onChallenged?: () => unknown;
+    onError?: (errors: UnprocessableData) => unknown;
+    onForbidden?: () => unknown;
+};
+type IdentifySession = (payload: UsernamePayload, callbacks: IdentifySessionCallbacks) => Promise<unknown>;
+type UseIdentifySession = (auth: AuthAPI, setSession: SetSession) => IdentifySession;
+declare const useIdentifySession: UseIdentifySession;
+
+type ImportSession = (token: string) => Promise<boolean>;
+type UseImportSession = (auth: AuthAPI, session: Maybe<QuilttJWT> | undefined, setSession: SetSession, environmentId?: string) => ImportSession;
+/**
+ * Optionally Accepts environmentId to validate session is from with your desired environment
+ */
+declare const useImportSession: UseImportSession;
+
+type RevokeSession = () => Promise<void>;
+type UseRevokeSession = (auth: AuthAPI, session: Maybe<QuilttJWT> | undefined, setSession: SetSession) => RevokeSession;
+declare const useRevokeSession: UseRevokeSession;
+
+declare const useQuilttClient: typeof useApolloClient;
+
+declare const useQuilttConnector: (connectorId?: string, options?: ConnectorSDKConnectorOptions) => {
+    open: () => void;
+};
+
+type UseQuilttInstitutions = (connectorId: string, onErrorCallback?: (msg: string) => void) => {
+    searchTerm: string;
+    searchResults: InstitutionsData;
+    isSearching: boolean;
+    setSearchTerm: (term: string) => void;
+};
+declare const useQuilttInstitutions: UseQuilttInstitutions;
+
+/**
+ * Internal hook that detects when a Quiltt SDK component may be rendered
+ * in the same component as QuilttProvider, which is an anti-pattern that
+ * can cause memory context issues and unexpected behavior.
+ *
+ * **Limitation**: Due to React context propagation, this will trigger for ALL
+ * descendants of QuilttProvider, not just direct children. This means it may
+ * produce false positives for valid nested component patterns. However, the
+ * primary use case (same-component rendering) is reliably detected.
+ *
+ * When the flag is set, this hook will emit a console error. This primarily
+ * helps catch the anti-pattern but may also flag valid nested structures.
+ *
+ * @param componentName - The name of the component calling this hook (for error messages)
+ */
+declare const useQuilttRenderGuard: (componentName: string) => void;
+
+type UseQuilttResolvable = (connectorId: string, onErrorCallback?: (msg: string) => void) => {
+    checkResolvable: (providerId: {
+        plaid?: string;
+        mock?: string;
+        mx?: string;
+        finicity?: string;
+        akoya?: string;
+    }) => Promise<boolean | null>;
+    isLoading: boolean;
+    isResolvable: boolean | null;
+    error: string | null;
+};
+declare const useQuilttResolvable: UseQuilttResolvable;
+
+type UseQuilttSession = (environmentId?: string) => {
+    session: Maybe<QuilttJWT> | undefined;
+    importSession: ImportSession;
+    identifySession: IdentifySession;
+    authenticateSession: AuthenticateSession;
+    revokeSession: RevokeSession;
+    forgetSession: (token?: string) => Promise<void>;
+};
+declare const useQuilttSession: UseQuilttSession;
+
+declare const useQuilttSettings: () => {
+    clientId?: string;
+};
+
+/**
+ * Attempt to persist state with local storage, so it remains after refresh and
+ * across open documents. Falls back to in memory storage when localStorage is
+ * unavailable.
+ *
+ * This hook is used in the same way as useState except that you must pass the
+ * storage key in the 1st parameter. If the window object is not present (as in SSR),
+ * useStorage() will return the default nextState.
+ *
+ * Expect values to remain in sync
+ *   Across Hooks
+ *   Across Reloads
+ *   Across Windows (Documents)
+ *
+ * @param key
+ * @param initialState
+ * @returns {Array} [storage, setStorage]
+ */
+declare const useStorage: <T>(key: string, initialState?: Maybe<T>) => [Maybe<T> | undefined, Dispatch<SetStateAction<Maybe<T> | undefined>>];
+
+export { useAuthenticateSession, useEventListener, useIdentifySession, useImportSession, useIsomorphicLayoutEffect, useQuilttClient, useQuilttConnector, useQuilttInstitutions, useQuilttRenderGuard, useQuilttResolvable, useQuilttSession, useQuilttSettings, useRevokeSession, useSession, useStorage };
+export type { AuthenticateSession, IdentifySession, ImportSession, RevokeSession, SetSession, UseQuilttInstitutions, UseQuilttResolvable, UseQuilttSession };

package/dist/hooks/index.js

@@ -0,0 +1,11 @@
+export { u as useEventListener } from './useEventListener-12s-D_-6QIXa.js';
+export { u as useIsomorphicLayoutEffect } from './useIsomorphicLayoutEffect-12s-DeTHOKz1.js';
+export { a as useAuthenticateSession, b as useIdentifySession, c as useImportSession, u as useQuilttSession, d as useRevokeSession } from './useQuilttSession-12s-DQFfjmob.js';
+export { u as useQuilttClient } from './useQuilttClient-12s-Dj_MtYTU.js';
+export { u as useQuilttConnector } from './useQuilttConnector-12s-BLZ0GoAH.js';
+export { u as useQuilttInstitutions } from './useQuilttInstitutions-12s-ByXIt9W6.js';
+export { u as useQuilttRenderGuard } from './useQuilttRenderGuard-12s-CsS2Ma6Q.js';
+export { u as useQuilttResolvable } from './useQuilttResolvable-12s-C5DByktm.js';
+export { u as useQuilttSettings } from './useQuilttSettings-12s--rCJoNHD.js';
+export { u as useSession } from './useSession-12s-BNPsfKY-.js';
+export { u as useStorage } from './useStorage-12s-CpG6X57D.js';

package/dist/hooks/useEventListener-12s-CV8cLxWu.cjs

@@ -0,0 +1,34 @@
+'use client';
+var react = require('react');
+var useIsomorphicLayoutEffect12s = require('./useIsomorphicLayoutEffect-12s-B8KjaroI.cjs');
+
+/**
+ * Supports Window, Element and Document and custom events with almost
+ * the same parameters as the native addEventListener options.
+ */ function useEventListener(eventName, handler, element, options) {
+    // Create a ref that stores handler
+    const savedHandler = react.useRef(handler);
+    useIsomorphicLayoutEffect12s.useIsomorphicLayoutEffect(()=>{
+        savedHandler.current = handler;
+    }, [
+        handler
+    ]);
+    react.useEffect(()=>{
+        // Define the listening target
+        const targetElement = element?.current ?? window;
+        if (!targetElement?.addEventListener) return;
+        // Create event listener that calls handler function stored in ref
+        const listener = (event)=>savedHandler.current(event);
+        targetElement.addEventListener(eventName, listener, options);
+        // Remove event listener on cleanup
+        return ()=>{
+            targetElement.removeEventListener(eventName, listener, options);
+        };
+    }, [
+        eventName,
+        element,
+        options
+    ]);
+}
+
+exports.useEventListener = useEventListener;

package/dist/hooks/useIsomorphicLayoutEffect-12s-B8KjaroI.cjs

@@ -0,0 +1,9 @@
+'use client';
+var react = require('react');
+
+/**
+ * This hook is a browser hook. But React code could be generated from the server without the Window API.
+ * This hook switches between useEffect and useLayoutEffect following the execution environment.
+ */ const useIsomorphicLayoutEffect = typeof window !== 'undefined' ? react.useLayoutEffect : react.useEffect;
+
+exports.useIsomorphicLayoutEffect = useIsomorphicLayoutEffect;

package/dist/hooks/useQuilttClient-12s-flQYSVdG.cjs

@@ -0,0 +1,6 @@
+'use client';
+var react = require('@apollo/client/react');
+
+const useQuilttClient = react.useApolloClient;
+
+exports.useQuilttClient = useQuilttClient;

package/dist/hooks/useQuilttConnector-12s-BLZ0GoAH.js

@@ -0,0 +1,174 @@
+'use client';
+import { useState, useRef, useEffect, useCallback } from 'react';
+import { cdnBase } from '@quiltt/core';
+import { u as useQuilttSession } from './useQuilttSession-12s-DQFfjmob.js';
+import { u as useScript } from './useScript-12s-JCgaTW9n.js';
+import { getUserAgent, isDeepEqual } from '../utils/index.js';
+
+var version = "5.0.2";
+
+const useQuilttConnector = (connectorId, options)=>{
+    const userAgent = getUserAgent(version);
+    const status = useScript(`${cdnBase}/v1/connector.js?agent=${encodeURIComponent(userAgent)}`, {
+        nonce: options?.nonce
+    });
+    // This ensures we're not destructuring `session` before the script has loaded
+    const useQuilttSessionReturn = useQuilttSession();
+    const session = useQuilttSessionReturn?.session || null;
+    const [connector, setConnector] = useState();
+    const [isOpening, setIsOpening] = useState(false);
+    // Keep track of the previous connectionId to detect changes
+    const prevConnectionIdRef = useRef(options?.connectionId);
+    const prevConnectorIdRef = useRef(connectorId);
+    const prevInstitutionRef = useRef(options?.institution);
+    const connectorCreatedRef = useRef(false);
+    // Track whether the connector is currently open
+    const isConnectorOpenRef = useRef(false);
+    // Store callbacks in refs to maintain stable references
+    const callbacksRef = useRef(options || {});
+    useEffect(()=>{
+        callbacksRef.current = options || {};
+    });
+    // Set Session
+    // biome-ignore lint/correctness/useExhaustiveDependencies: trigger effects when script status changes too
+    useEffect(()=>{
+        if (typeof Quiltt === 'undefined') return;
+        Quiltt.authenticate(session?.token);
+    }, [
+        status,
+        session?.token
+    ]);
+    // Set Connector
+    // biome-ignore lint/correctness/useExhaustiveDependencies: trigger effects when script status changes too
+    useEffect(()=>{
+        if (typeof Quiltt === 'undefined' || !connectorId) return;
+        const currentConnectionId = options?.connectionId;
+        const currentInstitution = options?.institution;
+        // Check for changes - use deep equality for institution object
+        const connectionIdChanged = prevConnectionIdRef.current !== currentConnectionId;
+        const connectorIdChanged = prevConnectorIdRef.current !== connectorId;
+        const institutionChanged = !isDeepEqual(prevInstitutionRef.current, currentInstitution);
+        const hasChanges = connectionIdChanged || connectorIdChanged || institutionChanged || !connectorCreatedRef.current;
+        // Update if there are changes, regardless of what the changes are
+        if (hasChanges) {
+            if (currentConnectionId) {
+                // Always use reconnect when connectionId is available
+                setConnector(Quiltt.reconnect(connectorId, {
+                    connectionId: currentConnectionId
+                }));
+            } else {
+                // Use connect for new connections without connectionId
+                setConnector(Quiltt.connect(connectorId, {
+                    institution: currentInstitution
+                }));
+            }
+            // Update refs
+            connectorCreatedRef.current = true;
+            prevConnectionIdRef.current = currentConnectionId;
+            prevConnectorIdRef.current = connectorId;
+            prevInstitutionRef.current = currentInstitution;
+        }
+    }, [
+        connectorId,
+        options?.connectionId,
+        options?.institution,
+        status
+    ]);
+    // Internal handlers to track connector state (stable references)
+    const handleOpen = useCallback((metadata)=>{
+        isConnectorOpenRef.current = true;
+        callbacksRef.current?.onOpen?.(metadata);
+    }, []);
+    const handleExit = useCallback((type, metadata)=>{
+        isConnectorOpenRef.current = false;
+        callbacksRef.current?.onExit?.(type, metadata);
+    }, []);
+    // Create stable wrapper functions for callbacks
+    const stableOnEvent = useCallback((type, metadata)=>{
+        callbacksRef.current?.onEvent?.(type, metadata);
+    }, []);
+    const stableOnLoad = useCallback((metadata)=>{
+        callbacksRef.current?.onLoad?.(metadata);
+    }, []);
+    const stableOnExitSuccess = useCallback((metadata)=>{
+        callbacksRef.current?.onExitSuccess?.(metadata);
+    }, []);
+    const stableOnExitAbort = useCallback((metadata)=>{
+        callbacksRef.current?.onExitAbort?.(metadata);
+    }, []);
+    const stableOnExitError = useCallback((metadata)=>{
+        callbacksRef.current?.onExitError?.(metadata);
+    }, []);
+    // Register event handlers (only re-runs when connector changes)
+    useEffect(()=>{
+        if (!connector) return;
+        // Capture which handlers we're registering to ensure proper cleanup
+        const registered = {
+            onEvent: callbacksRef.current?.onEvent ? stableOnEvent : null,
+            onOpen: callbacksRef.current?.onOpen ? handleOpen : null,
+            onLoad: callbacksRef.current?.onLoad ? stableOnLoad : null,
+            onExit: callbacksRef.current?.onExit ? handleExit : null,
+            onExitSuccess: callbacksRef.current?.onExitSuccess ? stableOnExitSuccess : null,
+            onExitAbort: callbacksRef.current?.onExitAbort ? stableOnExitAbort : null,
+            onExitError: callbacksRef.current?.onExitError ? stableOnExitError : null
+        };
+        if (registered.onEvent) connector.onEvent(registered.onEvent);
+        if (registered.onOpen) connector.onOpen(registered.onOpen);
+        if (registered.onLoad) connector.onLoad(registered.onLoad);
+        if (registered.onExit) connector.onExit(registered.onExit);
+        if (registered.onExitSuccess) connector.onExitSuccess(registered.onExitSuccess);
+        if (registered.onExitAbort) connector.onExitAbort(registered.onExitAbort);
+        if (registered.onExitError) connector.onExitError(registered.onExitError);
+        return ()=>{
+            if (registered.onEvent) connector.offEvent(registered.onEvent);
+            if (registered.onOpen) connector.offOpen(registered.onOpen);
+            if (registered.onLoad) connector.offLoad(registered.onLoad);
+            if (registered.onExit) connector.offExit(registered.onExit);
+            if (registered.onExitSuccess) connector.offExitSuccess(registered.onExitSuccess);
+            if (registered.onExitAbort) connector.offExitAbort(registered.onExitAbort);
+            if (registered.onExitError) connector.offExitError(registered.onExitError);
+        };
+    }, [
+        connector,
+        stableOnEvent,
+        handleOpen,
+        stableOnLoad,
+        handleExit,
+        stableOnExitSuccess,
+        stableOnExitAbort,
+        stableOnExitError
+    ]);
+    // This is used to hide any potential race conditions from usage; allowing
+    // interaction before the script may have loaded.
+    useEffect(()=>{
+        if (connector && isOpening) {
+            setIsOpening(false);
+            connector.open();
+        }
+    }, [
+        connector,
+        isOpening
+    ]);
+    // Cleanup effect - runs when the hook is torn down
+    useEffect(()=>{
+        return ()=>{
+            if (isConnectorOpenRef.current) {
+                console.error('[Quiltt] useQuilttConnector: Component unmounted while Connector is still open. ' + 'This may lead to memory leaks or unexpected behavior. ' + 'Ensure the Connector is properly closed before component unmount.');
+            }
+        };
+    }, []);
+    const open = useCallback(()=>{
+        if (connectorId) {
+            setIsOpening(true);
+        } else {
+            throw new Error('Must provide `connectorId` to `open` Quiltt Connector with Method Call');
+        }
+    }, [
+        connectorId
+    ]);
+    return {
+        open
+    };
+};
+
+export { useQuilttConnector as u, version as v };