handsontable 16.2.0 → 17.0.0-rc10

package/editors/factory.mjs

@@ -0,0 +1,397 @@
+import { BaseEditor } from "./baseEditor/baseEditor.mjs";
+import EventManager from "../eventManager.mjs";
+import { throwWithCause } from "../helpers/errors.mjs";
+/**
+ * Factory function for creating custom Handsontable editors by extending BaseEditor.
+ *
+ * This factory allows you to create custom editors by providing implementations for various
+ * editor lifecycle methods. It handles the prototype chain setup and method delegation to
+ * the BaseEditor superclass automatically.
+ *
+ * @param {object} params Configuration object containing editor lifecycle methods and custom methods.
+ * @param {Function} params.prepare Called before editing begins to initialize the editor.
+ * @param {Function} params.beginEditing Called when editing starts.
+ * @param {Function} params.finishEditing Called when editing ends.
+ * @param {Function} params.discardEditor Called to discard editor changes.
+ * @param {Function} params.saveValue Called to save the edited value.
+ * @param {Function} params.getValue Called to retrieve the current editor value.
+ * @param {Function} params.setValue Called to set the editor value.
+ * @param {Function} params.open Called to open/show the editor UI.
+ * @param {Function} params.close Called to close/hide the editor UI.
+ * @param {Function} params.focus Called to focus the editor.
+ * @param {Function} params.cancelChanges Called to cancel editing changes.
+ * @param {Function} params.checkEditorSection Called to determine which section the editor belongs to.
+ * @param {Function} params.enableFullEditMode Called to enable full edit mode.
+ * @param {Function} params.extend Called to extend the editor class.
+ * @param {Function} params.getEditedCell Called to get the currently edited cell element.
+ * @param {Function} params.getEditedCellRect Called to get the edited cell's position and dimensions.
+ * @param {Function} params.getEditedCellsZIndex Called to get the z-index for the edited cell.
+ * @param {Function} params.init Called during editor initialization.
+ * @param {Function} params.isInFullEditMode Called to check if editor is in full edit mode.
+ * @param {Function} params.isOpened Called to check if editor is currently open.
+ * @param {Function} params.isWaiting Called to check if editor is waiting for input.
+ *
+ * @returns {Function} A custom editor class extending Handsontable's BaseEditor.
+ *
+ * @example
+ * ```typescript
+ * const MyEditor = editorBaseFactory({
+ *   prepare(editor, row, col, prop, td, originalValue, cellProperties) {
+ *     // Initialize your editor
+ *   },
+ *   open(editor) {
+ *     // Show your editor UI
+ *   },
+ *   close(editor) {
+ *     // Hide your editor UI
+ *   },
+ *   getValue(editor) {
+ *     return editor.customValue;
+ *   }
+ * });
+ * ```
+ */
+const editorBaseFactory = params => {
+  const CustomBaseEditor = BaseEditor.prototype.extend();
+  // Skip super in abstract functions
+  const skipSuperApply = ['close', 'focus', 'getValue', 'open', 'setValue'];
+  const prototypeFns = Object.getOwnPropertyNames(BaseEditor.prototype);
+
+  // Apply editor class methods from params object
+  prototypeFns.forEach(fnName => {
+    if (params[fnName]) {
+      const superFn = CustomBaseEditor.prototype[fnName];
+      CustomBaseEditor.prototype[fnName] = function () {
+        for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+          args[_key] = arguments[_key];
+        }
+        if (!skipSuperApply.includes(fnName)) {
+          superFn.apply(this, args);
+        }
+        return params[fnName](this, ...args);
+      };
+    }
+  });
+  // Apply custom methods
+  Object.keys(params).forEach(fnName => {
+    if (!prototypeFns.includes(fnName)) {
+      CustomBaseEditor.prototype[fnName] = function () {
+        for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
+          args[_key2] = arguments[_key2];
+        }
+        // `this` will be BaseEditor & T, as expected for custom methods.
+        return params[fnName](this, ...args);
+      };
+    }
+  });
+  return CustomBaseEditor;
+};
+
+/**
+ * Factory function to create a custom Handsontable editor.
+ *
+ * `editorFactory` helps you create modular, reusable, and fully custom editors
+ * for Handsontable grid cells. The factory handles lifecycle, DOM structure, and
+ * keyboard shortcuts, allowing you to focus on business-specific UI and value logic.
+ *
+ * @param {object} options Configuration and lifecycle methods for the editor.
+ * @param {Function} options.init Called when this editor is constructed by the Handsontable grid.
+ * @param {Function} options.afterOpen Called after the editor is opened and made visible.
+ * @param {Function} options.afterInit Called immediately after init, useful for event binding, etc.
+ * @param {Function} options.afterClose Called when the editor is closed and made invisible.
+ * @param {Function} options.beforeOpen Called before the editor is opened so you can set its value/state.
+ * @param {Function} options.getValue Called to retrieve the current editor value.
+ * @param {Function} options.setValue Called to set the editor's value and update any UI as needed.
+ * @param {Function} options.onFocus Called to focus the editor.
+ * @param {Array<object>} [options.shortcuts] Called to register all configured keyboard shortcuts for this editor instance.
+ * @param {any} options.value The initial value for the editor input/state.
+ * @param {Function} options.render Called to render the editor UI.
+ * @param {any} options.config The configuration for the editor.
+ * @param {string} options.shortcutsGroup The group for the keyboard shortcuts.
+ * @param {string} options.position The position of the editor. Either 'container' (default) or 'portal' (for elements outside of the table container viewport).
+ * @param {object} [options.args] Any additional custom fields or helpers you want mixed into the editor instance.
+ *
+ * @returns {BaseEditor} A custom editor class extending Handsontable's BaseEditor.
+ */
+export const editorFactory = _ref => {
+  let {
+    /**
+     * Called when this editor is constructed by the Handsontable grid.
+     * Assigns value/config/render/etc, creates UI container, initializes with provided init.
+     *
+     * @param {BaseEditor} editor
+     * @returns {void}
+     */
+    init,
+    /**
+     * Called after the editor is opened and made visible.
+     *
+     * @param {BaseEditor} editor
+     * @returns {void}
+     */
+    afterOpen,
+    /**
+     * Called immediately after init, useful for event binding, etc.
+     *
+     * @param {BaseEditor} editor
+     * @returns {void}
+     */
+    afterInit,
+    /**
+     * Called when the editor is closed and made invisible.
+     *
+     * @param {BaseEditor} editor
+     * @returns {void}
+     */
+    afterClose,
+    /**
+     * Called before the editor is opened so you can set its value/state.
+     *
+     * @param {BaseEditor} editor
+     * @returns {void}
+     */
+    beforeOpen,
+    /**
+     * Called to retrieve the current editor value.
+     *
+     * @param {BaseEditor} editor
+     * @returns {any}
+     */
+    getValue,
+    /**
+     * Called to set the editor's value and update any UI as needed.
+     *
+     * @param {BaseEditor} editor
+     * @param {any} value
+     * @returns {void}
+     */
+    setValue,
+    /**
+     * Called to focus the editor.
+     *
+     * @param {BaseEditor} editor
+     * @returns {void}
+     */
+    onFocus,
+    shortcuts,
+    value,
+    /**
+     * Called to render the editor UI.
+     *
+     * @param {BaseEditor} editor
+     * @returns {void}
+     */
+    render,
+    config,
+    shortcutsGroup = 'custom-editor',
+    position = 'container',
+    /**
+     * @param {...object} [args] Any additional custom fields or helpers you want mixed into the editor instance.
+     */
+    ...args
+  } = _ref;
+  /**
+   * Register all configured keyboard shortcuts for this editor instance.
+   *
+   * @param {BaseEditor} editor The editor instance.
+   * @returns {void}
+   * @private
+   */
+  const registerShortcuts = editor => {
+    const shortcutManager = editor.hot.getShortcutManager();
+    const editorContext = shortcutManager.getContext('editor');
+    const contextConfig = {
+      group: shortcutsGroup
+    };
+    if (shortcuts) {
+      editorContext.addShortcuts(shortcuts.map(shortcut => ({
+        ...shortcut,
+        relativeToGroup: shortcut.relativeToGroup || 'editorManager.handlingEditor',
+        position: shortcut.position || 'before',
+        callback: event => shortcut.callback(editor, event)
+      })), contextConfig);
+    }
+  };
+
+  // Compose the Handsontable editor definition using the core editorBaseFactory:
+  return editorBaseFactory({
+    /**
+     * Called when this editor is constructed by the Handsontable grid.
+     * Assigns value/config/render/etc, creates UI container, initializes with provided init.
+     *
+     * @param {BaseEditor} editor The editor instance.
+     * @returns {void}
+     */
+    init(editor) {
+      Object.assign(editor, {
+        value,
+        config,
+        render,
+        position,
+        ...args
+      });
+      editor._opened = false;
+      editor.container = editor.hot.rootDocument.createElement('DIV');
+      editor.container.style.display = 'none';
+      if (position === 'portal') {
+        editor.hot.rootPortalElement.appendChild(editor.container);
+      } else {
+        editor.hot.rootElement.appendChild(editor.container);
+      }
+      init(editor);
+      if (!editor.input) {
+        throwWithCause('Input is not assigned. Assign it in the init callback.');
+      }
+      editor.container.appendChild(editor.input);
+      if (typeof afterInit === 'function') {
+        afterInit(editor);
+      }
+      if (editor.preventCloseElement && editor.preventCloseElement instanceof HTMLElement) {
+        editor.eventManager = new EventManager(editor.hot);
+        editor.eventManager.addEventListener(editor.preventCloseElement, 'mousedown', event => {
+          event.stopPropagation();
+        });
+      }
+      editor.addHook('afterScrollHorizontally', () => editor.refreshDimensions());
+      editor.addHook('afterScrollVertically', () => editor.refreshDimensions());
+    },
+    /**
+     * Retrieve the value from the editor UI.
+     *
+     * @param {BaseEditor} editor The editor instance.
+     * @returns {any}
+     */
+    getValue(editor) {
+      if (typeof getValue === 'function') {
+        return getValue(editor);
+      }
+      return editor.value;
+    },
+    /**
+     * Set the editor's value and update any UI as needed.
+     *
+     * @param {BaseEditor} editor The editor instance.
+     * @param {any} _value The value to set.
+     * @returns {void}
+     */
+    setValue(editor, _value) {
+      if (typeof setValue === 'function') {
+        setValue(editor, _value);
+      } else {
+        editor.value = _value;
+      }
+      if (typeof render === 'function') {
+        render(editor);
+      }
+    },
+    /**
+     * Refreshes editor position and dimensions (for example, after scroll).
+     *
+     * @param {BaseEditor} editor The editor instance.
+     * @returns {void}
+     */
+    refreshDimensions(editor) {
+      editor.TD = editor.getEditedCell();
+      if (!editor.TD) {
+        editor.close();
+        return;
+      }
+      if (!editor._opened) {
+        return;
+      }
+      const containerStyle = editor.container.style;
+      containerStyle.display = 'block';
+      containerStyle.position = 'absolute';
+      if (editor.position === 'portal') {
+        const _offset = editor.TD.getBoundingClientRect();
+        containerStyle.top = `${editor.hot.rootWindow.pageYOffset + _offset.top}px`;
+        containerStyle[editor.hot.isRtl() ? 'right' : 'left'] = `${editor.hot.rootWindow.pageXOffset + _offset[editor.hot.isRtl() ? 'right' : 'left']}px`;
+      } else {
+        const rect = editor.getEditedCellRect();
+        if (!rect) {
+          return;
+        }
+        containerStyle.top = `${rect.top}px`;
+        containerStyle[editor.hot.isRtl() ? 'right' : 'left'] = `${rect.start}px`;
+        containerStyle.width = `${rect.width}px`;
+        containerStyle.height = `${rect.height}px`;
+      }
+    },
+    /**
+     * Opens the editor, making the container visible and binding shortcuts.
+     *
+     * @param {BaseEditor} editor The editor instance.
+     * @param {Event} event The event that triggered the editor opening.
+     * @returns {void}
+     */
+    open(editor) {
+      let event = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : undefined;
+      editor.container.classList.add('ht_clone_master');
+      editor._opened = true;
+      editor.refreshDimensions();
+      editor.hot.getShortcutManager().setActiveContextName('editor');
+      registerShortcuts(editor);
+      if (afterOpen) {
+        afterOpen(editor, event);
+      }
+    },
+    /**
+     * Focus on the correct UI element within your editor.
+     *
+     * @param {BaseEditor} editor The editor instance.
+     * @returns {void}
+     */
+    focus(editor) {
+      if (typeof onFocus === 'function') {
+        onFocus(editor);
+      } else {
+        var _editor$container$que;
+        // eslint-disable-next-line max-len
+        (_editor$container$que = editor.container.querySelector('button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])')) === null || _editor$container$que === void 0 || _editor$container$que.focus();
+      }
+    },
+    /**
+     * Close the editor UI and cleanup active shortcuts.
+     *
+     * @param {BaseEditor} editor The editor instance.
+     * @returns {void}
+     */
+    close(editor) {
+      editor._opened = false;
+      editor.container.style.display = 'none';
+      editor.container.classList.remove('ht_clone_master');
+      const shortcutManager = editor.hot.getShortcutManager();
+      const editorContext = shortcutManager.getContext('editor');
+      editorContext.removeShortcutsByGroup(shortcutsGroup);
+      if (typeof afterClose === 'function') {
+        afterClose(editor);
+      }
+    },
+    /**
+     * Prepare the editor to start editing a new value. Invokes beforeOpen or falls back.
+     *
+     * @param {BaseEditor} editor The editor instance.
+     * @param {number} row The row index.
+     * @param {number} col The column index.
+     * @param {number|string} prop The property name or index.
+     * @param {HTMLTableCellElement} td The table cell element.
+     * @param {any} originalValue The original value.
+     * @param {object} cellProperties The cell properties.
+     * @returns {void}
+     */
+    prepare(editor, row, col, prop, td, originalValue, cellProperties) {
+      if (typeof beforeOpen === 'function') {
+        beforeOpen(editor, {
+          row,
+          col,
+          prop,
+          td,
+          originalValue,
+          cellProperties
+        });
+      } else {
+        editor.setValue(originalValue);
+      }
+    }
+  });
+};

package/editors/handsontableEditor/handsontableEditor.js

@@ -1,7 +1,6 @@
 "use strict";
 
 exports.__esModule = true;
-require("core-js/modules/es.error.cause.js");
 var _textEditor = require("../textEditor");
 var _element = require("../../helpers/dom/element");
 var _event = require("../../helpers/dom/event");

package/editors/handsontableEditor/handsontableEditor.mjs

@@ -1,4 +1,3 @@
-import "core-js/modules/es.error.cause.js";
 function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
 function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
 function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }

package/editors/index.d.ts

@@ -4,6 +4,8 @@ import { CheckboxEditor, EDITOR_TYPE as CHECKBOX_EDITOR } from './checkboxEditor
 import { DateEditor, EDITOR_TYPE as DATE_EDITOR } from './dateEditor';
 import { DropdownEditor, EDITOR_TYPE as DROPDOWN_EDITOR } from './dropdownEditor';
 import { HandsontableEditor, EDITOR_TYPE as HANDSONTABLE_EDITOR } from './handsontableEditor';
+import { IntlDateEditor, EDITOR_TYPE as INTL_DATE_EDITOR } from './intlDateEditor';
+import { IntlTimeEditor, EDITOR_TYPE as INTL_TIME_EDITOR } from './intlTimeEditor';
 import { NumericEditor, EDITOR_TYPE as NUMERIC_EDITOR } from './numericEditor';
 import { PasswordEditor, EDITOR_TYPE as PASSWORD_EDITOR } from './passwordEditor';
 import { SelectEditor, EDITOR_TYPE as SELECT_EDITOR } from './selectEditor';
@@ -19,6 +21,8 @@ export interface Editors {
   date: typeof DateEditor;
   dropdown: typeof DropdownEditor;
   handsontable: typeof HandsontableEditor;
+  intlDate: typeof IntlDateEditor;
+  intlTime: typeof IntlTimeEditor;
   numeric: typeof NumericEditor;
   password: typeof PasswordEditor;
   select: typeof SelectEditor;
@@ -38,6 +42,8 @@ export {
   DateEditor, DATE_EDITOR,
   DropdownEditor, DROPDOWN_EDITOR,
   HandsontableEditor, HANDSONTABLE_EDITOR,
+  IntlDateEditor, INTL_DATE_EDITOR,
+  IntlTimeEditor, INTL_TIME_EDITOR,
   NumericEditor, NUMERIC_EDITOR,
   PasswordEditor, PASSWORD_EDITOR,
   SelectEditor, SELECT_EDITOR,
@@ -54,3 +60,4 @@ export {
   hasEditor,
   registerEditor
 } from './registry';
+export { editorFactory } from './factory';

package/editors/index.js

@@ -20,6 +20,12 @@ exports.DROPDOWN_EDITOR = _dropdownEditor.EDITOR_TYPE;
 var _handsontableEditor = require("./handsontableEditor");
 exports.HandsontableEditor = _handsontableEditor.HandsontableEditor;
 exports.HANDSONTABLE_EDITOR = _handsontableEditor.EDITOR_TYPE;
+var _intlDateEditor = require("./intlDateEditor");
+exports.IntlDateEditor = _intlDateEditor.IntlDateEditor;
+exports.INTL_DATE_EDITOR = _intlDateEditor.EDITOR_TYPE;
+var _intlTimeEditor = require("./intlTimeEditor");
+exports.IntlTimeEditor = _intlTimeEditor.IntlTimeEditor;
+exports.INTL_TIME_EDITOR = _intlTimeEditor.EDITOR_TYPE;
 var _numericEditor = require("./numericEditor");
 exports.NumericEditor = _numericEditor.NumericEditor;
 exports.NUMERIC_EDITOR = _numericEditor.EDITOR_TYPE;
@@ -35,6 +41,9 @@ exports.TEXT_EDITOR = _textEditor.EDITOR_TYPE;
 var _timeEditor = require("./timeEditor");
 exports.TimeEditor = _timeEditor.TimeEditor;
 exports.TIME_EDITOR = _timeEditor.EDITOR_TYPE;
+var _multiSelectEditor = require("./multiSelectEditor");
+exports.MultiSelectEditor = _multiSelectEditor.MultiSelectEditor;
+exports.MULTI_SELECT_EDITOR = _multiSelectEditor.EDITOR_TYPE;
 var _registry = require("./registry");
 exports.registerEditor = _registry.registerEditor;
 exports.RegisteredEditor = _registry.RegisteredEditor;
@@ -44,6 +53,8 @@ exports.getEditorInstance = _registry.getEditorInstance;
 exports.getRegisteredEditorNames = _registry.getRegisteredEditorNames;
 exports.getRegisteredEditors = _registry.getRegisteredEditors;
 exports.hasEditor = _registry.hasEditor;
+var _factory = require("./factory");
+exports.editorFactory = _factory.editorFactory;
 /**
  * Registers all available editors.
  */
@@ -54,9 +65,12 @@ function registerAllEditors() {
   (0, _registry.registerEditor)(_dateEditor.DateEditor);
   (0, _registry.registerEditor)(_dropdownEditor.DropdownEditor);
   (0, _registry.registerEditor)(_handsontableEditor.HandsontableEditor);
+  (0, _registry.registerEditor)(_intlDateEditor.IntlDateEditor);
+  (0, _registry.registerEditor)(_intlTimeEditor.IntlTimeEditor);
   (0, _registry.registerEditor)(_numericEditor.NumericEditor);
   (0, _registry.registerEditor)(_passwordEditor.PasswordEditor);
   (0, _registry.registerEditor)(_selectEditor.SelectEditor);
   (0, _registry.registerEditor)(_textEditor.TextEditor);
   (0, _registry.registerEditor)(_timeEditor.TimeEditor);
+  (0, _registry.registerEditor)(_multiSelectEditor.MultiSelectEditor);
 }

package/editors/index.mjs

@@ -4,11 +4,14 @@ import { CheckboxEditor, EDITOR_TYPE as CHECKBOX_EDITOR } from "./checkboxEditor
 import { DateEditor, EDITOR_TYPE as DATE_EDITOR } from "./dateEditor/index.mjs";
 import { DropdownEditor, EDITOR_TYPE as DROPDOWN_EDITOR } from "./dropdownEditor/index.mjs";
 import { HandsontableEditor, EDITOR_TYPE as HANDSONTABLE_EDITOR } from "./handsontableEditor/index.mjs";
+import { IntlDateEditor, EDITOR_TYPE as INTL_DATE_EDITOR } from "./intlDateEditor/index.mjs";
+import { IntlTimeEditor, EDITOR_TYPE as INTL_TIME_EDITOR } from "./intlTimeEditor/index.mjs";
 import { NumericEditor, EDITOR_TYPE as NUMERIC_EDITOR } from "./numericEditor/index.mjs";
 import { PasswordEditor, EDITOR_TYPE as PASSWORD_EDITOR } from "./passwordEditor/index.mjs";
 import { SelectEditor, EDITOR_TYPE as SELECT_EDITOR } from "./selectEditor/index.mjs";
 import { TextEditor, EDITOR_TYPE as TEXT_EDITOR } from "./textEditor/index.mjs";
 import { TimeEditor, EDITOR_TYPE as TIME_EDITOR } from "./timeEditor/index.mjs";
+import { MultiSelectEditor, EDITOR_TYPE as MULTI_SELECT_EDITOR } from "./multiSelectEditor/index.mjs";
 import { registerEditor } from "./registry.mjs";
 /**
  * Registers all available editors.
@@ -20,11 +23,15 @@ export function registerAllEditors() {
   registerEditor(DateEditor);
   registerEditor(DropdownEditor);
   registerEditor(HandsontableEditor);
+  registerEditor(IntlDateEditor);
+  registerEditor(IntlTimeEditor);
   registerEditor(NumericEditor);
   registerEditor(PasswordEditor);
   registerEditor(SelectEditor);
   registerEditor(TextEditor);
   registerEditor(TimeEditor);
+  registerEditor(MultiSelectEditor);
 }
-export { AutocompleteEditor, AUTOCOMPLETE_EDITOR, BaseEditor, BASE_EDITOR, CheckboxEditor, CHECKBOX_EDITOR, DateEditor, DATE_EDITOR, DropdownEditor, DROPDOWN_EDITOR, HandsontableEditor, HANDSONTABLE_EDITOR, NumericEditor, NUMERIC_EDITOR, PasswordEditor, PASSWORD_EDITOR, SelectEditor, SELECT_EDITOR, TextEditor, TEXT_EDITOR, TimeEditor, TIME_EDITOR };
-export { RegisteredEditor, _getEditorInstance, getEditor, getEditorInstance, getRegisteredEditorNames, getRegisteredEditors, hasEditor, registerEditor } from "./registry.mjs";
+export { AutocompleteEditor, AUTOCOMPLETE_EDITOR, BaseEditor, BASE_EDITOR, CheckboxEditor, CHECKBOX_EDITOR, DateEditor, DATE_EDITOR, DropdownEditor, DROPDOWN_EDITOR, HandsontableEditor, HANDSONTABLE_EDITOR, IntlDateEditor, INTL_DATE_EDITOR, IntlTimeEditor, INTL_TIME_EDITOR, NumericEditor, NUMERIC_EDITOR, PasswordEditor, PASSWORD_EDITOR, SelectEditor, SELECT_EDITOR, TextEditor, TEXT_EDITOR, TimeEditor, TIME_EDITOR, MultiSelectEditor, MULTI_SELECT_EDITOR };
+export { RegisteredEditor, _getEditorInstance, getEditor, getEditorInstance, getRegisteredEditorNames, getRegisteredEditors, hasEditor, registerEditor } from "./registry.mjs";
+export { editorFactory } from "./factory.mjs";

package/editors/intlDateEditor/index.d.ts

@@ -0,0 +1 @@
+export { EDITOR_TYPE, IntlDateEditor } from './intlDateEditor';

package/editors/intlDateEditor/index.js

@@ -0,0 +1,6 @@
+"use strict";
+
+exports.__esModule = true;
+var _intlDateEditor = require("./intlDateEditor");
+exports.EDITOR_TYPE = _intlDateEditor.EDITOR_TYPE;
+exports.IntlDateEditor = _intlDateEditor.IntlDateEditor;

package/editors/intlDateEditor/index.mjs

@@ -0,0 +1 @@
+export { EDITOR_TYPE, IntlDateEditor } from "./intlDateEditor.mjs";

package/editors/intlDateEditor/intlDateEditor.d.ts

@@ -0,0 +1,7 @@
+import Core from '../../core';
+import { TextEditor } from '../textEditor';
+
+export const EDITOR_TYPE: 'intl-date';
+export class IntlDateEditor extends TextEditor {
+  constructor(instance: Core);
+}

package/editors/intlDateEditor/intlDateEditor.js

@@ -0,0 +1,76 @@
+"use strict";
+
+exports.__esModule = true;
+var _textEditor = require("../textEditor");
+var _dateTime = require("../../helpers/dateTime");
+var _console = require("../../helpers/console");
+var _templateLiteralTag = require("../../helpers/templateLiteralTag");
+var _mixed = require("../../helpers/mixed");
+const EDITOR_TYPE = exports.EDITOR_TYPE = 'intl-date';
+
+/**
+ * @private
+ * @class IntlDateEditor
+ */
+class IntlDateEditor extends _textEditor.TextEditor {
+  static get EDITOR_TYPE() {
+    return EDITOR_TYPE;
+  }
+  init() {
+    super.init();
+    this.hot.addHook('afterSetTheme', (themeName, firstRun) => {
+      if (!firstRun) {
+        this.close();
+      }
+    });
+  }
+
+  /**
+   * Create data picker instance.
+   */
+  createElements() {
+    super.createElements('input');
+    this.TEXTAREA.setAttribute('type', 'date');
+  }
+
+  /**
+   * Set the value of the editor.
+   *
+   * @param {*} value The value to set.
+   */
+  setValue(value) {
+    if ((0, _mixed.isEmpty)(value)) {
+      value = this.cellProperties.defaultDate;
+    }
+    if (!(0, _dateTime.isValidISODate)(value)) {
+      (0, _console.warn)((0, _templateLiteralTag.toSingleLine)`IntlDateEditor: value must be in ISO date format ("YYYY-MM-DD")\x20
+        required by the native date input. Received:`, value);
+      return;
+    }
+    super.setValue(value);
+  }
+
+  /**
+   * Sets focus state on the select element.
+   */
+  focus() {
+    // For IME editor textarea element must be focused using ".select" method.
+    // Using ".focus" browser automatically scroll into the focused element which
+    // is undesired effect.
+    this.TEXTAREA.select();
+  }
+
+  /**
+   * Open editor.
+   */
+  open() {
+    super.open();
+
+    // Prevents "Failed to execute 'showPicker' on 'HTMLInputElement': HTMLInputElement::showPicker() requires a user gesture." errors
+    // when running tests or calling the method directly out of the event-loop cycle.
+    try {
+      this.TEXTAREA.showPicker();
+    } catch {} // eslint-disable-line no-empty
+  }
+}
+exports.IntlDateEditor = IntlDateEditor;