feat: Allow overriding individual components

src/cellmanager.js

@@ -788,7 +788,7 @@ export default class CellManager {
             isHeader ? 'dt-cell--header' : '',
             isHeader ? `dt-cell--header-${colIndex}` : '',
             isFilter ? 'dt-cell--filter' : '',
-            isBodyCell && row.meta.isTreeNodeClose ? 'dt-cell--tree-close' : ''
+            isBodyCell && (row && row.meta.isTreeNodeClose) ? 'dt-cell--tree-close' : ''
         ].join(' ');
 
         return `

src/datatable.js

@@ -8,6 +8,16 @@ import Style from './style';
 import Keyboard from './keyboard';
 import DEFAULT_OPTIONS from './defaults';
 
+let defaultComponents = {
+    DataManager,
+    CellManager,
+    ColumnManager,
+    RowManager,
+    BodyRenderer,
+    Style,
+    Keyboard
+};
+
 class DataTable {
     constructor(wrapper, options) {
         DataTable.instances++;
@@ -23,14 +33,7 @@ class DataTable {
 
         this.buildOptions(options);
         this.prepare();
-
-        this.style = new Style(this);
-        this.keyboard = new Keyboard(this.wrapper);
-        this.datamanager = new DataManager(this.options);
-        this.rowmanager = new RowManager(this);
-        this.columnmanager = new ColumnManager(this);
-        this.cellmanager = new CellManager(this);
-        this.bodyRenderer = new BodyRenderer(this);
+        this.initializeComponents();
 
         if (this.options.data) {
             this.refresh();
@@ -66,6 +69,27 @@ class DataTable {
         this.unfreeze();
     }
 
+    initializeComponents() {
+        let components = Object.assign({}, defaultComponents, this.options.overrideComponents);
+        let {
+            Style,
+            Keyboard,
+            DataManager,
+            RowManager,
+            ColumnManager,
+            CellManager,
+            BodyRenderer
+        } = components;
+
+        this.style = new Style(this);
+        this.keyboard = new Keyboard(this.wrapper);
+        this.datamanager = new DataManager(this.options);
+        this.rowmanager = new RowManager(this);
+        this.columnmanager = new ColumnManager(this);
+        this.cellmanager = new CellManager(this);
+        this.bodyRenderer = new BodyRenderer(this);
+    }
+
     prepareDom() {
         this.wrapper.innerHTML = `
             <div class="datatable" dir="${this.options.direction}">

src/defaults.js

@@ -46,6 +46,9 @@ export default {
         desc: '↓',
         none: ''
     },
+    overrideComponents: {
+        // ColumnManager: CustomColumnManager
+    },
     filterRows: filterRows,
     freezeMessage: '',
     getEditor: null,