Issue in keyborad about reactdatagrid HOT 4 OPEN

Thanks for reporting, but this is not a valid bug report. Please attach a code sample and describe what you are doing. Thank you

from reactdatagrid.

Hi,

Sample Code

import React from 'react'

import ReactDataGrid from '@inovua/reactdatagrid-enterprise'
import '@inovua/reactdatagrid-enterprise/index.css'

import people from './people'
import flags from './flags'

const gridStyle = { minHeight: 550, maxWidth: 1000 };

const columns = [
{ defaultLocked: true, name: 'id', header: 'Id', defaultVisible: false, defaultWidth: 100, type: 'number' },
{ name: 'name', header: 'Name', defaultFlex: 1, minWidth: 450 ,editable:true},
{ name: 'country', header: 'Country', defaultFlex: 1, minWidth: 200,
render: ({ value }) => flags[value] ? flags[value] : value
},
{ name: 'city', header: 'City', defaultFlex: 1, minWidth: 450 ,editable:true},
{ defaultLocked: 'end', name: 'age', header: 'Age', minWidth: 100, type: 'number' }
]

const App = () => {
return (

export default () =>

from reactdatagrid.

Simulation

Click edit mode on name and press tab focus was moved but it was not visible in viewport.

from reactdatagrid.

The thing is you want scrolling when navigating between cells with tab-navigation, but this issue occurs when not enough space in the scrollable viewport and you have too many locked columns. Try keeping each column smaller in size than the non-locked viewport size.

from reactdatagrid.