# Account Limitations Modal — UI Kit gaps

> Що довелось зібрати кастомом / що потребує додавання або фіксу в UI Kit.

---

## Gap #1 — Account Row (компонент)

**Проблема.** У UI Kit немає компонента "рядок акаунту" — є тільки `Access User Row` (для людей: avatar + name + role). А нам потрібен пресет для акаунтів: `Account icon + Name + Meta (currency · balance) + trailing slot`.

**Як зібрано зараз.** Кастом `.acc-row` у HTML / у Figma — auto-layout горизонтальний:
- `Account Icon (Size=Big, color per type)` — 36×36
- `Body (Name 14/500 + Meta 12 description)` — flex 1
- `Trailing` — наприклад, `Limitation Option`, але загалом будь-який control справа

**Пропозиція в UI Kit.**
- Створити `Components / Rows / Account Row` як офіційний компонент із slot'ом справа (так само як зроблено для Access User Row).
- Properties: `Show Meta`, `Show Trailing`, `Density (Compact / Default)`, `Icon Type`.
- Slot — `INSTANCE_SWAP` для trailing (можна підмінити на Limitation Option, Switch, Button тощо).

**Приоритет.** Medium — рядок зустрічатиметься в Limitations, Settings → Accounts, потенційно в фільтрах і dropdown'ах.

---

## Gap #2 — Limitation Option як CONTROL (а не тільки display)

**Проблема.** Існуючий `Controls / Limitation Option` — це **read-only** дисплей-чіп без вбудованого dropdown'у. Юзер бачить mode, але клік не відкриває picker.

**Як обійшли.** Кастомний popover (5 пунктів) над клікнутим чіпом. У Figma — окремий frame як state 3 (`Limitation dropdown opened`).

**Пропозиція в UI Kit.**
- Додати варіант `Type=Control` у компонент: видимий + clickable + chevron-індикатор.
- Окремий компонент `Limitation Option Picker` (popover з 5 пунктами, active state).
- Властивість `Allowed Modes` (для project rules — без `By Account`).

**Приоритет.** High — без цього нема UX-завершеності.

---

## Gap #3 — Typos у Limitation Option

**Знайдено в UI Kit.** Варіанти `Recieve` (має бути `Receive`) і `Send end recieve` (має бути `Send and Receive`).

**Не блокує** прототип, але треба зафіксувати fix у UI Kit перед production.

**Приоритет.** Low (косметика), але швидкий.

---

## Gap #4 — `By Account` семантика (Open question)

Що означає `By Account` коли немає жодного project rule:
- варіант A: блок усього (= No transaction) — потім юзер додає винятки
- варіант B: дефолт `Send and Receive` + override проектами

**У прототипі прийнято варіант A** — "тільки проекти, інші — заблоковано". Якщо product вирішить інакше — переробка інтерфейсу мінімальна (тільки текст pointer'а).

**Приоритет.** Product decision, не UI Kit.

---

## Gap #5 — Per-project rule chip

**Проблема.** Для project rules потрібен компактний чіп `Project tag (color dot + name) + ✕`. У UI Kit є `Controls / Access Project Tag` (Default / Selected) — близько, але semantically це про "access" (хто має доступ до проекту), а не про сам tag.

**Як зібрано зараз.** Кастом `.proj-rule__tag` — pill з кольоровою крапкою (account-type color) + name + ✕.

**Пропозиція в UI Kit.**
- Винести `Project Tag` як окремий compact-компонент (reuse: filter chips, mention chips, rule chips).
- Properties: `Show Dot`, `Show Remove`, `Size (S / M)`.

**Приоритет.** Medium.

---

## Gap #6 — Subtitle під H1 у Modal

**Проблема.** Pattern `modal.md` не описує case з контекстним subtitle під title (`for Privat Основна`). Це часта потреба — будь-яка дія "над об'єктом" хоче такий пояснювач.

**Як зібрано зараз.** `body small, secondary` під H1 у заголовку модалки.

**Пропозиція.**
- Додати в `patterns/modal.md` опційний slot `Subtitle` (Body/Small, secondary).
- Або — окремий компонент `Modal Header` з вбудованим subtitle і close.

**Приоритет.** Low (1 рядок у pattern).

---

## Gap #7 — Empty state CTA inside Modal

**Проблема.** Більшість emptу-state ілюстрацій (з kb/orbuculum.design.md) описано для page-level. Для модалки — обмеженіша висота і немає декору.

**Як зібрано зараз.** Коротка фраза + text-button (`Create account →`). Без ілюстрацій (правило).

**Пропозиція.** Не gap у компоненті, а додати в `decisions.md` патерн: empty в модалці = `body small` + `text button` CTA, padding 36px vertical.

**Приоритет.** Low.

---

## Підсумок

| # | Gap | Тип | Приоритет |
|---|-----|-----|-----------|
| 1 | Account Row | Новий компонент | Medium |
| 2 | Limitation Option як control | Розширення / новий picker | **High** |
| 3 | Typos у Limitation Option | Fix labels | Low |
| 4 | `By Account` semantics | Product decision | — |
| 5 | Project Tag (compact) | Новий компонент | Medium |
| 6 | Modal subtitle slot | Розширення pattern | Low |
| 7 | Empty in modal | Pattern decision | Low |