handsontable 0.0.0-next-a77544c-20231123 → 0.0.0-next-a417c2b-20231124

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-a77544c-20231123";
+  const hotVersion = "0.0.0-next-a417c2b-20231124";
   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-a77544c-20231123";
+  const hotVersion = "0.0.0-next-a417c2b-20231124";
   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-a77544c-20231123",
+  "version": "0.0.0-next-a417c2b-20231124",
   "main": "index",
   "module": "index.mjs",
   "jsnext:main": "index.mjs",

package/plugins/filters/filters.js

@@ -297,7 +297,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/select.js

@@ -5,9 +5,11 @@ exports.__esModule = true;
 var _menu2 = require("../../../plugins/contextMenu/menu");
 var _object = require("../../../helpers/object");
 var _array = require("../../../helpers/array");
+var _element = require("../../../helpers/dom/element");
 var C = _interopRequireWildcard(require("../../../i18n/constants"));
 var _predefinedItems = require("../../../plugins/contextMenu/predefinedItems");
 var _base = require("./_base");
+var _a11y = require("../../../helpers/a11y");
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 function _classPrivateMethodInitSpec(obj, privateSet) { _checkPrivateRedeclaration(obj, privateSet); privateSet.add(obj); }
@@ -169,6 +171,10 @@ class SelectUI extends _base.BaseUI {
     _classPrivateFieldSet(this, _caption, caption);
     _classPrivateFieldSet(this, _captionElement, caption.element);
     _classPrivateFieldSet(this, _dropdown, dropdown);
+    if (this.hot.getSettings().ariaTags) {
+      (0, _element.setAttribute)(dropdown.element, [(0, _a11y.A11Y_HIDDEN)()]);
+      (0, _element.setAttribute)(this._element, [(0, _a11y.A11Y_LISTBOX)()]);
+    }
     (0, _array.arrayEach)([caption, dropdown], element => this._element.appendChild(element.element));
     _classPrivateFieldGet(this, _menu).addLocalHook('select', command => _classPrivateMethodGet(this, _onMenuSelect, _onMenuSelect2).call(this, command));
     _classPrivateFieldGet(this, _menu).addLocalHook('afterClose', () => _classPrivateMethodGet(this, _onMenuClosed, _onMenuClosed2).call(this));

package/plugins/filters/ui/select.mjs

@@ -11,9 +11,11 @@ function _classApplyDescriptorGet(receiver, descriptor) { if (descriptor.get) {
 import { Menu } from "../../../plugins/contextMenu/menu/index.mjs";
 import { clone, extend } from "../../../helpers/object.mjs";
 import { arrayEach } from "../../../helpers/array.mjs";
+import { setAttribute } from "../../../helpers/dom/element.mjs";
 import * as C from "../../../i18n/constants.mjs";
 import { SEPARATOR } from "../../../plugins/contextMenu/predefinedItems/index.mjs";
 import { BaseUI } from "./_base.mjs";
+import { A11Y_HIDDEN, A11Y_LISTBOX } from "../../../helpers/a11y.mjs";
 /**
  * @private
  * @class SelectUI
@@ -164,6 +166,10 @@ export class SelectUI extends BaseUI {
     _classPrivateFieldSet(this, _caption, caption);
     _classPrivateFieldSet(this, _captionElement, caption.element);
     _classPrivateFieldSet(this, _dropdown, dropdown);
+    if (this.hot.getSettings().ariaTags) {
+      setAttribute(dropdown.element, [A11Y_HIDDEN()]);
+      setAttribute(this._element, [A11Y_LISTBOX()]);
+    }
     arrayEach([caption, dropdown], element => this._element.appendChild(element.element));
     _classPrivateFieldGet(this, _menu).addLocalHook('select', command => _classPrivateMethodGet(this, _onMenuSelect, _onMenuSelect2).call(this, command));
     _classPrivateFieldGet(this, _menu).addLocalHook('afterClose', () => _classPrivateMethodGet(this, _onMenuClosed, _onMenuClosed2).call(this));

package/plugins/nestedRows/nestedRows.js

@@ -441,6 +441,7 @@ class NestedRows extends _base.BasePlugin {
   /**
    * The modifyRowData hook callback.
    *
+   * @private
    * @param {number} row Visual row index.
    * @returns {boolean}
    */
@@ -454,6 +455,7 @@ class NestedRows extends _base.BasePlugin {
   /**
    * Modify the source data length to match the length of the nested structure.
    *
+   * @private
    * @returns {number}
    */
   onModifySourceLength() {
@@ -464,6 +466,7 @@ class NestedRows extends _base.BasePlugin {
   }
 
   /**
+   * @private
    * @param {number} index The index where the data was spliced.
    * @param {number} amount An amount of items to remove.
    * @param {object} element An element to add.

package/plugins/nestedRows/nestedRows.mjs

@@ -435,6 +435,7 @@ export class NestedRows extends BasePlugin {
   /**
    * The modifyRowData hook callback.
    *
+   * @private
    * @param {number} row Visual row index.
    * @returns {boolean}
    */
@@ -448,6 +449,7 @@ export class NestedRows extends BasePlugin {
   /**
    * Modify the source data length to match the length of the nested structure.
    *
+   * @private
    * @returns {number}
    */
   onModifySourceLength() {
@@ -458,6 +460,7 @@ export class NestedRows extends BasePlugin {
   }
 
   /**
+   * @private
    * @param {number} index The index where the data was spliced.
    * @param {number} amount An amount of items to remove.
    * @param {object} element An element to add.

package/selection/highlight/types/focus.js

@@ -4,6 +4,7 @@ exports.__esModule = true;
 exports.createHighlight = createHighlight;
 var _src = require("../../../3rdparty/walkontable/src");
 var _visualSelection = _interopRequireDefault(require("../visualSelection"));
+var _a11y = require("../../../helpers/a11y");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 /**
  * Creates the new instance of Selection responsible for highlighting currently selected cell. This type of selection
@@ -11,21 +12,16 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
  *
  * @param {object} highlightParams A configuration object to create a highlight.
  * @param {Function} highlightParams.cellCornerVisible Function to determine if cell's corner should be visible.
- * @param {Function} highlightParams.cellAttributes Array of cell attributes.
- * @param {Function} highlightParams.headerAttributes Array of header attributes.
  * @returns {Selection}
  */
 function createHighlight(_ref) {
   let {
     cellCornerVisible,
-    cellAttributes,
-    headerAttributes,
     ...restOptions
   } = _ref;
   return new _visualSelection.default({
     className: 'current',
-    cellAttributes,
-    focusedHeaderAttributes: headerAttributes,
+    headerAttributes: [(0, _a11y.A11Y_SELECTED)()],
     border: {
       width: 2,
       color: '#4b89ff',

package/selection/highlight/types/focus.mjs

@@ -1,26 +1,22 @@
 import { HIGHLIGHT_FOCUS_TYPE } from "../../../3rdparty/walkontable/src/index.mjs";
 import VisualSelection from "../visualSelection.mjs";
+import { A11Y_SELECTED } from "../../../helpers/a11y.mjs";
 /**
  * Creates the new instance of Selection responsible for highlighting currently selected cell. This type of selection
  * can present on the table only one at the time.
  *
  * @param {object} highlightParams A configuration object to create a highlight.
  * @param {Function} highlightParams.cellCornerVisible Function to determine if cell's corner should be visible.
- * @param {Function} highlightParams.cellAttributes Array of cell attributes.
- * @param {Function} highlightParams.headerAttributes Array of header attributes.
  * @returns {Selection}
  */
 export function createHighlight(_ref) {
   let {
     cellCornerVisible,
-    cellAttributes,
-    headerAttributes,
     ...restOptions
   } = _ref;
   return new VisualSelection({
     className: 'current',
-    cellAttributes,
-    focusedHeaderAttributes: headerAttributes,
+    headerAttributes: [A11Y_SELECTED()],
     border: {
       width: 2,
       color: '#4b89ff',

package/selection/selection.js

@@ -99,7 +99,6 @@ class Selection {
     this.tableProps = tableProps;
     this.highlight = new _highlight.default({
       headerClassName: settings.currentHeaderClassName,
-      headerAttributes: [(0, _a11y.A11Y_SELECTED)()],
       activeHeaderClassName: settings.activeHeaderClassName,
       rowClassName: settings.currentRowClassName,
       columnClassName: settings.currentColClassName,

package/selection/selection.mjs

@@ -93,7 +93,6 @@ class Selection {
     this.tableProps = tableProps;
     this.highlight = new Highlight({
       headerClassName: settings.currentHeaderClassName,
-      headerAttributes: [A11Y_SELECTED()],
       activeHeaderClassName: settings.activeHeaderClassName,
       rowClassName: settings.currentRowClassName,
       columnClassName: settings.currentColClassName,

package/tableView.js

@@ -1158,8 +1158,10 @@ class TableView {
       const span = rootDocument.createElement('span');
       div.className = 'relative';
       span.className = 'colHeader';
-      (0, _element.setAttribute)(div, ...(0, _a11y.A11Y_PRESENTATION)());
-      (0, _element.setAttribute)(span, ...(0, _a11y.A11Y_PRESENTATION)());
+      if (this.settings.ariaTags) {
+        (0, _element.setAttribute)(div, ...(0, _a11y.A11Y_PRESENTATION)());
+        (0, _element.setAttribute)(span, ...(0, _a11y.A11Y_PRESENTATION)());
+      }
       this.updateCellHeader(span, visualColumnIndex, label, headerLevel);
       div.appendChild(span);
       TH.appendChild(div);

package/tableView.mjs

@@ -1154,8 +1154,10 @@ class TableView {
       const span = rootDocument.createElement('span');
       div.className = 'relative';
       span.className = 'colHeader';
-      setAttribute(div, ...A11Y_PRESENTATION());
-      setAttribute(span, ...A11Y_PRESENTATION());
+      if (this.settings.ariaTags) {
+        setAttribute(div, ...A11Y_PRESENTATION());
+        setAttribute(span, ...A11Y_PRESENTATION());
+      }
       this.updateCellHeader(span, visualColumnIndex, label, headerLevel);
       div.appendChild(span);
       TH.appendChild(div);