Packages

Dashhaus is seven packages that share one version, 0.3.0, and move together.

Package	What it is	Who installs it
@dashhaus/bundle	The prebuilt Dashhaus Lovelace bundle: the Orb and Field dashboards, React and every stylesheet in one ES module.	Using a skin
@dashhaus/deploy	Deploy a Dashhaus dashboard into Home Assistant: copy the bundle, register the resource and create the dashboards from dashboard.config.mjs.	Using a skin, building a skin
@dashhaus/core	The headless Home Assistant foundation behind Dashhaus skins: entity models, the store, mappers, actions, useHa hooks and interaction primitives. No markup, no CSS.	Your own app, building a skin
@dashhaus/dashboard	The framework a Dashhaus skin's Lovelace card draws on: the skin runtime, card frame, YAML schema, automatic layout and conformance preset.	Building a skin
@dashhaus/orb	The Orb skin for Home Assistant: React cards, bundles and dashboard furniture, and custom:dashhaus-orb, a Lovelace card drawn from YAML.	Your own app
@dashhaus/field	The Field skin for Home Assistant: hardware-style React modules and page furniture, and custom:dashhaus-field, a Lovelace card drawn from YAML.	Your own app
create-dashhaus-skin	Start your own Dashhaus skin: a standalone project with a control card, a reading card and its Lovelace card, on @dashhaus/core.	Building a skin, once

How they depend on each other

@dashhaus/core           React (peer), home-assistant-js-websocket (optional peer)
  └─ @dashhaus/dashboard
       ├─ @dashhaus/orb
       ├─ @dashhaus/field
       └─ your skin       (what create-dashhaus-skin writes depends on core and dashboard)

@dashhaus/bundle         built from orb and field; depends on nothing
@dashhaus/deploy         depends on esbuild only; never on React, core or a skin

So a dashboard that only uses Orb and Field installs @dashhaus/bundle and @dashhaus/deploy and no React at all. A skin installs core and dashboard and deploys its own bundle with the same deploy tool.

@dashhaus/core

Import	What it is
@dashhaus/core	The transport and store, HaProvider and its selectors, the useHa<Name> hooks and Ha<Name> headless components, the registry, history and request hooks (useHaRegistry, useHaAreas, useHaArea, useHaHistory, useHaRequest), the mappers and action factories, and HaActionError
@dashhaus/core/entities, @dashhaus/core/entities/*	The entity models and their pure logic (./entities/light/types, ./entities/format), with no React and no Home Assistant
@dashhaus/core/primitives	Headless interaction hooks: press, slider, range slider, sheet, keypad, and useGuardedAction for an action that asks first or takes a code
@dashhaus/core/hooks	Shared hooks with no UI: useNow, useDelayLeft, useScrollSpy, useHashPage, and useDemoClimate for stories
@dashhaus/core/perf	The opt-in performance marks the deployed bundle records, off unless the page asks for them with ?dashhaus_perf=1
@dashhaus/core/websocket	connectHomeAssistant and createHomeAssistantTransport: the one module that imports home-assistant-js-websocket
@dashhaus/core/seeds/*	One domain's demo data per module (./seeds/lock): its <NAME>_SEEDS, <NAME>_WORST_CASE and useDemo<Name> hook, the same for every skin's stories
@dashhaus/core/demo	Demo transports for Storybook and tests, and createDemoStore() for the whole house
@dashhaus/core/testing	A fake transport (with calls, emit and emitEntity) and a render under a real store, for connected-card tests (needs Vitest and Testing Library)
@dashhaus/core/fixtures/*	Raw Home Assistant state fixtures

The demo, testing and fixture subpaths are for stories and tests: their data can change in any release.

For a skin author

Import	What it is	Stability
@dashhaus/dashboard	The full Lovelace entry: element base, nav, room sensors and token scoping	Not part of the contract
@dashhaus/dashboard/skin	The frozen skin-author surface: LovelaceDashboardElement, registerCard, scopeToHost, autoInput, useActionStatus (the rejected-command status a page shows), LovelaceHass, AutoEntityEntry, ActionStatus and ActionMessage	The frozen contract
@dashhaus/dashboard/card	The frame every skin's card draws on: footprint flags, ids and aria, details state, tile/sheet composition	The frozen contract
@dashhaus/dashboard/schema	The shared YAML Reader, the card kind table and card reader, the shared option readers, the renderer dispatch and DashboardConfigError. Pure	The frozen contract
@dashhaus/dashboard/layout	The automatic layout: visibility, area resolution, name sort, grouping, placement. Pure	May change with the layout work
@dashhaus/dashboard/conformance	checkCards, the generic card preset a skin runs against its own cards. Node- and test-only	The compatibility test

Until 1.0 a breaking change to the contract is allowed, but it is announced as one; the conformance check is what says a skin still fits.

The skins

Import	What it is
@dashhaus/orb	The skin's cards, connected tiles, bundles and dashboard furniture. Loads the token CSS
@dashhaus/orb/lovelace/card	createDashhausCard, defineDashhausCard and the custom:dashhaus-orb element
@dashhaus/orb/lovelace/auto	autoDashboard, the automatic layout a config or deploy factory can call. Pure, no React
@dashhaus/orb/storybook	The skin's Storybook section, toolbar and decorator (repo tooling)
@dashhaus/orb/styles/tokens.css	Orb's design tokens, the only source of its colours
@dashhaus/field	The skin's modules, connected modules and page furniture. Loads the token CSS
@dashhaus/field/lovelace/card	createFieldCard, defineFieldCard and the custom:dashhaus-field element
@dashhaus/field/storybook	The skin's Storybook section, toolbar and decorator (repo tooling)
@dashhaus/field/styles/tokens.css	Field's design tokens, the only source of its colours, every one prefixed --fd-

@dashhaus/deploy

For a script that deploys from code rather than the dashhaus-deploy command:

Import	What it is
@dashhaus/deploy	deploy({ configFile, env, skipBuild, report, warn, connect, fetch }) and the loader: readConfig, resolveDashboards, resolveBundle, loadDashboards
@dashhaus/deploy/config	Types for a config (DeployConfig, DeployDashboard, DeployHa, DeployCard), and generatedDashboards()

Which path installs what

You want	Install
Orb or Field on your Home Assistant, no terminal	Nothing from npm: the Marketplace installs the bundle (Install from the Marketplace)
Orb or Field on your Home Assistant, from a script or CI	@dashhaus/bundle and @dashhaus/deploy (Deploy from the command line)
Entities in a React app, your markup	@dashhaus/core, React, home-assistant-js-websocket (Use the hooks in your app)
Orb’s or Field’s cards in a React app	@dashhaus/orb or @dashhaus/field with the above
A skin of your own	npm create dashhaus-skin@latest, which writes a project depending on core, dashboard and deploy (Build a skin)