handsontable 0.0.0-next-a2cc849-20240208 → 0.0.0-next-d255844-20240209

package/editorManager.js

@@ -318,22 +318,18 @@ class EditorManager {
   }
 
   /**
-   * Controls selection's behavior after clicking `Enter`.
+   * Controls selection's behaviour after clicking `Enter`.
    *
    * @private
-   * @param {KeyboardEvent} event The keyboard event object.
+   * @param {boolean} isShiftPressed If `true`, then the selection will move up after hit enter.
    */
-  moveSelectionAfterEnter(event) {
-    const enterMoves = {
-      ...(typeof this.tableMeta.enterMoves === 'function' ? this.tableMeta.enterMoves(event) : this.tableMeta.enterMoves)
-    };
-    if (event.shiftKey) {
-      enterMoves.row = -enterMoves.row;
-      enterMoves.col = -enterMoves.col;
-    }
-    if (this.hot.selection.isMultiple()) {
-      this.selection.transformFocus(enterMoves.row, enterMoves.col);
+  moveSelectionAfterEnter(isShiftPressed) {
+    const enterMoves = typeof this.tableMeta.enterMoves === 'function' ? this.tableMeta.enterMoves(event) : this.tableMeta.enterMoves;
+    if (isShiftPressed) {
+      // move selection up
+      this.selection.transformStart(-enterMoves.row, -enterMoves.col);
     } else {
+      // move selection down (add a new row if needed)
       this.selection.transformStart(enterMoves.row, enterMoves.col, true);
     }
   }

package/editorManager.mjs

@@ -314,22 +314,18 @@ class EditorManager {
   }
 
   /**
-   * Controls selection's behavior after clicking `Enter`.
+   * Controls selection's behaviour after clicking `Enter`.
    *
    * @private
-   * @param {KeyboardEvent} event The keyboard event object.
+   * @param {boolean} isShiftPressed If `true`, then the selection will move up after hit enter.
    */
-  moveSelectionAfterEnter(event) {
-    const enterMoves = {
-      ...(typeof this.tableMeta.enterMoves === 'function' ? this.tableMeta.enterMoves(event) : this.tableMeta.enterMoves)
-    };
-    if (event.shiftKey) {
-      enterMoves.row = -enterMoves.row;
-      enterMoves.col = -enterMoves.col;
-    }
-    if (this.hot.selection.isMultiple()) {
-      this.selection.transformFocus(enterMoves.row, enterMoves.col);
+  moveSelectionAfterEnter(isShiftPressed) {
+    const enterMoves = typeof this.tableMeta.enterMoves === 'function' ? this.tableMeta.enterMoves(event) : this.tableMeta.enterMoves;
+    if (isShiftPressed) {
+      // move selection up
+      this.selection.transformStart(-enterMoves.row, -enterMoves.col);
     } else {
+      // move selection down (add a new row if needed)
       this.selection.transformStart(enterMoves.row, enterMoves.col, true);
     }
   }

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-a2cc849-20240208";
+  const hotVersion = "0.0.0-next-d255844-20240209";
   let keyValidityDate;
   let consoleMessageState = 'invalid';
   let domMessageState = 'invalid';

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-a2cc849-20240208";
+  const hotVersion = "0.0.0-next-d255844-20240209";
   let keyValidityDate;
   let consoleMessageState = 'invalid';
   let domMessageState = 'invalid';

package/package.json

@@ -10,7 +10,7 @@
     "url": "https://github.com/handsontable/handsontable/issues"
   },
   "author": "Handsoncode <hello@handsontable.com>",
-  "version": "0.0.0-next-a2cc849-20240208",
+  "version": "0.0.0-next-d255844-20240209",
   "main": "index",
   "module": "index.mjs",
   "jsnext:main": "index.mjs",

package/pluginHooks.d.ts

@@ -133,7 +133,6 @@ export interface Events {
   afterSelectionByProp?: (row: number, prop: string, row2: number, prop2: string, preventScrolling: { value: boolean }, selectionLayerLevel: number) => void;
   afterSelectionEnd?: (row: number, column: number, row2: number, column2: number, selectionLayerLevel: number) => void;
   afterSelectionEndByProp?: (row: number, prop: string, row2: number, prop2: string, selectionLayerLevel: number) => void;
-  afterSelectionFocusSet?: (row: number, column: number, preventScrolling: { value: boolean }) => void;
   afterSelectRows?: (from: CellCoords, to: CellCoords, highlight: CellCoords) => void;
   afterSetCellMeta?: (row: number, column: number, key: string, value: any) => void;
   afterSetDataAtCell?: (changes: CellChange[], source?: ChangeSource) => void;
@@ -243,6 +242,7 @@ export interface Events {
   modifyColumnHeaderValue?: (headerValue: string, visualColumnIndex: number, headerLevel: number) => void | string;
   modifyColWidth?: (width: number, column: number) => void;
   modifyCopyableRange?: (copyableRanges: RangeType[]) => void;
+  modifyFiltersMultiSelectValue?: (value: string, meta: CellProperties) => void | CellValue;
   modifyFocusedElement?: (row: number, column: number, focusedElement: HTMLElement) => void | HTMLElement;
   modifyData?: (row: number, column: number, valueHolder: { value: CellValue }, ioMode: 'get' | 'set') => void;
   modifyFocusOnTabNavigation?: (tabActivationDir: 'from_above' | 'from_below', visualCoords: CellCoords) => void;

package/pluginHooks.js

@@ -650,9 +650,7 @@ const REGISTERED_HOOKS = [/* eslint-disable jsdoc/require-description-complete-s
  * @param {string} prop Selection start data source object property name.
  * @param {number} row2 Selection end visual row index.
  * @param {string} prop2 Selection end data source object property name.
- * @param {object} preventScrolling A reference to the observable object with the `value` property.
- *                                  Property `preventScrolling.value` expects a boolean value that
- *                                  Handsontable uses to control scroll behavior after selection.
+ * @param {object} preventScrolling Object with `value` property where its value change will be observed.
  * @param {number} selectionLayerLevel The number which indicates what selection layer is currently modified.
  * @example
  * ```js
@@ -702,46 +700,6 @@ const REGISTERED_HOOKS = [/* eslint-disable jsdoc/require-description-complete-s
  * @param {number} selectionLayerLevel The number which indicates what selection layer is currently modified.
  */
 'afterSelectionEndByProp',
-/**
- * Fired after the focus position within a selected range is changed.
- *
- * @since 14.2.0
- * @event Hooks#afterSelectionFocusSet
- * @param {number} row The focus visual row index position.
- * @param {number} column The focus visual column index position.
- * @param {object} preventScrolling A reference to the observable object with the `value` property.
- *                                  Property `preventScrolling.value` expects a boolean value that
- *                                  Handsontable uses to control scroll behavior after selection.
- * @example
- * ```js
- * ::: only-for javascript
- * new Handsontable(element, {
- *   afterSelectionFocusSet: (row, column, preventScrolling) => {
- *     // If set to `false` (default): when focused cell selection is outside the viewport,
- *     // Handsontable scrolls the viewport to that cell.
- *     // If set to `true`: when focused cell selection is outside the viewport,
- *     // Handsontable doesn't scroll the viewport.
- *     preventScrolling.value = true;
- *   }
- * })
- * ```
- * :::
- *
- * ::: only-for react
- * ```jsx
- * <HotTable
- *   afterSelectionFocusSet={(row, column, preventScrolling) => {
- *     // If set to `false` (default): when focused cell selection is outside the viewport,
- *     // Handsontable scrolls the viewport to that cell.
- *     // If set to `true`: when focused cell selection is outside the viewport,
- *     // Handsontable doesn't scroll the viewport.
- *     preventScrolling.value = true;
- *   }}
- * />
- * ```
- * :::
- */
-'afterSelectionFocusSet',
 /**
  * Fired before one or more columns are selected (e.g. During mouse header click or {@link Core#selectColumns} API call).
  *
@@ -1382,6 +1340,16 @@ const REGISTERED_HOOKS = [/* eslint-disable jsdoc/require-description-complete-s
  * @param {number} column Visual column index.
  */
 'modifyColWidth',
+/**
+ * Fired when rendering the list of values in the multiple-selection component of the Filters dropdown.
+ * The hook allows modifying the displayed values in that component.
+ *
+ * @since 14.2.0
+ * @event Hooks#modifyFiltersMultiSelectValue
+ * @param {object} item The item in the list of values.
+ * @param {object} meta The cell properties object.
+ */
+'modifyFiltersMultiSelectValue',
 /**
  * Fired when focusing a cell or a header element. Allows replacing the element to be focused by returning a
  * different HTML element.

package/pluginHooks.mjs

@@ -646,9 +646,7 @@ const REGISTERED_HOOKS = [/* eslint-disable jsdoc/require-description-complete-s
  * @param {string} prop Selection start data source object property name.
  * @param {number} row2 Selection end visual row index.
  * @param {string} prop2 Selection end data source object property name.
- * @param {object} preventScrolling A reference to the observable object with the `value` property.
- *                                  Property `preventScrolling.value` expects a boolean value that
- *                                  Handsontable uses to control scroll behavior after selection.
+ * @param {object} preventScrolling Object with `value` property where its value change will be observed.
  * @param {number} selectionLayerLevel The number which indicates what selection layer is currently modified.
  * @example
  * ```js
@@ -698,46 +696,6 @@ const REGISTERED_HOOKS = [/* eslint-disable jsdoc/require-description-complete-s
  * @param {number} selectionLayerLevel The number which indicates what selection layer is currently modified.
  */
 'afterSelectionEndByProp',
-/**
- * Fired after the focus position within a selected range is changed.
- *
- * @since 14.2.0
- * @event Hooks#afterSelectionFocusSet
- * @param {number} row The focus visual row index position.
- * @param {number} column The focus visual column index position.
- * @param {object} preventScrolling A reference to the observable object with the `value` property.
- *                                  Property `preventScrolling.value` expects a boolean value that
- *                                  Handsontable uses to control scroll behavior after selection.
- * @example
- * ```js
- * ::: only-for javascript
- * new Handsontable(element, {
- *   afterSelectionFocusSet: (row, column, preventScrolling) => {
- *     // If set to `false` (default): when focused cell selection is outside the viewport,
- *     // Handsontable scrolls the viewport to that cell.
- *     // If set to `true`: when focused cell selection is outside the viewport,
- *     // Handsontable doesn't scroll the viewport.
- *     preventScrolling.value = true;
- *   }
- * })
- * ```
- * :::
- *
- * ::: only-for react
- * ```jsx
- * <HotTable
- *   afterSelectionFocusSet={(row, column, preventScrolling) => {
- *     // If set to `false` (default): when focused cell selection is outside the viewport,
- *     // Handsontable scrolls the viewport to that cell.
- *     // If set to `true`: when focused cell selection is outside the viewport,
- *     // Handsontable doesn't scroll the viewport.
- *     preventScrolling.value = true;
- *   }}
- * />
- * ```
- * :::
- */
-'afterSelectionFocusSet',
 /**
  * Fired before one or more columns are selected (e.g. During mouse header click or {@link Core#selectColumns} API call).
  *
@@ -1378,6 +1336,16 @@ const REGISTERED_HOOKS = [/* eslint-disable jsdoc/require-description-complete-s
  * @param {number} column Visual column index.
  */
 'modifyColWidth',
+/**
+ * Fired when rendering the list of values in the multiple-selection component of the Filters dropdown.
+ * The hook allows modifying the displayed values in that component.
+ *
+ * @since 14.2.0
+ * @event Hooks#modifyFiltersMultiSelectValue
+ * @param {object} item The item in the list of values.
+ * @param {object} meta The cell properties object.
+ */
+'modifyFiltersMultiSelectValue',
 /**
  * Fired when focusing a cell or a header element. Allows replacing the element to be focused by returning a
  * different HTML element.

package/plugins/collapsibleColumns/collapsibleColumns.js

@@ -9,7 +9,6 @@ var _number = require("../../helpers/number");
 var _console = require("../../helpers/console");
 var _element = require("../../helpers/dom/element");
 var _event = require("../../helpers/dom/event");
-var _shortcutContexts = require("../../shortcutContexts");
 var _a11y = require("../../helpers/a11y");
 function _classPrivateMethodInitSpec(obj, privateSet) { _checkPrivateRedeclaration(obj, privateSet); privateSet.add(obj); }
 function _classPrivateFieldInitSpec(obj, privateMap, value) { _checkPrivateRedeclaration(obj, privateMap); privateMap.set(obj, value); }
@@ -309,17 +308,12 @@ class CollapsibleColumns extends _base.BasePlugin {
             col: columnIndex
           });
         }
-
-        // prevent default Enter behavior (move to the next row within a selection range)
-        return false;
       },
       runOnlyIf: () => {
         var _this$hot$getSelected;
         return (_this$hot$getSelected = this.hot.getSelectedRangeLast()) === null || _this$hot$getSelected === void 0 ? void 0 : _this$hot$getSelected.highlight.isHeader();
       },
-      group: SHORTCUTS_GROUP,
-      relativeToGroup: _shortcutContexts.EDITOR_EDIT_GROUP,
-      position: 'before'
+      group: SHORTCUTS_GROUP
     });
   }
 

package/plugins/collapsibleColumns/collapsibleColumns.mjs

@@ -18,7 +18,6 @@ import { rangeEach } from "../../helpers/number.mjs";
 import { warn } from "../../helpers/console.mjs";
 import { addClass, hasClass, removeClass, fastInnerText, removeAttribute, setAttribute } from "../../helpers/dom/element.mjs";
 import { stopImmediatePropagation } from "../../helpers/dom/event.mjs";
-import { EDITOR_EDIT_GROUP as SHORTCUTS_GROUP_EDITOR } from "../../shortcutContexts/index.mjs";
 import { A11Y_EXPANDED, A11Y_HIDDEN } from "../../helpers/a11y.mjs";
 export const PLUGIN_KEY = 'collapsibleColumns';
 export const PLUGIN_PRIORITY = 290;
@@ -306,17 +305,12 @@ export class CollapsibleColumns extends BasePlugin {
             col: columnIndex
           });
         }
-
-        // prevent default Enter behavior (move to the next row within a selection range)
-        return false;
       },
       runOnlyIf: () => {
         var _this$hot$getSelected;
         return (_this$hot$getSelected = this.hot.getSelectedRangeLast()) === null || _this$hot$getSelected === void 0 ? void 0 : _this$hot$getSelected.highlight.isHeader();
       },
-      group: SHORTCUTS_GROUP,
-      relativeToGroup: SHORTCUTS_GROUP_EDITOR,
-      position: 'before'
+      group: SHORTCUTS_GROUP
     });
   }
 

package/plugins/columnSorting/columnSorting.js

@@ -12,7 +12,6 @@ var _base = require("../base");
 var _translations = require("../../translations");
 var _pluginHooks = _interopRequireDefault(require("../../pluginHooks"));
 var _columnStatesManager = require("./columnStatesManager");
-var _shortcutContexts = require("../../shortcutContexts");
 var _utils = require("./utils");
 var _domHelpers = require("./domHelpers");
 var _rootComparator = require("./rootComparator");
@@ -250,17 +249,12 @@ class ColumnSorting extends _base.BasePlugin {
         if (highlight.row === -1 && highlight.col >= 0) {
           this.sort(this.getColumnNextConfig(highlight.col));
         }
-
-        // prevent default Enter behavior (move to the next row within a selection range)
-        return false;
       },
       runOnlyIf: () => {
         var _this$hot$getSelected;
         const highlight = (_this$hot$getSelected = this.hot.getSelectedRangeLast()) === null || _this$hot$getSelected === void 0 ? void 0 : _this$hot$getSelected.highlight;
         return highlight && this.hot.selection.isCellVisible(highlight) && highlight.isHeader();
       },
-      relativeToGroup: _shortcutContexts.EDITOR_EDIT_GROUP,
-      position: 'before',
       group: SHORTCUTS_GROUP
     });
   }

package/plugins/columnSorting/columnSorting.mjs

@@ -15,7 +15,6 @@ import { BasePlugin } from "../base/index.mjs";
 import { IndexesSequence, PhysicalIndexToValueMap as IndexToValueMap } from "../../translations/index.mjs";
 import Hooks from "../../pluginHooks.mjs";
 import { ColumnStatesManager } from "./columnStatesManager.mjs";
-import { EDITOR_EDIT_GROUP as SHORTCUTS_GROUP_EDITOR } from "../../shortcutContexts/index.mjs";
 import { HEADER_SPAN_CLASS, getNextSortOrder, areValidSortStates, getHeaderSpanElement, isFirstLevelColumnHeader, wasHeaderClickedProperly } from "./utils.mjs";
 import { getClassesToRemove, getClassesToAdd } from "./domHelpers.mjs";
 import { rootComparator } from "./rootComparator.mjs";
@@ -246,17 +245,12 @@ export class ColumnSorting extends BasePlugin {
         if (highlight.row === -1 && highlight.col >= 0) {
           this.sort(this.getColumnNextConfig(highlight.col));
         }
-
-        // prevent default Enter behavior (move to the next row within a selection range)
-        return false;
       },
       runOnlyIf: () => {
         var _this$hot$getSelected;
         const highlight = (_this$hot$getSelected = this.hot.getSelectedRangeLast()) === null || _this$hot$getSelected === void 0 ? void 0 : _this$hot$getSelected.highlight;
         return highlight && this.hot.selection.isCellVisible(highlight) && highlight.isHeader();
       },
-      relativeToGroup: SHORTCUTS_GROUP_EDITOR,
-      position: 'before',
       group: SHORTCUTS_GROUP
     });
   }

package/plugins/contextMenu/menu/defaultShortcutsList.js

@@ -9,26 +9,10 @@ exports.createDefaultShortcutsList = createDefaultShortcutsList;
  * @returns {KeyboardShortcut[]}
  */
 function createDefaultShortcutsList(menu) {
-  const {
-    hot,
-    hotMenu
-  } = menu;
   return [{
-    keys: [['Control/Meta', 'A']],
-    forwardToContext: hot.getShortcutManager().getContext('grid'),
+    keys: [['Tab'], ['Shift', 'Tab'], ['Control/Meta', 'A']],
+    forwardToContext: menu.hot.getShortcutManager().getContext('grid'),
     callback: () => menu.close(true)
-  }, {
-    keys: [['Tab'], ['Shift', 'Tab']],
-    callback: (event, keys) => {
-      const settings = hot.getSettings();
-      const tabMoves = typeof settings.tabMoves === 'function' ? settings.tabMoves(event) : settings.tabMoves;
-      if (keys.includes('shift')) {
-        hot.selection.transformStart(-tabMoves.row, -tabMoves.col);
-      } else {
-        hot.selection.transformStart(tabMoves.row, tabMoves.col);
-      }
-      menu.close(true);
-    }
   }, {
     keys: [['Escape']],
     callback: () => menu.close()
@@ -41,7 +25,7 @@ function createDefaultShortcutsList(menu) {
   }, {
     keys: [['ArrowRight']],
     callback: () => {
-      const selection = hotMenu.getSelectedLast();
+      const selection = menu.hotMenu.getSelectedLast();
       if (selection) {
         const subMenu = menu.openSubMenu(selection[0]);
         if (subMenu) {
@@ -52,7 +36,7 @@ function createDefaultShortcutsList(menu) {
   }, {
     keys: [['ArrowLeft']],
     callback: () => {
-      const selection = hotMenu.getSelectedLast();
+      const selection = menu.hotMenu.getSelectedLast();
       if (selection && menu.isSubMenu()) {
         menu.close();
         if (menu.isSubMenu()) {
@@ -69,11 +53,11 @@ function createDefaultShortcutsList(menu) {
   }, {
     keys: [['Enter'], ['Space']],
     callback: event => {
-      const selection = hotMenu.getSelectedLast();
+      const selection = menu.hotMenu.getSelectedLast();
       if (!selection) {
         return;
       }
-      if (hotMenu.getSourceDataAtRow(selection[0]).submenu) {
+      if (menu.hotMenu.getSourceDataAtRow(selection[0]).submenu) {
         menu.openSubMenu(selection[0]).getNavigator().toFirstItem();
       } else {
         menu.executeCommand(event);
@@ -83,9 +67,9 @@ function createDefaultShortcutsList(menu) {
   }, {
     keys: [['PageUp']],
     callback: () => {
-      const selection = hotMenu.getSelectedLast();
+      const selection = menu.hotMenu.getSelectedLast();
       if (selection) {
-        hotMenu.selection.transformStart(-hotMenu.countVisibleRows(), 0);
+        menu.hotMenu.selection.transformStart(-menu.hotMenu.countVisibleRows(), 0);
       } else {
         menu.getNavigator().toFirstItem();
       }
@@ -93,9 +77,9 @@ function createDefaultShortcutsList(menu) {
   }, {
     keys: [['PageDown']],
     callback: () => {
-      const selection = hotMenu.getSelectedLast();
+      const selection = menu.hotMenu.getSelectedLast();
       if (selection) {
-        hotMenu.selection.transformStart(hotMenu.countVisibleRows(), 0);
+        menu.hotMenu.selection.transformStart(menu.hotMenu.countVisibleRows(), 0);
       } else {
         menu.getNavigator().toLastItem();
       }

package/plugins/contextMenu/menu/defaultShortcutsList.mjs

@@ -5,26 +5,10 @@
  * @returns {KeyboardShortcut[]}
  */
 export function createDefaultShortcutsList(menu) {
-  const {
-    hot,
-    hotMenu
-  } = menu;
   return [{
-    keys: [['Control/Meta', 'A']],
-    forwardToContext: hot.getShortcutManager().getContext('grid'),
+    keys: [['Tab'], ['Shift', 'Tab'], ['Control/Meta', 'A']],
+    forwardToContext: menu.hot.getShortcutManager().getContext('grid'),
     callback: () => menu.close(true)
-  }, {
-    keys: [['Tab'], ['Shift', 'Tab']],
-    callback: (event, keys) => {
-      const settings = hot.getSettings();
-      const tabMoves = typeof settings.tabMoves === 'function' ? settings.tabMoves(event) : settings.tabMoves;
-      if (keys.includes('shift')) {
-        hot.selection.transformStart(-tabMoves.row, -tabMoves.col);
-      } else {
-        hot.selection.transformStart(tabMoves.row, tabMoves.col);
-      }
-      menu.close(true);
-    }
   }, {
     keys: [['Escape']],
     callback: () => menu.close()
@@ -37,7 +21,7 @@ export function createDefaultShortcutsList(menu) {
   }, {
     keys: [['ArrowRight']],
     callback: () => {
-      const selection = hotMenu.getSelectedLast();
+      const selection = menu.hotMenu.getSelectedLast();
       if (selection) {
         const subMenu = menu.openSubMenu(selection[0]);
         if (subMenu) {
@@ -48,7 +32,7 @@ export function createDefaultShortcutsList(menu) {
   }, {
     keys: [['ArrowLeft']],
     callback: () => {
-      const selection = hotMenu.getSelectedLast();
+      const selection = menu.hotMenu.getSelectedLast();
       if (selection && menu.isSubMenu()) {
         menu.close();
         if (menu.isSubMenu()) {
@@ -65,11 +49,11 @@ export function createDefaultShortcutsList(menu) {
   }, {
     keys: [['Enter'], ['Space']],
     callback: event => {
-      const selection = hotMenu.getSelectedLast();
+      const selection = menu.hotMenu.getSelectedLast();
       if (!selection) {
         return;
       }
-      if (hotMenu.getSourceDataAtRow(selection[0]).submenu) {
+      if (menu.hotMenu.getSourceDataAtRow(selection[0]).submenu) {
         menu.openSubMenu(selection[0]).getNavigator().toFirstItem();
       } else {
         menu.executeCommand(event);
@@ -79,9 +63,9 @@ export function createDefaultShortcutsList(menu) {
   }, {
     keys: [['PageUp']],
     callback: () => {
-      const selection = hotMenu.getSelectedLast();
+      const selection = menu.hotMenu.getSelectedLast();
       if (selection) {
-        hotMenu.selection.transformStart(-hotMenu.countVisibleRows(), 0);
+        menu.hotMenu.selection.transformStart(-menu.hotMenu.countVisibleRows(), 0);
       } else {
         menu.getNavigator().toFirstItem();
       }
@@ -89,9 +73,9 @@ export function createDefaultShortcutsList(menu) {
   }, {
     keys: [['PageDown']],
     callback: () => {
-      const selection = hotMenu.getSelectedLast();
+      const selection = menu.hotMenu.getSelectedLast();
       if (selection) {
-        hotMenu.selection.transformStart(hotMenu.countVisibleRows(), 0);
+        menu.hotMenu.selection.transformStart(menu.hotMenu.countVisibleRows(), 0);
       } else {
         menu.getNavigator().toLastItem();
       }

package/plugins/filters/component/value.js

@@ -13,6 +13,7 @@ var _base = require("./_base");
 var _multipleSelect = require("../ui/multipleSelect");
 var _constants2 = require("../constants");
 var _conditionRegisterer = require("../conditionRegisterer");
+var _numericRenderer = require("../../../renderers/numericRenderer");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 function _classPrivateMethodInitSpec(obj, privateSet) { _checkPrivateRedeclaration(obj, privateSet); privateSet.add(obj); }
@@ -26,12 +27,29 @@ function _classPrivateMethodGet(receiver, privateSet, fn) { if (!privateSet.has(
  * @class ValueComponent
  */
 var _onInputKeyDown = /*#__PURE__*/new WeakSet();
+var _triggerModifyMultipleSelectionValueHook = /*#__PURE__*/new WeakSet();
+var _onModifyDisplayedValue = /*#__PURE__*/new WeakSet();
 class ValueComponent extends _base.BaseComponent {
   constructor(hotInstance, options) {
     super(hotInstance, {
       id: options.id,
       stateless: false
     });
+    /**
+     * Modify the value displayed in the multiple select list.
+     *
+     * @param {*} value Cell value.
+     * @param {object} meta The cell meta object.
+     * @returns {*} Returns the modified value.
+     */
+    _classPrivateMethodInitSpec(this, _onModifyDisplayedValue);
+    /**
+     * Trigger the `modifyFiltersMultiSelectValue` hook.
+     *
+     * @param {object} item Item from the multiple select list.
+     * @param {Map} metaMap Map of row meta objects.
+     */
+    _classPrivateMethodInitSpec(this, _triggerModifyMultipleSelectionValueHook);
     /**
      * Key down listener.
      *
@@ -56,6 +74,7 @@ class ValueComponent extends _base.BaseComponent {
    */
   registerHooks() {
     this.getMultipleSelectElement().addLocalHook('keydown', event => _classPrivateMethodGet(this, _onInputKeyDown, _onInputKeyDown2).call(this, event)).addLocalHook('listTabKeydown', event => this.runLocalHooks('listTabKeydown', event));
+    this.hot.addHook('modifyFiltersMultiSelectValue', (value, meta) => _classPrivateMethodGet(this, _onModifyDisplayedValue, _onModifyDisplayedValue2).call(this, value, meta));
   }
 
   /**
@@ -113,15 +132,19 @@ class ValueComponent extends _base.BaseComponent {
       const state = {};
       const defaultBlankCellValue = this.hot.getTranslatedPhrase(C.FILTERS_VALUES_BLANK_CELLS);
       if (firstByValueCondition) {
-        const rowValues = (0, _utils.unifyColumnValues)((0, _array.arrayMap)(filteredRowsFactory(physicalColumn, conditionsStack), row => row.value));
+        const filteredRows = filteredRowsFactory(physicalColumn, conditionsStack);
+        const rowValues = (0, _array.arrayMap)(filteredRows, row => row.value);
+        const rowMetaMap = new Map(filteredRows.map(row => [row.value, this.hot.getCellMeta(row.meta.visualRow, row.meta.visualCol)]));
+        const unifiedRowValues = (0, _utils.unifyColumnValues)(rowValues);
         if (conditionArgsChange) {
           firstByValueCondition.args[0] = conditionArgsChange;
         }
         const selectedValues = [];
-        const itemsSnapshot = (0, _utils.intersectValues)(rowValues, firstByValueCondition.args[0], defaultBlankCellValue, item => {
+        const itemsSnapshot = (0, _utils.intersectValues)(unifiedRowValues, firstByValueCondition.args[0], defaultBlankCellValue, item => {
           if (item.checked) {
             selectedValues.push(item.value);
           }
+          _classPrivateMethodGet(this, _triggerModifyMultipleSelectionValueHook, _triggerModifyMultipleSelectionValueHook2).call(this, item, rowMetaMap);
         });
         const column = stateInfo.editedConditionStack.column;
         state.locale = this.hot.getCellMeta(0, column).locale;
@@ -182,8 +205,13 @@ class ValueComponent extends _base.BaseComponent {
    */
   reset() {
     const defaultBlankCellValue = this.hot.getTranslatedPhrase(C.FILTERS_VALUES_BLANK_CELLS);
-    const values = (0, _utils.unifyColumnValues)(this._getColumnVisibleValues());
-    const items = (0, _utils.intersectValues)(values, values, defaultBlankCellValue);
+    const rowEntries = this._getColumnVisibleValues();
+    const rowValues = rowEntries.map(entry => entry.value);
+    const rowMetaMap = new Map(rowEntries.map(row => [row.value, row.meta]));
+    const values = (0, _utils.unifyColumnValues)(rowValues);
+    const items = (0, _utils.intersectValues)(values, values, defaultBlankCellValue, item => {
+      _classPrivateMethodGet(this, _triggerModifyMultipleSelectionValueHook, _triggerModifyMultipleSelectionValueHook2).call(this, item, rowMetaMap);
+    });
     this.getMultipleSelectElement().setItems(items);
     super.reset();
     this.getMultipleSelectElement().setValue(values);
@@ -203,7 +231,12 @@ class ValueComponent extends _base.BaseComponent {
     if (selectedColumn === null) {
       return [];
     }
-    return (0, _array.arrayMap)(this.hot.getDataAtCol(selectedColumn.visualIndex), v => (0, _utils.toEmptyString)(v));
+    return (0, _array.arrayMap)(this.hot.getDataAtCol(selectedColumn.visualIndex), (v, rowIndex) => {
+      return {
+        value: (0, _utils.toEmptyString)(v),
+        meta: this.hot.getCellMeta(selectedColumn.visualIndex, rowIndex)
+      };
+    });
   }
 }
 exports.ValueComponent = ValueComponent;
@@ -212,4 +245,17 @@ function _onInputKeyDown2(event) {
     this.runLocalHooks('cancel');
     (0, _event.stopImmediatePropagation)(event);
   }
+}
+function _triggerModifyMultipleSelectionValueHook2(item, metaMap) {
+  if (this.hot.hasHook('modifyFiltersMultiSelectValue')) {
+    item.visualValue = this.hot.runHooks('modifyFiltersMultiSelectValue', item.visualValue, metaMap.get(item.value));
+  }
+}
+function _onModifyDisplayedValue2(value, meta) {
+  switch (meta.type) {
+    case 'numeric':
+      return (0, _numericRenderer.getRenderedValue)(value, meta);
+    default:
+      return value;
+  }
 }