Put a React Link Element Inside Your Grid Column - How? Example?

The example provided works great when you are using inline functions for the subcomponents:

<GridColumn field="Discontinued" cell={props => (
  <td>
    <input type="checkbox" checked={props.dataItem[props.field!]} />
  </td>
</GridColumn>

I tried to do it with a component. Here is the updated line from render() from above plus part of the component:

<GridColumn field="Discontinued" cell={checkboxColumn} />
//...
class checkboxColumn {
  render() {
    return (
      <td>
        <input type="checkbox" checked={this.props.dataItem[this.props.field]} />
      </td>
    );
  }
}

I can't seem to get the casting of "props" to work correctly. Maybe it is that I can't find the right way to specify the Kendo classes, or more likely I am not sure where to import them from.

class checkboxColumn extends Component<CheckboxProps, any> { /*...*/ }
//or
class checkboxColumn extends kendo.ComponentType<kedo.GridCellProps, any> { /*...*/ }

Hello, Eric,

The cell prop is accepting a React component. This can be both a functional component or a class component.

If there is a specific issue, please let us know and we will be happy to take a look.