handsontable 0.0.0-next-ff10728-20250410 → 0.0.0-next-d9b3885-20250415

package/editorManager.js

@@ -80,13 +80,7 @@ class EditorManager {
     this.selection = _selection;
     this.eventManager = new _eventManager.default(hotInstance);
     this.hot.addHook('afterDocumentKeyDown', event => _assertClassBrand(_EditorManager_brand, this, _onAfterDocumentKeyDown).call(this, event));
-
-    // Open editor when text composition is started (IME editor)
-    this.eventManager.addEventListener(this.hot.rootDocument.documentElement, 'compositionstart', event => {
-      if (!this.destroyed && this.hot.isListening()) {
-        this.openEditor('', event);
-      }
-    });
+    this.hot.addHook('beforeCompositionStart', event => _assertClassBrand(_EditorManager_brand, this, _onAfterDocumentKeyDown).call(this, event));
     this.hot.view._wt.update('onCellDblClick', (event, coords, elem) => _assertClassBrand(_EditorManager_brand, this, _onCellDblClick).call(this, event, coords, elem));
   }
 

package/editorManager.mjs

@@ -76,13 +76,7 @@ class EditorManager {
     this.selection = _selection;
     this.eventManager = new EventManager(hotInstance);
     this.hot.addHook('afterDocumentKeyDown', event => _assertClassBrand(_EditorManager_brand, this, _onAfterDocumentKeyDown).call(this, event));
-
-    // Open editor when text composition is started (IME editor)
-    this.eventManager.addEventListener(this.hot.rootDocument.documentElement, 'compositionstart', event => {
-      if (!this.destroyed && this.hot.isListening()) {
-        this.openEditor('', event);
-      }
-    });
+    this.hot.addHook('beforeCompositionStart', event => _assertClassBrand(_EditorManager_brand, this, _onAfterDocumentKeyDown).call(this, event));
     this.hot.view._wt.update('onCellDblClick', (event, coords, elem) => _assertClassBrand(_EditorManager_brand, this, _onCellDblClick).call(this, event, coords, elem));
   }
 

package/editors/autocompleteEditor/autocompleteEditor.js

@@ -15,6 +15,7 @@ var _string = require("../../helpers/string");
 var _unicode = require("../../helpers/unicode");
 var _textRenderer = require("../../renderers/textRenderer");
 var _a11y = require("../../helpers/a11y");
+var _function = require("../../helpers/function");
 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"); }
@@ -30,6 +31,7 @@ const EDITOR_TYPE = exports.EDITOR_TYPE = 'autocomplete';
  * @class AutocompleteEditor
  */
 var _idPrefix = /*#__PURE__*/new WeakMap();
+var _focusDebounced = /*#__PURE__*/new WeakMap();
 var _AutocompleteEditor_brand = /*#__PURE__*/new WeakSet();
 class AutocompleteEditor extends _handsontableEditor.HandsontableEditor {
   constructor() {
@@ -62,6 +64,12 @@ class AutocompleteEditor extends _handsontableEditor.HandsontableEditor {
      * @type {string}
      */
     _classPrivateFieldInitSpec(this, _idPrefix, this.hot.guid.slice(0, 9));
+    /**
+     * Runs focus method after debounce.
+     */
+    _classPrivateFieldInitSpec(this, _focusDebounced, (0, _function.debounce)(() => {
+      this.focus();
+    }, 100));
     /**
      * Filters and sorts by relevance.
      *
@@ -147,7 +155,6 @@ class AutocompleteEditor extends _handsontableEditor.HandsontableEditor {
     }
     return this.TEXTAREA.value;
   }
-
   /**
    * Creates an editor's elements and adds necessary CSS classnames.
    */
@@ -193,10 +200,10 @@ class AutocompleteEditor extends _handsontableEditor.HandsontableEditor {
     this.showEditableElement();
     this.focus();
     this.addHook('beforeKeyDown', event => this.onBeforeKeyDown(event));
+    this.htEditor.addHook('afterScroll', _classPrivateFieldGet(_focusDebounced, this));
     this.htEditor.updateSettings({
       colWidths: trimDropdown ? [(0, _element.outerWidth)(this.TEXTAREA) - 2] : undefined,
       autoColumnSize: true,
-      autoRowSize: true,
       renderer: (hotInstance, TD, row, col, prop, value, cellProperties) => {
         (0, _textRenderer.textRenderer)(hotInstance, TD, row, col, prop, value, cellProperties);
         const {
@@ -468,7 +475,10 @@ class AutocompleteEditor extends _handsontableEditor.HandsontableEditor {
     const maxItems = Math.min(this.cellProperties.visibleRows, this.strippedChoices.length);
     const height = Array.from({
       length: maxItems
-    }, (_, i) => i).reduce((h, index) => h + this.htEditor.getRowHeight(index), 0);
+    }, (_, i) => i).reduce((totalHeight, index) => {
+      const rowHeight = this.htEditor.getRowHeight(index) || this.htEditor.view.getDefaultRowHeight();
+      return totalHeight + rowHeight;
+    }, 0);
     return height + borderVerticalCompensation + 1;
   }
 
@@ -566,7 +576,7 @@ exports.AutocompleteEditor = AutocompleteEditor;
 function _fixDropdownWidth() {
   if (this.htEditor.view.hasVerticalScroll()) {
     this.htEditor.updateSettings({
-      width: this.htEditor.getSettings().width + (0, _element.getScrollbarWidth)(this.hot.rootDocument)
+      width: this.getWidth() + (0, _element.getScrollbarWidth)(this.hot.rootDocument)
     });
   }
 }

package/editors/autocompleteEditor/autocompleteEditor.mjs

@@ -20,6 +20,7 @@ import { stripTags } from "../../helpers/string.mjs";
 import { KEY_CODES, isPrintableChar } from "../../helpers/unicode.mjs";
 import { textRenderer } from "../../renderers/textRenderer/index.mjs";
 import { A11Y_ACTIVEDESCENDANT, A11Y_AUTOCOMPLETE, A11Y_COMBOBOX, A11Y_CONTROLS, A11Y_EXPANDED, A11Y_HASPOPUP, A11Y_LISTBOX, A11Y_LIVE, A11Y_OPTION, A11Y_POSINSET, A11Y_PRESENTATION, A11Y_RELEVANT, A11Y_SELECTED, A11Y_SETSIZE, A11Y_TEXT } from "../../helpers/a11y.mjs";
+import { debounce } from "../../helpers/function.mjs";
 export const EDITOR_TYPE = 'autocomplete';
 
 /**
@@ -27,6 +28,7 @@ export const EDITOR_TYPE = 'autocomplete';
  * @class AutocompleteEditor
  */
 var _idPrefix = /*#__PURE__*/new WeakMap();
+var _focusDebounced = /*#__PURE__*/new WeakMap();
 var _AutocompleteEditor_brand = /*#__PURE__*/new WeakSet();
 export class AutocompleteEditor extends HandsontableEditor {
   constructor() {
@@ -59,6 +61,12 @@ export class AutocompleteEditor extends HandsontableEditor {
      * @type {string}
      */
     _classPrivateFieldInitSpec(this, _idPrefix, this.hot.guid.slice(0, 9));
+    /**
+     * Runs focus method after debounce.
+     */
+    _classPrivateFieldInitSpec(this, _focusDebounced, debounce(() => {
+      this.focus();
+    }, 100));
     /**
      * Filters and sorts by relevance.
      *
@@ -144,7 +152,6 @@ export class AutocompleteEditor extends HandsontableEditor {
     }
     return this.TEXTAREA.value;
   }
-
   /**
    * Creates an editor's elements and adds necessary CSS classnames.
    */
@@ -190,10 +197,10 @@ export class AutocompleteEditor extends HandsontableEditor {
     this.showEditableElement();
     this.focus();
     this.addHook('beforeKeyDown', event => this.onBeforeKeyDown(event));
+    this.htEditor.addHook('afterScroll', _classPrivateFieldGet(_focusDebounced, this));
     this.htEditor.updateSettings({
       colWidths: trimDropdown ? [outerWidth(this.TEXTAREA) - 2] : undefined,
       autoColumnSize: true,
-      autoRowSize: true,
       renderer: (hotInstance, TD, row, col, prop, value, cellProperties) => {
         textRenderer(hotInstance, TD, row, col, prop, value, cellProperties);
         const {
@@ -465,7 +472,10 @@ export class AutocompleteEditor extends HandsontableEditor {
     const maxItems = Math.min(this.cellProperties.visibleRows, this.strippedChoices.length);
     const height = Array.from({
       length: maxItems
-    }, (_, i) => i).reduce((h, index) => h + this.htEditor.getRowHeight(index), 0);
+    }, (_, i) => i).reduce((totalHeight, index) => {
+      const rowHeight = this.htEditor.getRowHeight(index) || this.htEditor.view.getDefaultRowHeight();
+      return totalHeight + rowHeight;
+    }, 0);
     return height + borderVerticalCompensation + 1;
   }
 
@@ -562,7 +572,7 @@ export class AutocompleteEditor extends HandsontableEditor {
 function _fixDropdownWidth() {
   if (this.htEditor.view.hasVerticalScroll()) {
     this.htEditor.updateSettings({
-      width: this.htEditor.getSettings().width + getScrollbarWidth(this.hot.rootDocument)
+      width: this.getWidth() + getScrollbarWidth(this.hot.rootDocument)
     });
   }
 }

package/editors/textEditor/textEditor.js

@@ -123,7 +123,7 @@ class TextEditor extends _baseEditor.BaseEditor {
    */
   close() {
     this.autoResize.unObserve();
-    if ((0, _element.isThisHotChild)(this.hot.rootDocument.activeElement, this.hot.rootElement)) {
+    if ((0, _element.isInternalElement)(this.hot.rootDocument.activeElement, this.hot.rootElement)) {
       this.hot.listen(); // don't refocus the table if user focused some cell outside of HT on purpose
     }
     this.hideEditableElement();

package/editors/textEditor/textEditor.mjs

@@ -5,7 +5,7 @@ function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e =
 import { BaseEditor, EDITOR_STATE } from "../baseEditor/index.mjs";
 import EventManager from "../../eventManager.mjs";
 import { isEdge, isIOS } from "../../helpers/browser.mjs";
-import { addClass, isThisHotChild, setCaretPosition, hasClass, removeClass, setAttribute } from "../../helpers/dom/element.mjs";
+import { addClass, isInternalElement, setCaretPosition, hasClass, removeClass, setAttribute } from "../../helpers/dom/element.mjs";
 import { rangeEach } from "../../helpers/number.mjs";
 import { createInputElementResizer } from "../../utils/autoResize.mjs";
 import { isDefined } from "../../helpers/mixed.mjs";
@@ -119,7 +119,7 @@ export class TextEditor extends BaseEditor {
    */
   close() {
     this.autoResize.unObserve();
-    if (isThisHotChild(this.hot.rootDocument.activeElement, this.hot.rootElement)) {
+    if (isInternalElement(this.hot.rootDocument.activeElement, this.hot.rootElement)) {
       this.hot.listen(); // don't refocus the table if user focused some cell outside of HT on purpose
     }
     this.hideEditableElement();

package/helpers/browser.js

@@ -41,7 +41,7 @@ const platforms = {
   mac: tester(platform => /^Mac/.test(platform)),
   win: tester(platform => /^Win/.test(platform)),
   linux: tester(platform => /^Linux/.test(platform)),
-  ios: tester(ua => /iPhone|iPad|iPod/i.test(ua))
+  ios: tester(platform => /iPhone|iPad|iPod/i.test(platform))
 };
 
 /**

package/helpers/browser.mjs

@@ -23,7 +23,7 @@ const platforms = {
   mac: tester(platform => /^Mac/.test(platform)),
   win: tester(platform => /^Win/.test(platform)),
   linux: tester(platform => /^Linux/.test(platform)),
-  ios: tester(ua => /iPhone|iPad|iPod/i.test(ua))
+  ios: tester(platform => /iPhone|iPad|iPod/i.test(platform))
 };
 
 /**

package/helpers/dom/element.js

@@ -38,8 +38,8 @@ exports.isChildOf = isChildOf;
 exports.isDetached = isDetached;
 exports.isHTMLElement = isHTMLElement;
 exports.isInput = isInput;
+exports.isInternalElement = isInternalElement;
 exports.isOutsideInput = isOutsideInput;
-exports.isThisHotChild = isThisHotChild;
 exports.isVisible = isVisible;
 exports.makeElementContentEditableAndSelectItsContent = makeElementContentEditableAndSelectItsContent;
 exports.matchesCSSRules = matchesCSSRules;
@@ -100,7 +100,7 @@ function getParent(element) {
  * @param {HTMLElement} thisHotContainer The Handsontable container.
  * @returns {boolean}
  */
-function isThisHotChild(element, thisHotContainer) {
+function isInternalElement(element, thisHotContainer) {
   const closestHandsontableContainer = element.closest('.handsontable');
   return !!closestHandsontableContainer && (closestHandsontableContainer.parentNode === thisHotContainer || closestHandsontableContainer === thisHotContainer);
 }

package/helpers/dom/element.mjs

@@ -39,7 +39,7 @@ export function getParent(element) {
  * @param {HTMLElement} thisHotContainer The Handsontable container.
  * @returns {boolean}
  */
-export function isThisHotChild(element, thisHotContainer) {
+export function isInternalElement(element, thisHotContainer) {
   const closestHandsontableContainer = element.closest('.handsontable');
   return !!closestHandsontableContainer && (closestHandsontableContainer.parentNode === thisHotContainer || closestHandsontableContainer === thisHotContainer);
 }

package/helpers/mixed.js

@@ -134,7 +134,7 @@ const domMessages = {
 function _injectProductInfo(key, element) {
   const hasValidType = !isEmpty(key);
   const isNonCommercial = typeof key === 'string' && key.toLowerCase() === 'non-commercial-and-evaluation';
-  const hotVersion = "0.0.0-next-ff10728-20250410";
+  const hotVersion = "0.0.0-next-d9b3885-20250415";
   let keyValidityDate;
   let consoleMessageState = 'invalid';
   let domMessageState = 'invalid';
@@ -142,7 +142,7 @@ function _injectProductInfo(key, element) {
   const schemaValidity = _checkKeySchema(key);
   if (hasValidType || isNonCommercial || schemaValidity) {
     if (schemaValidity) {
-      const releaseDate = (0, _moment.default)("20/02/2025", 'DD/MM/YYYY');
+      const releaseDate = (0, _moment.default)("19/03/2025", 'DD/MM/YYYY');
       const releaseDays = Math.floor(releaseDate.toDate().getTime() / 8.64e7);
       const keyValidityDays = _extractTime(key);
       keyValidityDate = (0, _moment.default)((keyValidityDays + 1) * 8.64e7, 'x').format('MMMM DD, YYYY');

package/helpers/mixed.mjs

@@ -124,7 +124,7 @@ const domMessages = {
 export function _injectProductInfo(key, element) {
   const hasValidType = !isEmpty(key);
   const isNonCommercial = typeof key === 'string' && key.toLowerCase() === 'non-commercial-and-evaluation';
-  const hotVersion = "0.0.0-next-ff10728-20250410";
+  const hotVersion = "0.0.0-next-d9b3885-20250415";
   let keyValidityDate;
   let consoleMessageState = 'invalid';
   let domMessageState = 'invalid';
@@ -132,7 +132,7 @@ export function _injectProductInfo(key, element) {
   const schemaValidity = _checkKeySchema(key);
   if (hasValidType || isNonCommercial || schemaValidity) {
     if (schemaValidity) {
-      const releaseDate = moment("20/02/2025", 'DD/MM/YYYY');
+      const releaseDate = moment("19/03/2025", 'DD/MM/YYYY');
       const releaseDays = Math.floor(releaseDate.toDate().getTime() / 8.64e7);
       const keyValidityDays = _extractTime(key);
       keyValidityDate = moment((keyValidityDays + 1) * 8.64e7, 'x').format('MMMM DD, YYYY');

package/helpers/object.js

@@ -281,6 +281,9 @@ function getProperty(object, name) {
  * @param {*} value Value to be assigned at the provided property.
  */
 function setProperty(object, name, value) {
+  if (typeof name !== 'string') {
+    return;
+  }
   const names = name.split('.');
   let workingObject = object;
   names.forEach((propName, index) => {

package/helpers/object.mjs

@@ -262,6 +262,9 @@ export function getProperty(object, name) {
  * @param {*} value Value to be assigned at the provided property.
  */
 export function setProperty(object, name, value) {
+  if (typeof name !== 'string') {
+    return;
+  }
   const names = name.split('.');
   let workingObject = object;
   names.forEach((propName, index) => {

package/package.json

@@ -10,7 +10,7 @@
     "url": "https://github.com/handsontable/handsontable/issues"
   },
   "author": "Handsoncode <hello@handsontable.com>",
-  "version": "0.0.0-next-ff10728-20250410",
+  "version": "0.0.0-next-d9b3885-20250415",
   "main": "index",
   "module": "index.mjs",
   "jsnext:main": "index.mjs",

package/plugins/autoColumnSize/autoColumnSize.js

@@ -127,6 +127,53 @@ const COLUMN_SIZE_MAP_NAME = 'autoColumnSize';
  * }
  * ```
  * :::
+ *
+ * ::: only-for angular
+ *
+ * ```ts
+ * import { AfterViewInit, Component, ViewChild } from "@angular/core";
+ * import {
+ *   GridSettings,
+ *   HotTableModule,
+ *   HotTableComponent,
+ * } from "@handsontable/angular-wrapper";
+ *
+ * `@Component`({
+ *   selector: "app-example",
+ *   standalone: true,
+ *   imports: [HotTableModule],
+ *   template: ` <div class="ht-theme-main">
+ *     <hot-table [settings]="gridSettings" />
+ *   </div>`,
+ * })
+ * export class ExampleComponent implements AfterViewInit {
+ *   `@ViewChild`(HotTableComponent, { static: false })
+ *   readonly hotTable!: HotTableComponent;
+ *
+ *   readonly gridSettings = <GridSettings>{
+ *     data: this.getData(),
+ *     autoColumnSize: true,
+ *   };
+ *
+ *   ngAfterViewInit(): void {
+ *     // Access to plugin instance:
+ *     const hot = this.hotTable.hotInstance;
+ *     const plugin = hot.getPlugin("autoColumnSize");
+ *
+ *     plugin.getColumnWidth(4);
+ *
+ *     if (plugin.isEnabled()) {
+ *       // code...
+ *     }
+ *   }
+ *
+ *   private getData(): any[] {
+ *     //get some data
+ *   }
+ * }
+ * ```
+ *
+ * :::
  */
 /* eslint-enable jsdoc/require-description-complete-sentence */
 var _isInitialized = /*#__PURE__*/new WeakMap();
@@ -325,7 +372,7 @@ class AutoColumnSize extends _base.BasePlugin {
     if (firstVisibleColumn === -1 || lastVisibleColumn === -1) {
       return;
     }
-    const overwriteCache = this.hot.renderCall;
+    const overwriteCache = this.hot.forceFullRender;
     this.calculateColumnsWidth({
       from: firstVisibleColumn,
       to: lastVisibleColumn

package/plugins/autoColumnSize/autoColumnSize.mjs

@@ -123,6 +123,53 @@ const COLUMN_SIZE_MAP_NAME = 'autoColumnSize';
  * }
  * ```
  * :::
+ *
+ * ::: only-for angular
+ *
+ * ```ts
+ * import { AfterViewInit, Component, ViewChild } from "@angular/core";
+ * import {
+ *   GridSettings,
+ *   HotTableModule,
+ *   HotTableComponent,
+ * } from "@handsontable/angular-wrapper";
+ *
+ * `@Component`({
+ *   selector: "app-example",
+ *   standalone: true,
+ *   imports: [HotTableModule],
+ *   template: ` <div class="ht-theme-main">
+ *     <hot-table [settings]="gridSettings" />
+ *   </div>`,
+ * })
+ * export class ExampleComponent implements AfterViewInit {
+ *   `@ViewChild`(HotTableComponent, { static: false })
+ *   readonly hotTable!: HotTableComponent;
+ *
+ *   readonly gridSettings = <GridSettings>{
+ *     data: this.getData(),
+ *     autoColumnSize: true,
+ *   };
+ *
+ *   ngAfterViewInit(): void {
+ *     // Access to plugin instance:
+ *     const hot = this.hotTable.hotInstance;
+ *     const plugin = hot.getPlugin("autoColumnSize");
+ *
+ *     plugin.getColumnWidth(4);
+ *
+ *     if (plugin.isEnabled()) {
+ *       // code...
+ *     }
+ *   }
+ *
+ *   private getData(): any[] {
+ *     //get some data
+ *   }
+ * }
+ * ```
+ *
+ * :::
  */
 /* eslint-enable jsdoc/require-description-complete-sentence */
 var _isInitialized = /*#__PURE__*/new WeakMap();
@@ -321,7 +368,7 @@ export class AutoColumnSize extends BasePlugin {
     if (firstVisibleColumn === -1 || lastVisibleColumn === -1) {
       return;
     }
-    const overwriteCache = this.hot.renderCall;
+    const overwriteCache = this.hot.forceFullRender;
     this.calculateColumnsWidth({
       from: firstVisibleColumn,
       to: lastVisibleColumn

package/plugins/autoRowSize/autoRowSize.js

@@ -110,6 +110,51 @@ const ROW_WIDTHS_MAP_NAME = 'autoRowSize';
  * }
  * ```
  * :::
+ *
+ * ::: only-for angular
+ * ```ts
+ * import { AfterViewInit, Component, ViewChild } from "@angular/core";
+ * import {
+ *   GridSettings,
+ *   HotTableModule,
+ *   HotTableComponent,
+ * } from "@handsontable/angular-wrapper";
+ *
+ * `@Component`({
+ *   selector: "app-example",
+ *   standalone: true,
+ *   imports: [HotTableModule],
+ *   template: ` <div class="ht-theme-main">
+ *     <hot-table [settings]="gridSettings" />
+ *   </div>`,
+ * })
+ * export class ExampleComponent implements AfterViewInit {
+ *   `@ViewChild`(HotTableComponent, { static: false })
+ *   readonly hotTable!: HotTableComponent;
+ *
+ *   readonly gridSettings = <GridSettings>{
+ *     data: this.getData(),
+ *     autoRowSize: true,
+ *   };
+ *
+ *   ngAfterViewInit(): void {
+ *     // Access to plugin instance:
+ *     const hot = this.hotTable.hotInstance;
+ *     const plugin = hot.getPlugin("autoRowSize");
+ *
+ *     plugin.getRowHeight(4);
+ *
+ *     if (plugin.isEnabled()) {
+ *       // code...
+ *     }
+ *   }
+ *
+ *   private getData(): any[] {
+ *     // get some data
+ *   }
+ * }
+ * ```
+ * :::
  */
 /* eslint-enable jsdoc/require-description-complete-sentence */
 var _visualRowsToRefresh = /*#__PURE__*/new WeakMap();
@@ -304,7 +349,7 @@ class AutoRowSize extends _base.BasePlugin {
     if (firstVisibleRow === -1 || lastVisibleRow === -1) {
       return;
     }
-    const overwriteCache = this.hot.renderCall;
+    const overwriteCache = this.hot.forceFullRender;
     this.calculateRowsHeight({
       from: firstVisibleRow,
       to: lastVisibleRow
@@ -405,11 +450,6 @@ class AutoRowSize extends _base.BasePlugin {
 
         // @TODO Should call once per render cycle, currently fired separately in different plugins
         this.hot.view.adjustElementsSize();
-
-        // tmp
-        if (this.hot.view._wt.wtOverlays.inlineStartOverlay.needFullRender) {
-          this.hot.view._wt.wtOverlays.inlineStartOverlay.clone.draw();
-        }
       }
     };
     const syncLimit = this.getSyncCalculationLimit();

package/plugins/autoRowSize/autoRowSize.mjs

@@ -106,6 +106,51 @@ const ROW_WIDTHS_MAP_NAME = 'autoRowSize';
  * }
  * ```
  * :::
+ *
+ * ::: only-for angular
+ * ```ts
+ * import { AfterViewInit, Component, ViewChild } from "@angular/core";
+ * import {
+ *   GridSettings,
+ *   HotTableModule,
+ *   HotTableComponent,
+ * } from "@handsontable/angular-wrapper";
+ *
+ * `@Component`({
+ *   selector: "app-example",
+ *   standalone: true,
+ *   imports: [HotTableModule],
+ *   template: ` <div class="ht-theme-main">
+ *     <hot-table [settings]="gridSettings" />
+ *   </div>`,
+ * })
+ * export class ExampleComponent implements AfterViewInit {
+ *   `@ViewChild`(HotTableComponent, { static: false })
+ *   readonly hotTable!: HotTableComponent;
+ *
+ *   readonly gridSettings = <GridSettings>{
+ *     data: this.getData(),
+ *     autoRowSize: true,
+ *   };
+ *
+ *   ngAfterViewInit(): void {
+ *     // Access to plugin instance:
+ *     const hot = this.hotTable.hotInstance;
+ *     const plugin = hot.getPlugin("autoRowSize");
+ *
+ *     plugin.getRowHeight(4);
+ *
+ *     if (plugin.isEnabled()) {
+ *       // code...
+ *     }
+ *   }
+ *
+ *   private getData(): any[] {
+ *     // get some data
+ *   }
+ * }
+ * ```
+ * :::
  */
 /* eslint-enable jsdoc/require-description-complete-sentence */
 var _visualRowsToRefresh = /*#__PURE__*/new WeakMap();
@@ -300,7 +345,7 @@ export class AutoRowSize extends BasePlugin {
     if (firstVisibleRow === -1 || lastVisibleRow === -1) {
       return;
     }
-    const overwriteCache = this.hot.renderCall;
+    const overwriteCache = this.hot.forceFullRender;
     this.calculateRowsHeight({
       from: firstVisibleRow,
       to: lastVisibleRow
@@ -401,11 +446,6 @@ export class AutoRowSize extends BasePlugin {
 
         // @TODO Should call once per render cycle, currently fired separately in different plugins
         this.hot.view.adjustElementsSize();
-
-        // tmp
-        if (this.hot.view._wt.wtOverlays.inlineStartOverlay.needFullRender) {
-          this.hot.view._wt.wtOverlays.inlineStartOverlay.clone.draw();
-        }
       }
     };
     const syncLimit = this.getSyncCalculationLimit();

package/plugins/bindRowsWithHeaders/bindRowsWithHeaders.js

@@ -48,6 +48,19 @@ const bindTypeToMapStrategy = new Map([['loose', _looseBindsMap.default], ['stri
  * />
  * ```
  * :::
+ *
+ * ::: only-for angular
+ * ```ts
+ * settings = {
+ *   data: getData(),
+ *   bindRowsWithHeaders: true,
+ * };
+ * ```
+ *
+ * ```html
+ * <hot-table [settings]="settings" />
+ * ```
+ * :::
  */
 var _BindRowsWithHeaders_brand = /*#__PURE__*/new WeakSet();
 class BindRowsWithHeaders extends _base.BasePlugin {

package/plugins/bindRowsWithHeaders/bindRowsWithHeaders.mjs

@@ -44,6 +44,19 @@ const bindTypeToMapStrategy = new Map([['loose', LooseBindsMap], ['strict', Stri
  * />
  * ```
  * :::
+ *
+ * ::: only-for angular
+ * ```ts
+ * settings = {
+ *   data: getData(),
+ *   bindRowsWithHeaders: true,
+ * };
+ * ```
+ *
+ * ```html
+ * <hot-table [settings]="settings" />
+ * ```
+ * :::
  */
 var _BindRowsWithHeaders_brand = /*#__PURE__*/new WeakSet();
 export class BindRowsWithHeaders extends BasePlugin {

package/plugins/collapsibleColumns/collapsibleColumns.js

@@ -105,6 +105,37 @@ const actionDictionary = new Map([['collapse', {
  * />
  * ```
  * :::
+ *
+ * ::: only-for angular
+ * ```ts
+ * // Enable the collapsibleColumns plugin
+ * settings = {
+ *   data: generateDataObj(),
+ *   colHeaders: true,
+ *   rowHeaders: true,
+ *   nestedHeaders: true,
+ *   // enable plugin
+ *   collapsibleColumns: true,
+ * };
+ *
+ * // Or enable and configure specific collapsible columns
+ * settings = {
+ *   data: generateDataObj(),
+ *   colHeaders: true,
+ *   rowHeaders: true,
+ *   nestedHeaders: true,
+ *   // enable and configure which columns can be collapsed
+ *   collapsibleColumns: [
+ *     { row: -4, col: 1, collapsible: true },
+ *     { row: -3, col: 5, collapsible: true },
+ *   ],
+ * };
+ * ```
+ *
+ * ```html
+ * <hot-table [settings]="settings"></hot-table>
+ * ```
+ * :::
  */
 var _collapsedColumnsMap = /*#__PURE__*/new WeakMap();
 var _CollapsibleColumns_brand = /*#__PURE__*/new WeakSet();