import { getThemeLabel as e } from "../../ui/index.js";
import { COLOR_MODES as t, getTheme as n, setThemePartial as r } from "../../services/theme-engine/index.js";
//#region src/components/theme/theme-switcher.ts
var i = [
	"light",
	"dark",
	"monokai",
	"glass"
], a = class {
	el;
	constructor() {
		this.el = document.createElement("div"), this.el.className = "preview-theme-switcher";
		let n = document.createElement("span");
		n.className = "preview-theme-switcher__label", n.textContent = "Theme", this.el.appendChild(n);
		let a = document.createElement("div");
		a.className = "preview-theme-switcher__buttons";
		for (let n of i) {
			let i = t[n], o = document.createElement("button");
			o.type = "button", o.className = "preview-theme-switcher__btn", o.dataset.theme = n, o.title = i.label || e(n), o.setAttribute("aria-label", `Switch to ${i.label} theme`);
			let s = document.createElement("span");
			s.className = `preview-theme-swatch preview-theme-swatch--${n}`, o.appendChild(s), o.addEventListener("click", () => {
				r({ mode: n });
			}), a.appendChild(o);
		}
		this.el.appendChild(a), document.addEventListener("cm:theme-change", () => this.updateActive()), this.updateActive();
	}
	updateActive() {
		let e = n().mode, t = this.el.querySelectorAll(".preview-theme-switcher__btn");
		for (let n of t) {
			let t = n.dataset.theme === e;
			n.classList.toggle("preview-theme-switcher__btn--active", t), n.setAttribute("aria-pressed", String(t));
		}
	}
};
//#endregion
export { a as ThemeSwitcher };

//# sourceMappingURL=theme-switcher.js.map