import { FluentIcon } from "../../../utilities/iconLibrary/FluentIcon.mjs";
import { c } from "react-compiler-runtime";
import React, { useState } from "react";
import { Marker, useMapEvent } from "react-leaflet";
import L from "leaflet";
import ReactDOMServer from "react-dom/server";
import RoomIcon from "@material-ui/icons/esm/Room";
//#region src/maps/leafletMaps/ui/MapMarker.jsx
const defaultWidth = 28;
const defaultHeight = 28;
const initialScale = 1;
const MapMarker = (props) => {
	const $ = c(25);
	const { position, iconComponent, highlight: t0, onClick, onMouseOver, onMouseOut } = props;
	const DefaultMarkerIcon = _temp;
	let t1;
	if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
		t1 = {
			size: [defaultWidth, defaultHeight],
			scale: initialScale,
			selected: false
		};
		$[0] = t1;
	} else t1 = $[0];
	const [icon, setIcon] = useState(t1);
	let t2;
	if ($[1] === Symbol.for("react.memo_cache_sentinel")) {
		t2 = () => {
			setIcon(_temp2);
		};
		$[1] = t2;
	} else t2 = $[1];
	const removeHighlight = t2;
	let t3;
	if ($[2] === Symbol.for("react.memo_cache_sentinel")) {
		t3 = () => {
			removeHighlight();
		};
		$[2] = t3;
	} else t3 = $[2];
	useMapEvent("click", t3);
	let t4;
	if ($[3] !== iconComponent) {
		t4 = iconComponent ? ReactDOMServer.renderToString(iconComponent) : ReactDOMServer.renderToString(/* @__PURE__ */ React.createElement(DefaultMarkerIcon, null));
		$[3] = iconComponent;
		$[4] = t4;
	} else t4 = $[4];
	const t5 = `<div style="transform: scale(${icon.scale});overflow:visible">${t4}</div>`;
	const t6 = icon.size[0] / 2;
	let t7;
	if ($[5] !== icon.size || $[6] !== t5 || $[7] !== t6) {
		t7 = new L.DivIcon({
			className: "custom-div-icon",
			html: t5,
			iconSize: icon.size,
			iconAnchor: [t6, icon.size[1]],
			popupAnchor: [0, -(icon.size[1] / 2)]
		});
		$[5] = icon.size;
		$[6] = t5;
		$[7] = t6;
		$[8] = t7;
	} else t7 = $[8];
	const markerIcon = t7;
	let t8;
	if ($[9] === Symbol.for("react.memo_cache_sentinel")) {
		t8 = { cursor: "pointer" };
		$[9] = t8;
	} else t8 = $[9];
	let t9;
	if ($[10] !== onClick) {
		t9 = () => {
			onClick && onClick();
		};
		$[10] = onClick;
		$[11] = t9;
	} else t9 = $[11];
	let t10;
	if ($[12] !== onMouseOver) {
		t10 = (e) => {
			onMouseOver && onMouseOver();
			e.target.openPopup();
		};
		$[12] = onMouseOver;
		$[13] = t10;
	} else t10 = $[13];
	let t11;
	if ($[14] !== onMouseOut) {
		t11 = (e_0) => {
			onMouseOut && onMouseOut();
			e_0.target.closePopup();
		};
		$[14] = onMouseOut;
		$[15] = t11;
	} else t11 = $[15];
	let t12;
	if ($[16] !== t10 || $[17] !== t11 || $[18] !== t9) {
		t12 = {
			click: t9,
			mouseover: t10,
			mouseout: t11
		};
		$[16] = t10;
		$[17] = t11;
		$[18] = t9;
		$[19] = t12;
	} else t12 = $[19];
	let t13;
	if ($[20] !== markerIcon || $[21] !== position || $[22] !== props || $[23] !== t12) {
		t13 = /* @__PURE__ */ React.createElement(Marker, {
			style: t8,
			position,
			icon: markerIcon,
			eventHandlers: t12,
			...props
		});
		$[20] = markerIcon;
		$[21] = position;
		$[22] = props;
		$[23] = t12;
		$[24] = t13;
	} else t13 = $[24];
	return t13;
};
function _temp() {
	return /* @__PURE__ */ React.createElement(FluentIcon, {
		component: RoomIcon,
		color: "#FF0000",
		size: 28,
		customSize: true
	});
}
function _temp2(prevState_0) {
	return {
		...prevState_0,
		scale: initialScale,
		selected: false
	};
}
//#endregion
export { MapMarker };

//# sourceMappingURL=MapMarker.mjs.map