feat: add maxSpace option to @react-stately/layout GridLayout

[e-krebs]

Closes #8655

✅ Pull Request Checklist:

• Included link to corresponding React Spectrum GitHub Issue.
• Added/updated unit tests and storybook for this change (for new code or code which already has tests).
  • I added updated an existing storybook with using that option
  • I didn't find existing test for this file
• Filled out test instructions.
• Updated documentation (if it already exists for this component).
  • from what I can see, running docs locally automatically updated them, so I guess nothing more is necessary?
• Looked at the Accessibility Practices for this feature - Aria Practices
  • not applicable here?

📝 Test Instructions:

Run the storybook (locally)
Under "React Aria Components > GridList > Virtualized Grid List Grid"

before (without maxSpace)	after (with maxSpace: 5)

you can also test for more complex combination by modifying the layoutOptions.
For example with layoutOptions:

{
  minItemSize: new Size(40, 40),
  maxItemSize: new Size(65, 40),
  maxColumns: 3
}

before (without maxSpace)	after (with maxSpace: 5)

🧢 Your Project:

Algolia Visual Editor is available in the Algolia Dashboard & allows to create Rules to curate results for specific queries.
It makes use of Drag & Drop capabilities to allow to "pin" records to specific position (see example around 1min20s in this video)
we're currently in the process of migrating our existing drag & drop library (and virtualizer) to use react-aria-components.
In order to be able to consistently render grids of records across many pages in the Algolia Dashboard, we need to have a fixed gap between grid items. maxSpace will unlock this possibility without having to resort to artificially reduce the Virtualizer width with additional pre-computations

[LFDanLu]

This seems reasonable to me, sounds like a good idea to add to other applicable layouts (Waterfall). Not a call to action though, we can focus on just GridLayout for this PR.

[LFDanLu]

should this perhaps mirror minSpace by also determining the maximum vertical spacing between the items in the Grid?

[e-krebs]

I thought about it (and happy to do it), but currently minSpace height value is effectively used as the vertical spacing value (not minimum nor maximum), so I wouldn't know what to do with the added maxSpace.height

[LFDanLu]

yeah, it certainly does feel a bit silly since the vertical spacing is always determined by the user unlike the horizontal spacing which depends on the item size/container width etc. Off the top of my head, I'd imagine we either change the name of maxSpace to reflect that it only applies for the horizontal spacing OR we keep the name and have it take it take a Size for consistency.

Leaning towards the first one personally if only to avoid having to do Math.min(maxSpace.height, minSpace.height) (again, silly because the user provides both)

[e-krebs]

I renamed the parameter maxHorizontalSize

[LFDanLu]

Also, would you mind signing the CLA? See the CI check below

[e-krebs]

Also, would you mind signing the CLA? See the CI check below

Yep, I'm on it with legal on my side 😉

[LFDanLu]

Thanks for signing the CLA! Things look good to me, will see about getting another pair of eyes on this

[reidbarber]

LGTM, thanks for the thorough description!