Escape focus inside of GridList

[akeohanePing]

Hi there,

I am looking to implement a GridList that allows for inputs, and components with overlays, to be placed inside the GridListItems. This is working almost perfectly out of the box.

however there is an edgecase where when focus gets to an input, left and right keys move focus left and right instead of moving the curser left and right within the input.

Is it possible or advisable to wrap the textinput in a escape focus element, so that when going left and right through the row, focus gets to the wrapper, but not directly to the text input unless enter is pressed? Adjusting tab index does not seem to impact whether or not something can receive focus from left and right arrow keys.

my implementation is custom using the hooks from react-aria and react-stately, but is functionally nearly identical to this:

Thanks for your help and the excellent package.

Grid.jsx.pdf

[snowystinger]

Hi, thanks for the discussion. I'm not going to open a pdf attachment. Can you please either create a codesandbox, stackblitz or a github project that can be safely viewed?

Are you using the GridList prop keyboardNavigationBehavior="tab". This is the intended way for inputs to work inside GridList at this time.