@symfony/ux-google-map 2.36.1 → 3.1.0

package/README.md

@@ -19,7 +19,7 @@ npm add @symfony/ux-google-map@2.23.0
 
 ## Resources
 
-- [Documentation](https://github.com/symfony/ux/tree/2.x/src/Map/src/Bridge/Google)
+- [Documentation](https://github.com/symfony/ux/tree/3.x/src/Map/src/Bridge/Google)
 - [Report issues](https://github.com/symfony/ux/issues) and
   [send Pull Requests](https://github.com/symfony/ux/pulls)
   in the [main Symfony UX repository](https://github.com/symfony/ux)

package/dist/map_controller.d.ts

@@ -1,4 +1,4 @@
-import { LoaderOptions } from "@googlemaps/js-api-loader";
+import { APIOptions } from "@googlemaps/js-api-loader";
 import { Controller } from "@hotwired/stimulus";
 type Point = {
   lat: number;
@@ -42,23 +42,18 @@ type MarkerDefinition<BridgeMarkerOptions, BridgeInfoWindowOptions> = WithIdenti
   title: string | null;
   infoWindow?: Omit<InfoWindowDefinition<BridgeInfoWindowOptions>, 'position'>;
   icon?: Icon;
-  rawOptions?: BridgeMarkerOptions;
   bridgeOptions?: BridgeMarkerOptions;
   extra: ExtraData;
 }>;
 type PolygonDefinition<BridgePolygonOptions, BridgeInfoWindowOptions> = WithIdentifier<{
   infoWindow?: Omit<InfoWindowDefinition<BridgeInfoWindowOptions>, 'position'>;
   points: Array<Point> | Array<Array<Point>>;
-  title: string | null;
-  rawOptions?: BridgePolygonOptions;
   bridgeOptions?: BridgePolygonOptions;
   extra: ExtraData;
 }>;
 type PolylineDefinition<BridgePolylineOptions, BridgeInfoWindowOptions> = WithIdentifier<{
   infoWindow?: Omit<InfoWindowDefinition<BridgeInfoWindowOptions>, 'position'>;
   points: Array<Point>;
-  title: string | null;
-  rawOptions?: BridgePolylineOptions;
   bridgeOptions?: BridgePolylineOptions;
   extra: ExtraData;
 }>;
@@ -66,8 +61,6 @@ type CircleDefinition<BridgeCircleOptions, BridgeInfoWindowOptions> = WithIdenti
   infoWindow?: Omit<InfoWindowDefinition<BridgeInfoWindowOptions>, 'position'>;
   center: Point;
   radius: number;
-  title: string | null;
-  rawOptions?: BridgeCircleOptions;
   bridgeOptions?: BridgeCircleOptions;
   extra: ExtraData;
 }>;
@@ -75,8 +68,6 @@ type RectangleDefinition<BridgeRectangleOptions, BridgeInfoWindowOptions> = With
   infoWindow?: Omit<InfoWindowDefinition<BridgeInfoWindowOptions>, 'position'>;
   southWest: Point;
   northEast: Point;
-  title: string | null;
-  rawOptions?: BridgeRectangleOptions;
   bridgeOptions?: BridgeRectangleOptions;
   extra: ExtraData;
 }>;
@@ -86,7 +77,6 @@ type InfoWindowDefinition<BridgeInfoWindowOptions> = {
   position: Point;
   opened: boolean;
   autoClose: boolean;
-  rawOptions?: BridgeInfoWindowOptions;
   bridgeOptions?: BridgeInfoWindowOptions;
   extra: ExtraData;
 };
@@ -216,7 +206,7 @@ declare abstract class export_default$1<MapOptions, BridgeMapOptions, BridgeMap,
 }
 type MapOptions = Pick<google.maps.MapOptions, 'mapId' | 'gestureHandling' | 'backgroundColor' | 'disableDoubleClickZoom' | 'zoomControl' | 'zoomControlOptions' | 'mapTypeControl' | 'mapTypeControlOptions' | 'streetViewControl' | 'streetViewControlOptions' | 'fullscreenControl' | 'fullscreenControlOptions'>;
 declare class export_default extends export_default$1<MapOptions, google.maps.MapOptions, google.maps.Map, google.maps.marker.AdvancedMarkerElementOptions, google.maps.marker.AdvancedMarkerElement, google.maps.InfoWindowOptions, google.maps.InfoWindow, google.maps.PolygonOptions, google.maps.Polygon, google.maps.PolylineOptions, google.maps.Polyline, google.maps.CircleOptions, google.maps.Circle, google.maps.RectangleOptions, google.maps.Rectangle> {
-  providerOptionsValue: Pick<LoaderOptions, 'apiKey' | 'id' | 'language' | 'region' | 'nonce' | 'retries' | 'url' | 'version' | 'libraries'>;
+  providerOptionsValue: Pick<APIOptions, 'key' | 'v' | 'language' | 'region' | 'libraries' | 'authReferrerPolicy' | 'mapIds' | 'channel' | 'solutionChannel'>;
   map: google.maps.Map;
   connect(): Promise<void>;
   centerValueChanged(): void;

package/dist/map_controller.js

@@ -1,4 +1,4 @@
-import { Loader } from "@googlemaps/js-api-loader";
+import { importLibrary, setOptions } from "@googlemaps/js-api-loader";
 import { Controller } from "@hotwired/stimulus";
 const IconTypes = {
 	Url: "url",
@@ -104,7 +104,6 @@ var _Class = class extends Controller {
 		const eventAfter = `${type}:after-create`;
 		return ({ definition }) => {
 			this.dispatchEvent(eventBefore, { definition });
-			if (typeof definition.rawOptions !== "undefined") console.warn(`[Symfony UX Map] The event "${eventBefore}" added a deprecated "rawOptions" property to the definition, it will be removed in a next major version, replace it with "bridgeOptions" instead.`, definition);
 			const drawing = factory({ definition });
 			this.dispatchEvent(eventAfter, {
 				[type]: drawing,
@@ -143,7 +142,6 @@ _Class.values = {
 	options: Object,
 	extra: Object
 };
-let _google;
 let _loading = false;
 let _loaded = false;
 let _onLoadedCallbacks = [];
@@ -160,26 +158,10 @@ var map_controller_default = class extends _Class {
 			return;
 		}
 		_loading = true;
-		_google = { maps: {} };
 		let { libraries = [], ...loaderOptions } = this.providerOptionsValue;
-		const loader = new Loader(loaderOptions);
+		setOptions(loaderOptions);
 		libraries = ["core", ...libraries.filter((library) => library !== "core")];
-		(await Promise.all(libraries.map((library) => loader.importLibrary(library)))).forEach((libraryImplementation, index) => {
-			if (typeof libraryImplementation !== "object" || libraryImplementation === null) return;
-			const library = libraries[index];
-			if ([
-				"marker",
-				"places",
-				"geometry",
-				"journeySharing",
-				"drawing",
-				"visualization"
-			].includes(library)) _google.maps[library] = libraryImplementation;
-			else _google.maps = {
-				..._google.maps,
-				...libraryImplementation
-			};
-		});
+		await Promise.all(libraries.map((library) => importLibrary(library)));
 		_loading = false;
 		_loaded = true;
 		onLoaded();
@@ -201,7 +183,7 @@ var map_controller_default = class extends _Class {
 		if (this.map && this.hasMaxZoomValue && this.maxZoomValue) this.map.setOptions({ maxZoom: this.maxZoomValue });
 	}
 	dispatchEvent(name, payload = {}) {
-		payload.google = _google;
+		payload.google = google;
 		this.dispatch(name, {
 			prefix: "ux:map",
 			detail: payload
@@ -213,7 +195,7 @@ var map_controller_default = class extends _Class {
 		options.mapTypeControl = typeof options.mapTypeControlOptions !== "undefined";
 		options.streetViewControl = typeof options.streetViewControlOptions !== "undefined";
 		options.fullscreenControl = typeof options.fullscreenControlOptions !== "undefined";
-		return new _google.maps.Map(this.element, {
+		return new google.maps.Map(this.element, {
 			center,
 			zoom,
 			minZoom,
@@ -223,12 +205,11 @@ var map_controller_default = class extends _Class {
 		});
 	}
 	doCreateMarker({ definition }) {
-		const { "@id": _id, position, title, infoWindow, icon, rawOptions = {}, bridgeOptions = {} } = definition;
-		const marker = new _google.maps.marker.AdvancedMarkerElement({
+		const { "@id": _id, position, title, infoWindow, icon, bridgeOptions = {} } = definition;
+		const marker = new google.maps.marker.AdvancedMarkerElement({
 			position,
 			title,
 			map: this.map,
-			...rawOptions,
 			...bridgeOptions
 		});
 		if (infoWindow) this.createInfoWindow({
@@ -237,7 +218,6 @@ var map_controller_default = class extends _Class {
 		});
 		if (icon) {
 			if (Object.prototype.hasOwnProperty.call(bridgeOptions, "content")) console.warn("[Symfony UX Map] Defining \"bridgeOptions.content\" for a marker with a custom icon is not supported and will be ignored.");
-			else if (Object.prototype.hasOwnProperty.call(rawOptions, "content")) console.warn("[Symfony UX Map] Defining \"rawOptions.content\" for a marker with a custom icon is not supported and will be ignored.");
 			this.doCreateIcon({
 				definition: icon,
 				element: marker
@@ -249,17 +229,12 @@ var map_controller_default = class extends _Class {
 		marker.map = null;
 	}
 	doCreatePolygon({ definition }) {
-		const { "@id": _id, points, title, infoWindow, rawOptions = {}, bridgeOptions = {} } = definition;
-		const polygon = new _google.maps.Polygon({
+		const { "@id": _id, points, infoWindow, bridgeOptions = {} } = definition;
+		const polygon = new google.maps.Polygon({
 			paths: points,
 			map: this.map,
-			...rawOptions,
 			...bridgeOptions
 		});
-		/**
-		* @deprecated since Symfony UX Map 2.29, will be removed in 3.0
-		*/
-		if (title) polygon.set("title", title);
 		if (infoWindow) this.createInfoWindow({
 			definition: infoWindow,
 			element: polygon
@@ -270,17 +245,12 @@ var map_controller_default = class extends _Class {
 		polygon.setMap(null);
 	}
 	doCreatePolyline({ definition }) {
-		const { "@id": _id, points, title, infoWindow, rawOptions = {}, bridgeOptions = {} } = definition;
-		const polyline = new _google.maps.Polyline({
+		const { "@id": _id, points, infoWindow, bridgeOptions = {} } = definition;
+		const polyline = new google.maps.Polyline({
 			path: points,
 			map: this.map,
-			...rawOptions,
 			...bridgeOptions
 		});
-		/**
-		* @deprecated since Symfony UX Map 2.29, will be removed in 3.0
-		*/
-		if (title) polyline.set("title", title);
 		if (infoWindow) this.createInfoWindow({
 			definition: infoWindow,
 			element: polyline
@@ -291,18 +261,13 @@ var map_controller_default = class extends _Class {
 		polyline.setMap(null);
 	}
 	doCreateCircle({ definition }) {
-		const { "@id": _id, center, radius, title, infoWindow, rawOptions = {}, bridgeOptions = {} } = definition;
-		const circle = new _google.maps.Circle({
+		const { "@id": _id, center, radius, infoWindow, bridgeOptions = {} } = definition;
+		const circle = new google.maps.Circle({
 			center,
 			radius,
 			map: this.map,
-			...rawOptions,
 			...bridgeOptions
 		});
-		/**
-		* @deprecated since Symfony UX Map 2.29, will be removed in 3.0
-		*/
-		if (title) circle.set("title", title);
 		if (infoWindow) this.createInfoWindow({
 			definition: infoWindow,
 			element: circle
@@ -313,17 +278,12 @@ var map_controller_default = class extends _Class {
 		circle.setMap(null);
 	}
 	doCreateRectangle({ definition }) {
-		const { northEast, southWest, title, infoWindow, rawOptions = {}, bridgeOptions = {} } = definition;
-		const rectangle = new _google.maps.Rectangle({
-			bounds: new _google.maps.LatLngBounds(southWest, northEast),
+		const { northEast, southWest, infoWindow, bridgeOptions = {} } = definition;
+		const rectangle = new google.maps.Rectangle({
+			bounds: new google.maps.LatLngBounds(southWest, northEast),
 			map: this.map,
-			...rawOptions,
 			...bridgeOptions
 		});
-		/**
-		* @deprecated since Symfony UX Map 2.29, will be removed in 3.0
-		*/
-		if (title) rectangle.set("title", title);
 		if (infoWindow) this.createInfoWindow({
 			definition: infoWindow,
 			element: rectangle
@@ -334,7 +294,7 @@ var map_controller_default = class extends _Class {
 		rectangle.setMap(null);
 	}
 	doCreateInfoWindow({ definition, element }) {
-		const { headerContent, content, opened, autoClose, rawOptions = {}, bridgeOptions = {} } = definition;
+		const { headerContent, content, opened, autoClose, bridgeOptions = {} } = definition;
 		let position = null;
 		if (element instanceof google.maps.Circle) position = element.getCenter();
 		else if (element instanceof google.maps.Rectangle) position = element.getBounds()?.getCenter() || null;
@@ -343,10 +303,9 @@ var map_controller_default = class extends _Class {
 			headerContent: this.createTextOrElement(headerContent),
 			content: this.createTextOrElement(content),
 			position,
-			...rawOptions,
 			...bridgeOptions
 		};
-		const infoWindow = new _google.maps.InfoWindow(infoWindowOptions);
+		const infoWindow = new google.maps.InfoWindow(infoWindowOptions);
 		element.addListener("click", (event) => {
 			if (autoClose) this.closeInfoWindowsExcept(infoWindow);
 			if (infoWindowOptions.position === null) infoWindow.setPosition(event.latLng);

package/package.json

@@ -2,7 +2,7 @@
   "name": "@symfony/ux-google-map",
   "description": "GoogleMaps bridge for Symfony UX Map, integrate interactive maps in your Symfony applications",
   "license": "MIT",
-  "version": "2.36.1",
+  "version": "3.1.0",
   "keywords": [
     "symfony-ux",
     "google-maps",
@@ -27,12 +27,12 @@
     },
     "importmap": {
       "@hotwired/stimulus": "^3.0.0",
-      "@googlemaps/js-api-loader": "^1.16.6",
+      "@googlemaps/js-api-loader": "^2.0.0",
       "@symfony/ux-google-map": "path:%PACKAGE%/dist/map_controller.js"
     }
   },
   "peerDependencies": {
-    "@googlemaps/js-api-loader": "^1.16.6",
+    "@googlemaps/js-api-loader": "^2.0.0",
     "@hotwired/stimulus": "^3.0.0"
   },
   "peerDependenciesMeta": {
@@ -41,7 +41,7 @@
     }
   },
   "devDependencies": {
-    "@googlemaps/js-api-loader": "^1.16.6",
+    "@googlemaps/js-api-loader": "^2.0.0",
     "@hotwired/stimulus": "^3.0.0",
     "@testing-library/dom": "^10.4.0",
     "@testing-library/jest-dom": "^6.6.3",