@matter-server/dashboard 0.2.6 → 0.2.7-alpha.0-20260118-45c7af0

package/dist/esm/pages/matter-dashboard-app.js

@@ -14,10 +14,13 @@ var __decorateClass = (decorators, target, key, kind) => {
  * SPDX-License-Identifier: Apache-2.0
  */
 import { ContextProvider } from "@lit/context";
-import { LitElement, html } from "lit";
+import { mdiRefresh } from "@mdi/js";
+import { LitElement, css, html } from "lit";
 import { customElement, state } from "lit/decorators.js";
 import { clientContext } from "../client/client-context.js";
+import "../components/ha-svg-icon";
 import { clone } from "../util/clone_class.js";
+import "./components/header";
 import "./matter-cluster-view";
 import "./matter-endpoint-view";
 import "./matter-node-view";
@@ -31,28 +34,14 @@ let MatterDashboardApp = class extends LitElement {
     };
     this._state = "connecting";
     this.provider = new ContextProvider(this, { context: clientContext, initialValue: this.client });
+    this._reconnect = () => {
+      this._state = "connecting";
+      this._connect();
+    };
   }
   firstUpdated(_changedProperties) {
     super.firstUpdated(_changedProperties);
-    this.client.startListening().then(
-      () => {
-        this._state = "connected";
-        this.client.addEventListener("nodes_changed", () => {
-          this.requestUpdate();
-          this.provider.setValue(clone(this.client));
-        });
-        this.client.addEventListener("server_info_updated", () => {
-          this.provider.setValue(clone(this.client));
-        });
-        this.client.addEventListener("connection_lost", () => {
-          this._state = "disconnected";
-        });
-      },
-      (err) => {
-        this._state = "error";
-        this._error = err.message;
-      }
-    );
+    this._connect();
     const updateRoute = () => {
       const pathParts = location.hash.substring(1).split("/");
       this._route = {
@@ -63,17 +52,66 @@ let MatterDashboardApp = class extends LitElement {
     window.addEventListener("hashchange", updateRoute);
     updateRoute();
   }
+  _connect() {
+    this.client.startListening().then(
+      () => {
+        this._state = "connected";
+        this._setupEventListeners();
+      },
+      (_err) => {
+        this._state = "error";
+      }
+    );
+  }
+  _setupEventListeners() {
+    this.client.addEventListener("nodes_changed", () => {
+      this.requestUpdate();
+      this.provider.setValue(clone(this.client));
+    });
+    this.client.addEventListener("server_info_updated", () => {
+      this.provider.setValue(clone(this.client));
+    });
+    this.client.addEventListener("connection_lost", () => {
+      this._state = "disconnected";
+    });
+  }
   render() {
     if (this._state === "connecting") {
-      return html`<p>Connecting...</p>`;
+      return html`
+                <dashboard-header title="Matter Server"></dashboard-header>
+                <div class="status-page">
+                    <p class="status-message">Connecting...</p>
+                </div>
+            `;
     }
     if (this._state === "disconnected") {
-      return html`<p>Connection lost</p>`;
+      return html`
+                <dashboard-header title="Matter Server"></dashboard-header>
+                <div class="status-page">
+                    <p class="status-message error">Connection lost</p>
+                    <p class="status-hint">
+                        The connection to the Matter Server was lost. Please check if the server is running.
+                    </p>
+                    <button class="retry-button" @click=${this._reconnect}>
+                        <ha-svg-icon .path=${mdiRefresh}></ha-svg-icon>
+                        Reconnect
+                    </button>
+                </div>
+            `;
     }
     if (this._state === "error") {
       return html`
-                <p>Error: ${this._error}</p>
-                <button @click=${this.client.disconnect}>Clear stored URL</button>
+                <dashboard-header title="Matter Server"></dashboard-header>
+                <div class="status-page">
+                    <p class="status-message error">No connection</p>
+                    <p class="status-hint">
+                        Unable to connect to the Matter Server. Please check if the server is running.
+                    </p>
+                    <button class="retry-button" @click=${this._reconnect}>
+                        <ha-svg-icon .path=${mdiRefresh}></ha-svg-icon>
+                        Reconnect
+                    </button>
+                </div>
             `;
     }
     if (this._route.prefix === "node" && this._route.path.length == 3) {
@@ -110,6 +148,63 @@ let MatterDashboardApp = class extends LitElement {
         ></matter-server-view>`;
   }
 };
+MatterDashboardApp.styles = css`
+        :host {
+            display: block;
+            min-height: 100vh;
+            background-color: var(--md-sys-color-background);
+        }
+
+        .status-page {
+            display: flex;
+            flex-direction: column;
+            align-items: center;
+            justify-content: center;
+            padding: 48px 24px;
+            text-align: center;
+        }
+
+        .status-message {
+            font-size: 1.5rem;
+            color: var(--md-sys-color-on-background);
+            margin: 0 0 16px 0;
+        }
+
+        .status-message.error {
+            color: var(--danger-color);
+        }
+
+        .status-hint {
+            font-size: 1rem;
+            color: var(--md-sys-color-on-surface-variant);
+            margin: 0;
+            max-width: 400px;
+        }
+
+        .retry-button {
+            display: inline-flex;
+            align-items: center;
+            gap: 8px;
+            margin-top: 24px;
+            padding: 12px 24px;
+            font-size: 1rem;
+            background-color: var(--md-sys-color-primary);
+            color: var(--md-sys-color-on-primary);
+            --icon-primary-color: var(--md-sys-color-on-primary);
+            border: none;
+            border-radius: 4px;
+            cursor: pointer;
+        }
+
+        .retry-button:hover {
+            opacity: 0.9;
+        }
+
+        .retry-button ha-svg-icon {
+            width: 20px;
+            height: 20px;
+        }
+    `;
 __decorateClass([
   state()
 ], MatterDashboardApp.prototype, "_route", 2);

package/dist/esm/pages/matter-dashboard-app.js.map

@@ -1,6 +1,6 @@
 {
   "version": 3,
   "sources": ["../../../src/pages/matter-dashboard-app.ts"],
-  "mappings": "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",
+  "mappings": "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",
   "names": []
 }

package/dist/esm/util/theme-service.d.ts

@@ -0,0 +1,27 @@
+/**
+ * @license
+ * Copyright 2025-2026 Open Home Foundation
+ * SPDX-License-Identifier: Apache-2.0
+ */
+/**
+ * Theme service for managing dark/light mode preferences.
+ * Supports three modes: light, dark, and system (auto-detect from OS).
+ */
+export type ThemePreference = "light" | "dark" | "system";
+export type EffectiveTheme = "light" | "dark";
+declare class ThemeServiceImpl {
+    private _preference;
+    private _mediaQuery;
+    private _listeners;
+    constructor();
+    get preference(): ThemePreference;
+    get effectiveTheme(): EffectiveTheme;
+    setPreference(pref: ThemePreference): void;
+    cycleTheme(): ThemePreference;
+    subscribe(callback: (theme: EffectiveTheme) => void): () => void;
+    private _loadPreference;
+    private _applyTheme;
+}
+export declare const ThemeService: ThemeServiceImpl;
+export {};
+//# sourceMappingURL=theme-service.d.ts.map

package/dist/esm/util/theme-service.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"theme-service.d.ts","sourceRoot":"","sources":["../../../src/util/theme-service.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH;;;GAGG;AAEH,MAAM,MAAM,eAAe,GAAG,OAAO,GAAG,MAAM,GAAG,QAAQ,CAAC;AAC1D,MAAM,MAAM,cAAc,GAAG,OAAO,GAAG,MAAM,CAAC;AAI9C,cAAM,gBAAgB;IAClB,OAAO,CAAC,WAAW,CAA6B;IAChD,OAAO,CAAC,WAAW,CAAiB;IACpC,OAAO,CAAC,UAAU,CAAmD;;IASrE,IAAI,UAAU,IAAI,eAAe,CAEhC;IAED,IAAI,cAAc,IAAI,cAAc,CAKnC;IAED,aAAa,CAAC,IAAI,EAAE,eAAe,GAAG,IAAI;IAM1C,UAAU,IAAI,eAAe;IAQ7B,SAAS,CAAC,QAAQ,EAAE,CAAC,KAAK,EAAE,cAAc,KAAK,IAAI,GAAG,MAAM,IAAI;IAKhE,OAAO,CAAC,eAAe;IAyBvB,OAAO,CAAC,WAAW;CAYtB;AAED,eAAO,MAAM,YAAY,kBAAyB,CAAC"}

package/dist/esm/util/theme-service.js

@@ -0,0 +1,71 @@
+/**
+ * @license
+ * Copyright 2025-2026 Open Home Foundation
+ * SPDX-License-Identifier: Apache-2.0
+ */
+const STORAGE_KEY = "matterTheme";
+class ThemeServiceImpl {
+  constructor() {
+    this._preference = "system";
+    this._listeners = /* @__PURE__ */ new Set();
+    this._mediaQuery = window.matchMedia("(prefers-color-scheme: dark)");
+    this._mediaQuery.addEventListener("change", () => this._applyTheme());
+    this._loadPreference();
+    this._applyTheme();
+  }
+  get preference() {
+    return this._preference;
+  }
+  get effectiveTheme() {
+    if (this._preference === "system") {
+      return this._mediaQuery.matches ? "dark" : "light";
+    }
+    return this._preference;
+  }
+  setPreference(pref) {
+    this._preference = pref;
+    localStorage.setItem(STORAGE_KEY, pref);
+    this._applyTheme();
+  }
+  cycleTheme() {
+    const cycle = ["light", "dark", "system"];
+    const currentIndex = cycle.indexOf(this._preference);
+    const nextIndex = (currentIndex + 1) % cycle.length;
+    this.setPreference(cycle[nextIndex]);
+    return this._preference;
+  }
+  subscribe(callback) {
+    this._listeners.add(callback);
+    return () => this._listeners.delete(callback);
+  }
+  _loadPreference() {
+    const urlParams = new URLSearchParams(window.location.search);
+    const themeParam = urlParams.get("theme");
+    if (themeParam && ["light", "dark", "system"].includes(themeParam)) {
+      this._preference = themeParam;
+      localStorage.setItem(STORAGE_KEY, themeParam);
+      urlParams.delete("theme");
+      const newUrl = urlParams.toString() ? `${window.location.pathname}?${urlParams.toString()}${window.location.hash}` : `${window.location.pathname}${window.location.hash}`;
+      history.replaceState({}, "", newUrl);
+      return;
+    }
+    const stored = localStorage.getItem(STORAGE_KEY);
+    if (stored && ["light", "dark", "system"].includes(stored)) {
+      this._preference = stored;
+    }
+  }
+  _applyTheme() {
+    const effective = this.effectiveTheme;
+    document.documentElement.classList.toggle("dark-theme", effective === "dark");
+    const metaThemeColor = document.querySelector('meta[name="theme-color"]');
+    if (metaThemeColor) {
+      metaThemeColor.setAttribute("content", effective === "dark" ? "#1e1e1e" : "#03a9f4");
+    }
+    this._listeners.forEach((cb) => cb(effective));
+  }
+}
+const ThemeService = new ThemeServiceImpl();
+export {
+  ThemeService
+};
+//# sourceMappingURL=theme-service.js.map

package/dist/esm/util/theme-service.js.map

@@ -0,0 +1,6 @@
+{
+  "version": 3,
+  "sources": ["../../../src/util/theme-service.ts"],
+  "mappings": "AAAA;AAAA;AAAA;AAAA;AAAA;AAcA,MAAM,cAAc;AAEpB,MAAM,iBAAiB;AAAA,EAKnB,cAAc;AAJd,SAAQ,cAA+B;AAEvC,SAAQ,aAAmD,oBAAI,IAAI;AAG/D,SAAK,cAAc,OAAO,WAAW,8BAA8B;AACnE,SAAK,YAAY,iBAAiB,UAAU,MAAM,KAAK,YAAY,CAAC;AACpE,SAAK,gBAAgB;AACrB,SAAK,YAAY;AAAA,EACrB;AAAA,EAEA,IAAI,aAA8B;AAC9B,WAAO,KAAK;AAAA,EAChB;AAAA,EAEA,IAAI,iBAAiC;AACjC,QAAI,KAAK,gBAAgB,UAAU;AAC/B,aAAO,KAAK,YAAY,UAAU,SAAS;AAAA,IAC/C;AACA,WAAO,KAAK;AAAA,EAChB;AAAA,EAEA,cAAc,MAA6B;AACvC,SAAK,cAAc;AACnB,iBAAa,QAAQ,aAAa,IAAI;AACtC,SAAK,YAAY;AAAA,EACrB;AAAA,EAEA,aAA8B;AAC1B,UAAM,QAA2B,CAAC,SAAS,QAAQ,QAAQ;AAC3D,UAAM,eAAe,MAAM,QAAQ,KAAK,WAAW;AACnD,UAAM,aAAa,eAAe,KAAK,MAAM;AAC7C,SAAK,cAAc,MAAM,SAAS,CAAC;AACnC,WAAO,KAAK;AAAA,EAChB;AAAA,EAEA,UAAU,UAAuD;AAC7D,SAAK,WAAW,IAAI,QAAQ;AAC5B,WAAO,MAAM,KAAK,WAAW,OAAO,QAAQ;AAAA,EAChD;AAAA,EAEQ,kBAAwB;AAE5B,UAAM,YAAY,IAAI,gBAAgB,OAAO,SAAS,MAAM;AAC5D,UAAM,aAAa,UAAU,IAAI,OAAO;AACxC,QAAI,cAAc,CAAC,SAAS,QAAQ,QAAQ,EAAE,SAAS,UAAU,GAAG;AAEhE,WAAK,cAAc;AACnB,mBAAa,QAAQ,aAAa,UAAU;AAE5C,gBAAU,OAAO,OAAO;AACxB,YAAM,SAAS,UAAU,SAAS,IAC5B,GAAG,OAAO,SAAS,QAAQ,IAAI,UAAU,SAAS,CAAC,GAAG,OAAO,SAAS,IAAI,KAC1E,GAAG,OAAO,SAAS,QAAQ,GAAG,OAAO,SAAS,IAAI;AACxD,cAAQ,aAAa,CAAC,GAAG,IAAI,MAAM;AACnC;AAAA,IACJ;AAGA,UAAM,SAAS,aAAa,QAAQ,WAAW;AAC/C,QAAI,UAAU,CAAC,SAAS,QAAQ,QAAQ,EAAE,SAAS,MAAM,GAAG;AACxD,WAAK,cAAc;AAAA,IACvB;AAAA,EAEJ;AAAA,EAEQ,cAAoB;AACxB,UAAM,YAAY,KAAK;AACvB,aAAS,gBAAgB,UAAU,OAAO,cAAc,cAAc,MAAM;AAG5E,UAAM,iBAAiB,SAAS,cAAc,0BAA0B;AACxE,QAAI,gBAAgB;AAChB,qBAAe,aAAa,WAAW,cAAc,SAAS,YAAY,SAAS;AAAA,IACvF;AAEA,SAAK,WAAW,QAAQ,QAAM,GAAG,SAAS,CAAC;AAAA,EAC/C;AACJ;AAEO,MAAM,eAAe,IAAI,iBAAiB;",
+  "names": []
+}

package/dist/web/index.html

@@ -17,11 +17,18 @@
     --md-ref-typeface-plain: var(--roboto-font);
 
     --md-sys-color-background: #f5f5f5;
+    --md-sys-color-on-background: #1c1b1f;
     --md-sys-color-surface: #fff;
+    --md-sys-color-on-surface: #1c1b1f;
+    --md-sys-color-on-surface-variant: #49454f;
+    --md-sys-color-surface-variant: #e7e0ec;
     --md-sys-color-surface-container: #fff;
+    --md-sys-color-surface-container-low: #f7f2fa;
     --md-sys-color-surface-container-high: #fff;
     --md-sys-color-surface-container-highest: #f5f5f5;
     --md-sys-color-secondary-container: #e0e0e0;
+    --md-sys-color-outline: #79747e;
+    --md-sys-color-outline-variant: #cac4d0;
 
     --md-sys-typescale-headline-font: var(--roboto-font);
     --md-sys-typescale-title-font: var(--roboto-font);
@@ -31,9 +38,37 @@
     font-family: var(--roboto-font);
   }
 
+  body {
+    --primary-color: var(--md-sys-color-primary);
+  }
+
   a {
     color: var(--primary-color);
   }
+
+  /* Dark theme overrides */
+  html.dark-theme body {
+    --md-sys-color-primary: #4fc3f7;
+    --md-sys-color-on-primary: #003544;
+    --md-sys-color-background: #121212;
+    --md-sys-color-on-background: #e6e1e5;
+    --md-sys-color-surface: #1e1e1e;
+    --md-sys-color-on-surface: #e6e1e5;
+    --md-sys-color-on-surface-variant: #cac4d0;
+    --md-sys-color-surface-variant: #49454f;
+    --md-sys-color-surface-container: #1e1e1e;
+    --md-sys-color-surface-container-low: #1a1a1a;
+    --md-sys-color-surface-container-high: #2b2b2b;
+    --md-sys-color-surface-container-highest: #363636;
+    --md-sys-color-secondary-container: #4a4458;
+    --md-sys-color-on-secondary-container: #e8def8;
+    --md-sys-color-outline: #938f99;
+    --md-sys-color-outline-variant: #49454f;
+    --text-color: rgba(255, 255, 255, 0.6);
+    --danger-color: #ff7961;
+    --primary-color: #4fc3f7;
+    color-scheme: dark;
+  }
   </style>
 </head>
 <body></body>

package/dist/web/js/{commission-node-dialog--19-sX9D.js → commission-node-dialog-CoaDIV2Y.js}

@@ -1,5 +1,5 @@
-import { r, n, t, i, b } from './matter-dashboard-app-CU3-L2nl.js';
-import { p as preventDefault } from './prevent_default-Dw7ifAL-.js';
+import { r, n, t, i, h as b } from './matter-dashboard-app-DlHSE_Qh.js';
+import { p as preventDefault } from './prevent_default-CuW2EnKR.js';
 import './main.js';
 
 var __defProp = Object.defineProperty;
@@ -44,18 +44,18 @@ let ComissionNodeDialog = class extends i {
     if (!this.client.serverInfo.bluetooth_enabled) {
       return;
     }
-    import('./commission-node-wifi-VQGVOrr7.js');
+    import('./commission-node-wifi-DOyin0q3.js');
     this._mode = "wifi";
   }
   _commissionThread() {
     if (!this.client.serverInfo.bluetooth_enabled) {
       return;
     }
-    import('./commission-node-thread-CXquVvK5.js');
+    import('./commission-node-thread-DZ6DghSs.js');
     this._mode = "thread";
   }
   _commissionExisting() {
-    import('./commission-node-existing-DY6SnsHb.js');
+    import('./commission-node-existing-DEU_mJjO.js');
     this._mode = "existing";
   }
   _nodeCommissioned(ev) {

package/dist/web/js/{commission-node-existing-DY6SnsHb.js → commission-node-existing-DEU_mJjO.js}

@@ -1,8 +1,9 @@
-import { r, c, n, d as clientContext, e, t, i, A, b } from './matter-dashboard-app-CU3-L2nl.js';
-import { f as fireEvent } from './fire_event-B13DcOc9.js';
-import './outlined-text-field-CtlEkpbk.js';
+import { r, p as c, n, q as clientContext, a as e, t, i, A, h as b } from './matter-dashboard-app-DlHSE_Qh.js';
+import { f as fireEvent } from './fire_event-C9Duc1j-.js';
+import './outlined-text-field-D2BOt1yD.js';
 import './main.js';
-import './prevent_default-Dw7ifAL-.js';
+import './validator-MOJiFndw.js';
+import './prevent_default-CuW2EnKR.js';
 
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;

package/dist/web/js/{commission-node-thread-CXquVvK5.js → commission-node-thread-DZ6DghSs.js}

@@ -1,8 +1,9 @@
-import { r, c, n, d as clientContext, e, t, i, A, b } from './matter-dashboard-app-CU3-L2nl.js';
-import { f as fireEvent } from './fire_event-B13DcOc9.js';
-import './outlined-text-field-CtlEkpbk.js';
+import { r, p as c, n, q as clientContext, a as e, t, i, A, h as b } from './matter-dashboard-app-DlHSE_Qh.js';
+import { f as fireEvent } from './fire_event-C9Duc1j-.js';
+import './outlined-text-field-D2BOt1yD.js';
 import './main.js';
-import './prevent_default-Dw7ifAL-.js';
+import './validator-MOJiFndw.js';
+import './prevent_default-CuW2EnKR.js';
 
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;

package/dist/web/js/{commission-node-wifi-VQGVOrr7.js → commission-node-wifi-DOyin0q3.js}

@@ -1,8 +1,9 @@
-import { r, c, n, d as clientContext, e, t, i, A, b } from './matter-dashboard-app-CU3-L2nl.js';
-import { f as fireEvent } from './fire_event-B13DcOc9.js';
-import './outlined-text-field-CtlEkpbk.js';
+import { r, p as c, n, q as clientContext, a as e, t, i, A, h as b } from './matter-dashboard-app-DlHSE_Qh.js';
+import { f as fireEvent } from './fire_event-C9Duc1j-.js';
+import './outlined-text-field-D2BOt1yD.js';
 import './main.js';
-import './prevent_default-Dw7ifAL-.js';
+import './validator-MOJiFndw.js';
+import './prevent_default-CuW2EnKR.js';
 
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;

package/dist/web/js/{dialog-box-qX-alVZJ.js → dialog-box-B5sunUPv.js}

@@ -1,5 +1,5 @@
-import { n, t, i, b } from './matter-dashboard-app-CU3-L2nl.js';
-import { p as preventDefault } from './prevent_default-Dw7ifAL-.js';
+import { n, t, i, h as b } from './matter-dashboard-app-DlHSE_Qh.js';
+import { p as preventDefault } from './prevent_default-CuW2EnKR.js';
 import './main.js';
 
 var __defProp = Object.defineProperty;

package/dist/web/js/{fire_event-B13DcOc9.js → fire_event-C9Duc1j-.js}

@@ -1,4 +1,4 @@
-import { m as mixinDelegatesAria, i, _ as __decorate, n, f as e, A, b, a as i$1, t } from './matter-dashboard-app-CU3-L2nl.js';
+import { m as mixinDelegatesAria, i, _ as __decorate, n, f as e, A, h as b, j as i$1, t } from './matter-dashboard-app-DlHSE_Qh.js';
 
 /**
  * @license