From 25691d2dc0176437153900b7b191b22071e8d5e3 Mon Sep 17 00:00:00 2001 From: martinRenou Date: Thu, 11 Apr 2024 17:11:39 +0200 Subject: [PATCH 1/8] Datagrid: Add a public API to get the current viewport --- packages/datagrid/src/datagrid.ts | 66 +++++++++++++++++++++++++++++++ 1 file changed, 66 insertions(+) diff --git a/packages/datagrid/src/datagrid.ts b/packages/datagrid/src/datagrid.ts index ac3568df0..90b00e093 100644 --- a/packages/datagrid/src/datagrid.ts +++ b/packages/datagrid/src/datagrid.ts @@ -2012,6 +2012,47 @@ export class DataGrid extends Widget { } } + /** + * Get the current viewport. + * + * @returns The current viewport as row/column coordinates. + * Returns undefined if the grid is not visible. + */ + get currentViewport(): DataGrid.IBodyRegion | undefined { + let width = this.viewport.node.offsetWidth; + let height = this.viewport.node.offsetHeight; + + width = Math.round(width); + height = Math.round(height); + + if (width <= 0 || height <= 0) { + return; + } + + const contentW = this._columnSections.length - this.scrollX; + const contentH = this._rowSections.length - this.scrollY; + + const contentX = this.headerWidth; + const contentY = this.headerHeight; + + const x1 = contentX; + const y1 = contentY; + const x2 = Math.min(width - 1, contentX + contentW - 1); + const y2 = Math.min(height - 1, contentY + contentH - 1); + + const r1 = this._rowSections.indexOf(y1 - contentY + this.scrollY); + const c1 = this._columnSections.indexOf(x1 - contentX + this.scrollX); + const r2 = this._rowSections.indexOf(y2 - contentY + this.scrollY); + const c2 = this._columnSections.indexOf(x2 - contentX + this.scrollX); + + return { + r1, + r2, + c1, + c2 + }; + } + /** * A message handler invoked on an `'activate-request'` message. */ @@ -6721,6 +6762,31 @@ export namespace DataGrid { headers: 'none', warningThreshold: 1e6 }; + + /** + * + */ + export interface IBodyRegion { + /** + * First row of the region + */ + r1: number; + + /** + * Last row of the region + */ + r2: number; + + /** + * First column of the region + */ + c1: number; + + /** + * Last column of the region + */ + c2: number; + } } /** From 9301b888b9aa926cd1ec80056945ad86762d21ac Mon Sep 17 00:00:00 2001 From: martinRenou Date: Mon, 15 Apr 2024 09:23:01 +0200 Subject: [PATCH 2/8] Review --- packages/datagrid/src/datagrid.ts | 28 ++++++++++++++++------------ 1 file changed, 16 insertions(+), 12 deletions(-) diff --git a/packages/datagrid/src/datagrid.ts b/packages/datagrid/src/datagrid.ts index 90b00e093..bd5363399 100644 --- a/packages/datagrid/src/datagrid.ts +++ b/packages/datagrid/src/datagrid.ts @@ -2040,16 +2040,20 @@ export class DataGrid extends Widget { const x2 = Math.min(width - 1, contentX + contentW - 1); const y2 = Math.min(height - 1, contentY + contentH - 1); - const r1 = this._rowSections.indexOf(y1 - contentY + this.scrollY); - const c1 = this._columnSections.indexOf(x1 - contentX + this.scrollX); - const r2 = this._rowSections.indexOf(y2 - contentY + this.scrollY); - const c2 = this._columnSections.indexOf(x2 - contentX + this.scrollX); + const firstRow = this._rowSections.indexOf(y1 - contentY + this.scrollY); + const firstColumn = this._columnSections.indexOf( + x1 - contentX + this.scrollX + ); + const lastRow = this._rowSections.indexOf(y2 - contentY + this.scrollY); + const lastColumn = this._columnSections.indexOf( + x2 - contentX + this.scrollX + ); return { - r1, - r2, - c1, - c2 + firstRow, + firstColumn, + lastRow, + lastColumn }; } @@ -6770,22 +6774,22 @@ export namespace DataGrid { /** * First row of the region */ - r1: number; + firstRow: number; /** * Last row of the region */ - r2: number; + lastRow: number; /** * First column of the region */ - c1: number; + firstColumn: number; /** * Last column of the region */ - c2: number; + lastColumn: number; } } From 1ffeff6dda74e2f5d87a46d98ca790bb48fa0570 Mon Sep 17 00:00:00 2001 From: martinRenou Date: Mon, 15 Apr 2024 16:08:01 +0200 Subject: [PATCH 3/8] Add docstring --- packages/datagrid/src/datagrid.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/datagrid/src/datagrid.ts b/packages/datagrid/src/datagrid.ts index bd5363399..a5f2ea1e1 100644 --- a/packages/datagrid/src/datagrid.ts +++ b/packages/datagrid/src/datagrid.ts @@ -6768,7 +6768,7 @@ export namespace DataGrid { }; /** - * + * A body region defined by the cells boundaries using row/column coordinates */ export interface IBodyRegion { /** From 513fa31b027ae05c5c94e6859589149e6035870c Mon Sep 17 00:00:00 2001 From: martinRenou Date: Mon, 15 Apr 2024 16:14:09 +0200 Subject: [PATCH 4/8] Generate API --- review/api/datagrid.api.md | 15 +++++++++++---- 1 file changed, 11 insertions(+), 4 deletions(-) diff --git a/review/api/datagrid.api.md b/review/api/datagrid.api.md index 113e7f0a5..ea327e714 100644 --- a/review/api/datagrid.api.md +++ b/review/api/datagrid.api.md @@ -215,6 +215,7 @@ export class DataGrid extends Widget { get copyConfig(): DataGrid.CopyConfig; set copyConfig(value: DataGrid.CopyConfig); copyToClipboard(): void; + get currentViewport(): DataGrid.IBodyRegion | undefined; get dataModel(): DataModel | null; set dataModel(value: DataModel | null); get defaultSizes(): DataGrid.DefaultSizes; @@ -332,6 +333,12 @@ export namespace DataGrid { readonly width: number; readonly height: number; }; + export interface IBodyRegion { + firstColumn: number; + firstRow: number; + lastColumn: number; + lastRow: number; + } export interface IKeyHandler extends IDisposable { onKeyDown(grid: DataGrid, event: KeyboardEvent): void; } @@ -363,6 +370,10 @@ export namespace DataGrid { readonly rowHeaderWidth: number; readonly columnHeaderHeight: number; }; + const defaultStyle: Style; + const defaultSizes: DefaultSizes; + const minimumSizes: MinimumSizes; + const defaultCopyConfig: CopyConfig; export type Style = { readonly voidColor?: string; readonly backgroundColor?: string; @@ -388,10 +399,6 @@ export namespace DataGrid { readonly color3: string; }; }; - const defaultStyle: Style; - const defaultSizes: DefaultSizes; - const minimumSizes: MinimumSizes; - const defaultCopyConfig: CopyConfig; } // @public From dfab566350a8648a3b13e8c3efe20febeb4c7ba7 Mon Sep 17 00:00:00 2001 From: martinRenou Date: Mon, 15 Apr 2024 16:38:21 +0200 Subject: [PATCH 5/8] Add spec --- packages/datagrid/tests/src/datagrid.spec.ts | 19 +++++++++++++++++++ packages/datagrid/tests/src/index.spec.ts | 1 + 2 files changed, 20 insertions(+) create mode 100644 packages/datagrid/tests/src/datagrid.spec.ts diff --git a/packages/datagrid/tests/src/datagrid.spec.ts b/packages/datagrid/tests/src/datagrid.spec.ts new file mode 100644 index 000000000..d73975fb6 --- /dev/null +++ b/packages/datagrid/tests/src/datagrid.spec.ts @@ -0,0 +1,19 @@ +// Copyright (c) Jupyter Development Team. +// Distributed under the terms of the Modified BSD License. +import { expect } from 'chai'; + +import { DataGrid } from '@lumino/datagrid'; + +describe('@lumino/datagrid', () => { + let datagrid: DataGrid; + beforeEach(() => { + datagrid = new DataGrid(); + }); + describe('DataGrid', () => { + describe('currentViewport()', () => { + it('should return the viewport', () => { + expect(datagrid.currentViewport).to.be.undefined; + }); + }); + }); +}); diff --git a/packages/datagrid/tests/src/index.spec.ts b/packages/datagrid/tests/src/index.spec.ts index 414507a3e..336c50ab2 100644 --- a/packages/datagrid/tests/src/index.spec.ts +++ b/packages/datagrid/tests/src/index.spec.ts @@ -3,3 +3,4 @@ import './textrenderer.spec'; import './imagerenderer.spec'; +import './datagrid.spec'; From 87f4705323ba118d51d18ec203e5b08ee8a38926 Mon Sep 17 00:00:00 2001 From: martinRenou Date: Tue, 16 Apr 2024 09:03:33 +0200 Subject: [PATCH 6/8] Add model --- packages/datagrid/tests/src/datagrid.spec.ts | 30 +++++++++++++++++++- 1 file changed, 29 insertions(+), 1 deletion(-) diff --git a/packages/datagrid/tests/src/datagrid.spec.ts b/packages/datagrid/tests/src/datagrid.spec.ts index d73975fb6..1068b7658 100644 --- a/packages/datagrid/tests/src/datagrid.spec.ts +++ b/packages/datagrid/tests/src/datagrid.spec.ts @@ -2,13 +2,41 @@ // Distributed under the terms of the Modified BSD License. import { expect } from 'chai'; -import { DataGrid } from '@lumino/datagrid'; +import { DataGrid, DataModel } from '@lumino/datagrid'; + +class LargeDataModel extends DataModel { + rowCount(region: DataModel.RowRegion): number { + return region === 'body' ? 1_000_000_000_000 : 2; + } + + columnCount(region: DataModel.ColumnRegion): number { + return region === 'body' ? 1_000_000_000_000 : 3; + } + + data(region: DataModel.CellRegion, row: number, column: number): any { + if (region === 'row-header') { + return `R: ${row}, ${column}`; + } + if (region === 'column-header') { + return `C: ${row}, ${column}`; + } + if (region === 'corner-header') { + return `N: ${row}, ${column}`; + } + return `(${row}, ${column})`; + } +} describe('@lumino/datagrid', () => { let datagrid: DataGrid; + let model: LargeDataModel; + beforeEach(() => { datagrid = new DataGrid(); + model = new LargeDataModel(); + datagrid.dataModel = model; }); + describe('DataGrid', () => { describe('currentViewport()', () => { it('should return the viewport', () => { From 7818971cc85f1ce03e943a632f6525618d540cbf Mon Sep 17 00:00:00 2001 From: martinRenou Date: Tue, 16 Apr 2024 09:42:41 +0200 Subject: [PATCH 7/8] Proper test --- packages/datagrid/tests/src/datagrid.spec.ts | 14 +++++++++++++- 1 file changed, 13 insertions(+), 1 deletion(-) diff --git a/packages/datagrid/tests/src/datagrid.spec.ts b/packages/datagrid/tests/src/datagrid.spec.ts index 1068b7658..d1a2d7613 100644 --- a/packages/datagrid/tests/src/datagrid.spec.ts +++ b/packages/datagrid/tests/src/datagrid.spec.ts @@ -35,12 +35,24 @@ describe('@lumino/datagrid', () => { datagrid = new DataGrid(); model = new LargeDataModel(); datagrid.dataModel = model; + datagrid.viewport.node.style.height = '500px'; + datagrid.viewport.node.style.width = '500px'; + document.children[0].appendChild(datagrid.node); }); describe('DataGrid', () => { describe('currentViewport()', () => { it('should return the viewport', () => { - expect(datagrid.currentViewport).to.be.undefined; + const viewport = datagrid.currentViewport; + + if (viewport === undefined) { + throw new Error('viewport is undefined'); + } + + expect(viewport.firstRow).to.be.eq(0); + expect(viewport.firstColumn).to.be.eq(0); + expect(viewport.lastRow).to.be.eq(22); + expect(viewport.lastColumn).to.be.eq(4); }); }); }); From ec166277b598057c4212196f2b0073a4b99d3b57 Mon Sep 17 00:00:00 2001 From: martinRenou Date: Tue, 16 Apr 2024 10:53:31 +0200 Subject: [PATCH 8/8] Fix typo MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Co-authored-by: MichaƂ Krassowski <5832902+krassowski@users.noreply.github.com> --- packages/datagrid/src/datagrid.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/datagrid/src/datagrid.ts b/packages/datagrid/src/datagrid.ts index a5f2ea1e1..be2c12762 100644 --- a/packages/datagrid/src/datagrid.ts +++ b/packages/datagrid/src/datagrid.ts @@ -6768,7 +6768,7 @@ export namespace DataGrid { }; /** - * A body region defined by the cells boundaries using row/column coordinates + * A body region defined by the cells' boundaries using row/column coordinates. */ export interface IBodyRegion { /**