---
ui_doc_type: component
component_id: console-shell
status: 구현됨
source_evidence:
  - type: code
    path: packages/flutter/iop_console/lib/src/iop_console_shell.dart
    notes: IopConsoleShell defines left rail section navigation and content slots.
  - type: docs
    path: apps/client/README.md
    notes: iop_console is the IOP-owned widget boundary for standalone and embedded consumers.
  - type: user
    path: null
    notes: Initial scaffold requested by user.
---

# Console Shell

Component ID: `console-shell`

Status: `구현됨`

## Source Evidence

| Type | Path | Notes |
|------|------|-------|
| code | `packages/flutter/iop_console/lib/src/iop_console_shell.dart` | `IopConsoleShell`, `_IopConsoleRail`, `_RailButton`, `_IopPlaceholder`가 shell structure를 구현한다. |
| docs | `apps/client/README.md` | standalone IOP app과 외부 embedding consumer가 같은 widget boundary를 사용한다고 설명한다. |
| user | 없음 | 초기 agent-ui 생성을 요청했다. |

## Purpose

IOP console view들을 좌측 rail navigation과 section content slot으로 묶는다.

## Used By

- `overview`: shell initial section
- `edges`: shell section
- `nodes`: shell section
- `runtime`: shell section
- `execution-logs`: shell section
- `agent`: shell section

## Anatomy

- left rail
- section icon buttons with tooltip
- content slot
- placeholder fallback

## Variants

- default: dark ops/dev shell

## States

- default
- selected section
- placeholder
- disabled: 없음

## Rules

- shell은 view content를 소유하지 않고 section slot을 mount한다.
- `maintenance`와 `settings`는 package shell placeholder가 있으나 현재 app에서 concrete panel을 주입하지 않는다.

## Decision History

- 2026-06-25: `IopConsoleShell` 구현을 기준으로 component를 정의했다.