Pressing Tab while editing, control goes to browser. Expect to move to next cell

Suite and Optimus Suite 6
#1

Here is my code to create grid

grid = new GridDHX(gridContainer.current, {
columns: props.columns,
data: props.data,
adjust: true,
editable: true,
autoEmptyRow: true,
autoWidth: true,
selection: “cell”,
enableEditEvents: true
});

And Modified click event for editing

  grid.current.events.on("CellClick", function(
    row,
    column,
    e
  ) {
    grid.editCell(row.id, column.id);
  });
}

I want tab should take next cell and become editable. I tried below code to end editing while pressing tab

grid.events.on(“beforeKeyDown”, function (e) {
if (e.key === “Tab”) {

        grid.editEnd()
      }

    })
#2

we have added the key navigation in the dhtmlxGrid, so the TAB should work correctly now:
https://docs.dhtmlx.com/suite/grid__api__grid_keynavigation_config.html
Here is the sample:
https://docs.dhtmlx.com/suite/samples/grid/02_configuration/21_key_navigation.html