@daimo/pay/build/src/components/Common/CustomQRCode/index.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 { QRCodeContainer, QRCodeContent, LogoContainer, LogoIcon, QRPlaceholder } from './styles.js';
import { AnimatePresence, motion } from 'framer-motion';
import Tooltip from '../Tooltip/index.js';
import useWindowSize from '../../../hooks/useWindowSize.js';
import { QRCode } from './QRCode.js';

function CustomQRCode({ value, image, imageBackground, imagePosition = "center", tooltipMessage, contentPadding = 13, }) {
    const windowSize = useWindowSize();
    const Logo = windowSize.width > 920 && tooltipMessage ? (jsx(Tooltip, { xOffset: 139, yOffset: 5, delay: 0.1, message: tooltipMessage, children: image })) : (image);
    return (jsx(QRCodeContainer, { children: jsxs(QRCodeContent, { style: { inset: contentPadding }, children: [image && (jsx(LogoContainer, { children: jsx(LogoIcon, { style: {
                            background: imagePosition === "center" ? imageBackground : undefined,
                        }, children: Logo }) })), jsx(AnimatePresence, { initial: false, children: value ? (jsx(motion.div, { initial: { opacity: 0 }, animate: { opacity: 1 }, exit: { opacity: 0, position: "absolute", inset: [0, 0] }, transition: {
                            duration: 0.2,
                        }, children: jsx(QRCode, { uri: value, size: 576, ecl: "H", clearArea: !!(imagePosition === "center" && image), image: imagePosition === "bottom right" ? image : undefined, imageBackground: imageBackground }) }, value)) : (jsxs(QRPlaceholder, { initial: { opacity: 0.1 }, animate: { opacity: 0.1 }, exit: { opacity: 0, position: "absolute", inset: [0, 0] }, transition: {
                            duration: 0.2,
                        }, children: [jsx("span", {}), jsx("span", {}), jsx("span", {}), jsx("div", {})] })) })] }) }));
}
CustomQRCode.displayName = "CustomQRCode";

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