# Мокапы (кликабельные прототипы)

Полная база прототипов mockup-first воркфлоу (см. AGENTS.md, раздел
«Design & UI»). Раздаётся отдельным контейнером `mockups` (nginx, статика)
для согласования заказчиком — локально и на проде.

## Реестр — `registry.json`

Единственный источник учёта. Поля записи:

| Поле | Что означает |
|---|---|
| `id` | Имя папки/файла прототипа |
| `title`, `description` | Название и суть — попадают в карточку галереи |
| `date` | Дата прототипа `YYYY-MM-DD` |
| `status` | `draft` (черновик) · `review` (на утверждении) · `approved` (утверждён) · `archived` (реализовано/устарело) |
| `enabled` | `true` — виден заказчику в галерее; `false` — скрыт из галереи (в базе остаётся, прямая ссылка работает) |
| `url` | Путь от корня этой папки (`папка/` или `файл.html`) |
| `screens` | Короткая сводка экранов для карточки |
| `decisions` | Зафиксированные решения заказчика по этому моку |

Правила:

- Каждый новый прототип регистрируется в реестре сразу при создании.
- Записи не удаляются и не переименовываются — история решений (как
  TASK/PLAN файлы). Мок, реализованный в рабочих шаблонах, получает
  `status: archived`, `enabled: false`.
- Переработка утверждённого мока — новая папка с новой датой и новая запись.

## Галерея — `index.html`

Читает `registry.json` и показывает включённые моки карточками: статус-бейджи
в цветах дизайн-системы, счётчик «Показано: N из M», сортировка по дате.
`?all=1` — служебный режим «показать всё, включая скрытые» (заказчику
эту ссылку не давать).

## Как смотреть

- Локально (контейнер): `docker compose up -d mockups` →
  `http://mockups.newcrm.localhost` (через traefik) или `http://localhost:18889`.
- Разово одну папку: `python3 -m http.server 18888 -d docs/plan/mockups/<папка>`.
- Прод: `https://mockups.<домен>` — деплой и доставка файлов описаны в
  `docs/deployment.md` (раздел «Мокапы»).

## Как добавить новый мок

1. Папка `ГГ-ММ-ДД-<название>/` с `index.html` и демо-данными, без бэкенда;
   `assets/` (proto.css + proto.js) скопировать из `26-10-16-role-redesign/`.
2. Добавить запись в `registry.json` (`status: review`, `enabled: true`).
3. Дать заказчику ссылку на галерею; после утверждения — `status: approved`
   и текст решения в `decisions` (с датой).