Cannot be used with react-window FixedSizeGrid

[Emily-0616]

When I use react-window FixedSizeGrid, adding SelectionArea with innerElementType will cause drag and drop to fail to scroll the page or drag and drop to remain selected。

The structure of the component will look like :

<AutoSizer>
  {({ height, width }) => {
    return (
      <FixedSizeGrid
         rowCount={rowCount}
         columnCount={columnCount}
         columnWidth={columnWidth}
         rowHeight={rowHeight}
         height={height}
         width={width}
         itemData={itemData}
         innerElementType={innerElementType}
       >
         {Row}
       </FixedSizeGrid>
     );
   };
 }
</AutoSizer>

  const innerElementType = forwardRef(({ style, children },ref) => {
    return (
      <div
        style={{display:'flex',...style}}
      >
        <SelectionArea
          className="selectionContainer"
          // onStart={onStart}
          // onMove={onMove}
          selectables=".selectable"
        >
          {children}
        </SelectionArea>
      </div>
    );
  });

.selectionContainer {
     user-select: none;
     flex       : 1;
}

[simonwep]

Hey! Since you're using not only react but also another third-party library - could you create a code-sandbox reproduction? I'll help me understand your environment and what exactly might went wrong :)

[simonwep]

Closed due to inactivity. Please create a new issue if you believe this is a mistake :)