adobe / adobe/react-spectrum

GridLayout's minSpace option has an unexpected/ambiguous behavior

Open
#9,869 5 comments 0 reactions 0 assignees View on GitHub
RAC
Dominant language
TypeScript
Stars
15.9k
Forks
1.6k
Avg merge
3d 9m
Merged PRs (30d)
59

Description

### Provide a general summary of the issue here

In Virtualizer's docs, the `GridLayout.minSpace` option is described as "The minimum space required between items.".

Due to the use of the word _between_, also used in the description of the `ListLayout.gap` option, I believe it is understood that this option would function like a CSS's grid layout (minimum) gap. But what happens is that this space is distributed between the inner _and_ outer margins of the grid.

### 🤔 Expected Behavior?

The `GridLayout.minSpace` option apply only inner gaps between the grid items.

### 😯 Current Behavior

The `GridLayout.minSpace` option is distributing its Size between inner _and_ outer gaps.

### 💁 Possible Solution

I don't know if this behavior was intentional, but would be really helpful to allow an option to apply only inner gaps on the grid, mimicking the CSS grid layout behavior.

### 🔦 Context

_No response_

### 🖥️ Steps to Reproduce

https://codesandbox.io/p/devbox/58q8x8?migrateFrom=9mk59p

### Version

RAC 1.16.0

### What browsers are you seeing the problem on?

Chrome

### If other, please specify.

_No response_

### What operating system are you using?

Windows 11

### 🧢 Your Company/Team

_No response_

### 🕷 Tracking Issue

_No response_

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.