> For the complete documentation index, see [llms.txt](https://fig.gitbook.io/fig/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://fig.gitbook.io/fig/interactive-runbooks-2/components/dropdown.md).

# Dropdown

`^[id: placeholder ]{ array_of_options }`

### Important

You must pass options into the dropdown as an array. To create an array, you can split a string on commas (**csv**) or new lines (**lines**). You can also map over an array of objects (**map** ). You can learn more in Fig's[ Scripting Language](/fig/interactive-runbooks-2/rundown-language.md) e.g.

* { "a,b,c" **csv** }
* { "a\nb\nc" **lines** }
* { \[ ls ] sh **lines**}
  * Run the shell command `ls`
  * Parse the output by new lines
* { \[ aws ec2 describe-regions ] sh json "Regions" prop \[ "RegionName" prop ] **map** }
  * run shell command `aws ec2 describe-regions`
  * JSON.parse the output
  * get the "Regions" property of the object (which is an array of objects)
  * Map over the array and create new array of the "RegionName" prop of each object

### **Examples**

* This is a big example. Look at the gif down the bottom
* Specifically note the functions that between the curly braces. You can learn more in [Scripting Language](/fig/interactive-runbooks-2/rundown-language.md)
* Also note the "plans" object at the top (defined in **data**). This was used as a javascript element in the mustache braces at the bottom

````
```data
{
	"plans": {
		"hobby-dev": { "price" : 0},
		"hobby-basic": { "price" : 7},
		"standard-0": {"price": 50}

	}
	
}
```

<!-- NOTE: An array is a string that is split on commas using the csv function -->

Choose an animal
^[animal: Your chosen animal]{ "dog,cat,lizard" csv }
You chose **{{animal}}**  


Show IDs of all Docker Images
^[docker_image: abc_123 ]{ [ docker images -aq ] sh lines }
`docker run {{ docker_image }}`


Select AWS Region
aws ec2 describe-regions
^[aws_region: Region]{ [ aws ec2 describe-regions ] sh json "Regions" prop [ "RegionName" prop ] map }
You selected: **{{aws_region}}**


<!-- Loop through an array of JSON objects and get the name prop from each -->
Heroku App Name
^[app_name: dummy_name]{ [ heroku apps --json ] sh json [ "name" prop ] map }
{{ app_name }}


Add Postgresql to Heroku

^[plan: hobby-dev ]{ "hobby-dev,hobby-basic,standard-0" csv }

```
heroku addons:create heroku-postgresql:{{plan}}
```

**{{plan}}** costs **${{plans[plan].price}}**  per month.
````

![](/files/-MDDPvi3G-iYtCJZLCXm)


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://fig.gitbook.io/fig/interactive-runbooks-2/components/dropdown.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.