adobe / react-spectrum

A collection of libraries and tools that help you build adaptive, accessible, and robust user experiences.
https://react-spectrum.adobe.com
Apache License 2.0
12.72k stars 1.09k forks source link

Refactor collection internals in preparation for public API #6608

Closed devongovett closed 3 months ago

devongovett commented 3 months ago

In preparation for exposing RAC's collection implementation publicly, this refactors the internals with a safer and less error-prone API that exposes fewer implementation details. It exposes a CollectionBuilder component (name tbd??) that takes care of rendering the collection in a hidden tree and exposing the built collection.

<CollectionBuilder content={children}>
  {collection => /* render stuff here */}
</CollectionBuilder>

This ensures that the order is always correct (the portal must be before the rendered content for SSR), and avoids exposing things like the internal document and other implementation details.

The content prop can be any React children, either direct collection elements (e.g. MenuItem) or other elements (in the case of Select and ComboBox). A <Collection> rendered inside starts a collection root and registers items with the collection owned by CollectionBuilder. Many collection components accept collection children and the items prop directly as a shortcut, so these render content={<Collection {...props} />}.

This will move to a separate package (out of RAC) so it can be used by hook users next. Wanted to do this refactor first so it's easier to review.

rspbot commented 3 months ago

Build successful! 🎉

rspbot commented 3 months ago
## API Changes unknown top level export { type: 'any' } unknown top level export { type: 'any' } unknown top level export { type: 'any' } unknown top level export { type: 'any' } unknown top level export { type: 'any', access: 'private' } unknown top level export { type: 'any', access: 'private' } unknown top level export { type: 'any' } unknown top level export { type: 'any' } unknown top level export { type: 'any' } unknown top level export { type: 'any' } unknown top level export { type: 'any' } unknown top level export { type: 'any' } unknown top level export { type: 'any' } unknown top level export { type: 'any' } unknown top level export { type: 'any' } unknown top level export { type: 'any' } unknown top level export { type: 'any' } unknown top level export { type: 'any' } unknown top level export { type: 'any' } unknown top level export { type: 'any' } unknown top level export { type: 'any' } unknown top level export { type: 'any' } unknown top level export { type: 'any' } unknown top level export { type: 'any' } unknown top level export { type: 'any' } unknown top level export { type: 'any' } unknown top level export { type: 'any' } unknown top level export { type: 'any' } unknown top level export { type: 'any' } unknown top level export { type: 'any' } unknown top level export { type: 'any' } unknown top level export { type: 'any' } unknown top level export { type: 'any' } unknown top level export { type: 'any' } unknown top level export { type: 'any' } unknown top level export { type: 'any' } unknown top level export { type: 'identifier', name: 'Column' } unknown top level export { type: 'identifier', name: 'Column' } unknown top level export { type: 'any' } unknown top level export { type: 'any' } unknown top level export { type: 'any' } unknown top level export { type: 'any' } unknown type { type: 'link' } unknown type { type: 'link' } unknown type { type: 'link' } unknown type { type: 'link' } unknown type { type: 'link' } unknown type { type: 'link' } unknown top level export { type: 'any' } unknown top level export { type: 'any' } unknown top level export { type: 'any' } unknown top level export { type: 'any' } unknown top level export { type: 'any' } unknown top level export { type: 'any' }