React-select: multi-select not working with fixed-data-table

[anandrikka]

I have simply included React-Multiselect inside a cell in fixed-data-table, but when clicking on options, options are hidden inside cell and are not displayed properly.

MultiSelectCell = ({rowIndex, col, data, roles, ...props}) => {
    const ROLES = [
      { label: 'one', value: '1' },
      { label: 'two', value: '2' },
      { label: 'three', value: '3' },
      { label: 'four', value: '4' },
      { label: 'five', value: '5' },
      { label: 'six', value: '6' },
    ]
    const values = []
    return (
      <Cell {...props}>
        <Select
          multi
          value={values}
          placeholder="Select your role(s)"
          options={ROLES} /> 
      </Cell>
    )
  }

[agirton]

Hi @anandrikka it sounds like the Cell has some styling of overflow hidden which means the options won't overflow. We don't currently support rendering the options list in a portal and then positioning it below the input.