Introduce AsyncCellRenderer class

packages/datagrid/src/asynccellrenderer.ts

@@ -0,0 +1,52 @@
+// Copyright (c) Jupyter Development Team.
+// Distributed under the terms of the Modified BSD License.
+/*-----------------------------------------------------------------------------
+| Copyright (c) 2014-2023, Lumino Contributors
+|
+| Distributed under the terms of the BSD 3-Clause License.
+|
+| The full license is in the file LICENSE, distributed with this software.
+|----------------------------------------------------------------------------*/
+
+import { CellRenderer } from "./cellrenderer";
+import { GraphicsContext } from "./graphicscontext";
+
+/**
+ * An object which renders the cells of a data grid asynchronously.
+ *
+ * #### Notes
+ * For performance reason, the datagrid only paints cells synchronously,
+ * though if your cell renderer inherits from AsyncCellRenderer, you will
+ * be able to do some asynchronous work prior to painting the cell.
+ * See `ImageRenderer` for an example of an asynchronous renderer.
+ */
+export abstract class AsyncCellRenderer extends CellRenderer {
+
+  /**
+   * Whether the renderer is ready or not for that specific config.
+   * If it's not ready, the datagrid will paint the placeholder using `paintPlaceholder`.
+   * If it's ready, the datagrid will paint the cell synchronously using `paint`.
+   *
+   * @param config - The configuration data for the cell.
+   *
+   * @returns Whether the renderer is ready for this config or not.
+   */
+  abstract isReady(config: CellRenderer.CellConfig): boolean;
+
+  /**
+   * Do any asynchronous work prior to painting this cell config.
+   *
+   * @param config - The configuration data for the cell.
+   */
+  abstract load(config: CellRenderer.CellConfig): Promise<void>;
+
+  /**
+   * Paint the placeholder for a cell, waiting for the renderer to be ready.
+   *
+   * @param gc - The graphics context to use for drawing.
+   *
+   * @param config - The configuration data for the cell.
+   */
+  abstract paintPlaceholder(gc: GraphicsContext, config: CellRenderer.CellConfig): void;
+
+}

packages/datagrid/src/datagrid.ts

@@ -20,6 +20,8 @@ import {
 
 import { GridLayout, ScrollBar, Widget } from '@lumino/widgets';
 
+import { AsyncCellRenderer } from './asynccellrenderer';
+
 import { CellRenderer } from './cellrenderer';
 
 import { DataModel, MutableDataModel } from './datamodel';
@@ -40,7 +42,6 @@ import {
 } from './celleditorcontroller';
 
 import { TextRenderer } from './textrenderer';
-import { ImageRenderer } from './imagerenderer';
 
 /**
  * A widget which implements a high-performance tabular data grid.
@@ -5062,7 +5063,7 @@ export class DataGrid extends Widget {
 
         // Paint the cell into the off-screen buffer.
         try {
-          if (renderer instanceof ImageRenderer) {
+          if (renderer instanceof AsyncCellRenderer) {
             if (renderer.isReady(config)) {
               renderer.paint(gc, config);
             } else {

packages/datagrid/src/imagerenderer.ts

@@ -1,26 +1,25 @@
 // Copyright (c) Jupyter Development Team.
 // Distributed under the terms of the Modified BSD License.
 /*-----------------------------------------------------------------------------
-| Copyright (c) 2014-2019, PhosphorJS Contributors
+| Copyright (c) 2014-2023, Lumino Contributors
 |
 | Distributed under the terms of the BSD 3-Clause License.
 |
 | The full license is in the file LICENSE, distributed with this software.
 |----------------------------------------------------------------------------*/
 import { PromiseDelegate } from '@lumino/coreutils';
+import { AsyncCellRenderer } from './asynccellrenderer';
 import { CellRenderer } from './cellrenderer';
 
 import { GraphicsContext } from './graphicscontext';
 
 
 export type SizingMode = 'fit' | 'fill' | 'original';
 
-// TODO Inherit from AsyncCellRenderer?
-
 /**
  * A cell renderer which renders data values as images.
  */
-export class ImageRenderer extends CellRenderer {
+export class ImageRenderer extends AsyncCellRenderer {
   /**
    * Construct a new text renderer.
    *

packages/datagrid/src/index.ts

@@ -14,6 +14,7 @@
 export * from './basickeyhandler';
 export * from './basicmousehandler';
 export * from './basicselectionmodel';
+export * from './asynccellrenderer';
 export * from './cellrenderer';
 export * from './celleditor';
 export * from './celleditorcontroller';