Help understanding package names

[BMCwebdev]

I am converting my component library built with React Aria Components over to pnpm. It seems that RAC is relying on the way npm lets dependencies hoist up to the main modules folder. Whereas pnpm requires you to specifically install them. So where a RAC starter kit component such as AlertDialog may have something like this

import { chain } from 'react-aria';

I think I may have to install react-aria if this is to work. I'm not 100% on that, haven't gotten there yet. But I was having similar issues with some other things like tailwind-merge needing to be installed.

TLDR:
My real question is that now that I am looking around, I am seeing that I have both react-aria and @react-aria in my node_modules. What is the difference?

[snowystinger]

react-aria is the mono package and should be used for ease of maintenance. Everything exported there has documentation and is guaranteed public API. @react-aria is the scope for all our aria logic. We have them all separated because of https://github.com/adobe/react-spectrum/blob/main/rfcs/2019-v3-versioning.md

using the @react-aria scoped packages directly is usually an advanced use case
the react-aria scope is just re-exporting from all the scoped packages.

the same pattern applies to stately

[BMCwebdev]

Thank you very much for the reply. I think I have some @react-aria because I am using the AriaToastRegionProps, useToast, useToastRegion and useViewportSize which perhaps are both not yet part of the react-aria release?

[snowystinger]

Correct, toast is in Beta https://react-spectrum.adobe.com/react-aria/useToast.html#usetoast as you can see from the documentation. When it's moved to a full release, it'll be added to the react-aria package.

useViewportSize should probably be added to the mono package given that we say you can use it https://react-spectrum.adobe.com/blog/building-a-combobox.html#onscreen-keyboard

though it doesn't actually have a documentation page, so it's in a bit of a limbo state, we'll have to decide if we actually want to expose it officially or remove that blog.