@@ -83,10 +83,8 @@ const PricingTableModal = (props: __experimental_PricingTableProps) => {
);
};
-const PricingTable = (props: __experimental_PricingTableProps) => {
+export const PricingTable = (props: PricingTableProps) => {
const { mode = 'mounted' } = usePricingTableContext();
return mode === 'modal' ?
:
;
};
-
-export const __experimental_PricingTable = PricingTable;
diff --git a/packages/clerk-js/src/ui/components/PricingTable/PricingTableDefault.tsx b/packages/clerk-js/src/ui/components/PricingTable/PricingTableDefault.tsx
index 7f403eefb44..7cf0dec27b5 100644
--- a/packages/clerk-js/src/ui/components/PricingTable/PricingTableDefault.tsx
+++ b/packages/clerk-js/src/ui/components/PricingTable/PricingTableDefault.tsx
@@ -2,7 +2,7 @@ import { useClerk } from '@clerk/shared/react';
import type {
__experimental_CommercePlanResource,
__experimental_CommerceSubscriptionPlanPeriod,
- __experimental_PricingTableProps,
+ PricingTableProps,
} from '@clerk/types';
import * as React from 'react';
@@ -35,7 +35,7 @@ interface PricingTableDefaultProps {
setPlanPeriod: (val: __experimental_CommerceSubscriptionPlanPeriod) => void;
onSelect: (plan: __experimental_CommercePlanResource) => void;
isCompact?: boolean;
- props: __experimental_PricingTableProps;
+ props: PricingTableProps;
}
export function PricingTableDefault({
@@ -96,7 +96,7 @@ interface CardProps {
setPlanPeriod: (p: __experimental_CommerceSubscriptionPlanPeriod) => void;
onSelect: (plan: __experimental_CommercePlanResource, event?: React.MouseEvent
) => void;
isCompact?: boolean;
- props: __experimental_PricingTableProps;
+ props: PricingTableProps;
}
function Card(props: CardProps) {
diff --git a/packages/clerk-js/src/ui/components/UserProfile/BillingPage.tsx b/packages/clerk-js/src/ui/components/UserProfile/BillingPage.tsx
index 2a57351aa80..465ee936d01 100644
--- a/packages/clerk-js/src/ui/components/UserProfile/BillingPage.tsx
+++ b/packages/clerk-js/src/ui/components/UserProfile/BillingPage.tsx
@@ -1,7 +1,7 @@
import {
- __experimental_PricingTableContext,
InvoicesContextProvider,
PlansContextProvider,
+ PricingTableContext,
SubscriberTypeContext,
useSubscriptions,
} from '../../contexts';
@@ -21,7 +21,7 @@ import { useTabState } from '../../hooks/useTabState';
import { useRouter } from '../../router';
import { InvoicesList } from '../Invoices';
import { __experimental_PaymentSources } from '../PaymentSources';
-import { __experimental_PricingTable } from '../PricingTable';
+import { PricingTable } from '../PricingTable';
import { SubscriptionsList } from '../Subscriptions';
const tabMap = {
@@ -96,9 +96,9 @@ const BillingPageInternal = withCardStateProvider(() => {
<__experimental_PaymentSources />
) : (
- <__experimental_PricingTableContext.Provider value={{ componentName: 'PricingTable', mode: 'modal' }}>
- <__experimental_PricingTable />
-
+
+
+
)}
diff --git a/packages/clerk-js/src/ui/components/UserProfile/PlansPage.tsx b/packages/clerk-js/src/ui/components/UserProfile/PlansPage.tsx
index 0144b9a3dd9..b5cee8eaa84 100644
--- a/packages/clerk-js/src/ui/components/UserProfile/PlansPage.tsx
+++ b/packages/clerk-js/src/ui/components/UserProfile/PlansPage.tsx
@@ -1,7 +1,7 @@
-import { __experimental_PricingTableContext, PlansContextProvider, SubscriberTypeContext } from '../../contexts';
+import { PlansContextProvider, PricingTableContext, SubscriberTypeContext } from '../../contexts';
import { Header } from '../../elements';
import { useRouter } from '../../router';
-import { __experimental_PricingTable } from '../PricingTable/PricingTable';
+import { PricingTable } from '../PricingTable/PricingTable';
const PlansPageInternal = () => {
const { navigate } = useRouter();
@@ -25,9 +25,9 @@ const PlansPageInternal = () => {
- <__experimental_PricingTableContext.Provider value={{ componentName: 'PricingTable', mode: 'modal' }}>
- <__experimental_PricingTable />
-
+
+
+
);
};
diff --git a/packages/clerk-js/src/ui/contexts/ClerkUIComponentsContext.tsx b/packages/clerk-js/src/ui/contexts/ClerkUIComponentsContext.tsx
index 868cec35345..7096376861e 100644
--- a/packages/clerk-js/src/ui/contexts/ClerkUIComponentsContext.tsx
+++ b/packages/clerk-js/src/ui/contexts/ClerkUIComponentsContext.tsx
@@ -1,15 +1,15 @@
-import type { __experimental_PricingTableProps, UserButtonProps, WaitlistProps } from '@clerk/types';
+import type { PricingTableProps, UserButtonProps, WaitlistProps } from '@clerk/types';
import type { ReactNode } from 'react';
import type { AvailableComponentName, AvailableComponentProps } from '../types';
import {
- __experimental_PricingTableContext,
CreateOrganizationContext,
GoogleOneTapContext,
OrganizationListContext,
OrganizationProfileContext,
OrganizationSwitcherContext,
PlansContextProvider,
+ PricingTableContext,
SignInContext,
SignUpContext,
SubscriberTypeContext,
@@ -83,15 +83,11 @@ export function ComponentContextProvider({
);
case 'PricingTable':
return (
-
+
- <__experimental_PricingTableContext.Provider
- value={{ componentName, ...(props as __experimental_PricingTableProps) }}
- >
+
{children}
-
+
);
diff --git a/packages/clerk-js/src/ui/contexts/components/Checkout.ts b/packages/clerk-js/src/ui/contexts/components/Checkout.ts
index a4fe05e4ab0..2ca765564a4 100644
--- a/packages/clerk-js/src/ui/contexts/components/Checkout.ts
+++ b/packages/clerk-js/src/ui/contexts/components/Checkout.ts
@@ -16,22 +16,22 @@ export const useCheckoutContext = () => {
throw new Error('Clerk: useCheckoutContext called outside Checkout.');
}
- const checkoutContinueUrl = useMemo(() => {
+ const newSubscriptionRedirectUrl = useMemo(() => {
// When we're rendered via the PricingTable with mode = 'modal' we provide a `portalRoot` value
// we want to keep users within the context of the modal, so we do this to prevent navigating away
if (context.portalRoot) {
return undefined;
}
- const url = context.checkoutContinueUrl || clerk.buildCheckoutContinueUrl?.();
+ const url = context.newSubscriptionRedirectUrl || clerk.buildNewSubscriptionRedirectUrl?.();
return isAllowedRedirect(options?.allowedRedirectOrigins, window.location.origin)(url) ? url : undefined;
- }, [context.portalRoot, context.checkoutContinueUrl, clerk, options?.allowedRedirectOrigins]);
+ }, [context.portalRoot, context.newSubscriptionRedirectUrl, clerk, options?.allowedRedirectOrigins]);
const { componentName, ...ctx } = context;
return {
...ctx,
componentName,
- checkoutContinueUrl,
+ newSubscriptionRedirectUrl,
};
};
diff --git a/packages/clerk-js/src/ui/contexts/components/PricingTable.ts b/packages/clerk-js/src/ui/contexts/components/PricingTable.ts
index 862a0921c2d..b9843406cd5 100644
--- a/packages/clerk-js/src/ui/contexts/components/PricingTable.ts
+++ b/packages/clerk-js/src/ui/contexts/components/PricingTable.ts
@@ -1,11 +1,11 @@
import { createContext, useContext } from 'react';
-import type { __experimental_PricingTableCtx } from '../../types';
+import type { PricingTableCtx } from '../../types';
-export const __experimental_PricingTableContext = createContext<__experimental_PricingTableCtx | null>(null);
+export const PricingTableContext = createContext(null);
export const usePricingTableContext = () => {
- const context = useContext(__experimental_PricingTableContext);
+ const context = useContext(PricingTableContext);
if (!context || context.componentName !== 'PricingTable') {
throw new Error('Clerk: usePricingTableContext called outside PricingTable.');
diff --git a/packages/clerk-js/src/ui/lazyModules/components.ts b/packages/clerk-js/src/ui/lazyModules/components.ts
index 9378632fa35..913c167102c 100644
--- a/packages/clerk-js/src/ui/lazyModules/components.ts
+++ b/packages/clerk-js/src/ui/lazyModules/components.ts
@@ -93,7 +93,7 @@ export const KeylessPrompt = lazy(() =>
);
export const PricingTable = lazy(() =>
- componentImportPaths.PricingTable().then(module => ({ default: module.__experimental_PricingTable })),
+ componentImportPaths.PricingTable().then(module => ({ default: module.PricingTable })),
);
export const Checkout = lazy(() =>
diff --git a/packages/clerk-js/src/ui/types.ts b/packages/clerk-js/src/ui/types.ts
index 45dd9d09543..b785e2384fb 100644
--- a/packages/clerk-js/src/ui/types.ts
+++ b/packages/clerk-js/src/ui/types.ts
@@ -4,14 +4,14 @@ import type {
__experimental_CommercePlanResource,
__experimental_CommerceSubscriptionResource,
__experimental_PlanDetailsProps,
- __experimental_PricingTableProps,
__internal_UserVerificationProps,
- CheckoutContinueUrl,
CreateOrganizationProps,
GoogleOneTapProps,
+ NewSubscriptionRedirectUrl,
OrganizationListProps,
OrganizationProfileProps,
OrganizationSwitcherProps,
+ PricingTableProps,
SignInFallbackRedirectUrl,
SignInForceRedirectUrl,
SignInProps,
@@ -47,7 +47,7 @@ export type AvailableComponentProps =
| CreateOrganizationProps
| OrganizationListProps
| WaitlistProps
- | __experimental_PricingTableProps
+ | PricingTableProps
| __experimental_CheckoutProps
| __internal_UserVerificationProps
| __experimental_PlanDetailsProps;
@@ -112,14 +112,14 @@ export type WaitlistCtx = WaitlistProps & {
mode?: ComponentMode;
};
-export type __experimental_PricingTableCtx = __experimental_PricingTableProps & {
+export type PricingTableCtx = PricingTableProps & {
componentName: 'PricingTable';
mode?: ComponentMode;
};
export type __experimental_CheckoutCtx = __experimental_CheckoutProps & {
componentName: 'Checkout';
-} & CheckoutContinueUrl;
+} & NewSubscriptionRedirectUrl;
export type __experimental_PaymentSourcesCtx = {
componentName: 'PaymentSources';
@@ -159,6 +159,6 @@ export type AvailableComponentCtx =
| OrganizationListCtx
| GoogleOneTapCtx
| WaitlistCtx
- | __experimental_PricingTableCtx
+ | PricingTableCtx
| __experimental_CheckoutCtx;
export type AvailableComponentName = AvailableComponentCtx['componentName'];
diff --git a/packages/expo/src/web/uiComponents.tsx b/packages/expo/src/web/uiComponents.tsx
index b0d9c95ce1d..4f2bfb72050 100644
--- a/packages/expo/src/web/uiComponents.tsx
+++ b/packages/expo/src/web/uiComponents.tsx
@@ -1,10 +1,10 @@
import {
- __experimental_PricingTable as BasePricingTable,
CreateOrganization as BaseCreateOrganization,
GoogleOneTap as BaseGoogleOneTap,
OrganizationList as BaseOrganizationList,
OrganizationProfile as BaseOrganizationProfile,
OrganizationSwitcher as BaseOrganizationSwitcher,
+ PricingTable as BasePricingTable,
SignIn as BaseSignIn,
SignInButton as BaseSignInButton,
SignInWithMetamaskButton as BaseSignInWithMetamaskButton,
@@ -52,4 +52,4 @@ export const SignInWithMetamaskButton: typeof BaseSignInWithMetamaskButton =
WrapComponent(BaseSignInWithMetamaskButton);
export const GoogleOneTap: typeof BaseGoogleOneTap = WrapComponent(BaseGoogleOneTap);
export const Waitlist: typeof BaseWaitlist = WrapComponent(BaseWaitlist);
-export const __experimental_PricingTable: typeof BasePricingTable = WrapComponent(BasePricingTable);
+export const PricingTable: typeof BasePricingTable = WrapComponent(BasePricingTable);
diff --git a/packages/nextjs/src/client-boundary/uiComponents.tsx b/packages/nextjs/src/client-boundary/uiComponents.tsx
index 2326c74d83e..dbcc933bf2e 100644
--- a/packages/nextjs/src/client-boundary/uiComponents.tsx
+++ b/packages/nextjs/src/client-boundary/uiComponents.tsx
@@ -22,7 +22,7 @@ export {
UserButton,
GoogleOneTap,
Waitlist,
- __experimental_PricingTable,
+ PricingTable,
} from '@clerk/clerk-react';
// The assignment of UserProfile with BaseUserProfile props is used
diff --git a/packages/nextjs/src/index.ts b/packages/nextjs/src/index.ts
index 6020c3e723e..c69287ea42e 100644
--- a/packages/nextjs/src/index.ts
+++ b/packages/nextjs/src/index.ts
@@ -34,7 +34,7 @@ export {
UserProfile,
GoogleOneTap,
Waitlist,
- __experimental_PricingTable,
+ PricingTable,
} from './client-boundary/uiComponents';
/**
diff --git a/packages/nextjs/src/utils/mergeNextClerkPropsWithEnv.ts b/packages/nextjs/src/utils/mergeNextClerkPropsWithEnv.ts
index 9068d0ea940..fe8a7937aa3 100644
--- a/packages/nextjs/src/utils/mergeNextClerkPropsWithEnv.ts
+++ b/packages/nextjs/src/utils/mergeNextClerkPropsWithEnv.ts
@@ -25,7 +25,8 @@ export const mergeNextClerkPropsWithEnv = (props: Omit should not change unexpectedly 1`] = `
"OrganizationList",
"OrganizationProfile",
"OrganizationSwitcher",
+ "PricingTable",
"Protect",
"RedirectToCreateOrganization",
"RedirectToOrganizationProfile",
@@ -30,7 +31,6 @@ exports[`root public exports > should not change unexpectedly 1`] = `
"UserButton",
"UserProfile",
"Waitlist",
- "__experimental_PricingTable",
"useAuth",
"useClerk",
"useEmailLink",
diff --git a/packages/react-router/src/utils/env.ts b/packages/react-router/src/utils/env.ts
index 50bbf345401..ed9c1668024 100644
--- a/packages/react-router/src/utils/env.ts
+++ b/packages/react-router/src/utils/env.ts
@@ -25,6 +25,6 @@ export const getPublicEnvVariables = (context: AppLoadContext | undefined) => {
signUpFallbackRedirectUrl: getValue('CLERK_SIGN_UP_FALLBACK_REDIRECT_URL'),
afterSignInUrl: getValue('CLERK_AFTER_SIGN_IN_URL'),
afterSignUpUrl: getValue('CLERK_AFTER_SIGN_UP_URL'),
- checkoutContinueUrl: getValue('CLERK_CHECKOUT_CONTINUE_URL'),
+ newSubscriptionRedirectUrl: getValue('CLERK_CHECKOUT_CONTINUE_URL'),
};
};
diff --git a/packages/react/src/components/index.ts b/packages/react/src/components/index.ts
index a6b408fc1d9..f932a18115d 100644
--- a/packages/react/src/components/index.ts
+++ b/packages/react/src/components/index.ts
@@ -9,7 +9,7 @@ export {
OrganizationList,
GoogleOneTap,
Waitlist,
- __experimental_PricingTable,
+ PricingTable,
} from './uiComponents';
export {
diff --git a/packages/react/src/components/uiComponents.tsx b/packages/react/src/components/uiComponents.tsx
index 6384164ce75..9556050ef29 100644
--- a/packages/react/src/components/uiComponents.tsx
+++ b/packages/react/src/components/uiComponents.tsx
@@ -1,11 +1,11 @@
import { logErrorInDevMode } from '@clerk/shared/utils';
import type {
- __experimental_PricingTableProps,
CreateOrganizationProps,
GoogleOneTapProps,
OrganizationListProps,
OrganizationProfileProps,
OrganizationSwitcherProps,
+ PricingTableProps,
SignInProps,
SignUpProps,
UserButtonProps,
@@ -573,8 +573,8 @@ export const Waitlist = withClerk(
{ component: 'Waitlist', renderWhileLoading: true },
);
-export const __experimental_PricingTable = withClerk(
- ({ clerk, component, fallback, ...props }: WithClerkProp<__experimental_PricingTableProps & FallbackProp>) => {
+export const PricingTable = withClerk(
+ ({ clerk, component, fallback, ...props }: WithClerkProp) => {
const mountingStatus = useWaitForComponentMount(component);
const shouldShowFallback = mountingStatus === 'rendering' || !clerk.loaded;
@@ -598,5 +598,5 @@ export const __experimental_PricingTable = withClerk(
);
},
- { component: '__experimental_PricingTable', renderWhileLoading: true },
+ { component: 'PricingTable', renderWhileLoading: true },
);
diff --git a/packages/react/src/isomorphicClerk.ts b/packages/react/src/isomorphicClerk.ts
index 5f43be3380d..3352b6f6cb1 100644
--- a/packages/react/src/isomorphicClerk.ts
+++ b/packages/react/src/isomorphicClerk.ts
@@ -6,7 +6,6 @@ import type {
__experimental_CheckoutProps,
__experimental_CommerceNamespace,
__experimental_PlanDetailsProps,
- __experimental_PricingTableProps,
__internal_UserVerificationModalProps,
__internal_UserVerificationProps,
AuthenticateWithCoinbaseWalletParams,
@@ -32,6 +31,7 @@ import type {
OrganizationProfileProps,
OrganizationResource,
OrganizationSwitcherProps,
+ PricingTableProps,
RedirectOptions,
SetActiveParams,
SignInProps,
@@ -130,7 +130,7 @@ export class IsomorphicClerk implements IsomorphicLoadedClerk {
private premountOrganizationListNodes = new Map();
private premountMethodCalls = new Map, MethodCallback>();
private premountWaitlistNodes = new Map();
- private premountPricingTableNodes = new Map();
+ private premountPricingTableNodes = new Map();
// A separate Map of `addListener` method calls to handle multiple listeners.
private premountAddListenerCalls = new Map<
ListenerCallback,
@@ -323,12 +323,12 @@ export class IsomorphicClerk implements IsomorphicLoadedClerk {
}
};
- buildCheckoutContinueUrl = (): string | void => {
- const callback = () => this.clerkjs?.buildCheckoutContinueUrl() || '';
+ buildNewSubscriptionRedirectUrl = (): string | void => {
+ const callback = () => this.clerkjs?.buildNewSubscriptionRedirectUrl() || '';
if (this.clerkjs && this.loaded) {
return callback();
} else {
- this.premountMethodCalls.set('buildCheckoutContinueUrl', callback);
+ this.premountMethodCalls.set('buildNewSubscriptionRedirectUrl', callback);
}
};
@@ -1034,7 +1034,7 @@ export class IsomorphicClerk implements IsomorphicLoadedClerk {
}
};
- __experimental_mountPricingTable = (node: HTMLDivElement, props?: __experimental_PricingTableProps) => {
+ __experimental_mountPricingTable = (node: HTMLDivElement, props?: PricingTableProps) => {
if (this.clerkjs && this.loaded) {
this.clerkjs.__experimental_mountPricingTable(node, props);
} else {
diff --git a/packages/remix/src/ssr/loadOptions.ts b/packages/remix/src/ssr/loadOptions.ts
index 5241cc381b1..ef0dc1738d4 100644
--- a/packages/remix/src/ssr/loadOptions.ts
+++ b/packages/remix/src/ssr/loadOptions.ts
@@ -45,8 +45,8 @@ export const loadOptions = (args: LoaderFunctionArgs, overrides: RootAuthLoaderO
overrides.signUpFallbackRedirectUrl || getEnvVariable('CLERK_SIGN_UP_FALLBACK_REDIRECT_URL', context) || '';
const afterSignInUrl = overrides.afterSignInUrl || getEnvVariable('CLERK_AFTER_SIGN_IN_URL', context) || '';
const afterSignUpUrl = overrides.afterSignUpUrl || getEnvVariable('CLERK_AFTER_SIGN_UP_URL', context) || '';
- const checkoutContinueUrl =
- overrides.checkoutContinueUrl || getEnvVariable('CLERK_CHECKOUT_CONTINUE_URL', context) || '';
+ const newSubscriptionRedirectUrl =
+ overrides.newSubscriptionRedirectUrl || getEnvVariable('CLERK_CHECKOUT_CONTINUE_URL', context) || '';
let proxyUrl;
if (!!relativeOrAbsoluteProxyUrl && isProxyUrlRelative(relativeOrAbsoluteProxyUrl)) {
@@ -83,6 +83,6 @@ export const loadOptions = (args: LoaderFunctionArgs, overrides: RootAuthLoaderO
signUpForceRedirectUrl,
signInFallbackRedirectUrl,
signUpFallbackRedirectUrl,
- checkoutContinueUrl,
+ newSubscriptionRedirectUrl,
};
};
diff --git a/packages/remix/src/ssr/types.ts b/packages/remix/src/ssr/types.ts
index b83c502c142..a6972cd6d29 100644
--- a/packages/remix/src/ssr/types.ts
+++ b/packages/remix/src/ssr/types.ts
@@ -1,9 +1,9 @@
import type { AuthObject, Organization, Session, User, VerifyTokenOptions } from '@clerk/backend';
import type { RequestState } from '@clerk/backend/internal';
import type {
- CheckoutContinueUrl,
LegacyRedirectProps,
MultiDomainAndOrProxy,
+ NewSubscriptionRedirectUrl,
SignInFallbackRedirectUrl,
SignInForceRedirectUrl,
SignUpFallbackRedirectUrl,
@@ -37,7 +37,7 @@ export type RootAuthLoaderOptions = {
SignInFallbackRedirectUrl &
SignUpForceRedirectUrl &
SignUpFallbackRedirectUrl &
- CheckoutContinueUrl &
+ NewSubscriptionRedirectUrl &
LegacyRedirectProps;
export type RequestStateWithRedirectUrls = RequestState &
@@ -45,7 +45,7 @@ export type RequestStateWithRedirectUrls = RequestState &
SignInFallbackRedirectUrl &
SignUpForceRedirectUrl &
SignUpFallbackRedirectUrl &
- CheckoutContinueUrl &
+ NewSubscriptionRedirectUrl &
LegacyRedirectProps;
export type RootAuthLoaderCallback = (
diff --git a/packages/remix/src/ssr/utils.ts b/packages/remix/src/ssr/utils.ts
index dc25efc1609..c1fa4c521b4 100644
--- a/packages/remix/src/ssr/utils.ts
+++ b/packages/remix/src/ssr/utils.ts
@@ -94,7 +94,7 @@ export function getResponseClerkState(requestState: RequestStateWithRedirectUrls
__signUpForceRedirectUrl: requestState.signUpForceRedirectUrl,
__signInFallbackRedirectUrl: requestState.signInFallbackRedirectUrl,
__signUpFallbackRedirectUrl: requestState.signUpFallbackRedirectUrl,
- checkoutContinueUrl: requestState.checkoutContinueUrl,
+ newSubscriptionRedirectUrl: requestState.newSubscriptionRedirectUrl,
__clerk_debug: debugRequestState(requestState),
__clerkJSUrl: getEnvVariable('CLERK_JS', context),
__clerkJSVersion: getEnvVariable('CLERK_JS_VERSION', context),
diff --git a/packages/tanstack-react-start/src/__tests__/__snapshots__/exports.test.ts.snap b/packages/tanstack-react-start/src/__tests__/__snapshots__/exports.test.ts.snap
index eccf59334a3..f0247688460 100644
--- a/packages/tanstack-react-start/src/__tests__/__snapshots__/exports.test.ts.snap
+++ b/packages/tanstack-react-start/src/__tests__/__snapshots__/exports.test.ts.snap
@@ -25,6 +25,7 @@ exports[`root public exports > should not change unexpectedly 1`] = `
"OrganizationList",
"OrganizationProfile",
"OrganizationSwitcher",
+ "PricingTable",
"Protect",
"RedirectToCreateOrganization",
"RedirectToOrganizationProfile",
@@ -42,7 +43,6 @@ exports[`root public exports > should not change unexpectedly 1`] = `
"UserButton",
"UserProfile",
"Waitlist",
- "__experimental_PricingTable",
"useAuth",
"useClerk",
"useEmailLink",
diff --git a/packages/tanstack-react-start/src/utils/env.ts b/packages/tanstack-react-start/src/utils/env.ts
index 0f90ef373c2..d7161c3f6fb 100644
--- a/packages/tanstack-react-start/src/utils/env.ts
+++ b/packages/tanstack-react-start/src/utils/env.ts
@@ -21,6 +21,6 @@ export const getPublicEnvVariables = (context?: H3EventContext) => {
telemetryDebug: isTruthy(getValue('CLERK_TELEMETRY_DEBUG')),
afterSignInUrl: getValue('CLERK_AFTER_SIGN_IN_URL'),
afterSignUpUrl: getValue('CLERK_AFTER_SIGN_UP_URL'),
- checkoutContinueUrl: getValue('CLERK_CHECKOUT_CONTINUE_URL'),
+ newSubscriptionRedirectUrl: getValue('CLERK_CHECKOUT_CONTINUE_URL'),
} as const;
};
diff --git a/packages/types/src/clerk.ts b/packages/types/src/clerk.ts
index 511eeec8b2b..10d6051f4c5 100644
--- a/packages/types/src/clerk.ts
+++ b/packages/types/src/clerk.ts
@@ -32,8 +32,8 @@ import type { OrganizationCustomRoleKey } from './organizationMembership';
import type {
AfterMultiSessionSingleSignOutUrl,
AfterSignOutUrl,
- CheckoutContinueUrl,
LegacyRedirectProps,
+ NewSubscriptionRedirectUrl,
RedirectOptions,
RedirectUrlProp,
SignInFallbackRedirectUrl,
@@ -448,7 +448,7 @@ export interface Clerk {
* @param targetNode Target node to mount the PricingTable component.
* @param props configuration parameters.
*/
- __experimental_mountPricingTable: (targetNode: HTMLDivElement, props?: __experimental_PricingTableProps) => void;
+ __experimental_mountPricingTable: (targetNode: HTMLDivElement, props?: PricingTableProps) => void;
/**
* Unmount a pricing table component from the target element.
@@ -567,9 +567,9 @@ export interface Clerk {
buildAfterSignOutUrl(): string;
/**
- * Returns the configured checkoutContinueUrl of the instance.
+ * Returns the configured newSubscriptionRedirectUrl of the instance.
*/
- buildCheckoutContinueUrl(): string;
+ buildNewSubscriptionRedirectUrl(): string;
/**
* Returns the configured afterMultiSessionSingleSignOutUrl of the instance.
@@ -820,7 +820,7 @@ export type ClerkOptions = PendingSessionOptions &
SignInFallbackRedirectUrl &
SignUpForceRedirectUrl &
SignUpFallbackRedirectUrl &
- CheckoutContinueUrl &
+ NewSubscriptionRedirectUrl &
LegacyRedirectProps &
AfterSignOutUrl &
AfterMultiSessionSingleSignOutUrl & {
@@ -1567,13 +1567,13 @@ export type WaitlistProps = {
export type WaitlistModalProps = WaitlistProps;
-type __experimental_PricingTableDefaultProps = {
+type PricingTableDefaultProps = {
ctaPosition?: 'top' | 'bottom';
collapseFeatures?: boolean;
- checkoutContinueUrl?: string;
+ newSubscriptionRedirectUrl?: string;
};
-type __experimental_PricingTableBaseProps = {
+type PricingTableBaseProps = {
forOrganizations?: boolean;
appearance?: PricingTableTheme;
checkoutProps?: Pick<__experimental_CheckoutProps, 'appearance'>;
@@ -1581,8 +1581,7 @@ type __experimental_PricingTableBaseProps = {
type PortalRoot = HTMLElement | null | undefined;
-export type __experimental_PricingTableProps = __experimental_PricingTableBaseProps &
- __experimental_PricingTableDefaultProps;
+export type PricingTableProps = PricingTableBaseProps & PricingTableDefaultProps;
export type __experimental_CheckoutProps = {
appearance?: CheckoutTheme;
@@ -1596,7 +1595,7 @@ export type __experimental_CheckoutProps = {
* Full URL or path to navigate to after checkout is complete and the user clicks the "Continue" button.
* @default undefined
*/
- checkoutContinueUrl?: string;
+ newSubscriptionRedirectUrl?: string;
};
export type __experimental_PlanDetailsProps = {
diff --git a/packages/types/src/redirects.ts b/packages/types/src/redirects.ts
index 447dc7494e3..d9ab3b4da75 100644
--- a/packages/types/src/redirects.ts
+++ b/packages/types/src/redirects.ts
@@ -122,9 +122,9 @@ export type SignInForceRedirectUrl = {
signInForceRedirectUrl?: string | null;
};
-export type CheckoutContinueUrl = {
+export type NewSubscriptionRedirectUrl = {
/**
* The URL to navigate to after the user completes the checkout and clicks the "Continue" button.
*/
- checkoutContinueUrl?: string | null;
+ newSubscriptionRedirectUrl?: string | null;
};
diff --git a/packages/vue/src/components/ui-components/PricingTable.vue b/packages/vue/src/components/ui-components/PricingTable.vue
index 339dc0c2642..9830f9803b6 100644
--- a/packages/vue/src/components/ui-components/PricingTable.vue
+++ b/packages/vue/src/components/ui-components/PricingTable.vue
@@ -1,10 +1,10 @@