Handsontable for React is now 3.1.0

Today we’re releasing version 3.1.0 of the Handsontable wrapper for React. It introduces a new component – <HotColumn>, as well as other useful improvements.

From version 3.1.0 onward, it will be possible to declare Handsontable settings with the aforementioned <HotColumn> component.

What could be previously implemented as:

<HotTable
  settings={{
    rowHeaders: true,
    colHeaders: true,
    columns: [
      {
        width: 150,
        readOnly: true
        renderer: function() {
          // renderer logic here
        }
      },
      {
        width: 100,
        editor: SomeEditorClass
      }
    ]
  }}
/>

Can now be set up this way:

<HotTable settings={{rowHeaders: true, colHeaders: true}}>
  <HotColumn settings={{width: 150, readOnly: true}}>
    <SomeRendererComponent hot-renderer></SomeRendererComponent>
  </HotColumn>
  <HotColumn width={100}>
    <SomeEditorComponent hot-editor></SomeEditorComponent>
  </HotColumn>
</HotTable>

Another feature shipped with this release is the possibility to create custom renderers and editors using the native React components. Read more about it in our documentation.

Here’s a sneak peak of the new wrapper capabilities:

Follow us on X to keep up with news and updates.

Write to us if you have any questions.