Choice Picker

The Choice Picker is a configurable component that allows users to select a single option from a predefined list. The list of items can be either hardcoded with items or populated with the url attribute.

Configuration Options

The picker can be configured through the following options in the config object:

Option	Type	Default	Description
`pickedItemId`	string \| null	null	ID of the default picked item
`fullItem`	boolean	false	When `true`, returns the full item object instead of just the ID
`items`	array	[]	Array of items to choose from. Each item must include `id` and `title`
`url`	string \| null	null	URL to fetch items from (optional, alternative to `items`)
`idAttribute`	string	"id"	The attribute of the item object to use as the item ID (from the `url` response)
`displayAttribute`	string	"title"	The attribute of the item object to use as the item display value (from the `url` response)
`isSearchable`	boolean	false	Determines if the picker is searchable
`search`	string	""	Default Search query string

Example Configuration with items:

{
  "id": "choice_picker_id",
  "title": "Choice Picker Title",
  "fullItem": true,
  "items": [
    {
      "id": "choice_1",
      "title": "Choice 1"
    },
    {
      "id": "choice_2",
      "title": "Choice 2"
    }
  ],
  "pickedItemId": "choice_1",
  "isSearchable": true,
  "type": "choice"
}

Example Configuration with url:

The choice picker is populated with items based on the url specified. In this case must be used with an asset picker.

The idAttribute the key to use from the url response to be the id.

The displayAttribute the key to use from the url response to be the display title.

The pickedItemId sets the default selection.

{
  "id": "choice_picker_id",
  "title": "Choice Picker",
  "url": "<%= `/v1/selector/analytics/cycle/${getAssetType(asset)}/axis` %>",
  "idAttribute": "name",
  "displayAttribute": "display_name",
  "fullItem": true,
  "pickedItemId": "output",
  "isSearchable": false,
  "type": "choice",
}

Default Query Params

The choice picker generates the following params to the API Query:

Parameter	Type	Description
`id`	string	selected item id
`title`	string	selected item title

Additionally, if url is used, other keys/values from the response items will also be included.

Example request body with items:

"choice_picker_id": {
  "pickerType": "choice",
  "value": {
    "id": "choice_1",
    "title": "Choice 1"
  }
},

Example request body with url:

"choice_picker_id": {
  "pickerType": "choice",
  "value": {
    "id": "output",
    "title": "Output",
    "name": "output",
    "display_name": "Output",
    "unit": "",
    "type": "continuous",
    "data_type": "float",
    "stream_types": [],
    "raw_data_field": "",
    "model": "cycle"
  }
},

Page Link

The following is the accepted mapping to populate the parameter for this picker:

{
  "mapping": {
    'choice_1': '"choice_2"'
  }
}