chore(ui): Layer architecture for configure steps per IdP and protocol

[LauraBeatris]

Description

Introduces new architecture for adding configuration steps per IdP and protocol, making it more flexible to add Microsoft Entra + Google Workspace for SAML, and later OpenID connect.

Now, each protocol has it's folder within the provider types, and each provider should have it's inner steps created within a module, which allows for flexibility when composing the UI.

How to add a new SAML provider

1. Update the ProviderType union
2. Once the union gets updated, then it'll require to update the step mapper within ConfigureStep/index.tsx
3. Implement the steps component for that identity provider according to it's instructions

Checklist

• pnpm test runs as expected.
• pnpm build runs as expected.
• (If applicable) JSDoc comments have been added or updated for any package exports
• (If applicable) Documentation has been updated

Type of change

• 🐛 Bug fix
• 🌟 New feature
• 🔨 Breaking change
• 📖 Refactoring / dependency upgrade / documentation
• other:

[changeset-bot]

⚠️ No Changeset found

Latest commit: df44a2a

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
clerk-js-sandbox	Ready	Preview, Comment	May 26, 2026 8:14pm

[coderabbitai]

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: Repository YAML (base), Organization UI (inherited)

Review profile: CHILL

Plan: Pro

Run ID: 33caa9b4-a83d-484d-af54-c91ab502016c

📥 Commits

Reviewing files that changed from the base of the PR and between b16ba0a and df44a2a.

📒 Files selected for processing (11)

• packages/localizations/src/en-US.ts
• packages/shared/src/types/localization.ts
• packages/ui/src/components/ConfigureSSO/elements/Wizard/InnerStepCounter.tsx
• packages/ui/src/components/ConfigureSSO/steps/ConfigureStep.tsx
• packages/ui/src/components/ConfigureSSO/steps/ConfigureStep/index.tsx
• packages/ui/src/components/ConfigureSSO/steps/ConfigureStep/saml/SamlCustomConfigureSteps.tsx
• packages/ui/src/components/ConfigureSSO/steps/ConfigureStep/saml/SamlOktaConfigureSteps.tsx
• packages/ui/src/components/ConfigureSSO/steps/ConfigureStep/saml/shared/AttributeMappingTable.tsx
• packages/ui/src/components/ConfigureSSO/steps/ConfigureStep/saml/shared/IdentityProviderMetadataForm.tsx
• packages/ui/src/components/ConfigureSSO/steps/VerifyDomainStep.tsx
• packages/ui/src/components/ConfigureSSO/steps/configureStepTranslations.ts

💤 Files with no reviewable changes (2)

• packages/ui/src/components/ConfigureSSO/steps/ConfigureStep.tsx
• packages/ui/src/components/ConfigureSSO/steps/configureStepTranslations.ts

---

📝 Walkthrough

Walkthrough

This PR refactors the ConfigureSSO SAML wizard architecture from a monolithic single-component model into a modular, provider-routed design. It updates localization strings and TypeScript types to define a step-based configuration hierarchy for both Okta and Custom SAML providers. New shared UI components (AttributeMappingTable and IdentityProviderMetadataForm) encapsulate reusable attribute mapping and metadata submission logic. Provider-specific step implementations (SamlOktaConfigureSteps, SamlCustomConfigureSteps) compose four-step wizards that reuse shared components while applying provider-specific attribute mappings and field labels. A provider-routing ConfigureStep component dispatches to the correct step implementation, and a shared InnerStepCounter component is extracted for reuse across domain verification and SAML configuration flows.

Estimated code review effort

🎯 4 (Complex) | ⏱️ ~60 minutes

Possibly related PRs

• clerk/javascript#8553: Introduces the dual-mode (metadata URL vs manual) segmented-control flow for SAML IdP submission with the same idpSsoUrl, idpEntityId, and idpCertificate field structure.
• clerk/javascript#8564: Updates the same configureSSO.configureStep localization and type schema for samlOkta/samlCustom to support custom SSO configuration.
• clerk/javascript#8535: Builds the initial Okta Configure step UI and establishes the foundational configureSSO.configureStep localization/type shape that this PR refactors into a step-based hierarchy.

🚥 Pre-merge checks | ✅ 5

✅ Passed checks (5 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title clearly and accurately summarizes the main refactoring objective: introducing a layered architecture for configure steps organized per identity provider and protocol.
Description check	✅ Passed	The description is directly related to the changeset, explaining the architectural rationale, the new folder structure per protocol, how to add new providers, and documenting completed and pending checklist items.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Linked Issues check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check	✅ Passed	Check skipped because no linked issues were found for this pull request.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ Finishing Touches

⚔️ Resolve merge conflicts

• Resolve merge conflict in branch laura/orgs-1596-sdk-introduce-module-structure-per-idp-specific-instructions

---

_{Comment @coderabbitai help to get the list of available commands and usage tips.}