(core) add grist.onRecord and grist.onRecords event handlers

Summary:
This simplifies writing custom widgets that access selected
data.  To access the record at which the cursor is set, and
get any future changes to it as the cursor moves or data
changes, it suffices now to do:

```
grist.ready();
grist.onRecord(record => /* render */);
```

Similarly to access the set of selected records, and get any
changes, it suffices now to do:

```
grist.ready();
grist.onRecords(records => /* render */);
```

The `records` argument will be a list of objects, each of which
is a single record.  This is distinct from the column-based
representation favored in Grist up ontil now.  That remains
how methods like `fetchTable` or `fetchSelectedTable` represent
their results.  In the future, methods named like `fetchRecords`
or `fetchSelectedRecords` could be added that return lists.

Test Plan: extended tests

Reviewers: dsagal

Reviewed By: dsagal

Differential Revision: https://phab.getgrist.com/D2583

app/plugin/grist-plugin-api.ts

@@ -19,6 +19,7 @@
 // tslint:disable:no-console
 
 import { GristAPI, GristDocAPI, GristView, RPC_GRISTAPI_INTERFACE } from './GristAPI';
+import { RowRecord } from './GristData';
 import { ImportSource, ImportSourceAPI, InternalImportSourceAPI } from './InternalImportSourceAPI';
 import { RenderOptions, RenderTarget } from './RenderOptions';
 import { checkers } from './TypeCheckers';
@@ -45,6 +46,40 @@ export const docApi = {
 
 export const on = rpc.on.bind(rpc);
 
+// For custom widgets, add a handler that will be called whenever the
+// row with the cursor changes - either by switching to a different row, or
+// by some value within the row potentially changing.  Handler may
+// in the future be called with null if the cursor moves away from
+// any row.
+// TODO: currently this will be called even if the content of a different row
+// changes.
+export function onRecord(callback: (data: RowRecord | null) => unknown) {
+  on('message', async function(msg) {
+    if (!msg.tableId || !msg.rowId) { return; }
+    const rec = await docApi.fetchSelectedRecord(msg.rowId);
+    callback(rec);
+  });
+}
+
+// For custom widgets, add a handler that will be called whenever the
+// selected records change.  Handler will be called with a list of records.
+export function onRecords(callback: (data: RowRecord[]) => unknown) {
+  on('message', async function(msg) {
+    if (!msg.tableId || !msg.dataChange) { return; }
+    const data = await docApi.fetchSelectedTable();
+    if (!data.id) { return; }
+    const rows: RowRecord[] = [];
+    for (let i = 0; i < data.id.length; i++) {
+      const row: RowRecord = {id: data.id[i]};
+      for (const key of Object.keys(data)) {
+        row[key] = data[key][i];
+      }
+      rows.push(row);
+    }
+    callback(rows);
+  });
+}
+
 /**
  * Calling `addImporter(...)` adds a safeBrowser importer. It is a short-hand for forwarding calls
  * to an `ImportSourceAPI` implementation registered in the file at `path`. It takes care of