import { __decorate } from "../../_virtual/_@oxc-project_runtime@0.95.0/helpers/decorate.js";
import { collectAllIds, treeContext } from "./treeContext.js";
import "./EFTreeItem.js";
import { provide } from "@lit/context";
import { LitElement, css, html, nothing } from "lit";
import { customElement, property, state } from "lit/decorators.js";

//#region src/gui/tree/EFTree.ts
let EFTree = class EFTree$1 extends LitElement {
	constructor(..._args) {
		super(..._args);
		this.items = [];
		this.header = "";
		this.showHeader = false;
		this.selectedId = null;
		this.expandAll = true;
		this.treeState = {
			selectedId: null,
			expandedIds: /* @__PURE__ */ new Set()
		};
		this.treeActions = {
			select: (id) => {
				this.treeState = {
					...this.treeState,
					selectedId: id
				};
				const item = id ? this.findItem(id, this.items) : null;
				this.dispatchEvent(new CustomEvent("tree-select", {
					detail: {
						id,
						item
					},
					bubbles: true,
					composed: true
				}));
			},
			toggleExpanded: (id) => {
				const newExpanded = new Set(this.treeState.expandedIds);
				if (newExpanded.has(id)) newExpanded.delete(id);
				else newExpanded.add(id);
				this.treeState = {
					...this.treeState,
					expandedIds: newExpanded
				};
			},
			setExpanded: (id, expanded) => {
				const newExpanded = new Set(this.treeState.expandedIds);
				if (expanded) newExpanded.add(id);
				else newExpanded.delete(id);
				this.treeState = {
					...this.treeState,
					expandedIds: newExpanded
				};
			}
		};
		this.providedContext = {
			state: this.treeState,
			actions: this.treeActions
		};
	}
	static {
		this.styles = css`
    :host {
      display: block;
      overflow: auto;
      font-size: 12px;

      --tree-bg: var(--ef-color-bg);
      --tree-text: var(--ef-color-text);
      --tree-hover-bg: var(--ef-color-hover);
      --tree-selected-bg: var(--ef-color-selected);
      --tree-border: var(--ef-color-border);
    }

    .tree-container {
      background: var(--tree-bg);
      color: var(--tree-text);
      min-height: 100%;
      padding: 4px 0;
    }

    .header {
      padding: 8px 12px;
      font-weight: 600;
      font-size: 11px;
      text-transform: uppercase;
      letter-spacing: 0.05em;
      color: var(--ef-color-text-muted);
      border-bottom: 1px solid var(--tree-border);
      margin-bottom: 4px;
    }

    .empty {
      padding: 16px;
      text-align: center;
      color: var(--ef-color-text-subtle);
      font-style: italic;
    }
  `;
	}
	findItem(id, items) {
		for (const item of items) {
			if (item.id === id) return item;
			if (item.children) {
				const found = this.findItem(id, item.children);
				if (found) return found;
			}
		}
		return null;
	}
	initializeExpandedState() {
		if (this.expandAll && this.items.length > 0) this.treeState = {
			...this.treeState,
			expandedIds: collectAllIds(this.items)
		};
	}
	willUpdate(changedProperties) {
		if (changedProperties.has("selectedId") && this.selectedId !== this.treeState.selectedId) this.treeState = {
			...this.treeState,
			selectedId: this.selectedId
		};
		this.providedContext = {
			state: this.treeState,
			actions: this.treeActions
		};
		super.willUpdate(changedProperties);
	}
	updated(changedProperties) {
		super.updated(changedProperties);
		if (changedProperties.has("items")) this.initializeExpandedState();
	}
	connectedCallback() {
		super.connectedCallback();
		this.initializeExpandedState();
	}
	render() {
		return html`
      <div class="tree-container">
        ${this.showHeader ? html`<div class="header">${this.header}</div>` : nothing}
        ${this.items.length > 0 ? this.items.map((item) => html`<ef-tree-item .item=${item}></ef-tree-item>`) : html`<div class="empty">No items</div>`}
      </div>
    `;
	}
};
__decorate([property({
	type: Array,
	attribute: false
})], EFTree.prototype, "items", void 0);
__decorate([property({ type: String })], EFTree.prototype, "header", void 0);
__decorate([property({
	type: Boolean,
	attribute: "show-header"
})], EFTree.prototype, "showHeader", void 0);
__decorate([property({
	type: String,
	attribute: "selected-id"
})], EFTree.prototype, "selectedId", void 0);
__decorate([property({
	type: Boolean,
	attribute: "expand-all"
})], EFTree.prototype, "expandAll", void 0);
__decorate([state()], EFTree.prototype, "treeState", void 0);
__decorate([provide({ context: treeContext }), state()], EFTree.prototype, "providedContext", void 0);
EFTree = __decorate([customElement("ef-tree")], EFTree);

//#endregion
export { EFTree };
//# sourceMappingURL=EFTree.js.map