# terminal/TerminalDrawer (zidane-ui/terminal)

Import: `import { … } from 'zidane-ui/terminal'`. Source: [ui/src/terminal/TerminalDrawer.tsx](https://github.com/Tahul/zidane/blob/main/ui/src/terminal/TerminalDrawer.tsx).

## Components

### `TerminalDrawer`

Component.

The drawer under the chat column: the scope's terminals, shown while its layout says so.
Memoised on the scope's identity: a parent may re-render it with a fresh scope object.

```ts
const TerminalDrawer: MemoExoticComponent<(__namedParameters: TerminalDrawerProps) => Element>
```

Source: [ui/src/terminal/TerminalDrawer.tsx:45](https://github.com/Tahul/zidane/blob/main/ui/src/terminal/TerminalDrawer.tsx#L45)

### `TerminalPanelTab`

Component.

The side panel's Terminal tab body (`TERMINAL_PANEL_ID`): the scope's terminals, the same panel
the drawer shows. Mounted only while the side panel is open (the panel stays mounted hidden when
closed), so a closed panel holds no view. Reads the layout only: panel content loads and badges
never re-render the terminals.

```ts
function TerminalPanelTab(props: TerminalPanelTabProps): Element | null
```

**Parameters**

- `props` (`TerminalPanelTabProps`): The scope and `className`.

**Returns** `Element | null`

**Props**

- `className?` (`string`): Extra classes on the root.
- `scope` (`TerminalScope`): Whose terminals.

Source: [ui/src/terminal/TerminalDrawer.tsx:220](https://github.com/Tahul/zidane/blob/main/ui/src/terminal/TerminalDrawer.tsx#L220)

### `TerminalToggle`

Component.

The header button that shows / hides the drawer; badged when the agent started a terminal nobody
is looking at. Renders nothing while terminals are off.

```ts
function TerminalToggle(props: TerminalToggleProps): Element | null
```

**Parameters**

- `props` (`TerminalToggleProps`): The scope and `className`.

**Returns** `Element | null`

**Props**

- `className?` (`string`): Extra classes on the button.
- `scope` (`TerminalScope`): Whose drawer.

Source: [ui/src/terminal/TerminalDrawer.tsx:160](https://github.com/Tahul/zidane/blob/main/ui/src/terminal/TerminalDrawer.tsx#L160)

## Constants

### `TERMINAL_HEIGHT`

Constant.

The drawer's height bounds (px) and its share cap of the column.

```ts
const TERMINAL_HEIGHT: { default: number; maxShare: number; min: number }
```

Source: [ui/src/terminal/TerminalDrawer.tsx:31](https://github.com/Tahul/zidane/blob/main/ui/src/terminal/TerminalDrawer.tsx#L31)

## Interfaces

### `TerminalDrawerProps`

Interface.

Props for [`TerminalDrawer`](https://zidane.si/docs/reference/ui-terminal-terminal-drawer.md#TerminalDrawer).

```ts
interface TerminalDrawerProps
```

**Properties**

- `className?` (`string`): Extra classes on the root.
- `scope` (`TerminalScope`): Whose terminals.

Source: [ui/src/terminal/TerminalDrawer.tsx:34](https://github.com/Tahul/zidane/blob/main/ui/src/terminal/TerminalDrawer.tsx#L34)

### `TerminalPanelTabProps`

Interface.

Props for [`TerminalPanelTab`](https://zidane.si/docs/reference/ui-terminal-terminal-drawer.md#TerminalPanelTab).

```ts
interface TerminalPanelTabProps
```

**Properties**

- `className?` (`string`): Extra classes on the root.
- `scope` (`TerminalScope`): Whose terminals.

Source: [ui/src/terminal/TerminalDrawer.tsx:205](https://github.com/Tahul/zidane/blob/main/ui/src/terminal/TerminalDrawer.tsx#L205)

### `TerminalToggleProps`

Interface.

Props for [`TerminalToggle`](https://zidane.si/docs/reference/ui-terminal-terminal-drawer.md#TerminalToggle).

```ts
interface TerminalToggleProps
```

**Properties**

- `className?` (`string`): Extra classes on the button.
- `scope` (`TerminalScope`): Whose drawer.

Source: [ui/src/terminal/TerminalDrawer.tsx:147](https://github.com/Tahul/zidane/blob/main/ui/src/terminal/TerminalDrawer.tsx#L147)