import { __decorate } from "../_virtual/_@oxc-project_runtime@0.95.0/helpers/decorate.js";
import { parseRotationFromTransform } from "./transformCalculations.js";
import { LitElement, css, html } from "lit";
import { customElement, property } from "lit/decorators.js";

//#region src/gui/EFOverlayItem.ts
let EFOverlayItem = class EFOverlayItem$1 extends LitElement {
	constructor(..._args) {
		super(..._args);
		this.currentPosition = null;
	}
	static {
		this.styles = [css`
      :host {
        display: block;
        position: absolute;
        pointer-events: auto;
        transform-origin: center;
      }
    `];
	}
	resolveTarget() {
		if (this.elementId) {
			let element = document.querySelector(`[data-element-id="${this.elementId}"]`);
			if (!element) element = document.querySelector(`[data-timegroup-id="${this.elementId}"]`);
			return element || null;
		}
		if (!this.target) return null;
		if (typeof this.target === "string") return document.querySelector(this.target) || document.getElementById(this.target);
		if (!this.target.isConnected) return null;
		return this.target;
	}
	/**
	* Update position based on target element.
	* Called by parent EFOverlayLayer in its synchronized RAF loop.
	* PUBLIC API - called by parent layer.
	*/
	updatePosition() {
		const targetElement = this.resolveTarget();
		if (!targetElement) {
			if (this.style.display !== "none") this.style.display = "none";
			return;
		}
		if (this.style.display === "none") this.style.display = "";
		const overlayLayer = this.parentElement;
		if (!overlayLayer) return;
		const overlayLayerRect = overlayLayer.getBoundingClientRect();
		const targetRect = targetElement.getBoundingClientRect();
		if (targetRect.width === 0 && targetRect.height === 0) return;
		const rotation = parseRotationFromTransform(window.getComputedStyle(targetElement).transform);
		const overlayPosition = {
			x: targetRect.left - overlayLayerRect.left,
			y: targetRect.top - overlayLayerRect.top,
			width: targetRect.width,
			height: targetRect.height,
			rotation
		};
		if (overlayPosition.width <= 0 || overlayPosition.height <= 0) return;
		if (!this.currentPosition || Math.abs(this.currentPosition.x - overlayPosition.x) > .01 || Math.abs(this.currentPosition.y - overlayPosition.y) > .01 || Math.abs(this.currentPosition.width - overlayPosition.width) > .01 || Math.abs(this.currentPosition.height - overlayPosition.height) > .01 || Math.abs(this.currentPosition.rotation - overlayPosition.rotation) > .01) {
			this.currentPosition = overlayPosition;
			this.style.left = `${overlayPosition.x}px`;
			this.style.top = `${overlayPosition.y}px`;
			this.style.width = `${overlayPosition.width}px`;
			this.style.height = `${overlayPosition.height}px`;
			if (overlayPosition.rotation !== 0) this.style.transform = `rotate(${overlayPosition.rotation}deg)`;
			else this.style.transform = "";
			this.dispatchEvent(new CustomEvent("position-changed", {
				detail: { ...overlayPosition },
				bubbles: true,
				composed: true
			}));
		}
	}
	connectedCallback() {
		super.connectedCallback();
		const parent = this.parentElement;
		if (parent && typeof parent.registerOverlayItem === "function") parent.registerOverlayItem(this);
	}
	disconnectedCallback() {
		super.disconnectedCallback();
		const parent = this.parentElement;
		if (parent && typeof parent.unregisterOverlayItem === "function") parent.unregisterOverlayItem(this);
	}
	render() {
		return html`<slot></slot>`;
	}
};
__decorate([property({
	type: String,
	attribute: "element-id"
})], EFOverlayItem.prototype, "elementId", void 0);
__decorate([property({ attribute: false })], EFOverlayItem.prototype, "target", void 0);
EFOverlayItem = __decorate([customElement("ef-overlay-item")], EFOverlayItem);

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