@mint-ui/map 0.7.3-beta → 0.7.5-beta

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -23,6 +23,17 @@ var DEFAULT_CENTER = {
23
23
  lat: 37.5036845,
24
24
  lng: 127.0448698
25
25
  };
26
+ var DEFAULT_ZOOM_LEVEL = 12;
27
+ var DEFAULT_MAP_BASE_CONFIG = {
28
+ center: DEFAULT_CENTER,
29
+ zoomLevel: DEFAULT_ZOOM_LEVEL
30
+ };
31
+
32
+ function makeBaseProps(base) {
33
+ !base.center && (base.center = DEFAULT_CENTER);
34
+ !base.zoomLevel && (base.zoomLevel = DEFAULT_ZOOM_LEVEL);
35
+ return base;
36
+ }
26
37
  /**
27
38
  * Mint Map 컴포넌트
28
39
  *
@@ -31,24 +42,22 @@ var DEFAULT_CENTER = {
31
42
  * @returns {JSX.Element} JSX
32
43
  */
33
44
 
45
+
34
46
  function MintMap(_a) {
35
47
  var mapLoadingComponent = _a.mapLoadingComponent,
36
48
  _b = _a.dissolveEffectWhenLoaded,
37
49
  dissolveEffectWhenLoaded = _b === void 0 ? true : _b,
38
50
  mapType = _a.mapType,
39
51
  children = _a.children,
40
- _c = _a.base,
41
- base = _c === void 0 ? {
42
- center: DEFAULT_CENTER,
43
- zoomLevel: 12
44
- } : _c,
52
+ base = _a.base,
45
53
  props = tslib.__rest(_a, ["mapLoadingComponent", "dissolveEffectWhenLoaded", "mapType", "children", "base"]);
46
54
 
55
+ var mapBaseConfig = base ? makeBaseProps(base) : DEFAULT_MAP_BASE_CONFIG;
47
56
  var loadingRef = React.useRef(null);
48
57
 
49
- var _d = React.useState(),
50
- controller = _d[0],
51
- setController = _d[1];
58
+ var _c = React.useState(),
59
+ controller = _c[0],
60
+ setController = _c[1];
52
61
 
53
62
  var loading = React.useMemo(function () {
54
63
  return mapLoadingComponent ? mapLoadingComponent() : React__default["default"].createElement(React__default["default"].Fragment, null);
@@ -65,15 +74,15 @@ function MintMap(_a) {
65
74
  var newController_1 = mapType === 'naver' ? new NaverMintMapController.NaverMintMapController(tslib.__assign(tslib.__assign({
66
75
  mapType: mapType
67
76
  }, props), {
68
- base: base
77
+ base: mapBaseConfig
69
78
  })) : mapType === 'google' ? new GoogleMintMapController.GoogleMintMapController(tslib.__assign(tslib.__assign({
70
79
  mapType: mapType
71
80
  }, props), {
72
- base: base
81
+ base: mapBaseConfig
73
82
  })) : mapType === 'kakao' ? new KakaoMintMapController.KakaoMintMapController(tslib.__assign(tslib.__assign({
74
83
  mapType: mapType
75
84
  }, props), {
76
- base: base
85
+ base: mapBaseConfig
77
86
  })) : null;
78
87
  newController_1 && (prevController.current = newController_1);
79
88
 
@@ -109,7 +118,7 @@ function MintMap(_a) {
109
118
  }), React__default["default"].createElement(MintMapCore.MintMapCore, tslib.__assign({
110
119
  mapType: mapType
111
120
  }, props, {
112
- base: base
121
+ base: mapBaseConfig
113
122
  }), children)) : React__default["default"].createElement(React__default["default"].Fragment, null, dissolveEffectWhenLoaded && React__default["default"].createElement("div", {
114
123
  ref: function (refs) {
115
124
  loadingRef.current = refs;
@@ -3,6 +3,7 @@ import { Drawable, Marker, MarkerOptions, Polygon, PolygonOptions, Polyline, Pol
3
3
  import { EventCallback, EventParamType, MapEvent, MapEventName, MapUIEvent } from '../types/MapEventTypes';
4
4
  import { Bounds, Offset, Position } from '../types/MapTypes';
5
5
  import { MintMapProps } from '../types/MintMapProps';
6
+ import { Property } from "csstype";
6
7
  export declare abstract class MintMapController {
7
8
  abstract type: MapType;
8
9
  abstract map: MapVendorType | null;
@@ -17,6 +18,7 @@ export declare abstract class MintMapController {
17
18
  abstract setZoomLevel(zoom: number): void;
18
19
  abstract getCenter(): Position;
19
20
  abstract setCenter(position: Position): void;
21
+ abstract setMapCursor(cursor: Property.Cursor): void;
20
22
  abstract createMarker(marker: Marker): void;
21
23
  abstract updateMarker(marker: Marker, options: MarkerOptions): void;
22
24
  abstract clearDrawable(drawable: Drawable): boolean;
@@ -5,6 +5,7 @@ import { Drawable, Marker, MarkerOptions, Polygon, PolygonOptions, Polyline, Pol
5
5
  import { EventCallback, EventParamType, MapEvent, MapEventName, MapUIEvent } from "../types/MapEventTypes";
6
6
  import { Bounds, Position } from "../types/MapTypes";
7
7
  import { MintMapProps } from "../types/MintMapProps";
8
+ import { Property } from "csstype";
8
9
  export declare class GoogleMintMapController extends MintMapController {
9
10
  type: MapType;
10
11
  map: google.maps.Map | null;
@@ -43,6 +44,7 @@ export declare class GoogleMintMapController extends MintMapController {
43
44
  setZoomLevel(zoom: number): void;
44
45
  getCenter(): Position;
45
46
  setCenter(position: Position): void;
47
+ setMapCursor(cursor: Property.Cursor): void;
46
48
  private eventMap;
47
49
  addEventListener(eventName: MapEventName, callback: EventCallback<EventParamType>): void;
48
50
  removeEventListener(eventName: MapEventName, callback: EventCallback<EventParamType>): void;
@@ -440,10 +440,10 @@ function (_super) {
440
440
 
441
441
  var _this = this;
442
442
 
443
- var _a, _b, _c, _d;
443
+ var _a, _b, _c, _d, _e, _f;
444
444
 
445
- return tslib.__generator(this, function (_e) {
446
- switch (_e.label) {
445
+ return tslib.__generator(this, function (_g) {
446
+ switch (_g.label) {
447
447
  case 0:
448
448
  //이미 생성했으면
449
449
  //1. divElement 가 그대로인 경우 기존 map 객체 리턴
@@ -465,9 +465,9 @@ function (_super) {
465
465
  , this.loadMapApi()];
466
466
 
467
467
  case 1:
468
- _e.sent();
468
+ _g.sent();
469
469
 
470
- _e.label = 2;
470
+ _g.label = 2;
471
471
 
472
472
  case 2:
473
473
  map = new google.maps.Map(divElement, {
@@ -481,7 +481,9 @@ function (_super) {
481
481
  keyboardShortcuts: this.mapProps.keyboardShortcuts === false ? false : true,
482
482
  clickableIcons: false
483
483
  });
484
- this.map = map; //@ts-ignore
484
+ this.map = map; //맵 커서 초기화
485
+
486
+ ((_e = this.mapProps.base) === null || _e === void 0 ? void 0 : _e.mapCursor) && this.setMapCursor((_f = this.mapProps.base) === null || _f === void 0 ? void 0 : _f.mapCursor); //@ts-ignore
485
487
 
486
488
  map.addListener('mousedown', function () {
487
489
  _this.dragged = false; // console.log('map mousedown / dragged => ', this.dragged);
@@ -590,6 +592,15 @@ function (_super) {
590
592
  (_a = this.map) === null || _a === void 0 ? void 0 : _a.setCenter(position);
591
593
  };
592
594
 
595
+ GoogleMintMapController.prototype.setMapCursor = function (cursor) {
596
+ var _a;
597
+
598
+ (_a = this.map) === null || _a === void 0 ? void 0 : _a.setOptions({
599
+ draggingCursor: cursor,
600
+ draggableCursor: cursor
601
+ });
602
+ };
603
+
593
604
  GoogleMintMapController.prototype.addEventListener = function (eventName, callback) {
594
605
  var _this = this;
595
606
 
@@ -6,6 +6,7 @@ import { Drawable, Marker, MarkerOptions, Polygon, PolygonOptions, Polyline, Pol
6
6
  import { Bounds, Position } from "../types/MapTypes";
7
7
  import { MintMapProps } from "../types/MintMapProps";
8
8
  import { EventCallback, EventParamType, MapEvent, MapEventName, MapUIEvent } from "../types/MapEventTypes";
9
+ import { Property } from "csstype";
9
10
  export declare class KakaoMintMapController extends MintMapController {
10
11
  type: MapType;
11
12
  map: kakao.maps.Map | null;
@@ -45,6 +46,7 @@ export declare class KakaoMintMapController extends MintMapController {
45
46
  setZoomLevel(zoom: number): void;
46
47
  getCenter(): Position;
47
48
  setCenter(position: Position): void;
49
+ setMapCursor(cursor: Property.Cursor): void;
48
50
  private positionToLatLng;
49
51
  private latLngToPosition;
50
52
  private eventMap;
@@ -445,10 +445,10 @@ function (_super) {
445
445
 
446
446
  var _this = this;
447
447
 
448
- var _a, _b, _c, _d;
448
+ var _a, _b, _c, _d, _e, _f;
449
449
 
450
- return tslib.__generator(this, function (_e) {
451
- switch (_e.label) {
450
+ return tslib.__generator(this, function (_g) {
451
+ switch (_g.label) {
452
452
  case 0:
453
453
  if (!!this.mapApiLoaded) return [3
454
454
  /*break*/
@@ -458,9 +458,9 @@ function (_super) {
458
458
  , this.loadMapApi()];
459
459
 
460
460
  case 1:
461
- _e.sent();
461
+ _g.sent();
462
462
 
463
- _e.label = 2;
463
+ _g.label = 2;
464
464
 
465
465
  case 2:
466
466
  options = {
@@ -489,7 +489,9 @@ function (_super) {
489
489
  map = new kakao.maps.Map(divElement, options);
490
490
  map.setMaxLevel(minZoom);
491
491
  map.setMinLevel(maxZoom);
492
- this.map = map; //@ts-ignore
492
+ this.map = map; //맵 커서 초기화
493
+
494
+ ((_e = this.mapProps.base) === null || _e === void 0 ? void 0 : _e.mapCursor) && this.setMapCursor((_f = this.mapProps.base) === null || _f === void 0 ? void 0 : _f.mapCursor); //@ts-ignore
493
495
  // map.addListener('dragstart', (e)=>{
494
496
  // //console.log('map dragstart', e);
495
497
  // this.dragStartPoint[0] = e.domEvent.clientX
@@ -624,6 +626,13 @@ function (_super) {
624
626
  (_a = this.map) === null || _a === void 0 ? void 0 : _a.setCenter(this.positionToLatLng(position));
625
627
  };
626
628
 
629
+ KakaoMintMapController.prototype.setMapCursor = function (cursor) {
630
+ var _a;
631
+
632
+ var target = (_a = this.mapDivElement.firstElementChild) === null || _a === void 0 ? void 0 : _a.firstElementChild;
633
+ target && (target.style.cursor = cursor);
634
+ };
635
+
627
636
  KakaoMintMapController.prototype.positionToLatLng = function (pos) {
628
637
  return pos ? new kakao.maps.LatLng(pos.lat, pos.lng) : new kakao.maps.LatLng(0, 0);
629
638
  };
@@ -6,6 +6,7 @@ import { Drawable, Marker, MarkerOptions, Polygon, PolygonOptions, Polyline, Pol
6
6
  import { Bounds, Offset, Position } from "../types/MapTypes";
7
7
  import { MintMapProps } from "../types/MintMapProps";
8
8
  import { EventCallback, EventParamType, MapEvent, MapEventName, MapUIEvent } from "../types/MapEventTypes";
9
+ import { Property } from "csstype";
9
10
  export declare class NaverMintMapController extends MintMapController {
10
11
  type: MapType;
11
12
  map: naver.maps.Map | null;
@@ -44,6 +45,7 @@ export declare class NaverMintMapController extends MintMapController {
44
45
  setZoomLevel(zoom: number): void;
45
46
  getCenter(): Position;
46
47
  setCenter(position: Position): void;
48
+ setMapCursor(cursor: Property.Cursor): void;
47
49
  naverPositionToOffset(position: Position): Offset;
48
50
  private eventMap;
49
51
  addEventListener(eventName: MapEventName, callback: EventCallback<EventParamType>): void;
@@ -460,10 +460,10 @@ function (_super) {
460
460
 
461
461
  var _this = this;
462
462
 
463
- var _a, _b, _c, _d;
463
+ var _a, _b, _c, _d, _e, _f;
464
464
 
465
- return tslib.__generator(this, function (_e) {
466
- switch (_e.label) {
465
+ return tslib.__generator(this, function (_g) {
466
+ switch (_g.label) {
467
467
  case 0:
468
468
  //이미 생성했으면
469
469
  //1. divElement 가 그대로인 경우 기존 map 객체 리턴
@@ -487,9 +487,9 @@ function (_super) {
487
487
  , this.loadMapApi()];
488
488
 
489
489
  case 1:
490
- _e.sent();
490
+ _g.sent();
491
491
 
492
- _e.label = 2;
492
+ _g.label = 2;
493
493
 
494
494
  case 2:
495
495
  options = {
@@ -522,7 +522,9 @@ function (_super) {
522
522
  options.maxZoom = maxZoom;
523
523
  divElement.innerHTML = '';
524
524
  map = new naver.maps.Map(divElement, options);
525
- this.map = map; //@ts-ignore
525
+ this.map = map; //맵 커서 초기화
526
+
527
+ ((_e = this.mapProps.base) === null || _e === void 0 ? void 0 : _e.mapCursor) && this.setMapCursor((_f = this.mapProps.base) === null || _f === void 0 ? void 0 : _f.mapCursor); //@ts-ignore
526
528
 
527
529
  map.addListener('mousedown', function () {
528
530
  _this.dragged = false; // console.log('map mousedown / dragged => ', this.dragged);
@@ -637,6 +639,13 @@ function (_super) {
637
639
  (_a = this.map) === null || _a === void 0 ? void 0 : _a.setCenter(position);
638
640
  };
639
641
 
642
+ NaverMintMapController.prototype.setMapCursor = function (cursor) {
643
+ var _a;
644
+
645
+ var target = (_a = this.mapDivElement.firstElementChild) === null || _a === void 0 ? void 0 : _a.firstElementChild;
646
+ target && (target.style.cursor = cursor);
647
+ };
648
+
640
649
  NaverMintMapController.prototype.naverPositionToOffset = function (position) {
641
650
  if (!this.map) {
642
651
  return new MapTypes.Offset(0, 0);
@@ -2,6 +2,7 @@
2
2
  import { MapType } from "./CommonTypes";
3
3
  import { Position } from "./MapTypes";
4
4
  import { MintMapEvents } from "./MintMapEvents";
5
+ import { Property } from "csstype";
5
6
  /**
6
7
  * Mint Map Props
7
8
  */
@@ -98,4 +99,8 @@ export interface BaseProps {
98
99
  * 지도의 최소 줌 레벨
99
100
  */
100
101
  minZoomLevel?: number;
102
+ /**
103
+ * 지도의 기본 커서
104
+ */
105
+ mapCursor?: Property.Cursor;
101
106
  }
package/dist/index.es.js CHANGED
@@ -1952,10 +1952,10 @@ function (_super) {
1952
1952
 
1953
1953
  var _this = this;
1954
1954
 
1955
- var _a, _b, _c, _d;
1955
+ var _a, _b, _c, _d, _e, _f;
1956
1956
 
1957
- return __generator(this, function (_e) {
1958
- switch (_e.label) {
1957
+ return __generator(this, function (_g) {
1958
+ switch (_g.label) {
1959
1959
  case 0:
1960
1960
  //이미 생성했으면
1961
1961
  //1. divElement 가 그대로인 경우 기존 map 객체 리턴
@@ -1979,9 +1979,9 @@ function (_super) {
1979
1979
  , this.loadMapApi()];
1980
1980
 
1981
1981
  case 1:
1982
- _e.sent();
1982
+ _g.sent();
1983
1983
 
1984
- _e.label = 2;
1984
+ _g.label = 2;
1985
1985
 
1986
1986
  case 2:
1987
1987
  options = {
@@ -2014,7 +2014,9 @@ function (_super) {
2014
2014
  options.maxZoom = maxZoom;
2015
2015
  divElement.innerHTML = '';
2016
2016
  map = new naver.maps.Map(divElement, options);
2017
- this.map = map; //@ts-ignore
2017
+ this.map = map; //맵 커서 초기화
2018
+
2019
+ ((_e = this.mapProps.base) === null || _e === void 0 ? void 0 : _e.mapCursor) && this.setMapCursor((_f = this.mapProps.base) === null || _f === void 0 ? void 0 : _f.mapCursor); //@ts-ignore
2018
2020
 
2019
2021
  map.addListener('mousedown', function () {
2020
2022
  _this.dragged = false; // console.log('map mousedown / dragged => ', this.dragged);
@@ -2129,6 +2131,13 @@ function (_super) {
2129
2131
  (_a = this.map) === null || _a === void 0 ? void 0 : _a.setCenter(position);
2130
2132
  };
2131
2133
 
2134
+ NaverMintMapController.prototype.setMapCursor = function (cursor) {
2135
+ var _a;
2136
+
2137
+ var target = (_a = this.mapDivElement.firstElementChild) === null || _a === void 0 ? void 0 : _a.firstElementChild;
2138
+ target && (target.style.cursor = cursor);
2139
+ };
2140
+
2132
2141
  NaverMintMapController.prototype.naverPositionToOffset = function (position) {
2133
2142
  if (!this.map) {
2134
2143
  return new Offset(0, 0);
@@ -2664,10 +2673,10 @@ function (_super) {
2664
2673
 
2665
2674
  var _this = this;
2666
2675
 
2667
- var _a, _b, _c, _d;
2676
+ var _a, _b, _c, _d, _e, _f;
2668
2677
 
2669
- return __generator(this, function (_e) {
2670
- switch (_e.label) {
2678
+ return __generator(this, function (_g) {
2679
+ switch (_g.label) {
2671
2680
  case 0:
2672
2681
  //이미 생성했으면
2673
2682
  //1. divElement 가 그대로인 경우 기존 map 객체 리턴
@@ -2689,9 +2698,9 @@ function (_super) {
2689
2698
  , this.loadMapApi()];
2690
2699
 
2691
2700
  case 1:
2692
- _e.sent();
2701
+ _g.sent();
2693
2702
 
2694
- _e.label = 2;
2703
+ _g.label = 2;
2695
2704
 
2696
2705
  case 2:
2697
2706
  map = new google.maps.Map(divElement, {
@@ -2705,7 +2714,9 @@ function (_super) {
2705
2714
  keyboardShortcuts: this.mapProps.keyboardShortcuts === false ? false : true,
2706
2715
  clickableIcons: false
2707
2716
  });
2708
- this.map = map; //@ts-ignore
2717
+ this.map = map; //맵 커서 초기화
2718
+
2719
+ ((_e = this.mapProps.base) === null || _e === void 0 ? void 0 : _e.mapCursor) && this.setMapCursor((_f = this.mapProps.base) === null || _f === void 0 ? void 0 : _f.mapCursor); //@ts-ignore
2709
2720
 
2710
2721
  map.addListener('mousedown', function () {
2711
2722
  _this.dragged = false; // console.log('map mousedown / dragged => ', this.dragged);
@@ -2814,6 +2825,15 @@ function (_super) {
2814
2825
  (_a = this.map) === null || _a === void 0 ? void 0 : _a.setCenter(position);
2815
2826
  };
2816
2827
 
2828
+ GoogleMintMapController.prototype.setMapCursor = function (cursor) {
2829
+ var _a;
2830
+
2831
+ (_a = this.map) === null || _a === void 0 ? void 0 : _a.setOptions({
2832
+ draggingCursor: cursor,
2833
+ draggableCursor: cursor
2834
+ });
2835
+ };
2836
+
2817
2837
  GoogleMintMapController.prototype.addEventListener = function (eventName, callback) {
2818
2838
  var _this = this;
2819
2839
 
@@ -3359,10 +3379,10 @@ function (_super) {
3359
3379
 
3360
3380
  var _this = this;
3361
3381
 
3362
- var _a, _b, _c, _d;
3382
+ var _a, _b, _c, _d, _e, _f;
3363
3383
 
3364
- return __generator(this, function (_e) {
3365
- switch (_e.label) {
3384
+ return __generator(this, function (_g) {
3385
+ switch (_g.label) {
3366
3386
  case 0:
3367
3387
  if (!!this.mapApiLoaded) return [3
3368
3388
  /*break*/
@@ -3372,9 +3392,9 @@ function (_super) {
3372
3392
  , this.loadMapApi()];
3373
3393
 
3374
3394
  case 1:
3375
- _e.sent();
3395
+ _g.sent();
3376
3396
 
3377
- _e.label = 2;
3397
+ _g.label = 2;
3378
3398
 
3379
3399
  case 2:
3380
3400
  options = {
@@ -3403,7 +3423,9 @@ function (_super) {
3403
3423
  map = new kakao.maps.Map(divElement, options);
3404
3424
  map.setMaxLevel(minZoom);
3405
3425
  map.setMinLevel(maxZoom);
3406
- this.map = map; //@ts-ignore
3426
+ this.map = map; //맵 커서 초기화
3427
+
3428
+ ((_e = this.mapProps.base) === null || _e === void 0 ? void 0 : _e.mapCursor) && this.setMapCursor((_f = this.mapProps.base) === null || _f === void 0 ? void 0 : _f.mapCursor); //@ts-ignore
3407
3429
  // map.addListener('dragstart', (e)=>{
3408
3430
  // //console.log('map dragstart', e);
3409
3431
  // this.dragStartPoint[0] = e.domEvent.clientX
@@ -3538,6 +3560,13 @@ function (_super) {
3538
3560
  (_a = this.map) === null || _a === void 0 ? void 0 : _a.setCenter(this.positionToLatLng(position));
3539
3561
  };
3540
3562
 
3563
+ KakaoMintMapController.prototype.setMapCursor = function (cursor) {
3564
+ var _a;
3565
+
3566
+ var target = (_a = this.mapDivElement.firstElementChild) === null || _a === void 0 ? void 0 : _a.firstElementChild;
3567
+ target && (target.style.cursor = cursor);
3568
+ };
3569
+
3541
3570
  KakaoMintMapController.prototype.positionToLatLng = function (pos) {
3542
3571
  return pos ? new kakao.maps.LatLng(pos.lat, pos.lng) : new kakao.maps.LatLng(0, 0);
3543
3572
  };
@@ -3663,6 +3692,17 @@ var DEFAULT_CENTER = {
3663
3692
  lat: 37.5036845,
3664
3693
  lng: 127.0448698
3665
3694
  };
3695
+ var DEFAULT_ZOOM_LEVEL = 12;
3696
+ var DEFAULT_MAP_BASE_CONFIG = {
3697
+ center: DEFAULT_CENTER,
3698
+ zoomLevel: DEFAULT_ZOOM_LEVEL
3699
+ };
3700
+
3701
+ function makeBaseProps(base) {
3702
+ !base.center && (base.center = DEFAULT_CENTER);
3703
+ !base.zoomLevel && (base.zoomLevel = DEFAULT_ZOOM_LEVEL);
3704
+ return base;
3705
+ }
3666
3706
  /**
3667
3707
  * Mint Map 컴포넌트
3668
3708
  *
@@ -3671,24 +3711,22 @@ var DEFAULT_CENTER = {
3671
3711
  * @returns {JSX.Element} JSX
3672
3712
  */
3673
3713
 
3714
+
3674
3715
  function MintMap(_a) {
3675
3716
  var mapLoadingComponent = _a.mapLoadingComponent,
3676
3717
  _b = _a.dissolveEffectWhenLoaded,
3677
3718
  dissolveEffectWhenLoaded = _b === void 0 ? true : _b,
3678
3719
  mapType = _a.mapType,
3679
3720
  children = _a.children,
3680
- _c = _a.base,
3681
- base = _c === void 0 ? {
3682
- center: DEFAULT_CENTER,
3683
- zoomLevel: 12
3684
- } : _c,
3721
+ base = _a.base,
3685
3722
  props = __rest(_a, ["mapLoadingComponent", "dissolveEffectWhenLoaded", "mapType", "children", "base"]);
3686
3723
 
3724
+ var mapBaseConfig = base ? makeBaseProps(base) : DEFAULT_MAP_BASE_CONFIG;
3687
3725
  var loadingRef = useRef(null);
3688
3726
 
3689
- var _d = useState(),
3690
- controller = _d[0],
3691
- setController = _d[1];
3727
+ var _c = useState(),
3728
+ controller = _c[0],
3729
+ setController = _c[1];
3692
3730
 
3693
3731
  var loading = useMemo(function () {
3694
3732
  return mapLoadingComponent ? mapLoadingComponent() : React.createElement(React.Fragment, null);
@@ -3705,15 +3743,15 @@ function MintMap(_a) {
3705
3743
  var newController_1 = mapType === 'naver' ? new NaverMintMapController(__assign(__assign({
3706
3744
  mapType: mapType
3707
3745
  }, props), {
3708
- base: base
3746
+ base: mapBaseConfig
3709
3747
  })) : mapType === 'google' ? new GoogleMintMapController(__assign(__assign({
3710
3748
  mapType: mapType
3711
3749
  }, props), {
3712
- base: base
3750
+ base: mapBaseConfig
3713
3751
  })) : mapType === 'kakao' ? new KakaoMintMapController(__assign(__assign({
3714
3752
  mapType: mapType
3715
3753
  }, props), {
3716
- base: base
3754
+ base: mapBaseConfig
3717
3755
  })) : null;
3718
3756
  newController_1 && (prevController.current = newController_1);
3719
3757
 
@@ -3749,7 +3787,7 @@ function MintMap(_a) {
3749
3787
  }), React.createElement(MintMapCore, __assign({
3750
3788
  mapType: mapType
3751
3789
  }, props, {
3752
- base: base
3790
+ base: mapBaseConfig
3753
3791
  }), children)) : React.createElement(React.Fragment, null, dissolveEffectWhenLoaded && React.createElement("div", {
3754
3792
  ref: function (refs) {
3755
3793
  loadingRef.current = refs;
package/dist/index.umd.js CHANGED
@@ -1956,10 +1956,10 @@
1956
1956
 
1957
1957
  var _this = this;
1958
1958
 
1959
- var _a, _b, _c, _d;
1959
+ var _a, _b, _c, _d, _e, _f;
1960
1960
 
1961
- return tslib.__generator(this, function (_e) {
1962
- switch (_e.label) {
1961
+ return tslib.__generator(this, function (_g) {
1962
+ switch (_g.label) {
1963
1963
  case 0:
1964
1964
  //이미 생성했으면
1965
1965
  //1. divElement 가 그대로인 경우 기존 map 객체 리턴
@@ -1983,9 +1983,9 @@
1983
1983
  , this.loadMapApi()];
1984
1984
 
1985
1985
  case 1:
1986
- _e.sent();
1986
+ _g.sent();
1987
1987
 
1988
- _e.label = 2;
1988
+ _g.label = 2;
1989
1989
 
1990
1990
  case 2:
1991
1991
  options = {
@@ -2018,7 +2018,9 @@
2018
2018
  options.maxZoom = maxZoom;
2019
2019
  divElement.innerHTML = '';
2020
2020
  map = new naver.maps.Map(divElement, options);
2021
- this.map = map; //@ts-ignore
2021
+ this.map = map; //맵 커서 초기화
2022
+
2023
+ ((_e = this.mapProps.base) === null || _e === void 0 ? void 0 : _e.mapCursor) && this.setMapCursor((_f = this.mapProps.base) === null || _f === void 0 ? void 0 : _f.mapCursor); //@ts-ignore
2022
2024
 
2023
2025
  map.addListener('mousedown', function () {
2024
2026
  _this.dragged = false; // console.log('map mousedown / dragged => ', this.dragged);
@@ -2133,6 +2135,13 @@
2133
2135
  (_a = this.map) === null || _a === void 0 ? void 0 : _a.setCenter(position);
2134
2136
  };
2135
2137
 
2138
+ NaverMintMapController.prototype.setMapCursor = function (cursor) {
2139
+ var _a;
2140
+
2141
+ var target = (_a = this.mapDivElement.firstElementChild) === null || _a === void 0 ? void 0 : _a.firstElementChild;
2142
+ target && (target.style.cursor = cursor);
2143
+ };
2144
+
2136
2145
  NaverMintMapController.prototype.naverPositionToOffset = function (position) {
2137
2146
  if (!this.map) {
2138
2147
  return new Offset(0, 0);
@@ -2668,10 +2677,10 @@
2668
2677
 
2669
2678
  var _this = this;
2670
2679
 
2671
- var _a, _b, _c, _d;
2680
+ var _a, _b, _c, _d, _e, _f;
2672
2681
 
2673
- return tslib.__generator(this, function (_e) {
2674
- switch (_e.label) {
2682
+ return tslib.__generator(this, function (_g) {
2683
+ switch (_g.label) {
2675
2684
  case 0:
2676
2685
  //이미 생성했으면
2677
2686
  //1. divElement 가 그대로인 경우 기존 map 객체 리턴
@@ -2693,9 +2702,9 @@
2693
2702
  , this.loadMapApi()];
2694
2703
 
2695
2704
  case 1:
2696
- _e.sent();
2705
+ _g.sent();
2697
2706
 
2698
- _e.label = 2;
2707
+ _g.label = 2;
2699
2708
 
2700
2709
  case 2:
2701
2710
  map = new google.maps.Map(divElement, {
@@ -2709,7 +2718,9 @@
2709
2718
  keyboardShortcuts: this.mapProps.keyboardShortcuts === false ? false : true,
2710
2719
  clickableIcons: false
2711
2720
  });
2712
- this.map = map; //@ts-ignore
2721
+ this.map = map; //맵 커서 초기화
2722
+
2723
+ ((_e = this.mapProps.base) === null || _e === void 0 ? void 0 : _e.mapCursor) && this.setMapCursor((_f = this.mapProps.base) === null || _f === void 0 ? void 0 : _f.mapCursor); //@ts-ignore
2713
2724
 
2714
2725
  map.addListener('mousedown', function () {
2715
2726
  _this.dragged = false; // console.log('map mousedown / dragged => ', this.dragged);
@@ -2818,6 +2829,15 @@
2818
2829
  (_a = this.map) === null || _a === void 0 ? void 0 : _a.setCenter(position);
2819
2830
  };
2820
2831
 
2832
+ GoogleMintMapController.prototype.setMapCursor = function (cursor) {
2833
+ var _a;
2834
+
2835
+ (_a = this.map) === null || _a === void 0 ? void 0 : _a.setOptions({
2836
+ draggingCursor: cursor,
2837
+ draggableCursor: cursor
2838
+ });
2839
+ };
2840
+
2821
2841
  GoogleMintMapController.prototype.addEventListener = function (eventName, callback) {
2822
2842
  var _this = this;
2823
2843
 
@@ -3363,10 +3383,10 @@
3363
3383
 
3364
3384
  var _this = this;
3365
3385
 
3366
- var _a, _b, _c, _d;
3386
+ var _a, _b, _c, _d, _e, _f;
3367
3387
 
3368
- return tslib.__generator(this, function (_e) {
3369
- switch (_e.label) {
3388
+ return tslib.__generator(this, function (_g) {
3389
+ switch (_g.label) {
3370
3390
  case 0:
3371
3391
  if (!!this.mapApiLoaded) return [3
3372
3392
  /*break*/
@@ -3376,9 +3396,9 @@
3376
3396
  , this.loadMapApi()];
3377
3397
 
3378
3398
  case 1:
3379
- _e.sent();
3399
+ _g.sent();
3380
3400
 
3381
- _e.label = 2;
3401
+ _g.label = 2;
3382
3402
 
3383
3403
  case 2:
3384
3404
  options = {
@@ -3407,7 +3427,9 @@
3407
3427
  map = new kakao.maps.Map(divElement, options);
3408
3428
  map.setMaxLevel(minZoom);
3409
3429
  map.setMinLevel(maxZoom);
3410
- this.map = map; //@ts-ignore
3430
+ this.map = map; //맵 커서 초기화
3431
+
3432
+ ((_e = this.mapProps.base) === null || _e === void 0 ? void 0 : _e.mapCursor) && this.setMapCursor((_f = this.mapProps.base) === null || _f === void 0 ? void 0 : _f.mapCursor); //@ts-ignore
3411
3433
  // map.addListener('dragstart', (e)=>{
3412
3434
  // //console.log('map dragstart', e);
3413
3435
  // this.dragStartPoint[0] = e.domEvent.clientX
@@ -3542,6 +3564,13 @@
3542
3564
  (_a = this.map) === null || _a === void 0 ? void 0 : _a.setCenter(this.positionToLatLng(position));
3543
3565
  };
3544
3566
 
3567
+ KakaoMintMapController.prototype.setMapCursor = function (cursor) {
3568
+ var _a;
3569
+
3570
+ var target = (_a = this.mapDivElement.firstElementChild) === null || _a === void 0 ? void 0 : _a.firstElementChild;
3571
+ target && (target.style.cursor = cursor);
3572
+ };
3573
+
3545
3574
  KakaoMintMapController.prototype.positionToLatLng = function (pos) {
3546
3575
  return pos ? new kakao.maps.LatLng(pos.lat, pos.lng) : new kakao.maps.LatLng(0, 0);
3547
3576
  };
@@ -3667,6 +3696,17 @@
3667
3696
  lat: 37.5036845,
3668
3697
  lng: 127.0448698
3669
3698
  };
3699
+ var DEFAULT_ZOOM_LEVEL = 12;
3700
+ var DEFAULT_MAP_BASE_CONFIG = {
3701
+ center: DEFAULT_CENTER,
3702
+ zoomLevel: DEFAULT_ZOOM_LEVEL
3703
+ };
3704
+
3705
+ function makeBaseProps(base) {
3706
+ !base.center && (base.center = DEFAULT_CENTER);
3707
+ !base.zoomLevel && (base.zoomLevel = DEFAULT_ZOOM_LEVEL);
3708
+ return base;
3709
+ }
3670
3710
  /**
3671
3711
  * Mint Map 컴포넌트
3672
3712
  *
@@ -3675,24 +3715,22 @@
3675
3715
  * @returns {JSX.Element} JSX
3676
3716
  */
3677
3717
 
3718
+
3678
3719
  function MintMap(_a) {
3679
3720
  var mapLoadingComponent = _a.mapLoadingComponent,
3680
3721
  _b = _a.dissolveEffectWhenLoaded,
3681
3722
  dissolveEffectWhenLoaded = _b === void 0 ? true : _b,
3682
3723
  mapType = _a.mapType,
3683
3724
  children = _a.children,
3684
- _c = _a.base,
3685
- base = _c === void 0 ? {
3686
- center: DEFAULT_CENTER,
3687
- zoomLevel: 12
3688
- } : _c,
3725
+ base = _a.base,
3689
3726
  props = tslib.__rest(_a, ["mapLoadingComponent", "dissolveEffectWhenLoaded", "mapType", "children", "base"]);
3690
3727
 
3728
+ var mapBaseConfig = base ? makeBaseProps(base) : DEFAULT_MAP_BASE_CONFIG;
3691
3729
  var loadingRef = React.useRef(null);
3692
3730
 
3693
- var _d = React.useState(),
3694
- controller = _d[0],
3695
- setController = _d[1];
3731
+ var _c = React.useState(),
3732
+ controller = _c[0],
3733
+ setController = _c[1];
3696
3734
 
3697
3735
  var loading = React.useMemo(function () {
3698
3736
  return mapLoadingComponent ? mapLoadingComponent() : React__default["default"].createElement(React__default["default"].Fragment, null);
@@ -3709,15 +3747,15 @@
3709
3747
  var newController_1 = mapType === 'naver' ? new NaverMintMapController(tslib.__assign(tslib.__assign({
3710
3748
  mapType: mapType
3711
3749
  }, props), {
3712
- base: base
3750
+ base: mapBaseConfig
3713
3751
  })) : mapType === 'google' ? new GoogleMintMapController(tslib.__assign(tslib.__assign({
3714
3752
  mapType: mapType
3715
3753
  }, props), {
3716
- base: base
3754
+ base: mapBaseConfig
3717
3755
  })) : mapType === 'kakao' ? new KakaoMintMapController(tslib.__assign(tslib.__assign({
3718
3756
  mapType: mapType
3719
3757
  }, props), {
3720
- base: base
3758
+ base: mapBaseConfig
3721
3759
  })) : null;
3722
3760
  newController_1 && (prevController.current = newController_1);
3723
3761
 
@@ -3753,7 +3791,7 @@
3753
3791
  }), React__default["default"].createElement(MintMapCore, tslib.__assign({
3754
3792
  mapType: mapType
3755
3793
  }, props, {
3756
- base: base
3794
+ base: mapBaseConfig
3757
3795
  }), children)) : React__default["default"].createElement(React__default["default"].Fragment, null, dissolveEffectWhenLoaded && React__default["default"].createElement("div", {
3758
3796
  ref: function (refs) {
3759
3797
  loadingRef.current = refs;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@mint-ui/map",
3
- "version": "0.7.3-beta",
3
+ "version": "0.7.5-beta",
4
4
  "main": "./dist/index.js",
5
5
  "module": "./dist/index.es.js",
6
6
  "browser": "./dist/index.umd.js",