Expose Table's current sort order

[mootari]

A Table input's current sort order is only tracked internally. This poses a problem if a notebook author wants to persist the current sort state, e.g. via a permalink.

Suggested solution

When the sort column or order is changed, dispatch a custom sort event:

new CustomEvent('sort', {bubbles: true, detail: {sort: currentColumnName, reverse: currentReverse}})

Workaround

The instantiating cell can listen to click events and parse order and column name from event.target.textContent. This technique is error prone and expected to break once additional features (like custom table names) have been added.

The workaround is currently implemented here: https://observablehq.com/@mootari/sortable-notebook-list#selection

[john-guerra]

Not sure if this is the same, but I think I was just experiencing this need. If I create a table like this:

viewof selected = Inputs.table(data)

selected won't change when I change the order of the element of the table by clicking on one of the columns. However, if selected some or all the rows using the checkboxes then the table order will be reflected on selected. It would be nice for the table to trigger an input whenever the table visual order changes

[john-guerra]

To follow up on this discussion, here is a video demonstrating my view of the problem. Inputs.Table should trigger the input event when the order changes. At least it should be configurable via options

https://observablehq.com/d/297b6d84743974ae

[Fil]

@john-guerra's suggestion would be consistent with what Inputs.table does when passed a sort option; I wonder if we couldn't just do the following:

index bd2df74..451d73a 100644
--- a/src/table.js
+++ b/src/table.js
@@ -238,6 +238,7 @@ function initialize(
     while (tbody.firstChild) tbody.firstChild.remove();
     appendRows(0, n = minlengthof(rows * 2));
     anchor = head = null;
+    root.dispatchEvent(new CustomEvent('input', {bubbles: true, detail: {sort: column, reverse: currentReverse}}));
     reinput();
   }

demo at https://observablehq.com/@fil/table-sort-115 ; this also allows to listen to the input event and check if it's a sort event, addressing @mootari's request.

[mbostock]

@Fil I don’t think that’s quite enough; if there’s a selection, the selection should appear sorted, too. But currently it looks like the selection is ordered by the order in which rows were clicked.

[Fil]

I thought it worked because I had only tested sorting a selection; however I hadn't thought about adding elements to a selection while there is an "active" sort (which didn't work; now fixed).