var __defProp = Object.defineProperty;
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
var __decorateClass = (decorators, target, key, kind) => {
  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(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(target, key, result);
  return result;
};
/**
 * @license
 * Copyright 2025-2026 Open Home Foundation
 * SPDX-License-Identifier: Apache-2.0
 */
import { provide } from "@lit/context";
import "@material/web/divider/divider";
import "@material/web/iconbutton/icon-button";
import "@material/web/list/list";
import "@material/web/list/list-item";
import { isTestNodeId, toBigIntAwareJson } from "@matter-server/ws-client";
import { css, html, LitElement } from "lit";
import { customElement, property } from "lit/decorators.js";
import { unsafeHTML } from "lit/directives/unsafe-html.js";
import { clusters } from "../client/models/descriptions.js";
import { showAlertDialog } from "../components/dialog-box/show-dialog-box.js";
import "../components/ha-svg-icon";
import "../pages/components/node-details";
import { formatHex, formatNodeAddress, getEffectiveFabricIndex } from "../util/format_hex.js";
import { getClusterCommandsTag } from "./cluster-commands/index.js";
import { bindingContext } from "./components/context.js";
const GLOBAL_ATTRIBUTE_MIN = 65520;
const GLOBAL_ATTRIBUTE_MAX = 65535;
function isGlobalAttribute(id) {
  return id >= GLOBAL_ATTRIBUTE_MIN && id <= GLOBAL_ATTRIBUTE_MAX;
}
function clusterAttributes(attributes, endpoint, cluster) {
  return Object.keys(attributes).filter((key) => key.startsWith(`${endpoint}/${cluster}/`)).map((key) => {
    const attributeKey = Number(key.split("/")[2]);
    return { key: attributeKey, value: attributes[key] };
  }).sort((a, b) => {
    const aIsGlobal = isGlobalAttribute(a.key);
    const bIsGlobal = isGlobalAttribute(b.key);
    if (aIsGlobal !== bIsGlobal) {
      return aIsGlobal ? 1 : -1;
    }
    return a.key - b.key;
  });
}
let MatterClusterView = class extends LitElement {
  render() {
    if (!this.node || this.endpoint == void 0 || this.cluster == void 0) {
      return html`
                <p>Node, endpoint or cluster not found!</p>
                <button @click=${this._goBack}>Back</button>
            `;
    }
    const fabricIndex = getEffectiveFabricIndex(
      this.client.serverInfo.fabric_index,
      isTestNodeId(this.node.node_id)
    );
    const nodeHex = formatNodeAddress(fabricIndex, this.node.node_id);
    return html`
            <dashboard-header
                .title=${`Node ${this.node.node_id} ${nodeHex}  |  Endpoint ${this.endpoint}  |  Cluster ${this.cluster}`}
                .backButton=${`#node/${this.node.node_id}/${this.endpoint}`}
                .client=${this.client}
            ></dashboard-header>

            <!-- node details section -->
            <div class="container">
                <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>
                    <md-list-item>
                        <div slot="headline">
                            <b
                                >Attributes of ${clusters[this.cluster]?.label ?? "Custom/Unknown Cluster"} Cluster on
                                Endpoint ${this.endpoint}</b
                            >
                        </div>
                        <div slot="supporting-text">ClusterId ${this.cluster} (${formatHex(this.cluster)})</div>
                    </md-list-item>
                    <md-divider></md-divider>
                    ${clusterAttributes(this.node.attributes, this.endpoint, this.cluster).map(
      (attribute, index) => html`
                            <md-list-item class=${index % 2 === 1 ? "alternate-row" : ""}>
                                <div slot="headline">
                                    ${clusters[this.cluster]?.attributes[attribute.key]?.label ?? "Custom/Unknown Attribute"}
                                </div>
                                <div slot="supporting-text">
                                    AttributeId: ${attribute.key} (${formatHex(attribute.key)}) - Value type:
                                    ${clusters[this.cluster]?.attributes[attribute.key]?.type ?? "unknown"}
                                </div>
                                <div slot="end">
                                    ${toBigIntAwareJson(attribute.value).length > 30 ? html`<button
                                              @click=${() => {
        this._showAttributeValue(attribute.value);
      }}
                                          >
                                              Show value
                                          </button>` : html`<code>${toBigIntAwareJson(attribute.value)}</code>`}
                                </div>
                            </md-list-item>
                        `
    )}
                </md-list>
            </div>
        `;
  }
  async _showAttributeValue(value) {
    showAlertDialog({
      title: "Attribute value",
      text: toBigIntAwareJson(value),
      asCodeBlock: true
    });
  }
  _renderClusterCommands() {
    if (this.cluster === void 0) return html``;
    if (!this.node?.available) return html``;
    const tagName = getClusterCommandsTag(this.cluster);
    if (!tagName) return html``;
    const componentHtml = `<${tagName}></${tagName}>`;
    const element = unsafeHTML(componentHtml);
    return html`
            <div class="container">
                <div id="cluster-commands-container">${element}</div>
            </div>
        `;
  }
  updated(changedProperties) {
    super.updated(changedProperties);
    const container = 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();
  }
};
MatterClusterView.styles = css`
        :host {
            display: block;
            background-color: var(--md-sys-color-background);
        }

        .header {
            background-color: var(--md-sys-color-primary);
            color: var(--md-sys-color-on-primary);
            --icon-primary-color: var(--md-sys-color-on-primary);
            font-weight: 400;
            display: flex;
            align-items: center;
            padding-right: 8px;
            height: 48px;
        }

        md-icon-button {
            margin-right: 8px;
        }

        .flex {
            flex: 1;
        }

        .container {
            padding: 16px;
            max-width: 95%;
            margin: 0 auto;
        }

        .status {
            color: var(--danger-color);
            font-weight: bold;
            font-size: 0.8em;
        }

        md-list-item.alternate-row {
            background-color: rgba(128, 128, 128, 0.1);
        }
    `;
__decorateClass([
  property()
], MatterClusterView.prototype, "node", 2);
__decorateClass([
  provide({ context: bindingContext }),
  property()
], MatterClusterView.prototype, "endpoint", 2);
__decorateClass([
  property()
], MatterClusterView.prototype, "cluster", 2);
MatterClusterView = __decorateClass([
  customElement("matter-cluster-view")
], MatterClusterView);
//# sourceMappingURL=matter-cluster-view.js.map
