@mint-ui/map 1.2.0-test.2 → 1.2.0-test.20

package/dist/components/mint-map/core/advanced/woongCanvas/shared/utils.js

@@ -47,11 +47,11 @@ var computePolygonOffsets = function (polygonData, controller) {
  */
 
 var computeMarkerOffset = function (markerData, controller) {
-  if (!markerData.position || markerData.position.length === 0) {
+  if (!markerData.position) {
     return null;
   }
 
-  return controller.positionToOffset(markerData.position[0]);
+  return controller.positionToOffset(markerData.position);
 };
 /**
  * Point-in-Polygon 알고리즘
@@ -72,18 +72,67 @@ var isPointInPolygon = function (point, polygon) {
   return inside;
 };
 /**
- * 폴리곤 히트 테스트
+ * 폴리곤 히트 테스트 (도넛 폴리곤 지원)
+ *
+ * 로직:
+ * 1. 외부 폴리곤(첫 번째): 내부에 있어야 함
+ * 2. 내부 구멍들(나머지): 내부에 있으면 안 됨 (evenodd 규칙)
+ *
+ * 중요: 도넛 폴리곤과 내부 폴리곤은 별개의 polygonData로 처리됨
+ * - 도넛 폴리곤 A: isDonutPolygon=true
+ * - 내부 폴리곤 B: isDonutPolygon=false (별도 데이터)
  */
 
 var isPointInPolygonData = function (clickedOffset, polygonData, getPolygonOffsets) {
   var polygonOffsets = getPolygonOffsets(polygonData);
-  if (!polygonOffsets) return false;
+  if (!polygonOffsets) return false; // 🍩 도넛 폴리곤 처리 (isDonutPolygon === true)
 
-  for (var _i = 0, polygonOffsets_1 = polygonOffsets; _i < polygonOffsets_1.length; _i++) {
-    var multiPolygon = polygonOffsets_1[_i];
+  if (polygonData.isDonutPolygon) {
+    for (var _i = 0, polygonOffsets_1 = polygonOffsets; _i < polygonOffsets_1.length; _i++) {
+      var multiPolygon = polygonOffsets_1[_i];
+      if (multiPolygon.length === 0) continue; // 외부 폴리곤만 있는 경우 (구멍 없음) - 일반 폴리곤처럼 처리
 
-    for (var _a = 0, multiPolygon_2 = multiPolygon; _a < multiPolygon_2.length; _a++) {
-      var polygonGroup = multiPolygon_2[_a];
+      if (multiPolygon.length === 1) {
+        if (isPointInPolygon(clickedOffset, multiPolygon[0])) {
+          return true;
+        }
+
+        continue;
+      } // 1. 외부 폴리곤(첫 번째)에 포함되는지 확인
+
+
+      var outerPolygon = multiPolygon[0];
+
+      if (!isPointInPolygon(clickedOffset, outerPolygon)) {
+        continue; // 외부 폴리곤 밖이면 다음 multiPolygon 확인
+      } // 2. 내부 구멍들(나머지)에 포함되는지 확인
+
+
+      for (var i = 1; i < multiPolygon.length; i++) {
+        var hole = multiPolygon[i];
+
+        if (isPointInPolygon(clickedOffset, hole)) {
+          // ❌ 구멍 안에 있음 → 이 도넛 폴리곤은 히트 안 됨
+          // 다른 multiPolygon 체크하지 않고 바로 false 반환
+          // (도넛 폴리곤의 구멍 안은 무조건 클릭 불가)
+          return false;
+        }
+      } // ✅ 외부 폴리곤 안 + 구멍 밖 = 히트!
+
+
+      return true;
+    }
+
+    return false;
+  } // 일반 폴리곤 처리 (isDonutPolygon === false 또는 undefined)
+
+
+  for (var _a = 0, polygonOffsets_2 = polygonOffsets; _a < polygonOffsets_2.length; _a++) {
+    var multiPolygon = polygonOffsets_2[_a];
+
+    for (var _b = 0, multiPolygon_2 = multiPolygon; _b < multiPolygon_2.length; _b++) {
+      var polygonGroup = multiPolygon_2[_b];
+      if (polygonGroup.length === 0) continue;
 
       if (isPointInPolygon(clickedOffset, polygonGroup)) {
         return true;
@@ -94,7 +143,12 @@ var isPointInPolygonData = function (clickedOffset, polygonData, getPolygonOffse
   return false;
 };
 /**
- * 마커 히트 테스트
+ * 마커 히트 테스트 (클릭/hover 영역 체크)
+ *
+ * 🎯 중요: 꼬리(tail)는 Hit Test 영역에서 제외됩니다!
+ * - markerOffset.y는 마커 최하단(꼬리 끝) 좌표
+ * - boxHeight는 마커 본체만 포함 (꼬리 제외)
+ * - tailHeight만큼 위로 올려서 본체만 Hit Test 영역으로 사용
  */
 
 var isPointInMarkerData = function (clickedOffset, markerData, getMarkerOffset) {
@@ -102,14 +156,58 @@ var isPointInMarkerData = function (clickedOffset, markerData, getMarkerOffset)
   if (!markerOffset) return false;
   var boxWidth = markerData.boxWidth || 50;
   var boxHeight = markerData.boxHeight || 28;
-  var tailHeight = 6;
+  var tailHeight = markerData.tailHeight || 0; // 🎯 tailHeight 사용!
+
   var x = markerOffset.x - boxWidth / 2;
-  var y = markerOffset.y - boxHeight - tailHeight;
+  var y = markerOffset.y - boxHeight - tailHeight; // 🔥 꼬리만큼 위로!
+
   return clickedOffset.x >= x && clickedOffset.x <= x + boxWidth && clickedOffset.y >= y && clickedOffset.y <= y + boxHeight;
 };
+var hexToRgba = function (hexColor, alpha) {
+  if (alpha === void 0) {
+    alpha = 1;
+  } // NOTE: 입력된 hexColor에서 "#" 제거
+
+
+  var hex = hexColor.replace('#', ''); // NOTE: 6자리일 경우 알파 값은 사용자가 제공한 alpha 값으로 설정
+
+  if (hex.length === 6) {
+    var r = parseInt(hex.substring(0, 2), 16);
+    var g = parseInt(hex.substring(2, 4), 16);
+    var b = parseInt(hex.substring(4, 6), 16);
+    return "rgba(".concat(r, ", ").concat(g, ", ").concat(b, ", ").concat(alpha, ")");
+  }
+
+  throw new Error('Invalid hex color format');
+};
+var tempCanvas = document.createElement('canvas');
+var tempCtx = tempCanvas.getContext('2d');
+/**
+ * 텍스트 박스의 너비를 계산합니다.
+ *
+ * @param {Object} params - 파라미터 객체
+ * @param {string} params.text - 측정할 텍스트
+ * @param {string} params.fontConfig - 폰트 설정 (예: 'bold 16px Arial')
+ * @param {number} params.padding - 텍스트 박스에 적용할 패딩 값
+ * @param {number} params.minWidth - 최소 너비
+ * @returns {number} 계산된 텍스트 박스의 너비
+ */
+
+var calculateTextBoxWidth = function (_a) {
+  var text = _a.text,
+      fontConfig = _a.fontConfig,
+      padding = _a.padding,
+      minWidth = _a.minWidth;
+  if (!tempCtx) return 0;
+  tempCtx.font = fontConfig;
+  var textWidth = tempCtx.measureText(text).width;
+  return Math.max(minWidth, textWidth + padding);
+};
 
+exports.calculateTextBoxWidth = calculateTextBoxWidth;
 exports.computeMarkerOffset = computeMarkerOffset;
 exports.computePolygonOffsets = computePolygonOffsets;
+exports.hexToRgba = hexToRgba;
 exports.isPointInMarkerData = isPointInMarkerData;
 exports.isPointInPolygon = isPointInPolygon;
 exports.isPointInPolygonData = isPointInPolygonData;

package/dist/components/mint-map/core/wrapper/MapMarkerWrapper.js

@@ -172,7 +172,7 @@ function MapMarkerWrapper(_a) {
   var onMouseOverHandler = function (e) {
     var _a;
 
-    var marker = markerRef.current; //console.log('onMouseOverHandler', marker);
+    var marker = markerRef.current;
 
     if (marker) {
       var mouseOverHandler = (_a = options === null || options === void 0 ? void 0 : options.event) === null || _a === void 0 ? void 0 : _a.get('mouseover');
@@ -185,6 +185,25 @@ function MapMarkerWrapper(_a) {
 
       next && topOnHover && controller.markerToTheTop(marker);
     }
+  }; // 20251014 | 장한별 | mouseleave 이벤트 추가, 마우스가 마커 위에서 떠날 때 원래 zindex 를 복구하기 위함
+
+
+  var onMouseLeaveHandler = function (e) {
+    var _a;
+
+    var marker = markerRef.current;
+
+    if (marker) {
+      var mouseOutHandler = (_a = options === null || options === void 0 ? void 0 : options.event) === null || _a === void 0 ? void 0 : _a.get('mouseout');
+      var next = true;
+
+      if (mouseOutHandler) {
+        var hasNext = mouseOutHandler(e);
+        hasNext !== undefined && (next = hasNext);
+      }
+
+      next && topOnHover && controller.restoreMarkerZIndex(marker);
+    }
   }; //create object
 
 
@@ -202,10 +221,12 @@ function MapMarkerWrapper(_a) {
     }); //드래그 여부 초기화를 먼저 수행하기 위해 capture : true 처리
 
     divElement.addEventListener('mouseover', onMouseOverHandler);
+    divElement.addEventListener('mouseleave', onMouseLeaveHandler);
     return function () {
       divElement.removeEventListener('click', onClickHandler);
       divElement.removeEventListener('mousedown', onMousedownHandler);
       divElement.removeEventListener('mouseover', onMouseOverHandler);
+      divElement.removeEventListener('mouseleave', onMouseLeaveHandler);
 
       if (markerRef.current) {
         controller.clearDrawable(markerRef.current);

package/dist/components/mint-map/google/GoogleMintMapController.d.ts

@@ -28,6 +28,7 @@ export declare class GoogleMintMapController extends MintMapController {
     private getMaxZIndex;
     setMarkerZIndex(marker: Marker, zIndex: number): void;
     markerToTheTop(marker: Marker): void;
+    restoreMarkerZIndex(marker: Marker): void;
     clearDrawable(drawable: Drawable): boolean;
     private dragged;
     isMapDragged(): boolean;

package/dist/components/mint-map/google/GoogleMintMapController.js

@@ -20,7 +20,9 @@ var polygon = require('../core/util/polygon.js');
 require('../naver/NaverMintMapController.js');
 require('../core/advanced/canvas/CanvasMarkerClaude.js');
 require('../core/advanced/MapLoadingComponents.js');
-require('../core/advanced/woongCanvas/WoongKonvaMarker.js');
+require('konva');
+require('../core/advanced/woongCanvas/shared/types.js');
+require('../core/advanced/woongCanvas/shared/utils.js');
 require('../core/advanced/woongCanvas/shared/context.js');
 require('../core/advanced/woongCanvas/shared/performance.js');
 require('../core/wrapper/MapControlWrapper.js');
@@ -339,6 +341,10 @@ function (_super) {
     }
   };
 
+  GoogleMintMapController.prototype.restoreMarkerZIndex = function (marker) {// Google Maps에서는 restoreMarkerZIndex 기능을 지원하지 않습니다.
+    // 이 기능은 Naver Maps에서만 사용 가능합니다.
+  };
+
   GoogleMintMapController.prototype.clearDrawable = function (drawable) {
     if (drawable && drawable.native) {
       if (drawable.native instanceof google.maps.Marker || drawable.native instanceof google.maps.Polygon || drawable.native instanceof google.maps.Polyline) {

package/dist/components/mint-map/kakao/KakaoMintMapController.d.ts

@@ -31,6 +31,7 @@ export declare class KakaoMintMapController extends MintMapController {
     private getMaxZIndex;
     setMarkerZIndex(marker: Marker, zIndex: number): void;
     markerToTheTop(marker: Marker): void;
+    restoreMarkerZIndex(marker: Marker): void;
     clearDrawable(drawable: Drawable): boolean;
     private dragged;
     isMapDragged(): boolean;

package/dist/components/mint-map/kakao/KakaoMintMapController.js

@@ -21,7 +21,9 @@ var polygon = require('../core/util/polygon.js');
 require('../naver/NaverMintMapController.js');
 require('../core/advanced/canvas/CanvasMarkerClaude.js');
 require('../core/advanced/MapLoadingComponents.js');
-require('../core/advanced/woongCanvas/WoongKonvaMarker.js');
+require('konva');
+require('../core/advanced/woongCanvas/shared/types.js');
+require('../core/advanced/woongCanvas/shared/utils.js');
 require('../core/advanced/woongCanvas/shared/context.js');
 require('../core/advanced/woongCanvas/shared/performance.js');
 require('../core/wrapper/MapControlWrapper.js');
@@ -347,6 +349,10 @@ function (_super) {
     }
   };
 
+  KakaoMintMapController.prototype.restoreMarkerZIndex = function (marker) {// Kakao Maps에서는 restoreMarkerZIndex 기능을 지원하지 않습니다.
+    // 이 기능은 Naver Maps에서만 사용 가능합니다.
+  };
+
   KakaoMintMapController.prototype.clearDrawable = function (drawable) {
     var _this = this;
 

package/dist/components/mint-map/naver/NaverMintMapController.d.ts

@@ -27,9 +27,12 @@ export declare class NaverMintMapController extends MintMapController {
     createMarker(marker: Marker): void;
     updateMarker(marker: Marker, options: MarkerOptions): void;
     private markerMaxZIndex;
+    private markerOriginalZIndex;
     private getMaxZIndex;
+    private getCurrentZIndex;
     setMarkerZIndex(marker: Marker, zIndex: number): void;
     markerToTheTop(marker: Marker): void;
+    restoreMarkerZIndex(marker: Marker): void;
     clearDrawable(drawable: Drawable): boolean;
     private dragged;
     isMapDragged(): boolean;

package/dist/components/mint-map/naver/NaverMintMapController.js

@@ -20,7 +20,9 @@ require('../core/util/geo.js');
 var polygon = require('../core/util/polygon.js');
 require('../core/advanced/canvas/CanvasMarkerClaude.js');
 require('../core/advanced/MapLoadingComponents.js');
-require('../core/advanced/woongCanvas/WoongKonvaMarker.js');
+require('konva');
+require('../core/advanced/woongCanvas/shared/types.js');
+require('../core/advanced/woongCanvas/shared/utils.js');
 require('../core/advanced/woongCanvas/shared/context.js');
 require('../core/advanced/woongCanvas/shared/performance.js');
 require('../core/wrapper/MapControlWrapper.js');
@@ -339,20 +341,54 @@ function (_super) {
     }
   };
 
-  NaverMintMapController.prototype.setMarkerZIndex = function (marker, zIndex) {
+  NaverMintMapController.prototype.getCurrentZIndex = function (marker) {
     if (this.map && marker.element && marker.element instanceof HTMLElement) {
       var parent_1 = marker.element.parentElement;
 
-      if (parent_1) {
-        parent_1.style.zIndex = String(zIndex);
+      if (parent_1 && parent_1.style.zIndex) {
+        var zIndex = Number(parent_1.style.zIndex);
+        return isNaN(zIndex) ? undefined : zIndex;
+      }
+    }
+
+    return undefined;
+  };
+
+  NaverMintMapController.prototype.setMarkerZIndex = function (marker, zIndex) {
+    if (this.map && marker.element && marker.element instanceof HTMLElement) {
+      var parent_2 = marker.element.parentElement;
+
+      if (parent_2) {
+        parent_2.style.zIndex = String(zIndex);
       }
     }
   };
 
   NaverMintMapController.prototype.markerToTheTop = function (marker) {
+    // 이미 최상위로 올라간 상태면 (원래 zIndex가 이미 저장됨) 중복 실행 방지
+    if (this.markerOriginalZIndex !== undefined) {
+      return;
+    }
+
+    var currentZIndex = this.getCurrentZIndex(marker); // undefined면 null로 저장 (원래 zIndex가 없었음을 표시)
+
+    this.markerOriginalZIndex = currentZIndex !== undefined ? currentZIndex : null;
     this.setMarkerZIndex(marker, this.getMaxZIndex(1));
   };
 
+  NaverMintMapController.prototype.restoreMarkerZIndex = function (marker) {
+    if (this.markerOriginalZIndex !== undefined) {
+      if (this.markerOriginalZIndex === null) {
+        // 원래 zIndex가 없었으면 제거 (또는 초기값 0으로)
+        this.setMarkerZIndex(marker, 0);
+      } else {
+        this.setMarkerZIndex(marker, this.markerOriginalZIndex);
+      }
+
+      this.markerOriginalZIndex = undefined;
+    }
+  };
+
   NaverMintMapController.prototype.clearDrawable = function (drawable) {
     var _a;