@daimo/pay
Version:
Seamless crypto payments. Onboard users from any chain, any coin into your app with one click.
67 lines (63 loc) • 1.92 kB
JavaScript
import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
import { motion } from 'framer-motion';
import { useState, useEffect } from 'react';
import { keyframes } from 'styled-components';
import useLocales from '../../../hooks/useLocales.js';
import styled from '../../../styles/styled/index.js';
const PoweredByFooter = ({
supportUrl,
showNeedHelpImmediately
} = {}) => {
const [supportVisible, setSupportVisible] = useState(showNeedHelpImmediately);
const locales = useLocales();
useEffect(() => {
if (supportUrl == null) return;
const timer = setTimeout(() => {
setSupportVisible(true);
}, 2500);
return () => clearTimeout(timer);
}, [supportUrl]);
return /* @__PURE__ */ jsx(Container, { children: /* @__PURE__ */ jsx(TextLink, { href: supportVisible ? supportUrl : void 0, children: /* @__PURE__ */ jsx("span", { children: supportVisible ? /* @__PURE__ */ jsxs(Fragment, { children: [
"Need help? ",
/* @__PURE__ */ jsx(Underline, { children: "Contact support" })
] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
locales.poweredBy,
" Daimo Pay"
] }) }) }) });
};
const Container = styled(motion.div)`
text-align: center;
margin-top: 16px;
margin-bottom: -4px;
`;
keyframes`
0%{ opacity:0; }
100%{ opacity:1; }
`;
const TextLink = styled.a`
appearance: none;
user-select: none;
display: inline-flex;
align-items: center;
justify-content: center;
gap: 10px;
height: 42px;
padding: 0 16px;
border-radius: 6px;
background: none;
color: var(--ck-body-color-muted);
text-decoration-color: var(--ck-body-color-muted);
font-size: 15px;
line-height: 18px;
font-weight: 400;
span {
opacity: 1;
transition: opacity 300ms ease;
}
`;
const Underline = styled(motion.span)`
text-underline-offset: 2px;
text-decoration: underline;
`;
export { PoweredByFooter as default };
//# sourceMappingURL=index.js.map