@clerk/ui 1.35.1-canary.v20260924225659 → 1.36.0

package/dist/ClerkUI.js

@@ -22,8 +22,8 @@ import { isVersionAtLeast, parseVersion } from "@clerk/shared/versionCheck";
 * @public
 */
 var ClerkUI = class ClerkUI {
-	static version = "1.35.1-canary.v20260924225659";
-	version = "1.35.1-canary.v20260924225659";
+	static version = "1.36.0";
+	version = "1.36.0";
 	#componentRenderer;
 	/**
 	* Creates a new `ClerkUI` instance and mounts the internal component renderer.

package/dist/common/ActionBlockedCard.js

@@ -0,0 +1,83 @@
+import SvgExclamationTriangle from "../icons/exclamation-triangle.js";
+import { localizationKeys } from "../localization/localizationKeys.js";
+import { descriptors } from "../customizables/elementDescriptors.js";
+import { Flow } from "../customizables/Flow.js";
+import { Col, Flex, Icon, Text } from "../customizables/index.js";
+import { Card } from "../elements/Card/index.js";
+import { Header } from "../elements/Header.js";
+import { safeHref } from "../utils/actionBlocked.js";
+import { jsx, jsxs } from "@emotion/react/jsx-runtime";
+
+//#region src/common/ActionBlockedCard.tsx
+const ActionBlockedCard = (props) => {
+	const { traceId, title, description, linkUrl, linkText } = props.details;
+	const href = safeHref(linkUrl);
+	return /* @__PURE__ */ jsx(Flow.Part, {
+		part: "actionBlocked",
+		children: /* @__PURE__ */ jsxs(Card.Root, { children: [/* @__PURE__ */ jsxs(Card.Content, { children: [/* @__PURE__ */ jsxs(Header.Root, { children: [title ? /* @__PURE__ */ jsx(Header.Title, { children: title }) : /* @__PURE__ */ jsx(Header.Title, { localizationKey: localizationKeys("actionBlocked.title") }), description ? /* @__PURE__ */ jsx(Header.Subtitle, { children: description }) : /* @__PURE__ */ jsx(Header.Subtitle, { localizationKey: localizationKeys("actionBlocked.subtitle") })] }), /* @__PURE__ */ jsxs(Col, {
+			elementDescriptor: descriptors.main,
+			gap: 6,
+			children: [
+				/* @__PURE__ */ jsx(Flex, {
+					elementDescriptor: descriptors.actionBlockedIconBox,
+					center: true,
+					sx: (theme) => ({
+						alignSelf: "center",
+						width: theme.sizes.$16,
+						height: theme.sizes.$16,
+						borderRadius: theme.radii.$circle,
+						backgroundColor: theme.colors.$neutralAlpha100,
+						color: theme.colors.$danger500
+					}),
+					children: /* @__PURE__ */ jsx(Icon, {
+						elementDescriptor: descriptors.actionBlockedIcon,
+						icon: SvgExclamationTriangle,
+						sx: (theme) => ({
+							height: theme.sizes.$5,
+							width: theme.sizes.$5
+						})
+					})
+				}),
+				href ? /* @__PURE__ */ jsx(Text, {
+					elementDescriptor: descriptors.actionBlockedLink,
+					as: "a",
+					variant: "buttonLarge",
+					colorScheme: "inherit",
+					sx: {
+						textAlign: "center",
+						textDecoration: "underline"
+					},
+					href,
+					target: "_blank",
+					rel: "noopener noreferrer",
+					children: linkText || href
+				}) : null,
+				traceId ? /* @__PURE__ */ jsxs(Col, {
+					elementDescriptor: descriptors.actionBlockedTraceIdBox,
+					gap: 1,
+					sx: { alignItems: "center" },
+					children: [/* @__PURE__ */ jsx(Text, {
+						elementDescriptor: descriptors.actionBlockedTraceIdLabel,
+						variant: "caption",
+						colorScheme: "secondary",
+						localizationKey: localizationKeys("actionBlocked.traceIdLabel")
+					}), /* @__PURE__ */ jsx(Text, {
+						elementDescriptor: descriptors.actionBlockedTraceId,
+						variant: "body",
+						colorScheme: "secondary",
+						sx: (theme) => ({
+							fontFamily: theme.fonts.$buttons,
+							userSelect: "all",
+							letterSpacing: theme.space.$xxs
+						}),
+						children: traceId
+					})]
+				}) : null
+			]
+		})] }), /* @__PURE__ */ jsx(Card.Footer, {})] })
+	});
+};
+
+//#endregion
+export { ActionBlockedCard };
+//# sourceMappingURL=ActionBlockedCard.js.map

package/dist/common/ActionBlockedCard.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ActionBlockedCard.js","names":["ExclamationTriangle"],"sources":["../../src/common/ActionBlockedCard.tsx"],"sourcesContent":["import { Col, descriptors, Flex, Flow, Icon, localizationKeys, Text } from '../customizables';\nimport { Card } from '../elements/Card';\nimport { Header } from '../elements/Header';\nimport { ExclamationTriangle } from '../icons';\nimport type { ActionBlockedDetails } from '../utils/actionBlocked';\nimport { safeHref } from '../utils/actionBlocked';\n\nexport type { ActionBlockedDetails };\n\ntype ActionBlockedCardProps = {\n  details: ActionBlockedDetails;\n};\n\nexport const ActionBlockedCard = (props: ActionBlockedCardProps) => {\n  const { traceId, title, description, linkUrl, linkText } = props.details;\n  const href = safeHref(linkUrl);\n\n  return (\n    <Flow.Part part='actionBlocked'>\n      <Card.Root>\n        <Card.Content>\n          <Header.Root>\n            {title ? (\n              <Header.Title>{title}</Header.Title>\n            ) : (\n              <Header.Title localizationKey={localizationKeys('actionBlocked.title')} />\n            )}\n            {description ? (\n              <Header.Subtitle>{description}</Header.Subtitle>\n            ) : (\n              <Header.Subtitle localizationKey={localizationKeys('actionBlocked.subtitle')} />\n            )}\n          </Header.Root>\n\n          <Col\n            elementDescriptor={descriptors.main}\n            gap={6}\n          >\n            <Flex\n              elementDescriptor={descriptors.actionBlockedIconBox}\n              center\n              sx={theme => ({\n                alignSelf: 'center',\n                width: theme.sizes.$16,\n                height: theme.sizes.$16,\n                borderRadius: theme.radii.$circle,\n                backgroundColor: theme.colors.$neutralAlpha100,\n                color: theme.colors.$danger500,\n              })}\n            >\n              <Icon\n                elementDescriptor={descriptors.actionBlockedIcon}\n                icon={ExclamationTriangle}\n                sx={theme => ({ height: theme.sizes.$5, width: theme.sizes.$5 })}\n              />\n            </Flex>\n\n            {href ? (\n              <Text\n                elementDescriptor={descriptors.actionBlockedLink}\n                as='a'\n                variant='buttonLarge'\n                colorScheme='inherit'\n                sx={{ textAlign: 'center', textDecoration: 'underline' }}\n                {...{ href, target: '_blank', rel: 'noopener noreferrer' }}\n              >\n                {linkText || href}\n              </Text>\n            ) : null}\n\n            {traceId ? (\n              <Col\n                elementDescriptor={descriptors.actionBlockedTraceIdBox}\n                gap={1}\n                sx={{ alignItems: 'center' }}\n              >\n                <Text\n                  elementDescriptor={descriptors.actionBlockedTraceIdLabel}\n                  variant='caption'\n                  colorScheme='secondary'\n                  localizationKey={localizationKeys('actionBlocked.traceIdLabel')}\n                />\n                <Text\n                  elementDescriptor={descriptors.actionBlockedTraceId}\n                  variant='body'\n                  colorScheme='secondary'\n                  sx={theme => ({\n                    fontFamily: theme.fonts.$buttons,\n                    userSelect: 'all',\n                    letterSpacing: theme.space.$xxs,\n                  })}\n                >\n                  {traceId}\n                </Text>\n              </Col>\n            ) : null}\n          </Col>\n        </Card.Content>\n        <Card.Footer />\n      </Card.Root>\n    </Flow.Part>\n  );\n};\n"],"mappings":";;;;;;;;;;;AAaA,MAAa,qBAAqB,UAAkC;CAClE,MAAM,EAAE,SAAS,OAAO,aAAa,SAAS,aAAa,MAAM;CACjE,MAAM,OAAO,SAAS,OAAO;CAE7B,OACE,oBAAC,KAAK,MAAN;EAAW,MAAK;YACd,qBAAC,KAAK,MAAN,aACE,qBAAC,KAAK,SAAN,aACE,qBAAC,OAAO,MAAR,aACG,QACC,oBAAC,OAAO,OAAR,YAAe,MAAoB,KAEnC,oBAAC,OAAO,OAAR,EAAc,iBAAiB,iBAAiB,qBAAqB,EAAI,IAE1E,cACC,oBAAC,OAAO,UAAR,YAAkB,YAA6B,KAE/C,oBAAC,OAAO,UAAR,EAAiB,iBAAiB,iBAAiB,wBAAwB,EAAI,EAEtE,MAEb,qBAAC,KAAD;GACE,mBAAmB,YAAY;GAC/B,KAAK;aAFP;IAIE,oBAAC,MAAD;KACE,mBAAmB,YAAY;KAC/B;KACA,KAAI,WAAU;MACZ,WAAW;MACX,OAAO,MAAM,MAAM;MACnB,QAAQ,MAAM,MAAM;MACpB,cAAc,MAAM,MAAM;MAC1B,iBAAiB,MAAM,OAAO;MAC9B,OAAO,MAAM,OAAO;KACtB;eAEA,oBAAC,MAAD;MACE,mBAAmB,YAAY;MAC/B,MAAMA;MACN,KAAI,WAAU;OAAE,QAAQ,MAAM,MAAM;OAAI,OAAO,MAAM,MAAM;MAAG;KAC/D;IACG;IAEL,OACC,oBAAC,MAAD;KACE,mBAAmB,YAAY;KAC/B,IAAG;KACH,SAAQ;KACR,aAAY;KACZ,IAAI;MAAE,WAAW;MAAU,gBAAgB;KAAY;KACjD;KAAM,QAAQ;KAAU,KAAK;eAElC,YAAY;IACT,KACJ;IAEH,UACC,qBAAC,KAAD;KACE,mBAAmB,YAAY;KAC/B,KAAK;KACL,IAAI,EAAE,YAAY,SAAS;eAH7B,CAKE,oBAAC,MAAD;MACE,mBAAmB,YAAY;MAC/B,SAAQ;MACR,aAAY;MACZ,iBAAiB,iBAAiB,4BAA4B;KAC/D,IACD,oBAAC,MAAD;MACE,mBAAmB,YAAY;MAC/B,SAAQ;MACR,aAAY;MACZ,KAAI,WAAU;OACZ,YAAY,MAAM,MAAM;OACxB,YAAY;OACZ,eAAe,MAAM,MAAM;MAC7B;gBAEC;KACG,EACH;SACH;GACD;IACO,MACd,oBAAC,KAAK,QAAN,CAAc,EACL;CACF;AAEf"}

package/dist/components/SignIn/SignInProtectCheck.js

@@ -11,6 +11,8 @@ import { Box, Button, Col, Flex, Spinner } from "../../customizables/index.js";
 import { useCardState, withCardStateProvider } from "../../elements/contexts/index.js";
 import { Card } from "../../elements/Card/index.js";
 import { Header } from "../../elements/Header.js";
+import { actionBlockedDetailsFrom } from "../../utils/actionBlocked.js";
+import { ActionBlockedCard } from "../../common/ActionBlockedCard.js";
 import { withRedirectToAfterSignIn } from "../../common/withRedirect.js";
 import { buildSignInOAuthCallbackParams } from "./buildOAuthCallbackParams.js";
 import { isProtectCheckRequiredError, isSignInPendingOAuthTransfer, isSignInProtectGated, resumeSignInAfterProtectCheck } from "./handleProtectCheck.js";
@@ -95,6 +97,8 @@ function SignInProtectCheckInternal() {
 	});
 	const showSpinner = useSpinDelay(isRunning, { delay: 300 });
 	if (!signIn.protectCheck && !everSawProtectCheck) return null;
+	const blockedDetails = actionBlockedDetailsFrom(card.rawError);
+	if (blockedDetails) return /* @__PURE__ */ jsx(ActionBlockedCard, { details: blockedDetails });
 	return /* @__PURE__ */ jsx(Flow.Part, {
 		part: "protectCheck",
 		children: /* @__PURE__ */ jsxs(Card.Root, { children: [/* @__PURE__ */ jsxs(Card.Content, { children: [

package/dist/components/SignIn/SignInProtectCheck.js.map

@@ -1 +1 @@
-{"version":3,"file":"SignInProtectCheck.js","names":[],"sources":["../../../src/components/SignIn/SignInProtectCheck.tsx"],"sourcesContent":["import { removeClerkQueryParam } from '@clerk/shared/internal/clerk-js/queryParams';\nimport { useClerk } from '@clerk/shared/react';\nimport type { SignInResource } from '@clerk/shared/types';\nimport { useEffect, useRef, useState } from 'react';\n\nimport { Card } from '@/ui/elements/Card';\nimport { useCardState, withCardStateProvider } from '@/ui/elements/contexts';\nimport { Header } from '@/ui/elements/Header';\n\nimport { withRedirectToAfterSignIn } from '../../common';\nimport { useCoreSignIn, useSignInContext } from '../../contexts';\nimport {\n  Box,\n  Button,\n  Col,\n  descriptors,\n  Flex,\n  Flow,\n  localizationKeys,\n  Spinner,\n  useLocalizations,\n} from '../../customizables';\nimport { useSpinDelay } from '../../hooks';\nimport { useNavigateToFlowStart } from '../../hooks/useNavigateToFlowStart';\nimport { useProtectCheckRunner } from '../../hooks/useProtectCheckRunner';\nimport { useRouter } from '../../router';\nimport { buildSignInOAuthCallbackParams } from './buildOAuthCallbackParams';\nimport {\n  isProtectCheckRequiredError,\n  isSignInPendingOAuthTransfer,\n  isSignInProtectGated,\n  resumeSignInAfterProtectCheck,\n} from './handleProtectCheck';\n\nfunction SignInProtectCheckInternal(): JSX.Element | null {\n  const card = useCardState();\n  const { t } = useLocalizations();\n  const signIn = useCoreSignIn();\n  const { navigate } = useRouter();\n  const { navigateToFlowStart } = useNavigateToFlowStart();\n  const clerk = useClerk();\n  const { setActive, __internal_resumeAfterProtectCheck } = clerk;\n  const ctx = useSignInContext();\n  const { afterSignInUrl, navigateOnSetActive } = ctx;\n\n  // persist the original status of whether the sign-in is pending an OAuth transfer\n  const startedAsOAuthTransfer = useRef(isSignInPendingOAuthTransfer(signIn));\n\n  // persist that a protect check existed at some point\n  const [everSawProtectCheck, setEverSawProtectCheck] = useState(!!signIn.protectCheck);\n  const didStartNoCheckFallbackRef = useRef(false);\n\n  if (signIn.protectCheck && !everSawProtectCheck) {\n    setEverSawProtectCheck(true);\n  }\n\n  useEffect(() => {\n    if (!signIn.protectCheck && !everSawProtectCheck && !didStartNoCheckFallbackRef.current) {\n      didStartNoCheckFallbackRef.current = true;\n      void navigateToFlowStart();\n    }\n  }, [everSawProtectCheck, navigateToFlowStart, signIn.protectCheck]);\n\n  const { containerRef, isRunning, isWidgetVisible, hasError, retry } = useProtectCheckRunner<SignInResource>({\n    getProtectCheck: () => signIn.protectCheck,\n    getResource: () => signIn,\n    reload: () => signIn.reload(),\n    submitProtectCheck: params => signIn.submitProtectCheck(params),\n    // Routes on the resolved resource. This single path finalizes `complete` from both the normal\n    // success and the `protect_check_already_resolved` reload, so neither strands the user with an\n    // unactivated session.\n    onResolved: async (updatedSignIn, isCancelled) => {\n      if (isCancelled()) {\n        return;\n      }\n      if (updatedSignIn.status === 'complete' && updatedSignIn.createdSessionId) {\n        // A ticket sign-in that would have completed on the start page is completing here\n        // instead, so the ticket has to be cleared here too — otherwise it stays in the URL.\n        removeClerkQueryParam('__clerk_ticket');\n        await setActive({\n          session: updatedSignIn.createdSessionId,\n          navigate: async ({ session, decorateUrl }) => {\n            await navigateOnSetActive({ session, redirectUrl: afterSignInUrl, decorateUrl });\n          },\n        });\n        return;\n      }\n      await resumeSignInAfterProtectCheck(updatedSignIn, {\n        navigate,\n        // No `enterpriseConnectionId` is passed: this runs only under\n        // `shouldHandOffToEnterpriseConnection`, which requires a single connection, so the server\n        // has exactly one to prepare. If that guard is ever loosened to resume a connection the\n        // user chose, the id has to be carried across the challenge and passed here.\n        resumeEnterpriseSSO: async () => {\n          try {\n            await signIn.authenticateWithRedirect({\n              strategy: 'enterprise_sso',\n              redirectUrl: ctx.ssoCallbackUrl,\n              redirectUrlComplete: afterSignInUrl || '/',\n              oidcPrompt: ctx.oidcPrompt,\n              continueSignIn: true,\n            });\n          } catch (err) {\n            // Preparing the hand-off can raise a further challenge, in which case no redirect was\n            // issued: stay here and run it on the next render.\n            if (isProtectCheckRequiredError(err) && isSignInProtectGated(signIn)) {\n              await navigate('.');\n              return;\n            }\n            throw err;\n          }\n        },\n        startedAsOAuthTransfer: startedAsOAuthTransfer.current,\n        resumeOAuthContinuation: () =>\n          typeof __internal_resumeAfterProtectCheck === 'function'\n            ? __internal_resumeAfterProtectCheck(\n                {\n                  ...buildSignInOAuthCallbackParams(ctx),\n                  continuation: 'transfer_to_sign_up',\n                  __internal_navigateOnSetActive: ctx.navigateOnSetActive,\n                },\n                navigate,\n              )\n            : navigate('..'),\n      });\n    },\n  });\n\n  // Debounce the spinner's entrance so a near-instant check (or a script that signals its\n  // widget immediately) never flashes it — the card header alone carries the first ~300ms.\n  // The error and widget-visibility gates stay OUTSIDE the delay hook below: its minimum\n  // visible duration must never outrank the handshake's \"spinner is gone when the promise\n  // resolves\" guarantee, nor keep a spinner next to the retry button.\n  const showSpinner = useSpinDelay(isRunning, { delay: 300 });\n\n  // Stale/direct visit that never had a check: render nothing while the flow-start redirect\n  // scheduled above kicks in, instead of flashing the card shell for one paint. Must stay\n  // below every hook call.\n  if (!signIn.protectCheck && !everSawProtectCheck) {\n    return null;\n  }\n\n  return (\n    <Flow.Part part='protectCheck'>\n      <Card.Root>\n        <Card.Content>\n          <Header.Root showLogo>\n            <Header.Title localizationKey={localizationKeys('signIn.protectCheck.title')} />\n            <Header.Subtitle localizationKey={localizationKeys('signIn.protectCheck.subtitle')} />\n          </Header.Root>\n          <Card.Alert>{card.error}</Card.Alert>\n          <Col\n            elementDescriptor={descriptors.main}\n            gap={6}\n          >\n            <Box\n              ref={containerRef}\n              id='clerk-protect-check'\n              aria-busy={isRunning}\n              // Out of flow while empty so the collapsed container adds no reserved height or flex-gap\n              // gutter above the spinner (same idiom as CaptchaElement's `gapless` mode).\n              style={{ display: 'block', alignSelf: 'center', position: isWidgetVisible ? 'static' : 'absolute' }}\n            />\n            {showSpinner && !hasError && !isWidgetVisible ? (\n              <Flex center>\n                <Spinner\n                  size='lg'\n                  colorScheme='primary'\n                  elementDescriptor={descriptors.spinner}\n                  aria-label={t(localizationKeys('signIn.protectCheck.loading'))}\n                />\n              </Flex>\n            ) : null}\n            {hasError ? (\n              <Button\n                onClick={retry}\n                localizationKey={localizationKeys('signIn.protectCheck.retryButton')}\n              />\n            ) : null}\n          </Col>\n        </Card.Content>\n        <Card.Footer />\n      </Card.Root>\n    </Flow.Part>\n  );\n}\n\nexport const SignInProtectCheck = withRedirectToAfterSignIn(withCardStateProvider(SignInProtectCheckInternal));\n"],"mappings":"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"}
+{"version":3,"file":"SignInProtectCheck.js","names":[],"sources":["../../../src/components/SignIn/SignInProtectCheck.tsx"],"sourcesContent":["import { removeClerkQueryParam } from '@clerk/shared/internal/clerk-js/queryParams';\nimport { useClerk } from '@clerk/shared/react';\nimport type { SignInResource } from '@clerk/shared/types';\nimport { useEffect, useRef, useState } from 'react';\n\nimport { Card } from '@/ui/elements/Card';\nimport { useCardState, withCardStateProvider } from '@/ui/elements/contexts';\nimport { Header } from '@/ui/elements/Header';\nimport { actionBlockedDetailsFrom } from '@/ui/utils/actionBlocked';\n\nimport { ActionBlockedCard, withRedirectToAfterSignIn } from '../../common';\nimport { useCoreSignIn, useSignInContext } from '../../contexts';\nimport {\n  Box,\n  Button,\n  Col,\n  descriptors,\n  Flex,\n  Flow,\n  localizationKeys,\n  Spinner,\n  useLocalizations,\n} from '../../customizables';\nimport { useSpinDelay } from '../../hooks';\nimport { useNavigateToFlowStart } from '../../hooks/useNavigateToFlowStart';\nimport { useProtectCheckRunner } from '../../hooks/useProtectCheckRunner';\nimport { useRouter } from '../../router';\nimport { buildSignInOAuthCallbackParams } from './buildOAuthCallbackParams';\nimport {\n  isProtectCheckRequiredError,\n  isSignInPendingOAuthTransfer,\n  isSignInProtectGated,\n  resumeSignInAfterProtectCheck,\n} from './handleProtectCheck';\n\nfunction SignInProtectCheckInternal(): JSX.Element | null {\n  const card = useCardState();\n  const { t } = useLocalizations();\n  const signIn = useCoreSignIn();\n  const { navigate } = useRouter();\n  const { navigateToFlowStart } = useNavigateToFlowStart();\n  const clerk = useClerk();\n  const { setActive, __internal_resumeAfterProtectCheck } = clerk;\n  const ctx = useSignInContext();\n  const { afterSignInUrl, navigateOnSetActive } = ctx;\n\n  // persist the original status of whether the sign-in is pending an OAuth transfer\n  const startedAsOAuthTransfer = useRef(isSignInPendingOAuthTransfer(signIn));\n\n  // persist that a protect check existed at some point\n  const [everSawProtectCheck, setEverSawProtectCheck] = useState(!!signIn.protectCheck);\n  const didStartNoCheckFallbackRef = useRef(false);\n\n  if (signIn.protectCheck && !everSawProtectCheck) {\n    setEverSawProtectCheck(true);\n  }\n\n  useEffect(() => {\n    if (!signIn.protectCheck && !everSawProtectCheck && !didStartNoCheckFallbackRef.current) {\n      didStartNoCheckFallbackRef.current = true;\n      void navigateToFlowStart();\n    }\n  }, [everSawProtectCheck, navigateToFlowStart, signIn.protectCheck]);\n\n  const { containerRef, isRunning, isWidgetVisible, hasError, retry } = useProtectCheckRunner<SignInResource>({\n    getProtectCheck: () => signIn.protectCheck,\n    getResource: () => signIn,\n    reload: () => signIn.reload(),\n    submitProtectCheck: params => signIn.submitProtectCheck(params),\n    // Routes on the resolved resource. This single path finalizes `complete` from both the normal\n    // success and the `protect_check_already_resolved` reload, so neither strands the user with an\n    // unactivated session.\n    onResolved: async (updatedSignIn, isCancelled) => {\n      if (isCancelled()) {\n        return;\n      }\n      if (updatedSignIn.status === 'complete' && updatedSignIn.createdSessionId) {\n        // A ticket sign-in that would have completed on the start page is completing here\n        // instead, so the ticket has to be cleared here too — otherwise it stays in the URL.\n        removeClerkQueryParam('__clerk_ticket');\n        await setActive({\n          session: updatedSignIn.createdSessionId,\n          navigate: async ({ session, decorateUrl }) => {\n            await navigateOnSetActive({ session, redirectUrl: afterSignInUrl, decorateUrl });\n          },\n        });\n        return;\n      }\n      await resumeSignInAfterProtectCheck(updatedSignIn, {\n        navigate,\n        // No `enterpriseConnectionId` is passed: this runs only under\n        // `shouldHandOffToEnterpriseConnection`, which requires a single connection, so the server\n        // has exactly one to prepare. If that guard is ever loosened to resume a connection the\n        // user chose, the id has to be carried across the challenge and passed here.\n        resumeEnterpriseSSO: async () => {\n          try {\n            await signIn.authenticateWithRedirect({\n              strategy: 'enterprise_sso',\n              redirectUrl: ctx.ssoCallbackUrl,\n              redirectUrlComplete: afterSignInUrl || '/',\n              oidcPrompt: ctx.oidcPrompt,\n              continueSignIn: true,\n            });\n          } catch (err) {\n            // Preparing the hand-off can raise a further challenge, in which case no redirect was\n            // issued: stay here and run it on the next render.\n            if (isProtectCheckRequiredError(err) && isSignInProtectGated(signIn)) {\n              await navigate('.');\n              return;\n            }\n            throw err;\n          }\n        },\n        startedAsOAuthTransfer: startedAsOAuthTransfer.current,\n        resumeOAuthContinuation: () =>\n          typeof __internal_resumeAfterProtectCheck === 'function'\n            ? __internal_resumeAfterProtectCheck(\n                {\n                  ...buildSignInOAuthCallbackParams(ctx),\n                  continuation: 'transfer_to_sign_up',\n                  __internal_navigateOnSetActive: ctx.navigateOnSetActive,\n                },\n                navigate,\n              )\n            : navigate('..'),\n      });\n    },\n  });\n\n  // Debounce the spinner's entrance so a near-instant check (or a script that signals its\n  // widget immediately) never flashes it — the card header alone carries the first ~300ms.\n  // The error and widget-visibility gates stay OUTSIDE the delay hook below: its minimum\n  // visible duration must never outrank the handshake's \"spinner is gone when the promise\n  // resolves\" guarantee, nor keep a spinner next to the retry button.\n  const showSpinner = useSpinDelay(isRunning, { delay: 300 });\n\n  // Stale/direct visit that never had a check: render nothing while the flow-start redirect\n  // scheduled above kicks in, instead of flashing the card shell for one paint. Must stay\n  // below every hook call.\n  if (!signIn.protectCheck && !everSawProtectCheck) {\n    return null;\n  }\n\n  const blockedDetails = actionBlockedDetailsFrom(card.rawError);\n  if (blockedDetails) {\n    return <ActionBlockedCard details={blockedDetails} />;\n  }\n\n  return (\n    <Flow.Part part='protectCheck'>\n      <Card.Root>\n        <Card.Content>\n          <Header.Root showLogo>\n            <Header.Title localizationKey={localizationKeys('signIn.protectCheck.title')} />\n            <Header.Subtitle localizationKey={localizationKeys('signIn.protectCheck.subtitle')} />\n          </Header.Root>\n          <Card.Alert>{card.error}</Card.Alert>\n          <Col\n            elementDescriptor={descriptors.main}\n            gap={6}\n          >\n            <Box\n              ref={containerRef}\n              id='clerk-protect-check'\n              aria-busy={isRunning}\n              // Out of flow while empty so the collapsed container adds no reserved height or flex-gap\n              // gutter above the spinner (same idiom as CaptchaElement's `gapless` mode).\n              style={{ display: 'block', alignSelf: 'center', position: isWidgetVisible ? 'static' : 'absolute' }}\n            />\n            {showSpinner && !hasError && !isWidgetVisible ? (\n              <Flex center>\n                <Spinner\n                  size='lg'\n                  colorScheme='primary'\n                  elementDescriptor={descriptors.spinner}\n                  aria-label={t(localizationKeys('signIn.protectCheck.loading'))}\n                />\n              </Flex>\n            ) : null}\n            {hasError ? (\n              <Button\n                onClick={retry}\n                localizationKey={localizationKeys('signIn.protectCheck.retryButton')}\n              />\n            ) : null}\n          </Col>\n        </Card.Content>\n        <Card.Footer />\n      </Card.Root>\n    </Flow.Part>\n  );\n}\n\nexport const SignInProtectCheck = withRedirectToAfterSignIn(withCardStateProvider(SignInProtectCheckInternal));\n"],"mappings":"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"}

package/dist/components/SignIn/SignInStart.js

@@ -13,6 +13,8 @@ import { useCardState, withCardStateProvider } from "../../elements/contexts/ind
 import { Card } from "../../elements/Card/index.js";
 import { Header } from "../../elements/Header.js";
 import { handleError } from "../../utils/errorHandler.js";
+import { actionBlockedDetailsFrom } from "../../utils/actionBlocked.js";
+import { ActionBlockedCard } from "../../common/ActionBlockedCard.js";
 import { getIdentifierControlDisplayValues, groupIdentifiers } from "../../common/constants.js";
 import { Form } from "../../elements/Form.js";
 import { CaptchaElement } from "../../elements/CaptchaElement.js";
@@ -397,6 +399,8 @@ function SignInStartInternal() {
 	const { action, validLastAuthenticationStrategies, ...identifierFieldProps } = identifierField.props;
 	const lastAuthenticationStrategy = clerk.client?.lastAuthenticationStrategy;
 	const isIdentifierLastAuthenticationStrategy = lastAuthenticationStrategy && totalEnabledAuthMethods > 1 ? validLastAuthenticationStrategies?.has(lastAuthenticationStrategy) : false;
+	const blockedDetails = actionBlockedDetailsFrom(card.rawError);
+	if (blockedDetails) return /* @__PURE__ */ jsx(ActionBlockedCard, { details: blockedDetails });
 	return /* @__PURE__ */ jsx(Flow.Part, {
 		part: "start",
 		children: !alternativePhoneCodeProvider ? /* @__PURE__ */ jsxs(Card.Root, { children: [/* @__PURE__ */ jsxs(Card.Content, { children: [

package/dist/components/SignIn/SignInStart.js.map

@@ -1 +1 @@
-{"version":3,"file":"SignInStart.js","names":[],"sources":["../../../src/components/SignIn/SignInStart.tsx"],"sourcesContent":["import { getAlternativePhoneCodeProviderData } from '@clerk/shared/alternativePhoneCode';\nimport { ERROR_CODES, SIGN_UP_MODES } from '@clerk/shared/internal/clerk-js/constants';\nimport { clerkInvalidFAPIResponse } from '@clerk/shared/internal/clerk-js/errors';\nimport { getClerkQueryParam, removeClerkQueryParam } from '@clerk/shared/internal/clerk-js/queryParams';\nimport { useClerk } from '@clerk/shared/react';\nimport type {\n  ClerkAPIError,\n  PhoneCodeChannel,\n  PhoneCodeChannelData,\n  SignInCreateParams,\n  SignInResource,\n} from '@clerk/shared/types';\nimport { isWebAuthnAutofillSupported, isWebAuthnSupported } from '@clerk/shared/webauthn';\nimport { useEffect, useLayoutEffect, useMemo, useRef, useState } from 'react';\n\nimport { Card } from '@/ui/elements/Card';\nimport { useCardState, withCardStateProvider } from '@/ui/elements/contexts';\nimport { Form } from '@/ui/elements/Form';\nimport { Header } from '@/ui/elements/Header';\nimport { LoadingCard } from '@/ui/elements/LoadingCard';\nimport { SocialButtonsReversibleContainerWithDivider } from '@/ui/elements/ReversibleContainer';\nimport { handleError } from '@/ui/utils/errorHandler';\nimport { isMobileDevice } from '@/ui/utils/isMobileDevice';\nimport type { FormControlState } from '@/ui/utils/useFormControl';\nimport { buildRequest, useFormControl } from '@/ui/utils/useFormControl';\n\nimport type { SignInStartIdentifier } from '../../common';\nimport {\n  getIdentifierControlDisplayValues,\n  groupIdentifiers,\n  withRedirectToAfterSignIn,\n  withRedirectToSignInTask,\n} from '../../common';\nimport { useCoreSignIn, useEnvironment, useSignInContext } from '../../contexts';\nimport { Col, descriptors, Flow, localizationKeys } from '../../customizables';\nimport { CaptchaElement } from '../../elements/CaptchaElement';\nimport { useLoadingStatus } from '../../hooks';\nimport { useSupportEmail } from '../../hooks/useSupportEmail';\nimport { useTotalEnabledAuthMethods } from '../../hooks/useTotalEnabledAuthMethods';\nimport { useRouter } from '../../router';\nimport {\n  hasOnlyEnterpriseSSOFirstFactors,\n  shouldHandOffToEnterpriseConnection,\n  shouldHandOffUnidentifiedToEnterpriseConnection,\n} from './enterpriseSSOFactors';\nimport { handleCombinedFlowTransfer } from './handleCombinedFlowTransfer';\nimport { isProtectCheckRequiredError, navigateOnSignInProtectGate } from './handleProtectCheck';\nimport { SIGN_IN_RESET_PASSWORD_INTENT_PARAM, useHandleAuthenticateWithPasskey } from './shared';\nimport { SignInAlternativePhoneCodePhoneNumberCard } from './SignInAlternativePhoneCodePhoneNumberCard';\nimport { SignInSocialButtons } from './SignInSocialButtons';\nimport {\n  getPreferredAlternativePhoneChannel,\n  getPreferredAlternativePhoneChannelForCombinedFlow,\n  getSignUpAttributeFromIdentifier,\n} from './utils';\n\nconst useAutoFillPasskey = () => {\n  const [isSupported, setIsSupported] = useState(false);\n  const { navigate } = useRouter();\n  const onSecondFactor = () => navigate('factor-two');\n  const authenticateWithPasskey = useHandleAuthenticateWithPasskey(onSecondFactor, 'protect-check');\n  const { userSettings } = useEnvironment();\n  const { passkeySettings, attributes } = userSettings;\n  // @ts-expect-error - This is not a public API\n  const { __internal_isWebAuthnAutofillSupported } = useClerk();\n\n  useEffect(() => {\n    async function runAutofillPasskey() {\n      const _isSupported = await (__internal_isWebAuthnAutofillSupported ?? isWebAuthnAutofillSupported)();\n      setIsSupported(_isSupported);\n      if (!_isSupported) {\n        return;\n      }\n\n      await authenticateWithPasskey({ flow: 'autofill' });\n    }\n\n    if (passkeySettings.allow_autofill && attributes.passkey?.enabled) {\n      runAutofillPasskey();\n    }\n  }, []);\n\n  return {\n    isWebAuthnAutofillSupported: isSupported,\n  };\n};\n\nfunction SignInStartInternal(): JSX.Element {\n  const card = useCardState();\n  const clerk = useClerk();\n  const status = useLoadingStatus();\n  const { userSettings, authConfig } = useEnvironment();\n  const signIn = useCoreSignIn();\n  const { navigate } = useRouter();\n  const ctx = useSignInContext();\n  const { afterSignInUrl, signUpUrl, waitlistUrl, isCombinedFlow, signUpIfMissingEnabled, navigateOnSetActive } = ctx;\n  const supportEmail = useSupportEmail();\n  const totalEnabledAuthMethods = useTotalEnabledAuthMethods();\n  const identifierAttributes = useMemo<SignInStartIdentifier[]>(\n    () => groupIdentifiers(userSettings.enabledFirstFactorIdentifiers),\n    [userSettings.enabledFirstFactorIdentifiers],\n  );\n  const alternativePhoneCodeChannels = userSettings.alternativePhoneCodeChannels;\n\n  /**\n   * Passkeys\n   */\n  const { isWebAuthnAutofillSupported } = useAutoFillPasskey();\n  const onSecondFactor = () => navigate('factor-two');\n  const authenticateWithPasskey = useHandleAuthenticateWithPasskey(onSecondFactor, 'protect-check');\n  // @ts-expect-error - This is not a public API\n  const { __internal_isWebAuthnSupported } = clerk;\n  const isWebSupported = (__internal_isWebAuthnSupported ?? isWebAuthnSupported)();\n\n  const onlyPhoneNumberInitialValueExists =\n    !!ctx.initialValues?.phoneNumber && !(ctx.initialValues.emailAddress || ctx.initialValues.username);\n  const shouldStartWithPhoneNumberIdentifier =\n    onlyPhoneNumberInitialValueExists && identifierAttributes.includes('phone_number');\n  const [identifierAttribute, setIdentifierAttribute] = useState<SignInStartIdentifier>(\n    shouldStartWithPhoneNumberIdentifier ? 'phone_number' : identifierAttributes[0] || '',\n  );\n  const [hasSwitchedByAutofill, setHasSwitchedByAutofill] = useState(false);\n\n  const organizationTicket = getClerkQueryParam('__clerk_ticket') || '';\n  const clerkStatus = getClerkQueryParam('__clerk_status') || '';\n\n  const standardFormAttributes = userSettings.enabledFirstFactorIdentifiers;\n  const web3FirstFactors = userSettings.web3FirstFactors;\n  const authenticatableSocialStrategies = userSettings.authenticatableSocialStrategies;\n  const passwordBasedInstance = userSettings.instanceIsPasswordBased;\n  const { currentIdentifier, nextIdentifier } = getIdentifierControlDisplayValues(\n    identifierAttributes,\n    identifierAttribute,\n  );\n  const instantPasswordField = useFormControl('password', '', {\n    type: 'password',\n    label: localizationKeys('formFieldLabel__password'),\n    placeholder: localizationKeys('formFieldInputPlaceholder__password') as any,\n  });\n\n  const [alternativePhoneCodeProvider, setAlternativePhoneCodeProvider] = useState<PhoneCodeChannelData | null>(null);\n\n  const showAlternativePhoneCodeProviders = userSettings.alternativePhoneCodeChannels.length > 0;\n\n  const onAlternativePhoneCodeUseAnotherMethod = () => {\n    setAlternativePhoneCodeProvider(null);\n  };\n  const onAlternativePhoneCodeProviderClick = (phoneCodeChannel: PhoneCodeChannel) => {\n    const provider: PhoneCodeChannelData | null = getAlternativePhoneCodeProviderData(phoneCodeChannel) || null;\n    setAlternativePhoneCodeProvider(provider);\n  };\n\n  const ctxInitialValues = ctx.initialValues || {};\n  const initialValues: Record<SignInStartIdentifier, string | undefined> = useMemo(\n    () => ({\n      email_address: ctxInitialValues.emailAddress,\n      email_address_username: ctxInitialValues.emailAddress || ctxInitialValues.username,\n      username: ctxInitialValues.username,\n      phone_number: ctxInitialValues.phoneNumber,\n    }),\n    [ctx.initialValues],\n  );\n\n  const hasSocialOrWeb3Buttons =\n    !!authenticatableSocialStrategies.length || !!web3FirstFactors.length || !!alternativePhoneCodeChannels.length;\n  const [shouldAutofocus, setShouldAutofocus] = useState(!isMobileDevice() && !hasSocialOrWeb3Buttons);\n  // When the captcha escalates to an interactive challenge, spotlight it by collapsing/inerting the\n  // rest of the card (see the descriptors.main column below).\n  const [captchaIsInteractive, setCaptchaIsInteractive] = useState(false);\n  const textIdentifierField = useFormControl('identifier', initialValues[identifierAttribute] || '', {\n    ...currentIdentifier,\n    isRequired: true,\n    transformer: value => value.trim(),\n  });\n\n  const phoneIdentifierField = useFormControl('identifier', initialValues['phone_number'] || '', {\n    ...currentIdentifier,\n    isRequired: true,\n  });\n\n  const identifierField = identifierAttribute === 'phone_number' ? phoneIdentifierField : textIdentifierField;\n\n  const switchToNextIdentifier = () => {\n    setIdentifierAttribute(\n      i => identifierAttributes[(identifierAttributes.indexOf(i) + 1) % identifierAttributes.length],\n    );\n    setShouldAutofocus(true);\n    setHasSwitchedByAutofill(false);\n  };\n\n  const handlePhoneNumberPaste = (value: string) => {\n    textIdentifierField.setValue(initialValues[identifierAttribute] || '');\n    phoneIdentifierField.setValue(value);\n    setIdentifierAttribute('phone_number');\n    setShouldAutofocus(true);\n  };\n\n  // switch to the phone input (if available) if a \"+\" is entered\n  // (either by the browser or the user)\n  // this does not work in chrome as it does not fire the change event and the value is\n  // not available via js\n  useLayoutEffect(() => {\n    if (\n      identifierField.value.startsWith('+') &&\n      identifierAttributes.includes('phone_number') &&\n      identifierAttribute !== 'phone_number' &&\n      !hasSwitchedByAutofill\n    ) {\n      handlePhoneNumberPaste(identifierField.value);\n      // do not switch automatically on subsequent autofills\n      // by the browser to avoid a switch loop\n      setHasSwitchedByAutofill(true);\n    }\n  }, [identifierField.value, identifierAttributes]);\n\n  useEffect(() => {\n    if (!organizationTicket) {\n      return;\n    }\n\n    if (clerkStatus === 'sign_up') {\n      const paramsToForward = new URLSearchParams();\n      if (organizationTicket) {\n        paramsToForward.set('__clerk_ticket', organizationTicket);\n      }\n      // We explicitly navigate to 'create' in the combined flow to trigger a client-side navigation. Navigating to\n      // signUpUrl triggers a full page reload when used with the hash router.\n      void navigate(isCombinedFlow ? `create` : signUpUrl, { searchParams: paramsToForward });\n      return;\n    }\n\n    status.setLoading();\n    card.setLoading();\n    signIn\n      .create({\n        strategy: 'ticket',\n        ticket: organizationTicket,\n      })\n      .then(res => {\n        if (navigateOnSignInProtectGate(res, navigate, 'protect-check')) {\n          return;\n        }\n        switch (res.status) {\n          case 'needs_first_factor': {\n            if (!shouldHandOffToEnterpriseConnection(res)) {\n              return navigate('factor-one');\n            }\n\n            return authenticateWithEnterpriseSSO();\n          }\n          case 'needs_second_factor':\n            return navigate('factor-two');\n          case 'needs_client_trust':\n            return navigate('client-trust');\n          case 'complete':\n            removeClerkQueryParam('__clerk_ticket');\n            return clerk.setActive({\n              session: res.createdSessionId,\n              navigate: async ({ session, decorateUrl }) => {\n                await navigateOnSetActive({ session, redirectUrl: afterSignInUrl, decorateUrl });\n              },\n            });\n          default: {\n            console.error(clerkInvalidFAPIResponse(res.status, supportEmail));\n            return;\n          }\n        }\n      })\n      .catch(err => {\n        return attemptToRecoverFromSignInError(err);\n      })\n      .finally(() => {\n        // Keep the card in loading state during SSO redirect to prevent UI flicker\n        // This is necessary because there's a brief delay between initiating the SSO flow\n        // and the actual redirect to the external Identity Provider\n        const isRedirectingToSSOProvider = !!hasOnlyEnterpriseSSOFirstFactors(signIn);\n        if (isRedirectingToSSOProvider) {\n          return;\n        }\n\n        status.setIdle();\n        card.setIdle();\n      });\n  }, []);\n\n  useEffect(() => {\n    async function handleOauthError() {\n      const defaultErrorHandler = () => {\n        // Error from server may be too much information for the end user, so set a generic error\n        card.setError('Unable to complete action at this time. If the problem persists please contact support.');\n      };\n\n      const error = signIn?.firstFactorVerification?.error;\n      if (error) {\n        switch (error.code) {\n          case ERROR_CODES.NOT_ALLOWED_TO_SIGN_UP:\n          case ERROR_CODES.OAUTH_ACCESS_DENIED:\n          case ERROR_CODES.NOT_ALLOWED_ACCESS:\n          case ERROR_CODES.SAML_USER_ATTRIBUTE_MISSING:\n          case ERROR_CODES.OAUTH_EMAIL_DOMAIN_RESERVED_BY_SAML:\n          case ERROR_CODES.USER_LOCKED:\n          case ERROR_CODES.EXTERNAL_ACCOUNT_NOT_FOUND:\n          case ERROR_CODES.SIGN_UP_MODE_RESTRICTED:\n          case ERROR_CODES.SIGN_UP_MODE_RESTRICTED_WAITLIST:\n          case ERROR_CODES.ENTERPRISE_SSO_USER_ATTRIBUTE_MISSING:\n          case ERROR_CODES.ENTERPRISE_SSO_EMAIL_ADDRESS_DOMAIN_MISMATCH:\n          case ERROR_CODES.ENTERPRISE_SSO_HOSTED_DOMAIN_MISMATCH:\n          case ERROR_CODES.SAML_EMAIL_ADDRESS_DOMAIN_MISMATCH:\n          case ERROR_CODES.ORGANIZATION_MEMBERSHIP_QUOTA_EXCEEDED_FOR_SSO:\n          case ERROR_CODES.CAPTCHA_INVALID:\n          case ERROR_CODES.FRAUD_DEVICE_BLOCKED:\n          case ERROR_CODES.FRAUD_ACTION_BLOCKED:\n          case ERROR_CODES.SIGNUP_RATE_LIMIT_EXCEEDED:\n          case ERROR_CODES.USER_BANNED:\n          case ERROR_CODES.USER_DEACTIVATED:\n            card.setError(error);\n            break;\n          default:\n            defaultErrorHandler();\n        }\n\n        // TODO: This is a workaround in order to reset the sign in attempt\n        // so that the oauth error does not persist on full page reloads.\n        void (await signIn.create({}));\n      }\n    }\n\n    void handleOauthError();\n  }, []);\n\n  const buildSignInParams = (fields: Array<FormControlState<string>>): SignInCreateParams => {\n    const hasPassword = fields.some(f => f.name === 'password' && !!f.value);\n\n    /**\n     * FAPI will return an error when password is submitted but the user's email matches requires enterprise sso authentication.\n     * We need to strip password from the create request, and reconstruct it later.\n     */\n    if (!hasPassword || userSettings.enterpriseSSO.enabled) {\n      fields = fields.filter(f => f.name !== 'password');\n    }\n    return {\n      ...buildRequest(fields),\n      ...(hasPassword && !userSettings.enterpriseSSO.enabled && { strategy: 'password' }),\n    } as SignInCreateParams;\n  };\n\n  const safePasswordSignInForEnterpriseSSOInstance = (\n    signInCreatePromise: Promise<SignInResource>,\n    fields: Array<FormControlState<string>>,\n  ) => {\n    return signInCreatePromise.then(signInResource => {\n      if (!userSettings.enterpriseSSO.enabled) {\n        return signInResource;\n      }\n      /**\n       * For instances with Enterprise SSO enabled, perform sign in with password only when it is allowed for the identified user.\n       */\n      const passwordField = fields.find(f => f.name === 'password')?.value;\n      if (!passwordField || signInResource.supportedFirstFactors?.some(ff => ff.strategy === 'enterprise_sso')) {\n        return signInResource;\n      }\n      return signInResource.attemptFirstFactor({ strategy: 'password', password: passwordField });\n    });\n  };\n\n  const signInWithFields = async (\n    fields: Array<FormControlState<string>>,\n    options?: { resetPasswordIntent?: boolean },\n  ) => {\n    // If the user has already selected an alternative phone code provider, we use that.\n    const preferredAlternativePhoneChannel =\n      alternativePhoneCodeProvider?.channel ||\n      getPreferredAlternativePhoneChannel(fields, authConfig.preferredChannels, 'identifier');\n    if (preferredAlternativePhoneChannel) {\n      // We need to send the alternative phone code provider channel in the sign in request\n      // together with the phone_code strategy, in order for FAPI to create a Verification upon this first request.\n      const noop = () => {};\n      fields.push({\n        id: 'strategy',\n        value: 'phone_code',\n        clearFeedback: noop,\n        setValue: noop,\n        onChange: noop,\n        setError: noop,\n      } as any);\n      fields.push({\n        id: 'channel',\n        value: preferredAlternativePhoneChannel,\n        clearFeedback: noop,\n        setValue: noop,\n        onChange: noop,\n        setError: noop,\n      } as any);\n    }\n    try {\n      // On top of the context-level preconditions, sign-up-if-missing only\n      // supports identifiers that can be verified out-of-band.\n      const hasPassword = fields.some(f => f.name === 'password' && !!f.value);\n      const signUpAttribute = getSignUpAttributeFromIdentifier(identifierField);\n      const shouldSignUpIfMissing = signUpIfMissingEnabled && signUpAttribute !== 'username' && !hasPassword;\n\n      const res = await safePasswordSignInForEnterpriseSSOInstance(\n        signIn.create({\n          ...buildSignInParams(fields),\n          ...(shouldSignUpIfMissing && { signUpIfMissing: true }),\n        }),\n        fields,\n      );\n\n      if (navigateOnSignInProtectGate(res, navigate, 'protect-check')) {\n        return;\n      }\n\n      switch (res.status) {\n        case 'needs_identifier':\n          // Check if we need to initiate an enterprise sso flow\n          if (shouldHandOffUnidentifiedToEnterpriseConnection(res)) {\n            await authenticateWithEnterpriseSSO();\n          }\n          break;\n        case 'needs_first_factor': {\n          if (!shouldHandOffToEnterpriseConnection(res)) {\n            if (options?.resetPasswordIntent) {\n              return navigate('factor-one', {\n                searchParams: new URLSearchParams({ [SIGN_IN_RESET_PASSWORD_INTENT_PARAM]: 'true' }),\n              });\n            }\n            return navigate('factor-one');\n          }\n\n          // Awaited so a failed hand-off reaches the catch below instead of escaping this try.\n          return await authenticateWithEnterpriseSSO();\n        }\n        case 'needs_second_factor':\n          return navigate('factor-two');\n        case 'needs_client_trust':\n          return navigate('client-trust');\n        case 'complete':\n          return clerk.setActive({\n            session: res.createdSessionId,\n            navigate: async ({ session, decorateUrl }) => {\n              await navigateOnSetActive({ session, redirectUrl: afterSignInUrl, decorateUrl });\n            },\n          });\n        default: {\n          console.error(clerkInvalidFAPIResponse(res.status, supportEmail));\n          return;\n        }\n      }\n    } catch (e: any) {\n      return attemptToRecoverFromSignInError(e);\n    }\n  };\n\n  const authenticateWithEnterpriseSSO = async () => {\n    const redirectUrl = ctx.ssoCallbackUrl;\n    const redirectUrlComplete = ctx.afterSignInUrl || '/';\n\n    try {\n      await signIn.authenticateWithRedirect({\n        strategy: 'enterprise_sso',\n        redirectUrl,\n        redirectUrlComplete,\n        oidcPrompt: ctx.oidcPrompt,\n        continueSignIn: true,\n      });\n    } catch (err) {\n      // Preparing the hand-off can itself raise a challenge. No redirect was issued and the sign-in\n      // is sitting on the gate instead. Handled here because the callers' recovery path drops\n      // errors that didn't come from the API.\n      if (isProtectCheckRequiredError(err) && navigateOnSignInProtectGate(signIn, navigate, 'protect-check')) {\n        return;\n      }\n      throw err;\n    }\n  };\n\n  const attemptToRecoverFromSignInError = async (e: any) => {\n    if (!e.errors) {\n      return;\n    }\n    const instantPasswordError: ClerkAPIError = e.errors.find(\n      (e: ClerkAPIError) =>\n        e.code === ERROR_CODES.INVALID_STRATEGY_FOR_USER ||\n        e.code === ERROR_CODES.FORM_PASSWORD_INCORRECT ||\n        e.code === ERROR_CODES.FORM_PASSWORD_PWNED,\n    );\n\n    const sessionAlreadyExistsError: ClerkAPIError = e.errors.find(\n      (e: ClerkAPIError) => e.code === ERROR_CODES.SESSION_EXISTS,\n    );\n    const alreadySignedInError: ClerkAPIError = e.errors.find(\n      (e: ClerkAPIError) => e.code === 'identifier_already_signed_in',\n    );\n    const accountDoesNotExistError: ClerkAPIError = e.errors.find(\n      (e: ClerkAPIError) =>\n        e.code === ERROR_CODES.INVITATION_ACCOUNT_NOT_EXISTS || e.code === ERROR_CODES.FORM_IDENTIFIER_NOT_FOUND,\n    );\n\n    if (instantPasswordError) {\n      await signInWithFields([identifierField]);\n    } else if (sessionAlreadyExistsError) {\n      await clerk.setActive({\n        session: clerk.client.lastActiveSessionId,\n        navigate: async ({ session, decorateUrl }) => {\n          await navigateOnSetActive({ session, redirectUrl: afterSignInUrl, decorateUrl });\n        },\n      });\n    } else if (alreadySignedInError) {\n      // eslint-disable-next-line @typescript-eslint/no-non-null-assertion\n      const sid = alreadySignedInError.meta!.sessionId!;\n      await clerk.setActive({\n        session: sid,\n        navigate: async ({ session, decorateUrl }) => {\n          await navigateOnSetActive({ session, redirectUrl: afterSignInUrl, decorateUrl });\n        },\n      });\n    } else if (isCombinedFlow && accountDoesNotExistError) {\n      const attribute = getSignUpAttributeFromIdentifier(identifierField);\n\n      if (userSettings.signUp.mode === SIGN_UP_MODES.WAITLIST) {\n        const waitlistUrl = clerk.buildWaitlistUrl(\n          attribute === 'emailAddress'\n            ? {\n                initialValues: {\n                  [attribute]: identifierField.value,\n                },\n              }\n            : {},\n        );\n        return navigate(waitlistUrl);\n      }\n\n      clerk.client.signUp[attribute] = identifierField.value;\n\n      const redirectUrl = ctx.ssoCallbackUrl;\n      const redirectUrlComplete = ctx.afterSignUpUrl || '/';\n\n      return handleCombinedFlowTransfer({\n        afterSignUpUrl: ctx.afterSignUpUrl || '/',\n        clerk,\n        handleError: e => handleError(e, [identifierField, instantPasswordField], card.setError),\n        identifierAttribute: attribute,\n        identifierValue: identifierField.value,\n        navigate,\n        organizationTicket,\n        signUpMode: userSettings.signUp.mode,\n        redirectUrl,\n        redirectUrlComplete,\n        oidcPrompt: ctx.oidcPrompt,\n        navigateOnSetActive,\n        passwordEnabled: userSettings.attributes.password?.required ?? false,\n        alternativePhoneCodeChannel:\n          alternativePhoneCodeProvider?.channel ||\n          getPreferredAlternativePhoneChannelForCombinedFlow(\n            authConfig.preferredChannels,\n            attribute,\n            identifierField.value,\n          ),\n        unsafeMetadata: ctx.unsafeMetadata,\n      });\n    } else {\n      handleError(e, [identifierField, instantPasswordField], card.setError);\n    }\n  };\n\n  const handleFirstPartySubmit = async (e: React.FormEvent<HTMLFormElement>) => {\n    e.preventDefault();\n    return signInWithFields([identifierField, instantPasswordField]);\n  };\n\n  const handleForgotPasswordClick: React.MouseEventHandler = e => {\n    e.preventDefault();\n    // Surface the same native required-field validation as the Continue button\n    // when the identifier is missing\n    const form = e.currentTarget.closest('form');\n    if (form && !form.reportValidity()) {\n      return;\n    }\n    void signInWithFields([identifierField], { resetPasswordIntent: true });\n  };\n\n  const DynamicField = useMemo(() => {\n    const components = {\n      tel: Form.PhoneInput,\n      password: Form.PasswordInput,\n      text: Form.PlainInput,\n      email: Form.PlainInput,\n    };\n\n    return components[identifierField.type as keyof typeof components];\n  }, [identifierField.type]);\n\n  if (status.isLoading || clerkStatus === 'sign_up') {\n    // clerkStatus being sign_up will trigger a navigation to the sign up flow, so show a loading card instead of\n    // rendering the sign in flow.\n    return <LoadingCard />;\n  }\n\n  // @ts-expect-error `action` is not typed\n  const { action, validLastAuthenticationStrategies, ...identifierFieldProps } = identifierField.props;\n\n  const lastAuthenticationStrategy = clerk.client?.lastAuthenticationStrategy;\n  const isIdentifierLastAuthenticationStrategy =\n    lastAuthenticationStrategy && totalEnabledAuthMethods > 1\n      ? validLastAuthenticationStrategies?.has(lastAuthenticationStrategy)\n      : false;\n\n  return (\n    <Flow.Part part='start'>\n      {!alternativePhoneCodeProvider ? (\n        <Card.Root>\n          <Card.Content>\n            <Header.Root showLogo>\n              <Header.Title\n                localizationKey={\n                  isCombinedFlow\n                    ? localizationKeys('signIn.start.titleCombined')\n                    : localizationKeys('signIn.start.title')\n                }\n              />\n              <Header.Subtitle\n                localizationKey={\n                  isCombinedFlow\n                    ? localizationKeys('signIn.start.subtitleCombined')\n                    : localizationKeys('signIn.start.subtitle')\n                }\n                sx={{\n                  '&:empty': {\n                    display: 'none',\n                  },\n                }}\n              />\n            </Header.Root>\n            <Card.Alert>{card.error}</Card.Alert>\n            {/*TODO: extract main in its own component */}\n            <Col\n              elementDescriptor={descriptors.main}\n              gap={6}\n              // @ts-ignore - `inert` is not yet in the installed React types\n              inert={captchaIsInteractive ? '' : undefined}\n              // `display:none` (not `visibility:hidden`) so the collapsed column leaves flex flow and\n              // contributes no `gap` gutter to `Card.Content` — otherwise it injects empty space above\n              // the spotlighted captcha. Subtree stays mounted (form state preserved); `inert` is then\n              // redundant-but-harmless.\n              sx={captchaIsInteractive ? { display: 'none' } : undefined}\n            >\n              <SocialButtonsReversibleContainerWithDivider>\n                {hasSocialOrWeb3Buttons && (\n                  <SignInSocialButtons\n                    enableWeb3Providers\n                    enableOAuthProviders\n                    enableAlternativePhoneCodeProviders={showAlternativePhoneCodeProviders}\n                    onAlternativePhoneCodeProviderClick={onAlternativePhoneCodeProviderClick}\n                  />\n                )}\n                {standardFormAttributes.length ? (\n                  <Form.Root\n                    onSubmit={handleFirstPartySubmit}\n                    gap={8}\n                  >\n                    <Col gap={6}>\n                      <Form.ControlRow elementId={identifierField.id}>\n                        <DynamicField\n                          actionLabel={nextIdentifier?.action}\n                          onActionClicked={switchToNextIdentifier}\n                          {...identifierFieldProps}\n                          autoFocus={shouldAutofocus}\n                          autoComplete={isWebAuthnAutofillSupported ? 'webauthn' : undefined}\n                          isLastAuthenticationStrategy={isIdentifierLastAuthenticationStrategy}\n                        />\n                      </Form.ControlRow>\n                      <InstantPasswordRow\n                        field={passwordBasedInstance ? instantPasswordField : undefined}\n                        onForgotPasswordClick={handleForgotPasswordClick}\n                      />\n                    </Col>\n                    <Col center>\n                      <Form.SubmitButton hasArrow />\n                    </Col>\n                  </Form.Root>\n                ) : null}\n              </SocialButtonsReversibleContainerWithDivider>\n            </Col>\n            <CaptchaElement\n              gapless\n              onInteractiveChange={setCaptchaIsInteractive}\n            />\n            {/* Kept outside descriptors.main so the spotlight's `inert` leaves this alternative action reachable. */}\n            {userSettings.attributes.passkey?.enabled &&\n              userSettings.passkeySettings.show_sign_in_button &&\n              isWebSupported && (\n                <Card.Action elementId={'usePasskey'}>\n                  <Card.ActionLink\n                    localizationKey={localizationKeys('signIn.start.actionLink__use_passkey')}\n                    onClick={() => authenticateWithPasskey({ flow: 'discoverable' })}\n                  />\n                </Card.Action>\n              )}\n          </Card.Content>\n          <Card.Footer>\n            {userSettings.signUp.mode === SIGN_UP_MODES.PUBLIC && !isCombinedFlow && (\n              <Card.Action elementId='signIn'>\n                <Card.ActionText localizationKey={localizationKeys('signIn.start.actionText')} />\n                <Card.ActionLink\n                  localizationKey={localizationKeys('signIn.start.actionLink')}\n                  to={clerk.buildUrlWithAuth(signUpUrl)}\n                />\n              </Card.Action>\n            )}\n            {userSettings.signUp.mode === SIGN_UP_MODES.WAITLIST && (\n              <Card.Action elementId='signIn'>\n                <Card.ActionText localizationKey={localizationKeys('signIn.start.actionText__join_waitlist')} />\n                <Card.ActionLink\n                  localizationKey={localizationKeys('signIn.start.actionLink__join_waitlist')}\n                  to={clerk.buildUrlWithAuth(waitlistUrl)}\n                />\n              </Card.Action>\n            )}\n          </Card.Footer>\n        </Card.Root>\n      ) : (\n        <SignInAlternativePhoneCodePhoneNumberCard\n          handleSubmit={handleFirstPartySubmit}\n          phoneNumberFormState={phoneIdentifierField}\n          onUseAnotherMethod={onAlternativePhoneCodeUseAnotherMethod}\n          phoneCodeProvider={alternativePhoneCodeProvider}\n        />\n      )}\n    </Flow.Part>\n  );\n}\n\nconst InstantPasswordRow = ({\n  field,\n  onForgotPasswordClick,\n}: {\n  field?: FormControlState<'password'>;\n  onForgotPasswordClick?: React.MouseEventHandler;\n}) => {\n  const [autofilled, setAutofilled] = useState(false);\n  const ref = useRef<HTMLInputElement>(null);\n  const show = !!(autofilled || field?.value);\n\n  // show password if it's autofilled by the browser\n  useLayoutEffect(() => {\n    const intervalId = setInterval(() => {\n      if (ref?.current) {\n        const autofilled =\n          window.getComputedStyle(ref.current, ':autofill').animationName === 'onAutoFillStart' ||\n          // https://github.com/facebook/react/issues/1159#issuecomment-1025423604\n          !!ref.current?.matches('*:-webkit-autofill');\n        if (autofilled) {\n          setAutofilled(autofilled);\n          clearInterval(intervalId);\n        }\n      }\n    }, 500);\n\n    return () => {\n      clearInterval(intervalId);\n    };\n  }, []);\n\n  useEffect(() => {\n    //if the field receives a value, we default to normal behaviour\n    if (field?.value && field.value !== '') {\n      setAutofilled(false);\n    }\n  }, [field?.value]);\n\n  if (!field) {\n    return null;\n  }\n\n  return (\n    <Form.ControlRow\n      elementId={field.id}\n      aria-hidden={show ? undefined : true}\n      sx={\n        show\n          ? undefined\n          : {\n              position: 'absolute',\n              opacity: 0,\n              height: 0,\n              overflow: 'hidden',\n              pointerEvents: 'none',\n              marginTop: '-1rem',\n            }\n      }\n    >\n      <Form.PasswordInput\n        {...field.props}\n        actionLabel={show ? localizationKeys('formFieldAction__forgotPassword') : undefined}\n        onActionClicked={show ? onForgotPasswordClick : undefined}\n        tabIndex={show ? undefined : -1}\n        ref={ref}\n      />\n    </Form.ControlRow>\n  );\n};\n\nexport const SignInStart = withRedirectToSignInTask(\n  withRedirectToAfterSignIn(withCardStateProvider(SignInStartInternal)),\n);\n"],"mappings":"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"}
+{"version":3,"file":"SignInStart.js","names":[],"sources":["../../../src/components/SignIn/SignInStart.tsx"],"sourcesContent":["import { getAlternativePhoneCodeProviderData } from '@clerk/shared/alternativePhoneCode';\nimport { ERROR_CODES, SIGN_UP_MODES } from '@clerk/shared/internal/clerk-js/constants';\nimport { clerkInvalidFAPIResponse } from '@clerk/shared/internal/clerk-js/errors';\nimport { getClerkQueryParam, removeClerkQueryParam } from '@clerk/shared/internal/clerk-js/queryParams';\nimport { useClerk } from '@clerk/shared/react';\nimport type {\n  ClerkAPIError,\n  PhoneCodeChannel,\n  PhoneCodeChannelData,\n  SignInCreateParams,\n  SignInResource,\n} from '@clerk/shared/types';\nimport { isWebAuthnAutofillSupported, isWebAuthnSupported } from '@clerk/shared/webauthn';\nimport { useEffect, useLayoutEffect, useMemo, useRef, useState } from 'react';\n\nimport { Card } from '@/ui/elements/Card';\nimport { useCardState, withCardStateProvider } from '@/ui/elements/contexts';\nimport { Form } from '@/ui/elements/Form';\nimport { Header } from '@/ui/elements/Header';\nimport { LoadingCard } from '@/ui/elements/LoadingCard';\nimport { SocialButtonsReversibleContainerWithDivider } from '@/ui/elements/ReversibleContainer';\nimport { actionBlockedDetailsFrom } from '@/ui/utils/actionBlocked';\nimport { handleError } from '@/ui/utils/errorHandler';\nimport { isMobileDevice } from '@/ui/utils/isMobileDevice';\nimport type { FormControlState } from '@/ui/utils/useFormControl';\nimport { buildRequest, useFormControl } from '@/ui/utils/useFormControl';\n\nimport type { SignInStartIdentifier } from '../../common';\nimport {\n  ActionBlockedCard,\n  getIdentifierControlDisplayValues,\n  groupIdentifiers,\n  withRedirectToAfterSignIn,\n  withRedirectToSignInTask,\n} from '../../common';\nimport { useCoreSignIn, useEnvironment, useSignInContext } from '../../contexts';\nimport { Col, descriptors, Flow, localizationKeys } from '../../customizables';\nimport { CaptchaElement } from '../../elements/CaptchaElement';\nimport { useLoadingStatus } from '../../hooks';\nimport { useSupportEmail } from '../../hooks/useSupportEmail';\nimport { useTotalEnabledAuthMethods } from '../../hooks/useTotalEnabledAuthMethods';\nimport { useRouter } from '../../router';\nimport {\n  hasOnlyEnterpriseSSOFirstFactors,\n  shouldHandOffToEnterpriseConnection,\n  shouldHandOffUnidentifiedToEnterpriseConnection,\n} from './enterpriseSSOFactors';\nimport { handleCombinedFlowTransfer } from './handleCombinedFlowTransfer';\nimport { isProtectCheckRequiredError, navigateOnSignInProtectGate } from './handleProtectCheck';\nimport { SIGN_IN_RESET_PASSWORD_INTENT_PARAM, useHandleAuthenticateWithPasskey } from './shared';\nimport { SignInAlternativePhoneCodePhoneNumberCard } from './SignInAlternativePhoneCodePhoneNumberCard';\nimport { SignInSocialButtons } from './SignInSocialButtons';\nimport {\n  getPreferredAlternativePhoneChannel,\n  getPreferredAlternativePhoneChannelForCombinedFlow,\n  getSignUpAttributeFromIdentifier,\n} from './utils';\n\nconst useAutoFillPasskey = () => {\n  const [isSupported, setIsSupported] = useState(false);\n  const { navigate } = useRouter();\n  const onSecondFactor = () => navigate('factor-two');\n  const authenticateWithPasskey = useHandleAuthenticateWithPasskey(onSecondFactor, 'protect-check');\n  const { userSettings } = useEnvironment();\n  const { passkeySettings, attributes } = userSettings;\n  // @ts-expect-error - This is not a public API\n  const { __internal_isWebAuthnAutofillSupported } = useClerk();\n\n  useEffect(() => {\n    async function runAutofillPasskey() {\n      const _isSupported = await (__internal_isWebAuthnAutofillSupported ?? isWebAuthnAutofillSupported)();\n      setIsSupported(_isSupported);\n      if (!_isSupported) {\n        return;\n      }\n\n      await authenticateWithPasskey({ flow: 'autofill' });\n    }\n\n    if (passkeySettings.allow_autofill && attributes.passkey?.enabled) {\n      runAutofillPasskey();\n    }\n  }, []);\n\n  return {\n    isWebAuthnAutofillSupported: isSupported,\n  };\n};\n\nfunction SignInStartInternal(): JSX.Element {\n  const card = useCardState();\n  const clerk = useClerk();\n  const status = useLoadingStatus();\n  const { userSettings, authConfig } = useEnvironment();\n  const signIn = useCoreSignIn();\n  const { navigate } = useRouter();\n  const ctx = useSignInContext();\n  const { afterSignInUrl, signUpUrl, waitlistUrl, isCombinedFlow, signUpIfMissingEnabled, navigateOnSetActive } = ctx;\n  const supportEmail = useSupportEmail();\n  const totalEnabledAuthMethods = useTotalEnabledAuthMethods();\n  const identifierAttributes = useMemo<SignInStartIdentifier[]>(\n    () => groupIdentifiers(userSettings.enabledFirstFactorIdentifiers),\n    [userSettings.enabledFirstFactorIdentifiers],\n  );\n  const alternativePhoneCodeChannels = userSettings.alternativePhoneCodeChannels;\n\n  /**\n   * Passkeys\n   */\n  const { isWebAuthnAutofillSupported } = useAutoFillPasskey();\n  const onSecondFactor = () => navigate('factor-two');\n  const authenticateWithPasskey = useHandleAuthenticateWithPasskey(onSecondFactor, 'protect-check');\n  // @ts-expect-error - This is not a public API\n  const { __internal_isWebAuthnSupported } = clerk;\n  const isWebSupported = (__internal_isWebAuthnSupported ?? isWebAuthnSupported)();\n\n  const onlyPhoneNumberInitialValueExists =\n    !!ctx.initialValues?.phoneNumber && !(ctx.initialValues.emailAddress || ctx.initialValues.username);\n  const shouldStartWithPhoneNumberIdentifier =\n    onlyPhoneNumberInitialValueExists && identifierAttributes.includes('phone_number');\n  const [identifierAttribute, setIdentifierAttribute] = useState<SignInStartIdentifier>(\n    shouldStartWithPhoneNumberIdentifier ? 'phone_number' : identifierAttributes[0] || '',\n  );\n  const [hasSwitchedByAutofill, setHasSwitchedByAutofill] = useState(false);\n\n  const organizationTicket = getClerkQueryParam('__clerk_ticket') || '';\n  const clerkStatus = getClerkQueryParam('__clerk_status') || '';\n\n  const standardFormAttributes = userSettings.enabledFirstFactorIdentifiers;\n  const web3FirstFactors = userSettings.web3FirstFactors;\n  const authenticatableSocialStrategies = userSettings.authenticatableSocialStrategies;\n  const passwordBasedInstance = userSettings.instanceIsPasswordBased;\n  const { currentIdentifier, nextIdentifier } = getIdentifierControlDisplayValues(\n    identifierAttributes,\n    identifierAttribute,\n  );\n  const instantPasswordField = useFormControl('password', '', {\n    type: 'password',\n    label: localizationKeys('formFieldLabel__password'),\n    placeholder: localizationKeys('formFieldInputPlaceholder__password') as any,\n  });\n\n  const [alternativePhoneCodeProvider, setAlternativePhoneCodeProvider] = useState<PhoneCodeChannelData | null>(null);\n\n  const showAlternativePhoneCodeProviders = userSettings.alternativePhoneCodeChannels.length > 0;\n\n  const onAlternativePhoneCodeUseAnotherMethod = () => {\n    setAlternativePhoneCodeProvider(null);\n  };\n  const onAlternativePhoneCodeProviderClick = (phoneCodeChannel: PhoneCodeChannel) => {\n    const provider: PhoneCodeChannelData | null = getAlternativePhoneCodeProviderData(phoneCodeChannel) || null;\n    setAlternativePhoneCodeProvider(provider);\n  };\n\n  const ctxInitialValues = ctx.initialValues || {};\n  const initialValues: Record<SignInStartIdentifier, string | undefined> = useMemo(\n    () => ({\n      email_address: ctxInitialValues.emailAddress,\n      email_address_username: ctxInitialValues.emailAddress || ctxInitialValues.username,\n      username: ctxInitialValues.username,\n      phone_number: ctxInitialValues.phoneNumber,\n    }),\n    [ctx.initialValues],\n  );\n\n  const hasSocialOrWeb3Buttons =\n    !!authenticatableSocialStrategies.length || !!web3FirstFactors.length || !!alternativePhoneCodeChannels.length;\n  const [shouldAutofocus, setShouldAutofocus] = useState(!isMobileDevice() && !hasSocialOrWeb3Buttons);\n  // When the captcha escalates to an interactive challenge, spotlight it by collapsing/inerting the\n  // rest of the card (see the descriptors.main column below).\n  const [captchaIsInteractive, setCaptchaIsInteractive] = useState(false);\n  const textIdentifierField = useFormControl('identifier', initialValues[identifierAttribute] || '', {\n    ...currentIdentifier,\n    isRequired: true,\n    transformer: value => value.trim(),\n  });\n\n  const phoneIdentifierField = useFormControl('identifier', initialValues['phone_number'] || '', {\n    ...currentIdentifier,\n    isRequired: true,\n  });\n\n  const identifierField = identifierAttribute === 'phone_number' ? phoneIdentifierField : textIdentifierField;\n\n  const switchToNextIdentifier = () => {\n    setIdentifierAttribute(\n      i => identifierAttributes[(identifierAttributes.indexOf(i) + 1) % identifierAttributes.length],\n    );\n    setShouldAutofocus(true);\n    setHasSwitchedByAutofill(false);\n  };\n\n  const handlePhoneNumberPaste = (value: string) => {\n    textIdentifierField.setValue(initialValues[identifierAttribute] || '');\n    phoneIdentifierField.setValue(value);\n    setIdentifierAttribute('phone_number');\n    setShouldAutofocus(true);\n  };\n\n  // switch to the phone input (if available) if a \"+\" is entered\n  // (either by the browser or the user)\n  // this does not work in chrome as it does not fire the change event and the value is\n  // not available via js\n  useLayoutEffect(() => {\n    if (\n      identifierField.value.startsWith('+') &&\n      identifierAttributes.includes('phone_number') &&\n      identifierAttribute !== 'phone_number' &&\n      !hasSwitchedByAutofill\n    ) {\n      handlePhoneNumberPaste(identifierField.value);\n      // do not switch automatically on subsequent autofills\n      // by the browser to avoid a switch loop\n      setHasSwitchedByAutofill(true);\n    }\n  }, [identifierField.value, identifierAttributes]);\n\n  useEffect(() => {\n    if (!organizationTicket) {\n      return;\n    }\n\n    if (clerkStatus === 'sign_up') {\n      const paramsToForward = new URLSearchParams();\n      if (organizationTicket) {\n        paramsToForward.set('__clerk_ticket', organizationTicket);\n      }\n      // We explicitly navigate to 'create' in the combined flow to trigger a client-side navigation. Navigating to\n      // signUpUrl triggers a full page reload when used with the hash router.\n      void navigate(isCombinedFlow ? `create` : signUpUrl, { searchParams: paramsToForward });\n      return;\n    }\n\n    status.setLoading();\n    card.setLoading();\n    signIn\n      .create({\n        strategy: 'ticket',\n        ticket: organizationTicket,\n      })\n      .then(res => {\n        if (navigateOnSignInProtectGate(res, navigate, 'protect-check')) {\n          return;\n        }\n        switch (res.status) {\n          case 'needs_first_factor': {\n            if (!shouldHandOffToEnterpriseConnection(res)) {\n              return navigate('factor-one');\n            }\n\n            return authenticateWithEnterpriseSSO();\n          }\n          case 'needs_second_factor':\n            return navigate('factor-two');\n          case 'needs_client_trust':\n            return navigate('client-trust');\n          case 'complete':\n            removeClerkQueryParam('__clerk_ticket');\n            return clerk.setActive({\n              session: res.createdSessionId,\n              navigate: async ({ session, decorateUrl }) => {\n                await navigateOnSetActive({ session, redirectUrl: afterSignInUrl, decorateUrl });\n              },\n            });\n          default: {\n            console.error(clerkInvalidFAPIResponse(res.status, supportEmail));\n            return;\n          }\n        }\n      })\n      .catch(err => {\n        return attemptToRecoverFromSignInError(err);\n      })\n      .finally(() => {\n        // Keep the card in loading state during SSO redirect to prevent UI flicker\n        // This is necessary because there's a brief delay between initiating the SSO flow\n        // and the actual redirect to the external Identity Provider\n        const isRedirectingToSSOProvider = !!hasOnlyEnterpriseSSOFirstFactors(signIn);\n        if (isRedirectingToSSOProvider) {\n          return;\n        }\n\n        status.setIdle();\n        card.setIdle();\n      });\n  }, []);\n\n  useEffect(() => {\n    async function handleOauthError() {\n      const defaultErrorHandler = () => {\n        // Error from server may be too much information for the end user, so set a generic error\n        card.setError('Unable to complete action at this time. If the problem persists please contact support.');\n      };\n\n      const error = signIn?.firstFactorVerification?.error;\n      if (error) {\n        switch (error.code) {\n          case ERROR_CODES.NOT_ALLOWED_TO_SIGN_UP:\n          case ERROR_CODES.OAUTH_ACCESS_DENIED:\n          case ERROR_CODES.NOT_ALLOWED_ACCESS:\n          case ERROR_CODES.SAML_USER_ATTRIBUTE_MISSING:\n          case ERROR_CODES.OAUTH_EMAIL_DOMAIN_RESERVED_BY_SAML:\n          case ERROR_CODES.USER_LOCKED:\n          case ERROR_CODES.EXTERNAL_ACCOUNT_NOT_FOUND:\n          case ERROR_CODES.SIGN_UP_MODE_RESTRICTED:\n          case ERROR_CODES.SIGN_UP_MODE_RESTRICTED_WAITLIST:\n          case ERROR_CODES.ENTERPRISE_SSO_USER_ATTRIBUTE_MISSING:\n          case ERROR_CODES.ENTERPRISE_SSO_EMAIL_ADDRESS_DOMAIN_MISMATCH:\n          case ERROR_CODES.ENTERPRISE_SSO_HOSTED_DOMAIN_MISMATCH:\n          case ERROR_CODES.SAML_EMAIL_ADDRESS_DOMAIN_MISMATCH:\n          case ERROR_CODES.ORGANIZATION_MEMBERSHIP_QUOTA_EXCEEDED_FOR_SSO:\n          case ERROR_CODES.CAPTCHA_INVALID:\n          case ERROR_CODES.FRAUD_DEVICE_BLOCKED:\n          case ERROR_CODES.FRAUD_ACTION_BLOCKED:\n          case ERROR_CODES.SIGNUP_RATE_LIMIT_EXCEEDED:\n          case ERROR_CODES.USER_BANNED:\n          case ERROR_CODES.USER_DEACTIVATED:\n            card.setError(error);\n            break;\n          default:\n            defaultErrorHandler();\n        }\n\n        // TODO: This is a workaround in order to reset the sign in attempt\n        // so that the oauth error does not persist on full page reloads.\n        void (await signIn.create({}));\n      }\n    }\n\n    void handleOauthError();\n  }, []);\n\n  const buildSignInParams = (fields: Array<FormControlState<string>>): SignInCreateParams => {\n    const hasPassword = fields.some(f => f.name === 'password' && !!f.value);\n\n    /**\n     * FAPI will return an error when password is submitted but the user's email matches requires enterprise sso authentication.\n     * We need to strip password from the create request, and reconstruct it later.\n     */\n    if (!hasPassword || userSettings.enterpriseSSO.enabled) {\n      fields = fields.filter(f => f.name !== 'password');\n    }\n    return {\n      ...buildRequest(fields),\n      ...(hasPassword && !userSettings.enterpriseSSO.enabled && { strategy: 'password' }),\n    } as SignInCreateParams;\n  };\n\n  const safePasswordSignInForEnterpriseSSOInstance = (\n    signInCreatePromise: Promise<SignInResource>,\n    fields: Array<FormControlState<string>>,\n  ) => {\n    return signInCreatePromise.then(signInResource => {\n      if (!userSettings.enterpriseSSO.enabled) {\n        return signInResource;\n      }\n      /**\n       * For instances with Enterprise SSO enabled, perform sign in with password only when it is allowed for the identified user.\n       */\n      const passwordField = fields.find(f => f.name === 'password')?.value;\n      if (!passwordField || signInResource.supportedFirstFactors?.some(ff => ff.strategy === 'enterprise_sso')) {\n        return signInResource;\n      }\n      return signInResource.attemptFirstFactor({ strategy: 'password', password: passwordField });\n    });\n  };\n\n  const signInWithFields = async (\n    fields: Array<FormControlState<string>>,\n    options?: { resetPasswordIntent?: boolean },\n  ) => {\n    // If the user has already selected an alternative phone code provider, we use that.\n    const preferredAlternativePhoneChannel =\n      alternativePhoneCodeProvider?.channel ||\n      getPreferredAlternativePhoneChannel(fields, authConfig.preferredChannels, 'identifier');\n    if (preferredAlternativePhoneChannel) {\n      // We need to send the alternative phone code provider channel in the sign in request\n      // together with the phone_code strategy, in order for FAPI to create a Verification upon this first request.\n      const noop = () => {};\n      fields.push({\n        id: 'strategy',\n        value: 'phone_code',\n        clearFeedback: noop,\n        setValue: noop,\n        onChange: noop,\n        setError: noop,\n      } as any);\n      fields.push({\n        id: 'channel',\n        value: preferredAlternativePhoneChannel,\n        clearFeedback: noop,\n        setValue: noop,\n        onChange: noop,\n        setError: noop,\n      } as any);\n    }\n    try {\n      // On top of the context-level preconditions, sign-up-if-missing only\n      // supports identifiers that can be verified out-of-band.\n      const hasPassword = fields.some(f => f.name === 'password' && !!f.value);\n      const signUpAttribute = getSignUpAttributeFromIdentifier(identifierField);\n      const shouldSignUpIfMissing = signUpIfMissingEnabled && signUpAttribute !== 'username' && !hasPassword;\n\n      const res = await safePasswordSignInForEnterpriseSSOInstance(\n        signIn.create({\n          ...buildSignInParams(fields),\n          ...(shouldSignUpIfMissing && { signUpIfMissing: true }),\n        }),\n        fields,\n      );\n\n      if (navigateOnSignInProtectGate(res, navigate, 'protect-check')) {\n        return;\n      }\n\n      switch (res.status) {\n        case 'needs_identifier':\n          // Check if we need to initiate an enterprise sso flow\n          if (shouldHandOffUnidentifiedToEnterpriseConnection(res)) {\n            await authenticateWithEnterpriseSSO();\n          }\n          break;\n        case 'needs_first_factor': {\n          if (!shouldHandOffToEnterpriseConnection(res)) {\n            if (options?.resetPasswordIntent) {\n              return navigate('factor-one', {\n                searchParams: new URLSearchParams({ [SIGN_IN_RESET_PASSWORD_INTENT_PARAM]: 'true' }),\n              });\n            }\n            return navigate('factor-one');\n          }\n\n          // Awaited so a failed hand-off reaches the catch below instead of escaping this try.\n          return await authenticateWithEnterpriseSSO();\n        }\n        case 'needs_second_factor':\n          return navigate('factor-two');\n        case 'needs_client_trust':\n          return navigate('client-trust');\n        case 'complete':\n          return clerk.setActive({\n            session: res.createdSessionId,\n            navigate: async ({ session, decorateUrl }) => {\n              await navigateOnSetActive({ session, redirectUrl: afterSignInUrl, decorateUrl });\n            },\n          });\n        default: {\n          console.error(clerkInvalidFAPIResponse(res.status, supportEmail));\n          return;\n        }\n      }\n    } catch (e: any) {\n      return attemptToRecoverFromSignInError(e);\n    }\n  };\n\n  const authenticateWithEnterpriseSSO = async () => {\n    const redirectUrl = ctx.ssoCallbackUrl;\n    const redirectUrlComplete = ctx.afterSignInUrl || '/';\n\n    try {\n      await signIn.authenticateWithRedirect({\n        strategy: 'enterprise_sso',\n        redirectUrl,\n        redirectUrlComplete,\n        oidcPrompt: ctx.oidcPrompt,\n        continueSignIn: true,\n      });\n    } catch (err) {\n      // Preparing the hand-off can itself raise a challenge. No redirect was issued and the sign-in\n      // is sitting on the gate instead. Handled here because the callers' recovery path drops\n      // errors that didn't come from the API.\n      if (isProtectCheckRequiredError(err) && navigateOnSignInProtectGate(signIn, navigate, 'protect-check')) {\n        return;\n      }\n      throw err;\n    }\n  };\n\n  const attemptToRecoverFromSignInError = async (e: any) => {\n    if (!e.errors) {\n      return;\n    }\n    const instantPasswordError: ClerkAPIError = e.errors.find(\n      (e: ClerkAPIError) =>\n        e.code === ERROR_CODES.INVALID_STRATEGY_FOR_USER ||\n        e.code === ERROR_CODES.FORM_PASSWORD_INCORRECT ||\n        e.code === ERROR_CODES.FORM_PASSWORD_PWNED,\n    );\n\n    const sessionAlreadyExistsError: ClerkAPIError = e.errors.find(\n      (e: ClerkAPIError) => e.code === ERROR_CODES.SESSION_EXISTS,\n    );\n    const alreadySignedInError: ClerkAPIError = e.errors.find(\n      (e: ClerkAPIError) => e.code === 'identifier_already_signed_in',\n    );\n    const accountDoesNotExistError: ClerkAPIError = e.errors.find(\n      (e: ClerkAPIError) =>\n        e.code === ERROR_CODES.INVITATION_ACCOUNT_NOT_EXISTS || e.code === ERROR_CODES.FORM_IDENTIFIER_NOT_FOUND,\n    );\n\n    if (instantPasswordError) {\n      await signInWithFields([identifierField]);\n    } else if (sessionAlreadyExistsError) {\n      await clerk.setActive({\n        session: clerk.client.lastActiveSessionId,\n        navigate: async ({ session, decorateUrl }) => {\n          await navigateOnSetActive({ session, redirectUrl: afterSignInUrl, decorateUrl });\n        },\n      });\n    } else if (alreadySignedInError) {\n      // eslint-disable-next-line @typescript-eslint/no-non-null-assertion\n      const sid = alreadySignedInError.meta!.sessionId!;\n      await clerk.setActive({\n        session: sid,\n        navigate: async ({ session, decorateUrl }) => {\n          await navigateOnSetActive({ session, redirectUrl: afterSignInUrl, decorateUrl });\n        },\n      });\n    } else if (isCombinedFlow && accountDoesNotExistError) {\n      const attribute = getSignUpAttributeFromIdentifier(identifierField);\n\n      if (userSettings.signUp.mode === SIGN_UP_MODES.WAITLIST) {\n        const waitlistUrl = clerk.buildWaitlistUrl(\n          attribute === 'emailAddress'\n            ? {\n                initialValues: {\n                  [attribute]: identifierField.value,\n                },\n              }\n            : {},\n        );\n        return navigate(waitlistUrl);\n      }\n\n      clerk.client.signUp[attribute] = identifierField.value;\n\n      const redirectUrl = ctx.ssoCallbackUrl;\n      const redirectUrlComplete = ctx.afterSignUpUrl || '/';\n\n      return handleCombinedFlowTransfer({\n        afterSignUpUrl: ctx.afterSignUpUrl || '/',\n        clerk,\n        handleError: e => handleError(e, [identifierField, instantPasswordField], card.setError),\n        identifierAttribute: attribute,\n        identifierValue: identifierField.value,\n        navigate,\n        organizationTicket,\n        signUpMode: userSettings.signUp.mode,\n        redirectUrl,\n        redirectUrlComplete,\n        oidcPrompt: ctx.oidcPrompt,\n        navigateOnSetActive,\n        passwordEnabled: userSettings.attributes.password?.required ?? false,\n        alternativePhoneCodeChannel:\n          alternativePhoneCodeProvider?.channel ||\n          getPreferredAlternativePhoneChannelForCombinedFlow(\n            authConfig.preferredChannels,\n            attribute,\n            identifierField.value,\n          ),\n        unsafeMetadata: ctx.unsafeMetadata,\n      });\n    } else {\n      handleError(e, [identifierField, instantPasswordField], card.setError);\n    }\n  };\n\n  const handleFirstPartySubmit = async (e: React.FormEvent<HTMLFormElement>) => {\n    e.preventDefault();\n    return signInWithFields([identifierField, instantPasswordField]);\n  };\n\n  const handleForgotPasswordClick: React.MouseEventHandler = e => {\n    e.preventDefault();\n    // Surface the same native required-field validation as the Continue button\n    // when the identifier is missing\n    const form = e.currentTarget.closest('form');\n    if (form && !form.reportValidity()) {\n      return;\n    }\n    void signInWithFields([identifierField], { resetPasswordIntent: true });\n  };\n\n  const DynamicField = useMemo(() => {\n    const components = {\n      tel: Form.PhoneInput,\n      password: Form.PasswordInput,\n      text: Form.PlainInput,\n      email: Form.PlainInput,\n    };\n\n    return components[identifierField.type as keyof typeof components];\n  }, [identifierField.type]);\n\n  if (status.isLoading || clerkStatus === 'sign_up') {\n    // clerkStatus being sign_up will trigger a navigation to the sign up flow, so show a loading card instead of\n    // rendering the sign in flow.\n    return <LoadingCard />;\n  }\n\n  // @ts-expect-error `action` is not typed\n  const { action, validLastAuthenticationStrategies, ...identifierFieldProps } = identifierField.props;\n\n  const lastAuthenticationStrategy = clerk.client?.lastAuthenticationStrategy;\n  const isIdentifierLastAuthenticationStrategy =\n    lastAuthenticationStrategy && totalEnabledAuthMethods > 1\n      ? validLastAuthenticationStrategies?.has(lastAuthenticationStrategy)\n      : false;\n\n  const blockedDetails = actionBlockedDetailsFrom(card.rawError);\n  if (blockedDetails) {\n    return <ActionBlockedCard details={blockedDetails} />;\n  }\n\n  return (\n    <Flow.Part part='start'>\n      {!alternativePhoneCodeProvider ? (\n        <Card.Root>\n          <Card.Content>\n            <Header.Root showLogo>\n              <Header.Title\n                localizationKey={\n                  isCombinedFlow\n                    ? localizationKeys('signIn.start.titleCombined')\n                    : localizationKeys('signIn.start.title')\n                }\n              />\n              <Header.Subtitle\n                localizationKey={\n                  isCombinedFlow\n                    ? localizationKeys('signIn.start.subtitleCombined')\n                    : localizationKeys('signIn.start.subtitle')\n                }\n                sx={{\n                  '&:empty': {\n                    display: 'none',\n                  },\n                }}\n              />\n            </Header.Root>\n            <Card.Alert>{card.error}</Card.Alert>\n            {/*TODO: extract main in its own component */}\n            <Col\n              elementDescriptor={descriptors.main}\n              gap={6}\n              // @ts-ignore - `inert` is not yet in the installed React types\n              inert={captchaIsInteractive ? '' : undefined}\n              // `display:none` (not `visibility:hidden`) so the collapsed column leaves flex flow and\n              // contributes no `gap` gutter to `Card.Content` — otherwise it injects empty space above\n              // the spotlighted captcha. Subtree stays mounted (form state preserved); `inert` is then\n              // redundant-but-harmless.\n              sx={captchaIsInteractive ? { display: 'none' } : undefined}\n            >\n              <SocialButtonsReversibleContainerWithDivider>\n                {hasSocialOrWeb3Buttons && (\n                  <SignInSocialButtons\n                    enableWeb3Providers\n                    enableOAuthProviders\n                    enableAlternativePhoneCodeProviders={showAlternativePhoneCodeProviders}\n                    onAlternativePhoneCodeProviderClick={onAlternativePhoneCodeProviderClick}\n                  />\n                )}\n                {standardFormAttributes.length ? (\n                  <Form.Root\n                    onSubmit={handleFirstPartySubmit}\n                    gap={8}\n                  >\n                    <Col gap={6}>\n                      <Form.ControlRow elementId={identifierField.id}>\n                        <DynamicField\n                          actionLabel={nextIdentifier?.action}\n                          onActionClicked={switchToNextIdentifier}\n                          {...identifierFieldProps}\n                          autoFocus={shouldAutofocus}\n                          autoComplete={isWebAuthnAutofillSupported ? 'webauthn' : undefined}\n                          isLastAuthenticationStrategy={isIdentifierLastAuthenticationStrategy}\n                        />\n                      </Form.ControlRow>\n                      <InstantPasswordRow\n                        field={passwordBasedInstance ? instantPasswordField : undefined}\n                        onForgotPasswordClick={handleForgotPasswordClick}\n                      />\n                    </Col>\n                    <Col center>\n                      <Form.SubmitButton hasArrow />\n                    </Col>\n                  </Form.Root>\n                ) : null}\n              </SocialButtonsReversibleContainerWithDivider>\n            </Col>\n            <CaptchaElement\n              gapless\n              onInteractiveChange={setCaptchaIsInteractive}\n            />\n            {/* Kept outside descriptors.main so the spotlight's `inert` leaves this alternative action reachable. */}\n            {userSettings.attributes.passkey?.enabled &&\n              userSettings.passkeySettings.show_sign_in_button &&\n              isWebSupported && (\n                <Card.Action elementId={'usePasskey'}>\n                  <Card.ActionLink\n                    localizationKey={localizationKeys('signIn.start.actionLink__use_passkey')}\n                    onClick={() => authenticateWithPasskey({ flow: 'discoverable' })}\n                  />\n                </Card.Action>\n              )}\n          </Card.Content>\n          <Card.Footer>\n            {userSettings.signUp.mode === SIGN_UP_MODES.PUBLIC && !isCombinedFlow && (\n              <Card.Action elementId='signIn'>\n                <Card.ActionText localizationKey={localizationKeys('signIn.start.actionText')} />\n                <Card.ActionLink\n                  localizationKey={localizationKeys('signIn.start.actionLink')}\n                  to={clerk.buildUrlWithAuth(signUpUrl)}\n                />\n              </Card.Action>\n            )}\n            {userSettings.signUp.mode === SIGN_UP_MODES.WAITLIST && (\n              <Card.Action elementId='signIn'>\n                <Card.ActionText localizationKey={localizationKeys('signIn.start.actionText__join_waitlist')} />\n                <Card.ActionLink\n                  localizationKey={localizationKeys('signIn.start.actionLink__join_waitlist')}\n                  to={clerk.buildUrlWithAuth(waitlistUrl)}\n                />\n              </Card.Action>\n            )}\n          </Card.Footer>\n        </Card.Root>\n      ) : (\n        <SignInAlternativePhoneCodePhoneNumberCard\n          handleSubmit={handleFirstPartySubmit}\n          phoneNumberFormState={phoneIdentifierField}\n          onUseAnotherMethod={onAlternativePhoneCodeUseAnotherMethod}\n          phoneCodeProvider={alternativePhoneCodeProvider}\n        />\n      )}\n    </Flow.Part>\n  );\n}\n\nconst InstantPasswordRow = ({\n  field,\n  onForgotPasswordClick,\n}: {\n  field?: FormControlState<'password'>;\n  onForgotPasswordClick?: React.MouseEventHandler;\n}) => {\n  const [autofilled, setAutofilled] = useState(false);\n  const ref = useRef<HTMLInputElement>(null);\n  const show = !!(autofilled || field?.value);\n\n  // show password if it's autofilled by the browser\n  useLayoutEffect(() => {\n    const intervalId = setInterval(() => {\n      if (ref?.current) {\n        const autofilled =\n          window.getComputedStyle(ref.current, ':autofill').animationName === 'onAutoFillStart' ||\n          // https://github.com/facebook/react/issues/1159#issuecomment-1025423604\n          !!ref.current?.matches('*:-webkit-autofill');\n        if (autofilled) {\n          setAutofilled(autofilled);\n          clearInterval(intervalId);\n        }\n      }\n    }, 500);\n\n    return () => {\n      clearInterval(intervalId);\n    };\n  }, []);\n\n  useEffect(() => {\n    //if the field receives a value, we default to normal behaviour\n    if (field?.value && field.value !== '') {\n      setAutofilled(false);\n    }\n  }, [field?.value]);\n\n  if (!field) {\n    return null;\n  }\n\n  return (\n    <Form.ControlRow\n      elementId={field.id}\n      aria-hidden={show ? undefined : true}\n      sx={\n        show\n          ? undefined\n          : {\n              position: 'absolute',\n              opacity: 0,\n              height: 0,\n              overflow: 'hidden',\n              pointerEvents: 'none',\n              marginTop: '-1rem',\n            }\n      }\n    >\n      <Form.PasswordInput\n        {...field.props}\n        actionLabel={show ? localizationKeys('formFieldAction__forgotPassword') : undefined}\n        onActionClicked={show ? onForgotPasswordClick : undefined}\n        tabIndex={show ? undefined : -1}\n        ref={ref}\n      />\n    </Form.ControlRow>\n  );\n};\n\nexport const SignInStart = withRedirectToSignInTask(\n  withRedirectToAfterSignIn(withCardStateProvider(SignInStartInternal)),\n);\n"],"mappings":"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"}

package/dist/components/SignUp/SignUpProtectCheck.js

@@ -9,6 +9,8 @@ import { Box, Button, Col, Flex, Spinner } from "../../customizables/index.js";
 import { useCardState, withCardStateProvider } from "../../elements/contexts/index.js";
 import { Card } from "../../elements/Card/index.js";
 import { Header } from "../../elements/Header.js";
+import { actionBlockedDetailsFrom } from "../../utils/actionBlocked.js";
+import { ActionBlockedCard } from "../../common/ActionBlockedCard.js";
 import { withRedirectToAfterSignUp } from "../../common/withRedirect.js";
 import { useProtectCheckRunner } from "../../hooks/useProtectCheckRunner.js";
 import { useCompleteSignUpFlow } from "./useCompleteSignUpFlow.js";
@@ -53,6 +55,8 @@ function SignUpProtectCheckInternal({ verifyEmailPath = "../verify-email-address
 	});
 	const showSpinner = useSpinDelay(isRunning, { delay: 300 });
 	if (!signUp.protectCheck && !everSawProtectCheck) return null;
+	const blockedDetails = actionBlockedDetailsFrom(card.rawError);
+	if (blockedDetails) return /* @__PURE__ */ jsx(ActionBlockedCard, { details: blockedDetails });
 	return /* @__PURE__ */ jsx(Flow.Part, {
 		part: "protectCheck",
 		children: /* @__PURE__ */ jsxs(Card.Root, { children: [/* @__PURE__ */ jsxs(Card.Content, { children: [

package/dist/components/SignUp/SignUpProtectCheck.js.map

@@ -1 +1 @@
-{"version":3,"file":"SignUpProtectCheck.js","names":[],"sources":["../../../src/components/SignUp/SignUpProtectCheck.tsx"],"sourcesContent":["import type { SignUpProps, SignUpResource } from '@clerk/shared/types';\nimport { type ComponentType, useEffect, useRef, useState } from 'react';\n\nimport { Card } from '@/ui/elements/Card';\nimport { useCardState, withCardStateProvider } from '@/ui/elements/contexts';\nimport { Header } from '@/ui/elements/Header';\n\nimport { withRedirectToAfterSignUp } from '../../common';\nimport { useCoreSignUp } from '../../contexts';\nimport {\n  Box,\n  Button,\n  Col,\n  descriptors,\n  Flex,\n  Flow,\n  localizationKeys,\n  Spinner,\n  useLocalizations,\n} from '../../customizables';\nimport { useSpinDelay } from '../../hooks';\nimport { useNavigateToFlowStart } from '../../hooks/useNavigateToFlowStart';\nimport { useProtectCheckRunner } from '../../hooks/useProtectCheckRunner';\nimport { useCompleteSignUpFlow } from './useCompleteSignUpFlow';\n\n/**\n * Continuation paths default to the standalone `/sign-up/protect-check` mount. When the card is\n * mounted deeper (e.g. `continue/protect-check` or the combined-flow `create/.../protect-check`),\n * the nested route passes overrides so a resolved gate routes within the correct subtree instead\n * of dead-ending. The verify/self paths resolve correctly from every mount; only `continuePath`\n * differs (the `continue` index is `..`, not `../continue`, once we're already under `continue`).\n */\ntype SignUpProtectCheckProps = Partial<SignUpProps> & {\n  verifyEmailPath?: string;\n  verifyPhonePath?: string;\n  continuePath?: string;\n  protectCheckPath?: string;\n};\n\nfunction SignUpProtectCheckInternal({\n  verifyEmailPath = '../verify-email-address',\n  verifyPhonePath = '../verify-phone-number',\n  continuePath = '../continue',\n  protectCheckPath = '.',\n}: SignUpProtectCheckProps = {}): JSX.Element | null {\n  const card = useCardState();\n  const { t } = useLocalizations();\n  const signUp = useCoreSignUp();\n  const { navigateToFlowStart } = useNavigateToFlowStart();\n  const completeSignUpFlow = useCompleteSignUpFlow();\n  // Latches that a protect check existed at some point, so the resolution race\n  // (submitProtectCheck clearing protectCheck mid-navigation) isn't mistaken for\n  // a stale visit. State adjusted during render (guarded) rather than a ref\n  // write, which React disallows in the render body.\n  const [everSawProtectCheck, setEverSawProtectCheck] = useState(!!signUp.protectCheck);\n  const didStartNoCheckFallbackRef = useRef(false);\n\n  if (signUp.protectCheck && !everSawProtectCheck) {\n    setEverSawProtectCheck(true);\n  }\n\n  useEffect(() => {\n    if (!signUp.protectCheck && !everSawProtectCheck && !didStartNoCheckFallbackRef.current) {\n      didStartNoCheckFallbackRef.current = true;\n      void navigateToFlowStart();\n    }\n  }, [everSawProtectCheck, navigateToFlowStart, signUp.protectCheck]);\n\n  const { containerRef, isRunning, isWidgetVisible, hasError, retry } = useProtectCheckRunner<SignUpResource>({\n    getProtectCheck: () => signUp.protectCheck,\n    getResource: () => signUp,\n    reload: () => signUp.reload(),\n    submitProtectCheck: params => signUp.submitProtectCheck(params),\n    // Routes on the resolved resource. `completeSignUpFlow` handles the `complete` case (via\n    // `handleComplete`) as well as routing to the next missing-field / verification / chained-\n    // challenge step, so both the normal success and the `protect_check_already_resolved` reload\n    // land correctly.\n    onResolved: async (updatedSignUp, isCancelled) => {\n      if (isCancelled()) {\n        return;\n      }\n      await completeSignUpFlow({\n        signUp: updatedSignUp,\n        verifyEmailPath,\n        verifyPhonePath,\n        protectCheckPath, // Defaults to '.' so a chained challenge re-runs this same route\n        continuePath,\n      });\n    },\n  });\n\n  // Debounce the spinner's entrance so a near-instant check (or a script that signals its\n  // widget immediately) never flashes it — the card header alone carries the first ~300ms.\n  // The error and widget-visibility gates stay OUTSIDE the delay hook (in the JSX below): its\n  // minimum visible duration must never outrank the handshake's \"spinner is gone when the\n  // promise resolves\" guarantee, nor keep a spinner next to the retry button.\n  const showSpinner = useSpinDelay(isRunning, { delay: 300 });\n\n  // Stale/direct visit that never had a check: render nothing while the\n  // flow-start redirect scheduled above kicks in, instead of flashing the card\n  // shell for one paint. Must stay below every hook call.\n  if (!signUp.protectCheck && !everSawProtectCheck) {\n    return null;\n  }\n\n  return (\n    <Flow.Part part='protectCheck'>\n      <Card.Root>\n        <Card.Content>\n          <Header.Root showLogo>\n            <Header.Title localizationKey={localizationKeys('signUp.protectCheck.title')} />\n            <Header.Subtitle localizationKey={localizationKeys('signUp.protectCheck.subtitle')} />\n          </Header.Root>\n          <Card.Alert>{card.error}</Card.Alert>\n          <Col\n            elementDescriptor={descriptors.main}\n            gap={6}\n          >\n            <Box\n              ref={containerRef}\n              id='clerk-protect-check'\n              aria-busy={isRunning}\n              // Out of flow while empty so the collapsed container adds no reserved height or flex-gap\n              // gutter above the spinner (same idiom as CaptchaElement's `gapless` mode).\n              style={{ display: 'block', alignSelf: 'center', position: isWidgetVisible ? 'static' : 'absolute' }}\n            />\n            {showSpinner && !hasError && !isWidgetVisible ? (\n              <Flex center>\n                <Spinner\n                  size='lg'\n                  colorScheme='primary'\n                  elementDescriptor={descriptors.spinner}\n                  aria-label={t(localizationKeys('signUp.protectCheck.loading'))}\n                />\n              </Flex>\n            ) : null}\n            {hasError ? (\n              <Button\n                onClick={retry}\n                localizationKey={localizationKeys('signUp.protectCheck.retryButton')}\n              />\n            ) : null}\n          </Col>\n        </Card.Content>\n        <Card.Footer />\n      </Card.Root>\n    </Flow.Part>\n  );\n}\n\n// The redirect HOC widens props back to the shared component-props union; re-expose the path\n// overrides so nested route mounts (continue/protect-check, create/continue/protect-check) can\n// pass them.\nexport const SignUpProtectCheck = withRedirectToAfterSignUp(\n  withCardStateProvider(SignUpProtectCheckInternal),\n) as ComponentType<SignUpProtectCheckProps>;\n"],"mappings":";;;;;;;;;;;;;;;;;;AAuCA,SAAS,2BAA2B,EAClC,kBAAkB,2BAClB,kBAAkB,0BAClB,eAAe,eACf,mBAAmB,QACQ,CAAC,GAAuB;CACnD,MAAM,OAAO,aAAa;CAC1B,MAAM,EAAE,MAAM,iBAAiB;CAC/B,MAAM,SAAS,cAAc;CAC7B,MAAM,EAAE,wBAAwB,uBAAuB;CACvD,MAAM,qBAAqB,sBAAsB;CAKjD,MAAM,CAAC,qBAAqB,0BAA0B,SAAS,CAAC,CAAC,OAAO,YAAY;CACpF,MAAM,6BAA6B,OAAO,KAAK;CAE/C,IAAI,OAAO,gBAAgB,CAAC,qBAC1B,uBAAuB,IAAI;CAG7B,gBAAgB;EACd,IAAI,CAAC,OAAO,gBAAgB,CAAC,uBAAuB,CAAC,2BAA2B,SAAS;GACvF,2BAA2B,UAAU;GACrC,AAAK,oBAAoB;EAC3B;CACF,GAAG;EAAC;EAAqB;EAAqB,OAAO;CAAY,CAAC;CAElE,MAAM,EAAE,cAAc,WAAW,iBAAiB,UAAU,UAAU,sBAAsC;EAC1G,uBAAuB,OAAO;EAC9B,mBAAmB;EACnB,cAAc,OAAO,OAAO;EAC5B,qBAAoB,WAAU,OAAO,mBAAmB,MAAM;EAK9D,YAAY,OAAO,eAAe,gBAAgB;GAChD,IAAI,YAAY,GACd;GAEF,MAAM,mBAAmB;IACvB,QAAQ;IACR;IACA;IACA;IACA;GACF,CAAC;EACH;CACF,CAAC;CAOD,MAAM,cAAc,aAAa,WAAW,EAAE,OAAO,IAAI,CAAC;CAK1D,IAAI,CAAC,OAAO,gBAAgB,CAAC,qBAC3B,OAAO;CAGT,OACE,oBAAC,KAAK,MAAN;EAAW,MAAK;YACd,qBAAC,KAAK,MAAN,aACE,qBAAC,KAAK,SAAN;GACE,qBAAC,OAAO,MAAR;IAAa;cAAb,CACE,oBAAC,OAAO,OAAR,EAAc,iBAAiB,iBAAiB,2BAA2B,EAAI,IAC/E,oBAAC,OAAO,UAAR,EAAiB,iBAAiB,iBAAiB,8BAA8B,EAAI,EAC1E;;GACb,oBAAC,KAAK,OAAN,YAAa,KAAK,MAAkB;GACpC,qBAAC,KAAD;IACE,mBAAmB,YAAY;IAC/B,KAAK;cAFP;KAIE,oBAAC,KAAD;MACE,KAAK;MACL,IAAG;MACH,aAAW;MAGX,OAAO;OAAE,SAAS;OAAS,WAAW;OAAU,UAAU,kBAAkB,WAAW;MAAW;KACnG;KACA,eAAe,CAAC,YAAY,CAAC,kBAC5B,oBAAC,MAAD;MAAM;gBACJ,oBAAC,SAAD;OACE,MAAK;OACL,aAAY;OACZ,mBAAmB,YAAY;OAC/B,cAAY,EAAE,iBAAiB,6BAA6B,CAAC;MAC9D;KACG,KACJ;KACH,WACC,oBAAC,QAAD;MACE,SAAS;MACT,iBAAiB,iBAAiB,iCAAiC;KACpE,KACC;IACD;;EACO,MACd,oBAAC,KAAK,QAAN,CAAc,EACL;CACF;AAEf;AAKA,MAAa,qBAAqB,0BAChC,sBAAsB,0BAA0B,CAClD"}
+{"version":3,"file":"SignUpProtectCheck.js","names":[],"sources":["../../../src/components/SignUp/SignUpProtectCheck.tsx"],"sourcesContent":["import type { SignUpProps, SignUpResource } from '@clerk/shared/types';\nimport { type ComponentType, useEffect, useRef, useState } from 'react';\n\nimport { Card } from '@/ui/elements/Card';\nimport { useCardState, withCardStateProvider } from '@/ui/elements/contexts';\nimport { Header } from '@/ui/elements/Header';\nimport { actionBlockedDetailsFrom } from '@/ui/utils/actionBlocked';\n\nimport { ActionBlockedCard, withRedirectToAfterSignUp } from '../../common';\nimport { useCoreSignUp } from '../../contexts';\nimport {\n  Box,\n  Button,\n  Col,\n  descriptors,\n  Flex,\n  Flow,\n  localizationKeys,\n  Spinner,\n  useLocalizations,\n} from '../../customizables';\nimport { useSpinDelay } from '../../hooks';\nimport { useNavigateToFlowStart } from '../../hooks/useNavigateToFlowStart';\nimport { useProtectCheckRunner } from '../../hooks/useProtectCheckRunner';\nimport { useCompleteSignUpFlow } from './useCompleteSignUpFlow';\n\n/**\n * Continuation paths default to the standalone `/sign-up/protect-check` mount. When the card is\n * mounted deeper (e.g. `continue/protect-check` or the combined-flow `create/.../protect-check`),\n * the nested route passes overrides so a resolved gate routes within the correct subtree instead\n * of dead-ending. The verify/self paths resolve correctly from every mount; only `continuePath`\n * differs (the `continue` index is `..`, not `../continue`, once we're already under `continue`).\n */\ntype SignUpProtectCheckProps = Partial<SignUpProps> & {\n  verifyEmailPath?: string;\n  verifyPhonePath?: string;\n  continuePath?: string;\n  protectCheckPath?: string;\n};\n\nfunction SignUpProtectCheckInternal({\n  verifyEmailPath = '../verify-email-address',\n  verifyPhonePath = '../verify-phone-number',\n  continuePath = '../continue',\n  protectCheckPath = '.',\n}: SignUpProtectCheckProps = {}): JSX.Element | null {\n  const card = useCardState();\n  const { t } = useLocalizations();\n  const signUp = useCoreSignUp();\n  const { navigateToFlowStart } = useNavigateToFlowStart();\n  const completeSignUpFlow = useCompleteSignUpFlow();\n  // Latches that a protect check existed at some point, so the resolution race\n  // (submitProtectCheck clearing protectCheck mid-navigation) isn't mistaken for\n  // a stale visit. State adjusted during render (guarded) rather than a ref\n  // write, which React disallows in the render body.\n  const [everSawProtectCheck, setEverSawProtectCheck] = useState(!!signUp.protectCheck);\n  const didStartNoCheckFallbackRef = useRef(false);\n\n  if (signUp.protectCheck && !everSawProtectCheck) {\n    setEverSawProtectCheck(true);\n  }\n\n  useEffect(() => {\n    if (!signUp.protectCheck && !everSawProtectCheck && !didStartNoCheckFallbackRef.current) {\n      didStartNoCheckFallbackRef.current = true;\n      void navigateToFlowStart();\n    }\n  }, [everSawProtectCheck, navigateToFlowStart, signUp.protectCheck]);\n\n  const { containerRef, isRunning, isWidgetVisible, hasError, retry } = useProtectCheckRunner<SignUpResource>({\n    getProtectCheck: () => signUp.protectCheck,\n    getResource: () => signUp,\n    reload: () => signUp.reload(),\n    submitProtectCheck: params => signUp.submitProtectCheck(params),\n    // Routes on the resolved resource. `completeSignUpFlow` handles the `complete` case (via\n    // `handleComplete`) as well as routing to the next missing-field / verification / chained-\n    // challenge step, so both the normal success and the `protect_check_already_resolved` reload\n    // land correctly.\n    onResolved: async (updatedSignUp, isCancelled) => {\n      if (isCancelled()) {\n        return;\n      }\n      await completeSignUpFlow({\n        signUp: updatedSignUp,\n        verifyEmailPath,\n        verifyPhonePath,\n        protectCheckPath, // Defaults to '.' so a chained challenge re-runs this same route\n        continuePath,\n      });\n    },\n  });\n\n  // Debounce the spinner's entrance so a near-instant check (or a script that signals its\n  // widget immediately) never flashes it — the card header alone carries the first ~300ms.\n  // The error and widget-visibility gates stay OUTSIDE the delay hook (in the JSX below): its\n  // minimum visible duration must never outrank the handshake's \"spinner is gone when the\n  // promise resolves\" guarantee, nor keep a spinner next to the retry button.\n  const showSpinner = useSpinDelay(isRunning, { delay: 300 });\n\n  // Stale/direct visit that never had a check: render nothing while the\n  // flow-start redirect scheduled above kicks in, instead of flashing the card\n  // shell for one paint. Must stay below every hook call.\n  if (!signUp.protectCheck && !everSawProtectCheck) {\n    return null;\n  }\n\n  const blockedDetails = actionBlockedDetailsFrom(card.rawError);\n  if (blockedDetails) {\n    return <ActionBlockedCard details={blockedDetails} />;\n  }\n\n  return (\n    <Flow.Part part='protectCheck'>\n      <Card.Root>\n        <Card.Content>\n          <Header.Root showLogo>\n            <Header.Title localizationKey={localizationKeys('signUp.protectCheck.title')} />\n            <Header.Subtitle localizationKey={localizationKeys('signUp.protectCheck.subtitle')} />\n          </Header.Root>\n          <Card.Alert>{card.error}</Card.Alert>\n          <Col\n            elementDescriptor={descriptors.main}\n            gap={6}\n          >\n            <Box\n              ref={containerRef}\n              id='clerk-protect-check'\n              aria-busy={isRunning}\n              // Out of flow while empty so the collapsed container adds no reserved height or flex-gap\n              // gutter above the spinner (same idiom as CaptchaElement's `gapless` mode).\n              style={{ display: 'block', alignSelf: 'center', position: isWidgetVisible ? 'static' : 'absolute' }}\n            />\n            {showSpinner && !hasError && !isWidgetVisible ? (\n              <Flex center>\n                <Spinner\n                  size='lg'\n                  colorScheme='primary'\n                  elementDescriptor={descriptors.spinner}\n                  aria-label={t(localizationKeys('signUp.protectCheck.loading'))}\n                />\n              </Flex>\n            ) : null}\n            {hasError ? (\n              <Button\n                onClick={retry}\n                localizationKey={localizationKeys('signUp.protectCheck.retryButton')}\n              />\n            ) : null}\n          </Col>\n        </Card.Content>\n        <Card.Footer />\n      </Card.Root>\n    </Flow.Part>\n  );\n}\n\n// The redirect HOC widens props back to the shared component-props union; re-expose the path\n// overrides so nested route mounts (continue/protect-check, create/continue/protect-check) can\n// pass them.\nexport const SignUpProtectCheck = withRedirectToAfterSignUp(\n  withCardStateProvider(SignUpProtectCheckInternal),\n) as ComponentType<SignUpProtectCheckProps>;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAwCA,SAAS,2BAA2B,EAClC,kBAAkB,2BAClB,kBAAkB,0BAClB,eAAe,eACf,mBAAmB,QACQ,CAAC,GAAuB;CACnD,MAAM,OAAO,aAAa;CAC1B,MAAM,EAAE,MAAM,iBAAiB;CAC/B,MAAM,SAAS,cAAc;CAC7B,MAAM,EAAE,wBAAwB,uBAAuB;CACvD,MAAM,qBAAqB,sBAAsB;CAKjD,MAAM,CAAC,qBAAqB,0BAA0B,SAAS,CAAC,CAAC,OAAO,YAAY;CACpF,MAAM,6BAA6B,OAAO,KAAK;CAE/C,IAAI,OAAO,gBAAgB,CAAC,qBAC1B,uBAAuB,IAAI;CAG7B,gBAAgB;EACd,IAAI,CAAC,OAAO,gBAAgB,CAAC,uBAAuB,CAAC,2BAA2B,SAAS;GACvF,2BAA2B,UAAU;GACrC,AAAK,oBAAoB;EAC3B;CACF,GAAG;EAAC;EAAqB;EAAqB,OAAO;CAAY,CAAC;CAElE,MAAM,EAAE,cAAc,WAAW,iBAAiB,UAAU,UAAU,sBAAsC;EAC1G,uBAAuB,OAAO;EAC9B,mBAAmB;EACnB,cAAc,OAAO,OAAO;EAC5B,qBAAoB,WAAU,OAAO,mBAAmB,MAAM;EAK9D,YAAY,OAAO,eAAe,gBAAgB;GAChD,IAAI,YAAY,GACd;GAEF,MAAM,mBAAmB;IACvB,QAAQ;IACR;IACA;IACA;IACA;GACF,CAAC;EACH;CACF,CAAC;CAOD,MAAM,cAAc,aAAa,WAAW,EAAE,OAAO,IAAI,CAAC;CAK1D,IAAI,CAAC,OAAO,gBAAgB,CAAC,qBAC3B,OAAO;CAGT,MAAM,iBAAiB,yBAAyB,KAAK,QAAQ;CAC7D,IAAI,gBACF,OAAO,oBAAC,mBAAD,EAAmB,SAAS,eAAiB;CAGtD,OACE,oBAAC,KAAK,MAAN;EAAW,MAAK;YACd,qBAAC,KAAK,MAAN,aACE,qBAAC,KAAK,SAAN;GACE,qBAAC,OAAO,MAAR;IAAa;cAAb,CACE,oBAAC,OAAO,OAAR,EAAc,iBAAiB,iBAAiB,2BAA2B,EAAI,IAC/E,oBAAC,OAAO,UAAR,EAAiB,iBAAiB,iBAAiB,8BAA8B,EAAI,EAC1E;;GACb,oBAAC,KAAK,OAAN,YAAa,KAAK,MAAkB;GACpC,qBAAC,KAAD;IACE,mBAAmB,YAAY;IAC/B,KAAK;cAFP;KAIE,oBAAC,KAAD;MACE,KAAK;MACL,IAAG;MACH,aAAW;MAGX,OAAO;OAAE,SAAS;OAAS,WAAW;OAAU,UAAU,kBAAkB,WAAW;MAAW;KACnG;KACA,eAAe,CAAC,YAAY,CAAC,kBAC5B,oBAAC,MAAD;MAAM;gBACJ,oBAAC,SAAD;OACE,MAAK;OACL,aAAY;OACZ,mBAAmB,YAAY;OAC/B,cAAY,EAAE,iBAAiB,6BAA6B,CAAC;MAC9D;KACG,KACJ;KACH,WACC,oBAAC,QAAD;MACE,SAAS;MACT,iBAAiB,iBAAiB,iCAAiC;KACpE,KACC;IACD;;EACO,MACd,oBAAC,KAAK,QAAN,CAAc,EACL;CACF;AAEf;AAKA,MAAa,qBAAqB,0BAChC,sBAAsB,0BAA0B,CAClD"}

package/dist/components/SignUp/SignUpStart.js

@@ -16,6 +16,8 @@ import { useCardState, withCardStateProvider } from "../../elements/contexts/ind
 import { Card } from "../../elements/Card/index.js";
 import { Header } from "../../elements/Header.js";
 import { handleError } from "../../utils/errorHandler.js";
+import { actionBlockedDetailsFrom } from "../../utils/actionBlocked.js";
+import { ActionBlockedCard } from "../../common/ActionBlockedCard.js";
 import { CaptchaElement } from "../../elements/CaptchaElement.js";
 import { LoadingCard } from "../../elements/LoadingCard.js";
 import { withRedirectToAfterSignUp, withRedirectToSignUpTask } from "../../common/withRedirect.js";
@@ -294,6 +296,8 @@ function SignUpStartInternal() {
 	const onAlternativePhoneCodeProviderClick = (phoneCodeChannel) => {
 		setAlternativePhoneCodeProvider(getAlternativePhoneCodeProviderData(phoneCodeChannel) || null);
 	};
+	const blockedDetails = actionBlockedDetailsFrom(card.rawError);
+	if (blockedDetails) return /* @__PURE__ */ jsx(ActionBlockedCard, { details: blockedDetails });
 	if (mode !== SIGN_UP_MODES.PUBLIC && !(hasTicket || hasExistingSignUpWithTicket)) return /* @__PURE__ */ jsx(SignUpRestrictedAccess, {});
 	return /* @__PURE__ */ jsx(Flow.Part, {
 		part: "start",