handsontable 13.1.0-next-e1a7d2c-20230831 → 14.0.0-next-d97b156-20231027

package/selection/highlight/highlight.mjs

@@ -1,7 +1,25 @@
+import "core-js/modules/es.error.cause.js";
+let _Symbol$iterator;
 import "core-js/modules/es.array.push.js";
-import { createHighlight } from "./types/index.mjs";
-import { ACTIVE_HEADER_TYPE, AREA_TYPE, CELL_TYPE, CUSTOM_SELECTION_TYPE, FILL_TYPE, HEADER_TYPE } from "./constants.mjs";
+function _classPrivateMethodInitSpec(obj, privateSet) { _checkPrivateRedeclaration(obj, privateSet); privateSet.add(obj); }
+function _checkPrivateRedeclaration(obj, privateCollection) { if (privateCollection.has(obj)) { throw new TypeError("Cannot initialize the same private elements twice on an object"); } }
+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); }
+function _classPrivateMethodGet(receiver, privateSet, fn) { if (!privateSet.has(receiver)) { throw new TypeError("attempted to get private field on non-instance"); } return fn; }
+import { createHighlight as createActiveHighlight } from "./types/activeHeader.mjs";
+import { createHighlight as createAreaLayeredHighlight } from "./types/areaLayered.mjs";
+import { createHighlight as createAreaHighlight } from "./types/area.mjs";
+import { createHighlight as createColumnHighlight } from "./types/column.mjs";
+import { createHighlight as createFocusHighlight } from "./types/focus.mjs";
+import { createHighlight as createCustomHighlight } from "./types/customSelection.mjs";
+import { createHighlight as createFillHighlight } from "./types/fill.mjs";
+import { createHighlight as createHeaderHighlight } from "./types/header.mjs";
+import { createHighlight as createRowHighlight } from "./types/row.mjs";
+import { HIGHLIGHT_ACTIVE_HEADER_TYPE, HIGHLIGHT_AREA_TYPE, HIGHLIGHT_FOCUS_TYPE, HIGHLIGHT_CUSTOM_SELECTION_TYPE, HIGHLIGHT_FILL_TYPE, HIGHLIGHT_HEADER_TYPE, HIGHLIGHT_ROW_TYPE, HIGHLIGHT_COLUMN_TYPE } from "../../3rdparty/walkontable/src/index.mjs";
 import { arrayEach } from "./../../helpers/array.mjs";
+export { HIGHLIGHT_ACTIVE_HEADER_TYPE as ACTIVE_HEADER_TYPE, HIGHLIGHT_AREA_TYPE as AREA_TYPE, HIGHLIGHT_FOCUS_TYPE as FOCUS_TYPE, HIGHLIGHT_CUSTOM_SELECTION_TYPE as CUSTOM_SELECTION_TYPE, HIGHLIGHT_FILL_TYPE as FILL_TYPE, HIGHLIGHT_HEADER_TYPE as HEADER_TYPE, HIGHLIGHT_ROW_TYPE as ROW_TYPE, HIGHLIGHT_COLUMN_TYPE as COLUMN_TYPE };
+
 /**
  * Highlight class responsible for managing Walkontable Selection classes.
  *
@@ -17,14 +35,24 @@ import { arrayEach } from "./../../helpers/array.mjs";
  * @class Highlight
  * @util
  */
+var _createHighlight = /*#__PURE__*/new WeakSet();
+_Symbol$iterator = Symbol.iterator;
 class Highlight {
   constructor(options) {
+    /**
+     * Creates (if not exist in the cache) Walkontable Selection instance.
+     *
+     * @param {Map} cacheMap The map where the instance will be cached.
+     * @param {Function} highlightFactory The function factory.
+     * @returns {VisualSelection}
+     */
+    _classPrivateMethodInitSpec(this, _createHighlight);
     /**
      * Options consumed by Highlight class and Walkontable Selection classes.
      *
      * @type {object}
      */
-    this.options = options;
+    _defineProperty(this, "options", void 0);
     /**
      * The property which describes which layer level of the visual selection will be modified.
      * This option is valid only for `area` and `header` highlight types which occurs multiple times on
@@ -35,49 +63,96 @@ class Highlight {
      * @type {number}
      * @default 0
      */
-    this.layerLevel = 0;
+    _defineProperty(this, "layerLevel", 0);
     /**
      * `cell` highlight object which describes attributes for the currently selected cell.
      * It can only occur only once on the table.
      *
      * @type {Selection}
      */
-    this.cell = createHighlight(CELL_TYPE, options);
+    _defineProperty(this, "focus", void 0);
     /**
      * `fill` highlight object which describes attributes for the borders for autofill functionality.
      * It can only occur only once on the table.
      *
      * @type {Selection}
      */
-    this.fill = createHighlight(FILL_TYPE, options);
+    _defineProperty(this, "fill", void 0);
     /**
      * Collection of the `area` highlights. That objects describes attributes for the borders and selection of
      * the multiple selected cells. It can occur multiple times on the table.
      *
      * @type {Map.<number, Selection>}
      */
-    this.areas = new Map();
+    _defineProperty(this, "layeredAreas", new Map());
+    /**
+     * Collection of the `highlight` highlights. That objects describes attributes for the borders and selection of
+     * the multiple selected cells. It can occur multiple times on the table.
+     *
+     * @type {Map.<number, Selection>}
+     */
+    _defineProperty(this, "areas", new Map());
+    /**
+     * Collection of the `header` highlights. That objects describes attributes for the selection of
+     * the multiple selected rows in the table header. It can occur multiple times on the table.
+     *
+     * @type {Map.<number, Selection>}
+     */
+    _defineProperty(this, "rowHeaders", new Map());
     /**
      * Collection of the `header` highlights. That objects describes attributes for the selection of
-     * the multiple selected rows and columns in the table header. It can occur multiple times on the table.
+     * the multiple selected columns in the table header. It can occur multiple times on the table.
      *
      * @type {Map.<number, Selection>}
      */
-    this.headers = new Map();
+    _defineProperty(this, "columnHeaders", new Map());
     /**
      * Collection of the `active-header` highlights. That objects describes attributes for the selection of
-     * the multiple selected rows and columns in the table header. The table headers which have selected all items in
+     * the multiple selected rows in the table header. The table headers which have selected all items in
      * a row will be marked as `active-header`.
      *
      * @type {Map.<number, Selection>}
      */
-    this.activeHeaders = new Map();
+    _defineProperty(this, "activeRowHeaders", new Map());
+    /**
+     * Collection of the `active-header` highlights. That objects describes attributes for the selection of
+     * the multiple selected columns in the table header. The table headers which have selected all items in
+     * a row will be marked as `active-header`.
+     *
+     * @type {Map.<number, Selection>}
+     */
+    _defineProperty(this, "activeColumnHeaders", new Map());
+    /**
+     * Collection of the `active-header` highlights. That objects describes attributes for the selection of
+     * the selected corner in the table header. The table headers which have selected all items in
+     * a row will be marked as `active-header`.
+     *
+     * @type {Map.<number, Selection>}
+     */
+    _defineProperty(this, "activeCornerHeaders", new Map());
+    /**
+     * Collection of the `rows` highlights. That objects describes attributes for the selection of
+     * the multiple selected cells in a row. It can occur multiple times on the table.
+     *
+     * @type {Map.<number, Selection>}
+     */
+    _defineProperty(this, "rowHighlights", new Map());
+    /**
+     * Collection of the `columns` highlights. That objects describes attributes for the selection of
+     * the multiple selected cells in a column. It can occur multiple times on the table.
+     *
+     * @type {Map.<number, Selection>}
+     */
+    _defineProperty(this, "columnHighlights", new Map());
     /**
      * Collection of the `custom-selection`, holder for example borders added through CustomBorders plugin.
      *
      * @type {Selection[]}
      */
-    this.customSelections = [];
+    _defineProperty(this, "customSelections", []);
+    this.options = options;
+    this.focus = createFocusHighlight(options);
+    this.fill = createFillHighlight(options);
   }
 
   /**
@@ -91,11 +166,14 @@ class Highlight {
     let type = highlightType;
 
     // Legacy compatibility.
-    if (highlightType === CELL_TYPE) {
+    if (highlightType === HIGHLIGHT_FOCUS_TYPE) {
       type = 'current'; // One from settings for `disableVisualSelection` up to Handsontable 0.36/Handsontable Pro 1.16.0.
     }
 
-    let disableHighlight = this.options.disabledCellSelection(coords.row, coords.col);
+    let disableHighlight = false;
+    if (coords.isCell()) {
+      disableHighlight = this.options.disabledCellSelection(coords.row, coords.col);
+    }
     if (typeof disableHighlight === 'string') {
       disableHighlight = [disableHighlight];
     }
@@ -115,12 +193,13 @@ class Highlight {
   }
 
   /**
-   * Get Walkontable Selection instance created for controlling highlight of the currently selected/edited cell.
+   * Get Walkontable Selection instance created for controlling highlight of the currently
+   * focused cell (or header).
    *
    * @returns {Selection}
    */
-  getCell() {
-    return this.cell;
+  getFocus() {
+    return this.focus;
   }
 
   /**
@@ -133,24 +212,32 @@ class Highlight {
   }
 
   /**
-   * Get or create (if not exist in the cache) Walkontable Selection instance created for controlling highlight
-   * of the multiple selected cells.
+   * Creates (if not exist in the cache) Walkontable Selection instance created for controlling
+   * `area` highlights.
    *
    * @returns {Selection}
    */
-  createOrGetArea() {
-    const layerLevel = this.layerLevel;
-    let area;
-    if (this.areas.has(layerLevel)) {
-      area = this.areas.get(layerLevel);
-    } else {
-      area = createHighlight(AREA_TYPE, {
-        layerLevel,
-        ...this.options
-      });
-      this.areas.set(layerLevel, area);
-    }
-    return area;
+  createLayeredArea() {
+    return _classPrivateMethodGet(this, _createHighlight, _createHighlight2).call(this, this.layeredAreas, createAreaLayeredHighlight);
+  }
+
+  /**
+   * Get all Walkontable Selection instances which describes the state of the visual highlight of the cells.
+   *
+   * @returns {Selection[]}
+   */
+  getLayeredAreas() {
+    return [...this.layeredAreas.values()];
+  }
+
+  /**
+   * Creates (if not exist in the cache) Walkontable Selection instance created for controlling
+   * `highlight` highlights.
+   *
+   * @returns {Selection}
+   */
+  createArea() {
+    return _classPrivateMethodGet(this, _createHighlight, _createHighlight2).call(this, this.areas, createAreaHighlight);
   }
 
   /**
@@ -163,23 +250,13 @@ class Highlight {
   }
 
   /**
-   * Get or create (if not exist in the cache) Walkontable Selection instance created for controlling highlight
-   * of the multiple selected header cells.
+   * Creates (if not exist in the cache) Walkontable Selection instance created for controlling
+   * header highlight for rows.
    *
    * @returns {Selection}
    */
-  createOrGetHeader() {
-    const layerLevel = this.layerLevel;
-    let header;
-    if (this.headers.has(layerLevel)) {
-      header = this.headers.get(layerLevel);
-    } else {
-      header = createHighlight(HEADER_TYPE, {
-        ...this.options
-      });
-      this.headers.set(layerLevel, header);
-    }
-    return header;
+  createRowHeader() {
+    return _classPrivateMethodGet(this, _createHighlight, _createHighlight2).call(this, this.rowHeaders, createHeaderHighlight);
   }
 
   /**
@@ -187,28 +264,56 @@ class Highlight {
    *
    * @returns {Selection[]}
    */
-  getHeaders() {
-    return [...this.headers.values()];
+  getRowHeaders() {
+    return [...this.rowHeaders.values()];
   }
 
   /**
-   * Get or create (if not exist in the cache) Walkontable Selection instance created for controlling highlight
-   * of the multiple selected active header cells.
+   * Creates (if not exist in the cache) Walkontable Selection instance created for controlling
+   * header highlight for columns.
    *
    * @returns {Selection}
    */
-  createOrGetActiveHeader() {
-    const layerLevel = this.layerLevel;
-    let header;
-    if (this.activeHeaders.has(layerLevel)) {
-      header = this.activeHeaders.get(layerLevel);
-    } else {
-      header = createHighlight(ACTIVE_HEADER_TYPE, {
-        ...this.options
-      });
-      this.activeHeaders.set(layerLevel, header);
-    }
-    return header;
+  createColumnHeader() {
+    return _classPrivateMethodGet(this, _createHighlight, _createHighlight2).call(this, this.columnHeaders, createHeaderHighlight);
+  }
+
+  /**
+   * Get all Walkontable Selection instances which describes the state of the visual highlight of the headers.
+   *
+   * @returns {Selection[]}
+   */
+  getColumnHeaders() {
+    return [...this.columnHeaders.values()];
+  }
+
+  /**
+   * Creates (if not exist in the cache) Walkontable Selection instance created for controlling
+   * highlight for active row headers.
+   *
+   * @returns {Selection}
+   */
+  createActiveRowHeader() {
+    return _classPrivateMethodGet(this, _createHighlight, _createHighlight2).call(this, this.activeRowHeaders, createActiveHighlight);
+  }
+
+  /**
+   * Get all Walkontable Selection instances which describes the state of the visual highlight of the active headers.
+   *
+   * @returns {Selection[]}
+   */
+  getActiveRowHeaders() {
+    return [...this.activeRowHeaders.values()];
+  }
+
+  /**
+   * Creates (if not exist in the cache) Walkontable Selection instance created for controlling
+   * highlight for active column headers.
+   *
+   * @returns {Selection}
+   */
+  createActiveColumnHeader() {
+    return _classPrivateMethodGet(this, _createHighlight, _createHighlight2).call(this, this.activeColumnHeaders, createActiveHighlight);
   }
 
   /**
@@ -216,8 +321,65 @@ class Highlight {
    *
    * @returns {Selection[]}
    */
-  getActiveHeaders() {
-    return [...this.activeHeaders.values()];
+  getActiveColumnHeaders() {
+    return [...this.activeColumnHeaders.values()];
+  }
+
+  /**
+   * Creates (if not exist in the cache) Walkontable Selection instance created for controlling
+   * highlight for the headers corner.
+   *
+   * @returns {Selection}
+   */
+  createActiveCornerHeader() {
+    return _classPrivateMethodGet(this, _createHighlight, _createHighlight2).call(this, this.activeCornerHeaders, createActiveHighlight);
+  }
+
+  /**
+   * Get all Walkontable Selection instances which describes the state of the visual highlight of the headers corner.
+   *
+   * @returns {Selection[]}
+   */
+  getActiveCornerHeaders() {
+    return [...this.activeCornerHeaders.values()];
+  }
+
+  /**
+   * Creates (if not exist in the cache) Walkontable Selection instance created for controlling
+   * highlight cells in a row.
+   *
+   * @returns {Selection}
+   */
+  createRowHighlight() {
+    return _classPrivateMethodGet(this, _createHighlight, _createHighlight2).call(this, this.rowHighlights, createRowHighlight);
+  }
+
+  /**
+   * Get all Walkontable Selection instances which describes the state of the rows highlighting.
+   *
+   * @returns {Selection[]}
+   */
+  getRowHighlights() {
+    return [...this.rowHighlights.values()];
+  }
+
+  /**
+   * Creates (if not exist in the cache) Walkontable Selection instance created for controlling
+   * highlight cells in a column.
+   *
+   * @returns {Selection}
+   */
+  createColumnHighlight() {
+    return _classPrivateMethodGet(this, _createHighlight, _createHighlight2).call(this, this.columnHighlights, createColumnHighlight);
+  }
+
+  /**
+   * Get all Walkontable Selection instances which describes the state of the columns highlighting.
+   *
+   * @returns {Selection[]}
+   */
+  getColumnHighlights() {
+    return [...this.columnHighlights.values()];
   }
 
   /**
@@ -235,7 +397,7 @@ class Highlight {
    * @param {object} selectionInstance The selection instance.
    */
   addCustomSelection(selectionInstance) {
-    this.customSelections.push(createHighlight(CUSTOM_SELECTION_TYPE, {
+    this.customSelections.push(createCustomHighlight({
       ...this.options,
       ...selectionInstance
     }));
@@ -245,20 +407,37 @@ class Highlight {
    * Perform cleaning visual highlights for the whole table.
    */
   clear() {
-    this.cell.clear();
+    this.focus.clear();
     this.fill.clear();
     arrayEach(this.areas.values(), highlight => void highlight.clear());
-    arrayEach(this.headers.values(), highlight => void highlight.clear());
-    arrayEach(this.activeHeaders.values(), highlight => void highlight.clear());
+    arrayEach(this.layeredAreas.values(), highlight => void highlight.clear());
+    arrayEach(this.rowHeaders.values(), highlight => void highlight.clear());
+    arrayEach(this.columnHeaders.values(), highlight => void highlight.clear());
+    arrayEach(this.activeRowHeaders.values(), highlight => void highlight.clear());
+    arrayEach(this.activeColumnHeaders.values(), highlight => void highlight.clear());
+    arrayEach(this.activeCornerHeaders.values(), highlight => void highlight.clear());
+    arrayEach(this.rowHighlights.values(), highlight => void highlight.clear());
+    arrayEach(this.columnHighlights.values(), highlight => void highlight.clear());
   }
-
   /**
    * This object can be iterate over using `for of` syntax or using internal `arrayEach` helper.
    *
    * @returns {Selection[]}
    */
-  [Symbol.iterator]() {
-    return [this.cell, this.fill, ...this.areas.values(), ...this.headers.values(), ...this.activeHeaders.values(), ...this.customSelections][Symbol.iterator]();
+  [_Symbol$iterator]() {
+    return [this.focus, this.fill, ...this.areas.values(), ...this.layeredAreas.values(), ...this.rowHeaders.values(), ...this.columnHeaders.values(), ...this.activeRowHeaders.values(), ...this.activeColumnHeaders.values(), ...this.activeCornerHeaders.values(), ...this.rowHighlights.values(), ...this.columnHighlights.values(), ...this.customSelections][Symbol.iterator]();
+  }
+}
+function _createHighlight2(cacheMap, highlightFactory) {
+  const layerLevel = this.layerLevel;
+  if (cacheMap.has(layerLevel)) {
+    return cacheMap.get(layerLevel);
   }
+  const highlight = highlightFactory({
+    layerLevel,
+    ...this.options
+  });
+  cacheMap.set(layerLevel, highlight);
+  return highlight;
 }
 export default Highlight;

package/selection/highlight/types/activeHeader.js

@@ -1,10 +1,15 @@
 "use strict";
 
 exports.__esModule = true;
-var _constants = require("../constants");
+exports.createHighlight = createHighlight;
+var _src = require("../../../3rdparty/walkontable/src");
 var _visualSelection = _interopRequireDefault(require("../visualSelection"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 /**
+ * Creates the new instance of Selection, responsible for highlighting column or row headers
+ * only when the whole column or row is selected.
+ * This type of selection can occur multiple times.
+ *
  * @param {object} highlightParams A configuration object to create a highlight.
  * @param {string} highlightParams.activeHeaderClassName Highlighted headers' class name.
  * @returns {Selection}
@@ -14,12 +19,9 @@ function createHighlight(_ref) {
     activeHeaderClassName,
     ...restOptions
   } = _ref;
-  const s = new _visualSelection.default({
-    highlightHeaderClassName: activeHeaderClassName,
+  return new _visualSelection.default({
+    className: activeHeaderClassName,
     ...restOptions,
-    selectionType: _constants.ACTIVE_HEADER_TYPE
+    selectionType: _src.HIGHLIGHT_ACTIVE_HEADER_TYPE
   });
-  return s;
-}
-var _default = createHighlight;
-exports.default = _default;
+}

package/selection/highlight/types/activeHeader.mjs

@@ -1,20 +1,22 @@
-import { ACTIVE_HEADER_TYPE } from "../constants.mjs";
+import { HIGHLIGHT_ACTIVE_HEADER_TYPE } from "../../../3rdparty/walkontable/src/index.mjs";
 import VisualSelection from "../visualSelection.mjs";
 /**
+ * Creates the new instance of Selection, responsible for highlighting column or row headers
+ * only when the whole column or row is selected.
+ * This type of selection can occur multiple times.
+ *
  * @param {object} highlightParams A configuration object to create a highlight.
  * @param {string} highlightParams.activeHeaderClassName Highlighted headers' class name.
  * @returns {Selection}
  */
-function createHighlight(_ref) {
+export function createHighlight(_ref) {
   let {
     activeHeaderClassName,
     ...restOptions
   } = _ref;
-  const s = new VisualSelection({
-    highlightHeaderClassName: activeHeaderClassName,
+  return new VisualSelection({
+    className: activeHeaderClassName,
     ...restOptions,
-    selectionType: ACTIVE_HEADER_TYPE
+    selectionType: HIGHLIGHT_ACTIVE_HEADER_TYPE
   });
-  return s;
-}
-export default createHighlight;
+}

package/selection/highlight/types/area.js

@@ -1,36 +1,24 @@
 "use strict";
 
 exports.__esModule = true;
-var _constants = require("../constants");
+exports.createHighlight = createHighlight;
+var _src = require("../../../3rdparty/walkontable/src");
 var _visualSelection = _interopRequireDefault(require("../visualSelection"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 /**
  * Creates the new instance of Selection responsible for highlighting area of the selected multiple cells.
  *
  * @param {object} highlightParams A configuration object to create a highlight.
- * @param {number} highlightParams.layerLevel Layer level.
  * @param {object} highlightParams.areaCornerVisible Function to determine if area's corner should be visible.
  * @returns {Selection}
  */
 function createHighlight(_ref) {
   let {
-    layerLevel,
-    areaCornerVisible,
     ...restOptions
   } = _ref;
-  const s = new _visualSelection.default({
-    className: 'area',
-    markIntersections: true,
-    layerLevel: Math.min(layerLevel, 7),
-    border: {
-      width: 1,
-      color: '#4b89ff',
-      cornerVisible: areaCornerVisible
-    },
+  return new _visualSelection.default({
+    className: 'highlight',
     ...restOptions,
-    selectionType: _constants.AREA_TYPE
+    selectionType: _src.HIGHLIGHT_AREA_TYPE
   });
-  return s;
-}
-var _default = createHighlight;
-exports.default = _default;
+}

package/selection/highlight/types/area.mjs

@@ -1,31 +1,19 @@
-import { AREA_TYPE } from "../constants.mjs";
+import { HIGHLIGHT_AREA_TYPE } from "../../../3rdparty/walkontable/src/index.mjs";
 import VisualSelection from "../visualSelection.mjs";
 /**
  * Creates the new instance of Selection responsible for highlighting area of the selected multiple cells.
  *
  * @param {object} highlightParams A configuration object to create a highlight.
- * @param {number} highlightParams.layerLevel Layer level.
  * @param {object} highlightParams.areaCornerVisible Function to determine if area's corner should be visible.
  * @returns {Selection}
  */
-function createHighlight(_ref) {
+export function createHighlight(_ref) {
   let {
-    layerLevel,
-    areaCornerVisible,
     ...restOptions
   } = _ref;
-  const s = new VisualSelection({
-    className: 'area',
-    markIntersections: true,
-    layerLevel: Math.min(layerLevel, 7),
-    border: {
-      width: 1,
-      color: '#4b89ff',
-      cornerVisible: areaCornerVisible
-    },
+  return new VisualSelection({
+    className: 'highlight',
     ...restOptions,
-    selectionType: AREA_TYPE
+    selectionType: HIGHLIGHT_AREA_TYPE
   });
-  return s;
-}
-export default createHighlight;
+}

package/selection/highlight/types/areaLayered.js

@@ -0,0 +1,31 @@
+"use strict";
+
+exports.__esModule = true;
+exports.createHighlight = createHighlight;
+var _src = require("../../../3rdparty/walkontable/src");
+var _visualSelection = _interopRequireDefault(require("../visualSelection"));
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+/**
+ * Creates the new instance of Selection responsible for highlighting area of the selected multiple cells.
+ *
+ * @param {object} highlightParams A configuration object to create a highlight.
+ * @param {object} highlightParams.areaCornerVisible Function to determine if area's corner should be visible.
+ * @returns {Selection}
+ */
+function createHighlight(_ref) {
+  let {
+    areaCornerVisible,
+    ...restOptions
+  } = _ref;
+  return new _visualSelection.default({
+    className: 'area',
+    createLayers: true,
+    border: {
+      width: 1,
+      color: '#4b89ff',
+      cornerVisible: areaCornerVisible
+    },
+    ...restOptions,
+    selectionType: _src.HIGHLIGHT_AREA_TYPE
+  });
+}

package/selection/highlight/types/areaLayered.mjs

@@ -0,0 +1,26 @@
+import { HIGHLIGHT_AREA_TYPE } from "../../../3rdparty/walkontable/src/index.mjs";
+import VisualSelection from "../visualSelection.mjs";
+/**
+ * Creates the new instance of Selection responsible for highlighting area of the selected multiple cells.
+ *
+ * @param {object} highlightParams A configuration object to create a highlight.
+ * @param {object} highlightParams.areaCornerVisible Function to determine if area's corner should be visible.
+ * @returns {Selection}
+ */
+export function createHighlight(_ref) {
+  let {
+    areaCornerVisible,
+    ...restOptions
+  } = _ref;
+  return new VisualSelection({
+    className: 'area',
+    createLayers: true,
+    border: {
+      width: 1,
+      color: '#4b89ff',
+      cornerVisible: areaCornerVisible
+    },
+    ...restOptions,
+    selectionType: HIGHLIGHT_AREA_TYPE
+  });
+}