skills/westudy/references/design.md

# Дизайни конструктора: довідник, перевірка, тимчасовий перегляд

Доступні `get_design_catalog`, `get_design_reference`, `validate_design`, `preview_design`. Вони готують і перевіряють native JSON; тимчасовий перегляд сам нічого не публікує. Для пошуку, збереження чернеток, публікації та стилів сайту прочитай [pages.md](pages.md). Не називай preview збереженою сторінкою. Для матеріалів курсу прочитай [course-materials.md](course-materials.md): generalConfig береться з get_course_element, а validate_design/preview_design потребують context="course". Приватний доступ студента загальний viewer не перевіряє.

## Знання й побудова

1. Прочитай `get_design_catalog`. Повідомляй підтримувані типи за повернутим каталогом, а не за пам'яттю. Зберігай версії в контексті; після оновлення підключення перечитай каталог. Відомий бібліотеці вузол може бути недоступний у конкретному профілі редактора чи viewer.
2. Через `get_design_reference` завантажуй потрібні розділи, максимум чотири за виклик. Для першого дизайну прочитай constructor `common`, `page`, `general-config`, потім потрібні блоки/елементи. Не витрачай контекст на всю бібліотеку. JSON Schema додається лише з `includeSchema: true`; приклади типово включені.
3. Готуй рідні `{page, generalConfig}` за довідником. Для сторінки школи бери активний `generalConfig` через `get_site_config`; правила повідомлення користувачу та роботи з відмінними прикладами оформлення — у [pages.md](pages.md#поточна-дизайн-система-та-приклади-оформлення). `page` — `{blocks, config}`, без обгортки сутності сторінки. Компонуй дизайн із властивостей блоків і елементів; приклади — підказки формату, не обов’язкова мозаїка шаблонів. Зберігай успадкування кольорів, типографіки, стилів кнопок і форм, не дублюй глобальні стилі в кожному елементі. Якщо завдання включає створення нової теми, її палітра повинна мати різні ролі.
4. Для `text.config.content` потрібен native ProseMirror doc, профіль editor `profiles/rich-icons-size`. Для `accordion.config.items[].content` — `profiles/rich-icons`. Прочитай `common/document`, `common/rendering`, потрібний профіль і вузли. Не використовуй спрощений формат запитань або довільні ноди/marks. Блок `form` описаний у constructor `blocks/form` (реалізація ws-forms): нові форми/питання без UUID/id, наявні ідентичності тієї самої сторінки зберігаються. Курсові навчальні блоки поки не описані.
5. При правках збережи решту переданого дизайну: UUID, порядок, невідомі metadata та неторкнуті поля. Не проганяй весь дизайн через спрощення текстового редактора. Не видаляй непідтримуваний контент, щоб пройти перевірку: поясни обмеження й узгодь заміну.

Для головної та лендінгу курсу дотримуйся [правил вибору типових блоків](pages.md#типові-блоки-сторінок). У constructor-каталозі доступні `blocks/courses_all` і `blocks/course_landing_promo` із ws-courses; це блоки сайту, а не навчальні блоки уроків/завдань. Параметри й вимоги до контексту бери з цих розділів. Наявність схеми не гарантує реєстрацію компонента та дані курсу в окремому preview-хості. Якщо їх немає, поясни обмеження перегляду, збережи штатний блок і не підмінюй реєстрацію декоративною кнопкою.

## Перевірка й перегляд

Виклич `validate_design`. Він повертає без обгортки виконання `valid`, `errors`, `warnings`, `versions`, `sizeBytes`, `truncated` та `visualCheckPerformed: false`. Шляхи помилок — JSON Pointer, наприклад `/page/blocks/0/config/content/content/0/type`. Виправ помилки, розглянь попередження та перевір знову після змін. Якщо `truncated: true`, результат містить лише частину проблем. Валідатор не перевіряє доступність зовнішніх файлів, вигляд сторінки або всі CSS/HTML-значення.

Для перегляду виклич `preview_design` з тим самим дизайном. Потрібен дозвіл `design:preview`. Це тимчасовий запис: посилання працює 15 хвилин із моменту створення кешу, а не з моменту запиту чи відкриття браузера. Посилання доступне кожному, хто його має; воно не прив'язане до сесії браузера. Не надсилай його третім особам без доручення.

Команда preview має стандартну обгортку виконання. При `QUEUED`/`RUNNING` читай `get_execution`. При `SUCCEEDED` відкривай саме `result.url`. Не конструюй ID або URL самостійно. Після спливу терміну можна створити новий preview; при невідомому результаті попереднього виклику спочатку перевір його executionId.

Якщо є інструмент повноцінного браузерного перегляду:

- Відкрий посилання, дочекайся завершення завантаження й оглянь фактичний дизайн на широкому та вузькому екрані.
- Перевір текст, відступи, переноси, обрізання, горизонтальний скрол і зображення. За потреби зроби скриншоти. Перевір акордеони, слайдери та внутрішні якорі.
- Перевіряй посилання в межах завдання. Не надсилай форми, платежі та інші дії зі сторонніми наслідками заради тесту без відповідного доручення. Зовнішні адреси не вважай перевіреними лише за наявністю href.
- Якщо є проблема, поправ JSON, знову перевір і створи новий preview. Не повідомляй про візуальну перевірку без фактичного перегляду.

Без браузера підготуй і перевір JSON, поверни посилання та прямо повідом, що візуально результат не перевірявся. Вибір цього режиму залежить від наявних інструментів, а не назви моделі або застосунку.

У viewer є повтори завантаження й кнопка Retry: іноді в браузері агента OPTIONS проходить, а перший GET падає. Дочекайся штатних повторів, за потреби натисни Retry один раз. Якщо це не допомогло, повідом фактичну помилку; не вважай порожній екран доказом неправильного дизайну. Цей збій не потребує нового запису кешу, доки посилання не прострочене.

Для читання та зміни загальних стилів матеріалів курсів дивись [course-design.md](course-design.md): спільний `courses` або індивідуальний `course`. Стилі лендінгів залишаються частиною дизайн-системи сайту.