# ViewPickerProps

**Kind:** Interface

Props for the `ViewPicker` component. Also accepts:
* `SelectStyleProps`

## Properties

### `allowedTypes?`

Type: `Array<ViewType>`

An array indicating which view types can be selected.

### `aria-describedby?`

Type: `undefined | string`

A space separated list of description element IDs.

### `aria-label?`

Type: `undefined | string`

The `aria-label` attribute. Use this if the select is not referenced by a label element.

### `aria-labelledby?`

Type: `undefined | string`

A space separated list of label element IDs.

### `autoFocus?`

Type: `undefined | false | true`

The `autoFocus` attribute.

### `className?`

Type: `undefined | string`

Additional class names to apply to the select.

### `disabled?`

Type: `undefined | false | true`

If set to `true`, the user cannot interact with the select.

### `id?`

Type: `undefined | string`

The `id` attribute.

### `name?`

Type: `undefined | string`

The `name` attribute.

### `onChange?`

Type: `undefined | object`

A function to be called when the selected view changes.

### `placeholder?`

Type: `undefined | string`

The placeholder text when no view is selected. Defaults to `'Pick a view...'`

### `shouldAllowPickingNone?`

Type: `undefined | false | true`

If set to `true`, the user can unset the selected view.

### `size?`

Type: `ControlSizeProp`

The size of the select.

### `style?`

Type: `React.CSSProperties`

Additional styles to apply to the select.

### `tabIndex?`

Type: `undefined | number`

The `tabindex` attribute.

### `table?`

Type: `Table | null`

The parent table model to select views from. If `null` or `undefined`, the picker won't render.

### `view?`

Type: `View | null`

The selected view model.

---

## ViewPickerSyncedProps

**Kind:** Interface

Props for the `ViewPickerSynced` component. Also accepts:
* `SelectStyleProps`

### Properties

#### `allowedTypes?`

Type: `Array<ViewType>`

An array indicating which view types can be selected.

#### `aria-describedby?`

Type: `undefined | string`

A space separated list of description element IDs.

#### `aria-label?`

Type: `undefined | string`

The `aria-label` attribute. Use this if the select is not referenced by a label element.

#### `aria-labelledby?`

Type: `undefined | string`

A space separated list of label element IDs.

#### `autoFocus?`

Type: `undefined | false | true`

The `autoFocus` attribute.

#### `className?`

Type: `undefined | string`

Additional class names to apply to the select.

#### `disabled?`

Type: `undefined | false | true`

If set to `true`, the user cannot interact with the select.

#### `globalConfigKey`

Type: `GlobalConfigKey`

A string key or array key path in `GlobalConfig`. The selected view will always reflect the view id stored in `GlobalConfig` for this key. Selecting a new view will update `GlobalConfig`.

#### `id?`

Type: `undefined | string`

The `id` attribute.

#### `name?`

Type: `undefined | string`

The `name` attribute.

#### `onChange?`

Type: `undefined | object`

A function to be called when the selected view changes.

#### `placeholder?`

Type: `undefined | string`

The placeholder text when no view is selected. Defaults to `'Pick a view...'`

#### `shouldAllowPickingNone?`

Type: `undefined | false | true`

If set to `true`, the user can unset the selected view.

#### `size?`

Type: `ControlSizeProp`

The size of the select.

#### `style?`

Type: `React.CSSProperties`

Additional styles to apply to the select.

#### `tabIndex?`

Type: `undefined | number`

The `tabindex` attribute.

#### `table?`

Type: `Table | null`

The parent table model to select views from. If `null` or `undefined`, the picker won't render.

---

## ViewPicker

**Kind:** Component

Dropdown menu component for selecting views.

[[ Story id="modelpickers--viewpicker-example" title="View picker example" ]]

**Parameters:**
- `props` (`ViewPickerProps`)
- `ref` (`React.Ref<HTMLSelectElement>`)

**Returns:** `null | Element`

---

## ViewPickerSynced

**Kind:** Component

A wrapper around the `ViewPicker` component that syncs with `GlobalConfig`.

[[ Story id="modelpickers--viewpickersynced-example" title="Synced view picker example" ]]

**Parameters:**
- `props` (`ViewPickerSyncedProps`)
- `ref` (`React.Ref<HTMLSelectElement>`)

**Returns:** `Element`