@handsontable/react 9.0.2 → 11.1.0

package/es/react-handsontable.js

@@ -1,20 +1,15 @@
 import React from 'react';
 import ReactDOM from 'react-dom';
-import Handsontable from 'handsontable';
+import Handsontable from 'handsontable/base';
 
 function ownKeys(object, enumerableOnly) {
   var keys = Object.keys(object);
 
   if (Object.getOwnPropertySymbols) {
     var symbols = Object.getOwnPropertySymbols(object);
-
-    if (enumerableOnly) {
-      symbols = symbols.filter(function (sym) {
-        return Object.getOwnPropertyDescriptor(object, sym).enumerable;
-      });
-    }
-
-    keys.push.apply(keys, symbols);
+    enumerableOnly && (symbols = symbols.filter(function (sym) {
+      return Object.getOwnPropertyDescriptor(object, sym).enumerable;
+    })), keys.push.apply(keys, symbols);
   }
 
   return keys;
@@ -22,19 +17,12 @@ function ownKeys(object, enumerableOnly) {
 
 function _objectSpread2(target) {
   for (var i = 1; i < arguments.length; i++) {
-    var source = arguments[i] != null ? arguments[i] : {};
-
-    if (i % 2) {
-      ownKeys(Object(source), true).forEach(function (key) {
-        _defineProperty(target, key, source[key]);
-      });
-    } else if (Object.getOwnPropertyDescriptors) {
-      Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
-    } else {
-      ownKeys(Object(source)).forEach(function (key) {
-        Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
-      });
-    }
+    var source = null != arguments[i] ? arguments[i] : {};
+    i % 2 ? ownKeys(Object(source), !0).forEach(function (key) {
+      _defineProperty(target, key, source[key]);
+    }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) {
+      Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
+    });
   }
 
   return target;
@@ -43,17 +31,11 @@ function _objectSpread2(target) {
 function _typeof(obj) {
   "@babel/helpers - typeof";
 
-  if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") {
-    _typeof = function (obj) {
-      return typeof obj;
-    };
-  } else {
-    _typeof = function (obj) {
-      return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
-    };
-  }
-
-  return _typeof(obj);
+  return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) {
+    return typeof obj;
+  } : function (obj) {
+    return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
+  }, _typeof(obj);
 }
 
 function _classCallCheck(instance, Constructor) {
@@ -75,6 +57,9 @@ function _defineProperties(target, props) {
 function _createClass(Constructor, protoProps, staticProps) {
   if (protoProps) _defineProperties(Constructor.prototype, protoProps);
   if (staticProps) _defineProperties(Constructor, staticProps);
+  Object.defineProperty(Constructor, "prototype", {
+    writable: false
+  });
   return Constructor;
 }
 
@@ -105,6 +90,9 @@ function _inherits(subClass, superClass) {
       configurable: true
     }
   });
+  Object.defineProperty(subClass, "prototype", {
+    writable: false
+  });
   if (superClass) _setPrototypeOf(subClass, superClass);
 }
 
@@ -148,6 +136,8 @@ function _assertThisInitialized(self) {
 function _possibleConstructorReturn(self, call) {
   if (call && (typeof call === "object" || typeof call === "function")) {
     return call;
+  } else if (call !== void 0) {
+    throw new TypeError("Derived constructors may only return object or undefined");
   }
 
   return _assertThisInitialized(self);
@@ -183,6 +173,11 @@ var AUTOSIZE_WARNING = 'Your `HotTable` configuration includes `autoRowSize`/`au
  */
 
 var HOT_DESTROYED_WARNING = 'The Handsontable instance bound to this component was destroyed and cannot be' + ' used properly.';
+/**
+ * String identifier for the global-scoped editor components.
+ */
+
+var GLOBAL_EDITOR_SCOPE = 'global';
 /**
  * Default classname given to the wrapper container.
  */
@@ -297,10 +292,13 @@ function createEditorPortal() {
  *
  * @param {React.ReactNode} children Component children.
  * @param {Map} editorCache Component's editor cache.
+ * @param {string|number} [editorColumnScope] The editor scope (column index or a 'global' string). Defaults to
+ * 'global'.
  * @returns {React.ReactElement} An editor element containing the additional methods.
  */
 
 function getExtendedEditorElement(children, editorCache) {
+  var editorColumnScope = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : GLOBAL_EDITOR_SCOPE;
   var editorElement = getChildElementByType(children, 'hot-editor');
   var editorClass = getOriginalEditorClass(editorElement);
 
@@ -309,9 +307,15 @@ function getExtendedEditorElement(children, editorCache) {
   }
 
   return React.cloneElement(editorElement, {
-    emitEditorInstance: function emitEditorInstance(editorInstance) {
-      editorCache.set(editorClass, editorInstance);
+    emitEditorInstance: function emitEditorInstance(editorInstance, editorColumnScope) {
+      if (!editorCache.get(editorClass)) {
+        editorCache.set(editorClass, new Map());
+      }
+
+      var cacheEntry = editorCache.get(editorClass);
+      cacheEntry.set(editorColumnScope !== null && editorColumnScope !== void 0 ? editorColumnScope : GLOBAL_EDITOR_SCOPE, editorInstance);
     },
+    editorColumnScope: editorColumnScope,
     isEditor: true
   });
 }
@@ -515,7 +519,7 @@ var HotColumn = /*#__PURE__*/function (_React$Component) {
   }, {
     key: "getLocalEditorElement",
     value: function getLocalEditorElement() {
-      return getExtendedEditorElement(this.props.children, this.props._getEditorCache());
+      return getExtendedEditorElement(this.props.children, this.props._getEditorCache(), this.props._columnIndex);
     }
     /**
      * Create the column settings based on the data provided to the `HotColumn` component and it's child components.
@@ -540,7 +544,7 @@ var HotColumn = /*#__PURE__*/function (_React$Component) {
       }
 
       if (editorElement !== null) {
-        this.columnSettings.editor = this.props._getEditorClass(editorElement);
+        this.columnSettings.editor = this.props._getEditorClass(editorElement, this.props._columnIndex);
       } else if (this.hasProp('editor')) {
         this.columnSettings.editor = this.props.editor;
       } else {
@@ -560,7 +564,7 @@ var HotColumn = /*#__PURE__*/function (_React$Component) {
 
       var editorCache = this.props._getEditorCache();
 
-      var localEditorElement = getExtendedEditorElement(children, editorCache);
+      var localEditorElement = getExtendedEditorElement(children, editorCache, this.props._columnIndex);
 
       if (localEditorElement) {
         this.setLocalEditorPortal(createEditorPortal(this.props._getOwnerDocument(), localEditorElement, editorCache));
@@ -666,7 +670,7 @@ var PortalManager = /*#__PURE__*/function (_React$Component) {
   return PortalManager;
 }(React.Component);
 
-var version="9.0.2";
+var version="11.1.0";
 
 function createCommonjsModule(fn, module) {
 	return module = { exports: {} }, fn(module, module.exports), module.exports;
@@ -1164,12 +1168,14 @@ var objectAssign = shouldUseNative() ? Object.assign : function (target, source)
 var ReactPropTypesSecret$1 = 'SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED';
 var ReactPropTypesSecret_1 = ReactPropTypesSecret$1;
 
+var has$1 = Function.call.bind(Object.prototype.hasOwnProperty);
+
 var printWarning$1 = function printWarning() {};
 
 if (process.env.NODE_ENV !== 'production') {
   var ReactPropTypesSecret = ReactPropTypesSecret_1;
   var loggedTypeFailures = {};
-  var has$1 = Function.call.bind(Object.prototype.hasOwnProperty);
+  var has = has$1;
 
   printWarning$1 = function printWarning(text) {
     var message = 'Warning: ' + text;
@@ -1183,7 +1189,9 @@ if (process.env.NODE_ENV !== 'production') {
       // This error was thrown as a convenience so that you can use this stack
       // to find the callsite that caused this warning to fire.
       throw new Error(message);
-    } catch (x) {}
+    } catch (x) {
+      /**/
+    }
   };
 }
 /**
@@ -1202,7 +1210,7 @@ if (process.env.NODE_ENV !== 'production') {
 function checkPropTypes(typeSpecs, values, location, componentName, getStack) {
   if (process.env.NODE_ENV !== 'production') {
     for (var typeSpecName in typeSpecs) {
-      if (has$1(typeSpecs, typeSpecName)) {
+      if (has(typeSpecs, typeSpecName)) {
         var error; // Prop type validation may throw. In case they do, we don't want to
         // fail the render phase where it didn't fail before. So we log it.
         // After these have been cleaned up, we'll let them throw.
@@ -1211,7 +1219,7 @@ function checkPropTypes(typeSpecs, values, location, componentName, getStack) {
           // This is intentionally an invariant that gets caught. It's the same
           // behavior as without this statement except with a better message.
           if (typeof typeSpecs[typeSpecName] !== 'function') {
-            var err = Error((componentName || 'React class') + ': ' + location + ' type `' + typeSpecName + '` is invalid; ' + 'it must be a function, usually from the `prop-types` package, but received `' + _typeof(typeSpecs[typeSpecName]) + '`.');
+            var err = Error((componentName || 'React class') + ': ' + location + ' type `' + typeSpecName + '` is invalid; ' + 'it must be a function, usually from the `prop-types` package, but received `' + _typeof(typeSpecs[typeSpecName]) + '`.' + 'This often happens because of typos such as `PropTypes.function` instead of `PropTypes.func`.');
             err.name = 'Invariant Violation';
             throw err;
           }
@@ -1251,8 +1259,6 @@ checkPropTypes.resetWarningCache = function () {
 
 var checkPropTypes_1 = checkPropTypes;
 
-var has = Function.call.bind(Object.prototype.hasOwnProperty);
-
 var printWarning = function printWarning() {};
 
 if (process.env.NODE_ENV !== 'production') {
@@ -1356,6 +1362,7 @@ var factoryWithTypeCheckers = function factoryWithTypeCheckers(isValidElement, t
 
   var ReactPropTypes = {
     array: createPrimitiveTypeChecker('array'),
+    bigint: createPrimitiveTypeChecker('bigint'),
     bool: createPrimitiveTypeChecker('boolean'),
     func: createPrimitiveTypeChecker('function'),
     number: createPrimitiveTypeChecker('number'),
@@ -1403,8 +1410,9 @@ var factoryWithTypeCheckers = function factoryWithTypeCheckers(isValidElement, t
    */
 
 
-  function PropTypeError(message) {
+  function PropTypeError(message, data) {
     this.message = message;
+    this.data = data && _typeof(data) === 'object' ? data : {};
     this.stack = '';
   } // Make `instanceof Error` still work for returned errors.
 
@@ -1470,7 +1478,9 @@ var factoryWithTypeCheckers = function factoryWithTypeCheckers(isValidElement, t
         // check, but we can offer a more precise error message here rather than
         // 'of type `object`'.
         var preciseType = getPreciseType(propValue);
-        return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` of type ' + ('`' + preciseType + '` supplied to `' + componentName + '`, expected ') + ('`' + expectedType + '`.'));
+        return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` of type ' + ('`' + preciseType + '` supplied to `' + componentName + '`, expected ') + ('`' + expectedType + '`.'), {
+          expectedType: expectedType
+        });
       }
 
       return null;
@@ -1605,7 +1615,7 @@ var factoryWithTypeCheckers = function factoryWithTypeCheckers(isValidElement, t
       }
 
       for (var key in propValue) {
-        if (has(propValue, key)) {
+        if (has$1(propValue, key)) {
           var error = typeChecker(propValue, key, componentName, location, propFullName + '.' + key, ReactPropTypesSecret_1);
 
           if (error instanceof Error) {
@@ -1636,15 +1646,23 @@ var factoryWithTypeCheckers = function factoryWithTypeCheckers(isValidElement, t
     }
 
     function validate(props, propName, componentName, location, propFullName) {
+      var expectedTypes = [];
+
       for (var i = 0; i < arrayOfTypeCheckers.length; i++) {
         var checker = arrayOfTypeCheckers[i];
+        var checkerResult = checker(props, propName, componentName, location, propFullName, ReactPropTypesSecret_1);
 
-        if (checker(props, propName, componentName, location, propFullName, ReactPropTypesSecret_1) == null) {
+        if (checkerResult == null) {
           return null;
         }
+
+        if (checkerResult.data && has$1(checkerResult.data, 'expectedType')) {
+          expectedTypes.push(checkerResult.data.expectedType);
+        }
       }
 
-      return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` supplied to ' + ('`' + componentName + '`.'));
+      var expectedTypesMessage = expectedTypes.length > 0 ? ', expected one of type [' + expectedTypes.join(', ') + ']' : '';
+      return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` supplied to ' + ('`' + componentName + '`' + expectedTypesMessage + '.'));
     }
 
     return createChainableTypeChecker(validate);
@@ -1662,6 +1680,10 @@ var factoryWithTypeCheckers = function factoryWithTypeCheckers(isValidElement, t
     return createChainableTypeChecker(validate);
   }
 
+  function invalidValidatorError(componentName, location, propFullName, key, type) {
+    return new PropTypeError((componentName || 'React class') + ': ' + location + ' type `' + propFullName + '.' + key + '` is invalid; ' + 'it must be a function, usually from the `prop-types` package, but received `' + type + '`.');
+  }
+
   function createShapeTypeChecker(shapeTypes) {
     function validate(props, propName, componentName, location, propFullName) {
       var propValue = props[propName];
@@ -1674,8 +1696,8 @@ var factoryWithTypeCheckers = function factoryWithTypeCheckers(isValidElement, t
       for (var key in shapeTypes) {
         var checker = shapeTypes[key];
 
-        if (!checker) {
-          continue;
+        if (typeof checker !== 'function') {
+          return invalidValidatorError(componentName, location, propFullName, key, getPreciseType(checker));
         }
 
         var error = checker(propValue, key, componentName, location, propFullName + '.' + key, ReactPropTypesSecret_1);
@@ -1698,8 +1720,7 @@ var factoryWithTypeCheckers = function factoryWithTypeCheckers(isValidElement, t
 
       if (propType !== 'object') {
         return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` of type `' + propType + '` ' + ('supplied to `' + componentName + '`, expected `object`.'));
-      } // We need to check all keys in case some are required but missing from
-      // props.
+      } // We need to check all keys in case some are required but missing from props.
 
 
       var allKeys = objectAssign({}, props[propName], shapeTypes);
@@ -1707,6 +1728,10 @@ var factoryWithTypeCheckers = function factoryWithTypeCheckers(isValidElement, t
       for (var key in allKeys) {
         var checker = shapeTypes[key];
 
+        if (has$1(shapeTypes, key) && typeof checker !== 'function') {
+          return invalidValidatorError(componentName, location, propFullName, key, getPreciseType(checker));
+        }
+
         if (!checker) {
           return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` key `' + key + '` supplied to `' + componentName + '`.' + '\nBad object: ' + JSON.stringify(props[propName], null, '  ') + '\nValid keys: ' + JSON.stringify(Object.keys(shapeTypes), null, '  '));
         }
@@ -1905,6 +1930,7 @@ var factoryWithThrowingShims = function factoryWithThrowingShims() {
 
   var ReactPropTypes = {
     array: shim,
+    bigint: shim,
     bool: shim,
     func: shim,
     number: shim,
@@ -1948,6 +1974,7 @@ var propTypes = createCommonjsModule(function (module) {
     module.exports = factoryWithThrowingShims();
   }
 });
+var PropTypes = propTypes;
 
 /**
  * A Handsontable-ReactJS wrapper.
@@ -2223,15 +2250,20 @@ var HotTable = /*#__PURE__*/function (_React$Component) {
      * Create a fresh class to be used as an editor, based on the provided editor React element.
      *
      * @param {React.ReactElement} editorElement React editor component.
+     * @param {string|number} [editorColumnScope] The editor scope (column index or a 'global' string). Defaults to
+     * 'global'.
      * @returns {Function} A class to be passed to the Handsontable editor settings.
      */
 
   }, {
     key: "getEditorClass",
     value: function getEditorClass(editorElement) {
+      var _editorCache$get;
+
+      var editorColumnScope = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : GLOBAL_EDITOR_SCOPE;
       var editorClass = getOriginalEditorClass(editorElement);
       var editorCache = this.getEditorCache();
-      var cachedComponent = editorCache.get(editorClass);
+      var cachedComponent = (_editorCache$get = editorCache.get(editorClass)) === null || _editorCache$get === void 0 ? void 0 : _editorCache$get.get(editorColumnScope);
       return this.makeEditorClass(cachedComponent);
     }
     /**
@@ -2249,12 +2281,12 @@ var HotTable = /*#__PURE__*/function (_React$Component) {
 
         var _super2 = _createSuper(CustomEditor);
 
-        function CustomEditor(hotInstance, row, col, prop, TD, cellProperties) {
+        function CustomEditor(hotInstance) {
           var _this2;
 
           _classCallCheck(this, CustomEditor);
 
-          _this2 = _super2.call(this, hotInstance, row, col, prop, TD, cellProperties);
+          _this2 = _super2.call(this, hotInstance);
           editorComponent.hotCustomEditorInstance = _assertThisInitialized(_this2);
           _this2.editorComponent = editorComponent;
           return _this2;
@@ -2354,7 +2386,7 @@ var HotTable = /*#__PURE__*/function (_React$Component) {
       newSettings.columns = this.columnSettings.length ? this.columnSettings : newSettings.columns;
 
       if (globalEditorNode) {
-        newSettings.editor = this.getEditorClass(globalEditorNode);
+        newSettings.editor = this.getEditorClass(globalEditorNode, GLOBAL_EDITOR_SCOPE);
       } else {
         newSettings.editor = this.props.editor || (this.props.settings ? this.props.settings.editor : void 0);
       }
@@ -2377,7 +2409,9 @@ var HotTable = /*#__PURE__*/function (_React$Component) {
   }, {
     key: "displayAutoSizeWarning",
     value: function displayAutoSizeWarning(newGlobalSettings) {
-      if (this.hotInstance && (this.hotInstance.getPlugin('autoRowSize').enabled || this.hotInstance.getPlugin('autoColumnSize').enabled)) {
+      var _this$hotInstance$get, _this$hotInstance$get2;
+
+      if (this.hotInstance && ((_this$hotInstance$get = this.hotInstance.getPlugin('autoRowSize')) !== null && _this$hotInstance$get !== void 0 && _this$hotInstance$get.enabled || (_this$hotInstance$get2 = this.hotInstance.getPlugin('autoColumnSize')) !== null && _this$hotInstance$get2 !== void 0 && _this$hotInstance$get2.enabled)) {
         if (this.componentRendererColumns.size > 0) {
           warn(AUTOSIZE_WARNING);
         }
@@ -2396,21 +2430,21 @@ var HotTable = /*#__PURE__*/function (_React$Component) {
       this.columnSettings[columnIndex] = columnSettings;
     }
     /**
-     * Handsontable's `beforeRender` hook callback.
+     * Handsontable's `beforeViewRender` hook callback.
      */
 
   }, {
-    key: "handsontableBeforeRender",
-    value: function handsontableBeforeRender() {
+    key: "handsontableBeforeViewRender",
+    value: function handsontableBeforeViewRender() {
       this.getRenderedCellCache().clear();
     }
     /**
-     * Handsontable's `afterRender` hook callback.
+     * Handsontable's `afterViewRender` hook callback.
      */
 
   }, {
-    key: "handsontableAfterRender",
-    value: function handsontableAfterRender() {
+    key: "handsontableAfterViewRender",
+    value: function handsontableAfterViewRender() {
       var _this3 = this;
 
       this.portalManager.setState(function () {
@@ -2471,11 +2505,11 @@ var HotTable = /*#__PURE__*/function (_React$Component) {
       var hotTableComponent = this;
       var newGlobalSettings = this.createNewGlobalSettings();
       this.hotInstance = new Handsontable.Core(this.hotElementRef, newGlobalSettings);
-      this.hotInstance.addHook('beforeRender', function (isForced) {
-        hotTableComponent.handsontableBeforeRender();
+      this.hotInstance.addHook('beforeViewRender', function (isForced) {
+        hotTableComponent.handsontableBeforeViewRender();
       });
-      this.hotInstance.addHook('afterRender', function () {
-        hotTableComponent.handsontableAfterRender();
+      this.hotInstance.addHook('afterViewRender', function () {
+        hotTableComponent.handsontableAfterViewRender();
       }); // `init` missing in Handsontable's type definitions.
 
       this.hotInstance.init();
@@ -2579,9 +2613,9 @@ var HotTable = /*#__PURE__*/function (_React$Component) {
 
 
 HotTable.propTypes = {
-  style: propTypes.object,
-  id: propTypes.string,
-  className: propTypes.string
+  style: PropTypes.object,
+  id: PropTypes.string,
+  className: PropTypes.string
 };
 
 var BaseEditorComponent = /*#__PURE__*/function (_React$Component) {
@@ -2609,7 +2643,7 @@ var BaseEditorComponent = /*#__PURE__*/function (_React$Component) {
     _this.hot = null;
 
     if (props.emitEditorInstance) {
-      props.emitEditorInstance(_assertThisInitialized(_this));
+      props.emitEditorInstance(_assertThisInitialized(_this), props.editorColumnScope);
     }
 
     return _this;
@@ -2886,5 +2920,4 @@ var BaseEditorComponent = /*#__PURE__*/function (_React$Component) {
   return BaseEditorComponent;
 }(React.Component);
 
-export default HotTable;
-export { BaseEditorComponent, HotColumn, HotTable };
+export { BaseEditorComponent, HotColumn, HotTable, HotTable as default };

package/helpers.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { HotEditorElement } from './types';
+import { HotEditorCache, HotEditorElement } from './types';
 /**
  * Warning message for the `autoRowSize`/`autoColumnSize` compatibility check.
  */
@@ -8,6 +8,10 @@ export declare const AUTOSIZE_WARNING: string;
  * Message for the warning thrown if the Handsontable instance has been destroyed.
  */
 export declare const HOT_DESTROYED_WARNING: string;
+/**
+ * String identifier for the global-scoped editor components.
+ */
+export declare const GLOBAL_EDITOR_SCOPE = "global";
 /**
  * Logs warn to the console if the `console` object is exposed.
  *
@@ -44,15 +48,17 @@ export declare function removeEditorContainers(doc?: Document): void;
  * @param {Map} editorCache The editor cache reference.
  * @returns {React.ReactPortal} The portal for the editor.
  */
-export declare function createEditorPortal(doc: Document, editorElement: HotEditorElement, editorCache: Map<Function, React.Component>): React.ReactPortal;
+export declare function createEditorPortal(doc: Document, editorElement: HotEditorElement, editorCache: HotEditorCache): React.ReactPortal;
 /**
  * Get an editor element extended with a instance-emitting method.
  *
  * @param {React.ReactNode} children Component children.
  * @param {Map} editorCache Component's editor cache.
+ * @param {string|number} [editorColumnScope] The editor scope (column index or a 'global' string). Defaults to
+ * 'global'.
  * @returns {React.ReactElement} An editor element containing the additional methods.
  */
-export declare function getExtendedEditorElement(children: React.ReactNode, editorCache: Map<Function, object>): React.ReactElement | null;
+export declare function getExtendedEditorElement(children: React.ReactNode, editorCache: HotEditorCache, editorColumnScope?: string | number): React.ReactElement | null;
 /**
  * Create a react component and render it to an external DOM done.
  *

package/hotColumn.d.ts

@@ -1,6 +1,6 @@
 import React, { ReactPortal } from 'react';
 import { HotTableProps, HotColumnProps } from './types';
-import Handsontable from 'handsontable';
+import Handsontable from 'handsontable/base';
 declare class HotColumn extends React.Component<HotColumnProps, {}> {
     internalProps: string[];
     columnSettings: Handsontable.ColumnSettings;

package/hotTable.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
-import Handsontable from 'handsontable';
+import Handsontable from 'handsontable/base';
 import { PortalManager } from './portalManager';
-import { HotTableProps, HotEditorElement } from './types';
+import { HotTableProps, HotEditorElement, HotEditorCache, EditorScopeIdentifier } from './types';
 /**
  * A Handsontable-ReactJS wrapper.
  *
@@ -138,7 +138,7 @@ declare class HotTable extends React.Component<HotTableProps, {}> {
      *
      * @returns {Map}
      */
-    getEditorCache(): Map<Function, React.Component>;
+    getEditorCache(): HotEditorCache;
     /**
      * Get the global editor portal property.
      *
@@ -173,14 +173,16 @@ declare class HotTable extends React.Component<HotTableProps, {}> {
      * @param {React.ReactElement} rendererElement React renderer component.
      * @returns {Handsontable.renderers.Base} The Handsontable rendering function.
      */
-    getRendererWrapper(rendererElement: React.ReactElement): Handsontable.renderers.Base | any;
+    getRendererWrapper(rendererElement: React.ReactElement): typeof Handsontable.renderers.BaseRenderer | any;
     /**
      * Create a fresh class to be used as an editor, based on the provided editor React element.
      *
      * @param {React.ReactElement} editorElement React editor component.
+     * @param {string|number} [editorColumnScope] The editor scope (column index or a 'global' string). Defaults to
+     * 'global'.
      * @returns {Function} A class to be passed to the Handsontable editor settings.
      */
-    getEditorClass(editorElement: HotEditorElement): typeof Handsontable.editors.BaseEditor;
+    getEditorClass(editorElement: HotEditorElement, editorColumnScope?: EditorScopeIdentifier): typeof Handsontable.editors.BaseEditor;
     /**
      * Create a class to be passed to the Handsontable's settings.
      *
@@ -227,13 +229,13 @@ declare class HotTable extends React.Component<HotTableProps, {}> {
      */
     setHotColumnSettings(columnSettings: Handsontable.ColumnSettings, columnIndex: number): void;
     /**
-     * Handsontable's `beforeRender` hook callback.
+     * Handsontable's `beforeViewRender` hook callback.
      */
-    handsontableBeforeRender(): void;
+    handsontableBeforeViewRender(): void;
     /**
-     * Handsontable's `afterRender` hook callback.
+     * Handsontable's `afterViewRender` hook callback.
      */
-    handsontableAfterRender(): void;
+    handsontableAfterViewRender(): void;
     /**
      * Call the `updateSettings` method for the Handsontable instance.
      *

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@handsontable/react",
-  "version": "9.0.2",
+  "version": "11.1.0",
   "description": "Best Data Grid for React with Spreadsheet Look and Feel.",
   "author": "Handsoncode <hello@handsoncode.net> (https://handsoncode.net)",
   "homepage": "https://handsontable.com",
@@ -64,27 +64,27 @@
     "enzyme": "^3.10.0",
     "enzyme-adapter-react-16": "^1.14.0",
     "enzyme-to-json": "^3.4.0",
-    "handsontable": "^9.0.0",
+    "handsontable": "^11.0.0",
     "jest": "^25.1.0",
     "prop-types": "^15.7.2",
     "react": "^16.10.2",
     "react-dom": "^16.10.2",
     "react-redux": "^7.1.1",
     "redux": "^4.0.4",
-    "rollup": "^2.0.0",
+    "rollup": "^2.58.0",
     "rollup-plugin-alias": "^1.5.2",
     "rollup-plugin-babel": "^4.3.3",
     "rollup-plugin-commonjs": "^10.0.1",
     "rollup-plugin-json": "^4.0.0",
     "rollup-plugin-node-resolve": "^5.2.0",
     "rollup-plugin-replace": "^2.2.0",
-    "rollup-plugin-typescript2": "^0.22.1",
     "rollup-plugin-terser": "^7.0.2",
+    "rollup-plugin-typescript2": "^0.22.1",
     "typescript": "3.8.2",
     "uglify-js": "^3.4.9"
   },
   "peerDependencies": {
-    "handsontable": ">=9.0.0"
+    "handsontable": ">=11.0.0"
   },
   "scripts": {
     "build": "npm run clean && npm run build:commonjs && npm run build:es && npm run build:umd && npm run build:min",

package/settingsMapper.d.ts

@@ -1,4 +1,4 @@
-import Handsontable from 'handsontable';
+import Handsontable from 'handsontable/base';
 import { HotTableProps } from './types';
 export declare class SettingsMapper {
     /**

package/types.d.ts

@@ -1,10 +1,18 @@
-import Handsontable from 'handsontable';
+import Handsontable from 'handsontable/base';
 import React from 'react';
 import { ConnectedComponent } from 'react-redux';
 /**
  * Type of the editor component's ReactElement.
  */
 export declare type HotEditorElement = React.ReactElement<{}, ConnectedComponent<React.FunctionComponent, any> | any>;
+/**
+ * Type of the identifier under which the cached editor components are stored.
+ */
+export declare type EditorScopeIdentifier = 'global' | number;
+/**
+ * Type of the cache map for the Handsontable editor components.
+ */
+export declare type HotEditorCache = Map<Function, Map<EditorScopeIdentifier, React.Component>>;
 /**
  * Interface for the `prop` of the HotTable component - extending the default Handsontable settings with additional,
  * component-related properties.
@@ -33,9 +41,9 @@ export interface HotColumnProps extends Handsontable.ColumnSettings {
     _emitColumnSettings?: (columnSettings: Handsontable.ColumnSettings, columnIndex: number) => void;
     _columnIndex?: number;
     _getChildElementByType?: (children: React.ReactNode, type: string) => React.ReactElement;
-    _getRendererWrapper?: (rendererNode: React.ReactElement) => Handsontable.renderers.Base;
-    _getEditorClass?: (editorElement: React.ReactElement) => typeof Handsontable.editors.BaseEditor;
-    _getEditorCache?: () => Map<Function, React.Component>;
+    _getRendererWrapper?: (rendererNode: React.ReactElement) => typeof Handsontable.renderers.BaseRenderer;
+    _getEditorClass?: (editorElement: React.ReactElement, editorColumnScope: EditorScopeIdentifier) => typeof Handsontable.editors.BaseEditor;
+    _getEditorCache?: () => HotEditorCache;
     _getOwnerDocument?: () => Document;
     children?: React.ReactNode;
 }