@daimo/pay 0.3.21 → 1.0.1

package/build/src/hooks/useDaimoPayStatus.js

@@ -0,0 +1,37 @@
+import { writeDaimoPayOrderID, DaimoPayOrderMode, DaimoPayIntentStatus, DaimoPayOrderStatusSource } from '@daimo/common';
+import { usePayContext } from '../components/DaimoPay.js';
+
+/** Returns the current payment, or undefined if there is none.
+ *
+ * Status values:
+ * - `payment_pending` - the user has not paid yet
+ * - `payment_started` - the user has paid & payment is in progress. This status
+ *    typically lasts a few seconds.
+ * - `payment_completed` - the final call or transfer succeeded
+ * - `payment_bounced` - the final call or transfer reverted. Funds were sent
+ *    to the payment's configured refund address on the destination chain.
+ */
+function useDaimoPayStatus() {
+    const { paymentState } = usePayContext();
+    if (!paymentState || !paymentState.daimoPayOrder)
+        return undefined;
+    const order = paymentState.daimoPayOrder;
+    const paymentId = writeDaimoPayOrderID(order.id);
+    if (order.mode === DaimoPayOrderMode.HYDRATED) {
+        if (order.intentStatus !== DaimoPayIntentStatus.PENDING) {
+            if (order.intentStatus === DaimoPayIntentStatus.SUCCESSFUL) {
+                return { paymentId, status: "payment_completed" };
+            }
+            else {
+                return { paymentId, status: "payment_bounced" };
+            }
+        }
+        else if (order.sourceStatus !== DaimoPayOrderStatusSource.WAITING_PAYMENT) {
+            return { paymentId, status: "payment_started" };
+        }
+    }
+    return { paymentId, status: "payment_pending" };
+}
+
+export { useDaimoPayStatus };
+//# sourceMappingURL=useDaimoPayStatus.js.map

package/build/src/hooks/useDaimoPayStatus.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useDaimoPayStatus.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/build/src/hooks/useDepositAddressOptions.js

@@ -0,0 +1,28 @@
+import { useState, useEffect } from 'react';
+
+function useDepositAddressOptions({ trpc, usdRequired, }) {
+    const [options, setOptions] = useState([]);
+    const [loading, setLoading] = useState(false);
+    useEffect(() => {
+        const refreshDepositAddressOptions = async () => {
+            setLoading(true);
+            try {
+                const options = await trpc.getDepositAddressOptions.query({
+                    usdRequired,
+                });
+                setOptions(options);
+            }
+            catch (e) {
+                console.error(e);
+            }
+            finally {
+                setLoading(false);
+            }
+        };
+        refreshDepositAddressOptions();
+    }, [usdRequired]);
+    return { options, loading };
+}
+
+export { useDepositAddressOptions };
+//# sourceMappingURL=useDepositAddressOptions.js.map

package/build/src/hooks/useDepositAddressOptions.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useDepositAddressOptions.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/build/src/hooks/useEnsFallbackConfig.js

@@ -0,0 +1,16 @@
+import { createConfig, http } from 'wagmi';
+import { mainnet } from 'wagmi/chains';
+import { useChainIsSupported } from './useChainIsSupported.js';
+
+const ensFallbackConfig = createConfig({
+    chains: [mainnet],
+    transports: {
+        [mainnet.id]: http(),
+    },
+});
+function useEnsFallbackConfig() {
+    return !useChainIsSupported(1) ? ensFallbackConfig : undefined;
+}
+
+export { useEnsFallbackConfig };
+//# sourceMappingURL=useEnsFallbackConfig.js.map

package/build/src/hooks/useEnsFallbackConfig.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useEnsFallbackConfig.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;"}

package/build/src/hooks/useExternalPaymentOptions.js

@@ -0,0 +1,46 @@
+import { ExternalPaymentOptions } from '@daimo/common';
+import { useState, useEffect } from 'react';
+
+const DEFAULT_EXTERNAL_PAYMENT_OPTIONS = [
+    ExternalPaymentOptions.Coinbase,
+    ExternalPaymentOptions.Binance,
+    ExternalPaymentOptions.Daimo,
+    ExternalPaymentOptions.RampNetwork,
+];
+function useExternalPaymentOptions({ trpc, filterIds, usdRequired, platform, }) {
+    const [options, setOptions] = useState([]);
+    const [loading, setLoading] = useState(false);
+    useEffect(() => {
+        const refreshExternalPaymentOptions = async (usd) => {
+            if (!platform)
+                return;
+            setLoading(true);
+            try {
+                const newOptions = await trpc.getExternalPaymentOptions.query({
+                    usdRequired: usd,
+                    platform,
+                });
+                // Filter out options not in options JSON
+                const enabledExtPaymentOptions = filterIds || DEFAULT_EXTERNAL_PAYMENT_OPTIONS;
+                const filteredOptions = newOptions.filter((option) => enabledExtPaymentOptions.includes(option.id));
+                setOptions(filteredOptions);
+            }
+            catch (error) {
+                console.error(error);
+            }
+            finally {
+                setLoading(false);
+            }
+        };
+        if (usdRequired != null) {
+            refreshExternalPaymentOptions(usdRequired);
+        }
+    }, [usdRequired, filterIds, platform]);
+    return {
+        options,
+        loading,
+    };
+}
+
+export { useExternalPaymentOptions };
+//# sourceMappingURL=useExternalPaymentOptions.js.map

package/build/src/hooks/useExternalPaymentOptions.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useExternalPaymentOptions.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/build/src/hooks/useFitText.js

@@ -0,0 +1,148 @@
+import { useCallback, useRef, useState, useEffect, useLayoutEffect } from 'react';
+import ResizeObserver from 'resize-observer-polyfill';
+
+// https://github.com/saltycrane/use-fit-text
+const LOG_LEVEL = {
+    debug: 10,
+    info: 20,
+    warn: 30,
+    error: 40,
+    none: 100,
+};
+// Suppress `useLayoutEffect` warning when rendering on the server
+// https://gist.github.com/gaearon/e7d97cdf38a2907924ea12e4ebdf3c85
+const useIsoLayoutEffect = typeof window !== "undefined" &&
+    window.document &&
+    window.document.createElement !== undefined
+    ? useLayoutEffect
+    : useEffect;
+const useFitText = ({ logLevel: logLevelOption = "info", maxFontSize = 100, minFontSize = 20, onFinish, onStart, resolution = 5, } = {}) => {
+    const logLevel = LOG_LEVEL[logLevelOption];
+    const initState = useCallback(() => {
+        return {
+            calcKey: 0,
+            fontSize: maxFontSize,
+            fontSizePrev: minFontSize,
+            fontSizeMax: maxFontSize,
+            fontSizeMin: minFontSize,
+        };
+    }, [maxFontSize, minFontSize]);
+    const ref = useRef(null);
+    const innerHtmlPrevRef = useRef();
+    const isCalculatingRef = useRef(false);
+    const [state, setState] = useState(initState);
+    const { calcKey, fontSize, fontSizeMax, fontSizeMin, fontSizePrev } = state;
+    // Montior div size changes and recalculate on resize
+    let animationFrameId = null;
+    const [ro] = useState(() => new ResizeObserver(() => {
+        animationFrameId = window.requestAnimationFrame(() => {
+            if (isCalculatingRef.current) {
+                return;
+            }
+            onStart && onStart();
+            isCalculatingRef.current = true;
+            // `calcKey` is used in the dependencies array of
+            // `useIsoLayoutEffect` below. It is incremented so that the font size
+            // will be recalculated even if the previous state didn't change (e.g.
+            // when the text fit initially).
+            setState({
+                ...initState(),
+                calcKey: calcKey + 1,
+            });
+        });
+    }));
+    useEffect(() => {
+        if (ref.current) {
+            ro.observe(ref.current);
+        }
+        return () => {
+            animationFrameId && window.cancelAnimationFrame(animationFrameId);
+            ro.disconnect();
+        };
+    }, [animationFrameId, ro]);
+    // Recalculate when the div contents change
+    const innerHtml = ref.current && ref.current.innerHTML;
+    useEffect(() => {
+        if (calcKey === 0 || isCalculatingRef.current)
+            return;
+        if (innerHtml !== innerHtmlPrevRef.current) {
+            onStart && onStart();
+            setState({
+                ...initState(),
+                calcKey: calcKey + 1,
+            });
+        }
+        innerHtmlPrevRef.current = innerHtml;
+    }, [calcKey, initState, innerHtml, onStart]);
+    // Check overflow and resize font
+    useIsoLayoutEffect(() => {
+        // Don't start calculating font size until the `resizeKey` is incremented
+        // above in the `ResizeObserver` callback. This avoids an extra resize
+        // on initialization.
+        if (calcKey === 0) {
+            return;
+        }
+        const isWithinResolution = Math.abs(fontSize - fontSizePrev) <= resolution;
+        const isOverflow = !!ref.current &&
+            (ref.current.scrollHeight > ref.current.offsetHeight ||
+                ref.current.scrollWidth > ref.current.offsetWidth);
+        const isFailed = isOverflow && fontSize === fontSizePrev;
+        const isAsc = fontSize > fontSizePrev;
+        // Return if the font size has been adjusted "enough" (change within `resolution`)
+        // reduce font size by one increment if it's overflowing.
+        if (isWithinResolution) {
+            if (isFailed) {
+                isCalculatingRef.current = false;
+                if (logLevel <= LOG_LEVEL.info) {
+                    console.info(`[use-fit-text] reached \`minFontSize = ${minFontSize}\` without fitting text`);
+                }
+            }
+            else if (isOverflow) {
+                setState({
+                    fontSize: isAsc ? fontSizePrev : fontSizeMin,
+                    fontSizeMax,
+                    fontSizeMin,
+                    fontSizePrev,
+                    calcKey,
+                });
+            }
+            else {
+                isCalculatingRef.current = false;
+                onFinish && onFinish(fontSize);
+            }
+            return;
+        }
+        // Binary search to adjust font size
+        let delta;
+        let newMax = fontSizeMax;
+        let newMin = fontSizeMin;
+        if (isOverflow) {
+            delta = isAsc ? fontSizePrev - fontSize : fontSizeMin - fontSize;
+            newMax = Math.min(fontSizeMax, fontSize);
+        }
+        else {
+            delta = isAsc ? fontSizeMax - fontSize : fontSizePrev - fontSize;
+            newMin = Math.max(fontSizeMin, fontSize);
+        }
+        setState({
+            calcKey,
+            fontSize: fontSize + delta / 2,
+            fontSizeMax: newMax,
+            fontSizeMin: newMin,
+            fontSizePrev: fontSize,
+        });
+    }, [
+        calcKey,
+        fontSize,
+        fontSizeMax,
+        fontSizeMin,
+        fontSizePrev,
+        onFinish,
+        ref,
+        resolution,
+    ]);
+    return { fontSize, ref };
+};
+
+export { useFitText as default };
+//# sourceMappingURL=useFitText.js.map

package/build/src/hooks/useFitText.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useFitText.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/build/src/hooks/useFocusTrap.js

@@ -0,0 +1,60 @@
+import { jsx } from 'react/jsx-runtime';
+import { useEffect, useRef } from 'react';
+
+const KEYCODE_TAB = 9;
+function useFocusTrap() {
+    const elRef = useRef(null);
+    function handleFocus(e) {
+        if (!elRef.current)
+            return;
+        var focusableEls = elRef.current.querySelectorAll(`
+        a[href]:not(:disabled),
+        button:not(:disabled),
+        textarea:not(:disabled),
+        input[type="text"]:not(:disabled),
+        input[type="radio"]:not(:disabled),
+        input[type="checkbox"]:not(:disabled),
+        select:not(:disabled)
+      `), firstFocusableEl = focusableEls[0], lastFocusableEl = focusableEls[focusableEls.length - 1];
+        var isTabPressed = e.key === "Tab" || e.keyCode === KEYCODE_TAB;
+        if (!isTabPressed) {
+            return;
+        }
+        if (e.shiftKey) {
+            /* shift + tab */ if (document.activeElement === firstFocusableEl) {
+                lastFocusableEl.focus();
+                e.preventDefault();
+            }
+        } /* tab */
+        else {
+            if (document.activeElement === lastFocusableEl) {
+                firstFocusableEl.focus();
+                e.preventDefault();
+            }
+        }
+    }
+    useEffect(() => {
+        if (elRef.current) {
+            elRef.current.addEventListener("keydown", handleFocus);
+            elRef.current.focus({ preventScroll: true });
+        }
+        return () => {
+            if (elRef.current) {
+                elRef.current.removeEventListener("keydown", handleFocus);
+            }
+        };
+    }, []);
+    return elRef;
+}
+function FocusTrap(props) {
+    const elRef = useFocusTrap();
+    useEffect(() => {
+        if (!elRef.current)
+            return;
+        elRef.current.focus({ preventScroll: true });
+    }, []);
+    return (jsx("div", { ref: elRef, tabIndex: 0, children: props.children }));
+}
+
+export { FocusTrap as default };
+//# sourceMappingURL=useFocusTrap.js.map

package/build/src/hooks/useFocusTrap.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useFocusTrap.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/build/src/hooks/useGoogleFont.js

@@ -0,0 +1,45 @@
+import { useEffect } from 'react';
+
+function useGoogleFont(font) {
+    useEffect(() => {
+        if (!font)
+            return;
+        font = font.replace(/ /g, "+");
+        const googleapis = document.createElement("link");
+        googleapis.href = `https://fonts.googleapis.com`;
+        googleapis.rel = "preconnect";
+        const gstatic = document.createElement("link");
+        gstatic.href = `https://fonts.gstatic.com`;
+        gstatic.rel = "preconnect";
+        gstatic.crossOrigin = "true";
+        const link = document.createElement("link");
+        link.href = `https://fonts.googleapis.com/css2?family=${font}:wght@400;500;600&display=swap`;
+        link.rel = "stylesheet";
+        document.head.appendChild(googleapis);
+        document.head.appendChild(gstatic);
+        document.head.appendChild(link);
+        return () => {
+            try {
+                document.head.removeChild(googleapis);
+                document.head.removeChild(gstatic);
+                document.head.removeChild(link);
+            }
+            catch { }
+        };
+    }, [font]);
+}
+// TODO: This could be dynamic if theming wasn't set up as css variables
+function useThemeFont(theme) {
+    const themeFonts = {
+        web95: "Lato",
+        retro: "Nunito",
+        midnight: "Inter",
+        minimal: "Inter",
+        rounded: "Nunito",
+    };
+    const font = themeFonts[theme] ?? null;
+    useGoogleFont(font ?? "");
+}
+
+export { useGoogleFont, useThemeFont };
+//# sourceMappingURL=useGoogleFont.js.map

package/build/src/hooks/useGoogleFont.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useGoogleFont.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/build/src/hooks/useIsMobile.js

@@ -0,0 +1,17 @@
+import { useState, useEffect } from 'react';
+import { isMobile } from '../utils/index.js';
+
+function useIsMobile() {
+    const [mobile, setMobile] = useState(isMobile());
+    useEffect(() => {
+        const handleResize = () => {
+            setMobile(isMobile());
+        };
+        window.addEventListener("resize", handleResize);
+        return () => window.removeEventListener("resize", handleResize);
+    }, []);
+    return mobile;
+}
+
+export { useIsMobile as default };
+//# sourceMappingURL=useIsMobile.js.map

package/build/src/hooks/useIsMobile.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useIsMobile.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;"}

package/build/src/hooks/useIsMounted.js

@@ -0,0 +1,12 @@
+import { useState, useEffect } from 'react';
+
+/** Utility. Returns false on first render, true after.
+ * Useful for apps with SSR, for example. */
+function useIsMounted() {
+    const [mounted, setMounted] = useState(false);
+    useEffect(() => setMounted(true), []);
+    return mounted;
+}
+
+export { useIsMounted as default };
+//# sourceMappingURL=useIsMounted.js.map

package/build/src/hooks/useIsMounted.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useIsMounted.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;"}

package/build/src/hooks/useLastConnector.js

@@ -0,0 +1,24 @@
+import { useState, useEffect } from 'react';
+import { useConfig } from 'wagmi';
+
+const useLastConnector = () => {
+    const { storage } = useConfig();
+    const [lastConnectorId, setLastConnectorId] = useState(null);
+    useEffect(() => {
+        const init = async () => {
+            const id = await storage?.getItem("recentConnectorId");
+            setLastConnectorId(id ?? "");
+        };
+        init();
+    }, []);
+    const update = (id) => {
+        storage?.setItem("recentConnectorId", id);
+    };
+    return {
+        lastConnectorId,
+        updateLastConnectorId: update,
+    };
+};
+
+export { useLastConnector };
+//# sourceMappingURL=useLastConnector.js.map

package/build/src/hooks/useLastConnector.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useLastConnector.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;"}

package/build/src/hooks/useLocales.js

@@ -0,0 +1,67 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import React, { useMemo } from 'react';
+import Logos from '../assets/logos.js';
+import { usePayContext } from '../components/DaimoPay.js';
+import { getLocale } from '../localizations/index.js';
+
+function useLocales(replacements) {
+    const context = usePayContext();
+    const language = context.options?.language ?? "en-US";
+    const translations = useMemo(() => {
+        return getLocale(language);
+    }, [language]);
+    if (!translations) {
+        console.error(`Missing translations for: ${language}`);
+        return `Missing translations for: ${language}`;
+    }
+    const translated = {};
+    Object.keys(translations).map((key) => {
+        const string = translations[key];
+        return (translated[key] = localize(string, replacements));
+    });
+    return translated;
+}
+const localize = (text, replacements) => {
+    let parsedText = text;
+    if (replacements) {
+        Object.keys(replacements).forEach((key) => {
+            // use `replace` instead of `replaceAll` to support Node 14
+            parsedText = parsedText.replace(new RegExp(`({{ ${key} }})`, "g"), replacements[key]);
+        });
+    }
+    return replaceMarkdown(parsedText);
+};
+const replaceMarkdown = (markdownText) => {
+    let text = markdownText;
+    text = text.split("\n");
+    text = text.map((t, i) => {
+        return (jsxs(React.Fragment, { children: [wrapTags(t), i < text.length - 1 && jsx("br", {})] }, i));
+    });
+    return text;
+};
+const wrapTags = (text) => {
+    // Bold markdown handling
+    const textArray = text.split(/(\*\*[^\*]*\*\*)/g);
+    let result = textArray.map((str, i) => {
+        if (/(\*\*.*\*\*)/g.test(str)) {
+            // use `replace` instead of `replaceAll` to support Node 14
+            return jsx("strong", { children: str.replace(/\*\*/g, "") }, i);
+        }
+        return `${str}`;
+    });
+    // Replace text with logo
+    return result.map((r) => {
+        if (typeof r === "string") {
+            return r.split(/(\[WALLETCONNECTLOGO\])/g).map((s) => {
+                if (s === "[WALLETCONNECTLOGO]") {
+                    return (jsx("span", { className: "ck-tt-logo", children: jsx(Logos.WalletConnect, {}) }, s));
+                }
+                return s;
+            });
+        }
+        return r;
+    });
+};
+
+export { useLocales as default };
+//# sourceMappingURL=useLocales.js.map

package/build/src/hooks/useLocales.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useLocales.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/build/src/hooks/useLockBodyScroll.js

@@ -0,0 +1,53 @@
+import { useState, useEffect, useLayoutEffect } from 'react';
+import { usePayContext } from '../components/DaimoPay.js';
+
+const useIsomorphicLayoutEffect = typeof window !== "undefined" ? useLayoutEffect : useEffect;
+function useLockBodyScroll(initialLocked) {
+    const [locked, setLocked] = useState(initialLocked);
+    const context = usePayContext();
+    useIsomorphicLayoutEffect(() => {
+        if (!locked)
+            return;
+        const original = {
+            overflow: document.body.style.overflow,
+            position: document.body.style.position,
+            touchAction: document.body.style.touchAction,
+            paddingRight: document.body.style.paddingRight,
+            //htmlOverflow: document.documentElement.style.overflow,
+        };
+        const style = getComputedStyle(document.body);
+        const offsetX = parseInt(style.marginRight) +
+            parseInt(style.paddingRight) +
+            parseInt(style.borderRight) +
+            parseInt(style.marginLeft) +
+            parseInt(style.paddingLeft) +
+            parseInt(style.borderLeft);
+        const scrollBarWidth = window.innerWidth - document.body.offsetWidth - offsetX;
+        document.documentElement.style.setProperty("--ck-scrollbar-width", `${scrollBarWidth}px`);
+        document.body.style.overflow = "hidden";
+        document.body.style.position = "relative";
+        document.body.style.touchAction = "none";
+        //document.documentElement.style.overflow = 'hidden'; // overflow:hidden; on <html> breaks position:sticky;
+        if (context.options?.avoidLayoutShift) {
+            document.body.style.paddingRight = `${scrollBarWidth}px`;
+        }
+        return () => {
+            document.documentElement.style.removeProperty("--ck-scrollbar-width");
+            document.body.style.overflow = original.overflow;
+            document.body.style.position = original.position;
+            document.body.style.touchAction = original.touchAction;
+            //document.documentElement.style.overflow = original.htmlOverflow;
+            if (context.options?.avoidLayoutShift) {
+                document.body.style.paddingRight = original.paddingRight;
+            }
+        };
+    }, [locked]);
+    useEffect(() => {
+        if (locked !== initialLocked)
+            setLocked(initialLocked);
+    }, [initialLocked]);
+    return [locked, setLocked];
+}
+
+export { useLockBodyScroll as default };
+//# sourceMappingURL=useLockBodyScroll.js.map

package/build/src/hooks/useLockBodyScroll.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useLockBodyScroll.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/build/src/hooks/useModal.js

@@ -0,0 +1,35 @@
+import { usePayContext, ROUTES } from '../components/DaimoPay.js';
+import { useConnectCallback } from './useConnectCallback.js';
+
+/** Opens and closes the payment modal. */
+const useModal = ({ onConnect, onDisconnect } = {}) => {
+    const context = usePayContext();
+    useConnectCallback({
+        onConnect,
+        onDisconnect,
+    });
+    const close = () => {
+        context.setOpen(false);
+    };
+    const open = () => {
+        context.setOpen(true);
+    };
+    const gotoAndOpen = (route) => {
+        context.setRoute(route);
+        open();
+    };
+    return {
+        open: context.open,
+        setOpen: (show) => {
+            if (show) {
+                gotoAndOpen(ROUTES.SELECT_METHOD);
+            }
+            else {
+                close();
+            }
+        },
+    };
+};
+
+export { useModal };
+//# sourceMappingURL=useModal.js.map

package/build/src/hooks/useModal.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useModal.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}