Chooser

A variant of filterable widget. The ancestor of this widget should be a filter widget.

Name	Description
component	chooser
text	text header (optional)
hint	a text that help explain to the user of what this option is (optional)
variant	type of chooser, radio, checkbox, chip, button-group
alignment	left or right, where to place the radio/checkbox
direction	column or row, how to place the radio/checkbox (if it is a radio or checkbox variant)
justifyContent	how to place the radio/checkbox and label, start, end, space-between, space-evenly, space-around, center
options	additional options for the widget

Options

Name	Description
id	a unique string that use to identiy this filter
multiSelected	if true, allow multi selection, only applicable to chip and button-group
keyword	a list of query keywords, e.g. body, name, first, last, key:someKey, etc
queryPrefix	query prefix, e.g. where, given, ...
operator	filter operator, e.g. contains, is, etc.
items	List of items for the chooser

Item

Name	Description
text	label for the item
value	value for the item
iconName	optional icon

Example

          {
            "component": "chooser",
            "text": "Rating",
            "hint": "Star rating",
            "variant": "button-group",
            "options": {
              "id": "starRating",
              "multiSelected": true,
              "keyword": "key:rating",
              "queryPrefix": "where",
              "operator": "is",
              "items": [
                {
                  "text": "5 stars",
                  "value": "5"
                },
                {
                  "text": "4 stars",
                  "value": "4"
                },
                {
                  "text": "3 stars",
                  "value": "3"
                },
                {
                  "text": "2 stars",
                  "value": "2"
                },
                {
                  "text": "1 stars",
                  "value": "1"
                }
              ]
            }
          }