Socket
Socket
Sign inDemoInstall

@react-google-maps/api

Package Overview
Dependencies
Maintainers
2
Versions
135
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@react-google-maps/api - npm Package Compare versions

Comparing version 2.2.0 to 2.3.0

dist/cjs.js

75

package.json
{
"name": "@react-google-maps/api",
"sideEffects": false,
"version": "2.2.0",
"version": "2.3.0",
"description": "React.js Google Maps API integration",

@@ -16,3 +16,4 @@ "license": "MIT",

"Ivan Konev <ivankonev@gmail.com> (https://github.com/ivankonev)",
"Daniel K. <klenicak@gmail.com> (https://github.com/fredyc)"
"Daniel K. <klenicak@gmail.com> (https://github.com/fredyc)",
"Kevin Brown <kevin.brown@exogee.com> (https://github.com/thekevinbrown)"
],

@@ -31,6 +32,6 @@ "repository": {

},
"main": "dist/index.js",
"main": "dist/cjs.js",
"types": "dist/index.d.ts",
"unpkg": "dist/reactgooglemapsapi.umd.production.min.js",
"module": "dist/reactgooglemapsapi.esm.js",
"unpkg": "dist/umd.min.js",
"module": "dist/esm.js",
"files": [

@@ -76,3 +77,3 @@ "src/",

"prebuild": "rimraf dist",
"build": "npx tsdx build --name reactGoogleMapsApi --format=cjs,esm,umd",
"build": "rollup --config",
"clean": "rimraf ./package-lock.json ./yarn.lock ./node_modules/ && yarn",

@@ -98,6 +99,7 @@ "update": "yarn-check -u",

"dependencies": {
"@googlemaps/js-api-loader": "1.11.4",
"@react-google-maps/infobox": "2.2.0",
"@react-google-maps/marker-clusterer": "2.2.0",
"invariant": "2.2.4"
"@googlemaps/js-api-loader": "1.12.3",
"@react-google-maps/infobox": "2.3.0",
"@react-google-maps/marker-clusterer": "2.3.0",
"invariant": "2.2.4",
"webpack": "^5.53.0"
},

@@ -109,31 +111,33 @@ "peerDependencies": {

"devDependencies": {
"@testing-library/react": "11.2.7",
"@rollup/plugin-commonjs": "20.0.0",
"@rollup/plugin-node-resolve": "13.0.4",
"@testing-library/react": "12.1.0",
"@types/googlemaps": "3.43.3",
"@types/invariant": "2.2.34",
"@types/jest": "26.0.23",
"@types/react": "17.0.6",
"@types/react-dom": "17.0.5",
"@types/invariant": "2.2.35",
"@types/jest": "27.0.1",
"@types/react": "17.0.22",
"@types/react-dom": "17.0.9",
"@types/webpack": "5.28.0",
"@typescript-eslint/eslint-plugin": "4.24.0",
"@typescript-eslint/parser": "4.24.0",
"acorn": "8.2.4",
"acorn-jsx": "5.3.1",
"@typescript-eslint/eslint-plugin": "4.31.1",
"@typescript-eslint/parser": "4.31.1",
"acorn": "8.5.0",
"acorn-jsx": "5.3.2",
"awesome-typescript-loader": "5.2.1",
"eslint": "7.26.0",
"eslint-config-standard": "16.0.2",
"eslint": "7.32.0",
"eslint-config-standard": "16.0.3",
"eslint-config-standard-react": "11.0.1",
"eslint-import-resolver-typescript": "2.4.0",
"eslint-import-resolver-typescript": "2.5.0",
"eslint-plugin-ascii": "1.0.0",
"eslint-plugin-babel": "5.3.1",
"eslint-plugin-compat": "3.9.0",
"eslint-plugin-compat": "3.13.0",
"eslint-plugin-filenames": "1.3.2",
"eslint-plugin-html": "6.1.2",
"eslint-plugin-import": "2.23.2",
"eslint-plugin-json": "3.0.0",
"eslint-plugin-import": "2.24.2",
"eslint-plugin-json": "3.1.0",
"eslint-plugin-jsx-a11y": "6.4.1",
"eslint-plugin-no-inferred-method-name": "2.0.0",
"eslint-plugin-node": "11.1.0",
"eslint-plugin-optimize-regex": "1.2.0",
"eslint-plugin-optimize-regex": "1.2.1",
"eslint-plugin-promise": "5.1.0",
"eslint-plugin-react": "7.23.2",
"eslint-plugin-react": "7.25.3",
"eslint-plugin-react-functional-set-state": "1.2.1",

@@ -145,16 +149,17 @@ "eslint-plugin-react-hooks": "4.2.0",

"eslint-plugin-you-dont-need-lodash-underscore": "6.12.0",
"jest": "26.6.3",
"jest-cli": "26.6.3",
"jest": "27.2.0",
"jest-cli": "27.2.0",
"react": "17.0.2",
"react-docgen": "5.4.0",
"react-docgen-typescript": "1.22.0",
"react-docgen-typescript": "2.1.0",
"react-dom": "17.0.2",
"react-styleguidist": "11.1.6",
"react-styleguidist": "11.1.7",
"rimraf": "3.0.2",
"ts-jest": "26.5.6",
"tsdx": "0.14.1",
"typescript": "4.2.4",
"webpack": "5.37.1"
"rollup": "2.56.3",
"rollup-plugin-terser": "7.0.2",
"rollup-plugin-ts": "1.4.2",
"ts-jest": "27.0.5",
"typescript": "4.4.3"
},
"gitHead": "80167ddcc3d8e356dbf0b0c3a6292c6a3a989f83"
}

@@ -44,2 +44,6 @@ # Marker example

```jsx
const { GoogleMap, LoadScript } = require("../../");
const ScriptLoaded = require("../../docs/ScriptLoaded").default;
const mapContainerStyle = {

@@ -96,1 +100,53 @@ height: "400px",

```
## Custom React Svg Marker Example
```jsx
import * as React from "react";
import { renderToStaticMarkup } from "react-dom/server";
const { GoogleMap, LoadScript } = require("../../");
const ScriptLoaded = require("../../docs/ScriptLoaded").default;
const mapContainerStyle = {
height: "400px",
width: "800px"
}
const centers = [{
lat: 37.772,
lng: -122.214
}];
/* Using a React component is not obligatory, you can use a simple function that returns a svg string
if you don't want to use renderToStaticMarkup and "react-dom/server" */
const SvgCircleMarker = () => {
/* Your component logic here */
return (
<svg viewBox="0 0 102 102">
<circle cx="51" cy="51" r="50" fill="powderblue" stroke="#333">
</svg>
);
}
const markerSvgString = encodeURIComponent(
renderToStaticMarkup(<SvgCircleMarker />)
);
const markerDataUri = `data:image/svg+xml,${markerSvgString}`;
/* If you want to optimize your svgs, don't hesitate to use https://github.com/tigt/mini-svg-data-uri */
<ScriptLoaded>
<GoogleMap
id="react-marker-example"
mapContainerStyle={mapContainerStyle}
zoom={2}
center={centers[0]}
>
<Marker
icon={markerDataUri}
position={centers[0]}
/>
</GoogleMap>
</ScriptLoaded>
```

Sorry, the diff of this file is too big to display

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc