handsontable 0.0.0-next-9059914-20231025 → 0.0.0-next-21d91d0-20231025

package/plugins/filters/menu/focusController.js

@@ -0,0 +1,123 @@
+"use strict";
+
+exports.__esModule = true;
+exports.createMenuFocusController = createMenuFocusController;
+var _focusNavigator = require("./focusNavigator");
+var _select = require("../ui/select");
+var _base = require("../ui/_base");
+var _link = require("../ui/link");
+const SHORTCUTS_MENU_CONTEXT = 'filters';
+
+/**
+ * @typedef MenuFocusNavigator
+ * @property {function(number): void} setCurrentPage Sets the current index of the selected focus.
+ * @property {function(): number} getCurrentPage Gets the index of currently focus element.
+ * @property {function(): void} toFirstItem Move the focus index to the first element in the list.
+ * @property {function(): void} toLastItem Move the focus index to the last element in the list.
+ * @property {function(): void} toNextItem Move the focus index to the next element in the list.
+ * @property {function(): void} toPreviousItem Move the focus index to the previous element in the list.
+ * @property {function(): void} clear Clear the internal state of the navigator.
+ * @property {function(): void} listen Activate the navigator by listening the keyboard shortcuts.
+ */
+/**
+ * Creates navigator controller for filter subcomponents in the menu.
+ *
+ * @param {Menu} mainMenu The main Menu instance.
+ * @param {BaseUI[]} menuItems The list of the component's elements to paginate to.
+ * @returns {Paginator}
+ */
+function createMenuFocusController(mainMenu, menuItems) {
+  const navigator = (0, _focusNavigator.createFocusNavigator)(menuItems);
+  const updateNavigatorPosition = element => () => {
+    if (mainMenu.isOpened()) {
+      mainMenu.getKeyboardShortcutsCtrl().listen(SHORTCUTS_MENU_CONTEXT);
+    }
+    navigator.setCurrentPage(menuItems.indexOf(element));
+  };
+
+  // update navigator position (internal state) to element that was recently clicked or focused
+  menuItems.forEach(element => {
+    if (element instanceof _base.BaseUI) {
+      element.addLocalHook('click', updateNavigatorPosition(element));
+      element.addLocalHook('focus', updateNavigatorPosition(element));
+      element.addLocalHook('afterClose', updateNavigatorPosition(element));
+    }
+  });
+  mainMenu.addLocalHook('afterSelectionChange', selectedItem => {
+    if (!selectedItem.key.startsWith('filter_')) {
+      navigator.clear();
+    }
+  });
+
+  /**
+   * Extends the menu and submenus with new keyboard shortcuts.
+   *
+   * @param {*} menu The menu (as main menu or submenu) instance.
+   */
+  function addKeyboardShortcuts(menu) {
+    const mainMenuShortcutsCtrl = mainMenu.getKeyboardShortcutsCtrl();
+    const currentMenuShortcutsCtrl = menu.getKeyboardShortcutsCtrl();
+    navigator.clear();
+    currentMenuShortcutsCtrl.addCustomShortcuts([{
+      keys: [['Tab'], ['Shift', 'Tab']],
+      forwardToContext: mainMenuShortcutsCtrl.getContext(SHORTCUTS_MENU_CONTEXT),
+      callback: () => {
+        if (menu.isSubMenu()) {
+          menu.close();
+        }
+        mainMenuShortcutsCtrl.listen(SHORTCUTS_MENU_CONTEXT);
+      }
+    }]);
+    if (menu.isSubMenu()) {
+      return;
+    }
+    mainMenuShortcutsCtrl.addCustomShortcuts([{
+      keys: [['Tab'], ['Shift', 'Tab']],
+      callback: event => {
+        mainMenu.getNavigator().clear();
+        if (event.shiftKey) {
+          navigator.toPreviousItem();
+        } else {
+          navigator.toNextItem();
+        }
+      }
+    }, {
+      keys: [['Escape']],
+      callback: () => {
+        mainMenu.close();
+      }
+    }, {
+      keys: [['Enter'], ['Space']],
+      preventDefault: false,
+      callback: event => {
+        const element = menuItems[navigator.getCurrentPage()];
+        if (element instanceof _select.SelectUI) {
+          element.openOptions();
+          event.preventDefault();
+        }
+        if (element instanceof _link.LinkUI) {
+          element.activate();
+          event.preventDefault();
+        }
+        if (!(element instanceof _base.BaseUI)) {
+          event.preventDefault();
+        }
+      }
+    }], SHORTCUTS_MENU_CONTEXT);
+  }
+  mainMenu.addLocalHook('afterSubmenuOpen', addKeyboardShortcuts);
+  mainMenu.addLocalHook('afterOpen', addKeyboardShortcuts);
+
+  /**
+   * Focuses the menu and switches its shortcut context to that one which controls
+   * the focus navigation.
+   */
+  function listen() {
+    mainMenu.focus();
+    mainMenu.getKeyboardShortcutsCtrl().listen(SHORTCUTS_MENU_CONTEXT);
+  }
+  return {
+    ...navigator,
+    listen
+  };
+}

package/plugins/filters/menu/focusController.mjs

@@ -0,0 +1,119 @@
+import { createFocusNavigator } from "./focusNavigator.mjs";
+import { SelectUI } from "../ui/select.mjs";
+import { BaseUI } from "../ui/_base.mjs";
+import { LinkUI } from "../ui/link.mjs";
+const SHORTCUTS_MENU_CONTEXT = 'filters';
+
+/**
+ * @typedef MenuFocusNavigator
+ * @property {function(number): void} setCurrentPage Sets the current index of the selected focus.
+ * @property {function(): number} getCurrentPage Gets the index of currently focus element.
+ * @property {function(): void} toFirstItem Move the focus index to the first element in the list.
+ * @property {function(): void} toLastItem Move the focus index to the last element in the list.
+ * @property {function(): void} toNextItem Move the focus index to the next element in the list.
+ * @property {function(): void} toPreviousItem Move the focus index to the previous element in the list.
+ * @property {function(): void} clear Clear the internal state of the navigator.
+ * @property {function(): void} listen Activate the navigator by listening the keyboard shortcuts.
+ */
+/**
+ * Creates navigator controller for filter subcomponents in the menu.
+ *
+ * @param {Menu} mainMenu The main Menu instance.
+ * @param {BaseUI[]} menuItems The list of the component's elements to paginate to.
+ * @returns {Paginator}
+ */
+export function createMenuFocusController(mainMenu, menuItems) {
+  const navigator = createFocusNavigator(menuItems);
+  const updateNavigatorPosition = element => () => {
+    if (mainMenu.isOpened()) {
+      mainMenu.getKeyboardShortcutsCtrl().listen(SHORTCUTS_MENU_CONTEXT);
+    }
+    navigator.setCurrentPage(menuItems.indexOf(element));
+  };
+
+  // update navigator position (internal state) to element that was recently clicked or focused
+  menuItems.forEach(element => {
+    if (element instanceof BaseUI) {
+      element.addLocalHook('click', updateNavigatorPosition(element));
+      element.addLocalHook('focus', updateNavigatorPosition(element));
+      element.addLocalHook('afterClose', updateNavigatorPosition(element));
+    }
+  });
+  mainMenu.addLocalHook('afterSelectionChange', selectedItem => {
+    if (!selectedItem.key.startsWith('filter_')) {
+      navigator.clear();
+    }
+  });
+
+  /**
+   * Extends the menu and submenus with new keyboard shortcuts.
+   *
+   * @param {*} menu The menu (as main menu or submenu) instance.
+   */
+  function addKeyboardShortcuts(menu) {
+    const mainMenuShortcutsCtrl = mainMenu.getKeyboardShortcutsCtrl();
+    const currentMenuShortcutsCtrl = menu.getKeyboardShortcutsCtrl();
+    navigator.clear();
+    currentMenuShortcutsCtrl.addCustomShortcuts([{
+      keys: [['Tab'], ['Shift', 'Tab']],
+      forwardToContext: mainMenuShortcutsCtrl.getContext(SHORTCUTS_MENU_CONTEXT),
+      callback: () => {
+        if (menu.isSubMenu()) {
+          menu.close();
+        }
+        mainMenuShortcutsCtrl.listen(SHORTCUTS_MENU_CONTEXT);
+      }
+    }]);
+    if (menu.isSubMenu()) {
+      return;
+    }
+    mainMenuShortcutsCtrl.addCustomShortcuts([{
+      keys: [['Tab'], ['Shift', 'Tab']],
+      callback: event => {
+        mainMenu.getNavigator().clear();
+        if (event.shiftKey) {
+          navigator.toPreviousItem();
+        } else {
+          navigator.toNextItem();
+        }
+      }
+    }, {
+      keys: [['Escape']],
+      callback: () => {
+        mainMenu.close();
+      }
+    }, {
+      keys: [['Enter'], ['Space']],
+      preventDefault: false,
+      callback: event => {
+        const element = menuItems[navigator.getCurrentPage()];
+        if (element instanceof SelectUI) {
+          element.openOptions();
+          event.preventDefault();
+        }
+        if (element instanceof LinkUI) {
+          element.activate();
+          event.preventDefault();
+        }
+        if (!(element instanceof BaseUI)) {
+          event.preventDefault();
+        }
+      }
+    }], SHORTCUTS_MENU_CONTEXT);
+  }
+  mainMenu.addLocalHook('afterSubmenuOpen', addKeyboardShortcuts);
+  mainMenu.addLocalHook('afterOpen', addKeyboardShortcuts);
+
+  /**
+   * Focuses the menu and switches its shortcut context to that one which controls
+   * the focus navigation.
+   */
+  function listen() {
+    mainMenu.focus();
+    mainMenu.getKeyboardShortcutsCtrl().listen(SHORTCUTS_MENU_CONTEXT);
+  }
+  return {
+    ...navigator,
+    listen
+  };
+}

package/plugins/filters/menu/focusNavigator.js

@@ -0,0 +1,30 @@
+"use strict";
+
+exports.__esModule = true;
+exports.createFocusNavigator = createFocusNavigator;
+var _paginator = require("../../../utils/paginator");
+var _element = require("../../../helpers/dom/element");
+var _multipleSelect = require("../ui/multipleSelect");
+/**
+ * Creates navigator for switching the focus of the filter's elements.
+ *
+ * @param {BaseUI[]} elements The elements to paginate to.
+ * @returns {Paginator}
+ */
+function createFocusNavigator(elements) {
+  const navigator = (0, _paginator.createPaginator)({
+    initialPage: 0,
+    size: () => elements.length,
+    onItemSelect: (currentIndex, directItemChange) => {
+      const element = elements[currentIndex];
+      if (element instanceof _multipleSelect.MultipleSelectUI) {
+        return directItemChange;
+      }
+      if (element.element && !(0, _element.isVisible)(element.element)) {
+        return false;
+      }
+      element.focus();
+    }
+  });
+  return navigator;
+}

package/plugins/filters/menu/focusNavigator.mjs

@@ -0,0 +1,26 @@
+import { createPaginator } from "../../../utils/paginator.mjs";
+import { isVisible } from "../../../helpers/dom/element.mjs";
+import { MultipleSelectUI } from "../ui/multipleSelect.mjs";
+/**
+ * Creates navigator for switching the focus of the filter's elements.
+ *
+ * @param {BaseUI[]} elements The elements to paginate to.
+ * @returns {Paginator}
+ */
+export function createFocusNavigator(elements) {
+  const navigator = createPaginator({
+    initialPage: 0,
+    size: () => elements.length,
+    onItemSelect: (currentIndex, directItemChange) => {
+      const element = elements[currentIndex];
+      if (element instanceof MultipleSelectUI) {
+        return directItemChange;
+      }
+      if (element.element && !isVisible(element.element)) {
+        return false;
+      }
+      element.focus();
+    }
+  });
+  return navigator;
+}

package/plugins/filters/ui/_base.js

@@ -1,6 +1,7 @@
 "use strict";
 
 exports.__esModule = true;
+require("core-js/modules/es.error.cause.js");
 var _object = require("../../../helpers/object");
 var _localHooks = _interopRequireDefault(require("../../../mixins/localHooks"));
 var _eventManager = _interopRequireDefault(require("../../../eventManager"));
@@ -10,6 +11,9 @@ var C = _interopRequireWildcard(require("../../../i18n/constants"));
 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 _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+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); }
 const STATE_BUILT = 'built';
 const STATE_BUILDING = 'building';
 const EVENTS_TO_REGISTER = ['click', 'input', 'keydown', 'keypress', 'keyup', 'focus', 'blur', 'change'];
@@ -27,38 +31,43 @@ class BaseUI {
       wrapIt: true
     });
   }
+
+  /**
+   * Instance of Handsontable.
+   *
+   * @type {Core}
+   */
+
   constructor(hotInstance, options) {
-    /**
-     * Instance of Handsontable.
-     *
-     * @type {Core}
-     */
-    this.hot = hotInstance;
+    _defineProperty(this, "hot", void 0);
     /**
      * Instance of EventManager.
      *
      * @type {EventManager}
      */
-    this.eventManager = new _eventManager.default(this);
+    _defineProperty(this, "eventManager", new _eventManager.default(this));
     /**
      * List of element options.
      *
      * @type {object}
      */
-    this.options = (0, _object.extend)(BaseUI.DEFAULTS, options);
+    _defineProperty(this, "options", void 0);
     /**
      * Build root DOM element.
      *
      * @type {Element}
      * @private
      */
-    this._element = this.hot.rootDocument.createElement(this.options.wrapIt ? 'div' : this.options.tagName);
+    _defineProperty(this, "_element", void 0);
     /**
      * Flag which determines build state of element.
      *
      * @type {string}
      */
-    this.buildState = null;
+    _defineProperty(this, "buildState", void 0);
+    this.hot = hotInstance;
+    this.options = (0, _object.extend)(BaseUI.DEFAULTS, options);
+    this._element = this.hot.rootDocument.createElement(this.options.wrapIt ? 'div' : this.options.tagName);
   }
 
   /**
@@ -131,6 +140,16 @@ class BaseUI {
     if (!this.buildState) {
       this.buildState = STATE_BUILDING;
     }
+
+    // prevents "hot.unlisten()" call when clicked
+    // (https://github.com/handsontable/handsontable/blob/master/handsontable/src/tableView.js#L317-L321)
+    this._element.setAttribute('data-hot-input', true);
+    if (this.options.tabIndex !== undefined) {
+      this._element.setAttribute('tabindex', this.options.tabIndex);
+    }
+    if (this.options.role !== undefined) {
+      this._element.setAttribute('role', this.options.role);
+    }
     if (this.options.className) {
       (0, _element.addClass)(this._element, this.options.className);
     }
@@ -138,6 +157,10 @@ class BaseUI {
       (0, _array.arrayEach)(this.options.children, element => this._element.appendChild(element.element));
     } else if (this.options.wrapIt) {
       const element = this.hot.rootDocument.createElement(this.options.tagName);
+
+      // prevents "hot.unlisten()" call when clicked
+      // (https://github.com/handsontable/handsontable/blob/master/handsontable/src/tableView.js#L317-L321)
+      element.setAttribute('data-hot-input', true);
       (0, _object.objectEach)(this.options, (value, key) => {
         if (element[key] !== void 0 && key !== 'className' && key !== 'tagName' && key !== 'children') {
           element[key] = this.translateIfPossible(value);
@@ -191,6 +214,5 @@ class BaseUI {
     this._element = null;
   }
 }
-(0, _object.mixin)(BaseUI, _localHooks.default);
-var _default = BaseUI;
-exports.default = _default;
+exports.BaseUI = BaseUI;
+(0, _object.mixin)(BaseUI, _localHooks.default);

package/plugins/filters/ui/_base.mjs

@@ -1,3 +1,7 @@
+import "core-js/modules/es.error.cause.js";
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+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); }
 import { clone, extend, mixin, objectEach } from "../../../helpers/object.mjs";
 import localHooks from "../../../mixins/localHooks.mjs";
 import EventManager from "../../../eventManager.mjs";
@@ -11,7 +15,7 @@ const EVENTS_TO_REGISTER = ['click', 'input', 'keydown', 'keypress', 'keyup', 'f
 /**
  * @private
  */
-class BaseUI {
+export class BaseUI {
   static get DEFAULTS() {
     return clone({
       className: '',
@@ -21,38 +25,43 @@ class BaseUI {
       wrapIt: true
     });
   }
+
+  /**
+   * Instance of Handsontable.
+   *
+   * @type {Core}
+   */
+
   constructor(hotInstance, options) {
-    /**
-     * Instance of Handsontable.
-     *
-     * @type {Core}
-     */
-    this.hot = hotInstance;
+    _defineProperty(this, "hot", void 0);
     /**
      * Instance of EventManager.
      *
      * @type {EventManager}
      */
-    this.eventManager = new EventManager(this);
+    _defineProperty(this, "eventManager", new EventManager(this));
     /**
      * List of element options.
      *
      * @type {object}
      */
-    this.options = extend(BaseUI.DEFAULTS, options);
+    _defineProperty(this, "options", void 0);
     /**
      * Build root DOM element.
      *
      * @type {Element}
      * @private
      */
-    this._element = this.hot.rootDocument.createElement(this.options.wrapIt ? 'div' : this.options.tagName);
+    _defineProperty(this, "_element", void 0);
     /**
      * Flag which determines build state of element.
      *
      * @type {string}
      */
-    this.buildState = null;
+    _defineProperty(this, "buildState", void 0);
+    this.hot = hotInstance;
+    this.options = extend(BaseUI.DEFAULTS, options);
+    this._element = this.hot.rootDocument.createElement(this.options.wrapIt ? 'div' : this.options.tagName);
   }
 
   /**
@@ -125,6 +134,16 @@ class BaseUI {
     if (!this.buildState) {
       this.buildState = STATE_BUILDING;
     }
+
+    // prevents "hot.unlisten()" call when clicked
+    // (https://github.com/handsontable/handsontable/blob/master/handsontable/src/tableView.js#L317-L321)
+    this._element.setAttribute('data-hot-input', true);
+    if (this.options.tabIndex !== undefined) {
+      this._element.setAttribute('tabindex', this.options.tabIndex);
+    }
+    if (this.options.role !== undefined) {
+      this._element.setAttribute('role', this.options.role);
+    }
     if (this.options.className) {
       addClass(this._element, this.options.className);
     }
@@ -132,6 +151,10 @@ class BaseUI {
       arrayEach(this.options.children, element => this._element.appendChild(element.element));
     } else if (this.options.wrapIt) {
       const element = this.hot.rootDocument.createElement(this.options.tagName);
+
+      // prevents "hot.unlisten()" call when clicked
+      // (https://github.com/handsontable/handsontable/blob/master/handsontable/src/tableView.js#L317-L321)
+      element.setAttribute('data-hot-input', true);
       objectEach(this.options, (value, key) => {
         if (element[key] !== void 0 && key !== 'className' && key !== 'tagName' && key !== 'children') {
           element[key] = this.translateIfPossible(value);
@@ -185,5 +208,4 @@ class BaseUI {
     this._element = null;
   }
 }
-mixin(BaseUI, localHooks);
-export default BaseUI;
+mixin(BaseUI, localHooks);

package/plugins/filters/ui/input.js

@@ -1,27 +1,53 @@
 "use strict";
 
 exports.__esModule = true;
+require("core-js/modules/es.error.cause.js");
 var _element = require("../../../helpers/dom/element");
 var _object = require("../../../helpers/object");
-var _base = _interopRequireDefault(require("./_base"));
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-const privatePool = new WeakMap();
-
+var _base = require("./_base");
+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 _classPrivateFieldGet(receiver, privateMap) { var descriptor = _classExtractFieldDescriptor(receiver, privateMap, "get"); return _classApplyDescriptorGet(receiver, descriptor); }
+function _classApplyDescriptorGet(receiver, descriptor) { if (descriptor.get) { return descriptor.get.call(receiver); } return descriptor.value; }
+function _classPrivateFieldSet(receiver, privateMap, value) { var descriptor = _classExtractFieldDescriptor(receiver, privateMap, "set"); _classApplyDescriptorSet(receiver, descriptor, value); return value; }
+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 _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; }
 /**
  * @private
  * @class InputUI
  */
-class InputUI extends _base.default {
+var _input = /*#__PURE__*/new WeakMap();
+var _onKeyup = /*#__PURE__*/new WeakSet();
+class InputUI extends _base.BaseUI {
   static get DEFAULTS() {
     return (0, _object.clone)({
       placeholder: '',
       type: 'text',
-      tagName: 'input'
+      tagName: 'input',
+      tabIndex: -1
     });
   }
+
+  /**
+   * The reference to the input element.
+   *
+   * @type {HTMLInputElement}
+   */
+
   constructor(hotInstance, options) {
     super(hotInstance, (0, _object.extend)(InputUI.DEFAULTS, options));
-    privatePool.set(this, {});
+    /**
+     * OnKeyup listener.
+     *
+     * @param {Event} event The mouse event object.
+     */
+    _classPrivateMethodInitSpec(this, _onKeyup);
+    _classPrivateFieldInitSpec(this, _input, {
+      writable: true,
+      value: void 0
+    });
     this.registerHooks();
   }
 
@@ -29,8 +55,7 @@ class InputUI extends _base.default {
    * Register all necessary hooks.
    */
   registerHooks() {
-    this.addLocalHook('click', () => this.onClick());
-    this.addLocalHook('keyup', event => this.onKeyup(event));
+    this.addLocalHook('keyup', event => _classPrivateMethodGet(this, _onKeyup, _onKeyup2).call(this, event));
   }
 
   /**
@@ -38,9 +63,8 @@ class InputUI extends _base.default {
    */
   build() {
     super.build();
-    const priv = privatePool.get(this);
     const icon = this.hot.rootDocument.createElement('div');
-    priv.input = this._element.firstChild;
+    _classPrivateFieldSet(this, _input, this._element.firstChild);
     (0, _element.addClass)(this._element, 'htUIInput');
     (0, _element.addClass)(icon, 'htUIInputIcon');
     this._element.appendChild(icon);
@@ -54,10 +78,9 @@ class InputUI extends _base.default {
     if (!this.isBuilt()) {
       return;
     }
-    const input = privatePool.get(this).input;
-    input.type = this.options.type;
-    input.placeholder = this.translateIfPossible(this.options.placeholder);
-    input.value = this.translateIfPossible(this.options.value);
+    _classPrivateFieldGet(this, _input).type = this.options.type;
+    _classPrivateFieldGet(this, _input).placeholder = this.translateIfPossible(this.options.placeholder);
+    _classPrivateFieldGet(this, _input).value = this.translateIfPossible(this.options.value);
   }
 
   /**
@@ -65,23 +88,11 @@ class InputUI extends _base.default {
    */
   focus() {
     if (this.isBuilt()) {
-      privatePool.get(this).input.focus();
+      _classPrivateFieldGet(this, _input).focus();
     }
   }
-
-  /**
-   * OnClick listener.
-   */
-  onClick() {}
-
-  /**
-   * OnKeyup listener.
-   *
-   * @param {Event} event The mouse event object.
-   */
-  onKeyup(event) {
-    this.options.value = event.target.value;
-  }
 }
-var _default = InputUI;
-exports.default = _default;
+exports.InputUI = InputUI;
+function _onKeyup2(event) {
+  this.options.value = event.target.value;
+}