react-svg-worldmap - npm Package Compare versions

Comparing version 2.0.0-alpha.0 to 2.0.0-alpha.1

dist/components/Frame.js

@@ -1,7 +0,4 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const React = require("react");
-function Frame({ color }) {
-    return (React.createElement("rect", { x: 0, y: 0, width: '100%', height: '100%', stroke: color, fill: "none" }));
+import React from "react";
+export default function Frame({ color }) {
+    return (React.createElement("rect", { x: 0, y: 0, width: "100%", height: "100%", stroke: color, fill: "none" }));
 }
-exports.default = Frame;

dist/components/Region.d.ts

@@ -1,8 +0,8 @@
-import * as React from 'react';
-import type { ComponentProps } from 'react';
-export interface Props extends Omit<ComponentProps<'path'>, 'href'> {
+import React from "react";
+import type { ComponentProps } from "react";
+export interface Props extends Omit<ComponentProps<"path">, "href"> {
     strokeOpacity: string | number;
-    href?: ComponentProps<'a'> | string;
+    href?: ComponentProps<"a"> | string;
 }
-declare const Region: React.ForwardRefExoticComponent<Pick<Props, "string" | "filter" | "values" | "fill" | "max" | "type" | "accumulate" | "offset" | "key" | "id" | "media" | "origin" | "height" | "width" | "end" | "name" | "alignmentBaseline" | "baselineShift" | "clip" | "clipPath" | "clipRule" | "color" | "colorInterpolation" | "colorInterpolationFilters" | "cursor" | "direction" | "display" | "dominantBaseline" | "fillOpacity" | "fillRule" | "floodColor" | "floodOpacity" | "fontFamily" | "fontSize" | "fontSizeAdjust" | "fontStretch" | "fontStyle" | "fontVariant" | "fontWeight" | "imageRendering" | "letterSpacing" | "lightingColor" | "markerEnd" | "markerMid" | "markerStart" | "mask" | "opacity" | "order" | "overflow" | "paintOrder" | "pointerEvents" | "rotate" | "scale" | "shapeRendering" | "stopColor" | "stopOpacity" | "stroke" | "strokeDasharray" | "strokeDashoffset" | "strokeLinecap" | "strokeLinejoin" | "strokeMiterlimit" | "strokeOpacity" | "strokeWidth" | "textAnchor" | "textDecoration" | "textRendering" | "transform" | "unicodeBidi" | "visibility" | "wordSpacing" | "writingMode" | "alphabetic" | "hanging" | "ideographic" | "style" | "path" | "method" | "target" | "lang" | "className" | "children" | "tabIndex" | "orientation" | "local" | "x" | "y" | "mathematical" | "azimuth" | "colorRendering" | "glyphOrientationVertical" | "vectorEffect" | "additive" | "crossOrigin" | "href" | "min" | "role" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "accentHeight" | "allowReorder" | "amplitude" | "arabicForm" | "ascent" | "attributeName" | "attributeType" | "autoReverse" | "baseFrequency" | "baseProfile" | "bbox" | "begin" | "bias" | "by" | "calcMode" | "capHeight" | "clipPathUnits" | "colorProfile" | "contentScriptType" | "contentStyleType" | "cx" | "cy" | "d" | "decelerate" | "descent" | "diffuseConstant" | "divisor" | "dur" | "dx" | "dy" | "edgeMode" | "elevation" | "enableBackground" | "exponent" | "externalResourcesRequired" | "filterRes" | "filterUnits" | "focusable" | "format" | "from" | "fx" | "fy" | "g1" | "g2" | "glyphName" | "glyphOrientationHorizontal" | "glyphRef" | "gradientTransform" | "gradientUnits" | "horizAdvX" | "horizOriginX" | "in2" | "in" | "intercept" | "k1" | "k2" | "k3" | "k4" | "k" | "kernelMatrix" | "kernelUnitLength" | "kerning" | "keyPoints" | "keySplines" | "keyTimes" | "lengthAdjust" | "limitingConeAngle" | "markerHeight" | "markerUnits" | "markerWidth" | "maskContentUnits" | "maskUnits" | "mode" | "numOctaves" | "operator" | "orient" | "overlinePosition" | "overlineThickness" | "panose1" | "pathLength" | "patternContentUnits" | "patternTransform" | "patternUnits" | "points" | "pointsAtX" | "pointsAtY" | "pointsAtZ" | "preserveAlpha" | "preserveAspectRatio" | "primitiveUnits" | "r" | "radius" | "refX" | "refY" | "renderingIntent" | "repeatCount" | "repeatDur" | "requiredExtensions" | "requiredFeatures" | "restart" | "result" | "rx" | "ry" | "seed" | "slope" | "spacing" | "specularConstant" | "specularExponent" | "speed" | "spreadMethod" | "startOffset" | "stdDeviation" | "stemh" | "stemv" | "stitchTiles" | "strikethroughPosition" | "strikethroughThickness" | "surfaceScale" | "systemLanguage" | "tableValues" | "targetX" | "targetY" | "textLength" | "to" | "u1" | "u2" | "underlinePosition" | "underlineThickness" | "unicode" | "unicodeRange" | "unitsPerEm" | "vAlphabetic" | "version" | "vertAdvY" | "vertOriginX" | "vertOriginY" | "vHanging" | "vIdeographic" | "viewBox" | "viewTarget" | "vMathematical" | "widths" | "x1" | "x2" | "xChannelSelector" | "xHeight" | "xlinkActuate" | "xlinkArcrole" | "xlinkHref" | "xlinkRole" | "xlinkShow" | "xlinkTitle" | "xlinkType" | "xmlBase" | "xmlLang" | "xmlns" | "xmlnsXlink" | "xmlSpace" | "y1" | "y2" | "yChannelSelector" | "z" | "zoomAndPan" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture"> & React.RefAttributes<SVGPathElement>>;
-export default Region;
+declare const _default: React.ForwardRefExoticComponent<Pick<Props, "string" | "filter" | "values" | "fill" | "max" | "type" | "accumulate" | "offset" | "key" | "id" | "media" | "origin" | "height" | "width" | "end" | "name" | "alignmentBaseline" | "baselineShift" | "clip" | "clipPath" | "clipRule" | "color" | "colorInterpolation" | "colorInterpolationFilters" | "cursor" | "direction" | "display" | "dominantBaseline" | "fillOpacity" | "fillRule" | "floodColor" | "floodOpacity" | "fontFamily" | "fontSize" | "fontSizeAdjust" | "fontStretch" | "fontStyle" | "fontVariant" | "fontWeight" | "imageRendering" | "letterSpacing" | "lightingColor" | "markerEnd" | "markerMid" | "markerStart" | "mask" | "opacity" | "order" | "overflow" | "paintOrder" | "pointerEvents" | "rotate" | "scale" | "shapeRendering" | "stopColor" | "stopOpacity" | "stroke" | "strokeDasharray" | "strokeDashoffset" | "strokeLinecap" | "strokeLinejoin" | "strokeMiterlimit" | "strokeOpacity" | "strokeWidth" | "textAnchor" | "textDecoration" | "textRendering" | "transform" | "unicodeBidi" | "visibility" | "wordSpacing" | "writingMode" | "alphabetic" | "hanging" | "ideographic" | "style" | "path" | "method" | "target" | "lang" | "className" | "children" | "tabIndex" | "orientation" | "local" | "x" | "y" | "mathematical" | "azimuth" | "colorRendering" | "glyphOrientationVertical" | "vectorEffect" | "additive" | "crossOrigin" | "href" | "min" | "role" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "accentHeight" | "allowReorder" | "amplitude" | "arabicForm" | "ascent" | "attributeName" | "attributeType" | "autoReverse" | "baseFrequency" | "baseProfile" | "bbox" | "begin" | "bias" | "by" | "calcMode" | "capHeight" | "clipPathUnits" | "colorProfile" | "contentScriptType" | "contentStyleType" | "cx" | "cy" | "d" | "decelerate" | "descent" | "diffuseConstant" | "divisor" | "dur" | "dx" | "dy" | "edgeMode" | "elevation" | "enableBackground" | "exponent" | "externalResourcesRequired" | "filterRes" | "filterUnits" | "focusable" | "format" | "from" | "fx" | "fy" | "g1" | "g2" | "glyphName" | "glyphOrientationHorizontal" | "glyphRef" | "gradientTransform" | "gradientUnits" | "horizAdvX" | "horizOriginX" | "in2" | "in" | "intercept" | "k1" | "k2" | "k3" | "k4" | "k" | "kernelMatrix" | "kernelUnitLength" | "kerning" | "keyPoints" | "keySplines" | "keyTimes" | "lengthAdjust" | "limitingConeAngle" | "markerHeight" | "markerUnits" | "markerWidth" | "maskContentUnits" | "maskUnits" | "mode" | "numOctaves" | "operator" | "orient" | "overlinePosition" | "overlineThickness" | "panose1" | "pathLength" | "patternContentUnits" | "patternTransform" | "patternUnits" | "points" | "pointsAtX" | "pointsAtY" | "pointsAtZ" | "preserveAlpha" | "preserveAspectRatio" | "primitiveUnits" | "r" | "radius" | "refX" | "refY" | "renderingIntent" | "repeatCount" | "repeatDur" | "requiredExtensions" | "requiredFeatures" | "restart" | "result" | "rx" | "ry" | "seed" | "slope" | "spacing" | "specularConstant" | "specularExponent" | "speed" | "spreadMethod" | "startOffset" | "stdDeviation" | "stemh" | "stemv" | "stitchTiles" | "strikethroughPosition" | "strikethroughThickness" | "surfaceScale" | "systemLanguage" | "tableValues" | "targetX" | "targetY" | "textLength" | "to" | "u1" | "u2" | "underlinePosition" | "underlineThickness" | "unicode" | "unicodeRange" | "unitsPerEm" | "vAlphabetic" | "version" | "vertAdvY" | "vertOriginX" | "vertOriginY" | "vHanging" | "vIdeographic" | "viewBox" | "viewTarget" | "vMathematical" | "widths" | "x1" | "x2" | "xChannelSelector" | "xHeight" | "xlinkActuate" | "xlinkArcrole" | "xlinkHref" | "xlinkRole" | "xlinkShow" | "xlinkTitle" | "xlinkType" | "xmlBase" | "xmlLang" | "xmlns" | "xmlnsXlink" | "xmlSpace" | "y1" | "y2" | "yChannelSelector" | "z" | "zoomAndPan" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture"> & React.RefAttributes<SVGPathElement>>;
+export default _default;

dist/components/Region.js

@@ -1,19 +0,22 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const tslib_1 = require("tslib");
-const React = require("react");
-const Region = React.forwardRef(function Region(_a, ref) {
-    var { href } = _a, props = (0, tslib_1.__rest)(_a, ["href"]);
-    const path = (React.createElement("path", Object.assign({ onMouseOver: (event) => {
-            event.currentTarget.style.strokeWidth = '2';
-            event.currentTarget.style.strokeOpacity = '0.5';
-        }, onMouseOut: (event) => {
-            event.currentTarget.style.strokeWidth = '1';
-            event.currentTarget.style.strokeOpacity = `${props.strokeOpacity}`;
-        }, ref: ref }, props)));
-    if (href) {
-        return React.createElement("a", Object.assign({}, (typeof href === 'string' ? { href } : href)), path);
-    }
+import { __rest } from "tslib";
+import React from "react";
+function onMouseOver(strokeOpacity) {
+    return (event) => {
+        event.currentTarget.style.strokeWidth = "2";
+        event.currentTarget.style.strokeOpacity = String(Math.min(strokeOpacity + 0.3, 1));
+    };
+}
+function onMouseOut(strokeOpacity) {
+    return (event) => {
+        event.currentTarget.style.strokeWidth = "1";
+        event.currentTarget.style.strokeOpacity = String(strokeOpacity);
+    };
+}
+function Region(_a, ref) {
+    var { href } = _a, props = __rest(_a, ["href"]);
+    const path = (React.createElement("path", Object.assign({ onMouseOver: onMouseOver(Number(props.strokeOpacity)), onMouseOut: onMouseOut(Number(props.strokeOpacity)), ref: ref }, props)));
+    if (href)
+        return React.createElement("a", Object.assign({}, (typeof href === "string" ? { href } : href)), path);
     return path;
-});
-exports.default = Region;
+}
+export default React.forwardRef(Region);

dist/components/TextLabel.d.ts

@@ -1,5 +0,5 @@
-import type { ComponentProps } from 'react';
-export interface Props extends ComponentProps<'text'> {
+import type { ComponentProps } from "react";
+export interface Props extends ComponentProps<"text"> {
     label: string;
 }
 export default function TextLabel({ label, ...props }: Props): JSX.Element;

dist/components/TextLabel.js

@@ -1,9 +0,6 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const tslib_1 = require("tslib");
-const React = require("react");
-function TextLabel(_a) {
-    var { label } = _a, props = (0, tslib_1.__rest)(_a, ["label"]);
+import { __rest } from "tslib";
+import React from "react";
+export default function TextLabel(_a) {
+    var { label } = _a, props = __rest(_a, ["label"]);
     return React.createElement("text", Object.assign({}, props), label);
 }
-exports.default = TextLabel;

dist/components/Tooltip.d.ts

@@ -1,2 +0,2 @@
-import type { RefObject } from 'react';
+import type { RefObject } from "react";
 export interface Props {
@@ -3,0 +3,0 @@ tip?: string;

dist/components/Tooltip.js

@@ -1,12 +0,8 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Tooltip = void 0;
-const tslib_1 = require("tslib");
-const React = require("react");
-const react_path_tooltip_1 = require("react-path-tooltip");
-function Tooltip(_a) {
-    var { tip } = _a, props = (0, tslib_1.__rest)(_a, ["tip"]);
-    return tip ? React.createElement(react_path_tooltip_1.PathTooltip, Object.assign({ fontSize: 12, tip: tip }, props)) : null;
+import { __rest } from "tslib";
+import React from "react";
+import { PathTooltip } from "react-path-tooltip";
+export function Tooltip(_a) {
+    var { tip } = _a, props = __rest(_a, ["tip"]);
+    return tip ? React.createElement(PathTooltip, Object.assign({ fontSize: 12, tip: tip }, props)) : null;
 }
-exports.Tooltip = Tooltip;
-exports.default = Tooltip;
+export default Tooltip;

dist/constants.d.ts

@@ -1,3 +0,3 @@
-import type { CSSProperties } from 'react';
-import type { SizeOption, CountryContext } from './types';
+import type { CSSProperties } from "react";
+import type { SizeOption, CountryContext } from "./types";
 export declare const defaultSize = "xl";
@@ -4,0 +4,0 @@ export declare const defaultColor = "#dddddd";

dist/constants.js

@@ -1,8 +0,5 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.defaultTooltip = exports.defaultCountryStyle = exports.sizeMap = exports.heightRatio = exports.defaultColor = exports.defaultSize = void 0;
-exports.defaultSize = 'xl';
-exports.defaultColor = '#dddddd';
-exports.heightRatio = 3 / 4;
-exports.sizeMap = {
+export const defaultSize = "xl";
+export const defaultColor = "#dddddd";
+export const heightRatio = 3 / 4;
+export const sizeMap = {
     sm: 240,
@@ -14,7 +11,9 @@ md: 336,
 };
-const defaultCountryStyle = (stroke, strokeOpacity) => (context) => {
+export const defaultCountryStyle = (stroke, strokeOpacity) => (context) => {
     const { countryValue, minValue, maxValue, color } = context;
-    const opacityLevel = countryValue
+    let opacityLevel = countryValue
         ? 0.2 + 0.6 * ((countryValue - minValue) / (maxValue - minValue))
         : 0;
+    if (Number.isNaN(opacityLevel))
+        opacityLevel = 0.8;
     const style = {
@@ -26,11 +25,9 @@ fill: color,
         strokeOpacity,
-        cursor: 'pointer',
+        cursor: "pointer",
     };
     return style;
 };
-exports.defaultCountryStyle = defaultCountryStyle;
-const defaultTooltip = (context) => {
+export const defaultTooltip = (context) => {
     const { countryName, countryValue, prefix, suffix } = context;
     return `${countryName} ${prefix} ${countryValue.toLocaleString()} ${suffix}`;
 };
-exports.defaultTooltip = defaultTooltip;

dist/draw.d.ts

@@ -1,2 +0,2 @@
-import type { RefObject } from 'react';
-export declare function drawTooltip(tip: string | undefined, tooltipBgColor: string, tooltipTextColor: string, idx: number, triggerRef: RefObject<SVGElement>, containerRef: RefObject<SVGSVGElement>): JSX.Element | null;
+import type { RefObject } from "react";
+export declare function drawTooltip(tip: string | undefined, tooltipBgColor: string, tooltipTextColor: string, triggerRef: RefObject<SVGElement>, containerRef: RefObject<SVGSVGElement>): JSX.Element | null;

dist/draw.js

@@ -1,9 +0,5 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.drawTooltip = void 0;
-const React = require("react");
-const react_path_tooltip_1 = require("react-path-tooltip");
-function drawTooltip(tip, tooltipBgColor, tooltipTextColor, idx, triggerRef, containerRef) {
-    return tip ? (React.createElement(react_path_tooltip_1.PathTooltip, { fontSize: 12, bgColor: tooltipBgColor, textColor: tooltipTextColor, key: `path_${idx}_xyz`, pathRef: triggerRef, svgRef: containerRef, tip: tip })) : null;
+import React from "react";
+import { PathTooltip } from "react-path-tooltip";
+export function drawTooltip(tip, tooltipBgColor, tooltipTextColor, triggerRef, containerRef) {
+    return tip ? (React.createElement(PathTooltip, { fontSize: 12, bgColor: tooltipBgColor, textColor: tooltipTextColor, key: tip, pathRef: triggerRef, svgRef: containerRef, tip: tip })) : null;
 }
-exports.drawTooltip = drawTooltip;

dist/index.d.ts

 /// <reference types="react" />
-import type { Props } from './types';
-export * from './types';
+import type { Props } from "./types";
+export type { ISOCode, SizeOption, DataItem, Data, CountryContext, Props, } from "./types";
 export default function WorldMap(props: Props): JSX.Element;
 export { WorldMap };

dist/index.js

@@ -1,37 +0,33 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.WorldMap = void 0;
-const tslib_1 = require("tslib");
-const React = require("react");
-const d3_geo_1 = require("d3-geo");
-const countries_geo_1 = require("./countries.geo");
-const constants_1 = require("./constants");
-const utils_1 = require("./utils");
-const draw_1 = require("./draw");
-const Frame_1 = require("./components/Frame");
-const Region_1 = require("./components/Region");
-const TextLabel_1 = require("./components/TextLabel");
-(0, tslib_1.__exportStar)(require("./types"), exports);
-function WorldMap(props) {
-    const { data, title, valuePrefix = '', valueSuffix = '', color = constants_1.defaultColor, strokeOpacity = 0.2, backgroundColor = 'white', tooltipBgColor = 'black', tooltipTextColor = 'white', size = constants_1.defaultSize, frame = false, frameColor = 'black', borderColor = 'black', richInteraction = false, styleFunction = (0, constants_1.defaultCountryStyle)(borderColor, strokeOpacity), tooltipTextFunction = constants_1.defaultTooltip, onClickFunction, hrefFunction, textLabelFunction = () => [], } = props;
-    const windowWidth = (0, utils_1.useWindowWidth)();
-    const width = typeof size === 'number' ? size : (0, utils_1.responsify)(size, windowWidth);
-    const height = width * constants_1.heightRatio;
-    const [scale, setScale] = React.useState(1);
-    const [translateX, setTranslateX] = React.useState(0);
-    const [translateY, setTranslateY] = React.useState(0);
-    const containerRef = React.createRef();
+import React, { useState, createRef } from "react";
+import { geoMercator, geoPath } from "d3-geo";
+import geoData from "./countries.geo";
+import { defaultColor, defaultSize, heightRatio, defaultCountryStyle, defaultTooltip, } from "./constants";
+import { useWindowWidth, responsify } from "./utils";
+import { drawTooltip } from "./draw";
+import Frame from "./components/Frame";
+import Region from "./components/Region";
+import TextLabel from "./components/TextLabel";
+export default function WorldMap(props) {
+    const { data, title, valuePrefix = "", valueSuffix = "", color = defaultColor, strokeOpacity = 0.2, backgroundColor = "white", tooltipBgColor = "black", tooltipTextColor = "white", size = defaultSize, frame = false, frameColor = "black", borderColor = "black", richInteraction = false, styleFunction = defaultCountryStyle(borderColor, strokeOpacity), tooltipTextFunction = defaultTooltip, onClickFunction, hrefFunction, textLabelFunction = () => [], } = props;
+    const windowWidth = useWindowWidth();
+    const width = typeof size === "number" ? size : responsify(size, windowWidth);
+    const height = width * heightRatio;
+    const [scale, setScale] = useState(1);
+    const [translateX, setTranslateX] = useState(0);
+    const [translateY, setTranslateY] = useState(0);
+    const containerRef = createRef();
     const countryValueMap = Object.fromEntries(data.map(({ country, value }) => [country.toUpperCase(), value]));
     const minValue = Math.min(...data.map(({ value }) => value));
     const maxValue = Math.max(...data.map(({ value }) => value));
-    const projection = (0, d3_geo_1.geoMercator)();
-    const pathGenerator = (0, d3_geo_1.geoPath)().projection(projection);
-    const regions = countries_geo_1.default.features.map((feature, idx) => {
-        const triggerRef = React.createRef();
+    const projection = geoMercator();
+    const pathGenerator = geoPath().projection(projection);
+    const onClick = React.useCallback((context) => (event) => onClickFunction === null || onClickFunction === void 0 ? void 0 : onClickFunction(Object.assign(Object.assign({}, context), { event })), [onClickFunction]);
+    const regions = geoData.features.map((feature) => {
+        const triggerRef = createRef();
         const { I: isoCode, N: countryName, C: coordinates } = feature;
         const geoFeature = {
-            type: 'Feature',
+            type: "Feature",
             properties: { NAME: countryName, ISO_A2: isoCode },
             geometry: {
-                type: 'MultiPolygon',
+                type: "MultiPolygon",
                 coordinates: coordinates,
@@ -50,6 +46,6 @@ },
         };
-        const path = (React.createElement(Region_1.default, { ref: triggerRef, d: pathGenerator(geoFeature), style: styleFunction(context), onClick: (event) => onClickFunction === null || onClickFunction === void 0 ? void 0 : onClickFunction(Object.assign(Object.assign({}, context), { event })), strokeOpacity: strokeOpacity, href: hrefFunction === null || hrefFunction === void 0 ? void 0 : hrefFunction(context), key: `path${idx}` }));
-        const tooltip = (0, draw_1.drawTooltip)(typeof context.countryValue === 'undefined'
+        const path = (React.createElement(Region, { ref: triggerRef, d: pathGenerator(geoFeature), style: styleFunction(context), onClick: onClick(context), strokeOpacity: strokeOpacity, href: hrefFunction === null || hrefFunction === void 0 ? void 0 : hrefFunction(context), key: countryName }));
+        const tooltip = drawTooltip(typeof context.countryValue === "undefined"
             ? undefined
-            : tooltipTextFunction(context), tooltipBgColor, tooltipTextColor, idx, triggerRef, containerRef);
+            : tooltipTextFunction(context), tooltipBgColor, tooltipTextColor, triggerRef, containerRef);
         return { path, highlightedTooltip: tooltip };
@@ -83,8 +79,7 @@ });
         React.createElement("svg", Object.assign({ ref: containerRef, height: `${height}px`, width: `${width}px` }, (richInteraction ? eventHandlers : undefined)),
-            frame && React.createElement(Frame_1.default, { color: frameColor }),
-            React.createElement("g", { transform: `translate(${translateX}, ${translateY}) scale(${(width / 960) * scale}) translate(0, 240)`, style: { transition: 'all 0.2s' } }, regionPaths),
-            React.createElement("g", null, textLabelFunction(width).map((props, idx) => (React.createElement(TextLabel_1.default, Object.assign({}, props, { key: `text_${idx}` }))))),
+            frame && React.createElement(Frame, { color: frameColor }),
+            React.createElement("g", { transform: `translate(${translateX}, ${translateY}) scale(${(width / 960) * scale}) translate(0, 240)`, style: { transition: "all 0.2s" } }, regionPaths),
+            React.createElement("g", null, textLabelFunction(width).map((labelProps) => (React.createElement(TextLabel, Object.assign({}, labelProps, { key: labelProps.label }))))),
             regionTooltips)));
 }
-exports.default = WorldMap;
-exports.WorldMap = WorldMap;
+export { WorldMap };

dist/types.d.ts

@@ -1,5 +0,5 @@
-import type { ComponentProps } from 'react';
+import type React from "react";
 declare const isoCodes: string[];
 export declare type ISOCode = typeof isoCodes[number] | Lowercase<typeof isoCodes[number]>;
-export declare type SizeOption = 'sm' | 'md' | 'lg' | 'xl' | 'xxl';
+export declare type SizeOption = "sm" | "md" | "lg" | "xl" | "xxl";
 export interface DataItem {
@@ -30,3 +30,3 @@ country: ISOCode;
     tooltipTextColor?: string;
-    size?: SizeOption | 'responsive' | number;
+    size?: SizeOption | "responsive" | number;
     frame?: boolean;
@@ -42,7 +42,7 @@ frameColor?: string;
     tooltipTextFunction?: (context: CountryContext) => string;
-    hrefFunction?: (context: CountryContext) => ComponentProps<'a'> | string | undefined;
+    hrefFunction?: (context: CountryContext) => React.ComponentProps<"a"> | string | undefined;
     textLabelFunction?: (width: number) => ({
         label: string;
-    } & ComponentProps<'text'>)[];
+    } & React.ComponentProps<"text">)[];
 }
 export {};

dist/types.js

@@ -1,4 +0,2 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const countries_geo_1 = require("./countries.geo");
-const isoCodes = countries_geo_1.default.features.map(({ I }) => I);
+import geoData from "./countries.geo";
+const isoCodes = geoData.features.map(({ I }) => I);

dist/utils.d.ts

@@ -1,3 +0,5 @@
-import type { SizeOption } from './types';
+import { useLayoutEffect } from "react";
+import type { SizeOption } from "./types";
+export declare const useIsomorphicLayoutEffect: typeof useLayoutEffect;
 export declare function useWindowWidth(): number;
-export declare function responsify(sizeOption: SizeOption | 'responsive', windowWidth: number): number;
+export declare function responsify(sizeOption: SizeOption | "responsive", windowWidth: number): number;

dist/utils.js

@@ -1,35 +0,29 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.responsify = exports.useWindowWidth = void 0;
-const React = require("react");
-const constants_1 = require("./constants");
-function useWindowWidth() {
-    const [width, setWidth] = React.useState(constants_1.sizeMap[constants_1.defaultSize]);
-    React.useLayoutEffect(() => {
+import { useState, useLayoutEffect, useEffect } from "react";
+import { sizeMap, defaultSize } from "./constants";
+export const useIsomorphicLayoutEffect = typeof window !== "undefined" ? useLayoutEffect : useEffect;
+export function useWindowWidth() {
+    const [width, setWidth] = useState(sizeMap[defaultSize]);
+    useIsomorphicLayoutEffect(() => {
         const updateWidth = () => {
             setWidth(window.innerWidth);
         };
-        window.addEventListener('resize', updateWidth);
+        window.addEventListener("resize", updateWidth);
         updateWidth();
-        return () => window.removeEventListener('resize', updateWidth);
+        return () => window.removeEventListener("resize", updateWidth);
     }, []);
     return width;
 }
-exports.useWindowWidth = useWindowWidth;
-function responsify(sizeOption, windowWidth) {
+export function responsify(sizeOption, windowWidth) {
     var _a;
-    if (sizeOption === 'responsive') {
-        if (typeof window === 'undefined') {
-            return constants_1.sizeMap[constants_1.defaultSize];
-        }
+    if (sizeOption === "responsive") {
+        if (typeof window === "undefined")
+            return sizeMap[defaultSize];
         return Math.min(window.innerHeight, window.innerWidth) * 0.75;
     }
-    if (typeof window === 'undefined') {
-        return constants_1.sizeMap[sizeOption];
-    }
-    const fittingSize = (_a = Object.values(constants_1.sizeMap)
+    if (typeof window === "undefined")
+        return sizeMap[sizeOption];
+    const fittingSize = (_a = Object.values(sizeMap)
         .reverse()
-        .find((size) => size <= windowWidth)) !== null && _a !== void 0 ? _a : constants_1.sizeMap.sm;
-    return Math.min(fittingSize, constants_1.sizeMap[sizeOption]);
+        .find((size) => size <= windowWidth)) !== null && _a !== void 0 ? _a : sizeMap.sm;
+    return Math.min(fittingSize, sizeMap[sizeOption]);
 }
-exports.responsify = responsify;

package.json

 {
   "name": "react-svg-worldmap",
-  "version": "2.0.0-alpha.0",
+  "version": "2.0.0-alpha.1",
   "license": "MIT",
@@ -19,14 +19,14 @@ "displayName": "React Worldmap",
   },
-  "peerDependencies": {
-    "react": ">=16",
-    "react-dom": ">=16.0.0"
-  },
   "dependencies": {
-    "d3-geo": "^1.11.9",
+    "d3-geo": "^3.0.1",
     "react-path-tooltip": "^1.0.17"
   },
   "devDependencies": {
-    "@types/d3-geo": "^1.12.1",
+    "@types/d3-geo": "^3.0.2",
     "@types/geojson": "^7946.0.7"
   },
+  "peerDependencies": {
+    "react": ">=16",
+    "react-dom": ">=16.0.0"
+  },
   "authors": [
@@ -45,5 +45,4 @@ "yanivam (https://github.com/yanivam)"
   ],
-  "module": "dist/react-svg-worldmap.esm.js",
   "bugs": "https://github.com/yanivam/react-svg-worldmap/issues",
   "repository": "github:yanivam/react-svg-worldmap"
 }

README.md

@@ -9,3 +9,3 @@ # react-svg-worldmap [![License: MIT](https://img.shields.io/badge/license-MIT-yellow.svg)](https://opensource.org/licenses/MIT) [![npm version](https://img.shields.io/npm/v/react-svg-worldmap.svg?style=flat)](https://www.npmjs.com/package/react-svg-worldmap)
 
-We use GitHub pages to provide documentation with ample of live examples. 
+We use GitHub pages to provide documentation with ample of live examples.
 
@@ -41,18 +41,18 @@ Give it a try at [yanivam.github.io/react-svg-worldmap](https://yanivam.github.io/react-svg-worldmap).
 ```tsx
-import React from 'react';
-import WorldMap from 'react-svg-worldmap';
-import './App.css';
+import React from "react";
+import WorldMap from "react-svg-worldmap";
+import "./App.css";
 
 function App() {
   const data = [
-    {country: 'cn', value: 1389618778}, // china
-    {country: 'in', value: 1311559204}, // india
-    {country: 'us', value: 331883986}, // united states
-    {country: 'id', value: 264935824}, // indonesia
-    {country: 'pk', value: 210797836}, // pakistan
-    {country: 'br', value: 210301591}, // brazil
-    {country: 'ng', value: 208679114}, // nigeria
-    {country: 'bd', value: 161062905}, // bangladesh
-    {country: 'ru', value: 141944641}, // russia
-    {country: 'mx', value: 127318112}, // mexico
+    { country: "cn", value: 1389618778 }, // china
+    { country: "in", value: 1311559204 }, // india
+    { country: "us", value: 331883986 }, // united states
+    { country: "id", value: 264935824 }, // indonesia
+    { country: "pk", value: 210797836 }, // pakistan
+    { country: "br", value: 210301591 }, // brazil
+    { country: "ng", value: 208679114 }, // nigeria
+    { country: "bd", value: 161062905 }, // bangladesh
+    { country: "ru", value: 141944641 }, // russia
+    { country: "mx", value: 127318112 }, // mexico
   ];
@@ -59,0 +59,0 @@

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Improved metrics

Number of medium supply chain risk alerts

0

decreased by-100%

Worsened metrics

Total package byte prevSize

222015

decreased by-0.54%

Lines of code

1747

decreased by-1.52%

Dependency changes

• + Addedd3-array@3.2.4(transitive)

• + Addedd3-geo@3.1.1(transitive)

• + Addedinternmap@2.0.3(transitive)

• - Removedd3-array@1.2.4(transitive)

• - Removedd3-geo@1.12.1(transitive)

• Updatedd3-geo@^3.0.1