npm - @clerk/ui - Versions diffs - 1.37.1-snapshot.v20260930211104 → 1.38.0 - Mend

@clerk/ui 1.37.1-snapshot.v20260930211104 → 1.38.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (205) hide show

package/dist/ClerkUI.js CHANGED Viewed

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

package/dist/Components.d.ts CHANGED Viewed

@@ -3,7 +3,7 @@ import { AppearanceCascade } from "./customizables/parseAppearance.js";
 import { AvailableComponentProps } from "./types.js";
 import { ClerkComponentName } from "./lazyModules/components.js";
 import { ModuleManager } from "@clerk/shared/moduleManager";
-import { Clerk, ClerkOptions, EnvironmentResource, InviteMembersModalProps, SignInProps, SignUpProps, UserProfileProps, WaitlistProps, __internal_CheckoutProps, __internal_EnableOrganizationsPromptProps, __internal_PlanDetailsProps, __internal_SubscriptionDetailsProps, __internal_UserVerificationProps } from "@clerk/shared/types";
+import { Clerk, ClerkOptions, EnvironmentResource, InviteMembersModalProps, SignInProps, SignUpProps, UserProfileProps, WaitlistProps, __internal_CheckoutProps, __internal_EnableOrganizationsPromptProps, __internal_PlanDetailsProps, __internal_ProtectCheckModalProps, __internal_SubscriptionDetailsProps, __internal_UserVerificationProps } from "@clerk/shared/types";
 //#region src/Components.d.ts
 type ComponentControls = {
@@ -22,8 +22,8 @@ type ComponentControls = {
     node?: HTMLDivElement;
     props?: unknown;
   }) => void;
-  openModal: <T extends 'googleOneTap' | 'signIn' | 'signUp' | 'userProfile' | 'organizationProfile' | 'inviteMembers' | 'createOrganization' | 'userVerification' | 'waitlist' | 'blankCaptcha' | 'enableOrganizationsPrompt'>(modal: T, props: T extends 'signIn' ? SignInProps : T extends 'signUp' ? SignUpProps : T extends 'userVerification' ? __internal_UserVerificationProps : T extends 'waitlist' ? WaitlistProps : T extends 'inviteMembers' ? InviteMembersModalProps : T extends 'enableOrganizationsPrompt' ? __internal_EnableOrganizationsPromptProps : UserProfileProps) => void;
-  closeModal: (modal: 'googleOneTap' | 'signIn' | 'signUp' | 'userProfile' | 'organizationProfile' | 'inviteMembers' | 'createOrganization' | 'userVerification' | 'waitlist' | 'blankCaptcha' | 'enableOrganizationsPrompt', options?: {
+  openModal: <T extends 'googleOneTap' | 'signIn' | 'signUp' | 'userProfile' | 'organizationProfile' | 'inviteMembers' | 'createOrganization' | 'userVerification' | 'waitlist' | 'blankCaptcha' | 'protectCheck' | 'enableOrganizationsPrompt'>(modal: T, props: T extends 'signIn' ? SignInProps : T extends 'signUp' ? SignUpProps : T extends 'userVerification' ? __internal_UserVerificationProps : T extends 'waitlist' ? WaitlistProps : T extends 'inviteMembers' ? InviteMembersModalProps : T extends 'enableOrganizationsPrompt' ? __internal_EnableOrganizationsPromptProps : T extends 'protectCheck' ? __internal_ProtectCheckModalProps : UserProfileProps) => void;
+  closeModal: (modal: 'googleOneTap' | 'signIn' | 'signUp' | 'userProfile' | 'organizationProfile' | 'inviteMembers' | 'createOrganization' | 'userVerification' | 'waitlist' | 'blankCaptcha' | 'protectCheck' | 'enableOrganizationsPrompt', options?: {
     notify?: boolean;
   }) => void;
   openDrawer: <T extends 'checkout' | 'planDetails' | 'subscriptionDetails'>(drawer: T, props: T extends 'checkout' ? __internal_CheckoutProps : T extends 'planDetails' ? __internal_PlanDetailsProps : T extends 'subscriptionDetails' ? __internal_SubscriptionDetailsProps : never) => void;
@@ -32,6 +32,7 @@ type ComponentControls = {
   }) => void;
   prefetch: (component: 'organizationSwitcher') => void;
   mountImpersonationFab: () => void;
+  openProtectCheckModal: (props: __internal_ProtectCheckModalProps) => void;
 };
 declare const mountComponentRenderer: (getClerk: () => Clerk, getEnvironment: () => EnvironmentResource | null | undefined, _options: ClerkOptions, moduleManager: ModuleManager) => {
   ensureMounted: (opts?: {

package/dist/Components.js CHANGED Viewed

@@ -1,5 +1,5 @@
 import { useClerkModalStateParams } from "./hooks/useClerkModalStateParams.js";
-import { BlankCaptchaModal, CreateOrganizationModal, EnableOrganizationsPrompt, ImpersonationFab, InviteMembersModal, KeylessPrompt, OrganizationProfileModal, SignInModal, SignUpModal, UserProfileModal, UserVerificationModal, WaitlistModal, preloadComponent } from "./lazyModules/components.js";
+import { BlankCaptchaModal, CreateOrganizationModal, EnableOrganizationsPrompt, ImpersonationFab, InviteMembersModal, KeylessPrompt, OrganizationProfileModal, ProtectCheckModal, SignInModal, SignUpModal, UserProfileModal, UserVerificationModal, WaitlistModal, preloadComponent } from "./lazyModules/components.js";
 import { MountedCheckoutDrawer, MountedPlanDetailDrawer, MountedSubscriptionDetailDrawer } from "./lazyModules/drawers.js";
 import { LazyComponentRenderer, LazyEnableOrganizationsPromptProvider, LazyImpersonationFabProvider, LazyModalRenderer, LazyOneTapRenderer, LazyProviders, OrganizationSwitcherPrefetch } from "./lazyModules/providers.js";
 import { buildVirtualRouterUrl } from "./utils/buildVirtualRouterUrl.js";
@@ -86,6 +86,7 @@ const Components = (props) => {
 		organizationSwitcherPrefetch: false,
 		waitlistModal: null,
 		blankCaptchaModal: null,
+		protectCheckModal: null,
 		checkoutDrawer: {
 			open: false,
 			props: null
@@ -100,7 +101,7 @@ const Components = (props) => {
 		},
 		impersonationFab: false
 	});
-	const { googleOneTapModal, signInModal, signUpModal, userProfileModal, userVerificationModal, organizationProfileModal, inviteMembersModal, createOrganizationModal, waitlistModal, blankCaptchaModal, checkoutDrawer, planDetailsDrawer, subscriptionDetailsDrawer } = state;
+	const { googleOneTapModal, signInModal, signUpModal, userProfileModal, userVerificationModal, organizationProfileModal, inviteMembersModal, createOrganizationModal, waitlistModal, blankCaptchaModal, protectCheckModal, checkoutDrawer, planDetailsDrawer, subscriptionDetailsDrawer } = state;
 	const clerk = props.getClerk();
 	useSyncExternalStore(useCallback((callback) => clerk.addListener(callback, { skipInitialEmit: true }), [clerk]), useCallback(() => {
 		return clerk.__internal_lastEmittedResources;
@@ -209,6 +210,9 @@ const Components = (props) => {
 				impersonationFab: true
 			}));
 		};
+		componentsControls.openProtectCheckModal = (props) => {
+			componentsControls.openModal("protectCheck", props);
+		};
 		componentsControls.openDrawer = (name, props) => {
 			setState((s) => ({
 				...s,
@@ -418,6 +422,25 @@ const Components = (props) => {
 			children: /* @__PURE__ */ jsx(BlankCaptchaModal, {})
 		}
 	);
+	const mountedProtectCheckModal = protectCheckModal && /* @__PURE__ */ jsx(LazyModalRenderer, {
+		globalAppearance: state.appearance,
+		appearanceKey: "protectCheck",
+		componentAppearance: {},
+		flowName: "protectCheck",
+		onClose: () => componentsControls.closeModal("protectCheck"),
+		startPath: buildVirtualRouterUrl({
+			base: "/protect-check",
+			path: urlStateParam?.path
+		}),
+		componentName: "ProtectCheckModal",
+		canCloseModal: false,
+		modalContainerSx: (t) => ({
+			alignItems: "center",
+			backdropFilter: `blur(${t.sizes.$2})`
+		}),
+		getContainer: () => null,
+		children: /* @__PURE__ */ jsx(ProtectCheckModal, { ...protectCheckModal })
+	});
 	return /* @__PURE__ */ jsx(Suspense, {
 		fallback: "",
 		children: /* @__PURE__ */ jsxs(LazyProviders, {
@@ -446,6 +469,7 @@ const Components = (props) => {
 				createOrganizationModal && mountedCreateOrganizationModal,
 				waitlistModal && mountedWaitlistModal,
 				blankCaptchaModal && mountedBlankCaptchaModal,
+				mountedProtectCheckModal,
 				/* @__PURE__ */ jsx(MountedCheckoutDrawer, {
 					appearance: state.appearance,
 					checkoutDrawer,

package/dist/Components.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Components.js","names":[],"sources":["../src/Components.tsx"],"sourcesContent":["import { clerkUIErrorDOMElementNotFound } from '@clerk/shared/internal/clerk-js/errors';\nimport type { ModuleManager } from '@clerk/shared/moduleManager';\nimport type {\n __internal_CheckoutProps,\n __internal_EnableOrganizationsPromptProps,\n __internal_PlanDetailsProps,\n __internal_SubscriptionDetailsProps,\n __internal_UserVerificationProps,\n Clerk,\n ClerkOptions,\n CreateOrganizationModalProps,\n EnvironmentResource,\n GoogleOneTapProps,\n InviteMembersModalProps,\n OrganizationProfileModalProps,\n SignInModalProps,\n SignInProps,\n SignUpModalProps,\n SignUpProps,\n UserProfileModalProps,\n UserProfileProps,\n WaitlistModalProps,\n WaitlistProps,\n} from '@clerk/shared/types';\nimport { createDeferredPromise } from '@clerk/shared/utils';\nimport React, { Suspense, useCallback, useRef, useSyncExternalStore } from 'react';\n\nimport type { AppearanceCascade } from './customizables/parseAppearance';\n// NOTE: Using `./hooks` instead of `./hooks/useClerkModalStateParams` will increase the bundle size\nimport { useClerkModalStateParams } from './hooks/useClerkModalStateParams';\nimport type { Appearance } from './internal/appearance';\nimport type { ClerkComponentName } from './lazyModules/components';\nimport {\n BlankCaptchaModal,\n CreateOrganizationModal,\n EnableOrganizationsPrompt,\n ImpersonationFab,\n InviteMembersModal,\n KeylessPrompt,\n OrganizationProfileModal,\n preloadComponent,\n SignInModal,\n SignUpModal,\n UserProfileModal,\n UserVerificationModal,\n WaitlistModal,\n} from './lazyModules/components';\nimport { MountedCheckoutDrawer, MountedPlanDetailDrawer, MountedSubscriptionDetailDrawer } from './lazyModules/drawers';\nimport {\n LazyComponentRenderer,\n LazyEnableOrganizationsPromptProvider,\n LazyImpersonationFabProvider,\n LazyModalRenderer,\n LazyOneTapRenderer,\n LazyProviders,\n OrganizationSwitcherPrefetch,\n} from './lazyModules/providers';\nimport type { AvailableComponentProps } from './types';\nimport { buildVirtualRouterUrl } from './utils/buildVirtualRouterUrl';\nimport { disambiguateRedirectOptions } from './utils/disambiguateRedirectOptions';\nimport { extractCssLayerNameFromAppearance } from './utils/extractCssLayerNameFromAppearance';\nimport { warnAboutCustomizationWithoutPinning } from './utils/warnAboutCustomizationWithoutPinning';\n\n// Re-export for ClerkUI\nexport { extractCssLayerNameFromAppearance };\n\n/*\n Avoid importing from `@clerk/shared/react` to prevent extra dependencies being added to the bundle.\n /\nconst useSafeLayoutEffect = typeof window !== 'undefined' ? React.useLayoutEffect : React.useEffect;\n\nexport const ROOT_ELEMENT_ID = 'clerk-components';\n\nexport type ComponentControls = {\n mountComponent: (params: {\n appearanceKey: Uncapitalize<AppearanceCascade['appearanceKey']>;\n name: ClerkComponentName;\n node: HTMLDivElement;\n props?: AvailableComponentProps;\n }) => void;\n unmountComponent: (params: { node: HTMLDivElement }) => void;\n updateProps: (params: {\n appearance?: Appearance \| undefined;\n options?: ClerkOptions \| undefined;\n node?: HTMLDivElement;\n props?: unknown;\n }) => void;\n openModal: <\n T extends\n \| 'googleOneTap'\n \| 'signIn'\n \| 'signUp'\n \| 'userProfile'\n \| 'organizationProfile'\n \| 'inviteMembers'\n \| 'createOrganization'\n \| 'userVerification'\n \| 'waitlist'\n \| 'blankCaptcha'\n \| 'enableOrganizationsPrompt',\n >(\n modal: T,\n props: T extends 'signIn'\n ? SignInProps\n : T extends 'signUp'\n ? SignUpProps\n : T extends 'userVerification'\n ? __internal_UserVerificationProps\n : T extends 'waitlist'\n ? WaitlistProps\n : T extends 'inviteMembers'\n ? InviteMembersModalProps\n : T extends 'enableOrganizationsPrompt'\n ? __internal_EnableOrganizationsPromptProps\n : UserProfileProps,\n ) => void;\n closeModal: (\n modal:\n \| 'googleOneTap'\n \| 'signIn'\n \| 'signUp'\n \| 'userProfile'\n \| 'organizationProfile'\n \| 'inviteMembers'\n \| 'createOrganization'\n \| 'userVerification'\n \| 'waitlist'\n \| 'blankCaptcha'\n \| 'enableOrganizationsPrompt',\n options?: {\n notify?: boolean;\n },\n ) => void;\n openDrawer: <T extends 'checkout' \| 'planDetails' \| 'subscriptionDetails'>(\n drawer: T,\n props: T extends 'checkout'\n ? __internal_CheckoutProps\n : T extends 'planDetails'\n ? __internal_PlanDetailsProps\n : T extends 'subscriptionDetails'\n ? __internal_SubscriptionDetailsProps\n : never,\n ) => void;\n closeDrawer: (\n drawer: 'checkout' \| 'planDetails' \| 'subscriptionDetails',\n options?: {\n notify?: boolean;\n },\n ) => void;\n prefetch: (component: 'organizationSwitcher') => void;\n // Special case, as the impersonation fab mounts automatically\n mountImpersonationFab: () => void;\n};\n\ninterface HtmlNodeOptions {\n key: string;\n name: ClerkComponentName;\n appearanceKey: Uncapitalize<AppearanceCascade['appearanceKey']>;\n props?: AvailableComponentProps;\n}\n\ninterface ComponentsProps {\n getClerk: () => Clerk;\n getEnvironment: () => EnvironmentResource \| null \| undefined;\n options: ClerkOptions;\n onComponentsMounted: () => void;\n moduleManager: ModuleManager;\n}\n\ninterface ComponentsState {\n appearance: Appearance \| undefined;\n options: ClerkOptions \| undefined;\n googleOneTapModal: null \| GoogleOneTapProps;\n signInModal: null \| SignInModalProps;\n signUpModal: null \| SignUpModalProps;\n userProfileModal: null \| UserProfileModalProps;\n userVerificationModal: null \| __internal_UserVerificationProps;\n organizationProfileModal: null \| OrganizationProfileModalProps;\n inviteMembersModal: null \| InviteMembersModalProps;\n createOrganizationModal: null \| CreateOrganizationModalProps;\n enableOrganizationsPromptModal: null \| __internal_EnableOrganizationsPromptProps;\n blankCaptchaModal: null;\n organizationSwitcherPrefetch: boolean;\n waitlistModal: null \| WaitlistModalProps;\n checkoutDrawer: {\n open: false;\n props: null \| __internal_CheckoutProps;\n };\n planDetailsDrawer: {\n open: false;\n props: null \| __internal_PlanDetailsProps;\n };\n subscriptionDetailsDrawer: {\n open: false;\n props: null \| __internal_SubscriptionDetailsProps;\n };\n impersonationFab: boolean;\n}\n\nlet portalCt = 0;\n\nfunction assertDOMElement(element: HTMLElement): asserts element {\n if (!element) {\n clerkUIErrorDOMElementNotFound();\n }\n}\n\nexport const mountComponentRenderer = (\n getClerk: () => Clerk,\n getEnvironment: () => EnvironmentResource \| null \| undefined,\n _options: ClerkOptions,\n moduleManager: ModuleManager,\n) => {\n const options = { ..._options };\n // Extract cssLayerName from theme if present and move it to appearance level\n if (options.appearance) {\n options.appearance = extractCssLayerNameFromAppearance(options.appearance);\n }\n\n // TODO: Init of components should start\n // before /env and /client requests\n let clerkRoot = document.getElementById(ROOT_ELEMENT_ID);\n\n if (!clerkRoot) {\n clerkRoot = document.createElement('div');\n clerkRoot.setAttribute('id', 'clerk-components');\n document.body.appendChild(clerkRoot);\n }\n\n let componentsControlsResolver: Promise<ComponentControls> \| undefined;\n\n return {\n ensureMounted: (opts?: { preloadHint: ClerkComponentName }) => {\n const { preloadHint } = opts \|\| {};\n // Always preload, even if ensureMounted was already called.\n // preloadComponent is idempotent (returns cached promise on subsequent calls).\n if (preloadHint) {\n void preloadComponent(preloadHint).catch(() => {});\n }\n // This mechanism ensures that mountComponentControls will only be called once\n // and any calls to .mount before mountComponentControls resolves will fire in order.\n // Otherwise, we risk having components rendered multiple times, or having\n // .unmountComponent incorrectly called before the component is rendered\n if (!componentsControlsResolver) {\n const deferredPromise = createDeferredPromise();\n const mountTimeout = setTimeout(() => {\n console.error(\n '[Clerk UI] Component renderer did not mount within 10s. Common causes: a failed chunk load, a dev-server misconfiguration (e.g. unresolved lazy-compilation proxy), or a ClerkProvider/mountX call before the page is hydrated. Check the Network tab for stalled or empty requests.',\n );\n }, 10_000);\n componentsControlsResolver = import('./lazyModules/common')\n .then(({ createRoot }) => {\n createRoot(clerkRoot).render(\n <Components\n getClerk={getClerk}\n getEnvironment={getEnvironment}\n options={options}\n onComponentsMounted={() => {\n clearTimeout(mountTimeout);\n // Defer warning check to avoid blocking component mount\n // Only check in development mode (based on publishable key, not NODE_ENV)\n if (getClerk().instanceType === 'development') {\n const scheduleWarningCheck =\n typeof requestIdleCallback === 'function'\n ? requestIdleCallback\n : (cb: () => void) => setTimeout(cb, 0);\n scheduleWarningCheck(() => warnAboutCustomizationWithoutPinning(options));\n }\n deferredPromise.resolve();\n }}\n moduleManager={moduleManager}\n />,\n );\n return deferredPromise.promise.then(() => componentsControls);\n })\n .catch(err => {\n clearTimeout(mountTimeout);\n console.error('[Clerk UI] Failed to initialize component renderer:', err);\n throw err;\n });\n }\n return componentsControlsResolver.then(controls => controls);\n },\n };\n};\n\nexport type MountComponentRenderer = typeof mountComponentRenderer;\n\nconst componentsControls = {} as ComponentControls;\n\nconst componentNodes = Object.freeze({\n SignUp: 'signUpModal',\n SignIn: 'signInModal',\n UserProfile: 'userProfileModal',\n OrganizationProfile: 'organizationProfileModal',\n CreateOrganization: 'createOrganizationModal',\n Waitlist: 'waitlistModal',\n}) as any;\n\nconst Components = (props: ComponentsProps) => {\n const [state, setState] = React.useState<ComponentsState>({\n appearance: props.options.appearance,\n options: props.options,\n googleOneTapModal: null,\n signInModal: null,\n signUpModal: null,\n userProfileModal: null,\n userVerificationModal: null,\n organizationProfileModal: null,\n inviteMembersModal: null,\n createOrganizationModal: null,\n enableOrganizationsPromptModal: null,\n organizationSwitcherPrefetch: false,\n waitlistModal: null,\n blankCaptchaModal: null,\n checkoutDrawer: {\n open: false,\n props: null,\n },\n planDetailsDrawer: {\n open: false,\n props: null,\n },\n subscriptionDetailsDrawer: {\n open: false,\n props: null,\n },\n impersonationFab: false,\n });\n\n const {\n googleOneTapModal,\n signInModal,\n signUpModal,\n userProfileModal,\n userVerificationModal,\n organizationProfileModal,\n inviteMembersModal,\n createOrganizationModal,\n waitlistModal,\n blankCaptchaModal,\n checkoutDrawer,\n planDetailsDrawer,\n subscriptionDetailsDrawer,\n } = state;\n const clerk = props.getClerk();\n\n // We do this to ensure this component re-renders before any children listening to this state does.\n // This is necessary since `unmountComponent` uses `setState` to trigger re-renders, but this can\n // happen _after_ `useSyncExternalStore` triggers a re-render. This can cause the Clerk components to\n // re-render and even run effects when they should have already been unmounted.\n // Forcing this to re-render first to remove the children is a workaround for this issue.\n // Note that this does not fix the issue at its root, which is that it's possible for Clerk components\n // to stay mounted even after their node has been removed.\n useSyncExternalStore(\n useCallback(callback => clerk.addListener(callback, { skipInitialEmit: true }), [clerk]),\n useCallback(() => {\n return clerk.__internal_lastEmittedResources;\n }, [clerk]),\n // This is not a correct implementation of getServerSnapshot, but should be fine since we don't use the\n // return state anyway.\n // We currently do not server render the Clerk components, so leaving it out entirely would also be fine,\n // but this is a workaround to avoid a hard error when we want to experiment with server rendering.\n // A fully correct implementation would require passing in the initialState to the <Components> component.\n useCallback(() => {\n return clerk.__internal_lastEmittedResources;\n }, [clerk]),\n );\n\n // See above comment on useSyncExternalStore for why we use a ref to store the nodes instead of state\n const nodesRef = useRef<Map<HTMLDivElement, HtmlNodeOptions>>(new Map());\n\n const { urlStateParam, clearUrlStateParam, decodedRedirectParams } = useClerkModalStateParams();\n useSafeLayoutEffect(() => {\n if (decodedRedirectParams) {\n setState(s => ({\n ...s,\n [componentNodes[decodedRedirectParams.componentName]]: true,\n }));\n }\n\n const triggerRender = () => {\n setState(s => ({ ...s }));\n };\n\n componentsControls.mountComponent = params => {\n const { node, name, props, appearanceKey } = params;\n assertDOMElement(node);\n nodesRef.current.set(node, { key: `p${++portalCt}`, name, props, appearanceKey });\n triggerRender();\n };\n\n componentsControls.unmountComponent = params => {\n const { node } = params;\n nodesRef.current.delete(node);\n triggerRender();\n };\n\n componentsControls.updateProps = ({ node, props, ...restProps }) => {\n if (node && props && typeof props === 'object') {\n const nodeOptions = nodesRef.current.get(node);\n if (nodeOptions) {\n nodeOptions.props = { ...props };\n triggerRender();\n return;\n }\n }\n\n setState(s => ({ ...s, ...restProps, options: { ...s.options, ...restProps.options } }));\n };\n\n componentsControls.closeModal = (name, options = {}) => {\n const { notify = true } = options;\n clearUrlStateParam();\n setState(s => {\n function handleCloseModalForExperimentalUserVerification() {\n const modal = s[`${name}Modal`];\n if (modal && typeof modal === 'object' && 'afterVerificationCancelled' in modal && notify) {\n // TypeScript doesn't narrow properly with template literal access and 'in' operator\n (modal as { afterVerificationCancelled?: () => void }).afterVerificationCancelled?.();\n }\n }\n\n /\n We need this in order for `Clerk.__experimental_closeUserVerification()`\n * to properly trigger the previously defined `afterVerificationCancelled` callback\n /\n handleCloseModalForExperimentalUserVerification();\n\n return { ...s, [`${name}Modal`]: null };\n });\n };\n\n componentsControls.openModal = (name, props) => {\n // Prevent opening enableOrganizations prompt if it's already open\n // It should open the first call and ignore the subsequent calls\n if (name === 'enableOrganizationsPrompt') {\n setState(prev => {\n // Modal is already open, don't update state\n if (prev.enableOrganizationsPromptModal) {\n return prev;\n }\n\n return { ...prev, [`${name}Modal`]: props };\n });\n return;\n }\n\n function handleCloseModalForExperimentalUserVerification() {\n if (!('afterVerificationCancelled' in props)) {\n return;\n }\n\n setState(s => ({\n ...s,\n [`${name}Modal`]: {\n ...props,\n /\n When a UserVerification flow is completed, we need to close the modal without trigger a cancellation callback\n /\n afterVerification() {\n props.afterVerification?.();\n componentsControls.closeModal(name, { notify: false });\n },\n },\n }));\n }\n\n if ('afterVerificationCancelled' in props) {\n handleCloseModalForExperimentalUserVerification();\n } else {\n setState(s => ({ ...s, [`${name}Modal`]: props }));\n }\n };\n\n componentsControls.mountImpersonationFab = () => {\n setState(s => ({ ...s, impersonationFab: true }));\n };\n\n componentsControls.openDrawer = (name, props) => {\n setState(s => ({\n ...s,\n [`${name}Drawer`]: {\n open: true,\n props,\n },\n }));\n };\n\n componentsControls.closeDrawer = name => {\n setState(s => {\n const currentItem = s[`${name}Drawer`];\n // @ts-expect-error `__internal_PlanDetailsProps` does not accept `onClose`\n currentItem?.props?.onClose?.();\n return {\n ...s,\n [`${name}Drawer`]: {\n ...s[`${name}Drawer`],\n open: false,\n },\n };\n });\n };\n\n componentsControls.prefetch = component => {\n setState(s => ({ ...s, [`${component}Prefetch`]: true }));\n };\n\n props.onComponentsMounted();\n }, []);\n\n const mountedOneTapModal = (\n <LazyOneTapRenderer\n componentProps={googleOneTapModal}\n globalAppearance={state.appearance}\n componentAppearance={googleOneTapModal?.appearance}\n startPath={buildVirtualRouterUrl({ base: '/one-tap', path: '' })}\n />\n );\n\n const mountedSignInModal = (\n <LazyModalRenderer\n globalAppearance={state.appearance}\n appearanceKey={'signIn'}\n componentAppearance={signInModal?.appearance}\n flowName={'signIn'}\n onClose={() => componentsControls.closeModal('signIn')}\n onExternalNavigate={() => componentsControls.closeModal('signIn')}\n startPath={buildVirtualRouterUrl({ base: '/sign-in', path: urlStateParam?.path })}\n getContainer={signInModal?.getContainer ?? (() => null)}\n componentName={'SignInModal'}\n >\n <SignInModal {...signInModal} />\n <SignUpModal {...disambiguateRedirectOptions(signInModal, 'signin')} />\n <WaitlistModal {...waitlistModal} />\n </LazyModalRenderer>\n );\n\n const mountedSignUpModal = (\n <LazyModalRenderer\n globalAppearance={state.appearance}\n appearanceKey={'signUp'}\n componentAppearance={signUpModal?.appearance}\n flowName={'signUp'}\n onClose={() => componentsControls.closeModal('signUp')}\n onExternalNavigate={() => componentsControls.closeModal('signUp')}\n startPath={buildVirtualRouterUrl({ base: '/sign-up', path: urlStateParam?.path })}\n getContainer={signUpModal?.getContainer ?? (() => null)}\n componentName={'SignUpModal'}\n >\n <SignInModal {...disambiguateRedirectOptions(signUpModal, 'signup')} />\n <SignUpModal {...signUpModal} />\n <WaitlistModal {...waitlistModal} />\n </LazyModalRenderer>\n );\n\n const mountedUserProfileModal = (\n <LazyModalRenderer\n globalAppearance={state.appearance}\n appearanceKey={'userProfile'}\n componentAppearance={userProfileModal?.appearance}\n flowName={'userProfile'}\n onClose={() => componentsControls.closeModal('userProfile')}\n onExternalNavigate={() => componentsControls.closeModal('userProfile')}\n startPath={buildVirtualRouterUrl({\n base: '/user',\n path: userProfileModal?.__experimental_startPath \|\| urlStateParam?.path,\n })}\n getContainer={userProfileModal?.getContainer ?? (() => null)}\n componentName={'UserProfileModal'}\n modalContainerSx={{ alignItems: 'center' }}\n modalContentSx={t => ({ height: `min(${t.sizes.$176}, calc(100% - ${t.sizes.$12}))`, margin: 0 })}\n >\n <UserProfileModal {...userProfileModal} />\n </LazyModalRenderer>\n );\n\n const mountedUserVerificationModal = (\n <LazyModalRenderer\n globalAppearance={state.appearance}\n appearanceKey={'userVerification'}\n componentAppearance={userVerificationModal?.appearance}\n flowName={'userVerification'}\n onClose={() => componentsControls.closeModal('userVerification')}\n onExternalNavigate={() => componentsControls.closeModal('userVerification')}\n startPath={buildVirtualRouterUrl({ base: '/user-verification', path: urlStateParam?.path })}\n getContainer={userVerificationModal?.getContainer ?? (() => null)}\n componentName={'UserVerificationModal'}\n modalContainerSx={{ alignItems: 'center' }}\n >\n <UserVerificationModal {...userVerificationModal} />\n </LazyModalRenderer>\n );\n\n const mountedOrganizationProfileModal = (\n <LazyModalRenderer\n globalAppearance={state.appearance}\n appearanceKey={'organizationProfile'}\n componentAppearance={organizationProfileModal?.appearance}\n flowName={'organizationProfile'}\n onClose={() => componentsControls.closeModal('organizationProfile')}\n onExternalNavigate={() => componentsControls.closeModal('organizationProfile')}\n startPath={buildVirtualRouterUrl({\n base: '/organizationProfile',\n path: organizationProfileModal?.__experimental_startPath \|\| urlStateParam?.path,\n })}\n getContainer={organizationProfileModal?.getContainer ?? (() => null)}\n componentName={'OrganizationProfileModal'}\n modalContainerSx={{ alignItems: 'center' }}\n modalContentSx={t => ({ height: `min(${t.sizes.$176}, calc(100% - ${t.sizes.$12}))`, margin: 0 })}\n >\n <OrganizationProfileModal {...organizationProfileModal} />\n </LazyModalRenderer>\n );\n\n const mountedInviteMembersModal = (\n <LazyModalRenderer\n globalAppearance={state.appearance}\n appearanceKey={'organizationProfile'}\n componentAppearance={inviteMembersModal?.appearance}\n flowName={'organizationProfile'}\n onClose={() => componentsControls.closeModal('inviteMembers')}\n onExternalNavigate={() => componentsControls.closeModal('inviteMembers')}\n startPath={buildVirtualRouterUrl({ base: '/inviteMembers', path: urlStateParam?.path })}\n getContainer={inviteMembersModal?.getContainer ?? (() => null)}\n componentName={'InviteMembersModal'}\n modalContainerSx={{ alignItems: 'center' }}\n >\n <InviteMembersModal {...inviteMembersModal} />\n </LazyModalRenderer>\n );\n\n const mountedCreateOrganizationModal = (\n <LazyModalRenderer\n globalAppearance={state.appearance}\n appearanceKey={'createOrganization'}\n componentAppearance={createOrganizationModal?.appearance}\n flowName={'createOrganization'}\n onClose={() => componentsControls.closeModal('createOrganization')}\n onExternalNavigate={() => componentsControls.closeModal('createOrganization')}\n startPath={buildVirtualRouterUrl({ base: '/createOrganization', path: urlStateParam?.path })}\n getContainer={createOrganizationModal?.getContainer ?? (() => null)}\n componentName={'CreateOrganizationModal'}\n modalContainerSx={{ alignItems: 'center' }}\n modalContentSx={t => ({ height: `min(${t.sizes.$120}, calc(100% - ${t.sizes.$12}))`, margin: 0 })}\n >\n <CreateOrganizationModal {...createOrganizationModal} />\n </LazyModalRenderer>\n );\n\n const mountedWaitlistModal = (\n <LazyModalRenderer\n globalAppearance={state.appearance}\n appearanceKey={'waitlist'}\n componentAppearance={waitlistModal?.appearance}\n flowName={'waitlist'}\n onClose={() => componentsControls.closeModal('waitlist')}\n onExternalNavigate={() => componentsControls.closeModal('waitlist')}\n startPath={buildVirtualRouterUrl({ base: '/waitlist', path: urlStateParam?.path })}\n getContainer={waitlistModal?.getContainer ?? (() => null)}\n componentName={'WaitlistModal'}\n >\n <WaitlistModal {...waitlistModal} />\n <SignInModal {...waitlistModal} />\n </LazyModalRenderer>\n );\n\n const mountedBlankCaptchaModal = (\n /\n Captcha modal should not close on `Clerk.navigate()`, hence we are not passing `onExternalNavigate`.\n */\n <LazyModalRenderer\n globalAppearance={state.appearance}\n appearanceKey={'blankCaptcha' as any}\n componentAppearance={{}}\n flowName={'blankCaptcha'}\n onClose={() => componentsControls.closeModal('blankCaptcha')}\n startPath={buildVirtualRouterUrl({ base: '/blank-captcha', path: urlStateParam?.path })}\n componentName={'BlankCaptchaModal'}\n canCloseModal={false}\n modalId={'cl-modal-captcha-wrapper'}\n modalStyle={{ visibility: 'hidden', pointerEvents: 'none' }}\n getContainer={() => null}\n >\n <BlankCaptchaModal />\n </LazyModalRenderer>\n );\n\n return (\n <Suspense fallback={''}>\n <LazyProviders\n clerk={props.getClerk()}\n environment={props.getEnvironment()}\n options={state.options}\n moduleManager={props.moduleManager}\n >\n {[...nodesRef.current].map(([node, component]) => {\n return (\n <LazyComponentRenderer\n key={component.key}\n node={node}\n globalAppearance={state.appearance}\n appearanceKey={component.appearanceKey}\n componentAppearance={component.props?.appearance}\n componentName={component.name}\n componentProps={component.props}\n />\n );\n })}\n\n {googleOneTapModal && mountedOneTapModal}\n {signInModal && mountedSignInModal}\n {signUpModal && mountedSignUpModal}\n {userProfileModal && mountedUserProfileModal}\n {userVerificationModal && mountedUserVerificationModal}\n {organizationProfileModal && mountedOrganizationProfileModal}\n {inviteMembersModal && mountedInviteMembersModal}\n {createOrganizationModal && mountedCreateOrganizationModal}\n {waitlistModal && mountedWaitlistModal}\n {blankCaptchaModal && mountedBlankCaptchaModal}\n\n <MountedCheckoutDrawer\n appearance={state.appearance}\n checkoutDrawer={checkoutDrawer}\n onOpenChange={() => componentsControls.closeDrawer('checkout')}\n />\n\n <MountedPlanDetailDrawer\n appearance={state.appearance}\n planDetailsDrawer={planDetailsDrawer}\n onOpenChange={() => componentsControls.closeDrawer('planDetails')}\n />\n\n <MountedSubscriptionDetailDrawer\n appearance={state.appearance}\n subscriptionDetailsDrawer={subscriptionDetailsDrawer}\n onOpenChange={() => componentsControls.closeDrawer('subscriptionDetails')}\n />\n\n {state.impersonationFab && (\n <LazyImpersonationFabProvider globalAppearance={state.appearance}>\n <ImpersonationFab />\n </LazyImpersonationFabProvider>\n )}\n\n {state.enableOrganizationsPromptModal && (\n <LazyEnableOrganizationsPromptProvider globalAppearance={state.appearance}>\n <EnableOrganizationsPrompt {...state.enableOrganizationsPromptModal} />\n </LazyEnableOrganizationsPromptProvider>\n )}\n\n {state.options?.__internal_keyless_claimKeylessApplicationUrl &&\n state.options?.__internal_keyless_copyInstanceKeysUrl && (\n <LazyImpersonationFabProvider globalAppearance={state.appearance}>\n <KeylessPrompt\n claimUrl={state.options.__internal_keyless_claimKeylessApplicationUrl}\n copyKeysUrl={state.options.__internal_keyless_copyInstanceKeysUrl}\n onDismiss={state.options.__internal_keyless_dismissPrompt}\n />\n </LazyImpersonationFabProvider>\n )}\n\n <Suspense>{state.organizationSwitcherPrefetch && <OrganizationSwitcherPrefetch />}</Suspense>\n </LazyProviders>\n </Suspense>\n );\n};\n"],"mappings":"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"}
1	+ {"version":3,"file":"Components.js","names":[],"sources":["../src/Components.tsx"],"sourcesContent":["import { clerkUIErrorDOMElementNotFound } from '@clerk/shared/internal/clerk-js/errors';\nimport type { ModuleManager } from '@clerk/shared/moduleManager';\nimport type {\n __internal_CheckoutProps,\n __internal_EnableOrganizationsPromptProps,\n __internal_PlanDetailsProps,\n __internal_ProtectCheckModalProps,\n __internal_SubscriptionDetailsProps,\n __internal_UserVerificationProps,\n Clerk,\n ClerkOptions,\n CreateOrganizationModalProps,\n EnvironmentResource,\n GoogleOneTapProps,\n InviteMembersModalProps,\n OrganizationProfileModalProps,\n SignInModalProps,\n SignInProps,\n SignUpModalProps,\n SignUpProps,\n UserProfileModalProps,\n UserProfileProps,\n WaitlistModalProps,\n WaitlistProps,\n} from '@clerk/shared/types';\nimport { createDeferredPromise } from '@clerk/shared/utils';\nimport React, { Suspense, useCallback, useRef, useSyncExternalStore } from 'react';\n\nimport type { AppearanceCascade } from './customizables/parseAppearance';\n// NOTE: Using `./hooks` instead of `./hooks/useClerkModalStateParams` will increase the bundle size\nimport { useClerkModalStateParams } from './hooks/useClerkModalStateParams';\nimport type { Appearance } from './internal/appearance';\nimport type { ClerkComponentName } from './lazyModules/components';\nimport {\n BlankCaptchaModal,\n CreateOrganizationModal,\n EnableOrganizationsPrompt,\n ImpersonationFab,\n InviteMembersModal,\n KeylessPrompt,\n OrganizationProfileModal,\n preloadComponent,\n ProtectCheckModal,\n SignInModal,\n SignUpModal,\n UserProfileModal,\n UserVerificationModal,\n WaitlistModal,\n} from './lazyModules/components';\nimport { MountedCheckoutDrawer, MountedPlanDetailDrawer, MountedSubscriptionDetailDrawer } from './lazyModules/drawers';\nimport {\n LazyComponentRenderer,\n LazyEnableOrganizationsPromptProvider,\n LazyImpersonationFabProvider,\n LazyModalRenderer,\n LazyOneTapRenderer,\n LazyProviders,\n OrganizationSwitcherPrefetch,\n} from './lazyModules/providers';\nimport type { AvailableComponentProps } from './types';\nimport { buildVirtualRouterUrl } from './utils/buildVirtualRouterUrl';\nimport { disambiguateRedirectOptions } from './utils/disambiguateRedirectOptions';\nimport { extractCssLayerNameFromAppearance } from './utils/extractCssLayerNameFromAppearance';\nimport { warnAboutCustomizationWithoutPinning } from './utils/warnAboutCustomizationWithoutPinning';\n\n// Re-export for ClerkUI\nexport { extractCssLayerNameFromAppearance };\n\n/*\n Avoid importing from `@clerk/shared/react` to prevent extra dependencies being added to the bundle.\n /\nconst useSafeLayoutEffect = typeof window !== 'undefined' ? React.useLayoutEffect : React.useEffect;\n\nexport const ROOT_ELEMENT_ID = 'clerk-components';\n\nexport type ComponentControls = {\n mountComponent: (params: {\n appearanceKey: Uncapitalize<AppearanceCascade['appearanceKey']>;\n name: ClerkComponentName;\n node: HTMLDivElement;\n props?: AvailableComponentProps;\n }) => void;\n unmountComponent: (params: { node: HTMLDivElement }) => void;\n updateProps: (params: {\n appearance?: Appearance \| undefined;\n options?: ClerkOptions \| undefined;\n node?: HTMLDivElement;\n props?: unknown;\n }) => void;\n openModal: <\n T extends\n \| 'googleOneTap'\n \| 'signIn'\n \| 'signUp'\n \| 'userProfile'\n \| 'organizationProfile'\n \| 'inviteMembers'\n \| 'createOrganization'\n \| 'userVerification'\n \| 'waitlist'\n \| 'blankCaptcha'\n \| 'protectCheck'\n \| 'enableOrganizationsPrompt',\n >(\n modal: T,\n props: T extends 'signIn'\n ? SignInProps\n : T extends 'signUp'\n ? SignUpProps\n : T extends 'userVerification'\n ? __internal_UserVerificationProps\n : T extends 'waitlist'\n ? WaitlistProps\n : T extends 'inviteMembers'\n ? InviteMembersModalProps\n : T extends 'enableOrganizationsPrompt'\n ? __internal_EnableOrganizationsPromptProps\n : T extends 'protectCheck'\n ? __internal_ProtectCheckModalProps\n : UserProfileProps,\n ) => void;\n closeModal: (\n modal:\n \| 'googleOneTap'\n \| 'signIn'\n \| 'signUp'\n \| 'userProfile'\n \| 'organizationProfile'\n \| 'inviteMembers'\n \| 'createOrganization'\n \| 'userVerification'\n \| 'waitlist'\n \| 'blankCaptcha'\n \| 'protectCheck'\n \| 'enableOrganizationsPrompt',\n options?: {\n notify?: boolean;\n },\n ) => void;\n openDrawer: <T extends 'checkout' \| 'planDetails' \| 'subscriptionDetails'>(\n drawer: T,\n props: T extends 'checkout'\n ? __internal_CheckoutProps\n : T extends 'planDetails'\n ? __internal_PlanDetailsProps\n : T extends 'subscriptionDetails'\n ? __internal_SubscriptionDetailsProps\n : never,\n ) => void;\n closeDrawer: (\n drawer: 'checkout' \| 'planDetails' \| 'subscriptionDetails',\n options?: {\n notify?: boolean;\n },\n ) => void;\n prefetch: (component: 'organizationSwitcher') => void;\n // Special case, as the impersonation fab mounts automatically\n mountImpersonationFab: () => void;\n openProtectCheckModal: (props: __internal_ProtectCheckModalProps) => void;\n};\n\ninterface HtmlNodeOptions {\n key: string;\n name: ClerkComponentName;\n appearanceKey: Uncapitalize<AppearanceCascade['appearanceKey']>;\n props?: AvailableComponentProps;\n}\n\ninterface ComponentsProps {\n getClerk: () => Clerk;\n getEnvironment: () => EnvironmentResource \| null \| undefined;\n options: ClerkOptions;\n onComponentsMounted: () => void;\n moduleManager: ModuleManager;\n}\n\ninterface ComponentsState {\n appearance: Appearance \| undefined;\n options: ClerkOptions \| undefined;\n googleOneTapModal: null \| GoogleOneTapProps;\n signInModal: null \| SignInModalProps;\n signUpModal: null \| SignUpModalProps;\n userProfileModal: null \| UserProfileModalProps;\n userVerificationModal: null \| __internal_UserVerificationProps;\n organizationProfileModal: null \| OrganizationProfileModalProps;\n inviteMembersModal: null \| InviteMembersModalProps;\n createOrganizationModal: null \| CreateOrganizationModalProps;\n enableOrganizationsPromptModal: null \| __internal_EnableOrganizationsPromptProps;\n blankCaptchaModal: null;\n protectCheckModal: null \| __internal_ProtectCheckModalProps;\n organizationSwitcherPrefetch: boolean;\n waitlistModal: null \| WaitlistModalProps;\n checkoutDrawer: {\n open: false;\n props: null \| __internal_CheckoutProps;\n };\n planDetailsDrawer: {\n open: false;\n props: null \| __internal_PlanDetailsProps;\n };\n subscriptionDetailsDrawer: {\n open: false;\n props: null \| __internal_SubscriptionDetailsProps;\n };\n impersonationFab: boolean;\n}\n\nlet portalCt = 0;\n\nfunction assertDOMElement(element: HTMLElement): asserts element {\n if (!element) {\n clerkUIErrorDOMElementNotFound();\n }\n}\n\nexport const mountComponentRenderer = (\n getClerk: () => Clerk,\n getEnvironment: () => EnvironmentResource \| null \| undefined,\n _options: ClerkOptions,\n moduleManager: ModuleManager,\n) => {\n const options = { ..._options };\n // Extract cssLayerName from theme if present and move it to appearance level\n if (options.appearance) {\n options.appearance = extractCssLayerNameFromAppearance(options.appearance);\n }\n\n // TODO: Init of components should start\n // before /env and /client requests\n let clerkRoot = document.getElementById(ROOT_ELEMENT_ID);\n\n if (!clerkRoot) {\n clerkRoot = document.createElement('div');\n clerkRoot.setAttribute('id', 'clerk-components');\n document.body.appendChild(clerkRoot);\n }\n\n let componentsControlsResolver: Promise<ComponentControls> \| undefined;\n\n return {\n ensureMounted: (opts?: { preloadHint: ClerkComponentName }) => {\n const { preloadHint } = opts \|\| {};\n // Always preload, even if ensureMounted was already called.\n // preloadComponent is idempotent (returns cached promise on subsequent calls).\n if (preloadHint) {\n void preloadComponent(preloadHint).catch(() => {});\n }\n // This mechanism ensures that mountComponentControls will only be called once\n // and any calls to .mount before mountComponentControls resolves will fire in order.\n // Otherwise, we risk having components rendered multiple times, or having\n // .unmountComponent incorrectly called before the component is rendered\n if (!componentsControlsResolver) {\n const deferredPromise = createDeferredPromise();\n const mountTimeout = setTimeout(() => {\n console.error(\n '[Clerk UI] Component renderer did not mount within 10s. Common causes: a failed chunk load, a dev-server misconfiguration (e.g. unresolved lazy-compilation proxy), or a ClerkProvider/mountX call before the page is hydrated. Check the Network tab for stalled or empty requests.',\n );\n }, 10_000);\n componentsControlsResolver = import('./lazyModules/common')\n .then(({ createRoot }) => {\n createRoot(clerkRoot).render(\n <Components\n getClerk={getClerk}\n getEnvironment={getEnvironment}\n options={options}\n onComponentsMounted={() => {\n clearTimeout(mountTimeout);\n // Defer warning check to avoid blocking component mount\n // Only check in development mode (based on publishable key, not NODE_ENV)\n if (getClerk().instanceType === 'development') {\n const scheduleWarningCheck =\n typeof requestIdleCallback === 'function'\n ? requestIdleCallback\n : (cb: () => void) => setTimeout(cb, 0);\n scheduleWarningCheck(() => warnAboutCustomizationWithoutPinning(options));\n }\n deferredPromise.resolve();\n }}\n moduleManager={moduleManager}\n />,\n );\n return deferredPromise.promise.then(() => componentsControls);\n })\n .catch(err => {\n clearTimeout(mountTimeout);\n console.error('[Clerk UI] Failed to initialize component renderer:', err);\n throw err;\n });\n }\n return componentsControlsResolver.then(controls => controls);\n },\n };\n};\n\nexport type MountComponentRenderer = typeof mountComponentRenderer;\n\nconst componentsControls = {} as ComponentControls;\n\nconst componentNodes = Object.freeze({\n SignUp: 'signUpModal',\n SignIn: 'signInModal',\n UserProfile: 'userProfileModal',\n OrganizationProfile: 'organizationProfileModal',\n CreateOrganization: 'createOrganizationModal',\n Waitlist: 'waitlistModal',\n}) as any;\n\nconst Components = (props: ComponentsProps) => {\n const [state, setState] = React.useState<ComponentsState>({\n appearance: props.options.appearance,\n options: props.options,\n googleOneTapModal: null,\n signInModal: null,\n signUpModal: null,\n userProfileModal: null,\n userVerificationModal: null,\n organizationProfileModal: null,\n inviteMembersModal: null,\n createOrganizationModal: null,\n enableOrganizationsPromptModal: null,\n organizationSwitcherPrefetch: false,\n waitlistModal: null,\n blankCaptchaModal: null,\n protectCheckModal: null,\n checkoutDrawer: {\n open: false,\n props: null,\n },\n planDetailsDrawer: {\n open: false,\n props: null,\n },\n subscriptionDetailsDrawer: {\n open: false,\n props: null,\n },\n impersonationFab: false,\n });\n\n const {\n googleOneTapModal,\n signInModal,\n signUpModal,\n userProfileModal,\n userVerificationModal,\n organizationProfileModal,\n inviteMembersModal,\n createOrganizationModal,\n waitlistModal,\n blankCaptchaModal,\n protectCheckModal,\n checkoutDrawer,\n planDetailsDrawer,\n subscriptionDetailsDrawer,\n } = state;\n const clerk = props.getClerk();\n\n // We do this to ensure this component re-renders before any children listening to this state does.\n // This is necessary since `unmountComponent` uses `setState` to trigger re-renders, but this can\n // happen _after_ `useSyncExternalStore` triggers a re-render. This can cause the Clerk components to\n // re-render and even run effects when they should have already been unmounted.\n // Forcing this to re-render first to remove the children is a workaround for this issue.\n // Note that this does not fix the issue at its root, which is that it's possible for Clerk components\n // to stay mounted even after their node has been removed.\n useSyncExternalStore(\n useCallback(callback => clerk.addListener(callback, { skipInitialEmit: true }), [clerk]),\n useCallback(() => {\n return clerk.__internal_lastEmittedResources;\n }, [clerk]),\n // This is not a correct implementation of getServerSnapshot, but should be fine since we don't use the\n // return state anyway.\n // We currently do not server render the Clerk components, so leaving it out entirely would also be fine,\n // but this is a workaround to avoid a hard error when we want to experiment with server rendering.\n // A fully correct implementation would require passing in the initialState to the <Components> component.\n useCallback(() => {\n return clerk.__internal_lastEmittedResources;\n }, [clerk]),\n );\n\n // See above comment on useSyncExternalStore for why we use a ref to store the nodes instead of state\n const nodesRef = useRef<Map<HTMLDivElement, HtmlNodeOptions>>(new Map());\n\n const { urlStateParam, clearUrlStateParam, decodedRedirectParams } = useClerkModalStateParams();\n useSafeLayoutEffect(() => {\n if (decodedRedirectParams) {\n setState(s => ({\n ...s,\n [componentNodes[decodedRedirectParams.componentName]]: true,\n }));\n }\n\n const triggerRender = () => {\n setState(s => ({ ...s }));\n };\n\n componentsControls.mountComponent = params => {\n const { node, name, props, appearanceKey } = params;\n assertDOMElement(node);\n nodesRef.current.set(node, { key: `p${++portalCt}`, name, props, appearanceKey });\n triggerRender();\n };\n\n componentsControls.unmountComponent = params => {\n const { node } = params;\n nodesRef.current.delete(node);\n triggerRender();\n };\n\n componentsControls.updateProps = ({ node, props, ...restProps }) => {\n if (node && props && typeof props === 'object') {\n const nodeOptions = nodesRef.current.get(node);\n if (nodeOptions) {\n nodeOptions.props = { ...props };\n triggerRender();\n return;\n }\n }\n\n setState(s => ({ ...s, ...restProps, options: { ...s.options, ...restProps.options } }));\n };\n\n componentsControls.closeModal = (name, options = {}) => {\n const { notify = true } = options;\n clearUrlStateParam();\n setState(s => {\n function handleCloseModalForExperimentalUserVerification() {\n const modal = s[`${name}Modal`];\n if (modal && typeof modal === 'object' && 'afterVerificationCancelled' in modal && notify) {\n // TypeScript doesn't narrow properly with template literal access and 'in' operator\n (modal as { afterVerificationCancelled?: () => void }).afterVerificationCancelled?.();\n }\n }\n\n /\n We need this in order for `Clerk.__experimental_closeUserVerification()`\n * to properly trigger the previously defined `afterVerificationCancelled` callback\n /\n handleCloseModalForExperimentalUserVerification();\n\n return { ...s, [`${name}Modal`]: null };\n });\n };\n\n componentsControls.openModal = (name, props) => {\n // Prevent opening enableOrganizations prompt if it's already open\n // It should open the first call and ignore the subsequent calls\n if (name === 'enableOrganizationsPrompt') {\n setState(prev => {\n // Modal is already open, don't update state\n if (prev.enableOrganizationsPromptModal) {\n return prev;\n }\n\n return { ...prev, [`${name}Modal`]: props };\n });\n return;\n }\n\n function handleCloseModalForExperimentalUserVerification() {\n if (!('afterVerificationCancelled' in props)) {\n return;\n }\n\n setState(s => ({\n ...s,\n [`${name}Modal`]: {\n ...props,\n /\n When a UserVerification flow is completed, we need to close the modal without trigger a cancellation callback\n /\n afterVerification() {\n props.afterVerification?.();\n componentsControls.closeModal(name, { notify: false });\n },\n },\n }));\n }\n\n if ('afterVerificationCancelled' in props) {\n handleCloseModalForExperimentalUserVerification();\n } else {\n setState(s => ({ ...s, [`${name}Modal`]: props }));\n }\n };\n\n componentsControls.mountImpersonationFab = () => {\n setState(s => ({ ...s, impersonationFab: true }));\n };\n\n componentsControls.openProtectCheckModal = props => {\n componentsControls.openModal('protectCheck', props);\n };\n\n componentsControls.openDrawer = (name, props) => {\n setState(s => ({\n ...s,\n [`${name}Drawer`]: {\n open: true,\n props,\n },\n }));\n };\n\n componentsControls.closeDrawer = name => {\n setState(s => {\n const currentItem = s[`${name}Drawer`];\n // @ts-expect-error `__internal_PlanDetailsProps` does not accept `onClose`\n currentItem?.props?.onClose?.();\n return {\n ...s,\n [`${name}Drawer`]: {\n ...s[`${name}Drawer`],\n open: false,\n },\n };\n });\n };\n\n componentsControls.prefetch = component => {\n setState(s => ({ ...s, [`${component}Prefetch`]: true }));\n };\n\n props.onComponentsMounted();\n }, []);\n\n const mountedOneTapModal = (\n <LazyOneTapRenderer\n componentProps={googleOneTapModal}\n globalAppearance={state.appearance}\n componentAppearance={googleOneTapModal?.appearance}\n startPath={buildVirtualRouterUrl({ base: '/one-tap', path: '' })}\n />\n );\n\n const mountedSignInModal = (\n <LazyModalRenderer\n globalAppearance={state.appearance}\n appearanceKey={'signIn'}\n componentAppearance={signInModal?.appearance}\n flowName={'signIn'}\n onClose={() => componentsControls.closeModal('signIn')}\n onExternalNavigate={() => componentsControls.closeModal('signIn')}\n startPath={buildVirtualRouterUrl({ base: '/sign-in', path: urlStateParam?.path })}\n getContainer={signInModal?.getContainer ?? (() => null)}\n componentName={'SignInModal'}\n >\n <SignInModal {...signInModal} />\n <SignUpModal {...disambiguateRedirectOptions(signInModal, 'signin')} />\n <WaitlistModal {...waitlistModal} />\n </LazyModalRenderer>\n );\n\n const mountedSignUpModal = (\n <LazyModalRenderer\n globalAppearance={state.appearance}\n appearanceKey={'signUp'}\n componentAppearance={signUpModal?.appearance}\n flowName={'signUp'}\n onClose={() => componentsControls.closeModal('signUp')}\n onExternalNavigate={() => componentsControls.closeModal('signUp')}\n startPath={buildVirtualRouterUrl({ base: '/sign-up', path: urlStateParam?.path })}\n getContainer={signUpModal?.getContainer ?? (() => null)}\n componentName={'SignUpModal'}\n >\n <SignInModal {...disambiguateRedirectOptions(signUpModal, 'signup')} />\n <SignUpModal {...signUpModal} />\n <WaitlistModal {...waitlistModal} />\n </LazyModalRenderer>\n );\n\n const mountedUserProfileModal = (\n <LazyModalRenderer\n globalAppearance={state.appearance}\n appearanceKey={'userProfile'}\n componentAppearance={userProfileModal?.appearance}\n flowName={'userProfile'}\n onClose={() => componentsControls.closeModal('userProfile')}\n onExternalNavigate={() => componentsControls.closeModal('userProfile')}\n startPath={buildVirtualRouterUrl({\n base: '/user',\n path: userProfileModal?.__experimental_startPath \|\| urlStateParam?.path,\n })}\n getContainer={userProfileModal?.getContainer ?? (() => null)}\n componentName={'UserProfileModal'}\n modalContainerSx={{ alignItems: 'center' }}\n modalContentSx={t => ({ height: `min(${t.sizes.$176}, calc(100% - ${t.sizes.$12}))`, margin: 0 })}\n >\n <UserProfileModal {...userProfileModal} />\n </LazyModalRenderer>\n );\n\n const mountedUserVerificationModal = (\n <LazyModalRenderer\n globalAppearance={state.appearance}\n appearanceKey={'userVerification'}\n componentAppearance={userVerificationModal?.appearance}\n flowName={'userVerification'}\n onClose={() => componentsControls.closeModal('userVerification')}\n onExternalNavigate={() => componentsControls.closeModal('userVerification')}\n startPath={buildVirtualRouterUrl({ base: '/user-verification', path: urlStateParam?.path })}\n getContainer={userVerificationModal?.getContainer ?? (() => null)}\n componentName={'UserVerificationModal'}\n modalContainerSx={{ alignItems: 'center' }}\n >\n <UserVerificationModal {...userVerificationModal} />\n </LazyModalRenderer>\n );\n\n const mountedOrganizationProfileModal = (\n <LazyModalRenderer\n globalAppearance={state.appearance}\n appearanceKey={'organizationProfile'}\n componentAppearance={organizationProfileModal?.appearance}\n flowName={'organizationProfile'}\n onClose={() => componentsControls.closeModal('organizationProfile')}\n onExternalNavigate={() => componentsControls.closeModal('organizationProfile')}\n startPath={buildVirtualRouterUrl({\n base: '/organizationProfile',\n path: organizationProfileModal?.__experimental_startPath \|\| urlStateParam?.path,\n })}\n getContainer={organizationProfileModal?.getContainer ?? (() => null)}\n componentName={'OrganizationProfileModal'}\n modalContainerSx={{ alignItems: 'center' }}\n modalContentSx={t => ({ height: `min(${t.sizes.$176}, calc(100% - ${t.sizes.$12}))`, margin: 0 })}\n >\n <OrganizationProfileModal {...organizationProfileModal} />\n </LazyModalRenderer>\n );\n\n const mountedInviteMembersModal = (\n <LazyModalRenderer\n globalAppearance={state.appearance}\n appearanceKey={'organizationProfile'}\n componentAppearance={inviteMembersModal?.appearance}\n flowName={'organizationProfile'}\n onClose={() => componentsControls.closeModal('inviteMembers')}\n onExternalNavigate={() => componentsControls.closeModal('inviteMembers')}\n startPath={buildVirtualRouterUrl({ base: '/inviteMembers', path: urlStateParam?.path })}\n getContainer={inviteMembersModal?.getContainer ?? (() => null)}\n componentName={'InviteMembersModal'}\n modalContainerSx={{ alignItems: 'center' }}\n >\n <InviteMembersModal {...inviteMembersModal} />\n </LazyModalRenderer>\n );\n\n const mountedCreateOrganizationModal = (\n <LazyModalRenderer\n globalAppearance={state.appearance}\n appearanceKey={'createOrganization'}\n componentAppearance={createOrganizationModal?.appearance}\n flowName={'createOrganization'}\n onClose={() => componentsControls.closeModal('createOrganization')}\n onExternalNavigate={() => componentsControls.closeModal('createOrganization')}\n startPath={buildVirtualRouterUrl({ base: '/createOrganization', path: urlStateParam?.path })}\n getContainer={createOrganizationModal?.getContainer ?? (() => null)}\n componentName={'CreateOrganizationModal'}\n modalContainerSx={{ alignItems: 'center' }}\n modalContentSx={t => ({ height: `min(${t.sizes.$120}, calc(100% - ${t.sizes.$12}))`, margin: 0 })}\n >\n <CreateOrganizationModal {...createOrganizationModal} />\n </LazyModalRenderer>\n );\n\n const mountedWaitlistModal = (\n <LazyModalRenderer\n globalAppearance={state.appearance}\n appearanceKey={'waitlist'}\n componentAppearance={waitlistModal?.appearance}\n flowName={'waitlist'}\n onClose={() => componentsControls.closeModal('waitlist')}\n onExternalNavigate={() => componentsControls.closeModal('waitlist')}\n startPath={buildVirtualRouterUrl({ base: '/waitlist', path: urlStateParam?.path })}\n getContainer={waitlistModal?.getContainer ?? (() => null)}\n componentName={'WaitlistModal'}\n >\n <WaitlistModal {...waitlistModal} />\n <SignInModal {...waitlistModal} />\n </LazyModalRenderer>\n );\n\n const mountedBlankCaptchaModal = (\n /\n Captcha modal should not close on `Clerk.navigate()`, hence we are not passing `onExternalNavigate`.\n */\n <LazyModalRenderer\n globalAppearance={state.appearance}\n appearanceKey={'blankCaptcha' as any}\n componentAppearance={{}}\n flowName={'blankCaptcha'}\n onClose={() => componentsControls.closeModal('blankCaptcha')}\n startPath={buildVirtualRouterUrl({ base: '/blank-captcha', path: urlStateParam?.path })}\n componentName={'BlankCaptchaModal'}\n canCloseModal={false}\n modalId={'cl-modal-captcha-wrapper'}\n modalStyle={{ visibility: 'hidden', pointerEvents: 'none' }}\n getContainer={() => null}\n >\n <BlankCaptchaModal />\n </LazyModalRenderer>\n );\n\n const mountedProtectCheckModal = protectCheckModal && (\n <LazyModalRenderer\n globalAppearance={state.appearance}\n appearanceKey={'protectCheck' as any}\n componentAppearance={{}}\n flowName={'protectCheck'}\n onClose={() => componentsControls.closeModal('protectCheck')}\n startPath={buildVirtualRouterUrl({ base: '/protect-check', path: urlStateParam?.path })}\n componentName={'ProtectCheckModal'}\n canCloseModal={false}\n modalContainerSx={t => ({ alignItems: 'center', backdropFilter: `blur(${t.sizes.$2})` })}\n getContainer={() => null}\n >\n <ProtectCheckModal {...protectCheckModal} />\n </LazyModalRenderer>\n );\n\n return (\n <Suspense fallback={''}>\n <LazyProviders\n clerk={props.getClerk()}\n environment={props.getEnvironment()}\n options={state.options}\n moduleManager={props.moduleManager}\n >\n {[...nodesRef.current].map(([node, component]) => {\n return (\n <LazyComponentRenderer\n key={component.key}\n node={node}\n globalAppearance={state.appearance}\n appearanceKey={component.appearanceKey}\n componentAppearance={component.props?.appearance}\n componentName={component.name}\n componentProps={component.props}\n />\n );\n })}\n\n {googleOneTapModal && mountedOneTapModal}\n {signInModal && mountedSignInModal}\n {signUpModal && mountedSignUpModal}\n {userProfileModal && mountedUserProfileModal}\n {userVerificationModal && mountedUserVerificationModal}\n {organizationProfileModal && mountedOrganizationProfileModal}\n {inviteMembersModal && mountedInviteMembersModal}\n {createOrganizationModal && mountedCreateOrganizationModal}\n {waitlistModal && mountedWaitlistModal}\n {blankCaptchaModal && mountedBlankCaptchaModal}\n {mountedProtectCheckModal}\n\n <MountedCheckoutDrawer\n appearance={state.appearance}\n checkoutDrawer={checkoutDrawer}\n onOpenChange={() => componentsControls.closeDrawer('checkout')}\n />\n\n <MountedPlanDetailDrawer\n appearance={state.appearance}\n planDetailsDrawer={planDetailsDrawer}\n onOpenChange={() => componentsControls.closeDrawer('planDetails')}\n />\n\n <MountedSubscriptionDetailDrawer\n appearance={state.appearance}\n subscriptionDetailsDrawer={subscriptionDetailsDrawer}\n onOpenChange={() => componentsControls.closeDrawer('subscriptionDetails')}\n />\n\n {state.impersonationFab && (\n <LazyImpersonationFabProvider globalAppearance={state.appearance}>\n <ImpersonationFab />\n </LazyImpersonationFabProvider>\n )}\n\n {state.enableOrganizationsPromptModal && (\n <LazyEnableOrganizationsPromptProvider globalAppearance={state.appearance}>\n <EnableOrganizationsPrompt {...state.enableOrganizationsPromptModal} />\n </LazyEnableOrganizationsPromptProvider>\n )}\n\n {state.options?.__internal_keyless_claimKeylessApplicationUrl &&\n state.options?.__internal_keyless_copyInstanceKeysUrl && (\n <LazyImpersonationFabProvider globalAppearance={state.appearance}>\n <KeylessPrompt\n claimUrl={state.options.__internal_keyless_claimKeylessApplicationUrl}\n copyKeysUrl={state.options.__internal_keyless_copyInstanceKeysUrl}\n onDismiss={state.options.__internal_keyless_dismissPrompt}\n />\n </LazyImpersonationFabProvider>\n )}\n\n <Suspense>{state.organizationSwitcherPrefetch && <OrganizationSwitcherPrefetch />}</Suspense>\n </LazyProviders>\n </Suspense>\n );\n};\n"],"mappings":"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"}

package/dist/components/ProtectCheckModal/index.d.ts ADDED Viewed

@@ -0,0 +1,10 @@
+import { __internal_ProtectCheckModalProps } from "@clerk/shared/types";
+//#region src/components/ProtectCheckModal/index.d.ts
+declare function ProtectCheckModal(props: __internal_ProtectCheckModalProps): JSX.Element | null;
+declare namespace ProtectCheckModal {
+  var displayName: string;
+}
+//#endregion
+export { ProtectCheckModal };
+//# sourceMappingURL=index.d.ts.map

package/dist/components/ProtectCheckModal/index.js ADDED Viewed

@@ -0,0 +1,55 @@
+import { Route } from "../../router/Route.js";
+import { Switch } from "../../router/Switch.js";
+import { Flow } from "../../customizables/Flow.js";
+import { withCardStateProvider } from "../../elements/contexts/index.js";
+import { useProtectCheckRunner } from "../../hooks/useProtectCheckRunner.js";
+import { ProtectCheckCard } from "../ProtectCheck/ProtectCheckCard.js";
+import { useEffect, useRef } from "react";
+import { jsx } from "@emotion/react/jsx-runtime";
+//#region src/components/ProtectCheckModal/index.tsx
+const flowOf = (resource) => resource.pathRoot.endsWith("sign_ups") ? "signUp" : "signIn";
+const ProtectCheckModalCard = withCardStateProvider(({ resource, onResolved, onFailed }) => {
+	const runner = useProtectCheckRunner({
+		getProtectCheck: () => resource.protectCheck,
+		getResource: () => resource,
+		reload: () => resource.reload(),
+		submitProtectCheck: (params) => resource.submitProtectCheck(params),
+		onResolved: (updated, isCancelled) => {
+			if (!isCancelled() && !updated.protectCheck) onResolved();
+			return Promise.resolve();
+		},
+		onError: onFailed
+	});
+	return /* @__PURE__ */ jsx(ProtectCheckCard, {
+		flow: flowOf(resource),
+		runner
+	});
+});
+function ProtectCheckModal(props) {
+	const { resource, onResolved } = props;
+	const isClearOnMount = useRef(!resource.protectCheck).current;
+	const didReportClearRef = useRef(false);
+	useEffect(() => {
+		if (isClearOnMount && !didReportClearRef.current) {
+			didReportClearRef.current = true;
+			onResolved();
+		}
+	}, [isClearOnMount, onResolved]);
+	if (isClearOnMount) return null;
+	return /* @__PURE__ */ jsx(Route, {
+		path: "protect-check",
+		children: /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(Flow.Root, {
+			flow: "protectCheck",
+			children: /* @__PURE__ */ jsx(Switch, { children: /* @__PURE__ */ jsx(Route, {
+				index: true,
+				children: /* @__PURE__ */ jsx(ProtectCheckModalCard, { ...props })
+			}) })
+		}) })
+	});
+}
+ProtectCheckModal.displayName = "ProtectCheckModal";
+//#endregion
+export { ProtectCheckModal };
+//# sourceMappingURL=index.js.map

package/dist/components/ProtectCheckModal/index.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"index.js","names":[],"sources":["../../../src/components/ProtectCheckModal/index.tsx"],"sourcesContent":["import type { __internal_ProtectCheckModalProps, SignInResource, SignUpResource } from '@clerk/shared/types';\nimport { useEffect, useRef } from 'react';\n\nimport { withCardStateProvider } from '@/ui/elements/contexts';\n\nimport { Flow } from '../../customizables';\nimport { useProtectCheckRunner } from '../../hooks/useProtectCheckRunner';\nimport { Route, Switch } from '../../router';\nimport { ProtectCheckCard } from '../ProtectCheck/ProtectCheckCard';\n\nconst flowOf = (resource: SignInResource | SignUpResource) =>\n resource.pathRoot.endsWith('sign_ups') ? 'signUp' : 'signIn';\n\nconst ProtectCheckModalCard = withCardStateProvider(\n ({ resource, onResolved, onFailed }: __internal_ProtectCheckModalProps) => {\n const runner = useProtectCheckRunner<SignInResource | SignUpResource>({\n getProtectCheck: () => resource.protectCheck,\n getResource: () => resource,\n reload: () => resource.reload(),\n submitProtectCheck: params => resource.submitProtectCheck(params),\n onResolved: (updated, isCancelled) => {\n if (!isCancelled() && !updated.protectCheck) {\n onResolved();\n }\n return Promise.resolve();\n },\n onError: onFailed,\n });\n\n return (\n <ProtectCheckCard\n flow={flowOf(resource)}\n runner={runner}\n />\n );\n },\n);\n\nfunction ProtectCheckModal(props: __internal_ProtectCheckModalProps): JSX.Element | null {\n const { resource, onResolved } = props;\n const isClearOnMount = useRef(!resource.protectCheck).current;\n const didReportClearRef = useRef(false);\n\n useEffect(() => {\n if (isClearOnMount && !didReportClearRef.current) {\n didReportClearRef.current = true;\n onResolved();\n }\n }, [isClearOnMount, onResolved]);\n\n if (isClearOnMount) {\n return null;\n }\n\n return (\n <Route path='protect-check'>\n <div>\n <Flow.Root flow='protectCheck'>\n <Switch>\n <Route index>\n <ProtectCheckModalCard {...props} />\n </Route>\n </Switch>\n </Flow.Root>\n </div>\n </Route>\n );\n}\n\nProtectCheckModal.displayName = 'ProtectCheckModal';\n\nexport { ProtectCheckModal };\n"],"mappings":";;;;;;;;;;AAUA,MAAM,UAAU,aACd,SAAS,SAAS,SAAS,UAAU,IAAI,WAAW;AAEtD,MAAM,wBAAwB,uBAC3B,EAAE,UAAU,YAAY,eAAkD;CACzE,MAAM,SAAS,sBAAuD;EACpE,uBAAuB,SAAS;EAChC,mBAAmB;EACnB,cAAc,SAAS,OAAO;EAC9B,qBAAoB,WAAU,SAAS,mBAAmB,MAAM;EAChE,aAAa,SAAS,gBAAgB;GACpC,IAAI,CAAC,YAAY,KAAK,CAAC,QAAQ,cAC7B,WAAW;GAEb,OAAO,QAAQ,QAAQ;EACzB;EACA,SAAS;CACX,CAAC;CAED,OACE,oBAAC,kBAAD;EACE,MAAM,OAAO,QAAQ;EACb;CACT;AAEL,CACF;AAEA,SAAS,kBAAkB,OAA8D;CACvF,MAAM,EAAE,UAAU,eAAe;CACjC,MAAM,iBAAiB,OAAO,CAAC,SAAS,YAAY,CAAC,CAAC;CACtD,MAAM,oBAAoB,OAAO,KAAK;CAEtC,gBAAgB;EACd,IAAI,kBAAkB,CAAC,kBAAkB,SAAS;GAChD,kBAAkB,UAAU;GAC5B,WAAW;EACb;CACF,GAAG,CAAC,gBAAgB,UAAU,CAAC;CAE/B,IAAI,gBACF,OAAO;CAGT,OACE,oBAAC,OAAD;EAAO,MAAK;YACV,oBAAC,OAAD,YACE,oBAAC,KAAK,MAAN;GAAW,MAAK;aACd,oBAAC,QAAD,YACE,oBAAC,OAAD;IAAO;cACL,oBAAC,uBAAD,EAAuB,GAAI,MAAQ;GAC9B,GACD;EACC,GACR;CACA;AAEX;AAEA,kBAAkB,cAAc"}

package/dist/components/SignIn/SignInProtectCheck.js CHANGED Viewed

@@ -6,10 +6,10 @@ import { useCardState, withCardStateProvider } from "../../elements/contexts/ind
 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";
 import { useProtectCheckRunner } from "../../hooks/useProtectCheckRunner.js";
 import { ProtectCheckCard } from "../ProtectCheck/ProtectCheckCard.js";
+import { buildSignInOAuthCallbackParams } from "./buildOAuthCallbackParams.js";
+import { isProtectCheckRequiredError, isSignInPendingOAuthTransfer, isSignInProtectGated, resumeSignInAfterProtectCheck } from "./handleProtectCheck.js";
 import { useEffect, useRef, useState } from "react";
 import { removeClerkQueryParam } from "@clerk/shared/internal/clerk-js/queryParams";
 import { useClerk } from "@clerk/shared/react";

package/dist/elements/contexts/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","names":[],"sources":["../../../src/elements/contexts/index.tsx"],"sourcesContent":["import { createContextAndHook } from '@clerk/shared/react';\nimport type { ClerkAPIError, ClerkRuntimeError } from '@clerk/shared/types';\nimport { FloatingTree, useFloatingParentNodeId } from '@floating-ui/react';\nimport React from 'react';\n\nimport { useRouter } from '@/ui/router';\n\nimport { useLocalizations } from '../../customizables';\n\ntype Status = 'idle' \| 'loading' \| 'error';\ntype Metadata = string \| undefined;\ntype CardError = ClerkRuntimeError \| ClerkAPIError \| Metadata \| string;\ntype State = {\n status: Status;\n metadata: Metadata;\n error: string \| undefined;\n rawError?: CardError;\n};\ntype CardStateCtxValue = {\n state: State;\n setState: React.Dispatch<React.SetStateAction<State>>;\n};\n\nconst [CardStateCtx, _useCardState] = createContextAndHook<CardStateCtxValue>('CardState');\n\nexport const CardStateProvider = (props: React.PropsWithChildren<any>) => {\n const { translateError } = useLocalizations();\n const router = useRouter();\n\n const [state, setState] = React.useState<State>(() => {\n const lastError = window?.Clerk?.__internal_last_error \|\| undefined;\n return { status: 'idle', metadata: undefined, error: translateError(lastError), rawError: lastError };\n });\n\n React.useEffect(() => {\n const error = window?.Clerk?.__internal_last_error;\n\n if (error) {\n setState(s => ({ ...s, error: translateError(error), rawError: error }));\n }\n }, [translateError, setState, router.currentPath]);\n\n const value = React.useMemo(() => ({ value: { state, setState } }), [state, setState]);\n return <CardStateCtx.Provider value={value}>{props.children}</CardStateCtx.Provider>;\n};\n\nexport const useCardState = () => {\n const { state, setState } = _useCardState();\n const { translateError } = useLocalizations();\n\n const setIdle = (metadata?: Metadata) => setState(s => ({ ...s, status: 'idle', metadata }));\n const setError = (metadata: CardError) =>\n setState(s => ({ ...s, error: translateError(metadata), rawError: metadata \|\| undefined }));\n const setLoading = (metadata?: Metadata) => setState(s => ({ ...s, status: 'loading', metadata }));\n const runAsync = async <T = unknown,>(cb: Promise<T> \| (() => Promise<T>), metadata?: Metadata) => {\n setLoading(metadata);\n return (typeof cb === 'function' ? cb() : cb)\n .then(res => {\n return res;\n })\n .finally(() => setIdle(metadata));\n };\n\n return {\n setIdle,\n setError,\n setLoading,\n runAsync,\n loadingMetadata: state.status === 'loading' ? state.metadata : undefined,\n error: state.error ? state.error : undefined,\n rawError: state.rawError,\n isLoading: state.status === 'loading',\n isIdle: state.status === 'idle',\n state,\n };\n};\n\nexport const withCardStateProvider = <T,>(Component: React.ComponentType<T>) => {\n return (props: T) => {\n return (\n <CardStateProvider>\n {/* @ts-expect-error /}\n <Component {...props} />\n </CardStateProvider>\n );\n };\n};\n\nexport type FlowMetadata = {\n flow:\n \| 'signIn'\n \| 'signUp'\n \| 'userButton'\n \| 'userProfile'\n \| 'userVerification'\n \| 'organizationProfile'\n \| 'createOrganization'\n \| 'organizationSwitcher'\n \| 'organizationList'\n \| 'oneTap'\n \| 'blankCaptcha'\n \| 'waitlist'\n \| 'checkout'\n \| 'planDetails'\n \| 'pricingTable'\n \| 'apiKeys'\n \| 'configureSSO'\n \| 'configureDirectorySync'\n \| 'oauthConsent'\n \| 'oauthDeviceVerification'\n \| 'subscriptionDetails'\n \| 'tasks'\n \| 'taskChooseOrganization'\n \| 'enableOrganizations'\n \| 'taskResetPassword'\n \| 'taskSetupMfa';\n part?:\n \| 'start'\n \| 'emailCode'\n \| 'emailCode2Fa'\n \| 'phoneCode'\n \| 'phoneCode2Fa'\n \| 'totp2Fa'\n \| 'backupCode2Fa'\n \| 'password'\n \| 'resetPassword'\n \| 'emailLink'\n \| 'emailLinkVerify'\n \| 'emailLinkStatus'\n \| 'alternativeMethods'\n \| 'forgotPasswordMethods'\n \| 'passwordPwnedMethods'\n \| 'passwordCompromisedMethods'\n \| 'havingTrouble'\n \| 'ssoCallback'\n \| 'popupCallback'\n \| 'popover'\n \| 'complete'\n \| 'accountSwitcher'\n \| 'chooseOrganization'\n \| 'chooseWallet'\n \| 'enterpriseConnections'\n \| 'ssoBypass'\n \| 'organizationCreationDisabled'\n \| 'methodSelectionMFA'\n \| 'provideEmail'\n \| 'selectProvider'\n \| 'organizationDomains'\n \| 'configureCreateApp'\n \| 'configureMapAttributes'\n \| 'testSso'\n \| 'ssoActivate'\n \| 'protectCheck'\n \| 'actionBlocked';\n};\n\nconst [FlowMetadataCtx, useFlowMetadata] = createContextAndHook<FlowMetadata>('FlowMetadata');\n\nexport const FlowMetadataProvider = (props: React.PropsWithChildren<FlowMetadata>) => {\n const { flow, part } = props;\n const value = React.useMemo(() => ({ value: props }), [flow, part]);\n return <FlowMetadataCtx.Provider value={value}>{props.children}</FlowMetadataCtx.Provider>;\n};\n\nexport const withFloatingTree = <T,>(Component: React.ComponentType<T>): React.ComponentType<T> => {\n return (props: T) => {\n const parentId = useFloatingParentNodeId();\n if (parentId == null) {\n return (\n <FloatingTree>\n {/ @ts-expect-error /}\n <Component {...props} />\n </FloatingTree>\n );\n }\n\n / @ts-expect-error */\n return <Component {...props} />;\n };\n};\n\nexport { useFlowMetadata };\n"],"mappings":";;;;;;;;AAuBA,MAAM,CAAC,cAAc,iBAAiB,qBAAwC,WAAW;AAEzF,MAAa,qBAAqB,UAAwC;CACxE,MAAM,EAAE,mBAAmB,iBAAiB;CAC5C,MAAM,SAAS,UAAU;CAEzB,MAAM,CAAC,OAAO,YAAY,MAAM,eAAsB;EACpD,MAAM,YAAY,QAAQ,OAAO,yBAAyB;EAC1D,OAAO;GAAE,QAAQ;GAAQ,UAAU;GAAW,OAAO,eAAe,SAAS;GAAG,UAAU;EAAU;CACtG,CAAC;CAED,MAAM,gBAAgB;EACpB,MAAM,QAAQ,QAAQ,OAAO;EAE7B,IAAI,OACF,UAAS,OAAM;GAAE,GAAG;GAAG,OAAO,eAAe,KAAK;GAAG,UAAU;EAAM,EAAE;CAE3E,GAAG;EAAC;EAAgB;EAAU,OAAO;CAAW,CAAC;CAEjD,MAAM,QAAQ,MAAM,eAAe,EAAE,OAAO;EAAE;EAAO;CAAS,EAAE,IAAI,CAAC,OAAO,QAAQ,CAAC;CACrF,OAAO,oBAAC,aAAa,UAAd;EAA8B;YAAQ,MAAM;CAAgC;AACrF;AAEA,MAAa,qBAAqB;CAChC,MAAM,EAAE,OAAO,aAAa,cAAc;CAC1C,MAAM,EAAE,mBAAmB,iBAAiB;CAE5C,MAAM,WAAW,aAAwB,UAAS,OAAM;EAAE,GAAG;EAAG,QAAQ;EAAQ;CAAS,EAAE;CAC3F,MAAM,YAAY,aAChB,UAAS,OAAM;EAAE,GAAG;EAAG,OAAO,eAAe,QAAQ;EAAG,UAAU,YAAY;CAAU,EAAE;CAC5F,MAAM,cAAc,aAAwB,UAAS,OAAM;EAAE,GAAG;EAAG,QAAQ;EAAW;CAAS,EAAE;CACjG,MAAM,WAAW,OAAqB,IAAqC,aAAwB;EACjG,WAAW,QAAQ;EACnB,QAAQ,OAAO,OAAO,aAAa,GAAG,IAAI,GAAE,CACzC,MAAK,QAAO;GACX,OAAO;EACT,CAAC,CAAC,CACD,cAAc,QAAQ,QAAQ,CAAC;CACpC;CAEA,OAAO;EACL;EACA;EACA;EACA;EACA,iBAAiB,MAAM,WAAW,YAAY,MAAM,WAAW;EAC/D,OAAO,MAAM,QAAQ,MAAM,QAAQ;EACnC,UAAU,MAAM;EAChB,WAAW,MAAM,WAAW;EAC5B,QAAQ,MAAM,WAAW;EACzB;CACF;AACF;AAEA,MAAa,yBAA6B,cAAsC;CAC9E,QAAQ,UAAa;EACnB,OACE,oBAAC,mBAAD,YAEE,oBAAC,WAAD,EAAW,GAAI,MAAQ,GACN;CAEvB;AACF;~~AAsEA~~,MAAM,CAAC,iBAAiB,mBAAmB,qBAAmC,cAAc;AAE5F,MAAa,wBAAwB,UAAiD;CACpF,MAAM,EAAE,MAAM,SAAS;CACvB,MAAM,QAAQ,MAAM,eAAe,EAAE,OAAO,MAAM,IAAI,CAAC,MAAM,IAAI,CAAC;CAClE,OAAO,oBAAC,gBAAgB,UAAjB;EAAiC;YAAQ,MAAM;CAAmC;AAC3F;AAEA,MAAa,oBAAwB,cAA8D;CACjG,QAAQ,UAAa;EAEnB,IADiB,wBACN,KAAK,MACd,OACE,oBAAC,cAAD,YAEE,oBAAC,WAAD,EAAW,GAAI,MAAQ,GACX;EAKlB,OAAO,oBAAC,WAAD,EAAW,GAAI,MAAQ;CAChC;AACF"}
1	+ {"version":3,"file":"index.js","names":[],"sources":["../../../src/elements/contexts/index.tsx"],"sourcesContent":["import { createContextAndHook } from '@clerk/shared/react';\nimport type { ClerkAPIError, ClerkRuntimeError } from '@clerk/shared/types';\nimport { FloatingTree, useFloatingParentNodeId } from '@floating-ui/react';\nimport React from 'react';\n\nimport { useRouter } from '@/ui/router';\n\nimport { useLocalizations } from '../../customizables';\n\ntype Status = 'idle' \| 'loading' \| 'error';\ntype Metadata = string \| undefined;\ntype CardError = ClerkRuntimeError \| ClerkAPIError \| Metadata \| string;\ntype State = {\n status: Status;\n metadata: Metadata;\n error: string \| undefined;\n rawError?: CardError;\n};\ntype CardStateCtxValue = {\n state: State;\n setState: React.Dispatch<React.SetStateAction<State>>;\n};\n\nconst [CardStateCtx, _useCardState] = createContextAndHook<CardStateCtxValue>('CardState');\n\nexport const CardStateProvider = (props: React.PropsWithChildren<any>) => {\n const { translateError } = useLocalizations();\n const router = useRouter();\n\n const [state, setState] = React.useState<State>(() => {\n const lastError = window?.Clerk?.__internal_last_error \|\| undefined;\n return { status: 'idle', metadata: undefined, error: translateError(lastError), rawError: lastError };\n });\n\n React.useEffect(() => {\n const error = window?.Clerk?.__internal_last_error;\n\n if (error) {\n setState(s => ({ ...s, error: translateError(error), rawError: error }));\n }\n }, [translateError, setState, router.currentPath]);\n\n const value = React.useMemo(() => ({ value: { state, setState } }), [state, setState]);\n return <CardStateCtx.Provider value={value}>{props.children}</CardStateCtx.Provider>;\n};\n\nexport const useCardState = () => {\n const { state, setState } = _useCardState();\n const { translateError } = useLocalizations();\n\n const setIdle = (metadata?: Metadata) => setState(s => ({ ...s, status: 'idle', metadata }));\n const setError = (metadata: CardError) =>\n setState(s => ({ ...s, error: translateError(metadata), rawError: metadata \|\| undefined }));\n const setLoading = (metadata?: Metadata) => setState(s => ({ ...s, status: 'loading', metadata }));\n const runAsync = async <T = unknown,>(cb: Promise<T> \| (() => Promise<T>), metadata?: Metadata) => {\n setLoading(metadata);\n return (typeof cb === 'function' ? cb() : cb)\n .then(res => {\n return res;\n })\n .finally(() => setIdle(metadata));\n };\n\n return {\n setIdle,\n setError,\n setLoading,\n runAsync,\n loadingMetadata: state.status === 'loading' ? state.metadata : undefined,\n error: state.error ? state.error : undefined,\n rawError: state.rawError,\n isLoading: state.status === 'loading',\n isIdle: state.status === 'idle',\n state,\n };\n};\n\nexport const withCardStateProvider = <T,>(Component: React.ComponentType<T>) => {\n return (props: T) => {\n return (\n <CardStateProvider>\n {/* @ts-expect-error /}\n <Component {...props} />\n </CardStateProvider>\n );\n };\n};\n\nexport type FlowMetadata = {\n flow:\n \| 'signIn'\n \| 'signUp'\n \| 'userButton'\n \| 'userProfile'\n \| 'userVerification'\n \| 'organizationProfile'\n \| 'createOrganization'\n \| 'organizationSwitcher'\n \| 'organizationList'\n \| 'oneTap'\n \| 'blankCaptcha'\n \| 'protectCheck'\n \| 'waitlist'\n \| 'checkout'\n \| 'planDetails'\n \| 'pricingTable'\n \| 'apiKeys'\n \| 'configureSSO'\n \| 'configureDirectorySync'\n \| 'oauthConsent'\n \| 'oauthDeviceVerification'\n \| 'subscriptionDetails'\n \| 'tasks'\n \| 'taskChooseOrganization'\n \| 'enableOrganizations'\n \| 'taskResetPassword'\n \| 'taskSetupMfa';\n part?:\n \| 'start'\n \| 'emailCode'\n \| 'emailCode2Fa'\n \| 'phoneCode'\n \| 'phoneCode2Fa'\n \| 'totp2Fa'\n \| 'backupCode2Fa'\n \| 'password'\n \| 'resetPassword'\n \| 'emailLink'\n \| 'emailLinkVerify'\n \| 'emailLinkStatus'\n \| 'alternativeMethods'\n \| 'forgotPasswordMethods'\n \| 'passwordPwnedMethods'\n \| 'passwordCompromisedMethods'\n \| 'havingTrouble'\n \| 'ssoCallback'\n \| 'popupCallback'\n \| 'popover'\n \| 'complete'\n \| 'accountSwitcher'\n \| 'chooseOrganization'\n \| 'chooseWallet'\n \| 'enterpriseConnections'\n \| 'ssoBypass'\n \| 'organizationCreationDisabled'\n \| 'methodSelectionMFA'\n \| 'provideEmail'\n \| 'selectProvider'\n \| 'organizationDomains'\n \| 'configureCreateApp'\n \| 'configureMapAttributes'\n \| 'testSso'\n \| 'ssoActivate'\n \| 'protectCheck'\n \| 'actionBlocked';\n};\n\nconst [FlowMetadataCtx, useFlowMetadata] = createContextAndHook<FlowMetadata>('FlowMetadata');\n\nexport const FlowMetadataProvider = (props: React.PropsWithChildren<FlowMetadata>) => {\n const { flow, part } = props;\n const value = React.useMemo(() => ({ value: props }), [flow, part]);\n return <FlowMetadataCtx.Provider value={value}>{props.children}</FlowMetadataCtx.Provider>;\n};\n\nexport const withFloatingTree = <T,>(Component: React.ComponentType<T>): React.ComponentType<T> => {\n return (props: T) => {\n const parentId = useFloatingParentNodeId();\n if (parentId == null) {\n return (\n <FloatingTree>\n {/ @ts-expect-error /}\n <Component {...props} />\n </FloatingTree>\n );\n }\n\n / @ts-expect-error */\n return <Component {...props} />;\n };\n};\n\nexport { useFlowMetadata };\n"],"mappings":";;;;;;;;AAuBA,MAAM,CAAC,cAAc,iBAAiB,qBAAwC,WAAW;AAEzF,MAAa,qBAAqB,UAAwC;CACxE,MAAM,EAAE,mBAAmB,iBAAiB;CAC5C,MAAM,SAAS,UAAU;CAEzB,MAAM,CAAC,OAAO,YAAY,MAAM,eAAsB;EACpD,MAAM,YAAY,QAAQ,OAAO,yBAAyB;EAC1D,OAAO;GAAE,QAAQ;GAAQ,UAAU;GAAW,OAAO,eAAe,SAAS;GAAG,UAAU;EAAU;CACtG,CAAC;CAED,MAAM,gBAAgB;EACpB,MAAM,QAAQ,QAAQ,OAAO;EAE7B,IAAI,OACF,UAAS,OAAM;GAAE,GAAG;GAAG,OAAO,eAAe,KAAK;GAAG,UAAU;EAAM,EAAE;CAE3E,GAAG;EAAC;EAAgB;EAAU,OAAO;CAAW,CAAC;CAEjD,MAAM,QAAQ,MAAM,eAAe,EAAE,OAAO;EAAE;EAAO;CAAS,EAAE,IAAI,CAAC,OAAO,QAAQ,CAAC;CACrF,OAAO,oBAAC,aAAa,UAAd;EAA8B;YAAQ,MAAM;CAAgC;AACrF;AAEA,MAAa,qBAAqB;CAChC,MAAM,EAAE,OAAO,aAAa,cAAc;CAC1C,MAAM,EAAE,mBAAmB,iBAAiB;CAE5C,MAAM,WAAW,aAAwB,UAAS,OAAM;EAAE,GAAG;EAAG,QAAQ;EAAQ;CAAS,EAAE;CAC3F,MAAM,YAAY,aAChB,UAAS,OAAM;EAAE,GAAG;EAAG,OAAO,eAAe,QAAQ;EAAG,UAAU,YAAY;CAAU,EAAE;CAC5F,MAAM,cAAc,aAAwB,UAAS,OAAM;EAAE,GAAG;EAAG,QAAQ;EAAW;CAAS,EAAE;CACjG,MAAM,WAAW,OAAqB,IAAqC,aAAwB;EACjG,WAAW,QAAQ;EACnB,QAAQ,OAAO,OAAO,aAAa,GAAG,IAAI,GAAE,CACzC,MAAK,QAAO;GACX,OAAO;EACT,CAAC,CAAC,CACD,cAAc,QAAQ,QAAQ,CAAC;CACpC;CAEA,OAAO;EACL;EACA;EACA;EACA;EACA,iBAAiB,MAAM,WAAW,YAAY,MAAM,WAAW;EAC/D,OAAO,MAAM,QAAQ,MAAM,QAAQ;EACnC,UAAU,MAAM;EAChB,WAAW,MAAM,WAAW;EAC5B,QAAQ,MAAM,WAAW;EACzB;CACF;AACF;AAEA,MAAa,yBAA6B,cAAsC;CAC9E,QAAQ,UAAa;EACnB,OACE,oBAAC,mBAAD,YAEE,oBAAC,WAAD,EAAW,GAAI,MAAQ,GACN;CAEvB;AACF;AAuEA,MAAM,CAAC,iBAAiB,mBAAmB,qBAAmC,cAAc;AAE5F,MAAa,wBAAwB,UAAiD;CACpF,MAAM,EAAE,MAAM,SAAS;CACvB,MAAM,QAAQ,MAAM,eAAe,EAAE,OAAO,MAAM,IAAI,CAAC,MAAM,IAAI,CAAC;CAClE,OAAO,oBAAC,gBAAgB,UAAjB;EAAiC;YAAQ,MAAM;CAAmC;AAC3F;AAEA,MAAa,oBAAwB,cAA8D;CACjG,QAAQ,UAAa;EAEnB,IADiB,wBACN,KAAK,MACd,OACE,oBAAC,cAAD,YAEE,oBAAC,WAAD,EAAW,GAAI,MAAQ,GACX;EAKlB,OAAO,oBAAC,WAAD,EAAW,GAAI,MAAQ;CAChC;AACF"}

package/dist/hooks/useProtectCheckRunner.js CHANGED Viewed

@@ -20,7 +20,14 @@ function useProtectCheckRunner(params) {
 	const loaderTimeoutMs = useClerk().__internal_protectChallengeLoadTimeoutMs;
 	const instanceTimeoutMs = useEnvironment().protectConfig?.challenge_load_timeout_ms;
 	const loadTimeoutMs = loaderTimeoutMs ?? instanceTimeoutMs;
+	const paramsRef = React.useRef(params);
+	paramsRef.current = params;
 	const reportError = (err) => {
+		const { onError } = paramsRef.current;
+		if (onError) {
+			onError(err);
+			return;
+		}
 		try {
 			handleError(err, [], card.setError);
 		} catch {
@@ -40,8 +47,6 @@ function useProtectCheckRunner(params) {
 			mountedRef.current = false;
 		};
 	}, []);
-	const paramsRef = React.useRef(params);
-	paramsRef.current = params;
 	const reloadCountRef = React.useRef(0);
 	const token = params.getProtectCheck()?.token;
 	React.useEffect(() => {

package/dist/hooks/useProtectCheckRunner.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useProtectCheckRunner.js","names":[],"sources":["../../src/hooks/useProtectCheckRunner.ts"],"sourcesContent":["import { ClerkRuntimeError } from '@clerk/shared/error';\nimport { ERROR_CODES } from '@clerk/shared/internal/clerk-js/constants';\nimport type { ProtectCheckRunnerResource } from '@clerk/shared/internal/clerk-js/protectCheckRunner';\nimport { useClerk } from '@clerk/shared/react';\nimport React from 'react';\nimport { flushSync } from 'react-dom';\n\nimport { useEnvironment } from '@/ui/contexts/EnvironmentContext';\nimport { useCardState } from '@/ui/elements/contexts';\nimport { handleError } from '@/ui/utils/errorHandler';\n\nexport interface ProtectCheckRunnerParams<TResource> extends ProtectCheckRunnerResource<TResource> {\n /*\n Continues the flow once the gate clears (or a chained challenge / already-resolved is\n * detected). Receives the resource to route on (the `submitProtectCheck` result, or the live\n * resource after a reload) and must finalize (`setActive`) the `complete` case itself.\n * `isCancelled` lets the continuation bail if the component unmounted mid-await.\n /\n onResolved: (resource: TResource, isCancelled: () => boolean) => Promise<unknown>;\n}\n\nexport interface ProtectCheckRunnerState {\n containerRef: React.MutableRefObject<HTMLDivElement \| null>;\n isRunning: boolean;\n /\n Whether the challenge script has signalled (via the `setWidgetVisible` init callback) that\n * it is showing a widget in the container. While true, the widget owns the progress UI —\n * callers should hide their own spinner and give the container layout space.\n /\n isWidgetVisible: boolean;\n /* The (recoverable) error the card is currently showing, if any. /\n error: string \| undefined;\n /* Clears the error and re-runs the challenge from scratch. /\n retry: () => void;\n}\n\n/\n Shared driver for the `<SignInProtectCheck />` and `<SignUpProtectCheck />` cards. The challenge\n * lifecycle itself lives in `runProtectCheck` from `@clerk/shared`. This hook binds it to the\n * card's spinner, error, and continuation.\n \n Must be called from within a `CardStateProvider`.\n */\nexport function useProtectCheckRunner<TResource>(params: ProtectCheckRunnerParams<TResource>): ProtectCheckRunnerState {\n const card = useCardState();\n\n // Override for the module-LOAD bound only (see `executeProtectCheck`), resolved loader first\n // and instance second: a loader being rolled out gradually can carry its own value without\n // changing anything for browsers still on the loader it replaces. Undefined at both levels\n // leaves the SDK default in force. Read here rather than inside the effect so the effect keeps\n // depending on primitives.\n // Older clerk-js versions omit this getter; undefined preserves the instance/default fallback.\n const loaderTimeoutMs = useClerk().__internal_protectChallengeLoadTimeoutMs;\n const instanceTimeoutMs = useEnvironment().protectConfig?.challenge_load_timeout_ms;\n const loadTimeoutMs = loaderTimeoutMs ?? instanceTimeoutMs;\n\n // `handleError` re-throws what it does not recognise, and this runner awaits caller code that\n // raises plain errors (a transient fetch failure, an OAuth continuation that did not complete).\n const reportError = (err: any) => {\n try {\n handleError(err, [], card.setError);\n } catch {\n card.setError('Unable to complete action at this time. If the problem persists please contact support.');\n }\n };\n\n const containerRef = React.useRef<HTMLDivElement \| null>(null);\n const isRunningRef = React.useRef(false);\n // Identifies the most recent run, so a continuation can tell when a newer challenge replaced it.\n const runIdRef = React.useRef(0);\n const [isRunning, setIsRunning] = React.useState(false);\n const [isWidgetVisible, setIsWidgetVisibleState] = React.useState(false);\n const [retryNonce, setRetryNonce] = React.useState(0);\n\n // Tracks real unmount, distinct from the per-run `cancelled` flag below. Clearing `protectCheck`\n // (e.g. an expired-challenge reload that advances the flow) flips the token dependency and\n // re-runs/cancels the main effect — but that re-run is exactly our cue to route, so the routing\n // must key on actual unmount, not on the effect's cancel flag.\n const mountedRef = React.useRef(true);\n React.useEffect(() => {\n mountedRef.current = true;\n return () => {\n mountedRef.current = false;\n };\n }, []);\n\n // Keep the latest callbacks without re-running the effect when the caller re-renders.\n const paramsRef = React.useRef(params);\n paramsRef.current = params;\n\n const reloadCountRef = React.useRef(0);\n\n const token = params.getProtectCheck()?.token;\n\n React.useEffect(() => {\n const { getProtectCheck, onResolved } = paramsRef.current;\n const protectCheck = getProtectCheck();\n if (!protectCheck \|\| isRunningRef.current) {\n return;\n }\n\n const abortController = new AbortController();\n let cancelled = false;\n // Routing after the gate clears must survive the effect re-run that\n // clearing `protectCheck` triggers — that re-run is our cue to route, not a\n // reason to bail. So the onResolved paths below key on REAL unmount, not the\n // effect's per-run `cancelled` flag (which the re-run's cleanup sets).\n const isUnmounted = () => !mountedRef.current;\n\n const cleanup = () => {\n cancelled = true;\n abortController.abort();\n // Reset the guard so the next mount / token change / retry can re-run; this is what makes\n // chained challenges work correctly across re-renders.\n isRunningRef.current = false;\n };\n\n // The script owns the widget-visibility decision: it receives this callback in its init\n // payload (as `setWidgetVisible`) and calls it right before revealing UI in the container,\n // and again with `false` once its widget is done. flushSync so the returned promise only\n // resolves after the change is committed to the DOM — the caller's spinner is genuinely\n // gone when the script reveals its widget, with no frame of overlap (same guarantee\n // BaseRouter relies on flushSync for). Scoped to THIS run: the abort contract is\n // best-effort, so a zombie script from a timed-out, retried, or superseded run can still\n // call it late — those signals must not flip visibility under the active run.\n const setWidgetVisible = (visible: boolean): Promise<void> => {\n if (cancelled \|\| abortController.signal.aborted \|\| !mountedRef.current) {\n return Promise.resolve();\n }\n flushSync(() => setIsWidgetVisibleState(visible));\n return Promise.resolve();\n };\n\n // Fail closed in no-RHC builds (chrome extension / clerk.no-rhc.js): the gate requires a\n // remote `import(sdk_url)` we must not perform there. This guard MUST live in the component\n // layer. The runner is in `@clerk/shared`, compiled once with the flag hard-coded `false`,\n // so a guard there would never trip.\n if (__BUILD_DISABLE_RHC__) {\n isRunningRef.current = false;\n setIsRunning(false);\n handleError(\n new ClerkRuntimeError('Protect verification is not supported in this environment', {\n code: ERROR_CODES.PROTECT_CHECK_UNSUPPORTED_ENVIRONMENT,\n }),\n [],\n card.setError,\n );\n return;\n }\n\n const container = containerRef.current;\n if (!container) {\n return;\n }\n\n // This run owns the container outright: drop anything a previous run left behind (a solved or\n // errored widget) so the spinner covers the load phase and a re-rendering SDK can't stack a\n // second widget under a stale one. Reset visibility in the same breath — the container is\n // empty by construction here, and waiting on the observer callback would leave the state\n // stale for a scheduling-dependent window (especially on the MutationObserver fallback).\n while (container.firstChild) {\n container.removeChild(container.firstChild);\n }\n setIsWidgetVisibleState(false);\n\n isRunningRef.current = true;\n setIsRunning(true);\n const runId = ++runIdRef.current;\n\n // Whether this run still owns the card's error and spinner. Until the gate clears, that ends\n // with the run's cancellation. Afterwards the continuation (`onResolved`) is still this run's\n // even though clearing the gate cancelled it, so it only stops owning them on unmount or when a\n // newer challenge has started a run of its own. Keying the continuation on `cancelled` swallowed\n // its failures and left the spinner running with no error.\n let continuing = false;\n const ownsOutcome = () => (continuing ? !isUnmounted() && runIdRef.current === runId : !cancelled);\n\n const runChallenge = async () => {\n try {\n // Load the Protect SDK loader lazily, gated on the same compile-time flag as the\n // fail-closed guard above. In no-RHC builds `__BUILD_DISABLE_RHC__` is `true`, so this\n // branch (and the dynamic `import()` below it) is dead-code-eliminated — the loader and\n // its remote `import(sdk_url)` are tree-shaken out of those bundles entirely rather than\n // merely shipped-but-unused.\n if (__BUILD_DISABLE_RHC__) {\n return;\n }\n const { runProtectCheck } = await import('@clerk/shared/internal/clerk-js/protectCheckRunner');\n const outcome = await runProtectCheck(paramsRef.current, protectCheck, {\n container,\n expiredReloads: reloadCountRef,\n signal: abortController.signal,\n setWidgetVisible,\n loadTimeoutMs,\n });\n // A reissued challenge carries a new token, which re-runs this effect (keyed on the token).\n if (outcome.status === 'reissued' \|\| isUnmounted()) {\n return;\n }\n continuing = true;\n await onResolved(outcome.resource, isUnmounted);\n } catch (err: any) {\n if (!ownsOutcome()) {\n return;\n }\n reportError(err);\n } finally {\n if (ownsOutcome()) {\n isRunningRef.current = false;\n setIsRunning(false);\n }\n }\n };\n\n void runChallenge();\n return cleanup;\n // Keyed on the challenge token (a primitive) rather than the protectCheck object: an unrelated\n // resource refresh keeps the same token and must NOT restart the challenge, while a genuine\n // chained challenge carries a new token and re-runs. `retryNonce` re-runs on manual retry.\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [token, retryNonce]);\n\n const retry = React.useCallback(() => {\n card.setError('');\n isRunningRef.current = false;\n reloadCountRef.current = 0;\n\n // The gate already cleared and it was the continuation that failed: there is no challenge left\n // to re-run, so re-running the effect would do nothing. Retry the continuation instead.\n const { getProtectCheck, getResource, onResolved } = paramsRef.current;\n if (!getProtectCheck()) {\n const runId = ++runIdRef.current;\n const ownsOutcome = () => mountedRef.current && runIdRef.current === runId;\n isRunningRef.current = true;\n setIsRunning(true);\n void onResolved(getResource(), () => !mountedRef.current)\n .catch(err => {\n if (ownsOutcome()) {\n reportError(err);\n }\n })\n .finally(() => {\n if (ownsOutcome()) {\n isRunningRef.current = false;\n setIsRunning(false);\n }\n });\n return;\n }\n\n setRetryNonce(n => n + 1);\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, []);\n\n return { containerRef, isRunning, isWidgetVisible, error: card.error, retry };\n}\n"],"mappings":"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"}
1	+ {"version":3,"file":"useProtectCheckRunner.js","names":[],"sources":["../../src/hooks/useProtectCheckRunner.ts"],"sourcesContent":["import { ClerkRuntimeError } from '@clerk/shared/error';\nimport { ERROR_CODES } from '@clerk/shared/internal/clerk-js/constants';\nimport type { ProtectCheckRunnerResource } from '@clerk/shared/internal/clerk-js/protectCheckRunner';\nimport { useClerk } from '@clerk/shared/react';\nimport React from 'react';\nimport { flushSync } from 'react-dom';\n\nimport { useEnvironment } from '@/ui/contexts/EnvironmentContext';\nimport { useCardState } from '@/ui/elements/contexts';\nimport { handleError } from '@/ui/utils/errorHandler';\n\nexport interface ProtectCheckRunnerParams<TResource> extends ProtectCheckRunnerResource<TResource> {\n /*\n Continues the flow once the gate clears (or a chained challenge / already-resolved is\n * detected). Receives the resource to route on (the `submitProtectCheck` result, or the live\n * resource after a reload) and must finalize (`setActive`) the `complete` case itself.\n * `isCancelled` lets the continuation bail if the component unmounted mid-await.\n /\n onResolved: (resource: TResource, isCancelled: () => boolean) => Promise<unknown>;\n onError?: (error: unknown) => void;\n}\n\nexport interface ProtectCheckRunnerState {\n containerRef: React.MutableRefObject<HTMLDivElement \| null>;\n isRunning: boolean;\n /\n Whether the challenge script has signalled (via the `setWidgetVisible` init callback) that\n * it is showing a widget in the container. While true, the widget owns the progress UI —\n * callers should hide their own spinner and give the container layout space.\n /\n isWidgetVisible: boolean;\n /* The (recoverable) error the card is currently showing, if any. /\n error: string \| undefined;\n /* Clears the error and re-runs the challenge from scratch. /\n retry: () => void;\n}\n\n/\n Shared driver for the `<SignInProtectCheck />` and `<SignUpProtectCheck />` cards. The challenge\n * lifecycle itself lives in `runProtectCheck` from `@clerk/shared`. This hook binds it to the\n * card's spinner, error, and continuation.\n \n Must be called from within a `CardStateProvider`.\n */\nexport function useProtectCheckRunner<TResource>(params: ProtectCheckRunnerParams<TResource>): ProtectCheckRunnerState {\n const card = useCardState();\n\n // Override for the module-LOAD bound only (see `executeProtectCheck`), resolved loader first\n // and instance second: a loader being rolled out gradually can carry its own value without\n // changing anything for browsers still on the loader it replaces. Undefined at both levels\n // leaves the SDK default in force. Read here rather than inside the effect so the effect keeps\n // depending on primitives.\n // Older clerk-js versions omit this getter; undefined preserves the instance/default fallback.\n const loaderTimeoutMs = useClerk().__internal_protectChallengeLoadTimeoutMs;\n const instanceTimeoutMs = useEnvironment().protectConfig?.challenge_load_timeout_ms;\n const loadTimeoutMs = loaderTimeoutMs ?? instanceTimeoutMs;\n\n // Keep the latest callbacks without re-running the effect when the caller re-renders.\n const paramsRef = React.useRef(params);\n paramsRef.current = params;\n\n // `handleError` re-throws what it does not recognise, and this runner awaits caller code that\n // raises plain errors (a transient fetch failure, an OAuth continuation that did not complete).\n const reportError = (err: any) => {\n const { onError } = paramsRef.current;\n if (onError) {\n onError(err);\n return;\n }\n try {\n handleError(err, [], card.setError);\n } catch {\n card.setError('Unable to complete action at this time. If the problem persists please contact support.');\n }\n };\n\n const containerRef = React.useRef<HTMLDivElement \| null>(null);\n const isRunningRef = React.useRef(false);\n // Identifies the most recent run, so a continuation can tell when a newer challenge replaced it.\n const runIdRef = React.useRef(0);\n const [isRunning, setIsRunning] = React.useState(false);\n const [isWidgetVisible, setIsWidgetVisibleState] = React.useState(false);\n const [retryNonce, setRetryNonce] = React.useState(0);\n\n // Tracks real unmount, distinct from the per-run `cancelled` flag below. Clearing `protectCheck`\n // (e.g. an expired-challenge reload that advances the flow) flips the token dependency and\n // re-runs/cancels the main effect — but that re-run is exactly our cue to route, so the routing\n // must key on actual unmount, not on the effect's cancel flag.\n const mountedRef = React.useRef(true);\n React.useEffect(() => {\n mountedRef.current = true;\n return () => {\n mountedRef.current = false;\n };\n }, []);\n\n const reloadCountRef = React.useRef(0);\n\n const token = params.getProtectCheck()?.token;\n\n React.useEffect(() => {\n const { getProtectCheck, onResolved } = paramsRef.current;\n const protectCheck = getProtectCheck();\n if (!protectCheck \|\| isRunningRef.current) {\n return;\n }\n\n const abortController = new AbortController();\n let cancelled = false;\n // Routing after the gate clears must survive the effect re-run that\n // clearing `protectCheck` triggers — that re-run is our cue to route, not a\n // reason to bail. So the onResolved paths below key on REAL unmount, not the\n // effect's per-run `cancelled` flag (which the re-run's cleanup sets).\n const isUnmounted = () => !mountedRef.current;\n\n const cleanup = () => {\n cancelled = true;\n abortController.abort();\n // Reset the guard so the next mount / token change / retry can re-run; this is what makes\n // chained challenges work correctly across re-renders.\n isRunningRef.current = false;\n };\n\n // The script owns the widget-visibility decision: it receives this callback in its init\n // payload (as `setWidgetVisible`) and calls it right before revealing UI in the container,\n // and again with `false` once its widget is done. flushSync so the returned promise only\n // resolves after the change is committed to the DOM — the caller's spinner is genuinely\n // gone when the script reveals its widget, with no frame of overlap (same guarantee\n // BaseRouter relies on flushSync for). Scoped to THIS run: the abort contract is\n // best-effort, so a zombie script from a timed-out, retried, or superseded run can still\n // call it late — those signals must not flip visibility under the active run.\n const setWidgetVisible = (visible: boolean): Promise<void> => {\n if (cancelled \|\| abortController.signal.aborted \|\| !mountedRef.current) {\n return Promise.resolve();\n }\n flushSync(() => setIsWidgetVisibleState(visible));\n return Promise.resolve();\n };\n\n // Fail closed in no-RHC builds (chrome extension / clerk.no-rhc.js): the gate requires a\n // remote `import(sdk_url)` we must not perform there. This guard MUST live in the component\n // layer. The runner is in `@clerk/shared`, compiled once with the flag hard-coded `false`,\n // so a guard there would never trip.\n if (__BUILD_DISABLE_RHC__) {\n isRunningRef.current = false;\n setIsRunning(false);\n handleError(\n new ClerkRuntimeError('Protect verification is not supported in this environment', {\n code: ERROR_CODES.PROTECT_CHECK_UNSUPPORTED_ENVIRONMENT,\n }),\n [],\n card.setError,\n );\n return;\n }\n\n const container = containerRef.current;\n if (!container) {\n return;\n }\n\n // This run owns the container outright: drop anything a previous run left behind (a solved or\n // errored widget) so the spinner covers the load phase and a re-rendering SDK can't stack a\n // second widget under a stale one. Reset visibility in the same breath — the container is\n // empty by construction here, and waiting on the observer callback would leave the state\n // stale for a scheduling-dependent window (especially on the MutationObserver fallback).\n while (container.firstChild) {\n container.removeChild(container.firstChild);\n }\n setIsWidgetVisibleState(false);\n\n isRunningRef.current = true;\n setIsRunning(true);\n const runId = ++runIdRef.current;\n\n // Whether this run still owns the card's error and spinner. Until the gate clears, that ends\n // with the run's cancellation. Afterwards the continuation (`onResolved`) is still this run's\n // even though clearing the gate cancelled it, so it only stops owning them on unmount or when a\n // newer challenge has started a run of its own. Keying the continuation on `cancelled` swallowed\n // its failures and left the spinner running with no error.\n let continuing = false;\n const ownsOutcome = () => (continuing ? !isUnmounted() && runIdRef.current === runId : !cancelled);\n\n const runChallenge = async () => {\n try {\n // Load the Protect SDK loader lazily, gated on the same compile-time flag as the\n // fail-closed guard above. In no-RHC builds `__BUILD_DISABLE_RHC__` is `true`, so this\n // branch (and the dynamic `import()` below it) is dead-code-eliminated — the loader and\n // its remote `import(sdk_url)` are tree-shaken out of those bundles entirely rather than\n // merely shipped-but-unused.\n if (__BUILD_DISABLE_RHC__) {\n return;\n }\n const { runProtectCheck } = await import('@clerk/shared/internal/clerk-js/protectCheckRunner');\n const outcome = await runProtectCheck(paramsRef.current, protectCheck, {\n container,\n expiredReloads: reloadCountRef,\n signal: abortController.signal,\n setWidgetVisible,\n loadTimeoutMs,\n });\n // A reissued challenge carries a new token, which re-runs this effect (keyed on the token).\n if (outcome.status === 'reissued' \|\| isUnmounted()) {\n return;\n }\n continuing = true;\n await onResolved(outcome.resource, isUnmounted);\n } catch (err: any) {\n if (!ownsOutcome()) {\n return;\n }\n reportError(err);\n } finally {\n if (ownsOutcome()) {\n isRunningRef.current = false;\n setIsRunning(false);\n }\n }\n };\n\n void runChallenge();\n return cleanup;\n // Keyed on the challenge token (a primitive) rather than the protectCheck object: an unrelated\n // resource refresh keeps the same token and must NOT restart the challenge, while a genuine\n // chained challenge carries a new token and re-runs. `retryNonce` re-runs on manual retry.\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [token, retryNonce]);\n\n const retry = React.useCallback(() => {\n card.setError('');\n isRunningRef.current = false;\n reloadCountRef.current = 0;\n\n // The gate already cleared and it was the continuation that failed: there is no challenge left\n // to re-run, so re-running the effect would do nothing. Retry the continuation instead.\n const { getProtectCheck, getResource, onResolved } = paramsRef.current;\n if (!getProtectCheck()) {\n const runId = ++runIdRef.current;\n const ownsOutcome = () => mountedRef.current && runIdRef.current === runId;\n isRunningRef.current = true;\n setIsRunning(true);\n void onResolved(getResource(), () => !mountedRef.current)\n .catch(err => {\n if (ownsOutcome()) {\n reportError(err);\n }\n })\n .finally(() => {\n if (ownsOutcome()) {\n isRunningRef.current = false;\n setIsRunning(false);\n }\n });\n return;\n }\n\n setRetryNonce(n => n + 1);\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, []);\n\n return { containerRef, isRunning, isWidgetVisible, error: card.error, retry };\n}\n"],"mappings":"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"}

package/dist/index.js CHANGED Viewed

@@ -17,7 +17,7 @@ import { ClerkUI } from "./ClerkUI.js";
 */
 const ui = {
 	__brand: UI_BRAND,
-	version: "1.37.1-snapshot.v20260930211104",
+	version: "1.38.0",
 	ClerkUI
 };

package/dist/lazyModules/components.d.ts CHANGED Viewed

@@ -1,4 +1,5 @@
 import { BlankCaptchaModal } from "../components/BlankCaptchaModal/index.js";
+import { ProtectCheckModal } from "../components/ProtectCheckModal/index.js";
 import { AvailableComponentProps } from "../types.js";
 import { WithInternalRouting } from "../internal/routing.js";
 //#region src/lazyModules/components.d.ts
@@ -25,6 +26,7 @@ declare const ClerkComponents: {
   Waitlist: import("react").LazyExoticComponent<(props: unknown) => import("@emotion/react/jsx-runtime").JSX.Element>;
   WaitlistModal: import("react").LazyExoticComponent<(props: import("@clerk/shared/types/clerk").WaitlistModalProps) => JSX.Element>;
   BlankCaptchaModal: import("react").LazyExoticComponent<typeof BlankCaptchaModal>;
+  ProtectCheckModal: import("react").LazyExoticComponent<typeof ProtectCheckModal>;
   PricingTable: import("react").LazyExoticComponent<(props: import("@clerk/shared/types/clerk").PricingTableProps) => import("@emotion/react/jsx-runtime").JSX.Element>;
   Checkout: import("react").LazyExoticComponent<(props: import("@clerk/shared/types/clerk").__internal_CheckoutProps) => import("@emotion/react/jsx-runtime").JSX.Element>;
   PlanDetails: import("react").LazyExoticComponent<(props: import("@clerk/shared/types/clerk").__internal_PlanDetailsProps) => import("@emotion/react/jsx-runtime").JSX.Element>;

package/dist/lazyModules/components.js CHANGED Viewed

@@ -53,6 +53,10 @@ const componentImportPaths = {
 	BlankCaptchaModal: () => import(
 		/* webpackChunkName: "blankcaptcha" */
 		"../components/BlankCaptchaModal/index.js"
+),
+	ProtectCheckModal: () => import(
+		/* webpackChunkName: "protectcheck" */
+		"../components/ProtectCheckModal/index.js"
 ),
 	UserVerification: () => import(
 		/* webpackChunkName: "userverification" */
@@ -145,6 +149,7 @@ const OrganizationList = lazy(() => componentImportPaths.OrganizationList().then
 const Waitlist = lazy(() => componentImportPaths.Waitlist().then((module) => ({ default: module.Waitlist })));
 const WaitlistModal = lazy(() => componentImportPaths.Waitlist().then((module) => ({ default: module.WaitlistModal })));
 const BlankCaptchaModal = lazy(() => componentImportPaths.BlankCaptchaModal().then((module) => ({ default: module.BlankCaptchaModal })));
+const ProtectCheckModal = lazy(() => componentImportPaths.ProtectCheckModal().then((module) => ({ default: module.ProtectCheckModal })));
 const ImpersonationFab = lazy(() => componentImportPaths.ImpersonationFab().then((module) => ({ default: module.ImpersonationFab })));
 const KeylessPrompt = lazy(() => componentImportPaths.KeylessPrompt().then((module) => ({ default: module.KeylessPrompt })));
 const PricingTable = lazy(() => componentImportPaths.PricingTable().then((module) => ({ default: module.PricingTable })));
@@ -186,6 +191,7 @@ const ClerkComponents = {
 	Waitlist,
 	WaitlistModal,
 	BlankCaptchaModal,
+	ProtectCheckModal,
 	PricingTable,
 	Checkout,
 	PlanDetails,
@@ -201,5 +207,5 @@ const ClerkComponents = {
 };
 //#endregion
-export { BlankCaptchaModal, Checkout, ClerkComponents, CreateOrganizationModal, EnableOrganizationsPrompt, ImpersonationFab, InviteMembersModal, KeylessPrompt, OrganizationProfileModal, PlanDetails, SessionTasks, SignInModal, SignUpModal, UserProfileModal, UserVerificationModal, WaitlistModal, preloadComponent };
+export { BlankCaptchaModal, Checkout, ClerkComponents, CreateOrganizationModal, EnableOrganizationsPrompt, ImpersonationFab, InviteMembersModal, KeylessPrompt, OrganizationProfileModal, PlanDetails, ProtectCheckModal, SessionTasks, SignInModal, SignUpModal, UserProfileModal, UserVerificationModal, WaitlistModal, preloadComponent };
 //# sourceMappingURL=components.js.map