@daimo/pay
Version:
Seamless crypto payments. Onboard users from any chain, any coin into your app with one click.
16 lines (13 loc) • 1.83 kB
JavaScript
import { jsxs, jsx } from 'react/jsx-runtime';
import { LogoContainer, Logo, SpinnerContainer, Spinner, ExpiringSpinner } from './styles.js';
import { AnimatePresence } from 'framer-motion';
const CircleSpinner = ({ logo, smallLogo, loading = true, unavailable = false, countdown = false, }) => {
return (jsxs(LogoContainer, { transition: { duration: 0.5, ease: [0.175, 0.885, 0.32, 0.98] }, children: [jsx(Logo, { "$small": !unavailable && smallLogo, style: unavailable ? { borderRadius: 0 } : undefined, children: logo }), jsx(SpinnerContainer, { children: jsxs(AnimatePresence, { children: [loading && (jsx(Spinner, { initial: { opacity: 0 }, animate: { opacity: 1 }, exit: {
opacity: 0,
transition: {
duration: countdown ? 1 : 0,
},
}, children: jsxs("svg", { "aria-hidden": "true", width: "102", height: "102", viewBox: "0 0 102 102", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [jsx("path", { d: "M52 100C24.3858 100 2 77.6142 2 50", stroke: "url(#paint0_linear_1943_4139)", strokeWidth: "3.5", strokeLinecap: "round", strokeLinejoin: "round" }), jsx("defs", { children: jsxs("linearGradient", { id: "paint0_linear_1943_4139", x1: "2", y1: "48.5", x2: "53", y2: "100", gradientUnits: "userSpaceOnUse", children: [jsx("stop", { stopColor: "var(--ck-spinner-color)" }), jsx("stop", { offset: "1", stopColor: "var(--ck-spinner-color)", stopOpacity: "0" })] }) })] }) })), countdown && (jsxs(ExpiringSpinner, { initial: { opacity: 0 }, animate: { opacity: 1 }, exit: { opacity: 0 }, transition: { duration: 0.25 }, children: [jsx("div", {}), jsx("div", {})] }))] }) })] }));
};
export { CircleSpinner as default };
//# sourceMappingURL=index.js.map