import { ICON_USAGES as e, getTheme as t, setThemePartial as n } from "../../services/theme-engine/index.js";
//#region src/components/theme/icon-usage-matrix.ts
var r = class {
	el;
	constructor() {
		this.el = document.createElement("div"), this.el.className = "theme-studio-icon-matrix", this.render(), document.addEventListener("cm:theme-change", () => this.refreshLabels());
	}
	currentIcon(e) {
		return (t().iconOverrides ?? {})[e.id] ?? e.defaultIcon;
	}
	cycle(e) {
		let r = this.currentIcon(e), i = e.alternates.length > 0 ? e.alternates : [e.defaultIcon], a = i[(i.indexOf(r) + 1) % i.length] ?? e.defaultIcon, o = { ...t().iconOverrides ?? {} };
		a === e.defaultIcon ? delete o[e.id] : o[e.id] = a, n({ iconOverrides: o });
	}
	reset(e) {
		let r = { ...t().iconOverrides ?? {} };
		delete r[e.id], n({ iconOverrides: r });
	}
	render() {
		this.el.innerHTML = "";
		for (let t of e) {
			let e = document.createElement("div");
			e.className = "theme-studio-icon-matrix__row", e.dataset.slot = t.id;
			let n = document.createElement("div");
			n.className = "theme-studio-icon-matrix__label", n.textContent = t.label, e.appendChild(n);
			let r = document.createElement("code");
			r.className = "theme-studio-icon-matrix__icon", r.textContent = this.currentIcon(t), e.appendChild(r);
			let i = document.createElement("div");
			i.className = "theme-studio-icon-matrix__actions";
			let a = document.createElement("button");
			a.type = "button", a.className = "theme-studio-icon-matrix__change", a.textContent = "Change", a.addEventListener("click", () => this.cycle(t)), i.appendChild(a);
			let o = document.createElement("button");
			o.type = "button", o.className = "theme-studio-icon-matrix__reset", o.textContent = "Reset", o.addEventListener("click", () => this.reset(t)), i.appendChild(o), e.appendChild(i), this.el.appendChild(e);
		}
	}
	refreshLabels() {
		let t = this.el.querySelectorAll(".theme-studio-icon-matrix__row");
		for (let n of t) {
			let t = n.dataset.slot, r = e.find((e) => e.id === t);
			if (!r) continue;
			let i = n.querySelector(".theme-studio-icon-matrix__icon");
			i && (i.textContent = this.currentIcon(r));
		}
	}
};
//#endregion
export { r as IconUsageMatrix };

//# sourceMappingURL=icon-usage-matrix.js.map