handsontable 14.0.0-next-104f8c6-20231124 → 14.0.0-next-23212d5-20231127

package/plugins/columnSorting/columnSorting.js

@@ -17,7 +17,6 @@ var _domHelpers = require("./domHelpers");
 var _rootComparator = require("./rootComparator");
 var _sortService = require("./sortService");
 var _a11y = require("../../helpers/a11y");
-var _constants = require("../../i18n/constants");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 function _classPrivateMethodInitSpec(obj, privateSet) { _checkPrivateRedeclaration(obj, privateSet); privateSet.add(obj); }
 function _checkPrivateRedeclaration(obj, privateCollection) { if (privateCollection.has(obj)) { throw new TypeError("Cannot initialize the same private elements twice on an object"); } }
@@ -30,7 +29,6 @@ const PLUGIN_PRIORITY = exports.PLUGIN_PRIORITY = 50;
 const APPEND_COLUMN_CONFIG_STRATEGY = exports.APPEND_COLUMN_CONFIG_STRATEGY = 'append';
 const REPLACE_COLUMN_CONFIG_STRATEGY = exports.REPLACE_COLUMN_CONFIG_STRATEGY = 'replace';
 const SHORTCUTS_GROUP = PLUGIN_KEY;
-const SORTING_INDICATOR_CLASS = 'columnSortingIndicator';
 (0, _sortService.registerRootComparator)(PLUGIN_KEY, _rootComparator.rootComparator);
 _pluginHooks.default.getSingleton().register('beforeColumnSort');
 _pluginHooks.default.getSingleton().register('afterColumnSort');
@@ -673,28 +671,6 @@ class ColumnSorting extends _base.BasePlugin {
     }
   }
 
-  /**
-   * Update sorting indicator.
-   *
-   * @private
-   * @param {number} column Visual column index.
-   * @param {HTMLElement} headerSpanElement Header span element.
-   */
-  updateSortingIndicator(column, headerSpanElement) {
-    const pluginSettingsForColumn = this.getFirstCellSettings(column)[this.pluginKey];
-    const ariaTags = this.hot.getSettings().ariaTags;
-    const showSortIndicator = pluginSettingsForColumn.indicator;
-    const isColumnSorted = this.columnStatesManager.isColumnSorted(column);
-    const indicatorElement = headerSpanElement.querySelector(`.${SORTING_INDICATOR_CLASS}`);
-    if (showSortIndicator && isColumnSorted && !indicatorElement) {
-      (0, _element.appendElement)(headerSpanElement, {
-        tagName: 'div',
-        className: SORTING_INDICATOR_CLASS,
-        attributes: ariaTags ? [(0, _a11y.A11Y_HIDDEN)()] : []
-      });
-    }
-  }
-
   /**
    * Overwriting base plugin's `onUpdateSettings` method. Please keep in mind that `onAfterUpdateSettings` isn't called
    * for `updateSettings` in specific situations.
@@ -723,7 +699,7 @@ class ColumnSorting extends _base.BasePlugin {
   wasClickableHeaderClicked(event, column) {
     const pluginSettingsForColumn = this.getFirstCellSettings(column)[this.pluginKey];
     const headerActionEnabled = pluginSettingsForColumn.headerAction;
-    return headerActionEnabled && ((0, _element.hasClass)(event.target, _utils.HEADER_SPAN_CLASS) || (0, _element.hasClass)(event.target, SORTING_INDICATOR_CLASS));
+    return headerActionEnabled && (0, _element.hasClass)(event.target, _utils.HEADER_SPAN_CLASS);
   }
   /**
    * Callback for the `onAfterOnCellMouseDown` hook.
@@ -772,14 +748,12 @@ function _onAfterGetColHeader2(column, TH) {
     return;
   }
   const pluginSettingsForColumn = this.getFirstCellSettings(column)[this.pluginKey];
-  const ariaTags = this.hot.getSettings().ariaTags;
   const showSortIndicator = pluginSettingsForColumn.indicator;
   const headerActionEnabled = pluginSettingsForColumn.headerAction;
-  const currentSortState = this.columnStatesManager.getSortOrderOfColumn(column);
   this.updateHeaderClasses(headerSpanElement, this.columnStatesManager, column, showSortIndicator, headerActionEnabled);
-  this.updateSortingIndicator(column, headerSpanElement);
-  if (ariaTags) {
-    (0, _element.setAttribute)(TH, [(0, _a11y.A11Y_SORT)(currentSortState ? `${currentSortState}ending` : 'none'), (0, _a11y.A11Y_DESCRIPTION)(this.hot.getTranslatedPhrase(_constants.COLUMN_HEADER_DESCRIPTION_SORT_ROWS))]);
+  if (this.hot.getSettings().ariaTags) {
+    const currentSortState = this.columnStatesManager.getSortOrderOfColumn(column);
+    (0, _element.setAttribute)(TH, ...(0, _a11y.A11Y_SORT)(currentSortState ? `${currentSortState}ending` : 'none'));
   }
 }
 function _onAfterLoadData2(initialLoad) {

package/plugins/columnSorting/columnSorting.mjs

@@ -6,7 +6,7 @@ function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key i
 function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
 function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
 function _classPrivateMethodGet(receiver, privateSet, fn) { if (!privateSet.has(receiver)) { throw new TypeError("attempted to get private field on non-instance"); } return fn; }
-import { addClass, appendElement, hasClass, removeClass, setAttribute } from "../../helpers/dom/element.mjs";
+import { addClass, hasClass, removeClass, setAttribute } from "../../helpers/dom/element.mjs";
 import { isUndefined, isDefined } from "../../helpers/mixed.mjs";
 import { isObject } from "../../helpers/object.mjs";
 import { isFunction } from "../../helpers/function.mjs";
@@ -19,14 +19,12 @@ import { HEADER_SPAN_CLASS, getNextSortOrder, areValidSortStates, getHeaderSpanE
 import { getClassesToRemove, getClassesToAdd } from "./domHelpers.mjs";
 import { rootComparator } from "./rootComparator.mjs";
 import { registerRootComparator, sort } from "./sortService/index.mjs";
-import { A11Y_DESCRIPTION, A11Y_HIDDEN, A11Y_SORT } from "../../helpers/a11y.mjs";
-import { COLUMN_HEADER_DESCRIPTION_SORT_ROWS } from "../../i18n/constants.mjs";
+import { A11Y_SORT } from "../../helpers/a11y.mjs";
 export const PLUGIN_KEY = 'columnSorting';
 export const PLUGIN_PRIORITY = 50;
 export const APPEND_COLUMN_CONFIG_STRATEGY = 'append';
 export const REPLACE_COLUMN_CONFIG_STRATEGY = 'replace';
 const SHORTCUTS_GROUP = PLUGIN_KEY;
-const SORTING_INDICATOR_CLASS = 'columnSortingIndicator';
 registerRootComparator(PLUGIN_KEY, rootComparator);
 Hooks.getSingleton().register('beforeColumnSort');
 Hooks.getSingleton().register('afterColumnSort');
@@ -669,28 +667,6 @@ export class ColumnSorting extends BasePlugin {
     }
   }
 
-  /**
-   * Update sorting indicator.
-   *
-   * @private
-   * @param {number} column Visual column index.
-   * @param {HTMLElement} headerSpanElement Header span element.
-   */
-  updateSortingIndicator(column, headerSpanElement) {
-    const pluginSettingsForColumn = this.getFirstCellSettings(column)[this.pluginKey];
-    const ariaTags = this.hot.getSettings().ariaTags;
-    const showSortIndicator = pluginSettingsForColumn.indicator;
-    const isColumnSorted = this.columnStatesManager.isColumnSorted(column);
-    const indicatorElement = headerSpanElement.querySelector(`.${SORTING_INDICATOR_CLASS}`);
-    if (showSortIndicator && isColumnSorted && !indicatorElement) {
-      appendElement(headerSpanElement, {
-        tagName: 'div',
-        className: SORTING_INDICATOR_CLASS,
-        attributes: ariaTags ? [A11Y_HIDDEN()] : []
-      });
-    }
-  }
-
   /**
    * Overwriting base plugin's `onUpdateSettings` method. Please keep in mind that `onAfterUpdateSettings` isn't called
    * for `updateSettings` in specific situations.
@@ -719,7 +695,7 @@ export class ColumnSorting extends BasePlugin {
   wasClickableHeaderClicked(event, column) {
     const pluginSettingsForColumn = this.getFirstCellSettings(column)[this.pluginKey];
     const headerActionEnabled = pluginSettingsForColumn.headerAction;
-    return headerActionEnabled && (hasClass(event.target, HEADER_SPAN_CLASS) || hasClass(event.target, SORTING_INDICATOR_CLASS));
+    return headerActionEnabled && hasClass(event.target, HEADER_SPAN_CLASS);
   }
   /**
    * Callback for the `onAfterOnCellMouseDown` hook.
@@ -767,14 +743,12 @@ function _onAfterGetColHeader2(column, TH) {
     return;
   }
   const pluginSettingsForColumn = this.getFirstCellSettings(column)[this.pluginKey];
-  const ariaTags = this.hot.getSettings().ariaTags;
   const showSortIndicator = pluginSettingsForColumn.indicator;
   const headerActionEnabled = pluginSettingsForColumn.headerAction;
-  const currentSortState = this.columnStatesManager.getSortOrderOfColumn(column);
   this.updateHeaderClasses(headerSpanElement, this.columnStatesManager, column, showSortIndicator, headerActionEnabled);
-  this.updateSortingIndicator(column, headerSpanElement);
-  if (ariaTags) {
-    setAttribute(TH, [A11Y_SORT(currentSortState ? `${currentSortState}ending` : 'none'), A11Y_DESCRIPTION(this.hot.getTranslatedPhrase(COLUMN_HEADER_DESCRIPTION_SORT_ROWS))]);
+  if (this.hot.getSettings().ariaTags) {
+    const currentSortState = this.columnStatesManager.getSortOrderOfColumn(column);
+    setAttribute(TH, ...A11Y_SORT(currentSortState ? `${currentSortState}ending` : 'none'));
   }
 }
 function _onAfterLoadData2(initialLoad) {

package/plugins/contextMenu/menu/menuItemRenderer.js

@@ -5,8 +5,6 @@ exports.createMenuItemRenderer = createMenuItemRenderer;
 var _utils = require("./utils");
 var _element = require("../../../helpers/dom/element");
 var _a11y = require("../../../helpers/a11y");
-const SUBMENU_INDICATOR_CLASSNAME = 'submenuIndicator';
-
 /**
  * Creates the menu renderer function.
  *
@@ -39,16 +37,6 @@ function createMenuItemRenderer(mainTableHot) {
       const isFocusable = !(0, _utils.isItemDisabled)(item, mainTableHot) && !(0, _utils.isItemSelectionDisabled)(item) && !(0, _utils.isItemSeparator)(item);
       (0, _element.setAttribute)(TD, [(0, _a11y.A11Y_MENU_ITEM)(), (0, _a11y.A11Y_LABEL)(itemValue), ...(isFocusable ? [(0, _a11y.A11Y_TABINDEX)(-1)] : []), ...((0, _utils.isItemDisabled)(item, mainTableHot) ? [(0, _a11y.A11Y_DISABLED)()] : []), ...((0, _utils.isItemSubMenu)(item) ? [(0, _a11y.A11Y_EXPANDED)(false)] : [])]);
     }
-    if ((0, _utils.isItemSubMenu)(item)) {
-      const submenuIndicatorElement = TD.querySelector('.submenuIndicator');
-      if (!submenuIndicatorElement) {
-        (0, _element.appendElement)(TD, {
-          tagName: 'div',
-          attributes: mainTableHot.getSettings().ariaTags ? [(0, _a11y.A11Y_HIDDEN)()] : [],
-          className: SUBMENU_INDICATOR_CLASSNAME
-        });
-      }
-    }
     TD.className = '';
     TD.appendChild(wrapper);
     if ((0, _utils.isItemSeparator)(item)) {

package/plugins/contextMenu/menu/menuItemRenderer.mjs

@@ -1,8 +1,6 @@
 import { isItemSubMenu, isItemDisabled, isItemSelectionDisabled, isItemSeparator } from "./utils.mjs";
-import { addClass, appendElement, empty, fastInnerHTML, setAttribute } from "../../../helpers/dom/element.mjs";
-import { A11Y_DISABLED, A11Y_EXPANDED, A11Y_HIDDEN, A11Y_LABEL, A11Y_MENU_ITEM, A11Y_TABINDEX } from "../../../helpers/a11y.mjs";
-const SUBMENU_INDICATOR_CLASSNAME = 'submenuIndicator';
-
+import { addClass, empty, fastInnerHTML, setAttribute } from "../../../helpers/dom/element.mjs";
+import { A11Y_DISABLED, A11Y_EXPANDED, A11Y_LABEL, A11Y_MENU_ITEM, A11Y_TABINDEX } from "../../../helpers/a11y.mjs";
 /**
  * Creates the menu renderer function.
  *
@@ -35,16 +33,6 @@ export function createMenuItemRenderer(mainTableHot) {
       const isFocusable = !isItemDisabled(item, mainTableHot) && !isItemSelectionDisabled(item) && !isItemSeparator(item);
       setAttribute(TD, [A11Y_MENU_ITEM(), A11Y_LABEL(itemValue), ...(isFocusable ? [A11Y_TABINDEX(-1)] : []), ...(isItemDisabled(item, mainTableHot) ? [A11Y_DISABLED()] : []), ...(isItemSubMenu(item) ? [A11Y_EXPANDED(false)] : [])]);
     }
-    if (isItemSubMenu(item)) {
-      const submenuIndicatorElement = TD.querySelector('.submenuIndicator');
-      if (!submenuIndicatorElement) {
-        appendElement(TD, {
-          tagName: 'div',
-          attributes: mainTableHot.getSettings().ariaTags ? [A11Y_HIDDEN()] : [],
-          className: SUBMENU_INDICATOR_CLASSNAME
-        });
-      }
-    }
     TD.className = '';
     TD.appendChild(wrapper);
     if (isItemSeparator(item)) {

package/plugins/dropdownMenu/dropdownMenu.js

@@ -12,7 +12,6 @@ var _itemsFactory = require("../contextMenu/itemsFactory");
 var _menu = require("../contextMenu/menu");
 var _pluginHooks = _interopRequireDefault(require("../../pluginHooks"));
 var _predefinedItems = require("../contextMenu/predefinedItems");
-var _constants = require("../../i18n/constants");
 var _a11y = require("../../helpers/a11y");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 function _classPrivateMethodInitSpec(obj, privateSet) { _checkPrivateRedeclaration(obj, privateSet); privateSet.add(obj); }
@@ -490,7 +489,7 @@ function _onAfterGetColHeader2(col, TH) {
   button.type = 'button';
   button.tabIndex = -1;
   if (this.hot.getSettings().ariaTags) {
-    (0, _element.setAttribute)(button, [(0, _a11y.A11Y_LABEL)(this.hot.getTranslatedPhrase(_constants.COLUMN_HEADER_LABEL_OPEN_MENU))]);
+    (0, _element.setAttribute)(button, [(0, _a11y.A11Y_HIDDEN)(), (0, _a11y.A11Y_LABEL)(' ')]);
     (0, _element.setAttribute)(TH, [(0, _a11y.A11Y_HASPOPUP)('menu')]);
   }
 

package/plugins/dropdownMenu/dropdownMenu.mjs

@@ -15,8 +15,7 @@ import { ItemsFactory } from "../contextMenu/itemsFactory.mjs";
 import { Menu } from "../contextMenu/menu/index.mjs";
 import Hooks from "../../pluginHooks.mjs";
 import { COLUMN_LEFT, COLUMN_RIGHT, REMOVE_COLUMN, CLEAR_COLUMN, READ_ONLY, ALIGNMENT, SEPARATOR } from "../contextMenu/predefinedItems/index.mjs";
-import { COLUMN_HEADER_LABEL_OPEN_MENU } from "../../i18n/constants.mjs";
-import { A11Y_LABEL, A11Y_HASPOPUP } from "../../helpers/a11y.mjs";
+import { A11Y_HASPOPUP, A11Y_HIDDEN, A11Y_LABEL } from "../../helpers/a11y.mjs";
 Hooks.getSingleton().register('afterDropdownMenuDefaultOptions');
 Hooks.getSingleton().register('beforeDropdownMenuShow');
 Hooks.getSingleton().register('afterDropdownMenuShow');
@@ -485,7 +484,7 @@ function _onAfterGetColHeader2(col, TH) {
   button.type = 'button';
   button.tabIndex = -1;
   if (this.hot.getSettings().ariaTags) {
-    setAttribute(button, [A11Y_LABEL(this.hot.getTranslatedPhrase(COLUMN_HEADER_LABEL_OPEN_MENU))]);
+    setAttribute(button, [A11Y_HIDDEN(), A11Y_LABEL(' ')]);
     setAttribute(TH, [A11Y_HASPOPUP('menu')]);
   }
 

package/plugins/filters/filters.js

@@ -295,7 +295,16 @@ class Filters extends _base.BasePlugin {
       // A fake menu item that once focused allows escaping from the focus navigation (using Tab keys)
       // to the menu navigation using arrow keys.
       {
-        focus: () => mainMenu.focus()
+        focus: () => {
+          const menuNavigator = mainMenu.getNavigator();
+          const lastSelectedMenuItem = _classPrivateFieldGet(this, _menuFocusNavigator).getLastMenuPage();
+          mainMenu.focus();
+          if (lastSelectedMenuItem > 0) {
+            menuNavigator.setCurrentPage(lastSelectedMenuItem);
+          } else {
+            menuNavigator.toFirstItem();
+          }
+        }
       }, ...Array.from(this.components).map(_ref => {
         let [, component] = _ref;
         return component.getElements();

package/plugins/filters/filters.mjs

@@ -289,7 +289,16 @@ export class Filters extends BasePlugin {
       // A fake menu item that once focused allows escaping from the focus navigation (using Tab keys)
       // to the menu navigation using arrow keys.
       {
-        focus: () => mainMenu.focus()
+        focus: () => {
+          const menuNavigator = mainMenu.getNavigator();
+          const lastSelectedMenuItem = _classPrivateFieldGet(this, _menuFocusNavigator).getLastMenuPage();
+          mainMenu.focus();
+          if (lastSelectedMenuItem > 0) {
+            menuNavigator.setCurrentPage(lastSelectedMenuItem);
+          } else {
+            menuNavigator.toFirstItem();
+          }
+        }
       }, ...Array.from(this.components).map(_ref => {
         let [, component] = _ref;
         return component.getElements();

package/plugins/filters/menu/focusController.js

@@ -27,12 +27,17 @@ const SHORTCUTS_MENU_CONTEXT = 'filters';
  * @returns {Paginator}
  */
 function createMenuFocusController(mainMenu, menuItems) {
-  const navigator = (0, _focusNavigator.createFocusNavigator)(menuItems);
+  /**
+   * @type {number} The last selected menu item (before clearing the the menu state after going
+   * into the focus mode triggered by the TAB or SHIFT+TAB keys).
+   */
+  let lastSelectedMenuItem = -1;
+  const focusNavigator = (0, _focusNavigator.createFocusNavigator)(menuItems);
   const updateNavigatorPosition = element => () => {
     if (mainMenu.isOpened()) {
       mainMenu.getKeyboardShortcutsCtrl().listen(SHORTCUTS_MENU_CONTEXT);
     }
-    navigator.setCurrentPage(menuItems.indexOf(element));
+    focusNavigator.setCurrentPage(menuItems.indexOf(element));
   };
 
   // update navigator position (internal state) to element that was recently clicked or focused
@@ -45,7 +50,7 @@ function createMenuFocusController(mainMenu, menuItems) {
   });
   mainMenu.addLocalHook('afterSelectionChange', selectedItem => {
     if (!selectedItem.key.startsWith('filter_')) {
-      navigator.clear();
+      focusNavigator.clear();
     }
   });
 
@@ -57,7 +62,7 @@ function createMenuFocusController(mainMenu, menuItems) {
   function addKeyboardShortcuts(menu) {
     const mainMenuShortcutsCtrl = mainMenu.getKeyboardShortcutsCtrl();
     const currentMenuShortcutsCtrl = menu.getKeyboardShortcutsCtrl();
-    navigator.clear();
+    focusNavigator.clear();
     currentMenuShortcutsCtrl.addCustomShortcuts([{
       keys: [['Tab'], ['Shift', 'Tab']],
       forwardToContext: mainMenuShortcutsCtrl.getContext(SHORTCUTS_MENU_CONTEXT),
@@ -74,11 +79,15 @@ function createMenuFocusController(mainMenu, menuItems) {
     mainMenuShortcutsCtrl.addCustomShortcuts([{
       keys: [['Tab'], ['Shift', 'Tab']],
       callback: event => {
-        mainMenu.getNavigator().clear();
+        const menuNavigator = mainMenu.getNavigator();
+        if (menuNavigator.getCurrentPage() > -1) {
+          lastSelectedMenuItem = menuNavigator.getCurrentPage();
+        }
+        menuNavigator.clear();
         if (event.shiftKey) {
-          navigator.toPreviousItem();
+          focusNavigator.toPreviousItem();
         } else {
-          navigator.toNextItem();
+          focusNavigator.toNextItem();
         }
       }
     }, {
@@ -90,7 +99,7 @@ function createMenuFocusController(mainMenu, menuItems) {
       keys: [['Enter'], ['Space']],
       preventDefault: false,
       callback: event => {
-        const element = menuItems[navigator.getCurrentPage()];
+        const element = menuItems[focusNavigator.getCurrentPage()];
         if (element instanceof _select.SelectUI) {
           element.openOptions();
           event.preventDefault();
@@ -116,8 +125,18 @@ function createMenuFocusController(mainMenu, menuItems) {
     mainMenu.focus();
     mainMenu.getKeyboardShortcutsCtrl().listen(SHORTCUTS_MENU_CONTEXT);
   }
+
+  /**
+   * Retrieves the last selected menu item (before clearing the state after going into the focus mode).
+   *
+   * @returns {number} The last selected menu item.
+   */
+  function getLastMenuPage() {
+    return lastSelectedMenuItem;
+  }
   return {
-    ...navigator,
-    listen
+    ...focusNavigator,
+    listen,
+    getLastMenuPage
   };
 }

package/plugins/filters/menu/focusController.mjs

@@ -23,12 +23,17 @@ const SHORTCUTS_MENU_CONTEXT = 'filters';
  * @returns {Paginator}
  */
 export function createMenuFocusController(mainMenu, menuItems) {
-  const navigator = createFocusNavigator(menuItems);
+  /**
+   * @type {number} The last selected menu item (before clearing the the menu state after going
+   * into the focus mode triggered by the TAB or SHIFT+TAB keys).
+   */
+  let lastSelectedMenuItem = -1;
+  const focusNavigator = createFocusNavigator(menuItems);
   const updateNavigatorPosition = element => () => {
     if (mainMenu.isOpened()) {
       mainMenu.getKeyboardShortcutsCtrl().listen(SHORTCUTS_MENU_CONTEXT);
     }
-    navigator.setCurrentPage(menuItems.indexOf(element));
+    focusNavigator.setCurrentPage(menuItems.indexOf(element));
   };
 
   // update navigator position (internal state) to element that was recently clicked or focused
@@ -41,7 +46,7 @@ export function createMenuFocusController(mainMenu, menuItems) {
   });
   mainMenu.addLocalHook('afterSelectionChange', selectedItem => {
     if (!selectedItem.key.startsWith('filter_')) {
-      navigator.clear();
+      focusNavigator.clear();
     }
   });
 
@@ -53,7 +58,7 @@ export function createMenuFocusController(mainMenu, menuItems) {
   function addKeyboardShortcuts(menu) {
     const mainMenuShortcutsCtrl = mainMenu.getKeyboardShortcutsCtrl();
     const currentMenuShortcutsCtrl = menu.getKeyboardShortcutsCtrl();
-    navigator.clear();
+    focusNavigator.clear();
     currentMenuShortcutsCtrl.addCustomShortcuts([{
       keys: [['Tab'], ['Shift', 'Tab']],
       forwardToContext: mainMenuShortcutsCtrl.getContext(SHORTCUTS_MENU_CONTEXT),
@@ -70,11 +75,15 @@ export function createMenuFocusController(mainMenu, menuItems) {
     mainMenuShortcutsCtrl.addCustomShortcuts([{
       keys: [['Tab'], ['Shift', 'Tab']],
       callback: event => {
-        mainMenu.getNavigator().clear();
+        const menuNavigator = mainMenu.getNavigator();
+        if (menuNavigator.getCurrentPage() > -1) {
+          lastSelectedMenuItem = menuNavigator.getCurrentPage();
+        }
+        menuNavigator.clear();
         if (event.shiftKey) {
-          navigator.toPreviousItem();
+          focusNavigator.toPreviousItem();
         } else {
-          navigator.toNextItem();
+          focusNavigator.toNextItem();
         }
       }
     }, {
@@ -86,7 +95,7 @@ export function createMenuFocusController(mainMenu, menuItems) {
       keys: [['Enter'], ['Space']],
       preventDefault: false,
       callback: event => {
-        const element = menuItems[navigator.getCurrentPage()];
+        const element = menuItems[focusNavigator.getCurrentPage()];
         if (element instanceof SelectUI) {
           element.openOptions();
           event.preventDefault();
@@ -112,8 +121,18 @@ export function createMenuFocusController(mainMenu, menuItems) {
     mainMenu.focus();
     mainMenu.getKeyboardShortcutsCtrl().listen(SHORTCUTS_MENU_CONTEXT);
   }
+
+  /**
+   * Retrieves the last selected menu item (before clearing the state after going into the focus mode).
+   *
+   * @returns {number} The last selected menu item.
+   */
+  function getLastMenuPage() {
+    return lastSelectedMenuItem;
+  }
   return {
-    ...navigator,
-    listen
+    ...focusNavigator,
+    listen,
+    getLastMenuPage
   };
 }

package/plugins/filters/ui/input.js

@@ -63,8 +63,11 @@ class InputUI extends _base.BaseUI {
    */
   build() {
     super.build();
+    const icon = this.hot.rootDocument.createElement('div');
     _classPrivateFieldSet(this, _input, this._element.firstChild);
     (0, _element.addClass)(this._element, 'htUIInput');
+    (0, _element.addClass)(icon, 'htUIInputIcon');
+    this._element.appendChild(icon);
     this.update();
   }
 

package/plugins/filters/ui/input.mjs

@@ -60,8 +60,11 @@ export class InputUI extends BaseUI {
    */
   build() {
     super.build();
+    const icon = this.hot.rootDocument.createElement('div');
     _classPrivateFieldSet(this, _input, this._element.firstChild);
     addClass(this._element, 'htUIInput');
+    addClass(icon, 'htUIInputIcon');
+    this._element.appendChild(icon);
     this.update();
   }
 

package/plugins/hiddenColumns/hiddenColumns.js

@@ -14,8 +14,6 @@ var _pluginHooks = _interopRequireDefault(require("../../pluginHooks"));
 var _hideColumn = _interopRequireDefault(require("./contextMenuItem/hideColumn"));
 var _showColumn = _interopRequireDefault(require("./contextMenuItem/showColumn"));
 var _translations = require("../../translations");
-var _a11y = require("../../helpers/a11y");
-var _constants = require("../../i18n/constants");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 function _classPrivateMethodInitSpec(obj, privateSet) { _checkPrivateRedeclaration(obj, privateSet); privateSet.add(obj); }
 function _classPrivateFieldInitSpec(obj, privateMap, value) { _checkPrivateRedeclaration(obj, privateMap); privateMap.set(obj, value); }
@@ -32,8 +30,6 @@ _pluginHooks.default.getSingleton().register('beforeUnhideColumns');
 _pluginHooks.default.getSingleton().register('afterUnhideColumns');
 const PLUGIN_KEY = exports.PLUGIN_KEY = 'hiddenColumns';
 const PLUGIN_PRIORITY = exports.PLUGIN_PRIORITY = 310;
-const BEFORE_INDICATOR_CLASSNAME = 'beforeHiddenColumnIndicator';
-const AFTER_INDICATOR_CLASSNAME = 'afterHiddenColumnIndicator';
 
 /* eslint-disable jsdoc/require-description-complete-sentence */
 
@@ -143,7 +139,6 @@ const AFTER_INDICATOR_CLASSNAME = 'afterHiddenColumnIndicator';
  */
 var _settings = /*#__PURE__*/new WeakMap();
 var _hiddenColumnsMap = /*#__PURE__*/new WeakMap();
-var _clearIndicatorElements = /*#__PURE__*/new WeakSet();
 var _onModifyColWidth = /*#__PURE__*/new WeakSet();
 var _onAfterGetCellMeta = /*#__PURE__*/new WeakSet();
 var _onModifyCopyableRange = /*#__PURE__*/new WeakSet();
@@ -193,12 +188,6 @@ class HiddenColumns extends _base.BasePlugin {
      * @returns {number}
      */
     _classPrivateMethodInitSpec(this, _onModifyColWidth);
-    /**
-     * Remove the indicator elements from the provided column header element.
-     *
-     * @param {HTMLElement} TH Column header element.
-     */
-    _classPrivateMethodInitSpec(this, _clearIndicatorElements);
     /**
      * Cached plugin settings.
      *
@@ -288,15 +277,8 @@ class HiddenColumns extends _base.BasePlugin {
    * Disables the plugin functionality for this Handsontable instance.
    */
   disablePlugin() {
-    const clearColHeader = (columnIndex, TH) => {
-      _classPrivateMethodGet(this, _clearIndicatorElements, _clearIndicatorElements2).call(this, TH);
-    };
     this.hot.columnIndexMapper.unregisterMap(this.pluginName);
     _classPrivateFieldSet(this, _settings, {});
-    this.hot.addHook('afterGetColHeader', clearColHeader);
-    this.hot.addHookOnce('afterViewRender', () => {
-      this.hot.removeHook('afterGetColHeader', clearColHeader);
-    });
     super.disablePlugin();
     this.resetCellsMeta();
   }
@@ -448,11 +430,6 @@ class HiddenColumns extends _base.BasePlugin {
   }
 }
 exports.HiddenColumns = HiddenColumns;
-function _clearIndicatorElements2(TH) {
-  Array.from(TH.querySelectorAll(`.${AFTER_INDICATOR_CLASSNAME}, .${BEFORE_INDICATOR_CLASSNAME}`)).forEach(element => {
-    element.remove();
-  });
-}
 function _onModifyColWidth2(width, column) {
   // Hook is triggered internally only for the visible columns. Conditional will be handled for the API
   // calls of the `getColWidth` function on not visible indexes.
@@ -524,35 +501,14 @@ function _onModifyCopyableRange2(ranges) {
   return newRanges;
 }
 function _onAfterGetColHeader2(column, TH) {
-  const areAriaTagsEnabled = this.hot.getSettings().ariaTags;
-  const beforeHiddenColumnIndicatorElement = TH.querySelector('.beforeHiddenColumnIndicator');
-  const afterHiddenColumnIndicatorElement = TH.querySelector('.afterHiddenColumnIndicator');
   if (!_classPrivateFieldGet(this, _settings).indicators || column < 0) {
-    beforeHiddenColumnIndicatorElement === null || beforeHiddenColumnIndicatorElement === void 0 || beforeHiddenColumnIndicatorElement.remove();
-    afterHiddenColumnIndicatorElement === null || afterHiddenColumnIndicatorElement === void 0 || afterHiddenColumnIndicatorElement.remove();
     return;
   }
   const classList = [];
   if (column >= 1 && this.isHidden(column - 1)) {
-    if (!afterHiddenColumnIndicatorElement) {
-      const attributesToAdd = areAriaTagsEnabled ? [(0, _a11y.A11Y_LABEL)(this.hot.getTranslatedPhrase(_constants.COLUMN_HEADER_LABEL_AFTER_HIDDEN_COLUMN))] : [];
-      (0, _element.appendElement)(TH, {
-        tagName: 'div',
-        attributes: attributesToAdd,
-        className: AFTER_INDICATOR_CLASSNAME
-      });
-    }
     classList.push('afterHiddenColumn');
   }
   if (column < this.hot.countCols() - 1 && this.isHidden(column + 1)) {
-    if (!beforeHiddenColumnIndicatorElement) {
-      const attributesToAdd = areAriaTagsEnabled ? [(0, _a11y.A11Y_LABEL)(this.hot.getTranslatedPhrase(_constants.COLUMN_HEADER_LABEL_BEFORE_HIDDEN_COLUMN))] : [];
-      (0, _element.appendElement)(TH, {
-        tagName: 'div',
-        attributes: attributesToAdd,
-        className: BEFORE_INDICATOR_CLASSNAME
-      });
-    }
     classList.push('beforeHiddenColumn');
   }
   (0, _element.addClass)(TH, classList);