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

package/core.js

@@ -84,6 +84,12 @@ const deprecationWarns = new Set();
  * by using React's `ref` feature (read more on the [Instance methods](@/guides/getting-started/react-methods/react-methods.md) page).
  * :::
  *
+ * ::: only-for angular
+ * To use these methods, associate a Handsontable instance with your instance
+ * of the [`HotTable` component](@/guides/getting-started/installation/installation.md#5-use-the-hottable-component),
+ * by using `@ViewChild` decorator (read more on the [Instance access](@/guides/getting-started/angular-hot-instance/angular-hot-instance.md) page).
+ * :::
+ *
  * ## How to call a method
  *
  * ::: only-for javascript
@@ -114,6 +120,39 @@ const deprecationWarns = new Set();
  * ```
  * :::
  *
+ * ::: only-for angular
+ * ```ts
+ * import { Component, ViewChild, AfterViewInit } from "@angular/core";
+ * import {
+ *   GridSettings,
+ *   HotTableComponent,
+ *   HotTableModule,
+ * } from "@handsontable/angular-wrapper";
+ *
+ * `@Component`({
+ *   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>{
+ *     columns: [{}],
+ *   };
+ *
+ *   ngAfterViewInit(): void {
+ *     // Access the Handsontable instance
+ *     // Call a method
+ *     this.hotTable?.hotInstance?.setDataAtCell(0, 0, "new value");
+ *   }
+ * }
+ * ```
+ * :::
+ *
  * @param {HTMLElement} rootElement The element to which the Handsontable instance is injected.
  * @param {object} userSettings The user defined options.
  * @param {boolean} [rootInstanceSymbol=false] Indicates if the instance is root of all later instances created.
@@ -231,7 +270,6 @@ function Core(rootElement, userSettings) {
   const globalMeta = metaManager.getGlobalMeta();
   const pluginsRegistry = (0, _uniqueMap.createUniqueMap)();
   this.container = this.rootDocument.createElement('div');
-  this.renderCall = false;
   rootElement.insertBefore(this.container, rootElement.firstChild);
   if ((0, _rootInstance.isRootInstance)(this)) {
     (0, _mixed._injectProductInfo)(userSettings.licenseKey, rootElement);
@@ -263,6 +301,9 @@ function Core(rootElement, userSettings) {
   this.rowIndexMapper.addLocalHook('indexesSequenceChange', source => {
     instance.runHooks('afterRowSequenceChange', source);
   });
+  eventManager.addEventListener(this.rootDocument.documentElement, 'compositionstart', event => {
+    instance.runHooks('beforeCompositionStart', event);
+  });
   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
@@ -342,6 +383,7 @@ function Core(rootElement, userSettings) {
     let {
       hiddenIndexesChanged
     } = _ref;
+    this.forceFullRender = true;
     if (hiddenIndexesChanged) {
       this.selection.commit();
     }
@@ -625,13 +667,6 @@ function Core(rootElement, userSettings) {
                 }
               }
               const totalRows = instance.countRows();
-              if (totalRows === 0) {
-                selection.deselect();
-              } else if (source === 'ContextMenu.removeRow') {
-                selection.refresh();
-              } else {
-                selection.shiftRows(groupIndex, -groupAmount);
-              }
               const fixedRowsTop = tableMeta.fixedRowsTop;
               if (fixedRowsTop >= calcIndex + 1) {
                 tableMeta.fixedRowsTop -= Math.min(groupAmount, fixedRowsTop - calcIndex);
@@ -640,6 +675,13 @@ function Core(rootElement, userSettings) {
               if (fixedRowsBottom && calcIndex >= totalRows - fixedRowsBottom) {
                 tableMeta.fixedRowsBottom -= Math.min(groupAmount, fixedRowsBottom);
               }
+              if (totalRows === 0) {
+                selection.deselect();
+              } else if (source === 'ContextMenu.removeRow') {
+                selection.refresh();
+              } else {
+                selection.shiftRows(groupIndex, -groupAmount);
+              }
               offset += groupAmount;
             });
           };
@@ -1049,8 +1091,7 @@ function Core(rootElement, userSettings) {
       (0, _index.installFocusCatcher)(instance);
     }
     instance.runHooks('init');
-    this.forceFullRender = true; // used when data was changed
-    this.view.render();
+    this.render();
 
     // Run the logic only if it's the table's initialization and the root element is not visible.
     if (!!firstRun && instance.rootElement.offsetParent === null) {
@@ -1223,13 +1264,11 @@ function Core(rootElement, userSettings) {
       datamap.set(changes[i][0], changes[i][1], changes[i][3]);
     }
     const hasChanges = changes.length > 0;
-    instance.forceFullRender = true; // used when data was changed or when all cells need to be re-rendered
-
     if (hasChanges) {
       grid.adjustRowsAndCols();
       instance.runHooks('beforeChangeRender', changes, source);
       editorManager.closeEditor();
-      instance.view.render();
+      instance.render();
       editorManager.prepareEditor();
       instance.view.adjustElementsSize();
       instance.runHooks('afterChange', changes, source || 'edit');
@@ -1238,7 +1277,7 @@ function Core(rootElement, userSettings) {
         activeEditor.refreshValue();
       }
     } else {
-      instance.view.render();
+      instance.render();
     }
   }
 
@@ -1388,9 +1427,22 @@ function Core(rootElement, userSettings) {
           ...tableMeta
         };
       }
-      if (cellProperties.type === 'numeric' && typeof newValue === 'string' && (0, _number.isNumericLike)(newValue)) {
+      const {
+        type,
+        checkedTemplate,
+        uncheckedTemplate
+      } = cellProperties;
+      if (type === 'numeric' && typeof newValue === 'string' && (0, _number.isNumericLike)(newValue)) {
         filteredChanges[i][3] = getParsedNumber(newValue);
       }
+      if (type === 'checkbox') {
+        const stringifiedValue = (0, _mixed.stringify)(newValue);
+        const isChecked = stringifiedValue === (0, _mixed.stringify)(checkedTemplate);
+        const isUnchecked = stringifiedValue === (0, _mixed.stringify)(uncheckedTemplate);
+        if (isChecked || isUnchecked) {
+          filteredChanges[i][3] = isChecked ? checkedTemplate : uncheckedTemplate;
+        }
+      }
     }
     return filteredChanges;
   }
@@ -1792,11 +1844,7 @@ function Core(rootElement, userSettings) {
     const nextValue = this.renderSuspendedCounter - 1;
     this.renderSuspendedCounter = Math.max(nextValue, 0);
     if (!this.isRenderSuspended() && nextValue === this.renderSuspendedCounter) {
-      if (this.renderCall) {
-        this.render();
-      } else {
-        instance.view.render();
-      }
+      instance.view.render();
     }
   };
 
@@ -1812,9 +1860,8 @@ function Core(rootElement, userSettings) {
    */
   this.render = function () {
     if (this.view) {
-      this.renderCall = true;
-      this.forceFullRender = true; // used when data was changed or when all cells need to be re-rendered
-
+      // used when data was changed or when all cells need to be re-rendered (slow render)
+      this.forceFullRender = true;
       if (!this.isRenderSuspended()) {
         instance.view.render();
       }
@@ -2427,8 +2474,7 @@ function Core(rootElement, userSettings) {
     }
     grid.adjustRowsAndCols();
     if (instance.view && !firstRun) {
-      instance.forceFullRender = true; // used when data was changed
-      instance.view.render();
+      instance.render();
       instance.view._wt.wtOverlays.adjustElementsSize();
     }
     if (!init && instance.view && (currentHeight === '' || height === '' || height === undefined) && currentHeight !== height) {

package/core.mjs

@@ -14,7 +14,7 @@ import "core-js/modules/esnext.iterator.map.js";
 import "core-js/modules/web.immediate.js";
 import { addClass, empty, observeVisibilityChangeOnce, removeClass } from "./helpers/dom/element.mjs";
 import { isFunction } from "./helpers/function.mjs";
-import { isDefined, isUndefined, isRegExp, _injectProductInfo, isEmpty } from "./helpers/mixed.mjs";
+import { isDefined, isUndefined, isRegExp, _injectProductInfo, isEmpty, stringify } from "./helpers/mixed.mjs";
 import { isMobileBrowser, isIpadOS } from "./helpers/browser.mjs";
 import EditorManager from "./editorManager.mjs";
 import EventManager from "./eventManager.mjs";
@@ -79,6 +79,12 @@ const deprecationWarns = new Set();
  * by using React's `ref` feature (read more on the [Instance methods](@/guides/getting-started/react-methods/react-methods.md) page).
  * :::
  *
+ * ::: only-for angular
+ * To use these methods, associate a Handsontable instance with your instance
+ * of the [`HotTable` component](@/guides/getting-started/installation/installation.md#5-use-the-hottable-component),
+ * by using `@ViewChild` decorator (read more on the [Instance access](@/guides/getting-started/angular-hot-instance/angular-hot-instance.md) page).
+ * :::
+ *
  * ## How to call a method
  *
  * ::: only-for javascript
@@ -109,6 +115,39 @@ const deprecationWarns = new Set();
  * ```
  * :::
  *
+ * ::: only-for angular
+ * ```ts
+ * import { Component, ViewChild, AfterViewInit } from "@angular/core";
+ * import {
+ *   GridSettings,
+ *   HotTableComponent,
+ *   HotTableModule,
+ * } from "@handsontable/angular-wrapper";
+ *
+ * `@Component`({
+ *   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>{
+ *     columns: [{}],
+ *   };
+ *
+ *   ngAfterViewInit(): void {
+ *     // Access the Handsontable instance
+ *     // Call a method
+ *     this.hotTable?.hotInstance?.setDataAtCell(0, 0, "new value");
+ *   }
+ * }
+ * ```
+ * :::
+ *
  * @param {HTMLElement} rootElement The element to which the Handsontable instance is injected.
  * @param {object} userSettings The user defined options.
  * @param {boolean} [rootInstanceSymbol=false] Indicates if the instance is root of all later instances created.
@@ -226,7 +265,6 @@ export default function Core(rootElement, userSettings) {
   const globalMeta = metaManager.getGlobalMeta();
   const pluginsRegistry = createUniqueMap();
   this.container = this.rootDocument.createElement('div');
-  this.renderCall = false;
   rootElement.insertBefore(this.container, rootElement.firstChild);
   if (isRootInstance(this)) {
     _injectProductInfo(userSettings.licenseKey, rootElement);
@@ -258,6 +296,9 @@ export default function Core(rootElement, userSettings) {
   this.rowIndexMapper.addLocalHook('indexesSequenceChange', source => {
     instance.runHooks('afterRowSequenceChange', source);
   });
+  eventManager.addEventListener(this.rootDocument.documentElement, 'compositionstart', event => {
+    instance.runHooks('beforeCompositionStart', event);
+  });
   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
@@ -337,6 +378,7 @@ export default function Core(rootElement, userSettings) {
     let {
       hiddenIndexesChanged
     } = _ref;
+    this.forceFullRender = true;
     if (hiddenIndexesChanged) {
       this.selection.commit();
     }
@@ -620,13 +662,6 @@ export default function Core(rootElement, userSettings) {
                 }
               }
               const totalRows = instance.countRows();
-              if (totalRows === 0) {
-                selection.deselect();
-              } else if (source === 'ContextMenu.removeRow') {
-                selection.refresh();
-              } else {
-                selection.shiftRows(groupIndex, -groupAmount);
-              }
               const fixedRowsTop = tableMeta.fixedRowsTop;
               if (fixedRowsTop >= calcIndex + 1) {
                 tableMeta.fixedRowsTop -= Math.min(groupAmount, fixedRowsTop - calcIndex);
@@ -635,6 +670,13 @@ export default function Core(rootElement, userSettings) {
               if (fixedRowsBottom && calcIndex >= totalRows - fixedRowsBottom) {
                 tableMeta.fixedRowsBottom -= Math.min(groupAmount, fixedRowsBottom);
               }
+              if (totalRows === 0) {
+                selection.deselect();
+              } else if (source === 'ContextMenu.removeRow') {
+                selection.refresh();
+              } else {
+                selection.shiftRows(groupIndex, -groupAmount);
+              }
               offset += groupAmount;
             });
           };
@@ -1044,8 +1086,7 @@ export default function Core(rootElement, userSettings) {
       installFocusCatcher(instance);
     }
     instance.runHooks('init');
-    this.forceFullRender = true; // used when data was changed
-    this.view.render();
+    this.render();
 
     // Run the logic only if it's the table's initialization and the root element is not visible.
     if (!!firstRun && instance.rootElement.offsetParent === null) {
@@ -1218,13 +1259,11 @@ export default function Core(rootElement, userSettings) {
       datamap.set(changes[i][0], changes[i][1], changes[i][3]);
     }
     const hasChanges = changes.length > 0;
-    instance.forceFullRender = true; // used when data was changed or when all cells need to be re-rendered
-
     if (hasChanges) {
       grid.adjustRowsAndCols();
       instance.runHooks('beforeChangeRender', changes, source);
       editorManager.closeEditor();
-      instance.view.render();
+      instance.render();
       editorManager.prepareEditor();
       instance.view.adjustElementsSize();
       instance.runHooks('afterChange', changes, source || 'edit');
@@ -1233,7 +1272,7 @@ export default function Core(rootElement, userSettings) {
         activeEditor.refreshValue();
       }
     } else {
-      instance.view.render();
+      instance.render();
     }
   }
 
@@ -1383,9 +1422,22 @@ export default function Core(rootElement, userSettings) {
           ...tableMeta
         };
       }
-      if (cellProperties.type === 'numeric' && typeof newValue === 'string' && isNumericLike(newValue)) {
+      const {
+        type,
+        checkedTemplate,
+        uncheckedTemplate
+      } = cellProperties;
+      if (type === 'numeric' && typeof newValue === 'string' && isNumericLike(newValue)) {
         filteredChanges[i][3] = getParsedNumber(newValue);
       }
+      if (type === 'checkbox') {
+        const stringifiedValue = stringify(newValue);
+        const isChecked = stringifiedValue === stringify(checkedTemplate);
+        const isUnchecked = stringifiedValue === stringify(uncheckedTemplate);
+        if (isChecked || isUnchecked) {
+          filteredChanges[i][3] = isChecked ? checkedTemplate : uncheckedTemplate;
+        }
+      }
     }
     return filteredChanges;
   }
@@ -1787,11 +1839,7 @@ export default function Core(rootElement, userSettings) {
     const nextValue = this.renderSuspendedCounter - 1;
     this.renderSuspendedCounter = Math.max(nextValue, 0);
     if (!this.isRenderSuspended() && nextValue === this.renderSuspendedCounter) {
-      if (this.renderCall) {
-        this.render();
-      } else {
-        instance.view.render();
-      }
+      instance.view.render();
     }
   };
 
@@ -1807,9 +1855,8 @@ export default function Core(rootElement, userSettings) {
    */
   this.render = function () {
     if (this.view) {
-      this.renderCall = true;
-      this.forceFullRender = true; // used when data was changed or when all cells need to be re-rendered
-
+      // used when data was changed or when all cells need to be re-rendered (slow render)
+      this.forceFullRender = true;
       if (!this.isRenderSuspended()) {
         instance.view.render();
       }
@@ -2422,8 +2469,7 @@ export default function Core(rootElement, userSettings) {
     }
     grid.adjustRowsAndCols();
     if (instance.view && !firstRun) {
-      instance.forceFullRender = true; // used when data was changed
-      instance.view.render();
+      instance.render();
       instance.view._wt.wtOverlays.adjustElementsSize();
     }
     if (!init && instance.view && (currentHeight === '' || height === '' || height === undefined) && currentHeight !== height) {

package/dataMap/dataMap.js

@@ -357,8 +357,6 @@ class DataMap {
       }
     }
     this.hot.runHooks('afterCreateRow', newVisualRowIndex, numberOfCreatedRows, source);
-    this.hot.forceFullRender = true; // used when data was changed
-
     return {
       delta: numberOfCreatedRows,
       startPhysicalIndex: physicalRowIndex
@@ -444,8 +442,6 @@ class DataMap {
     }
     const newVisualColumnIndex = this.hot.toVisualColumn(startPhysicalIndex);
     this.hot.runHooks('afterCreateCol', newVisualColumnIndex, numberOfCreatedCols, source);
-    this.hot.forceFullRender = true; // used when data was changed
-
     this.refreshDuckSchema();
     return {
       delta: numberOfCreatedCols,
@@ -492,8 +488,6 @@ class DataMap {
       this.metaManager.removeRow(rowPhysicalIndex, 1);
     });
     this.hot.runHooks('afterRemoveRow', rowIndex, numberOfRemovedIndexes, removedPhysicalIndexes, source);
-    this.hot.forceFullRender = true; // used when data was changed
-
     return true;
   }
 
@@ -553,7 +547,6 @@ class DataMap {
       }
     }
     this.hot.runHooks('afterRemoveCol', columnIndex, amount, removedPhysicalIndexes, source);
-    this.hot.forceFullRender = true; // used when data was changed
     this.refreshDuckSchema();
     return true;
   }

package/dataMap/dataMap.mjs

@@ -353,8 +353,6 @@ class DataMap {
       }
     }
     this.hot.runHooks('afterCreateRow', newVisualRowIndex, numberOfCreatedRows, source);
-    this.hot.forceFullRender = true; // used when data was changed
-
     return {
       delta: numberOfCreatedRows,
       startPhysicalIndex: physicalRowIndex
@@ -440,8 +438,6 @@ class DataMap {
     }
     const newVisualColumnIndex = this.hot.toVisualColumn(startPhysicalIndex);
     this.hot.runHooks('afterCreateCol', newVisualColumnIndex, numberOfCreatedCols, source);
-    this.hot.forceFullRender = true; // used when data was changed
-
     this.refreshDuckSchema();
     return {
       delta: numberOfCreatedCols,
@@ -488,8 +484,6 @@ class DataMap {
       this.metaManager.removeRow(rowPhysicalIndex, 1);
     });
     this.hot.runHooks('afterRemoveRow', rowIndex, numberOfRemovedIndexes, removedPhysicalIndexes, source);
-    this.hot.forceFullRender = true; // used when data was changed
-
     return true;
   }
 
@@ -549,7 +543,6 @@ class DataMap {
       }
     }
     this.hot.runHooks('afterRemoveCol', columnIndex, amount, removedPhysicalIndexes, source);
-    this.hot.forceFullRender = true; // used when data was changed
     this.refreshDuckSchema();
     return true;
   }

package/dataMap/metaManager/metaSchema.js

@@ -83,6 +83,33 @@ var _object = require("../../helpers/object");
  * ```
  * :::
  *
+ * ::: only-for angular
+ * ```ts
+ * settings = {
+ *   data: [
+ *     ["A1", "B1", "C1", "D1", "E1"],
+ *     ["A2", "B2", "C2", "D2", "E2"],
+ *     ["A3", "B3", "C3", "D3", "E3"],
+ *     ["A4", "B4", "C4", "D4", "E4"],
+ *     ["A5", "B5", "C5", "D5", "E5"],
+ *   ],
+ *   width: 400,
+ *   height: 300,
+ *   colHeaders: true,
+ *   rowHeaders: true,
+ *   customBorders: true,
+ *   dropdownMenu: true,
+ *   multiColumnSorting: true,
+ *   filters: true,
+ *   manualRowMove: true,
+ * };
+ * ```
+ *
+ * ```html
+ * <hot-table [settings]="settings" />
+ * ```
+ * :::
+ *
  * Depending on your needs, you can apply [configuration options](@/api/options.md) to different elements of your grid:
  * - [The entire grid](@/guides/getting-started/configuration-options/configuration-options.md#set-grid-options)
  * - [Individual columns](@/guides/getting-started/configuration-options/configuration-options.md#set-column-options)
@@ -2649,6 +2676,7 @@ var _default = () => {
      * | `'de-CH'`           | German - Switzerland        |
      * | `'de-DE'`           | German - Germany            |
      * | `'es-MX'`           | Spanish - Mexico            |
+     * | `'fa-IR'`           | Persian - Iran              |
      * | `'fr-FR'`           | French - France             |
      * | `'hr-HR'`           | Croatian - Croatia          |
      * | `'it-IT'`           | Italian - Italy             |

package/dataMap/metaManager/metaSchema.mjs

@@ -80,6 +80,33 @@ import { isObjectEqual } from "../../helpers/object.mjs";
  * ```
  * :::
  *
+ * ::: only-for angular
+ * ```ts
+ * settings = {
+ *   data: [
+ *     ["A1", "B1", "C1", "D1", "E1"],
+ *     ["A2", "B2", "C2", "D2", "E2"],
+ *     ["A3", "B3", "C3", "D3", "E3"],
+ *     ["A4", "B4", "C4", "D4", "E4"],
+ *     ["A5", "B5", "C5", "D5", "E5"],
+ *   ],
+ *   width: 400,
+ *   height: 300,
+ *   colHeaders: true,
+ *   rowHeaders: true,
+ *   customBorders: true,
+ *   dropdownMenu: true,
+ *   multiColumnSorting: true,
+ *   filters: true,
+ *   manualRowMove: true,
+ * };
+ * ```
+ *
+ * ```html
+ * <hot-table [settings]="settings" />
+ * ```
+ * :::
+ *
  * Depending on your needs, you can apply [configuration options](@/api/options.md) to different elements of your grid:
  * - [The entire grid](@/guides/getting-started/configuration-options/configuration-options.md#set-grid-options)
  * - [Individual columns](@/guides/getting-started/configuration-options/configuration-options.md#set-column-options)
@@ -2646,6 +2673,7 @@ export default () => {
      * | `'de-CH'`           | German - Switzerland        |
      * | `'de-DE'`           | German - Germany            |
      * | `'es-MX'`           | Spanish - Mexico            |
+     * | `'fa-IR'`           | Persian - Iran              |
      * | `'fr-FR'`           | French - France             |
      * | `'hr-HR'`           | Croatian - Croatia          |
      * | `'it-IT'`           | Italian - Italy             |

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: 0.0.0-next-ff10728-20250410
- * Release date: 20/02/2025 (built at 10/04/2025 06:44:13)
+ * Version: 0.0.0-next-d9b3885-20250415
+ * Release date: 19/03/2025 (built at 15/04/2025 10:07:06)
  */
 /**
  * Fix for bootstrap styles
@@ -1458,7 +1458,7 @@ textarea.HandsontableCopyPaste {
 }
 
 .htUIMultipleSelect .ht_master .wtHolder {
-  overflow-y: scroll;
+  overflow: auto;
 }
 
 .handsontable .htFiltersActive .changeType {

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: 0.0.0-next-ff10728-20250410
- * Release date: 20/02/2025 (built at 10/04/2025 06:44:13)
+ * Version: 0.0.0-next-d9b3885-20250415
+ * Release date: 19/03/2025 (built at 15/04/2025 10:07:06)
  */
 /**
  * Fix for bootstrap styles
@@ -1458,7 +1458,7 @@ textarea.HandsontableCopyPaste {
 }
 
 .htUIMultipleSelect .ht_master .wtHolder {
-  overflow-y: scroll;
+  overflow: auto;
 }
 
 .handsontable .htFiltersActive .changeType {