@mint-ui/map 1.2.0-test.14 → 1.2.0-test.16

package/dist/components/mint-map/core/advanced/woongCanvas/WoongCanvasLayer.d.ts

@@ -35,17 +35,15 @@ interface WoongCanvasLayerBaseProps<T> extends Pick<MarkerOptions, 'zIndex' | 'a
 /**
  * MARKER 타입 Props - 커스텀 렌더링 필수
  */
-interface WoongCanvasLayerPropsForMarker<T, C = any> extends WoongCanvasLayerBaseProps<T> {
+interface WoongCanvasLayerPropsForMarker<T> extends WoongCanvasLayerBaseProps<T> {
     /** 데이터 타입 */
     dataType: CanvasDataType.MARKER;
     /** Base Layer 렌더링 함수 (필수) */
-    renderBase: CustomRenderBase<T, C>;
+    renderBase: CustomRenderBase<T>;
     /** Animation Layer 렌더링 함수 (선택, 애니메이션용) */
-    renderAnimation?: CustomRenderAnimation<T, C>;
+    renderAnimation?: CustomRenderAnimation<T>;
     /** Event Layer 렌더링 함수 (선택) */
-    renderEvent?: CustomRenderEvent<T, C>;
-    /** 렌더링 설정 (색상, 표시 여부, 모양 등) */
-    renderConfig?: C;
+    renderEvent?: CustomRenderEvent<T>;
 }
 /**
  * POLYGON 타입 Props - 스타일 속성으로 내부 처리
@@ -80,11 +78,8 @@ interface WoongCanvasLayerPropsForPolygon<T> extends WoongCanvasLayerBaseProps<T
 }
 /**
  * 최종 Props 타입 - Discriminated Union
- *
- * @template T 데이터 타입
- * @template C 렌더링 설정 타입 (MARKER 모드에서만 사용)
  */
-export declare type WoongCanvasLayerProps<T, C = any> = WoongCanvasLayerPropsForMarker<T, C> | WoongCanvasLayerPropsForPolygon<T>;
+export declare type WoongCanvasLayerProps<T> = WoongCanvasLayerPropsForMarker<T> | WoongCanvasLayerPropsForPolygon<T>;
 /**
  * 🚀 WoongCanvasLayer - Konva 기반 초고성능 마커/폴리곤 렌더링 컴포넌트
  *
@@ -163,5 +158,5 @@ export declare type WoongCanvasLayerProps<T, C = any> = WoongCanvasLayerPropsFor
  *
  * @see {@link https://github.com/your-repo/docs/WoongCanvasLayer.md} 전체 문서
  */
-declare const WoongCanvasLayer: <T, C = any>(props: WoongCanvasLayerProps<T, C>) => React.ReactPortal;
+declare const WoongCanvasLayer: <T>(props: WoongCanvasLayerProps<T>) => React.ReactPortal;
 export default WoongCanvasLayer;

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

@@ -78,9 +78,6 @@ var WoongCanvasLayerComponent = function (props) {
   /** 상호작용 비활성화 상태 (Ref로 관리하여 클로저 문제 해결) */
 
   var disableInteractionRef = React.useRef(disableInteraction);
-  /** 렌더링 설정 (Ref로 관리하여 클로저 문제 해결) */
-
-  var renderConfigRef = React.useRef(dataType === types.CanvasDataType.MARKER ? props.renderConfig : undefined);
   /** 현재 Hover 중인 항목 */
 
   var hoveredItemRef = React.useRef(null);
@@ -383,8 +380,7 @@ var WoongCanvasLayerComponent = function (props) {
             ctx: ctx,
             items: visibleMarkers,
             selectedIds: selectedIdsRef.current,
-            utils: renderUtils,
-            config: renderConfigRef.current
+            utils: renderUtils
           });
         },
         perfectDrawEnabled: false,
@@ -414,8 +410,7 @@ var WoongCanvasLayerComponent = function (props) {
       layer: layer,
       selectedIds: selectedIdsRef.current,
       items: markersRef.current,
-      utils: renderUtils,
-      config: renderConfigRef.current
+      utils: renderUtils
     });
   };
   /**
@@ -456,8 +451,7 @@ var WoongCanvasLayerComponent = function (props) {
             hoveredItem: hoveredItemRef.current,
             utils: renderUtils,
             selectedItems: selectedItems,
-            selectedItem: selectedItemRef.current,
-            config: renderConfigRef.current
+            selectedItem: selectedItemRef.current
           });
         },
         perfectDrawEnabled: false,
@@ -969,18 +963,6 @@ var WoongCanvasLayerComponent = function (props) {
   React.useEffect(function () {
     disableInteractionRef.current = disableInteraction;
   }, [disableInteraction]); // --------------------------------------------------------------------------
-  // Lifecycle: renderConfig 동기화
-  // --------------------------------------------------------------------------
-
-  React.useEffect(function () {
-    if (dataType === types.CanvasDataType.MARKER) {
-      renderConfigRef.current = props.renderConfig; // config 변경 시 렌더링 업데이트
-
-      doRenderBase();
-      doRenderAnimation();
-      doRenderEvent();
-    }
-  }, [dataType === types.CanvasDataType.MARKER ? props.renderConfig : undefined]); // --------------------------------------------------------------------------
   // Lifecycle: 외부 selectedItems 동기화
   // --------------------------------------------------------------------------
 
@@ -1161,22 +1143,21 @@ var WoongCanvasLayerComponent = function (props) {
 
 
 var WoongCanvasLayer = React__default["default"].memo(WoongCanvasLayerComponent, function (prevProps, nextProps) {
-  // 1. data 비교
-  var prevData = prevProps.data;
-  var nextData = nextProps.data; // 참조가 같으면 스킵
-
-  if (prevData !== nextData) {
-    // 길이가 다르면 변경됨
-    if (prevData.length !== nextData.length) return false; // 각 데이터의 ID 비교
-
-    for (var i = 0; i < prevData.length; i++) {
-      if (prevData[i].id !== nextData[i].id) {
-        return false; // 변경됨 → 리렌더링
-      }
-    }
-  } // 2. selectedItems 비교 (참조만 비교)
-
-
+  // // 1. data 비교
+  // const prevData = prevProps.data;
+  // const nextData = nextProps.data;
+  // // 참조가 같으면 스킵
+  // if (prevData !== nextData) {
+  //   // 길이가 다르면 변경됨
+  //   if (prevData.length !== nextData.length) return false;
+  //   // 각 데이터의 ID 비교
+  //   for (let i = 0; i < prevData.length; i++) {
+  //     if (prevData[i].id !== nextData[i].id) {
+  //       return false;  // 변경됨 → 리렌더링
+  //     }
+  //   }
+  // }
+  // 2. selectedItems 비교 (참조만 비교)
   if (prevProps.selectedItems !== nextProps.selectedItems) {
     return false; // 변경됨 → 리렌더링
   }

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

@@ -30,7 +30,7 @@ export declare const drawPolygon: ({ ctx, polygonOffsets, isDonutPolygon, fillCo
  *   2
  * );
  */
-export declare const renderPolygonBase: <T = any>(baseFillColor: string, baseStrokeColor: string, baseLineWidth: number) => CustomRenderBase<KonvaCanvasData<T>, any>;
+export declare const renderPolygonBase: <T = any>(baseFillColor: string, baseStrokeColor: string, baseLineWidth: number) => CustomRenderBase<KonvaCanvasData<T>>;
 /**
  * 폴리곤 Event 렌더링 함수
  *
@@ -56,4 +56,4 @@ export declare const renderPolygonBase: <T = any>(baseFillColor: string, baseStr
  *   'rgba(100, 150, 255, 0.8)'
  * );
  */
-export declare const renderPolygonEvent: <T = any>(selectedFillColor: string, selectedStrokeColor: string, selectedLineWidth: number, activeFillColor?: string, activeStrokeColor?: string, activeLineWidth?: number, hoveredFillColor?: string, hoveredStrokeColor?: string, hoveredLineWidth?: number) => CustomRenderEvent<KonvaCanvasData<T>, any>;
+export declare const renderPolygonEvent: <T = any>(selectedFillColor: string, selectedStrokeColor: string, selectedLineWidth: number, activeFillColor?: string, activeStrokeColor?: string, activeLineWidth?: number, hoveredFillColor?: string, hoveredStrokeColor?: string, hoveredLineWidth?: number) => CustomRenderEvent<KonvaCanvasData<T>>;

package/dist/components/mint-map/core/advanced/woongCanvas/shared/types.d.ts

@@ -142,11 +142,8 @@ export interface RenderUtils<T> {
 }
 /**
  * 커스텀 렌더링 함수 파라미터 - Base Layer
- *
- * @template T 데이터 타입
- * @template C 설정(Config) 타입 (선택)
  */
-export interface RenderBaseParams<T, C = any> {
+export interface RenderBaseParams<T> {
     /** Canvas 2D 렌더링 컨텍스트 (순수 Canvas API) */
     ctx: CanvasRenderingContext2D;
     /** 렌더링할 마커 데이터 배열 */
@@ -155,56 +152,26 @@ export interface RenderBaseParams<T, C = any> {
     selectedIds: Set<string>;
     /** 렌더링 유틸리티 함수들 */
     utils: RenderUtils<T>;
-    /** 렌더링 설정 (색상, 표시 여부, 모양 등) */
-    config?: C;
 }
 /**
  * 커스텀 렌더링 함수 타입 - Base Layer
  *
  * 🔥 순수 Canvas API 사용 (Konva 지식 불필요!)
  *
- * @template T 데이터 타입
- * @template C 설정(Config) 타입 - 렌더링 옵션 (색상, 표시 여부, 모양 등)
- *
  * @example
- * // 기본 사용 (config 없이)
- * const renderBase: CustomRenderBase<Marker> = ({ ctx, items, selectedIds, utils }) => {
+ * const renderBase = ({ ctx, items, selectedIds, utils }) => {
  *   for (const item of items) {
  *     if (selectedIds.has(item.id)) continue;
  *     const pos = utils.getOrComputeMarkerOffset(item);
- *     ctx.fillRect(pos.x, pos.y, 50, 50);
- *   }
- * };
- *
- * @example
- * // config 사용
- * interface MarkerRenderConfig {
- *   showLabel: boolean;
- *   color: string;
- *   shape: 'circle' | 'square';
- * }
- *
- * const renderBase: CustomRenderBase<Marker, MarkerRenderConfig> = ({ ctx, items, config, utils }) => {
- *   for (const item of items) {
- *     const pos = utils.getOrComputeMarkerOffset(item);
- *     ctx.fillStyle = config?.color || 'blue';
- *     if (config?.shape === 'circle') {
- *       ctx.arc(pos.x, pos.y, 10, 0, Math.PI * 2);
- *     } else {
- *       ctx.fillRect(pos.x, pos.y, 20, 20);
- *     }
- *     ctx.fill();
+ *     ctx.fillRect(pos.x, pos.y, 50, 50); // 순수 Canvas API!
  *   }
  * };
  */
-export declare type CustomRenderBase<T, C = any> = (params: RenderBaseParams<T, C>) => void;
+export declare type CustomRenderBase<T> = (params: RenderBaseParams<T>) => void;
 /**
  * 커스텀 렌더링 함수 파라미터 - Animation Layer
- *
- * @template T 데이터 타입
- * @template C 설정(Config) 타입 (선택)
  */
-export interface RenderAnimationParams<T, C = any> {
+export interface RenderAnimationParams<T> {
     /** Konva Layer 인스턴스 */
     layer: Konva.Layer;
     /** 현재 선택된 마커 ID Set */
@@ -213,35 +180,23 @@ export interface RenderAnimationParams<T, C = any> {
     items: KonvaCanvasData<T>[];
     /** 렌더링 유틸리티 함수들 */
     utils: RenderUtils<T>;
-    /** 렌더링 설정 (애니메이션 속도, 효과 등) */
-    config?: C;
 }
 /**
  * 커스텀 렌더링 함수 타입 - Animation Layer (선택)
  *
- * @template T 데이터 타입
- * @template C 설정(Config) 타입 - 애니메이션 옵션
- *
  * @example
- * // config 사용
- * interface AnimationConfig {
- *   speed: number;
- *   bounceHeight: number;
- * }
- *
- * const renderAnimation: CustomRenderAnimation<Marker, AnimationConfig> = ({ layer, selectedIds, items, config, utils }) => {
- *   const bounceHeight = config?.bounceHeight || 15;
- *   // Konva 애니메이션 구현
+ * const renderAnimation = ({ layer, selectedIds, items, utils }) => {
+ *   for (const id of selectedIds) {
+ *     const item = items.find(i => i.id === id);
+ *     // Konva 애니메이션 구현
+ *   }
  * };
  */
-export declare type CustomRenderAnimation<T, C = any> = (params: RenderAnimationParams<T, C>) => void;
+export declare type CustomRenderAnimation<T> = (params: RenderAnimationParams<T>) => void;
 /**
  * 커스텀 렌더링 함수 파라미터 - Event Layer
- *
- * @template T 데이터 타입
- * @template C 설정(Config) 타입 (선택)
  */
-export interface RenderEventParams<T, C = any> {
+export interface RenderEventParams<T> {
     /** Canvas 2D 렌더링 컨텍스트 (순수 Canvas API) */
     ctx: CanvasRenderingContext2D;
     /** 현재 hover된 마커 데이터 */
@@ -252,30 +207,19 @@ export interface RenderEventParams<T, C = any> {
     selectedItems?: KonvaCanvasData<T>[];
     /** 외부에서 전달된 단일 선택 아이템 (특별한 효과용) */
     selectedItem?: KonvaCanvasData<T> | null;
-    /** 렌더링 설정 (hover 색상, 선택 효과 등) */
-    config?: C;
 }
 /**
  * 커스텀 렌더링 함수 타입 - Event Layer
  *
  * 🔥 순수 Canvas API 사용 (Konva 지식 불필요!)
  *
- * @template T 데이터 타입
- * @template C 설정(Config) 타입 - 이벤트 렌더링 옵션
- *
  * @example
- * // config 사용
- * interface EventRenderConfig {
- *   hoverColor: string;
- *   selectedColor: string;
- * }
- *
- * const renderEvent: CustomRenderEvent<Marker, EventRenderConfig> = ({ ctx, hoveredItem, config, utils }) => {
+ * const renderEvent = ({ ctx, hoveredItem, utils, selectedItems }) => {
  *   if (hoveredItem) {
  *     const pos = utils.getOrComputeMarkerOffset(hoveredItem);
- *     ctx.fillStyle = config?.hoverColor || 'red';
- *     ctx.fillRect(pos.x, pos.y, 50, 50);
+ *     ctx.fillStyle = 'red';
+ *     ctx.fillRect(pos.x, pos.y, 50, 50); // 순수 Canvas API!
  *   }
  * };
  */
-export declare type CustomRenderEvent<T, C = any> = (params: RenderEventParams<T, C>) => void;
+export declare type CustomRenderEvent<T> = (params: RenderEventParams<T>) => void;

package/dist/index.es.js

@@ -5690,9 +5690,6 @@ var WoongCanvasLayerComponent = function (props) {
   /** 상호작용 비활성화 상태 (Ref로 관리하여 클로저 문제 해결) */
 
   var disableInteractionRef = useRef(disableInteraction);
-  /** 렌더링 설정 (Ref로 관리하여 클로저 문제 해결) */
-
-  var renderConfigRef = useRef(dataType === CanvasDataType.MARKER ? props.renderConfig : undefined);
   /** 현재 Hover 중인 항목 */
 
   var hoveredItemRef = useRef(null);
@@ -5995,8 +5992,7 @@ var WoongCanvasLayerComponent = function (props) {
             ctx: ctx,
             items: visibleMarkers,
             selectedIds: selectedIdsRef.current,
-            utils: renderUtils,
-            config: renderConfigRef.current
+            utils: renderUtils
           });
         },
         perfectDrawEnabled: false,
@@ -6026,8 +6022,7 @@ var WoongCanvasLayerComponent = function (props) {
       layer: layer,
       selectedIds: selectedIdsRef.current,
       items: markersRef.current,
-      utils: renderUtils,
-      config: renderConfigRef.current
+      utils: renderUtils
     });
   };
   /**
@@ -6068,8 +6063,7 @@ var WoongCanvasLayerComponent = function (props) {
             hoveredItem: hoveredItemRef.current,
             utils: renderUtils,
             selectedItems: selectedItems,
-            selectedItem: selectedItemRef.current,
-            config: renderConfigRef.current
+            selectedItem: selectedItemRef.current
           });
         },
         perfectDrawEnabled: false,
@@ -6581,18 +6575,6 @@ var WoongCanvasLayerComponent = function (props) {
   useEffect(function () {
     disableInteractionRef.current = disableInteraction;
   }, [disableInteraction]); // --------------------------------------------------------------------------
-  // Lifecycle: renderConfig 동기화
-  // --------------------------------------------------------------------------
-
-  useEffect(function () {
-    if (dataType === CanvasDataType.MARKER) {
-      renderConfigRef.current = props.renderConfig; // config 변경 시 렌더링 업데이트
-
-      doRenderBase();
-      doRenderAnimation();
-      doRenderEvent();
-    }
-  }, [dataType === CanvasDataType.MARKER ? props.renderConfig : undefined]); // --------------------------------------------------------------------------
   // Lifecycle: 외부 selectedItems 동기화
   // --------------------------------------------------------------------------
 
@@ -6773,22 +6755,21 @@ var WoongCanvasLayerComponent = function (props) {
 
 
 var WoongCanvasLayer = React.memo(WoongCanvasLayerComponent, function (prevProps, nextProps) {
-  // 1. data 비교
-  var prevData = prevProps.data;
-  var nextData = nextProps.data; // 참조가 같으면 스킵
-
-  if (prevData !== nextData) {
-    // 길이가 다르면 변경됨
-    if (prevData.length !== nextData.length) return false; // 각 데이터의 ID 비교
-
-    for (var i = 0; i < prevData.length; i++) {
-      if (prevData[i].id !== nextData[i].id) {
-        return false; // 변경됨 → 리렌더링
-      }
-    }
-  } // 2. selectedItems 비교 (참조만 비교)
-
-
+  // // 1. data 비교
+  // const prevData = prevProps.data;
+  // const nextData = nextProps.data;
+  // // 참조가 같으면 스킵
+  // if (prevData !== nextData) {
+  //   // 길이가 다르면 변경됨
+  //   if (prevData.length !== nextData.length) return false;
+  //   // 각 데이터의 ID 비교
+  //   for (let i = 0; i < prevData.length; i++) {
+  //     if (prevData[i].id !== nextData[i].id) {
+  //       return false;  // 변경됨 → 리렌더링
+  //     }
+  //   }
+  // }
+  // 2. selectedItems 비교 (참조만 비교)
   if (prevProps.selectedItems !== nextProps.selectedItems) {
     return false; // 변경됨 → 리렌더링
   }

package/dist/index.umd.js

@@ -5694,9 +5694,6 @@
     /** 상호작용 비활성화 상태 (Ref로 관리하여 클로저 문제 해결) */
 
     var disableInteractionRef = React.useRef(disableInteraction);
-    /** 렌더링 설정 (Ref로 관리하여 클로저 문제 해결) */
-
-    var renderConfigRef = React.useRef(dataType === exports.CanvasDataType.MARKER ? props.renderConfig : undefined);
     /** 현재 Hover 중인 항목 */
 
     var hoveredItemRef = React.useRef(null);
@@ -5999,8 +5996,7 @@
               ctx: ctx,
               items: visibleMarkers,
               selectedIds: selectedIdsRef.current,
-              utils: renderUtils,
-              config: renderConfigRef.current
+              utils: renderUtils
             });
           },
           perfectDrawEnabled: false,
@@ -6030,8 +6026,7 @@
         layer: layer,
         selectedIds: selectedIdsRef.current,
         items: markersRef.current,
-        utils: renderUtils,
-        config: renderConfigRef.current
+        utils: renderUtils
       });
     };
     /**
@@ -6072,8 +6067,7 @@
               hoveredItem: hoveredItemRef.current,
               utils: renderUtils,
               selectedItems: selectedItems,
-              selectedItem: selectedItemRef.current,
-              config: renderConfigRef.current
+              selectedItem: selectedItemRef.current
             });
           },
           perfectDrawEnabled: false,
@@ -6585,18 +6579,6 @@
     React.useEffect(function () {
       disableInteractionRef.current = disableInteraction;
     }, [disableInteraction]); // --------------------------------------------------------------------------
-    // Lifecycle: renderConfig 동기화
-    // --------------------------------------------------------------------------
-
-    React.useEffect(function () {
-      if (dataType === exports.CanvasDataType.MARKER) {
-        renderConfigRef.current = props.renderConfig; // config 변경 시 렌더링 업데이트
-
-        doRenderBase();
-        doRenderAnimation();
-        doRenderEvent();
-      }
-    }, [dataType === exports.CanvasDataType.MARKER ? props.renderConfig : undefined]); // --------------------------------------------------------------------------
     // Lifecycle: 외부 selectedItems 동기화
     // --------------------------------------------------------------------------
 
@@ -6777,22 +6759,21 @@
 
 
   var WoongCanvasLayer = React__default["default"].memo(WoongCanvasLayerComponent, function (prevProps, nextProps) {
-    // 1. data 비교
-    var prevData = prevProps.data;
-    var nextData = nextProps.data; // 참조가 같으면 스킵
-
-    if (prevData !== nextData) {
-      // 길이가 다르면 변경됨
-      if (prevData.length !== nextData.length) return false; // 각 데이터의 ID 비교
-
-      for (var i = 0; i < prevData.length; i++) {
-        if (prevData[i].id !== nextData[i].id) {
-          return false; // 변경됨 → 리렌더링
-        }
-      }
-    } // 2. selectedItems 비교 (참조만 비교)
-
-
+    // // 1. data 비교
+    // const prevData = prevProps.data;
+    // const nextData = nextProps.data;
+    // // 참조가 같으면 스킵
+    // if (prevData !== nextData) {
+    //   // 길이가 다르면 변경됨
+    //   if (prevData.length !== nextData.length) return false;
+    //   // 각 데이터의 ID 비교
+    //   for (let i = 0; i < prevData.length; i++) {
+    //     if (prevData[i].id !== nextData[i].id) {
+    //       return false;  // 변경됨 → 리렌더링
+    //     }
+    //   }
+    // }
+    // 2. selectedItems 비교 (참조만 비교)
     if (prevProps.selectedItems !== nextProps.selectedItems) {
       return false; // 변경됨 → 리렌더링
     }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mint-ui/map",
-  "version": "1.2.0-test.14",
+  "version": "1.2.0-test.16",
   "main": "./dist/index.js",
   "module": "./dist/index.es.js",
   "browser": "./dist/index.umd.js",