Claude
bf6602bbd8
§7 SPEC.md референса. Пять карточек #598 остались, менялось содержимое; все ключи _markerDialog и все записи в них прежние (§7.2): - Basics — баннеры привязки стали callout'ами; Name с подсказкой «Shown on the plan»; привязка — сегмент [Virtual | From the HA list] (те же радио bmode) и кнопка выбора #marker-binding с панелью в потоке (sourcePicker набора), чекбокс «Show entities» — внутри панели рядом с поиском (решение владельца Q8); Room селектом с подсказкой «по зоне / переопределяет»; секции радара и пылесоса — своими модулями без изменений; - Tap action — селект с подсказкой Target/Now, «Ask for confirmation» — строка-тумблер только при toggle/run (Q8), Entity to toggle и What to run теми же условиями (список целей — панель набора), «Controls other light sources» — чипы набора и поиск с панелью в потоке; - Light and glow — «Include the device temperature…» строкой-тумблером; роль — сегмент [Auto | Always | Never] с подсказкой результата Auto; Leading light entity по условиям; блок свечения (.hpf-block): подзаголовок с «?», сегмент [From source | Set colour | Colour and brightness] с отключёнными вариантами и aria-describedby на объяснение, плашка цвета вокруг прежнего hp-color-opacity (Q5), яркость и радиус строками с числом и единицей, при Never блок неактивен целиком (aria-disabled) с callout'ом причины; - Appearance — поле иконки с превью, очисткой и ссылкой Pin в подсказке; Display селектом с подсказкой режима; пульс — плашка цвета и строка размера; Value source по условиям; подраздел Value badge — компактный тумблер, Value селектом с техническим идентификатором, Position сегментом [Above | Right | Below | Left]; предупреждения бейджа — заметки и callout'ы; Display preview — прежний hp-device-preview целиком в блоке на тинте с тегом Now (решение владельца Q3); «Icon size and rotation» — две строки range-line в сетке; - Details — Model и Link в ряд, Description textarea набора, Manuals чипами и строкой действий Attach…, «Additional actions» подзаголовком набора. Футер: Hide и Delete слева, статус, Cancel и Save справа. К10: снимок черновика при _openMarkerDialog (marker-form-state.ts поверх dialog-baseline; транзиентные ключи — раскрытие и фильтры списков, busy, объявление подсказки, autoIcon, uploadId); в edit Save только при изменениях, закрытие с изменениями спрашивает через _confirmDanger. Прежние запреты Save (busy, калибровка радара, привязка не выбрана/не подтверждена) остались; привязка и радиус свечения названы словами под полем (marker.error_binding, marker.error_glow_radius), «Review N fields» ведёт к полю. Тумблеры диалога — строки набора (нативный чекбокс, К7), а не ha-switch; слайдеры — прежний _rangeInput (ha-slider в HA). Набор: sourcePicker получил toolbar и disabled; сегмент — value у радио, disabled и describedBy у варианта; callout — role note и id; unitInput — describedBy; rangeLine — id; новые классы .hpf-block/.hpf-disabled, .hpf-toolbar/.hpf-check, .hpf-iconfield/.hpf-iconpreview, .hpf-mono, .hpf-note, .hpf-hint-line, textarea.hpf-input. settingsCopy вынесен в editors/settings-copy.ts (общий для пространства, комнаты, устройства). Смоки переписаны осознанно, с пометкой #600: binding_ui (#marker-binding, .hpf-panel, #marker-show-entities), tap_run (панель набора, #marker-tap- confirm), value_face_source (.hpf-cand.sel), static_icon (callout'ы), climate_temp (#marker-use-climate-temp), help_affordance (#marker-name, .hpf-block.hpf-disabled вместо fieldset[disabled]; второй Escape в грязном диалоге спрашивает — К10), size_angle_parity (сетка Appearance), color_picker_consumers (подписи полей), device_preview_parity (сегмент стороны), ha_controls (тумблеры набора — нативные чекбоксы по К7, ha-slider прежний). Golden-harness device — .hpf-field/.hpf-block, скроллер .content. Новый фокусный свидетель demo/smoke_device_settings_form.mjs: пять карточек без старой разметки, оболочка, привязка/панель/Show entities, Q8, сегменты и блок свечения, плашки, иконка, бейдж, превью на тинте, размеры, Details, цели 44, Save/dirty/вопрос при закрытии, create-режим, семь полос экранов. Мутанты: marker-save-enabled-without-changes, marker-discard-without-asking, marker-confirm-row-shown-for-do-nothing, marker-never-keeps-glow-block-live, marker-badge-position-forgets-touch; якоря same-binding-click-resets-source, state-callout-hidden-under-help, form-kit-segment-drops-radio-semantics переставлены на новую разметку. Контрактные тесты: color-picker (два поля набора вместо flex-строк), native-select-contract (сторона бейджа — сегмент), i18n dead-keys (34 → 38 подсказок), German=English (marker.name_label). Словарь i18n/settings: 21 ключ marker.* на четыре локали; в основном каталоге marker.name_label «Name», marker.size_label «Icon size and rotation», удалены мёртвые marker.room_override, marker.light_role_always/never. Фикстуры листа диалогов набора пересняты намеренно (панель — байт в байт, AC11). Бюджет: стартовый граф 290 489 (потолок 291 600 без изменений); ленивый редакторский 243 173 — потолок 240 100 → 243 900 с разбором в bundle-budget.mjs; старые стили диалога устройства снимаются в финале. Гейты: typecheck, build, bundle:sync (три копии байт в байт), npm test 2790+ pass по четырём частям, mutation-gate --check, 39 смоков диалога устройства + новый + три формы серий 1–3. Issue: #600 User-Visible: no
🏠 House Plan — a live home map for Home Assistant
📘 Full user guide · 🇷🇺 Русский · 🗂 Project issues
Your whole home at a glance
House Plan turns Home Assistant into a live map of your home. Open the dedicated House Plan item in the Home Assistant sidebar, upload a plan or draw rooms, bind them to Home Assistant areas, and the area's devices appear automatically. You can immediately see where a light is on, a door is open, a room is too cold, Zigbee signal is weak, or a leak sensor has fired.
Setup is entirely graphical: no floor-plan YAML, Inkscape, or external editor. Plan data and device positions live on the Home Assistant server and stay in sync across screens.
Edit on a desktop computer. View and kiosk are fully supported on phones and tablets. The editors are designed primarily for a mouse and keyboard; individual touch editing operations may be awkward or unavailable. See the exact touch support contract.
What House Plan provides
- Live state and safe actions. Lights and other safe devices can toggle from the plan; a lock cannot be opened by an accidental plan tap.
- Three built-in editors. Plan creates rooms, walls and openings; Device places and configures markers; Background adds lines, labels and furniture.
- Area-aware rooms. New devices appear automatically, while room cards can show temperature, humidity, light state and average LQI.
- Light and environment. Room fills, lamp Glow, wall shadows, a day-cycle backdrop and sunlight through windows.
- Doors, windows, gates and vacuums. Openings follow real contacts and locks; a robot can show its position, dock and travelled path.
- Several floors and screens. Space tabs, swipe navigation, local viewport, and a separate initial floor for each card.
- Wall-display kiosk. A plan-only view with fullscreen navigation and icon sizes saved for that display.
Your first working room
- Install the integration and open House Plan in the Home Assistant sidebar.
- Create the first space: upload SVG/PNG/JPG/WebP, reuse an uploaded image, or choose no image and draw the plan by hand.
- In Plan, select Room outline, place vertices, and click the first point to close the outline.
- Name the room and bind it to a Home Assistant area. Use “No area” for a room that has no devices.
- Open Device: devices from the bound area are already placed; drag their markers to the correct positions.
- Optionally use Background for lines, text and furniture.
- Return to View. The plan now displays live state and accepts safe actions.
Every workflow and edge case is in the full user guide. The Background editor contract and vacuum guide are the authorities for those subsystems.
Installation
HACS
House Plan is in the HACS default catalog — no custom repository needed.
- In HACS search for House Plan and install it.
- Restart Home Assistant.
- Open Settings → Devices & services → Add integration → House Plan.
The sidebar page and optional dashboard cards are registered automatically.
After installing or updating House Plan,
restart Home Assistant and fully reload the page: Ctrl+F5 on Windows/Linux or
Cmd+Shift+R on macOS.
Storage mode (Home Assistant default)
No YAML is normally needed. If automatic registration did not make the card
available, open Settings → Dashboards → menu ⋮ → Resources → Add
resource, enter /houseplan_files/houseplan-card.js, and select JavaScript
module.
YAML resources mode (Home Assistant 2026.2+)
To manage resources in configuration.yaml independently of the dashboard
mode, use:
lovelace:
resource_mode: yaml
resources:
- url: /houseplan_files/houseplan-card.js
type: module
Legacy Home Assistant 2024.6–2026.1
Only for a full-YAML dashboard that is already managed in YAML, use:
lovelace:
mode: yaml
resources:
- url: /houseplan_files/houseplan-card.js
type: module
mode: yaml changes the dashboard itself to YAML mode. Do not switch a storage
dashboard to legacy YAML just for House Plan; use the Storage mode instructions
above instead. Do not use the on-disk path inside custom_components; Home
Assistant does not serve that path as a JavaScript module.
Manual installation
Copy the complete custom_components/houseplan release folder to
config/custom_components, restart Home Assistant, and add the House Plan
integration. Do not copy only houseplan-card.js: the card also uses an
internal manifest and content-hashed modules from the same release.
Open House Plan
After the integration is added, open House Plan in the Home Assistant sidebar. This full-page view is the primary entry point and needs no dashboard or YAML setup. It remembers the last space but always returns from another HA page in View rather than reopening an editor. Users without editing permission see the same live plan without editor controls.
If the sidebar entry cannot be registered, the integration and existing dashboard cards continue to work; check Settings → System → Repairs → System information → House Plan after restarting and hard-refreshing HA.
Optional dashboard card
Add the card only when House Plan must be embedded in a dashboard. In a Sections view it requests full width by default, while a manual size chosen in HA remains authoritative. Add it in the UI or as:
type: custom:houseplan-card
title: House plan
Different screens may start on different spaces:
type: custom:houseplan-card
default_floor: ground
All cards share server-side rooms and coordinates. Current mode, viewport and selected space remain local to the screen. Revision checks and live sync cover concurrent clients, but avoid editing the same object in two browsers at once.
Detailed documentation
- Full user guide
- Mouse/touch/keyboard matrix
- Plan tools
- Background editor
- Robot vacuums
- Touch support
Support and feedback
- Questions and plan examples: Telegram @ha_houseplan.
- Bugs and proposals: GitHub Issues.
- Before reporting, update House Plan, restart HA and hard-refresh the page. Include the version, browser, logs and reproduction steps; private entity IDs may be replaced with fictional ones.
Documentation screenshots are produced by the reproducible
npm run build && node demo/docs/capture.mjs command using synthetic data only. Scenario version,
source fingerprint and every image hash are recorded in the
screenshot index.
License: MIT.