Incremental adoption: Can I mix Spectrum 1 and Spectrum 2 components?

[cheema-corellian]

Congrats on the new Spectrum 2 release!

I am currently using @adobe/react-spectrum (v3) with the classic Spectrum design (S1). I am hoping to ease into the new Spectrum 2 design by upgrading just a handful of components first and then coming back for more later.

Incremental Migration: Is it supported to mix old S1 components and new S2 components in the same app? Can I nest an S2 Provider inside my existing app to migrate specific sections?

Versioning: I’d like to clarify the upgrade path. Does Spectrum 2 require a full library upgrade (e.g. to a v4), or is it consumed via a separate package (like @react-spectrum/s2) alongside my current v3 installation?

I briefly scanned the migration guides but wanted to double-check the best practice for running them side-by-side.

[snowystinger]

Yes, you can mix them. Certain components mix less well than others. For example, an icon inside an S2 button must come from the S2 icons. Same goes for the children components such as Text, Content, Header, etc. In addition, anything inside a Dialog should match whatever version the dialog is, otherwise you may need to do some extra work to render an extra provider inside of the Dialog.

We have not released a v4, S2 will be in a separate package which was just released at 1.0, which is part of how you can use both libraries side by side.