nomcopter / react-mosaic

A React tiling window manager
https://nomcopter.github.io/react-mosaic/
Other
4.39k stars 226 forks source link

[Question] Attaching keyboard events for a mosaic window #196

Closed fmg-lydonchandra closed 2 years ago

fmg-lydonchandra commented 2 years ago

Hi, is there a nice way to capture keyboard events for a mosaic tile ?

One way is in renderTile, <div tabIndex={0} onKeyXxx={onKeyXxxHandler}> can wrap <MosaicWindow> and we can propagate the keyboard events manually. Must have tabIndex attribute to make <div> focusable

<div 
  role="presentation" 
  tabIndex={0} 
  onKeyDown={onKeyDownHandler} 
  onKeyUp={onKeyUpHandler}>

    <MosaicWindow<string>... />   
</div>
nomcopter commented 2 years ago

Your methodology seems fine - are there problems in practice?

fmg-lydonchandra commented 2 years ago

It's working OK in practice, checking if there is a better way. Thanks for your quick response Kevin.