feat: accordion

[ethanalvizo]

Updated the event example with the changes we discussed for the onExpandedChange prop. Getting an infinite re-render now when something is toggled. Tried passing in both handled_expanded_keys_change and set_expanded_keys directly into the on_expanded_change prop

from deephaven import ui

@ui.component
def ui_accordion_event():
    expanded_keys, set_expanded_keys = ui.use_state(["a"])

    def handle_expanded_keys_change(e):
        print("Expanded key changed", e)
        set_expanded_keys(list(e))

    return ui.accordion(
        ui.disclosure(title="FAQ #1", panel="Answer", id="a"),
        ui.disclosure(title="FAQ #2", panel="Answer", id="b"),
        expanded_keys=expanded_keys,
        on_expanded_change=set_expanded_keys
    )

my_accordion_event = ui_accordion_event()

[mofojed]

Summarizing the issue we discussed on call that you're observing with expandedKeys...

• The type for expandedKeys prop is Iterable<Key>: https://react-spectrum.adobe.com/react-spectrum/Accordion.html#props
• Built-in iterables include both Set and Array: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Iteration_protocols#built-in_iterables
• The type for onExpandedChange is (keys: Set<Key>) => any, so it always emits a Set even if an Array is provided for the expandedKeys prop
  • Set is technically more efficient for this scenario since duplicate items shouldn't be valid in this case
  • However, a Set cannot be represented in JSON. You can only represent data structures like arrays and dictionaries: https://softwareengineering.stackexchange.com/questions/355176/how-to-represent-a-set-in-json
  • We use JSON to communicate from client to server, and being unable to represent a Set it is being interpreted as the empty set
• To handle this, you should shim the onExpandedChange callback using useConditionalCallback, and convert the keys parameter from a Set to an Array
• No need to do any other conversion, since setting an Array on expandedKeys prop is already valid (since it's an Iterable). We're already doing this correctly.