import { t as e } from "../../purify.es-Dsqc2y0I.js";
import { n as t } from "../../utils-C_mWfcFX.js";
//#region src/navigation/drawer/index.ts
function n(e) {
	let t = [
		"a[href]",
		"button:not([disabled])",
		"input:not([disabled])",
		"select:not([disabled])",
		"textarea:not([disabled])",
		"[tabindex]:not([tabindex=\"-1\"])"
	].join(", ");
	return Array.from(e.querySelectorAll(t));
}
var r = {
	sm: "320px",
	md: "480px",
	lg: "640px",
	full: "100%"
}, i = class {
	side;
	size;
	title;
	showOverlay;
	closeOnEscape;
	closeOnOverlay;
	className;
	onOpenCallback;
	onCloseCallback;
	drawerId;
	overlayEl = null;
	drawerEl = null;
	contentEl = null;
	opened = !1;
	destroyed = !1;
	previouslyFocused = null;
	handleKeyDown;
	constructor(e) {
		this.side = e.side ?? "left", this.size = e.size ?? "md", this.title = e.title, this.showOverlay = e.showOverlay !== !1, this.closeOnEscape = e.closeOnEscape !== !1, this.closeOnOverlay = e.closeOnOverlay !== !1, this.className = e.className, this.onOpenCallback = e.onOpen, this.onCloseCallback = e.onClose, this.drawerId = t("cmm-drawer"), this.handleKeyDown = (e) => {
			this.onKeyDown(e);
		};
	}
	isOpen() {
		return this.opened;
	}
	open(e) {
		if (!(this.destroyed || this.opened)) {
			if (this.opened = !0, this.previouslyFocused = document.activeElement, this.createDrawerElement(e), this.drawerEl && this.drawerEl.offsetHeight, requestAnimationFrame(() => {
				this.overlayEl && this.overlayEl.classList.add("cmm-drawer-overlay--open"), this.drawerEl && this.drawerEl.classList.add("cmm-drawer--open");
			}), this.closeOnEscape && document.addEventListener("keydown", this.handleKeyDown), document.body.style.overflow = "hidden", this.drawerEl) {
				let e = n(this.drawerEl)[0];
				e ? e.focus() : (this.drawerEl.setAttribute("tabindex", "-1"), this.drawerEl.focus());
			}
			this.onOpenCallback?.();
		}
	}
	close() {
		if (!this.opened) return;
		this.opened = !1, document.removeEventListener("keydown", this.handleKeyDown), this.overlayEl && this.overlayEl.classList.remove("cmm-drawer-overlay--open"), this.drawerEl && this.drawerEl.classList.remove("cmm-drawer--open");
		let e = this.overlayEl, t = this.drawerEl;
		setTimeout(() => {
			e && e.remove(), t && t.remove();
		}, 300), this.overlayEl = null, this.drawerEl = null, this.contentEl = null, document.body.style.overflow = "", this.previouslyFocused &&= (this.previouslyFocused.focus(), null), this.onCloseCallback?.();
	}
	toggle(e) {
		this.opened ? this.close() : this.open(e);
	}
	setContent(t) {
		this.contentEl && (this.contentEl.innerHTML = "", typeof t == "string" ? this.contentEl.innerHTML = e.sanitize(t) : this.contentEl.appendChild(t));
	}
	destroy() {
		this.destroyed || (this.destroyed = !0, this.close(), document.removeEventListener("keydown", this.handleKeyDown));
	}
	createDrawerElement(n) {
		if (this.showOverlay) {
			let e = document.createElement("div");
			e.className = "cmm-drawer-overlay", this.closeOnOverlay && e.addEventListener("click", () => {
				this.close();
			}), document.body.appendChild(e), this.overlayEl = e;
		}
		let i = document.createElement("div");
		i.className = `cmm-drawer cmm-drawer--${this.side} cmm-drawer--${this.size}`, i.id = this.drawerId, i.setAttribute("role", "dialog"), i.setAttribute("aria-modal", "true"), this.className && i.classList.add(this.className);
		let a = r[this.size];
		if (this.side === "left" || this.side === "right" ? i.style.width = a : i.style.height = a, this.title !== void 0) {
			let e = document.createElement("div");
			e.className = "cmm-drawer__header";
			let n = document.createElement("h2");
			n.className = "cmm-drawer__title", n.id = t("cmm-drawer-title"), n.textContent = this.title, i.setAttribute("aria-labelledby", n.id), e.appendChild(n);
			let r = document.createElement("button");
			r.className = "cmm-drawer__close", r.type = "button", r.setAttribute("aria-label", "Close"), r.textContent = "×", r.addEventListener("click", () => {
				this.close();
			}), e.appendChild(r), i.appendChild(e);
		}
		let o = document.createElement("div");
		o.className = "cmm-drawer__content", n !== void 0 && (typeof n == "string" ? o.innerHTML = e.sanitize(n) : o.appendChild(n)), i.appendChild(o), document.body.appendChild(i), this.drawerEl = i, this.contentEl = o;
	}
	onKeyDown(e) {
		if (e.key === "Escape") {
			e.preventDefault(), this.close();
			return;
		}
		if (e.key === "Tab" && this.drawerEl) {
			let t = n(this.drawerEl);
			if (t.length === 0) {
				e.preventDefault();
				return;
			}
			let r = t[0], i = t[t.length - 1];
			if (r === void 0 || i === void 0) {
				e.preventDefault();
				return;
			}
			e.shiftKey ? document.activeElement === r && (e.preventDefault(), i.focus()) : document.activeElement === i && (e.preventDefault(), r.focus());
		}
	}
};
//#endregion
export { i as Drawer };

//# sourceMappingURL=index.js.map