@mint-ui/map 1.2.0-test.53 → 1.2.0-test.54

package/dist/components/mint-map/core/advanced/CanvasPolygonLayer/CanvasPolygonLayer.js

@@ -3,26 +3,26 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var tslib = require('tslib');
-var React = require('react');
 var Konva = require('konva');
-var MintMapProvider = require('../../provider/MintMapProvider.js');
+var React = require('react');
+var reactDom = require('react-dom');
+var renderer = require('./renderer.js');
 var MapDrawables = require('../../../types/MapDrawables.js');
 require('../../../types/MapTypes.js');
 require('../../../types/MapEventTypes.js');
-var reactDom = require('react-dom');
-require('../shared/types.js');
-var utils = require('../shared/utils.js');
+var MintMapProvider = require('../../provider/MintMapProvider.js');
 var context = require('../shared/context.js');
+var helpers = require('../shared/helpers.js');
+var hooks = require('../shared/hooks.js');
 var performance = require('../shared/performance.js');
+require('../shared/types.js');
+var utils = require('../shared/utils.js');
 var viewport = require('../shared/viewport.js');
-var hooks = require('../shared/hooks.js');
-var helpers = require('../shared/helpers.js');
-var renderer = require('./renderer.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
-var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var Konva__default = /*#__PURE__*/_interopDefaultLegacy(Konva);
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
 var CanvasPolygonLayer = function (props) {
   var data = props.data,
@@ -47,8 +47,8 @@ var CanvasPolygonLayer = function (props) {
   var isIndividualMode = !isCustomStyleMode && !isObjectMode; // 각 방식별 props 추출
 
   var customStyleProps = isCustomStyleMode ? props : undefined;
-  var objectProps = isObjectMode ? props : undefined;
-  var individualProps = isIndividualMode ? props : undefined; // --------------------------------------------------------------------------
+  var individualProps = isIndividualMode ? props : undefined;
+  var objectProps = isObjectMode ? props : undefined; // --------------------------------------------------------------------------
   // Hooks & Context
   // --------------------------------------------------------------------------
 
@@ -85,17 +85,7 @@ var CanvasPolygonLayer = function (props) {
   var offsetCacheRef = React.useRef(new performance.LRUCache(maxCacheSize));
   var spatialIndexRef = React.useRef(new performance.SpatialHashGrid(performance.SPATIAL_GRID_CELL_SIZE));
   var boundingBoxCacheRef = React.useRef(new Map());
-  var viewportRef = React.useRef(null); // 뷰포트 영역 계산 (Viewport Culling용)
-
-  var updateViewport = function () {
-    viewport.updateViewport(stageRef.current, cullingMargin, viewportRef);
-  }; // 뷰포트 내부 여부 확인 (바운딩 박스 캐싱)
-
-
-  var isInViewport = function (item) {
-    return viewport.isInViewport(item, viewportRef, boundingBoxCacheRef, computeBoundingBox);
-  }; // 폴리곤 좌표 변환 (위경도 → 화면 좌표, LRU 캐시 사용)
-
+  var viewportRef = React.useRef(null); // 폴리곤 좌표 변환 (위경도 → 화면 좌표, LRU 캐시 사용)
 
   var getOrComputePolygonOffsets = function (polygonData) {
     var cached = offsetCacheRef.current.get(polygonData.id);
@@ -111,10 +101,10 @@ var CanvasPolygonLayer = function (props) {
     var offsets = getOrComputePolygonOffsets(item);
     if (!offsets) return null; // 모든 좌표를 순회하며 최소/최대값 찾기
 
-    var minX = Infinity,
-        minY = Infinity,
-        maxX = -Infinity,
-        maxY = -Infinity;
+    var maxX = -Infinity;
+    var maxY = -Infinity;
+    var minX = Infinity;
+    var minY = Infinity;
 
     for (var _i = 0, offsets_1 = offsets; _i < offsets_1.length; _i++) {
       var multiPolygon = offsets_1[_i];
@@ -135,11 +125,21 @@ var CanvasPolygonLayer = function (props) {
     }
 
     return {
-      minX: minX,
-      minY: minY,
       maxX: maxX,
-      maxY: maxY
+      maxY: maxY,
+      minX: minX,
+      minY: minY
     };
+  }; // 뷰포트 영역 계산 (Viewport Culling용)
+
+
+  var updateViewport = function () {
+    viewport.updateViewport(stageRef.current, cullingMargin, viewportRef);
+  }; // 뷰포트 내부 여부 확인 (바운딩 박스 캐싱)
+
+
+  var isInViewport = function (item) {
+    return viewport.isInViewport(item, viewportRef, boundingBoxCacheRef, computeBoundingBox);
   }; // 공간 인덱스 빌드 (빠른 Hit Test용)
 
 
@@ -149,18 +149,28 @@ var CanvasPolygonLayer = function (props) {
 
 
   var renderUtils = {
-    getOrComputePolygonOffsets: getOrComputePolygonOffsets,
     getOrComputeMarkerOffset: function () {
       return null;
-    }
+    },
+    getOrComputePolygonOffsets: getOrComputePolygonOffsets
   }; // 렌더링 함수 생성 (스타일 지정 방식에 따라 분기)
 
-  var renderBase = isCustomStyleMode && customStyleProps ? renderer.renderPolygonBaseWithCustomStyle(customStyleProps.customStyle) : isObjectMode && objectProps ? renderer.renderPolygonBaseWithObject(objectProps.renderStyle) : isIndividualMode && individualProps ? renderer.renderPolygonBase(individualProps.baseFillColor, individualProps.baseStrokeColor, individualProps.baseLineWidth) : function () {
-    throw new Error('Invalid props: one of customStyle, renderStyle, or individual style props must be provided');
-  }();
-  var renderEvent = isCustomStyleMode && customStyleProps ? renderer.renderPolygonEventWithCustomStyle(customStyleProps.customStyle) : isObjectMode && objectProps ? renderer.renderPolygonEventWithObject(objectProps.renderStyle) : isIndividualMode && individualProps ? renderer.renderPolygonEvent(individualProps.baseFillColor, individualProps.baseStrokeColor, individualProps.baseLineWidth, individualProps.selectedFillColor, individualProps.selectedStrokeColor, individualProps.selectedLineWidth, individualProps.activeFillColor, individualProps.activeStrokeColor, individualProps.activeLineWidth, individualProps.hoveredFillColor, individualProps.hoveredStrokeColor, individualProps.hoveredLineWidth) : function () {
+  var renderBase;
+  var renderEvent;
+
+  if (isCustomStyleMode && customStyleProps) {
+    renderBase = renderer.renderPolygonBaseWithCustomStyle(customStyleProps.customStyle);
+    renderEvent = renderer.renderPolygonEventWithCustomStyle(customStyleProps.customStyle);
+  } else if (isObjectMode && objectProps) {
+    renderBase = renderer.renderPolygonBaseWithObject(objectProps.renderStyle);
+    renderEvent = renderer.renderPolygonEventWithObject(objectProps.renderStyle);
+  } else if (isIndividualMode && individualProps) {
+    renderBase = renderer.renderPolygonBase(individualProps.baseFillColor, individualProps.baseStrokeColor, individualProps.baseLineWidth);
+    renderEvent = renderer.renderPolygonEvent(individualProps.baseFillColor, individualProps.baseStrokeColor, individualProps.baseLineWidth, individualProps.selectedFillColor, individualProps.selectedStrokeColor, individualProps.selectedLineWidth, individualProps.activeFillColor, individualProps.activeStrokeColor, individualProps.activeLineWidth, individualProps.hoveredFillColor, individualProps.hoveredStrokeColor, individualProps.hoveredLineWidth);
+  } else {
     throw new Error('Invalid props: one of customStyle, renderStyle, or individual style props must be provided');
-  }(); // Base Layer 렌더링 (뷰포트 컬링 적용)
+  } // Base Layer 렌더링 (뷰포트 컬링 적용)
+
 
   var doRenderBase = function () {
     var layer = baseLayerRef.current;
@@ -169,9 +179,12 @@ var CanvasPolygonLayer = function (props) {
 
     if (!shape) {
       shape = new Konva__default["default"].Shape({
+        hitStrokeWidth: 0,
+        listening: false,
         name: 'base-render-shape',
-        sceneFunc: function (context, shape) {
-          var ctx = context;
+        perfectDrawEnabled: false,
+        sceneFunc: function (konvaContext) {
+          var ctx = konvaContext;
           var hovered = hoveredItemRef.current; // 뷰포트 컬링: 화면에 보이는 항목만 필터링
 
           var visibleItems = enableViewportCullingRef.current ? dataRef.current.filter(function (item) {
@@ -179,15 +192,12 @@ var CanvasPolygonLayer = function (props) {
           }) : dataRef.current;
           renderBase({
             ctx: ctx,
+            hoveredItem: hovered,
             items: visibleItems,
             selectedIds: selectedIdsRef.current,
-            hoveredItem: hovered,
             utils: renderUtils
           });
-        },
-        perfectDrawEnabled: false,
-        listening: false,
-        hitStrokeWidth: 0
+        }
       });
       layer.add(shape);
     }
@@ -203,22 +213,22 @@ var CanvasPolygonLayer = function (props) {
 
     if (!shape) {
       shape = new Konva__default["default"].Shape({
+        hitStrokeWidth: 0,
+        listening: false,
         name: 'event-render-shape',
-        sceneFunc: function (context, shape) {
-          var ctx = context;
-          var selectedItems = helpers.mapValuesToArray(selectedItemsMapRef.current);
+        perfectDrawEnabled: false,
+        sceneFunc: function (konvaContext) {
+          var ctx = konvaContext;
           var hovered = hoveredItemRef.current;
+          var selectedItems = helpers.mapValuesToArray(selectedItemsMapRef.current);
           renderEvent({
             ctx: ctx,
             hoveredItem: hovered,
-            utils: renderUtils,
+            selectedItem: selectedItemRef.current,
             selectedItems: selectedItems,
-            selectedItem: selectedItemRef.current
+            utils: renderUtils
           });
-        },
-        perfectDrawEnabled: false,
-        listening: false,
-        hitStrokeWidth: 0
+        }
       });
       layer.add(shape);
     }
@@ -239,14 +249,14 @@ var CanvasPolygonLayer = function (props) {
 
 
   var _f = hooks.createMapEventHandlers({
-    controller: controller,
+    accumTranslateRef: accumTranslateRef,
+    boundingBoxCacheRef: boundingBoxCacheRef,
     containerRef: containerRef,
+    controller: controller,
     markerRef: markerRef,
+    offsetCacheRef: offsetCacheRef,
     options: options,
     prevCenterOffsetRef: prevCenterOffsetRef,
-    accumTranslateRef: accumTranslateRef,
-    offsetCacheRef: offsetCacheRef,
-    boundingBoxCacheRef: boundingBoxCacheRef,
     renderAllImmediate: renderAllImmediate
   }),
       handleIdle = _f.handleIdle,
@@ -289,44 +299,44 @@ var CanvasPolygonLayer = function (props) {
   }; // Hover 상태 설정 및 렌더링
 
 
-  var setHovered = function (data) {
+  var setHovered = function (hoveredData) {
     // 드래그 중에는 hover 상태 변경을 무시하고 드래그 시작 시점의 상태 유지
     if (draggingRef.current) {
       return;
     }
 
-    hoveredItemRef.current = data;
+    hoveredItemRef.current = hoveredData;
 
     if (draggingRef.current) {
       controller.setMapCursor('grabbing');
     } else {
-      controller.setMapCursor(data ? 'pointer' : 'grab');
+      controller.setMapCursor(hoveredData ? 'pointer' : 'grab');
     }
 
     doRenderEvent();
   }; // 클릭 처리: 선택 상태 업데이트
 
 
-  var handleLocalClick = function (data) {
+  var handleLocalClick = function (clickedData) {
     if (enableMultiSelect) {
       var newSelected = new Set(selectedIdsRef.current);
 
-      if (newSelected.has(data.id)) {
-        newSelected.delete(data.id);
-        selectedItemsMapRef.current.delete(data.id);
+      if (newSelected.has(clickedData.id)) {
+        newSelected.delete(clickedData.id);
+        selectedItemsMapRef.current.delete(clickedData.id);
       } else {
-        newSelected.add(data.id);
-        selectedItemsMapRef.current.set(data.id, data);
+        newSelected.add(clickedData.id);
+        selectedItemsMapRef.current.set(clickedData.id, clickedData);
       }
 
       selectedIdsRef.current = newSelected;
     } else {
       var newSelected = new Set();
 
-      if (!selectedIdsRef.current.has(data.id)) {
-        newSelected.add(data.id);
+      if (!selectedIdsRef.current.has(clickedData.id)) {
+        newSelected.add(clickedData.id);
         selectedItemsMapRef.current.clear();
-        selectedItemsMapRef.current.set(data.id, data);
+        selectedItemsMapRef.current.set(clickedData.id, clickedData);
       } else {
         selectedItemsMapRef.current.clear();
       }
@@ -344,10 +354,10 @@ var CanvasPolygonLayer = function (props) {
     if (disableInteractionRef.current) return;
     var clickedOffset = helpers.validateEvent(event, context$1, controller);
     if (!clickedOffset) return;
-    var data = findData(clickedOffset);
-    if (!data) return;
-    handleLocalClick(data);
-    onClick === null || onClick === void 0 ? void 0 : onClick(data, selectedIdsRef.current);
+    var clickedData = findData(clickedOffset);
+    if (!clickedData) return;
+    handleLocalClick(clickedData);
+    onClick === null || onClick === void 0 ? void 0 : onClick(clickedData, selectedIdsRef.current);
   }; // 마우스 이동 이벤트 핸들러 (hover 감지)
 
 
@@ -413,8 +423,8 @@ var CanvasPolygonLayer = function (props) {
     var mapDiv = controller.mapDivElement;
     var stage = new Konva__default["default"].Stage({
       container: containerRef.current,
-      width: mapDiv.offsetWidth,
-      height: mapDiv.offsetHeight
+      height: mapDiv.offsetHeight,
+      width: mapDiv.offsetWidth
     });
     stageRef.current = stage;
     var baseLayer = new Konva__default["default"].Layer({
@@ -469,20 +479,20 @@ var CanvasPolygonLayer = function (props) {
 
     if (context$1) {
       componentInstance = {
-        zIndex: currentZIndex,
-        hitTest: function (offset) {
-          return findData(offset) !== null;
-        },
-        onClick: onClick,
         findData: findData,
-        setHovered: setHovered,
-        handleLocalClick: handleLocalClick,
         getSelectedIds: function () {
           return selectedIdsRef.current;
         },
+        handleLocalClick: handleLocalClick,
+        hitTest: function (offset) {
+          return findData(offset) !== null;
+        },
         isInteractionDisabled: function () {
           return disableInteractionRef.current;
-        }
+        },
+        onClick: onClick,
+        setHovered: setHovered,
+        zIndex: currentZIndex
       };
       context$1.registerComponent(componentInstance);
     }
@@ -583,9 +593,9 @@ var CanvasPolygonLayer = function (props) {
   return reactDom.createPortal(React__default["default"].createElement("div", {
     ref: containerRef,
     style: {
+      height: '100%',
       position: 'absolute',
-      width: '100%',
-      height: '100%'
+      width: '100%'
     }
   }), divElement);
 };

package/dist/components/mint-map/core/advanced/CanvasPolygonLayer/index.d.ts

@@ -1,3 +1,3 @@
-export { default as CanvasPolygonLayer } from "./CanvasPolygonLayer";
-export * from "./CanvasPolygonLayer";
-export * from "../shared";
+export * from '../shared';
+export * from './CanvasPolygonLayer';
+export { default as CanvasPolygonLayer } from './CanvasPolygonLayer';

package/dist/components/mint-map/core/advanced/CanvasPolygonLayer/renderer.d.ts

@@ -9,8 +9,8 @@
  * 2. 객체 방식: renderPolygonBaseWithObject, renderPolygonEventWithObject
  * 3. 함수 방식: renderPolygonBaseWithCustomStyle, renderPolygonEventWithCustomStyle
  */
-import { CustomRenderBase, CustomRenderEvent } from "../shared/types";
-import type { PolygonStyleObject, PolygonStyleCustomizer } from "./CanvasPolygonLayer";
+import type { PolygonStyleCustomizer, PolygonStyleObject } from './CanvasPolygonLayer';
+import { CustomRenderBase, CustomRenderEvent } from '../shared/types';
 /**
  * 폴리곤 그리기 파라미터 인터페이스
  */
@@ -55,7 +55,7 @@ interface DrawPolygonParams {
  * });
  * ```
  */
-export declare const drawPolygon: ({ ctx, polygonOffsets, isDonutPolygon, fillColor, strokeColor, lineWidth }: DrawPolygonParams) => void;
+export declare const drawPolygon: ({ ctx, fillColor, isDonutPolygon, lineWidth, polygonOffsets, strokeColor }: DrawPolygonParams) => void;
 /**
  * 폴리곤 Base 렌더링 함수 팩토리
  *
@@ -82,7 +82,7 @@ export declare const drawPolygon: ({ ctx, polygonOffsets, isDonutPolygon, fillCo
  * );
  * ```
  */
-export declare const renderPolygonBase: <T = any>(baseFillColor: string, baseStrokeColor: string, baseLineWidth: number) => CustomRenderBase<T>;
+export declare const renderPolygonBase: <T = unknown>(baseFillColor: string, baseStrokeColor: string, baseLineWidth: number) => CustomRenderBase<T>;
 /**
  * 폴리곤 Event 렌더링 함수 팩토리
  *
@@ -122,7 +122,7 @@ export declare const renderPolygonBase: <T = any>(baseFillColor: string, baseStr
  * );
  * ```
  */
-export declare const renderPolygonEvent: <T = any>(baseFillColor: string, baseStrokeColor: string, baseLineWidth: number, selectedFillColor?: string, selectedStrokeColor?: string, selectedLineWidth?: number, activeFillColor?: string, activeStrokeColor?: string, activeLineWidth?: number, hoveredFillColor?: string, hoveredStrokeColor?: string, hoveredLineWidth?: number) => CustomRenderEvent<T>;
+export declare const renderPolygonEvent: <T = unknown>(baseFillColor: string, baseStrokeColor: string, baseLineWidth: number, selectedFillColor: string | undefined, selectedStrokeColor: string | undefined, selectedLineWidth: number | undefined, activeFillColor: string | undefined, activeStrokeColor: string | undefined, activeLineWidth: number | undefined, hoveredFillColor: string | undefined, hoveredStrokeColor: string | undefined, hoveredLineWidth: number | undefined) => CustomRenderEvent<T>;
 /**
  * 폴리곤 Base 렌더링 함수 팩토리 (객체 방식)
  *
@@ -145,7 +145,7 @@ export declare const renderPolygonEvent: <T = any>(baseFillColor: string, baseSt
  * });
  * ```
  */
-export declare const renderPolygonBaseWithObject: <T = any>(renderStyle: PolygonStyleObject) => CustomRenderBase<T>;
+export declare const renderPolygonBaseWithObject: <T = unknown>(renderStyle: PolygonStyleObject) => CustomRenderBase<T>;
 /**
  * 폴리곤 Event 렌더링 함수 팩토리 (객체 방식)
  *
@@ -176,7 +176,7 @@ export declare const renderPolygonBaseWithObject: <T = any>(renderStyle: Polygon
  * });
  * ```
  */
-export declare const renderPolygonEventWithObject: <T = any>(renderStyle: PolygonStyleObject) => CustomRenderEvent<T>;
+export declare const renderPolygonEventWithObject: <T = unknown>(renderStyle: PolygonStyleObject) => CustomRenderEvent<T>;
 /**
  * 폴리곤 Base 렌더링 함수 팩토리 (커스터마이징 방식)
  *
@@ -204,7 +204,7 @@ export declare const renderPolygonEventWithObject: <T = any>(renderStyle: Polygo
  * );
  * ```
  */
-export declare const renderPolygonBaseWithCustomStyle: <T = any>(customStyle: PolygonStyleCustomizer<T>) => CustomRenderBase<T>;
+export declare const renderPolygonBaseWithCustomStyle: <T = unknown>(customStyle: PolygonStyleCustomizer<T>) => CustomRenderBase<T>;
 /**
  * 폴리곤 Event 렌더링 함수 팩토리 (커스터마이징 방식)
  *
@@ -238,5 +238,5 @@ export declare const renderPolygonBaseWithCustomStyle: <T = any>(customStyle: Po
  * );
  * ```
  */
-export declare const renderPolygonEventWithCustomStyle: <T = any>(customStyle: PolygonStyleCustomizer<T>) => CustomRenderEvent<T>;
+export declare const renderPolygonEventWithCustomStyle: <T = unknown>(customStyle: PolygonStyleCustomizer<T>) => CustomRenderEvent<T>;
 export {};