handsontable 0.0.0-next-010265d-20231005 → 0.0.0-next-9379dd1-20231020
Sign up to get free protection for your applications and to get access to all the features.
Potentially problematic release.
This version of handsontable might be problematic. Click here for more details.
- package/3rdparty/walkontable/src/cell/coords.d.ts +6 -1
- package/3rdparty/walkontable/src/cell/coords.js +50 -11
- package/3rdparty/walkontable/src/cell/coords.mjs +50 -11
- package/3rdparty/walkontable/src/cell/range.d.ts +9 -2
- package/3rdparty/walkontable/src/cell/range.js +38 -7
- package/3rdparty/walkontable/src/cell/range.mjs +38 -7
- package/3rdparty/walkontable/src/core/_base.js +9 -3
- package/3rdparty/walkontable/src/core/_base.mjs +9 -3
- package/3rdparty/walkontable/src/core/clone.js +2 -2
- package/3rdparty/walkontable/src/core/clone.mjs +2 -2
- package/3rdparty/walkontable/src/core/core.js +3 -2
- package/3rdparty/walkontable/src/core/core.mjs +3 -2
- package/3rdparty/walkontable/src/event.js +12 -10
- package/3rdparty/walkontable/src/event.mjs +12 -10
- package/3rdparty/walkontable/src/facade/core.js +2 -2
- package/3rdparty/walkontable/src/facade/core.mjs +2 -2
- package/3rdparty/walkontable/src/index.js +10 -2
- package/3rdparty/walkontable/src/index.mjs +2 -2
- package/3rdparty/walkontable/src/overlay/_base.js +13 -2
- package/3rdparty/walkontable/src/overlay/_base.mjs +14 -3
- package/3rdparty/walkontable/src/overlay/inlineStart.js +2 -6
- package/3rdparty/walkontable/src/overlay/inlineStart.mjs +2 -6
- package/3rdparty/walkontable/src/overlay/top.js +2 -6
- package/3rdparty/walkontable/src/overlay/top.mjs +2 -6
- package/3rdparty/walkontable/src/renderer/cells.js +10 -0
- package/3rdparty/walkontable/src/renderer/cells.mjs +11 -1
- package/3rdparty/walkontable/src/renderer/columnHeaders.js +10 -0
- package/3rdparty/walkontable/src/renderer/columnHeaders.mjs +11 -1
- package/3rdparty/walkontable/src/renderer/rowHeaders.js +5 -0
- package/3rdparty/walkontable/src/renderer/rowHeaders.mjs +5 -0
- package/3rdparty/walkontable/src/renderer/rows.js +13 -0
- package/3rdparty/walkontable/src/renderer/rows.mjs +13 -0
- package/3rdparty/walkontable/src/renderer/table.js +9 -0
- package/3rdparty/walkontable/src/renderer/table.mjs +9 -0
- package/3rdparty/walkontable/src/scroll.js +2 -0
- package/3rdparty/walkontable/src/scroll.mjs +2 -0
- package/3rdparty/walkontable/src/{border.js → selection/border/border.js} +7 -12
- package/3rdparty/walkontable/src/{border.mjs → selection/border/border.mjs} +7 -12
- package/3rdparty/walkontable/src/selection/border/constants.js +16 -0
- package/3rdparty/walkontable/src/selection/border/constants.mjs +12 -0
- package/3rdparty/walkontable/src/selection/constants.js +62 -0
- package/3rdparty/walkontable/src/selection/constants.mjs +51 -0
- package/3rdparty/walkontable/src/selection/index.js +26 -0
- package/3rdparty/walkontable/src/selection/index.mjs +5 -0
- package/3rdparty/walkontable/src/selection/manager.js +274 -0
- package/3rdparty/walkontable/src/selection/manager.mjs +269 -0
- package/3rdparty/walkontable/src/selection/scanner.js +270 -0
- package/3rdparty/walkontable/src/selection/scanner.mjs +267 -0
- package/3rdparty/walkontable/src/selection/selection.js +101 -0
- package/3rdparty/walkontable/src/selection/selection.mjs +96 -0
- package/3rdparty/walkontable/src/settings.js +13 -4
- package/3rdparty/walkontable/src/settings.mjs +13 -4
- package/3rdparty/walkontable/src/table/mixin/calculatedColumns.js +9 -0
- package/3rdparty/walkontable/src/table/mixin/calculatedColumns.mjs +9 -0
- package/3rdparty/walkontable/src/table/mixin/calculatedRows.js +9 -0
- package/3rdparty/walkontable/src/table/mixin/calculatedRows.mjs +9 -0
- package/3rdparty/walkontable/src/table/mixin/stickyColumnsStart.js +9 -0
- package/3rdparty/walkontable/src/table/mixin/stickyColumnsStart.mjs +9 -0
- package/3rdparty/walkontable/src/table/mixin/stickyRowsBottom.js +9 -0
- package/3rdparty/walkontable/src/table/mixin/stickyRowsBottom.mjs +9 -0
- package/3rdparty/walkontable/src/table/mixin/stickyRowsTop.js +9 -0
- package/3rdparty/walkontable/src/table/mixin/stickyRowsTop.mjs +9 -0
- package/3rdparty/walkontable/src/table.js +19 -78
- package/3rdparty/walkontable/src/table.mjs +20 -79
- package/base.js +2 -2
- package/base.mjs +2 -2
- package/cellTypes/dateType/dateType.d.ts +3 -3
- package/cellTypes/dateType/dateType.js +2 -2
- package/cellTypes/dateType/dateType.mjs +2 -2
- package/cellTypes/handsontableType/handsontableType.d.ts +3 -3
- package/cellTypes/handsontableType/handsontableType.js +2 -2
- package/cellTypes/handsontableType/handsontableType.mjs +2 -2
- package/cellTypes/index.d.ts +3 -0
- package/cellTypes/index.js +4 -0
- package/cellTypes/index.mjs +3 -1
- package/cellTypes/selectType/index.d.ts +1 -0
- package/cellTypes/selectType/index.js +6 -0
- package/cellTypes/selectType/index.mjs +1 -0
- package/cellTypes/selectType/selectType.d.ts +14 -0
- package/cellTypes/selectType/selectType.js +13 -0
- package/cellTypes/selectType/selectType.mjs +8 -0
- package/core/focusCatcher/focusDetector.js +63 -0
- package/core/focusCatcher/focusDetector.mjs +59 -0
- package/core/focusCatcher/index.js +142 -0
- package/core/focusCatcher/index.mjs +138 -0
- package/core/index.js +9 -0
- package/core/index.mjs +1 -0
- package/core.d.ts +9 -4
- package/core.js +285 -327
- package/core.mjs +285 -327
- package/dataMap/metaManager/metaSchema.js +65 -0
- package/dataMap/metaManager/metaSchema.mjs +65 -0
- package/dataMap/metaManager/mods/extendMetaProperties.js +7 -1
- package/dataMap/metaManager/mods/extendMetaProperties.mjs +7 -1
- package/dataMap/replaceData.js +5 -0
- package/dataMap/replaceData.mjs +5 -0
- package/dist/handsontable.css +40 -5
- package/dist/handsontable.full.css +40 -5
- package/dist/handsontable.full.js +11744 -6945
- package/dist/handsontable.full.min.css +4 -4
- package/dist/handsontable.full.min.js +141 -141
- package/dist/handsontable.js +14036 -9237
- package/dist/handsontable.min.css +3 -3
- package/dist/handsontable.min.js +21 -21
- package/dist/languages/all.js +6 -2
- package/dist/languages/all.min.js +1 -1
- package/dist/languages/en-US.js +3 -1
- package/dist/languages/en-US.min.js +1 -1
- package/dist/languages/pl-PL.js +3 -1
- package/dist/languages/pl-PL.min.js +1 -1
- package/editorManager.js +15 -87
- package/editorManager.mjs +16 -87
- package/editors/autocompleteEditor/autocompleteEditor.js +53 -2
- package/editors/autocompleteEditor/autocompleteEditor.mjs +54 -3
- package/editors/dateEditor/dateEditor.js +26 -7
- package/editors/dateEditor/dateEditor.mjs +27 -8
- package/editors/handsontableEditor/handsontableEditor.js +9 -1
- package/editors/handsontableEditor/handsontableEditor.mjs +10 -2
- package/editors/textEditor/textEditor.js +19 -27
- package/editors/textEditor/textEditor.mjs +22 -30
- package/focusManager.d.ts +12 -0
- package/focusManager.js +265 -0
- package/focusManager.mjs +261 -0
- package/helpers/a11y.js +79 -0
- package/helpers/a11y.mjs +38 -0
- package/helpers/dom/element.js +188 -9
- package/helpers/dom/element.mjs +182 -9
- package/helpers/mixed.js +1 -1
- package/helpers/mixed.mjs +1 -1
- package/helpers/number.d.ts +1 -0
- package/helpers/number.js +18 -0
- package/helpers/number.mjs +17 -0
- package/i18n/constants.js +7 -1
- package/i18n/constants.mjs +4 -1
- package/i18n/languages/en-US.js +3 -1
- package/i18n/languages/en-US.mjs +3 -1
- package/i18n/languages/pl-PL.js +3 -1
- package/i18n/languages/pl-PL.mjs +3 -1
- package/languages/all.js +6 -2
- package/languages/en-US.js +3 -1
- package/languages/en-US.mjs +3 -1
- package/languages/index.js +6 -2
- package/languages/pl-PL.js +3 -1
- package/languages/pl-PL.mjs +3 -1
- package/package.json +21 -1
- package/pluginHooks.d.ts +12 -1
- package/pluginHooks.js +152 -1
- package/pluginHooks.mjs +152 -1
- package/plugins/collapsibleColumns/collapsibleColumns.js +74 -4
- package/plugins/collapsibleColumns/collapsibleColumns.mjs +75 -5
- package/plugins/columnSorting/columnSorting.js +43 -0
- package/plugins/columnSorting/columnSorting.mjs +44 -3
- package/plugins/columnSorting/index.js +3 -1
- package/plugins/columnSorting/index.mjs +1 -1
- package/plugins/comments/commentEditor.js +1 -0
- package/plugins/comments/commentEditor.mjs +1 -0
- package/plugins/comments/comments.js +252 -189
- package/plugins/comments/comments.mjs +251 -190
- package/plugins/comments/contextMenuItem/addEditComment.js +41 -0
- package/plugins/comments/contextMenuItem/addEditComment.mjs +35 -0
- package/plugins/comments/contextMenuItem/readOnlyComment.js +49 -0
- package/plugins/comments/contextMenuItem/readOnlyComment.mjs +43 -0
- package/plugins/comments/contextMenuItem/removeComment.js +38 -0
- package/plugins/comments/contextMenuItem/removeComment.mjs +32 -0
- package/plugins/contextMenu/commandExecutor.js +2 -3
- package/plugins/contextMenu/commandExecutor.mjs +2 -3
- package/plugins/contextMenu/contextMenu.d.ts +1 -1
- package/plugins/contextMenu/contextMenu.js +75 -36
- package/plugins/contextMenu/contextMenu.mjs +74 -35
- package/plugins/contextMenu/itemsFactory.js +2 -3
- package/plugins/contextMenu/itemsFactory.mjs +3 -4
- package/plugins/contextMenu/{cursor.mjs → menu/cursor.js} +6 -4
- package/plugins/contextMenu/{cursor.js → menu/cursor.mjs} +4 -10
- package/plugins/contextMenu/menu/index.js +9 -0
- package/plugins/contextMenu/menu/index.mjs +1 -0
- package/plugins/contextMenu/{menu.js → menu/menu.js} +96 -308
- package/plugins/contextMenu/{menu.mjs → menu/menu.mjs} +97 -309
- package/plugins/contextMenu/menu/navigator.js +152 -0
- package/plugins/contextMenu/menu/navigator.mjs +148 -0
- package/plugins/contextMenu/menu/positioner.js +213 -0
- package/plugins/contextMenu/menu/positioner.mjs +209 -0
- package/plugins/contextMenu/menu/utils.js +177 -0
- package/plugins/contextMenu/menu/utils.mjs +163 -0
- package/plugins/contextMenu/predefinedItems/alignment.js +7 -0
- package/plugins/contextMenu/predefinedItems/alignment.mjs +7 -0
- package/plugins/contextMenu/predefinedItems/clearColumn.js +5 -3
- package/plugins/contextMenu/predefinedItems/clearColumn.mjs +5 -3
- package/plugins/contextMenu/predefinedItems/columnLeft.js +5 -3
- package/plugins/contextMenu/predefinedItems/columnLeft.mjs +5 -3
- package/plugins/contextMenu/predefinedItems/columnRight.js +5 -3
- package/plugins/contextMenu/predefinedItems/columnRight.mjs +5 -3
- package/plugins/contextMenu/{predefinedItems.js → predefinedItems/index.js} +14 -14
- package/plugins/contextMenu/predefinedItems/index.mjs +68 -0
- package/plugins/contextMenu/predefinedItems/readOnly.js +7 -0
- package/plugins/contextMenu/predefinedItems/readOnly.mjs +7 -0
- package/plugins/contextMenu/predefinedItems/removeColumn.js +7 -5
- package/plugins/contextMenu/predefinedItems/removeColumn.mjs +5 -3
- package/plugins/contextMenu/predefinedItems/removeRow.js +7 -5
- package/plugins/contextMenu/predefinedItems/removeRow.mjs +5 -3
- package/plugins/contextMenu/predefinedItems/rowAbove.js +5 -3
- package/plugins/contextMenu/predefinedItems/rowAbove.mjs +5 -3
- package/plugins/contextMenu/predefinedItems/rowBelow.js +5 -3
- package/plugins/contextMenu/predefinedItems/rowBelow.mjs +5 -3
- package/plugins/contextMenu/utils.js +35 -151
- package/plugins/contextMenu/utils.mjs +35 -144
- package/plugins/copyPaste/contextMenuItem/copy.js +7 -0
- package/plugins/copyPaste/contextMenuItem/copy.mjs +7 -0
- package/plugins/copyPaste/contextMenuItem/copyColumnHeadersOnly.js +9 -1
- package/plugins/copyPaste/contextMenuItem/copyColumnHeadersOnly.mjs +9 -1
- package/plugins/copyPaste/contextMenuItem/copyWithColumnGroupHeaders.js +9 -1
- package/plugins/copyPaste/contextMenuItem/copyWithColumnGroupHeaders.mjs +9 -1
- package/plugins/copyPaste/contextMenuItem/copyWithColumnHeaders.js +9 -1
- package/plugins/copyPaste/contextMenuItem/copyWithColumnHeaders.mjs +9 -1
- package/plugins/copyPaste/contextMenuItem/cut.js +7 -0
- package/plugins/copyPaste/contextMenuItem/cut.mjs +7 -0
- package/plugins/copyPaste/copyPaste.js +127 -78
- package/plugins/copyPaste/copyPaste.mjs +128 -79
- package/plugins/customBorders/customBorders.js +23 -20
- package/plugins/customBorders/customBorders.mjs +24 -21
- package/plugins/dropdownMenu/dropdownMenu.d.ts +1 -1
- package/plugins/dropdownMenu/dropdownMenu.js +97 -38
- package/plugins/dropdownMenu/dropdownMenu.mjs +96 -37
- package/plugins/filters/constants.mjs +1 -1
- package/plugins/filters/filters.js +31 -14
- package/plugins/filters/filters.mjs +31 -14
- package/plugins/filters/ui/select.js +3 -3
- package/plugins/filters/ui/select.mjs +2 -2
- package/plugins/hiddenColumns/hiddenColumns.mjs +1 -1
- package/plugins/hiddenRows/hiddenRows.mjs +1 -1
- package/plugins/manualColumnMove/manualColumnMove.js +3 -1
- package/plugins/manualColumnMove/manualColumnMove.mjs +3 -1
- package/plugins/mergeCells/mergeCells.js +5 -16
- package/plugins/mergeCells/mergeCells.mjs +5 -16
- package/plugins/multiColumnSorting/multiColumnSorting.js +37 -2
- package/plugins/multiColumnSorting/multiColumnSorting.mjs +37 -2
- package/plugins/nestedHeaders/nestedHeaders.js +240 -10
- package/plugins/nestedHeaders/nestedHeaders.mjs +241 -11
- package/plugins/nestedHeaders/stateManager/index.js +102 -3
- package/plugins/nestedHeaders/stateManager/index.mjs +102 -3
- package/plugins/nestedRows/nestedRows.js +41 -0
- package/plugins/nestedRows/nestedRows.mjs +41 -0
- package/plugins/nestedRows/ui/headers.js +11 -0
- package/plugins/nestedRows/ui/headers.mjs +12 -1
- package/renderers/autocompleteRenderer/autocompleteRenderer.js +8 -0
- package/renderers/autocompleteRenderer/autocompleteRenderer.mjs +8 -0
- package/renderers/baseRenderer/baseRenderer.js +17 -0
- package/renderers/baseRenderer/baseRenderer.mjs +18 -1
- package/renderers/checkboxRenderer/checkboxRenderer.js +9 -4
- package/renderers/checkboxRenderer/checkboxRenderer.mjs +9 -4
- package/renderers/dateRenderer/dateRenderer.d.ts +5 -0
- package/renderers/dateRenderer/dateRenderer.js +29 -0
- package/renderers/dateRenderer/dateRenderer.mjs +24 -0
- package/renderers/dateRenderer/index.d.ts +1 -0
- package/renderers/dateRenderer/index.js +6 -0
- package/renderers/dateRenderer/index.mjs +1 -0
- package/renderers/handsontableRenderer/handsontableRenderer.d.ts +5 -0
- package/renderers/handsontableRenderer/handsontableRenderer.js +29 -0
- package/renderers/handsontableRenderer/handsontableRenderer.mjs +24 -0
- package/renderers/handsontableRenderer/index.d.ts +1 -0
- package/renderers/handsontableRenderer/index.js +6 -0
- package/renderers/handsontableRenderer/index.mjs +1 -0
- package/renderers/index.d.ts +9 -0
- package/renderers/selectRenderer/index.d.ts +1 -0
- package/renderers/selectRenderer/index.js +6 -0
- package/renderers/selectRenderer/index.mjs +1 -0
- package/renderers/selectRenderer/selectRenderer.d.ts +5 -0
- package/renderers/selectRenderer/selectRenderer.js +27 -0
- package/renderers/selectRenderer/selectRenderer.mjs +22 -0
- package/selection/highlight/highlight.js +256 -71
- package/selection/highlight/highlight.mjs +250 -71
- package/selection/highlight/types/activeHeader.js +10 -8
- package/selection/highlight/types/activeHeader.mjs +10 -8
- package/selection/highlight/types/area.js +6 -18
- package/selection/highlight/types/area.mjs +6 -18
- package/selection/highlight/types/areaLayered.js +31 -0
- package/selection/highlight/types/areaLayered.mjs +26 -0
- package/selection/highlight/types/column.js +27 -0
- package/selection/highlight/types/column.mjs +22 -0
- package/selection/highlight/types/customSelection.js +7 -9
- package/selection/highlight/types/customSelection.mjs +7 -9
- package/selection/highlight/types/fill.js +5 -7
- package/selection/highlight/types/fill.mjs +5 -7
- package/selection/highlight/types/{cell.js → focus.js} +5 -7
- package/selection/highlight/types/{cell.mjs → focus.mjs} +5 -7
- package/selection/highlight/types/header.js +9 -18
- package/selection/highlight/types/header.mjs +9 -18
- package/selection/highlight/types/row.js +27 -0
- package/selection/highlight/types/row.mjs +22 -0
- package/selection/highlight/visualSelection.js +31 -27
- package/selection/highlight/visualSelection.mjs +31 -27
- package/selection/index.js +4 -7
- package/selection/index.mjs +2 -3
- package/selection/mouseEventHandler.js +7 -1
- package/selection/mouseEventHandler.mjs +7 -1
- package/selection/range.js +8 -8
- package/selection/range.mjs +8 -8
- package/selection/selection.js +321 -152
- package/selection/selection.mjs +318 -151
- package/selection/transformation.js +232 -90
- package/selection/transformation.mjs +232 -90
- package/selection/utils.js +15 -21
- package/selection/utils.mjs +16 -21
- package/settings.d.ts +4 -0
- package/shortcutContexts/commands/editor/closeAndSave.js +12 -0
- package/shortcutContexts/commands/editor/closeAndSave.mjs +8 -0
- package/shortcutContexts/commands/editor/closeWithoutSaving.js +12 -0
- package/shortcutContexts/commands/editor/closeWithoutSaving.mjs +8 -0
- package/shortcutContexts/commands/editor/fastOpen.js +16 -0
- package/shortcutContexts/commands/editor/fastOpen.mjs +12 -0
- package/shortcutContexts/commands/editor/index.js +16 -0
- package/shortcutContexts/commands/editor/index.mjs +12 -0
- package/shortcutContexts/commands/editor/open.js +27 -0
- package/shortcutContexts/commands/editor/open.mjs +23 -0
- package/shortcutContexts/commands/emptySelectedCells.js +11 -0
- package/shortcutContexts/commands/emptySelectedCells.mjs +7 -0
- package/shortcutContexts/commands/extendCellsSelection/down.js +15 -0
- package/shortcutContexts/commands/extendCellsSelection/down.mjs +11 -0
- package/shortcutContexts/commands/extendCellsSelection/downByViewportHeight.js +25 -0
- package/shortcutContexts/commands/extendCellsSelection/downByViewportHeight.mjs +21 -0
- package/shortcutContexts/commands/extendCellsSelection/index.js +26 -0
- package/shortcutContexts/commands/extendCellsSelection/index.mjs +22 -0
- package/shortcutContexts/commands/extendCellsSelection/left.js +15 -0
- package/shortcutContexts/commands/extendCellsSelection/left.mjs +11 -0
- package/shortcutContexts/commands/extendCellsSelection/right.js +15 -0
- package/shortcutContexts/commands/extendCellsSelection/right.mjs +11 -0
- package/shortcutContexts/commands/extendCellsSelection/toColumns.js +19 -0
- package/shortcutContexts/commands/extendCellsSelection/toColumns.mjs +15 -0
- package/shortcutContexts/commands/extendCellsSelection/toMostBottom.js +29 -0
- package/shortcutContexts/commands/extendCellsSelection/toMostBottom.mjs +25 -0
- package/shortcutContexts/commands/extendCellsSelection/toMostInlineEnd.js +19 -0
- package/shortcutContexts/commands/extendCellsSelection/toMostInlineEnd.mjs +15 -0
- package/shortcutContexts/commands/extendCellsSelection/toMostInlineStart.js +19 -0
- package/shortcutContexts/commands/extendCellsSelection/toMostInlineStart.mjs +15 -0
- package/shortcutContexts/commands/extendCellsSelection/toMostLeft.js +29 -0
- package/shortcutContexts/commands/extendCellsSelection/toMostLeft.mjs +25 -0
- package/shortcutContexts/commands/extendCellsSelection/toMostRight.js +29 -0
- package/shortcutContexts/commands/extendCellsSelection/toMostRight.mjs +25 -0
- package/shortcutContexts/commands/extendCellsSelection/toMostTop.js +29 -0
- package/shortcutContexts/commands/extendCellsSelection/toMostTop.mjs +25 -0
- package/shortcutContexts/commands/extendCellsSelection/toRows.js +19 -0
- package/shortcutContexts/commands/extendCellsSelection/toRows.mjs +15 -0
- package/shortcutContexts/commands/extendCellsSelection/up.js +15 -0
- package/shortcutContexts/commands/extendCellsSelection/up.mjs +11 -0
- package/shortcutContexts/commands/extendCellsSelection/upByViewportHeight.js +25 -0
- package/shortcutContexts/commands/extendCellsSelection/upByViewportHeight.mjs +21 -0
- package/shortcutContexts/commands/index.js +35 -0
- package/shortcutContexts/commands/index.mjs +31 -0
- package/shortcutContexts/commands/moveCellSelection/down.js +13 -0
- package/shortcutContexts/commands/moveCellSelection/down.mjs +9 -0
- package/shortcutContexts/commands/moveCellSelection/downByViewportHeight.js +33 -0
- package/shortcutContexts/commands/moveCellSelection/downByViewportHeight.mjs +29 -0
- package/shortcutContexts/commands/moveCellSelection/index.js +28 -0
- package/shortcutContexts/commands/moveCellSelection/index.mjs +24 -0
- package/shortcutContexts/commands/moveCellSelection/inlineEnd.js +12 -0
- package/shortcutContexts/commands/moveCellSelection/inlineEnd.mjs +8 -0
- package/shortcutContexts/commands/moveCellSelection/inlineStart.js +12 -0
- package/shortcutContexts/commands/moveCellSelection/inlineStart.mjs +8 -0
- package/shortcutContexts/commands/moveCellSelection/left.js +10 -0
- package/shortcutContexts/commands/moveCellSelection/left.mjs +6 -0
- package/shortcutContexts/commands/moveCellSelection/right.js +10 -0
- package/shortcutContexts/commands/moveCellSelection/right.mjs +6 -0
- package/shortcutContexts/commands/moveCellSelection/toMostBottom.js +17 -0
- package/shortcutContexts/commands/moveCellSelection/toMostBottom.mjs +13 -0
- package/shortcutContexts/commands/moveCellSelection/toMostBottomInlineEnd.js +18 -0
- package/shortcutContexts/commands/moveCellSelection/toMostBottomInlineEnd.mjs +14 -0
- package/shortcutContexts/commands/moveCellSelection/toMostInlineEnd.js +14 -0
- package/shortcutContexts/commands/moveCellSelection/toMostInlineEnd.mjs +10 -0
- package/shortcutContexts/commands/moveCellSelection/toMostInlineStart.js +17 -0
- package/shortcutContexts/commands/moveCellSelection/toMostInlineStart.mjs +13 -0
- package/shortcutContexts/commands/moveCellSelection/toMostLeft.js +19 -0
- package/shortcutContexts/commands/moveCellSelection/toMostLeft.mjs +15 -0
- package/shortcutContexts/commands/moveCellSelection/toMostRight.js +21 -0
- package/shortcutContexts/commands/moveCellSelection/toMostRight.mjs +17 -0
- package/shortcutContexts/commands/moveCellSelection/toMostTop.js +17 -0
- package/shortcutContexts/commands/moveCellSelection/toMostTop.mjs +13 -0
- package/shortcutContexts/commands/moveCellSelection/toMostTopInlineStart.js +19 -0
- package/shortcutContexts/commands/moveCellSelection/toMostTopInlineStart.mjs +15 -0
- package/shortcutContexts/commands/moveCellSelection/up.js +13 -0
- package/shortcutContexts/commands/moveCellSelection/up.mjs +9 -0
- package/shortcutContexts/commands/moveCellSelection/upByViewportHeight.js +33 -0
- package/shortcutContexts/commands/moveCellSelection/upByViewportHeight.mjs +29 -0
- package/shortcutContexts/commands/populateSelectedCellsData.js +29 -0
- package/shortcutContexts/commands/populateSelectedCellsData.mjs +25 -0
- package/shortcutContexts/commands/scrollToFocusedCell.js +35 -0
- package/shortcutContexts/commands/scrollToFocusedCell.mjs +31 -0
- package/shortcutContexts/commands/selectAll.js +12 -0
- package/shortcutContexts/commands/selectAll.mjs +8 -0
- package/shortcutContexts/constants.js +13 -0
- package/shortcutContexts/constants.mjs +8 -0
- package/shortcutContexts/editor.js +25 -0
- package/shortcutContexts/editor.mjs +21 -0
- package/shortcutContexts/grid.js +163 -0
- package/shortcutContexts/grid.mjs +159 -0
- package/shortcutContexts/index.js +24 -0
- package/shortcutContexts/index.mjs +11 -0
- package/shortcuts/context.js +20 -2
- package/shortcuts/context.mjs +20 -3
- package/shortcuts/manager.js +25 -7
- package/shortcuts/manager.mjs +26 -7
- package/shortcuts/recorder.js +3 -3
- package/shortcuts/recorder.mjs +3 -3
- package/shortcuts/utils.js +19 -5
- package/shortcuts/utils.mjs +18 -4
- package/tableView.js +111 -13
- package/tableView.mjs +112 -14
- package/3rdparty/walkontable/src/selection.js +0 -295
- package/3rdparty/walkontable/src/selection.mjs +0 -290
- package/plugins/contextMenu/predefinedItems.mjs +0 -68
- package/plugins/copyPaste/focusableElement.js +0 -186
- package/plugins/copyPaste/focusableElement.mjs +0 -180
- package/selection/highlight/constants.js +0 -15
- package/selection/highlight/constants.mjs +0 -6
- package/selection/highlight/types/index.js +0 -35
- package/selection/highlight/types/index.mjs +0 -31
package/selection/selection.mjs
CHANGED
@@ -1,18 +1,31 @@
|
|
1
1
|
import "core-js/modules/es.error.cause.js";
|
2
|
-
|
3
|
-
|
2
|
+
function _classPrivateFieldInitSpec(obj, privateMap, value) { _checkPrivateRedeclaration(obj, privateMap); privateMap.set(obj, value); }
|
3
|
+
function _checkPrivateRedeclaration(obj, privateCollection) { if (privateCollection.has(obj)) { throw new TypeError("Cannot initialize the same private elements twice on an object"); } }
|
4
|
+
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; }
|
5
|
+
function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
|
6
|
+
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); }
|
7
|
+
function _classPrivateFieldSet(receiver, privateMap, value) { var descriptor = _classExtractFieldDescriptor(receiver, privateMap, "set"); _classApplyDescriptorSet(receiver, descriptor, value); return value; }
|
8
|
+
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; } }
|
9
|
+
function _classPrivateFieldGet(receiver, privateMap) { var descriptor = _classExtractFieldDescriptor(receiver, privateMap, "get"); return _classApplyDescriptorGet(receiver, descriptor); }
|
10
|
+
function _classExtractFieldDescriptor(receiver, privateMap, action) { if (!privateMap.has(receiver)) { throw new TypeError("attempted to " + action + " private field on non-instance"); } return privateMap.get(receiver); }
|
11
|
+
function _classApplyDescriptorGet(receiver, descriptor) { if (descriptor.get) { return descriptor.get.call(receiver); } return descriptor.value; }
|
12
|
+
import { CellCoords, CellRange } from "./../3rdparty/walkontable/src/index.mjs";
|
13
|
+
import Highlight, { AREA_TYPE, HEADER_TYPE, FOCUS_TYPE } from "./highlight/highlight.mjs";
|
4
14
|
import SelectionRange from "./range.mjs";
|
5
15
|
import { createObjectPropListener, mixin } from "./../helpers/object.mjs";
|
6
16
|
import { isUndefined } from "./../helpers/mixed.mjs";
|
17
|
+
import { clamp } from "./../helpers/number.mjs";
|
7
18
|
import { arrayEach } from "./../helpers/array.mjs";
|
8
19
|
import localHooks from "./../mixins/localHooks.mjs";
|
9
20
|
import Transformation from "./transformation.mjs";
|
10
|
-
import { detectSelectionType,
|
21
|
+
import { detectSelectionType, normalizeSelectionFactory, SELECTION_TYPE_EMPTY, SELECTION_TYPE_UNRECOGNIZED } from "./utils.mjs";
|
11
22
|
import { toSingleLine } from "./../helpers/templateLiteralTag.mjs";
|
23
|
+
import { A11Y_SELECTED } from "../helpers/a11y.mjs";
|
12
24
|
/**
|
13
25
|
* @class Selection
|
14
26
|
* @util
|
15
27
|
*/
|
28
|
+
var _disableHeadersHighlight = /*#__PURE__*/new WeakMap();
|
16
29
|
class Selection {
|
17
30
|
constructor(settings, tableProps) {
|
18
31
|
var _this = this;
|
@@ -21,57 +34,73 @@ class Selection {
|
|
21
34
|
*
|
22
35
|
* @type {GridSettings}
|
23
36
|
*/
|
24
|
-
this
|
37
|
+
_defineProperty(this, "settings", void 0);
|
25
38
|
/**
|
26
39
|
* An additional object with dynamically defined properties which describes table state.
|
27
40
|
*
|
28
41
|
* @type {object}
|
29
42
|
*/
|
30
|
-
this
|
43
|
+
_defineProperty(this, "tableProps", void 0);
|
31
44
|
/**
|
32
45
|
* The flag which determines if the selection is in progress.
|
33
46
|
*
|
34
47
|
* @type {boolean}
|
35
48
|
*/
|
36
|
-
this
|
49
|
+
_defineProperty(this, "inProgress", false);
|
37
50
|
/**
|
38
|
-
*
|
51
|
+
* Selection data layer (handle visual coordinates).
|
39
52
|
*
|
40
|
-
* @type {
|
53
|
+
* @type {SelectionRange}
|
41
54
|
*/
|
42
|
-
this
|
55
|
+
_defineProperty(this, "selectedRange", new SelectionRange((highlight, from, to) => {
|
56
|
+
return this.tableProps.createCellRange(highlight, from, to);
|
57
|
+
}));
|
58
|
+
/**
|
59
|
+
* Visualization layer.
|
60
|
+
*
|
61
|
+
* @type {Highlight}
|
62
|
+
*/
|
63
|
+
_defineProperty(this, "highlight", void 0);
|
64
|
+
/**
|
65
|
+
* The module for modifying coordinates.
|
66
|
+
*
|
67
|
+
* @type {Transformation}
|
68
|
+
*/
|
69
|
+
_defineProperty(this, "transformation", void 0);
|
43
70
|
/**
|
44
71
|
* The collection of the selection layer levels where the whole row was selected using the row header or
|
45
72
|
* the corner header.
|
46
73
|
*
|
47
|
-
* @type {Set
|
74
|
+
* @type {Set<number>}
|
48
75
|
*/
|
49
|
-
this
|
76
|
+
_defineProperty(this, "selectedByRowHeader", new Set());
|
50
77
|
/**
|
51
78
|
* The collection of the selection layer levels where the whole column was selected using the column header or
|
52
79
|
* the corner header.
|
53
80
|
*
|
54
|
-
* @type {Set
|
81
|
+
* @type {Set<number>}
|
55
82
|
*/
|
56
|
-
this
|
83
|
+
_defineProperty(this, "selectedByColumnHeader", new Set());
|
57
84
|
/**
|
58
|
-
*
|
85
|
+
* When sets disable highlighting the headers even when the logical coordinates points on them.
|
59
86
|
*
|
60
|
-
* @type {
|
87
|
+
* @type {boolean}
|
61
88
|
*/
|
62
|
-
this
|
63
|
-
|
89
|
+
_classPrivateFieldInitSpec(this, _disableHeadersHighlight, {
|
90
|
+
writable: true,
|
91
|
+
value: false
|
64
92
|
});
|
65
|
-
|
66
|
-
|
67
|
-
*
|
68
|
-
* @type {Highlight}
|
69
|
-
*/
|
93
|
+
this.settings = settings;
|
94
|
+
this.tableProps = tableProps;
|
70
95
|
this.highlight = new Highlight({
|
71
96
|
headerClassName: settings.currentHeaderClassName,
|
97
|
+
headerAttributes: [A11Y_SELECTED()],
|
72
98
|
activeHeaderClassName: settings.activeHeaderClassName,
|
73
99
|
rowClassName: settings.currentRowClassName,
|
74
100
|
columnClassName: settings.currentColClassName,
|
101
|
+
cellAttributes: [A11Y_SELECTED()],
|
102
|
+
rowIndexMapper: this.tableProps.rowIndexMapper,
|
103
|
+
columnIndexMapper: this.tableProps.columnIndexMapper,
|
75
104
|
disabledCellSelection: (row, column) => this.tableProps.isDisabledCellSelection(row, column),
|
76
105
|
cellCornerVisible: function () {
|
77
106
|
return _this.isCellCornerVisible(...arguments);
|
@@ -82,21 +111,19 @@ class Selection {
|
|
82
111
|
visualToRenderableCoords: coords => this.tableProps.visualToRenderableCoords(coords),
|
83
112
|
renderableToVisualCoords: coords => this.tableProps.renderableToVisualCoords(coords),
|
84
113
|
createCellCoords: (row, column) => this.tableProps.createCellCoords(row, column),
|
85
|
-
createCellRange: (highlight, from, to) => this.tableProps.createCellRange(highlight, from, to)
|
86
|
-
rowIndexMapper: () => this.tableProps.rowIndexMapper(),
|
87
|
-
columnIndexMapper: () => this.tableProps.columnIndexMapper()
|
114
|
+
createCellRange: (highlight, from, to) => this.tableProps.createCellRange(highlight, from, to)
|
88
115
|
});
|
89
|
-
/**
|
90
|
-
* The module for modifying coordinates.
|
91
|
-
*
|
92
|
-
* @type {Transformation}
|
93
|
-
*/
|
94
116
|
this.transformation = new Transformation(this.selectedRange, {
|
95
|
-
|
96
|
-
|
117
|
+
rowIndexMapper: this.tableProps.rowIndexMapper,
|
118
|
+
columnIndexMapper: this.tableProps.columnIndexMapper,
|
119
|
+
countRenderableRows: () => this.tableProps.countRenderableRows(),
|
120
|
+
countRenderableColumns: () => this.tableProps.countRenderableColumns(),
|
121
|
+
countRowHeaders: () => this.tableProps.countRowHeaders(),
|
122
|
+
countColHeaders: () => this.tableProps.countColHeaders(),
|
97
123
|
visualToRenderableCoords: coords => this.tableProps.visualToRenderableCoords(coords),
|
98
124
|
renderableToVisualCoords: coords => this.tableProps.renderableToVisualCoords(coords),
|
99
125
|
createCellCoords: (row, column) => this.tableProps.createCellCoords(row, column),
|
126
|
+
navigableHeaders: () => settings.navigableHeaders,
|
100
127
|
fixedRowsBottom: () => settings.fixedRowsBottom,
|
101
128
|
minSpareRows: () => settings.minSpareRows,
|
102
129
|
minSpareCols: () => settings.minSpareCols,
|
@@ -151,14 +178,14 @@ class Selection {
|
|
151
178
|
}
|
152
179
|
|
153
180
|
/**
|
154
|
-
* Indicate that selection process began. It sets
|
181
|
+
* Indicate that selection process began. It sets internally `.inProgress` property to `true`.
|
155
182
|
*/
|
156
183
|
begin() {
|
157
184
|
this.inProgress = true;
|
158
185
|
}
|
159
186
|
|
160
187
|
/**
|
161
|
-
* Indicate that selection process finished. It sets
|
188
|
+
* Indicate that selection process finished. It sets internally `.inProgress` property to `false`.
|
162
189
|
*/
|
163
190
|
finish() {
|
164
191
|
this.runLocalHooks('afterSelectionFinished', Array.from(this.selectedRange));
|
@@ -183,33 +210,25 @@ class Selection {
|
|
183
210
|
* the default trigger will be used.
|
184
211
|
* @param {boolean} [fragment=false] If `true`, the selection will be treated as a partial selection where the
|
185
212
|
* `setRangeEnd` method won't be called on every `setRangeStart` call.
|
213
|
+
* @param {CellCoords} [highlightCoords] If set, allows changing the coordinates of the highlight/focus cell.
|
186
214
|
*/
|
187
215
|
setRangeStart(coords, multipleSelection) {
|
188
216
|
let fragment = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
|
217
|
+
let highlightCoords = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : coords;
|
189
218
|
const isMultipleMode = this.settings.selectionMode === 'multiple';
|
190
219
|
const isMultipleSelection = isUndefined(multipleSelection) ? this.tableProps.getShortcutManager().isCtrlPressed() : multipleSelection;
|
191
|
-
const isRowNegative = coords.row < 0;
|
192
|
-
const isColumnNegative = coords.col < 0;
|
193
|
-
const selectedByCorner = isRowNegative && isColumnNegative;
|
194
220
|
// We are creating copy. We would like to modify just the start of the selection by below hook. Then original coords
|
195
221
|
// should be handled by next methods.
|
196
222
|
const coordsClone = coords.clone();
|
197
|
-
this.selectedByCorner = selectedByCorner;
|
198
223
|
this.runLocalHooks(`beforeSetRangeStart${fragment ? 'Only' : ''}`, coordsClone);
|
199
224
|
if (!isMultipleMode || isMultipleMode && !isMultipleSelection && isUndefined(multipleSelection)) {
|
200
225
|
this.selectedRange.clear();
|
201
226
|
}
|
202
|
-
this.selectedRange.add(coordsClone);
|
227
|
+
this.selectedRange.add(coordsClone).current().setHighlight(highlightCoords.clone());
|
203
228
|
if (this.getLayerLevel() === 0) {
|
204
229
|
this.selectedByRowHeader.clear();
|
205
230
|
this.selectedByColumnHeader.clear();
|
206
231
|
}
|
207
|
-
if (!selectedByCorner && isColumnNegative) {
|
208
|
-
this.selectedByRowHeader.add(this.getLayerLevel());
|
209
|
-
}
|
210
|
-
if (!selectedByCorner && isRowNegative) {
|
211
|
-
this.selectedByColumnHeader.add(this.getLayerLevel());
|
212
|
-
}
|
213
232
|
if (!fragment) {
|
214
233
|
this.setRangeEnd(coords);
|
215
234
|
}
|
@@ -222,9 +241,11 @@ class Selection {
|
|
222
241
|
* @param {boolean} [multipleSelection] If `true`, selection will be worked in 'multiple' mode. This option works
|
223
242
|
* only when 'selectionMode' is set as 'multiple'. If the argument is not defined
|
224
243
|
* the default trigger will be used.
|
244
|
+
* @param {CellCoords} [highlightCoords] If set, allows changing the coordinates of the highlight/focus cell.
|
225
245
|
*/
|
226
246
|
setRangeStartOnly(coords, multipleSelection) {
|
227
|
-
|
247
|
+
let highlightCoords = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : coords;
|
248
|
+
this.setRangeStart(coords, multipleSelection, true, highlightCoords);
|
228
249
|
}
|
229
250
|
|
230
251
|
/**
|
@@ -236,21 +257,40 @@ class Selection {
|
|
236
257
|
if (this.selectedRange.isEmpty()) {
|
237
258
|
return;
|
238
259
|
}
|
239
|
-
|
240
|
-
// We are creating copy. We would like to modify just the end of the selection by below hook. Then original coords
|
241
|
-
// should be handled by next methods.
|
242
260
|
const coordsClone = coords.clone();
|
261
|
+
const countRows = this.tableProps.countRows();
|
262
|
+
const countCols = this.tableProps.countCols();
|
263
|
+
const isSingle = this.selectedRange.current().clone().setTo(coords).isSingleHeader();
|
264
|
+
|
265
|
+
// Ignore processing the end range when the header selection starts overlapping the corner and
|
266
|
+
// the selection is not a single header highlight.
|
267
|
+
if ((countRows > 0 || countCols > 0) && (countRows === 0 && coordsClone.col < 0 && !isSingle || countCols === 0 && coordsClone.row < 0 && !isSingle)) {
|
268
|
+
return;
|
269
|
+
}
|
243
270
|
this.runLocalHooks('beforeSetRangeEnd', coordsClone);
|
244
271
|
this.begin();
|
245
272
|
const cellRange = this.selectedRange.current();
|
246
|
-
if (this.settings.
|
247
|
-
cellRange.
|
273
|
+
if (!this.settings.navigableHeaders) {
|
274
|
+
cellRange.highlight.normalize();
|
275
|
+
}
|
276
|
+
if (this.settings.selectionMode === 'single') {
|
277
|
+
cellRange.setFrom(cellRange.highlight);
|
278
|
+
cellRange.setTo(cellRange.highlight);
|
279
|
+
} else {
|
280
|
+
cellRange.setTo(coordsClone);
|
248
281
|
}
|
249
282
|
|
250
|
-
//
|
251
|
-
|
252
|
-
|
253
|
-
|
283
|
+
// Prevent creating "area" selection that overlaps headers.
|
284
|
+
if (countRows > 0 && countCols > 0) {
|
285
|
+
if (!this.settings.navigableHeaders || this.settings.navigableHeaders && !cellRange.isSingleHeader()) {
|
286
|
+
cellRange.to.normalize();
|
287
|
+
}
|
288
|
+
}
|
289
|
+
this.runLocalHooks('beforeHighlightSet');
|
290
|
+
const focusHighlight = this.highlight.getFocus();
|
291
|
+
focusHighlight.clear();
|
292
|
+
if (this.highlight.isEnabledFor(FOCUS_TYPE, cellRange.highlight)) {
|
293
|
+
focusHighlight.add(this.selectedRange.current().highlight).commit().syncWith(cellRange);
|
254
294
|
}
|
255
295
|
const layerLevel = this.getLayerLevel();
|
256
296
|
|
@@ -258,69 +298,80 @@ class Selection {
|
|
258
298
|
// indication that the new selection is performing.
|
259
299
|
if (layerLevel < this.highlight.layerLevel) {
|
260
300
|
arrayEach(this.highlight.getAreas(), highlight => void highlight.clear());
|
261
|
-
arrayEach(this.highlight.
|
262
|
-
arrayEach(this.highlight.
|
301
|
+
arrayEach(this.highlight.getLayeredAreas(), highlight => void highlight.clear());
|
302
|
+
arrayEach(this.highlight.getRowHeaders(), highlight => void highlight.clear());
|
303
|
+
arrayEach(this.highlight.getColumnHeaders(), highlight => void highlight.clear());
|
304
|
+
arrayEach(this.highlight.getActiveRowHeaders(), highlight => void highlight.clear());
|
305
|
+
arrayEach(this.highlight.getActiveColumnHeaders(), highlight => void highlight.clear());
|
306
|
+
arrayEach(this.highlight.getActiveCornerHeaders(), highlight => void highlight.clear());
|
307
|
+
arrayEach(this.highlight.getRowHighlights(), highlight => void highlight.clear());
|
308
|
+
arrayEach(this.highlight.getColumnHighlights(), highlight => void highlight.clear());
|
263
309
|
}
|
264
310
|
this.highlight.useLayerLevel(layerLevel);
|
265
|
-
const areaHighlight = this.highlight.
|
266
|
-
const
|
267
|
-
const
|
311
|
+
const areaHighlight = this.highlight.createArea();
|
312
|
+
const layeredAreaHighlight = this.highlight.createLayeredArea();
|
313
|
+
const rowHeaderHighlight = this.highlight.createRowHeader();
|
314
|
+
const columnHeaderHighlight = this.highlight.createColumnHeader();
|
315
|
+
const activeRowHeaderHighlight = this.highlight.createActiveRowHeader();
|
316
|
+
const activeColumnHeaderHighlight = this.highlight.createActiveColumnHeader();
|
317
|
+
const activeCornerHeaderHighlight = this.highlight.createActiveCornerHeader();
|
318
|
+
const rowHighlight = this.highlight.createRowHighlight();
|
319
|
+
const columnHighlight = this.highlight.createColumnHighlight();
|
268
320
|
areaHighlight.clear();
|
269
|
-
|
270
|
-
|
321
|
+
layeredAreaHighlight.clear();
|
322
|
+
rowHeaderHighlight.clear();
|
323
|
+
columnHeaderHighlight.clear();
|
324
|
+
activeRowHeaderHighlight.clear();
|
325
|
+
activeColumnHeaderHighlight.clear();
|
326
|
+
activeCornerHeaderHighlight.clear();
|
327
|
+
rowHighlight.clear();
|
328
|
+
columnHighlight.clear();
|
271
329
|
if (this.highlight.isEnabledFor(AREA_TYPE, cellRange.highlight) && (this.isMultiple() || layerLevel >= 1)) {
|
272
330
|
areaHighlight.add(cellRange.from).add(cellRange.to).commit();
|
331
|
+
layeredAreaHighlight.add(cellRange.from).add(cellRange.to).commit();
|
273
332
|
if (layerLevel === 1) {
|
274
333
|
// For single cell selection in the same layer, we do not create area selection to prevent blue background.
|
275
334
|
// When non-consecutive selection is performed we have to add that missing area selection to the previous layer
|
276
335
|
// based on previous coordinates. It only occurs when the previous selection wasn't select multiple cells.
|
277
336
|
const previousRange = this.selectedRange.previous();
|
278
|
-
this.highlight.useLayerLevel(layerLevel - 1)
|
337
|
+
this.highlight.useLayerLevel(layerLevel - 1);
|
338
|
+
this.highlight.createArea().add(previousRange.from).commit()
|
339
|
+
// Range may start with hidden indexes. Commit would not found start point (as we add just the `from` coords).
|
340
|
+
.syncWith(previousRange);
|
341
|
+
this.highlight.createLayeredArea().add(previousRange.from).commit()
|
279
342
|
// Range may start with hidden indexes. Commit would not found start point (as we add just the `from` coords).
|
280
343
|
.syncWith(previousRange);
|
281
344
|
this.highlight.useLayerLevel(layerLevel);
|
282
345
|
}
|
283
346
|
}
|
284
347
|
if (this.highlight.isEnabledFor(HEADER_TYPE, cellRange.highlight)) {
|
285
|
-
|
286
|
-
|
287
|
-
|
288
|
-
|
289
|
-
|
290
|
-
|
291
|
-
|
292
|
-
|
293
|
-
|
294
|
-
|
295
|
-
|
296
|
-
|
297
|
-
|
298
|
-
|
299
|
-
|
300
|
-
}
|
301
|
-
if (this.settings.selectionMode === 'single') {
|
302
|
-
if (this.isSelectedByAnyHeader()) {
|
303
|
-
headerCellRange.from.normalize();
|
348
|
+
if (!cellRange.isSingleHeader()) {
|
349
|
+
const rowCoordsFrom = this.tableProps.createCellCoords(Math.max(cellRange.from.row, 0), -1);
|
350
|
+
const rowCoordsTo = this.tableProps.createCellCoords(cellRange.to.row, -1);
|
351
|
+
const columnCoordsFrom = this.tableProps.createCellCoords(-1, Math.max(cellRange.from.col, 0));
|
352
|
+
const columnCoordsTo = this.tableProps.createCellCoords(-1, cellRange.to.col);
|
353
|
+
if (this.settings.selectionMode === 'single') {
|
354
|
+
rowHeaderHighlight.add(rowCoordsFrom).commit();
|
355
|
+
columnHeaderHighlight.add(columnCoordsFrom).commit();
|
356
|
+
rowHighlight.add(rowCoordsFrom).commit();
|
357
|
+
columnHighlight.add(columnCoordsFrom).commit();
|
358
|
+
} else {
|
359
|
+
rowHeaderHighlight.add(rowCoordsFrom).add(rowCoordsTo).commit();
|
360
|
+
columnHeaderHighlight.add(columnCoordsFrom).add(columnCoordsTo).commit();
|
361
|
+
rowHighlight.add(rowCoordsFrom).add(rowCoordsTo).commit();
|
362
|
+
columnHighlight.add(columnCoordsFrom).add(columnCoordsTo).commit();
|
304
363
|
}
|
305
|
-
headerHighlight.add(headerCellRange.from).commit();
|
306
|
-
} else {
|
307
|
-
headerHighlight.add(headerCellRange.from).add(headerCellRange.to).commit();
|
308
364
|
}
|
309
|
-
|
310
|
-
|
311
|
-
|
312
|
-
|
313
|
-
if (isRowSelected) {
|
314
|
-
activeHeaderHighlight.add(this.tableProps.createCellCoords(cellRange.from.row, -1)).add(this.tableProps.createCellCoords(cellRange.to.row, -1)).commit();
|
315
|
-
}
|
365
|
+
const highlightRowHeaders = !_classPrivateFieldGet(this, _disableHeadersHighlight) && this.isEntireRowSelected() && (countCols > 0 && countCols === cellRange.getWidth() || countCols === 0 && this.isSelectedByRowHeader());
|
366
|
+
const highlightColumnHeaders = !_classPrivateFieldGet(this, _disableHeadersHighlight) && this.isEntireColumnSelected() && (countRows > 0 && countRows === cellRange.getHeight() || countRows === 0 && this.isSelectedByColumnHeader());
|
367
|
+
if (highlightRowHeaders) {
|
368
|
+
activeRowHeaderHighlight.add(this.tableProps.createCellCoords(Math.max(cellRange.from.row, 0), Math.min(-this.tableProps.countRowHeaders(), -1))).add(this.tableProps.createCellCoords(Math.max(cellRange.to.row, 0), -1)).commit();
|
316
369
|
}
|
317
|
-
if (
|
318
|
-
|
319
|
-
|
320
|
-
|
321
|
-
|
322
|
-
activeHeaderHighlight.add(this.tableProps.createCellCoords(-1, cellRange.from.col)).add(this.tableProps.createCellCoords(-1, cellRange.to.col)).commit();
|
323
|
-
}
|
370
|
+
if (highlightColumnHeaders) {
|
371
|
+
activeColumnHeaderHighlight.add(this.tableProps.createCellCoords(Math.min(-this.tableProps.countColHeaders(), -1), Math.max(cellRange.from.col, 0))).add(this.tableProps.createCellCoords(-1, Math.max(cellRange.to.col, 0))).commit();
|
372
|
+
}
|
373
|
+
if (highlightRowHeaders && highlightColumnHeaders) {
|
374
|
+
activeCornerHeaderHighlight.add(this.tableProps.createCellCoords(-this.tableProps.countColHeaders(), -this.tableProps.countRowHeaders())).add(this.tableProps.createCellCoords(-1, -1)).commit();
|
324
375
|
}
|
325
376
|
}
|
326
377
|
this.runLocalHooks('afterSetRangeEnd', coords);
|
@@ -343,12 +394,12 @@ class Selection {
|
|
343
394
|
*
|
344
395
|
* @param {number} rowDelta Rows number to move, value can be passed as negative number.
|
345
396
|
* @param {number} colDelta Columns number to move, value can be passed as negative number.
|
346
|
-
* @param {boolean} [
|
347
|
-
*
|
397
|
+
* @param {boolean} [createMissingRecords=false] If `true` the new rows/columns will be created if necessary.
|
398
|
+
* Otherwise, row/column will be created according to `minSpareRows/minSpareCols` settings of Handsontable.
|
348
399
|
*/
|
349
400
|
transformStart(rowDelta, colDelta) {
|
350
|
-
let
|
351
|
-
this.setRangeStart(this.transformation.transformStart(rowDelta, colDelta,
|
401
|
+
let createMissingRecords = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
|
402
|
+
this.setRangeStart(this.transformation.transformStart(rowDelta, colDelta, createMissingRecords));
|
352
403
|
}
|
353
404
|
|
354
405
|
/**
|
@@ -389,7 +440,7 @@ class Selection {
|
|
389
440
|
*/
|
390
441
|
isSelectedByRowHeader() {
|
391
442
|
let layerLevel = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : this.getLayerLevel();
|
392
|
-
return !this.isSelectedByCorner(layerLevel) && this.
|
443
|
+
return !this.isSelectedByCorner(layerLevel) && (layerLevel === -1 ? this.selectedByRowHeader.size > 0 : this.selectedByRowHeader.has(layerLevel));
|
393
444
|
}
|
394
445
|
|
395
446
|
/**
|
@@ -401,7 +452,19 @@ class Selection {
|
|
401
452
|
*/
|
402
453
|
isEntireRowSelected() {
|
403
454
|
let layerLevel = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : this.getLayerLevel();
|
404
|
-
|
455
|
+
const tester = range => {
|
456
|
+
const {
|
457
|
+
col
|
458
|
+
} = range.getOuterTopStartCorner();
|
459
|
+
const rowHeaders = this.tableProps.countRowHeaders();
|
460
|
+
const countCols = this.tableProps.countCols();
|
461
|
+
return (rowHeaders > 0 && col < 0 || rowHeaders === 0) && range.getWidth() === countCols;
|
462
|
+
};
|
463
|
+
if (layerLevel === -1) {
|
464
|
+
return Array.from(this.selectedRange).some(range => tester(range));
|
465
|
+
}
|
466
|
+
const range = this.selectedRange.peekByIndex(layerLevel);
|
467
|
+
return range ? tester(range) : false;
|
405
468
|
}
|
406
469
|
|
407
470
|
/**
|
@@ -414,7 +477,7 @@ class Selection {
|
|
414
477
|
*/
|
415
478
|
isSelectedByColumnHeader() {
|
416
479
|
let layerLevel = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : this.getLayerLevel();
|
417
|
-
return !this.isSelectedByCorner() && this.
|
480
|
+
return !this.isSelectedByCorner() && (layerLevel === -1 ? this.selectedByColumnHeader.size > 0 : this.selectedByColumnHeader.has(layerLevel));
|
418
481
|
}
|
419
482
|
|
420
483
|
/**
|
@@ -426,7 +489,19 @@ class Selection {
|
|
426
489
|
*/
|
427
490
|
isEntireColumnSelected() {
|
428
491
|
let layerLevel = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : this.getLayerLevel();
|
429
|
-
|
492
|
+
const tester = range => {
|
493
|
+
const {
|
494
|
+
row
|
495
|
+
} = range.getOuterTopStartCorner();
|
496
|
+
const colHeaders = this.tableProps.countColHeaders();
|
497
|
+
const countRows = this.tableProps.countRows();
|
498
|
+
return (colHeaders > 0 && row < 0 || colHeaders === 0) && range.getHeight() === countRows;
|
499
|
+
};
|
500
|
+
if (layerLevel === -1) {
|
501
|
+
return Array.from(this.selectedRange).some(range => tester(range));
|
502
|
+
}
|
503
|
+
const range = this.selectedRange.peekByIndex(layerLevel);
|
504
|
+
return range ? tester(range) : false;
|
430
505
|
}
|
431
506
|
|
432
507
|
/**
|
@@ -444,7 +519,7 @@ class Selection {
|
|
444
519
|
* @returns {boolean}
|
445
520
|
*/
|
446
521
|
isSelectedByCorner() {
|
447
|
-
return this.
|
522
|
+
return this.selectedByColumnHeader.has(this.getLayerLevel()) && this.selectedByRowHeader.has(this.getLayerLevel());
|
448
523
|
}
|
449
524
|
|
450
525
|
/**
|
@@ -503,31 +578,61 @@ class Selection {
|
|
503
578
|
}
|
504
579
|
|
505
580
|
/**
|
506
|
-
*
|
581
|
+
* Selects all cells and headers.
|
507
582
|
*
|
508
|
-
* @param {boolean} [includeRowHeaders=false] `true` If the selection should include the row headers,
|
509
|
-
* otherwise.
|
510
|
-
* @param {boolean} [includeColumnHeaders=false] `true` If the selection should include the column
|
511
|
-
* otherwise.
|
583
|
+
* @param {boolean} [includeRowHeaders=false] `true` If the selection should include the row headers,
|
584
|
+
* `false` otherwise.
|
585
|
+
* @param {boolean} [includeColumnHeaders=false] `true` If the selection should include the column
|
586
|
+
* headers, `false` otherwise.
|
587
|
+
* @param {object} [options] Additional object with options.
|
588
|
+
* @param {{row: number, col: number} | boolean} [options.focusPosition] The argument allows changing the cell/header
|
589
|
+
* focus position. The value takes an object with a `row` and `col` properties from -N to N, where
|
590
|
+
* negative values point to the headers and positive values point to the cell range. If `false`, the focus
|
591
|
+
* position won't be changed.
|
592
|
+
* @param {boolean} [options.disableHeadersHighlight] If `true`, disables highlighting the headers even when
|
593
|
+
* the logical coordinates points on them.
|
512
594
|
*/
|
513
595
|
selectAll() {
|
596
|
+
var _this$getSelectedRang;
|
514
597
|
let includeRowHeaders = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
|
515
598
|
let includeColumnHeaders = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
|
599
|
+
let options = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {
|
600
|
+
focusPosition: false,
|
601
|
+
disableHeadersHighlight: false
|
602
|
+
};
|
516
603
|
const nrOfRows = this.tableProps.countRows();
|
517
604
|
const nrOfColumns = this.tableProps.countCols();
|
605
|
+
const countRowHeaders = this.tableProps.countRowHeaders();
|
606
|
+
const countColHeaders = this.tableProps.countColHeaders();
|
607
|
+
const rowFrom = includeColumnHeaders ? -countColHeaders : 0;
|
608
|
+
const columnFrom = includeRowHeaders ? -countRowHeaders : 0;
|
518
609
|
|
519
610
|
// We can't select cells when there is no data.
|
520
|
-
if (
|
611
|
+
if (rowFrom === 0 && columnFrom === 0 && (nrOfRows === 0 || nrOfColumns === 0)) {
|
521
612
|
return;
|
522
613
|
}
|
523
|
-
|
614
|
+
let highlight = (_this$getSelectedRang = this.getSelectedRange().current()) === null || _this$getSelectedRang === void 0 ? void 0 : _this$getSelectedRang.highlight;
|
615
|
+
const {
|
616
|
+
focusPosition,
|
617
|
+
disableHeadersHighlight
|
618
|
+
} = options;
|
619
|
+
_classPrivateFieldSet(this, _disableHeadersHighlight, disableHeadersHighlight);
|
620
|
+
if (focusPosition && Number.isInteger(focusPosition === null || focusPosition === void 0 ? void 0 : focusPosition.row) && Number.isInteger(focusPosition === null || focusPosition === void 0 ? void 0 : focusPosition.col)) {
|
621
|
+
highlight = this.tableProps.createCellCoords(clamp(focusPosition.row, rowFrom, nrOfRows - 1), clamp(focusPosition.col, columnFrom, nrOfColumns - 1));
|
622
|
+
}
|
623
|
+
const startCoords = this.tableProps.createCellCoords(rowFrom, columnFrom);
|
524
624
|
const endCoords = this.tableProps.createCellCoords(nrOfRows - 1, nrOfColumns - 1);
|
525
625
|
this.clear();
|
526
|
-
this.setRangeStartOnly(startCoords);
|
527
|
-
|
528
|
-
|
626
|
+
this.setRangeStartOnly(startCoords, void 0, highlight);
|
627
|
+
if (columnFrom < 0) {
|
628
|
+
this.selectedByRowHeader.add(this.getLayerLevel());
|
629
|
+
}
|
630
|
+
if (rowFrom < 0) {
|
631
|
+
this.selectedByColumnHeader.add(this.getLayerLevel());
|
632
|
+
}
|
529
633
|
this.setRangeEnd(endCoords);
|
530
634
|
this.finish();
|
635
|
+
_classPrivateFieldSet(this, _disableHeadersHighlight, false);
|
531
636
|
}
|
532
637
|
|
533
638
|
/**
|
@@ -552,21 +657,29 @@ class Selection {
|
|
552
657
|
propToCol: prop => this.tableProps.propToCol(prop),
|
553
658
|
keepDirection: true
|
554
659
|
});
|
555
|
-
const
|
556
|
-
const
|
660
|
+
const navigableHeaders = this.settings.navigableHeaders;
|
661
|
+
const tableParams = {
|
662
|
+
countRows: this.tableProps.countRows(),
|
663
|
+
countCols: this.tableProps.countCols(),
|
664
|
+
countRowHeaders: navigableHeaders ? this.tableProps.countRowHeaders() : 0,
|
665
|
+
countColHeaders: navigableHeaders ? this.tableProps.countColHeaders() : 0
|
666
|
+
};
|
557
667
|
|
558
668
|
// Check if every layer of the coordinates are valid.
|
559
669
|
const isValid = !selectionRanges.some(selection => {
|
560
|
-
const
|
561
|
-
const
|
562
|
-
return !
|
670
|
+
const cellRange = selectionSchemaNormalizer(selection);
|
671
|
+
const rangeValidity = cellRange.isValid(tableParams);
|
672
|
+
return !(rangeValidity && !cellRange.containsHeaders() || rangeValidity && cellRange.containsHeaders() && cellRange.isSingleHeader());
|
563
673
|
});
|
564
674
|
if (isValid) {
|
565
675
|
this.clear();
|
566
676
|
arrayEach(selectionRanges, selection => {
|
567
|
-
const
|
568
|
-
|
569
|
-
|
677
|
+
const {
|
678
|
+
from,
|
679
|
+
to
|
680
|
+
} = selectionSchemaNormalizer(selection);
|
681
|
+
this.setRangeStartOnly(from.clone(), false);
|
682
|
+
this.setRangeEnd(to.clone());
|
570
683
|
this.finish();
|
571
684
|
});
|
572
685
|
}
|
@@ -579,22 +692,43 @@ class Selection {
|
|
579
692
|
*
|
580
693
|
* @param {number|string} startColumn Visual column index or column property from which the selection starts.
|
581
694
|
* @param {number|string} [endColumn] Visual column index or column property from to the selection finishes.
|
582
|
-
* @param {number} [
|
583
|
-
*
|
584
|
-
*
|
695
|
+
* @param {number} [focusPosition=0] The argument allows changing the cell/header focus position.
|
696
|
+
* The value can take visual row index from -N to N, where negative values
|
697
|
+
* point to the headers and positive values point to the cell range.
|
585
698
|
* @returns {boolean} Returns `true` if selection was successful, `false` otherwise.
|
586
699
|
*/
|
587
700
|
selectColumns(startColumn) {
|
588
701
|
let endColumn = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : startColumn;
|
589
|
-
let
|
702
|
+
let focusPosition = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
|
590
703
|
const start = typeof startColumn === 'string' ? this.tableProps.propToCol(startColumn) : startColumn;
|
591
704
|
const end = typeof endColumn === 'string' ? this.tableProps.propToCol(endColumn) : endColumn;
|
592
|
-
const
|
593
|
-
const
|
594
|
-
const
|
705
|
+
const countRows = this.tableProps.countRows();
|
706
|
+
const countCols = this.tableProps.countCols();
|
707
|
+
const countColHeaders = this.tableProps.countColHeaders();
|
708
|
+
const columnHeaderLastIndex = countColHeaders === 0 ? 0 : -countColHeaders;
|
709
|
+
const fromCoords = new CellCoords(columnHeaderLastIndex, start);
|
710
|
+
const toCoords = new CellCoords(countRows - 1, end);
|
711
|
+
const isValid = new CellRange(fromCoords, fromCoords, toCoords).isValid({
|
712
|
+
countRows,
|
713
|
+
countCols,
|
714
|
+
countRowHeaders: 0,
|
715
|
+
countColHeaders
|
716
|
+
});
|
595
717
|
if (isValid) {
|
596
|
-
|
597
|
-
|
718
|
+
const fromRow = countColHeaders === 0 ? 0 : clamp(focusPosition, columnHeaderLastIndex, -1);
|
719
|
+
const toRow = countRows - 1;
|
720
|
+
const from = this.tableProps.createCellCoords(fromRow, start);
|
721
|
+
const to = this.tableProps.createCellCoords(toRow, end);
|
722
|
+
const highlight = this.tableProps.createCellCoords(clamp(focusPosition, columnHeaderLastIndex, countRows - 1), start);
|
723
|
+
this.runLocalHooks('beforeSelectColumns', from, to, highlight);
|
724
|
+
|
725
|
+
// disallow modifying row axis for that hooks
|
726
|
+
from.row = fromRow;
|
727
|
+
to.row = toRow;
|
728
|
+
this.setRangeStartOnly(from, void 0, highlight);
|
729
|
+
this.selectedByColumnHeader.add(this.getLayerLevel());
|
730
|
+
this.setRangeEnd(to);
|
731
|
+
this.runLocalHooks('afterSelectColumns', from, to, highlight);
|
598
732
|
this.finish();
|
599
733
|
}
|
600
734
|
return isValid;
|
@@ -605,20 +739,41 @@ class Selection {
|
|
605
739
|
*
|
606
740
|
* @param {number} startRow Visual row index from which the selection starts.
|
607
741
|
* @param {number} [endRow] Visual row index from to the selection finishes.
|
608
|
-
* @param {number} [
|
609
|
-
*
|
610
|
-
*
|
742
|
+
* @param {number} [focusPosition=0] The argument allows changing the cell/header focus position.
|
743
|
+
* The value can take visual column index from -N to N, where negative values
|
744
|
+
* point to the headers and positive values point to the cell range.
|
611
745
|
* @returns {boolean} Returns `true` if selection was successful, `false` otherwise.
|
612
746
|
*/
|
613
747
|
selectRows(startRow) {
|
614
748
|
let endRow = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : startRow;
|
615
|
-
let
|
616
|
-
const
|
617
|
-
const
|
618
|
-
const
|
749
|
+
let focusPosition = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
|
750
|
+
const countRows = this.tableProps.countRows();
|
751
|
+
const countCols = this.tableProps.countCols();
|
752
|
+
const countRowHeaders = this.tableProps.countRowHeaders();
|
753
|
+
const rowHeaderLastIndex = countRowHeaders === 0 ? 0 : -countRowHeaders;
|
754
|
+
const fromCoords = new CellCoords(startRow, rowHeaderLastIndex);
|
755
|
+
const toCoords = new CellCoords(endRow, countCols - 1);
|
756
|
+
const isValid = new CellRange(fromCoords, fromCoords, toCoords).isValid({
|
757
|
+
countRows,
|
758
|
+
countCols,
|
759
|
+
countRowHeaders,
|
760
|
+
countColHeaders: 0
|
761
|
+
});
|
619
762
|
if (isValid) {
|
620
|
-
|
621
|
-
|
763
|
+
const fromColumn = countRowHeaders === 0 ? 0 : clamp(focusPosition, rowHeaderLastIndex, -1);
|
764
|
+
const toColumn = countCols - 1;
|
765
|
+
const from = this.tableProps.createCellCoords(startRow, fromColumn);
|
766
|
+
const to = this.tableProps.createCellCoords(endRow, toColumn);
|
767
|
+
const highlight = this.tableProps.createCellCoords(startRow, clamp(focusPosition, rowHeaderLastIndex, countCols - 1));
|
768
|
+
this.runLocalHooks('beforeSelectRows', from, to, highlight);
|
769
|
+
|
770
|
+
// disallow modifying column axis for that hooks
|
771
|
+
from.col = fromColumn;
|
772
|
+
to.col = toColumn;
|
773
|
+
this.setRangeStartOnly(from, void 0, highlight);
|
774
|
+
this.selectedByRowHeader.add(this.getLayerLevel());
|
775
|
+
this.setRangeEnd(to);
|
776
|
+
this.runLocalHooks('afterSelectRows', from, to, highlight);
|
622
777
|
this.finish();
|
623
778
|
}
|
624
779
|
return isValid;
|
@@ -635,19 +790,31 @@ class Selection {
|
|
635
790
|
if (!this.isSelected()) {
|
636
791
|
return;
|
637
792
|
}
|
638
|
-
const
|
793
|
+
const focusHighlight = this.highlight.getFocus();
|
639
794
|
const currentLayer = this.getLayerLevel();
|
640
|
-
|
795
|
+
focusHighlight.commit().syncWith(this.selectedRange.current());
|
641
796
|
|
642
797
|
// Rewriting rendered ranges going through all layers.
|
643
798
|
for (let layerLevel = 0; layerLevel < this.selectedRange.size(); layerLevel += 1) {
|
644
799
|
this.highlight.useLayerLevel(layerLevel);
|
645
|
-
const areaHighlight = this.highlight.
|
646
|
-
const
|
647
|
-
const
|
800
|
+
const areaHighlight = this.highlight.createArea();
|
801
|
+
const areaLayeredHighlight = this.highlight.createLayeredArea();
|
802
|
+
const rowHeaderHighlight = this.highlight.createRowHeader();
|
803
|
+
const columnHeaderHighlight = this.highlight.createColumnHeader();
|
804
|
+
const activeRowHeaderHighlight = this.highlight.createActiveRowHeader();
|
805
|
+
const activeColumnHeaderHighlight = this.highlight.createActiveColumnHeader();
|
806
|
+
const activeCornerHeaderHighlight = this.highlight.createActiveCornerHeader();
|
807
|
+
const rowHighlight = this.highlight.createRowHighlight();
|
808
|
+
const columnHighlight = this.highlight.createColumnHighlight();
|
648
809
|
areaHighlight.commit();
|
649
|
-
|
650
|
-
|
810
|
+
areaLayeredHighlight.commit();
|
811
|
+
rowHeaderHighlight.commit();
|
812
|
+
columnHeaderHighlight.commit();
|
813
|
+
activeRowHeaderHighlight.commit();
|
814
|
+
activeColumnHeaderHighlight.commit();
|
815
|
+
activeCornerHeaderHighlight.commit();
|
816
|
+
rowHighlight.commit();
|
817
|
+
columnHighlight.commit();
|
651
818
|
}
|
652
819
|
|
653
820
|
// Reverting starting layer for the Highlight.
|