@daimo/pay/build/src/components/DaimoPayModal/ConnectUsing.js

Seamless crypto payments. Onboard users from any chain, any coin into your app with one click.

import { jsx, jsxs } from 'react/jsx-runtime';
import { AnimatePresence, motion } from 'framer-motion';
import { useState, useEffect } from 'react';
import { usePayContext } from '../../hooks/usePayContext.js';
import { useWallet } from '../../wallets/useWallets.js';
import ConnectWithInjector from './ConnectWithInjector/index.js';
import ConnectWithQRCode from './ConnectWithQRCode.js';
import Alert from '../Common/Alert/index.js';
import { contentVariants } from '../Common/Modal/index.js';

const states = {
  QRCODE: "qrcode",
  INJECTOR: "injector"
};
const ConnectUsing = () => {
  const context = usePayContext();
  const { pendingConnectorId } = context;
  const wallet = useWallet(pendingConnectorId ?? "");
  const isQrCode = !wallet?.isInstalled;
  const [status, setStatus] = useState(
    isQrCode ? states.QRCODE : states.INJECTOR
  );
  useEffect(() => {
    const checkProvider = async () => {
      const res = await wallet?.connector?.getProvider();
      if (!res) {
        setStatus(states.QRCODE);
        setTimeout(context.triggerResize, 10);
      }
    };
    if (status === states.INJECTOR) checkProvider();
  }, []);
  if (!wallet) return /* @__PURE__ */ jsx(Alert, { children: "Connector not found" });
  return /* @__PURE__ */ jsxs(AnimatePresence, { children: [
    status === states.QRCODE && /* @__PURE__ */ jsx(
      motion.div,
      {
        initial: "initial",
        animate: "animate",
        exit: "exit",
        variants: contentVariants,
        children: /* @__PURE__ */ jsx(ConnectWithQRCode, {})
      },
      states.QRCODE
    ),
    status === states.INJECTOR && /* @__PURE__ */ jsx(
      motion.div,
      {
        initial: "initial",
        animate: "animate",
        exit: "exit",
        variants: contentVariants,
        children: /* @__PURE__ */ jsx(
          ConnectWithInjector,
          {
            switchConnectMethod: () => {
              setStatus(states.QRCODE);
            }
          }
        )
      },
      states.INJECTOR
    )
  ] });
};

export { ConnectUsing as default };
//# sourceMappingURL=ConnectUsing.js.map