@matter-server/dashboard 0.2.1 → 0.2.3

package/dist/web/js/{matter-dashboard-app-5UjO1Ik8.js → matter-dashboard-app-DD29PeTW.js}

@@ -95,7 +95,7 @@ let s$3 = class s {
  * Copyright 2021 Google LLC
  * SPDX-License-Identifier: BSD-3-Clause
  */
-let e$a = class e extends Event {
+let e$b = class e extends Event {
   constructor(t, s) {
     super("context-provider", {
       bubbles: true,
@@ -124,7 +124,7 @@ let i$7 = class i extends s$3 {
     this.host.addEventListener("context-request", this.onContextRequest), this.host.addEventListener("context-provider", this.onProviderRequest);
   }
   hostConnected() {
-    this.host.dispatchEvent(new e$a(this.context, this.host));
+    this.host.dispatchEvent(new e$b(this.context, this.host));
   }
 };
 
@@ -133,7 +133,7 @@ let i$7 = class i extends s$3 {
  * Copyright 2017 Google LLC
  * SPDX-License-Identifier: BSD-3-Clause
  */
-function e$9({
+function e$a({
   context: e
 }) {
   return (n, i) => {
@@ -222,9 +222,9 @@ function c$3({
  * SPDX-License-Identifier: BSD-3-Clause
  */
 const t$3 = globalThis,
-  e$8 = t$3.ShadowRoot && (void 0 === t$3.ShadyCSS || t$3.ShadyCSS.nativeShadow) && "adoptedStyleSheets" in Document.prototype && "replace" in CSSStyleSheet.prototype,
+  e$9 = t$3.ShadowRoot && (void 0 === t$3.ShadyCSS || t$3.ShadyCSS.nativeShadow) && "adoptedStyleSheets" in Document.prototype && "replace" in CSSStyleSheet.prototype,
   s$2 = Symbol(),
-  o$6 = new WeakMap();
+  o$7 = new WeakMap();
 let n$4 = class n {
   constructor(t, e, o) {
     if (this._$cssResult$ = true, o !== s$2) throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");
@@ -233,9 +233,9 @@ let n$4 = class n {
   get styleSheet() {
     let t = this.o;
     const s = this.t;
-    if (e$8 && void 0 === t) {
+    if (e$9 && void 0 === t) {
       const e = void 0 !== s && 1 === s.length;
-      e && (t = o$6.get(s)), void 0 === t && ((this.o = t = new CSSStyleSheet()).replaceSync(this.cssText), e && o$6.set(s, t));
+      e && (t = o$7.get(s)), void 0 === t && ((this.o = t = new CSSStyleSheet()).replaceSync(this.cssText), e && o$7.set(s, t));
     }
     return t;
   }
@@ -253,13 +253,13 @@ const r$5 = t => new n$4("string" == typeof t ? t : t + "", void 0, s$2),
     return new n$4(o, t, s$2);
   },
   S$1 = (s, o) => {
-    if (e$8) s.adoptedStyleSheets = o.map(t => t instanceof CSSStyleSheet ? t : t.styleSheet);else for (const e of o) {
+    if (e$9) s.adoptedStyleSheets = o.map(t => t instanceof CSSStyleSheet ? t : t.styleSheet);else for (const e of o) {
       const o = document.createElement("style"),
         n = t$3.litNonce;
       void 0 !== n && o.setAttribute("nonce", n), o.textContent = e.cssText, s.appendChild(o);
     }
   },
-  c$2 = e$8 ? t => t : t => t instanceof CSSStyleSheet ? (t => {
+  c$2 = e$9 ? t => t : t => t instanceof CSSStyleSheet ? (t => {
     let e = "";
     for (const s of t.cssRules) e += s.cssText;
     return r$5(e);
@@ -272,10 +272,10 @@ const r$5 = t => new n$4("string" == typeof t ? t : t + "", void 0, s$2),
  */
 const {
     is: i$5,
-    defineProperty: e$7,
+    defineProperty: e$8,
     getOwnPropertyDescriptor: h$1,
     getOwnPropertyNames: r$4,
-    getOwnPropertySymbols: o$5,
+    getOwnPropertySymbols: o$6,
     getPrototypeOf: n$3
   } = Object,
   a$2 = globalThis,
@@ -336,7 +336,7 @@ let y$1 = class y extends HTMLElement {
     if (s.state && (s.attribute = false), this._$Ei(), this.prototype.hasOwnProperty(t) && ((s = Object.create(s)).wrapped = true), this.elementProperties.set(t, s), !s.noAccessor) {
       const i = Symbol(),
         h = this.getPropertyDescriptor(t, i, s);
-      void 0 !== h && e$7(this.prototype, t, h);
+      void 0 !== h && e$8(this.prototype, t, h);
     }
   }
   static getPropertyDescriptor(t, s, i) {
@@ -373,7 +373,7 @@ let y$1 = class y extends HTMLElement {
     if (this.hasOwnProperty(d$1("finalized"))) return;
     if (this.finalized = true, this._$Ei(), this.hasOwnProperty(d$1("properties"))) {
       const t = this.properties,
-        s = [...r$4(t), ...o$5(t)];
+        s = [...r$4(t), ...o$6(t)];
       for (const i of s) this.createProperty(i, t[i]);
     }
     const t = this[Symbol.metadata];
@@ -564,12 +564,12 @@ y$1.elementStyles = [], y$1.shadowRootOptions = {
 const t$2 = globalThis,
   i$4 = t => t,
   s$1 = t$2.trustedTypes,
-  e$6 = s$1 ? s$1.createPolicy("lit-html", {
+  e$7 = s$1 ? s$1.createPolicy("lit-html", {
     createHTML: t => t
   }) : void 0,
   h = "$lit$",
-  o$4 = `lit$${Math.random().toFixed(9).slice(2)}$`,
-  n$2 = "?" + o$4,
+  o$5 = `lit$${Math.random().toFixed(9).slice(2)}$`,
+  n$2 = "?" + o$5,
   r$3 = `<${n$2}>`,
   l$1 = document,
   c = () => l$1.createComment(""),
@@ -597,7 +597,7 @@ const t$2 = globalThis,
   P = l$1.createTreeWalker(l$1, 129);
 function V(t, i) {
   if (!u$1(t) || !t.hasOwnProperty("raw")) throw Error("invalid template strings array");
-  return void 0 !== e$6 ? e$6.createHTML(i) : i;
+  return void 0 !== e$7 ? e$7.createHTML(i) : i;
 }
 const N = (t, i) => {
   const s = t.length - 1,
@@ -613,7 +613,7 @@ const N = (t, i) => {
       f = 0;
     for (; f < s.length && (c.lastIndex = f, u = c.exec(s), null !== u);) f = c.lastIndex, c === v ? "!--" === u[1] ? c = _ : void 0 !== u[1] ? c = m : void 0 !== u[2] ? (y.test(u[2]) && (n = RegExp("</" + u[2], "g")), c = p) : void 0 !== u[3] && (c = p) : c === p ? ">" === u[0] ? (c = n ?? v, d = -1) : void 0 === u[1] ? d = -2 : (d = c.lastIndex - u[2].length, a = u[1], c = void 0 === u[3] ? p : '"' === u[3] ? $ : g) : c === $ || c === g ? c = p : c === _ || c === m ? c = v : (c = p, n = void 0);
     const x = c === p && t[i + 1].startsWith("/>") ? " " : "";
-    l += c === v ? s + r$3 : d >= 0 ? (e.push(a), s.slice(0, d) + h + s.slice(d) + o$4 + x) : s + o$4 + (-2 === d ? i : x);
+    l += c === v ? s + r$3 : d >= 0 ? (e.push(a), s.slice(0, d) + h + s.slice(d) + o$5 + x) : s + o$5 + (-2 === d ? i : x);
   }
   return [V(t, l + (t[s] || "<?>") + (2 === i ? "</svg>" : 3 === i ? "</math>" : "")), e];
 };
@@ -637,7 +637,7 @@ class S {
       if (1 === r.nodeType) {
         if (r.hasAttributes()) for (const t of r.getAttributeNames()) if (t.endsWith(h)) {
           const i = v[a++],
-            s = r.getAttribute(t).split(o$4),
+            s = r.getAttribute(t).split(o$5),
             e = /([.?@])?(.*)/.exec(i);
           d.push({
             type: 1,
@@ -646,12 +646,12 @@ class S {
             strings: s,
             ctor: "." === e[1] ? I : "?" === e[1] ? L : "@" === e[1] ? z : H
           }), r.removeAttribute(t);
-        } else t.startsWith(o$4) && (d.push({
+        } else t.startsWith(o$5) && (d.push({
           type: 6,
           index: l
         }), r.removeAttribute(t));
         if (y.test(r.tagName)) {
-          const t = r.textContent.split(o$4),
+          const t = r.textContent.split(o$5),
             i = t.length - 1;
           if (i > 0) {
             r.textContent = s$1 ? s$1.emptyScript : "";
@@ -667,10 +667,10 @@ class S {
         index: l
       });else {
         let t = -1;
-        for (; -1 !== (t = r.data.indexOf(o$4, t + 1));) d.push({
+        for (; -1 !== (t = r.data.indexOf(o$5, t + 1));) d.push({
           type: 7,
           index: l
-        }), t += o$4.length - 1;
+        }), t += o$5.length - 1;
       }
       l++;
     }
@@ -910,8 +910,8 @@ let i$3 = class i extends y$1 {
 i$3._$litElement$ = true, i$3["finalized"] = true, (_s$litElementHydrateS = s.litElementHydrateSupport) === null || _s$litElementHydrateS === void 0 ? void 0 : _s$litElementHydrateS.call(s, {
   LitElement: i$3
 });
-const o$3 = s.litElementPolyfillSupport;
-o$3 === null || o$3 === void 0 || o$3({
+const o$4 = s.litElementPolyfillSupport;
+o$4 === null || o$4 === void 0 || o$4({
   LitElement: i$3
 });
 (s.litElementVersions ?? (s.litElementVersions = [])).push("4.2.2");
@@ -932,14 +932,14 @@ const t$1 = t => (e, o) => {
  * Copyright 2017 Google LLC
  * SPDX-License-Identifier: BSD-3-Clause
  */
-const o$2 = {
+const o$3 = {
     attribute: true,
     type: String,
     converter: u$2,
     reflect: false,
     hasChanged: f$1
   },
-  r$2 = (t = o$2, e, r) => {
+  r$2 = (t = o$3, e, r) => {
     const {
       kind: n,
       metadata: i
@@ -995,20 +995,20 @@ function r$1(r) {
  * Copyright 2017 Google LLC
  * SPDX-License-Identifier: BSD-3-Clause
  */
-const e$5 = (e, t, c) => (c.configurable = true, c.enumerable = true, Reflect.decorate && "object" != typeof t && Object.defineProperty(e, t, c), c);
+const e$6 = (e, t, c) => (c.configurable = true, c.enumerable = true, Reflect.decorate && "object" != typeof t && Object.defineProperty(e, t, c), c);
 
 /**
  * @license
  * Copyright 2017 Google LLC
  * SPDX-License-Identifier: BSD-3-Clause
  */
-function e$4(e, r) {
+function e$5(e, r) {
   return (n, s, i) => {
     const o = t => {
       var _t$renderRoot;
       return ((_t$renderRoot = t.renderRoot) === null || _t$renderRoot === void 0 ? void 0 : _t$renderRoot.querySelector(e)) ?? null;
     };
-    return e$5(n, s, {
+    return e$6(n, s, {
       get() {
         return o(this);
       }
@@ -1021,11 +1021,11 @@ function e$4(e, r) {
  * Copyright 2017 Google LLC
  * SPDX-License-Identifier: BSD-3-Clause
  */
-let e$3;
+let e$4;
 function r(r) {
-  return (n, o) => e$5(n, o, {
+  return (n, o) => e$6(n, o, {
     get() {
-      return (this.renderRoot ?? e$3 ?? (e$3 = document.createDocumentFragment())).querySelectorAll(r);
+      return (this.renderRoot ?? e$4 ?? (e$4 = document.createDocumentFragment())).querySelectorAll(r);
     }
   });
 }
@@ -1035,14 +1035,14 @@ function r(r) {
  * Copyright 2021 Google LLC
  * SPDX-License-Identifier: BSD-3-Clause
  */
-function o$1(o) {
+function o$2(o) {
   return (e, n) => {
     const {
         slot: r,
         selector: s
       } = o ?? {},
       c = "slot" + (r ? `[name=${r}]` : ":not([name])");
-    return e$5(e, n, {
+    return e$6(e, n, {
       get() {
         var _this$renderRoot;
         const t = (_this$renderRoot = this.renderRoot) === null || _this$renderRoot === void 0 ? void 0 : _this$renderRoot.querySelector(c),
@@ -1413,9 +1413,10 @@ MdFocusRing = __decorate([t$1('md-focus-ring')], MdFocusRing);
  */
 const t = {
     ATTRIBUTE: 1,
+    CHILD: 2,
     PROPERTY: 3,
     BOOLEAN_ATTRIBUTE: 4},
-  e$2 = t => (...e) => ({
+  e$3 = t => (...e) => ({
     _$litDirective$: t,
     values: e
   });
@@ -1440,7 +1441,7 @@ let i$2 = class i {
  * Copyright 2018 Google LLC
  * SPDX-License-Identifier: BSD-3-Clause
  */
-const e$1 = e$2(class extends i$2 {
+const e$2 = e$3(class extends i$2 {
   constructor(t$1) {
     var _t$strings;
     if (super(t$1), t$1.type !== t.ATTRIBUTE || "class" !== t$1.name || ((_t$strings = t$1.strings) === null || _t$strings === void 0 ? void 0 : _t$strings.length) > 2) throw Error("`classMap()` can only be used in the `class` attribute and must be the only part in the attribute.");
@@ -1604,7 +1605,7 @@ class Ripple extends i$3 {
       'hovered': this.hovered,
       'pressed': this.pressed
     };
-    return b`<div class="surface ${e$1(classes)}"></div>`;
+    return b`<div class="surface ${e$2(classes)}"></div>`;
   }
   update(changedProps) {
     if (changedProps.has('disabled') && this.disabled) {
@@ -1893,7 +1894,7 @@ __decorate([n$1({
 })], Ripple.prototype, "disabled", void 0);
 __decorate([r$1()], Ripple.prototype, "hovered", void 0);
 __decorate([r$1()], Ripple.prototype, "pressed", void 0);
-__decorate([e$4('.surface')], Ripple.prototype, "mdRoot", void 0);
+__decorate([e$5('.surface')], Ripple.prototype, "mdRoot", void 0);
 
 /**
  * @license
@@ -1932,7 +1933,7 @@ MdRipple = __decorate([t$1('md-ripple')], MdRipple);
  * SPDX-License-Identifier: BSD-3-Clause
  */
 const a = Symbol.for(""),
-  o = t => {
+  o$1 = t => {
     if ((t === null || t === void 0 ? void 0 : t.r) === a) return t === null || t === void 0 ? void 0 : t._$litStatic$;
   },
   i$1 = (t, ...r) => ({
@@ -1952,7 +1953,7 @@ const a = Symbol.for(""),
       $ = 0,
       f = false;
     for (; $ < a;) {
-      for (c = r[$]; $ < a && void 0 !== (i = e[$], s = o(i));) c += s + r[++$], f = true;
+      for (c = r[$]; $ < a && void 0 !== (i = e[$], s = o$1(i));) c += s + r[++$], f = true;
       $ !== a && u.push(i), n.push(c), $++;
     }
     if ($ === a && n.push(r[a]), f) {
@@ -2420,7 +2421,7 @@ class IconButton extends iconButtonBaseClass {
       ariaLabelValue = hasToggledAriaLabel && this.selected ? this.ariaLabelSelected : ariaLabel;
     }
     return u`<${tag}
-        class="icon-button ${e$1(this.getRenderClasses())}"
+        class="icon-button ${e$2(this.getRenderClasses())}"
         id="button"
         aria-label="${ariaLabelValue || A}"
         aria-haspopup="${!this.href && ariaHasPopup || A}"
@@ -3070,7 +3071,7 @@ class List extends i$3 {
     return this.listController.activatePreviousItem();
   }
 }
-__decorate([o$1({
+__decorate([o$2({
   flatten: true
 })], List.prototype, "slotItems", void 0);
 
@@ -3357,7 +3358,7 @@ class ListItemEl extends listItemBaseClass {
         aria-checked=${this.ariaChecked || A}
         aria-expanded=${this.ariaExpanded || A}
         aria-haspopup=${this.ariaHasPopup || A}
-        class="list-item ${e$1(this.getRenderClasses())}"
+        class="list-item ${e$2(this.getRenderClasses())}"
         href=${this.href || A}
         target=${target}
         @focus=${this.onFocus}
@@ -3455,7 +3456,7 @@ __decorate([n$1({
 })], ListItemEl.prototype, "isListItem", void 0);
 __decorate([n$1()], ListItemEl.prototype, "href", void 0);
 __decorate([n$1()], ListItemEl.prototype, "target", void 0);
-__decorate([e$4('.list-item')], ListItemEl.prototype, "listItemRoot", void 0);
+__decorate([e$5('.list-item')], ListItemEl.prototype, "listItemRoot", void 0);
 
 /**
  * @license
@@ -3513,6 +3514,32 @@ let MdListItem = class MdListItem extends ListItemEl {};
 MdListItem.styles = [styles$6];
 MdListItem = __decorate([t$1('md-list-item')], MdListItem);
 
+/**
+ * @license
+ * Copyright 2017 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */
+let e$1 = class e extends i$2 {
+  constructor(i) {
+    if (super(i), this.it = A, i.type !== t.CHILD) throw Error(this.constructor.directiveName + "() can only be used in child bindings");
+  }
+  render(r) {
+    if (r === A || null == r) return this._t = void 0, this.it = r;
+    if (r === E) return r;
+    if ("string" != typeof r) throw Error(this.constructor.directiveName + "() called with a non-string value");
+    if (r === this.it) return this._t;
+    this.it = r;
+    const s = [r];
+    return s.raw = s, this._t = {
+      _$litType$: this.constructor.resultType,
+      strings: s,
+      values: []
+    };
+  }
+};
+e$1.directiveName = "unsafeHTML", e$1.resultType = 1;
+const o = e$3(e$1);
+
 const device_types = {
   "10": {
     "id": 10,
@@ -14444,7 +14471,7 @@ const clusters = {
  * SPDX-License-Identifier: Apache-2.0
  */
 const showDialogBox = async (type, dialogParams) => {
-  await import('./dialog-box-DN32sjfR.js');
+  await import('./dialog-box-9i64nfcC.js');
   return new Promise(resolve => {
     const dialog = document.createElement("dialox-box");
     dialog.params = dialogParams;
@@ -14456,12 +14483,12 @@ const showDialogBox = async (type, dialogParams) => {
 const showAlertDialog = dialogParams => showDialogBox("alert", dialogParams);
 const showPromptDialog = dialogParams => showDialogBox("prompt", dialogParams);
 
-var __defProp$7 = Object.defineProperty;
-var __getOwnPropDesc$9 = Object.getOwnPropertyDescriptor;
-var __decorateClass$9 = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$9(target, key) : target;
+var __defProp$9 = Object.defineProperty;
+var __getOwnPropDesc$b = Object.getOwnPropertyDescriptor;
+var __decorateClass$c = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$b(target, key) : target;
   for (var i = decorators.length - 1, decorator; i >= 0; i--) if (decorator = decorators[i]) result = (kind ? decorator(target, key, result) : decorator(result)) || result;
-  if (kind && result) __defProp$7(target, key, result);
+  if (kind && result) __defProp$9(target, key, result);
   return result;
 };
 let HaSvgIcon = class extends i$3 {
@@ -14508,10 +14535,10 @@ let HaSvgIcon = class extends i$3 {
         `;
   }
 };
-__decorateClass$9([n$1()], HaSvgIcon.prototype, "path", 2);
-__decorateClass$9([n$1()], HaSvgIcon.prototype, "secondaryPath", 2);
-__decorateClass$9([n$1()], HaSvgIcon.prototype, "viewBox", 2);
-HaSvgIcon = __decorateClass$9([t$1("ha-svg-icon")], HaSvgIcon);
+__decorateClass$c([n$1()], HaSvgIcon.prototype, "path", 2);
+__decorateClass$c([n$1()], HaSvgIcon.prototype, "secondaryPath", 2);
+__decorateClass$c([n$1()], HaSvgIcon.prototype, "viewBox", 2);
+HaSvgIcon = __decorateClass$c([t$1("ha-svg-icon")], HaSvgIcon);
 
 /**
  * @license
@@ -14866,8 +14893,8 @@ __decorate([n$1()], Button.prototype, "type", void 0);
 __decorate([n$1({
   reflect: true
 })], Button.prototype, "value", void 0);
-__decorate([e$4('.button')], Button.prototype, "buttonElement", void 0);
-__decorate([o$1({
+__decorate([e$5('.button')], Button.prototype, "buttonElement", void 0);
+__decorate([o$2({
   slot: 'icon',
   flatten: true
 })], Button.prototype, "assignedIcons", void 0);
@@ -15054,7 +15081,7 @@ var mdiArrowLeft="M20,11V13H8L13.5,18.5L12.08,19.92L4.16,12L12.08,4.08L13.5,5.5L
  */
 const showNodeBindingDialog = async (client, node, endpoint) => {
   var _document$querySelect;
-  await import('./node-binding-dialog-2yitVn0R.js');
+  await import('./node-binding-dialog-DnO2DL_u.js');
   const dialog = document.createElement("node-binding-dialog");
   dialog.client = client;
   dialog.node = node;
@@ -15068,7 +15095,7 @@ const showNodeBindingDialog = async (client, node, endpoint) => {
  * SPDX-License-Identifier: BSD-3-Clause
  */
 const e = {},
-  i = e$2(class extends i$2 {
+  i = e$3(class extends i$2 {
     constructor() {
       super(...arguments), this.ot = e;
     }
@@ -15083,12 +15110,12 @@ const e = {},
     }
   });
 
-var __defProp$6 = Object.defineProperty;
-var __getOwnPropDesc$8 = Object.getOwnPropertyDescriptor;
-var __decorateClass$8 = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$8(target, key) : target;
+var __defProp$8 = Object.defineProperty;
+var __getOwnPropDesc$a = Object.getOwnPropertyDescriptor;
+var __decorateClass$b = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$a(target, key) : target;
   for (var i = decorators.length - 1, decorator; i >= 0; i--) if (decorator = decorators[i]) result = (kind ? decorator(target, key, result) : decorator(result)) || result;
-  if (kind && result) __defProp$6(target, key, result);
+  if (kind && result) __defProp$8(target, key, result);
   return result;
 };
 function getUniqueClusters(node, endpoint) {
@@ -15201,9 +15228,9 @@ MatterEndpointView.styles = i$6`
             font-size: 0.8em;
         }
     `;
-__decorateClass$8([n$1()], MatterEndpointView.prototype, "node", 2);
-__decorateClass$8([n$1()], MatterEndpointView.prototype, "endpoint", 2);
-MatterEndpointView = __decorateClass$8([t$1("matter-endpoint-view")], MatterEndpointView);
+__decorateClass$b([n$1()], MatterEndpointView.prototype, "node", 2);
+__decorateClass$b([n$1()], MatterEndpointView.prototype, "endpoint", 2);
+MatterEndpointView = __decorateClass$b([t$1("matter-endpoint-view")], MatterEndpointView);
 
 /**
  * @license
@@ -15212,12 +15239,12 @@ MatterEndpointView = __decorateClass$8([t$1("matter-endpoint-view")], MatterEndp
  */
 const bindingContext = n$5("binding");
 
-var __defProp$5 = Object.defineProperty;
-var __getOwnPropDesc$7 = Object.getOwnPropertyDescriptor;
-var __decorateClass$7 = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$7(target, key) : target;
+var __defProp$7 = Object.defineProperty;
+var __getOwnPropDesc$9 = Object.getOwnPropertyDescriptor;
+var __decorateClass$a = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$9(target, key) : target;
   for (var i = decorators.length - 1, decorator; i >= 0; i--) if (decorator = decorators[i]) result = (kind ? decorator(target, key, result) : decorator(result)) || result;
-  if (kind && result) __defProp$5(target, key, result);
+  if (kind && result) __defProp$7(target, key, result);
   return result;
 };
 function getNodeDeviceTypes(node) {
@@ -15413,14 +15440,291 @@ NodeDetails.styles = i$6`
             font-size: 0.8em;
         }
     `;
-__decorateClass$7([n$1()], NodeDetails.prototype, "node", 2);
-__decorateClass$7([r$1()], NodeDetails.prototype, "_updateInitiated", 2);
-__decorateClass$7([c$3({
+__decorateClass$a([n$1()], NodeDetails.prototype, "node", 2);
+__decorateClass$a([r$1()], NodeDetails.prototype, "_updateInitiated", 2);
+__decorateClass$a([c$3({
   context: bindingContext
 }), n$1({
   attribute: false
 })], NodeDetails.prototype, "endpoint", 2);
-NodeDetails = __decorateClass$7([t$1("node-details")], NodeDetails);
+NodeDetails = __decorateClass$a([t$1("node-details")], NodeDetails);
+
+/**
+ * @license
+ * Copyright 2025-2026 Open Home Foundation
+ * SPDX-License-Identifier: Apache-2.0
+ */
+const clusterCommandRegistry = /* @__PURE__ */new Map();
+function registerClusterCommands(clusterId, tagName) {
+  clusterCommandRegistry.set(clusterId, tagName);
+}
+function getClusterCommandsTag(clusterId) {
+  return clusterCommandRegistry.get(clusterId);
+}
+
+var _staticBlock;
+var __defProp$6 = Object.defineProperty;
+var __decorateClass$9 = (decorators, target, key, kind) => {
+  var result = void 0 ;
+  for (var i = decorators.length - 1, decorator; i >= 0; i--) if (decorator = decorators[i]) result = (decorator(target, key, result) ) || result;
+  if (result) __defProp$6(target, key, result);
+  return result;
+};
+class BaseClusterCommands extends i$3 {
+  /**
+   * Send a command to the device.
+   * @param command - The command name (PascalCase, e.g., "On", "Off", "MoveToLevel")
+   * @param payload - Optional command payload
+   */
+  async sendCommand(command, payload) {
+    try {
+      await this.client.deviceCommand(this.node.node_id, this.endpoint, this.cluster, command, payload ?? {});
+    } catch (error) {
+      console.error(`Failed to send command ${command}:`, error);
+    }
+  }
+  static #_ = _staticBlock = () => this.styles = i$6`
+        :host {
+            display: block;
+        }
+
+        details.command-panel {
+            background-color: var(--md-sys-color-surface-container);
+            border-radius: 12px;
+            overflow: hidden;
+        }
+
+        details.command-panel summary {
+            padding: 16px;
+            font-weight: 500;
+            color: var(--md-sys-color-on-surface);
+            cursor: pointer;
+            user-select: none;
+            display: flex;
+            align-items: center;
+            gap: 8px;
+        }
+
+        details.command-panel summary:hover {
+            background-color: var(--md-sys-color-surface-container-high);
+        }
+
+        details.command-panel summary::before {
+            content: "▶";
+            font-size: 12px;
+            transition: transform 0.2s ease;
+        }
+
+        details.command-panel[open] summary::before {
+            transform: rotate(90deg);
+        }
+
+        details.command-panel summary::-webkit-details-marker {
+            display: none;
+        }
+
+        .command-content {
+            padding: 0 16px 16px 16px;
+        }
+
+        .command-row {
+            display: flex;
+            align-items: center;
+            gap: 12px;
+            flex-wrap: wrap;
+        }
+
+        .command-row label {
+            font-size: 14px;
+            color: var(--md-sys-color-on-surface-variant);
+            display: flex;
+            align-items: center;
+            gap: 4px;
+        }
+
+        .command-row input[type="number"] {
+            width: 70px;
+            padding: 8px;
+            border: 1px solid var(--md-sys-color-outline);
+            border-radius: 4px;
+            background: var(--md-sys-color-surface);
+            color: var(--md-sys-color-on-surface);
+        }
+
+        .command-row input[type="checkbox"] {
+            width: 16px;
+            height: 16px;
+            margin: 0;
+        }
+
+        md-filled-button,
+        md-outlined-button {
+            --md-filled-button-container-height: 36px;
+            --md-outlined-button-container-height: 36px;
+        }
+    `;
+}
+_staticBlock();
+__decorateClass$9([n$1({
+  attribute: false
+})], BaseClusterCommands.prototype, "client");
+__decorateClass$9([n$1({
+  attribute: false
+})], BaseClusterCommands.prototype, "node");
+__decorateClass$9([n$1({
+  type: Number
+})], BaseClusterCommands.prototype, "endpoint");
+__decorateClass$9([n$1({
+  type: Number
+})], BaseClusterCommands.prototype, "cluster");
+
+var __defProp$5 = Object.defineProperty;
+var __getOwnPropDesc$8 = Object.getOwnPropertyDescriptor;
+var __decorateClass$8 = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$8(target, key) : target;
+  for (var i = decorators.length - 1, decorator; i >= 0; i--) if (decorator = decorators[i]) result = (kind ? decorator(target, key, result) : decorator(result)) || result;
+  if (kind && result) __defProp$5(target, key, result);
+  return result;
+};
+const CLUSTER_ID$1 = 8;
+let LevelControlClusterCommands = class extends BaseClusterCommands {
+  constructor() {
+    super(...arguments);
+    this._targetLevel = 128;
+    this._transitionTime = 0;
+    this._executeIfOff = false;
+  }
+  render() {
+    return b`
+            <details class="command-panel">
+                <summary>Level Control Commands</summary>
+                <div class="command-content">
+                    <div class="command-row">
+                        <label for="targetLevel">Level:</label>
+                        <input
+                            id="targetLevel"
+                            type="number"
+                            min="1"
+                            max="254"
+                            .value=${String(this._targetLevel)}
+                            @input=${this._handleTargetLevelChange}
+                        />
+                        <label for="transitionTime">Transition (0.1s):</label>
+                        <input
+                            id="transitionTime"
+                            type="number"
+                            min="0"
+                            max="65535"
+                            .value=${String(this._transitionTime)}
+                            @input=${this._handleTransitionTimeChange}
+                        />
+                        <label for="executeIfOff">
+                            <input
+                                id="executeIfOff"
+                                type="checkbox"
+                                .checked=${this._executeIfOff}
+                                @change=${this._handleExecuteIfOffChange}
+                            />
+                            Execute if Off
+                        </label>
+                        <md-outlined-button @click=${this._handleMoveToLevel}>MoveToLevel</md-outlined-button>
+                        <md-outlined-button @click=${this._handleMoveToLevelWithOnOff}
+                            >MoveToLevelWithOnOff</md-outlined-button
+                        >
+                    </div>
+                </div>
+            </details>
+        `;
+  }
+  _handleTargetLevelChange(e) {
+    const input = e.target;
+    let value = parseInt(input.value, 10);
+    if (isNaN(value)) value = 1;
+    if (value < 1) value = 1;
+    if (value > 254) value = 254;
+    this._targetLevel = value;
+  }
+  _handleTransitionTimeChange(e) {
+    const input = e.target;
+    let value = parseInt(input.value, 10);
+    if (isNaN(value)) value = 0;
+    if (value < 0) value = 0;
+    if (value > 65535) value = 65535;
+    this._transitionTime = value;
+  }
+  _handleExecuteIfOffChange(e) {
+    const input = e.target;
+    this._executeIfOff = input.checked;
+  }
+  async _handleMoveToLevel() {
+    const optionsMask = this._executeIfOff ? {
+      executeIfOff: true
+    } : {};
+    const optionsOverride = this._executeIfOff ? {
+      executeIfOff: true
+    } : {};
+    await this.sendCommand("MoveToLevel", {
+      level: this._targetLevel,
+      transitionTime: this._transitionTime,
+      optionsMask,
+      optionsOverride
+    });
+  }
+  async _handleMoveToLevelWithOnOff() {
+    const optionsMask = this._executeIfOff ? {
+      executeIfOff: true
+    } : {};
+    const optionsOverride = this._executeIfOff ? {
+      executeIfOff: true
+    } : {};
+    await this.sendCommand("MoveToLevelWithOnOff", {
+      level: this._targetLevel,
+      transitionTime: this._transitionTime,
+      optionsMask,
+      optionsOverride
+    });
+  }
+};
+__decorateClass$8([r$1()], LevelControlClusterCommands.prototype, "_targetLevel", 2);
+__decorateClass$8([r$1()], LevelControlClusterCommands.prototype, "_transitionTime", 2);
+__decorateClass$8([r$1()], LevelControlClusterCommands.prototype, "_executeIfOff", 2);
+LevelControlClusterCommands = __decorateClass$8([t$1("level-control-cluster-commands")], LevelControlClusterCommands);
+registerClusterCommands(CLUSTER_ID$1, "level-control-cluster-commands");
+
+var __getOwnPropDesc$7 = Object.getOwnPropertyDescriptor;
+var __decorateClass$7 = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$7(target, key) : target;
+  for (var i = decorators.length - 1, decorator; i >= 0; i--) if (decorator = decorators[i]) result = (decorator(result)) || result;
+  return result;
+};
+const CLUSTER_ID = 6;
+let OnOffClusterCommands = class extends BaseClusterCommands {
+  render() {
+    return b`
+            <details class="command-panel">
+                <summary>OnOff Commands</summary>
+                <div class="command-content">
+                    <div class="command-row">
+                        <md-outlined-button @click=${this._handleOn}>On</md-outlined-button>
+                        <md-outlined-button @click=${this._handleOff}>Off</md-outlined-button>
+                        <md-outlined-button @click=${this._handleToggle}>Toggle</md-outlined-button>
+                    </div>
+                </div>
+            </details>
+        `;
+  }
+  async _handleOn() {
+    await this.sendCommand("On");
+  }
+  async _handleOff() {
+    await this.sendCommand("Off");
+  }
+  async _handleToggle() {
+    await this.sendCommand("Toggle");
+  }
+};
+OnOffClusterCommands = __decorateClass$7([t$1("on-off-cluster-commands")], OnOffClusterCommands);
+registerClusterCommands(CLUSTER_ID, "on-off-cluster-commands");
 
 var __defProp$4 = Object.defineProperty;
 var __getOwnPropDesc$6 = Object.getOwnPropertyDescriptor;
@@ -15431,7 +15735,7 @@ var __decorateClass$6 = (decorators, target, key, kind) => {
   return result;
 };
 function clusterAttributes(attributes, endpoint, cluster) {
-  return Object.keys(attributes).filter(key => key.startsWith(`${endpoint}/${cluster}`)).map(key => {
+  return Object.keys(attributes).filter(key => key.startsWith(`${endpoint}/${cluster}/`)).map(key => {
     const attributeKey = Number(key.split("/")[2]);
     return {
       key: attributeKey,
@@ -15460,6 +15764,9 @@ let MatterClusterView = class extends i$3 {
                 <node-details .node=${this.node} .client=${this.client}></node-details>
             </div>
 
+            <!-- Cluster commands section (if available for this cluster) -->
+            ${this._renderClusterCommands()}
+
             <!-- Cluster attributes listing -->
             <div class="container">
                 <md-list>
@@ -15506,6 +15813,34 @@ let MatterClusterView = class extends i$3 {
       text: toBigIntAwareJson(value)
     });
   }
+  _renderClusterCommands() {
+    var _this$node;
+    if (this.cluster === void 0) return b``;
+    if (!((_this$node = this.node) !== null && _this$node !== void 0 && _this$node.available)) return b``;
+    const tagName = getClusterCommandsTag(this.cluster);
+    if (!tagName) return b``;
+    const componentHtml = `<${tagName}></${tagName}>`;
+    const element = o(componentHtml);
+    return b`
+            <div class="container">
+                <div id="cluster-commands-container">${element}</div>
+            </div>
+        `;
+  }
+  updated(changedProperties) {
+    var _this$shadowRoot;
+    super.updated(changedProperties);
+    const container = (_this$shadowRoot = this.shadowRoot) === null || _this$shadowRoot === void 0 ? void 0 : _this$shadowRoot.getElementById("cluster-commands-container");
+    if (container) {
+      const commandsElement = container.firstElementChild;
+      if (commandsElement && this.node && this.client) {
+        commandsElement.client = this.client;
+        commandsElement.node = this.node;
+        commandsElement.endpoint = this.endpoint;
+        commandsElement.cluster = this.cluster;
+      }
+    }
+  }
   _goBack() {
     history.back();
   }
@@ -15548,7 +15883,7 @@ MatterClusterView.styles = i$6`
         }
     `;
 __decorateClass$6([n$1()], MatterClusterView.prototype, "node", 2);
-__decorateClass$6([e$9({
+__decorateClass$6([e$a({
   context: bindingContext
 }), n$1()], MatterClusterView.prototype, "endpoint", 2);
 __decorateClass$6([n$1()], MatterClusterView.prototype, "cluster", 2);
@@ -15760,7 +16095,7 @@ DashboardFooter = __decorateClass$3([t$1("dashboard-footer")], DashboardFooter);
  */
 const showCommissionNodeDialog = async client => {
   var _document$querySelect;
-  await import('./commission-node-dialog-BJsfA4IV.js');
+  await import('./commission-node-dialog-B6EYNztD.js');
   const dialog = document.createElement("commission-node-dialog");
   dialog.client = client;
   (_document$querySelect = document.querySelector("matter-dashboard-app")) === null || _document$querySelect === void 0 || _document$querySelect.renderRoot.appendChild(dialog);
@@ -16065,4 +16400,4 @@ var matterDashboardApp = /*#__PURE__*/Object.freeze({
   __proto__: null
 });
 
-export { A, D, EASING as E, __decorate as _, i$6 as a, b, c$3 as c, clientContext as d, e$4 as e, e$1 as f, e$2 as g, i$2 as h, i$3 as i, t as j, E as k, internals as l, mixinDelegatesAria as m, n$1 as n, o$1 as o, mixinElementInternals as p, i$1 as q, r$1 as r, matterDashboardApp as s, t$1 as t, u };
+export { A, D, EASING as E, __decorate as _, i$6 as a, b, c$3 as c, clientContext as d, e$5 as e, e$2 as f, e$3 as g, i$2 as h, i$3 as i, t as j, E as k, internals as l, mixinDelegatesAria as m, n$1 as n, o$2 as o, mixinElementInternals as p, i$1 as q, r$1 as r, matterDashboardApp as s, t$1 as t, u };