@clerk/ui 1.25.7 → 1.25.8-canary.v20260722190641

package/dist/ClerkUI.js

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

package/dist/Components.js.map

@@ -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  OrganizationProfileModalProps,\n  SignInProps,\n  SignInModalProps,\n  SignUpProps,\n  SignUpModalProps,\n  UserProfileModalProps,\n  UserProfileProps,\n  WaitlistProps,\n  WaitlistModalProps,\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  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      | '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 'enableOrganizationsPrompt'\n              ? __internal_EnableOrganizationsPromptProps\n              : UserProfileProps,\n  ) => void;\n  closeModal: (\n    modal:\n      | 'googleOneTap'\n      | 'signIn'\n      | 'signUp'\n      | 'userProfile'\n      | 'organizationProfile'\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  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    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    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 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        {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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"}
+{"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  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  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      | '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 'enableOrganizationsPrompt'\n              ? __internal_EnableOrganizationsPromptProps\n              : UserProfileProps,\n  ) => void;\n  closeModal: (\n    modal:\n      | 'googleOneTap'\n      | 'signIn'\n      | 'signUp'\n      | 'userProfile'\n      | 'organizationProfile'\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  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    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    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 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        {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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"}

package/dist/{checkout_ui_4dc646_1.25.7.js → checkout_ui_12c02f_1.25.8-canary.v20260722190641.js}

@@ -6,4 +6,4 @@
                 100% {
                   stroke-dashoffset: 0;
                 }
-            `})]}),(0,i.FD)(m.L9,{sx:e=>({margin:"auto",gridArea:"1/1",position:"relative",textAlign:"center",transform:`translateY(${e.space.$20})`}),children:[(0,i.Y)(m.DZ,{elementDescriptor:f.$z.checkoutSuccessTitle,as:"h2",textVariant:"h2",localizationKey:p?(0,h.G)("billing.checkout.title__trialSuccess"):l.totalDueNow&&l.totalDueNow.amount>0?(0,h.G)("billing.checkout.title__paymentSuccessful"):(0,h.G)("billing.checkout.title__subscriptionSuccessful"),sx:e=>({opacity:0,animationName:"slideUp",animationDuration:`${D.wz.slowest}ms`,animationTimingFunction:D._8.bezier,animationFillMode:"forwards",color:e.colors.$colorForeground,"@keyframes slideUp":{"0%":{transform:"translateY(30px)",opacity:0},"100%":{transform:"translateY(0)",opacity:1}},...!S&&{opacity:1,animation:"none"}})}),(0,i.Y)(m.EY,{elementDescriptor:f.$z.checkoutSuccessDescription,colorScheme:"secondary",sx:e=>({textAlign:"center",paddingInline:e.space.$8,marginBlockStart:e.space.$2,opacity:0,animationName:"slideUp",animationDuration:`${1.5*D.wz.slowest}ms`,animationTimingFunction:D._8.bezier,animationFillMode:"forwards","@keyframes slideUp":{"0%":{transform:"translateY(30px)",opacity:0},"100%":{transform:"translateY(0)",opacity:1}},...!S&&{opacity:1,animation:"none"}}),localizationKey:l.totalDueNow&&l.totalDueNow.amount>0?(0,h.G)("billing.checkout.description__paymentSuccessful"):(0,h.G)("billing.checkout.description__subscriptionSuccessful")})]})]})}),(0,i.FD)(o.Drawer.Footer,{sx:e=>({rowGap:e.space.$4,animationName:"footerSlideInUp",animationDuration:`${D.wz.drawer}ms`,animationTimingFunction:D._8.bezier,"@keyframes footerSlideInUp":{"0%":{transform:"translateY(100%)",opacity:0},"100%":{transform:"translateY(0)",opacity:1}},...!S&&{animation:"none"}}),children:[(0,i.FD)(g.p.Root,{children:[l.totalDueNow?(0,i.FD)(g.p.Group,{variant:"secondary",children:[(0,i.Y)(g.p.Title,{title:(0,h.G)("billing.checkout.lineItems.title__totalPaid")}),(0,i.Y)(g.p.Description,{text:F(l.totalDueNow)})]}):null,p?(0,i.FD)(g.p.Group,{variant:"secondary",children:[(0,i.Y)(g.p.Title,{title:(0,h.G)("billing.checkout.lineItems.title__freeTrialEndsAt")}),(0,i.Y)(g.p.Description,{text:(0,y.Y)(p)})]}):null,(0,i.FD)(g.p.Group,{variant:"secondary",children:[(0,i.Y)(g.p.Title,{title:l.totalDueNow&&l.totalDueNow.amount>0||null!==p?(0,h.G)("billing.checkout.lineItems.title__paymentMethod"):(0,h.G)("billing.checkout.lineItems.title__subscriptionBegins")}),(0,i.Y)(g.p.Description,{text:l.totalDueNow&&l.totalDueNow.amount>0||null!==p?c?"card"!==c.paymentType?c.paymentType?`${w(c.paymentType)}`:"–":c.cardType?`${w(c.cardType)} ⋯ ${c.last4}`:"–":"–":d?(0,y.Y)(new Date(d)):"–"})]})]}),(0,i.Y)(m.$n,{onClick:()=>{r&&e.navigate(r),t&&t(!1)},localizationKey:(0,h.G)("formButtonPrimary")})]})]}):null};var F=r(5402),G=r(7308),z=r(2386),S=r(3919),T=r(2117),M=r(5880),R=r(8472),C=r(49),P=r(869),B=r(6574),I=r(2861),A=r(2445),N=r(5848),E=r(1805),L=r(6858),W=r(5760);let K=e=>e[0].toUpperCase()+e.slice(1),U="payment_method_id",J=(0,G.dm)(()=>{let{checkout:e}=(0,a.v$)(),{$:t}=(0,b._)(),{plan:r,totals:n,isImmediatePlanChange:l,planPeriod:s,freeTrialEndsAt:c}=e;if(!r)return null;let d=!!n.credits?.proration?.amount&&n.credits.proration.amount.amount>0,u=!!n.credits?.payer?.appliedAmount&&n.credits.payer.appliedAmount.amount>0,p=!!n.pastDue?.amount&&n.pastDue.amount>0,y=!!n.discounts?.proration?.amount&&n.discounts.proration.amount.amount>0,Y=!!n.totalsDuePerPeriod&&n.totalDueNow&&n.totalsDuePerPeriod.grandTotal.amount!==n.totalDueNow.amount,D=(0,C.cm)(n),$=(0,C.xe)(D),x=(0,C.F1)(D),w=[];"annual"===s&&w.push((0,h.G)("billing.billedAnnually")),$&&null!==$.quantity&&w.push((0,h.G)("billing.pricingTable.seatCost.includedSeats",{includedSeats:$.quantity}));let k=(0,C.V4)(r);return k&&1===k.tiers.length&&0===k.tiers[0].feePerBlock.amount&&w.push(k.tiers[0].endsAfterBlock?(0,h.G)("billing.pricingTable.seatCost.upToSeats",{endsAfterBlock:k.tiers[0].endsAfterBlock}):(0,h.G)("billing.pricingTable.seatCost.unlimitedSeats")),(0,i.FD)(o.Drawer.Body,{children:[(0,i.Y)(m.az,{elementDescriptor:f.$z.checkoutFormLineItemsRoot,sx:e=>({padding:e.space.$4,borderBottomWidth:e.borderWidths.$normal,borderBottomStyle:e.borderStyles.$solid,borderBottomColor:e.colors.$borderAlpha100}),children:(0,i.FD)(g.p.Root,{children:[(0,i.FD)(g.p.Group,{children:[(0,i.Y)(g.p.Title,{title:r.name,description:w,badge:r.freeTrialEnabled&&c?(0,i.Y)(W.V,{subscription:{status:"free_trial"}}):null}),n.baseFee?(0,i.Y)(g.p.Description,{prefix:"annual"===s?"x12":void 0,text:t(n.baseFee),suffix:(0,h.G)("billing.checkout.perMonth")}):null]}),x&&null!==x.quantity&&(0,i.FD)(g.p.Group,{borderTop:!0,children:[(0,i.Y)(g.p.Title,{title:(0,h.G)("billing.seats")}),(0,i.Y)(g.p.Description,{prefix:`${x.quantity} x`,text:t(x.feePerBlock),suffix:(0,h.G)("billing.checkout.perMonth")})]}),y&&(0,i.FD)(g.p.Group,{variant:"tertiary",children:[(0,i.Y)(g.p.Title,{title:(0,h.G)("billing.proratedDiscount")}),(0,i.Y)(g.p.Description,{text:n.discounts?.proration?.amount?t((0,R.h)(n.discounts.proration.amount)):""})]}),d&&(0,i.FD)(g.p.Group,{variant:"tertiary",children:[(0,i.Y)(g.p.Title,{title:(0,h.G)("billing.creditRemainder")}),(0,i.Y)(g.p.Description,{text:n.credits?.proration?.amount?t((0,R.h)(n.credits.proration.amount)):""})]}),u&&(0,i.FD)(g.p.Group,{variant:"tertiary",children:[(0,i.Y)(g.p.Title,{title:(0,h.G)("billing.payerCreditRemainder")}),(0,i.Y)(g.p.Description,{text:n.credits?.payer?.appliedAmount?t((0,R.h)(n.credits.payer.appliedAmount)):""})]}),p&&(0,i.FD)(g.p.Group,{variant:"tertiary",children:[(0,i.FD)(M.m_.Root,{children:[(0,i.Y)(M.m_.Trigger,{children:(0,i.Y)(g.p.Title,{title:(0,h.G)("billing.pastDue"),icon:A.A})}),(0,i.Y)(M.m_.Content,{text:(0,h.G)("billing.checkout.pastDueNotice")})]}),(0,i.Y)(g.p.Description,{text:n.pastDue?t(n.pastDue):""})]}),c&&r.freeTrialDays&&n.totalDueAfterFreeTrial?(0,i.FD)(g.p.Group,{variant:"tertiary",children:[(0,i.Y)(g.p.Title,{title:(0,h.G)("billing.checkout.totalDueAfterTrial",{days:r.freeTrialDays})}),(0,i.Y)(g.p.Description,{text:t(n.totalDueAfterFreeTrial)})]}):Y?null:n.totalDuePerPeriod?(0,i.FD)(g.p.Group,{borderTop:!0,variant:"tertiary",children:[(0,i.Y)(g.p.Title,{title:(0,h.G)("billing.checkout.totalDuePerPeriod")}),(0,i.Y)(g.p.Description,{text:t(n.totalDuePerPeriod)})]}):null,n.totalDueNow?(0,i.FD)(g.p.Group,{borderTop:!0,children:[(0,i.Y)(g.p.Title,{title:(0,h.G)("billing.totalDueToday")}),(0,i.Y)(g.p.Description,{text:t(n.totalDueNow)})]}):null,Y&&(0,i.FD)(g.p.Group,{borderTop:!0,children:[(0,i.Y)(g.p.Title,{title:(0,h.G)("billing.totalDuePerPeriod")}),(0,i.Y)(g.p.Description,{text:n.totalsDuePerPeriod?t(n.totalsDuePerPeriod.grandTotal):""})]})]})}),!l&&(0,i.Y)(m.az,{elementDescriptor:f.$z.checkoutFormLineItemsRoot,sx:e=>({paddingBlockStart:e.space.$4,paddingInline:e.space.$4}),children:(0,i.Y)(m.EY,{localizationKey:(0,h.G)("billing.checkout.downgradeNotice"),variant:"caption",colorScheme:"secondary"})}),(0,i.Y)(V,{})]})}),O=()=>{let{onSubscriptionComplete:e}=u(),{checkout:t}=(0,a.v$)(),r=(0,G.f0)();if("needs_confirmation"!==t.status)throw Error("Checkout not found");let i=async i=>{r.setLoading(),r.setError(void 0);let{error:o}=await t.confirm(i);o?(0,P.H4)(o,[],r.setError):e?.(),r.setIdle()};return{payWithExistingPaymentMethod:e=>(e.preventDefault(),i({paymentMethodId:new FormData(e.currentTarget).get(U)})),addPaymentMethodAndPay:e=>i(e),payWithTestCard:()=>i({gateway:"stripe",useTestCard:!0}),payWithoutPaymentMethod:e=>(e.preventDefault(),i({}))}},V=()=>{let{checkout:e}=(0,a.v$)(),{plan:t}=e,{isLoading:r}=(0,I.mu)();return t?r?(0,i.Y)(m.y$,{sx:{margin:"auto"}}):(0,i.Y)(j,{}):null},j=()=>{let{checkout:e}=(0,a.v$)(),{plan:t,isImmediatePlanChange:r,needsPaymentMethod:o}=e,{data:n}=(0,I.mu)(),[l,c]=(0,s.useState)(()=>n.length>0?"existing":"new");return t?(0,i.FD)(m.fv,{elementDescriptor:f.$z.checkoutFormElementsRoot,gap:4,sx:e=>({padding:e.space.$4}),children:[(0,i.Y)(i.FK,{children:n.length>0&&r&&o&&(0,i.FD)(z.I.Root,{"aria-label":"Payment method source",value:l,onChange:e=>c(e),size:"lg",fullWidth:!0,children:[(0,i.Y)(z.I.Button,{value:"existing",text:(0,h.G)("billing.paymentMethods__label")}),(0,i.Y)(z.I.Button,{value:"new",text:(0,h.G)("billing.addPaymentMethod__label")})]})}),o?"existing"===l?(0,i.Y)(et,{paymentMethods:n}):"new"===l&&(0,i.Y)(Z,{}):(0,i.Y)(X,{})]}):null},q=()=>{let{isLoading:e}=(0,G.f0)(),{payWithTestCard:t}=O();return(0,i.FD)(m.az,{sx:e=>({background:e.colors.$neutralAlpha50,padding:e.space.$2x5,borderRadius:e.radii.$md,borderWidth:e.borderWidths.$normal,borderStyle:e.borderStyles.$solid,borderColor:e.colors.$borderAlpha100,display:"flex",flexDirection:"column",rowGap:e.space.$2,position:"relative",overflow:"hidden"}),children:[(0,i.Y)(T.$,{}),(0,i.FD)(m.so,{sx:e=>({alignItems:"center",justifyContent:"center",flexDirection:"column",rowGap:e.space.$2}),children:[(0,i.Y)(m.EY,{sx:e=>({color:e.colors.$warning500,fontWeight:e.fontWeights.$semibold}),localizationKey:(0,h.G)("billing.paymentMethod.dev.developmentMode")}),(0,i.Y)(m.$n,{type:"button",block:!0,variant:"bordered",localizationKey:(0,h.G)("userProfile.billingPage.paymentMethodsSection.payWithTestCardButton"),colorScheme:"secondary",isLoading:e,onClick:t})]})]})},H=()=>{let{checkout:e}=(0,a.v$)(),{seatsQuantity:t}=u(),{$:r}=(0,b._)(),{status:i,freeTrialEndsAt:o,totals:n}=e;if("needs_initialization"===i)throw Error("Clerk: Invalid state");return o?t&&n.totalDueNow?(0,h.G)("billing.pay",{amount:r(n.totalDueNow)}):(0,h.G)("billing.startFreeTrial"):n.totalDueNow&&n.totalDueNow.amount>0?(0,h.G)("billing.pay",{amount:r(n.totalDueNow)}):(0,h.G)("billing.subscribe")},X=(0,G.dm)(()=>{let{for:e}=u(),{payWithoutPaymentMethod:t}=O(),r=(0,G.f0)();return(0,i.FD)(m.lV,{onSubmit:t,sx:ee,children:[(0,i.Y)(F.Z.Alert,{children:r.error}),(0,i.Y)(Q,{})]})}),Z=(0,G.dm)(()=>{let{addPaymentMethodAndPay:e}=O(),t=H(),{checkout:r}=(0,a.v$)();return(0,i.FD)(E.bL,{onSuccess:e,checkout:r,children:[(0,i.Y)(B.W,{children:(0,i.Y)(q,{})}),(0,i.Y)(E.pr,{text:t})]})}),Q=e=>{let t=(0,G.f0)(),r=H();return(0,i.Y)(m.$n,{type:"submit",colorScheme:"primary",size:"sm",textVariant:"buttonLarge",sx:{width:"100%"},isLoading:t.isLoading,localizationKey:r,...e})},ee=e=>({display:"flex",flexDirection:"column",rowGap:e.space.$4}),et=(0,G.dm)(({paymentMethods:e})=>{let{checkout:t}=(0,a.v$)(),{paymentMethod:r,isImmediatePlanChange:o,needsPaymentMethod:n}=t,{payWithExistingPaymentMethod:l}=O(),c=(0,G.f0)(),[d,u]=(0,s.useState)(r||e.find(e=>e.isDefault)),p=(0,s.useMemo)(()=>e.map(e=>{let t="card"!==e.paymentType?e.paymentType?`${K(e.paymentType)}`:"–":e.cardType?`${K(e.cardType)} ⋯ ${e.last4}`:"–";return{value:e.id,label:t}}),[e]);return(0,i.FD)(m.lV,{onSubmit:l,sx:ee,children:[o&&n?(0,i.FD)(S.l6,{elementId:"paymentMethod",options:p,value:d?.id||null,onChange:t=>{u(e.find(e=>e.id===t.value))},portal:!0,children:[(0,i.Y)("input",{name:U,type:"hidden",value:d?.id}),(0,i.Y)(S.JC,{icon:N.A,sx:e=>({justifyContent:"space-between",backgroundColor:e.colors.$colorBackground}),children:d&&(0,i.Y)(L.O,{paymentMethod:d})}),(0,i.Y)(S.UL,{sx:e=>({paddingBlock:e.space.$1,color:e.colors.$colorForeground})})]}):(0,i.Y)("input",{name:U,type:"hidden",value:d?.id}),(0,i.Y)(F.Z.Alert,{children:c.error}),(0,i.Y)(Q,{})]})}),er=()=>{let{checkout:e}=(0,a.v$)();return(0,s.useEffect)(()=>{e.start()},[e]),null},ei=({children:e})=>{let{planId:t,planPeriod:r,for:o,seatsQuantity:n,priceId:l}=u();return(0,i.FD)(a.Rx,{for:o,planId:t,planPeriod:r,seatsQuantity:n,priceId:l,children:[(0,i.Y)(er,{}),e]})},eo=({children:e,name:t})=>{let{checkout:r}=(0,a.v$)();return r.status!==t?null:e},en=({children:e,status:t})=>{let{errors:r,fetchStatus:i}=(0,a.v$)();return(0,s.useMemo)(()=>{if(r.global){let e=r.global.flatMap(e=>{if(e.isClerkAPIResponseError())return e.errors.map(e=>e.code)});return e.includes("missing_payer_email")?"missing_payer_email":e.includes("invalid_plan_change")?"invalid_plan_change":"generic_error"}return i},[i])!==t?null:e};var el=r(395),ea=r(2534);let es=()=>{let{errors:e}=(0,a.v$)(),{translateError:t}=(0,b._)(),{t:r}=(0,b._)();return(0,i.Y)(o.Drawer.Body,{children:(0,i.Y)(m.so,{align:"center",justify:"center",sx:e=>({height:"100%",padding:e.space.$4,fontSize:e.fontSizes.$md}),children:(0,i.Y)(el.F,{variant:"danger",colorScheme:"danger",children:e.global?t(e.global[0]):r((0,h.G)("unstable__errors.form_param_value_invalid"))})})})},ec=()=>{let{planPeriod:e}=u(),{errors:t}=(0,a.v$)(),r=t?.global?.filter(e=>e.isClerkAPIResponseError()).flatMap(e=>e.errors).find(e=>"invalid_plan_change"===e.code);if(!r)return null;let{plan:n,isPlanUpgradePossible:l}=r?.meta||{};return(0,i.Y)(o.Drawer.Body,{children:(0,i.FD)(m.so,{gap:4,direction:"col",children:[(0,i.Y)(m.az,{elementDescriptor:f.$z.checkoutFormLineItemsRoot,sx:e=>({padding:e.space.$4,borderBottomWidth:e.borderWidths.$normal,borderBottomStyle:e.borderStyles.$solid,borderBottomColor:e.colors.$borderAlpha100}),children:(0,i.Y)(g.p.Root,{children:(0,i.FD)(g.p.Group,{children:[(0,i.Y)(g.p.Title,{title:n.name,description:"annual"===e?(0,h.G)("billing.billedAnnually"):void 0}),(0,i.Y)(g.p.Description,{prefix:"annual"===e?"x12":void 0,text:`${n.currency_symbol}${"month"===e?n.amount_formatted:n.annual_monthly_amount_formatted}`,suffix:(0,h.G)("billing.checkout.perMonth")})]})})}),(0,i.Y)(m.az,{sx:e=>({padding:e.space.$4}),children:(0,i.Y)(el.F,{variant:"info",colorScheme:"info",title:l?(0,h.G)("billing.cannotSubscribeMonthly"):(0,h.G)("billing.cannotSubscribeUnrecoverable")})})]})})},ed=()=>{let{checkout:e}=(0,a.v$)(),{setIsOpen:t}=(0,o.g)();return(0,i.Y)(o.Drawer.Body,{children:(0,i.Y)(m.az,{sx:e=>({padding:e.space.$4}),children:(0,i.Y)(ea.v,{title:(0,h.G)("billing.checkout.emailForm.title"),subtitle:(0,h.G)("billing.checkout.emailForm.subtitle"),onSuccess:()=>void e.start(),onReset:()=>t(!1),disableAutoFocus:!0})})})},eu=e=>(0,i.Y)(p.n.Root,{flow:"checkout",children:(0,i.Y)(p.n.Part,{children:(0,i.Y)(n.m$.Provider,{value:e.for||"user",children:(0,i.Y)(d.Provider,{value:{componentName:"Checkout",...e},children:(0,i.FD)(o.Drawer.Content,{children:[(0,i.Y)(o.Drawer.Header,{title:(0,h.G)("billing.checkout.title")}),(0,i.FD)(ei,{children:[(0,i.FD)(eo,{name:"needs_initialization",children:[(0,i.Y)(en,{status:"fetching",children:(0,i.Y)(m.y$,{sx:{margin:"auto"}})}),(0,i.Y)(en,{status:"invalid_plan_change",children:(0,i.Y)(ec,{})}),(0,i.Y)(en,{status:"missing_payer_email",children:(0,i.Y)(ed,{})}),(0,i.Y)(en,{status:"generic_error",children:(0,i.Y)(es,{})})]}),(0,i.Y)(eo,{name:"completed",children:(0,i.Y)(_,{})}),(0,i.Y)(eo,{name:"needs_confirmation",children:(0,i.Y)(J,{})})]})]})})})})})},1805(e,t,r){r.d(t,{pr:()=>M,Mo:()=>S,L6:()=>T,bL:()=>G});var i=r(9763),o=r(6262),n=r(630),l=r(5402),a=r(7308),s=r(7447),c=r(6600),d=r(5870),u=r(3539),p=r(869),h=r(9229),m=r(1008),g=r(6887),y=r(8342),f=r(9230),b=r(1046);let Y=e=>(0,i.Y)(f.az,{sx:[e=>({height:e.space.$2,width:"100%",borderRadius:e.radii.$md,background:e.colors.$neutralAlpha100}),e.sx]}),D=()=>(0,i.Y)(Y,{sx:e=>({height:e.space.$10,width:"100%"})}),$=e=>(0,i.Y)(f.so,{direction:"col",gap:2,children:e.children}),x=()=>(0,i.Y)(f.az,{"aria-label":"Loading...",sx:{position:"relative",minHeight:0,flex:1,overflowY:"auto"},children:(0,i.FD)(f.so,{direction:"col",gap:5,children:[(0,i.FD)($,{children:[(0,i.Y)(Y,{sx:e=>({height:e.space.$3,width:e.sizes.$24})}),(0,i.Y)(D,{})]}),(0,i.FD)(f.xA,{columns:2,gap:4,children:[(0,i.FD)($,{children:[(0,i.Y)(Y,{sx:e=>({height:e.space.$3,width:e.sizes.$20})}),(0,i.Y)(D,{})]}),(0,i.FD)($,{children:[(0,i.Y)(Y,{sx:e=>({height:e.space.$3,width:e.sizes.$24})}),(0,i.Y)(D,{})]})]}),(0,i.FD)($,{children:[(0,i.Y)(Y,{sx:e=>({height:e.space.$3,width:e.sizes.$16})}),(0,i.Y)(D,{})]}),(0,i.FD)($,{children:[(0,i.Y)(Y,{}),(0,i.Y)(Y,{}),(0,i.Y)(Y,{sx:{width:"66.666667%"}})]})]})}),[w,k]=(0,o.e3)("AddPaymentMethodRoot"),v=({children:e,checkout:t,...r})=>{var l;let a,s=(0,h.XX)(),c=(0,n.useRef)(null),{t:d}=(0,g._)(),[p,f]=(0,n.useState)(void 0),[b,Y]=(0,n.useState)(void 0),[D,$]=(0,n.useState)(void 0),x=(l=c.current,a=(0,m.KP)().parsedInternalTheme,(0,n.useMemo)(()=>{if(!l)return;let{colors:e,fontWeights:t,fontSizes:r,radii:i,space:o}=a;return{colorPrimary:(0,u.G3)(l,e.$primary500,e.$colorBackground),colorBackground:(0,u.G3)(l,e.$colorInput,e.$colorBackground),colorText:(0,u.G3)(l,e.$colorForeground,e.$colorBackground),colorTextSecondary:(0,u.G3)(l,e.$colorMutedForeground,e.$colorBackground),colorSuccess:(0,u.G3)(l,e.$success500,e.$colorBackground),colorDanger:(0,u.G3)(l,e.$danger500,e.$colorBackground),colorWarning:(0,u.G3)(l,e.$warning500,e.$colorBackground),fontWeightNormal:(0,u.yJ)(l,"font-weight",t.$normal.toString()),fontWeightMedium:(0,u.yJ)(l,"font-weight",t.$medium.toString()),fontWeightBold:(0,u.yJ)(l,"font-weight",t.$bold.toString()),fontSizeXl:(0,u.yJ)(l,"font-size",r.$xl),fontSizeLg:(0,u.yJ)(l,"font-size",r.$lg),fontSizeSm:(0,u.yJ)(l,"font-size",r.$md),fontSizeXs:(0,u.yJ)(l,"font-size",r.$sm),borderRadius:(0,u.yJ)(l,"border-radius",i.$lg),spacingUnit:(0,u.yJ)(l,"padding",o.$1)}},[a,l]));return(0,i.FD)(w.Provider,{value:{value:{headerTitle:p,headerSubtitle:b,submitLabel:D,setHeaderTitle:f,setHeaderSubtitle:Y,setSubmitLabel:$,checkout:t,...r}},children:[(0,i.Y)("div",{ref:c,style:{display:"none"}}),(0,i.Y)(o.Tn,{checkout:t,for:s,stripeAppearance:x,paymentDescription:d((0,y.G)(t?.planPeriod==="month"?"billing.paymentMethod.applePayDescription.monthly":"billing.paymentMethod.applePayDescription.annual")),children:e})]})},_=e=>{let{isProviderReady:t}=(0,o.Jl)();return t?null:e.children},F=e=>{let{isProviderReady:t}=(0,o.Jl)();return t?(0,i.Y)(i.FK,{children:e.children}):null},G=e=>{let{children:t,...r}=e;return(0,i.FD)(v,{...r,children:[(0,i.Y)(_,{children:(0,i.Y)(f.so,{direction:"row",align:"center",justify:"center",sx:e=>({width:"100%",minHeight:e.sizes.$60}),children:(0,i.Y)(f.y$,{size:"lg",colorScheme:"primary",elementDescriptor:b.$z.spinner})})}),(0,i.Y)(F,{children:(0,i.Y)(R,{children:t})})]})},z=(e,t)=>{(0,n.useRef)(()=>{t(e)}),(0,n.useEffect)(()=>{t(e)},[e,t])},S=({text:e})=>{let{setHeaderTitle:t}=k();return z(e,t),null},T=({text:e})=>{let{setHeaderSubtitle:t}=k();return z(e,t),null},M=({text:e})=>{let{setSubmitLabel:t}=k();return z(e,t),null},R=({children:e})=>{let{headerTitle:t,headerSubtitle:r,submitLabel:n,checkout:u,onSuccess:m,cancelAction:g}=k(),f=(0,a.f0)(),b=(0,h.N7)(),{isFormReady:Y,submit:D,reset:$}=(0,o.Jl)(),w=async e=>{e.preventDefault(),f.setLoading(),f.setError(void 0);let{data:t,error:r}=await D();if(r){f.setIdle(),"validation_error"!==r.error.type&&f.setError(r.error.message);return}try{await m(t)}catch(e){(0,p.H4)(e,[],f.setError)}finally{f.setIdle(),$()}};return(0,i.Y)(d.M,{headerTitle:t,headerSubtitle:r,children:(0,i.FD)(s.l.Root,{onSubmit:w,sx:e=>({display:"flex",flexDirection:"column",rowGap:e.space.$3}),children:[e,(0,i.Y)(o.cl,{fallback:(0,i.Y)(x,{})}),(0,i.Y)(l.Z.Alert,{children:f.error}),(0,i.Y)(c.G,{isDisabled:!Y,submitLabel:n??(0,y.G)(`${b}.billingPage.paymentMethodsSection.formButtonPrimary__add`),onReset:g,hideReset:!g,sx:{flex:u?1:void 0}})]})})}},6858(e,t,r){var i=r(9763),o=r(9230),n=r(1046),l=r(8342),a=r(9616),s=r(1538);r.d(t,{},{O:({paymentMethod:e})=>(0,i.FD)(o.so,{sx:{overflow:"hidden"},gap:2,align:"baseline",elementDescriptor:n.$z.paymentMethodRow,children:[(0,i.Y)(o.In,{icon:"card"===e.paymentType?a.A:s.A,sx:e=>({alignSelf:"center",color:e.colors.$colorMutedForeground}),elementDescriptor:n.$z.paymentMethodRowIcon}),(0,i.Y)(o.EY,{sx:e=>({color:e.colors.$colorForeground,textTransform:"capitalize"}),truncate:!0,elementDescriptor:n.$z.paymentMethodRowType,children:"card"===e.paymentType?e.cardType:e.paymentType}),(0,i.Y)(o.EY,{sx:e=>({color:e.colors.$colorMutedForeground}),variant:"caption",truncate:!0,elementDescriptor:n.$z.paymentMethodRowValue,children:"card"===e.paymentType?`⋯ ${e.last4}`:null}),e.isDefault&&(0,i.Y)(o.Ex,{elementDescriptor:n.$z.paymentMethodRowBadge,elementId:n.$z.paymentMethodRowBadge.setId("default"),localizationKey:(0,l.G)("badge__default")}),"expired"===e.status&&(0,i.Y)(o.Ex,{elementDescriptor:n.$z.paymentMethodRowBadge,elementId:n.$z.paymentMethodRowBadge.setId("expired"),colorScheme:"danger",localizationKey:(0,l.G)("badge__expired")})]})})},5760(e,t,r){var i=r(9763),o=r(9230),n=r(8342);let l={active:"badge__activePlan",upcoming:"badge__upcomingPlan",past_due:"badge__pastDuePlan",free_trial:"badge__freeTrial"},a={active:"secondary",upcoming:"primary",past_due:"warning",free_trial:"secondary"};r.d(t,{},{V:({subscription:e,elementDescriptor:t})=>(0,i.Y)(o.Ex,{elementDescriptor:t,colorScheme:a[e.status],localizationKey:(0,n.G)(l[e.status])})})}}]);
+            `})]}),(0,i.FD)(m.L9,{sx:e=>({margin:"auto",gridArea:"1/1",position:"relative",textAlign:"center",transform:`translateY(${e.space.$20})`}),children:[(0,i.Y)(m.DZ,{elementDescriptor:f.$z.checkoutSuccessTitle,as:"h2",textVariant:"h2",localizationKey:p?(0,h.G)("billing.checkout.title__trialSuccess"):l.totalDueNow&&l.totalDueNow.amount>0?(0,h.G)("billing.checkout.title__paymentSuccessful"):(0,h.G)("billing.checkout.title__subscriptionSuccessful"),sx:e=>({opacity:0,animationName:"slideUp",animationDuration:`${D.wz.slowest}ms`,animationTimingFunction:D._8.bezier,animationFillMode:"forwards",color:e.colors.$colorForeground,"@keyframes slideUp":{"0%":{transform:"translateY(30px)",opacity:0},"100%":{transform:"translateY(0)",opacity:1}},...!S&&{opacity:1,animation:"none"}})}),(0,i.Y)(m.EY,{elementDescriptor:f.$z.checkoutSuccessDescription,colorScheme:"secondary",sx:e=>({textAlign:"center",paddingInline:e.space.$8,marginBlockStart:e.space.$2,opacity:0,animationName:"slideUp",animationDuration:`${1.5*D.wz.slowest}ms`,animationTimingFunction:D._8.bezier,animationFillMode:"forwards","@keyframes slideUp":{"0%":{transform:"translateY(30px)",opacity:0},"100%":{transform:"translateY(0)",opacity:1}},...!S&&{opacity:1,animation:"none"}}),localizationKey:l.totalDueNow&&l.totalDueNow.amount>0?(0,h.G)("billing.checkout.description__paymentSuccessful"):(0,h.G)("billing.checkout.description__subscriptionSuccessful")})]})]})}),(0,i.FD)(o.Drawer.Footer,{sx:e=>({rowGap:e.space.$4,animationName:"footerSlideInUp",animationDuration:`${D.wz.drawer}ms`,animationTimingFunction:D._8.bezier,"@keyframes footerSlideInUp":{"0%":{transform:"translateY(100%)",opacity:0},"100%":{transform:"translateY(0)",opacity:1}},...!S&&{animation:"none"}}),children:[(0,i.FD)(g.p.Root,{children:[l.totalDueNow?(0,i.FD)(g.p.Group,{variant:"secondary",children:[(0,i.Y)(g.p.Title,{title:(0,h.G)("billing.checkout.lineItems.title__totalPaid")}),(0,i.Y)(g.p.Description,{text:F(l.totalDueNow)})]}):null,p?(0,i.FD)(g.p.Group,{variant:"secondary",children:[(0,i.Y)(g.p.Title,{title:(0,h.G)("billing.checkout.lineItems.title__freeTrialEndsAt")}),(0,i.Y)(g.p.Description,{text:(0,y.Y)(p)})]}):null,(0,i.FD)(g.p.Group,{variant:"secondary",children:[(0,i.Y)(g.p.Title,{title:l.totalDueNow&&l.totalDueNow.amount>0||null!==p?(0,h.G)("billing.checkout.lineItems.title__paymentMethod"):(0,h.G)("billing.checkout.lineItems.title__subscriptionBegins")}),(0,i.Y)(g.p.Description,{text:l.totalDueNow&&l.totalDueNow.amount>0||null!==p?c?"card"!==c.paymentType?c.paymentType?`${w(c.paymentType)}`:"–":c.cardType?`${w(c.cardType)} ⋯ ${c.last4}`:"–":"–":d?(0,y.Y)(new Date(d)):"–"})]})]}),(0,i.Y)(m.$n,{onClick:()=>{r&&e.navigate(r),t&&t(!1)},localizationKey:(0,h.G)("formButtonPrimary")})]})]}):null};var F=r(5402),G=r(7308),z=r(2117),S=r(2386),T=r(3919),M=r(5880),R=r(8472),C=r(49),P=r(869),B=r(6574),I=r(2861),A=r(2445),N=r(5848),E=r(1805),L=r(6858),W=r(5760);let K=e=>e[0].toUpperCase()+e.slice(1),U="payment_method_id",J=(0,G.dm)(()=>{let{checkout:e}=(0,a.v$)(),{$:t}=(0,b._)(),{plan:r,totals:n,isImmediatePlanChange:l,planPeriod:s,freeTrialEndsAt:c}=e;if(!r)return null;let d=!!n.credits?.proration?.amount&&n.credits.proration.amount.amount>0,u=!!n.credits?.payer?.appliedAmount&&n.credits.payer.appliedAmount.amount>0,p=!!n.pastDue?.amount&&n.pastDue.amount>0,y=!!n.discounts?.proration?.amount&&n.discounts.proration.amount.amount>0,Y=!!n.totalsDuePerPeriod&&n.totalDueNow&&n.totalsDuePerPeriod.grandTotal.amount!==n.totalDueNow.amount,D=(0,C.cm)(n),$=(0,C.xe)(D),x=(0,C.F1)(D),w=[];"annual"===s&&w.push((0,h.G)("billing.billedAnnually")),$&&null!==$.quantity&&w.push((0,h.G)("billing.pricingTable.seatCost.includedSeats",{includedSeats:$.quantity}));let k=(0,C.V4)(r);return k&&1===k.tiers.length&&0===k.tiers[0].feePerBlock.amount&&w.push(k.tiers[0].endsAfterBlock?(0,h.G)("billing.pricingTable.seatCost.upToSeats",{endsAfterBlock:k.tiers[0].endsAfterBlock}):(0,h.G)("billing.pricingTable.seatCost.unlimitedSeats")),(0,i.FD)(o.Drawer.Body,{children:[(0,i.Y)(m.az,{elementDescriptor:f.$z.checkoutFormLineItemsRoot,sx:e=>({padding:e.space.$4,borderBottomWidth:e.borderWidths.$normal,borderBottomStyle:e.borderStyles.$solid,borderBottomColor:e.colors.$borderAlpha100}),children:(0,i.FD)(g.p.Root,{children:[(0,i.FD)(g.p.Group,{children:[(0,i.Y)(g.p.Title,{title:r.name,description:w,badge:r.freeTrialEnabled&&c?(0,i.Y)(W.V,{subscription:{status:"free_trial"}}):null}),n.baseFee?(0,i.Y)(g.p.Description,{prefix:"annual"===s?"x12":void 0,text:t(n.baseFee),suffix:(0,h.G)("billing.checkout.perMonth")}):null]}),x&&null!==x.quantity&&(0,i.FD)(g.p.Group,{borderTop:!0,children:[(0,i.Y)(g.p.Title,{title:(0,h.G)("billing.seats")}),(0,i.Y)(g.p.Description,{prefix:`${x.quantity} x`,text:t(x.feePerBlock),suffix:(0,h.G)("billing.checkout.perMonth")})]}),y&&(0,i.FD)(g.p.Group,{variant:"tertiary",children:[(0,i.Y)(g.p.Title,{title:(0,h.G)("billing.proratedDiscount")}),(0,i.Y)(g.p.Description,{text:n.discounts?.proration?.amount?t((0,R.h)(n.discounts.proration.amount)):""})]}),d&&(0,i.FD)(g.p.Group,{variant:"tertiary",children:[(0,i.Y)(g.p.Title,{title:(0,h.G)("billing.creditRemainder")}),(0,i.Y)(g.p.Description,{text:n.credits?.proration?.amount?t((0,R.h)(n.credits.proration.amount)):""})]}),u&&(0,i.FD)(g.p.Group,{variant:"tertiary",children:[(0,i.Y)(g.p.Title,{title:(0,h.G)("billing.payerCreditRemainder")}),(0,i.Y)(g.p.Description,{text:n.credits?.payer?.appliedAmount?t((0,R.h)(n.credits.payer.appliedAmount)):""})]}),p&&(0,i.FD)(g.p.Group,{variant:"tertiary",children:[(0,i.FD)(M.m_.Root,{children:[(0,i.Y)(M.m_.Trigger,{children:(0,i.Y)(g.p.Title,{title:(0,h.G)("billing.pastDue"),icon:A.A})}),(0,i.Y)(M.m_.Content,{text:(0,h.G)("billing.checkout.pastDueNotice")})]}),(0,i.Y)(g.p.Description,{text:n.pastDue?t(n.pastDue):""})]}),c&&r.freeTrialDays&&n.totalDueAfterFreeTrial?(0,i.FD)(g.p.Group,{variant:"tertiary",children:[(0,i.Y)(g.p.Title,{title:(0,h.G)("billing.checkout.totalDueAfterTrial",{days:r.freeTrialDays})}),(0,i.Y)(g.p.Description,{text:t(n.totalDueAfterFreeTrial)})]}):Y?null:n.totalDuePerPeriod?(0,i.FD)(g.p.Group,{borderTop:!0,variant:"tertiary",children:[(0,i.Y)(g.p.Title,{title:(0,h.G)("billing.checkout.totalDuePerPeriod")}),(0,i.Y)(g.p.Description,{text:t(n.totalDuePerPeriod)})]}):null,n.totalDueNow?(0,i.FD)(g.p.Group,{borderTop:!0,children:[(0,i.Y)(g.p.Title,{title:(0,h.G)("billing.totalDueToday")}),(0,i.Y)(g.p.Description,{text:t(n.totalDueNow)})]}):null,Y&&(0,i.FD)(g.p.Group,{borderTop:!0,children:[(0,i.Y)(g.p.Title,{title:(0,h.G)("billing.totalDuePerPeriod")}),(0,i.Y)(g.p.Description,{text:n.totalsDuePerPeriod?t(n.totalsDuePerPeriod.grandTotal):""})]})]})}),!l&&(0,i.Y)(m.az,{elementDescriptor:f.$z.checkoutFormLineItemsRoot,sx:e=>({paddingBlockStart:e.space.$4,paddingInline:e.space.$4}),children:(0,i.Y)(m.EY,{localizationKey:(0,h.G)("billing.checkout.downgradeNotice"),variant:"caption",colorScheme:"secondary"})}),(0,i.Y)(V,{})]})}),O=()=>{let{onSubscriptionComplete:e}=u(),{checkout:t}=(0,a.v$)(),r=(0,G.f0)();if("needs_confirmation"!==t.status)throw Error("Checkout not found");let i=async i=>{r.setLoading(),r.setError(void 0);let{error:o}=await t.confirm(i);o?(0,P.H4)(o,[],r.setError):e?.(),r.setIdle()};return{payWithExistingPaymentMethod:e=>(e.preventDefault(),i({paymentMethodId:new FormData(e.currentTarget).get(U)})),addPaymentMethodAndPay:e=>i(e),payWithTestCard:()=>i({gateway:"stripe",useTestCard:!0}),payWithoutPaymentMethod:e=>(e.preventDefault(),i({}))}},V=()=>{let{checkout:e}=(0,a.v$)(),{plan:t}=e,{isLoading:r}=(0,I.mu)();return t?r?(0,i.Y)(m.y$,{sx:{margin:"auto"}}):(0,i.Y)(j,{}):null},j=()=>{let{checkout:e}=(0,a.v$)(),{plan:t,isImmediatePlanChange:r,needsPaymentMethod:o}=e,{data:n}=(0,I.mu)(),[l,c]=(0,s.useState)(()=>n.length>0?"existing":"new");return t?(0,i.FD)(m.fv,{elementDescriptor:f.$z.checkoutFormElementsRoot,gap:4,sx:e=>({padding:e.space.$4}),children:[(0,i.Y)(i.FK,{children:n.length>0&&r&&o&&(0,i.FD)(S.I.Root,{"aria-label":"Payment method source",value:l,onChange:e=>c(e),size:"lg",fullWidth:!0,children:[(0,i.Y)(S.I.Button,{value:"existing",text:(0,h.G)("billing.paymentMethods__label")}),(0,i.Y)(S.I.Button,{value:"new",text:(0,h.G)("billing.addPaymentMethod__label")})]})}),o?"existing"===l?(0,i.Y)(et,{paymentMethods:n}):"new"===l&&(0,i.Y)(Z,{}):(0,i.Y)(X,{})]}):null},q=()=>{let{isLoading:e}=(0,G.f0)(),{payWithTestCard:t}=O();return(0,i.FD)(m.az,{sx:e=>({background:e.colors.$neutralAlpha50,padding:e.space.$2x5,borderRadius:e.radii.$md,borderWidth:e.borderWidths.$normal,borderStyle:e.borderStyles.$solid,borderColor:e.colors.$borderAlpha100,display:"flex",flexDirection:"column",rowGap:e.space.$2,position:"relative",overflow:"hidden"}),children:[(0,i.Y)(z.$,{}),(0,i.FD)(m.so,{sx:e=>({alignItems:"center",justifyContent:"center",flexDirection:"column",rowGap:e.space.$2}),children:[(0,i.Y)(m.EY,{sx:e=>({color:e.colors.$warning500,fontWeight:e.fontWeights.$semibold}),localizationKey:(0,h.G)("billing.paymentMethod.dev.developmentMode")}),(0,i.Y)(m.$n,{type:"button",block:!0,variant:"bordered",localizationKey:(0,h.G)("userProfile.billingPage.paymentMethodsSection.payWithTestCardButton"),colorScheme:"secondary",isLoading:e,onClick:t})]})]})},H=()=>{let{checkout:e}=(0,a.v$)(),{seatsQuantity:t}=u(),{$:r}=(0,b._)(),{status:i,freeTrialEndsAt:o,totals:n}=e;if("needs_initialization"===i)throw Error("Clerk: Invalid state");return o?t&&n.totalDueNow?(0,h.G)("billing.pay",{amount:r(n.totalDueNow)}):(0,h.G)("billing.startFreeTrial"):n.totalDueNow&&n.totalDueNow.amount>0?(0,h.G)("billing.pay",{amount:r(n.totalDueNow)}):(0,h.G)("billing.subscribe")},X=(0,G.dm)(()=>{let{for:e}=u(),{payWithoutPaymentMethod:t}=O(),r=(0,G.f0)();return(0,i.FD)(m.lV,{onSubmit:t,sx:ee,children:[(0,i.Y)(F.Z.Alert,{children:r.error}),(0,i.Y)(Q,{})]})}),Z=(0,G.dm)(()=>{let{addPaymentMethodAndPay:e}=O(),t=H(),{checkout:r}=(0,a.v$)();return(0,i.FD)(E.bL,{onSuccess:e,checkout:r,children:[(0,i.Y)(B.W,{children:(0,i.Y)(q,{})}),(0,i.Y)(E.pr,{text:t})]})}),Q=e=>{let t=(0,G.f0)(),r=H();return(0,i.Y)(m.$n,{type:"submit",colorScheme:"primary",size:"sm",textVariant:"buttonLarge",sx:{width:"100%"},isLoading:t.isLoading,localizationKey:r,...e})},ee=e=>({display:"flex",flexDirection:"column",rowGap:e.space.$4}),et=(0,G.dm)(({paymentMethods:e})=>{let{checkout:t}=(0,a.v$)(),{paymentMethod:r,isImmediatePlanChange:o,needsPaymentMethod:n}=t,{payWithExistingPaymentMethod:l}=O(),c=(0,G.f0)(),[d,u]=(0,s.useState)(r||e.find(e=>e.isDefault)),p=(0,s.useMemo)(()=>e.map(e=>{let t="card"!==e.paymentType?e.paymentType?`${K(e.paymentType)}`:"–":e.cardType?`${K(e.cardType)} ⋯ ${e.last4}`:"–";return{value:e.id,label:t}}),[e]);return(0,i.FD)(m.lV,{onSubmit:l,sx:ee,children:[o&&n?(0,i.FD)(T.l6,{elementId:"paymentMethod",options:p,value:d?.id||null,onChange:t=>{u(e.find(e=>e.id===t.value))},portal:!0,children:[(0,i.Y)("input",{name:U,type:"hidden",value:d?.id}),(0,i.Y)(T.JC,{icon:N.A,sx:e=>({justifyContent:"space-between",backgroundColor:e.colors.$colorBackground}),children:d&&(0,i.Y)(L.O,{paymentMethod:d})}),(0,i.Y)(T.UL,{sx:e=>({paddingBlock:e.space.$1,color:e.colors.$colorForeground})})]}):(0,i.Y)("input",{name:U,type:"hidden",value:d?.id}),(0,i.Y)(F.Z.Alert,{children:c.error}),(0,i.Y)(Q,{})]})}),er=()=>{let{checkout:e}=(0,a.v$)();return(0,s.useEffect)(()=>{e.start()},[e]),null},ei=({children:e})=>{let{planId:t,planPeriod:r,for:o,seatsQuantity:n,priceId:l}=u();return(0,i.FD)(a.Rx,{for:o,planId:t,planPeriod:r,seatsQuantity:n,priceId:l,children:[(0,i.Y)(er,{}),e]})},eo=({children:e,name:t})=>{let{checkout:r}=(0,a.v$)();return r.status!==t?null:e},en=({children:e,status:t})=>{let{errors:r,fetchStatus:i}=(0,a.v$)();return(0,s.useMemo)(()=>{if(r.global){let e=r.global.flatMap(e=>{if(e.isClerkAPIResponseError())return e.errors.map(e=>e.code)});return e.includes("missing_payer_email")?"missing_payer_email":e.includes("invalid_plan_change")?"invalid_plan_change":"generic_error"}return i},[i])!==t?null:e};var el=r(395),ea=r(2534);let es=()=>{let{errors:e}=(0,a.v$)(),{translateError:t}=(0,b._)(),{t:r}=(0,b._)();return(0,i.Y)(o.Drawer.Body,{children:(0,i.Y)(m.so,{align:"center",justify:"center",sx:e=>({height:"100%",padding:e.space.$4,fontSize:e.fontSizes.$md}),children:(0,i.Y)(el.F,{variant:"danger",colorScheme:"danger",children:e.global?t(e.global[0]):r((0,h.G)("unstable__errors.form_param_value_invalid"))})})})},ec=()=>{let{planPeriod:e}=u(),{errors:t}=(0,a.v$)(),r=t?.global?.filter(e=>e.isClerkAPIResponseError()).flatMap(e=>e.errors).find(e=>"invalid_plan_change"===e.code);if(!r)return null;let{plan:n,isPlanUpgradePossible:l}=r?.meta||{};return(0,i.Y)(o.Drawer.Body,{children:(0,i.FD)(m.so,{gap:4,direction:"col",children:[(0,i.Y)(m.az,{elementDescriptor:f.$z.checkoutFormLineItemsRoot,sx:e=>({padding:e.space.$4,borderBottomWidth:e.borderWidths.$normal,borderBottomStyle:e.borderStyles.$solid,borderBottomColor:e.colors.$borderAlpha100}),children:(0,i.Y)(g.p.Root,{children:(0,i.FD)(g.p.Group,{children:[(0,i.Y)(g.p.Title,{title:n.name,description:"annual"===e?(0,h.G)("billing.billedAnnually"):void 0}),(0,i.Y)(g.p.Description,{prefix:"annual"===e?"x12":void 0,text:`${n.currency_symbol}${"month"===e?n.amount_formatted:n.annual_monthly_amount_formatted}`,suffix:(0,h.G)("billing.checkout.perMonth")})]})})}),(0,i.Y)(m.az,{sx:e=>({padding:e.space.$4}),children:(0,i.Y)(el.F,{variant:"info",colorScheme:"info",title:l?(0,h.G)("billing.cannotSubscribeMonthly"):(0,h.G)("billing.cannotSubscribeUnrecoverable")})})]})})},ed=()=>{let{checkout:e}=(0,a.v$)(),{setIsOpen:t}=(0,o.g)();return(0,i.Y)(o.Drawer.Body,{children:(0,i.Y)(m.az,{sx:e=>({padding:e.space.$4}),children:(0,i.Y)(ea.v,{title:(0,h.G)("billing.checkout.emailForm.title"),subtitle:(0,h.G)("billing.checkout.emailForm.subtitle"),onSuccess:()=>void e.start(),onReset:()=>t(!1),disableAutoFocus:!0})})})},eu=e=>(0,i.Y)(p.n.Root,{flow:"checkout",children:(0,i.Y)(p.n.Part,{children:(0,i.Y)(n.m$.Provider,{value:e.for||"user",children:(0,i.Y)(d.Provider,{value:{componentName:"Checkout",...e},children:(0,i.FD)(o.Drawer.Content,{children:[(0,i.Y)(o.Drawer.Header,{title:(0,h.G)("billing.checkout.title")}),(0,i.FD)(ei,{children:[(0,i.FD)(eo,{name:"needs_initialization",children:[(0,i.Y)(en,{status:"fetching",children:(0,i.Y)(m.y$,{sx:{margin:"auto"}})}),(0,i.Y)(en,{status:"invalid_plan_change",children:(0,i.Y)(ec,{})}),(0,i.Y)(en,{status:"missing_payer_email",children:(0,i.Y)(ed,{})}),(0,i.Y)(en,{status:"generic_error",children:(0,i.Y)(es,{})})]}),(0,i.Y)(eo,{name:"completed",children:(0,i.Y)(_,{})}),(0,i.Y)(eo,{name:"needs_confirmation",children:(0,i.Y)(J,{})})]})]})})})})})},1805(e,t,r){r.d(t,{pr:()=>M,Mo:()=>S,L6:()=>T,bL:()=>G});var i=r(9763),o=r(6262),n=r(630),l=r(5402),a=r(7308),s=r(7447),c=r(6600),d=r(5870),u=r(3539),p=r(869),h=r(9229),m=r(1008),g=r(6887),y=r(8342),f=r(9230),b=r(1046);let Y=e=>(0,i.Y)(f.az,{sx:[e=>({height:e.space.$2,width:"100%",borderRadius:e.radii.$md,background:e.colors.$neutralAlpha100}),e.sx]}),D=()=>(0,i.Y)(Y,{sx:e=>({height:e.space.$10,width:"100%"})}),$=e=>(0,i.Y)(f.so,{direction:"col",gap:2,children:e.children}),x=()=>(0,i.Y)(f.az,{"aria-label":"Loading...",sx:{position:"relative",minHeight:0,flex:1,overflowY:"auto"},children:(0,i.FD)(f.so,{direction:"col",gap:5,children:[(0,i.FD)($,{children:[(0,i.Y)(Y,{sx:e=>({height:e.space.$3,width:e.sizes.$24})}),(0,i.Y)(D,{})]}),(0,i.FD)(f.xA,{columns:2,gap:4,children:[(0,i.FD)($,{children:[(0,i.Y)(Y,{sx:e=>({height:e.space.$3,width:e.sizes.$20})}),(0,i.Y)(D,{})]}),(0,i.FD)($,{children:[(0,i.Y)(Y,{sx:e=>({height:e.space.$3,width:e.sizes.$24})}),(0,i.Y)(D,{})]})]}),(0,i.FD)($,{children:[(0,i.Y)(Y,{sx:e=>({height:e.space.$3,width:e.sizes.$16})}),(0,i.Y)(D,{})]}),(0,i.FD)($,{children:[(0,i.Y)(Y,{}),(0,i.Y)(Y,{}),(0,i.Y)(Y,{sx:{width:"66.666667%"}})]})]})}),[w,k]=(0,o.e3)("AddPaymentMethodRoot"),v=({children:e,checkout:t,...r})=>{var l;let a,s=(0,h.XX)(),c=(0,n.useRef)(null),{t:d}=(0,g._)(),[p,f]=(0,n.useState)(void 0),[b,Y]=(0,n.useState)(void 0),[D,$]=(0,n.useState)(void 0),x=(l=c.current,a=(0,m.KP)().parsedInternalTheme,(0,n.useMemo)(()=>{if(!l)return;let{colors:e,fontWeights:t,fontSizes:r,radii:i,space:o}=a;return{colorPrimary:(0,u.G3)(l,e.$primary500,e.$colorBackground),colorBackground:(0,u.G3)(l,e.$colorInput,e.$colorBackground),colorText:(0,u.G3)(l,e.$colorForeground,e.$colorBackground),colorTextSecondary:(0,u.G3)(l,e.$colorMutedForeground,e.$colorBackground),colorSuccess:(0,u.G3)(l,e.$success500,e.$colorBackground),colorDanger:(0,u.G3)(l,e.$danger500,e.$colorBackground),colorWarning:(0,u.G3)(l,e.$warning500,e.$colorBackground),fontWeightNormal:(0,u.yJ)(l,"font-weight",t.$normal.toString()),fontWeightMedium:(0,u.yJ)(l,"font-weight",t.$medium.toString()),fontWeightBold:(0,u.yJ)(l,"font-weight",t.$bold.toString()),fontSizeXl:(0,u.yJ)(l,"font-size",r.$xl),fontSizeLg:(0,u.yJ)(l,"font-size",r.$lg),fontSizeSm:(0,u.yJ)(l,"font-size",r.$md),fontSizeXs:(0,u.yJ)(l,"font-size",r.$sm),borderRadius:(0,u.yJ)(l,"border-radius",i.$lg),spacingUnit:(0,u.yJ)(l,"padding",o.$1)}},[a,l]));return(0,i.FD)(w.Provider,{value:{value:{headerTitle:p,headerSubtitle:b,submitLabel:D,setHeaderTitle:f,setHeaderSubtitle:Y,setSubmitLabel:$,checkout:t,...r}},children:[(0,i.Y)("div",{ref:c,style:{display:"none"}}),(0,i.Y)(o.Tn,{checkout:t,for:s,stripeAppearance:x,paymentDescription:d((0,y.G)(t?.planPeriod==="month"?"billing.paymentMethod.applePayDescription.monthly":"billing.paymentMethod.applePayDescription.annual")),children:e})]})},_=e=>{let{isProviderReady:t}=(0,o.Jl)();return t?null:e.children},F=e=>{let{isProviderReady:t}=(0,o.Jl)();return t?(0,i.Y)(i.FK,{children:e.children}):null},G=e=>{let{children:t,...r}=e;return(0,i.FD)(v,{...r,children:[(0,i.Y)(_,{children:(0,i.Y)(f.so,{direction:"row",align:"center",justify:"center",sx:e=>({width:"100%",minHeight:e.sizes.$60}),children:(0,i.Y)(f.y$,{size:"lg",colorScheme:"primary",elementDescriptor:b.$z.spinner})})}),(0,i.Y)(F,{children:(0,i.Y)(R,{children:t})})]})},z=(e,t)=>{(0,n.useRef)(()=>{t(e)}),(0,n.useEffect)(()=>{t(e)},[e,t])},S=({text:e})=>{let{setHeaderTitle:t}=k();return z(e,t),null},T=({text:e})=>{let{setHeaderSubtitle:t}=k();return z(e,t),null},M=({text:e})=>{let{setSubmitLabel:t}=k();return z(e,t),null},R=({children:e})=>{let{headerTitle:t,headerSubtitle:r,submitLabel:n,checkout:u,onSuccess:m,cancelAction:g}=k(),f=(0,a.f0)(),b=(0,h.N7)(),{isFormReady:Y,submit:D,reset:$}=(0,o.Jl)(),w=async e=>{e.preventDefault(),f.setLoading(),f.setError(void 0);let{data:t,error:r}=await D();if(r){f.setIdle(),"validation_error"!==r.error.type&&f.setError(r.error.message);return}try{await m(t)}catch(e){(0,p.H4)(e,[],f.setError)}finally{f.setIdle(),$()}};return(0,i.Y)(d.M,{headerTitle:t,headerSubtitle:r,children:(0,i.FD)(s.l.Root,{onSubmit:w,sx:e=>({display:"flex",flexDirection:"column",rowGap:e.space.$3}),children:[e,(0,i.Y)(o.cl,{fallback:(0,i.Y)(x,{})}),(0,i.Y)(l.Z.Alert,{children:f.error}),(0,i.Y)(c.G,{isDisabled:!Y,submitLabel:n??(0,y.G)(`${b}.billingPage.paymentMethodsSection.formButtonPrimary__add`),onReset:g,hideReset:!g,sx:{flex:u?1:void 0}})]})})}},6858(e,t,r){var i=r(9763),o=r(9230),n=r(1046),l=r(8342),a=r(9616),s=r(1538);r.d(t,{},{O:({paymentMethod:e})=>(0,i.FD)(o.so,{sx:{overflow:"hidden"},gap:2,align:"baseline",elementDescriptor:n.$z.paymentMethodRow,children:[(0,i.Y)(o.In,{icon:"card"===e.paymentType?a.A:s.A,sx:e=>({alignSelf:"center",color:e.colors.$colorMutedForeground}),elementDescriptor:n.$z.paymentMethodRowIcon}),(0,i.Y)(o.EY,{sx:e=>({color:e.colors.$colorForeground,textTransform:"capitalize"}),truncate:!0,elementDescriptor:n.$z.paymentMethodRowType,children:"card"===e.paymentType?e.cardType:e.paymentType}),(0,i.Y)(o.EY,{sx:e=>({color:e.colors.$colorMutedForeground}),variant:"caption",truncate:!0,elementDescriptor:n.$z.paymentMethodRowValue,children:"card"===e.paymentType?`⋯ ${e.last4}`:null}),e.isDefault&&(0,i.Y)(o.Ex,{elementDescriptor:n.$z.paymentMethodRowBadge,elementId:n.$z.paymentMethodRowBadge.setId("default"),localizationKey:(0,l.G)("badge__default")}),"expired"===e.status&&(0,i.Y)(o.Ex,{elementDescriptor:n.$z.paymentMethodRowBadge,elementId:n.$z.paymentMethodRowBadge.setId("expired"),colorScheme:"danger",localizationKey:(0,l.G)("badge__expired")})]})})},5760(e,t,r){var i=r(9763),o=r(9230),n=r(8342);let l={active:"badge__activePlan",upcoming:"badge__upcomingPlan",past_due:"badge__pastDuePlan",free_trial:"badge__freeTrial"},a={active:"secondary",upcoming:"primary",past_due:"warning",free_trial:"secondary"};r.d(t,{},{V:({subscription:e,elementDescriptor:t})=>(0,i.Y)(o.Ex,{elementDescriptor:t,colorScheme:a[e.status],localizationKey:(0,n.G)(l[e.status])})})}}]);

package/dist/{checkout_ui_af0413_1.25.7.js → checkout_ui_4ff9e9_1.25.8-canary.v20260722190641.js}

@@ -1 +1 @@
-"use strict";(globalThis.rspackChunk_clerk_ui=globalThis.rspackChunk_clerk_ui||[]).push([[1256],{40460(e,t,r){r.r(t),r.d(t,{Checkout:()=>eu});var o=r(59763),i=r(66923),n=r(79229);r(15254);var l=r(25630),a=r(46262),c=r(59701),s=r(25135);let d=(0,c.createContext)(null),u=()=>{let e=(0,c.useContext)(d),t=(0,a.ho)(),r=(0,s.II)();if(!e||"Checkout"!==e.componentName)throw Error("Clerk: useCheckoutContext called outside Checkout.");let o=(0,c.useMemo)(()=>{var o;if(e.portalRoot)return;let i=e.newSubscriptionRedirectUrl||(null==(o=t.buildNewSubscriptionRedirectUrl)?void 0:o.call(t));return(0,l.vU)(null==r?void 0:r.allowedRedirectOrigins,window.location.origin)(i)?i:void 0},[e.portalRoot,e.newSubscriptionRedirectUrl,t,null==r?void 0:r.allowedRedirectOrigins]),{componentName:i,...n}=e;return{...n,componentName:i,newSubscriptionRedirectUrl:o}};var p=r(34641),h=r(78342),m=r(39230);r(36395),r(42949),r(37891);var g=r(93751),y=r(43736),f=r(61046),b=r(66887),Y=r(11008),D=r(90436),v=r(90196),x=r(58029);let $=e=>e[0].toUpperCase()+e.slice(1),w=(e,t,r)=>e+(t-e)*r,k=e=>{let{positionX:t,positionY:r}=e,i=(0,c.useRef)(null),[n,l]=(0,c.useState)({x:256,y:256}),a="u"<typeof window||window.matchMedia("(hover: hover) and (pointer: fine)").matches;(0,c.useEffect)(()=>{if(!a)return;let e=()=>{l(e=>({x:w(e.x,t,.15),y:w(e.y,r,.15)})),i.current=requestAnimationFrame(e)};return i.current=requestAnimationFrame(e),()=>{i.current&&cancelAnimationFrame(i.current)}},[t,r,a]);let s=(0,c.useId)(),d=(0,c.useId)(),u=(0,c.useId)();return(0,o.FD)(m.az,{elementDescriptor:f.$z.checkoutSuccessRings,as:"svg",viewBox:"0 0 512 512",sx:{position:"absolute",inset:0,pointerEvents:"none"},"aria-hidden":!0,children:[(0,o.FD)("defs",{children:[(0,o.FD)("radialGradient",{id:"clerk-checkout-success-gradient",children:[(0,o.Y)("stop",{offset:"0%",style:{stopColor:"var(--ring-highlight)"}}),(0,o.Y)("stop",{offset:"100%",stopOpacity:"0",style:{stopColor:"var(--ring-highlight)"}})]}),(0,o.Y)("filter",{id:"clerk-checkout-success-blur-effect",children:(0,o.Y)("feGaussianBlur",{stdDeviation:"10"})}),[{r:225,maskStart:10,maskEnd:90,id:s},{r:162.5,maskStart:15,maskEnd:85,id:d},{r:100,maskStart:20,maskEnd:80,id:u}].map(e=>{let{maskStart:t,maskEnd:r,id:i}=e;return(0,o.FD)("linearGradient",{id:"gradient-".concat(i),x1:"0%",y1:"0%",x2:"0%",y2:"100%",children:[(0,o.Y)("stop",{offset:"".concat(t+5,"%"),stopColor:"white",stopOpacity:"0"}),(0,o.Y)("stop",{offset:"".concat(t+35,"%"),stopColor:"white",stopOpacity:"1"}),(0,o.Y)("stop",{offset:"".concat(r-35,"%"),stopColor:"white",stopOpacity:"1"}),(0,o.Y)("stop",{offset:"".concat(r-5,"%"),stopColor:"white",stopOpacity:"0"})]},i)}),(0,o.Y)("mask",{id:"clerk-checkout-success-mask",children:[{r:225,id:s},{r:162.5,id:d},{r:100,id:u}].map(e=>{let{r:t,id:r}=e;return(0,o.Y)("circle",{cx:"256",cy:"256",r:t,stroke:"url(#gradient-".concat(r,")"),fill:"none",strokeWidth:"1"},r)})})]}),(0,o.FD)("g",{mask:"url(#clerk-checkout-success-mask)",children:[(0,o.Y)("rect",{width:"512",height:"512",style:{fill:"var(--ring-fill)"}}),a&&(0,o.Y)("rect",{id:"movingGradientHighlight",width:"256",height:"256",x:n.x-128,y:n.y-128,fill:"url(#clerk-checkout-success-gradient)",filter:"url(#clerk-checkout-success-blur-effect)"})]})]})},_=()=>{let e=(0,x.r)(),{setIsOpen:t}=(0,i.g)(),{newSubscriptionRedirectUrl:r}=u(),{checkout:n}=(0,a.v$)(),{totals:l,paymentMethod:s,planPeriodStart:d,freeTrialEndsAt:p}=n,[w,_]=(0,c.useState)({x:256,y:256}),{$:F}=(0,b._)(),G=(0,v.j)(),{animations:z}=(0,Y.KP)().parsedOptions,S=!G&&!0===z,T=(0,c.useRef)(null),M="u"<typeof window||window.matchMedia("(hover: hover) and (pointer: fine)").matches;return l?(0,o.FD)(o.FK,{children:[(0,o.Y)(i.Drawer.Body,{children:(0,o.FD)(m.L9,{elementDescriptor:f.$z.checkoutSuccessRoot,sx:e=>({"--ring-fill":e.colors.$neutralAlpha200,"--ring-highlight":e.colors.$success500,margin:"auto",position:"relative",aspectRatio:"1/1",display:"grid",width:"100%",flexShrink:0,transformOrigin:"bottom center",animationName:"scaleIn",animationDuration:"".concat(D.wz.slowest,"ms"),animationTimingFunction:D._8.bezier,animationFillMode:"forwards",opacity:0,overflow:"hidden",backgroundColor:e.colors.$colorBackground,"@keyframes scaleIn":{"0%":{filter:"blur(10px)",transform:"scale(0.85)",opacity:0},"100%":{filter:"blur(0px)",transform:"scale(1)",opacity:1}},...!S&&{animation:"none",opacity:1}}),ref:T,onMouseMove:e=>{if(M&&T.current){let t=T.current.getBoundingClientRect(),r=e.clientX-t.left,o=e.clientY-t.top,i=t.width;i>0?_({x:r/i*512,y:o/i*512}):_({x:256,y:256})}},children:[(0,o.Y)(k,{positionX:w.x,positionY:w.y}),(0,o.FD)(m.az,{elementDescriptor:f.$z.checkoutSuccessBadge,sx:e=>({margin:"auto",gridArea:"1/1",display:"flex",position:"relative",width:e.sizes.$16,height:e.sizes.$16,borderRadius:e.radii.$circle,backgroundImage:"linear-gradient(180deg, rgba(255, 255, 255, 0.30) 0%, rgba(0, 0, 0, 0.12) 50%, rgba(0, 0, 0, 0.30) 95.31%)",boxShadow:"0px 4px 12px 0px rgba(0, 0, 0, 0.35), 0px 1px 0px 0px rgba(255, 255, 255, 0.05) inset",color:M?e.colors.$success500:e.colors.$colorForeground,":before":{content:'""',position:"absolute",inset:e.space.$1,borderRadius:e.radii.$circle,backgroundColor:e.colors.$colorBackground}}),children:[(0,o.Y)("svg",{fill:"none",viewBox:"0 0 10 10","aria-hidden":"true",style:{position:"relative",margin:"auto",width:"1rem",height:"1rem"},children:(0,o.Y)("path",{d:"m1 6 3 3 5-8",stroke:"currentColor",strokeWidth:"1.25",strokeLinecap:"round",strokeLinejoin:"round",strokeDasharray:"1",pathLength:"1",style:{strokeDashoffset:"1",animation:S?"check ".concat(D.wz.drawer,"ms ").concat(D._8.bezier," forwards ").concat(D.wz.slow,"ms"):"none",...!S&&{strokeDashoffset:"0"}}})}),(0,o.Y)("style",{children:"\n              @keyframes check {\n                0% {\n                  stroke-dashoffset: 1;\n                }\n                100% {\n                  stroke-dashoffset: 0;\n                }\n            "})]}),(0,o.FD)(m.L9,{sx:e=>({margin:"auto",gridArea:"1/1",position:"relative",textAlign:"center",transform:"translateY(".concat(e.space.$20,")")}),children:[(0,o.Y)(m.DZ,{elementDescriptor:f.$z.checkoutSuccessTitle,as:"h2",textVariant:"h2",localizationKey:p?(0,h.G)("billing.checkout.title__trialSuccess"):l.totalDueNow&&l.totalDueNow.amount>0?(0,h.G)("billing.checkout.title__paymentSuccessful"):(0,h.G)("billing.checkout.title__subscriptionSuccessful"),sx:e=>({opacity:0,animationName:"slideUp",animationDuration:"".concat(D.wz.slowest,"ms"),animationTimingFunction:D._8.bezier,animationFillMode:"forwards",color:e.colors.$colorForeground,"@keyframes slideUp":{"0%":{transform:"translateY(30px)",opacity:0},"100%":{transform:"translateY(0)",opacity:1}},...!S&&{opacity:1,animation:"none"}})}),(0,o.Y)(m.EY,{elementDescriptor:f.$z.checkoutSuccessDescription,colorScheme:"secondary",sx:e=>({textAlign:"center",paddingInline:e.space.$8,marginBlockStart:e.space.$2,opacity:0,animationName:"slideUp",animationDuration:"".concat(1.5*D.wz.slowest,"ms"),animationTimingFunction:D._8.bezier,animationFillMode:"forwards","@keyframes slideUp":{"0%":{transform:"translateY(30px)",opacity:0},"100%":{transform:"translateY(0)",opacity:1}},...!S&&{opacity:1,animation:"none"}}),localizationKey:l.totalDueNow&&l.totalDueNow.amount>0?(0,h.G)("billing.checkout.description__paymentSuccessful"):(0,h.G)("billing.checkout.description__subscriptionSuccessful")})]})]})}),(0,o.FD)(i.Drawer.Footer,{sx:e=>({rowGap:e.space.$4,animationName:"footerSlideInUp",animationDuration:"".concat(D.wz.drawer,"ms"),animationTimingFunction:D._8.bezier,"@keyframes footerSlideInUp":{"0%":{transform:"translateY(100%)",opacity:0},"100%":{transform:"translateY(0)",opacity:1}},...!S&&{animation:"none"}}),children:[(0,o.FD)(g.p.Root,{children:[l.totalDueNow?(0,o.FD)(g.p.Group,{variant:"secondary",children:[(0,o.Y)(g.p.Title,{title:(0,h.G)("billing.checkout.lineItems.title__totalPaid")}),(0,o.Y)(g.p.Description,{text:F(l.totalDueNow)})]}):null,p?(0,o.FD)(g.p.Group,{variant:"secondary",children:[(0,o.Y)(g.p.Title,{title:(0,h.G)("billing.checkout.lineItems.title__freeTrialEndsAt")}),(0,o.Y)(g.p.Description,{text:(0,y.Y)(p)})]}):null,(0,o.FD)(g.p.Group,{variant:"secondary",children:[(0,o.Y)(g.p.Title,{title:l.totalDueNow&&l.totalDueNow.amount>0||null!==p?(0,h.G)("billing.checkout.lineItems.title__paymentMethod"):(0,h.G)("billing.checkout.lineItems.title__subscriptionBegins")}),(0,o.Y)(g.p.Description,{text:l.totalDueNow&&l.totalDueNow.amount>0||null!==p?s?"card"!==s.paymentType?s.paymentType?"".concat($(s.paymentType)):"–":s.cardType?"".concat($(s.cardType)," ⋯ ").concat(s.last4):"–":"–":d?(0,y.Y)(new Date(d)):"–"})]})]}),(0,o.Y)(m.$n,{onClick:()=>{r&&e.navigate(r),t&&t(!1)},localizationKey:(0,h.G)("formButtonPrimary")})]})]}):null};r(14104),r(49678);var F=r(35402),G=r(17308),z=r(92386),S=r(63919),T=r(82117),M=r(75880),R=r(38472),C=r(40049),P=r(30869),B=r(86574),I=r(12861),A=r(12445),N=r(55848),E=r(41805),L=r(56858),W=r(45760);let K=e=>e[0].toUpperCase()+e.slice(1),U="payment_method_id",J=(0,G.dm)(()=>{var e,t,r,n,l,c,s,d,u,p,y,Y,D;let{checkout:v}=(0,a.v$)(),{$:x}=(0,b._)(),{plan:$,totals:w,isImmediatePlanChange:k,planPeriod:_,freeTrialEndsAt:F}=v;if(!$)return null;let G=!!(null==(t=w.credits)||null==(e=t.proration)?void 0:e.amount)&&w.credits.proration.amount.amount>0,z=!!(null==(n=w.credits)||null==(r=n.payer)?void 0:r.appliedAmount)&&w.credits.payer.appliedAmount.amount>0,S=!!(null==(l=w.pastDue)?void 0:l.amount)&&w.pastDue.amount>0,T=!!(null==(s=w.discounts)||null==(c=s.proration)?void 0:c.amount)&&w.discounts.proration.amount.amount>0,P=!!w.totalsDuePerPeriod&&w.totalDueNow&&w.totalsDuePerPeriod.grandTotal.amount!==w.totalDueNow.amount,B=(0,C.cm)(w),I=(0,C.xe)(B),N=(0,C.F1)(B),E=[];"annual"===_&&E.push((0,h.G)("billing.billedAnnually")),I&&null!==I.quantity&&E.push((0,h.G)("billing.pricingTable.seatCost.includedSeats",{includedSeats:I.quantity}));let L=(0,C.V4)($);return L&&1===L.tiers.length&&0===L.tiers[0].feePerBlock.amount&&E.push(L.tiers[0].endsAfterBlock?(0,h.G)("billing.pricingTable.seatCost.upToSeats",{endsAfterBlock:L.tiers[0].endsAfterBlock}):(0,h.G)("billing.pricingTable.seatCost.unlimitedSeats")),(0,o.FD)(i.Drawer.Body,{children:[(0,o.Y)(m.az,{elementDescriptor:f.$z.checkoutFormLineItemsRoot,sx:e=>({padding:e.space.$4,borderBottomWidth:e.borderWidths.$normal,borderBottomStyle:e.borderStyles.$solid,borderBottomColor:e.colors.$borderAlpha100}),children:(0,o.FD)(g.p.Root,{children:[(0,o.FD)(g.p.Group,{children:[(0,o.Y)(g.p.Title,{title:$.name,description:E,badge:$.freeTrialEnabled&&F?(0,o.Y)(W.V,{subscription:{status:"free_trial"}}):null}),w.baseFee?(0,o.Y)(g.p.Description,{prefix:"annual"===_?"x12":void 0,text:x(w.baseFee),suffix:(0,h.G)("billing.checkout.perMonth")}):null]}),N&&null!==N.quantity&&(0,o.FD)(g.p.Group,{borderTop:!0,children:[(0,o.Y)(g.p.Title,{title:(0,h.G)("billing.seats")}),(0,o.Y)(g.p.Description,{prefix:"".concat(N.quantity," x"),text:x(N.feePerBlock),suffix:(0,h.G)("billing.checkout.perMonth")})]}),T&&(0,o.FD)(g.p.Group,{variant:"tertiary",children:[(0,o.Y)(g.p.Title,{title:(0,h.G)("billing.proratedDiscount")}),(0,o.Y)(g.p.Description,{text:(null==(u=w.discounts)||null==(d=u.proration)?void 0:d.amount)?x((0,R.h)(w.discounts.proration.amount)):""})]}),G&&(0,o.FD)(g.p.Group,{variant:"tertiary",children:[(0,o.Y)(g.p.Title,{title:(0,h.G)("billing.creditRemainder")}),(0,o.Y)(g.p.Description,{text:(null==(y=w.credits)||null==(p=y.proration)?void 0:p.amount)?x((0,R.h)(w.credits.proration.amount)):""})]}),z&&(0,o.FD)(g.p.Group,{variant:"tertiary",children:[(0,o.Y)(g.p.Title,{title:(0,h.G)("billing.payerCreditRemainder")}),(0,o.Y)(g.p.Description,{text:(null==(D=w.credits)||null==(Y=D.payer)?void 0:Y.appliedAmount)?x((0,R.h)(w.credits.payer.appliedAmount)):""})]}),S&&(0,o.FD)(g.p.Group,{variant:"tertiary",children:[(0,o.FD)(M.m_.Root,{children:[(0,o.Y)(M.m_.Trigger,{children:(0,o.Y)(g.p.Title,{title:(0,h.G)("billing.pastDue"),icon:A.A})}),(0,o.Y)(M.m_.Content,{text:(0,h.G)("billing.checkout.pastDueNotice")})]}),(0,o.Y)(g.p.Description,{text:w.pastDue?x(w.pastDue):""})]}),F&&$.freeTrialDays&&w.totalDueAfterFreeTrial?(0,o.FD)(g.p.Group,{variant:"tertiary",children:[(0,o.Y)(g.p.Title,{title:(0,h.G)("billing.checkout.totalDueAfterTrial",{days:$.freeTrialDays})}),(0,o.Y)(g.p.Description,{text:x(w.totalDueAfterFreeTrial)})]}):P?null:w.totalDuePerPeriod?(0,o.FD)(g.p.Group,{borderTop:!0,variant:"tertiary",children:[(0,o.Y)(g.p.Title,{title:(0,h.G)("billing.checkout.totalDuePerPeriod")}),(0,o.Y)(g.p.Description,{text:x(w.totalDuePerPeriod)})]}):null,w.totalDueNow?(0,o.FD)(g.p.Group,{borderTop:!0,children:[(0,o.Y)(g.p.Title,{title:(0,h.G)("billing.totalDueToday")}),(0,o.Y)(g.p.Description,{text:x(w.totalDueNow)})]}):null,P&&(0,o.FD)(g.p.Group,{borderTop:!0,children:[(0,o.Y)(g.p.Title,{title:(0,h.G)("billing.totalDuePerPeriod")}),(0,o.Y)(g.p.Description,{text:w.totalsDuePerPeriod?x(w.totalsDuePerPeriod.grandTotal):""})]})]})}),!k&&(0,o.Y)(m.az,{elementDescriptor:f.$z.checkoutFormLineItemsRoot,sx:e=>({paddingBlockStart:e.space.$4,paddingInline:e.space.$4}),children:(0,o.Y)(m.EY,{localizationKey:(0,h.G)("billing.checkout.downgradeNotice"),variant:"caption",colorScheme:"secondary"})}),(0,o.Y)(V,{})]})}),O=()=>{let{onSubscriptionComplete:e}=u(),{checkout:t}=(0,a.v$)(),r=(0,G.f0)();if("needs_confirmation"!==t.status)throw Error("Checkout not found");let o=async o=>{r.setLoading(),r.setError(void 0);let{error:i}=await t.confirm(o);i?(0,P.H4)(i,[],r.setError):null==e||e(),r.setIdle()};return{payWithExistingPaymentMethod:e=>(e.preventDefault(),o({paymentMethodId:new FormData(e.currentTarget).get(U)})),addPaymentMethodAndPay:e=>o(e),payWithTestCard:()=>o({gateway:"stripe",useTestCard:!0}),payWithoutPaymentMethod:e=>(e.preventDefault(),o({}))}},V=()=>{let{checkout:e}=(0,a.v$)(),{plan:t}=e,{isLoading:r}=(0,I.mu)();return t?r?(0,o.Y)(m.y$,{sx:{margin:"auto"}}):(0,o.Y)(j,{}):null},j=()=>{let{checkout:e}=(0,a.v$)(),{plan:t,isImmediatePlanChange:r,needsPaymentMethod:i}=e,{data:n}=(0,I.mu)(),[l,s]=(0,c.useState)(()=>n.length>0?"existing":"new");return t?(0,o.FD)(m.fv,{elementDescriptor:f.$z.checkoutFormElementsRoot,gap:4,sx:e=>({padding:e.space.$4}),children:[(0,o.Y)(o.FK,{children:n.length>0&&r&&i&&(0,o.FD)(z.I.Root,{"aria-label":"Payment method source",value:l,onChange:e=>s(e),size:"lg",fullWidth:!0,children:[(0,o.Y)(z.I.Button,{value:"existing",text:(0,h.G)("billing.paymentMethods__label")}),(0,o.Y)(z.I.Button,{value:"new",text:(0,h.G)("billing.addPaymentMethod__label")})]})}),i?"existing"===l?(0,o.Y)(et,{paymentMethods:n}):"new"===l&&(0,o.Y)(Z,{}):(0,o.Y)(X,{})]}):null},q=()=>{let{isLoading:e}=(0,G.f0)(),{payWithTestCard:t}=O();return(0,o.FD)(m.az,{sx:e=>({background:e.colors.$neutralAlpha50,padding:e.space.$2x5,borderRadius:e.radii.$md,borderWidth:e.borderWidths.$normal,borderStyle:e.borderStyles.$solid,borderColor:e.colors.$borderAlpha100,display:"flex",flexDirection:"column",rowGap:e.space.$2,position:"relative",overflow:"hidden"}),children:[(0,o.Y)(T.$,{}),(0,o.FD)(m.so,{sx:e=>({alignItems:"center",justifyContent:"center",flexDirection:"column",rowGap:e.space.$2}),children:[(0,o.Y)(m.EY,{sx:e=>({color:e.colors.$warning500,fontWeight:e.fontWeights.$semibold}),localizationKey:(0,h.G)("billing.paymentMethod.dev.developmentMode")}),(0,o.Y)(m.$n,{type:"button",block:!0,variant:"bordered",localizationKey:(0,h.G)("userProfile.billingPage.paymentMethodsSection.payWithTestCardButton"),colorScheme:"secondary",isLoading:e,onClick:t})]})]})},H=()=>{let{checkout:e}=(0,a.v$)(),{seatsQuantity:t}=u(),{$:r}=(0,b._)(),{status:o,freeTrialEndsAt:i,totals:n}=e;if("needs_initialization"===o)throw Error("Clerk: Invalid state");return i?t&&n.totalDueNow?(0,h.G)("billing.pay",{amount:r(n.totalDueNow)}):(0,h.G)("billing.startFreeTrial"):n.totalDueNow&&n.totalDueNow.amount>0?(0,h.G)("billing.pay",{amount:r(n.totalDueNow)}):(0,h.G)("billing.subscribe")},X=(0,G.dm)(()=>{let{for:e}=u(),{payWithoutPaymentMethod:t}=O(),r=(0,G.f0)();return(0,o.FD)(m.lV,{onSubmit:t,sx:ee,children:[(0,o.Y)(F.Z.Alert,{children:r.error}),(0,o.Y)(Q,{})]})}),Z=(0,G.dm)(()=>{let{addPaymentMethodAndPay:e}=O(),t=H(),{checkout:r}=(0,a.v$)();return(0,o.FD)(E.bL,{onSuccess:e,checkout:r,children:[(0,o.Y)(B.W,{children:(0,o.Y)(q,{})}),(0,o.Y)(E.pr,{text:t})]})}),Q=e=>{let t=(0,G.f0)(),r=H();return(0,o.Y)(m.$n,{type:"submit",colorScheme:"primary",size:"sm",textVariant:"buttonLarge",sx:{width:"100%"},isLoading:t.isLoading,localizationKey:r,...e})},ee=e=>({display:"flex",flexDirection:"column",rowGap:e.space.$4}),et=(0,G.dm)(e=>{let{paymentMethods:t}=e,{checkout:r}=(0,a.v$)(),{paymentMethod:i,isImmediatePlanChange:n,needsPaymentMethod:l}=r,{payWithExistingPaymentMethod:s}=O(),d=(0,G.f0)(),[u,p]=(0,c.useState)(i||t.find(e=>e.isDefault)),h=(0,c.useMemo)(()=>t.map(e=>{let t="card"!==e.paymentType?e.paymentType?"".concat(K(e.paymentType)):"–":e.cardType?"".concat(K(e.cardType)," ⋯ ").concat(e.last4):"–";return{value:e.id,label:t}}),[t]);return(0,o.FD)(m.lV,{onSubmit:s,sx:ee,children:[n&&l?(0,o.FD)(S.l6,{elementId:"paymentMethod",options:h,value:(null==u?void 0:u.id)||null,onChange:e=>{p(t.find(t=>t.id===e.value))},portal:!0,children:[(0,o.Y)("input",{name:U,type:"hidden",value:null==u?void 0:u.id}),(0,o.Y)(S.JC,{icon:N.A,sx:e=>({justifyContent:"space-between",backgroundColor:e.colors.$colorBackground}),children:u&&(0,o.Y)(L.O,{paymentMethod:u})}),(0,o.Y)(S.UL,{sx:e=>({paddingBlock:e.space.$1,color:e.colors.$colorForeground})})]}):(0,o.Y)("input",{name:U,type:"hidden",value:null==u?void 0:u.id}),(0,o.Y)(F.Z.Alert,{children:d.error}),(0,o.Y)(Q,{})]})});r(50119),r(45249),r(52277);let er=()=>{let{checkout:e}=(0,a.v$)();return(0,c.useEffect)(()=>{e.start()},[e]),null},eo=e=>{let{children:t}=e,{planId:r,planPeriod:i,for:n,seatsQuantity:l,priceId:c}=u();return(0,o.FD)(a.Rx,{for:n,planId:r,planPeriod:i,seatsQuantity:l,priceId:c,children:[(0,o.Y)(er,{}),t]})},ei=e=>{let{children:t,name:r}=e,{checkout:o}=(0,a.v$)();return o.status!==r?null:t},en=e=>{let{children:t,status:r}=e,{errors:o,fetchStatus:i}=(0,a.v$)();return(0,c.useMemo)(()=>{if(o.global){let e=o.global.flatMap(e=>{if(e.isClerkAPIResponseError())return e.errors.map(e=>e.code)});return e.includes("missing_payer_email")?"missing_payer_email":e.includes("invalid_plan_change")?"invalid_plan_change":"generic_error"}return i},[i])!==r?null:t};r(18723);var el=r(40395),ea=r(92534);let ec=()=>{let{errors:e}=(0,a.v$)(),{translateError:t}=(0,b._)(),{t:r}=(0,b._)();return(0,o.Y)(i.Drawer.Body,{children:(0,o.Y)(m.so,{align:"center",justify:"center",sx:e=>({height:"100%",padding:e.space.$4,fontSize:e.fontSizes.$md}),children:(0,o.Y)(el.F,{variant:"danger",colorScheme:"danger",children:e.global?t(e.global[0]):r((0,h.G)("unstable__errors.form_param_value_invalid"))})})})},es=()=>{var e;let{planPeriod:t}=u(),{errors:r}=(0,a.v$)(),n=null==r||null==(e=r.global)?void 0:e.filter(e=>e.isClerkAPIResponseError()).flatMap(e=>e.errors).find(e=>"invalid_plan_change"===e.code);if(!n)return null;let{plan:l,isPlanUpgradePossible:c}=(null==n?void 0:n.meta)||{};return(0,o.Y)(i.Drawer.Body,{children:(0,o.FD)(m.so,{gap:4,direction:"col",children:[(0,o.Y)(m.az,{elementDescriptor:f.$z.checkoutFormLineItemsRoot,sx:e=>({padding:e.space.$4,borderBottomWidth:e.borderWidths.$normal,borderBottomStyle:e.borderStyles.$solid,borderBottomColor:e.colors.$borderAlpha100}),children:(0,o.Y)(g.p.Root,{children:(0,o.FD)(g.p.Group,{children:[(0,o.Y)(g.p.Title,{title:l.name,description:"annual"===t?(0,h.G)("billing.billedAnnually"):void 0}),(0,o.Y)(g.p.Description,{prefix:"annual"===t?"x12":void 0,text:"".concat(l.currency_symbol).concat("month"===t?l.amount_formatted:l.annual_monthly_amount_formatted),suffix:(0,h.G)("billing.checkout.perMonth")})]})})}),(0,o.Y)(m.az,{sx:e=>({padding:e.space.$4}),children:(0,o.Y)(el.F,{variant:"info",colorScheme:"info",title:c?(0,h.G)("billing.cannotSubscribeMonthly"):(0,h.G)("billing.cannotSubscribeUnrecoverable")})})]})})},ed=()=>{let{checkout:e}=(0,a.v$)(),{setIsOpen:t}=(0,i.g)();return(0,o.Y)(i.Drawer.Body,{children:(0,o.Y)(m.az,{sx:e=>({padding:e.space.$4}),children:(0,o.Y)(ea.v,{title:(0,h.G)("billing.checkout.emailForm.title"),subtitle:(0,h.G)("billing.checkout.emailForm.subtitle"),onSuccess:()=>void e.start(),onReset:()=>t(!1),disableAutoFocus:!0})})})},eu=e=>(0,o.Y)(p.n.Root,{flow:"checkout",children:(0,o.Y)(p.n.Part,{children:(0,o.Y)(n.m$.Provider,{value:e.for||"user",children:(0,o.Y)(d.Provider,{value:{componentName:"Checkout",...e},children:(0,o.FD)(i.Drawer.Content,{children:[(0,o.Y)(i.Drawer.Header,{title:(0,h.G)("billing.checkout.title")}),(0,o.FD)(eo,{children:[(0,o.FD)(ei,{name:"needs_initialization",children:[(0,o.Y)(en,{status:"fetching",children:(0,o.Y)(m.y$,{sx:{margin:"auto"}})}),(0,o.Y)(en,{status:"invalid_plan_change",children:(0,o.Y)(es,{})}),(0,o.Y)(en,{status:"missing_payer_email",children:(0,o.Y)(ed,{})}),(0,o.Y)(en,{status:"generic_error",children:(0,o.Y)(ec,{})})]}),(0,o.Y)(ei,{name:"completed",children:(0,o.Y)(_,{})}),(0,o.Y)(ei,{name:"needs_confirmation",children:(0,o.Y)(J,{})})]})]})})})})})},41805(e,t,r){r.d(t,{pr:()=>M,Mo:()=>S,L6:()=>T,bL:()=>G}),r(36395);var o=r(59763),i=r(46262),n=r(59701),l=r(35402),a=r(17308),c=r(17447),s=r(46600),d=r(5870),u=r(23539),p=r(30869),h=r(79229),m=r(11008),g=r(66887),y=r(78342),f=r(39230),b=r(61046);let Y=e=>(0,o.Y)(f.az,{sx:[e=>({height:e.space.$2,width:"100%",borderRadius:e.radii.$md,background:e.colors.$neutralAlpha100}),e.sx]}),D=()=>(0,o.Y)(Y,{sx:e=>({height:e.space.$10,width:"100%"})}),v=e=>(0,o.Y)(f.so,{direction:"col",gap:2,children:e.children}),x=()=>(0,o.Y)(f.az,{"aria-label":"Loading...",sx:{position:"relative",minHeight:0,flex:1,overflowY:"auto"},children:(0,o.FD)(f.so,{direction:"col",gap:5,children:[(0,o.FD)(v,{children:[(0,o.Y)(Y,{sx:e=>({height:e.space.$3,width:e.sizes.$24})}),(0,o.Y)(D,{})]}),(0,o.FD)(f.xA,{columns:2,gap:4,children:[(0,o.FD)(v,{children:[(0,o.Y)(Y,{sx:e=>({height:e.space.$3,width:e.sizes.$20})}),(0,o.Y)(D,{})]}),(0,o.FD)(v,{children:[(0,o.Y)(Y,{sx:e=>({height:e.space.$3,width:e.sizes.$24})}),(0,o.Y)(D,{})]})]}),(0,o.FD)(v,{children:[(0,o.Y)(Y,{sx:e=>({height:e.space.$3,width:e.sizes.$16})}),(0,o.Y)(D,{})]}),(0,o.FD)(v,{children:[(0,o.Y)(Y,{}),(0,o.Y)(Y,{}),(0,o.Y)(Y,{sx:{width:"66.666667%"}})]})]})}),[$,w]=(0,i.e3)("AddPaymentMethodRoot"),k=e=>{var t;let r,{children:l,checkout:a,...c}=e,s=(0,h.XX)(),d=(0,n.useRef)(null),{t:p}=(0,g._)(),[f,b]=(0,n.useState)(void 0),[Y,D]=(0,n.useState)(void 0),[v,x]=(0,n.useState)(void 0),w=(t=d.current,r=(0,m.KP)().parsedInternalTheme,(0,n.useMemo)(()=>{if(!t)return;let{colors:e,fontWeights:o,fontSizes:i,radii:n,space:l}=r;return{colorPrimary:(0,u.G3)(t,e.$primary500,e.$colorBackground),colorBackground:(0,u.G3)(t,e.$colorInput,e.$colorBackground),colorText:(0,u.G3)(t,e.$colorForeground,e.$colorBackground),colorTextSecondary:(0,u.G3)(t,e.$colorMutedForeground,e.$colorBackground),colorSuccess:(0,u.G3)(t,e.$success500,e.$colorBackground),colorDanger:(0,u.G3)(t,e.$danger500,e.$colorBackground),colorWarning:(0,u.G3)(t,e.$warning500,e.$colorBackground),fontWeightNormal:(0,u.yJ)(t,"font-weight",o.$normal.toString()),fontWeightMedium:(0,u.yJ)(t,"font-weight",o.$medium.toString()),fontWeightBold:(0,u.yJ)(t,"font-weight",o.$bold.toString()),fontSizeXl:(0,u.yJ)(t,"font-size",i.$xl),fontSizeLg:(0,u.yJ)(t,"font-size",i.$lg),fontSizeSm:(0,u.yJ)(t,"font-size",i.$md),fontSizeXs:(0,u.yJ)(t,"font-size",i.$sm),borderRadius:(0,u.yJ)(t,"border-radius",n.$lg),spacingUnit:(0,u.yJ)(t,"padding",l.$1)}},[r,t]));return(0,o.FD)($.Provider,{value:{value:{headerTitle:f,headerSubtitle:Y,submitLabel:v,setHeaderTitle:b,setHeaderSubtitle:D,setSubmitLabel:x,checkout:a,...c}},children:[(0,o.Y)("div",{ref:d,style:{display:"none"}}),(0,o.Y)(i.Tn,{checkout:a,for:s,stripeAppearance:w,paymentDescription:p((0,y.G)((null==a?void 0:a.planPeriod)==="month"?"billing.paymentMethod.applePayDescription.monthly":"billing.paymentMethod.applePayDescription.annual")),children:l})]})},_=e=>{let{isProviderReady:t}=(0,i.Jl)();return t?null:e.children},F=e=>{let{isProviderReady:t}=(0,i.Jl)();return t?(0,o.Y)(o.FK,{children:e.children}):null},G=e=>{let{children:t,...r}=e;return(0,o.FD)(k,{...r,children:[(0,o.Y)(_,{children:(0,o.Y)(f.so,{direction:"row",align:"center",justify:"center",sx:e=>({width:"100%",minHeight:e.sizes.$60}),children:(0,o.Y)(f.y$,{size:"lg",colorScheme:"primary",elementDescriptor:b.$z.spinner})})}),(0,o.Y)(F,{children:(0,o.Y)(R,{children:t})})]})},z=(e,t)=>{(0,n.useRef)(()=>{t(e)}),(0,n.useEffect)(()=>{t(e)},[e,t])},S=e=>{let{text:t}=e,{setHeaderTitle:r}=w();return z(t,r),null},T=e=>{let{text:t}=e,{setHeaderSubtitle:r}=w();return z(t,r),null},M=e=>{let{text:t}=e,{setSubmitLabel:r}=w();return z(t,r),null},R=e=>{let{children:t}=e,{headerTitle:r,headerSubtitle:n,submitLabel:u,checkout:m,onSuccess:g,cancelAction:f}=w(),b=(0,a.f0)(),Y=(0,h.N7)(),{isFormReady:D,submit:v,reset:$}=(0,i.Jl)(),k=async e=>{e.preventDefault(),b.setLoading(),b.setError(void 0);let{data:t,error:r}=await v();if(r){b.setIdle(),"validation_error"!==r.error.type&&b.setError(r.error.message);return}try{await g(t)}catch(e){(0,p.H4)(e,[],b.setError)}finally{b.setIdle(),$()}};return(0,o.Y)(d.M,{headerTitle:r,headerSubtitle:n,children:(0,o.FD)(c.l.Root,{onSubmit:k,sx:e=>({display:"flex",flexDirection:"column",rowGap:e.space.$3}),children:[t,(0,o.Y)(i.cl,{fallback:(0,o.Y)(x,{})}),(0,o.Y)(l.Z.Alert,{children:b.error}),(0,o.Y)(s.G,{isDisabled:!D,submitLabel:null!=u?u:(0,y.G)("".concat(Y,".billingPage.paymentMethodsSection.formButtonPrimary__add")),onReset:f,hideReset:!f,sx:{flex:m?1:void 0}})]})})}},56858(e,t,r){var o=r(59763),i=r(39230),n=r(61046),l=r(78342),a=r(9616),c=r(36300);r.d(t,{},{O:e=>{let{paymentMethod:t}=e;return(0,o.FD)(i.so,{sx:{overflow:"hidden"},gap:2,align:"baseline",elementDescriptor:n.$z.paymentMethodRow,children:[(0,o.Y)(i.In,{icon:"card"===t.paymentType?a.A:c.A,sx:e=>({alignSelf:"center",color:e.colors.$colorMutedForeground}),elementDescriptor:n.$z.paymentMethodRowIcon}),(0,o.Y)(i.EY,{sx:e=>({color:e.colors.$colorForeground,textTransform:"capitalize"}),truncate:!0,elementDescriptor:n.$z.paymentMethodRowType,children:"card"===t.paymentType?t.cardType:t.paymentType}),(0,o.Y)(i.EY,{sx:e=>({color:e.colors.$colorMutedForeground}),variant:"caption",truncate:!0,elementDescriptor:n.$z.paymentMethodRowValue,children:"card"===t.paymentType?"⋯ ".concat(t.last4):null}),t.isDefault&&(0,o.Y)(i.Ex,{elementDescriptor:n.$z.paymentMethodRowBadge,elementId:n.$z.paymentMethodRowBadge.setId("default"),localizationKey:(0,l.G)("badge__default")}),"expired"===t.status&&(0,o.Y)(i.Ex,{elementDescriptor:n.$z.paymentMethodRowBadge,elementId:n.$z.paymentMethodRowBadge.setId("expired"),colorScheme:"danger",localizationKey:(0,l.G)("badge__expired")})]})}})},45760(e,t,r){var o=r(59763),i=r(39230),n=r(78342);let l={active:"badge__activePlan",upcoming:"badge__upcomingPlan",past_due:"badge__pastDuePlan",free_trial:"badge__freeTrial"},a={active:"secondary",upcoming:"primary",past_due:"warning",free_trial:"secondary"};r.d(t,{},{V:e=>{let{subscription:t,elementDescriptor:r}=e;return(0,o.Y)(i.Ex,{elementDescriptor:r,colorScheme:a[t.status],localizationKey:(0,n.G)(l[t.status])})}})}}]);
+"use strict";(globalThis.rspackChunk_clerk_ui=globalThis.rspackChunk_clerk_ui||[]).push([[1256],{40460(e,t,r){r.r(t),r.d(t,{Checkout:()=>eu});var o=r(59763),i=r(66923),n=r(79229);r(15254);var l=r(25630),a=r(46262),c=r(59701),s=r(25135);let d=(0,c.createContext)(null),u=()=>{let e=(0,c.useContext)(d),t=(0,a.ho)(),r=(0,s.II)();if(!e||"Checkout"!==e.componentName)throw Error("Clerk: useCheckoutContext called outside Checkout.");let o=(0,c.useMemo)(()=>{var o;if(e.portalRoot)return;let i=e.newSubscriptionRedirectUrl||(null==(o=t.buildNewSubscriptionRedirectUrl)?void 0:o.call(t));return(0,l.vU)(null==r?void 0:r.allowedRedirectOrigins,window.location.origin)(i)?i:void 0},[e.portalRoot,e.newSubscriptionRedirectUrl,t,null==r?void 0:r.allowedRedirectOrigins]),{componentName:i,...n}=e;return{...n,componentName:i,newSubscriptionRedirectUrl:o}};var p=r(34641),h=r(78342),m=r(39230);r(36395),r(42949),r(37891);var g=r(93751),y=r(43736),f=r(61046),b=r(66887),Y=r(11008),D=r(90436),v=r(90196),x=r(58029);let $=e=>e[0].toUpperCase()+e.slice(1),w=(e,t,r)=>e+(t-e)*r,k=e=>{let{positionX:t,positionY:r}=e,i=(0,c.useRef)(null),[n,l]=(0,c.useState)({x:256,y:256}),a="u"<typeof window||window.matchMedia("(hover: hover) and (pointer: fine)").matches;(0,c.useEffect)(()=>{if(!a)return;let e=()=>{l(e=>({x:w(e.x,t,.15),y:w(e.y,r,.15)})),i.current=requestAnimationFrame(e)};return i.current=requestAnimationFrame(e),()=>{i.current&&cancelAnimationFrame(i.current)}},[t,r,a]);let s=(0,c.useId)(),d=(0,c.useId)(),u=(0,c.useId)();return(0,o.FD)(m.az,{elementDescriptor:f.$z.checkoutSuccessRings,as:"svg",viewBox:"0 0 512 512",sx:{position:"absolute",inset:0,pointerEvents:"none"},"aria-hidden":!0,children:[(0,o.FD)("defs",{children:[(0,o.FD)("radialGradient",{id:"clerk-checkout-success-gradient",children:[(0,o.Y)("stop",{offset:"0%",style:{stopColor:"var(--ring-highlight)"}}),(0,o.Y)("stop",{offset:"100%",stopOpacity:"0",style:{stopColor:"var(--ring-highlight)"}})]}),(0,o.Y)("filter",{id:"clerk-checkout-success-blur-effect",children:(0,o.Y)("feGaussianBlur",{stdDeviation:"10"})}),[{r:225,maskStart:10,maskEnd:90,id:s},{r:162.5,maskStart:15,maskEnd:85,id:d},{r:100,maskStart:20,maskEnd:80,id:u}].map(e=>{let{maskStart:t,maskEnd:r,id:i}=e;return(0,o.FD)("linearGradient",{id:"gradient-".concat(i),x1:"0%",y1:"0%",x2:"0%",y2:"100%",children:[(0,o.Y)("stop",{offset:"".concat(t+5,"%"),stopColor:"white",stopOpacity:"0"}),(0,o.Y)("stop",{offset:"".concat(t+35,"%"),stopColor:"white",stopOpacity:"1"}),(0,o.Y)("stop",{offset:"".concat(r-35,"%"),stopColor:"white",stopOpacity:"1"}),(0,o.Y)("stop",{offset:"".concat(r-5,"%"),stopColor:"white",stopOpacity:"0"})]},i)}),(0,o.Y)("mask",{id:"clerk-checkout-success-mask",children:[{r:225,id:s},{r:162.5,id:d},{r:100,id:u}].map(e=>{let{r:t,id:r}=e;return(0,o.Y)("circle",{cx:"256",cy:"256",r:t,stroke:"url(#gradient-".concat(r,")"),fill:"none",strokeWidth:"1"},r)})})]}),(0,o.FD)("g",{mask:"url(#clerk-checkout-success-mask)",children:[(0,o.Y)("rect",{width:"512",height:"512",style:{fill:"var(--ring-fill)"}}),a&&(0,o.Y)("rect",{id:"movingGradientHighlight",width:"256",height:"256",x:n.x-128,y:n.y-128,fill:"url(#clerk-checkout-success-gradient)",filter:"url(#clerk-checkout-success-blur-effect)"})]})]})},_=()=>{let e=(0,x.r)(),{setIsOpen:t}=(0,i.g)(),{newSubscriptionRedirectUrl:r}=u(),{checkout:n}=(0,a.v$)(),{totals:l,paymentMethod:s,planPeriodStart:d,freeTrialEndsAt:p}=n,[w,_]=(0,c.useState)({x:256,y:256}),{$:F}=(0,b._)(),G=(0,v.j)(),{animations:z}=(0,Y.KP)().parsedOptions,S=!G&&!0===z,T=(0,c.useRef)(null),M="u"<typeof window||window.matchMedia("(hover: hover) and (pointer: fine)").matches;return l?(0,o.FD)(o.FK,{children:[(0,o.Y)(i.Drawer.Body,{children:(0,o.FD)(m.L9,{elementDescriptor:f.$z.checkoutSuccessRoot,sx:e=>({"--ring-fill":e.colors.$neutralAlpha200,"--ring-highlight":e.colors.$success500,margin:"auto",position:"relative",aspectRatio:"1/1",display:"grid",width:"100%",flexShrink:0,transformOrigin:"bottom center",animationName:"scaleIn",animationDuration:"".concat(D.wz.slowest,"ms"),animationTimingFunction:D._8.bezier,animationFillMode:"forwards",opacity:0,overflow:"hidden",backgroundColor:e.colors.$colorBackground,"@keyframes scaleIn":{"0%":{filter:"blur(10px)",transform:"scale(0.85)",opacity:0},"100%":{filter:"blur(0px)",transform:"scale(1)",opacity:1}},...!S&&{animation:"none",opacity:1}}),ref:T,onMouseMove:e=>{if(M&&T.current){let t=T.current.getBoundingClientRect(),r=e.clientX-t.left,o=e.clientY-t.top,i=t.width;i>0?_({x:r/i*512,y:o/i*512}):_({x:256,y:256})}},children:[(0,o.Y)(k,{positionX:w.x,positionY:w.y}),(0,o.FD)(m.az,{elementDescriptor:f.$z.checkoutSuccessBadge,sx:e=>({margin:"auto",gridArea:"1/1",display:"flex",position:"relative",width:e.sizes.$16,height:e.sizes.$16,borderRadius:e.radii.$circle,backgroundImage:"linear-gradient(180deg, rgba(255, 255, 255, 0.30) 0%, rgba(0, 0, 0, 0.12) 50%, rgba(0, 0, 0, 0.30) 95.31%)",boxShadow:"0px 4px 12px 0px rgba(0, 0, 0, 0.35), 0px 1px 0px 0px rgba(255, 255, 255, 0.05) inset",color:M?e.colors.$success500:e.colors.$colorForeground,":before":{content:'""',position:"absolute",inset:e.space.$1,borderRadius:e.radii.$circle,backgroundColor:e.colors.$colorBackground}}),children:[(0,o.Y)("svg",{fill:"none",viewBox:"0 0 10 10","aria-hidden":"true",style:{position:"relative",margin:"auto",width:"1rem",height:"1rem"},children:(0,o.Y)("path",{d:"m1 6 3 3 5-8",stroke:"currentColor",strokeWidth:"1.25",strokeLinecap:"round",strokeLinejoin:"round",strokeDasharray:"1",pathLength:"1",style:{strokeDashoffset:"1",animation:S?"check ".concat(D.wz.drawer,"ms ").concat(D._8.bezier," forwards ").concat(D.wz.slow,"ms"):"none",...!S&&{strokeDashoffset:"0"}}})}),(0,o.Y)("style",{children:"\n              @keyframes check {\n                0% {\n                  stroke-dashoffset: 1;\n                }\n                100% {\n                  stroke-dashoffset: 0;\n                }\n            "})]}),(0,o.FD)(m.L9,{sx:e=>({margin:"auto",gridArea:"1/1",position:"relative",textAlign:"center",transform:"translateY(".concat(e.space.$20,")")}),children:[(0,o.Y)(m.DZ,{elementDescriptor:f.$z.checkoutSuccessTitle,as:"h2",textVariant:"h2",localizationKey:p?(0,h.G)("billing.checkout.title__trialSuccess"):l.totalDueNow&&l.totalDueNow.amount>0?(0,h.G)("billing.checkout.title__paymentSuccessful"):(0,h.G)("billing.checkout.title__subscriptionSuccessful"),sx:e=>({opacity:0,animationName:"slideUp",animationDuration:"".concat(D.wz.slowest,"ms"),animationTimingFunction:D._8.bezier,animationFillMode:"forwards",color:e.colors.$colorForeground,"@keyframes slideUp":{"0%":{transform:"translateY(30px)",opacity:0},"100%":{transform:"translateY(0)",opacity:1}},...!S&&{opacity:1,animation:"none"}})}),(0,o.Y)(m.EY,{elementDescriptor:f.$z.checkoutSuccessDescription,colorScheme:"secondary",sx:e=>({textAlign:"center",paddingInline:e.space.$8,marginBlockStart:e.space.$2,opacity:0,animationName:"slideUp",animationDuration:"".concat(1.5*D.wz.slowest,"ms"),animationTimingFunction:D._8.bezier,animationFillMode:"forwards","@keyframes slideUp":{"0%":{transform:"translateY(30px)",opacity:0},"100%":{transform:"translateY(0)",opacity:1}},...!S&&{opacity:1,animation:"none"}}),localizationKey:l.totalDueNow&&l.totalDueNow.amount>0?(0,h.G)("billing.checkout.description__paymentSuccessful"):(0,h.G)("billing.checkout.description__subscriptionSuccessful")})]})]})}),(0,o.FD)(i.Drawer.Footer,{sx:e=>({rowGap:e.space.$4,animationName:"footerSlideInUp",animationDuration:"".concat(D.wz.drawer,"ms"),animationTimingFunction:D._8.bezier,"@keyframes footerSlideInUp":{"0%":{transform:"translateY(100%)",opacity:0},"100%":{transform:"translateY(0)",opacity:1}},...!S&&{animation:"none"}}),children:[(0,o.FD)(g.p.Root,{children:[l.totalDueNow?(0,o.FD)(g.p.Group,{variant:"secondary",children:[(0,o.Y)(g.p.Title,{title:(0,h.G)("billing.checkout.lineItems.title__totalPaid")}),(0,o.Y)(g.p.Description,{text:F(l.totalDueNow)})]}):null,p?(0,o.FD)(g.p.Group,{variant:"secondary",children:[(0,o.Y)(g.p.Title,{title:(0,h.G)("billing.checkout.lineItems.title__freeTrialEndsAt")}),(0,o.Y)(g.p.Description,{text:(0,y.Y)(p)})]}):null,(0,o.FD)(g.p.Group,{variant:"secondary",children:[(0,o.Y)(g.p.Title,{title:l.totalDueNow&&l.totalDueNow.amount>0||null!==p?(0,h.G)("billing.checkout.lineItems.title__paymentMethod"):(0,h.G)("billing.checkout.lineItems.title__subscriptionBegins")}),(0,o.Y)(g.p.Description,{text:l.totalDueNow&&l.totalDueNow.amount>0||null!==p?s?"card"!==s.paymentType?s.paymentType?"".concat($(s.paymentType)):"–":s.cardType?"".concat($(s.cardType)," ⋯ ").concat(s.last4):"–":"–":d?(0,y.Y)(new Date(d)):"–"})]})]}),(0,o.Y)(m.$n,{onClick:()=>{r&&e.navigate(r),t&&t(!1)},localizationKey:(0,h.G)("formButtonPrimary")})]})]}):null};r(14104),r(49678);var F=r(35402),G=r(17308),z=r(82117),S=r(92386),T=r(63919),M=r(75880),R=r(38472),C=r(40049),P=r(30869),B=r(86574),I=r(12861),A=r(12445),N=r(55848),E=r(41805),L=r(56858),W=r(45760);let K=e=>e[0].toUpperCase()+e.slice(1),U="payment_method_id",J=(0,G.dm)(()=>{var e,t,r,n,l,c,s,d,u,p,y,Y,D;let{checkout:v}=(0,a.v$)(),{$:x}=(0,b._)(),{plan:$,totals:w,isImmediatePlanChange:k,planPeriod:_,freeTrialEndsAt:F}=v;if(!$)return null;let G=!!(null==(t=w.credits)||null==(e=t.proration)?void 0:e.amount)&&w.credits.proration.amount.amount>0,z=!!(null==(n=w.credits)||null==(r=n.payer)?void 0:r.appliedAmount)&&w.credits.payer.appliedAmount.amount>0,S=!!(null==(l=w.pastDue)?void 0:l.amount)&&w.pastDue.amount>0,T=!!(null==(s=w.discounts)||null==(c=s.proration)?void 0:c.amount)&&w.discounts.proration.amount.amount>0,P=!!w.totalsDuePerPeriod&&w.totalDueNow&&w.totalsDuePerPeriod.grandTotal.amount!==w.totalDueNow.amount,B=(0,C.cm)(w),I=(0,C.xe)(B),N=(0,C.F1)(B),E=[];"annual"===_&&E.push((0,h.G)("billing.billedAnnually")),I&&null!==I.quantity&&E.push((0,h.G)("billing.pricingTable.seatCost.includedSeats",{includedSeats:I.quantity}));let L=(0,C.V4)($);return L&&1===L.tiers.length&&0===L.tiers[0].feePerBlock.amount&&E.push(L.tiers[0].endsAfterBlock?(0,h.G)("billing.pricingTable.seatCost.upToSeats",{endsAfterBlock:L.tiers[0].endsAfterBlock}):(0,h.G)("billing.pricingTable.seatCost.unlimitedSeats")),(0,o.FD)(i.Drawer.Body,{children:[(0,o.Y)(m.az,{elementDescriptor:f.$z.checkoutFormLineItemsRoot,sx:e=>({padding:e.space.$4,borderBottomWidth:e.borderWidths.$normal,borderBottomStyle:e.borderStyles.$solid,borderBottomColor:e.colors.$borderAlpha100}),children:(0,o.FD)(g.p.Root,{children:[(0,o.FD)(g.p.Group,{children:[(0,o.Y)(g.p.Title,{title:$.name,description:E,badge:$.freeTrialEnabled&&F?(0,o.Y)(W.V,{subscription:{status:"free_trial"}}):null}),w.baseFee?(0,o.Y)(g.p.Description,{prefix:"annual"===_?"x12":void 0,text:x(w.baseFee),suffix:(0,h.G)("billing.checkout.perMonth")}):null]}),N&&null!==N.quantity&&(0,o.FD)(g.p.Group,{borderTop:!0,children:[(0,o.Y)(g.p.Title,{title:(0,h.G)("billing.seats")}),(0,o.Y)(g.p.Description,{prefix:"".concat(N.quantity," x"),text:x(N.feePerBlock),suffix:(0,h.G)("billing.checkout.perMonth")})]}),T&&(0,o.FD)(g.p.Group,{variant:"tertiary",children:[(0,o.Y)(g.p.Title,{title:(0,h.G)("billing.proratedDiscount")}),(0,o.Y)(g.p.Description,{text:(null==(u=w.discounts)||null==(d=u.proration)?void 0:d.amount)?x((0,R.h)(w.discounts.proration.amount)):""})]}),G&&(0,o.FD)(g.p.Group,{variant:"tertiary",children:[(0,o.Y)(g.p.Title,{title:(0,h.G)("billing.creditRemainder")}),(0,o.Y)(g.p.Description,{text:(null==(y=w.credits)||null==(p=y.proration)?void 0:p.amount)?x((0,R.h)(w.credits.proration.amount)):""})]}),z&&(0,o.FD)(g.p.Group,{variant:"tertiary",children:[(0,o.Y)(g.p.Title,{title:(0,h.G)("billing.payerCreditRemainder")}),(0,o.Y)(g.p.Description,{text:(null==(D=w.credits)||null==(Y=D.payer)?void 0:Y.appliedAmount)?x((0,R.h)(w.credits.payer.appliedAmount)):""})]}),S&&(0,o.FD)(g.p.Group,{variant:"tertiary",children:[(0,o.FD)(M.m_.Root,{children:[(0,o.Y)(M.m_.Trigger,{children:(0,o.Y)(g.p.Title,{title:(0,h.G)("billing.pastDue"),icon:A.A})}),(0,o.Y)(M.m_.Content,{text:(0,h.G)("billing.checkout.pastDueNotice")})]}),(0,o.Y)(g.p.Description,{text:w.pastDue?x(w.pastDue):""})]}),F&&$.freeTrialDays&&w.totalDueAfterFreeTrial?(0,o.FD)(g.p.Group,{variant:"tertiary",children:[(0,o.Y)(g.p.Title,{title:(0,h.G)("billing.checkout.totalDueAfterTrial",{days:$.freeTrialDays})}),(0,o.Y)(g.p.Description,{text:x(w.totalDueAfterFreeTrial)})]}):P?null:w.totalDuePerPeriod?(0,o.FD)(g.p.Group,{borderTop:!0,variant:"tertiary",children:[(0,o.Y)(g.p.Title,{title:(0,h.G)("billing.checkout.totalDuePerPeriod")}),(0,o.Y)(g.p.Description,{text:x(w.totalDuePerPeriod)})]}):null,w.totalDueNow?(0,o.FD)(g.p.Group,{borderTop:!0,children:[(0,o.Y)(g.p.Title,{title:(0,h.G)("billing.totalDueToday")}),(0,o.Y)(g.p.Description,{text:x(w.totalDueNow)})]}):null,P&&(0,o.FD)(g.p.Group,{borderTop:!0,children:[(0,o.Y)(g.p.Title,{title:(0,h.G)("billing.totalDuePerPeriod")}),(0,o.Y)(g.p.Description,{text:w.totalsDuePerPeriod?x(w.totalsDuePerPeriod.grandTotal):""})]})]})}),!k&&(0,o.Y)(m.az,{elementDescriptor:f.$z.checkoutFormLineItemsRoot,sx:e=>({paddingBlockStart:e.space.$4,paddingInline:e.space.$4}),children:(0,o.Y)(m.EY,{localizationKey:(0,h.G)("billing.checkout.downgradeNotice"),variant:"caption",colorScheme:"secondary"})}),(0,o.Y)(V,{})]})}),O=()=>{let{onSubscriptionComplete:e}=u(),{checkout:t}=(0,a.v$)(),r=(0,G.f0)();if("needs_confirmation"!==t.status)throw Error("Checkout not found");let o=async o=>{r.setLoading(),r.setError(void 0);let{error:i}=await t.confirm(o);i?(0,P.H4)(i,[],r.setError):null==e||e(),r.setIdle()};return{payWithExistingPaymentMethod:e=>(e.preventDefault(),o({paymentMethodId:new FormData(e.currentTarget).get(U)})),addPaymentMethodAndPay:e=>o(e),payWithTestCard:()=>o({gateway:"stripe",useTestCard:!0}),payWithoutPaymentMethod:e=>(e.preventDefault(),o({}))}},V=()=>{let{checkout:e}=(0,a.v$)(),{plan:t}=e,{isLoading:r}=(0,I.mu)();return t?r?(0,o.Y)(m.y$,{sx:{margin:"auto"}}):(0,o.Y)(j,{}):null},j=()=>{let{checkout:e}=(0,a.v$)(),{plan:t,isImmediatePlanChange:r,needsPaymentMethod:i}=e,{data:n}=(0,I.mu)(),[l,s]=(0,c.useState)(()=>n.length>0?"existing":"new");return t?(0,o.FD)(m.fv,{elementDescriptor:f.$z.checkoutFormElementsRoot,gap:4,sx:e=>({padding:e.space.$4}),children:[(0,o.Y)(o.FK,{children:n.length>0&&r&&i&&(0,o.FD)(S.I.Root,{"aria-label":"Payment method source",value:l,onChange:e=>s(e),size:"lg",fullWidth:!0,children:[(0,o.Y)(S.I.Button,{value:"existing",text:(0,h.G)("billing.paymentMethods__label")}),(0,o.Y)(S.I.Button,{value:"new",text:(0,h.G)("billing.addPaymentMethod__label")})]})}),i?"existing"===l?(0,o.Y)(et,{paymentMethods:n}):"new"===l&&(0,o.Y)(Z,{}):(0,o.Y)(X,{})]}):null},q=()=>{let{isLoading:e}=(0,G.f0)(),{payWithTestCard:t}=O();return(0,o.FD)(m.az,{sx:e=>({background:e.colors.$neutralAlpha50,padding:e.space.$2x5,borderRadius:e.radii.$md,borderWidth:e.borderWidths.$normal,borderStyle:e.borderStyles.$solid,borderColor:e.colors.$borderAlpha100,display:"flex",flexDirection:"column",rowGap:e.space.$2,position:"relative",overflow:"hidden"}),children:[(0,o.Y)(z.$,{}),(0,o.FD)(m.so,{sx:e=>({alignItems:"center",justifyContent:"center",flexDirection:"column",rowGap:e.space.$2}),children:[(0,o.Y)(m.EY,{sx:e=>({color:e.colors.$warning500,fontWeight:e.fontWeights.$semibold}),localizationKey:(0,h.G)("billing.paymentMethod.dev.developmentMode")}),(0,o.Y)(m.$n,{type:"button",block:!0,variant:"bordered",localizationKey:(0,h.G)("userProfile.billingPage.paymentMethodsSection.payWithTestCardButton"),colorScheme:"secondary",isLoading:e,onClick:t})]})]})},H=()=>{let{checkout:e}=(0,a.v$)(),{seatsQuantity:t}=u(),{$:r}=(0,b._)(),{status:o,freeTrialEndsAt:i,totals:n}=e;if("needs_initialization"===o)throw Error("Clerk: Invalid state");return i?t&&n.totalDueNow?(0,h.G)("billing.pay",{amount:r(n.totalDueNow)}):(0,h.G)("billing.startFreeTrial"):n.totalDueNow&&n.totalDueNow.amount>0?(0,h.G)("billing.pay",{amount:r(n.totalDueNow)}):(0,h.G)("billing.subscribe")},X=(0,G.dm)(()=>{let{for:e}=u(),{payWithoutPaymentMethod:t}=O(),r=(0,G.f0)();return(0,o.FD)(m.lV,{onSubmit:t,sx:ee,children:[(0,o.Y)(F.Z.Alert,{children:r.error}),(0,o.Y)(Q,{})]})}),Z=(0,G.dm)(()=>{let{addPaymentMethodAndPay:e}=O(),t=H(),{checkout:r}=(0,a.v$)();return(0,o.FD)(E.bL,{onSuccess:e,checkout:r,children:[(0,o.Y)(B.W,{children:(0,o.Y)(q,{})}),(0,o.Y)(E.pr,{text:t})]})}),Q=e=>{let t=(0,G.f0)(),r=H();return(0,o.Y)(m.$n,{type:"submit",colorScheme:"primary",size:"sm",textVariant:"buttonLarge",sx:{width:"100%"},isLoading:t.isLoading,localizationKey:r,...e})},ee=e=>({display:"flex",flexDirection:"column",rowGap:e.space.$4}),et=(0,G.dm)(e=>{let{paymentMethods:t}=e,{checkout:r}=(0,a.v$)(),{paymentMethod:i,isImmediatePlanChange:n,needsPaymentMethod:l}=r,{payWithExistingPaymentMethod:s}=O(),d=(0,G.f0)(),[u,p]=(0,c.useState)(i||t.find(e=>e.isDefault)),h=(0,c.useMemo)(()=>t.map(e=>{let t="card"!==e.paymentType?e.paymentType?"".concat(K(e.paymentType)):"–":e.cardType?"".concat(K(e.cardType)," ⋯ ").concat(e.last4):"–";return{value:e.id,label:t}}),[t]);return(0,o.FD)(m.lV,{onSubmit:s,sx:ee,children:[n&&l?(0,o.FD)(T.l6,{elementId:"paymentMethod",options:h,value:(null==u?void 0:u.id)||null,onChange:e=>{p(t.find(t=>t.id===e.value))},portal:!0,children:[(0,o.Y)("input",{name:U,type:"hidden",value:null==u?void 0:u.id}),(0,o.Y)(T.JC,{icon:N.A,sx:e=>({justifyContent:"space-between",backgroundColor:e.colors.$colorBackground}),children:u&&(0,o.Y)(L.O,{paymentMethod:u})}),(0,o.Y)(T.UL,{sx:e=>({paddingBlock:e.space.$1,color:e.colors.$colorForeground})})]}):(0,o.Y)("input",{name:U,type:"hidden",value:null==u?void 0:u.id}),(0,o.Y)(F.Z.Alert,{children:d.error}),(0,o.Y)(Q,{})]})});r(50119),r(45249),r(52277);let er=()=>{let{checkout:e}=(0,a.v$)();return(0,c.useEffect)(()=>{e.start()},[e]),null},eo=e=>{let{children:t}=e,{planId:r,planPeriod:i,for:n,seatsQuantity:l,priceId:c}=u();return(0,o.FD)(a.Rx,{for:n,planId:r,planPeriod:i,seatsQuantity:l,priceId:c,children:[(0,o.Y)(er,{}),t]})},ei=e=>{let{children:t,name:r}=e,{checkout:o}=(0,a.v$)();return o.status!==r?null:t},en=e=>{let{children:t,status:r}=e,{errors:o,fetchStatus:i}=(0,a.v$)();return(0,c.useMemo)(()=>{if(o.global){let e=o.global.flatMap(e=>{if(e.isClerkAPIResponseError())return e.errors.map(e=>e.code)});return e.includes("missing_payer_email")?"missing_payer_email":e.includes("invalid_plan_change")?"invalid_plan_change":"generic_error"}return i},[i])!==r?null:t};r(18723);var el=r(40395),ea=r(92534);let ec=()=>{let{errors:e}=(0,a.v$)(),{translateError:t}=(0,b._)(),{t:r}=(0,b._)();return(0,o.Y)(i.Drawer.Body,{children:(0,o.Y)(m.so,{align:"center",justify:"center",sx:e=>({height:"100%",padding:e.space.$4,fontSize:e.fontSizes.$md}),children:(0,o.Y)(el.F,{variant:"danger",colorScheme:"danger",children:e.global?t(e.global[0]):r((0,h.G)("unstable__errors.form_param_value_invalid"))})})})},es=()=>{var e;let{planPeriod:t}=u(),{errors:r}=(0,a.v$)(),n=null==r||null==(e=r.global)?void 0:e.filter(e=>e.isClerkAPIResponseError()).flatMap(e=>e.errors).find(e=>"invalid_plan_change"===e.code);if(!n)return null;let{plan:l,isPlanUpgradePossible:c}=(null==n?void 0:n.meta)||{};return(0,o.Y)(i.Drawer.Body,{children:(0,o.FD)(m.so,{gap:4,direction:"col",children:[(0,o.Y)(m.az,{elementDescriptor:f.$z.checkoutFormLineItemsRoot,sx:e=>({padding:e.space.$4,borderBottomWidth:e.borderWidths.$normal,borderBottomStyle:e.borderStyles.$solid,borderBottomColor:e.colors.$borderAlpha100}),children:(0,o.Y)(g.p.Root,{children:(0,o.FD)(g.p.Group,{children:[(0,o.Y)(g.p.Title,{title:l.name,description:"annual"===t?(0,h.G)("billing.billedAnnually"):void 0}),(0,o.Y)(g.p.Description,{prefix:"annual"===t?"x12":void 0,text:"".concat(l.currency_symbol).concat("month"===t?l.amount_formatted:l.annual_monthly_amount_formatted),suffix:(0,h.G)("billing.checkout.perMonth")})]})})}),(0,o.Y)(m.az,{sx:e=>({padding:e.space.$4}),children:(0,o.Y)(el.F,{variant:"info",colorScheme:"info",title:c?(0,h.G)("billing.cannotSubscribeMonthly"):(0,h.G)("billing.cannotSubscribeUnrecoverable")})})]})})},ed=()=>{let{checkout:e}=(0,a.v$)(),{setIsOpen:t}=(0,i.g)();return(0,o.Y)(i.Drawer.Body,{children:(0,o.Y)(m.az,{sx:e=>({padding:e.space.$4}),children:(0,o.Y)(ea.v,{title:(0,h.G)("billing.checkout.emailForm.title"),subtitle:(0,h.G)("billing.checkout.emailForm.subtitle"),onSuccess:()=>void e.start(),onReset:()=>t(!1),disableAutoFocus:!0})})})},eu=e=>(0,o.Y)(p.n.Root,{flow:"checkout",children:(0,o.Y)(p.n.Part,{children:(0,o.Y)(n.m$.Provider,{value:e.for||"user",children:(0,o.Y)(d.Provider,{value:{componentName:"Checkout",...e},children:(0,o.FD)(i.Drawer.Content,{children:[(0,o.Y)(i.Drawer.Header,{title:(0,h.G)("billing.checkout.title")}),(0,o.FD)(eo,{children:[(0,o.FD)(ei,{name:"needs_initialization",children:[(0,o.Y)(en,{status:"fetching",children:(0,o.Y)(m.y$,{sx:{margin:"auto"}})}),(0,o.Y)(en,{status:"invalid_plan_change",children:(0,o.Y)(es,{})}),(0,o.Y)(en,{status:"missing_payer_email",children:(0,o.Y)(ed,{})}),(0,o.Y)(en,{status:"generic_error",children:(0,o.Y)(ec,{})})]}),(0,o.Y)(ei,{name:"completed",children:(0,o.Y)(_,{})}),(0,o.Y)(ei,{name:"needs_confirmation",children:(0,o.Y)(J,{})})]})]})})})})})},41805(e,t,r){r.d(t,{pr:()=>M,Mo:()=>S,L6:()=>T,bL:()=>G}),r(36395);var o=r(59763),i=r(46262),n=r(59701),l=r(35402),a=r(17308),c=r(17447),s=r(46600),d=r(5870),u=r(23539),p=r(30869),h=r(79229),m=r(11008),g=r(66887),y=r(78342),f=r(39230),b=r(61046);let Y=e=>(0,o.Y)(f.az,{sx:[e=>({height:e.space.$2,width:"100%",borderRadius:e.radii.$md,background:e.colors.$neutralAlpha100}),e.sx]}),D=()=>(0,o.Y)(Y,{sx:e=>({height:e.space.$10,width:"100%"})}),v=e=>(0,o.Y)(f.so,{direction:"col",gap:2,children:e.children}),x=()=>(0,o.Y)(f.az,{"aria-label":"Loading...",sx:{position:"relative",minHeight:0,flex:1,overflowY:"auto"},children:(0,o.FD)(f.so,{direction:"col",gap:5,children:[(0,o.FD)(v,{children:[(0,o.Y)(Y,{sx:e=>({height:e.space.$3,width:e.sizes.$24})}),(0,o.Y)(D,{})]}),(0,o.FD)(f.xA,{columns:2,gap:4,children:[(0,o.FD)(v,{children:[(0,o.Y)(Y,{sx:e=>({height:e.space.$3,width:e.sizes.$20})}),(0,o.Y)(D,{})]}),(0,o.FD)(v,{children:[(0,o.Y)(Y,{sx:e=>({height:e.space.$3,width:e.sizes.$24})}),(0,o.Y)(D,{})]})]}),(0,o.FD)(v,{children:[(0,o.Y)(Y,{sx:e=>({height:e.space.$3,width:e.sizes.$16})}),(0,o.Y)(D,{})]}),(0,o.FD)(v,{children:[(0,o.Y)(Y,{}),(0,o.Y)(Y,{}),(0,o.Y)(Y,{sx:{width:"66.666667%"}})]})]})}),[$,w]=(0,i.e3)("AddPaymentMethodRoot"),k=e=>{var t;let r,{children:l,checkout:a,...c}=e,s=(0,h.XX)(),d=(0,n.useRef)(null),{t:p}=(0,g._)(),[f,b]=(0,n.useState)(void 0),[Y,D]=(0,n.useState)(void 0),[v,x]=(0,n.useState)(void 0),w=(t=d.current,r=(0,m.KP)().parsedInternalTheme,(0,n.useMemo)(()=>{if(!t)return;let{colors:e,fontWeights:o,fontSizes:i,radii:n,space:l}=r;return{colorPrimary:(0,u.G3)(t,e.$primary500,e.$colorBackground),colorBackground:(0,u.G3)(t,e.$colorInput,e.$colorBackground),colorText:(0,u.G3)(t,e.$colorForeground,e.$colorBackground),colorTextSecondary:(0,u.G3)(t,e.$colorMutedForeground,e.$colorBackground),colorSuccess:(0,u.G3)(t,e.$success500,e.$colorBackground),colorDanger:(0,u.G3)(t,e.$danger500,e.$colorBackground),colorWarning:(0,u.G3)(t,e.$warning500,e.$colorBackground),fontWeightNormal:(0,u.yJ)(t,"font-weight",o.$normal.toString()),fontWeightMedium:(0,u.yJ)(t,"font-weight",o.$medium.toString()),fontWeightBold:(0,u.yJ)(t,"font-weight",o.$bold.toString()),fontSizeXl:(0,u.yJ)(t,"font-size",i.$xl),fontSizeLg:(0,u.yJ)(t,"font-size",i.$lg),fontSizeSm:(0,u.yJ)(t,"font-size",i.$md),fontSizeXs:(0,u.yJ)(t,"font-size",i.$sm),borderRadius:(0,u.yJ)(t,"border-radius",n.$lg),spacingUnit:(0,u.yJ)(t,"padding",l.$1)}},[r,t]));return(0,o.FD)($.Provider,{value:{value:{headerTitle:f,headerSubtitle:Y,submitLabel:v,setHeaderTitle:b,setHeaderSubtitle:D,setSubmitLabel:x,checkout:a,...c}},children:[(0,o.Y)("div",{ref:d,style:{display:"none"}}),(0,o.Y)(i.Tn,{checkout:a,for:s,stripeAppearance:w,paymentDescription:p((0,y.G)((null==a?void 0:a.planPeriod)==="month"?"billing.paymentMethod.applePayDescription.monthly":"billing.paymentMethod.applePayDescription.annual")),children:l})]})},_=e=>{let{isProviderReady:t}=(0,i.Jl)();return t?null:e.children},F=e=>{let{isProviderReady:t}=(0,i.Jl)();return t?(0,o.Y)(o.FK,{children:e.children}):null},G=e=>{let{children:t,...r}=e;return(0,o.FD)(k,{...r,children:[(0,o.Y)(_,{children:(0,o.Y)(f.so,{direction:"row",align:"center",justify:"center",sx:e=>({width:"100%",minHeight:e.sizes.$60}),children:(0,o.Y)(f.y$,{size:"lg",colorScheme:"primary",elementDescriptor:b.$z.spinner})})}),(0,o.Y)(F,{children:(0,o.Y)(R,{children:t})})]})},z=(e,t)=>{(0,n.useRef)(()=>{t(e)}),(0,n.useEffect)(()=>{t(e)},[e,t])},S=e=>{let{text:t}=e,{setHeaderTitle:r}=w();return z(t,r),null},T=e=>{let{text:t}=e,{setHeaderSubtitle:r}=w();return z(t,r),null},M=e=>{let{text:t}=e,{setSubmitLabel:r}=w();return z(t,r),null},R=e=>{let{children:t}=e,{headerTitle:r,headerSubtitle:n,submitLabel:u,checkout:m,onSuccess:g,cancelAction:f}=w(),b=(0,a.f0)(),Y=(0,h.N7)(),{isFormReady:D,submit:v,reset:$}=(0,i.Jl)(),k=async e=>{e.preventDefault(),b.setLoading(),b.setError(void 0);let{data:t,error:r}=await v();if(r){b.setIdle(),"validation_error"!==r.error.type&&b.setError(r.error.message);return}try{await g(t)}catch(e){(0,p.H4)(e,[],b.setError)}finally{b.setIdle(),$()}};return(0,o.Y)(d.M,{headerTitle:r,headerSubtitle:n,children:(0,o.FD)(c.l.Root,{onSubmit:k,sx:e=>({display:"flex",flexDirection:"column",rowGap:e.space.$3}),children:[t,(0,o.Y)(i.cl,{fallback:(0,o.Y)(x,{})}),(0,o.Y)(l.Z.Alert,{children:b.error}),(0,o.Y)(s.G,{isDisabled:!D,submitLabel:null!=u?u:(0,y.G)("".concat(Y,".billingPage.paymentMethodsSection.formButtonPrimary__add")),onReset:f,hideReset:!f,sx:{flex:m?1:void 0}})]})})}},56858(e,t,r){var o=r(59763),i=r(39230),n=r(61046),l=r(78342),a=r(9616),c=r(36300);r.d(t,{},{O:e=>{let{paymentMethod:t}=e;return(0,o.FD)(i.so,{sx:{overflow:"hidden"},gap:2,align:"baseline",elementDescriptor:n.$z.paymentMethodRow,children:[(0,o.Y)(i.In,{icon:"card"===t.paymentType?a.A:c.A,sx:e=>({alignSelf:"center",color:e.colors.$colorMutedForeground}),elementDescriptor:n.$z.paymentMethodRowIcon}),(0,o.Y)(i.EY,{sx:e=>({color:e.colors.$colorForeground,textTransform:"capitalize"}),truncate:!0,elementDescriptor:n.$z.paymentMethodRowType,children:"card"===t.paymentType?t.cardType:t.paymentType}),(0,o.Y)(i.EY,{sx:e=>({color:e.colors.$colorMutedForeground}),variant:"caption",truncate:!0,elementDescriptor:n.$z.paymentMethodRowValue,children:"card"===t.paymentType?"⋯ ".concat(t.last4):null}),t.isDefault&&(0,o.Y)(i.Ex,{elementDescriptor:n.$z.paymentMethodRowBadge,elementId:n.$z.paymentMethodRowBadge.setId("default"),localizationKey:(0,l.G)("badge__default")}),"expired"===t.status&&(0,o.Y)(i.Ex,{elementDescriptor:n.$z.paymentMethodRowBadge,elementId:n.$z.paymentMethodRowBadge.setId("expired"),colorScheme:"danger",localizationKey:(0,l.G)("badge__expired")})]})}})},45760(e,t,r){var o=r(59763),i=r(39230),n=r(78342);let l={active:"badge__activePlan",upcoming:"badge__upcomingPlan",past_due:"badge__pastDuePlan",free_trial:"badge__freeTrial"},a={active:"secondary",upcoming:"primary",past_due:"warning",free_trial:"secondary"};r.d(t,{},{V:e=>{let{subscription:t,elementDescriptor:r}=e;return(0,o.Y)(i.Ex,{elementDescriptor:r,colorScheme:a[t.status],localizationKey:(0,n.G)(l[t.status])})}})}}]);

package/dist/{checkout_ui_cfe0f1_1.25.7.js → checkout_ui_98f006_1.25.8-canary.v20260722190641.js}

@@ -6,4 +6,4 @@
                 100% {
                   stroke-dashoffset: 0;
                 }
-            `})]}),(0,i.FD)(m.L9,{sx:e=>({margin:"auto",gridArea:"1/1",position:"relative",textAlign:"center",transform:`translateY(${e.space.$20})`}),children:[(0,i.Y)(m.DZ,{elementDescriptor:f.$z.checkoutSuccessTitle,as:"h2",textVariant:"h2",localizationKey:p?(0,h.G)("billing.checkout.title__trialSuccess"):l.totalDueNow&&l.totalDueNow.amount>0?(0,h.G)("billing.checkout.title__paymentSuccessful"):(0,h.G)("billing.checkout.title__subscriptionSuccessful"),sx:e=>({opacity:0,animationName:"slideUp",animationDuration:`${D.wz.slowest}ms`,animationTimingFunction:D._8.bezier,animationFillMode:"forwards",color:e.colors.$colorForeground,"@keyframes slideUp":{"0%":{transform:"translateY(30px)",opacity:0},"100%":{transform:"translateY(0)",opacity:1}},...!S&&{opacity:1,animation:"none"}})}),(0,i.Y)(m.EY,{elementDescriptor:f.$z.checkoutSuccessDescription,colorScheme:"secondary",sx:e=>({textAlign:"center",paddingInline:e.space.$8,marginBlockStart:e.space.$2,opacity:0,animationName:"slideUp",animationDuration:`${1.5*D.wz.slowest}ms`,animationTimingFunction:D._8.bezier,animationFillMode:"forwards","@keyframes slideUp":{"0%":{transform:"translateY(30px)",opacity:0},"100%":{transform:"translateY(0)",opacity:1}},...!S&&{opacity:1,animation:"none"}}),localizationKey:l.totalDueNow&&l.totalDueNow.amount>0?(0,h.G)("billing.checkout.description__paymentSuccessful"):(0,h.G)("billing.checkout.description__subscriptionSuccessful")})]})]})}),(0,i.FD)(o.Drawer.Footer,{sx:e=>({rowGap:e.space.$4,animationName:"footerSlideInUp",animationDuration:`${D.wz.drawer}ms`,animationTimingFunction:D._8.bezier,"@keyframes footerSlideInUp":{"0%":{transform:"translateY(100%)",opacity:0},"100%":{transform:"translateY(0)",opacity:1}},...!S&&{animation:"none"}}),children:[(0,i.FD)(g.p.Root,{children:[l.totalDueNow?(0,i.FD)(g.p.Group,{variant:"secondary",children:[(0,i.Y)(g.p.Title,{title:(0,h.G)("billing.checkout.lineItems.title__totalPaid")}),(0,i.Y)(g.p.Description,{text:F(l.totalDueNow)})]}):null,p?(0,i.FD)(g.p.Group,{variant:"secondary",children:[(0,i.Y)(g.p.Title,{title:(0,h.G)("billing.checkout.lineItems.title__freeTrialEndsAt")}),(0,i.Y)(g.p.Description,{text:(0,y.Y)(p)})]}):null,(0,i.FD)(g.p.Group,{variant:"secondary",children:[(0,i.Y)(g.p.Title,{title:l.totalDueNow&&l.totalDueNow.amount>0||null!==p?(0,h.G)("billing.checkout.lineItems.title__paymentMethod"):(0,h.G)("billing.checkout.lineItems.title__subscriptionBegins")}),(0,i.Y)(g.p.Description,{text:l.totalDueNow&&l.totalDueNow.amount>0||null!==p?c?"card"!==c.paymentType?c.paymentType?`${w(c.paymentType)}`:"–":c.cardType?`${w(c.cardType)} ⋯ ${c.last4}`:"–":"–":d?(0,y.Y)(new Date(d)):"–"})]})]}),(0,i.Y)(m.$n,{onClick:()=>{r&&e.navigate(r),t&&t(!1)},localizationKey:(0,h.G)("formButtonPrimary")})]})]}):null};var F=r(5402),G=r(7308),z=r(2386),S=r(3919),T=r(2117),M=r(5880),R=r(8472),C=r(49),P=r(869),B=r(6574),I=r(2861),A=r(2445),N=r(5848),E=r(1805),L=r(6858),W=r(5760);let K=e=>e[0].toUpperCase()+e.slice(1),U="payment_method_id",J=(0,G.dm)(()=>{let{checkout:e}=(0,a.v$)(),{$:t}=(0,b._)(),{plan:r,totals:n,isImmediatePlanChange:l,planPeriod:s,freeTrialEndsAt:c}=e;if(!r)return null;let d=!!n.credits?.proration?.amount&&n.credits.proration.amount.amount>0,u=!!n.credits?.payer?.appliedAmount&&n.credits.payer.appliedAmount.amount>0,p=!!n.pastDue?.amount&&n.pastDue.amount>0,y=!!n.discounts?.proration?.amount&&n.discounts.proration.amount.amount>0,Y=!!n.totalsDuePerPeriod&&n.totalDueNow&&n.totalsDuePerPeriod.grandTotal.amount!==n.totalDueNow.amount,D=(0,C.cm)(n),$=(0,C.xe)(D),x=(0,C.F1)(D),w=[];"annual"===s&&w.push((0,h.G)("billing.billedAnnually")),$&&null!==$.quantity&&w.push((0,h.G)("billing.pricingTable.seatCost.includedSeats",{includedSeats:$.quantity}));let k=(0,C.V4)(r);return k&&1===k.tiers.length&&0===k.tiers[0].feePerBlock.amount&&w.push(k.tiers[0].endsAfterBlock?(0,h.G)("billing.pricingTable.seatCost.upToSeats",{endsAfterBlock:k.tiers[0].endsAfterBlock}):(0,h.G)("billing.pricingTable.seatCost.unlimitedSeats")),(0,i.FD)(o.Drawer.Body,{children:[(0,i.Y)(m.az,{elementDescriptor:f.$z.checkoutFormLineItemsRoot,sx:e=>({padding:e.space.$4,borderBottomWidth:e.borderWidths.$normal,borderBottomStyle:e.borderStyles.$solid,borderBottomColor:e.colors.$borderAlpha100}),children:(0,i.FD)(g.p.Root,{children:[(0,i.FD)(g.p.Group,{children:[(0,i.Y)(g.p.Title,{title:r.name,description:w,badge:r.freeTrialEnabled&&c?(0,i.Y)(W.V,{subscription:{status:"free_trial"}}):null}),n.baseFee?(0,i.Y)(g.p.Description,{prefix:"annual"===s?"x12":void 0,text:t(n.baseFee),suffix:(0,h.G)("billing.checkout.perMonth")}):null]}),x&&null!==x.quantity&&(0,i.FD)(g.p.Group,{borderTop:!0,children:[(0,i.Y)(g.p.Title,{title:(0,h.G)("billing.seats")}),(0,i.Y)(g.p.Description,{prefix:`${x.quantity} x`,text:t(x.feePerBlock),suffix:(0,h.G)("billing.checkout.perMonth")})]}),y&&(0,i.FD)(g.p.Group,{variant:"tertiary",children:[(0,i.Y)(g.p.Title,{title:(0,h.G)("billing.proratedDiscount")}),(0,i.Y)(g.p.Description,{text:n.discounts?.proration?.amount?t((0,R.h)(n.discounts.proration.amount)):""})]}),d&&(0,i.FD)(g.p.Group,{variant:"tertiary",children:[(0,i.Y)(g.p.Title,{title:(0,h.G)("billing.creditRemainder")}),(0,i.Y)(g.p.Description,{text:n.credits?.proration?.amount?t((0,R.h)(n.credits.proration.amount)):""})]}),u&&(0,i.FD)(g.p.Group,{variant:"tertiary",children:[(0,i.Y)(g.p.Title,{title:(0,h.G)("billing.payerCreditRemainder")}),(0,i.Y)(g.p.Description,{text:n.credits?.payer?.appliedAmount?t((0,R.h)(n.credits.payer.appliedAmount)):""})]}),p&&(0,i.FD)(g.p.Group,{variant:"tertiary",children:[(0,i.FD)(M.m_.Root,{children:[(0,i.Y)(M.m_.Trigger,{children:(0,i.Y)(g.p.Title,{title:(0,h.G)("billing.pastDue"),icon:A.A})}),(0,i.Y)(M.m_.Content,{text:(0,h.G)("billing.checkout.pastDueNotice")})]}),(0,i.Y)(g.p.Description,{text:n.pastDue?t(n.pastDue):""})]}),c&&r.freeTrialDays&&n.totalDueAfterFreeTrial?(0,i.FD)(g.p.Group,{variant:"tertiary",children:[(0,i.Y)(g.p.Title,{title:(0,h.G)("billing.checkout.totalDueAfterTrial",{days:r.freeTrialDays})}),(0,i.Y)(g.p.Description,{text:t(n.totalDueAfterFreeTrial)})]}):Y?null:n.totalDuePerPeriod?(0,i.FD)(g.p.Group,{borderTop:!0,variant:"tertiary",children:[(0,i.Y)(g.p.Title,{title:(0,h.G)("billing.checkout.totalDuePerPeriod")}),(0,i.Y)(g.p.Description,{text:t(n.totalDuePerPeriod)})]}):null,n.totalDueNow?(0,i.FD)(g.p.Group,{borderTop:!0,children:[(0,i.Y)(g.p.Title,{title:(0,h.G)("billing.totalDueToday")}),(0,i.Y)(g.p.Description,{text:t(n.totalDueNow)})]}):null,Y&&(0,i.FD)(g.p.Group,{borderTop:!0,children:[(0,i.Y)(g.p.Title,{title:(0,h.G)("billing.totalDuePerPeriod")}),(0,i.Y)(g.p.Description,{text:n.totalsDuePerPeriod?t(n.totalsDuePerPeriod.grandTotal):""})]})]})}),!l&&(0,i.Y)(m.az,{elementDescriptor:f.$z.checkoutFormLineItemsRoot,sx:e=>({paddingBlockStart:e.space.$4,paddingInline:e.space.$4}),children:(0,i.Y)(m.EY,{localizationKey:(0,h.G)("billing.checkout.downgradeNotice"),variant:"caption",colorScheme:"secondary"})}),(0,i.Y)(V,{})]})}),O=()=>{let{onSubscriptionComplete:e}=u(),{checkout:t}=(0,a.v$)(),r=(0,G.f0)();if("needs_confirmation"!==t.status)throw Error("Checkout not found");let i=async i=>{r.setLoading(),r.setError(void 0);let{error:o}=await t.confirm(i);o?(0,P.H4)(o,[],r.setError):e?.(),r.setIdle()};return{payWithExistingPaymentMethod:e=>(e.preventDefault(),i({paymentMethodId:new FormData(e.currentTarget).get(U)})),addPaymentMethodAndPay:e=>i(e),payWithTestCard:()=>i({gateway:"stripe",useTestCard:!0}),payWithoutPaymentMethod:e=>(e.preventDefault(),i({}))}},V=()=>{let{checkout:e}=(0,a.v$)(),{plan:t}=e,{isLoading:r}=(0,I.mu)();return t?r?(0,i.Y)(m.y$,{sx:{margin:"auto"}}):(0,i.Y)(j,{}):null},j=()=>{let{checkout:e}=(0,a.v$)(),{plan:t,isImmediatePlanChange:r,needsPaymentMethod:o}=e,{data:n}=(0,I.mu)(),[l,c]=(0,s.useState)(()=>n.length>0?"existing":"new");return t?(0,i.FD)(m.fv,{elementDescriptor:f.$z.checkoutFormElementsRoot,gap:4,sx:e=>({padding:e.space.$4}),children:[(0,i.Y)(i.FK,{children:n.length>0&&r&&o&&(0,i.FD)(z.I.Root,{"aria-label":"Payment method source",value:l,onChange:e=>c(e),size:"lg",fullWidth:!0,children:[(0,i.Y)(z.I.Button,{value:"existing",text:(0,h.G)("billing.paymentMethods__label")}),(0,i.Y)(z.I.Button,{value:"new",text:(0,h.G)("billing.addPaymentMethod__label")})]})}),o?"existing"===l?(0,i.Y)(et,{paymentMethods:n}):"new"===l&&(0,i.Y)(Z,{}):(0,i.Y)(X,{})]}):null},q=()=>{let{isLoading:e}=(0,G.f0)(),{payWithTestCard:t}=O();return(0,i.FD)(m.az,{sx:e=>({background:e.colors.$neutralAlpha50,padding:e.space.$2x5,borderRadius:e.radii.$md,borderWidth:e.borderWidths.$normal,borderStyle:e.borderStyles.$solid,borderColor:e.colors.$borderAlpha100,display:"flex",flexDirection:"column",rowGap:e.space.$2,position:"relative",overflow:"hidden"}),children:[(0,i.Y)(T.$,{}),(0,i.FD)(m.so,{sx:e=>({alignItems:"center",justifyContent:"center",flexDirection:"column",rowGap:e.space.$2}),children:[(0,i.Y)(m.EY,{sx:e=>({color:e.colors.$warning500,fontWeight:e.fontWeights.$semibold}),localizationKey:(0,h.G)("billing.paymentMethod.dev.developmentMode")}),(0,i.Y)(m.$n,{type:"button",block:!0,variant:"bordered",localizationKey:(0,h.G)("userProfile.billingPage.paymentMethodsSection.payWithTestCardButton"),colorScheme:"secondary",isLoading:e,onClick:t})]})]})},H=()=>{let{checkout:e}=(0,a.v$)(),{seatsQuantity:t}=u(),{$:r}=(0,b._)(),{status:i,freeTrialEndsAt:o,totals:n}=e;if("needs_initialization"===i)throw Error("Clerk: Invalid state");return o?t&&n.totalDueNow?(0,h.G)("billing.pay",{amount:r(n.totalDueNow)}):(0,h.G)("billing.startFreeTrial"):n.totalDueNow&&n.totalDueNow.amount>0?(0,h.G)("billing.pay",{amount:r(n.totalDueNow)}):(0,h.G)("billing.subscribe")},X=(0,G.dm)(()=>{let{for:e}=u(),{payWithoutPaymentMethod:t}=O(),r=(0,G.f0)();return(0,i.FD)(m.lV,{onSubmit:t,sx:ee,children:[(0,i.Y)(F.Z.Alert,{children:r.error}),(0,i.Y)(Q,{})]})}),Z=(0,G.dm)(()=>{let{addPaymentMethodAndPay:e}=O(),t=H(),{checkout:r}=(0,a.v$)();return(0,i.FD)(E.bL,{onSuccess:e,checkout:r,children:[(0,i.Y)(B.W,{children:(0,i.Y)(q,{})}),(0,i.Y)(E.pr,{text:t})]})}),Q=e=>{let t=(0,G.f0)(),r=H();return(0,i.Y)(m.$n,{type:"submit",colorScheme:"primary",size:"sm",textVariant:"buttonLarge",sx:{width:"100%"},isLoading:t.isLoading,localizationKey:r,...e})},ee=e=>({display:"flex",flexDirection:"column",rowGap:e.space.$4}),et=(0,G.dm)(({paymentMethods:e})=>{let{checkout:t}=(0,a.v$)(),{paymentMethod:r,isImmediatePlanChange:o,needsPaymentMethod:n}=t,{payWithExistingPaymentMethod:l}=O(),c=(0,G.f0)(),[d,u]=(0,s.useState)(r||e.find(e=>e.isDefault)),p=(0,s.useMemo)(()=>e.map(e=>{let t="card"!==e.paymentType?e.paymentType?`${K(e.paymentType)}`:"–":e.cardType?`${K(e.cardType)} ⋯ ${e.last4}`:"–";return{value:e.id,label:t}}),[e]);return(0,i.FD)(m.lV,{onSubmit:l,sx:ee,children:[o&&n?(0,i.FD)(S.l6,{elementId:"paymentMethod",options:p,value:d?.id||null,onChange:t=>{u(e.find(e=>e.id===t.value))},portal:!0,children:[(0,i.Y)("input",{name:U,type:"hidden",value:d?.id}),(0,i.Y)(S.JC,{icon:N.A,sx:e=>({justifyContent:"space-between",backgroundColor:e.colors.$colorBackground}),children:d&&(0,i.Y)(L.O,{paymentMethod:d})}),(0,i.Y)(S.UL,{sx:e=>({paddingBlock:e.space.$1,color:e.colors.$colorForeground})})]}):(0,i.Y)("input",{name:U,type:"hidden",value:d?.id}),(0,i.Y)(F.Z.Alert,{children:c.error}),(0,i.Y)(Q,{})]})}),er=()=>{let{checkout:e}=(0,a.v$)();return(0,s.useEffect)(()=>{e.start()},[e]),null},ei=({children:e})=>{let{planId:t,planPeriod:r,for:o,seatsQuantity:n,priceId:l}=u();return(0,i.FD)(a.Rx,{for:o,planId:t,planPeriod:r,seatsQuantity:n,priceId:l,children:[(0,i.Y)(er,{}),e]})},eo=({children:e,name:t})=>{let{checkout:r}=(0,a.v$)();return r.status!==t?null:e},en=({children:e,status:t})=>{let{errors:r,fetchStatus:i}=(0,a.v$)();return(0,s.useMemo)(()=>{if(r.global){let e=r.global.flatMap(e=>{if(e.isClerkAPIResponseError())return e.errors.map(e=>e.code)});return e.includes("missing_payer_email")?"missing_payer_email":e.includes("invalid_plan_change")?"invalid_plan_change":"generic_error"}return i},[i])!==t?null:e};var el=r(395),ea=r(2534);let es=()=>{let{errors:e}=(0,a.v$)(),{translateError:t}=(0,b._)(),{t:r}=(0,b._)();return(0,i.Y)(o.Drawer.Body,{children:(0,i.Y)(m.so,{align:"center",justify:"center",sx:e=>({height:"100%",padding:e.space.$4,fontSize:e.fontSizes.$md}),children:(0,i.Y)(el.F,{variant:"danger",colorScheme:"danger",children:e.global?t(e.global[0]):r((0,h.G)("unstable__errors.form_param_value_invalid"))})})})},ec=()=>{let{planPeriod:e}=u(),{errors:t}=(0,a.v$)(),r=t?.global?.filter(e=>e.isClerkAPIResponseError()).flatMap(e=>e.errors).find(e=>"invalid_plan_change"===e.code);if(!r)return null;let{plan:n,isPlanUpgradePossible:l}=r?.meta||{};return(0,i.Y)(o.Drawer.Body,{children:(0,i.FD)(m.so,{gap:4,direction:"col",children:[(0,i.Y)(m.az,{elementDescriptor:f.$z.checkoutFormLineItemsRoot,sx:e=>({padding:e.space.$4,borderBottomWidth:e.borderWidths.$normal,borderBottomStyle:e.borderStyles.$solid,borderBottomColor:e.colors.$borderAlpha100}),children:(0,i.Y)(g.p.Root,{children:(0,i.FD)(g.p.Group,{children:[(0,i.Y)(g.p.Title,{title:n.name,description:"annual"===e?(0,h.G)("billing.billedAnnually"):void 0}),(0,i.Y)(g.p.Description,{prefix:"annual"===e?"x12":void 0,text:`${n.currency_symbol}${"month"===e?n.amount_formatted:n.annual_monthly_amount_formatted}`,suffix:(0,h.G)("billing.checkout.perMonth")})]})})}),(0,i.Y)(m.az,{sx:e=>({padding:e.space.$4}),children:(0,i.Y)(el.F,{variant:"info",colorScheme:"info",title:l?(0,h.G)("billing.cannotSubscribeMonthly"):(0,h.G)("billing.cannotSubscribeUnrecoverable")})})]})})},ed=()=>{let{checkout:e}=(0,a.v$)(),{setIsOpen:t}=(0,o.g)();return(0,i.Y)(o.Drawer.Body,{children:(0,i.Y)(m.az,{sx:e=>({padding:e.space.$4}),children:(0,i.Y)(ea.v,{title:(0,h.G)("billing.checkout.emailForm.title"),subtitle:(0,h.G)("billing.checkout.emailForm.subtitle"),onSuccess:()=>void e.start(),onReset:()=>t(!1),disableAutoFocus:!0})})})},eu=e=>(0,i.Y)(p.n.Root,{flow:"checkout",children:(0,i.Y)(p.n.Part,{children:(0,i.Y)(n.m$.Provider,{value:e.for||"user",children:(0,i.Y)(d.Provider,{value:{componentName:"Checkout",...e},children:(0,i.FD)(o.Drawer.Content,{children:[(0,i.Y)(o.Drawer.Header,{title:(0,h.G)("billing.checkout.title")}),(0,i.FD)(ei,{children:[(0,i.FD)(eo,{name:"needs_initialization",children:[(0,i.Y)(en,{status:"fetching",children:(0,i.Y)(m.y$,{sx:{margin:"auto"}})}),(0,i.Y)(en,{status:"invalid_plan_change",children:(0,i.Y)(ec,{})}),(0,i.Y)(en,{status:"missing_payer_email",children:(0,i.Y)(ed,{})}),(0,i.Y)(en,{status:"generic_error",children:(0,i.Y)(es,{})})]}),(0,i.Y)(eo,{name:"completed",children:(0,i.Y)(_,{})}),(0,i.Y)(eo,{name:"needs_confirmation",children:(0,i.Y)(J,{})})]})]})})})})})},1805(e,t,r){r.d(t,{pr:()=>M,Mo:()=>S,L6:()=>T,bL:()=>G});var i=r(9763),o=r(6262),n=r(9701),l=r(5402),a=r(7308),s=r(7447),c=r(6600),d=r(5870),u=r(3539),p=r(869),h=r(9229),m=r(1008),g=r(6887),y=r(8342),f=r(9230),b=r(1046);let Y=e=>(0,i.Y)(f.az,{sx:[e=>({height:e.space.$2,width:"100%",borderRadius:e.radii.$md,background:e.colors.$neutralAlpha100}),e.sx]}),D=()=>(0,i.Y)(Y,{sx:e=>({height:e.space.$10,width:"100%"})}),$=e=>(0,i.Y)(f.so,{direction:"col",gap:2,children:e.children}),x=()=>(0,i.Y)(f.az,{"aria-label":"Loading...",sx:{position:"relative",minHeight:0,flex:1,overflowY:"auto"},children:(0,i.FD)(f.so,{direction:"col",gap:5,children:[(0,i.FD)($,{children:[(0,i.Y)(Y,{sx:e=>({height:e.space.$3,width:e.sizes.$24})}),(0,i.Y)(D,{})]}),(0,i.FD)(f.xA,{columns:2,gap:4,children:[(0,i.FD)($,{children:[(0,i.Y)(Y,{sx:e=>({height:e.space.$3,width:e.sizes.$20})}),(0,i.Y)(D,{})]}),(0,i.FD)($,{children:[(0,i.Y)(Y,{sx:e=>({height:e.space.$3,width:e.sizes.$24})}),(0,i.Y)(D,{})]})]}),(0,i.FD)($,{children:[(0,i.Y)(Y,{sx:e=>({height:e.space.$3,width:e.sizes.$16})}),(0,i.Y)(D,{})]}),(0,i.FD)($,{children:[(0,i.Y)(Y,{}),(0,i.Y)(Y,{}),(0,i.Y)(Y,{sx:{width:"66.666667%"}})]})]})}),[w,k]=(0,o.e3)("AddPaymentMethodRoot"),v=({children:e,checkout:t,...r})=>{var l;let a,s=(0,h.XX)(),c=(0,n.useRef)(null),{t:d}=(0,g._)(),[p,f]=(0,n.useState)(void 0),[b,Y]=(0,n.useState)(void 0),[D,$]=(0,n.useState)(void 0),x=(l=c.current,a=(0,m.KP)().parsedInternalTheme,(0,n.useMemo)(()=>{if(!l)return;let{colors:e,fontWeights:t,fontSizes:r,radii:i,space:o}=a;return{colorPrimary:(0,u.G3)(l,e.$primary500,e.$colorBackground),colorBackground:(0,u.G3)(l,e.$colorInput,e.$colorBackground),colorText:(0,u.G3)(l,e.$colorForeground,e.$colorBackground),colorTextSecondary:(0,u.G3)(l,e.$colorMutedForeground,e.$colorBackground),colorSuccess:(0,u.G3)(l,e.$success500,e.$colorBackground),colorDanger:(0,u.G3)(l,e.$danger500,e.$colorBackground),colorWarning:(0,u.G3)(l,e.$warning500,e.$colorBackground),fontWeightNormal:(0,u.yJ)(l,"font-weight",t.$normal.toString()),fontWeightMedium:(0,u.yJ)(l,"font-weight",t.$medium.toString()),fontWeightBold:(0,u.yJ)(l,"font-weight",t.$bold.toString()),fontSizeXl:(0,u.yJ)(l,"font-size",r.$xl),fontSizeLg:(0,u.yJ)(l,"font-size",r.$lg),fontSizeSm:(0,u.yJ)(l,"font-size",r.$md),fontSizeXs:(0,u.yJ)(l,"font-size",r.$sm),borderRadius:(0,u.yJ)(l,"border-radius",i.$lg),spacingUnit:(0,u.yJ)(l,"padding",o.$1)}},[a,l]));return(0,i.FD)(w.Provider,{value:{value:{headerTitle:p,headerSubtitle:b,submitLabel:D,setHeaderTitle:f,setHeaderSubtitle:Y,setSubmitLabel:$,checkout:t,...r}},children:[(0,i.Y)("div",{ref:c,style:{display:"none"}}),(0,i.Y)(o.Tn,{checkout:t,for:s,stripeAppearance:x,paymentDescription:d((0,y.G)(t?.planPeriod==="month"?"billing.paymentMethod.applePayDescription.monthly":"billing.paymentMethod.applePayDescription.annual")),children:e})]})},_=e=>{let{isProviderReady:t}=(0,o.Jl)();return t?null:e.children},F=e=>{let{isProviderReady:t}=(0,o.Jl)();return t?(0,i.Y)(i.FK,{children:e.children}):null},G=e=>{let{children:t,...r}=e;return(0,i.FD)(v,{...r,children:[(0,i.Y)(_,{children:(0,i.Y)(f.so,{direction:"row",align:"center",justify:"center",sx:e=>({width:"100%",minHeight:e.sizes.$60}),children:(0,i.Y)(f.y$,{size:"lg",colorScheme:"primary",elementDescriptor:b.$z.spinner})})}),(0,i.Y)(F,{children:(0,i.Y)(R,{children:t})})]})},z=(e,t)=>{(0,n.useRef)(()=>{t(e)}),(0,n.useEffect)(()=>{t(e)},[e,t])},S=({text:e})=>{let{setHeaderTitle:t}=k();return z(e,t),null},T=({text:e})=>{let{setHeaderSubtitle:t}=k();return z(e,t),null},M=({text:e})=>{let{setSubmitLabel:t}=k();return z(e,t),null},R=({children:e})=>{let{headerTitle:t,headerSubtitle:r,submitLabel:n,checkout:u,onSuccess:m,cancelAction:g}=k(),f=(0,a.f0)(),b=(0,h.N7)(),{isFormReady:Y,submit:D,reset:$}=(0,o.Jl)(),w=async e=>{e.preventDefault(),f.setLoading(),f.setError(void 0);let{data:t,error:r}=await D();if(r){f.setIdle(),"validation_error"!==r.error.type&&f.setError(r.error.message);return}try{await m(t)}catch(e){(0,p.H4)(e,[],f.setError)}finally{f.setIdle(),$()}};return(0,i.Y)(d.M,{headerTitle:t,headerSubtitle:r,children:(0,i.FD)(s.l.Root,{onSubmit:w,sx:e=>({display:"flex",flexDirection:"column",rowGap:e.space.$3}),children:[e,(0,i.Y)(o.cl,{fallback:(0,i.Y)(x,{})}),(0,i.Y)(l.Z.Alert,{children:f.error}),(0,i.Y)(c.G,{isDisabled:!Y,submitLabel:n??(0,y.G)(`${b}.billingPage.paymentMethodsSection.formButtonPrimary__add`),onReset:g,hideReset:!g,sx:{flex:u?1:void 0}})]})})}},6858(e,t,r){var i=r(9763),o=r(9230),n=r(1046),l=r(8342),a=r(9616),s=r(1538);r.d(t,{},{O:({paymentMethod:e})=>(0,i.FD)(o.so,{sx:{overflow:"hidden"},gap:2,align:"baseline",elementDescriptor:n.$z.paymentMethodRow,children:[(0,i.Y)(o.In,{icon:"card"===e.paymentType?a.A:s.A,sx:e=>({alignSelf:"center",color:e.colors.$colorMutedForeground}),elementDescriptor:n.$z.paymentMethodRowIcon}),(0,i.Y)(o.EY,{sx:e=>({color:e.colors.$colorForeground,textTransform:"capitalize"}),truncate:!0,elementDescriptor:n.$z.paymentMethodRowType,children:"card"===e.paymentType?e.cardType:e.paymentType}),(0,i.Y)(o.EY,{sx:e=>({color:e.colors.$colorMutedForeground}),variant:"caption",truncate:!0,elementDescriptor:n.$z.paymentMethodRowValue,children:"card"===e.paymentType?`⋯ ${e.last4}`:null}),e.isDefault&&(0,i.Y)(o.Ex,{elementDescriptor:n.$z.paymentMethodRowBadge,elementId:n.$z.paymentMethodRowBadge.setId("default"),localizationKey:(0,l.G)("badge__default")}),"expired"===e.status&&(0,i.Y)(o.Ex,{elementDescriptor:n.$z.paymentMethodRowBadge,elementId:n.$z.paymentMethodRowBadge.setId("expired"),colorScheme:"danger",localizationKey:(0,l.G)("badge__expired")})]})})},5760(e,t,r){var i=r(9763),o=r(9230),n=r(8342);let l={active:"badge__activePlan",upcoming:"badge__upcomingPlan",past_due:"badge__pastDuePlan",free_trial:"badge__freeTrial"},a={active:"secondary",upcoming:"primary",past_due:"warning",free_trial:"secondary"};r.d(t,{},{V:({subscription:e,elementDescriptor:t})=>(0,i.Y)(o.Ex,{elementDescriptor:t,colorScheme:a[e.status],localizationKey:(0,n.G)(l[e.status])})})}}]);
+            `})]}),(0,i.FD)(m.L9,{sx:e=>({margin:"auto",gridArea:"1/1",position:"relative",textAlign:"center",transform:`translateY(${e.space.$20})`}),children:[(0,i.Y)(m.DZ,{elementDescriptor:f.$z.checkoutSuccessTitle,as:"h2",textVariant:"h2",localizationKey:p?(0,h.G)("billing.checkout.title__trialSuccess"):l.totalDueNow&&l.totalDueNow.amount>0?(0,h.G)("billing.checkout.title__paymentSuccessful"):(0,h.G)("billing.checkout.title__subscriptionSuccessful"),sx:e=>({opacity:0,animationName:"slideUp",animationDuration:`${D.wz.slowest}ms`,animationTimingFunction:D._8.bezier,animationFillMode:"forwards",color:e.colors.$colorForeground,"@keyframes slideUp":{"0%":{transform:"translateY(30px)",opacity:0},"100%":{transform:"translateY(0)",opacity:1}},...!S&&{opacity:1,animation:"none"}})}),(0,i.Y)(m.EY,{elementDescriptor:f.$z.checkoutSuccessDescription,colorScheme:"secondary",sx:e=>({textAlign:"center",paddingInline:e.space.$8,marginBlockStart:e.space.$2,opacity:0,animationName:"slideUp",animationDuration:`${1.5*D.wz.slowest}ms`,animationTimingFunction:D._8.bezier,animationFillMode:"forwards","@keyframes slideUp":{"0%":{transform:"translateY(30px)",opacity:0},"100%":{transform:"translateY(0)",opacity:1}},...!S&&{opacity:1,animation:"none"}}),localizationKey:l.totalDueNow&&l.totalDueNow.amount>0?(0,h.G)("billing.checkout.description__paymentSuccessful"):(0,h.G)("billing.checkout.description__subscriptionSuccessful")})]})]})}),(0,i.FD)(o.Drawer.Footer,{sx:e=>({rowGap:e.space.$4,animationName:"footerSlideInUp",animationDuration:`${D.wz.drawer}ms`,animationTimingFunction:D._8.bezier,"@keyframes footerSlideInUp":{"0%":{transform:"translateY(100%)",opacity:0},"100%":{transform:"translateY(0)",opacity:1}},...!S&&{animation:"none"}}),children:[(0,i.FD)(g.p.Root,{children:[l.totalDueNow?(0,i.FD)(g.p.Group,{variant:"secondary",children:[(0,i.Y)(g.p.Title,{title:(0,h.G)("billing.checkout.lineItems.title__totalPaid")}),(0,i.Y)(g.p.Description,{text:F(l.totalDueNow)})]}):null,p?(0,i.FD)(g.p.Group,{variant:"secondary",children:[(0,i.Y)(g.p.Title,{title:(0,h.G)("billing.checkout.lineItems.title__freeTrialEndsAt")}),(0,i.Y)(g.p.Description,{text:(0,y.Y)(p)})]}):null,(0,i.FD)(g.p.Group,{variant:"secondary",children:[(0,i.Y)(g.p.Title,{title:l.totalDueNow&&l.totalDueNow.amount>0||null!==p?(0,h.G)("billing.checkout.lineItems.title__paymentMethod"):(0,h.G)("billing.checkout.lineItems.title__subscriptionBegins")}),(0,i.Y)(g.p.Description,{text:l.totalDueNow&&l.totalDueNow.amount>0||null!==p?c?"card"!==c.paymentType?c.paymentType?`${w(c.paymentType)}`:"–":c.cardType?`${w(c.cardType)} ⋯ ${c.last4}`:"–":"–":d?(0,y.Y)(new Date(d)):"–"})]})]}),(0,i.Y)(m.$n,{onClick:()=>{r&&e.navigate(r),t&&t(!1)},localizationKey:(0,h.G)("formButtonPrimary")})]})]}):null};var F=r(5402),G=r(7308),z=r(2117),S=r(2386),T=r(3919),M=r(5880),R=r(8472),C=r(49),P=r(869),B=r(6574),I=r(2861),A=r(2445),N=r(5848),E=r(1805),L=r(6858),W=r(5760);let K=e=>e[0].toUpperCase()+e.slice(1),U="payment_method_id",J=(0,G.dm)(()=>{let{checkout:e}=(0,a.v$)(),{$:t}=(0,b._)(),{plan:r,totals:n,isImmediatePlanChange:l,planPeriod:s,freeTrialEndsAt:c}=e;if(!r)return null;let d=!!n.credits?.proration?.amount&&n.credits.proration.amount.amount>0,u=!!n.credits?.payer?.appliedAmount&&n.credits.payer.appliedAmount.amount>0,p=!!n.pastDue?.amount&&n.pastDue.amount>0,y=!!n.discounts?.proration?.amount&&n.discounts.proration.amount.amount>0,Y=!!n.totalsDuePerPeriod&&n.totalDueNow&&n.totalsDuePerPeriod.grandTotal.amount!==n.totalDueNow.amount,D=(0,C.cm)(n),$=(0,C.xe)(D),x=(0,C.F1)(D),w=[];"annual"===s&&w.push((0,h.G)("billing.billedAnnually")),$&&null!==$.quantity&&w.push((0,h.G)("billing.pricingTable.seatCost.includedSeats",{includedSeats:$.quantity}));let k=(0,C.V4)(r);return k&&1===k.tiers.length&&0===k.tiers[0].feePerBlock.amount&&w.push(k.tiers[0].endsAfterBlock?(0,h.G)("billing.pricingTable.seatCost.upToSeats",{endsAfterBlock:k.tiers[0].endsAfterBlock}):(0,h.G)("billing.pricingTable.seatCost.unlimitedSeats")),(0,i.FD)(o.Drawer.Body,{children:[(0,i.Y)(m.az,{elementDescriptor:f.$z.checkoutFormLineItemsRoot,sx:e=>({padding:e.space.$4,borderBottomWidth:e.borderWidths.$normal,borderBottomStyle:e.borderStyles.$solid,borderBottomColor:e.colors.$borderAlpha100}),children:(0,i.FD)(g.p.Root,{children:[(0,i.FD)(g.p.Group,{children:[(0,i.Y)(g.p.Title,{title:r.name,description:w,badge:r.freeTrialEnabled&&c?(0,i.Y)(W.V,{subscription:{status:"free_trial"}}):null}),n.baseFee?(0,i.Y)(g.p.Description,{prefix:"annual"===s?"x12":void 0,text:t(n.baseFee),suffix:(0,h.G)("billing.checkout.perMonth")}):null]}),x&&null!==x.quantity&&(0,i.FD)(g.p.Group,{borderTop:!0,children:[(0,i.Y)(g.p.Title,{title:(0,h.G)("billing.seats")}),(0,i.Y)(g.p.Description,{prefix:`${x.quantity} x`,text:t(x.feePerBlock),suffix:(0,h.G)("billing.checkout.perMonth")})]}),y&&(0,i.FD)(g.p.Group,{variant:"tertiary",children:[(0,i.Y)(g.p.Title,{title:(0,h.G)("billing.proratedDiscount")}),(0,i.Y)(g.p.Description,{text:n.discounts?.proration?.amount?t((0,R.h)(n.discounts.proration.amount)):""})]}),d&&(0,i.FD)(g.p.Group,{variant:"tertiary",children:[(0,i.Y)(g.p.Title,{title:(0,h.G)("billing.creditRemainder")}),(0,i.Y)(g.p.Description,{text:n.credits?.proration?.amount?t((0,R.h)(n.credits.proration.amount)):""})]}),u&&(0,i.FD)(g.p.Group,{variant:"tertiary",children:[(0,i.Y)(g.p.Title,{title:(0,h.G)("billing.payerCreditRemainder")}),(0,i.Y)(g.p.Description,{text:n.credits?.payer?.appliedAmount?t((0,R.h)(n.credits.payer.appliedAmount)):""})]}),p&&(0,i.FD)(g.p.Group,{variant:"tertiary",children:[(0,i.FD)(M.m_.Root,{children:[(0,i.Y)(M.m_.Trigger,{children:(0,i.Y)(g.p.Title,{title:(0,h.G)("billing.pastDue"),icon:A.A})}),(0,i.Y)(M.m_.Content,{text:(0,h.G)("billing.checkout.pastDueNotice")})]}),(0,i.Y)(g.p.Description,{text:n.pastDue?t(n.pastDue):""})]}),c&&r.freeTrialDays&&n.totalDueAfterFreeTrial?(0,i.FD)(g.p.Group,{variant:"tertiary",children:[(0,i.Y)(g.p.Title,{title:(0,h.G)("billing.checkout.totalDueAfterTrial",{days:r.freeTrialDays})}),(0,i.Y)(g.p.Description,{text:t(n.totalDueAfterFreeTrial)})]}):Y?null:n.totalDuePerPeriod?(0,i.FD)(g.p.Group,{borderTop:!0,variant:"tertiary",children:[(0,i.Y)(g.p.Title,{title:(0,h.G)("billing.checkout.totalDuePerPeriod")}),(0,i.Y)(g.p.Description,{text:t(n.totalDuePerPeriod)})]}):null,n.totalDueNow?(0,i.FD)(g.p.Group,{borderTop:!0,children:[(0,i.Y)(g.p.Title,{title:(0,h.G)("billing.totalDueToday")}),(0,i.Y)(g.p.Description,{text:t(n.totalDueNow)})]}):null,Y&&(0,i.FD)(g.p.Group,{borderTop:!0,children:[(0,i.Y)(g.p.Title,{title:(0,h.G)("billing.totalDuePerPeriod")}),(0,i.Y)(g.p.Description,{text:n.totalsDuePerPeriod?t(n.totalsDuePerPeriod.grandTotal):""})]})]})}),!l&&(0,i.Y)(m.az,{elementDescriptor:f.$z.checkoutFormLineItemsRoot,sx:e=>({paddingBlockStart:e.space.$4,paddingInline:e.space.$4}),children:(0,i.Y)(m.EY,{localizationKey:(0,h.G)("billing.checkout.downgradeNotice"),variant:"caption",colorScheme:"secondary"})}),(0,i.Y)(V,{})]})}),O=()=>{let{onSubscriptionComplete:e}=u(),{checkout:t}=(0,a.v$)(),r=(0,G.f0)();if("needs_confirmation"!==t.status)throw Error("Checkout not found");let i=async i=>{r.setLoading(),r.setError(void 0);let{error:o}=await t.confirm(i);o?(0,P.H4)(o,[],r.setError):e?.(),r.setIdle()};return{payWithExistingPaymentMethod:e=>(e.preventDefault(),i({paymentMethodId:new FormData(e.currentTarget).get(U)})),addPaymentMethodAndPay:e=>i(e),payWithTestCard:()=>i({gateway:"stripe",useTestCard:!0}),payWithoutPaymentMethod:e=>(e.preventDefault(),i({}))}},V=()=>{let{checkout:e}=(0,a.v$)(),{plan:t}=e,{isLoading:r}=(0,I.mu)();return t?r?(0,i.Y)(m.y$,{sx:{margin:"auto"}}):(0,i.Y)(j,{}):null},j=()=>{let{checkout:e}=(0,a.v$)(),{plan:t,isImmediatePlanChange:r,needsPaymentMethod:o}=e,{data:n}=(0,I.mu)(),[l,c]=(0,s.useState)(()=>n.length>0?"existing":"new");return t?(0,i.FD)(m.fv,{elementDescriptor:f.$z.checkoutFormElementsRoot,gap:4,sx:e=>({padding:e.space.$4}),children:[(0,i.Y)(i.FK,{children:n.length>0&&r&&o&&(0,i.FD)(S.I.Root,{"aria-label":"Payment method source",value:l,onChange:e=>c(e),size:"lg",fullWidth:!0,children:[(0,i.Y)(S.I.Button,{value:"existing",text:(0,h.G)("billing.paymentMethods__label")}),(0,i.Y)(S.I.Button,{value:"new",text:(0,h.G)("billing.addPaymentMethod__label")})]})}),o?"existing"===l?(0,i.Y)(et,{paymentMethods:n}):"new"===l&&(0,i.Y)(Z,{}):(0,i.Y)(X,{})]}):null},q=()=>{let{isLoading:e}=(0,G.f0)(),{payWithTestCard:t}=O();return(0,i.FD)(m.az,{sx:e=>({background:e.colors.$neutralAlpha50,padding:e.space.$2x5,borderRadius:e.radii.$md,borderWidth:e.borderWidths.$normal,borderStyle:e.borderStyles.$solid,borderColor:e.colors.$borderAlpha100,display:"flex",flexDirection:"column",rowGap:e.space.$2,position:"relative",overflow:"hidden"}),children:[(0,i.Y)(z.$,{}),(0,i.FD)(m.so,{sx:e=>({alignItems:"center",justifyContent:"center",flexDirection:"column",rowGap:e.space.$2}),children:[(0,i.Y)(m.EY,{sx:e=>({color:e.colors.$warning500,fontWeight:e.fontWeights.$semibold}),localizationKey:(0,h.G)("billing.paymentMethod.dev.developmentMode")}),(0,i.Y)(m.$n,{type:"button",block:!0,variant:"bordered",localizationKey:(0,h.G)("userProfile.billingPage.paymentMethodsSection.payWithTestCardButton"),colorScheme:"secondary",isLoading:e,onClick:t})]})]})},H=()=>{let{checkout:e}=(0,a.v$)(),{seatsQuantity:t}=u(),{$:r}=(0,b._)(),{status:i,freeTrialEndsAt:o,totals:n}=e;if("needs_initialization"===i)throw Error("Clerk: Invalid state");return o?t&&n.totalDueNow?(0,h.G)("billing.pay",{amount:r(n.totalDueNow)}):(0,h.G)("billing.startFreeTrial"):n.totalDueNow&&n.totalDueNow.amount>0?(0,h.G)("billing.pay",{amount:r(n.totalDueNow)}):(0,h.G)("billing.subscribe")},X=(0,G.dm)(()=>{let{for:e}=u(),{payWithoutPaymentMethod:t}=O(),r=(0,G.f0)();return(0,i.FD)(m.lV,{onSubmit:t,sx:ee,children:[(0,i.Y)(F.Z.Alert,{children:r.error}),(0,i.Y)(Q,{})]})}),Z=(0,G.dm)(()=>{let{addPaymentMethodAndPay:e}=O(),t=H(),{checkout:r}=(0,a.v$)();return(0,i.FD)(E.bL,{onSuccess:e,checkout:r,children:[(0,i.Y)(B.W,{children:(0,i.Y)(q,{})}),(0,i.Y)(E.pr,{text:t})]})}),Q=e=>{let t=(0,G.f0)(),r=H();return(0,i.Y)(m.$n,{type:"submit",colorScheme:"primary",size:"sm",textVariant:"buttonLarge",sx:{width:"100%"},isLoading:t.isLoading,localizationKey:r,...e})},ee=e=>({display:"flex",flexDirection:"column",rowGap:e.space.$4}),et=(0,G.dm)(({paymentMethods:e})=>{let{checkout:t}=(0,a.v$)(),{paymentMethod:r,isImmediatePlanChange:o,needsPaymentMethod:n}=t,{payWithExistingPaymentMethod:l}=O(),c=(0,G.f0)(),[d,u]=(0,s.useState)(r||e.find(e=>e.isDefault)),p=(0,s.useMemo)(()=>e.map(e=>{let t="card"!==e.paymentType?e.paymentType?`${K(e.paymentType)}`:"–":e.cardType?`${K(e.cardType)} ⋯ ${e.last4}`:"–";return{value:e.id,label:t}}),[e]);return(0,i.FD)(m.lV,{onSubmit:l,sx:ee,children:[o&&n?(0,i.FD)(T.l6,{elementId:"paymentMethod",options:p,value:d?.id||null,onChange:t=>{u(e.find(e=>e.id===t.value))},portal:!0,children:[(0,i.Y)("input",{name:U,type:"hidden",value:d?.id}),(0,i.Y)(T.JC,{icon:N.A,sx:e=>({justifyContent:"space-between",backgroundColor:e.colors.$colorBackground}),children:d&&(0,i.Y)(L.O,{paymentMethod:d})}),(0,i.Y)(T.UL,{sx:e=>({paddingBlock:e.space.$1,color:e.colors.$colorForeground})})]}):(0,i.Y)("input",{name:U,type:"hidden",value:d?.id}),(0,i.Y)(F.Z.Alert,{children:c.error}),(0,i.Y)(Q,{})]})}),er=()=>{let{checkout:e}=(0,a.v$)();return(0,s.useEffect)(()=>{e.start()},[e]),null},ei=({children:e})=>{let{planId:t,planPeriod:r,for:o,seatsQuantity:n,priceId:l}=u();return(0,i.FD)(a.Rx,{for:o,planId:t,planPeriod:r,seatsQuantity:n,priceId:l,children:[(0,i.Y)(er,{}),e]})},eo=({children:e,name:t})=>{let{checkout:r}=(0,a.v$)();return r.status!==t?null:e},en=({children:e,status:t})=>{let{errors:r,fetchStatus:i}=(0,a.v$)();return(0,s.useMemo)(()=>{if(r.global){let e=r.global.flatMap(e=>{if(e.isClerkAPIResponseError())return e.errors.map(e=>e.code)});return e.includes("missing_payer_email")?"missing_payer_email":e.includes("invalid_plan_change")?"invalid_plan_change":"generic_error"}return i},[i])!==t?null:e};var el=r(395),ea=r(2534);let es=()=>{let{errors:e}=(0,a.v$)(),{translateError:t}=(0,b._)(),{t:r}=(0,b._)();return(0,i.Y)(o.Drawer.Body,{children:(0,i.Y)(m.so,{align:"center",justify:"center",sx:e=>({height:"100%",padding:e.space.$4,fontSize:e.fontSizes.$md}),children:(0,i.Y)(el.F,{variant:"danger",colorScheme:"danger",children:e.global?t(e.global[0]):r((0,h.G)("unstable__errors.form_param_value_invalid"))})})})},ec=()=>{let{planPeriod:e}=u(),{errors:t}=(0,a.v$)(),r=t?.global?.filter(e=>e.isClerkAPIResponseError()).flatMap(e=>e.errors).find(e=>"invalid_plan_change"===e.code);if(!r)return null;let{plan:n,isPlanUpgradePossible:l}=r?.meta||{};return(0,i.Y)(o.Drawer.Body,{children:(0,i.FD)(m.so,{gap:4,direction:"col",children:[(0,i.Y)(m.az,{elementDescriptor:f.$z.checkoutFormLineItemsRoot,sx:e=>({padding:e.space.$4,borderBottomWidth:e.borderWidths.$normal,borderBottomStyle:e.borderStyles.$solid,borderBottomColor:e.colors.$borderAlpha100}),children:(0,i.Y)(g.p.Root,{children:(0,i.FD)(g.p.Group,{children:[(0,i.Y)(g.p.Title,{title:n.name,description:"annual"===e?(0,h.G)("billing.billedAnnually"):void 0}),(0,i.Y)(g.p.Description,{prefix:"annual"===e?"x12":void 0,text:`${n.currency_symbol}${"month"===e?n.amount_formatted:n.annual_monthly_amount_formatted}`,suffix:(0,h.G)("billing.checkout.perMonth")})]})})}),(0,i.Y)(m.az,{sx:e=>({padding:e.space.$4}),children:(0,i.Y)(el.F,{variant:"info",colorScheme:"info",title:l?(0,h.G)("billing.cannotSubscribeMonthly"):(0,h.G)("billing.cannotSubscribeUnrecoverable")})})]})})},ed=()=>{let{checkout:e}=(0,a.v$)(),{setIsOpen:t}=(0,o.g)();return(0,i.Y)(o.Drawer.Body,{children:(0,i.Y)(m.az,{sx:e=>({padding:e.space.$4}),children:(0,i.Y)(ea.v,{title:(0,h.G)("billing.checkout.emailForm.title"),subtitle:(0,h.G)("billing.checkout.emailForm.subtitle"),onSuccess:()=>void e.start(),onReset:()=>t(!1),disableAutoFocus:!0})})})},eu=e=>(0,i.Y)(p.n.Root,{flow:"checkout",children:(0,i.Y)(p.n.Part,{children:(0,i.Y)(n.m$.Provider,{value:e.for||"user",children:(0,i.Y)(d.Provider,{value:{componentName:"Checkout",...e},children:(0,i.FD)(o.Drawer.Content,{children:[(0,i.Y)(o.Drawer.Header,{title:(0,h.G)("billing.checkout.title")}),(0,i.FD)(ei,{children:[(0,i.FD)(eo,{name:"needs_initialization",children:[(0,i.Y)(en,{status:"fetching",children:(0,i.Y)(m.y$,{sx:{margin:"auto"}})}),(0,i.Y)(en,{status:"invalid_plan_change",children:(0,i.Y)(ec,{})}),(0,i.Y)(en,{status:"missing_payer_email",children:(0,i.Y)(ed,{})}),(0,i.Y)(en,{status:"generic_error",children:(0,i.Y)(es,{})})]}),(0,i.Y)(eo,{name:"completed",children:(0,i.Y)(_,{})}),(0,i.Y)(eo,{name:"needs_confirmation",children:(0,i.Y)(J,{})})]})]})})})})})},1805(e,t,r){r.d(t,{pr:()=>M,Mo:()=>S,L6:()=>T,bL:()=>G});var i=r(9763),o=r(6262),n=r(9701),l=r(5402),a=r(7308),s=r(7447),c=r(6600),d=r(5870),u=r(3539),p=r(869),h=r(9229),m=r(1008),g=r(6887),y=r(8342),f=r(9230),b=r(1046);let Y=e=>(0,i.Y)(f.az,{sx:[e=>({height:e.space.$2,width:"100%",borderRadius:e.radii.$md,background:e.colors.$neutralAlpha100}),e.sx]}),D=()=>(0,i.Y)(Y,{sx:e=>({height:e.space.$10,width:"100%"})}),$=e=>(0,i.Y)(f.so,{direction:"col",gap:2,children:e.children}),x=()=>(0,i.Y)(f.az,{"aria-label":"Loading...",sx:{position:"relative",minHeight:0,flex:1,overflowY:"auto"},children:(0,i.FD)(f.so,{direction:"col",gap:5,children:[(0,i.FD)($,{children:[(0,i.Y)(Y,{sx:e=>({height:e.space.$3,width:e.sizes.$24})}),(0,i.Y)(D,{})]}),(0,i.FD)(f.xA,{columns:2,gap:4,children:[(0,i.FD)($,{children:[(0,i.Y)(Y,{sx:e=>({height:e.space.$3,width:e.sizes.$20})}),(0,i.Y)(D,{})]}),(0,i.FD)($,{children:[(0,i.Y)(Y,{sx:e=>({height:e.space.$3,width:e.sizes.$24})}),(0,i.Y)(D,{})]})]}),(0,i.FD)($,{children:[(0,i.Y)(Y,{sx:e=>({height:e.space.$3,width:e.sizes.$16})}),(0,i.Y)(D,{})]}),(0,i.FD)($,{children:[(0,i.Y)(Y,{}),(0,i.Y)(Y,{}),(0,i.Y)(Y,{sx:{width:"66.666667%"}})]})]})}),[w,k]=(0,o.e3)("AddPaymentMethodRoot"),v=({children:e,checkout:t,...r})=>{var l;let a,s=(0,h.XX)(),c=(0,n.useRef)(null),{t:d}=(0,g._)(),[p,f]=(0,n.useState)(void 0),[b,Y]=(0,n.useState)(void 0),[D,$]=(0,n.useState)(void 0),x=(l=c.current,a=(0,m.KP)().parsedInternalTheme,(0,n.useMemo)(()=>{if(!l)return;let{colors:e,fontWeights:t,fontSizes:r,radii:i,space:o}=a;return{colorPrimary:(0,u.G3)(l,e.$primary500,e.$colorBackground),colorBackground:(0,u.G3)(l,e.$colorInput,e.$colorBackground),colorText:(0,u.G3)(l,e.$colorForeground,e.$colorBackground),colorTextSecondary:(0,u.G3)(l,e.$colorMutedForeground,e.$colorBackground),colorSuccess:(0,u.G3)(l,e.$success500,e.$colorBackground),colorDanger:(0,u.G3)(l,e.$danger500,e.$colorBackground),colorWarning:(0,u.G3)(l,e.$warning500,e.$colorBackground),fontWeightNormal:(0,u.yJ)(l,"font-weight",t.$normal.toString()),fontWeightMedium:(0,u.yJ)(l,"font-weight",t.$medium.toString()),fontWeightBold:(0,u.yJ)(l,"font-weight",t.$bold.toString()),fontSizeXl:(0,u.yJ)(l,"font-size",r.$xl),fontSizeLg:(0,u.yJ)(l,"font-size",r.$lg),fontSizeSm:(0,u.yJ)(l,"font-size",r.$md),fontSizeXs:(0,u.yJ)(l,"font-size",r.$sm),borderRadius:(0,u.yJ)(l,"border-radius",i.$lg),spacingUnit:(0,u.yJ)(l,"padding",o.$1)}},[a,l]));return(0,i.FD)(w.Provider,{value:{value:{headerTitle:p,headerSubtitle:b,submitLabel:D,setHeaderTitle:f,setHeaderSubtitle:Y,setSubmitLabel:$,checkout:t,...r}},children:[(0,i.Y)("div",{ref:c,style:{display:"none"}}),(0,i.Y)(o.Tn,{checkout:t,for:s,stripeAppearance:x,paymentDescription:d((0,y.G)(t?.planPeriod==="month"?"billing.paymentMethod.applePayDescription.monthly":"billing.paymentMethod.applePayDescription.annual")),children:e})]})},_=e=>{let{isProviderReady:t}=(0,o.Jl)();return t?null:e.children},F=e=>{let{isProviderReady:t}=(0,o.Jl)();return t?(0,i.Y)(i.FK,{children:e.children}):null},G=e=>{let{children:t,...r}=e;return(0,i.FD)(v,{...r,children:[(0,i.Y)(_,{children:(0,i.Y)(f.so,{direction:"row",align:"center",justify:"center",sx:e=>({width:"100%",minHeight:e.sizes.$60}),children:(0,i.Y)(f.y$,{size:"lg",colorScheme:"primary",elementDescriptor:b.$z.spinner})})}),(0,i.Y)(F,{children:(0,i.Y)(R,{children:t})})]})},z=(e,t)=>{(0,n.useRef)(()=>{t(e)}),(0,n.useEffect)(()=>{t(e)},[e,t])},S=({text:e})=>{let{setHeaderTitle:t}=k();return z(e,t),null},T=({text:e})=>{let{setHeaderSubtitle:t}=k();return z(e,t),null},M=({text:e})=>{let{setSubmitLabel:t}=k();return z(e,t),null},R=({children:e})=>{let{headerTitle:t,headerSubtitle:r,submitLabel:n,checkout:u,onSuccess:m,cancelAction:g}=k(),f=(0,a.f0)(),b=(0,h.N7)(),{isFormReady:Y,submit:D,reset:$}=(0,o.Jl)(),w=async e=>{e.preventDefault(),f.setLoading(),f.setError(void 0);let{data:t,error:r}=await D();if(r){f.setIdle(),"validation_error"!==r.error.type&&f.setError(r.error.message);return}try{await m(t)}catch(e){(0,p.H4)(e,[],f.setError)}finally{f.setIdle(),$()}};return(0,i.Y)(d.M,{headerTitle:t,headerSubtitle:r,children:(0,i.FD)(s.l.Root,{onSubmit:w,sx:e=>({display:"flex",flexDirection:"column",rowGap:e.space.$3}),children:[e,(0,i.Y)(o.cl,{fallback:(0,i.Y)(x,{})}),(0,i.Y)(l.Z.Alert,{children:f.error}),(0,i.Y)(c.G,{isDisabled:!Y,submitLabel:n??(0,y.G)(`${b}.billingPage.paymentMethodsSection.formButtonPrimary__add`),onReset:g,hideReset:!g,sx:{flex:u?1:void 0}})]})})}},6858(e,t,r){var i=r(9763),o=r(9230),n=r(1046),l=r(8342),a=r(9616),s=r(1538);r.d(t,{},{O:({paymentMethod:e})=>(0,i.FD)(o.so,{sx:{overflow:"hidden"},gap:2,align:"baseline",elementDescriptor:n.$z.paymentMethodRow,children:[(0,i.Y)(o.In,{icon:"card"===e.paymentType?a.A:s.A,sx:e=>({alignSelf:"center",color:e.colors.$colorMutedForeground}),elementDescriptor:n.$z.paymentMethodRowIcon}),(0,i.Y)(o.EY,{sx:e=>({color:e.colors.$colorForeground,textTransform:"capitalize"}),truncate:!0,elementDescriptor:n.$z.paymentMethodRowType,children:"card"===e.paymentType?e.cardType:e.paymentType}),(0,i.Y)(o.EY,{sx:e=>({color:e.colors.$colorMutedForeground}),variant:"caption",truncate:!0,elementDescriptor:n.$z.paymentMethodRowValue,children:"card"===e.paymentType?`⋯ ${e.last4}`:null}),e.isDefault&&(0,i.Y)(o.Ex,{elementDescriptor:n.$z.paymentMethodRowBadge,elementId:n.$z.paymentMethodRowBadge.setId("default"),localizationKey:(0,l.G)("badge__default")}),"expired"===e.status&&(0,i.Y)(o.Ex,{elementDescriptor:n.$z.paymentMethodRowBadge,elementId:n.$z.paymentMethodRowBadge.setId("expired"),colorScheme:"danger",localizationKey:(0,l.G)("badge__expired")})]})})},5760(e,t,r){var i=r(9763),o=r(9230),n=r(8342);let l={active:"badge__activePlan",upcoming:"badge__upcomingPlan",past_due:"badge__pastDuePlan",free_trial:"badge__freeTrial"},a={active:"secondary",upcoming:"primary",past_due:"warning",free_trial:"secondary"};r.d(t,{},{V:({subscription:e,elementDescriptor:t})=>(0,i.Y)(o.Ex,{elementDescriptor:t,colorScheme:a[e.status],localizationKey:(0,n.G)(l[e.status])})})}}]);

package/dist/components/AccountCredits/AccountCredits.js.map

@@ -1 +1 @@
-{"version":3,"file":"AccountCredits.js","names":[],"sources":["../../../src/components/AccountCredits/AccountCredits.tsx"],"sourcesContent":["import { ProfileSection } from '@/ui/elements/Section';\nimport { useCreditBalance, useSubscriberTypeLocalizationRoot } from '../../contexts';\nimport { localizationKeys, Text, useLocalizations } from '../../customizables';\nimport { useRouter } from '../../router';\n\nexport const AccountCredits = () => {\n  const { data: creditBalance, isLoading } = useCreditBalance();\n  const localizationRoot = useSubscriberTypeLocalizationRoot();\n  const { navigate } = useRouter();\n  const { $ } = useLocalizations();\n\n  // Only show if balance is not null\n  if (!creditBalance?.balance || isLoading) {\n    return null;\n  }\n\n  return (\n    <ProfileSection.Root\n      title={localizationKeys(`${localizationRoot}.billingPage.accountCreditsSection.title`)}\n      centered={false}\n      id='accountCredits'\n      sx={t => ({\n        borderTopWidth: t.borderWidths.$normal,\n        borderTopStyle: t.borderStyles.$solid,\n        borderTopColor: t.colors.$borderAlpha100,\n      })}\n    >\n      <ProfileSection.ItemList\n        id='accountCredits'\n        disableAnimation\n      >\n        <ProfileSection.Item id='accountCredits'>\n          <Text variant='subtitle'>{$(creditBalance.balance)}</Text>\n        </ProfileSection.Item>\n        <ProfileSection.Button\n          id='accountCredits'\n          localizationKey={localizationKeys(`${localizationRoot}.billingPage.accountCreditsSection.viewHistory`)}\n          sx={[t => ({ justifyContent: 'start', height: t.sizes.$8 })]}\n          onClick={() => void navigate('credit-history')}\n        />\n      </ProfileSection.ItemList>\n    </ProfileSection.Root>\n  );\n};\n"],"mappings":";;;;;;;;;;AAKA,MAAa,uBAAuB;CAClC,MAAM,EAAE,MAAM,eAAe,cAAc,iBAAiB;CAC5D,MAAM,mBAAmB,kCAAkC;CAC3D,MAAM,EAAE,aAAa,UAAU;CAC/B,MAAM,EAAE,MAAM,iBAAiB;CAG/B,IAAI,CAAC,eAAe,WAAW,WAC7B,OAAO;CAGT,OACE,oBAAC,eAAe,MAAhB;EACE,OAAO,iBAAiB,GAAG,iBAAiB,yCAAyC;EACrF,UAAU;EACV,IAAG;EACH,KAAI,OAAM;GACR,gBAAgB,EAAE,aAAa;GAC/B,gBAAgB,EAAE,aAAa;GAC/B,gBAAgB,EAAE,OAAO;EAC3B;YAEA,qBAAC,eAAe,UAAhB;GACE,IAAG;GACH;aAFF,CAIE,oBAAC,eAAe,MAAhB;IAAqB,IAAG;cACtB,oBAAC,MAAD;KAAM,SAAQ;eAAY,EAAE,cAAc,OAAO;IAAQ;GACtC,IACrB,oBAAC,eAAe,QAAhB;IACE,IAAG;IACH,iBAAiB,iBAAiB,GAAG,iBAAiB,+CAA+C;IACrG,IAAI,EAAC,OAAM;KAAE,gBAAgB;KAAS,QAAQ,EAAE,MAAM;IAAG,EAAE;IAC3D,eAAe,KAAK,SAAS,gBAAgB;GAC9C,EACsB;;CACN;AAEzB"}
+{"version":3,"file":"AccountCredits.js","names":[],"sources":["../../../src/components/AccountCredits/AccountCredits.tsx"],"sourcesContent":["import { ProfileSection } from '@/ui/elements/Section';\n\nimport { useCreditBalance, useSubscriberTypeLocalizationRoot } from '../../contexts';\nimport { localizationKeys, Text, useLocalizations } from '../../customizables';\nimport { useRouter } from '../../router';\n\nexport const AccountCredits = () => {\n  const { data: creditBalance, isLoading } = useCreditBalance();\n  const localizationRoot = useSubscriberTypeLocalizationRoot();\n  const { navigate } = useRouter();\n  const { $ } = useLocalizations();\n\n  // Only show if balance is not null\n  if (!creditBalance?.balance || isLoading) {\n    return null;\n  }\n\n  return (\n    <ProfileSection.Root\n      title={localizationKeys(`${localizationRoot}.billingPage.accountCreditsSection.title`)}\n      centered={false}\n      id='accountCredits'\n      sx={t => ({\n        borderTopWidth: t.borderWidths.$normal,\n        borderTopStyle: t.borderStyles.$solid,\n        borderTopColor: t.colors.$borderAlpha100,\n      })}\n    >\n      <ProfileSection.ItemList\n        id='accountCredits'\n        disableAnimation\n      >\n        <ProfileSection.Item id='accountCredits'>\n          <Text variant='subtitle'>{$(creditBalance.balance)}</Text>\n        </ProfileSection.Item>\n        <ProfileSection.Button\n          id='accountCredits'\n          localizationKey={localizationKeys(`${localizationRoot}.billingPage.accountCreditsSection.viewHistory`)}\n          sx={[t => ({ justifyContent: 'start', height: t.sizes.$8 })]}\n          onClick={() => void navigate('credit-history')}\n        />\n      </ProfileSection.ItemList>\n    </ProfileSection.Root>\n  );\n};\n"],"mappings":";;;;;;;;;;AAMA,MAAa,uBAAuB;CAClC,MAAM,EAAE,MAAM,eAAe,cAAc,iBAAiB;CAC5D,MAAM,mBAAmB,kCAAkC;CAC3D,MAAM,EAAE,aAAa,UAAU;CAC/B,MAAM,EAAE,MAAM,iBAAiB;CAG/B,IAAI,CAAC,eAAe,WAAW,WAC7B,OAAO;CAGT,OACE,oBAAC,eAAe,MAAhB;EACE,OAAO,iBAAiB,GAAG,iBAAiB,yCAAyC;EACrF,UAAU;EACV,IAAG;EACH,KAAI,OAAM;GACR,gBAAgB,EAAE,aAAa;GAC/B,gBAAgB,EAAE,aAAa;GAC/B,gBAAgB,EAAE,OAAO;EAC3B;YAEA,qBAAC,eAAe,UAAhB;GACE,IAAG;GACH;aAFF,CAIE,oBAAC,eAAe,MAAhB;IAAqB,IAAG;cACtB,oBAAC,MAAD;KAAM,SAAQ;eAAY,EAAE,cAAc,OAAO;IAAQ;GACtC,IACrB,oBAAC,eAAe,QAAhB;IACE,IAAG;IACH,iBAAiB,iBAAiB,GAAG,iBAAiB,+CAA+C;IACrG,IAAI,EAAC,OAAM;KAAE,gBAAgB;KAAS,QAAQ,EAAE,MAAM;IAAG,EAAE;IAC3D,eAAe,KAAK,SAAS,gBAAgB;GAC9C,EACsB;;CACN;AAEzB"}