/*!
 * Copyright (c) 2026 Vertex Software LLC. All rights reserved.
 */
import { h, F as Fragment, r as registerInstance } from './index-EpnuuCxl.js';
import { p as point, m as matrix4, v as vector3 } from './bundle-DfdVaPrt.js';
import './controller-zACO6f4n.js';
import './cursors-DImFnILd.js';
import './geometry_pb-BPrLQ_K_.js';
import './wrappers_pb-aFAwKqIf.js';
import './wrappers_pb-Xw_x1jYm.js';
import './bundle-CLE0fYge.js';
import './streamAttributes-B6xi3kRV.js';
import './representation_pb-CQzLHWhX.js';
import './entities-BAhfr1Nx.js';
import { V as Viewport } from './viewport-DbTg_ax4.js';
import { g as getPinColors, i as isIconPin, b as isTextPin, P as PinModel, a as PinController, c as translatePointToScreen } from './model-C-U1XF3h.js';
import { c as classname } from './index-DI7z7TKn.js';
import './errors-Cs13_LRq.js';
import './bundle-DLfw87TV.js';
import './_commonjsHelpers-CG9AChtV.js';
import './row-CiSHWNC4.js';

// eslint-disable-next-line @typescript-eslint/no-unused-vars
const PinRenderer = ({ pin, selected, occluded, detached, }) => {
    const { primaryColor } = getPinColors(pin);
    return (h(Fragment, null, isTextPin(pin) && (h("div", { id: "pin-anchor", class: classname('pin-anchor', {
            selected: selected,
            'pin-occluded': occluded,
            'pin-detached': detached,
        }), style: {
            background: primaryColor,
        } })), isIconPin(pin) && (h("vertex-viewer-icon", { name: "pin-fill", size: "lg", class: classname('pin', {
            'pin-selected': selected,
            'pin-occluded': occluded,
            'pin-detached': detached,
        }), style: {
            color: primaryColor,
        } }))));
};

function getClosestCenterToPoint(boxPoint, pointToMeasure, dimensions) {
    const topPoint = {
        x: boxPoint.x + dimensions.width / 2,
        y: boxPoint.y,
    };
    const bottomPoint = {
        x: boxPoint.x + dimensions.width / 2,
        y: boxPoint.y + dimensions.height,
    };
    const rightPoint = {
        x: boxPoint.x + dimensions.width,
        y: boxPoint.y + dimensions.height / 2,
    };
    const leftPoint = {
        x: boxPoint.x,
        y: boxPoint.y + dimensions.height / 2,
    };
    const candidates = [topPoint, bottomPoint, leftPoint, rightPoint];
    const distances = candidates.map((candidate) => point.distance(candidate, pointToMeasure));
    const candidateIndex = distances.indexOf(Math.min(...distances));
    return candidates[candidateIndex];
}

const viewerPinGroupCss = () => `:host{--viewer-annotations-pin-primary-color:var(--blue-700);--viewer-annotations-pin-accent-color:var(--blue-200);--viewer-annotations-pin-dot-color:var(--viewer-annotations-pin-primary-color);--viewer-annotations-pin-color:var(--viewer-annotations-pin-primary-color);--viewer-annotations-pin-font-size:0.75rem;--viewer-annotations-pin-selected-stroke:var(--white);--viewer-annotations-pin-selected-border:2px solid var(--white);--viewer-annotations-pin-label-border:2px solid var(--black);--viewer-annotations-pin-selected-stroke:var(--white);font-size:var(--viewer-annotations-pin-font-size);position:absolute;top:0;bottom:0;left:0;right:0;overflow:hidden;pointer-events:none}.pin-anchor{position:absolute;border-radius:50%;transform:translate(-50%, -50%);display:block;width:9px;height:9px;box-sizing:border-box;border:var(--viewer-annotations-pin-label-border);background:var(--viewer-annotations-pin-dot-color);pointer-events:auto;cursor:pointer}.selected{width:13px;height:13px;border:var(--viewer-annotations-pin-selected-border)}.pin{color:var(--viewer-annotations-pin-color);cursor:pointer;transition:opacity 0.3s ease-in;transform:translate(0px, -12px)}.pin-selected{stroke-width:1;stroke:var(--viewer-annotations-pin-selected-stroke)}.pin-occluded{opacity:.3;transition:opacity 0.3s ease-in}.pin-detached{visibility:hidden}`;

const ViewerPinGroup = class {
    constructor(hostRef) {
        registerInstance(this, hostRef);
        /**
         * The local matrix of this element.
         */
        this.matrix = matrix4.makeIdentity();
        /**
         * Projection view matrix used for computing the position of the pin line
         */
        this.projectionViewMatrix = matrix4.makeIdentity();
        /**
         * The model that contains the entities and outcomes from performing pin operations
         */
        this.pinModel = new PinModel();
        /**
         * Whether the pin is "selected"
         */
        this.selected = false;
        /**
         * @internal
         * Whether the pin is occluded
         */
        this.occluded = false;
        /**
         * @internal
         * Whether the pin is detached
         */
        this.detached = false;
        this.invalidateStateCounter = 0;
        this.invalidateState = () => {
            this.invalidateStateCounter = this.invalidateStateCounter + 1;
        };
    }
    componentDidLoad() {
        var _a;
        this.setLabelObserver();
        if (this.pinController == null) {
            this.pinController = new PinController(this.pinModel);
        }
        if (this.selected) {
            (_a = this.labelEl) === null || _a === void 0 ? void 0 : _a.setFocus();
        }
    }
    /**
     * @ignore
     */
    async handleOcclusionStateChanged(event) {
        this.occluded = event.detail;
    }
    /**
     * @ignore
     */
    async handleDetachedStateChanged(event) {
        this.detached = event.detail;
    }
    disconnectedCallback() {
        var _a, _b;
        (_a = this.labelEl) === null || _a === void 0 ? void 0 : _a.removeEventListener('labelChanged', this.invalidateState);
        (_b = this.resizeObserver) === null || _b === void 0 ? void 0 : _b.disconnect();
    }
    render() {
        var _a;
        if (this.pin == null) {
            throw new Error('Unable to draw pin');
        }
        const { pinPoint, labelPoint } = this.computePinPoints(this.pin);
        return (h(Fragment, { key: 'b26f95c0e4b86b263eca80c5db8576ef1c787b26' }, h("vertex-viewer-dom-element", { key: '9fcb9d0f55f9abb3397db4051ed59c7a05d4ae6a', "data-testid": `drawn-pin-${this.pin.id}`, position: this.pin.worldPosition, onPointerDown: async () => {
                var _a;
                await ((_a = this.labelEl) === null || _a === void 0 ? void 0 : _a.submit());
                this.selectPin();
                this.handleAnchorPointerDown();
            }, detachedOff: false }, h(PinRenderer, { key: '2264652f4c83539f47af324f6937fb6581edafe1', pin: this.pin, selected: this.selected, occluded: this.occluded, detached: this.detached })), isTextPin(this.pin) && !this.occluded && !this.detached && (h(Fragment, { key: '04c86f573b99fb320b0a651dc903131e6654bd9e' }, h("vertex-viewer-pin-label-line", { key: 'cec6ee8195fba5fadd9e1b272abd61b6b6dd05c6', id: `pin-label-line-${(_a = this.pin) === null || _a === void 0 ? void 0 : _a.id}`, pinPoint: pinPoint, pin: this.pin, labelPoint: labelPoint, onPointerDown: () => this.selectPin() }), h("vertex-viewer-pin-label", { key: '556a36ac8e9046b0e40c6973c1ecf47319f28ab6', pin: this.pin, ref: (el) => (this.labelEl = el), elementBounds: this.elementBounds, pinController: this.pinController, onPointerDown: () => this.selectPin() })))));
    }
    setLabelObserver() {
        if (this.labelEl != null) {
            this.labelEl.addEventListener('labelChanged', this.invalidateState);
            this.resizeObserver = new ResizeObserver(() => this.invalidateState());
            this.resizeObserver.observe(this.labelEl);
        }
    }
    computePinPoints(pin) {
        if (this.elementBounds != null && this.pin != null) {
            return isTextPin(this.pin) && this.pin.label.point != null
                ? this.computeTextPinPoints(this.pin, this.elementBounds)
                : this.computeDefaultPinPoints(this.pin, this.elementBounds);
        }
        return { pinPoint: pin.worldPosition };
    }
    computeDefaultPinPoints(pin, elementBounds) {
        return {
            pinPoint: this.getFromWorldPosition(pin.worldPosition, this.projectionViewMatrix, elementBounds),
        };
    }
    computeTextPinPoints(pin, elementBounds) {
        var _a, _b, _c, _d;
        const { pinPoint } = this.computeDefaultPinPoints(pin, elementBounds);
        const screenPosition = translatePointToScreen(pin.label.point, elementBounds);
        const labelWidth = ((_b = (_a = this.labelEl) === null || _a === void 0 ? void 0 : _a.firstElementChild) === null || _b === void 0 ? void 0 : _b.clientWidth) || 0;
        const labelHeight = ((_d = (_c = this.labelEl) === null || _c === void 0 ? void 0 : _c.firstElementChild) === null || _d === void 0 ? void 0 : _d.clientHeight) || 0;
        return {
            pinPoint,
            labelPoint: getClosestCenterToPoint(screenPosition, pinPoint, {
                width: labelWidth,
                height: labelHeight,
            }),
        };
    }
    handleAnchorPointerDown() {
        var _a, _b;
        if (this.elementBounds != null &&
            ((_a = this.pinController) === null || _a === void 0 ? void 0 : _a.getToolMode()) === 'edit' &&
            this.pin != null) {
            (_b = this.pinController) === null || _b === void 0 ? void 0 : _b.setDraggable({ id: this.pin.id });
        }
    }
    selectPin() {
        var _a, _b;
        (_a = this.pinController) === null || _a === void 0 ? void 0 : _a.setSelectedPinId((_b = this.pin) === null || _b === void 0 ? void 0 : _b.id);
    }
    getFromWorldPosition(pt, projectionViewMatrix, dimensions) {
        const ndcPt = vector3.transformMatrix(pt, projectionViewMatrix);
        return Viewport.fromDimensions(dimensions).transformVectorToViewport(ndcPt);
    }
};
ViewerPinGroup.style = viewerPinGroupCss();

export { ViewerPinGroup as vertex_viewer_pin_group };
//# sourceMappingURL=vertex-viewer-pin-group.entry.js.map

//# sourceMappingURL=vertex-viewer-pin-group.entry.js.map