synapse-react-client/dist/components/Authentication/TwoFactorSecretDialog.js

[](https://badge.fury.io/js/synapse-react-client) [](https://github.com/prettier/prettie

import { jsxs as t, jsx as o } from "react/jsx-runtime";
import { monospaceFontFamily as s } from "../../theme/typography/Typography.js";
import { Dialog as d, DialogTitle as p, Stack as h, Box as n, IconButton as g, DialogContent as f, Typography as i, DialogActions as m, Button as x } from "@mui/material";
import u from "../IconSvg/IconSvg.js";
function b(r) {
  const { secret: a, open: c, onClose: e } = r;
  return /* @__PURE__ */ t(d, { open: c, onClose: e, children: [
    /* @__PURE__ */ o(p, { children: /* @__PURE__ */ t(
      h,
      {
        direction: "row",
        sx: {
          alignItems: "center",
          gap: "5px"
        },
        children: [
          "Use this code to set up 2FA ",
          /* @__PURE__ */ o(n, { sx: { flexGrow: 1 } }),
          /* @__PURE__ */ o(g, { "aria-label": "Close", onClick: e, children: /* @__PURE__ */ o(u, { icon: "close", wrap: !1, sx: { color: "grey.700" } }) })
        ]
      }
    ) }),
    /* @__PURE__ */ t(f, { children: [
      /* @__PURE__ */ o(i, { variant: "body1", children: "Your authenticator app will ask for a code to activate two-factor authentication. Use the code below:" }),
      /* @__PURE__ */ o(
        n,
        {
          sx: (l) => ({
            my: 2,
            p: 2,
            width: "100%",
            textAlign: "center",
            background: l.palette.grey[200],
            fontFamily: s,
            letterSpacing: "2px",
            fontSize: "16px"
          }),
          children: a
        }
      ),
      /* @__PURE__ */ o(i, { variant: "body1", children: "After setup, you don’t need to save this code." })
    ] }),
    /* @__PURE__ */ o(m, { children: /* @__PURE__ */ o(x, { variant: "contained", onClick: e, children: "Done" }) })
  ] });
}
export {
  b as default
};
//# sourceMappingURL=TwoFactorSecretDialog.js.map