@mint-ui/map 1.0.0 → 1.1.0

package/.eslintrc.js

@@ -1,110 +1,110 @@
-module.exports = {
-	env: {
-		browser: true,
-		node: true
-	},
-	extends: [ 'airbnb', 'airbnb/hooks', 'eslint:recommended', 'plugin:react/recommended', 'plugin:import/recommended', 'plugin:storybook/recommended' ],
-	ignorePatterns: [ '.storybook', '*.d.ts', 'node_modules', 'build', 'dist', '**/env/*.js' ],
-	overrides: [
-		{
-			files: [ '*.ts', '*.tsx' ],
-			rules: { 'no-undef': 'off' }
-		}
-	],
-	parser: '@typescript-eslint/parser',
-	parserOptions: { warnOnUnsupportedTypeScriptVersion: false },
-	plugins: [ '@typescript-eslint', 'sort-keys-fix', 'prettier' ],
-	rules: {
-		'@typescript-eslint/ban-ts-comment': [
-			'error',
-			{ 'ts-ignore': 'allow-with-description' }
-		],
-		'@typescript-eslint/no-explicit-any': 'warn',
-		'@typescript-eslint/no-unused-vars': 'error',
-		'array-bracket-spacing': [
-			'error',
-			'always',
-			{
-				arraysInArrays: false,
-				objectsInArrays: false
-			}
-		],
-		'brace-style': [ 'error', 'allman' ],
-		'class-methods-use-this': 'off',
-		'comma-dangle': [ 'error', 'never' ],
-		'eol-last': [ 'error', 'never' ],
-		'import/extensions': 'off',
-		'import/named': 'off',
-		'import/no-anonymous-default-export': 'off',
-		'import/no-cycle': 'off',
-		'import/no-extraneous-dependencies': 'off',
-		'import/no-named-as-default': 'off',
-		'import/no-unresolved': 'off',
-		'import/order': [
-			'error',
-			{
-				alphabetize: {
-					caseInsensitive: true,
-					order: 'asc'
-				},
-				groups: [ 'external', 'builtin', 'internal', 'sibling', 'parent', 'index' ],
-				'newlines-between': 'always'
-			}
-		],
-		indent: [ 'error', 'tab', { SwitchCase: 1 }],
-		'jsx-a11y/control-has-associated-label': 'off',
-		'jsx-quotes': [ 'error', 'prefer-single' ],
-		'linebreak-style': 'off',
-		'max-len': 'off',
-		'no-console': 'off',
-		'no-plusplus': 'off',
-		'no-restricted-exports': 'off',
-		'no-tabs': [ 'error', { allowIndentationTabs: true }],
-		'no-unused-vars': 'off',
-		'object-curly-newline': [ 'error', {
-			ExportDeclaration: 'never',
-			ImportDeclaration: 'never',
-			ObjectExpression: {
-				minProperties: 3,
-				multiline: true
-			},
-			ObjectPattern: { multiline: true }
-		}],
-		'react-hooks/exhaustive-deps': 'off',
-		'react/button-has-type': 'off',
-		'react/destructuring-assignment': 'off',
-		'react/function-component-definition': 'off',
-		'react/jsx-curly-brace-presence': [
-			'error',
-			{
-				children: 'never',
-				props: 'never'
-			}
-		],
-		'react/jsx-filename-extension': 'off',
-		'react/jsx-indent': [ 'error', 'tab' ],
-		'react/jsx-indent-props': [ 2, 'tab' ],
-		'react/jsx-props-no-spreading': 'off',
-		'react/jsx-sort-props': [
-			'error',
-			{
-				callbacksLast: true,
-				ignoreCase: true,
-				multiline: 'last',
-				noSortAlphabetically: false,
-				reservedFirst: false,
-				shorthandFirst: false,
-				shorthandLast: true
-			}
-		],
-		'react/prop-types': 'off',
-		'react/react-in-jsx-scope': 'off',
-		'react/require-default-props': 'off',
-		'require-jsdoc': 'off',
-		'sort-keys-fix/sort-keys-fix': 'error'
-	},
-	settings: {
-		'import/parsers': { '@typescript-eslint/parser': [ '.ts', '.tsx', '.js' ] },
-		react: { version: 'detect' }
-	}
+module.exports = {
+	env: {
+		browser: true,
+		node: true
+	},
+	extends: [ 'airbnb', 'airbnb/hooks', 'eslint:recommended', 'plugin:react/recommended', 'plugin:import/recommended', 'plugin:storybook/recommended' ],
+	ignorePatterns: [ '.storybook', '*.d.ts', 'node_modules', 'build', 'dist', '**/env/*.js' ],
+	overrides: [
+		{
+			files: [ '*.ts', '*.tsx' ],
+			rules: { 'no-undef': 'off' }
+		}
+	],
+	parser: '@typescript-eslint/parser',
+	parserOptions: { warnOnUnsupportedTypeScriptVersion: false },
+	plugins: [ '@typescript-eslint', 'sort-keys-fix', 'prettier' ],
+	rules: {
+		'@typescript-eslint/ban-ts-comment': [
+			'error',
+			{ 'ts-ignore': 'allow-with-description' }
+		],
+		'@typescript-eslint/no-explicit-any': 'warn',
+		'@typescript-eslint/no-unused-vars': 'error',
+		'array-bracket-spacing': [
+			'error',
+			'always',
+			{
+				arraysInArrays: false,
+				objectsInArrays: false
+			}
+		],
+		'brace-style': [ 'error', 'allman' ],
+		'class-methods-use-this': 'off',
+		'comma-dangle': [ 'error', 'never' ],
+		'eol-last': [ 'error', 'never' ],
+		'import/extensions': 'off',
+		'import/named': 'off',
+		'import/no-anonymous-default-export': 'off',
+		'import/no-cycle': 'off',
+		'import/no-extraneous-dependencies': 'off',
+		'import/no-named-as-default': 'off',
+		'import/no-unresolved': 'off',
+		'import/order': [
+			'error',
+			{
+				alphabetize: {
+					caseInsensitive: true,
+					order: 'asc'
+				},
+				groups: [ 'external', 'builtin', 'internal', 'sibling', 'parent', 'index' ],
+				'newlines-between': 'always'
+			}
+		],
+		indent: [ 'error', 'tab', { SwitchCase: 1 }],
+		'jsx-a11y/control-has-associated-label': 'off',
+		'jsx-quotes': [ 'error', 'prefer-single' ],
+		'linebreak-style': 'off',
+		'max-len': 'off',
+		'no-console': 'off',
+		'no-plusplus': 'off',
+		'no-restricted-exports': 'off',
+		'no-tabs': [ 'error', { allowIndentationTabs: true }],
+		'no-unused-vars': 'off',
+		'object-curly-newline': [ 'error', {
+			ExportDeclaration: 'never',
+			ImportDeclaration: 'never',
+			ObjectExpression: {
+				minProperties: 3,
+				multiline: true
+			},
+			ObjectPattern: { multiline: true }
+		}],
+		'react-hooks/exhaustive-deps': 'off',
+		'react/button-has-type': 'off',
+		'react/destructuring-assignment': 'off',
+		'react/function-component-definition': 'off',
+		'react/jsx-curly-brace-presence': [
+			'error',
+			{
+				children: 'never',
+				props: 'never'
+			}
+		],
+		'react/jsx-filename-extension': 'off',
+		'react/jsx-indent': [ 'error', 'tab' ],
+		'react/jsx-indent-props': [ 2, 'tab' ],
+		'react/jsx-props-no-spreading': 'off',
+		'react/jsx-sort-props': [
+			'error',
+			{
+				callbacksLast: true,
+				ignoreCase: true,
+				multiline: 'last',
+				noSortAlphabetically: false,
+				reservedFirst: false,
+				shorthandFirst: false,
+				shorthandLast: true
+			}
+		],
+		'react/prop-types': 'off',
+		'react/react-in-jsx-scope': 'off',
+		'react/require-default-props': 'off',
+		'require-jsdoc': 'off',
+		'sort-keys-fix/sort-keys-fix': 'error'
+	},
+	settings: {
+		'import/parsers': { '@typescript-eslint/parser': [ '.ts', '.tsx', '.js' ] },
+		react: { version: 'detect' }
+	}
 };

package/LICENSE

@@ -1,21 +1,21 @@
-MIT License
-
-Copyright (c) 2022 itcode.dev
-
-Permission is hereby granted, free of charge, to any person obtaining a copy
-of this software and associated documentation files (the "Software"), to deal
-in the Software without restriction, including without limitation the rights
-to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
-copies of the Software, and to permit persons to whom the Software is
-furnished to do so, subject to the following conditions:
-
-The above copyright notice and this permission notice shall be included in all
-copies or substantial portions of the Software.
-
-THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
-AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
-SOFTWARE.
+MIT License
+
+Copyright (c) 2022 itcode.dev
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -1,81 +1,81 @@
-# @mint-ui/map
-
-- React map library 
-- Control various map with one interface
-- Google, Naver, Kakao map supported now
-- Typescript supported
-- Canvas marker supported
-
-## Installation
-
-``` bash
-yarn add @mint-ui/map
-
-npm install @mint-ui/map
-```
-
-## Examples
-
-``` javascript
-...
-...
-
-import { MapMarkerWrapper, MintMap, Position } from '@mint-ui/map'
-
-const root = ReactDOM.createRoot(
-  document.getElementById('root')
-)
-
-function MyMapComponent(){
-
-  return <MintMap 
-    mapType={'google'} 
-    mapKey={'YOUR_GOOGLE_MAP_KEY'}
-    mapId='YOUR_GOOGLE_MAP_ID' //Use advanced markers in Google maps
-    base={{center:new Position(-25.344, 131.031), zoomLevel:12}}
-  >
-    {/* Your marker */}
-    <MapMarkerWrapper position={new Position(-25.344, 131.031)}>
-    
-      {/* Your marker elements */}
-      <div style={{width:'10px', height:'10px', background:'red', borderRadius:'10px'}}></div>
-      
-    </MapMarkerWrapper>
-
-    {/* Canvas marker */}
-    <CanvasMarker
-
-      /* Canvas renderer */
-      renderer={({ context, offset, payload }) => {
-        context.beginPath();
-
-        // rect
-        context.rect(offset[0].x, offset[0].y, 20, 20);
-        context.fillStyle = 'orange';
-        context.fill();
-
-        // rect outline
-        context.strokeStyle = 'red';
-        context.strokeRect(offset[0].x, offset[0].y, 20, 20);
-
-        // font
-        context.fillStyle = 'white';
-        context.font = '10px caption';
-        context.fillText(String(payload?.no), offset[0].x + 2, offset[0].y + 14);
-        context.closePath();
-      }}
-      zIndex={2}
-      data={markers}
-    />
-      
-  </MintMap>
-
-}
-
-root.render((<MyMapComponent/>))
-
-```
-
-## Document / Reference Site
-
-[https://dev-rsquare.github.io/mint-ui-map-guide](https://dev-rsquare.github.io/mint-ui-map-guide)
+# @mint-ui/map
+
+- React map library 
+- Control various map with one interface
+- Google, Naver, Kakao map supported now
+- Typescript supported
+- Canvas marker supported
+
+## Installation
+
+``` bash
+yarn add @mint-ui/map
+
+npm install @mint-ui/map
+```
+
+## Examples
+
+``` javascript
+...
+...
+
+import { MapMarkerWrapper, MintMap, Position } from '@mint-ui/map'
+
+const root = ReactDOM.createRoot(
+  document.getElementById('root')
+)
+
+function MyMapComponent(){
+
+  return <MintMap 
+    mapType={'google'} 
+    mapKey={'YOUR_GOOGLE_MAP_KEY'}
+    mapId='YOUR_GOOGLE_MAP_ID' //Use advanced markers in Google maps
+    base={{center:new Position(-25.344, 131.031), zoomLevel:12}}
+  >
+    {/* Your marker */}
+    <MapMarkerWrapper position={new Position(-25.344, 131.031)}>
+    
+      {/* Your marker elements */}
+      <div style={{width:'10px', height:'10px', background:'red', borderRadius:'10px'}}></div>
+      
+    </MapMarkerWrapper>
+
+    {/* Canvas marker */}
+    <CanvasMarker
+
+      /* Canvas renderer */
+      renderer={({ context, offset, payload }) => {
+        context.beginPath();
+
+        // rect
+        context.rect(offset[0].x, offset[0].y, 20, 20);
+        context.fillStyle = 'orange';
+        context.fill();
+
+        // rect outline
+        context.strokeStyle = 'red';
+        context.strokeRect(offset[0].x, offset[0].y, 20, 20);
+
+        // font
+        context.fillStyle = 'white';
+        context.font = '10px caption';
+        context.fillText(String(payload?.no), offset[0].x + 2, offset[0].y + 14);
+        context.closePath();
+      }}
+      zIndex={2}
+      data={markers}
+    />
+      
+  </MintMap>
+
+}
+
+root.render((<MyMapComponent/>))
+
+```
+
+## Document / Reference Site
+
+[https://dev-rsquare.github.io/mint-ui-map-guide](https://dev-rsquare.github.io/mint-ui-map-guide)

package/dist/components/mint-map/MintMap.d.ts

@@ -1,10 +1,10 @@
-import { PropsWithChildren } from "react";
-import { MintMapProps } from "./types/MintMapProps";
-/**
- * Mint Map 컴포넌트
- *
- * @param {MintMapProps} MintMapProps
- *
- * @returns {JSX.Element} JSX
- */
-export declare function MintMap({ mapLoadingComponent, dissolveEffectWhenLoaded, mapType, children, base, ...props }: PropsWithChildren<MintMapProps>): JSX.Element;
+import { PropsWithChildren } from "react";
+import { MintMapProps } from "./types/MintMapProps";
+/**
+ * Mint Map 컴포넌트
+ *
+ * @param {MintMapProps} MintMapProps
+ *
+ * @returns {JSX.Element} JSX
+ */
+export declare function MintMap({ mapLoadingComponent, dissolveEffectWhenLoaded, mapType, children, base, ...props }: PropsWithChildren<MintMapProps>): JSX.Element;

package/dist/components/mint-map/MintMap.js

@@ -34,12 +34,12 @@ function makeBaseProps(base) {
   !base.zoomLevel && (base.zoomLevel = DEFAULT_ZOOM_LEVEL);
   return base;
 }
-/**
- * Mint Map 컴포넌트
- *
- * @param {MintMapProps} MintMapProps
- *
- * @returns {JSX.Element} JSX
+/**
+ * Mint Map 컴포넌트
+ *
+ * @param {MintMapProps} MintMapProps
+ *
+ * @returns {JSX.Element} JSX
  */
 
 

package/dist/components/mint-map/core/MintMapCanvasRenderer.d.ts

@@ -1,4 +1,4 @@
-export declare class MintMapCanvasRenderer {
-    context: CanvasRenderingContext2D;
-    constructor(context: CanvasRenderingContext2D);
-}
+export declare class MintMapCanvasRenderer {
+    context: CanvasRenderingContext2D;
+    constructor(context: CanvasRenderingContext2D);
+}

package/dist/components/mint-map/core/MintMapController.d.ts

@@ -1,70 +1,70 @@
-import { MapType, MapVendorType } from '../types/CommonTypes';
-import { Drawable, Marker, MarkerOptions, Polygon, PolygonOptions, Polyline, PolylineOptions } from '../types/MapDrawables';
-import { EventCallback, EventParamType, MapEvent, MapEventName, MapUIEvent } from '../types/MapEventTypes';
-import { Bounds, Offset, Position } from '../types/MapTypes';
-import { MintMapProps } from '../types/MintMapProps';
-import { Property } from "csstype";
-export declare abstract class MintMapController {
-    abstract type: MapType;
-    abstract map: MapVendorType | null;
-    abstract scriptUrl: string;
-    abstract scriptModules: string[];
-    abstract initializingMap(divElement: HTMLDivElement): Promise<MapVendorType>;
-    abstract destroyMap(): void;
-    abstract loadMapApi(): Promise<boolean>;
-    abstract getCurrBounds(): Bounds;
-    abstract panningTo(targetCenter: Position): void;
-    abstract getZoomLevel(): number;
-    abstract setZoomLevel(zoom: number): void;
-    abstract getCenter(): Position;
-    abstract setCenter(position: Position): void;
-    abstract setMapCursor(cursor: Property.Cursor): void;
-    abstract createMarker(marker: Marker): void;
-    abstract updateMarker(marker: Marker, options: MarkerOptions): void;
-    abstract clearDrawable(drawable: Drawable): boolean;
-    abstract markerToTheTop(marker: Marker): void;
-    abstract isMapDragged(): boolean;
-    abstract setMapDragged(value: boolean): void;
-    abstract setMarkerZIndex(marker: Marker, zIndex: number): void;
-    abstract createPolyline(polyline: Polyline): void;
-    abstract updatePolyline(polyline: Polyline, options: PolylineOptions): void;
-    abstract createPolygon(polygon: Polygon): void;
-    abstract updatePolygon(polygon: Polygon, options: PolygonOptions): void;
-    protected abstract mapEvent: MapEvent;
-    protected abstract mapUIEvent: MapUIEvent;
-    abstract addEventListener(eventName: MapEventName, callback: EventCallback<EventParamType>): void;
-    abstract removeEventListener(eventName: MapEventName, callback: EventCallback<EventParamType>): void;
-    abstract removeAllEventListener(eventName?: MapEventName): void;
-    mapProps: MintMapProps;
-    mapApiLoaded: boolean;
-    mapInitialized: boolean;
-    mapDivElement: HTMLDivElement;
-    constructor(props: MintMapProps);
-    getMap(): MapVendorType | null;
-    getMapType(): MapType;
-    positionToOffset(position: Position): Offset;
-    offsetToPosition(offset: Offset): Position;
-    loadScript(url: string, id: string, checkLoaded: () => boolean): Promise<boolean>;
-    getRandomFunctionName(prefix: string): string;
-    /**
-     * URL 빌더 메서드
-     *
-     * @param {string} baseUrl: 기본 URL
-     * @param {{ [ key: string ]: string | string[] }} param: 파라미터 JSON
-     * @returns {string} URL
-     */
-    buildUrl(baseUrl: string, param: {
-        [key: string]: string | string[] | boolean;
-    }): string;
-    private processedTime;
-    /**
-     * 쓰로틀링 처리
-     * @returns
-     */
-    checkBoundsChangeThrottleTime(): boolean;
-    getBaseToMapZoom(zoomBase: number): number;
-    getMapToBaseZoom(mapZoom: number): number;
-    focusPositionsToFitViewport(positions: Position[]): void;
-    morph(position: Position, zoom: number, option?: Record<string, unknown>): void;
-    printStatus(): void;
-}
+import { MapType, MapVendorType } from '../types/CommonTypes';
+import { Drawable, Marker, MarkerOptions, Polygon, PolygonOptions, Polyline, PolylineOptions } from '../types/MapDrawables';
+import { EventCallback, EventParamType, MapEvent, MapEventName, MapUIEvent } from '../types/MapEventTypes';
+import { Bounds, Offset, Position, Spacing } from '../types/MapTypes';
+import { MintMapProps } from '../types/MintMapProps';
+import { Property } from "csstype";
+export declare abstract class MintMapController {
+    abstract type: MapType;
+    abstract map: MapVendorType | null;
+    abstract scriptUrl: string;
+    abstract scriptModules: string[];
+    abstract initializingMap(divElement: HTMLDivElement): Promise<MapVendorType>;
+    abstract destroyMap(): void;
+    abstract loadMapApi(): Promise<boolean>;
+    abstract getCurrBounds(): Bounds;
+    abstract panningTo(targetCenter: Position): void;
+    abstract getZoomLevel(): number;
+    abstract setZoomLevel(zoom: number): void;
+    abstract getCenter(): Position;
+    abstract setCenter(position: Position): void;
+    abstract setMapCursor(cursor: Property.Cursor): void;
+    abstract focusPositionsToFitViewport(positions: Position[], spacing?: number | Spacing): void;
+    abstract createMarker(marker: Marker): void;
+    abstract updateMarker(marker: Marker, options: MarkerOptions): void;
+    abstract clearDrawable(drawable: Drawable): boolean;
+    abstract markerToTheTop(marker: Marker): void;
+    abstract isMapDragged(): boolean;
+    abstract setMapDragged(value: boolean): void;
+    abstract setMarkerZIndex(marker: Marker, zIndex: number): void;
+    abstract createPolyline(polyline: Polyline): void;
+    abstract updatePolyline(polyline: Polyline, options: PolylineOptions): void;
+    abstract createPolygon(polygon: Polygon): void;
+    abstract updatePolygon(polygon: Polygon, options: PolygonOptions): void;
+    protected abstract mapEvent: MapEvent;
+    protected abstract mapUIEvent: MapUIEvent;
+    abstract addEventListener(eventName: MapEventName, callback: EventCallback<EventParamType>): void;
+    abstract removeEventListener(eventName: MapEventName, callback: EventCallback<EventParamType>): void;
+    abstract removeAllEventListener(eventName?: MapEventName): void;
+    mapProps: MintMapProps;
+    mapApiLoaded: boolean;
+    mapInitialized: boolean;
+    mapDivElement: HTMLDivElement;
+    constructor(props: MintMapProps);
+    getMap(): any;
+    getMapType(): MapType;
+    positionToOffset(position: Position): Offset;
+    offsetToPosition(offset: Offset): Position;
+    loadScript(url: string, id: string, checkLoaded: () => boolean): Promise<boolean>;
+    getRandomFunctionName(prefix: string): string;
+    /**
+     * URL 빌더 메서드
+     *
+     * @param {string} baseUrl: 기본 URL
+     * @param {{ [ key: string ]: string | string[] }} param: 파라미터 JSON
+     * @returns {string} URL
+     */
+    buildUrl(baseUrl: string, param: {
+        [key: string]: string | string[] | boolean;
+    }): string;
+    private processedTime;
+    /**
+     * 쓰로틀링 처리
+     * @returns
+     */
+    checkBoundsChangeThrottleTime(): boolean;
+    getBaseToMapZoom(zoomBase: number): number;
+    getMapToBaseZoom(mapZoom: number): number;
+    morph(position: Position, zoom: number, option?: Record<string, unknown>): void;
+    printStatus(): void;
+}