---
title: "Keyboard Shortcuts"
framework: angular
version: "2.1.2"
---

# Keyboard Shortcuts

Keyboard shortcuts let you interact with Studio without the mouse.

## Layout Interactions

The following interactions are possible within the layout:

- `⇥ Tab` / `⇧ Shift`+`⇥ Tab` - Move focus between widgets on the canvas.
- `↵ Enter` - Move focus into the focused widget if there is focusable content (e.g. into the cells of a grid).
- `⎋ Esc` - When focus is within a widget, move focus back to the widget container.
- `␣ Space` - Select the focused widget (e.g. display the widget details in the Edit Panel).
- `Delete` / `⌫ Backspace` - Delete the focused widget (Edit Mode only).
- `⇧ Shift` + `↑`/`↓`/`←`/`→` - move the focused widget (Edit Mode only).
- `⌥ Alt` + `↑`/`↓`/`←`/`→` - resize the focused widget (Edit Mode only).

When dragging a widget with the pointer (Edit Mode only), hold a modifier key to change the action:

- `⇧ Shift` + drag - Duplicate the widget at the drop location.
- `⌥ Alt` + drag - Swap the widget with the one at the drop location.

When focus is within a widget, `⇥ Tab` / `⇧ Shift`+`⇥ Tab` will keep cycling focus within the widget until `⎋ Esc` is pressed.

Try using the interactions in the example below.

#### Layout Keyboard Shortcuts

```ts
import '@angular/compiler';
import { provideHttpClient } from '@angular/common/http';
import { bootstrapApplication } from '@angular/platform-browser';

import { AppComponent } from './app.component.ts';

const app = bootstrapApplication(AppComponent, {
    providers: [provideHttpClient()],
});
```

[Live example: Layout Keyboard Shortcuts](https://www.ag-grid.com/studio/examples/keyboard-shortcuts/layout-keyboard-shortcuts/angular/)

## Field Configuration

When you configure a widget, each field is shown as a pill with action buttons. With a field pill focused:

- `↑` / `↓` - Move focus between field pills.
- `⇧ Shift` + `↑`/`↓` - Reorder the focused pill within its group.
- `↵ Enter` - Move focus to the pill's action buttons (such as aggregation and remove).
- `⇥ Tab` / `⇧ Shift`+`⇥ Tab` - Move between a pill's action buttons.
- `⎋ Esc` - Return focus from an action button to the pill.

## Filters

With a filter card focused in the filters panel:

- `↑` / `↓` - Move focus between filter cards.
- `⇧ Shift` + `↑`/`↓` - Reorder the focused filter.
- `↵ Enter` - Move focus into the focused filter.
- `←` / `→` - Collapse or expand the focused filter.
- `⎋ Esc` - Return focus from within a filter to its card.