synapse-react-client 4.0.18 → 4.0.20

package/dist/components/Authentication/OneTimePasswordForm.js.map

@@ -1 +1 @@
-{"version":3,"file":"OneTimePasswordForm.js","names":[],"sources":["../../../src/components/Authentication/OneTimePasswordForm.tsx"],"sourcesContent":["import { UseLoginReturn } from '@/utils/hooks'\nimport { Alert, Button, Link, Typography } from '@mui/material'\nimport { TwoFactorAuthOtpType } from '@sage-bionetworks/synapse-types'\nimport RecoveryCodeForm from './RecoveryCodeForm'\nimport TOTPForm from './TOTPForm'\n\nexport type ONE_TIME_PASSWORD_STEP =\n  | 'VERIFICATION_CODE'\n  | 'RECOVERY_CODE'\n  | 'DISABLE_2FA_PROMPT'\n\nexport type OneTimePasswordFormProps = {\n  /* The current UI step to show */\n  step: ONE_TIME_PASSWORD_STEP\n  /* Whether the current login request is pending */\n  loginIsPending: boolean\n  onClickUseTOTP: () => void\n  onClickUseBackupCode: () => void\n  onSubmit: (code: string, otpType: TwoFactorAuthOtpType) => void\n  hideReset2FA?: boolean\n  onClickPromptReset2FA?: () => void\n  onClickReset2FA?: () => void\n  twoFactorAuthResetIsSuccess: UseLoginReturn['twoFactorAuthResetIsSuccess']\n  twoFactorAuthResetIsPending: UseLoginReturn['twoFactorAuthResetIsPending']\n}\n\nexport const SHOW_RECOVERY_CODE_FORM_BUTTON_TEXT = 'Use a backup code instead'\nexport const SHOW_TOTP_FORM_BUTTON_TEXT = 'Use authenticator app instead'\nexport const BEGIN_RESET_2FA_BUTTON_TEXT = 'Lost access to your codes?'\nexport const SEND_RESET_2FA_EMAIL_BUTTON_TEXT = 'Send Instructions'\nexport const TWO_FACTOR_RESET_CONFIRMATION_TEXT =\n  'Instructions to reset two-factor authentication were sent to the primary email address associated with your account.'\n/**\n * Component that allows the user to enter a one-time password second authentication factor,\n * such as a timed one-time password (TOTP) generated using a shared secret, or a single-use recovery code.\n *\n * The user may also use this UI to begin the process of disabling 2FA on their account.\n * @param props\n * @constructor\n */\nexport default function OneTimePasswordForm(props: OneTimePasswordFormProps) {\n  const {\n    step,\n    loginIsPending,\n    onSubmit,\n    onClickUseBackupCode,\n    onClickUseTOTP,\n    hideReset2FA,\n    onClickPromptReset2FA,\n    onClickReset2FA,\n    twoFactorAuthResetIsSuccess,\n    twoFactorAuthResetIsPending,\n  } = props\n\n  return (\n    <>\n      {step === 'VERIFICATION_CODE' && (\n        <>\n          <TOTPForm\n            loginIsPending={loginIsPending}\n            onSubmit={totp => {\n              onSubmit(totp, 'TOTP')\n            }}\n          />\n          <Link\n            align={'center'}\n            color={'grey.700'}\n            sx={{ display: 'block', mx: 'auto', my: 2 }}\n            onClick={() => {\n              onClickUseBackupCode()\n            }}\n          >\n            {SHOW_RECOVERY_CODE_FORM_BUTTON_TEXT}\n          </Link>\n        </>\n      )}\n      {step === 'RECOVERY_CODE' && (\n        <>\n          <RecoveryCodeForm\n            loginIsPending={loginIsPending}\n            onSubmit={recoveryCode => {\n              onSubmit(recoveryCode, 'RECOVERY_CODE')\n            }}\n          />\n          <Link\n            align={'center'}\n            color={'grey.700'}\n            sx={{ display: 'block', mx: 'auto', my: 2 }}\n            onClick={() => {\n              onClickUseTOTP()\n            }}\n          >\n            {SHOW_TOTP_FORM_BUTTON_TEXT}\n          </Link>\n        </>\n      )}\n      {!hideReset2FA &&\n        onClickPromptReset2FA &&\n        onClickReset2FA &&\n        step !== 'DISABLE_2FA_PROMPT' && (\n          <Link\n            align={'center'}\n            color={'grey.700'}\n            sx={{ display: 'block', mx: 'auto', my: 2 }}\n            onClick={() => {\n              onClickPromptReset2FA()\n            }}\n          >\n            {BEGIN_RESET_2FA_BUTTON_TEXT}\n          </Link>\n        )}\n      {step === 'DISABLE_2FA_PROMPT' && onClickReset2FA && (\n        <>\n          <Typography variant={'body1'} align={'center'} sx={{ my: 2 }}>\n            To reset two-factor authentication on your account, an email\n            containing instructions will be sent to the primary email address on\n            your account.\n          </Typography>\n          <Button\n            fullWidth\n            variant={'contained'}\n            onClick={onClickReset2FA}\n            disabled={\n              twoFactorAuthResetIsPending || twoFactorAuthResetIsSuccess\n            }\n            sx={{ my: 2 }}\n          >\n            {SEND_RESET_2FA_EMAIL_BUTTON_TEXT}\n          </Button>\n          {twoFactorAuthResetIsSuccess && (\n            <Alert severity={'success'} sx={{ my: 1 }}>\n              {TWO_FACTOR_RESET_CONFIRMATION_TEXT}\n            </Alert>\n          )}\n          <Link\n            align={'center'}\n            color={'grey.700'}\n            sx={{ display: 'block', mx: 'auto', my: 2 }}\n            onClick={() => {\n              onClickUseTOTP()\n            }}\n          >\n            Go back\n          </Link>\n        </>\n      )}\n    </>\n  )\n}\n"],"mappings":";;;;;AA0BA,IAAa,IAAsC,6BACtC,IAA6B,iCAC7B,IAA8B,8BAC9B,IAAmC,qBACnC,IACX;AASF,SAAwB,EAAoB,GAAiC;CAC3E,IAAM,EACJ,SACA,mBACA,aACA,yBACA,mBACA,iBACA,0BACA,oBACA,gCACA,mCACE;AAEJ,QACE,kBAAA,GAAA,EAAA,UAAA;EACG,MAAS,uBACR,kBAAA,GAAA,EAAA,UAAA,CACE,kBAAC,GAAD;GACkB;GAChB,WAAU,MAAQ;AAChB,MAAS,GAAM,OAAO;;GAExB,CAAA,EACF,kBAAC,GAAD;GACE,OAAO;GACP,OAAO;GACP,IAAI;IAAE,SAAS;IAAS,IAAI;IAAQ,IAAI;IAAG;GAC3C,eAAe;AACb,OAAsB;;;GAInB,CAAA,CACN,EAAA,CAAA;EAEJ,MAAS,mBACR,kBAAA,GAAA,EAAA,UAAA,CACE,kBAAC,GAAD;GACkB;GAChB,WAAU,MAAgB;AACxB,MAAS,GAAc,gBAAgB;;GAEzC,CAAA,EACF,kBAAC,GAAD;GACE,OAAO;GACP,OAAO;GACP,IAAI;IAAE,SAAS;IAAS,IAAI;IAAQ,IAAI;IAAG;GAC3C,eAAe;AACb,OAAgB;;;GAIb,CAAA,CACN,EAAA,CAAA;EAEJ,CAAC,KACA,KACA,KACA,MAAS,wBACP,kBAAC,GAAD;GACE,OAAO;GACP,OAAO;GACP,IAAI;IAAE,SAAS;IAAS,IAAI;IAAQ,IAAI;IAAG;GAC3C,eAAe;AACb,OAAuB;;;GAIpB,CAAA;EAEV,MAAS,wBAAwB,KAChC,kBAAA,GAAA,EAAA,UAAA;GACE,kBAAC,GAAD;IAAY,SAAS;IAAS,OAAO;IAAU,IAAI,EAAE,IAAI,GAAG;cAAE;IAIjD,CAAA;GACb,kBAAC,GAAD;IACE,WAAA;IACA,SAAS;IACT,SAAS;IACT,UACE,KAA+B;IAEjC,IAAI,EAAE,IAAI,GAAG;;IAGN,CAAA;GACR,KACC,kBAAC,GAAD;IAAO,UAAU;IAAW,IAAI,EAAE,IAAI,GAAG;;IAEjC,CAAA;GAEV,kBAAC,GAAD;IACE,OAAO;IACP,OAAO;IACP,IAAI;KAAE,SAAS;KAAS,IAAI;KAAQ,IAAI;KAAG;IAC3C,eAAe;AACb,QAAgB;;cAEnB;IAEM,CAAA;GACN,EAAA,CAAA;EAEJ,EAAA,CAAA"}
+{"version":3,"file":"OneTimePasswordForm.js","names":[],"sources":["../../../src/components/Authentication/OneTimePasswordForm.tsx"],"sourcesContent":["import { UseLoginReturn } from '@/utils/hooks'\nimport { Alert, Button, Link, Typography } from '@mui/material'\nimport { TwoFactorAuthOtpType } from '@sage-bionetworks/synapse-types'\nimport RecoveryCodeForm from './RecoveryCodeForm'\nimport TOTPForm from './TOTPForm'\n\nexport type ONE_TIME_PASSWORD_STEP =\n  | 'VERIFICATION_CODE'\n  | 'RECOVERY_CODE'\n  | 'DISABLE_2FA_PROMPT'\n\nexport type OneTimePasswordFormProps = {\n  /* The current UI step to show */\n  step: ONE_TIME_PASSWORD_STEP\n  /* Whether the current login request is pending */\n  loginIsPending: boolean\n  onClickUseTOTP: () => void\n  onClickUseBackupCode: () => void\n  onSubmit: (code: string, otpType: TwoFactorAuthOtpType) => void\n  hideReset2FA?: boolean\n  onClickPromptReset2FA?: () => void\n  onClickReset2FA?: () => void\n  twoFactorAuthResetIsSuccess: UseLoginReturn['twoFactorAuthResetIsSuccess']\n  twoFactorAuthResetIsPending: UseLoginReturn['twoFactorAuthResetIsPending']\n}\n\nexport const SHOW_RECOVERY_CODE_FORM_BUTTON_TEXT = 'Use a backup code instead'\nexport const SHOW_TOTP_FORM_BUTTON_TEXT = 'Use authenticator app instead'\nexport const BEGIN_RESET_2FA_BUTTON_TEXT = 'Lost access to your codes?'\nexport const SEND_RESET_2FA_EMAIL_BUTTON_TEXT = 'Send Instructions'\nexport const TWO_FACTOR_RESET_CONFIRMATION_TEXT =\n  'Instructions to reset two-factor authentication were sent to the primary email address associated with your account.'\n/**\n * Component that allows the user to enter a one-time password second authentication factor,\n * such as a timed one-time password (TOTP) generated using a shared secret, or a single-use recovery code.\n *\n * The user may also use this UI to begin the process of disabling 2FA on their account.\n * @param props\n * @constructor\n */\nexport default function OneTimePasswordForm(props: OneTimePasswordFormProps) {\n  const {\n    step,\n    loginIsPending,\n    onSubmit,\n    onClickUseBackupCode,\n    onClickUseTOTP,\n    hideReset2FA,\n    onClickPromptReset2FA,\n    onClickReset2FA,\n    twoFactorAuthResetIsSuccess,\n    twoFactorAuthResetIsPending,\n  } = props\n\n  return (\n    <>\n      {step === 'VERIFICATION_CODE' && (\n        <>\n          <TOTPForm\n            loginIsPending={loginIsPending}\n            onSubmit={totp => {\n              onSubmit(totp, 'TOTP')\n            }}\n          />\n          <Link\n            align={'center'}\n            color={'grey.700'}\n            sx={{ display: 'block', mx: 'auto', my: 2 }}\n            onClick={() => {\n              onClickUseBackupCode()\n            }}\n          >\n            {SHOW_RECOVERY_CODE_FORM_BUTTON_TEXT}\n          </Link>\n        </>\n      )}\n      {step === 'RECOVERY_CODE' && (\n        <>\n          <RecoveryCodeForm\n            loginIsPending={loginIsPending}\n            onSubmit={recoveryCode => {\n              onSubmit(recoveryCode, 'RECOVERY_CODE')\n            }}\n          />\n          <Link\n            align={'center'}\n            color={'grey.700'}\n            sx={{ display: 'block', mx: 'auto', my: 2 }}\n            onClick={() => {\n              onClickUseTOTP()\n            }}\n          >\n            {SHOW_TOTP_FORM_BUTTON_TEXT}\n          </Link>\n        </>\n      )}\n      {!hideReset2FA &&\n        onClickPromptReset2FA &&\n        onClickReset2FA &&\n        step !== 'DISABLE_2FA_PROMPT' && (\n          <Link\n            align={'center'}\n            color={'grey.700'}\n            sx={{ display: 'block', mx: 'auto', my: 2 }}\n            onClick={() => {\n              onClickPromptReset2FA()\n            }}\n          >\n            {BEGIN_RESET_2FA_BUTTON_TEXT}\n          </Link>\n        )}\n      {step === 'DISABLE_2FA_PROMPT' && onClickReset2FA && (\n        <>\n          <Typography variant={'body1'} align={'center'} sx={{ my: 2 }}>\n            To reset two-factor authentication on your account, an email\n            containing instructions will be sent to the primary email address on\n            your account.\n          </Typography>\n          <Button\n            fullWidth\n            variant={'contained'}\n            onClick={onClickReset2FA}\n            disabled={\n              twoFactorAuthResetIsPending || twoFactorAuthResetIsSuccess\n            }\n            sx={{ my: 2 }}\n          >\n            {SEND_RESET_2FA_EMAIL_BUTTON_TEXT}\n          </Button>\n          {twoFactorAuthResetIsSuccess && (\n            <Alert severity={'success'} sx={{ my: 1 }}>\n              {TWO_FACTOR_RESET_CONFIRMATION_TEXT}\n            </Alert>\n          )}\n          <Link\n            align={'center'}\n            color={'grey.700'}\n            sx={{ display: 'block', mx: 'auto', my: 2 }}\n            onClick={() => {\n              onClickUseTOTP()\n            }}\n          >\n            Go back\n          </Link>\n        </>\n      )}\n    </>\n  )\n}\n"],"mappings":";;;;;AA0BA,IAAa,IAAsC,6BACtC,IAA6B,iCAC7B,IAA8B,8BAC9B,IAAmC,qBACnC,IACX;AASF,SAAwB,EAAoB,GAAiC;CAC3E,IAAM,EACJ,SACA,mBACA,aACA,yBACA,mBACA,iBACA,0BACA,oBACA,gCACA,mCACE;CAEJ,OACE,kBAAA,GAAA,EAAA,UAAA;EACG,MAAS,uBACR,kBAAA,GAAA,EAAA,UAAA,CACE,kBAAC,GAAD;GACkB;GAChB,WAAU,MAAQ;IAChB,EAAS,GAAM,MAAM;GACvB;EACD,CAAA,GACD,kBAAC,GAAD;GACE,OAAO;GACP,OAAO;GACP,IAAI;IAAE,SAAS;IAAS,IAAI;IAAQ,IAAI;GAAE;GAC1C,eAAe;IACb,EAAqB;GACvB;;EAGI,CAAA,CACN,EAAA,CAAA;EAEH,MAAS,mBACR,kBAAA,GAAA,EAAA,UAAA,CACE,kBAAC,GAAD;GACkB;GAChB,WAAU,MAAgB;IACxB,EAAS,GAAc,eAAe;GACxC;EACD,CAAA,GACD,kBAAC,GAAD;GACE,OAAO;GACP,OAAO;GACP,IAAI;IAAE,SAAS;IAAS,IAAI;IAAQ,IAAI;GAAE;GAC1C,eAAe;IACb,EAAe;GACjB;;EAGI,CAAA,CACN,EAAA,CAAA;EAEH,CAAC,KACA,KACA,KACA,MAAS,wBACP,kBAAC,GAAD;GACE,OAAO;GACP,OAAO;GACP,IAAI;IAAE,SAAS;IAAS,IAAI;IAAQ,IAAI;GAAE;GAC1C,eAAe;IACb,EAAsB;GACxB;;EAGI,CAAA;EAET,MAAS,wBAAwB,KAChC,kBAAA,GAAA,EAAA,UAAA;GACE,kBAAC,GAAD;IAAY,SAAS;IAAS,OAAO;IAAU,IAAI,EAAE,IAAI,EAAE;cAAG;GAIlD,CAAA;GACZ,kBAAC,GAAD;IACE,WAAA;IACA,SAAS;IACT,SAAS;IACT,UACE,KAA+B;IAEjC,IAAI,EAAE,IAAI,EAAE;;GAGN,CAAA;GACP,KACC,kBAAC,GAAD;IAAO,UAAU;IAAW,IAAI,EAAE,IAAI,EAAE;;GAEjC,CAAA;GAET,kBAAC,GAAD;IACE,OAAO;IACP,OAAO;IACP,IAAI;KAAE,SAAS;KAAS,IAAI;KAAQ,IAAI;IAAE;IAC1C,eAAe;KACb,EAAe;IACjB;cACD;GAEK,CAAA;EACN,EAAA,CAAA;CAEJ,EAAA,CAAA;AAEN"}

package/dist/components/Authentication/PasswordField.js.map

@@ -1 +1 @@
-{"version":3,"file":"PasswordField.js","names":[],"sources":["../../../src/components/Authentication/PasswordField.tsx"],"sourcesContent":["import TextField, { TextFieldProps } from '../TextField'\n\nexport default function PasswordField(props: TextFieldProps) {\n  return (\n    <TextField\n      required\n      fullWidth\n      autoComplete=\"current-password\"\n      label=\"Password\"\n      id=\"current-password\"\n      type=\"password\"\n      {...props}\n    />\n  )\n}\n"],"mappings":";;;AAEA,SAAwB,EAAc,GAAuB;AAC3D,QACE,kBAAC,GAAD;EACE,UAAA;EACA,WAAA;EACA,cAAa;EACb,OAAM;EACN,IAAG;EACH,MAAK;EACL,GAAI;EACJ,CAAA"}
+{"version":3,"file":"PasswordField.js","names":[],"sources":["../../../src/components/Authentication/PasswordField.tsx"],"sourcesContent":["import TextField, { TextFieldProps } from '../TextField'\n\nexport default function PasswordField(props: TextFieldProps) {\n  return (\n    <TextField\n      required\n      fullWidth\n      autoComplete=\"current-password\"\n      label=\"Password\"\n      id=\"current-password\"\n      type=\"password\"\n      {...props}\n    />\n  )\n}\n"],"mappings":";;;AAEA,SAAwB,EAAc,GAAuB;CAC3D,OACE,kBAAC,GAAD;EACE,UAAA;EACA,WAAA;EACA,cAAa;EACb,OAAM;EACN,IAAG;EACH,MAAK;EACL,GAAI;CACL,CAAA;AAEL"}

package/dist/components/Authentication/RecoveryCodeForm.js.map

@@ -1 +1 @@
-{"version":3,"file":"RecoveryCodeForm.js","names":[],"sources":["../../../src/components/Authentication/RecoveryCodeForm.tsx"],"sourcesContent":["import { UseLoginReturn } from '@/utils/hooks'\nimport { Box, Button } from '@mui/material'\nimport { useState } from 'react'\nimport TextField from '../TextField/TextField'\n\n// 16 characters separated into chunks of 4 by 3 hyphens\nconst RECOVERY_CODE_LENGTH = 19\n\ntype RecoveryCodeFormProps = {\n  onSubmit: (value: string) => void\n  loginIsPending: UseLoginReturn['loginIsPending']\n}\n\nexport default function RecoveryCodeForm(props: RecoveryCodeFormProps) {\n  const { onSubmit, loginIsPending } = props\n  const [recoveryCode, setRecoveryCode] = useState('')\n  return (\n    <Box>\n      <TextField\n        placeholder=\"Enter backup code\"\n        value={recoveryCode}\n        onChange={e => {\n          // coerce the input to lowercase and remove any nonalphanumeric or hyphen characters\n          const valueWithAllowedChars = e.target.value\n            .toLowerCase()\n            .replace(/[^a-z0-9-]/gi, '')\n          setRecoveryCode(valueWithAllowedChars)\n        }}\n      />\n\n      <Button\n        fullWidth\n        type=\"submit\"\n        color=\"primary\"\n        variant=\"contained\"\n        sx={{\n          height: '50px',\n          mt: 4,\n          mb: 2,\n        }}\n        disabled={\n          recoveryCode.length !== RECOVERY_CODE_LENGTH || loginIsPending\n        }\n        onClick={e => {\n          e.preventDefault()\n          onSubmit(recoveryCode)\n        }}\n      >\n        {loginIsPending ? 'Verifying...' : 'Submit'}\n      </Button>\n    </Box>\n  )\n}\n"],"mappings":";;;;;AAMA,IAAM,IAAuB;AAO7B,SAAwB,EAAiB,GAA8B;CACrE,IAAM,EAAE,aAAU,sBAAmB,GAC/B,CAAC,GAAc,KAAmB,EAAS,GAAG;AACpD,QACE,kBAAC,GAAD,EAAA,UAAA,CACE,kBAAC,GAAD;EACE,aAAY;EACZ,OAAO;EACP,WAAU,MAAK;AAKb,KAH8B,EAAE,OAAO,MACpC,aAAa,CACb,QAAQ,gBAAgB,GACX,CAAsB;;EAExC,CAAA,EAEF,kBAAC,GAAD;EACE,WAAA;EACA,MAAK;EACL,OAAM;EACN,SAAQ;EACR,IAAI;GACF,QAAQ;GACR,IAAI;GACJ,IAAI;GACL;EACD,UACE,EAAa,WAAW,KAAwB;EAElD,UAAS,MAAK;AAEZ,GADA,EAAE,gBAAgB,EAClB,EAAS,EAAa;;YAGvB,IAAiB,iBAAiB;EAC5B,CAAA,CACL,EAAA,CAAA"}
+{"version":3,"file":"RecoveryCodeForm.js","names":[],"sources":["../../../src/components/Authentication/RecoveryCodeForm.tsx"],"sourcesContent":["import { UseLoginReturn } from '@/utils/hooks'\nimport { Box, Button } from '@mui/material'\nimport { useState } from 'react'\nimport TextField from '../TextField/TextField'\n\n// 16 characters separated into chunks of 4 by 3 hyphens\nconst RECOVERY_CODE_LENGTH = 19\n\ntype RecoveryCodeFormProps = {\n  onSubmit: (value: string) => void\n  loginIsPending: UseLoginReturn['loginIsPending']\n}\n\nexport default function RecoveryCodeForm(props: RecoveryCodeFormProps) {\n  const { onSubmit, loginIsPending } = props\n  const [recoveryCode, setRecoveryCode] = useState('')\n  return (\n    <Box>\n      <TextField\n        placeholder=\"Enter backup code\"\n        value={recoveryCode}\n        onChange={e => {\n          // coerce the input to lowercase and remove any nonalphanumeric or hyphen characters\n          const valueWithAllowedChars = e.target.value\n            .toLowerCase()\n            .replace(/[^a-z0-9-]/gi, '')\n          setRecoveryCode(valueWithAllowedChars)\n        }}\n      />\n\n      <Button\n        fullWidth\n        type=\"submit\"\n        color=\"primary\"\n        variant=\"contained\"\n        sx={{\n          height: '50px',\n          mt: 4,\n          mb: 2,\n        }}\n        disabled={\n          recoveryCode.length !== RECOVERY_CODE_LENGTH || loginIsPending\n        }\n        onClick={e => {\n          e.preventDefault()\n          onSubmit(recoveryCode)\n        }}\n      >\n        {loginIsPending ? 'Verifying...' : 'Submit'}\n      </Button>\n    </Box>\n  )\n}\n"],"mappings":";;;;;AAMA,IAAM,IAAuB;AAO7B,SAAwB,EAAiB,GAA8B;CACrE,IAAM,EAAE,aAAU,sBAAmB,GAC/B,CAAC,GAAc,KAAmB,EAAS,EAAE;CACnD,OACE,kBAAC,GAAD,EAAA,UAAA,CACE,kBAAC,GAAD;EACE,aAAY;EACZ,OAAO;EACP,WAAU,MAAK;GAKb,EAH8B,EAAE,OAAO,MACpC,YAAY,EACZ,QAAQ,gBAAgB,EACX,CAAqB;EACvC;CACD,CAAA,GAED,kBAAC,GAAD;EACE,WAAA;EACA,MAAK;EACL,OAAM;EACN,SAAQ;EACR,IAAI;GACF,QAAQ;GACR,IAAI;GACJ,IAAI;EACN;EACA,UACE,EAAa,WAAW,KAAwB;EAElD,UAAS,MAAK;GAEZ,AADA,EAAE,eAAe,GACjB,EAAS,CAAY;EACvB;YAEC,IAAiB,iBAAiB;CAC7B,CAAA,CACL,EAAA,CAAA;AAET"}

package/dist/components/Authentication/RecoveryCodeGrid.js.map

@@ -1 +1 @@
-{"version":3,"file":"RecoveryCodeGrid.js","names":[],"sources":["../../../src/components/Authentication/RecoveryCodeGrid.tsx"],"sourcesContent":["import ConditionalWrapper from '@/components/utils/ConditionalWrapper'\nimport { Box } from '@mui/material'\nimport Skeleton from '@mui/material/Skeleton'\nimport { TwoFactorAuthRecoveryCodes } from '@sage-bionetworks/synapse-types'\n\nconst DEFAULT_RECOVERY_CODE_COUNT = 10\n\n// Placeholder codes used to render skeletons while loading\nconst PLACEHOLDER_RECOVERY_CODE = '1234-5678-9012-3456'\nconst PLACEHOLDER_RECOVERY_CODES = Array(DEFAULT_RECOVERY_CODE_COUNT).fill(\n  PLACEHOLDER_RECOVERY_CODE,\n)\n\ntype RecoveryCodeGridProps = {\n  recoveryCodes?: TwoFactorAuthRecoveryCodes\n}\n\nexport function RecoveryCodeGrid(props: RecoveryCodeGridProps) {\n  const { recoveryCodes } = props\n  return (\n    <Box\n      sx={{\n        display: 'grid',\n        gridTemplateColumns: '47.5% 47.5%',\n        columnGap: '5%',\n        gridTemplateRows: 'repeat(5, 1fr)',\n        fontFamily: 'Menlo, Courier New, Courier, monospace',\n        my: 2,\n      }}\n    >\n      {(recoveryCodes?.codes ?? PLACEHOLDER_RECOVERY_CODES).map(\n        (code, index) => {\n          return (\n            <ConditionalWrapper\n              key={index}\n              condition={!recoveryCodes}\n              wrapper={Skeleton}\n              wrapperProps={{ width: '100%', height: '100%' }}\n            >\n              <Box\n                sx={{\n                  my: 1,\n                  fontSize: '13px',\n                }}\n              >\n                {code}\n              </Box>\n            </ConditionalWrapper>\n          )\n        },\n      )}\n    </Box>\n  )\n}\n"],"mappings":";;;;;AASA,IAAM,IAA6B,MAAM,GAA4B,CAAC,KACpE,sBACD;AAMD,SAAgB,EAAiB,GAA8B;CAC7D,IAAM,EAAE,qBAAkB;AAC1B,QACE,kBAAC,GAAD;EACE,IAAI;GACF,SAAS;GACT,qBAAqB;GACrB,WAAW;GACX,kBAAkB;GAClB,YAAY;GACZ,IAAI;GACL;aAEC,GAAe,SAAS,GAA4B,KACnD,GAAM,MAEH,kBAAC,GAAD;GAEE,WAAW,CAAC;GACZ,SAAS;GACT,cAAc;IAAE,OAAO;IAAQ,QAAQ;IAAQ;aAE/C,kBAAC,GAAD;IACE,IAAI;KACF,IAAI;KACJ,UAAU;KACX;cAEA;IACG,CAAA;GACa,EAbd,EAac,CAG1B;EACG,CAAA"}
+{"version":3,"file":"RecoveryCodeGrid.js","names":[],"sources":["../../../src/components/Authentication/RecoveryCodeGrid.tsx"],"sourcesContent":["import ConditionalWrapper from '@/components/utils/ConditionalWrapper'\nimport { Box } from '@mui/material'\nimport Skeleton from '@mui/material/Skeleton'\nimport { TwoFactorAuthRecoveryCodes } from '@sage-bionetworks/synapse-types'\n\nconst DEFAULT_RECOVERY_CODE_COUNT = 10\n\n// Placeholder codes used to render skeletons while loading\nconst PLACEHOLDER_RECOVERY_CODE = '1234-5678-9012-3456'\nconst PLACEHOLDER_RECOVERY_CODES = Array(DEFAULT_RECOVERY_CODE_COUNT).fill(\n  PLACEHOLDER_RECOVERY_CODE,\n)\n\ntype RecoveryCodeGridProps = {\n  recoveryCodes?: TwoFactorAuthRecoveryCodes\n}\n\nexport function RecoveryCodeGrid(props: RecoveryCodeGridProps) {\n  const { recoveryCodes } = props\n  return (\n    <Box\n      sx={{\n        display: 'grid',\n        gridTemplateColumns: '47.5% 47.5%',\n        columnGap: '5%',\n        gridTemplateRows: 'repeat(5, 1fr)',\n        fontFamily: 'Menlo, Courier New, Courier, monospace',\n        my: 2,\n      }}\n    >\n      {(recoveryCodes?.codes ?? PLACEHOLDER_RECOVERY_CODES).map(\n        (code, index) => {\n          return (\n            <ConditionalWrapper\n              key={index}\n              condition={!recoveryCodes}\n              wrapper={Skeleton}\n              wrapperProps={{ width: '100%', height: '100%' }}\n            >\n              <Box\n                sx={{\n                  my: 1,\n                  fontSize: '13px',\n                }}\n              >\n                {code}\n              </Box>\n            </ConditionalWrapper>\n          )\n        },\n      )}\n    </Box>\n  )\n}\n"],"mappings":";;;;;AASA,IAAM,IAA6B,MAAM,EAA2B,EAAE,KACpE,qBACF;AAMA,SAAgB,EAAiB,GAA8B;CAC7D,IAAM,EAAE,qBAAkB;CAC1B,OACE,kBAAC,GAAD;EACE,IAAI;GACF,SAAS;GACT,qBAAqB;GACrB,WAAW;GACX,kBAAkB;GAClB,YAAY;GACZ,IAAI;EACN;aAEE,GAAe,SAAS,GAA4B,KACnD,GAAM,MAEH,kBAAC,GAAD;GAEE,WAAW,CAAC;GACZ,SAAS;GACT,cAAc;IAAE,OAAO;IAAQ,QAAQ;GAAO;aAE9C,kBAAC,GAAD;IACE,IAAI;KACF,IAAI;KACJ,UAAU;IACZ;cAEC;GACE,CAAA;EACa,GAbb,CAaa,CAG1B;CACG,CAAA;AAET"}

package/dist/components/Authentication/RegenerateBackupCodesWarning.js.map

@@ -1 +1 @@
-{"version":3,"file":"RegenerateBackupCodesWarning.js","names":[],"sources":["../../../src/components/Authentication/RegenerateBackupCodesWarning.tsx"],"sourcesContent":["import FrontHand from '@/assets/icons/FrontHand'\nimport { Avatar, Box, Button, Paper, Typography, useTheme } from '@mui/material'\n\ntype RegenerateBackupCodesWarningProps = {\n  onConfirm: () => void\n  onCancel: () => void\n}\n\nexport function RegenerateBackupCodesWarning(\n  props: RegenerateBackupCodesWarningProps,\n) {\n  const { onConfirm, onCancel } = props\n  const theme = useTheme()\n  return (\n    <Paper sx={{ m: 'auto', maxWidth: '500px', p: 8 }}>\n      <Avatar\n        sx={{\n          bgcolor: theme.palette.primary.main,\n          height: '100px',\n          width: '100px',\n        }}\n      >\n        <FrontHand sx={{ height: '54px', width: '54px' }} />\n      </Avatar>\n      <Box sx={{ my: 5 }}>\n        <Typography variant={'headline1'} sx={{ mb: 2 }}>\n          Really regenerate backup codes?\n        </Typography>\n        <Typography variant={'body1'} sx={{ my: 1 }}>\n          This will invalidate your old backup codes\n        </Typography>\n        <Typography variant={'body1'} sx={{ my: 1 }}>\n          If you click “yes”, below, we will generate 10 new backup codes,\n          replacing your old ones, which will no longer function.\n        </Typography>\n      </Box>\n      <Button\n        fullWidth\n        variant=\"contained\"\n        onClick={onConfirm}\n        sx={{ height: '50px', my: 1 }}\n      >\n        Yes, regenerate backup codes\n      </Button>\n      <Button\n        fullWidth\n        variant=\"text\"\n        onClick={onCancel}\n        sx={{ height: '50px', my: 1 }}\n      >\n        Nevermind\n      </Button>\n    </Paper>\n  )\n}\n"],"mappings":";;;;AAQA,SAAgB,EACd,GACA;CACA,IAAM,EAAE,cAAW,gBAAa;AAEhC,QACE,kBAAC,GAAD;EAAO,IAAI;GAAE,GAAG;GAAQ,UAAU;GAAS,GAAG;GAAG;YAAjD;GACE,kBAAC,GAAD;IACE,IAAI;KACF,SALM,GAKG,CAAM,QAAQ,QAAQ;KAC/B,QAAQ;KACR,OAAO;KACR;cAED,kBAAC,GAAD,EAAW,IAAI;KAAE,QAAQ;KAAQ,OAAO;KAAQ,EAAI,CAAA;IAC7C,CAAA;GACT,kBAAC,GAAD;IAAK,IAAI,EAAE,IAAI,GAAG;cAAlB;KACE,kBAAC,GAAD;MAAY,SAAS;MAAa,IAAI,EAAE,IAAI,GAAG;gBAAE;MAEpC,CAAA;KACb,kBAAC,GAAD;MAAY,SAAS;MAAS,IAAI,EAAE,IAAI,GAAG;gBAAE;MAEhC,CAAA;KACb,kBAAC,GAAD;MAAY,SAAS;MAAS,IAAI,EAAE,IAAI,GAAG;gBAAE;MAGhC,CAAA;KACT;;GACN,kBAAC,GAAD;IACE,WAAA;IACA,SAAQ;IACR,SAAS;IACT,IAAI;KAAE,QAAQ;KAAQ,IAAI;KAAG;cAC9B;IAEQ,CAAA;GACT,kBAAC,GAAD;IACE,WAAA;IACA,SAAQ;IACR,SAAS;IACT,IAAI;KAAE,QAAQ;KAAQ,IAAI;KAAG;cAC9B;IAEQ,CAAA;GACH"}
+{"version":3,"file":"RegenerateBackupCodesWarning.js","names":[],"sources":["../../../src/components/Authentication/RegenerateBackupCodesWarning.tsx"],"sourcesContent":["import FrontHand from '@/assets/icons/FrontHand'\nimport { Avatar, Box, Button, Paper, Typography, useTheme } from '@mui/material'\n\ntype RegenerateBackupCodesWarningProps = {\n  onConfirm: () => void\n  onCancel: () => void\n}\n\nexport function RegenerateBackupCodesWarning(\n  props: RegenerateBackupCodesWarningProps,\n) {\n  const { onConfirm, onCancel } = props\n  const theme = useTheme()\n  return (\n    <Paper sx={{ m: 'auto', maxWidth: '500px', p: 8 }}>\n      <Avatar\n        sx={{\n          bgcolor: theme.palette.primary.main,\n          height: '100px',\n          width: '100px',\n        }}\n      >\n        <FrontHand sx={{ height: '54px', width: '54px' }} />\n      </Avatar>\n      <Box sx={{ my: 5 }}>\n        <Typography variant={'headline1'} sx={{ mb: 2 }}>\n          Really regenerate backup codes?\n        </Typography>\n        <Typography variant={'body1'} sx={{ my: 1 }}>\n          This will invalidate your old backup codes\n        </Typography>\n        <Typography variant={'body1'} sx={{ my: 1 }}>\n          If you click “yes”, below, we will generate 10 new backup codes,\n          replacing your old ones, which will no longer function.\n        </Typography>\n      </Box>\n      <Button\n        fullWidth\n        variant=\"contained\"\n        onClick={onConfirm}\n        sx={{ height: '50px', my: 1 }}\n      >\n        Yes, regenerate backup codes\n      </Button>\n      <Button\n        fullWidth\n        variant=\"text\"\n        onClick={onCancel}\n        sx={{ height: '50px', my: 1 }}\n      >\n        Nevermind\n      </Button>\n    </Paper>\n  )\n}\n"],"mappings":";;;;AAQA,SAAgB,EACd,GACA;CACA,IAAM,EAAE,cAAW,gBAAa;CAEhC,OACE,kBAAC,GAAD;EAAO,IAAI;GAAE,GAAG;GAAQ,UAAU;GAAS,GAAG;EAAE;YAAhD;GACE,kBAAC,GAAD;IACE,IAAI;KACF,SALM,EAKG,EAAM,QAAQ,QAAQ;KAC/B,QAAQ;KACR,OAAO;IACT;cAEA,kBAAC,GAAD,EAAW,IAAI;KAAE,QAAQ;KAAQ,OAAO;IAAO,EAAI,CAAA;GAC7C,CAAA;GACR,kBAAC,GAAD;IAAK,IAAI,EAAE,IAAI,EAAE;cAAjB;KACE,kBAAC,GAAD;MAAY,SAAS;MAAa,IAAI,EAAE,IAAI,EAAE;gBAAG;KAErC,CAAA;KACZ,kBAAC,GAAD;MAAY,SAAS;MAAS,IAAI,EAAE,IAAI,EAAE;gBAAG;KAEjC,CAAA;KACZ,kBAAC,GAAD;MAAY,SAAS;MAAS,IAAI,EAAE,IAAI,EAAE;gBAAG;KAGjC,CAAA;IACT;;GACL,kBAAC,GAAD;IACE,WAAA;IACA,SAAQ;IACR,SAAS;IACT,IAAI;KAAE,QAAQ;KAAQ,IAAI;IAAE;cAC7B;GAEO,CAAA;GACR,kBAAC,GAAD;IACE,WAAA;IACA,SAAQ;IACR,SAAS;IACT,IAAI;KAAE,QAAQ;KAAQ,IAAI;IAAE;cAC7B;GAEO,CAAA;EACH;;AAEX"}

package/dist/components/Authentication/Reset2FAWarning.js.map

@@ -1 +1 @@
-{"version":3,"file":"Reset2FAWarning.js","names":[],"sources":["../../../src/components/Authentication/Reset2FAWarning.tsx"],"sourcesContent":["import FrontHand from '@/assets/icons/FrontHand'\nimport { Avatar, Box, Button, Paper, Typography, useTheme } from '@mui/material'\n\ntype Reset2FAWarningProps = {\n  onConfirm: () => void\n  onCancel: () => void\n}\n\nexport default function Reset2FAWarning(props: Reset2FAWarningProps) {\n  const { onConfirm, onCancel } = props\n  const theme = useTheme()\n  return (\n    <Paper sx={{ m: 'auto', maxWidth: '500px', p: 8 }}>\n      <Avatar\n        sx={{\n          bgcolor: theme.palette.primary.main,\n          height: '100px',\n          width: '100px',\n        }}\n      >\n        <FrontHand sx={{ height: '54px', width: '54px' }} />\n      </Avatar>\n      <Box sx={{ my: 5 }}>\n        <Typography variant={'headline1'} sx={{ mb: 2 }}>\n          Really reset 2FA?\n        </Typography>\n        <Typography variant={'body1'} sx={{ my: 1 }}>\n          You'll set up new security codes on the next screen using your\n          authenticator app. Your current codes will keep working until you\n          finish setting up the new ones.\n        </Typography>\n        <Typography variant={'body1'} sx={{ my: 1 }}>\n          Once setup is complete, only your new codes will work for logging in.\n        </Typography>\n      </Box>\n      <Button\n        fullWidth\n        variant=\"contained\"\n        onClick={onConfirm}\n        sx={{ height: '50px', my: 1 }}\n      >\n        Yes, reset 2FA\n      </Button>\n      <Button\n        fullWidth\n        variant=\"text\"\n        onClick={onCancel}\n        sx={{ height: '50px', my: 1 }}\n      >\n        Nevermind\n      </Button>\n    </Paper>\n  )\n}\n"],"mappings":";;;;AAQA,SAAwB,EAAgB,GAA6B;CACnE,IAAM,EAAE,cAAW,gBAAa;AAEhC,QACE,kBAAC,GAAD;EAAO,IAAI;GAAE,GAAG;GAAQ,UAAU;GAAS,GAAG;GAAG;YAAjD;GACE,kBAAC,GAAD;IACE,IAAI;KACF,SALM,GAKG,CAAM,QAAQ,QAAQ;KAC/B,QAAQ;KACR,OAAO;KACR;cAED,kBAAC,GAAD,EAAW,IAAI;KAAE,QAAQ;KAAQ,OAAO;KAAQ,EAAI,CAAA;IAC7C,CAAA;GACT,kBAAC,GAAD;IAAK,IAAI,EAAE,IAAI,GAAG;cAAlB;KACE,kBAAC,GAAD;MAAY,SAAS;MAAa,IAAI,EAAE,IAAI,GAAG;gBAAE;MAEpC,CAAA;KACb,kBAAC,GAAD;MAAY,SAAS;MAAS,IAAI,EAAE,IAAI,GAAG;gBAAE;MAIhC,CAAA;KACb,kBAAC,GAAD;MAAY,SAAS;MAAS,IAAI,EAAE,IAAI,GAAG;gBAAE;MAEhC,CAAA;KACT;;GACN,kBAAC,GAAD;IACE,WAAA;IACA,SAAQ;IACR,SAAS;IACT,IAAI;KAAE,QAAQ;KAAQ,IAAI;KAAG;cAC9B;IAEQ,CAAA;GACT,kBAAC,GAAD;IACE,WAAA;IACA,SAAQ;IACR,SAAS;IACT,IAAI;KAAE,QAAQ;KAAQ,IAAI;KAAG;cAC9B;IAEQ,CAAA;GACH"}
+{"version":3,"file":"Reset2FAWarning.js","names":[],"sources":["../../../src/components/Authentication/Reset2FAWarning.tsx"],"sourcesContent":["import FrontHand from '@/assets/icons/FrontHand'\nimport { Avatar, Box, Button, Paper, Typography, useTheme } from '@mui/material'\n\ntype Reset2FAWarningProps = {\n  onConfirm: () => void\n  onCancel: () => void\n}\n\nexport default function Reset2FAWarning(props: Reset2FAWarningProps) {\n  const { onConfirm, onCancel } = props\n  const theme = useTheme()\n  return (\n    <Paper sx={{ m: 'auto', maxWidth: '500px', p: 8 }}>\n      <Avatar\n        sx={{\n          bgcolor: theme.palette.primary.main,\n          height: '100px',\n          width: '100px',\n        }}\n      >\n        <FrontHand sx={{ height: '54px', width: '54px' }} />\n      </Avatar>\n      <Box sx={{ my: 5 }}>\n        <Typography variant={'headline1'} sx={{ mb: 2 }}>\n          Really reset 2FA?\n        </Typography>\n        <Typography variant={'body1'} sx={{ my: 1 }}>\n          You'll set up new security codes on the next screen using your\n          authenticator app. Your current codes will keep working until you\n          finish setting up the new ones.\n        </Typography>\n        <Typography variant={'body1'} sx={{ my: 1 }}>\n          Once setup is complete, only your new codes will work for logging in.\n        </Typography>\n      </Box>\n      <Button\n        fullWidth\n        variant=\"contained\"\n        onClick={onConfirm}\n        sx={{ height: '50px', my: 1 }}\n      >\n        Yes, reset 2FA\n      </Button>\n      <Button\n        fullWidth\n        variant=\"text\"\n        onClick={onCancel}\n        sx={{ height: '50px', my: 1 }}\n      >\n        Nevermind\n      </Button>\n    </Paper>\n  )\n}\n"],"mappings":";;;;AAQA,SAAwB,EAAgB,GAA6B;CACnE,IAAM,EAAE,cAAW,gBAAa;CAEhC,OACE,kBAAC,GAAD;EAAO,IAAI;GAAE,GAAG;GAAQ,UAAU;GAAS,GAAG;EAAE;YAAhD;GACE,kBAAC,GAAD;IACE,IAAI;KACF,SALM,EAKG,EAAM,QAAQ,QAAQ;KAC/B,QAAQ;KACR,OAAO;IACT;cAEA,kBAAC,GAAD,EAAW,IAAI;KAAE,QAAQ;KAAQ,OAAO;IAAO,EAAI,CAAA;GAC7C,CAAA;GACR,kBAAC,GAAD;IAAK,IAAI,EAAE,IAAI,EAAE;cAAjB;KACE,kBAAC,GAAD;MAAY,SAAS;MAAa,IAAI,EAAE,IAAI,EAAE;gBAAG;KAErC,CAAA;KACZ,kBAAC,GAAD;MAAY,SAAS;MAAS,IAAI,EAAE,IAAI,EAAE;gBAAG;KAIjC,CAAA;KACZ,kBAAC,GAAD;MAAY,SAAS;MAAS,IAAI,EAAE,IAAI,EAAE;gBAAG;KAEjC,CAAA;IACT;;GACL,kBAAC,GAAD;IACE,WAAA;IACA,SAAQ;IACR,SAAS;IACT,IAAI;KAAE,QAAQ;KAAQ,IAAI;IAAE;cAC7B;GAEO,CAAA;GACR,kBAAC,GAAD;IACE,WAAA;IACA,SAAQ;IACR,SAAS;IACT,IAAI;KAAE,QAAQ;KAAQ,IAAI;IAAE;cAC7B;GAEO,CAAA;EACH;;AAEX"}

package/dist/components/Authentication/StandaloneLoginForm.js.map

@@ -1 +1 @@
-{"version":3,"file":"StandaloneLoginForm.js","names":[],"sources":["../../../src/components/Authentication/StandaloneLoginForm.tsx"],"sourcesContent":["import { OAuth2State } from '@/utils'\nimport useLogin from '@/utils/hooks/useLogin'\nimport { Box, Typography } from '@mui/material'\nimport { TwoFactorAuthErrorResponse } from '@sage-bionetworks/synapse-client/generated/models/TwoFactorAuthErrorResponse'\nimport { Realm } from '@sage-bionetworks/synapse-client'\nimport {\n  RECOVERY_CODE_GUIDANCE_TEXT_SHORT,\n  TOTP_GUIDANCE_TEXT,\n} from './Constants'\nimport LoginFlowBackButton from './LoginFlowBackButton'\nimport LoginForm from './LoginForm'\n\nexport type StandaloneLoginFormProps = {\n  ssoRedirectUrl?: string\n  sessionCallback: () => void // Callback is invoked after login\n  registerAccountUrl?: string\n  resetPasswordUrl?: string\n  /* Invoked before redirecting to Google. Useful in portals where we may want to store the current URL to redirect back here. */\n  onBeginOAuthSignIn?: () => void\n  /* optionally pass the 2FA error response to directly start the 2FA challenge */\n  twoFactorAuthenticationRequired?: TwoFactorAuthErrorResponse\n  /* If a twoFactorAuthError is encountered (including passed in the twoFactorAuthenticationRequired prop), this callback will be invoked */\n  onTwoFactorAuthRequired?: (\n    twoFaErrorResponse: Pick<\n      TwoFactorAuthErrorResponse,\n      'twoFaToken' | 'userId'\n    >,\n  ) => void\n  hideRegisterButton?: boolean\n  hideForgotPasswordButton?: boolean\n  ssoState?: OAuth2State\n  /* The URI where the user should be directed in an email when attempting to reset 2FA */\n  twoFactorAuthResetUri?: string\n  /* Invoked when password login is selected */\n  onPasswordLoginSelected?: () => void\n  realm?: Realm\n}\n\nexport default function StandaloneLoginForm(props: StandaloneLoginFormProps) {\n  const {\n    ssoRedirectUrl,\n    sessionCallback,\n    registerAccountUrl,\n    resetPasswordUrl,\n    onBeginOAuthSignIn,\n    onTwoFactorAuthRequired,\n    hideRegisterButton,\n    hideForgotPasswordButton,\n    ssoState,\n    twoFactorAuthResetUri,\n    onPasswordLoginSelected,\n    realm,\n  } = props\n\n  const {\n    step,\n    onStepChange,\n    submitUsernameAndPassword,\n    submitOneTimePassword,\n    errorMessage,\n    loginIsPending,\n    beginTwoFactorAuthReset,\n    twoFactorAuthResetIsPending,\n    twoFactorAuthResetIsSuccess,\n  } = useLogin({\n    sessionCallback,\n    twoFaErrorResponse: props.twoFactorAuthenticationRequired,\n    onTwoFactorAuthRequired,\n  })\n\n  return (\n    <Box\n      sx={theme => ({\n        [theme.breakpoints.up('sm')]: {\n          width: '330px',\n        },\n        p: 0,\n        mx: 'auto',\n        bgColor: 'transparent',\n      })}\n    >\n      <LoginFlowBackButton\n        step={step}\n        onStepChange={onStepChange}\n        sx={{ p: 0, mb: 1 }}\n      />\n      {step === 'VERIFICATION_CODE' && (\n        <Typography variant={'body1'} sx={{ my: 2 }} align={'center'}>\n          {TOTP_GUIDANCE_TEXT}\n        </Typography>\n      )}\n      {step === 'RECOVERY_CODE' && (\n        <Typography variant={'body1'} sx={{ my: 2 }} align={'center'}>\n          {RECOVERY_CODE_GUIDANCE_TEXT_SHORT}\n        </Typography>\n      )}\n      <LoginForm\n        step={step}\n        onStepChange={onStepChange}\n        submitUsernameAndPassword={submitUsernameAndPassword}\n        submitOneTimePassword={submitOneTimePassword}\n        errorMessage={errorMessage}\n        ssoRedirectUrl={ssoRedirectUrl}\n        registerAccountUrl={registerAccountUrl}\n        resetPasswordUrl={resetPasswordUrl}\n        onBeginOAuthSignIn={onBeginOAuthSignIn}\n        loginIsPending={loginIsPending}\n        beginTwoFactorAuthReset={beginTwoFactorAuthReset}\n        hideRegisterButton={hideRegisterButton}\n        hideForgotPasswordButton={hideForgotPasswordButton}\n        twoFactorAuthResetIsPending={twoFactorAuthResetIsPending}\n        twoFactorAuthResetIsSuccess={twoFactorAuthResetIsSuccess}\n        ssoState={ssoState}\n        twoFactorAuthResetUri={twoFactorAuthResetUri}\n        onPasswordLoginSelected={onPasswordLoginSelected}\n        realm={realm}\n      />\n    </Box>\n  )\n}\n"],"mappings":";;;;;;;AAsCA,SAAwB,EAAoB,GAAiC;CAC3E,IAAM,EACJ,mBACA,oBACA,uBACA,qBACA,uBACA,4BACA,uBACA,6BACA,aACA,0BACA,4BACA,aACE,GAEE,EACJ,SACA,iBACA,8BACA,0BACA,iBACA,mBACA,4BACA,gCACA,mCACE,EAAS;EACX;EACA,oBAAoB,EAAM;EAC1B;EACD,CAAC;AAEF,QACE,kBAAC,GAAD;EACE,KAAI,OAAU;IACX,EAAM,YAAY,GAAG,KAAK,GAAG,EAC5B,OAAO,SACR;GACD,GAAG;GACH,IAAI;GACJ,SAAS;GACV;YARH;GAUE,kBAAC,GAAD;IACQ;IACQ;IACd,IAAI;KAAE,GAAG;KAAG,IAAI;KAAG;IACnB,CAAA;GACD,MAAS,uBACR,kBAAC,GAAD;IAAY,SAAS;IAAS,IAAI,EAAE,IAAI,GAAG;IAAE,OAAO;;IAEvC,CAAA;GAEd,MAAS,mBACR,kBAAC,GAAD;IAAY,SAAS;IAAS,IAAI,EAAE,IAAI,GAAG;IAAE,OAAO;;IAEvC,CAAA;GAEf,kBAAC,GAAD;IACQ;IACQ;IACa;IACJ;IACT;IACE;IACI;IACF;IACE;IACJ;IACS;IACL;IACM;IACG;IACA;IACnB;IACa;IACE;IAClB;IACP,CAAA;GACE"}
+{"version":3,"file":"StandaloneLoginForm.js","names":[],"sources":["../../../src/components/Authentication/StandaloneLoginForm.tsx"],"sourcesContent":["import { OAuth2State } from '@/utils'\nimport useLogin from '@/utils/hooks/useLogin'\nimport { Box, Typography } from '@mui/material'\nimport { TwoFactorAuthErrorResponse } from '@sage-bionetworks/synapse-client/generated/models/TwoFactorAuthErrorResponse'\nimport { Realm } from '@sage-bionetworks/synapse-client'\nimport {\n  RECOVERY_CODE_GUIDANCE_TEXT_SHORT,\n  TOTP_GUIDANCE_TEXT,\n} from './Constants'\nimport LoginFlowBackButton from './LoginFlowBackButton'\nimport LoginForm from './LoginForm'\n\nexport type StandaloneLoginFormProps = {\n  ssoRedirectUrl?: string\n  sessionCallback: () => void // Callback is invoked after login\n  registerAccountUrl?: string\n  resetPasswordUrl?: string\n  /* Invoked before redirecting to Google. Useful in portals where we may want to store the current URL to redirect back here. */\n  onBeginOAuthSignIn?: () => void\n  /* optionally pass the 2FA error response to directly start the 2FA challenge */\n  twoFactorAuthenticationRequired?: TwoFactorAuthErrorResponse\n  /* If a twoFactorAuthError is encountered (including passed in the twoFactorAuthenticationRequired prop), this callback will be invoked */\n  onTwoFactorAuthRequired?: (\n    twoFaErrorResponse: Pick<\n      TwoFactorAuthErrorResponse,\n      'twoFaToken' | 'userId'\n    >,\n  ) => void\n  hideRegisterButton?: boolean\n  hideForgotPasswordButton?: boolean\n  ssoState?: OAuth2State\n  /* The URI where the user should be directed in an email when attempting to reset 2FA */\n  twoFactorAuthResetUri?: string\n  /* Invoked when password login is selected */\n  onPasswordLoginSelected?: () => void\n  realm?: Realm\n}\n\nexport default function StandaloneLoginForm(props: StandaloneLoginFormProps) {\n  const {\n    ssoRedirectUrl,\n    sessionCallback,\n    registerAccountUrl,\n    resetPasswordUrl,\n    onBeginOAuthSignIn,\n    onTwoFactorAuthRequired,\n    hideRegisterButton,\n    hideForgotPasswordButton,\n    ssoState,\n    twoFactorAuthResetUri,\n    onPasswordLoginSelected,\n    realm,\n  } = props\n\n  const {\n    step,\n    onStepChange,\n    submitUsernameAndPassword,\n    submitOneTimePassword,\n    errorMessage,\n    loginIsPending,\n    beginTwoFactorAuthReset,\n    twoFactorAuthResetIsPending,\n    twoFactorAuthResetIsSuccess,\n  } = useLogin({\n    sessionCallback,\n    twoFaErrorResponse: props.twoFactorAuthenticationRequired,\n    onTwoFactorAuthRequired,\n  })\n\n  return (\n    <Box\n      sx={theme => ({\n        [theme.breakpoints.up('sm')]: {\n          width: '330px',\n        },\n        p: 0,\n        mx: 'auto',\n        bgColor: 'transparent',\n      })}\n    >\n      <LoginFlowBackButton\n        step={step}\n        onStepChange={onStepChange}\n        sx={{ p: 0, mb: 1 }}\n      />\n      {step === 'VERIFICATION_CODE' && (\n        <Typography variant={'body1'} sx={{ my: 2 }} align={'center'}>\n          {TOTP_GUIDANCE_TEXT}\n        </Typography>\n      )}\n      {step === 'RECOVERY_CODE' && (\n        <Typography variant={'body1'} sx={{ my: 2 }} align={'center'}>\n          {RECOVERY_CODE_GUIDANCE_TEXT_SHORT}\n        </Typography>\n      )}\n      <LoginForm\n        step={step}\n        onStepChange={onStepChange}\n        submitUsernameAndPassword={submitUsernameAndPassword}\n        submitOneTimePassword={submitOneTimePassword}\n        errorMessage={errorMessage}\n        ssoRedirectUrl={ssoRedirectUrl}\n        registerAccountUrl={registerAccountUrl}\n        resetPasswordUrl={resetPasswordUrl}\n        onBeginOAuthSignIn={onBeginOAuthSignIn}\n        loginIsPending={loginIsPending}\n        beginTwoFactorAuthReset={beginTwoFactorAuthReset}\n        hideRegisterButton={hideRegisterButton}\n        hideForgotPasswordButton={hideForgotPasswordButton}\n        twoFactorAuthResetIsPending={twoFactorAuthResetIsPending}\n        twoFactorAuthResetIsSuccess={twoFactorAuthResetIsSuccess}\n        ssoState={ssoState}\n        twoFactorAuthResetUri={twoFactorAuthResetUri}\n        onPasswordLoginSelected={onPasswordLoginSelected}\n        realm={realm}\n      />\n    </Box>\n  )\n}\n"],"mappings":";;;;;;;AAsCA,SAAwB,EAAoB,GAAiC;CAC3E,IAAM,EACJ,mBACA,oBACA,uBACA,qBACA,uBACA,4BACA,uBACA,6BACA,aACA,0BACA,4BACA,aACE,GAEE,EACJ,SACA,iBACA,8BACA,0BACA,iBACA,mBACA,4BACA,gCACA,mCACE,EAAS;EACX;EACA,oBAAoB,EAAM;EAC1B;CACF,CAAC;CAED,OACE,kBAAC,GAAD;EACE,KAAI,OAAU;IACX,EAAM,YAAY,GAAG,IAAI,IAAI,EAC5B,OAAO,QACT;GACA,GAAG;GACH,IAAI;GACJ,SAAS;EACX;YARF;GAUE,kBAAC,GAAD;IACQ;IACQ;IACd,IAAI;KAAE,GAAG;KAAG,IAAI;IAAE;GACnB,CAAA;GACA,MAAS,uBACR,kBAAC,GAAD;IAAY,SAAS;IAAS,IAAI,EAAE,IAAI,EAAE;IAAG,OAAO;;GAExC,CAAA;GAEb,MAAS,mBACR,kBAAC,GAAD;IAAY,SAAS;IAAS,IAAI,EAAE,IAAI,EAAE;IAAG,OAAO;;GAExC,CAAA;GAEd,kBAAC,GAAD;IACQ;IACQ;IACa;IACJ;IACT;IACE;IACI;IACF;IACE;IACJ;IACS;IACL;IACM;IACG;IACA;IACnB;IACa;IACE;IAClB;GACR,CAAA;EACE;;AAET"}

package/dist/components/Authentication/TOTPForm.js.map

@@ -1 +1 @@
-{"version":3,"file":"TOTPForm.js","names":[],"sources":["../../../src/components/Authentication/TOTPForm.tsx"],"sourcesContent":["import { UseLoginReturn } from '@/utils/hooks'\nimport { Box, Button } from '@mui/material'\nimport { MuiOtpInput } from 'mui-one-time-password-input'\nimport { useState } from 'react'\n\nconst TOTP_LENGTH = 6\nconst DIGIT_CHARACTERS = ['0', '1', '2', '3', '4', '5', '6', '7', '8', '9']\n\ntype TOTPFormProps = {\n  onSubmit: (value: string) => void\n  loginIsPending: UseLoginReturn['loginIsPending']\n}\n\nexport default function TOTPForm(props: TOTPFormProps) {\n  const { onSubmit, loginIsPending } = props\n  const [verificationCode, setVerificationCode] = useState('')\n  return (\n    <Box>\n      <MuiOtpInput\n        autoFocus\n        length={TOTP_LENGTH}\n        value={verificationCode}\n        onChange={setVerificationCode}\n        onComplete={onSubmit}\n        validateChar={(character: string) => {\n          return DIGIT_CHARACTERS.includes(character) || character === ''\n        }}\n        gap={'2px'}\n        sx={{\n          mx: 'auto',\n          maxWidth: '350px',\n          '.MuiInputBase-root': {\n            paddingLeft: '5px',\n            paddingRight: '5px',\n          },\n          '.MuiFormControl-root:first-of-type > .MuiInputBase-root': {\n            borderTopRightRadius: 0,\n            borderBottomRightRadius: 0,\n          },\n          '.MuiFormControl-root:last-of-type > .MuiInputBase-root': {\n            borderTopLeftRadius: 0,\n            borderBottomLeftRadius: 0,\n          },\n          '.MuiFormControl-root:not(:first-of-type):not(:last-of-type) > .MuiInputBase-root':\n            {\n              borderRadius: 0,\n            },\n        }}\n      />\n      <Button\n        fullWidth\n        type=\"submit\"\n        color=\"primary\"\n        variant=\"contained\"\n        sx={{\n          height: '50px',\n          mt: 4,\n          mb: 2,\n        }}\n        disabled={verificationCode.length !== TOTP_LENGTH || loginIsPending}\n        onClick={e => {\n          e.preventDefault()\n          onSubmit(verificationCode)\n        }}\n      >\n        {loginIsPending ? 'Verifying...' : 'Submit'}\n      </Button>\n    </Box>\n  )\n}\n"],"mappings":";;;;;AAKA,IAAM,IAAc,GACd,IAAmB;CAAC;CAAK;CAAK;CAAK;CAAK;CAAK;CAAK;CAAK;CAAK;CAAK;CAAI;AAO3E,SAAwB,EAAS,GAAsB;CACrD,IAAM,EAAE,aAAU,sBAAmB,GAC/B,CAAC,GAAkB,KAAuB,EAAS,GAAG;AAC5D,QACE,kBAAC,GAAD,EAAA,UAAA,CACE,kBAAC,GAAD;EACE,WAAA;EACA,QAAQ;EACR,OAAO;EACP,UAAU;EACV,YAAY;EACZ,eAAe,MACN,EAAiB,SAAS,EAAU,IAAI,MAAc;EAE/D,KAAK;EACL,IAAI;GACF,IAAI;GACJ,UAAU;GACV,sBAAsB;IACpB,aAAa;IACb,cAAc;IACf;GACD,2DAA2D;IACzD,sBAAsB;IACtB,yBAAyB;IAC1B;GACD,0DAA0D;IACxD,qBAAqB;IACrB,wBAAwB;IACzB;GACD,oFACE,EACE,cAAc,GACf;GACJ;EACD,CAAA,EACF,kBAAC,GAAD;EACE,WAAA;EACA,MAAK;EACL,OAAM;EACN,SAAQ;EACR,IAAI;GACF,QAAQ;GACR,IAAI;GACJ,IAAI;GACL;EACD,UAAU,EAAiB,WAAW,KAAe;EACrD,UAAS,MAAK;AAEZ,GADA,EAAE,gBAAgB,EAClB,EAAS,EAAiB;;YAG3B,IAAiB,iBAAiB;EAC5B,CAAA,CACL,EAAA,CAAA"}
+{"version":3,"file":"TOTPForm.js","names":[],"sources":["../../../src/components/Authentication/TOTPForm.tsx"],"sourcesContent":["import { UseLoginReturn } from '@/utils/hooks'\nimport { Box, Button } from '@mui/material'\nimport { MuiOtpInput } from 'mui-one-time-password-input'\nimport { useState } from 'react'\n\nconst TOTP_LENGTH = 6\nconst DIGIT_CHARACTERS = ['0', '1', '2', '3', '4', '5', '6', '7', '8', '9']\n\ntype TOTPFormProps = {\n  onSubmit: (value: string) => void\n  loginIsPending: UseLoginReturn['loginIsPending']\n}\n\nexport default function TOTPForm(props: TOTPFormProps) {\n  const { onSubmit, loginIsPending } = props\n  const [verificationCode, setVerificationCode] = useState('')\n  return (\n    <Box>\n      <MuiOtpInput\n        autoFocus\n        length={TOTP_LENGTH}\n        value={verificationCode}\n        onChange={setVerificationCode}\n        onComplete={onSubmit}\n        validateChar={(character: string) => {\n          return DIGIT_CHARACTERS.includes(character) || character === ''\n        }}\n        gap={'2px'}\n        sx={{\n          mx: 'auto',\n          maxWidth: '350px',\n          '.MuiInputBase-root': {\n            paddingLeft: '5px',\n            paddingRight: '5px',\n          },\n          '.MuiFormControl-root:first-of-type > .MuiInputBase-root': {\n            borderTopRightRadius: 0,\n            borderBottomRightRadius: 0,\n          },\n          '.MuiFormControl-root:last-of-type > .MuiInputBase-root': {\n            borderTopLeftRadius: 0,\n            borderBottomLeftRadius: 0,\n          },\n          '.MuiFormControl-root:not(:first-of-type):not(:last-of-type) > .MuiInputBase-root':\n            {\n              borderRadius: 0,\n            },\n        }}\n      />\n      <Button\n        fullWidth\n        type=\"submit\"\n        color=\"primary\"\n        variant=\"contained\"\n        sx={{\n          height: '50px',\n          mt: 4,\n          mb: 2,\n        }}\n        disabled={verificationCode.length !== TOTP_LENGTH || loginIsPending}\n        onClick={e => {\n          e.preventDefault()\n          onSubmit(verificationCode)\n        }}\n      >\n        {loginIsPending ? 'Verifying...' : 'Submit'}\n      </Button>\n    </Box>\n  )\n}\n"],"mappings":";;;;;AAKA,IAAM,IAAc,GACd,IAAmB;CAAC;CAAK;CAAK;CAAK;CAAK;CAAK;CAAK;CAAK;CAAK;CAAK;AAAG;AAO1E,SAAwB,EAAS,GAAsB;CACrD,IAAM,EAAE,aAAU,sBAAmB,GAC/B,CAAC,GAAkB,KAAuB,EAAS,EAAE;CAC3D,OACE,kBAAC,GAAD,EAAA,UAAA,CACE,kBAAC,GAAD;EACE,WAAA;EACA,QAAQ;EACR,OAAO;EACP,UAAU;EACV,YAAY;EACZ,eAAe,MACN,EAAiB,SAAS,CAAS,KAAK,MAAc;EAE/D,KAAK;EACL,IAAI;GACF,IAAI;GACJ,UAAU;GACV,sBAAsB;IACpB,aAAa;IACb,cAAc;GAChB;GACA,2DAA2D;IACzD,sBAAsB;IACtB,yBAAyB;GAC3B;GACA,0DAA0D;IACxD,qBAAqB;IACrB,wBAAwB;GAC1B;GACA,oFACE,EACE,cAAc,EAChB;EACJ;CACD,CAAA,GACD,kBAAC,GAAD;EACE,WAAA;EACA,MAAK;EACL,OAAM;EACN,SAAQ;EACR,IAAI;GACF,QAAQ;GACR,IAAI;GACJ,IAAI;EACN;EACA,UAAU,EAAiB,WAAW,KAAe;EACrD,UAAS,MAAK;GAEZ,AADA,EAAE,eAAe,GACjB,EAAS,CAAgB;EAC3B;YAEC,IAAiB,iBAAiB;CAC7B,CAAA,CACL,EAAA,CAAA;AAET"}

package/dist/components/Authentication/TwoFactorAuthSettingsPanel.js.map

@@ -1 +1 @@
-{"version":3,"file":"TwoFactorAuthSettingsPanel.js","names":[],"sources":["../../../src/components/Authentication/TwoFactorAuthSettingsPanel.tsx"],"sourcesContent":["import { Box, Button, Stack, Typography } from '@mui/material'\nimport { TWO_FACTOR_DOCS_LINK } from './TwoFactorEnrollmentForm'\n\nexport type TwoFactorAuthSettingsPanelProps = {\n  onRegenerateBackupCodes: () => void\n  onReset2FA: () => void\n  hideTitle?: boolean\n}\n\nexport default function TwoFactorAuthSettingsPanel(\n  props: TwoFactorAuthSettingsPanelProps,\n) {\n  const { onRegenerateBackupCodes, onReset2FA, hideTitle = false } = props\n\n  return (\n    <Box>\n      {!hideTitle && (\n        <Typography variant={'headline2'} role={'heading'}>\n          Two-factor Authentication (2FA)\n        </Typography>\n      )}\n      <Typography variant={'body1Italic'} sx={{ my: 1 }}>\n        Required for all projects and all users.\n      </Typography>\n      <Typography variant={'body1'} sx={{ my: 2 }}>\n        Synapse uses a time-based system, which you can set up using an app like\n        Google Authenticator, Duo Mobile, Microsoft Authenticator, or Authy.\n        Certain data may require 2FA to be turned on for your account in order\n        to request access.\n      </Typography>\n      <Stack direction={'row'} sx={{ gap: 1 }}>\n        <Button\n          variant={'text'}\n          onClick={() => {\n            onReset2FA()\n          }}\n        >\n          Reset 2FA\n        </Button>\n        <Button\n          variant={'text'}\n          onClick={() => {\n            onRegenerateBackupCodes()\n          }}\n        >\n          Regenerate Backup Codes\n        </Button>\n        <Button\n          variant={'text'}\n          onClick={() => window.open(TWO_FACTOR_DOCS_LINK, '_blank')}\n        >\n          More Information\n        </Button>\n      </Stack>\n    </Box>\n  )\n}\n"],"mappings":";;;;AASA,SAAwB,EACtB,GACA;CACA,IAAM,EAAE,4BAAyB,eAAY,eAAY,OAAU;AAEnE,QACE,kBAAC,GAAD,EAAA,UAAA;EACG,CAAC,KACA,kBAAC,GAAD;GAAY,SAAS;GAAa,MAAM;aAAW;GAEtC,CAAA;EAEf,kBAAC,GAAD;GAAY,SAAS;GAAe,IAAI,EAAE,IAAI,GAAG;aAAE;GAEtC,CAAA;EACb,kBAAC,GAAD;GAAY,SAAS;GAAS,IAAI,EAAE,IAAI,GAAG;aAAE;GAKhC,CAAA;EACb,kBAAC,GAAD;GAAO,WAAW;GAAO,IAAI,EAAE,KAAK,GAAG;aAAvC;IACE,kBAAC,GAAD;KACE,SAAS;KACT,eAAe;AACb,SAAY;;eAEf;KAEQ,CAAA;IACT,kBAAC,GAAD;KACE,SAAS;KACT,eAAe;AACb,SAAyB;;eAE5B;KAEQ,CAAA;IACT,kBAAC,GAAD;KACE,SAAS;KACT,eAAe,OAAO,KAAK,GAAsB,SAAS;eAC3D;KAEQ,CAAA;IACH;;EACJ,EAAA,CAAA"}
+{"version":3,"file":"TwoFactorAuthSettingsPanel.js","names":[],"sources":["../../../src/components/Authentication/TwoFactorAuthSettingsPanel.tsx"],"sourcesContent":["import { Box, Button, Stack, Typography } from '@mui/material'\nimport { TWO_FACTOR_DOCS_LINK } from './TwoFactorEnrollmentForm'\n\nexport type TwoFactorAuthSettingsPanelProps = {\n  onRegenerateBackupCodes: () => void\n  onReset2FA: () => void\n  hideTitle?: boolean\n}\n\nexport default function TwoFactorAuthSettingsPanel(\n  props: TwoFactorAuthSettingsPanelProps,\n) {\n  const { onRegenerateBackupCodes, onReset2FA, hideTitle = false } = props\n\n  return (\n    <Box>\n      {!hideTitle && (\n        <Typography variant={'headline2'} role={'heading'}>\n          Two-factor Authentication (2FA)\n        </Typography>\n      )}\n      <Typography variant={'body1Italic'} sx={{ my: 1 }}>\n        Required for all projects and all users.\n      </Typography>\n      <Typography variant={'body1'} sx={{ my: 2 }}>\n        Synapse uses a time-based system, which you can set up using an app like\n        Google Authenticator, Duo Mobile, Microsoft Authenticator, or Authy.\n        Certain data may require 2FA to be turned on for your account in order\n        to request access.\n      </Typography>\n      <Stack direction={'row'} sx={{ gap: 1 }}>\n        <Button\n          variant={'text'}\n          onClick={() => {\n            onReset2FA()\n          }}\n        >\n          Reset 2FA\n        </Button>\n        <Button\n          variant={'text'}\n          onClick={() => {\n            onRegenerateBackupCodes()\n          }}\n        >\n          Regenerate Backup Codes\n        </Button>\n        <Button\n          variant={'text'}\n          onClick={() => window.open(TWO_FACTOR_DOCS_LINK, '_blank')}\n        >\n          More Information\n        </Button>\n      </Stack>\n    </Box>\n  )\n}\n"],"mappings":";;;;AASA,SAAwB,EACtB,GACA;CACA,IAAM,EAAE,4BAAyB,eAAY,eAAY,OAAU;CAEnE,OACE,kBAAC,GAAD,EAAA,UAAA;EACG,CAAC,KACA,kBAAC,GAAD;GAAY,SAAS;GAAa,MAAM;aAAW;EAEvC,CAAA;EAEd,kBAAC,GAAD;GAAY,SAAS;GAAe,IAAI,EAAE,IAAI,EAAE;aAAG;EAEvC,CAAA;EACZ,kBAAC,GAAD;GAAY,SAAS;GAAS,IAAI,EAAE,IAAI,EAAE;aAAG;EAKjC,CAAA;EACZ,kBAAC,GAAD;GAAO,WAAW;GAAO,IAAI,EAAE,KAAK,EAAE;aAAtC;IACE,kBAAC,GAAD;KACE,SAAS;KACT,eAAe;MACb,EAAW;KACb;eACD;IAEO,CAAA;IACR,kBAAC,GAAD;KACE,SAAS;KACT,eAAe;MACb,EAAwB;KAC1B;eACD;IAEO,CAAA;IACR,kBAAC,GAAD;KACE,SAAS;KACT,eAAe,OAAO,KAAK,GAAsB,QAAQ;eAC1D;IAEO,CAAA;GACH;;CACJ,EAAA,CAAA;AAET"}

package/dist/components/Authentication/TwoFactorBackupCodes.js.map

@@ -1 +1 @@
-{"version":3,"file":"TwoFactorBackupCodes.js","names":[],"sources":["../../../src/components/Authentication/TwoFactorBackupCodes.tsx"],"sourcesContent":["import {\n  LeftRightPanel,\n  StyledOuterContainer,\n} from '@/components/styled/LeftRightPanel'\nimport { createRecoveryCodes } from '@/synapse-client/SynapseClient'\nimport { useSynapseContext } from '@/utils/context/SynapseContext'\nimport { useMediaPrintOnly } from '@/utils/hooks/useMediaPrintOnly'\nimport {\n  Alert,\n  Box,\n  Button,\n  IconButton,\n  Typography,\n  useTheme,\n} from '@mui/material'\nimport { SynapseClientError } from '@sage-bionetworks/synapse-client/util/SynapseClientError'\nimport { TwoFactorAuthRecoveryCodes } from '@sage-bionetworks/synapse-types'\nimport { useMutation } from '@tanstack/react-query'\nimport { useCallback, useEffect, useState } from 'react'\nimport IconSvg from '../IconSvg/IconSvg'\nimport { displayToast } from '../ToastMessage/ToastMessage'\nimport { RecoveryCodeGrid } from './RecoveryCodeGrid'\nimport { RegenerateBackupCodesWarning } from './RegenerateBackupCodesWarning'\nimport { copyStringToClipboard } from '@/utils/functions/StringUtils'\n\nexport type TwoFactorBackupCodesProps = {\n  /* Whether to show a warning before generating new codes, to prevent users from overwriting their existing codes */\n  showReplaceOldCodesWarning?: boolean\n  /* Invoked when the user decides not to generate new codes, or has acknowledged new codes. */\n  onClose: () => void\n}\n\nexport default function TwoFactorBackupCodes(props: TwoFactorBackupCodesProps) {\n  const { showReplaceOldCodesWarning, onClose } = props\n  const theme = useTheme()\n  const [hasConfirmedRegeneration, setHasConfirmedRegeneration] = useState(\n    !showReplaceOldCodesWarning,\n  )\n\n  const { accessToken } = useSynapseContext()\n\n  const {\n    mutate: generateCodes,\n    data: recoveryCodes,\n    error,\n  } = useMutation<TwoFactorAuthRecoveryCodes, SynapseClientError>({\n    mutationFn: () => createRecoveryCodes(accessToken),\n    onMutate: () => {\n      setHasConfirmedRegeneration(true)\n    },\n  })\n\n  // Generate codes on mount if no warning is shown\n  useEffect(() => {\n    if (!showReplaceOldCodesWarning) {\n      generateCodes()\n    }\n    // Run on mount only\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [])\n\n  const { visibleOnPrintClassName, hiddenOnPrintClassName } =\n    useMediaPrintOnly()\n\n  const copyCodesToClipboard = useCallback(() => {\n    const codes = (recoveryCodes?.codes || []).join('\\n')\n    copyStringToClipboard(codes).then(() => {\n      displayToast('Recovery codes copied to clipboard', 'success')\n    })\n  }, [recoveryCodes])\n\n  if (showReplaceOldCodesWarning && !hasConfirmedRegeneration) {\n    return (\n      <StyledOuterContainer sx={{ display: 'flex', flexDirection: 'column' }}>\n        <RegenerateBackupCodesWarning\n          onConfirm={generateCodes}\n          onCancel={onClose}\n        />\n      </StyledOuterContainer>\n    )\n  }\n\n  return (\n    <LeftRightPanel\n      className={visibleOnPrintClassName}\n      leftContent={\n        <Box\n          sx={{\n            py: 10,\n            px: 8,\n            height: '100%',\n            position: 'relative',\n          }}\n        >\n          <IconButton\n            type=\"button\"\n            onClick={onClose}\n            className={hiddenOnPrintClassName}\n            sx={{\n              position: 'absolute',\n              top: theme.spacing(2),\n              left: theme.spacing(2),\n            }}\n          >\n            <IconSvg\n              icon=\"arrowBack\"\n              wrap={false}\n              sx={{ height: '24px', width: '24px' }}\n            />\n          </IconButton>\n          <Typography variant=\"headline1\" sx={{ mt: 7 }}>\n            Backup codes\n          </Typography>\n          {showReplaceOldCodesWarning && (\n            <Alert\n              severity=\"warning\"\n              className={hiddenOnPrintClassName}\n              sx={{\n                my: 2,\n              }}\n              icon={false}\n            >\n              <strong>These new codes have replaced your old codes.</strong>{' '}\n              Please save these codes and use them from now on.\n            </Alert>\n          )}\n          <RecoveryCodeGrid recoveryCodes={recoveryCodes} />\n          {error && (\n            <Alert severity={'error'} sx={{ my: 2 }} icon={false}>\n              {error.message}\n            </Alert>\n          )}\n          <Box\n            className={hiddenOnPrintClassName}\n            sx={{\n              display: 'grid',\n              gridTemplateColumns: '1fr 1fr',\n              gap: '10px',\n              mb: '10px',\n            }}\n          >\n            <Button\n              variant={'outlined'}\n              onClick={copyCodesToClipboard}\n              disabled={!recoveryCodes}\n            >\n              Copy Codes\n            </Button>\n            <Button\n              variant={'outlined'}\n              disabled={!recoveryCodes}\n              onClick={window.print}\n            >\n              Print Codes\n            </Button>\n          </Box>\n          <Button\n            variant={'contained'}\n            className={hiddenOnPrintClassName}\n            fullWidth\n            disabled={!recoveryCodes}\n            onClick={onClose}\n          >\n            Done\n          </Button>\n        </Box>\n      }\n      rightContent={\n        <Box\n          sx={{\n            py: 10,\n            height: '100%',\n            background: `url(https://s3.amazonaws.com/static.synapse.org/images/twofactor-graphic.svg) no-repeat right bottom`,\n            backgroundSize: '100%',\n          }}\n        >\n          <Box\n            sx={{\n              mt: 7,\n              px: 9,\n            }}\n          >\n            <Typography variant=\"headline1\" sx={{ mb: 2.5 }}>\n              Save these codes\n            </Typography>\n            <Typography variant=\"body1\" sx={{ my: 2 }}>\n              You can use these 10 backup codes to access your account if you\n              ever lose access to your authentication device.\n            </Typography>\n            <Typography variant=\"body1\" sx={{ my: 2 }}>\n              Each code can only be used once.\n            </Typography>\n          </Box>\n        </Box>\n      }\n    />\n  )\n}\n"],"mappings":";;;;;;;;;;;;;;AAgCA,SAAwB,EAAqB,GAAkC;CAC7E,IAAM,EAAE,+BAA4B,eAAY,GAC1C,IAAQ,GAAU,EAClB,CAAC,GAA0B,KAA+B,EAC9D,CAAC,EACF,EAEK,EAAE,mBAAgB,GAAmB,EAErC,EACJ,QAAQ,GACR,MAAM,GACN,aACE,EAA4D;EAC9D,kBAAkB,EAAoB,EAAY;EAClD,gBAAgB;AACd,KAA4B,GAAK;;EAEpC,CAAC;AAGF,SAAgB;AACd,EAAK,KACH,GAAe;IAIhB,EAAE,CAAC;CAEN,IAAM,EAAE,4BAAyB,8BAC/B,GAAmB,EAEf,IAAuB,QAAkB;AAE7C,KADe,GAAe,SAAS,EAAE,EAAE,KAAK,KAC1B,CAAM,CAAC,WAAW;AACtC,KAAa,sCAAsC,UAAU;IAC7D;IACD,CAAC,EAAc,CAAC;AAanB,QAXI,KAA8B,CAAC,IAE/B,kBAAC,GAAD;EAAsB,IAAI;GAAE,SAAS;GAAQ,eAAe;GAAU;YACpE,kBAAC,GAAD;GACE,WAAW;GACX,UAAU;GACV,CAAA;EACmB,CAAA,GAKzB,kBAAC,GAAD;EACE,WAAW;EACX,aACE,kBAAC,GAAD;GACE,IAAI;IACF,IAAI;IACJ,IAAI;IACJ,QAAQ;IACR,UAAU;IACX;aANH;IAQE,kBAAC,GAAD;KACE,MAAK;KACL,SAAS;KACT,WAAW;KACX,IAAI;MACF,UAAU;MACV,KAAK,EAAM,QAAQ,EAAE;MACrB,MAAM,EAAM,QAAQ,EAAE;MACvB;eAED,kBAAC,GAAD;MACE,MAAK;MACL,MAAM;MACN,IAAI;OAAE,QAAQ;OAAQ,OAAO;OAAQ;MACrC,CAAA;KACS,CAAA;IACb,kBAAC,GAAD;KAAY,SAAQ;KAAY,IAAI,EAAE,IAAI,GAAG;eAAE;KAElC,CAAA;IACZ,KACC,kBAAC,GAAD;KACE,UAAS;KACT,WAAW;KACX,IAAI,EACF,IAAI,GACL;KACD,MAAM;eANR;MAQE,kBAAC,UAAD,EAAA,UAAQ,iDAAsD,CAAA;MAAC;MAAI;MAE7D;;IAEV,kBAAC,GAAD,EAAiC,kBAAiB,CAAA;IACjD,KACC,kBAAC,GAAD;KAAO,UAAU;KAAS,IAAI,EAAE,IAAI,GAAG;KAAE,MAAM;eAC5C,EAAM;KACD,CAAA;IAEV,kBAAC,GAAD;KACE,WAAW;KACX,IAAI;MACF,SAAS;MACT,qBAAqB;MACrB,KAAK;MACL,IAAI;MACL;eAPH,CASE,kBAAC,GAAD;MACE,SAAS;MACT,SAAS;MACT,UAAU,CAAC;gBACZ;MAEQ,CAAA,EACT,kBAAC,GAAD;MACE,SAAS;MACT,UAAU,CAAC;MACX,SAAS,OAAO;gBACjB;MAEQ,CAAA,CACL;;IACN,kBAAC,GAAD;KACE,SAAS;KACT,WAAW;KACX,WAAA;KACA,UAAU,CAAC;KACX,SAAS;eACV;KAEQ,CAAA;IACL;;EAER,cACE,kBAAC,GAAD;GACE,IAAI;IACF,IAAI;IACJ,QAAQ;IACR,YAAY;IACZ,gBAAgB;IACjB;aAED,kBAAC,GAAD;IACE,IAAI;KACF,IAAI;KACJ,IAAI;KACL;cAJH;KAME,kBAAC,GAAD;MAAY,SAAQ;MAAY,IAAI,EAAE,IAAI,KAAK;gBAAE;MAEpC,CAAA;KACb,kBAAC,GAAD;MAAY,SAAQ;MAAQ,IAAI,EAAE,IAAI,GAAG;gBAAE;MAG9B,CAAA;KACb,kBAAC,GAAD;MAAY,SAAQ;MAAQ,IAAI,EAAE,IAAI,GAAG;gBAAE;MAE9B,CAAA;KACT;;GACF,CAAA;EAER,CAAA"}
+{"version":3,"file":"TwoFactorBackupCodes.js","names":[],"sources":["../../../src/components/Authentication/TwoFactorBackupCodes.tsx"],"sourcesContent":["import {\n  LeftRightPanel,\n  StyledOuterContainer,\n} from '@/components/styled/LeftRightPanel'\nimport { createRecoveryCodes } from '@/synapse-client/SynapseClient'\nimport { useSynapseContext } from '@/utils/context/SynapseContext'\nimport { useMediaPrintOnly } from '@/utils/hooks/useMediaPrintOnly'\nimport {\n  Alert,\n  Box,\n  Button,\n  IconButton,\n  Typography,\n  useTheme,\n} from '@mui/material'\nimport { SynapseClientError } from '@sage-bionetworks/synapse-client/util/SynapseClientError'\nimport { TwoFactorAuthRecoveryCodes } from '@sage-bionetworks/synapse-types'\nimport { useMutation } from '@tanstack/react-query'\nimport { useCallback, useEffect, useState } from 'react'\nimport IconSvg from '../IconSvg/IconSvg'\nimport { displayToast } from '../ToastMessage/ToastMessage'\nimport { RecoveryCodeGrid } from './RecoveryCodeGrid'\nimport { RegenerateBackupCodesWarning } from './RegenerateBackupCodesWarning'\nimport { copyStringToClipboard } from '@/utils/functions/StringUtils'\n\nexport type TwoFactorBackupCodesProps = {\n  /* Whether to show a warning before generating new codes, to prevent users from overwriting their existing codes */\n  showReplaceOldCodesWarning?: boolean\n  /* Invoked when the user decides not to generate new codes, or has acknowledged new codes. */\n  onClose: () => void\n}\n\nexport default function TwoFactorBackupCodes(props: TwoFactorBackupCodesProps) {\n  const { showReplaceOldCodesWarning, onClose } = props\n  const theme = useTheme()\n  const [hasConfirmedRegeneration, setHasConfirmedRegeneration] = useState(\n    !showReplaceOldCodesWarning,\n  )\n\n  const { accessToken } = useSynapseContext()\n\n  const {\n    mutate: generateCodes,\n    data: recoveryCodes,\n    error,\n  } = useMutation<TwoFactorAuthRecoveryCodes, SynapseClientError>({\n    mutationFn: () => createRecoveryCodes(accessToken),\n    onMutate: () => {\n      setHasConfirmedRegeneration(true)\n    },\n  })\n\n  // Generate codes on mount if no warning is shown\n  useEffect(() => {\n    if (!showReplaceOldCodesWarning) {\n      generateCodes()\n    }\n    // Run on mount only\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [])\n\n  const { visibleOnPrintClassName, hiddenOnPrintClassName } =\n    useMediaPrintOnly()\n\n  const copyCodesToClipboard = useCallback(() => {\n    const codes = (recoveryCodes?.codes || []).join('\\n')\n    copyStringToClipboard(codes).then(() => {\n      displayToast('Recovery codes copied to clipboard', 'success')\n    })\n  }, [recoveryCodes])\n\n  if (showReplaceOldCodesWarning && !hasConfirmedRegeneration) {\n    return (\n      <StyledOuterContainer sx={{ display: 'flex', flexDirection: 'column' }}>\n        <RegenerateBackupCodesWarning\n          onConfirm={generateCodes}\n          onCancel={onClose}\n        />\n      </StyledOuterContainer>\n    )\n  }\n\n  return (\n    <LeftRightPanel\n      className={visibleOnPrintClassName}\n      leftContent={\n        <Box\n          sx={{\n            py: 10,\n            px: 8,\n            height: '100%',\n            position: 'relative',\n          }}\n        >\n          <IconButton\n            type=\"button\"\n            onClick={onClose}\n            className={hiddenOnPrintClassName}\n            sx={{\n              position: 'absolute',\n              top: theme.spacing(2),\n              left: theme.spacing(2),\n            }}\n          >\n            <IconSvg\n              icon=\"arrowBack\"\n              wrap={false}\n              sx={{ height: '24px', width: '24px' }}\n            />\n          </IconButton>\n          <Typography variant=\"headline1\" sx={{ mt: 7 }}>\n            Backup codes\n          </Typography>\n          {showReplaceOldCodesWarning && (\n            <Alert\n              severity=\"warning\"\n              className={hiddenOnPrintClassName}\n              sx={{\n                my: 2,\n              }}\n              icon={false}\n            >\n              <strong>These new codes have replaced your old codes.</strong>{' '}\n              Please save these codes and use them from now on.\n            </Alert>\n          )}\n          <RecoveryCodeGrid recoveryCodes={recoveryCodes} />\n          {error && (\n            <Alert severity={'error'} sx={{ my: 2 }} icon={false}>\n              {error.message}\n            </Alert>\n          )}\n          <Box\n            className={hiddenOnPrintClassName}\n            sx={{\n              display: 'grid',\n              gridTemplateColumns: '1fr 1fr',\n              gap: '10px',\n              mb: '10px',\n            }}\n          >\n            <Button\n              variant={'outlined'}\n              onClick={copyCodesToClipboard}\n              disabled={!recoveryCodes}\n            >\n              Copy Codes\n            </Button>\n            <Button\n              variant={'outlined'}\n              disabled={!recoveryCodes}\n              onClick={window.print}\n            >\n              Print Codes\n            </Button>\n          </Box>\n          <Button\n            variant={'contained'}\n            className={hiddenOnPrintClassName}\n            fullWidth\n            disabled={!recoveryCodes}\n            onClick={onClose}\n          >\n            Done\n          </Button>\n        </Box>\n      }\n      rightContent={\n        <Box\n          sx={{\n            py: 10,\n            height: '100%',\n            background: `url(https://s3.amazonaws.com/static.synapse.org/images/twofactor-graphic.svg) no-repeat right bottom`,\n            backgroundSize: '100%',\n          }}\n        >\n          <Box\n            sx={{\n              mt: 7,\n              px: 9,\n            }}\n          >\n            <Typography variant=\"headline1\" sx={{ mb: 2.5 }}>\n              Save these codes\n            </Typography>\n            <Typography variant=\"body1\" sx={{ my: 2 }}>\n              You can use these 10 backup codes to access your account if you\n              ever lose access to your authentication device.\n            </Typography>\n            <Typography variant=\"body1\" sx={{ my: 2 }}>\n              Each code can only be used once.\n            </Typography>\n          </Box>\n        </Box>\n      }\n    />\n  )\n}\n"],"mappings":";;;;;;;;;;;;;;AAgCA,SAAwB,EAAqB,GAAkC;CAC7E,IAAM,EAAE,+BAA4B,eAAY,GAC1C,IAAQ,EAAS,GACjB,CAAC,GAA0B,KAA+B,EAC9D,CAAC,CACH,GAEM,EAAE,mBAAgB,EAAkB,GAEpC,EACJ,QAAQ,GACR,MAAM,GACN,aACE,EAA4D;EAC9D,kBAAkB,EAAoB,CAAW;EACjD,gBAAgB;GACd,EAA4B,EAAI;EAClC;CACF,CAAC;CAGD,QAAgB;EACd,AAAK,KACH,EAAc;CAIlB,GAAG,CAAC,CAAC;CAEL,IAAM,EAAE,4BAAyB,8BAC/B,EAAkB,GAEd,IAAuB,QAAkB;EAE7C,GADe,GAAe,SAAS,CAAC,GAAG,KAAK,IAC1B,CAAK,EAAE,WAAW;GACtC,EAAa,sCAAsC,SAAS;EAC9D,CAAC;CACH,GAAG,CAAC,CAAa,CAAC;CAalB,OAXI,KAA8B,CAAC,IAE/B,kBAAC,GAAD;EAAsB,IAAI;GAAE,SAAS;GAAQ,eAAe;EAAS;YACnE,kBAAC,GAAD;GACE,WAAW;GACX,UAAU;EACX,CAAA;CACmB,CAAA,IAKxB,kBAAC,GAAD;EACE,WAAW;EACX,aACE,kBAAC,GAAD;GACE,IAAI;IACF,IAAI;IACJ,IAAI;IACJ,QAAQ;IACR,UAAU;GACZ;aANF;IAQE,kBAAC,GAAD;KACE,MAAK;KACL,SAAS;KACT,WAAW;KACX,IAAI;MACF,UAAU;MACV,KAAK,EAAM,QAAQ,CAAC;MACpB,MAAM,EAAM,QAAQ,CAAC;KACvB;eAEA,kBAAC,GAAD;MACE,MAAK;MACL,MAAM;MACN,IAAI;OAAE,QAAQ;OAAQ,OAAO;MAAO;KACrC,CAAA;IACS,CAAA;IACZ,kBAAC,GAAD;KAAY,SAAQ;KAAY,IAAI,EAAE,IAAI,EAAE;eAAG;IAEnC,CAAA;IACX,KACC,kBAAC,GAAD;KACE,UAAS;KACT,WAAW;KACX,IAAI,EACF,IAAI,EACN;KACA,MAAM;eANR;MAQE,kBAAC,UAAD,EAAA,UAAQ,gDAAqD,CAAA;MAAE;MAAI;KAE9D;;IAET,kBAAC,GAAD,EAAiC,iBAAgB,CAAA;IAChD,KACC,kBAAC,GAAD;KAAO,UAAU;KAAS,IAAI,EAAE,IAAI,EAAE;KAAG,MAAM;eAC5C,EAAM;IACF,CAAA;IAET,kBAAC,GAAD;KACE,WAAW;KACX,IAAI;MACF,SAAS;MACT,qBAAqB;MACrB,KAAK;MACL,IAAI;KACN;eAPF,CASE,kBAAC,GAAD;MACE,SAAS;MACT,SAAS;MACT,UAAU,CAAC;gBACZ;KAEO,CAAA,GACR,kBAAC,GAAD;MACE,SAAS;MACT,UAAU,CAAC;MACX,SAAS,OAAO;gBACjB;KAEO,CAAA,CACL;;IACL,kBAAC,GAAD;KACE,SAAS;KACT,WAAW;KACX,WAAA;KACA,UAAU,CAAC;KACX,SAAS;eACV;IAEO,CAAA;GACL;;EAEP,cACE,kBAAC,GAAD;GACE,IAAI;IACF,IAAI;IACJ,QAAQ;IACR,YAAY;IACZ,gBAAgB;GAClB;aAEA,kBAAC,GAAD;IACE,IAAI;KACF,IAAI;KACJ,IAAI;IACN;cAJF;KAME,kBAAC,GAAD;MAAY,SAAQ;MAAY,IAAI,EAAE,IAAI,IAAI;gBAAG;KAErC,CAAA;KACZ,kBAAC,GAAD;MAAY,SAAQ;MAAQ,IAAI,EAAE,IAAI,EAAE;gBAAG;KAG/B,CAAA;KACZ,kBAAC,GAAD;MAAY,SAAQ;MAAQ,IAAI,EAAE,IAAI,EAAE;gBAAG;KAE/B,CAAA;IACT;;EACF,CAAA;CAER,CAAA;AAEL"}

package/dist/components/Authentication/TwoFactorEnrollmentForm.js.map

@@ -1 +1 @@
-{"version":3,"file":"TwoFactorEnrollmentForm.js","names":[],"sources":["../../../src/components/Authentication/TwoFactorEnrollmentForm.tsx"],"sourcesContent":["import { StyledOuterContainer } from '@/components/styled/LeftRightPanel'\nimport { TOTP_CLOCK_SKEW_ERROR_APPENDAGE } from '@/components/Authentication/Constants'\nimport { useFinishTwoFactorEnrollment } from '@/synapse-queries/auth/useTwoFactorEnrollment'\nimport { StyledComponent } from '@emotion/styled'\nimport {\n  Box,\n  BoxProps,\n  Button,\n  Divider,\n  IconButton,\n  Link,\n  Paper,\n  Stack,\n  styled,\n  Typography,\n} from '@mui/material'\nimport { TotpSecret } from '@sage-bionetworks/synapse-types'\nimport * as qrcode from 'qrcode'\n// qrcode is CJS-only; use namespace import for Vite dev mode CJS interop.\nconst { toCanvas } = qrcode\nimport { useEffect, useRef, useState } from 'react'\nimport FullWidthAlert from '../FullWidthAlert/FullWidthAlert'\nimport IconSvg from '../IconSvg/IconSvg'\nimport { SynapseSpinner } from '../LoadingScreen/LoadingScreen'\nimport TextField from '../TextField/TextField'\nimport TwoFactorSecretDialog from './TwoFactorSecretDialog'\n\n/**\n * Returns a URL that can be used to generate a QR code that 2FA authenticator apps can interpret.\n * This uses the username fro TotpSecret to create the friendly name for the account in the authenticator app.\n * @param secret\n */\nfunction toOtpAuthUrl(secret: TotpSecret) {\n  return `otpauth://totp/Synapse:${secret.username}?secret=${secret.secret}&issuer=Sage%20Bionetworks&algorithm=${secret.alg}&digits=${secret.digits}&period=${secret.period}`\n}\n\nconst Section: StyledComponent<BoxProps> = styled(\n  (props: BoxProps) => (\n    <Box\n      sx={{\n        my: 3,\n        ...props.sx,\n      }}\n      {...props}\n    />\n  ),\n  {\n    label: 'Section',\n  },\n)(() => ({}))\n\nconst SectionInnerGrid = styled(Box, { label: 'SectionInnerGrid' })(\n  ({ theme }) => ({\n    display: 'grid',\n    gridTemplateColumns: 'auto 200px',\n    columnGap: theme.spacing(5),\n    [theme.breakpoints.down('sm')]: {\n      gridTemplateColumns: '1fr',\n      gap: '18px',\n    },\n  }),\n)\n\nexport const TWO_FACTOR_DOCS_LINK =\n  'https://help.synapse.org/docs/Managing-Your-Account.2055405596.html#Adding-Two-Factor-Authentication-(2FA)-to-your-account'\n\nexport type TwoFactorEnrollmentFormProps = {\n  totpSecret: TotpSecret\n  onTwoFactorEnrollmentSuccess: () => void\n  onBackClicked: () => void\n}\n\nexport default function TwoFactorEnrollmentForm(\n  props: TwoFactorEnrollmentFormProps,\n) {\n  const { onTwoFactorEnrollmentSuccess, onBackClicked, totpSecret } = props\n\n  const [totp, setTotp] = useState('')\n  const [hasQrCode, setHasQrCode] = useState(false)\n  const [showSecretInModal, setShowSecretInModal] = useState(false)\n  const qrCodeCanvasElement = useRef<HTMLCanvasElement>(null)\n\n  const {\n    mutate: finishEnrollment,\n    isPending: isFinishingEnrollment,\n    error,\n  } = useFinishTwoFactorEnrollment({\n    onSuccess: onTwoFactorEnrollmentSuccess,\n  })\n\n  useEffect(() => {\n    async function createQrCode() {\n      if (totpSecret && qrCodeCanvasElement.current) {\n        await toCanvas(qrCodeCanvasElement.current, toOtpAuthUrl(totpSecret), {\n          version: 10,\n          margin: 0,\n          scale: 3.5,\n        })\n        setHasQrCode(true)\n      }\n    }\n    void createQrCode()\n  }, [totpSecret])\n\n  return (\n    <StyledOuterContainer>\n      <Paper\n        sx={{\n          position: 'relative',\n          width: { xs: '100%', md: '800px' },\n          py: 6.5,\n          px: 8,\n          mx: 'auto',\n        }}\n      >\n        {onBackClicked && (\n          <IconButton\n            type=\"button\"\n            onClick={() => {\n              onBackClicked()\n            }}\n            sx={theme => ({\n              position: 'absolute',\n              top: theme.spacing(2),\n              left: theme.spacing(2),\n            })}\n          >\n            <IconSvg\n              icon=\"arrowBack\"\n              wrap={false}\n              sx={{ height: '24px', width: '24px' }}\n            />\n          </IconButton>\n        )}\n        <Section>\n          <Typography variant=\"headline2\" sx={{ mb: 3 }}>\n            Activate Two-factor Authentication\n          </Typography>\n          <Typography variant=\"body1\">\n            After setting up 2FA, you’ll use an authenticator app as part of\n            your login process, in addition to your existing password. If you\n            log in using your Google\n            {/* eslint-disable-next-line no-constant-binary-expression -- Remove conditionality when NIH RAS login is supported */}\n            {false && ', NIH RAS,'} or ORCiD account, you may need to use 2FA as\n            part of\n            {/*those processes*/}\n            that process as well.{' '}\n            <Link href={TWO_FACTOR_DOCS_LINK}>Learn more about 2FA</Link>.\n          </Typography>\n        </Section>\n        <Section>\n          <SectionInnerGrid>\n            <Box>\n              <Typography variant=\"body1\" sx={{ fontWeight: 700 }}>\n                Step 1. Get one of these apps\n              </Typography>\n              <Typography variant=\"body1\">\n                Download and install one of these authentication apps to set up\n                2FA on your mobile device, tablet, or desktop. If you have one\n                of these apps already installed, you can skip this step.\n              </Typography>\n            </Box>\n            <Stack\n              sx={theme => ({\n                justifyContent: 'space-between',\n                flexShrink: 0,\n                [theme.breakpoints.down('sm')]: {\n                  gap: '20px',\n                },\n              })}\n            >\n              <Link href={'https://authy.com/download/'}>Authy</Link>\n              <Link\n                href={\n                  'https://duo.com/product/multi-factor-authentication-mfa/duo-mobile-app'\n                }\n              >\n                DUO Mobile\n              </Link>\n              <Link href={'https://googleauthenticator.net/'}>\n                Google Authenticator\n              </Link>\n              <Link\n                href={\n                  'https://www.microsoft.com/en-us/security/mobile-authenticator-app'\n                }\n              >\n                Microsoft Authenticator\n              </Link>\n            </Stack>\n          </SectionInnerGrid>\n        </Section>\n        <Divider />\n        <Section>\n          <SectionInnerGrid>\n            <Box>\n              <Typography variant=\"body1\" sx={{ fontWeight: 700 }}>\n                Step 2. Scan the QR Code\n              </Typography>\n              <Typography component=\"ol\" variant=\"body1\" sx={{ pl: 2, my: 1 }}>\n                <li>Open your authenticator app</li>\n                <li>Tap the &quot;+&quot; button</li>\n                <li>Use your camera to scan the image to the right</li>\n              </Typography>\n              <Link\n                onClick={() => {\n                  setShowSecretInModal(true)\n                }}\n              >\n                Can&apos;t use your camera?\n              </Link>\n              <TwoFactorSecretDialog\n                secret={totpSecret?.secret ?? ''}\n                open={showSecretInModal}\n                onClose={() => setShowSecretInModal(false)}\n              />\n            </Box>\n            <Box\n              sx={{\n                display: 'flex',\n                justifyContent: 'center',\n                alignItems: 'middle',\n                height: 'auto',\n              }}\n            >\n              {!hasQrCode && <SynapseSpinner size={50} />}\n              <canvas\n                style={{ display: hasQrCode ? undefined : 'none' }}\n                ref={qrCodeCanvasElement}\n              />\n            </Box>\n          </SectionInnerGrid>\n        </Section>\n        <Divider />\n        <Section>\n          <SectionInnerGrid>\n            <Box>\n              <Typography variant=\"body1\" sx={{ fontWeight: 700 }}>\n                Step 3. Enter the Verification Code\n              </Typography>\n              <Typography variant=\"body1\">\n                After scanning in the QR code in step 2, your app will provide a\n                6-digit code. Enter it in in the field to the right.\n              </Typography>\n            </Box>\n            <form\n              onSubmit={e => {\n                e.preventDefault()\n                finishEnrollment({\n                  secretId: totpSecret.secretId,\n                  totp,\n                })\n              }}\n            >\n              <Stack\n                direction={'row'}\n                sx={{\n                  gap: 2,\n                  height: '48px',\n                }}\n              >\n                <TextField\n                  autoFocus\n                  slotProps={{ htmlInput: { maxLength: totpSecret?.digits } }}\n                  value={totp}\n                  onChange={e => {\n                    setTotp(e.target.value)\n                  }}\n                />\n                <Button\n                  type={'submit'}\n                  variant={'contained'}\n                  sx={{ flexShrink: 0 }}\n                  disabled={\n                    isFinishingEnrollment || totp.length != totpSecret?.digits\n                  }\n                >\n                  Activate\n                </Button>\n              </Stack>\n            </form>\n          </SectionInnerGrid>\n        </Section>\n        {error && (\n          <FullWidthAlert\n            variant={'danger'}\n            isGlobal={false}\n            description={\n              error.reason.toLowerCase().includes('invalid totp code')\n                ? `${error.reason}. ${TOTP_CLOCK_SKEW_ERROR_APPENDAGE}`\n                : error.reason\n            }\n          />\n        )}\n      </Paper>\n    </StyledOuterContainer>\n  )\n}\n\nexport const EXPORTED_FOR_UNIT_TESTING = { toOtpAuthUrl }\n"],"mappings":"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"}
+{"version":3,"file":"TwoFactorEnrollmentForm.js","names":[],"sources":["../../../src/components/Authentication/TwoFactorEnrollmentForm.tsx"],"sourcesContent":["import { StyledOuterContainer } from '@/components/styled/LeftRightPanel'\nimport { TOTP_CLOCK_SKEW_ERROR_APPENDAGE } from '@/components/Authentication/Constants'\nimport { useFinishTwoFactorEnrollment } from '@/synapse-queries/auth/useTwoFactorEnrollment'\nimport { StyledComponent } from '@emotion/styled'\nimport {\n  Box,\n  BoxProps,\n  Button,\n  Divider,\n  IconButton,\n  Link,\n  Paper,\n  Stack,\n  styled,\n  Typography,\n} from '@mui/material'\nimport { TotpSecret } from '@sage-bionetworks/synapse-types'\nimport * as qrcode from 'qrcode'\n// qrcode is CJS-only; use namespace import for Vite dev mode CJS interop.\nconst { toCanvas } = qrcode\nimport { useEffect, useRef, useState } from 'react'\nimport FullWidthAlert from '../FullWidthAlert/FullWidthAlert'\nimport IconSvg from '../IconSvg/IconSvg'\nimport { SynapseSpinner } from '../LoadingScreen/LoadingScreen'\nimport TextField from '../TextField/TextField'\nimport TwoFactorSecretDialog from './TwoFactorSecretDialog'\n\n/**\n * Returns a URL that can be used to generate a QR code that 2FA authenticator apps can interpret.\n * This uses the username fro TotpSecret to create the friendly name for the account in the authenticator app.\n * @param secret\n */\nfunction toOtpAuthUrl(secret: TotpSecret) {\n  return `otpauth://totp/Synapse:${secret.username}?secret=${secret.secret}&issuer=Sage%20Bionetworks&algorithm=${secret.alg}&digits=${secret.digits}&period=${secret.period}`\n}\n\nconst Section: StyledComponent<BoxProps> = styled(\n  (props: BoxProps) => (\n    <Box\n      sx={{\n        my: 3,\n        ...props.sx,\n      }}\n      {...props}\n    />\n  ),\n  {\n    label: 'Section',\n  },\n)(() => ({}))\n\nconst SectionInnerGrid = styled(Box, { label: 'SectionInnerGrid' })(\n  ({ theme }) => ({\n    display: 'grid',\n    gridTemplateColumns: 'auto 200px',\n    columnGap: theme.spacing(5),\n    [theme.breakpoints.down('sm')]: {\n      gridTemplateColumns: '1fr',\n      gap: '18px',\n    },\n  }),\n)\n\nexport const TWO_FACTOR_DOCS_LINK =\n  'https://help.synapse.org/docs/Managing-Your-Account.2055405596.html#Adding-Two-Factor-Authentication-(2FA)-to-your-account'\n\nexport type TwoFactorEnrollmentFormProps = {\n  totpSecret: TotpSecret\n  onTwoFactorEnrollmentSuccess: () => void\n  onBackClicked: () => void\n}\n\nexport default function TwoFactorEnrollmentForm(\n  props: TwoFactorEnrollmentFormProps,\n) {\n  const { onTwoFactorEnrollmentSuccess, onBackClicked, totpSecret } = props\n\n  const [totp, setTotp] = useState('')\n  const [hasQrCode, setHasQrCode] = useState(false)\n  const [showSecretInModal, setShowSecretInModal] = useState(false)\n  const qrCodeCanvasElement = useRef<HTMLCanvasElement>(null)\n\n  const {\n    mutate: finishEnrollment,\n    isPending: isFinishingEnrollment,\n    error,\n  } = useFinishTwoFactorEnrollment({\n    onSuccess: onTwoFactorEnrollmentSuccess,\n  })\n\n  useEffect(() => {\n    async function createQrCode() {\n      if (totpSecret && qrCodeCanvasElement.current) {\n        await toCanvas(qrCodeCanvasElement.current, toOtpAuthUrl(totpSecret), {\n          version: 10,\n          margin: 0,\n          scale: 3.5,\n        })\n        setHasQrCode(true)\n      }\n    }\n    void createQrCode()\n  }, [totpSecret])\n\n  return (\n    <StyledOuterContainer>\n      <Paper\n        sx={{\n          position: 'relative',\n          width: { xs: '100%', md: '800px' },\n          py: 6.5,\n          px: 8,\n          mx: 'auto',\n        }}\n      >\n        {onBackClicked && (\n          <IconButton\n            type=\"button\"\n            onClick={() => {\n              onBackClicked()\n            }}\n            sx={theme => ({\n              position: 'absolute',\n              top: theme.spacing(2),\n              left: theme.spacing(2),\n            })}\n          >\n            <IconSvg\n              icon=\"arrowBack\"\n              wrap={false}\n              sx={{ height: '24px', width: '24px' }}\n            />\n          </IconButton>\n        )}\n        <Section>\n          <Typography variant=\"headline2\" sx={{ mb: 3 }}>\n            Activate Two-factor Authentication\n          </Typography>\n          <Typography variant=\"body1\">\n            After setting up 2FA, you’ll use an authenticator app as part of\n            your login process, in addition to your existing password. If you\n            log in using your Google\n            {/* eslint-disable-next-line no-constant-binary-expression -- Remove conditionality when NIH RAS login is supported */}\n            {false && ', NIH RAS,'} or ORCiD account, you may need to use 2FA as\n            part of\n            {/*those processes*/}\n            that process as well.{' '}\n            <Link href={TWO_FACTOR_DOCS_LINK}>Learn more about 2FA</Link>.\n          </Typography>\n        </Section>\n        <Section>\n          <SectionInnerGrid>\n            <Box>\n              <Typography variant=\"body1\" sx={{ fontWeight: 700 }}>\n                Step 1. Get one of these apps\n              </Typography>\n              <Typography variant=\"body1\">\n                Download and install one of these authentication apps to set up\n                2FA on your mobile device, tablet, or desktop. If you have one\n                of these apps already installed, you can skip this step.\n              </Typography>\n            </Box>\n            <Stack\n              sx={theme => ({\n                justifyContent: 'space-between',\n                flexShrink: 0,\n                [theme.breakpoints.down('sm')]: {\n                  gap: '20px',\n                },\n              })}\n            >\n              <Link href={'https://authy.com/download/'}>Authy</Link>\n              <Link\n                href={\n                  'https://duo.com/product/multi-factor-authentication-mfa/duo-mobile-app'\n                }\n              >\n                DUO Mobile\n              </Link>\n              <Link href={'https://googleauthenticator.net/'}>\n                Google Authenticator\n              </Link>\n              <Link\n                href={\n                  'https://www.microsoft.com/en-us/security/mobile-authenticator-app'\n                }\n              >\n                Microsoft Authenticator\n              </Link>\n            </Stack>\n          </SectionInnerGrid>\n        </Section>\n        <Divider />\n        <Section>\n          <SectionInnerGrid>\n            <Box>\n              <Typography variant=\"body1\" sx={{ fontWeight: 700 }}>\n                Step 2. Scan the QR Code\n              </Typography>\n              <Typography component=\"ol\" variant=\"body1\" sx={{ pl: 2, my: 1 }}>\n                <li>Open your authenticator app</li>\n                <li>Tap the &quot;+&quot; button</li>\n                <li>Use your camera to scan the image to the right</li>\n              </Typography>\n              <Link\n                onClick={() => {\n                  setShowSecretInModal(true)\n                }}\n              >\n                Can&apos;t use your camera?\n              </Link>\n              <TwoFactorSecretDialog\n                secret={totpSecret?.secret ?? ''}\n                open={showSecretInModal}\n                onClose={() => setShowSecretInModal(false)}\n              />\n            </Box>\n            <Box\n              sx={{\n                display: 'flex',\n                justifyContent: 'center',\n                alignItems: 'middle',\n                height: 'auto',\n              }}\n            >\n              {!hasQrCode && <SynapseSpinner size={50} />}\n              <canvas\n                style={{ display: hasQrCode ? undefined : 'none' }}\n                ref={qrCodeCanvasElement}\n              />\n            </Box>\n          </SectionInnerGrid>\n        </Section>\n        <Divider />\n        <Section>\n          <SectionInnerGrid>\n            <Box>\n              <Typography variant=\"body1\" sx={{ fontWeight: 700 }}>\n                Step 3. Enter the Verification Code\n              </Typography>\n              <Typography variant=\"body1\">\n                After scanning in the QR code in step 2, your app will provide a\n                6-digit code. Enter it in in the field to the right.\n              </Typography>\n            </Box>\n            <form\n              onSubmit={e => {\n                e.preventDefault()\n                finishEnrollment({\n                  secretId: totpSecret.secretId,\n                  totp,\n                })\n              }}\n            >\n              <Stack\n                direction={'row'}\n                sx={{\n                  gap: 2,\n                  height: '48px',\n                }}\n              >\n                <TextField\n                  autoFocus\n                  slotProps={{ htmlInput: { maxLength: totpSecret?.digits } }}\n                  value={totp}\n                  onChange={e => {\n                    setTotp(e.target.value)\n                  }}\n                />\n                <Button\n                  type={'submit'}\n                  variant={'contained'}\n                  sx={{ flexShrink: 0 }}\n                  disabled={\n                    isFinishingEnrollment || totp.length != totpSecret?.digits\n                  }\n                >\n                  Activate\n                </Button>\n              </Stack>\n            </form>\n          </SectionInnerGrid>\n        </Section>\n        {error && (\n          <FullWidthAlert\n            variant={'danger'}\n            isGlobal={false}\n            description={\n              error.reason.toLowerCase().includes('invalid totp code')\n                ? `${error.reason}. ${TOTP_CLOCK_SKEW_ERROR_APPENDAGE}`\n                : error.reason\n            }\n          />\n        )}\n      </Paper>\n    </StyledOuterContainer>\n  )\n}\n\nexport const EXPORTED_FOR_UNIT_TESTING = { toOtpAuthUrl }\n"],"mappings":"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"}

package/dist/components/Authentication/TwoFactorSecretDialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"TwoFactorSecretDialog.js","names":[],"sources":["../../../src/components/Authentication/TwoFactorSecretDialog.tsx"],"sourcesContent":["import { monospaceFontFamily } from '@/theme/typography/Typography'\nimport {\n  Box,\n  Button,\n  Dialog,\n  DialogActions,\n  DialogContent,\n  DialogTitle,\n  IconButton,\n  Stack,\n  Typography,\n} from '@mui/material'\nimport IconSvg from '../IconSvg/IconSvg'\n\ntype TwoFactorSecretDialogProps = {\n  secret: string\n  open: boolean\n  onClose: () => void\n}\n\nexport default function TwoFactorSecretDialog(\n  props: TwoFactorSecretDialogProps,\n) {\n  const { secret, open, onClose } = props\n  return (\n    <Dialog open={open} onClose={onClose}>\n      <DialogTitle>\n        <Stack\n          direction=\"row\"\n          sx={{\n            alignItems: 'center',\n            gap: '5px',\n          }}\n        >\n          Use this code to set up 2FA <Box sx={{ flexGrow: 1 }} />\n          <IconButton aria-label={'Close'} onClick={onClose}>\n            <IconSvg icon={'close'} wrap={false} sx={{ color: 'grey.700' }} />\n          </IconButton>\n        </Stack>\n      </DialogTitle>\n      <DialogContent>\n        <Typography variant={'body1'}>\n          Your authenticator app will ask for a code to activate two-factor\n          authentication. Use the code below:\n        </Typography>\n        <Box\n          sx={theme => ({\n            my: 2,\n            p: 2,\n            width: '100%',\n            textAlign: 'center',\n            background: theme.palette.grey[200],\n            fontFamily: monospaceFontFamily,\n            letterSpacing: '2px',\n            fontSize: '16px',\n          })}\n        >\n          {secret}\n        </Box>\n        <Typography variant={'body1'}>\n          After setup, you don’t need to save this code.\n        </Typography>\n      </DialogContent>\n      <DialogActions>\n        <Button variant={'contained'} onClick={onClose}>\n          Done\n        </Button>\n      </DialogActions>\n    </Dialog>\n  )\n}\n"],"mappings":";;;;;AAoBA,SAAwB,EACtB,GACA;CACA,IAAM,EAAE,WAAQ,SAAM,eAAY;AAClC,QACE,kBAAC,GAAD;EAAc;EAAe;YAA7B;GACE,kBAAC,GAAD,EAAA,UACE,kBAAC,GAAD;IACE,WAAU;IACV,IAAI;KACF,YAAY;KACZ,KAAK;KACN;cALH;KAMC;KAC6B,kBAAC,GAAD,EAAK,IAAI,EAAE,UAAU,GAAG,EAAI,CAAA;KACxD,kBAAC,GAAD;MAAY,cAAY;MAAS,SAAS;gBACxC,kBAAC,GAAD;OAAS,MAAM;OAAS,MAAM;OAAO,IAAI,EAAE,OAAO,YAAY;OAAI,CAAA;MACvD,CAAA;KACP;OACI,CAAA;GACd,kBAAC,GAAD,EAAA,UAAA;IACE,kBAAC,GAAD;KAAY,SAAS;eAAS;KAGjB,CAAA;IACb,kBAAC,GAAD;KACE,KAAI,OAAU;MACZ,IAAI;MACJ,GAAG;MACH,OAAO;MACP,WAAW;MACX,YAAY,EAAM,QAAQ,KAAK;MAC/B,YAAY;MACZ,eAAe;MACf,UAAU;MACX;eAEA;KACG,CAAA;IACN,kBAAC,GAAD;KAAY,SAAS;eAAS;KAEjB,CAAA;IACC,EAAA,CAAA;GAChB,kBAAC,GAAD,EAAA,UACE,kBAAC,GAAD;IAAQ,SAAS;IAAa,SAAS;cAAS;IAEvC,CAAA,EACK,CAAA;GACT"}
+{"version":3,"file":"TwoFactorSecretDialog.js","names":[],"sources":["../../../src/components/Authentication/TwoFactorSecretDialog.tsx"],"sourcesContent":["import { monospaceFontFamily } from '@/theme/typography/Typography'\nimport {\n  Box,\n  Button,\n  Dialog,\n  DialogActions,\n  DialogContent,\n  DialogTitle,\n  IconButton,\n  Stack,\n  Typography,\n} from '@mui/material'\nimport IconSvg from '../IconSvg/IconSvg'\n\ntype TwoFactorSecretDialogProps = {\n  secret: string\n  open: boolean\n  onClose: () => void\n}\n\nexport default function TwoFactorSecretDialog(\n  props: TwoFactorSecretDialogProps,\n) {\n  const { secret, open, onClose } = props\n  return (\n    <Dialog open={open} onClose={onClose}>\n      <DialogTitle>\n        <Stack\n          direction=\"row\"\n          sx={{\n            alignItems: 'center',\n            gap: '5px',\n          }}\n        >\n          Use this code to set up 2FA <Box sx={{ flexGrow: 1 }} />\n          <IconButton aria-label={'Close'} onClick={onClose}>\n            <IconSvg icon={'close'} wrap={false} sx={{ color: 'grey.700' }} />\n          </IconButton>\n        </Stack>\n      </DialogTitle>\n      <DialogContent>\n        <Typography variant={'body1'}>\n          Your authenticator app will ask for a code to activate two-factor\n          authentication. Use the code below:\n        </Typography>\n        <Box\n          sx={theme => ({\n            my: 2,\n            p: 2,\n            width: '100%',\n            textAlign: 'center',\n            background: theme.palette.grey[200],\n            fontFamily: monospaceFontFamily,\n            letterSpacing: '2px',\n            fontSize: '16px',\n          })}\n        >\n          {secret}\n        </Box>\n        <Typography variant={'body1'}>\n          After setup, you don’t need to save this code.\n        </Typography>\n      </DialogContent>\n      <DialogActions>\n        <Button variant={'contained'} onClick={onClose}>\n          Done\n        </Button>\n      </DialogActions>\n    </Dialog>\n  )\n}\n"],"mappings":";;;;;AAoBA,SAAwB,EACtB,GACA;CACA,IAAM,EAAE,WAAQ,SAAM,eAAY;CAClC,OACE,kBAAC,GAAD;EAAc;EAAe;YAA7B;GACE,kBAAC,GAAD,EAAA,UACE,kBAAC,GAAD;IACE,WAAU;IACV,IAAI;KACF,YAAY;KACZ,KAAK;IACP;cALF;KAMC;KAC6B,kBAAC,GAAD,EAAK,IAAI,EAAE,UAAU,EAAE,EAAI,CAAA;KACvD,kBAAC,GAAD;MAAY,cAAY;MAAS,SAAS;gBACxC,kBAAC,GAAD;OAAS,MAAM;OAAS,MAAM;OAAO,IAAI,EAAE,OAAO,WAAW;MAAI,CAAA;KACvD,CAAA;IACP;MACI,CAAA;GACb,kBAAC,GAAD,EAAA,UAAA;IACE,kBAAC,GAAD;KAAY,SAAS;eAAS;IAGlB,CAAA;IACZ,kBAAC,GAAD;KACE,KAAI,OAAU;MACZ,IAAI;MACJ,GAAG;MACH,OAAO;MACP,WAAW;MACX,YAAY,EAAM,QAAQ,KAAK;MAC/B,YAAY;MACZ,eAAe;MACf,UAAU;KACZ;eAEC;IACE,CAAA;IACL,kBAAC,GAAD;KAAY,SAAS;eAAS;IAElB,CAAA;GACC,EAAA,CAAA;GACf,kBAAC,GAAD,EAAA,UACE,kBAAC,GAAD;IAAQ,SAAS;IAAa,SAAS;cAAS;GAExC,CAAA,EACK,CAAA;EACT;;AAEZ"}

package/dist/components/Authentication/UsernamePasswordForm.js.map

@@ -1 +1 @@
-{"version":3,"file":"UsernamePasswordForm.js","names":[],"sources":["../../../src/components/Authentication/UsernamePasswordForm.tsx"],"sourcesContent":["import { UseLoginReturn } from '@/utils/hooks'\nimport { useOneSageURL } from '@/utils/hooks/useOneSageURL'\nimport { Button, Link, Stack } from '@mui/material'\nimport { SyntheticEvent, useState } from 'react'\nimport TextField from '../TextField/TextField'\nimport PasswordField from './PasswordField'\n\ntype UsernamePasswordFormProps = {\n  onSubmit: (username: string, password: string) => void\n  resetPasswordUrl?: string\n  loginIsPending: UseLoginReturn['loginIsPending']\n  hideForgotPasswordButton?: boolean\n}\n\nexport default function UsernamePasswordForm(props: UsernamePasswordFormProps) {\n  const defaultResetPasswordUrl = useOneSageURL('/resetPassword')\n  const {\n    resetPasswordUrl = defaultResetPasswordUrl.toString(),\n    onSubmit,\n    loginIsPending,\n    hideForgotPasswordButton,\n  } = props\n  const [username, setUsername] = useState('')\n  const [password, setPassword] = useState('')\n\n  function handleLogin(e: SyntheticEvent) {\n    e.preventDefault()\n    onSubmit(username, password)\n  }\n  return (\n    <form\n      onSubmit={e => {\n        handleLogin(e)\n      }}\n    >\n      <Stack gap={2} sx={{ mb: 1 }}>\n        <TextField\n          required\n          fullWidth\n          autoFocus\n          autoComplete=\"username\"\n          label=\"Username or Email Address\"\n          id=\"username\"\n          type=\"text\"\n          value={username}\n          onChange={e => setUsername(e.target.value)}\n        />\n        <PasswordField\n          value={password}\n          onChange={e => setPassword(e.target.value)}\n        />\n      </Stack>\n      {!hideForgotPasswordButton && (\n        <Link\n          href={resetPasswordUrl}\n          target={\n            // If not on OneSage, open in new tab\n            resetPasswordUrl.startsWith('/') ? undefined : '_blank'\n          }\n        >\n          Forgot password?\n        </Link>\n      )}\n      <Button\n        fullWidth\n        type=\"submit\"\n        color=\"primary\"\n        variant=\"contained\"\n        disabled={loginIsPending}\n        sx={{\n          height: '50px',\n          mt: 4,\n          mb: 2,\n        }}\n      >\n        {loginIsPending ? 'Logging you in...' : 'Sign in'}\n      </Button>\n    </form>\n  )\n}\n"],"mappings":";;;;;;;AAcA,SAAwB,EAAqB,GAAkC;CAC7E,IAAM,IAA0B,EAAc,iBAAiB,EACzD,EACJ,sBAAmB,EAAwB,UAAU,EACrD,aACA,mBACA,gCACE,GACE,CAAC,GAAU,KAAe,EAAS,GAAG,EACtC,CAAC,GAAU,KAAe,EAAS,GAAG;CAE5C,SAAS,EAAY,GAAmB;AAEtC,EADA,EAAE,gBAAgB,EAClB,EAAS,GAAU,EAAS;;AAE9B,QACE,kBAAC,QAAD;EACE,WAAU,MAAK;AACb,KAAY,EAAE;;YAFlB;GAKE,kBAAC,GAAD;IAAO,KAAK;IAAG,IAAI,EAAE,IAAI,GAAG;cAA5B,CACE,kBAAC,GAAD;KACE,UAAA;KACA,WAAA;KACA,WAAA;KACA,cAAa;KACb,OAAM;KACN,IAAG;KACH,MAAK;KACL,OAAO;KACP,WAAU,MAAK,EAAY,EAAE,OAAO,MAAM;KAC1C,CAAA,EACF,kBAAC,GAAD;KACE,OAAO;KACP,WAAU,MAAK,EAAY,EAAE,OAAO,MAAM;KAC1C,CAAA,CACI;;GACP,CAAC,KACA,kBAAC,GAAD;IACE,MAAM;IACN,QAEE,EAAiB,WAAW,IAAI,GAAG,KAAA,IAAY;cAElD;IAEM,CAAA;GAET,kBAAC,GAAD;IACE,WAAA;IACA,MAAK;IACL,OAAM;IACN,SAAQ;IACR,UAAU;IACV,IAAI;KACF,QAAQ;KACR,IAAI;KACJ,IAAI;KACL;cAEA,IAAiB,sBAAsB;IACjC,CAAA;GACJ"}
+{"version":3,"file":"UsernamePasswordForm.js","names":[],"sources":["../../../src/components/Authentication/UsernamePasswordForm.tsx"],"sourcesContent":["import { UseLoginReturn } from '@/utils/hooks'\nimport { useOneSageURL } from '@/utils/hooks/useOneSageURL'\nimport { Button, Link, Stack } from '@mui/material'\nimport { SyntheticEvent, useState } from 'react'\nimport TextField from '../TextField/TextField'\nimport PasswordField from './PasswordField'\n\ntype UsernamePasswordFormProps = {\n  onSubmit: (username: string, password: string) => void\n  resetPasswordUrl?: string\n  loginIsPending: UseLoginReturn['loginIsPending']\n  hideForgotPasswordButton?: boolean\n}\n\nexport default function UsernamePasswordForm(props: UsernamePasswordFormProps) {\n  const defaultResetPasswordUrl = useOneSageURL('/resetPassword')\n  const {\n    resetPasswordUrl = defaultResetPasswordUrl.toString(),\n    onSubmit,\n    loginIsPending,\n    hideForgotPasswordButton,\n  } = props\n  const [username, setUsername] = useState('')\n  const [password, setPassword] = useState('')\n\n  function handleLogin(e: SyntheticEvent) {\n    e.preventDefault()\n    onSubmit(username, password)\n  }\n  return (\n    <form\n      onSubmit={e => {\n        handleLogin(e)\n      }}\n    >\n      <Stack gap={2} sx={{ mb: 1 }}>\n        <TextField\n          required\n          fullWidth\n          autoFocus\n          autoComplete=\"username\"\n          label=\"Username or Email Address\"\n          id=\"username\"\n          type=\"text\"\n          value={username}\n          onChange={e => setUsername(e.target.value)}\n        />\n        <PasswordField\n          value={password}\n          onChange={e => setPassword(e.target.value)}\n        />\n      </Stack>\n      {!hideForgotPasswordButton && (\n        <Link\n          href={resetPasswordUrl}\n          target={\n            // If not on OneSage, open in new tab\n            resetPasswordUrl.startsWith('/') ? undefined : '_blank'\n          }\n        >\n          Forgot password?\n        </Link>\n      )}\n      <Button\n        fullWidth\n        type=\"submit\"\n        color=\"primary\"\n        variant=\"contained\"\n        disabled={loginIsPending}\n        sx={{\n          height: '50px',\n          mt: 4,\n          mb: 2,\n        }}\n      >\n        {loginIsPending ? 'Logging you in...' : 'Sign in'}\n      </Button>\n    </form>\n  )\n}\n"],"mappings":";;;;;;;AAcA,SAAwB,EAAqB,GAAkC;CAC7E,IAAM,IAA0B,EAAc,gBAAgB,GACxD,EACJ,sBAAmB,EAAwB,SAAS,GACpD,aACA,mBACA,gCACE,GACE,CAAC,GAAU,KAAe,EAAS,EAAE,GACrC,CAAC,GAAU,KAAe,EAAS,EAAE;CAE3C,SAAS,EAAY,GAAmB;EAEtC,AADA,EAAE,eAAe,GACjB,EAAS,GAAU,CAAQ;CAC7B;CACA,OACE,kBAAC,QAAD;EACE,WAAU,MAAK;GACb,EAAY,CAAC;EACf;YAHF;GAKE,kBAAC,GAAD;IAAO,KAAK;IAAG,IAAI,EAAE,IAAI,EAAE;cAA3B,CACE,kBAAC,GAAD;KACE,UAAA;KACA,WAAA;KACA,WAAA;KACA,cAAa;KACb,OAAM;KACN,IAAG;KACH,MAAK;KACL,OAAO;KACP,WAAU,MAAK,EAAY,EAAE,OAAO,KAAK;IAC1C,CAAA,GACD,kBAAC,GAAD;KACE,OAAO;KACP,WAAU,MAAK,EAAY,EAAE,OAAO,KAAK;IAC1C,CAAA,CACI;;GACN,CAAC,KACA,kBAAC,GAAD;IACE,MAAM;IACN,QAEE,EAAiB,WAAW,GAAG,IAAI,KAAA,IAAY;cAElD;GAEK,CAAA;GAER,kBAAC,GAAD;IACE,WAAA;IACA,MAAK;IACL,OAAM;IACN,SAAQ;IACR,UAAU;IACV,IAAI;KACF,QAAQ;KACR,IAAI;KACJ,IAAI;IACN;cAEC,IAAiB,sBAAsB;GAClC,CAAA;EACJ;;AAEV"}

package/dist/components/BasePortalCard/BasePortalCard.js.map

@@ -1 +1 @@
-{"version":3,"file":"BasePortalCard.js","names":[],"sources":["../../../src/components/BasePortalCard/BasePortalCard.tsx"],"sourcesContent":["import { Card, CardContent, CardMedia, Stack } from '@mui/material'\nimport Box from '@mui/material/Box'\nimport React, { ReactNode } from 'react'\nimport styles from './BasePortalCard.module.scss'\n\ntype BasePortalCardProps = {\n  children?: ReactNode\n  contentBelowCard?: ReactNode\n  borderRadiusPx?: number\n  boxShadow?: string\n  cardSize?: 'small' | 'medium' | 'large'\n  backgroundImage?: string | ReactNode\n  backgroundColor?: string\n  className?: string\n}\n\nconst BasePortalCard = ({\n  borderRadiusPx,\n  boxShadow,\n  children,\n  contentBelowCard,\n  cardSize = 'medium',\n  className,\n  backgroundImage,\n  backgroundColor,\n}: BasePortalCardProps): React.ReactNode => (\n  <Stack>\n    <Card\n      className={`${className} ${styles.BasePortalCard__root} ${styles[cardSize]}`}\n      sx={{\n        backgroundColor: backgroundColor,\n        borderRadius: borderRadiusPx,\n        boxShadow: boxShadow,\n      }}\n    >\n      <Box className={styles.BasePortalCard__media}>\n        {typeof backgroundImage === 'string' ? (\n          <CardMedia image={backgroundImage} component=\"img\" />\n        ) : (\n          backgroundImage\n        )}\n      </Box>\n      <CardContent className={styles.BasePortalCard__content}>\n        {children}\n      </CardContent>\n    </Card>\n    {contentBelowCard && (\n      <Box className={styles.BasePortalCard__contentBelow}>\n        {contentBelowCard}\n      </Box>\n    )}\n  </Stack>\n)\n\nexport default BasePortalCard\n"],"mappings":";;;;;;AAgBA,IAAM,KAAkB,EACtB,mBACA,cACA,aACA,qBACA,cAAW,UACX,cACA,oBACA,yBAEA,kBAAC,GAAD,EAAA,UAAA,CACE,kBAAC,GAAD;CACE,WAAW,GAAG,EAAU,GAAG,EAAO,qBAAqB,GAAG,EAAO;CACjE,IAAI;EACe;EACjB,cAAc;EACH;EACZ;WANH,CAQE,kBAAC,GAAD;EAAK,WAAW,EAAO;YACpB,OAAO,KAAoB,WAC1B,kBAAC,GAAD;GAAW,OAAO;GAAiB,WAAU;GAAQ,CAAA,GAErD;EAEE,CAAA,EACN,kBAAC,GAAD;EAAa,WAAW,EAAO;EAC5B;EACW,CAAA,CACT;IACN,KACC,kBAAC,GAAD;CAAK,WAAW,EAAO;WACpB;CACG,CAAA,CAEF,EAAA,CAAA"}
+{"version":3,"file":"BasePortalCard.js","names":[],"sources":["../../../src/components/BasePortalCard/BasePortalCard.tsx"],"sourcesContent":["import { Card, CardContent, CardMedia, Stack } from '@mui/material'\nimport Box from '@mui/material/Box'\nimport React, { ReactNode } from 'react'\nimport styles from './BasePortalCard.module.scss'\n\ntype BasePortalCardProps = {\n  children?: ReactNode\n  contentBelowCard?: ReactNode\n  borderRadiusPx?: number\n  boxShadow?: string\n  cardSize?: 'small' | 'medium' | 'large'\n  backgroundImage?: string | ReactNode\n  backgroundColor?: string\n  className?: string\n}\n\nconst BasePortalCard = ({\n  borderRadiusPx,\n  boxShadow,\n  children,\n  contentBelowCard,\n  cardSize = 'medium',\n  className,\n  backgroundImage,\n  backgroundColor,\n}: BasePortalCardProps): React.ReactNode => (\n  <Stack>\n    <Card\n      className={`${className} ${styles.BasePortalCard__root} ${styles[cardSize]}`}\n      sx={{\n        backgroundColor: backgroundColor,\n        borderRadius: borderRadiusPx,\n        boxShadow: boxShadow,\n      }}\n    >\n      <Box className={styles.BasePortalCard__media}>\n        {typeof backgroundImage === 'string' ? (\n          <CardMedia image={backgroundImage} component=\"img\" />\n        ) : (\n          backgroundImage\n        )}\n      </Box>\n      <CardContent className={styles.BasePortalCard__content}>\n        {children}\n      </CardContent>\n    </Card>\n    {contentBelowCard && (\n      <Box className={styles.BasePortalCard__contentBelow}>\n        {contentBelowCard}\n      </Box>\n    )}\n  </Stack>\n)\n\nexport default BasePortalCard\n"],"mappings":";;;;;;AAgBA,IAAM,KAAkB,EACtB,mBACA,cACA,aACA,qBACA,cAAW,UACX,cACA,oBACA,yBAEA,kBAAC,GAAD,EAAA,UAAA,CACE,kBAAC,GAAD;CACE,WAAW,GAAG,EAAU,GAAG,EAAO,qBAAqB,GAAG,EAAO;CACjE,IAAI;EACe;EACjB,cAAc;EACH;CACb;WANF,CAQE,kBAAC,GAAD;EAAK,WAAW,EAAO;YACpB,OAAO,KAAoB,WAC1B,kBAAC,GAAD;GAAW,OAAO;GAAiB,WAAU;EAAO,CAAA,IAEpD;CAEC,CAAA,GACL,kBAAC,GAAD;EAAa,WAAW,EAAO;EAC5B;CACU,CAAA,CACT;IACL,KACC,kBAAC,GAAD;CAAK,WAAW,EAAO;WACpB;AACE,CAAA,CAEF,EAAA,CAAA"}

package/dist/components/BasePortalCard/ColorfulPortalCardWithChips/ColorfulPortalCardWithChips.js.map

@@ -1 +1 @@
-{"version":3,"file":"ColorfulPortalCardWithChips.js","names":[],"sources":["../../../../src/components/BasePortalCard/ColorfulPortalCardWithChips/ColorfulPortalCardWithChips.tsx"],"sourcesContent":["import { ReactComponent as DefaultBackground } from '@/assets/DefaultColorfulPortalCardBackground.svg'\nimport MarkdownSynapse from '@/components/Markdown/MarkdownSynapse'\nimport { hashCode } from '@/utils/functions/StringUtils'\nimport { useImageUrl } from '@/utils/hooks/useImageUrlUtils'\nimport ArrowForwardIcon from '@mui/icons-material/ArrowForward'\nimport { Box, Button, Chip, Stack, Typography } from '@mui/material'\nimport React from 'react'\nimport BasePortalCard from '../BasePortalCard'\nimport styles from './ColorfulPortalCardWithChips.module.scss'\n\ntype ColorfulPortalCardWithChipsProps = {\n  title?: string\n  subtitle?: string\n  description?: string\n  descriptionTitle?: string\n  learnMoreLink?: string\n  buttonOverrideText?: string\n  chips?: string[]\n  backgroundImage?: string\n  backgroundColor?: string\n  tag?: string\n  entityId?: string\n  borderRadiusPx?: number\n  cardSize?: 'small' | 'medium' | 'large'\n}\n\nconst colors = ['#F8CC7D', '#BFE8F4', '#CEFBDD']\n\nconst getChicletColors = (chips: string[]) => {\n  return chips.map(chip => {\n    const hash = hashCode(chip)\n    const index = Math.abs(hash) % colors.length\n    return colors[index]\n  })\n}\n\nconst Chips = ({ values }: { values: string[] }): React.ReactNode => {\n  const chipColors = getChicletColors(values)\n  return (\n    <Box className={styles.ColorfulPortalCardWithChips__chipsContainer}>\n      {values.map((chip, index) => (\n        <Chip\n          key={chip}\n          label={<Typography variant=\"smallText1\">{chip}</Typography>}\n          variant=\"filled\"\n          style={{ backgroundColor: chipColors[index] }}\n          className={styles.ChallengePortalCard__chip}\n        />\n      ))}\n    </Box>\n  )\n}\n\nconst ColorfulPortalCardWithChips = ({\n  title,\n  subtitle,\n  description,\n  descriptionTitle,\n  learnMoreLink,\n  buttonOverrideText,\n  chips,\n  backgroundImage,\n  backgroundColor,\n  tag,\n  entityId,\n  borderRadiusPx,\n  cardSize = 'medium',\n}: ColorfulPortalCardWithChipsProps): React.ReactNode => {\n  const imageUrl = useImageUrl(backgroundImage ?? '', entityId ?? '')\n  const backgroundImageValue = imageUrl || backgroundImage\n\n  return (\n    <BasePortalCard\n      cardSize={cardSize}\n      borderRadiusPx={borderRadiusPx}\n      backgroundImage={backgroundImageValue || <DefaultBackground />}\n      backgroundColor={backgroundColor || colors[0]}\n      contentBelowCard={chips && chips.length > 0 && <Chips values={chips} />}\n    >\n      <Stack className={styles.ColorfulPortalCardWithChips__sectionContainer}>\n        <Stack>\n          {tag && (\n            <Chip\n              color=\"secondary\"\n              variant=\"filled\"\n              className={styles.ColorfulPortalCardWithChips__registrationStatus}\n              sx={{ backgroundColor }}\n              label={tag}\n            />\n          )}\n          <Stack className={styles.ColorfulPortalCardWithChips__titleSection}>\n            <Typography\n              variant=\"headline1\"\n              className={styles.ColorfulPortalCardWithChips__title}\n            >\n              {title}\n            </Typography>\n            <Typography\n              variant=\"headline1\"\n              className={styles.ColorfulPortalCardWithChips__challengeName}\n            >\n              {subtitle}\n            </Typography>\n          </Stack>\n        </Stack>\n        <Stack className={styles.ColorfulPortalCardWithChips__bottomSection}>\n          {descriptionTitle && (\n            <Typography\n              variant=\"headline1\"\n              className={styles.ColorfulPortalCardWithChips__descriptionTitle}\n            >\n              {descriptionTitle}\n            </Typography>\n          )}\n          <Typography\n            variant=\"smallText1\"\n            className={styles.ColorfulPortalCardWithChips__description}\n          >\n            <MarkdownSynapse markdown={description ?? ''} />\n          </Typography>\n          {learnMoreLink && (\n            <Button\n              className={styles.ColorfulPortalCardWithChips__learnMoreButton}\n              variant=\"outlined\"\n              endIcon={<ArrowForwardIcon />}\n              href={learnMoreLink}\n              target=\"_blank\"\n              rel=\"noopener noreferrer\"\n            >\n              {buttonOverrideText ?? 'Learn more'}\n            </Button>\n          )}\n        </Stack>\n      </Stack>\n    </BasePortalCard>\n  )\n}\n\nexport default ColorfulPortalCardWithChips\n"],"mappings":";;;;;;;;;;;AA0BA,IAAM,IAAS;CAAC;CAAW;CAAW;CAAU,EAE1C,KAAoB,MACjB,EAAM,KAAI,MAAQ;CACvB,IAAM,IAAO,EAAS,EAAK;AAE3B,QAAO,EADO,KAAK,IAAI,EAAK,GAAG,EAAO;EAEtC,EAGE,KAAS,EAAE,gBAAoD;CACnE,IAAM,IAAa,EAAiB,EAAO;AAC3C,QACE,kBAAC,GAAD;EAAK,WAAW,EAAO;YACpB,EAAO,KAAK,GAAM,MACjB,kBAAC,GAAD;GAEE,OAAO,kBAAC,GAAD;IAAY,SAAQ;cAAc;IAAkB,CAAA;GAC3D,SAAQ;GACR,OAAO,EAAE,iBAAiB,EAAW,IAAQ;GAC7C,WAAW,EAAO;GAClB,EALK,EAKL,CACF;EACE,CAAA;GAIJ,KAA+B,EACnC,UACA,aACA,gBACA,qBACA,kBACA,uBACA,UACA,oBACA,oBACA,QACA,aACA,mBACA,cAAW,eAMT,kBAAC,GAAD;CACY;CACM;CAChB,iBAPa,EAAY,KAAmB,IAAI,KAAY,GACnC,IAAY,KAMI,kBAAC,GAAD,EAAqB,CAAA;CAC9D,iBAAiB,KAAmB,EAAO;CAC3C,kBAAkB,KAAS,EAAM,SAAS,KAAK,kBAAC,GAAD,EAAO,QAAQ,GAAS,CAAA;WAEvE,kBAAC,GAAD;EAAO,WAAW,EAAO;YAAzB,CACE,kBAAC,GAAD,EAAA,UAAA,CACG,KACC,kBAAC,GAAD;GACE,OAAM;GACN,SAAQ;GACR,WAAW,EAAO;GAClB,IAAI,EAAE,oBAAiB;GACvB,OAAO;GACP,CAAA,EAEJ,kBAAC,GAAD;GAAO,WAAW,EAAO;aAAzB,CACE,kBAAC,GAAD;IACE,SAAQ;IACR,WAAW,EAAO;cAEjB;IACU,CAAA,EACb,kBAAC,GAAD;IACE,SAAQ;IACR,WAAW,EAAO;cAEjB;IACU,CAAA,CACP;KACF,EAAA,CAAA,EACR,kBAAC,GAAD;GAAO,WAAW,EAAO;aAAzB;IACG,KACC,kBAAC,GAAD;KACE,SAAQ;KACR,WAAW,EAAO;eAEjB;KACU,CAAA;IAEf,kBAAC,GAAD;KACE,SAAQ;KACR,WAAW,EAAO;eAElB,kBAAC,GAAD,EAAiB,UAAU,KAAe,IAAM,CAAA;KACrC,CAAA;IACZ,KACC,kBAAC,GAAD;KACE,WAAW,EAAO;KAClB,SAAQ;KACR,SAAS,kBAAC,GAAD,EAAoB,CAAA;KAC7B,MAAM;KACN,QAAO;KACP,KAAI;eAEH,KAAsB;KAChB,CAAA;IAEL;KACF;;CACO,CAAA"}
+{"version":3,"file":"ColorfulPortalCardWithChips.js","names":[],"sources":["../../../../src/components/BasePortalCard/ColorfulPortalCardWithChips/ColorfulPortalCardWithChips.tsx"],"sourcesContent":["import { ReactComponent as DefaultBackground } from '@/assets/DefaultColorfulPortalCardBackground.svg'\nimport MarkdownSynapse from '@/components/Markdown/MarkdownSynapse'\nimport { hashCode } from '@/utils/functions/StringUtils'\nimport { useImageUrl } from '@/utils/hooks/useImageUrlUtils'\nimport ArrowForwardIcon from '@mui/icons-material/ArrowForward'\nimport { Box, Button, Chip, Stack, Typography } from '@mui/material'\nimport React from 'react'\nimport BasePortalCard from '../BasePortalCard'\nimport styles from './ColorfulPortalCardWithChips.module.scss'\n\ntype ColorfulPortalCardWithChipsProps = {\n  title?: string\n  subtitle?: string\n  description?: string\n  descriptionTitle?: string\n  learnMoreLink?: string\n  buttonOverrideText?: string\n  chips?: string[]\n  backgroundImage?: string\n  backgroundColor?: string\n  tag?: string\n  entityId?: string\n  borderRadiusPx?: number\n  cardSize?: 'small' | 'medium' | 'large'\n}\n\nconst colors = ['#F8CC7D', '#BFE8F4', '#CEFBDD']\n\nconst getChicletColors = (chips: string[]) => {\n  return chips.map(chip => {\n    const hash = hashCode(chip)\n    const index = Math.abs(hash) % colors.length\n    return colors[index]\n  })\n}\n\nconst Chips = ({ values }: { values: string[] }): React.ReactNode => {\n  const chipColors = getChicletColors(values)\n  return (\n    <Box className={styles.ColorfulPortalCardWithChips__chipsContainer}>\n      {values.map((chip, index) => (\n        <Chip\n          key={chip}\n          label={<Typography variant=\"smallText1\">{chip}</Typography>}\n          variant=\"filled\"\n          style={{ backgroundColor: chipColors[index] }}\n          className={styles.ChallengePortalCard__chip}\n        />\n      ))}\n    </Box>\n  )\n}\n\nconst ColorfulPortalCardWithChips = ({\n  title,\n  subtitle,\n  description,\n  descriptionTitle,\n  learnMoreLink,\n  buttonOverrideText,\n  chips,\n  backgroundImage,\n  backgroundColor,\n  tag,\n  entityId,\n  borderRadiusPx,\n  cardSize = 'medium',\n}: ColorfulPortalCardWithChipsProps): React.ReactNode => {\n  const imageUrl = useImageUrl(backgroundImage ?? '', entityId ?? '')\n  const backgroundImageValue = imageUrl || backgroundImage\n\n  return (\n    <BasePortalCard\n      cardSize={cardSize}\n      borderRadiusPx={borderRadiusPx}\n      backgroundImage={backgroundImageValue || <DefaultBackground />}\n      backgroundColor={backgroundColor || colors[0]}\n      contentBelowCard={chips && chips.length > 0 && <Chips values={chips} />}\n    >\n      <Stack className={styles.ColorfulPortalCardWithChips__sectionContainer}>\n        <Stack>\n          {tag && (\n            <Chip\n              color=\"secondary\"\n              variant=\"filled\"\n              className={styles.ColorfulPortalCardWithChips__registrationStatus}\n              sx={{ backgroundColor }}\n              label={tag}\n            />\n          )}\n          <Stack className={styles.ColorfulPortalCardWithChips__titleSection}>\n            <Typography\n              variant=\"headline1\"\n              className={styles.ColorfulPortalCardWithChips__title}\n            >\n              {title}\n            </Typography>\n            <Typography\n              variant=\"headline1\"\n              className={styles.ColorfulPortalCardWithChips__challengeName}\n            >\n              {subtitle}\n            </Typography>\n          </Stack>\n        </Stack>\n        <Stack className={styles.ColorfulPortalCardWithChips__bottomSection}>\n          {descriptionTitle && (\n            <Typography\n              variant=\"headline1\"\n              className={styles.ColorfulPortalCardWithChips__descriptionTitle}\n            >\n              {descriptionTitle}\n            </Typography>\n          )}\n          <Typography\n            variant=\"smallText1\"\n            className={styles.ColorfulPortalCardWithChips__description}\n          >\n            <MarkdownSynapse markdown={description ?? ''} />\n          </Typography>\n          {learnMoreLink && (\n            <Button\n              className={styles.ColorfulPortalCardWithChips__learnMoreButton}\n              variant=\"outlined\"\n              endIcon={<ArrowForwardIcon />}\n              href={learnMoreLink}\n              target=\"_blank\"\n              rel=\"noopener noreferrer\"\n            >\n              {buttonOverrideText ?? 'Learn more'}\n            </Button>\n          )}\n        </Stack>\n      </Stack>\n    </BasePortalCard>\n  )\n}\n\nexport default ColorfulPortalCardWithChips\n"],"mappings":";;;;;;;;;;;AA0BA,IAAM,IAAS;CAAC;CAAW;CAAW;AAAS,GAEzC,KAAoB,MACjB,EAAM,KAAI,MAAQ;CACvB,IAAM,IAAO,EAAS,CAAI;CAE1B,OAAO,EADO,KAAK,IAAI,CAAI,IAAI,EAAO;AAExC,CAAC,GAGG,KAAS,EAAE,gBAAoD;CACnE,IAAM,IAAa,EAAiB,CAAM;CAC1C,OACE,kBAAC,GAAD;EAAK,WAAW,EAAO;YACpB,EAAO,KAAK,GAAM,MACjB,kBAAC,GAAD;GAEE,OAAO,kBAAC,GAAD;IAAY,SAAQ;cAAc;GAAiB,CAAA;GAC1D,SAAQ;GACR,OAAO,EAAE,iBAAiB,EAAW,GAAO;GAC5C,WAAW,EAAO;EACnB,GALM,CAKN,CACF;CACE,CAAA;AAET,GAEM,KAA+B,EACnC,UACA,aACA,gBACA,qBACA,kBACA,uBACA,UACA,oBACA,oBACA,QACA,aACA,mBACA,cAAW,eAMT,kBAAC,GAAD;CACY;CACM;CAChB,iBAPa,EAAY,KAAmB,IAAI,KAAY,EACnC,KAAY,KAMI,kBAAC,GAAD,CAAoB,CAAA;CAC7D,iBAAiB,KAAmB,EAAO;CAC3C,kBAAkB,KAAS,EAAM,SAAS,KAAK,kBAAC,GAAD,EAAO,QAAQ,EAAQ,CAAA;WAEtE,kBAAC,GAAD;EAAO,WAAW,EAAO;YAAzB,CACE,kBAAC,GAAD,EAAA,UAAA,CACG,KACC,kBAAC,GAAD;GACE,OAAM;GACN,SAAQ;GACR,WAAW,EAAO;GAClB,IAAI,EAAE,mBAAgB;GACtB,OAAO;EACR,CAAA,GAEH,kBAAC,GAAD;GAAO,WAAW,EAAO;aAAzB,CACE,kBAAC,GAAD;IACE,SAAQ;IACR,WAAW,EAAO;cAEjB;GACS,CAAA,GACZ,kBAAC,GAAD;IACE,SAAQ;IACR,WAAW,EAAO;cAEjB;GACS,CAAA,CACP;IACF,EAAA,CAAA,GACP,kBAAC,GAAD;GAAO,WAAW,EAAO;aAAzB;IACG,KACC,kBAAC,GAAD;KACE,SAAQ;KACR,WAAW,EAAO;eAEjB;IACS,CAAA;IAEd,kBAAC,GAAD;KACE,SAAQ;KACR,WAAW,EAAO;eAElB,kBAAC,GAAD,EAAiB,UAAU,KAAe,GAAK,CAAA;IACrC,CAAA;IACX,KACC,kBAAC,GAAD;KACE,WAAW,EAAO;KAClB,SAAQ;KACR,SAAS,kBAAC,GAAD,CAAmB,CAAA;KAC5B,MAAM;KACN,QAAO;KACP,KAAI;eAEH,KAAsB;IACjB,CAAA;GAEL;IACF;;AACO,CAAA"}

package/dist/components/Breadcrumbs/Breadcrumbs.js.map

@@ -1 +1 @@
-{"version":3,"file":"Breadcrumbs.js","names":[],"sources":["../../../src/components/Breadcrumbs/Breadcrumbs.tsx"],"sourcesContent":["import IconSvg from '@/components/IconSvg/IconSvg'\nimport { truncateString } from '@/utils/functions/StringUtils'\nimport {\n  Breadcrumbs as MuiBreadcrumbs,\n  Link,\n  SxProps,\n  Tooltip,\n  Typography,\n} from '@mui/material'\nimport { MouseEventHandler } from 'react'\nimport { Link as RouterLink } from 'react-router'\n\nexport type BreadcrumbItem = {\n  /* The text to show in the breadcrumb item. Strings > 25 characters will be truncated */\n  text: string\n  /* Whether this item represents the current page. If true, this item will not have a link. Default false */\n  current?: boolean\n  /* Link for the item, if using react-router */\n  to?: string\n  /* Link for the item, if it should be a normal anchor */\n  href?: string\n  /* Event handler fired when the link is clicked */\n  onClick?: MouseEventHandler\n}\n\ntype BreadcrumbsProps = {\n  /** The items to show in the breadcrumbs */\n  items: BreadcrumbItem[]\n  /** sx passed to the MUI Breadcrumbs */\n  sx?: SxProps\n  /** If defined, truncate individual item strings to be no longer than this value */\n  maxBreadcrumbLength?: number\n}\n\nfunction BreadcrumbSeparator() {\n  return <IconSvg icon=\"chevronRight\" />\n}\n\nexport function Breadcrumbs(props: BreadcrumbsProps) {\n  const { items, sx, maxBreadcrumbLength } = props\n  return (\n    <MuiBreadcrumbs\n      separator={<BreadcrumbSeparator />}\n      itemsBeforeCollapse={2}\n      itemsAfterCollapse={2}\n      sx={sx}\n    >\n      {items.map((data, index) => {\n        let displayedText = data.text\n        if (maxBreadcrumbLength) {\n          displayedText = truncateString(data.text, maxBreadcrumbLength)\n        }\n\n        const tooltipText = displayedText !== data.text ? data.text : null\n        return (\n          <Tooltip key={index} title={tooltipText} placement=\"top\">\n            <Typography variant={'breadcrumb1'}>\n              {data.current ? (\n                displayedText\n              ) : (\n                <Link\n                  component={data.to ? RouterLink : Link}\n                  to={data.to}\n                  key={index}\n                  href={data.href}\n                  onClick={data.onClick}\n                  underline=\"hover\"\n                >\n                  {displayedText}\n                </Link>\n              )}\n            </Typography>\n          </Tooltip>\n        )\n      })}\n    </MuiBreadcrumbs>\n  )\n}\n\nexport default Breadcrumbs\n"],"mappings":";;;;;;AAkCA,SAAS,IAAsB;AAC7B,QAAO,kBAAC,GAAD,EAAS,MAAK,gBAAiB,CAAA;;AAGxC,SAAgB,EAAY,GAAyB;CACnD,IAAM,EAAE,UAAO,OAAI,2BAAwB;AAC3C,QACE,kBAAC,GAAD;EACE,WAAW,kBAAC,GAAD,EAAuB,CAAA;EAClC,qBAAqB;EACrB,oBAAoB;EAChB;YAEH,EAAM,KAAK,GAAM,MAAU;GAC1B,IAAI,IAAgB,EAAK;AAMzB,UALI,MACF,IAAgB,EAAe,EAAK,MAAM,EAAoB,GAK9D,kBAAC,GAAD;IAAqB,OAFH,MAAkB,EAAK,OAAmB,OAAZ,EAAK;IAEZ,WAAU;cACjD,kBAAC,GAAD;KAAY,SAAS;eAClB,EAAK,UACJ,IAEA,kBAAC,GAAD;MACE,WAAW,EAAK,KAAK,IAAa;MAClC,IAAI,EAAK;MAET,MAAM,EAAK;MACX,SAAS,EAAK;MACd,WAAU;gBAET;MACI,EANA,EAMA;KAEE,CAAA;IACL,EAjBI,EAiBJ;IAEZ;EACa,CAAA"}
+{"version":3,"file":"Breadcrumbs.js","names":[],"sources":["../../../src/components/Breadcrumbs/Breadcrumbs.tsx"],"sourcesContent":["import IconSvg from '@/components/IconSvg/IconSvg'\nimport { truncateString } from '@/utils/functions/StringUtils'\nimport {\n  Breadcrumbs as MuiBreadcrumbs,\n  Link,\n  SxProps,\n  Tooltip,\n  Typography,\n} from '@mui/material'\nimport { MouseEventHandler } from 'react'\nimport { Link as RouterLink } from 'react-router'\n\nexport type BreadcrumbItem = {\n  /* The text to show in the breadcrumb item. Strings > 25 characters will be truncated */\n  text: string\n  /* Whether this item represents the current page. If true, this item will not have a link. Default false */\n  current?: boolean\n  /* Link for the item, if using react-router */\n  to?: string\n  /* Link for the item, if it should be a normal anchor */\n  href?: string\n  /* Event handler fired when the link is clicked */\n  onClick?: MouseEventHandler\n}\n\ntype BreadcrumbsProps = {\n  /** The items to show in the breadcrumbs */\n  items: BreadcrumbItem[]\n  /** sx passed to the MUI Breadcrumbs */\n  sx?: SxProps\n  /** If defined, truncate individual item strings to be no longer than this value */\n  maxBreadcrumbLength?: number\n}\n\nfunction BreadcrumbSeparator() {\n  return <IconSvg icon=\"chevronRight\" />\n}\n\nexport function Breadcrumbs(props: BreadcrumbsProps) {\n  const { items, sx, maxBreadcrumbLength } = props\n  return (\n    <MuiBreadcrumbs\n      separator={<BreadcrumbSeparator />}\n      itemsBeforeCollapse={2}\n      itemsAfterCollapse={2}\n      sx={sx}\n    >\n      {items.map((data, index) => {\n        let displayedText = data.text\n        if (maxBreadcrumbLength) {\n          displayedText = truncateString(data.text, maxBreadcrumbLength)\n        }\n\n        const tooltipText = displayedText !== data.text ? data.text : null\n        return (\n          <Tooltip key={index} title={tooltipText} placement=\"top\">\n            <Typography variant={'breadcrumb1'}>\n              {data.current ? (\n                displayedText\n              ) : (\n                <Link\n                  component={data.to ? RouterLink : Link}\n                  to={data.to}\n                  key={index}\n                  href={data.href}\n                  onClick={data.onClick}\n                  underline=\"hover\"\n                >\n                  {displayedText}\n                </Link>\n              )}\n            </Typography>\n          </Tooltip>\n        )\n      })}\n    </MuiBreadcrumbs>\n  )\n}\n\nexport default Breadcrumbs\n"],"mappings":";;;;;;AAkCA,SAAS,IAAsB;CAC7B,OAAO,kBAAC,GAAD,EAAS,MAAK,eAAgB,CAAA;AACvC;AAEA,SAAgB,EAAY,GAAyB;CACnD,IAAM,EAAE,UAAO,OAAI,2BAAwB;CAC3C,OACE,kBAAC,GAAD;EACE,WAAW,kBAAC,GAAD,CAAsB,CAAA;EACjC,qBAAqB;EACrB,oBAAoB;EAChB;YAEH,EAAM,KAAK,GAAM,MAAU;GAC1B,IAAI,IAAgB,EAAK;GAMzB,OALI,MACF,IAAgB,EAAe,EAAK,MAAM,CAAmB,IAK7D,kBAAC,GAAD;IAAqB,OAFH,MAAkB,EAAK,OAAmB,OAAZ,EAAK;IAEZ,WAAU;cACjD,kBAAC,GAAD;KAAY,SAAS;eAClB,EAAK,UACJ,IAEA,kBAAC,GAAD;MACE,WAAW,EAAK,KAAK,IAAa;MAClC,IAAI,EAAK;MAET,MAAM,EAAK;MACX,SAAS,EAAK;MACd,WAAU;gBAET;KACG,GANC,CAMD;IAEE,CAAA;GACL,GAjBK,CAiBL;EAEb,CAAC;CACa,CAAA;AAEpB"}

package/dist/components/CTASectionWrapper/CTASectionWrapper.js.map

@@ -1 +1 @@
-{"version":3,"file":"CTASectionWrapper.js","names":[],"sources":["../../../src/components/CTASectionWrapper/CTASectionWrapper.tsx"],"sourcesContent":["import React from 'react'\nimport { Box, Stack, SxProps, useTheme } from '@mui/material'\nimport Illustrations from '../../assets/illustrations'\n\nexport type CTASectionWrapperProps = {\n  themeMode: 'dark' | 'light'\n  showBlobs?: boolean\n  content: React.ReactNode\n  sx?: SxProps\n}\n\nconst CTASectionWrapper = ({\n  content,\n  themeMode,\n  showBlobs = true,\n  sx,\n}: CTASectionWrapperProps): React.ReactNode => {\n  const theme = useTheme()\n  const blobStyles = {\n    position: 'absolute',\n    height: '100%',\n    overflow: 'hidden',\n    display: { xs: 'none', md: 'block' },\n  }\n  return (\n    <Stack\n      sx={{\n        padding: { xs: '40px', lg: '80px' },\n        justifyContent: 'center',\n        alignItems: 'center',\n        textAlign: 'center',\n        background:\n          themeMode === 'light'\n            ? `linear-gradient(0deg, rgba(255, 255, 255, 0.80) 0%, rgba(255, 255, 255, 0.80) 100%), ${theme.palette.primary.main}`\n            : theme.palette.primary.main,\n        position: 'relative',\n        overflow: 'hidden',\n        color: themeMode === 'dark' ? '#FFFF' : '',\n        svg: {\n          mixBlendMode: themeMode === 'light' ? 'soft-light' : '',\n        },\n        ...sx,\n      }}\n    >\n      {showBlobs && (\n        <>\n          <Box\n            sx={theme => ({\n              ...blobStyles,\n              left: 0,\n              [theme.breakpoints.down('lg')]: {\n                svg: {\n                  width: '280px',\n                  height: '100%',\n                },\n              },\n            })}\n          >\n            {themeMode === 'light' ? (\n              <Illustrations.LeftDotBlob />\n            ) : (\n              <Illustrations.LeftDotBlobDark />\n            )}\n          </Box>\n          <Box\n            sx={theme => ({\n              ...blobStyles,\n              right: 0,\n              top: '30%',\n              [theme.breakpoints.down('lg')]: {\n                svg: {\n                  width: '370px',\n                  height: '100%',\n                },\n              },\n            })}\n          >\n            {themeMode === 'light' ? (\n              <Illustrations.RightDotBlob />\n            ) : (\n              <Illustrations.RightDotBlobDark />\n            )}\n          </Box>\n        </>\n      )}\n      {content}\n    </Stack>\n  )\n}\n\nexport default CTASectionWrapper\n"],"mappings":";;;;;AAWA,IAAM,KAAqB,EACzB,YACA,cACA,eAAY,IACZ,YAC6C;CAC7C,IAAM,IAAQ,GAAU,EAClB,IAAa;EACjB,UAAU;EACV,QAAQ;EACR,UAAU;EACV,SAAS;GAAE,IAAI;GAAQ,IAAI;GAAS;EACrC;AACD,QACE,kBAAC,GAAD;EACE,IAAI;GACF,SAAS;IAAE,IAAI;IAAQ,IAAI;IAAQ;GACnC,gBAAgB;GAChB,YAAY;GACZ,WAAW;GACX,YACE,MAAc,UACV,wFAAwF,EAAM,QAAQ,QAAQ,SAC9G,EAAM,QAAQ,QAAQ;GAC5B,UAAU;GACV,UAAU;GACV,OAAO,MAAc,SAAS,UAAU;GACxC,KAAK,EACH,cAAc,MAAc,UAAU,eAAe,IACtD;GACD,GAAG;GACJ;YAjBH,CAmBG,KACC,kBAAA,GAAA,EAAA,UAAA,CACE,kBAAC,GAAD;GACE,KAAI,OAAU;IACZ,GAAG;IACH,MAAM;KACL,EAAM,YAAY,KAAK,KAAK,GAAG,EAC9B,KAAK;KACH,OAAO;KACP,QAAQ;KACT,EACF;IACF;aAGC,EADD,MAAc,UACZ,EAAc,cAEd,EAAc,iBAFf,EAA6B,CAEI;GAE/B,CAAA,EACN,kBAAC,GAAD;GACE,KAAI,OAAU;IACZ,GAAG;IACH,OAAO;IACP,KAAK;KACJ,EAAM,YAAY,KAAK,KAAK,GAAG,EAC9B,KAAK;KACH,OAAO;KACP,QAAQ;KACT,EACF;IACF;aAGC,EADD,MAAc,UACZ,EAAc,eAEd,EAAc,kBAFf,EAA8B,CAEI;GAEhC,CAAA,CACL,EAAA,CAAA,EAEJ,EACK"}
+{"version":3,"file":"CTASectionWrapper.js","names":[],"sources":["../../../src/components/CTASectionWrapper/CTASectionWrapper.tsx"],"sourcesContent":["import React from 'react'\nimport { Box, Stack, SxProps, useTheme } from '@mui/material'\nimport Illustrations from '../../assets/illustrations'\n\nexport type CTASectionWrapperProps = {\n  themeMode: 'dark' | 'light'\n  showBlobs?: boolean\n  content: React.ReactNode\n  sx?: SxProps\n}\n\nconst CTASectionWrapper = ({\n  content,\n  themeMode,\n  showBlobs = true,\n  sx,\n}: CTASectionWrapperProps): React.ReactNode => {\n  const theme = useTheme()\n  const blobStyles = {\n    position: 'absolute',\n    height: '100%',\n    overflow: 'hidden',\n    display: { xs: 'none', md: 'block' },\n  }\n  return (\n    <Stack\n      sx={{\n        padding: { xs: '40px', lg: '80px' },\n        justifyContent: 'center',\n        alignItems: 'center',\n        textAlign: 'center',\n        background:\n          themeMode === 'light'\n            ? `linear-gradient(0deg, rgba(255, 255, 255, 0.80) 0%, rgba(255, 255, 255, 0.80) 100%), ${theme.palette.primary.main}`\n            : theme.palette.primary.main,\n        position: 'relative',\n        overflow: 'hidden',\n        color: themeMode === 'dark' ? '#FFFF' : '',\n        svg: {\n          mixBlendMode: themeMode === 'light' ? 'soft-light' : '',\n        },\n        ...sx,\n      }}\n    >\n      {showBlobs && (\n        <>\n          <Box\n            sx={theme => ({\n              ...blobStyles,\n              left: 0,\n              [theme.breakpoints.down('lg')]: {\n                svg: {\n                  width: '280px',\n                  height: '100%',\n                },\n              },\n            })}\n          >\n            {themeMode === 'light' ? (\n              <Illustrations.LeftDotBlob />\n            ) : (\n              <Illustrations.LeftDotBlobDark />\n            )}\n          </Box>\n          <Box\n            sx={theme => ({\n              ...blobStyles,\n              right: 0,\n              top: '30%',\n              [theme.breakpoints.down('lg')]: {\n                svg: {\n                  width: '370px',\n                  height: '100%',\n                },\n              },\n            })}\n          >\n            {themeMode === 'light' ? (\n              <Illustrations.RightDotBlob />\n            ) : (\n              <Illustrations.RightDotBlobDark />\n            )}\n          </Box>\n        </>\n      )}\n      {content}\n    </Stack>\n  )\n}\n\nexport default CTASectionWrapper\n"],"mappings":";;;;;AAWA,IAAM,KAAqB,EACzB,YACA,cACA,eAAY,IACZ,YAC6C;CAC7C,IAAM,IAAQ,EAAS,GACjB,IAAa;EACjB,UAAU;EACV,QAAQ;EACR,UAAU;EACV,SAAS;GAAE,IAAI;GAAQ,IAAI;EAAQ;CACrC;CACA,OACE,kBAAC,GAAD;EACE,IAAI;GACF,SAAS;IAAE,IAAI;IAAQ,IAAI;GAAO;GAClC,gBAAgB;GAChB,YAAY;GACZ,WAAW;GACX,YACE,MAAc,UACV,wFAAwF,EAAM,QAAQ,QAAQ,SAC9G,EAAM,QAAQ,QAAQ;GAC5B,UAAU;GACV,UAAU;GACV,OAAO,MAAc,SAAS,UAAU;GACxC,KAAK,EACH,cAAc,MAAc,UAAU,eAAe,GACvD;GACA,GAAG;EACL;YAjBF,CAmBG,KACC,kBAAA,GAAA,EAAA,UAAA,CACE,kBAAC,GAAD;GACE,KAAI,OAAU;IACZ,GAAG;IACH,MAAM;KACL,EAAM,YAAY,KAAK,IAAI,IAAI,EAC9B,KAAK;KACH,OAAO;KACP,QAAQ;IACV,EACF;GACF;aAGE,EADD,MAAc,UACZ,EAAc,cAEd,EAAc,iBAFf,CAA4B,CAEI;EAE/B,CAAA,GACL,kBAAC,GAAD;GACE,KAAI,OAAU;IACZ,GAAG;IACH,OAAO;IACP,KAAK;KACJ,EAAM,YAAY,KAAK,IAAI,IAAI,EAC9B,KAAK;KACH,OAAO;KACP,QAAQ;IACV,EACF;GACF;aAGE,EADD,MAAc,UACZ,EAAc,eAEd,EAAc,kBAFf,CAA6B,CAEI;EAEhC,CAAA,CACL,EAAA,CAAA,GAEH,CACI;;AAEX"}

package/dist/components/CannedRejectionDialog/CannedRejectionDialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"CannedRejectionDialog.js","names":[],"sources":["../../../src/components/CannedRejectionDialog/CannedRejectionDialog.tsx"],"sourcesContent":["import { useGetFullTableQueryResults } from '@/synapse-queries'\nimport { BUNDLE_MASK_QUERY_RESULTS } from '@/utils/SynapseConstants'\nimport {\n  Checkbox,\n  Collapse,\n  FormControl,\n  FormControlLabel,\n  Stack,\n  TextField,\n  Typography,\n} from '@mui/material'\nimport { SynapseClientError } from '@sage-bionetworks/synapse-client/util/SynapseClientError'\nimport { QueryResultBundle, Row } from '@sage-bionetworks/synapse-types'\nimport { UseQueryResult } from '@tanstack/react-query'\nimport { Set } from 'immutable'\nimport { Dispatch, ReactNode, SetStateAction, useEffect, useState } from 'react'\nimport ConfirmationDialog from '../ConfirmationDialog'\nimport { ErrorBanner } from '../error/ErrorBanner'\nimport FullWidthAlert from '../FullWidthAlert/FullWidthAlert'\nimport IconSvg from '../IconSvg/IconSvg'\nimport { SynapseSpinner } from '../LoadingScreen/LoadingScreen'\n\nconst CATEGORY_COLUMN_NAME = 'category'\nconst CATEGORY_SECTION_EMAIL_TEXT_COLUMN_NAME = 'category email prompt'\nconst REJECTION_REASON_FORM_TEXT_COLUMN_NAME = 'rejection reason'\nconst REJECTION_REASON_EMAIL_TEXT_COLUMN_NAME = 'email text'\n\nexport type CannedRejectionDialogProps = {\n  open: boolean\n  /* SynID of the table which contains the email responses which should populate this modal */\n  tableId: string\n  /* Callback invoked when the rejection is confirmed */\n  onConfirm: (message: string) => void\n  onClose: () => void\n  /** Text injected into the beginning of the email template */\n  defaultMessagePrefix?: string\n  /** Text appended onto the end of the email template */\n  defaultMessageAppend?: string\n  /** Text to display above the canned rejection reasons */\n  rejectionFormPromptCopy?: string\n  /** Error to display, in case one occurred in the callback to `onReject` */\n  error: SynapseClientError | null\n  /** Optional children, can be used to extend the form as needed on step 2 */\n  children?: ReactNode\n}\n\ntype RejectionCategoryProps = {\n  category: string\n  rows: Row[]\n  rejectionReasonFormTextIndex: number\n  selectedRowIds: Set<number>\n  setSelectedRowIds: Dispatch<SetStateAction<Set<number>>>\n  initialIsExpanded?: boolean\n}\n\ntype SelectRejectionReasonsFormProps = {\n  tableQuery: UseQueryResult<QueryResultBundle, SynapseClientError>\n  selectedRowIds: Set<number>\n  setSelectedRowIds: Dispatch<SetStateAction<Set<number>>>\n  rejectionFormPromptCopy?: string\n}\n\n/**\n * Renders a rejection reason category and checkboxes for each reason in the category\n */\nfunction RejectionCategory(props: RejectionCategoryProps) {\n  const {\n    category,\n    rows,\n    selectedRowIds,\n    setSelectedRowIds,\n    rejectionReasonFormTextIndex,\n    initialIsExpanded = false,\n  } = props\n  const [isExpanded, setIsExpanded] = useState(initialIsExpanded)\n\n  return (\n    <>\n      <Typography\n        variant=\"body1\"\n        onClick={() => setIsExpanded(!isExpanded)}\n        sx={{ fontWeight: 700, cursor: 'pointer', my: 1 }}\n      >\n        <IconSvg\n          icon={isExpanded ? 'expandMore' : 'chevronRight'}\n          sx={{ color: 'grey.700' }}\n          wrap={false}\n        />\n        {category}\n      </Typography>\n      <Collapse in={isExpanded}>\n        <Stack sx={{ ml: 3 }}>\n          {(rows ?? []).map(row => (\n            <FormControlLabel\n              key={row.rowId}\n              control={\n                <Checkbox\n                  checked={selectedRowIds.has(row.rowId!)}\n                  size={'small'}\n                  onChange={event => {\n                    if (event.target.checked) {\n                      setSelectedRowIds(selectedRowIds.add(row.rowId!))\n                    } else {\n                      setSelectedRowIds(selectedRowIds.remove(row.rowId!))\n                    }\n                  }}\n                />\n              }\n              label={\n                <Typography variant={'smallText1'}>\n                  {row.values[rejectionReasonFormTextIndex]}\n                </Typography>\n              }\n            />\n          ))}\n        </Stack>\n      </Collapse>\n    </>\n  )\n}\n\n/**\n * Renders a form for selecting individual rejection reasons grouped by category.\n * The rejection reason data comes from the table whose data is fetched in the tableQuery prop.\n */\nfunction SelectRejectionReasonsForm(props: SelectRejectionReasonsFormProps) {\n  const {\n    tableQuery,\n    selectedRowIds,\n    setSelectedRowIds,\n    rejectionFormPromptCopy,\n  } = props\n  const { data: tableData, isLoading, error } = tableQuery\n  const categoryIndex = tableData?.queryResult?.queryResults.headers.findIndex(\n    header => header.name.toLowerCase() === CATEGORY_COLUMN_NAME,\n  )\n  const rejectionReasonFormTextIndex =\n    tableData?.queryResult?.queryResults.headers.findIndex(\n      header =>\n        header.name.toLowerCase() === REJECTION_REASON_FORM_TEXT_COLUMN_NAME,\n    )\n\n  const rowsGroupedByCategory =\n    tableData &&\n    tableData.queryResult &&\n    tableData.queryResult.queryResults.rows.reduce(\n      (acc: Record<string, Row[]>, row) => {\n        const category: string = row.values[categoryIndex!]!\n        acc[category] = [...(acc[category] || []), row]\n        return acc\n      },\n      {},\n    )\n  return (\n    <>\n      <Typography variant=\"headline3\" gutterBottom>\n        Reasons for rejecting\n      </Typography>\n      {rejectionFormPromptCopy && (\n        <Typography variant=\"body1\" gutterBottom>\n          {rejectionFormPromptCopy}\n        </Typography>\n      )}\n      {isLoading && (\n        <Stack sx={{ my: 2 }}>\n          <SynapseSpinner size={30} />\n        </Stack>\n      )}\n      {error && <ErrorBanner error={error} />}\n      {rowsGroupedByCategory && (\n        <FormControl>\n          {Object.keys(rowsGroupedByCategory).map(category => (\n            <RejectionCategory\n              key={category}\n              category={category}\n              rows={rowsGroupedByCategory[category]}\n              selectedRowIds={selectedRowIds}\n              setSelectedRowIds={setSelectedRowIds}\n              rejectionReasonFormTextIndex={rejectionReasonFormTextIndex!}\n              initialIsExpanded={\n                Object.keys(rowsGroupedByCategory).length === 1\n              }\n            />\n          ))}\n        </FormControl>\n      )}\n      <Typography variant=\"headline3\" sx={{ mt: 1 }} gutterBottom>\n        We’ll generate a response email message based on your selections.\n      </Typography>\n      <Typography variant=\"body1\" gutterBottom>\n        If your reasons for rejecting are not shown here, that’s okay! You can\n        edit the complete text of the message on the next screen before sending\n        it.\n      </Typography>\n    </>\n  )\n}\n\ntype DraftRejectionMessageProps = {\n  emailText: string\n  setEmailText: Dispatch<SetStateAction<string>>\n}\n\n/**\n * Presents a text field form that can be used to directly modify the rejection message.\n */\nfunction DraftRejectionMessage(props: DraftRejectionMessageProps) {\n  const { emailText, setEmailText } = props\n  return (\n    <>\n      <Typography variant=\"headline3\" gutterBottom>\n        Edit the text of the rejection message\n      </Typography>\n      <Typography variant=\"body1\" gutterBottom>\n        This message will be sent to the requester. You may edit it, or add\n        custom text to the message.\n      </Typography>\n      <TextField\n        multiline\n        fullWidth\n        rows={15}\n        value={emailText}\n        onChange={event => {\n          setEmailText(event.target.value)\n        }}\n      />\n    </>\n  )\n}\ntype RejectionMessageObject = {\n  [category: string]: {\n    sectionText: string\n    reasons: string[]\n  }\n}\n\n/**\n * Modal component presented to a data access submission reviewer when they decide to reject a request.\n * The modal contains a form for selecting rejection reasons and a text field for editing the rejection message.\n * After crafting a message, the user can reject the submission and send the message to the requester.\n */\nexport function CannedRejectionDialog(props: CannedRejectionDialogProps) {\n  const {\n    open,\n    tableId,\n    onClose,\n    onConfirm: onReject,\n    defaultMessagePrefix = '',\n    defaultMessageAppend = '',\n    rejectionFormPromptCopy,\n    children,\n    error,\n  } = props\n\n  const [step, setStep] = useState<1 | 2>(1)\n  // selectedRowIds are the row IDs of the canned responses the user selected:\n  const [emailText, setEmailText] = useState('')\n  const [selectedRowIds, setSelectedRowIds] = useState(Set<number>())\n\n  // Fetch the table data\n  const tableQuery = useGetFullTableQueryResults({\n    entityId: tableId,\n    query: {\n      sql: `SELECT * FROM ${tableId}`,\n    },\n    partMask: BUNDLE_MASK_QUERY_RESULTS,\n    concreteType: 'org.sagebionetworks.repo.model.table.QueryBundleRequest',\n  })\n\n  const { data } = tableQuery\n\n  const categoryIndex = data?.queryResult?.queryResults.headers.findIndex(\n    header => header.name.toLowerCase() === CATEGORY_COLUMN_NAME,\n  )\n  const categorySectionEmailTextIndex =\n    data?.queryResult?.queryResults.headers.findIndex(\n      header =>\n        header.name.toLowerCase() === CATEGORY_SECTION_EMAIL_TEXT_COLUMN_NAME,\n    )\n\n  const reasonEmailTextIndex =\n    data?.queryResult?.queryResults.headers.findIndex(\n      header =>\n        header.name.toLowerCase() === REJECTION_REASON_EMAIL_TEXT_COLUMN_NAME,\n    )\n\n  // Transform the selected rejection reasons into an object that can be easily transformed into an email\n  const defaultEmailMessageObject: RejectionMessageObject | undefined =\n    data &&\n    data.queryResult &&\n    selectedRowIds.reduce((messageObject: RejectionMessageObject, rowId) => {\n      const row = data.queryResult!.queryResults.rows.find(\n        row => row.rowId === rowId,\n      )!\n      const category = row.values[categoryIndex!]!\n      const sectionText = row.values[categorySectionEmailTextIndex!]!\n      const reasonText = row.values[reasonEmailTextIndex!]!\n      if (messageObject[category]) {\n        messageObject[category].reasons = [\n          ...messageObject[category].reasons,\n          reasonText,\n        ]\n      } else {\n        messageObject[category] = {\n          sectionText: sectionText,\n          reasons: [reasonText],\n        }\n      }\n      return messageObject\n    }, {})\n\n  // Using the rejection message object, create the email template.\n  const defaultEmailMessage =\n    defaultEmailMessageObject &&\n    defaultMessagePrefix +\n      Object.keys(defaultEmailMessageObject).reduce((message, key) => {\n        message += '\\n'\n        const sectionText = defaultEmailMessageObject[key].sectionText\n        if (sectionText) {\n          message += sectionText + '\\n'\n        }\n\n        for (const reason of defaultEmailMessageObject[key].reasons) {\n          if (reason != null) {\n            message += '\\n* ' + reason.replaceAll('\\\\n', '\\n') + '\\n'\n          }\n        }\n        return message\n      }, '') +\n      defaultMessageAppend\n\n  /* If the selected rows change, then reset the email text. */\n  useEffect(() => {\n    if (defaultEmailMessage) {\n      setEmailText(defaultEmailMessage)\n    }\n    // Specifically fire on update to just selectedRowIds\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [selectedRowIds])\n\n  // If fetching/processing the table fails, gracefully fall back to just show the email template\n  return (\n    <ConfirmationDialog\n      open={open}\n      onCancel={() => {\n        if (step === 1) {\n          onClose()\n        }\n        if (step === 2) {\n          setStep(1)\n        }\n      }}\n      maxWidth={'md'}\n      fullWidth\n      title=\"Reject Request?\"\n      content={\n        <>\n          {step === 1 && (\n            <SelectRejectionReasonsForm\n              tableQuery={tableQuery}\n              selectedRowIds={selectedRowIds}\n              setSelectedRowIds={setSelectedRowIds}\n              rejectionFormPromptCopy={rejectionFormPromptCopy}\n            />\n          )}\n          {step === 2 && (\n            <>\n              <DraftRejectionMessage\n                emailText={emailText}\n                setEmailText={setEmailText}\n              />\n              {children}\n            </>\n          )}\n          {error && (\n            <FullWidthAlert\n              variant={'danger'}\n              description={error.reason}\n              isGlobal={false}\n            />\n          )}\n        </>\n      }\n      onConfirm={() => {\n        if (step === 1) {\n          setStep(2)\n        }\n        if (step === 2) {\n          onReject(emailText)\n        }\n      }}\n      confirmButtonProps={{\n        children: step === 1 ? 'Generate Email' : 'Reject and Notify Requester',\n      }}\n      cancelButtonProps={{\n        children: step === 1 ? 'Cancel' : 'Back',\n      }}\n    />\n  )\n}\n"],"mappings":"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"}
+{"version":3,"file":"CannedRejectionDialog.js","names":[],"sources":["../../../src/components/CannedRejectionDialog/CannedRejectionDialog.tsx"],"sourcesContent":["import { useGetFullTableQueryResults } from '@/synapse-queries'\nimport { BUNDLE_MASK_QUERY_RESULTS } from '@/utils/SynapseConstants'\nimport {\n  Checkbox,\n  Collapse,\n  FormControl,\n  FormControlLabel,\n  Stack,\n  TextField,\n  Typography,\n} from '@mui/material'\nimport { SynapseClientError } from '@sage-bionetworks/synapse-client/util/SynapseClientError'\nimport { QueryResultBundle, Row } from '@sage-bionetworks/synapse-types'\nimport { UseQueryResult } from '@tanstack/react-query'\nimport { Set } from 'immutable'\nimport { Dispatch, ReactNode, SetStateAction, useEffect, useState } from 'react'\nimport ConfirmationDialog from '../ConfirmationDialog'\nimport { ErrorBanner } from '../error/ErrorBanner'\nimport FullWidthAlert from '../FullWidthAlert/FullWidthAlert'\nimport IconSvg from '../IconSvg/IconSvg'\nimport { SynapseSpinner } from '../LoadingScreen/LoadingScreen'\n\nconst CATEGORY_COLUMN_NAME = 'category'\nconst CATEGORY_SECTION_EMAIL_TEXT_COLUMN_NAME = 'category email prompt'\nconst REJECTION_REASON_FORM_TEXT_COLUMN_NAME = 'rejection reason'\nconst REJECTION_REASON_EMAIL_TEXT_COLUMN_NAME = 'email text'\n\nexport type CannedRejectionDialogProps = {\n  open: boolean\n  /* SynID of the table which contains the email responses which should populate this modal */\n  tableId: string\n  /* Callback invoked when the rejection is confirmed */\n  onConfirm: (message: string) => void\n  onClose: () => void\n  /** Text injected into the beginning of the email template */\n  defaultMessagePrefix?: string\n  /** Text appended onto the end of the email template */\n  defaultMessageAppend?: string\n  /** Text to display above the canned rejection reasons */\n  rejectionFormPromptCopy?: string\n  /** Error to display, in case one occurred in the callback to `onReject` */\n  error: SynapseClientError | null\n  /** Optional children, can be used to extend the form as needed on step 2 */\n  children?: ReactNode\n}\n\ntype RejectionCategoryProps = {\n  category: string\n  rows: Row[]\n  rejectionReasonFormTextIndex: number\n  selectedRowIds: Set<number>\n  setSelectedRowIds: Dispatch<SetStateAction<Set<number>>>\n  initialIsExpanded?: boolean\n}\n\ntype SelectRejectionReasonsFormProps = {\n  tableQuery: UseQueryResult<QueryResultBundle, SynapseClientError>\n  selectedRowIds: Set<number>\n  setSelectedRowIds: Dispatch<SetStateAction<Set<number>>>\n  rejectionFormPromptCopy?: string\n}\n\n/**\n * Renders a rejection reason category and checkboxes for each reason in the category\n */\nfunction RejectionCategory(props: RejectionCategoryProps) {\n  const {\n    category,\n    rows,\n    selectedRowIds,\n    setSelectedRowIds,\n    rejectionReasonFormTextIndex,\n    initialIsExpanded = false,\n  } = props\n  const [isExpanded, setIsExpanded] = useState(initialIsExpanded)\n\n  return (\n    <>\n      <Typography\n        variant=\"body1\"\n        onClick={() => setIsExpanded(!isExpanded)}\n        sx={{ fontWeight: 700, cursor: 'pointer', my: 1 }}\n      >\n        <IconSvg\n          icon={isExpanded ? 'expandMore' : 'chevronRight'}\n          sx={{ color: 'grey.700' }}\n          wrap={false}\n        />\n        {category}\n      </Typography>\n      <Collapse in={isExpanded}>\n        <Stack sx={{ ml: 3 }}>\n          {(rows ?? []).map(row => (\n            <FormControlLabel\n              key={row.rowId}\n              control={\n                <Checkbox\n                  checked={selectedRowIds.has(row.rowId!)}\n                  size={'small'}\n                  onChange={event => {\n                    if (event.target.checked) {\n                      setSelectedRowIds(selectedRowIds.add(row.rowId!))\n                    } else {\n                      setSelectedRowIds(selectedRowIds.remove(row.rowId!))\n                    }\n                  }}\n                />\n              }\n              label={\n                <Typography variant={'smallText1'}>\n                  {row.values[rejectionReasonFormTextIndex]}\n                </Typography>\n              }\n            />\n          ))}\n        </Stack>\n      </Collapse>\n    </>\n  )\n}\n\n/**\n * Renders a form for selecting individual rejection reasons grouped by category.\n * The rejection reason data comes from the table whose data is fetched in the tableQuery prop.\n */\nfunction SelectRejectionReasonsForm(props: SelectRejectionReasonsFormProps) {\n  const {\n    tableQuery,\n    selectedRowIds,\n    setSelectedRowIds,\n    rejectionFormPromptCopy,\n  } = props\n  const { data: tableData, isLoading, error } = tableQuery\n  const categoryIndex = tableData?.queryResult?.queryResults.headers.findIndex(\n    header => header.name.toLowerCase() === CATEGORY_COLUMN_NAME,\n  )\n  const rejectionReasonFormTextIndex =\n    tableData?.queryResult?.queryResults.headers.findIndex(\n      header =>\n        header.name.toLowerCase() === REJECTION_REASON_FORM_TEXT_COLUMN_NAME,\n    )\n\n  const rowsGroupedByCategory =\n    tableData &&\n    tableData.queryResult &&\n    tableData.queryResult.queryResults.rows.reduce(\n      (acc: Record<string, Row[]>, row) => {\n        const category: string = row.values[categoryIndex!]!\n        acc[category] = [...(acc[category] || []), row]\n        return acc\n      },\n      {},\n    )\n  return (\n    <>\n      <Typography variant=\"headline3\" gutterBottom>\n        Reasons for rejecting\n      </Typography>\n      {rejectionFormPromptCopy && (\n        <Typography variant=\"body1\" gutterBottom>\n          {rejectionFormPromptCopy}\n        </Typography>\n      )}\n      {isLoading && (\n        <Stack sx={{ my: 2 }}>\n          <SynapseSpinner size={30} />\n        </Stack>\n      )}\n      {error && <ErrorBanner error={error} />}\n      {rowsGroupedByCategory && (\n        <FormControl>\n          {Object.keys(rowsGroupedByCategory).map(category => (\n            <RejectionCategory\n              key={category}\n              category={category}\n              rows={rowsGroupedByCategory[category]}\n              selectedRowIds={selectedRowIds}\n              setSelectedRowIds={setSelectedRowIds}\n              rejectionReasonFormTextIndex={rejectionReasonFormTextIndex!}\n              initialIsExpanded={\n                Object.keys(rowsGroupedByCategory).length === 1\n              }\n            />\n          ))}\n        </FormControl>\n      )}\n      <Typography variant=\"headline3\" sx={{ mt: 1 }} gutterBottom>\n        We’ll generate a response email message based on your selections.\n      </Typography>\n      <Typography variant=\"body1\" gutterBottom>\n        If your reasons for rejecting are not shown here, that’s okay! You can\n        edit the complete text of the message on the next screen before sending\n        it.\n      </Typography>\n    </>\n  )\n}\n\ntype DraftRejectionMessageProps = {\n  emailText: string\n  setEmailText: Dispatch<SetStateAction<string>>\n}\n\n/**\n * Presents a text field form that can be used to directly modify the rejection message.\n */\nfunction DraftRejectionMessage(props: DraftRejectionMessageProps) {\n  const { emailText, setEmailText } = props\n  return (\n    <>\n      <Typography variant=\"headline3\" gutterBottom>\n        Edit the text of the rejection message\n      </Typography>\n      <Typography variant=\"body1\" gutterBottom>\n        This message will be sent to the requester. You may edit it, or add\n        custom text to the message.\n      </Typography>\n      <TextField\n        multiline\n        fullWidth\n        rows={15}\n        value={emailText}\n        onChange={event => {\n          setEmailText(event.target.value)\n        }}\n      />\n    </>\n  )\n}\ntype RejectionMessageObject = {\n  [category: string]: {\n    sectionText: string\n    reasons: string[]\n  }\n}\n\n/**\n * Modal component presented to a data access submission reviewer when they decide to reject a request.\n * The modal contains a form for selecting rejection reasons and a text field for editing the rejection message.\n * After crafting a message, the user can reject the submission and send the message to the requester.\n */\nexport function CannedRejectionDialog(props: CannedRejectionDialogProps) {\n  const {\n    open,\n    tableId,\n    onClose,\n    onConfirm: onReject,\n    defaultMessagePrefix = '',\n    defaultMessageAppend = '',\n    rejectionFormPromptCopy,\n    children,\n    error,\n  } = props\n\n  const [step, setStep] = useState<1 | 2>(1)\n  // selectedRowIds are the row IDs of the canned responses the user selected:\n  const [emailText, setEmailText] = useState('')\n  const [selectedRowIds, setSelectedRowIds] = useState(Set<number>())\n\n  // Fetch the table data\n  const tableQuery = useGetFullTableQueryResults({\n    entityId: tableId,\n    query: {\n      sql: `SELECT * FROM ${tableId}`,\n    },\n    partMask: BUNDLE_MASK_QUERY_RESULTS,\n    concreteType: 'org.sagebionetworks.repo.model.table.QueryBundleRequest',\n  })\n\n  const { data } = tableQuery\n\n  const categoryIndex = data?.queryResult?.queryResults.headers.findIndex(\n    header => header.name.toLowerCase() === CATEGORY_COLUMN_NAME,\n  )\n  const categorySectionEmailTextIndex =\n    data?.queryResult?.queryResults.headers.findIndex(\n      header =>\n        header.name.toLowerCase() === CATEGORY_SECTION_EMAIL_TEXT_COLUMN_NAME,\n    )\n\n  const reasonEmailTextIndex =\n    data?.queryResult?.queryResults.headers.findIndex(\n      header =>\n        header.name.toLowerCase() === REJECTION_REASON_EMAIL_TEXT_COLUMN_NAME,\n    )\n\n  // Transform the selected rejection reasons into an object that can be easily transformed into an email\n  const defaultEmailMessageObject: RejectionMessageObject | undefined =\n    data &&\n    data.queryResult &&\n    selectedRowIds.reduce((messageObject: RejectionMessageObject, rowId) => {\n      const row = data.queryResult!.queryResults.rows.find(\n        row => row.rowId === rowId,\n      )!\n      const category = row.values[categoryIndex!]!\n      const sectionText = row.values[categorySectionEmailTextIndex!]!\n      const reasonText = row.values[reasonEmailTextIndex!]!\n      if (messageObject[category]) {\n        messageObject[category].reasons = [\n          ...messageObject[category].reasons,\n          reasonText,\n        ]\n      } else {\n        messageObject[category] = {\n          sectionText: sectionText,\n          reasons: [reasonText],\n        }\n      }\n      return messageObject\n    }, {})\n\n  // Using the rejection message object, create the email template.\n  const defaultEmailMessage =\n    defaultEmailMessageObject &&\n    defaultMessagePrefix +\n      Object.keys(defaultEmailMessageObject).reduce((message, key) => {\n        message += '\\n'\n        const sectionText = defaultEmailMessageObject[key].sectionText\n        if (sectionText) {\n          message += sectionText + '\\n'\n        }\n\n        for (const reason of defaultEmailMessageObject[key].reasons) {\n          if (reason != null) {\n            message += '\\n* ' + reason.replaceAll('\\\\n', '\\n') + '\\n'\n          }\n        }\n        return message\n      }, '') +\n      defaultMessageAppend\n\n  /* If the selected rows change, then reset the email text. */\n  useEffect(() => {\n    if (defaultEmailMessage) {\n      setEmailText(defaultEmailMessage)\n    }\n    // Specifically fire on update to just selectedRowIds\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [selectedRowIds])\n\n  // If fetching/processing the table fails, gracefully fall back to just show the email template\n  return (\n    <ConfirmationDialog\n      open={open}\n      onCancel={() => {\n        if (step === 1) {\n          onClose()\n        }\n        if (step === 2) {\n          setStep(1)\n        }\n      }}\n      maxWidth={'md'}\n      fullWidth\n      title=\"Reject Request?\"\n      content={\n        <>\n          {step === 1 && (\n            <SelectRejectionReasonsForm\n              tableQuery={tableQuery}\n              selectedRowIds={selectedRowIds}\n              setSelectedRowIds={setSelectedRowIds}\n              rejectionFormPromptCopy={rejectionFormPromptCopy}\n            />\n          )}\n          {step === 2 && (\n            <>\n              <DraftRejectionMessage\n                emailText={emailText}\n                setEmailText={setEmailText}\n              />\n              {children}\n            </>\n          )}\n          {error && (\n            <FullWidthAlert\n              variant={'danger'}\n              description={error.reason}\n              isGlobal={false}\n            />\n          )}\n        </>\n      }\n      onConfirm={() => {\n        if (step === 1) {\n          setStep(2)\n        }\n        if (step === 2) {\n          onReject(emailText)\n        }\n      }}\n      confirmButtonProps={{\n        children: step === 1 ? 'Generate Email' : 'Reject and Notify Requester',\n      }}\n      cancelButtonProps={{\n        children: step === 1 ? 'Cancel' : 'Back',\n      }}\n    />\n  )\n}\n"],"mappings":"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"}