Add changeset

Author: LauraBeatris

.changeset/lucky-tables-learn.md

@@ -0,0 +1,5 @@
+---
+'@clerk/ui': patch
+---
+
+Add wizard steps for the `<__experimental_ConfigureSSO />` component

packages/ui/src/components/ConfigureSSO/ConfigureSSOContext.tsx

@@ -3,12 +3,9 @@ import type { EnterpriseConnectionResource } from '@clerk/shared/types';
 import React, { type PropsWithChildren } from 'react';
 
 /**
- * Shared form state for the ConfigureSSO wizard. Lives outside the
- * Wizard's own context so that:
- *  - it persists across step navigations (each step is its own
- *    `<Route>`, mounted/unmounted on navigation)
- *  - `shouldSkip` predicates on `WizardStep` can read it as plain data
- *    via `<Wizard.Root data={ssoCtx} />`
+ * Shared form state for the ConfigureSSO wizard, persisted across step
+ * route mounts and exposed to `WizardStep.shouldSkip` via `Wizard.Root`'s
+ * `data` prop
  */
 export interface ConfigureSSOData {
   /**

packages/ui/src/components/ConfigureSSO/constants.ts

@@ -15,8 +15,6 @@ export const CONFIGURE_SSO_STEPS: ReadonlyArray<WizardStep<ConfigureSSOData>> =
     id: 'verify-email-domain',
     path: 'verify-email-domain',
     label: 'Verify domain',
-    // Skip this step when there's a primary email address domain already verified
-    shouldSkip: data => data.domainAlreadyVerified,
     innerSteps: [
       {
         id: 'provide-email',
@@ -29,6 +27,8 @@ export const CONFIGURE_SSO_STEPS: ReadonlyArray<WizardStep<ConfigureSSOData>> =
         Component: VerifyDomain,
       },
     ],
+    // Skip this step when there's a primary email address domain already verified
+    shouldSkip: data => data.domainAlreadyVerified,
   },
   {
     id: 'configure',

packages/ui/src/components/ConfigureSSO/steps/StepLayout.tsx

@@ -11,7 +11,7 @@ interface StepLayoutProps {
 
 /**
  * Renders the title row (with the Wizard's Step X/Y badge) on top, a divider, and the step body
- * underneath. Each individual step file owns the body content.
+ * underneath. Each individual step file owns the body content
  *
  * The Step X/Y badge is rendered via `Wizard.StepIndicator`, which
  * self-hides on steps that have no inner sub-steps