handsontable 0.0.0-next-9379dd1-20231020 → 0.0.0-next-b0a4ea2-20231024

package/plugins/filters/ui/select.mjs

@@ -1,45 +1,121 @@
+import "core-js/modules/es.error.cause.js";
+function _classPrivateMethodInitSpec(obj, privateSet) { _checkPrivateRedeclaration(obj, privateSet); privateSet.add(obj); }
+function _classPrivateFieldInitSpec(obj, privateMap, value) { _checkPrivateRedeclaration(obj, privateMap); privateMap.set(obj, value); }
+function _checkPrivateRedeclaration(obj, privateCollection) { if (privateCollection.has(obj)) { throw new TypeError("Cannot initialize the same private elements twice on an object"); } }
+function _classPrivateFieldSet(receiver, privateMap, value) { var descriptor = _classExtractFieldDescriptor(receiver, privateMap, "set"); _classApplyDescriptorSet(receiver, descriptor, value); return value; }
+function _classApplyDescriptorSet(receiver, descriptor, value) { if (descriptor.set) { descriptor.set.call(receiver, value); } else { if (!descriptor.writable) { throw new TypeError("attempted to set read only private field"); } descriptor.value = value; } }
+function _classPrivateMethodGet(receiver, privateSet, fn) { if (!privateSet.has(receiver)) { throw new TypeError("attempted to get private field on non-instance"); } return fn; }
+function _classPrivateFieldGet(receiver, privateMap) { var descriptor = _classExtractFieldDescriptor(receiver, privateMap, "get"); return _classApplyDescriptorGet(receiver, descriptor); }
+function _classExtractFieldDescriptor(receiver, privateMap, action) { if (!privateMap.has(receiver)) { throw new TypeError("attempted to " + action + " private field on non-instance"); } return privateMap.get(receiver); }
+function _classApplyDescriptorGet(receiver, descriptor) { if (descriptor.get) { return descriptor.get.call(receiver); } return descriptor.value; }
 import { Menu } from "../../../plugins/contextMenu/menu/index.mjs";
 import { clone, extend } from "../../../helpers/object.mjs";
 import { arrayEach } from "../../../helpers/array.mjs";
 import * as C from "../../../i18n/constants.mjs";
 import { SEPARATOR } from "../../../plugins/contextMenu/predefinedItems/index.mjs";
-import BaseUI from "./_base.mjs";
-const privatePool = new WeakMap();
-
+import { BaseUI } from "./_base.mjs";
 /**
  * @private
  * @class SelectUI
  */
-class SelectUI extends BaseUI {
+var _menu = /*#__PURE__*/new WeakMap();
+var _items = /*#__PURE__*/new WeakMap();
+var _caption = /*#__PURE__*/new WeakMap();
+var _captionElement = /*#__PURE__*/new WeakMap();
+var _dropdown = /*#__PURE__*/new WeakMap();
+var _onMenuSelect = /*#__PURE__*/new WeakSet();
+var _onMenuClosed = /*#__PURE__*/new WeakSet();
+var _onClick = /*#__PURE__*/new WeakSet();
+export class SelectUI extends BaseUI {
   static get DEFAULTS() {
     return clone({
       className: 'htUISelect',
-      wrapIt: false
+      wrapIt: false,
+      tabIndex: -1
     });
   }
+
+  /**
+   * Instance of {@link Menu}.
+   *
+   * @type {Menu}
+   */
+
   constructor(hotInstance, options) {
     super(hotInstance, extend(SelectUI.DEFAULTS, options));
-    privatePool.set(this, {});
     /**
-     * Instance of {@link Menu}.
+     * On element click listener.
      *
-     * @type {Menu}
+     * @private
      */
-    this.menu = null;
+    _classPrivateMethodInitSpec(this, _onClick);
+    /**
+     * On menu closed listener.
+     */
+    _classPrivateMethodInitSpec(this, _onMenuClosed);
+    /**
+     * On menu selected listener.
+     *
+     * @param {object} command Selected item.
+     */
+    _classPrivateMethodInitSpec(this, _onMenuSelect);
+    _classPrivateFieldInitSpec(this, _menu, {
+      writable: true,
+      value: null
+    });
     /**
      * List of available select options.
      *
      * @type {Array}
      */
-    this.items = [];
+    _classPrivateFieldInitSpec(this, _items, {
+      writable: true,
+      value: []
+    });
+    /**
+     * The reference to the BaseUI instance of the caption.
+     *
+     * @type {BaseUI}
+     */
+    _classPrivateFieldInitSpec(this, _caption, {
+      writable: true,
+      value: void 0
+    });
+    /**
+     * The reference to the table caption element.
+     *
+     * @type {HTMLTableCaptionElement}
+     */
+    _classPrivateFieldInitSpec(this, _captionElement, {
+      writable: true,
+      value: void 0
+    });
+    /**
+     * The reference to the BaseUI instance of the dropdown.
+     *
+     * @type {BaseUI}
+     */
+    _classPrivateFieldInitSpec(this, _dropdown, {
+      writable: true,
+      value: void 0
+    });
     this.registerHooks();
   }
 
+  /**
+   * Gets the instance of the Menu.
+   *
+   * @returns {Menu}
+   */
+  getMenu() {
+    return _classPrivateFieldGet(this, _menu);
+  }
+
   /**
    * Register all necessary hooks.
    */
   registerHooks() {
-    this.addLocalHook('click', () => this.onClick());
+    this.addLocalHook('click', () => _classPrivateMethodGet(this, _onClick, _onClick2).call(this));
   }
 
   /**
@@ -48,9 +124,9 @@ class SelectUI extends BaseUI {
    * @param {Array} items Array of objects with required keys `key` and `name`.
    */
   setItems(items) {
-    this.items = this.translateNames(items);
-    if (this.menu) {
-      this.menu.setMenuItems(this.items);
+    _classPrivateFieldSet(this, _items, this.translateNames(items));
+    if (_classPrivateFieldGet(this, _menu)) {
+      _classPrivateFieldGet(this, _menu).setMenuItems(_classPrivateFieldGet(this, _items));
     }
   }
 
@@ -72,26 +148,25 @@ class SelectUI extends BaseUI {
    */
   build() {
     super.build();
-    this.menu = new Menu(this.hot, {
+    _classPrivateFieldSet(this, _menu, new Menu(this.hot, {
       className: 'htSelectUI htFiltersConditionsMenu',
       keepInViewport: false,
       standalone: true,
       container: this.options.menuContainer
-    });
-    this.menu.setMenuItems(this.items);
+    }));
+    _classPrivateFieldGet(this, _menu).setMenuItems(_classPrivateFieldGet(this, _items));
     const caption = new BaseUI(this.hot, {
       className: 'htUISelectCaption'
     });
     const dropdown = new BaseUI(this.hot, {
       className: 'htUISelectDropdown'
     });
-    const priv = privatePool.get(this);
-    priv.caption = caption;
-    priv.captionElement = caption.element;
-    priv.dropdown = dropdown;
+    _classPrivateFieldSet(this, _caption, caption);
+    _classPrivateFieldSet(this, _captionElement, caption.element);
+    _classPrivateFieldSet(this, _dropdown, dropdown);
     arrayEach([caption, dropdown], element => this._element.appendChild(element.element));
-    this.menu.addLocalHook('select', command => this.onMenuSelect(command));
-    this.menu.addLocalHook('afterClose', () => this.onMenuClosed());
+    _classPrivateFieldGet(this, _menu).addLocalHook('select', command => _classPrivateMethodGet(this, _onMenuSelect, _onMenuSelect2).call(this, command));
+    _classPrivateFieldGet(this, _menu).addLocalHook('afterClose', () => _classPrivateMethodGet(this, _onMenuClosed, _onMenuClosed2).call(this));
     this.update();
   }
 
@@ -106,9 +181,9 @@ class SelectUI extends BaseUI {
     if (this.options.value) {
       conditionName = this.options.value.name;
     } else {
-      conditionName = this.menu.hot.getTranslatedPhrase(C.FILTERS_CONDITIONS_NONE);
+      conditionName = _classPrivateFieldGet(this, _menu).hot.getTranslatedPhrase(C.FILTERS_CONDITIONS_NONE);
     }
-    privatePool.get(this).captionElement.textContent = conditionName;
+    _classPrivateFieldGet(this, _captionElement).textContent = conditionName;
     super.update();
   }
 
@@ -117,14 +192,25 @@ class SelectUI extends BaseUI {
    */
   openOptions() {
     const rect = this.element.getBoundingClientRect();
-    if (this.menu) {
-      this.menu.open();
-      this.menu.setPosition({
+    if (_classPrivateFieldGet(this, _menu)) {
+      _classPrivateFieldGet(this, _menu).open();
+      _classPrivateFieldGet(this, _menu).setPosition({
         left: this.hot.isLtr() ? rect.left - 5 : rect.left - 31,
         top: rect.top - 1,
         width: rect.width,
         height: rect.height
       });
+      _classPrivateFieldGet(this, _menu).getNavigator().toFirstItem();
+      _classPrivateFieldGet(this, _menu).getKeyboardShortcutsCtrl().addCustomShortcuts([{
+        keys: [['Tab'], ['Shift', 'Tab']],
+        callback: event => {
+          this.closeOptions();
+          this.runLocalHooks('tabKeydown', event);
+        }
+      }, {
+        keys: [['Control/Meta', 'A']],
+        callback: () => false
+      }]);
     }
   }
 
@@ -132,62 +218,46 @@ class SelectUI extends BaseUI {
    * Close select dropdown menu.
    */
   closeOptions() {
-    if (this.menu) {
-      this.menu.close();
+    if (_classPrivateFieldGet(this, _menu)) {
+      _classPrivateFieldGet(this, _menu).close();
     }
   }
 
   /**
-   * On menu selected listener.
-   *
-   * @private
-   * @param {object} command Selected item.
+   * Focus element.
    */
-  onMenuSelect(command) {
-    if (command.name !== SEPARATOR) {
-      this.options.value = command;
-      this.update();
-      this.runLocalHooks('select', this.options.value);
+  focus() {
+    if (this.isBuilt()) {
+      this.element.focus();
     }
   }
-
-  /**
-   * On menu closed listener.
-   *
-   * @private
-   */
-  onMenuClosed() {
-    this.runLocalHooks('afterClose');
-  }
-
-  /**
-   * On element click listener.
-   *
-   * @private
-   */
-  onClick() {
-    this.openOptions();
-  }
-
   /**
    * Destroy instance.
    */
   destroy() {
-    if (this.menu) {
-      this.menu.destroy();
-      this.menu = null;
+    if (_classPrivateFieldGet(this, _menu)) {
+      _classPrivateFieldGet(this, _menu).destroy();
+      _classPrivateFieldSet(this, _menu, null);
     }
-    const {
-      caption,
-      dropdown
-    } = privatePool.get(this);
-    if (caption) {
-      caption.destroy();
+    if (_classPrivateFieldGet(this, _caption)) {
+      _classPrivateFieldGet(this, _caption).destroy();
     }
-    if (dropdown) {
-      dropdown.destroy();
+    if (_classPrivateFieldGet(this, _dropdown)) {
+      _classPrivateFieldGet(this, _dropdown).destroy();
     }
     super.destroy();
   }
 }
-export default SelectUI;
+function _onMenuSelect2(command) {
+  if (command.name !== SEPARATOR) {
+    this.options.value = command;
+    this.update();
+    this.runLocalHooks('select', this.options.value);
+  }
+}
+function _onMenuClosed2() {
+  this.runLocalHooks('afterClose');
+}
+function _onClick2() {
+  this.openOptions();
+}

package/shortcuts/context.js

@@ -49,7 +49,7 @@ const createContext = name => {
    * @param {Function} options.callback The shortcut's action
    * @param {object} options.group A group of shortcuts to which the shortcut belongs
    * @param {object} [options.runOnlyIf] A condition on which the shortcut's action runs
-   * @param {object} [options.stopPropagation=true] If set to `true`: stops the event's propagation
+   * @param {object} [options.stopPropagation=false] If set to `true`: stops the event's propagation
    * @param {object} [options.captureCtrl=false] If set to `true`: captures the state of the Control/Meta modifier key
    * @param {object} [options.preventDefault=true] If set to `true`: prevents the default behavior
    * @param {object} [options.position='after'] The order in which the shortcut's action runs:
@@ -126,11 +126,12 @@ const createContext = name => {
    * @param {Function} [options.callback] A shortcut's action
    * @param {object} [options.group] A group of shortcuts to which a shortcut belongs
    * @param {object} [options.runOnlyIf] A condition on which a shortcut's action runs
-   * @param {object} [options.stopPropagation=true] If set to `true`: stops the event's propagation
+   * @param {object} [options.stopPropagation=false] If set to `true`: stops the event's propagation
    * @param {object} [options.preventDefault=true] If set to `true`: prevents the default behavior
    * @param {object} [options.position='after'] The order in which a shortcut's action runs:
    * `'before'` or `'after'` a `relativeToGroup` group of actions
    * @param {object} [options.relativeToGroup] The name of a group of actions, used to determine an action's `position`
+   * @param {object} [options.forwardToContext] The context object where the event will be forwarded to.
    */
   const addShortcuts = function (shortcuts) {
     let options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};

package/shortcuts/context.mjs

@@ -45,7 +45,7 @@ export const createContext = name => {
    * @param {Function} options.callback The shortcut's action
    * @param {object} options.group A group of shortcuts to which the shortcut belongs
    * @param {object} [options.runOnlyIf] A condition on which the shortcut's action runs
-   * @param {object} [options.stopPropagation=true] If set to `true`: stops the event's propagation
+   * @param {object} [options.stopPropagation=false] If set to `true`: stops the event's propagation
    * @param {object} [options.captureCtrl=false] If set to `true`: captures the state of the Control/Meta modifier key
    * @param {object} [options.preventDefault=true] If set to `true`: prevents the default behavior
    * @param {object} [options.position='after'] The order in which the shortcut's action runs:
@@ -122,11 +122,12 @@ export const createContext = name => {
    * @param {Function} [options.callback] A shortcut's action
    * @param {object} [options.group] A group of shortcuts to which a shortcut belongs
    * @param {object} [options.runOnlyIf] A condition on which a shortcut's action runs
-   * @param {object} [options.stopPropagation=true] If set to `true`: stops the event's propagation
+   * @param {object} [options.stopPropagation=false] If set to `true`: stops the event's propagation
    * @param {object} [options.preventDefault=true] If set to `true`: prevents the default behavior
    * @param {object} [options.position='after'] The order in which a shortcut's action runs:
    * `'before'` or `'after'` a `relativeToGroup` group of actions
    * @param {object} [options.relativeToGroup] The name of a group of actions, used to determine an action's `position`
+   * @param {object} [options.forwardToContext] The context object where the event will be forwarded to.
    */
   const addShortcuts = function (shortcuts) {
     let options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};

package/utils/paginator.js

@@ -0,0 +1,151 @@
+"use strict";
+
+exports.__esModule = true;
+exports.createPaginator = createPaginator;
+var _number = require("../helpers/number");
+/**
+ * @typedef Paginator
+ * @property {function(number): void} setCurrentPage Sets the current index to the specific page.
+ * @property {function(): number} getCurrentPage Gets the current page.
+ * @property {function(): number} getSize Gets the total number of pages.
+ * @property {function(): void} toFirstItem Move the index to the first page.
+ * @property {function(): void} toLastItem Move the index to the last page.
+ * @property {function(): void} toNextItem Move the index to the next page.
+ * @property {function(): void} toPreviousItem Move the index to the previous page.
+ * @property {function(): void} clear Clear the internal state of the paginator.
+ */
+/**
+ * @param {object} options Paginator options.
+ * @param {number} [options.initialPage] Initial index from which paging starts. Also, after clearing the paginator
+ * the page is cleared to the initial page.
+ * @param {function(): number} [options.size] Sets the max size of the pages.
+ * @param {function(number): boolean | void} [options.onItemSelect] Fires the function on each page change.
+ * @param {function(): void} [options.onClear] Fires the function after clearing the state.
+ * @returns {Paginator}
+ */
+function createPaginator(_ref) {
+  let {
+    initialPage = -1,
+    size = () => 0,
+    onItemSelect = () => {},
+    onClear = () => {}
+  } = _ref;
+  const visitedPages = new Set();
+  let currentIndex = (0, _number.clamp)(initialPage, -1, getSize() - 1);
+
+  /**
+   * Updates the internal state of the paginator.
+   *
+   * @param {number} newIndex The page index to switch.
+   * @param {-1|1} direction The direction of traversing the pages in case when they are disabled.
+   * @returns {number} Returns the final index of the page.
+   */
+  function _updateState(newIndex, direction) {
+    const lastIndex = getSize() - 1;
+    if (newIndex < 0) {
+      newIndex = lastIndex;
+    }
+    if (newIndex > lastIndex) {
+      newIndex = 0;
+    }
+    if (visitedPages.has(newIndex)) {
+      return -1;
+    }
+    visitedPages.add(newIndex);
+    const changeProceed = onItemSelect(newIndex, false);
+    if (changeProceed === false) {
+      newIndex = _updateState(direction === 1 ? ++newIndex : --newIndex,
+      // eslint-disable-line no-plusplus
+      direction);
+    }
+    return newIndex;
+  }
+
+  /**
+   * Sets the page index as current one.
+   *
+   * @param {number} index The index to set.
+   */
+  function setCurrentPage(index) {
+    if (index > -1 && index < getSize() && onItemSelect(index, true) !== false) {
+      currentIndex = index;
+    }
+  }
+
+  /**
+   * Gets the current page.
+   *
+   * @returns {number}
+   */
+  function getCurrentPage() {
+    return currentIndex;
+  }
+
+  /**
+   * Moves the index to the first page.
+   */
+  function toFirstItem() {
+    if (getSize() > 0) {
+      visitedPages.clear();
+      currentIndex = _updateState(0, 1);
+    }
+  }
+
+  /**
+   * Moves the index to the last page.
+   */
+  function toLastItem() {
+    if (getSize() > 0) {
+      visitedPages.clear();
+      currentIndex = _updateState(getSize() - 1, -1);
+    }
+  }
+
+  /**
+   * Moves the index to the next page.
+   */
+  function toNextItem() {
+    if (getSize() > 0) {
+      visitedPages.clear();
+      currentIndex = _updateState(++currentIndex, 1); // eslint-disable-line no-plusplus
+    }
+  }
+
+  /**
+   * Moves the index to the previous page.
+   */
+  function toPreviousItem() {
+    if (getSize() > 0) {
+      visitedPages.clear();
+      currentIndex = _updateState(--currentIndex, -1); // eslint-disable-line no-plusplus
+    }
+  }
+
+  /**
+   * Gets the total number of pages.
+   *
+   * @returns {number}
+   */
+  function getSize() {
+    return Math.max(size(), 0);
+  }
+
+  /**
+   * Clears the internal state of the paginator.
+   */
+  function clear() {
+    visitedPages.clear();
+    currentIndex = initialPage;
+    onClear();
+  }
+  return {
+    setCurrentPage,
+    getCurrentPage,
+    toFirstItem,
+    toLastItem,
+    toNextItem,
+    toPreviousItem,
+    getSize,
+    clear
+  };
+}

package/utils/paginator.mjs

@@ -0,0 +1,147 @@
+import { clamp } from "../helpers/number.mjs";
+/**
+ * @typedef Paginator
+ * @property {function(number): void} setCurrentPage Sets the current index to the specific page.
+ * @property {function(): number} getCurrentPage Gets the current page.
+ * @property {function(): number} getSize Gets the total number of pages.
+ * @property {function(): void} toFirstItem Move the index to the first page.
+ * @property {function(): void} toLastItem Move the index to the last page.
+ * @property {function(): void} toNextItem Move the index to the next page.
+ * @property {function(): void} toPreviousItem Move the index to the previous page.
+ * @property {function(): void} clear Clear the internal state of the paginator.
+ */
+/**
+ * @param {object} options Paginator options.
+ * @param {number} [options.initialPage] Initial index from which paging starts. Also, after clearing the paginator
+ * the page is cleared to the initial page.
+ * @param {function(): number} [options.size] Sets the max size of the pages.
+ * @param {function(number): boolean | void} [options.onItemSelect] Fires the function on each page change.
+ * @param {function(): void} [options.onClear] Fires the function after clearing the state.
+ * @returns {Paginator}
+ */
+export function createPaginator(_ref) {
+  let {
+    initialPage = -1,
+    size = () => 0,
+    onItemSelect = () => {},
+    onClear = () => {}
+  } = _ref;
+  const visitedPages = new Set();
+  let currentIndex = clamp(initialPage, -1, getSize() - 1);
+
+  /**
+   * Updates the internal state of the paginator.
+   *
+   * @param {number} newIndex The page index to switch.
+   * @param {-1|1} direction The direction of traversing the pages in case when they are disabled.
+   * @returns {number} Returns the final index of the page.
+   */
+  function _updateState(newIndex, direction) {
+    const lastIndex = getSize() - 1;
+    if (newIndex < 0) {
+      newIndex = lastIndex;
+    }
+    if (newIndex > lastIndex) {
+      newIndex = 0;
+    }
+    if (visitedPages.has(newIndex)) {
+      return -1;
+    }
+    visitedPages.add(newIndex);
+    const changeProceed = onItemSelect(newIndex, false);
+    if (changeProceed === false) {
+      newIndex = _updateState(direction === 1 ? ++newIndex : --newIndex,
+      // eslint-disable-line no-plusplus
+      direction);
+    }
+    return newIndex;
+  }
+
+  /**
+   * Sets the page index as current one.
+   *
+   * @param {number} index The index to set.
+   */
+  function setCurrentPage(index) {
+    if (index > -1 && index < getSize() && onItemSelect(index, true) !== false) {
+      currentIndex = index;
+    }
+  }
+
+  /**
+   * Gets the current page.
+   *
+   * @returns {number}
+   */
+  function getCurrentPage() {
+    return currentIndex;
+  }
+
+  /**
+   * Moves the index to the first page.
+   */
+  function toFirstItem() {
+    if (getSize() > 0) {
+      visitedPages.clear();
+      currentIndex = _updateState(0, 1);
+    }
+  }
+
+  /**
+   * Moves the index to the last page.
+   */
+  function toLastItem() {
+    if (getSize() > 0) {
+      visitedPages.clear();
+      currentIndex = _updateState(getSize() - 1, -1);
+    }
+  }
+
+  /**
+   * Moves the index to the next page.
+   */
+  function toNextItem() {
+    if (getSize() > 0) {
+      visitedPages.clear();
+      currentIndex = _updateState(++currentIndex, 1); // eslint-disable-line no-plusplus
+    }
+  }
+
+  /**
+   * Moves the index to the previous page.
+   */
+  function toPreviousItem() {
+    if (getSize() > 0) {
+      visitedPages.clear();
+      currentIndex = _updateState(--currentIndex, -1); // eslint-disable-line no-plusplus
+    }
+  }
+
+  /**
+   * Gets the total number of pages.
+   *
+   * @returns {number}
+   */
+  function getSize() {
+    return Math.max(size(), 0);
+  }
+
+  /**
+   * Clears the internal state of the paginator.
+   */
+  function clear() {
+    visitedPages.clear();
+    currentIndex = initialPage;
+    onClear();
+  }
+  return {
+    setCurrentPage,
+    getCurrentPage,
+    toFirstItem,
+    toLastItem,
+    toNextItem,
+    toPreviousItem,
+    getSize,
+    clear
+  };
+}