| 1 | # ADR 0022: Визуальная поверхность разработки UI (AXAML / Blazor) — ориентир WinForms, размещение на MFD |
| 2 | |
| 3 | **Статус:** Proposed |
| 4 | **Дата:** 2026-04-06 |
| 5 | **Обновлено:** 2026-04-24 — крупный трек UI designer → [0092](0092-visual-ui-designer-major-track.md). Подробности — [§ История](#adr0022-history). |
| 6 | |
| 7 | ## Связанные ADR |
| 8 | |
| 9 | | ADR | Роль | |
| 10 | |-----|------| |
| 11 | | [0021](0021-pfd-mfd-cockpit-attention-model.md) | PFD / MFD / `forward`; [§«Плагины и модель внимания»](0021-pfd-mfd-cockpit-attention-model.md#plugins-attention-binding | |
| 12 | | [0010](0010-ui-modes-toml-configuration.md) | пресеты режимов и слоты панелей | |
| 13 | | [0017](0017-multi-window-workspace-and-agent-surfaces.md) | п. 3 | |
| 14 | | [0017](0017-multi-window-workspace-and-agent-surfaces.md#adr0017-p2) | п. 2 | |
| 15 | | [0017](0017-multi-window-workspace-and-agent-surfaces.md#adr0017-p3) | п. 3 | |
| 16 | |
| 17 | --- |
| 18 | ## Контекст |
| 19 | |
| 20 | Внешние **визуальные дизайнеры** для декларативной разметки (Avalonia **AXAML**, **Blazor**) часто **коммерческие** или слабо интегрированы в единый контур IDE. При этом целевой пользовательский опыт для Cascade — не обязательно «как Blend», а скорее **цикл как у WinForms**: быстро увидеть форму, потыкать элементы, править свойства, **не выталкивая** основной поток работы с кодом из зоны внимания. |
| 21 | |
| 22 | Опыт **WPF-дизайнера в Visual Studio** часто критикуют как слабый при **совмещении с редактором кода в одном экране**; при этом **вынесенный** на второй дисплей или отдельную область превью он **перестаёт мешать** и становится приемлемым компромиссом. |
| 23 | |
| 24 | У Cascade уже есть продуктовая рамка: **лобовое** — объект работы (редактор); **MFD** — вторичные инструменты, тяжёлые панели, осознанное переключение ([0021](0021-pfd-mfd-cockpit-attention-model.md)). Визуальная поверхность для разметки логично **не занимать лобовое** по умолчанию, а позиционировать **только** как **инструмент MFD** (вкладка / страница / split в регионе MFD). **Отдельное окно приложения** под превью **не** используем: вторичность уже выражена зоной MFD; второе `TopLevel` дублировало бы хром, размазало бы фокус и усложнило бы единый снимок UI / паритет агента без выигрыша по смыслу [0021](0021-pfd-mfd-cockpit-attention-model.md). |
| 25 | |
| 26 | --- |
| 27 | |
| 28 | ## Решение (принципы) |
| 29 | |
| 30 | 1. **Цель опыта — «WinForms-подобный цикл», не клон Blend.** Приоритет: **прямое манипулирование** + **сетка свойств** + **живое превью** и предсказуемая связь с текстом разметки. Кинематографичность анимаций, полный визуальный редактор стилей и «всё мышью» — **не** обязательные свойства v1. |
| 31 | |
| 32 | 2. **Размещение по модели внимания [0021](0021-pfd-mfd-cockpit-attention-model.md).** Превью дерева контролов, property grid и связанные панели — **кандидаты в MFD** (вкладка, страница, split внутри региона MFD). Редактор исходников **остаётся на лобовом**; дизайнер **не обязан** быть сшит с одной колонкой с кодом на одном мониторе. |
| 33 | |
| 34 | 3. **Второй монитор — первоклассный сценарий без второго окна.** Остаётся **одно** главное окно IDE: пользователь выносит его на внешний дисплей целиком, разворачивает на нужном мониторе или использует раскладку «редактор на одном экране, MFD на другом» в рамках **того же** `TopLevel` (геометрия каркаса / пресета, см. [0021](0021-pfd-mfd-cockpit-attention-model.md) про мультимонитор). Это не отдельный `TopLevel` хоста зоны Mfd по [0017](0017-multi-window-workspace-and-agent-surfaces.md) — отдельный дизайнерский `TopLevel` **вне scope** этого ADR. |
| 35 | |
| 36 | 4. **Две технологии — один продуктовый слой «design surface».** **AXAML (Avalonia)** и **Blazor** различаются хостингом превью и точками расширения, но **сценарий пользователя** (открыть файл → увидеть дерево → изменить свойство → сохранить/синхронизировать с текстом) — **единый** на уровне IDE; расхождения — в адаптерах, не в дублировании несвязанных «мастеров». |
| 37 | |
| 38 | 5. **Безопасность и изоляция.** Превью и дизайн-тайм выполнение — **изолированный процесс или ограниченный хост** (политика позже детализируется; ориентир — не выполнять произвольный код пользователя в том же процессе, что и полный IDE shell без границ). |
| 39 | |
| 40 | --- |
| 41 | |
| 42 | ## Фазы (ориентир; не обязательство сроков) |
| 43 | |
| 44 | | Фаза | Содержание | Комментарий | |
| 45 | |------|------------|---------------| |
| 46 | | **MVP** | **Live preview** по сохранению/фокусу + базовое **дерево** элементов + минимальный **property grid** для подмножества свойств | Уже даёт ценность «как вынесенный WPF designer», без drag-and-drop канвы | |
| 47 | | **Следующий шаг** | Прямое **перемещение/resize** на канве (где применимо), синхронизация с разметкой, undo | Существенно сложнее инженерно | |
| 48 | | **Дальше** | Blazor-специфика (маршруты, inject), общие шаблоны, возможно сценарии «из дизайнера в тест» | После стабилизации MVP | |
| 49 | |
| 50 | --- |
| 51 | |
| 52 | ## Не-цели (для ясности) |
| 53 | |
| 54 | - **Не** целиться в полный аналог **Expression Blend** как обязательный критерий успеха. |
| 55 | - **Не** смешивать роль «дизайн поверхности» с **EICAS** или с **HUD** внутри редактора ([0021](0021-pfd-mfd-cockpit-attention-model.md)) — это разные контуры внимания. |
| 56 | - **Не** обещать в этом ADR конкретный стек процессов (отдельный exe vs AppDomain) — только принцип изоляции. |
| 57 | |
| 58 | --- |
| 59 | |
| 60 | ## Последствия |
| 61 | |
| 62 | - Появится **явный backlog** под инфраструктуру: хост превью, подписка на файлы, маппинг выбора в дереве ↔ курсор/диапазон в тексте. |
| 63 | - **Контракты MCP / снимок UI** ([0008](0008-mcp-contracts-and-testable-infrastructure.md), [0012](0012-floating-workspace-chrome.md)): целевой контур для этой фичи — **один** визуальный корень; расширение под несколько `TopLevel` ([0017](0017-multi-window-workspace-and-agent-surfaces.md)) к превью **не привязываем**. |
| 64 | - Документация для пользователя (позже): где включается превью, как закрепить на втором мониторе, ограничения v1. |
| 65 | |
| 66 | --- |
| 67 | |
| 68 | ## Открытые вопросы |
| 69 | |
| 70 | - Минимальный **v1 по технологиям**: только AXAML, только встроенный стек Cascade, или сразу заготовка под Blazor host? |
| 71 | - Нужна ли **отдельная вкладка MFD** «Design» в пресете по умолчанию или только по команде / режиму Flight? |
| 72 | - Политика **двусторонней синхронизации**: только «из текста в превью» в MVP или сразу «клик в дереве → навигация в коде»? |
| 73 | |
| 74 | --- |
| 75 | |
| 76 | ## Отклонённые альтернативы (как единственная стратегия) |
| 77 | |
| 78 | - **Полагаться только на внешний коммерческий дизайнер** без встроенной поверхности в Cascade — отклонено как не соответствующее цели «IDE с собственным контуром инструментов». |
| 79 | - **Размещать превью по умолчанию в центре лобового** поверх редактора — отклонено в пользу [0021](0021-pfd-mfd-cockpit-attention-model.md) (лобовое — объект работы, не конкурировать с тяжёлым превью). |
| 80 | - **Выносить превью во второе окно приложения** — отклонено: вторичность уже закрыта регионом **MFD** в одном кокпите; отдельный `TopLevel` не требуется и противоречит упрощённому контракту снимка UI для агента. |
| 81 | |
| 82 | --- |
| 83 | |
| 84 | ## История изменений |
| 85 | |
| 86 | <a id="adr0022-history"></a> |
| 87 | |
| 88 | | Дата | Изменение | |
| 89 | |------|-----------| |
| 90 | | 2026-04-24 | организация работы как **отдельного крупного трека** — [0092](0092-visual-ui-designer-major-track.md) (приоритет стеков: Avalonia → Blazor; продуктовые правила — по-прежнему в этом ADR). Ранее 2026-04-06: связь с [0021 §«Плагины и модель внимания»](0021-pfd-mfd-cockpit-attention-model.md#plugins-attention-binding). Превью **только** в MFD одного окна; **без** отдельного `TopLevel`; второй монитор = тот же экземпляр IDE, не окно по [0017](0017-multi-window-workspace-and-agent-surfaces.md). | |
| 91 | |