feat: ListView - ui plugins

[bmingles]

ui.list_view - basic items + table support

resolves #366

[mofojed]

Need to add some examples in the examples/README.md

I tried a couple of the examples as specified in the spec, and they didn't work as I was expecting. e.g. I can't change the selection here:

from deephaven import new_table
from deephaven.column import string_col, int_col

color_table = new_table([
    string_col("Keys", ["salmon", "lemonchiffon", "black"]),
    string_col("Labels", ["Salmon", "Lemon Chiffon", "Black"]),
    string_col("Descriptions", ["An interesting color", "Another interesting color", "A color"]),
    string_col("Icons", ["Amusementpark", "Teapot", "Sentiment Negative"]),
    string_col("SectionKeys", ["Interesting Colors", "Interesting Colors", "Other Colors"]),
    string_col("SectionLabels", ["Favorites", "Favorites", "Other"]),
    string_col("SectionDescriptions", ["Favorite colors", "Favorite colors", "Other colors"]),
    string_col("SectionIcons", ["Folder", "Folder", "Not Found"])
])

@ui.component
def ui_list_view():
    colors, set_colors = ui.use_state(["salmon", "lemonchiffon"])

    print(f"Colors are now {colors}")

    # this will create a controlled list_view with color_table
    return ui.list_view(
        color_table,
        key_column="Keys",
        label_column="Labels",
        description_column="Descriptions",
        icon_column="Icons",
        selected_keys=colors,
        on_change=set_colors
    )

my_list_view = ui_list_view()

[bmingles]

@mofojed I think the issue with selection not working is you have to set selection_mode="multiple"

[bmingles]

@mofojed I fixed the default selection_mode to be "MULTIPLE" and added handling for uppercase strings. Things should work as expected now

[mofojed]

This example doesn't appear correctly for me as is. Currently the list views do not appear at all (the list-view-wrapper has a height of zero):

I'd just keep it simple and just return them in a column/default layout, no real need for a grid here after Don's changes, e.g.

Suggested change

	text = ui.text("Selection: " + ", ".join(map(str, value)), grid_column="span 2")
	return ui.grid(text, lv, lv2, columns="repeat(2, 1fr)")
	text = ui.text("Selection: " + ", ".join(map(str, value)))
	return text, lv, lv2

Or if we still want the list views side by side:

    text = ui.text("Selection: " + ", ".join(map(str, value)))

    return text, ui.flex(lv, lv2, flex_grow=1)

I'm guessing Don's flex/CSS changes broke this for you, but we'll need to update the example.

[dsmmcken]

Same would happen to tables and plots with that ui.grid, it's not specific to list view. ui.grid needs a height specified for the rows, or for itself. We could consider better defaults on it. ui.grid would probably also benefit from a default gap etc.

[mofojed]

Selection isn't working for me at all right now. The second item should be selected initially, and it should update when things are checked off.

Looks like the props aren't actually passed through in @deephaven/components/ListView: https://github.com/deephaven/web-client-ui/blob/a283e13fafe1ecb156985fab00ba15344f180ff4/packages/components/src/spectrum/listView/ListView.tsx#L55

Unsure why that didn't get flagged as an unused variable ...

Also getting a ton of warnings in the logs whenever I change selection, we should squash these warnings or provide default values so Spectrum doesn't complain:

An aria-label or aria-labelledby prop is required for accessibility. 
    at $f85fb77f9d4cbc6c$var$ListView (

[bmingles]

Selection should be fixed by deephaven/web-client-ui#1986 .

I added the aria-label props to examples. I guess we could set a default of "List View" or something like that. @dsmmcken any opinions on this one?

[bmingles]

@mofojed Matt fixed the underlying e2e kerning issue, so this PR should be unblocked now

[mofojed]

Update the PR description before merging.