handsontable 12.3.3 → 12.4.0-next-acb5d99-20230512

package/core.js

@@ -107,7 +107,7 @@ var deprecationWarns = new Set();
  * :::
  *
  * ::: only-for react
- * ```jsx{3,7,13}
+ * ```jsx
  * import { useRef } from 'react';
  *
  * const hotTableComponent = useRef(null);
@@ -263,6 +263,12 @@ function Core(rootElement, userSettings) {
    * @type {IndexMapper}
    */
   this.rowIndexMapper = new _translations.IndexMapper();
+  this.columnIndexMapper.addLocalHook('indexesSequenceChange', function (source) {
+    instance.runHooks('afterColumnSequenceChange', source);
+  });
+  this.rowIndexMapper.addLocalHook('indexesSequenceChange', function (source) {
+    instance.runHooks('afterRowSequenceChange', source);
+  });
   dataSource = new _dataSource.default(instance);
   if (!this.rootElement.id || this.rootElement.id.substring(0, 3) === 'ht_') {
     this.rootElement.id = this.guid; // if root element does not have an id, assign a random id
@@ -2442,11 +2448,13 @@ function Core(rootElement, userSettings) {
   };
 
   /**
-   * Get value from the selected cell.
+   * Gets the value of the currently focused cell.
+   *
+   * For column headers and row headers, returns `null`.
    *
    * @memberof Core#
    * @function getValue
-   * @returns {*} Value of selected cell.
+   * @returns {*} The value of the focused cell.
    */
   this.getValue = function () {
     var sel = instance.getSelectedLast();
@@ -2789,6 +2797,11 @@ function Core(rootElement, userSettings) {
    * __Note__: This method does not participate in data transformation. If the visual data of the table is reordered,
    * sorted or trimmed only physical indexes are correct.
    *
+   * __Note__: This method may return incorrect values for cells that contain
+   * [formulas](@/guides/formulas/formula-calculation.md). This is because `getSourceData()`
+   * operates on source data ([physical indexes](@/api/indexMapper.md)),
+   * whereas formulas operate on visual data (visual indexes).
+   *
    * @memberof Core#
    * @function getSourceData
    * @param {number} [row] From physical row index.
@@ -3138,7 +3151,13 @@ function Core(rootElement, userSettings) {
   };
 
   /**
-   * Checks if the data format and config allows user to modify the column structure.
+   * Checks if your [data format](@/guides/getting-started/binding-to-data.md#compatible-data-types)
+   * and [configuration options](@/guides/getting-started/configuration-options.md)
+   * allow for changing the number of columns.
+   *
+   * Returns `false` when your data is an array of objects,
+   * or when you use the [`columns`](@/api/options.md#columns) option.
+   * Otherwise, returns `true`.
    *
    * @memberof Core#
    * @function isColumnModificationAllowed
@@ -4104,8 +4123,6 @@ function Core(rootElement, userSettings) {
     if (datamap) {
       datamap.destroy();
     }
-    instance.rowIndexMapper = null;
-    instance.columnIndexMapper = null;
     datamap = null;
     grid = null;
     selection = null;

package/core.mjs

@@ -102,7 +102,7 @@ var deprecationWarns = new Set();
  * :::
  *
  * ::: only-for react
- * ```jsx{3,7,13}
+ * ```jsx
  * import { useRef } from 'react';
  *
  * const hotTableComponent = useRef(null);
@@ -258,6 +258,12 @@ export default function Core(rootElement, userSettings) {
    * @type {IndexMapper}
    */
   this.rowIndexMapper = new IndexMapper();
+  this.columnIndexMapper.addLocalHook('indexesSequenceChange', function (source) {
+    instance.runHooks('afterColumnSequenceChange', source);
+  });
+  this.rowIndexMapper.addLocalHook('indexesSequenceChange', function (source) {
+    instance.runHooks('afterRowSequenceChange', source);
+  });
   dataSource = new DataSource(instance);
   if (!this.rootElement.id || this.rootElement.id.substring(0, 3) === 'ht_') {
     this.rootElement.id = this.guid; // if root element does not have an id, assign a random id
@@ -2437,11 +2443,13 @@ export default function Core(rootElement, userSettings) {
   };
 
   /**
-   * Get value from the selected cell.
+   * Gets the value of the currently focused cell.
+   *
+   * For column headers and row headers, returns `null`.
    *
    * @memberof Core#
    * @function getValue
-   * @returns {*} Value of selected cell.
+   * @returns {*} The value of the focused cell.
    */
   this.getValue = function () {
     var sel = instance.getSelectedLast();
@@ -2784,6 +2792,11 @@ export default function Core(rootElement, userSettings) {
    * __Note__: This method does not participate in data transformation. If the visual data of the table is reordered,
    * sorted or trimmed only physical indexes are correct.
    *
+   * __Note__: This method may return incorrect values for cells that contain
+   * [formulas](@/guides/formulas/formula-calculation.md). This is because `getSourceData()`
+   * operates on source data ([physical indexes](@/api/indexMapper.md)),
+   * whereas formulas operate on visual data (visual indexes).
+   *
    * @memberof Core#
    * @function getSourceData
    * @param {number} [row] From physical row index.
@@ -3133,7 +3146,13 @@ export default function Core(rootElement, userSettings) {
   };
 
   /**
-   * Checks if the data format and config allows user to modify the column structure.
+   * Checks if your [data format](@/guides/getting-started/binding-to-data.md#compatible-data-types)
+   * and [configuration options](@/guides/getting-started/configuration-options.md)
+   * allow for changing the number of columns.
+   *
+   * Returns `false` when your data is an array of objects,
+   * or when you use the [`columns`](@/api/options.md#columns) option.
+   * Otherwise, returns `true`.
    *
    * @memberof Core#
    * @function isColumnModificationAllowed
@@ -4099,8 +4118,6 @@ export default function Core(rootElement, userSettings) {
     if (datamap) {
       datamap.destroy();
     }
-    instance.rowIndexMapper = null;
-    instance.columnIndexMapper = null;
     datamap = null;
     grid = null;
     selection = null;

package/dataMap/dataSource.js

@@ -195,7 +195,7 @@ var DataSource = /*#__PURE__*/function () {
       }
       if (this.hot.hasHook('modifySourceData')) {
         var valueHolder = (0, _object.createObjectPropListener)(value);
-        this.hot.runHooks('modifySourceData', row, this.propToCol(column), valueHolder, 'set');
+        this.hot.runHooks('modifySourceData', row, column, valueHolder, 'set');
         if (valueHolder.isTouched()) {
           value = valueHolder.value;
         }
@@ -232,7 +232,7 @@ var DataSource = /*#__PURE__*/function () {
       }
       if (this.hot.hasHook('modifySourceData')) {
         var valueHolder = (0, _object.createObjectPropListener)(result);
-        this.hot.runHooks('modifySourceData', row, this.colToProp(column), valueHolder, 'get');
+        this.hot.runHooks('modifySourceData', row, column, valueHolder, 'get');
         if (valueHolder.isTouched()) {
           result = valueHolder.value;
         }
@@ -244,14 +244,14 @@ var DataSource = /*#__PURE__*/function () {
      * Returns a single value from the data.
      *
      * @param {number} row Physical row index.
-     * @param {number} column Visual column index.
+     * @param {number} columnOrProp Visual column index or property.
      * @returns {*}
      */
   }, {
     key: "getAtCell",
-    value: function getAtCell(row, column) {
+    value: function getAtCell(row, columnOrProp) {
       var dataRow = this.modifyRowData(row);
-      return this.getAtPhysicalCell(row, this.colToProp(column), dataRow);
+      return this.getAtPhysicalCell(row, this.colToProp(columnOrProp), dataRow);
     }
 
     /**

package/dataMap/dataSource.mjs

@@ -191,7 +191,7 @@ var DataSource = /*#__PURE__*/function () {
       }
       if (this.hot.hasHook('modifySourceData')) {
         var valueHolder = createObjectPropListener(value);
-        this.hot.runHooks('modifySourceData', row, this.propToCol(column), valueHolder, 'set');
+        this.hot.runHooks('modifySourceData', row, column, valueHolder, 'set');
         if (valueHolder.isTouched()) {
           value = valueHolder.value;
         }
@@ -228,7 +228,7 @@ var DataSource = /*#__PURE__*/function () {
       }
       if (this.hot.hasHook('modifySourceData')) {
         var valueHolder = createObjectPropListener(result);
-        this.hot.runHooks('modifySourceData', row, this.colToProp(column), valueHolder, 'get');
+        this.hot.runHooks('modifySourceData', row, column, valueHolder, 'get');
         if (valueHolder.isTouched()) {
           result = valueHolder.value;
         }
@@ -240,14 +240,14 @@ var DataSource = /*#__PURE__*/function () {
      * Returns a single value from the data.
      *
      * @param {number} row Physical row index.
-     * @param {number} column Visual column index.
+     * @param {number} columnOrProp Visual column index or property.
      * @returns {*}
      */
   }, {
     key: "getAtCell",
-    value: function getAtCell(row, column) {
+    value: function getAtCell(row, columnOrProp) {
       var dataRow = this.modifyRowData(row);
-      return this.getAtPhysicalCell(row, this.colToProp(column), dataRow);
+      return this.getAtPhysicalCell(row, this.colToProp(columnOrProp), dataRow);
     }
 
     /**

package/dataMap/metaManager/metaSchema.js

@@ -21,7 +21,7 @@ function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" =
  * [Configuration options](@/guides/getting-started/configuration-options.md) let you heavily customize your Handsontable instance. For example, you can:
  *
  * - Enable and disable built-in features
- * - Enable and configure additional [plugins](@/guides/tools-and-building/custom-plugins.md)
+ * - Enable and configure additional [plugins](@/api/plugins.md)
  * - Personalize Handsontable's look
  * - Adjust Handsontable's behavior
  * - Implement your own custom features
@@ -945,8 +945,7 @@ var _default = function _default() {
     /**
      * The `colWidths` option sets columns' widths, in pixels.
      *
-     * In the rendering process, the default column width is 50px. To change it,
-     * set the `colWidths` option to one of the following:
+     * The default column width is 50px. To change it, set the `colWidths` option to one of the following:
      *
      * | Setting     | Description                                                                                          | Example                                                           |
      * | ----------- | ---------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------- |
@@ -956,7 +955,10 @@ var _default = function _default() {
      * | A function  | Set column widths dynamically,<br>on each render                                                     | `colWidths(visualColumnIndex) { return visualColumnIndex * 10; }` |
      * | `undefined` | Used by the [modifyColWidth](@/api/hooks.md#modifyColWidth) hook,<br>to detect column width changes. | `colWidths: undefined`                                            |
      *
-     * Setting the `colWidths` option disables the {@link AutoColumnSize} plugin.
+     * Setting `colWidths` even for a single column disables the {@link AutoColumnSize} plugin
+     * for all columns. For this reason, if you use `colWidths`, we recommend you set a width for each one
+     * of your columns. Otherwise, every column with an undefined width defaults back to 50px,
+     * which may cut longer columns names.
      *
      * Read more:
      * - [Column width](@/guides/columns/column-width.md)
@@ -978,8 +980,8 @@ var _default = function _default() {
      *
      * // set the first (by visual index) column's width to 100
      * // set the second (by visual index) column's width to 120
-     * // set the third (by visual index) column's width to `undefined`
-     * // set any other column's width to the default 50px
+     * // set the third (by visual index) column's width to `undefined`, so that it defaults to 50px
+     * // set any other column's width to the default 50px (note that longer cell values and column names can get cut)
      * colWidths: [100, 120, undefined],
      *
      * // set each column's width individually, using a function
@@ -2872,7 +2874,7 @@ var _default = function _default() {
      * The `maxRows` option sets a maximum number of rows.
      *
      * The `maxRows` option is used:
-     * - At initialization: if the `maxRows` value is lower than the initial number of columns,
+     * - At initialization: if the `maxRows` value is lower than the initial number of rows,
      * Handsontable trims rows from the bottom.
      * - At runtime: for example, when inserting rows.
      *

package/dataMap/metaManager/metaSchema.mjs

@@ -17,7 +17,7 @@ import { isObjectEqual } from "../../helpers/object.mjs";
  * [Configuration options](@/guides/getting-started/configuration-options.md) let you heavily customize your Handsontable instance. For example, you can:
  *
  * - Enable and disable built-in features
- * - Enable and configure additional [plugins](@/guides/tools-and-building/custom-plugins.md)
+ * - Enable and configure additional [plugins](@/api/plugins.md)
  * - Personalize Handsontable's look
  * - Adjust Handsontable's behavior
  * - Implement your own custom features
@@ -941,8 +941,7 @@ export default (function () {
     /**
      * The `colWidths` option sets columns' widths, in pixels.
      *
-     * In the rendering process, the default column width is 50px. To change it,
-     * set the `colWidths` option to one of the following:
+     * The default column width is 50px. To change it, set the `colWidths` option to one of the following:
      *
      * | Setting     | Description                                                                                          | Example                                                           |
      * | ----------- | ---------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------- |
@@ -952,7 +951,10 @@ export default (function () {
      * | A function  | Set column widths dynamically,<br>on each render                                                     | `colWidths(visualColumnIndex) { return visualColumnIndex * 10; }` |
      * | `undefined` | Used by the [modifyColWidth](@/api/hooks.md#modifyColWidth) hook,<br>to detect column width changes. | `colWidths: undefined`                                            |
      *
-     * Setting the `colWidths` option disables the {@link AutoColumnSize} plugin.
+     * Setting `colWidths` even for a single column disables the {@link AutoColumnSize} plugin
+     * for all columns. For this reason, if you use `colWidths`, we recommend you set a width for each one
+     * of your columns. Otherwise, every column with an undefined width defaults back to 50px,
+     * which may cut longer columns names.
      *
      * Read more:
      * - [Column width](@/guides/columns/column-width.md)
@@ -974,8 +976,8 @@ export default (function () {
      *
      * // set the first (by visual index) column's width to 100
      * // set the second (by visual index) column's width to 120
-     * // set the third (by visual index) column's width to `undefined`
-     * // set any other column's width to the default 50px
+     * // set the third (by visual index) column's width to `undefined`, so that it defaults to 50px
+     * // set any other column's width to the default 50px (note that longer cell values and column names can get cut)
      * colWidths: [100, 120, undefined],
      *
      * // set each column's width individually, using a function
@@ -2868,7 +2870,7 @@ export default (function () {
      * The `maxRows` option sets a maximum number of rows.
      *
      * The `maxRows` option is used:
-     * - At initialization: if the `maxRows` value is lower than the initial number of columns,
+     * - At initialization: if the `maxRows` value is lower than the initial number of rows,
      * Handsontable trims rows from the bottom.
      * - At runtime: for example, when inserting rows.
      *

package/dist/handsontable.css

@@ -25,8 +25,8 @@
  * INDIRECT, SPECIAL, INCIDENTAL, OR CONSEQUENTIAL DAMAGES OF ANY CHARACTER ARISING FROM
  * USE OR INABILITY TO USE THIS SOFTWARE.
  * 
- * Version: 12.3.3
- * Release date: 28/03/2023 (built at 28/03/2023 12:24:16)
+ * Version: 12.4.0-next-acb5d99-20230512
+ * Release date: 23/05/2023 (built at 12/05/2023 12:51:25)
  */
 /**
  * Fix for bootstrap styles

package/dist/handsontable.full.css

@@ -25,8 +25,8 @@
  * INDIRECT, SPECIAL, INCIDENTAL, OR CONSEQUENTIAL DAMAGES OF ANY CHARACTER ARISING FROM
  * USE OR INABILITY TO USE THIS SOFTWARE.
  * 
- * Version: 12.3.3
- * Release date: 28/03/2023 (built at 28/03/2023 12:24:16)
+ * Version: 12.4.0-next-acb5d99-20230512
+ * Release date: 23/05/2023 (built at 12/05/2023 12:51:25)
  */
 /**
  * Fix for bootstrap styles