handsontable 0.0.0-next-fd98d33-20241029 → 0.0.0-next-4c8e3b1-20241029

package/plugins/stretchColumns/stretchColumns.mjs

@@ -0,0 +1,216 @@
+import "core-js/modules/es.error.cause.js";
+function _classPrivateMethodInitSpec(e, a) { _checkPrivateRedeclaration(e, a), a.add(e); }
+function _classPrivateFieldInitSpec(e, t, a) { _checkPrivateRedeclaration(e, t), t.set(e, a); }
+function _checkPrivateRedeclaration(e, t) { if (t.has(e)) throw new TypeError("Cannot initialize the same private elements twice on an object"); }
+function _classPrivateFieldSet(s, a, r) { return s.set(_assertClassBrand(s, a), r), r; }
+function _classPrivateFieldGet(s, a) { return s.get(_assertClassBrand(s, a)); }
+function _assertClassBrand(e, t, n) { if ("function" == typeof e ? e === t : e.has(t)) return arguments.length < 3 ? t : n; throw new TypeError("Private element is not present on this object"); }
+import { BasePlugin } from "../base/index.mjs";
+import { StretchCalculator } from "./calculator.mjs";
+export const PLUGIN_KEY = 'stretchColumns';
+export const PLUGIN_PRIORITY = 155;
+
+/* eslint-disable jsdoc/require-description-complete-sentence */
+/**
+ * @plugin StretchColumns
+ * @class StretchColumns
+ *
+ * @description
+ * This plugin allows to set column widths based on their widest cells.
+ *
+ * By default, the plugin is declared as `'none'`, which makes it disabled (same as if it was declared as `false`).
+ *
+ * The plugin determines what happens when the declared grid width is different from the calculated sum of all column widths.
+ *
+ * ```js
+ * // fit the grid to the container, by stretching only the last column
+ * stretchH: 'last',
+ *
+ * // fit the grid to the container, by stretching all columns evenly
+ * stretchH: 'all',
+ * ```
+ *
+ * To configure this plugin see {@link Options#stretchH}.
+ *
+ * @example
+ *
+ * ::: only-for javascript
+ * ```js
+ * const hot = new Handsontable(document.getElementById('example'), {
+ *   data: getData(),
+ *   stretchH: 'all',
+ * });
+ * ```
+ * :::
+ *
+ * ::: only-for react
+ * ```jsx
+ * const hotRef = useRef(null);
+ *
+ * ...
+ *
+ * // First, let's construct Handsontable
+ * <HotTable
+ *   ref={hotRef}
+ *   data={getData()}
+ *   stretchH={'all'}
+ * />
+ * ```
+ * :::
+ */
+/* eslint-enable jsdoc/require-description-complete-sentence */
+var _stretchCalculator = /*#__PURE__*/new WeakMap();
+var _previousTableWidth = /*#__PURE__*/new WeakMap();
+var _resizeObserver = /*#__PURE__*/new WeakMap();
+var _StretchColumns_brand = /*#__PURE__*/new WeakSet();
+export class StretchColumns extends BasePlugin {
+  constructor() {
+    super(...arguments);
+    /**
+     * Hook that modifies the column width - applies by the stretching logic.
+     *
+     * @param {number} width The column width.
+     * @param {number} column The visual column index.
+     * @param {string} source The source of the modification.
+     * @returns {number}
+     */
+    _classPrivateMethodInitSpec(this, _StretchColumns_brand);
+    /**
+     * The stretch calculator.
+     *
+     * @type {StretchCalculator}
+     */
+    _classPrivateFieldInitSpec(this, _stretchCalculator, new StretchCalculator(this.hot));
+    /**
+     * The previous width of the root element. Helps to determine if the width has changed.
+     *
+     * @type {number | null}
+     */
+    _classPrivateFieldInitSpec(this, _previousTableWidth, null);
+    /**
+     * It observes the root element to detect changes in its width, and if detected, then it triggers
+     * the table dimension calculations. In a situation where the browser's vertical scrollbar
+     * appears - caused by some external UI element, the observer triggers the render.
+     *
+     * @type {ResizeObserver}
+     */
+    _classPrivateFieldInitSpec(this, _resizeObserver, new ResizeObserver(entries => {
+      requestAnimationFrame(() => {
+        var _this$hot;
+        if (!((_this$hot = this.hot) !== null && _this$hot !== void 0 && _this$hot.view.isHorizontallyScrollableByWindow())) {
+          return;
+        }
+        entries.forEach(_ref => {
+          let {
+            contentRect
+          } = _ref;
+          if (_classPrivateFieldGet(_previousTableWidth, this) !== null && _classPrivateFieldGet(_previousTableWidth, this) !== contentRect.width) {
+            this.hot.refreshDimensions();
+            this.hot.view.adjustElementsSize();
+          }
+          _classPrivateFieldSet(_previousTableWidth, this, contentRect.width);
+        });
+      });
+    }));
+  }
+  static get PLUGIN_KEY() {
+    return PLUGIN_KEY;
+  }
+  static get PLUGIN_PRIORITY() {
+    return PLUGIN_PRIORITY;
+  }
+  static get SETTING_KEYS() {
+    return true;
+  }
+  /**
+   * Checks if the plugin is enabled in the handsontable settings. This method is executed in {@link Hooks#beforeInit}
+   * hook and if it returns `true` then the {@link #enablePlugin} method is called.
+   *
+   * @returns {boolean}
+   */
+  isEnabled() {
+    return ['all', 'last'].includes(this.hot.getSettings().stretchH);
+  }
+
+  /**
+   * Enables the plugin functionality for this Handsontable instance.
+   */
+  enablePlugin() {
+    var _this = this;
+    if (this.enabled) {
+      return;
+    }
+    _classPrivateFieldGet(_stretchCalculator, this).useStrategy(this.hot.getSettings().stretchH);
+    _classPrivateFieldGet(_resizeObserver, this).observe(this.hot.rootElement);
+    this.addHook('beforeRender', function () {
+      for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+        args[_key] = arguments[_key];
+      }
+      return _assertClassBrand(_StretchColumns_brand, _this, _onBeforeRender).call(_this, ...args);
+    });
+    this.addHook('modifyColWidth', function () {
+      for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
+        args[_key2] = arguments[_key2];
+      }
+      return _assertClassBrand(_StretchColumns_brand, _this, _onModifyColWidth).call(_this, ...args);
+    }, 10);
+    super.enablePlugin();
+  }
+
+  /**
+   * Updates the plugin's state. This method is executed when {@link Core#updateSettings} is invoked.
+   */
+  updatePlugin() {
+    _classPrivateFieldGet(_stretchCalculator, this).useStrategy(this.hot.getSettings().stretchH);
+    super.updatePlugin();
+  }
+
+  /**
+   * Disables the plugin functionality for this Handsontable instance.
+   */
+  disablePlugin() {
+    super.disablePlugin();
+    _classPrivateFieldGet(_resizeObserver, this).unobserve(this.hot.rootElement);
+  }
+
+  /**
+   * Gets the calculated column width based on the stretching
+   * strategy defined by {@link Options#stretchH} option.
+   *
+   * @param {number} columnVisualIndex The visual index of the column.
+   * @returns {number | null}
+   */
+  getColumnWidth(columnVisualIndex) {
+    return _classPrivateFieldGet(_stretchCalculator, this).getStretchedWidth(columnVisualIndex);
+  }
+  /**
+   * Destroys the plugin instance.
+   */
+  destroy() {
+    _classPrivateFieldGet(_resizeObserver, this).disconnect();
+    _classPrivateFieldSet(_resizeObserver, this, null);
+    _classPrivateFieldSet(_stretchCalculator, this, null);
+    super.destroy();
+  }
+}
+function _onModifyColWidth(width, column, source) {
+  if (source === this.pluginName) {
+    return;
+  }
+  const newWidth = this.getColumnWidth(column);
+  if (typeof newWidth === 'number') {
+    return newWidth;
+  }
+  return width;
+}
+/**
+ * On each before render the plugin recalculates the column widths
+ * based on the chosen stretching strategy.
+ *
+ * @param {boolean} fullRender If `true` then the full render is in progress.
+ */
+function _onBeforeRender(fullRender) {
+  if (fullRender) {
+    _classPrivateFieldGet(_stretchCalculator, this).refreshStretching();
+  }
+}

package/tableView.js

@@ -158,7 +158,7 @@ class TableView {
       this.hot.runHooks('beforeRender', this.hot.forceFullRender);
       if (this.postponedAdjustElementsSize) {
         this.postponedAdjustElementsSize = false;
-        this.adjustElementsSize(true);
+        this.adjustElementsSize();
       }
       this._wt.draw(!this.hot.forceFullRender);
       this.hot.runHooks('afterRender', this.hot.forceFullRender);
@@ -613,7 +613,6 @@ class TableView {
       isDataViewInstance: () => (0, _rootInstance.isRootInstance)(this.hot),
       preventOverflow: () => this.settings.preventOverflow,
       preventWheel: () => this.settings.preventWheel,
-      stretchH: () => this.settings.stretchH,
       viewportColumnRenderingThreshold: () => this.settings.viewportColumnRenderingThreshold,
       viewportRowRenderingThreshold: () => this.settings.viewportRowRenderingThreshold,
       data: (renderableRow, renderableColumn) => {
@@ -912,10 +911,6 @@ class TableView {
       },
       onBeforeTouchScroll: () => this.hot.runHooks('beforeTouchScroll'),
       onAfterMomentumScroll: () => this.hot.runHooks('afterMomentumScroll'),
-      onBeforeStretchingColumnWidth: (stretchedWidth, renderedColumnIndex) => {
-        const visualColumnIndex = this.hot.columnIndexMapper.getVisualFromRenderableIndex(renderedColumnIndex);
-        return this.hot.runHooks('beforeStretchingColumnWidth', stretchedWidth, visualColumnIndex);
-      },
       onModifyRowHeaderWidth: rowHeaderWidth => this.hot.runHooks('modifyRowHeaderWidth', rowHeaderWidth),
       onModifyGetCellCoords: (renderableRowIndex, renderableColumnIndex, topmost, source) => {
         const rowMapper = this.hot.rowIndexMapper;
@@ -1539,6 +1534,44 @@ class TableView {
   getTableHeight() {
     return this._wt.wtTable.getHeight();
   }
+
+  /**
+   * Gets the row header width. If there are multiple row headers, the width of
+   * the sum of all of them is returned.
+   *
+   * @returns {number}
+   */
+  getRowHeaderWidth() {
+    return this._wt.wtViewport.getRowHeaderWidth();
+  }
+
+  /**
+   * Gets the column header height. If there are multiple column headers, the height
+   * of the sum of all of them is returned.
+   *
+   * @returns {number}
+   */
+  getColumnHeaderHeight() {
+    return this._wt.wtViewport.getColumnHeaderHeight();
+  }
+
+  /**
+   * Checks if the table uses the window as a viewport and if there is a vertical scrollbar.
+   *
+   * @returns {boolean}
+   */
+  isVerticallyScrollableByWindow() {
+    return this._wt.wtViewport.isVerticallyScrollableByWindow();
+  }
+
+  /**
+   * Checks if the table uses the window as a viewport and if there is a horizontal scrollbar.
+   *
+   * @returns {boolean}
+   */
+  isHorizontallyScrollableByWindow() {
+    return this._wt.wtViewport.isHorizontallyScrollableByWindow();
+  }
   /**
    * Destroys internal WalkOnTable's instance. Detaches all of the bonded listeners.
    *

package/tableView.mjs

@@ -154,7 +154,7 @@ class TableView {
       this.hot.runHooks('beforeRender', this.hot.forceFullRender);
       if (this.postponedAdjustElementsSize) {
         this.postponedAdjustElementsSize = false;
-        this.adjustElementsSize(true);
+        this.adjustElementsSize();
       }
       this._wt.draw(!this.hot.forceFullRender);
       this.hot.runHooks('afterRender', this.hot.forceFullRender);
@@ -609,7 +609,6 @@ class TableView {
       isDataViewInstance: () => isRootInstance(this.hot),
       preventOverflow: () => this.settings.preventOverflow,
       preventWheel: () => this.settings.preventWheel,
-      stretchH: () => this.settings.stretchH,
       viewportColumnRenderingThreshold: () => this.settings.viewportColumnRenderingThreshold,
       viewportRowRenderingThreshold: () => this.settings.viewportRowRenderingThreshold,
       data: (renderableRow, renderableColumn) => {
@@ -908,10 +907,6 @@ class TableView {
       },
       onBeforeTouchScroll: () => this.hot.runHooks('beforeTouchScroll'),
       onAfterMomentumScroll: () => this.hot.runHooks('afterMomentumScroll'),
-      onBeforeStretchingColumnWidth: (stretchedWidth, renderedColumnIndex) => {
-        const visualColumnIndex = this.hot.columnIndexMapper.getVisualFromRenderableIndex(renderedColumnIndex);
-        return this.hot.runHooks('beforeStretchingColumnWidth', stretchedWidth, visualColumnIndex);
-      },
       onModifyRowHeaderWidth: rowHeaderWidth => this.hot.runHooks('modifyRowHeaderWidth', rowHeaderWidth),
       onModifyGetCellCoords: (renderableRowIndex, renderableColumnIndex, topmost, source) => {
         const rowMapper = this.hot.rowIndexMapper;
@@ -1535,6 +1530,44 @@ class TableView {
   getTableHeight() {
     return this._wt.wtTable.getHeight();
   }
+
+  /**
+   * Gets the row header width. If there are multiple row headers, the width of
+   * the sum of all of them is returned.
+   *
+   * @returns {number}
+   */
+  getRowHeaderWidth() {
+    return this._wt.wtViewport.getRowHeaderWidth();
+  }
+
+  /**
+   * Gets the column header height. If there are multiple column headers, the height
+   * of the sum of all of them is returned.
+   *
+   * @returns {number}
+   */
+  getColumnHeaderHeight() {
+    return this._wt.wtViewport.getColumnHeaderHeight();
+  }
+
+  /**
+   * Checks if the table uses the window as a viewport and if there is a vertical scrollbar.
+   *
+   * @returns {boolean}
+   */
+  isVerticallyScrollableByWindow() {
+    return this._wt.wtViewport.isVerticallyScrollableByWindow();
+  }
+
+  /**
+   * Checks if the table uses the window as a viewport and if there is a horizontal scrollbar.
+   *
+   * @returns {boolean}
+   */
+  isHorizontallyScrollableByWindow() {
+    return this._wt.wtViewport.isHorizontallyScrollableByWindow();
+  }
   /**
    * Destroys internal WalkOnTable's instance. Detaches all of the bonded listeners.
    *

package/3rdparty/walkontable/src/utils/columnStretching.js

@@ -1,197 +0,0 @@
-"use strict";
-
-exports.__esModule = true;
-require("core-js/modules/es.error.cause.js");
-var _calculator = require("../calculator");
-function _classPrivateFieldInitSpec(e, t, a) { _checkPrivateRedeclaration(e, t), t.set(e, a); }
-function _checkPrivateRedeclaration(e, t) { if (t.has(e)) throw new TypeError("Cannot initialize the same private elements twice on an object"); }
-function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
-function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
-function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
-function _classPrivateFieldGet(s, a) { return s.get(_assertClassBrand(s, a)); }
-function _classPrivateFieldSet(s, a, r) { return s.set(_assertClassBrand(s, a), r), r; }
-function _assertClassBrand(e, t, n) { if ("function" == typeof e ? e === t : e.has(t)) return arguments.length < 3 ? t : n; throw new TypeError("Private element is not present on this object"); }
-/**
- * @typedef {object} ColumnStretchingOptions
- * @property {number} totalColumns Total number of columns.
- * @property {Function} columnWidthFn Function that returns the width of the column at a given index (in px).
- * @property {'all' | 'last' | 'none'} stretchMode Stretch mode 'all', 'last' or 'none'.
- * @property {Function} stretchingColumnWidthFn Function that returns the new width of the stretched column.
- */
-/**
- * @class ColumnStretching
- */
-var _totalTargetWidth = /*#__PURE__*/new WeakMap();
-var _totalColumns = /*#__PURE__*/new WeakMap();
-var _stretchingColumnWidthFn = /*#__PURE__*/new WeakMap();
-var _columnWidthFn = /*#__PURE__*/new WeakMap();
-var _stretchMode = /*#__PURE__*/new WeakMap();
-class ColumnStretching {
-  /**
-   * @param {ColumnStretchingOptions} options Object with all options specified for column viewport calculation.
-   */
-  constructor(_ref) {
-    let {
-      totalColumns,
-      stretchMode,
-      stretchingColumnWidthFn,
-      columnWidthFn
-    } = _ref;
-    /**
-     * @type {number}
-     */
-    _defineProperty(this, "stretchAllRatio", 0);
-    /**
-     * @type {number}
-     */
-    _defineProperty(this, "stretchLastWidth", 0);
-    /**
-     * @type {number[]}
-     */
-    _defineProperty(this, "stretchAllColumnsWidth", []);
-    /**
-     * @type {number}
-     */
-    _classPrivateFieldInitSpec(this, _totalTargetWidth, 0);
-    /**
-     * @type {boolean}
-     */
-    _defineProperty(this, "needVerifyLastColumnWidth", true);
-    /**
-     * The total number of columns.
-     *
-     * @type {function(): number}
-     */
-    _classPrivateFieldInitSpec(this, _totalColumns, () => 0);
-    /**
-     * Function that returns the width of the stretched column at a given index (in px).
-     *
-     * @type {function(): number}
-     */
-    _classPrivateFieldInitSpec(this, _stretchingColumnWidthFn, width => width);
-    /**
-     * Function that returns the width of the column at a given index (in px).
-     *
-     * @type {function(): number}
-     */
-    _classPrivateFieldInitSpec(this, _columnWidthFn, width => width);
-    /**
-     * Stretch mode.
-     *
-     * @type {function(): 'all' | 'last' | 'none'}
-     */
-    _classPrivateFieldInitSpec(this, _stretchMode, () => 'none');
-    _classPrivateFieldSet(_totalColumns, this, totalColumns);
-    _classPrivateFieldSet(_stretchMode, this, stretchMode);
-    _classPrivateFieldSet(_stretchingColumnWidthFn, this, stretchingColumnWidthFn !== null && stretchingColumnWidthFn !== void 0 ? stretchingColumnWidthFn : _classPrivateFieldGet(_stretchingColumnWidthFn, this));
-    _classPrivateFieldSet(_columnWidthFn, this, columnWidthFn !== null && columnWidthFn !== void 0 ? columnWidthFn : _classPrivateFieldGet(_columnWidthFn, this));
-  }
-
-  /**
-   * Recalculate columns stretching.
-   *
-   * @param {number} totalWidth The total width of the table.
-   */
-  refreshStretching(totalWidth) {
-    if (_classPrivateFieldGet(_stretchMode, this).call(this) === 'none') {
-      return;
-    }
-    this.stretchAllRatio = 0;
-    this.stretchAllColumnsWidth = [];
-    this.needVerifyLastColumnWidth = true;
-    this.stretchLastWidth = 0;
-    _classPrivateFieldSet(_totalTargetWidth, this, totalWidth);
-    let sumAll = 0;
-    for (let i = 0; i < _classPrivateFieldGet(_totalColumns, this).call(this); i++) {
-      const columnWidth = this._getColumnWidth(i);
-      const permanentColumnWidth = _classPrivateFieldGet(_stretchingColumnWidthFn, this).call(this, undefined, i);
-      if (typeof permanentColumnWidth === 'number') {
-        totalWidth -= permanentColumnWidth;
-      } else {
-        sumAll += columnWidth;
-      }
-    }
-    const remainingSize = totalWidth - sumAll;
-    if (_classPrivateFieldGet(_stretchMode, this).call(this) === 'all' && remainingSize > 0) {
-      this.stretchAllRatio = totalWidth / sumAll;
-      this.stretchAllColumnsWidth = [];
-      this.needVerifyLastColumnWidth = true;
-    } else if (_classPrivateFieldGet(_stretchMode, this).call(this) === 'last' && totalWidth !== Infinity) {
-      const columnWidth = this._getColumnWidth(_classPrivateFieldGet(_totalColumns, this).call(this) - 1);
-      const lastColumnWidth = remainingSize + columnWidth;
-      this.stretchLastWidth = lastColumnWidth >= 0 ? lastColumnWidth : columnWidth;
-    }
-  }
-
-  /**
-   * Get stretched column width based on stretchH (all or last) setting passed in handsontable instance.
-   *
-   * @param {number} column The visual column index.
-   * @param {number} baseWidth The default column width.
-   * @returns {number|null}
-   */
-  getStretchedColumnWidth(column, baseWidth) {
-    let result = null;
-    if (_classPrivateFieldGet(_stretchMode, this).call(this) === 'all' && this.stretchAllRatio !== 0) {
-      result = this._getStretchedAllColumnWidth(column, baseWidth);
-    } else if (_classPrivateFieldGet(_stretchMode, this).call(this) === 'last' && this.stretchLastWidth !== 0) {
-      result = this._getStretchedLastColumnWidth(column);
-    }
-    return result;
-  }
-
-  /**
-   * @param {number} column The visual column index.
-   * @param {number} baseWidth The default column width.
-   * @returns {number}
-   * @private
-   */
-  _getStretchedAllColumnWidth(column, baseWidth) {
-    let sumRatioWidth = 0;
-    if (!this.stretchAllColumnsWidth[column]) {
-      const stretchedWidth = Math.round(baseWidth * this.stretchAllRatio);
-      const newStretchedWidth = _classPrivateFieldGet(_stretchingColumnWidthFn, this).call(this, stretchedWidth, column);
-      if (newStretchedWidth === undefined) {
-        this.stretchAllColumnsWidth[column] = stretchedWidth;
-      } else {
-        this.stretchAllColumnsWidth[column] = isNaN(newStretchedWidth) ? this._getColumnWidth(column) : newStretchedWidth;
-      }
-    }
-    if (this.stretchAllColumnsWidth.length === _classPrivateFieldGet(_totalColumns, this).call(this) && this.needVerifyLastColumnWidth) {
-      this.needVerifyLastColumnWidth = false;
-      for (let i = 0; i < this.stretchAllColumnsWidth.length; i++) {
-        sumRatioWidth += this.stretchAllColumnsWidth[i];
-      }
-      if (sumRatioWidth !== _classPrivateFieldGet(_totalTargetWidth, this)) {
-        this.stretchAllColumnsWidth[this.stretchAllColumnsWidth.length - 1] += _classPrivateFieldGet(_totalTargetWidth, this) - sumRatioWidth;
-      }
-    }
-    return this.stretchAllColumnsWidth[column];
-  }
-
-  /**
-   * @param {number} column The visual column index.
-   * @returns {number|null}
-   * @private
-   */
-  _getStretchedLastColumnWidth(column) {
-    if (column === _classPrivateFieldGet(_totalColumns, this).call(this) - 1) {
-      return this.stretchLastWidth;
-    }
-    return null;
-  }
-
-  /**
-   * @param {number} column The visual column index.
-   * @returns {number}
-   * @private
-   */
-  _getColumnWidth(column) {
-    let width = _classPrivateFieldGet(_columnWidthFn, this).call(this, column);
-    if (isNaN(width)) {
-      width = _calculator.DEFAULT_COLUMN_WIDTH;
-    }
-    return width;
-  }
-}
-exports.ColumnStretching = ColumnStretching;