mirror of https://github.com/Matysh/houseplan-card synced 2026-10-04 05:41:34 +00:00

Files

T

Claude c3e64dc60a feat(dialogs): финал #600 — мёртвые стили, парные кадры, документация, потолки

Завершение четырёх серий по референсу docs/design/600-settings-dialogs/:

- из eager-листов dialogs.styles.ts и chrome.styles.ts сняты стили прежней
  разметки диалогов (.bindsel/.bindharow/.entcheck, .ctrlchip*, .markerhelp*,
  .helpfieldlabel, .markerradios, .markerlightdisabled, .markerbadgetechnical,
  .markerglowvalue, .fileupload, .descin, .pdfedit/.pdftag, .gsrow,
  .ripple-*row, .radaradditional, .togglehint, футеры marker/room) — 5,8 КБ
  исходника; с разметки сняты уже пустые классы;
- «Additional actions» карточки Details — подзаголовок и строка действий
  набора, без раскрывашки (radar-section.ts, только additional-placement);
- Q3 уточнён по кадру: hp-device-preview стоит без обёртки — у него свой
  заголовок «Display preview · Now», второй над ним удваивался; пустое
  состояние — блок на тинте;
- §6.1: «?» у комнаты стоит у поля Home Assistant area, а не у заголовка
  Basics; подписи сегмента заливки — None · Zigbee · Lights · Temperature ·
  Custom (два коротких ключа room.fill_seg_*), источники — «Average of the
  room’s sensors / Specific device or entity», режим свечения — «Colour and
  brightness» (тексты прежних ключей укорочены под сегменты);
- подпись поля с «?» и без стоят на одной линии в сетке (min-height 32 по
  кнопке hp-help); иконка внутри подсказки — inline;
- парные кадры: demo/capture_design_pairs_600.mjs снимает четыре диалога в
  двух темах на 560 в состояниях макетов → docs/design/…/pairs/ (8 PNG,
  палитра 256, ~0,5 МБ); ACCEPTANCE.md — статус по диалогам, расхождения с
  референсом по каждому со ссылкой на пункт SPEC и принятые адаптации (шапка
  hp-dialog по §3, тумблеры набора по К7, секции радара/пылесоса по §7.2);
- changelog EN/RU («Не выпущено»), USER-GUIDE ru/en: раздел «Как устроены
  диалоги настроек», таблица настроек пространства по новым карточкам,
  диалог комнаты, диалог устройства, ссылка «Как у пространства»;
- бюджет: стартовый граф 289 853 — потолок 291 600 → 290 900 (снятые стили);
  ленивый редакторский 243 149 — итоговый потолок 243 900 с разбором по
  сериям в bundle-budget.mjs.

Golden: 11 сцен диалогов (device-dialog-*, room-temperature-dialog-*,
toggle-entity-dialog-*, device-help-popover-light-ru,
general-color-popover-desktop-en, settings-help-zoom-200-*,
device-ripple-color-popover-mobile-ru, space-room-color-popover-desktop-ru)
прогнаны диагностически (capture, HP_ALLOW_FOREIGN_CAPTURE, только
artifacts/): харнесс проходит все пути без исключений, кадры «different» —
эталоны переснимаются на Linux CI / машине владельца по #455.
Скриншоты документации (06-device-editor, 06-device-display-preview и др.)
устарели по отпечатку — пересъёмка перед кандидатом беты (#479).

Гейты: typecheck, build, bundle:sync (три копии байт в байт), npm test
2793 pass по четырём частям, mutation-gate --check, check-inputs --coverage,
фокусные смоки четырёх форм и смоки диалога устройства.

Issue: #600
User-Visible: yes

2026-09-20 13:01:07 +03:00

10 KiB

Raw Blame History

#600 · приёмка против референса

AC1 в #600 требует не «эталоны изменились», а парное сравнение с референсом: для каждого диалога кадр продукта рядом с кадром референса, и каждое расхождение названо со ссылкой на пункт SPEC.md или узел reference/.

Этот документ — место, где такое сравнение живёт. Он пополняется по мере реализации, по одной таблице на диалог, и предъявляется на код-ревью вместе с кадрами.

Как снимать парные кадры

Кадры продукта — одной командой из корня репозитория, на собранном бандле:

npm run build && npm run bundle:sync
node demo/capture_design_pairs_600.mjs          # → pairs/<диалог>-<тема>.png

Скрипт открывает четыре диалога в состояниях макетов (пространство с температурной заливкой и своим севером, общие настройки со статическим фоном, комната с эффективной температурной заливкой, привязанный светильник с ролью Always и фиксированным свечением), раскрывает скроллер на всю высоту и снимает поверхность 560 px в светлой и тёмной теме. Кадры референса — screenshots/ из архива дизайнера (светлая тема, 1120 px при devicePixelRatio 2).

Это диагностические кадры, а не golden-базы: они не принимаются golden:accept и не участвуют в golden:verify. Эталоны одиннадцати сцен живут отдельно и закрываются AC10. PNG пережаты в палитру 256 цветов — для сравнения раскладки этого достаточно, а вес папки остаётся в полумегабайте.

Статус по диалогам

Диалог	Серия	Референс	Продукт (светлая / тёмная)	Расхождения названы	Готово
Space settings	1	`screenshots/space-settings-2026-09-18.png`	`pairs/space-light.png` / `pairs/space-dark.png`	ниже	да
General settings	2	`screenshots/general-settings-2026-09-18.png`	`pairs/general-light.png` / `pairs/general-dark.png`	ниже	да
Room settings	3	`screenshots/room-settings-2026-09-18.png`	`pairs/room-light.png` / `pairs/room-dark.png`	ниже	да
Device on the plan	4	`screenshots/device-on-the-plan-2026-09-18.png`	`pairs/device-light.png` / `pairs/device-dark.png`	ниже	да

Расхождения с референсом, по диалогам

Каждая строка — что видно на кадре продукта иначе, чем на кадре референса, со ссылкой на пункт SPEC.md или узел reference/, и чем это закрыто.

Space settings (§4)

Что	Референс	Продукт	Основание
Образец карточки комнаты	убран (§4.2)	внутри карточки Room cards на тинте	решение владельца Q2
Поле цвета	`input[type=color]` (§3.2)	плашка вокруг `hp-color-opacity`	решение владельца Q5
Тексты подписей	Space name, Floor plan, Appearance, Room cards, Sun & light…	те же (переименования Q6)	§4.1, решение владельца Q6
Копия / удаление	Copy и Delete слева в футере	то же	§4.1 «Футер»

General settings (§5)

Что	Референс	Продукт	Основание
Zigbee links	один заголовок, тумблер, callout	то же: блок `hp-zigbee-topology-settings` в режиме `embedded` без своего заголовка	§5.1, дефект 1 из #600
Плитки цвета	3 в ряд, hex, число прозрачности	то же; свотч — trigger прежнего пикера	Q5
Компас	44 px справа от поля севера	то же, с сохранённым перетаскиванием стрелки	§3.1 «Компас»; прежний ввод с свидетелем `smoke_sun`

Room settings (§6)

Что	Референс	Продукт	Основание
Образец карточки	убран (§6.1 «Font sizes»)	под подсказкой размеров, на тинте	решение владельца Q2
«?» у Basics	у поля Home Assistant area	у поля Home Assistant area (перенесён с заголовка карточки)	§6.1
Подписи сегмента заливки	None · Zigbee · Lights · Temperature · Custom	None · Zigbee · Lights · Temperature · Custom (короткие ключи `room.fill_seg_*` для двух длинных)	§6.1
Подписи источников	Temperature / Humidity	Temperature source / Humidity source (прежние ключи)	текст, не раскладка
Поле цвета «Свой цвет»	`input[type=color]`	плашка вокруг `hp-color-opacity`	Q5
Кнопка выбора датчика	в потоке, панель с поиском	то же (`sourcePicker` набора)	§3.1 «Кнопка выбора источника»

Device on the plan (§7)

Что	Референс	Продукт	Основание
Подписи сегмента привязки	Virtual device · Pick from the HA list	Virtual device (no binding) · Pick from the HA list	прежний ключ `marker.virtual_option`; текст, не раскладка
«Show entities»	в панели выбора рядом с поиском	то же	решение владельца Q8
Ask for confirmation	скрыта при Do nothing	показана только при toggle / run	Q8; прежнее условие
Display preview	упрощённый макет: сцена и таблица фактов	`hp-device-preview` целиком со своим заголовком «Display preview · Now» и переключателем деталей	решение владельца Q3, §3.1 «Превью маркера»
Additional actions	строка-тумблер «This is a presence radar»	подзаголовок и кнопка «Объявить радаром» — прежнее действие радара; секции радара и пылесоса внутри диалога рисуются своими модулями без изменений	§7.2: ветки вне прототипа теми же примитивами; внутренняя разметка радара — вне скоупа #600
Иконка	поле с превью, Clear, Pin в подсказке	то же; в HA — `ha-icon-picker` вместо текстового поля	§7.1
Value badge	тумблер, Value, Position сегментом	то же; предупреждения бейджа — заметки и callout'ы	§7.1

Принятые адаптации

Расхождения, которые не являются дефектом, потому что продиктованы контрактами House Plan или решением владельца. Заполняется по ходу работы; каждая строка — с доводом, а не «так вышло».

Место	Референс	Продукт	Почему
Образцы карточки комнаты	убраны (`SPEC.md` §4.2, §6.1)	сохранены, встроены в карточку	решение владельца Q2: слайдер размера без образца — подбор вслепую
Поле цвета	нативный `input[type=color]` (`SPEC.md` §3.2)	прежний `hp-color-opacity`, новая только раскладка	решение владельца Q5; `nativeColors() === 0` — контракт со свидетелем `smoke_color_picker_consumers`
Цвета	фиксированные hex (`#4a9ec6`, `#f6f6f6`, …)	переменные темы HA	`SPEC.md` §2 «допустимые адаптации»; тёмная тема обязательна
Шапка	круглая кнопка × слева, заголовок, бейдж справа	прежняя шапка `hp-dialog` (× справа) с бейджем в слоте заголовка	`SPEC.md` §3 «Шапка»: «существующая шапка hp-dialog; бейдж добавляется»
Тумблеры	`input[type=checkbox][role=switch]` с нарисованной дорожкой	нативный чекбокс, нарисованный CSS набора; `ha-switch` не используется	К7: один вид в HA, на стенде и в golden; `smoke_ha_controls`
Радар и пылесос внутри диалога устройства	нет в прототипе	прежняя разметка секций (`radar-section.ts`, `_renderVacSection`)	`SPEC.md` §7.2: ветки вне прототипа; их внутренняя раскладка — отдельная задача
Высота строки подписи	22 px, «?» 22 px	32 px — по высоте кнопки `hp-help`	подписи с «?» и без стоят на одной линии в сетке из двух полей

10 KiB Raw Blame History Unescape Escape