---
title: "FormField Components"
description: "Learn about FormField components."
url: https://docs.sentry.io/organization/integrations/integration-platform/ui-components/formfield/
---

# FormField Components

The [issue linking](https://docs.sentry.io/organization/integrations/integration-platform/ui-components/issue-link.md) and [alert rule action](https://docs.sentry.io/organization/integrations/integration-platform/ui-components/alert-rule-action.md) UI components can use `FormField` components to display attributes in their respective modals. These components can render custom forms with inputs specified according to the schemes below. They behave similarly to their HTML equivalents.

## [Text](https://docs.sentry.io/organization/integrations/integration-platform/ui-components/formfield.md#text)

### [Schema](https://docs.sentry.io/organization/integrations/integration-platform/ui-components/formfield.md#schema)

`schema.json`

```json
{
  "type": "text",
  "label": <String>,
  "name": <String>,
  "default": <String>,
}
```

### [Attributes](https://docs.sentry.io/organization/integrations/integration-platform/ui-components/formfield.md#attributes)

* `label` - (Required) Label text to be rendered for the form field

* `name` - (Required) Value to use in `name` attribute of the field

* `default` - default to pre-populate with. Options include `issue.title` and `issue.description`. Only used for [issue link](https://docs.sentry.io/organization/integrations/integration-platform/ui-components/issue-link.md) components.

  * `issue.title` - title of the Sentry issue
  * `issue.description` - description of the Sentry issue

## [Textarea](https://docs.sentry.io/organization/integrations/integration-platform/ui-components/formfield.md#textarea)

### [Schema](https://docs.sentry.io/organization/integrations/integration-platform/ui-components/formfield.md#schema-1)

`schema.json`

```json
{
  "type": "textarea",
  "label": <String>,
  "name": <String>,
  "default": <String>,
}
```

### [Attributes](https://docs.sentry.io/organization/integrations/integration-platform/ui-components/formfield.md#attributes-1)

* `label` - (Required) Label text to be rendered for the form field

* `name` - (Required) Value to use in `name` attribute of the field

* `default` - default to pre-populate with options include `issue.title` and `issue.description`. Only used for [issue link](https://docs.sentry.io/organization/integrations/integration-platform/ui-components/issue-link.md) components.

  * `issue.title` - title of the Sentry issue
  * `issue.description` - description of the Sentry issue

## [Select](https://docs.sentry.io/organization/integrations/integration-platform/ui-components/formfield.md#select)

### [Schema](https://docs.sentry.io/organization/integrations/integration-platform/ui-components/formfield.md#schema-2)

`schema.json`

```json
{
  "type": "select",
  "label": <String>,
  "name": <String>,
  "uri": <URI>,
  "async": <Boolean>,
  "options": <Array<Array<String, String>>>,
  "depends_on": <Array<String>>,
  "skip_load_on_open": <Boolean>
}
```

### [Attributes](https://docs.sentry.io/organization/integrations/integration-platform/ui-components/formfield.md#attributes-2)

* `label` - (Required) Label text to be rendered for the form field
* `name` - (Required) Value to use in `name` attribute of the field
* `uri` - (Required if developer doesn't provide `options`) URI to retrieve values from. Check out our [URI Guidelines](https://docs.sentry.io/organization/integrations/integration-platform/ui-components.md#uri-guidelines) documentation for formatting help.
* `async` - (Optional) Used only if `uri` is present. If true (default), will query the URI as the user types, for autocomplete suggestions (see response format below). If false, will query the URI once initially to retrieve all possible options. This request *must* succeed, and the response *must* return data in the format Sentry expects, otherwise the entire component won't render.
* `options` - (Required if developer doesn't provide `uri`) Static list of options in the format of `[["value1", "label1"], ["value2", "label2"]]`
* `depends_on` - (Optional) If a field value depends on the value of another field, a request will be made to load those options when the dependent field is set.
* `skip_load_on_open` (Optional) If true, this field will not load options when the page loads. Instead, it will wait for the user to start typing before fetching options.

### [URI Request Format](https://docs.sentry.io/organization/integrations/integration-platform/ui-components/formfield.md#uri-request-format)

The request sent to the `uri` to load options is a `GET` request. The parameters are encoded into the query parameters like so:

```json
{
  "installationId": <String>,
  "projectSlug": <String>,
  "query": <String>,
  "dependentData": <String>,
}
```

* `installationId` - The ID of the installation associated with the request
* `projectSlug` - The slug of the project in Sentry
* `query` - The search term the user is typing
* `dependentData` - A JSON encoded string of the dependent data if that field has `depends_on` set

### [URI Response Format](https://docs.sentry.io/organization/integrations/integration-platform/ui-components/formfield.md#uri-response-format)

Response from `uri`, when specified, must be JSON and match the following format:

```json
[
  {
    "label": <String>,
    "value": <String>,
    "default": <Boolean>,
  },
  ...
]
```