import 'core-js/modules/es.object.assign.js';
import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
import { styled, Card, Box } from '@mui/material';
import { IconFactory } from '../../atom/IconFactory/IconFactory.js';
import { Typography } from '../../atom/Typography/Typography.js';
import Loader from './Loader.js';

const WaitingForWalletModal = ({
  message
}) => {
  return jsxs(StyledCard, Object.assign({
    variant: "outlined"
  }, {
    children: [jsxs(Fragment, {
      children: [jsx("div", Object.assign({
        style: {
          marginBlockEnd: '1.25rem',
          verticalAlign: 'middle',
          justifyContent: 'center'
        }
      }, {
        children: jsx(Loader, {})
      })), jsxs("div", Object.assign({
        style: {
          maxWidth: '480px',
          textAlign: 'center'
        }
      }, {
        children: [jsx(Typography, Object.assign({
          variant: "h3",
          sx: {
            marginBlockEnd: '2rem'
          }
        }, {
          children: "Waiting for wallet..."
        })), jsx(StyledSection, Object.assign({
          variant: "body2",
          color: "secondary.light"
        }, {
          children: message
        }))]
      }))]
    }), jsxs(Box, Object.assign({
      display: "flex",
      justifyContent: "center",
      alignItems: "center",
      width: "100%",
      mt: 4
    }, {
      children: [jsx(Typography, Object.assign({
        variant: "caption",
        color: "secondary.light"
      }, {
        children: "Powered by"
      })), jsx(StyledFVLogo, {
        children: jsx(IconFactory, {
          name: "FV"
        })
      })]
    }))]
  }));
};
const StyledCard = styled(Card)(({
  theme
}) => ({
  padding: 24,
  display: 'flex',
  flexDirection: 'column',
  alignItems: 'center',
  borderRadius: 8,
  [theme.breakpoints.up('md')]: {
    width: 648,
    padding: 48
  }
}));
const StyledFVLogo = styled('div')({
  cursor: 'pointer'
});
const StyledSection = styled(Typography)({
  marginBottom: 20,
  textAlign: 'center'
});

export { WaitingForWalletModal };
