handsontable 18.0.0 → 18.1.0-rc7

package/editors/baseEditor/baseEditor.d.ts

@@ -8,7 +8,17 @@ export declare const EDITOR_STATE: Readonly<{
     FINISHED: "STATE_FINISHED";
 }>;
 /**
+ * The abstract base class for Handsontable cell editors.
+ *
+ * Extend it to create an editor that controls how a cell enters edit mode, reads and writes values,
+ * and returns focus to the grid. Concrete editors implement `init()`, `getValue()`, `setValue()`,
+ * `open()`, `close()`, and `focus()`.
+ *
  * @class BaseEditor
+ * @see https://handsontable.com/docs/javascript-data-grid/cell-editor/
+ * @see https://handsontable.com/docs/javascript-data-grid/cell-function/
+ * @see https://handsontable.com/docs/javascript-data-grid/api/options/#editor
+ * @see https://handsontable.com/docs/react-data-grid/api/hooks/#afterbeginediting
  */
 export declare class BaseEditor {
     #private;
@@ -47,6 +57,8 @@ export declare class BaseEditor {
     /**
      * Callback to call after closing editor.
      *
+     * @private
+     *
      * @type {Function}
      */
     _closeCallback: ((result: boolean) => void) | null;
@@ -57,7 +69,7 @@ export declare class BaseEditor {
      */
     _closeAfterDataChange: boolean;
     /**
-     * Currently rendered cell's TD element.
+     * Currently rendered cell's `TD` element.
      *
      * @type {HTMLTableCellElement}
      */
@@ -243,13 +255,13 @@ export declare class BaseEditor {
         maxHeight: number;
     } | undefined;
     /**
-     * Gets className of the edited cell if exist.
+     * Gets the `className` of the edited cell, if it exists.
      *
      * @returns {string}
      */
     getEditedCellsLayerClass(): string;
     /**
-     * Gets HTMLTableCellElement of the edited cell if exist.
+     * Gets the `HTMLTableCellElement` of the edited cell, if it exists.
      *
      * @returns {HTMLTableCellElement|null}
      */

package/editors/baseEditor/baseEditor.js

@@ -439,7 +439,7 @@ class BaseEditor {
         };
     }
     /**
-   * Gets className of the edited cell if exist.
+   * Gets the `className` of the edited cell, if it exists.
    *
    * @returns {string}
    */ getEditedCellsLayerClass() {
@@ -460,7 +460,7 @@ class BaseEditor {
         }
     }
     /**
-   * Gets HTMLTableCellElement of the edited cell if exist.
+   * Gets the `HTMLTableCellElement` of the edited cell, if it exists.
    *
    * @returns {HTMLTableCellElement|null}
    */ getEditedCell() {
@@ -525,6 +525,8 @@ class BaseEditor {
         /**
    * Callback to call after closing editor.
    *
+   * @private
+   *
    * @type {Function}
    */ this._closeCallback = null;
         /**
@@ -533,7 +535,7 @@ class BaseEditor {
    * @type {boolean}
    */ this._closeAfterDataChange = true;
         /**
-   * Currently rendered cell's TD element.
+   * Currently rendered cell's `TD` element.
    *
    * @type {HTMLTableCellElement}
    */ this.TD = null;

package/editors/baseEditor/baseEditor.mjs

@@ -48,7 +48,17 @@ var /**
    * @returns {number}
    */ _calcCellStartOffset = /*#__PURE__*/ new WeakSet();
 /**
+ * The abstract base class for Handsontable cell editors.
+ *
+ * Extend it to create an editor that controls how a cell enters edit mode, reads and writes values,
+ * and returns focus to the grid. Concrete editors implement `init()`, `getValue()`, `setValue()`,
+ * `open()`, `close()`, and `focus()`.
+ *
  * @class BaseEditor
+ * @see https://handsontable.com/docs/javascript-data-grid/cell-editor/
+ * @see https://handsontable.com/docs/javascript-data-grid/cell-function/
+ * @see https://handsontable.com/docs/javascript-data-grid/api/options/#editor
+ * @see https://handsontable.com/docs/react-data-grid/api/hooks/#afterbeginediting
  */ export class BaseEditor {
     /**
    * Returns the unique editor type identifier for the base editor.
@@ -415,7 +425,7 @@ var /**
         };
     }
     /**
-   * Gets className of the edited cell if exist.
+   * Gets the `className` of the edited cell, if it exists.
    *
    * @returns {string}
    */ getEditedCellsLayerClass() {
@@ -436,7 +446,7 @@ var /**
         }
     }
     /**
-   * Gets HTMLTableCellElement of the edited cell if exist.
+   * Gets the `HTMLTableCellElement` of the edited cell, if it exists.
    *
    * @returns {HTMLTableCellElement|null}
    */ getEditedCell() {
@@ -501,6 +511,8 @@ var /**
         /**
    * Callback to call after closing editor.
    *
+   * @private
+   *
    * @type {Function}
    */ this._closeCallback = null;
         /**
@@ -509,7 +521,7 @@ var /**
    * @type {boolean}
    */ this._closeAfterDataChange = true;
         /**
-   * Currently rendered cell's TD element.
+   * Currently rendered cell's `TD` element.
    *
    * @type {HTMLTableCellElement}
    */ this.TD = null;

package/editors/factory.js

@@ -16,6 +16,9 @@ function _interop_require_default(obj) {
         default: obj
     };
 }
+/**
+ * The shortcuts group used when the editor does not define its own `shortcutsGroup`.
+ */ const DEFAULT_SHORTCUTS_GROUP = 'customEditor';
 const editorBaseFactory = (params)=>{
     const CustomBaseEditor = _baseEditor.BaseEditor.prototype.extend();
     const skipSuperApply = [
@@ -52,7 +55,7 @@ const editorFactory = ({ init, afterOpen, afterInit, afterClose, beforeOpen, get
         const shortcutManager = editor.hot.getShortcutManager();
         const editorContext = shortcutManager.getContext('editor');
         const contextConfig = {
-            group: shortcutsGroup
+            group: shortcutsGroup ?? DEFAULT_SHORTCUTS_GROUP
         };
         if (shortcuts) {
             editorContext.addShortcuts(shortcuts.map((shortcut)=>({
@@ -164,7 +167,7 @@ const editorFactory = ({ init, afterOpen, afterInit, afterClose, beforeOpen, get
             editor.container.classList.remove('ht_clone_master');
             const shortcutManager = editor.hot.getShortcutManager();
             const editorContext = shortcutManager.getContext('editor');
-            editorContext.removeShortcutsByGroup(shortcutsGroup ?? '');
+            editorContext.removeShortcutsByGroup(shortcutsGroup ?? DEFAULT_SHORTCUTS_GROUP);
             if (typeof afterClose === 'function') {
                 afterClose(editor);
             }

package/editors/factory.mjs

@@ -1,6 +1,9 @@
 import { BaseEditor } from './baseEditor/baseEditor.mjs';
 import EventManager from '../eventManager.mjs';
 import { throwWithCause } from '../helpers/errors.mjs';
+/**
+ * The shortcuts group used when the editor does not define its own `shortcutsGroup`.
+ */ const DEFAULT_SHORTCUTS_GROUP = 'customEditor';
 const editorBaseFactory = (params)=>{
     const CustomBaseEditor = BaseEditor.prototype.extend();
     const skipSuperApply = [
@@ -39,7 +42,7 @@ const editorBaseFactory = (params)=>{
         const shortcutManager = editor.hot.getShortcutManager();
         const editorContext = shortcutManager.getContext('editor');
         const contextConfig = {
-            group: shortcutsGroup
+            group: shortcutsGroup ?? DEFAULT_SHORTCUTS_GROUP
         };
         if (shortcuts) {
             editorContext.addShortcuts(shortcuts.map((shortcut)=>({
@@ -151,7 +154,7 @@ const editorBaseFactory = (params)=>{
             editor.container.classList.remove('ht_clone_master');
             const shortcutManager = editor.hot.getShortcutManager();
             const editorContext = shortcutManager.getContext('editor');
-            editorContext.removeShortcutsByGroup(shortcutsGroup ?? '');
+            editorContext.removeShortcutsByGroup(shortcutsGroup ?? DEFAULT_SHORTCUTS_GROUP);
             if (typeof afterClose === 'function') {
                 afterClose(editor);
             }

package/editors/index.d.ts

@@ -5,6 +5,7 @@ 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 { IntlDatetimeEditor, EDITOR_TYPE as INTL_DATETIME_EDITOR } from './intlDatetimeEditor';
 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';
@@ -17,10 +18,10 @@ export { EDITOR_TYPE as MULTI_SELECT_EDITOR } from './multiSelectEditor';
  * Registers all available editors.
  */
 export declare function registerAllEditors(): void;
-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, };
+export { AutocompleteEditor, AUTOCOMPLETE_EDITOR, BaseEditor, BASE_EDITOR, CheckboxEditor, CHECKBOX_EDITOR, DateEditor, DATE_EDITOR, DropdownEditor, DROPDOWN_EDITOR, HandsontableEditor, HANDSONTABLE_EDITOR, IntlDateEditor, INTL_DATE_EDITOR, IntlDatetimeEditor, INTL_DATETIME_EDITOR, IntlTimeEditor, INTL_TIME_EDITOR, NumericEditor, NUMERIC_EDITOR, PasswordEditor, PASSWORD_EDITOR, SelectEditor, SELECT_EDITOR, TextEditor, TEXT_EDITOR, TimeEditor, TIME_EDITOR, MultiSelectEditor, };
 export { RegisteredEditor, _getEditorInstance, getEditor, getEditorInstance, getRegisteredEditorNames, getRegisteredEditors, hasEditor, registerEditor, } from './registry';
 export { editorFactory } from './factory';
 /**
  * All built-in editor type names.
  */
-export type EditorType = typeof AUTOCOMPLETE_EDITOR | typeof BASE_EDITOR | typeof CHECKBOX_EDITOR | typeof DATE_EDITOR | typeof DROPDOWN_EDITOR | typeof HANDSONTABLE_EDITOR | typeof INTL_DATE_EDITOR | typeof INTL_TIME_EDITOR | typeof NUMERIC_EDITOR | typeof PASSWORD_EDITOR | typeof SELECT_EDITOR | typeof TEXT_EDITOR | typeof TIME_EDITOR | string;
+export type EditorType = typeof AUTOCOMPLETE_EDITOR | typeof BASE_EDITOR | typeof CHECKBOX_EDITOR | typeof DATE_EDITOR | typeof DROPDOWN_EDITOR | typeof HANDSONTABLE_EDITOR | typeof INTL_DATE_EDITOR | typeof INTL_DATETIME_EDITOR | typeof INTL_TIME_EDITOR | typeof NUMERIC_EDITOR | typeof PASSWORD_EDITOR | typeof SELECT_EDITOR | typeof TEXT_EDITOR | typeof TIME_EDITOR | string;

package/editors/index.js

@@ -45,6 +45,9 @@ _export(exports, {
     get HandsontableEditor () {
         return _handsontableEditor.HandsontableEditor;
     },
+    get INTL_DATETIME_EDITOR () {
+        return _intlDatetimeEditor.EDITOR_TYPE;
+    },
     get INTL_DATE_EDITOR () {
         return _intlDateEditor.EDITOR_TYPE;
     },
@@ -54,6 +57,9 @@ _export(exports, {
     get IntlDateEditor () {
         return _intlDateEditor.IntlDateEditor;
     },
+    get IntlDatetimeEditor () {
+        return _intlDatetimeEditor.IntlDatetimeEditor;
+    },
     get IntlTimeEditor () {
         return _intlTimeEditor.IntlTimeEditor;
     },
@@ -131,6 +137,7 @@ const _dateEditor = require("./dateEditor");
 const _dropdownEditor = require("./dropdownEditor");
 const _handsontableEditor = require("./handsontableEditor");
 const _intlDateEditor = require("./intlDateEditor");
+const _intlDatetimeEditor = require("./intlDatetimeEditor");
 const _intlTimeEditor = require("./intlTimeEditor");
 const _numericEditor = require("./numericEditor");
 const _passwordEditor = require("./passwordEditor");
@@ -148,6 +155,7 @@ function registerAllEditors() {
     (0, _registry.registerEditor)(_dropdownEditor.DropdownEditor);
     (0, _registry.registerEditor)(_handsontableEditor.HandsontableEditor);
     (0, _registry.registerEditor)(_intlDateEditor.IntlDateEditor);
+    (0, _registry.registerEditor)(_intlDatetimeEditor.IntlDatetimeEditor);
     (0, _registry.registerEditor)(_intlTimeEditor.IntlTimeEditor);
     (0, _registry.registerEditor)(_numericEditor.NumericEditor);
     (0, _registry.registerEditor)(_passwordEditor.PasswordEditor);

package/editors/index.mjs

@@ -5,6 +5,7 @@ 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 { IntlDatetimeEditor, EDITOR_TYPE as INTL_DATETIME_EDITOR } from './intlDatetimeEditor/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';
@@ -24,6 +25,7 @@ import { registerEditor } from './registry.mjs';
     registerEditor(DropdownEditor);
     registerEditor(HandsontableEditor);
     registerEditor(IntlDateEditor);
+    registerEditor(IntlDatetimeEditor);
     registerEditor(IntlTimeEditor);
     registerEditor(NumericEditor);
     registerEditor(PasswordEditor);
@@ -32,6 +34,6 @@ import { registerEditor } from './registry.mjs';
     registerEditor(TimeEditor);
     registerEditor(MultiSelectEditor);
 }
-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 };
+export { AutocompleteEditor, AUTOCOMPLETE_EDITOR, BaseEditor, BASE_EDITOR, CheckboxEditor, CHECKBOX_EDITOR, DateEditor, DATE_EDITOR, DropdownEditor, DROPDOWN_EDITOR, HandsontableEditor, HANDSONTABLE_EDITOR, IntlDateEditor, INTL_DATE_EDITOR, IntlDatetimeEditor, INTL_DATETIME_EDITOR, IntlTimeEditor, INTL_TIME_EDITOR, NumericEditor, NUMERIC_EDITOR, PasswordEditor, PASSWORD_EDITOR, SelectEditor, SELECT_EDITOR, TextEditor, TEXT_EDITOR, TimeEditor, TIME_EDITOR, MultiSelectEditor };
 export { RegisteredEditor, _getEditorInstance, getEditor, getEditorInstance, getRegisteredEditorNames, getRegisteredEditors, hasEditor, registerEditor } from './registry.mjs';
 export { editorFactory } from './factory.mjs';

package/editors/intlDatetimeEditor/index.d.mts

@@ -0,0 +1 @@
+export * from './index.js';

package/editors/intlDatetimeEditor/index.d.ts

@@ -0,0 +1 @@
+export { EDITOR_TYPE, IntlDatetimeEditor, } from './intlDatetimeEditor';

package/editors/intlDatetimeEditor/index.js

@@ -0,0 +1,19 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: Object.getOwnPropertyDescriptor(all, name).get
+    });
+}
+_export(exports, {
+    get EDITOR_TYPE () {
+        return _intlDatetimeEditor.EDITOR_TYPE;
+    },
+    get IntlDatetimeEditor () {
+        return _intlDatetimeEditor.IntlDatetimeEditor;
+    }
+});
+const _intlDatetimeEditor = require("./intlDatetimeEditor");

package/editors/intlDatetimeEditor/index.mjs

@@ -0,0 +1 @@
+export { EDITOR_TYPE, IntlDatetimeEditor } from './intlDatetimeEditor.mjs';

package/editors/intlDatetimeEditor/intlDatetimeEditor.d.mts

@@ -0,0 +1 @@
+export * from './intlDatetimeEditor.js';

package/editors/intlDatetimeEditor/intlDatetimeEditor.d.ts

@@ -0,0 +1,42 @@
+import type { CellProperties } from '../../settings';
+import { TextEditor } from '../textEditor';
+export declare const EDITOR_TYPE = "intl-datetime";
+/**
+ * @private
+ * @class IntlDatetimeEditor
+ */
+export declare class IntlDatetimeEditor extends TextEditor {
+    /**
+     * Returns the unique editor type identifier for the intl-datetime editor.
+     */
+    static get EDITOR_TYPE(): string;
+    /**
+     * Initializes the editor and registers an afterSetTheme hook to close on theme changes.
+     */
+    init(): void;
+    /**
+     * Prepares the editor, replacing the display value with the raw ISO source data for the native input.
+     */
+    prepare(row: number, col: number, prop: string | number, td: HTMLTableCellElement, value: unknown, cellProperties: CellProperties): void;
+    /**
+     * Creates the editor's element as a native datetime-local input that shows seconds.
+     */
+    createElements(type?: string): void;
+    /**
+     * Sets the editor value, normalizing to the `YYYY-MM-DDTHH:mm:ss` form the native input expects,
+     * and warns if the value is not a valid ISO date-time string.
+     */
+    setValue(value?: unknown): void;
+    /**
+     * Returns the editor value, canonicalizing to `YYYY-MM-DDTHH:mm:ss` (native input may omit seconds).
+     */
+    getValue(): string;
+    /**
+     * Selects all text in the input element when the editor receives focus.
+     */
+    focus(): void;
+    /**
+     * Opens the editor and programmatically invokes the native picker via showPicker().
+     */
+    open(): void;
+}

package/editors/intlDatetimeEditor/intlDatetimeEditor.js

@@ -0,0 +1,108 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: Object.getOwnPropertyDescriptor(all, name).get
+    });
+}
+_export(exports, {
+    get EDITOR_TYPE () {
+        return EDITOR_TYPE;
+    },
+    get IntlDatetimeEditor () {
+        return IntlDatetimeEditor;
+    }
+});
+const _textEditor = require("../textEditor");
+const _dateTime = require("../../helpers/dateTime");
+const _console = require("../../helpers/console");
+const _templateLiteralTag = require("../../helpers/templateLiteralTag");
+const _mixed = require("../../helpers/mixed");
+const EDITOR_TYPE = 'intl-datetime';
+const DATE_ONLY_RE = /^\d{4}-\d{2}-\d{2}$/;
+const NO_SECONDS_RE = /^\d{4}-\d{2}-\d{2}T\d{2}:\d{2}$/;
+class IntlDatetimeEditor extends _textEditor.TextEditor {
+    /**
+   * Returns the unique editor type identifier for the intl-datetime editor.
+   */ static get EDITOR_TYPE() {
+        return EDITOR_TYPE;
+    }
+    /**
+   * Initializes the editor and registers an afterSetTheme hook to close on theme changes.
+   */ init() {
+        super.init();
+        this.hot.addHook('afterSetTheme', (themeName, firstRun)=>{
+            if (!firstRun) {
+                this.close();
+            }
+        });
+    }
+    /**
+   * Prepares the editor, replacing the display value with the raw ISO source data for the native input.
+   */ prepare(row, col, prop, td, value, cellProperties) {
+        super.prepare(row, col, prop, td, value, cellProperties);
+        // The value passed to prepare() is the formatted display value. Replace originalValue with the
+        // raw source data so the native datetime-local input receives an ISO string.
+        const physicalRow = this.hot.toPhysicalRow(row);
+        this.originalValue = this.hot.getSourceDataAtCell(physicalRow, col);
+    }
+    /**
+   * Creates the editor's element as a native datetime-local input that shows seconds.
+   */ createElements(type) {
+        super.createElements('input');
+        this.TEXTAREA.setAttribute('type', 'datetime-local');
+        this.TEXTAREA.setAttribute('step', '1');
+        this.TEXTAREA.setAttribute('dir', 'ltr');
+    }
+    /**
+   * Sets the editor value, normalizing to the `YYYY-MM-DDTHH:mm:ss` form the native input expects,
+   * and warns if the value is not a valid ISO date-time string.
+   */ setValue(value) {
+        if ((0, _mixed.isEmpty)(value)) {
+            super.setValue('');
+            return;
+        }
+        if (!(0, _dateTime.isValidISODateTime)(value)) {
+            (0, _console.warn)((0, _templateLiteralTag.toSingleLine)`IntlDatetimeEditor: value must be in ISO date-time format ("YYYY-MM-DDTHH:mm:ss")\x20
+        required by the native datetime-local input. Received:`, value);
+            super.setValue('');
+            return;
+        }
+        // The native datetime-local input (even with step="1") cannot represent milliseconds, so drop the
+        // fractional-second part here rather than letting the browser silently truncate an unparsed value.
+        let normalized = String(value).replace(' ', 'T').replace(/\.\d+$/, '');
+        if (DATE_ONLY_RE.test(normalized)) {
+            normalized += 'T00:00:00';
+        } else if (NO_SECONDS_RE.test(normalized)) {
+            normalized += ':00';
+        }
+        super.setValue(normalized);
+    }
+    /**
+   * Returns the editor value, canonicalizing to `YYYY-MM-DDTHH:mm:ss` (native input may omit seconds).
+   */ getValue() {
+        const value = super.getValue();
+        if (value && NO_SECONDS_RE.test(value)) {
+            return `${value}:00`;
+        }
+        return value;
+    }
+    /**
+   * Selects all text in the input element when the editor receives focus.
+   */ focus() {
+        this.TEXTAREA.select();
+    }
+    /**
+   * Opens the editor and programmatically invokes the native picker via showPicker().
+   */ open() {
+        super.open();
+        try {
+            this.TEXTAREA.showPicker();
+        } catch  {
+        // Prevents showPicker() user-gesture errors in tests
+        }
+    }
+}

package/editors/intlDatetimeEditor/intlDatetimeEditor.mjs

@@ -0,0 +1,93 @@
+import { TextEditor } from '../textEditor/index.mjs';
+import { isValidISODateTime } from '../../helpers/dateTime.mjs';
+import { warn } from '../../helpers/console.mjs';
+import { toSingleLine } from '../../helpers/templateLiteralTag.mjs';
+import { isEmpty } from '../../helpers/mixed.mjs';
+export const EDITOR_TYPE = 'intl-datetime';
+const DATE_ONLY_RE = /^\d{4}-\d{2}-\d{2}$/;
+const NO_SECONDS_RE = /^\d{4}-\d{2}-\d{2}T\d{2}:\d{2}$/;
+/**
+ * @private
+ * @class IntlDatetimeEditor
+ */ export class IntlDatetimeEditor extends TextEditor {
+    /**
+   * Returns the unique editor type identifier for the intl-datetime editor.
+   */ static get EDITOR_TYPE() {
+        return EDITOR_TYPE;
+    }
+    /**
+   * Initializes the editor and registers an afterSetTheme hook to close on theme changes.
+   */ init() {
+        super.init();
+        this.hot.addHook('afterSetTheme', (themeName, firstRun)=>{
+            if (!firstRun) {
+                this.close();
+            }
+        });
+    }
+    /**
+   * Prepares the editor, replacing the display value with the raw ISO source data for the native input.
+   */ prepare(row, col, prop, td, value, cellProperties) {
+        super.prepare(row, col, prop, td, value, cellProperties);
+        // The value passed to prepare() is the formatted display value. Replace originalValue with the
+        // raw source data so the native datetime-local input receives an ISO string.
+        const physicalRow = this.hot.toPhysicalRow(row);
+        this.originalValue = this.hot.getSourceDataAtCell(physicalRow, col);
+    }
+    /**
+   * Creates the editor's element as a native datetime-local input that shows seconds.
+   */ createElements(type) {
+        super.createElements('input');
+        this.TEXTAREA.setAttribute('type', 'datetime-local');
+        this.TEXTAREA.setAttribute('step', '1');
+        this.TEXTAREA.setAttribute('dir', 'ltr');
+    }
+    /**
+   * Sets the editor value, normalizing to the `YYYY-MM-DDTHH:mm:ss` form the native input expects,
+   * and warns if the value is not a valid ISO date-time string.
+   */ setValue(value) {
+        if (isEmpty(value)) {
+            super.setValue('');
+            return;
+        }
+        if (!isValidISODateTime(value)) {
+            warn(toSingleLine`IntlDatetimeEditor: value must be in ISO date-time format ("YYYY-MM-DDTHH:mm:ss")\x20
+        required by the native datetime-local input. Received:`, value);
+            super.setValue('');
+            return;
+        }
+        // The native datetime-local input (even with step="1") cannot represent milliseconds, so drop the
+        // fractional-second part here rather than letting the browser silently truncate an unparsed value.
+        let normalized = String(value).replace(' ', 'T').replace(/\.\d+$/, '');
+        if (DATE_ONLY_RE.test(normalized)) {
+            normalized += 'T00:00:00';
+        } else if (NO_SECONDS_RE.test(normalized)) {
+            normalized += ':00';
+        }
+        super.setValue(normalized);
+    }
+    /**
+   * Returns the editor value, canonicalizing to `YYYY-MM-DDTHH:mm:ss` (native input may omit seconds).
+   */ getValue() {
+        const value = super.getValue();
+        if (value && NO_SECONDS_RE.test(value)) {
+            return `${value}:00`;
+        }
+        return value;
+    }
+    /**
+   * Selects all text in the input element when the editor receives focus.
+   */ focus() {
+        this.TEXTAREA.select();
+    }
+    /**
+   * Opens the editor and programmatically invokes the native picker via showPicker().
+   */ open() {
+        super.open();
+        try {
+            this.TEXTAREA.showPicker();
+        } catch  {
+        // Prevents showPicker() user-gesture errors in tests
+        }
+    }
+}

package/editors/multiSelectEditor/multiSelectEditor.js

@@ -22,6 +22,7 @@ const _dropdownController = require("./controllers/dropdownController");
 const _selectedItemsController = require("./controllers/selectedItemsController");
 const _element = require("../../helpers/dom/element");
 const _unicode = require("../../helpers/unicode");
+const _string = require("../../helpers/string");
 const _a11y = require("../../helpers/a11y");
 const _constants = require("../../shortcuts/contexts/constants");
 const _utils = require("./utils/utils");
@@ -118,8 +119,8 @@ var /**
    */ _syncSelectedValues = /*#__PURE__*/ new WeakSet(), /**
    * Reads a typed setting value from the cell properties by the given key.
    */ _getEditorSetting = /*#__PURE__*/ new WeakSet(), /**
-   * Handles the afterSetSourceDataAtCell hook to re-sync the dropdown when the renderer updates the source data for the edited cell.
-   */ _onAfterSetSourceDataAtCell = /*#__PURE__*/ new WeakSet();
+   * Handles the `afterChange` hook to re-sync the dropdown when the renderer removes a chip from the edited cell.
+   */ _onAfterChange = /*#__PURE__*/ new WeakSet();
 class MultiSelectEditor extends _baseEditor.BaseEditor {
     /**
    * Returns the unique editor type identifier for the multiselect editor.
@@ -186,7 +187,7 @@ class MultiSelectEditor extends _baseEditor.BaseEditor {
             }
         });
         this.addHook('afterDestroy', ()=>this.destroy());
-        this.addHook('afterSetSourceDataAtCell', (changes, source)=>_class_private_method_get(this, _onAfterSetSourceDataAtCell, onAfterSetSourceDataAtCell).call(this, changes, source));
+        this.addHook('afterChange', (changes, source)=>_class_private_method_get(this, _onAfterChange, onAfterChange).call(this, changes, source));
         this.addHook('afterScrollHorizontally', ()=>this.refreshDimensions());
         this.addHook('afterScrollVertically', ()=>this.refreshDimensions());
         this.dropdownController.getInputController().addLocalHook('triggerFilter', (value)=>_class_private_method_get(this, _filterEntries, filterEntries).call(this, value));
@@ -265,7 +266,7 @@ class MultiSelectEditor extends _baseEditor.BaseEditor {
     /**
    * Initializes the editor, creates DOM elements, and binds dropdown and hook events.
    */ constructor(hotInstance){
-        super(hotInstance), _class_private_method_init(this, _getSource), _class_private_method_init(this, _registerShortcuts), _class_private_method_init(this, _unregisterShortcuts), _class_private_method_init(this, _showEditableElement), _class_private_method_init(this, _hideEditableElement), _class_private_method_init(this, _blockNewSelections), _class_private_method_init(this, _unblockNewSelections), _class_private_method_init(this, _filterEntries), _class_private_method_init(this, _getAvailableSpace), _class_private_method_init(this, _saveCurrentSelection), _class_private_method_init(this, _addSelectedValue), _class_private_method_init(this, _removeSelectedValue), _class_private_method_init(this, _syncSelectedValues), _class_private_method_init(this, _getEditorSetting), _class_private_method_init(this, _onAfterSetSourceDataAtCell), _class_private_field_init(this, _selectedItems, {
+        super(hotInstance), _class_private_method_init(this, _getSource), _class_private_method_init(this, _registerShortcuts), _class_private_method_init(this, _unregisterShortcuts), _class_private_method_init(this, _showEditableElement), _class_private_method_init(this, _hideEditableElement), _class_private_method_init(this, _blockNewSelections), _class_private_method_init(this, _unblockNewSelections), _class_private_method_init(this, _filterEntries), _class_private_method_init(this, _getAvailableSpace), _class_private_method_init(this, _saveCurrentSelection), _class_private_method_init(this, _addSelectedValue), _class_private_method_init(this, _removeSelectedValue), _class_private_method_init(this, _syncSelectedValues), _class_private_method_init(this, _getEditorSetting), _class_private_method_init(this, _onAfterChange), _class_private_field_init(this, _selectedItems, {
             writable: true,
             value: void 0
         }), _class_private_field_init(this, _editorContainer, {
@@ -307,7 +308,7 @@ function registerShortcuts() {
                 ]
             ],
             callback: ()=>{
-                if (this.hot.rootDocument.activeElement === this.getInputElement()) {
+                if ((0, _element.getDeepActiveElement)(this.hot.rootDocument) === this.getInputElement()) {
                     this.dropdownController.focusFirstItem();
                 } else {
                     this.dropdownController.focusNextItem();
@@ -339,7 +340,7 @@ function registerShortcuts() {
             ],
             runOnlyIf: ()=>!_class_private_method_get(this, _getEditorSetting, getEditorSetting).call(this, 'enterCommits'),
             callback: (event)=>{
-                const activeElement = this.hot.rootDocument.activeElement;
+                const activeElement = (0, _element.getDeepActiveElement)(this.hot.rootDocument);
                 if (activeElement instanceof HTMLInputElement && activeElement.type === 'checkbox') {
                     activeElement.checked = !activeElement.checked;
                     activeElement.dispatchEvent(new Event('change'));
@@ -383,6 +384,7 @@ function unblockNewSelections() {
     this.dropdownController.enableCheckboxes();
 }
 function filterEntries(query, filterSelectedItems = _class_private_method_get(this, _getEditorSetting, getEditorSetting).call(this, 'filterSelectedItems') ?? true) {
+    const locale = this.cellProperties.locale;
     const filteredItems = _class_private_method_get(this, _getSource, getSource).call(this).filter((item)=>{
         const value = typeof item === 'object' && item !== null && 'value' in item ? item.value : item;
         if (!filterSelectedItems && _class_private_field_get(this, _selectedItems).has(item)) {
@@ -391,7 +393,7 @@ function filterEntries(query, filterSelectedItems = _class_private_method_get(th
         if (this.cellProperties.filteringCaseSensitive) {
             return String(value).includes(query);
         }
-        return String(value).toLowerCase().includes(query.toLowerCase());
+        return (0, _string.localeLowerCase)(String(value), locale).includes((0, _string.localeLowerCase)(query, locale));
     });
     this.dropdownController.fillDropdown(filteredItems, _class_private_field_get(this, _selectedItems).getItemsArray());
     this.dropdownController.updateDimensions(_class_private_method_get(this, _getAvailableSpace, getAvailableSpace).call(this), true);
@@ -454,8 +456,8 @@ function syncSelectedValues(valuesArray) {
 function getEditorSetting(settingKey) {
     return this.cellProperties[settingKey];
 }
-function onAfterSetSourceDataAtCell(changes, source) {
-    if (this.isOpened() && source === `${EDITOR_TYPE}-renderer` && parseInt(String(changes[0][0]), 10) === this.cellProperties.visualRow && parseInt(String(changes[0][1]), 10) === this.cellProperties.visualCol) {
+function onAfterChange(changes, source) {
+    if (this.isOpened() && source === `${EDITOR_TYPE}-renderer` && Array.isArray(changes) && changes.length > 0 && changes[0][0] === this.cellProperties.visualRow && this.hot.propToCol(changes[0][1]) === this.cellProperties.visualCol) {
         _class_private_method_get(this, _syncSelectedValues, syncSelectedValues).call(this, changes[0][3]);
         this.dropdownController.fillDropdown(_class_private_method_get(this, _getSource, getSource).call(this), _class_private_field_get(this, _selectedItems).getItemsArray());
         this.dropdownController.focusItem(0);