@handsontable/react-wrapper 0.0.0-next-0e9b178-20260922 → 0.0.0-next-e344f62-20260922

package/commonjs/react-handsontable.js

@@ -214,17 +214,17 @@ var bulkComponentContainer = null;
 /**
  * Warning message for the `autoRowSize`/`autoColumnSize` compatibility check.
  */
-var AUTOSIZE_WARNING = 'Your `HotTable` configuration includes `autoRowSize`/`autoColumnSize` options, which are not compatible with ' + ' the component-based renderers`. Disable `autoRowSize` and `autoColumnSize` to prevent row and column misalignment.';
+var AUTOSIZE_WARNING = 'Your `HotTable` configuration includes `autoRowSize`/`autoColumnSize` options, ' + 'which are not compatible with the component-based renderers. Disable `autoRowSize` and `autoColumnSize` to ' + 'prevent row and column misalignment.';
 
 /**
  * Warning message for the `hot-renderer` obsolete renderer passing method.
  */
-var OBSOLETE_HOTRENDERER_WARNING = 'Providing a component-based renderer using `hot-renderer`-annotated component is no longer supported. ' + 'Pass your component using `renderer` prop of the `HotTable` or `HotColumn` component instead.';
+var OBSOLETE_HOTRENDERER_WARNING = 'Providing a component-based renderer using `hot-renderer`-annotated ' + 'component is no longer supported. Pass your component using `renderer` prop of the `HotTable` or `HotColumn` ' + 'component instead.';
 
 /**
  * Warning message for the `hot-editor` obsolete editor passing method.
  */
-var OBSOLETE_HOTEDITOR_WARNING = 'Providing a component-based editor using `hot-editor`-annotated component is no longer supported. ' + 'Pass your component using `editor` prop of the `HotTable` or `HotColumn` component instead.';
+var OBSOLETE_HOTEDITOR_WARNING = 'Providing a component-based editor using `hot-editor`-annotated ' + 'component is no longer supported. Pass your component using `editor` prop of the `HotTable` or `HotColumn` ' + 'component instead.';
 
 /**
  * Warning message for the unexpected children of HotTable component.
@@ -255,7 +255,7 @@ var EDITOR_PORTAL_HOST_CLASSNAME = 'hot-wrapper-editor-portal-host';
 /**
  * Warning when the editor portal host cannot be moved into `rootPortalElement`.
  */
-var MISSING_ROOT_PORTAL_WARNING = 'The React editor portal host could not be attached to `rootPortalElement`. The editor stays on `document.body` and clicks on it may fail to commit.';
+var MISSING_ROOT_PORTAL_WARNING = 'The React editor portal host could not be attached to ' + '`rootPortalElement`. The editor stays on `document.body` and clicks on it may fail to commit.';
 
 /**
  * Logs warn to the console if the `console` object is exposed.
@@ -272,6 +272,7 @@ function warn() {
 /**
  * Detect if `hot-renderer` or `hot-editor` is defined, and if so, throw an incompatibility warning.
  *
+ * @param {ReactNode} children Component children nodes.
  * @returns {boolean} 'true' if the warning was issued
  */
 function displayObsoleteRenderersEditorsWarning(children) {
@@ -323,7 +324,7 @@ function displayAnyChildrenWarning(children) {
  * Check the existence of elements of the provided `type` from the `HotColumn` component's children.
  *
  * @param {ReactNode} children HotTable children array.
- * @param {String} type Either `'hot-renderer'` or `'hot-editor'`.
+ * @param {string} type Either `'hot-renderer'` or `'hot-editor'`.
  * @returns {boolean} `true` if the child of that type was found, `false` otherwise.
  */
 function hasChildElementOfType(children, type) {
@@ -403,9 +404,10 @@ function createEditorPortal(doc, Editor, portalHost) {
  *
  * @param {React.ReactElement} rElement React element to be used as a base for the component.
  * @param {Document} [ownerDocument] The owner document to set the portal up into.
- * @param {String} portalKey The key to be used for the portal.
+ * @param {string} portalKey The key to be used for the portal.
  * @param {HTMLElement} [cachedContainer] The cached container to be used for the portal.
- * @returns {{portal: ReactPortal, portalContainer: HTMLElement}} An object containing the portal and its container.
+ * @returns {{portal: ReactPortal, portalContainer: HTMLElement}} An object containing the portal and its
+ * container.
  */
 function createPortal(rElement) {
   var ownerDocument = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : document;
@@ -437,14 +439,15 @@ function createPortal(rElement) {
  * component.
  *
  * @param {HotTableProps} props Object containing the React element props.
- * @param {Boolean} randomizeId If set to `true`, the function will randomize the `id` property when no `id` was present in the `prop` object.
- * @returns An object containing the `id`, `className` and `style` keys, representing the corresponding props passed to the
- * component.
+ * @param {boolean} randomizeId If set to `true`, the function will randomize the `id` property when no `id` was
+ * present in the `prop` object.
+ * @returns {{id?: string, className: string, style: CSSProperties}} An object containing the `id`, `className`
+ * and `style` keys, representing the corresponding props passed to the component.
  */
 function getContainerAttributesProps(props) {
   var randomizeId = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
   return {
-    id: props.id || (randomizeId ? 'hot-' + Math.random().toString(36).substring(5) : undefined),
+    id: props.id || (randomizeId ? "hot-".concat(Math.random().toString(36).substring(5)) : undefined),
     className: props.className || '',
     style: props.style || {}
   };
@@ -453,14 +456,28 @@ function getContainerAttributesProps(props) {
 /**
  * Checks if the environment that the code runs in is a browser.
  *
- * @returns {boolean}
+ * @returns {boolean} `true` when running in a browser environment.
  */
 function isCSR() {
   return typeof window !== 'undefined';
 }
+
+/**
+ * Checks whether the value is an object or `null`.
+ *
+ * @param {unknown} value Value to check.
+ * @returns {boolean} `true` when the value is an object.
+ */
 function isObjectLike(value) {
   return _typeof(value) === 'object' && value !== null;
 }
+
+/**
+ * Checks whether the value is a plain object (an object literal or one created with `Object.create(null)`).
+ *
+ * @param {unknown} value Value to check.
+ * @returns {boolean} `true` when the value is a plain object.
+ */
 function isPlainObject(value) {
   if (!isObjectLike(value)) {
     return false;
@@ -468,6 +485,13 @@ function isPlainObject(value) {
   var prototype = Object.getPrototypeOf(value);
   return prototype === Object.prototype || prototype === null;
 }
+
+/**
+ * Checks whether the value is an array.
+ *
+ * @param {unknown} value Value to check.
+ * @returns {boolean} `true` when the value is an array.
+ */
 function isArray(value) {
   return Array.isArray(value);
 }
@@ -514,23 +538,16 @@ function areEquivalentSettingsValue(previousValue, currentValue) {
   if (previousKeys.length !== currentKeys.length) {
     return false;
   }
-  for (var _i = 0, _previousKeys = previousKeys; _i < _previousKeys.length; _i++) {
-    var key = _previousKeys[_i];
-    if (!Object.prototype.hasOwnProperty.call(currentValue, key)) {
-      return false;
-    }
-    if (!areEquivalentSettingsValue(previousValue[key], currentValue[key])) {
-      return false;
-    }
-  }
-  return true;
+  return previousKeys.every(function (key) {
+    return Object.prototype.hasOwnProperty.call(currentValue, key) && areEquivalentSettingsValue(previousValue[key], currentValue[key]);
+  });
 }
 
 /**
  * A variant of useEffect hook that does not trigger on initial mount, only updates
  *
- * @param effect Effect function
- * @param deps Effect dependencies
+ * @param {EffectCallback} effect Effect function
+ * @param {DependencyList} [deps] Effect dependencies
  */
 function useUpdateEffect(effect, deps) {
   var notInitialRender = React__default["default"].useRef(false);
@@ -574,11 +591,13 @@ var SettingsMapper = /*#__PURE__*/function () {
     /**
      * Parse component settings into Handsontable-compatible settings.
      *
-     * @param {Object} properties Object containing properties from the HotTable object.
-     * @param {Object} additionalSettings Additional settings.
+     * @param {object} properties Object containing properties from the HotTable object.
+     * @param {object} additionalSettings Additional settings.
      * @param {boolean} additionalSettings.isInit Flag determining whether the settings are being set during initialization.
      * @param {string[]} additionalSettings.initOnlySettingKeys Array of keys that can be set only during initialization.
-     * @returns {Object} Handsontable-compatible settings object.
+     * @param {HotTableProps} additionalSettings.prevProps The component's props before the current update.
+     * @param {Handsontable.GridSettings} additionalSettings.currentSettings The grid's current live settings.
+     * @returns {object} Handsontable-compatible settings object.
      */
     function getSettings(properties) {
       var _ref = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {},
@@ -607,11 +626,11 @@ var SettingsMapper = /*#__PURE__*/function () {
         return false;
       };
       var newSettings = {};
-      for (var key in properties) {
-        if (key !== 'children' && !shouldSkipProp(key) && properties.hasOwnProperty(key)) {
+      Object.keys(properties).forEach(function (key) {
+        if (key !== 'children' && !shouldSkipProp(key)) {
           newSettings[key] = properties[key];
         }
-      }
+      });
       return newSettings;
     }
   }]);
@@ -657,7 +676,7 @@ var HotTableContextProvider = function HotTableContextProvider(_ref) {
    * overlay tables get separate portal containers for the same cell.
    *
    * @param {HTMLTableCellElement} TD The cell being rendered.
-   * @returns {Number} The id of the table the cell belongs to.
+   * @returns {number} The id of the table the cell belongs to.
    */
   var getTableId = React.useCallback(function (TD) {
     var _TD$parentElement$par, _TD$parentElement;
@@ -768,7 +787,7 @@ var HotTableContextProvider = function HotTableContextProvider(_ref) {
 /**
  * Exposes the table context object to components
  *
- * @returns HotTableContext
+ * @returns {HotTableContextImpl} HotTableContext
  */
 function useHotTableContext() {
   return React.useContext(HotTableContext);
@@ -873,8 +892,11 @@ var EditorContext = /*#__PURE__*/React.createContext(undefined);
  * Provider of the context that exposes Handsontable-native editor instance and passes hooks object
  * for custom editor components.
  *
- * @param {Ref} hooksRef Reference for component-based editor overridden hooks object.
- * @param {RefObject} hotCustomEditorInstanceRef  Reference to Handsontable-native editor instance.
+ * @param {object} root0 The provider props.
+ * @param {Ref} root0.hooksRef Reference for component-based editor overridden hooks object.
+ * @param {RefObject} root0.hotCustomEditorInstanceRef Reference to Handsontable-native editor instance.
+ * @param {ReactNode} root0.children The provider's children.
+ * @returns {ReactElement} The provider component.
  */
 var EditorContextProvider = function EditorContextProvider(_ref3) {
   var hooksRef = _ref3.hooksRef,
@@ -889,7 +911,13 @@ var EditorContextProvider = function EditorContextProvider(_ref3) {
 };
 /**
  * Applies editor overlay position/dimensions to an element.
- * @returns true if position was applied, false if editor should close (e.g. cell no longer available).
+ *
+ * @param {HTMLElement} el The editor's main element.
+ * @param {EditorWithPosition} editor The editor instance.
+ * @param {Handsontable.Core} hot The Handsontable instance.
+ * @param {Element | null | undefined} td The edited cell's TD element.
+ * @returns {boolean} `true` if position was applied, `false` if editor should close (e.g. cell no longer
+ * available).
  */
 function applyEditorPosition(el, editor, hot, td) {
   var _rootWindow$pageXOffs, _rootWindow$pageYOffs;
@@ -1007,6 +1035,20 @@ function useHotEditor(overriddenHooks, deps) {
 
 // EditorComponent props - children typed to work with JSX syntax
 
+/**
+ * Component-based editor. Renders the `children` render prop inside the editor's positioned overlay
+ * and wires up its shortcuts and scroll-repositioning.
+ *
+ * @param {object} root0 The component props.
+ * @param {Function} [root0.onPrepare] Called when the editor is prepared for a cell.
+ * @param {Function} [root0.onClose] Called when the editor closes.
+ * @param {Function} [root0.onOpen] Called when the editor opens.
+ * @param {Function} [root0.onFocus] Called when the editor is focused.
+ * @param {EditorRenderProp} [root0.children] Render prop returning the editor's UI.
+ * @param {string} [root0.shortcutsGroup] The shortcuts group name to register under.
+ * @param {Array} [root0.shortcuts] The editor's keyboard shortcuts.
+ * @returns {React.ReactElement} The editor overlay element.
+ */
 function EditorComponent(_ref5) {
   var _onPrepare = _ref5.onPrepare,
     _onClose = _ref5.onClose,
@@ -1014,7 +1056,7 @@ function EditorComponent(_ref5) {
     _onFocus = _ref5.onFocus,
     children = _ref5.children,
     _ref5$shortcutsGroup = _ref5.shortcutsGroup,
-    shortcutsGroup = _ref5$shortcutsGroup === void 0 ? "custom-editor" : _ref5$shortcutsGroup,
+    shortcutsGroup = _ref5$shortcutsGroup === void 0 ? 'custom-editor' : _ref5$shortcutsGroup,
     shortcuts = _ref5.shortcuts;
   var mainElementRef = React.useRef(null);
   var currentValue = React.useRef(undefined);
@@ -1026,8 +1068,10 @@ function EditorComponent(_ref5) {
     hotCustomEditorInstanceRef = _ref6.hotCustomEditorInstanceRef;
   var registerShortcuts = React.useCallback(function () {
     var _hotCustomEditorInsta8, _hotCustomEditorInsta9, _hotCustomEditorInsta0;
-    if (!((_hotCustomEditorInsta8 = hotCustomEditorInstanceRef.current) !== null && _hotCustomEditorInsta8 !== void 0 && _hotCustomEditorInsta8.hot)) return;
-    (_hotCustomEditorInsta9 = hotCustomEditorInstanceRef.current) === null || _hotCustomEditorInsta9 === void 0 || (_hotCustomEditorInsta9 = _hotCustomEditorInsta9.hot) === null || _hotCustomEditorInsta9 === void 0 || _hotCustomEditorInsta9.getShortcutManager().setActiveContextName("editor");
+    if (!((_hotCustomEditorInsta8 = hotCustomEditorInstanceRef.current) !== null && _hotCustomEditorInsta8 !== void 0 && _hotCustomEditorInsta8.hot)) {
+      return;
+    }
+    (_hotCustomEditorInsta9 = hotCustomEditorInstanceRef.current) === null || _hotCustomEditorInsta9 === void 0 || (_hotCustomEditorInsta9 = _hotCustomEditorInsta9.hot) === null || _hotCustomEditorInsta9 === void 0 || _hotCustomEditorInsta9.getShortcutManager().setActiveContextName('editor');
     var shortcutManager = (_hotCustomEditorInsta0 = hotCustomEditorInstanceRef.current) === null || _hotCustomEditorInsta0 === void 0 || (_hotCustomEditorInsta0 = _hotCustomEditorInsta0.hot) === null || _hotCustomEditorInsta0 === void 0 ? void 0 : _hotCustomEditorInsta0.getShortcutManager();
     var editorContext = shortcutManager.getContext('editor');
     var contextConfig = {
@@ -1047,25 +1091,31 @@ function EditorComponent(_ref5) {
             }, event);
           }
         });
-      }),
-      //@ts-ignore
-      contextConfig);
+      }), contextConfig);
     }
   }, [shortcuts]);
   var unRegisterShortcuts = React.useCallback(function () {
     var _hotCustomEditorInsta1, _hotCustomEditorInsta10;
-    if (!((_hotCustomEditorInsta1 = hotCustomEditorInstanceRef.current) !== null && _hotCustomEditorInsta1 !== void 0 && _hotCustomEditorInsta1.hot)) return;
+    if (!((_hotCustomEditorInsta1 = hotCustomEditorInstanceRef.current) !== null && _hotCustomEditorInsta1 !== void 0 && _hotCustomEditorInsta1.hot)) {
+      return;
+    }
     var shortcutManager = (_hotCustomEditorInsta10 = hotCustomEditorInstanceRef.current) === null || _hotCustomEditorInsta10 === void 0 || (_hotCustomEditorInsta10 = _hotCustomEditorInsta10.hot) === null || _hotCustomEditorInsta10 === void 0 ? void 0 : _hotCustomEditorInsta10.getShortcutManager();
-    var editorContext = shortcutManager.getContext("editor");
+    var editorContext = shortcutManager.getContext('editor');
     editorContext.removeShortcutsByGroup(shortcutsGroup);
   }, [shortcuts]);
   var refreshDimensions = React.useCallback(function () {
     var editor = hotCustomEditorInstanceRef.current;
     var el = mainElementRef.current;
-    if (!editor || !el) return;
+    if (!editor || !el) {
+      return;
+    }
     var hot = editor.hot;
-    if (!hot) return;
-    if (typeof editor.isOpened !== 'function' || !editor.isOpened()) return;
+    if (!hot) {
+      return;
+    }
+    if (typeof editor.isOpened !== 'function' || !editor.isOpened()) {
+      return;
+    }
     if (!applyEditorPosition(el, editor, hot) && typeof editor.close === 'function') {
       editor.close();
     }
@@ -1073,23 +1123,31 @@ function EditorComponent(_ref5) {
   var unRegisterScrollHooks = React.useCallback(function () {
     var editor = hotCustomEditorInstanceRef.current;
     var hot = editor === null || editor === void 0 ? void 0 : editor.hot;
-    if (!hot || typeof hot.removeHook !== 'function') return;
+    if (!hot || typeof hot.removeHook !== 'function') {
+      return;
+    }
     hot.removeHook('afterScrollHorizontally', refreshDimensions);
     hot.removeHook('afterScrollVertically', refreshDimensions);
   }, [refreshDimensions]);
   var registerScrollHooks = React.useCallback(function () {
     var editor = hotCustomEditorInstanceRef.current;
     var hot = editor === null || editor === void 0 ? void 0 : editor.hot;
-    if (!hot || typeof hot.addHook !== 'function') return;
+    if (!hot || typeof hot.addHook !== 'function') {
+      return;
+    }
     hot.addHook('afterScrollHorizontally', refreshDimensions);
     hot.addHook('afterScrollVertically', refreshDimensions);
   }, [refreshDimensions]);
   var _useHotEditor = useHotEditor({
       onOpen: function onOpen() {
         var _hotCustomEditorInsta11;
-        if (!mainElementRef.current) return;
+        if (!mainElementRef.current) {
+          return;
+        }
         var themeName = (_hotCustomEditorInsta11 = hotCustomEditorInstanceRef.current) === null || _hotCustomEditorInsta11 === void 0 ? void 0 : _hotCustomEditorInsta11.hot.getCurrentThemeName();
-        if (themeName) setThemeClassName(themeName);
+        if (themeName) {
+          setThemeClassName(themeName);
+        }
         mainElementRef.current.style.display = 'block';
         _onOpen === null || _onOpen === void 0 || _onOpen();
         var el = mainElementRef.current;
@@ -1101,7 +1159,9 @@ function EditorComponent(_ref5) {
         registerScrollHooks();
       },
       onClose: function onClose() {
-        if (!mainElementRef.current) return;
+        if (!mainElementRef.current) {
+          return;
+        }
         mainElementRef.current.style.display = 'none';
         _onClose === null || _onClose === void 0 || _onClose();
         unRegisterShortcuts();
@@ -1180,7 +1240,7 @@ var HotColumn = function HotColumn(props) {
     /**
      * Filter out all the internal properties and return an object with just the Handsontable-related props.
      *
-     * @returns {Object}
+     * @returns {object}
      */
     var getSettingsProps = function getSettingsProps() {
       return Object.keys(props).filter(function (key) {
@@ -1193,6 +1253,8 @@ var HotColumn = function HotColumn(props) {
 
     /**
      * Create the column settings based on the data provided to the `HotColumn` component and its child components.
+     *
+     * @returns {object} The column settings object.
      */
     var createColumnSettings = function createColumnSettings() {
       var columnSettings = SettingsMapper.getSettings(getSettingsProps());
@@ -1235,21 +1297,7 @@ var HotColumn = function HotColumn(props) {
   }, editorPortal);
 };
 
-var version="0.0.0-next-0e9b178-20260922";
-
-/**
- * Component used to manage the renderer component portals.
- */
-var RenderersPortalManager = /*#__PURE__*/React.forwardRef(function (_, ref) {
-  var _useState = React.useState([]),
-    _useState2 = _slicedToArray(_useState, 2),
-    portals = _useState2[0],
-    setPortals = _useState2[1];
-  React.useImperativeHandle(ref, function () {
-    return setPortals;
-  });
-  return /*#__PURE__*/React__default["default"].createElement(React.Fragment, null, portals);
-});
+var version="0.0.0-next-e344f62-20260922";
 
 function getDefaultExportFromCjs (x) {
 	return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, 'default') ? x['default'] : x;
@@ -2374,6 +2422,20 @@ if (process.env.NODE_ENV !== 'production') {
 var propTypesExports = propTypes.exports;
 var PropTypes = /*@__PURE__*/getDefaultExportFromCjs(propTypesExports);
 
+/**
+ * Component used to manage the renderer component portals.
+ */
+var RenderersPortalManager = /*#__PURE__*/React.forwardRef(function (_, ref) {
+  var _useState = React.useState([]),
+    _useState2 = _slicedToArray(_useState, 2),
+    portals = _useState2[0],
+    setPortals = _useState2[1];
+  React.useImperativeHandle(ref, function () {
+    return setPortals;
+  });
+  return /*#__PURE__*/React__default["default"].createElement(React.Fragment, null, portals);
+});
+
 var HotTableInner = /*#__PURE__*/React.forwardRef(function (props, ref) {
   /**
    * Reference to the Handsontable instance.
@@ -2471,16 +2533,18 @@ var HotTableInner = /*#__PURE__*/React.forwardRef(function (props, ref) {
   /**
    * Create a new settings object containing the column settings and global editors and renderers.
    *
+   * @param {boolean} init `true` when called during the initial mount.
+   * @param {HotTableProps} previousProps The component's props before the current update.
    * @returns {Handsontable.GridSettings} New global set of settings for Handsontable.
    */
   var createNewGlobalSettings = function createNewGlobalSettings() {
     var _getHotInstance;
     var init = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
-    var prevProps = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+    var previousProps = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
     var liveSettings = !isHotInstanceDestroyed() ? (_getHotInstance = getHotInstance()) === null || _getHotInstance === void 0 ? void 0 : _getHotInstance.getSettings() : undefined;
     var initOnlySettingKeys = (liveSettings === null || liveSettings === void 0 ? void 0 : liveSettings._initOnlySettings) || [];
     var newSettings = SettingsMapper.getSettings(props, {
-      prevProps: prevProps,
+      prevProps: previousProps,
       isInit: init,
       initOnlySettingKeys: initOnlySettingKeys,
       currentSettings: liveSettings
@@ -2507,6 +2571,8 @@ var HotTableInner = /*#__PURE__*/React.forwardRef(function (props, ref) {
 
   /**
    * Detect if `autoRowSize` or `autoColumnSize` is defined, and if so, throw an incompatibility warning.
+   *
+   * @param {Handsontable | null} hotInstance The Handsontable instance to check.
    */
   var displayAutoSizeWarning = function displayAutoSizeWarning(hotInstance) {
     var _hotInstance$getPlugi, _hotInstance$getPlugi2;