diff --git a/examples/vite-demo-vanilla-bundle/src/examples/example19.html b/examples/vite-demo-vanilla-bundle/src/examples/example19.html
index 2e9babcf4..c77157768 100644
--- a/examples/vite-demo-vanilla-bundle/src/examples/example19.html
+++ b/examples/vite-demo-vanilla-bundle/src/examples/example19.html
@@ -21,7 +21,8 @@
Grid - using enableExcelCopyBuffer
which uses SlickCellSelectionModel
The complete first row and the cells C - E of the second row are not allowing to paste values.
Additionally the columns are configured to exportWithFormatter
and a custom formatter that renders the cells coordinates or value if available.
- When selecting one or more cells and pressing CTRL + C, the ExcelCopyBuffer will be filled with the formatter outputs of the selected cells.
+ When selecting one or more cells and pressing CTRL + C, the ExcelCopyBuffer will be filled with the formatter outputs of the selected cells. This also applies if the cells editor is already open
+due to use of copyActiveEditorCell
{
// deny the whole first row and the cells C-E of the second row
return !(args.row === 0 || (args.row === 1 && args.cell > 2 && args.cell < 6));
- }
+ },
+ copyActiveEditorCell: true,
}
};
}
@@ -136,10 +147,13 @@ export default class Example19 {
getData(itemCount: number) {
// mock a dataset
const datasetTmp: any[] = [];
+ const start = new Date(2000,0,1);
+ const end = new Date();
for (let i = 0; i < itemCount; i++) {
const d: any = (datasetTmp[i] = {});
d['id'] = i;
d['num'] = i;
+ d['approvalDate'] = new Date(start.getTime() + Math.random() * (end.getTime() - start.getTime()));
}
return datasetTmp;
diff --git a/packages/common/src/editors/dateEditor.ts b/packages/common/src/editors/dateEditor.ts
index 48a548188..ac5e62c11 100644
--- a/packages/common/src/editors/dateEditor.ts
+++ b/packages/common/src/editors/dateEditor.ts
@@ -201,7 +201,7 @@ export class DateEditor implements Editor {
});
}
- setTimeout(() => {
+ queueMicrotask(() => {
this.calendarInstance = new VanillaCalendar(this._inputElm, this._pickerMergedOptions);
this.calendarInstance.init();
if (!compositeEditorOptions) {
@@ -222,14 +222,16 @@ export class DateEditor implements Editor {
}
destroy() {
- this.hide();
- this._bindEventService.unbindAll();
- this.calendarInstance?.destroy();
+ queueMicrotask(() => {
+ this.hide();
+ this.calendarInstance?.destroy();
+ emptyElement(this._editorInputGroupElm);
+ emptyElement(this._inputElm);
+ this._editorInputGroupElm?.remove();
+ this._inputElm?.remove();
+ });
- emptyElement(this._editorInputGroupElm);
- emptyElement(this._inputElm);
- this._editorInputGroupElm?.remove();
- this._inputElm?.remove();
+ this._bindEventService.unbindAll();
}
clear() {
diff --git a/packages/common/src/extensions/slickCellExcelCopyManager.ts b/packages/common/src/extensions/slickCellExcelCopyManager.ts
index 2a4a141d9..cda507dcf 100644
--- a/packages/common/src/extensions/slickCellExcelCopyManager.ts
+++ b/packages/common/src/extensions/slickCellExcelCopyManager.ts
@@ -147,8 +147,9 @@ export class SlickCellExcelCopyManager {
// to decide if we evaluate the Formatter, we will use the same flag from Export which is "exportWithFormatter"
const activeCell = this._grid.getActiveCell();
const isActiveEditorCurrentCell = this._grid.getCellEditor() && activeCell?.row === row && activeCell?.cell === cell;
+ const copyActiveEditorCell = this.addonOptions?.copyActiveEditorCell || false;
- if (!this.gridOptions.editable || !columnDef.editor || !isActiveEditorCurrentCell) {
+ if (!this.gridOptions.editable || !columnDef.editor || !isActiveEditorCurrentCell || copyActiveEditorCell) {
const isEvaluatingFormatter = (columnDef.exportWithFormatter !== undefined) ? columnDef.exportWithFormatter : (this.gridOptions.textExportOptions?.exportWithFormatter);
if (columnDef.formatter && isEvaluatingFormatter) {
const formattedOutput = columnDef.formatter(row, cell, item[columnDef.field], columnDef, item, this._grid);
diff --git a/packages/common/src/extensions/slickCellExternalCopyManager.ts b/packages/common/src/extensions/slickCellExternalCopyManager.ts
index 9d98f691a..2f23ff5c4 100644
--- a/packages/common/src/extensions/slickCellExternalCopyManager.ts
+++ b/packages/common/src/extensions/slickCellExternalCopyManager.ts
@@ -157,7 +157,10 @@ export class SlickCellExternalCopyManager {
setDataItemValueForColumn(item: any, columnDef: Column, value: any): any | void {
if (!columnDef?.denyPaste) {
if (this._addonOptions.dataItemColumnValueSetter) {
- return this._addonOptions.dataItemColumnValueSetter(item, columnDef, value);
+ const setterResult = this._addonOptions.dataItemColumnValueSetter(item, columnDef, value);
+ if (setterResult !== true) {
+ return setterResult;
+ }
}
// if a custom setter is not defined, we call applyValue of the editor to unserialize
diff --git a/packages/common/src/interfaces/excelCopyBufferOption.interface.ts b/packages/common/src/interfaces/excelCopyBufferOption.interface.ts
index 5cc7d89fa..9fc69eff1 100644
--- a/packages/common/src/interfaces/excelCopyBufferOption.interface.ts
+++ b/packages/common/src/interfaces/excelCopyBufferOption.interface.ts
@@ -16,11 +16,18 @@ export interface ExcelCopyBufferOption {
/** defaults to "copy-manager", sets the layer key for setting css values of copied cells. */
copiedCellStyleLayerKey?: string;
+ /**
+ * should copy the cells value on copy shortcut even when the editor is opened
+ *
+ * **NOTE**: affects only the default {@link ExcelCopyBufferOption#dataItemColumnValueExtractor}
+ * */
+ copyActiveEditorCell?: boolean;
+
/** option to specify a custom column value extractor function */
dataItemColumnValueExtractor?: (item: any, columnDef: Column, row?: number, cell?: number) => string | HTMLElement | DocumentFragment | FormatterResultWithHtml | FormatterResultWithText | null;
- /** option to specify a custom column value setter function */
- dataItemColumnValueSetter?: (item: any, columnDef: Column, value: any) => string | FormatterResultWithHtml | FormatterResultWithText | null;
+ /** option to specify a custom column value setter function. Return true if default logic should continue to evaluate */
+ dataItemColumnValueSetter?: (item: any, columnDef: Column, value: any) => string | FormatterResultWithHtml | FormatterResultWithText | null | true;
/** option to specify a custom handler for paste actions */
clipboardCommandHandler?: (editCommand: any) => void;
diff --git a/test/cypress/e2e/example19.cy.ts b/test/cypress/e2e/example19.cy.ts
index 98bd53eee..c2c39b057 100644
--- a/test/cypress/e2e/example19.cy.ts
+++ b/test/cypress/e2e/example19.cy.ts
@@ -1,6 +1,6 @@
describe('Example 19 - ExcelCopyBuffer with Cell Selection', () => {
const titles = [
- '', 'A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J', 'K', 'L',
+ '', 'Approval Date', 'A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J', 'K', 'L',
'M', 'N', 'O', 'P', 'Q', 'R', 'S', 'T', 'U', 'V', 'W', 'X', 'Y',
'Z', 'AA', 'AB', 'AC', 'AD', 'AE', 'AF', 'AG', 'AH', 'AI', 'AJ', 'AK'
];
@@ -16,7 +16,7 @@ describe('Example 19 - ExcelCopyBuffer with Cell Selection', () => {
.find('.slick-header-columns')
.children()
.each(($child, index) => {
- if (index < titles.length) {
+ if (index > 0 && index < titles.length) {
expect($child.text()).to.eq(titles[index]);
}
});
@@ -28,7 +28,7 @@ describe('Example 19 - ExcelCopyBuffer with Cell Selection', () => {
describe('with Pagination of size 20', () => {
it('should click on cell B14 then Ctrl+Shift+End with selection B14-CV19', () => {
- cy.getCell(14, 2, '', { parentSelector: '.grid19', rowHeight: GRID_ROW_HEIGHT })
+ cy.getCell(14, 3, '', { parentSelector: '.grid19', rowHeight: GRID_ROW_HEIGHT })
.as('cell_B14')
.click();
@@ -36,7 +36,7 @@ describe('Example 19 - ExcelCopyBuffer with Cell Selection', () => {
.type('{ctrl}{shift}{end}');
cy.get('#selectionRange')
- .should('have.text', '{"fromRow":14,"fromCell":2,"toRow":19,"toCell":100}');
+ .should('have.text', '{"fromRow":14,"fromCell":3,"toRow":19,"toCell":101}');
});
it('should click on cell CP3 then Ctrl+Shift+Home with selection A0-CP3', () => {
@@ -149,7 +149,7 @@ describe('Example 19 - ExcelCopyBuffer with Cell Selection', () => {
});
it('should click on cell E46 then Shift+End key with full row horizontal selection E46-CV46', () => {
- cy.getCell(46, 5, '', { parentSelector: '.grid19', rowHeight: GRID_ROW_HEIGHT })
+ cy.getCell(46, 6, '', { parentSelector: '.grid19', rowHeight: GRID_ROW_HEIGHT })
.as('cell_E46')
.click();
@@ -157,11 +157,11 @@ describe('Example 19 - ExcelCopyBuffer with Cell Selection', () => {
.type('{shift}{end}');
cy.get('#selectionRange')
- .should('have.text', '{"fromRow":46,"fromCell":5,"toRow":46,"toCell":100}');
+ .should('have.text', '{"fromRow":46,"fromCell":6,"toRow":46,"toCell":101}');
});
it('should click on cell CP54 then Ctrl+Shift+End keys with selection E46-CV99', () => {
- cy.getCell(54, 94, '', { parentSelector: '.grid19', rowHeight: GRID_ROW_HEIGHT })
+ cy.getCell(54, 95, '', { parentSelector: '.grid19', rowHeight: GRID_ROW_HEIGHT })
.as('cell_CP54')
.click();
@@ -169,11 +169,11 @@ describe('Example 19 - ExcelCopyBuffer with Cell Selection', () => {
.type('{ctrl}{shift}{end}');
cy.get('#selectionRange')
- .should('have.text', '{"fromRow":54,"fromCell":94,"toRow":99,"toCell":100}');
+ .should('have.text', '{"fromRow":54,"fromCell":95,"toRow":99,"toCell":101}');
});
it('should click on cell CP95 then Ctrl+Shift+Home keys with selection C0-CP95', () => {
- cy.getCell(95, 98, '', { parentSelector: '.grid19', rowHeight: GRID_ROW_HEIGHT })
+ cy.getCell(95, 99, '', { parentSelector: '.grid19', rowHeight: GRID_ROW_HEIGHT })
.as('cell_CP95')
.click();
@@ -181,7 +181,7 @@ describe('Example 19 - ExcelCopyBuffer with Cell Selection', () => {
.type('{ctrl}{shift}{home}');
cy.get('#selectionRange')
- .should('have.text', '{"fromRow":0,"fromCell":0,"toRow":95,"toCell":98}');
+ .should('have.text', '{"fromRow":0,"fromCell":0,"toRow":95,"toCell":99}');
});
it('should click on cell CR5 again then Ctrl+Home keys and expect to scroll back to cell A0 without any selection range', () => {
@@ -204,7 +204,7 @@ describe('Example 19 - ExcelCopyBuffer with Cell Selection', () => {
});
it('should click on cell B14 then Shift+End with selection B14-24', () => {
- cy.getCell(14, 2, '', { parentSelector: '.grid19', rowHeight: GRID_ROW_HEIGHT })
+ cy.getCell(14, 3, '', { parentSelector: '.grid19', rowHeight: GRID_ROW_HEIGHT })
.as('cell_B14')
.click();
@@ -212,7 +212,7 @@ describe('Example 19 - ExcelCopyBuffer with Cell Selection', () => {
.type('{shift}{end}');
cy.get('#selectionRange')
- .should('have.text', '{"fromRow":14,"fromCell":2,"toRow":14,"toCell":100}');
+ .should('have.text', '{"fromRow":14,"fromCell":3,"toRow":14,"toCell":101}');
});
it('should click on cell CS14 then Shift+Home with selection A14-CS14', () => {