Skip to content

ListView should be allowed among the children of Card (pydantic) #47

@paul-felt

Description

@paul-felt

I bumped into a minor issue in the pydantic hierarchy where ListView isn't allowed to be a WidgetComponent (child of Card).

The Widget Builder happily builds things with this structure. For example, I asked for a twistie component and got this:

JSX:

<Card size="sm" padding={0}>
  <ListView>
    <ListViewItem
      onClickAction={{ type: "twistie.toggle" }}
      gap={2}
      align="center"
    >
      <Icon name={expanded ? "chevron-down" : "chevron-right"} />
      <Text value={expanded ? summary : summary} />
    </ListViewItem>
    {expanded && (
      <ListViewItem align="stretch">
        <Col padding={{ x: 4, y: 1 }} gap={2}>
          <Markdown value={content} />
        </Col>
      </ListViewItem>
    )}
  </ListView>
</Card>

JSON (not expanded):

{
  "type": "Card",
  "size": "sm",
  "padding": 0,
  "children": [
    {
      "type": "ListView",
      "children": [
        {
          "type": "ListViewItem",
          "onClickAction": {
            "type": "twistie.toggle"
          },
          "gap": 2,
          "align": "center",
          "children": [
            {
              "type": "Icon",
              "name": "chevron-right"
            },
            {
              "type": "Text",
              "value": "Summary"
            }
          ]
        }
      ]
    }
  ]
}

You can create that in python, but if you try to serialize/deserialize pydantic complains about ListView not being in the WidgetComponent union.

For example, if you try to parse the above json by doing something like:

from pydantic import TypeAdapter
TypeAdapter(chatkit.widgets.WidgetRoot).validate_json(widget_json)

It fails with:

1 validation error for tagged-union[Card,ListView]
Card.children.0
  Input tag 'ListView' found using 'type' does not match any of the expected tags: 'Text', 'Title', 'Caption', 'Chart', 'Badge', 'Markdown', 'Box', 'Row', 'Col', 'Divider', 'Icon', 'Image', 'ListViewItem', 'Button', 'Checkbox', 'Spacer', 'Select', 'DatePicker', 'Form', 'Input', 'Label', 'RadioGroup', 'Textarea', 'Transition' [type=union_tag_invalid, input_value={'type': 'ListView', 'chi... 'value': 'Summary'}]}]}, input_type=dict]

That's fixed by just adding ListView to the WidgetComponent Union: #46

I think this is inline also with the official docs that show ListView as one of the potential children of Card: https://platform.openai.com/docs/guides/chatkit-widgets

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions