chore(ui,clerk-js,shared): Remove public export of ConfigureSSO (#8779)

LauraBeatris · web-flow · commit 2d6670c6c05c · 2026-06-08T11:39:58.000-07:00
diff --git a/.changeset/few-buckets-grab.md b/.changeset/few-buckets-grab.md
@@ -0,0 +1,15 @@
+---
+'@clerk/tanstack-react-start': minor
+'@clerk/react-router': minor
+'@clerk/clerk-js': minor
+'@clerk/nextjs': minor
+'@clerk/shared': minor
+'@clerk/astro': minor
+'@clerk/react': minor
+'@clerk/nuxt': minor
+'@clerk/vue': minor
+---
+
+Remove the `<ConfigureSSO />` component from the public API in favor of usage within `OrganizationProfile`
+
+Removing these exports has no breaking changes impact on production applications, as <ConfigureSSO /> was never released as a GA component
diff --git a/packages/astro/src/astro-components/index.ts b/packages/astro/src/astro-components/index.ts
@@ -31,4 +31,3 @@ export { default as Waitlist } from './interactive/Waitlist.astro';
 export { default as OAuthConsent } from './interactive/OAuthConsent.astro';
 export { default as PricingTable } from './interactive/PricingTable.astro';
 export { default as APIKeys } from './interactive/APIKeys.astro';
-export { default as ConfigureSSO } from './interactive/ConfigureSSO.astro';
diff --git a/packages/astro/src/astro-components/interactive/ConfigureSSO.astro b/packages/astro/src/astro-components/interactive/ConfigureSSO.astro
diff --git a/packages/astro/src/internal/mount-clerk-astro-js-components.ts b/packages/astro/src/internal/mount-clerk-astro-js-components.ts
@@ -21,7 +21,6 @@ const mountAllClerkAstroJSComponents = () => {
     waitlist: 'mountWaitlist',
     'pricing-table': 'mountPricingTable',
     'api-keys': 'mountAPIKeys',
-    'configure-sso': 'mountConfigureSSO',
   } as const satisfies Record<InternalUIComponentId, keyof Clerk>;
 
   Object.entries(mountFns).forEach(([category, mountFn]) => {
diff --git a/packages/astro/src/types.ts b/packages/astro/src/types.ts
@@ -119,5 +119,4 @@ export type InternalUIComponentId =
   | 'google-one-tap'
   | 'waitlist'
   | 'pricing-table'
-  | 'api-keys'
-  | 'configure-sso';
+  | 'api-keys';
diff --git a/packages/clerk-js/sandbox/app.ts b/packages/clerk-js/sandbox/app.ts
@@ -399,7 +399,7 @@ void (async () => {
     '/waitlist': { mount: 'mountWaitlist', component: 'waitlist' },
     '/pricing-table': { mount: 'mountPricingTable', component: 'pricingTable' },
     '/api-keys': { mount: 'mountAPIKeys', component: 'apiKeys' },
-    '/configure-sso': { mount: 'mountConfigureSSO', component: 'configureSSO' },
+    '/configure-sso': { mount: '__internal_mountConfigureSSO', component: 'configureSSO' },
     '/task-choose-organization': {
       mount: 'mountTaskChooseOrganization',
       component: 'taskChooseOrganization',
diff --git a/packages/clerk-js/src/core/clerk.ts b/packages/clerk-js/src/core/clerk.ts
@@ -1460,8 +1460,9 @@ export class Clerk implements ClerkInterface {
    *
    * @param targetNode Target to mount the ConfigureSSO component.
    * @param props Configuration parameters.
+   * @hidden
    */
-  public mountConfigureSSO = (node: HTMLDivElement, props?: ConfigureSSOProps) => {
+  public __internal_mountConfigureSSO = (node: HTMLDivElement, props?: ConfigureSSOProps) => {
     const { isEnabled: isOrganizationsEnabled } = this.__internal_attemptToEnableEnvironmentSetting({
       for: 'organizations',
       caller: 'ConfigureSSO',
@@ -1525,25 +1526,12 @@ export class Clerk implements ClerkInterface {
    * If there is no component mounted at the target node, results in a noop.
    *
    * @param targetNode Target node to unmount the ConfigureSSO component from.
+   * @hidden
    */
-  public unmountConfigureSSO = (node: HTMLDivElement) => {
+  public __internal_unmountConfigureSSO = (node: HTMLDivElement) => {
     void this.#clerkUI?.then(ui => ui.ensureMounted()).then(controls => controls.unmountComponent({ node }));
   };
 
-  /**
-   * @deprecated Use `mountConfigureSSO` instead.
-   */
-  public __experimental_mountConfigureSSO = (node: HTMLDivElement, props?: ConfigureSSOProps) => {
-    return this.mountConfigureSSO(node, props);
-  };
-
-  /**
-   * @deprecated Use `unmountConfigureSSO` instead.
-   */
-  public __experimental_unmountConfigureSSO = (node: HTMLDivElement) => {
-    return this.unmountConfigureSSO(node);
-  };
-
   public mountTaskChooseOrganization = (node: HTMLDivElement, props?: TaskChooseOrganizationProps) => {
     const { isEnabled: isOrganizationsEnabled } = this.__internal_attemptToEnableEnvironmentSetting({
       for: 'organizations',
diff --git a/packages/nextjs/src/client-boundary/uiComponents.tsx b/packages/nextjs/src/client-boundary/uiComponents.tsx
@@ -13,7 +13,6 @@ import { useEnforceCorrectRoutingProps } from './hooks/useEnforceRoutingProps';
 
 export {
   APIKeys,
-  ConfigureSSO,
   CreateOrganization,
   GoogleOneTap,
   HandleSSOCallback,
diff --git a/packages/nextjs/src/index.ts b/packages/nextjs/src/index.ts
@@ -23,7 +23,6 @@ export {
  */
 export {
   APIKeys,
-  ConfigureSSO,
   CreateOrganization,
   GoogleOneTap,
   OAuthConsent,
diff --git a/packages/nuxt/src/module.ts b/packages/nuxt/src/module.ts
@@ -190,8 +190,6 @@ export default defineNuxtModule<ModuleOptions>({
       'Waitlist',
       // API Keys
       'APIKeys',
-      // SSO
-      'ConfigureSSO',
     ];
     otherComponents.forEach(component => {
       void addComponent({
diff --git a/packages/nuxt/src/runtime/components/index.ts b/packages/nuxt/src/runtime/components/index.ts
@@ -4,7 +4,6 @@ export {
   UserAvatar,
   UserButton,
   OrganizationSwitcher,
-  ConfigureSSO,
   GoogleOneTap,
   OAuthConsent,
   Waitlist,
diff --git a/packages/react-router/src/__tests__/__snapshots__/exports.test.ts.snap b/packages/react-router/src/__tests__/__snapshots__/exports.test.ts.snap
@@ -23,7 +23,6 @@ exports[`root public exports > should not change unexpectedly 1`] = `
   "ClerkLoaded",
   "ClerkLoading",
   "ClerkProvider",
-  "ConfigureSSO",
   "CreateOrganization",
   "GoogleOneTap",
   "HandleSSOCallback",
diff --git a/packages/react/src/components/index.ts b/packages/react/src/components/index.ts
@@ -1,6 +1,5 @@
 export {
   APIKeys,
-  ConfigureSSO,
   CreateOrganization,
   GoogleOneTap,
   OAuthConsent,
diff --git a/packages/react/src/components/uiComponents.tsx b/packages/react/src/components/uiComponents.tsx
@@ -1,7 +1,6 @@
 import type {
   __internal_OAuthConsentProps,
   APIKeysProps,
-  ConfigureSSOProps,
   CreateOrganizationProps,
   GoogleOneTapProps,
   OrganizationListProps,
@@ -645,34 +644,6 @@ export const APIKeys = withClerk(
   { component: 'ApiKeys', renderWhileLoading: true },
 );
 
-export const ConfigureSSO = withClerk(
-  ({ clerk, component, fallback, ...props }: WithClerkProp<ConfigureSSOProps & FallbackProp>) => {
-    const mountingStatus = useWaitForComponentMount(component);
-    const shouldShowFallback = mountingStatus === 'rendering' || !clerk.loaded;
-
-    const rendererRootProps = {
-      ...(shouldShowFallback && fallback && { style: { display: 'none' } }),
-    };
-
-    return (
-      <>
-        {shouldShowFallback && fallback}
-        {clerk.loaded && (
-          <ClerkHostRenderer
-            component={component}
-            mount={clerk.mountConfigureSSO}
-            unmount={clerk.unmountConfigureSSO}
-            updateProps={(clerk as any).__internal_updateProps}
-            props={props}
-            rootProps={rendererRootProps}
-          />
-        )}
-      </>
-    );
-  },
-  { component: 'ConfigureSSO', renderWhileLoading: true },
-);
-
 export const OAuthConsent = withClerk(
   ({ clerk, component, fallback, ...props }: WithClerkProp<__internal_OAuthConsentProps & FallbackProp>) => {
     const mountingStatus = useWaitForComponentMount(component);
diff --git a/packages/react/src/isomorphicClerk.ts b/packages/react/src/isomorphicClerk.ts
@@ -738,7 +738,7 @@ export class IsomorphicClerk implements IsomorphicLoadedClerk {
     });
 
     this.premountConfigureSSONodes.forEach((props, node) => {
-      clerkjs.mountConfigureSSO(node, props);
+      clerkjs.__internal_mountConfigureSSO(node, props);
     });
 
     this.premountOAuthConsentNodes.forEach((props, node) => {
@@ -1277,36 +1277,22 @@ export class IsomorphicClerk implements IsomorphicLoadedClerk {
     }
   };
 
-  mountConfigureSSO = (node: HTMLDivElement, props?: ConfigureSSOProps): void => {
+  __internal_mountConfigureSSO = (node: HTMLDivElement, props?: ConfigureSSOProps): void => {
     if (this.clerkjs && this.loaded) {
-      this.clerkjs.mountConfigureSSO(node, props);
+      this.clerkjs.__internal_mountConfigureSSO(node, props);
     } else {
       this.premountConfigureSSONodes.set(node, props);
     }
   };
 
-  unmountConfigureSSO = (node: HTMLDivElement): void => {
+  __internal_unmountConfigureSSO = (node: HTMLDivElement): void => {
     if (this.clerkjs && this.loaded) {
-      this.clerkjs.unmountConfigureSSO(node);
+      this.clerkjs.__internal_unmountConfigureSSO(node);
     } else {
       this.premountConfigureSSONodes.delete(node);
     }
   };
 
-  /**
-   * @deprecated Use `mountConfigureSSO` instead.
-   */
-  __experimental_mountConfigureSSO = (node: HTMLDivElement, props?: ConfigureSSOProps): void => {
-    this.mountConfigureSSO(node, props);
-  };
-
-  /**
-   * @deprecated Use `unmountConfigureSSO` instead.
-   */
-  __experimental_unmountConfigureSSO = (node: HTMLDivElement): void => {
-    this.unmountConfigureSSO(node);
-  };
-
   __internal_mountOAuthConsent = (node: HTMLDivElement, props?: OAuthConsentProps) => {
     if (this.clerkjs && this.loaded) {
       this.clerkjs.__internal_mountOAuthConsent(node, props);
diff --git a/packages/shared/src/types/clerk.ts b/packages/shared/src/types/clerk.ts
@@ -721,26 +721,18 @@ export interface Clerk {
    *
    * @param targetNode - Target to mount the ConfigureSSO component.
    * @param props - Configuration parameters.
+   * @hidden
    */
-  mountConfigureSSO: (targetNode: HTMLDivElement, props?: ConfigureSSOProps) => void;
+  __internal_mountConfigureSSO: (targetNode: HTMLDivElement, props?: ConfigureSSOProps) => void;
 
   /**
    * Unmount a configure SSO component from the target element.
    * If there is no component mounted at the target node, results in a noop.
    *
    * @param targetNode - Target node to unmount the ConfigureSSO component from.
+   * @hidden
    */
-  unmountConfigureSSO: (targetNode: HTMLDivElement) => void;
-
-  /**
-   * @deprecated Use `mountConfigureSSO` instead.
-   */
-  __experimental_mountConfigureSSO: (targetNode: HTMLDivElement, props?: ConfigureSSOProps) => void;
-
-  /**
-   * @deprecated Use `unmountConfigureSSO` instead.
-   */
-  __experimental_unmountConfigureSSO: (targetNode: HTMLDivElement) => void;
+  __internal_unmountConfigureSSO: (targetNode: HTMLDivElement) => void;
 
   /**
    * Mounts a OAuth consent component at the target element.
@@ -2314,16 +2306,16 @@ export type APIKeysProps = {
   showDescription?: boolean;
 };
 
+/**
+ * @internal
+ */
 export type ConfigureSSOProps = {
   /**
    * Customization options to fully match the Clerk components to your own brand. These options serve as overrides and will be merged with the global `appearance` configuration (if one is provided). See the [`Appearance`](https://clerk.com/docs/guides/customizing-clerk/appearance-prop/overview) docs for more information.
    */
   appearance?: ClerkAppearanceTheme;
 };
 
-/** @deprecated Use `ConfigureSSOProps` instead. */
-export type __experimental_ConfigureSSOProps = ConfigureSSOProps;
-
 /** @generateWithEmptyComment */
 export type GetAPIKeysParams = ClerkPaginationParams<{
   /**
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
@@ -29,7 +29,6 @@ exports[`root public exports > should not change unexpectedly 1`] = `
   "ClerkLoaded",
   "ClerkLoading",
   "ClerkProvider",
-  "ConfigureSSO",
   "CreateOrganization",
   "GoogleOneTap",
   "HandleSSOCallback",
diff --git a/packages/vue/src/components/index.ts b/packages/vue/src/components/index.ts
@@ -6,7 +6,6 @@ export { default as CreateOrganization } from './ui-components/CreateOrganizatio
 export { default as OrganizationList } from './ui-components/OrganizationList.vue';
 export { default as PricingTable } from './ui-components/PricingTable.vue';
 export { default as APIKeys } from './ui-components/APIKeys.vue';
-export { default as ConfigureSSO } from './ui-components/ConfigureSSO.vue';
 export { default as OAuthConsent } from './ui-components/OAuthConsent.vue';
 export { UserProfile } from './ui-components/UserProfile';
 export { OrganizationProfile } from './ui-components/OrganizationProfile';
diff --git a/packages/vue/src/components/ui-components/ConfigureSSO.vue b/packages/vue/src/components/ui-components/ConfigureSSO.vue
