@sanity/google-maps-input 4.2.1 → 5.0.0

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.
Files changed (39) hide show
  1. package/LICENSE +1 -1
  2. package/assets/google-maps-input.png +0 -0
  3. package/assets/google-maps-radius-input.png +0 -0
  4. package/dist/index.d.ts +54 -84
  5. package/dist/index.d.ts.map +1 -0
  6. package/dist/index.js +736 -652
  7. package/dist/index.js.map +1 -1
  8. package/package.json +35 -79
  9. package/dist/index.cjs +0 -1014
  10. package/dist/index.cjs.map +0 -1
  11. package/dist/index.d.cts +0 -85
  12. package/sanity.json +0 -8
  13. package/src/diff/GeopointArrayDiff.tsx +0 -86
  14. package/src/diff/GeopointFieldDiff.styles.tsx +0 -20
  15. package/src/diff/GeopointFieldDiff.tsx +0 -97
  16. package/src/diff/GeopointMove.tsx +0 -48
  17. package/src/diff/GeopointRadiusFieldDiff.tsx +0 -136
  18. package/src/diff/GeopointRadiusMove.tsx +0 -92
  19. package/src/diff/resolver.ts +0 -26
  20. package/src/global-workaround.ts +0 -11
  21. package/src/index.ts +0 -20
  22. package/src/input/GeopointInput.styles.tsx +0 -11
  23. package/src/input/GeopointInput.tsx +0 -179
  24. package/src/input/GeopointRadiusInput.tsx +0 -258
  25. package/src/input/GeopointRadiusSelect.tsx +0 -193
  26. package/src/input/GeopointSelect.tsx +0 -79
  27. package/src/loader/GoogleMapsLoadProxy.tsx +0 -62
  28. package/src/loader/LoadError.tsx +0 -43
  29. package/src/loader/loadGoogleMapsApi.ts +0 -77
  30. package/src/map/Arrow.tsx +0 -76
  31. package/src/map/Map.styles.tsx +0 -10
  32. package/src/map/Map.tsx +0 -125
  33. package/src/map/Marker.tsx +0 -130
  34. package/src/map/SearchInput.styles.tsx +0 -8
  35. package/src/map/SearchInput.tsx +0 -56
  36. package/src/map/util.ts +0 -14
  37. package/src/plugin.tsx +0 -92
  38. package/src/types.ts +0 -46
  39. package/v2-incompatible.js +0 -10
package/dist/index.js CHANGED
@@ -1,21 +1,56 @@
1
1
  import { jsxs, jsx, Fragment } from "react/jsx-runtime";
2
- import { useState, useEffect, PureComponent, createRef, useCallback, useId, useRef } from "react";
3
- import { Card, Box, Text, Code, TextInput, Stack, Grid, Button, Dialog, Label } from "@sanity/ui";
2
+ import { c } from "react/compiler-runtime";
4
3
  import { EditIcon, TrashIcon } from "@sanity/icons";
5
- import { setIfMissing, set, unset, ChangeIndicator, useUserColor, getAnnotationAtPath, DiffTooltip, definePlugin } from "sanity";
4
+ import { Card, Box, Text, Code, TextInput, Stack, Button, Grid, Dialog, Label } from "@sanity/ui";
5
+ import { useState, useEffect, PureComponent, createRef, useId, useRef } from "react";
6
+ import { ChangeIndicator, setIfMissing, set, unset, useUserColor, getAnnotationAtPath, DiffTooltip, definePlugin } from "sanity";
6
7
  import { styled } from "styled-components";
8
+ let config;
9
+ function getGeoConfig() {
10
+ return config;
11
+ }
12
+ function setGeoConfig(newConfig) {
13
+ config = newConfig;
14
+ }
15
+ function LoadError(props) {
16
+ const $ = c(3);
17
+ let t0;
18
+ $[0] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (t0 = /* @__PURE__ */ jsx(Box, { as: "header", paddingX: 4, paddingTop: 4, paddingBottom: 1, children: /* @__PURE__ */ jsx(Text, { as: "h2", weight: "bold", children: "Google Maps failed to load" }) }), $[0] = t0) : t0 = $[0];
19
+ let t1;
20
+ return $[1] !== props ? (t1 = /* @__PURE__ */ jsxs(Card, { tone: "critical", radius: 1, children: [
21
+ t0,
22
+ /* @__PURE__ */ jsx(Box, { paddingX: 4, paddingTop: 4, paddingBottom: 1, children: props.isAuthError ? /* @__PURE__ */ jsx(AuthError$1, {}) : /* @__PURE__ */ jsxs(Fragment, { children: [
23
+ /* @__PURE__ */ jsx(Text, { as: "h3", children: "Error details:" }),
24
+ /* @__PURE__ */ jsx("pre", { children: /* @__PURE__ */ jsx(Code, { size: 1, children: "error" in props && props.error?.message }) })
25
+ ] }) })
26
+ ] }), $[1] = props, $[2] = t1) : t1 = $[2], t1;
27
+ }
28
+ function AuthError$1() {
29
+ const $ = c(1);
30
+ let t0;
31
+ return $[0] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (t0 = /* @__PURE__ */ jsxs(Text, { children: [
32
+ /* @__PURE__ */ jsx("p", { children: "The error appears to be related to authentication" }),
33
+ /* @__PURE__ */ jsx("p", { children: "Common causes include:" }),
34
+ /* @__PURE__ */ jsxs("ul", { children: [
35
+ /* @__PURE__ */ jsx("li", { children: "Incorrect API key" }),
36
+ /* @__PURE__ */ jsx("li", { children: "Referer not allowed" }),
37
+ /* @__PURE__ */ jsx("li", { children: "Missing authentication scope" })
38
+ ] }),
39
+ /* @__PURE__ */ jsx("p", { children: "Check the browser developer tools for more information." })
40
+ ] }), $[0] = t0) : t0 = $[0], t0;
41
+ }
7
42
  const callbackName = "___sanity_googleMapsApiCallback", authFailureCallbackName = "gm_authFailure";
8
- let AuthError$1 = class extends Error {
9
- };
43
+ class AuthError extends Error {
44
+ }
10
45
  function _loadGoogleMapsApi(config2) {
11
46
  return new Promise((resolve, reject) => {
12
47
  window[authFailureCallbackName] = () => {
13
- reject(new AuthError$1("Authentication error when loading Google Maps API."));
48
+ reject(new AuthError("Authentication error when loading Google Maps API."));
14
49
  }, window[callbackName] = () => {
15
50
  resolve(window.google.maps);
16
51
  };
17
52
  const script = document.createElement("script");
18
- script.onerror = (event, source, lineno, colno, error) => reject(new Error(coeerceError(event, error))), script.src = `https://maps.googleapis.com/maps/api/js?key=${config2.apiKey}&libraries=places&callback=${callbackName}&language=${config2.locale}`, document.getElementsByTagName("head")[0].appendChild(script);
53
+ script.addEventListener("error", (event) => reject(new Error(coeerceError(event)))), script.src = `https://maps.googleapis.com/maps/api/js?key=${config2.apiKey}&libraries=places&callback=${callbackName}&language=${config2.locale}`, document.head.appendChild(script);
19
54
  }).finally(() => {
20
55
  delete window[callbackName], delete window[authFailureCallbackName];
21
56
  });
@@ -27,125 +62,78 @@ function loadGoogleMapsApi(config2) {
27
62
  }), memo);
28
63
  }
29
64
  function coeerceError(event, error) {
30
- return error ? error.message : typeof event == "string" ? event : isErrorEvent(event) ? event.message : "Failed to load Google Maps API";
65
+ return typeof event == "string" ? event : isErrorEvent(event) ? event.message : "Failed to load Google Maps API";
31
66
  }
32
67
  function isErrorEvent(event) {
33
68
  return typeof event != "object" || event === null || !("message" in event) ? !1 : typeof event.message == "string";
34
69
  }
35
- function LoadError(props) {
36
- return /* @__PURE__ */ jsxs(Card, { tone: "critical", radius: 1, children: [
37
- /* @__PURE__ */ jsx(Box, { as: "header", paddingX: 4, paddingTop: 4, paddingBottom: 1, children: /* @__PURE__ */ jsx(Text, { as: "h2", weight: "bold", children: "Google Maps failed to load" }) }),
38
- /* @__PURE__ */ jsx(Box, { paddingX: 4, paddingTop: 4, paddingBottom: 1, children: props.isAuthError ? /* @__PURE__ */ jsx(AuthError2, {}) : /* @__PURE__ */ jsxs(Fragment, { children: [
39
- /* @__PURE__ */ jsx(Text, { as: "h3", children: "Error details:" }),
40
- /* @__PURE__ */ jsx("pre", { children: /* @__PURE__ */ jsx(Code, { size: 1, children: "error" in props && props.error?.message }) })
41
- ] }) })
42
- ] });
43
- }
44
- function AuthError2() {
45
- return /* @__PURE__ */ jsxs(Text, { children: [
46
- /* @__PURE__ */ jsx("p", { children: "The error appears to be related to authentication" }),
47
- /* @__PURE__ */ jsx("p", { children: "Common causes include:" }),
48
- /* @__PURE__ */ jsxs("ul", { children: [
49
- /* @__PURE__ */ jsx("li", { children: "Incorrect API key" }),
50
- /* @__PURE__ */ jsx("li", { children: "Referer not allowed" }),
51
- /* @__PURE__ */ jsx("li", { children: "Missing authentication scope" })
52
- ] }),
53
- /* @__PURE__ */ jsx("p", { children: "Check the browser developer tools for more information." })
54
- ] });
55
- }
56
70
  const browserLocale = typeof window < "u" && window.navigator.language || "en";
57
71
  function useLoadGoogleMapsApi(config2) {
58
- const locale = config2.defaultLocale || browserLocale, [state, setState] = useState({ type: "loading" });
59
- return useEffect(() => {
60
- typeof window > "u" || loadGoogleMapsApi({ locale, apiKey: config2.apiKey }).then(
61
- (api) => setState({ type: "loaded", api }),
62
- (err) => setState({
63
- type: "error",
64
- error: { type: err instanceof AuthError$1 ? "authError" : "loadError", message: err.message }
65
- })
66
- );
67
- }, [locale, config2.apiKey]), state;
72
+ const $ = c(5), locale = config2.defaultLocale || browserLocale;
73
+ let t0;
74
+ $[0] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (t0 = {
75
+ type: "loading"
76
+ }, $[0] = t0) : t0 = $[0];
77
+ const [state, setState] = useState(t0);
78
+ let t1, t2;
79
+ return $[1] !== config2.apiKey || $[2] !== locale ? (t1 = () => {
80
+ typeof window > "u" || loadGoogleMapsApi({
81
+ locale,
82
+ apiKey: config2.apiKey
83
+ }).then((api) => setState({
84
+ type: "loaded",
85
+ api
86
+ }), (err) => setState({
87
+ type: "error",
88
+ error: {
89
+ type: err instanceof AuthError ? "authError" : "loadError",
90
+ message: err.message
91
+ }
92
+ }));
93
+ }, t2 = [locale, config2.apiKey], $[1] = config2.apiKey, $[2] = locale, $[3] = t1, $[4] = t2) : (t1 = $[3], t2 = $[4]), useEffect(t1, t2), state;
68
94
  }
69
95
  function GoogleMapsLoadProxy(props) {
70
- const loadState = useLoadGoogleMapsApi(props.config);
96
+ const $ = c(7), loadState = useLoadGoogleMapsApi(props.config);
71
97
  switch (loadState.type) {
72
- case "error":
73
- return /* @__PURE__ */ jsx(LoadError, { error: loadState.error, isAuthError: loadState.error.type === "authError" });
74
- case "loading":
75
- return /* @__PURE__ */ jsx("div", { children: "Loading Google Maps API" });
76
- case "loaded":
77
- return props.children(loadState.api);
98
+ case "error": {
99
+ const t0 = loadState.error.type === "authError";
100
+ let t1;
101
+ return $[0] !== loadState.error || $[1] !== t0 ? (t1 = /* @__PURE__ */ jsx(LoadError, { error: loadState.error, isAuthError: t0 }), $[0] = loadState.error, $[1] = t0, $[2] = t1) : t1 = $[2], t1;
102
+ }
103
+ case "loading": {
104
+ let t0;
105
+ return $[3] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (t0 = /* @__PURE__ */ jsx("div", { children: "Loading Google Maps API" }), $[3] = t0) : t0 = $[3], t0;
106
+ }
107
+ case "loaded": {
108
+ let t0;
109
+ return $[4] !== loadState.api || $[5] !== props.children ? (t0 = props.children(loadState.api), $[4] = loadState.api, $[5] = props.children, $[6] = t0) : t0 = $[6], t0;
110
+ }
78
111
  default:
79
112
  return null;
80
113
  }
81
114
  }
82
- let config;
83
- function getGeoConfig() {
84
- return config;
85
- }
86
- function setGeoConfig(newConfig) {
87
- config = newConfig;
88
- }
89
- const PreviewImage = styled.img`
90
- width: 100%;
91
- height: auto;
92
- vertical-align: top;
93
- `, DialogInnerContainer = styled.div`
94
- height: 40rem;
95
- `, WrapperContainer = styled.div`
96
- position: absolute;
97
- right: 10px;
98
- top: 10px;
99
- width: 220px;
100
- `;
101
- class SearchInput extends PureComponent {
102
- searchInputRef = createRef();
103
- autoComplete;
104
- handleChange = () => {
105
- this.autoComplete && (this.props.onChange(this.autoComplete.getPlace()), this.searchInputRef.current && (this.searchInputRef.current.value = ""));
106
- };
107
- componentDidMount() {
108
- const input = this.searchInputRef.current;
109
- if (!input)
110
- return;
111
- const { api, map } = this.props, { Circle, places, event } = api, searchBounds = new Circle({ center: map.getCenter(), radius: 100 }).getBounds();
112
- this.autoComplete = new places.Autocomplete(input, {
113
- bounds: searchBounds,
114
- types: []
115
- // return all kinds of places
116
- }), event.addListener(this.autoComplete, "place_changed", this.handleChange);
117
- }
118
- render() {
119
- return /* @__PURE__ */ jsx(WrapperContainer, { children: /* @__PURE__ */ jsx(
120
- TextInput,
121
- {
122
- name: "place",
123
- ref: this.searchInputRef,
124
- placeholder: "Search for place or address",
125
- padding: 4
126
- }
127
- ) });
128
- }
129
- }
115
+ const PreviewImage = styled.img.withConfig({
116
+ displayName: "PreviewImage",
117
+ componentId: "sc-10h92ni-0"
118
+ })`width:100%;height:auto;vertical-align:top;`, DialogInnerContainer = styled.div.withConfig({
119
+ displayName: "DialogInnerContainer",
120
+ componentId: "sc-10h92ni-1"
121
+ })`height:40rem;`, MapContainer = styled.div.withConfig({
122
+ displayName: "MapContainer",
123
+ componentId: "sc-gcrwqq-0"
124
+ })`position:absolute;top:0;left:0;height:100%;width:100%;box-sizing:border-box;`;
130
125
  function latLngAreEqual(latLng1, latLng2) {
131
126
  const lat1 = typeof latLng1.lat == "function" ? latLng1.lat() : latLng1.lat, lng1 = typeof latLng1.lng == "function" ? latLng1.lng() : latLng1.lng, lat2 = typeof latLng2.lat == "function" ? latLng2.lat() : latLng2.lat, lng2 = typeof latLng2.lng == "function" ? latLng2.lng() : latLng2.lng;
132
127
  return lat1 === lat2 && lng1 === lng2;
133
128
  }
134
- const MapContainer = styled.div`
135
- position: absolute;
136
- top: 0;
137
- left: 0;
138
- height: 100%;
139
- width: 100%;
140
- box-sizing: border-box;
141
- `;
142
129
  class GoogleMap extends PureComponent {
143
130
  static defaultProps = {
144
131
  defaultZoom: 8,
145
132
  scrollWheel: !0
146
133
  };
147
- state = { map: void 0 };
148
- clickHandler;
134
+ state = {
135
+ map: void 0
136
+ };
149
137
  mapRef = createRef();
150
138
  mapEl = null;
151
139
  componentDidMount() {
@@ -155,25 +143,44 @@ class GoogleMap extends PureComponent {
155
143
  const map = this.state.map;
156
144
  if (!map)
157
145
  return;
158
- const { api, onClick } = this.props, { event } = api;
146
+ const {
147
+ api,
148
+ onClick
149
+ } = this.props, {
150
+ event
151
+ } = api;
159
152
  this.clickHandler && this.clickHandler.remove(), onClick && (this.clickHandler = event.addListener(map, "click", onClick));
160
153
  };
161
154
  componentDidUpdate(prevProps) {
162
155
  const map = this.state.map;
163
156
  if (!map)
164
157
  return;
165
- const { onClick, location, bounds } = this.props;
158
+ const {
159
+ onClick,
160
+ location,
161
+ bounds
162
+ } = this.props;
166
163
  prevProps.onClick !== onClick && this.attachClickHandler(), latLngAreEqual(prevProps.location, location) || map.panTo(this.getCenter()), bounds && (!prevProps.bounds || !bounds.equals(prevProps.bounds)) && map.fitBounds(bounds);
167
164
  }
168
165
  componentWillUnmount() {
169
166
  this.clickHandler && this.clickHandler.remove();
170
167
  }
171
168
  getCenter() {
172
- const { location, api } = this.props;
169
+ const {
170
+ location,
171
+ api
172
+ } = this.props;
173
173
  return new api.LatLng(location.lat, location.lng);
174
174
  }
175
175
  constructMap(el) {
176
- const { defaultZoom, api, mapTypeControl, controlSize, bounds, scrollWheel } = this.props, map = new api.Map(el, {
176
+ const {
177
+ defaultZoom,
178
+ api,
179
+ mapTypeControl,
180
+ controlSize,
181
+ bounds,
182
+ scrollWheel
183
+ } = this.props, map = new api.Map(el, {
177
184
  zoom: defaultZoom,
178
185
  center: this.getCenter(),
179
186
  scrollwheel: scrollWheel,
@@ -186,12 +193,18 @@ class GoogleMap extends PureComponent {
186
193
  setMapElement = (element) => {
187
194
  if (element && element !== this.mapEl) {
188
195
  const map = this.constructMap(element);
189
- this.setState({ map }, this.attachClickHandler);
196
+ this.setState({
197
+ map
198
+ }, this.attachClickHandler);
190
199
  }
191
200
  this.mapEl = element;
192
201
  };
193
202
  render() {
194
- const { children } = this.props, { map } = this.state;
203
+ const {
204
+ children
205
+ } = this.props, {
206
+ map
207
+ } = this.state;
195
208
  return /* @__PURE__ */ jsxs(Fragment, { children: [
196
209
  /* @__PURE__ */ jsx(MapContainer, { ref: this.setMapElement }),
197
210
  children && map ? children(map) : null
@@ -200,10 +213,21 @@ class GoogleMap extends PureComponent {
200
213
  }
201
214
  const markerPath = "M 3.052 3.7 C 1.56 5.293 0.626 7.612 0.663 9.793 C 0.738 14.352 2.793 16.077 6.078 22.351 C 7.263 25.111 8.497 28.032 9.672 32.871 C 9.835 33.584 9.994 34.246 10.069 34.305 C 10.143 34.362 10.301 33.697 10.465 32.983 C 11.639 28.145 12.875 25.226 14.059 22.466 C 17.344 16.192 19.398 14.466 19.474 9.908 C 19.511 7.727 18.574 5.405 17.083 3.814 C 15.379 1.994 12.809 0.649 10.069 0.593 C 7.328 0.536 4.756 1.882 3.052 3.7 Z";
202
215
  class Marker extends PureComponent {
203
- marker;
204
216
  eventHandlers = {};
205
217
  componentDidMount() {
206
- const { position, api, map, onMove, zIndex, opacity, label, markerRef, color } = this.props, { Marker: GMarker } = api;
218
+ const {
219
+ position,
220
+ api,
221
+ map,
222
+ onMove,
223
+ zIndex,
224
+ opacity,
225
+ label,
226
+ markerRef,
227
+ color
228
+ } = this.props, {
229
+ Marker: GMarker
230
+ } = api;
207
231
  let icon;
208
232
  color && (icon = {
209
233
  path: markerPath,
@@ -226,65 +250,121 @@ class Marker extends PureComponent {
226
250
  componentDidUpdate(prevProps) {
227
251
  if (!this.marker)
228
252
  return;
229
- const { position, onMove, label, zIndex, opacity, map } = this.props;
253
+ const {
254
+ position,
255
+ onMove,
256
+ label,
257
+ zIndex,
258
+ opacity,
259
+ map
260
+ } = this.props;
230
261
  prevProps.onMove !== onMove && this.attachMoveHandler(), latLngAreEqual(prevProps.position, position) || this.marker.setPosition(position), prevProps.label !== label && this.marker.setLabel(label || null), prevProps.zIndex !== zIndex && this.marker.setZIndex(zIndex || null), prevProps.opacity !== opacity && this.marker.setOpacity(opacity || null), prevProps.map !== map && this.marker.setMap(map);
231
262
  }
232
263
  componentWillUnmount() {
233
264
  this.eventHandlers.move && this.eventHandlers.move.remove(), this.marker && this.marker.setMap(null);
234
265
  }
235
266
  attachMoveHandler() {
236
- const { api, onMove } = this.props;
267
+ const {
268
+ api,
269
+ onMove
270
+ } = this.props;
237
271
  this.eventHandlers.move && this.eventHandlers.move.remove(), this.marker && onMove && (this.eventHandlers.move = api.event.addListener(this.marker, "dragend", onMove));
238
272
  }
239
273
  attachClickHandler() {
240
- const { api, onClick } = this.props;
274
+ const {
275
+ api,
276
+ onClick
277
+ } = this.props;
241
278
  this.eventHandlers.click && this.eventHandlers.click.remove(), this.marker && onClick && (this.eventHandlers.click = api.event.addListener(this.marker, "click", onClick));
242
279
  }
243
- // eslint-disable-next-line class-methods-use-this
244
280
  render() {
245
281
  return null;
246
282
  }
247
283
  }
248
- const fallbackLatLng$1 = { lat: 40.7058254, lng: -74.1180863 }, GeopointSelect = ({
249
- api,
250
- value,
251
- onChange,
252
- defaultLocation = { lng: 10.74609, lat: 59.91273 },
253
- defaultZoom = 8
254
- }) => {
255
- const getCenter2 = useCallback(() => ({ ...fallbackLatLng$1, ...defaultLocation, ...value }), [value, defaultLocation]), setValue = useCallback(
256
- (geoPoint) => {
257
- onChange && onChange(geoPoint);
258
- },
259
- [onChange]
260
- ), handlePlaceChanged = useCallback(
261
- (place) => {
262
- place.geometry?.location && setValue(place.geometry.location);
263
- },
264
- [setValue]
265
- ), handleMarkerDragEnd = useCallback(
266
- (event) => {
267
- event.latLng && setValue(event.latLng);
268
- },
269
- [setValue]
270
- ), handleMapClick = useCallback(
271
- (event) => {
272
- event.latLng && setValue(event.latLng);
273
- },
274
- [setValue]
275
- );
276
- return /* @__PURE__ */ jsx(GoogleMap, { api, location: getCenter2(), onClick: handleMapClick, defaultZoom, children: (map) => /* @__PURE__ */ jsxs(Fragment, { children: [
284
+ const WrapperContainer = styled.div.withConfig({
285
+ displayName: "WrapperContainer",
286
+ componentId: "sc-n3m9ut-0"
287
+ })`position:absolute;right:10px;top:10px;width:220px;`;
288
+ class SearchInput extends PureComponent {
289
+ searchInputRef = createRef();
290
+ handleChange = () => {
291
+ this.autoComplete && (this.props.onChange(this.autoComplete.getPlace()), this.searchInputRef.current && (this.searchInputRef.current.value = ""));
292
+ };
293
+ componentDidMount() {
294
+ const input = this.searchInputRef.current;
295
+ if (!input)
296
+ return;
297
+ const {
298
+ api,
299
+ map
300
+ } = this.props, {
301
+ Circle,
302
+ places,
303
+ event
304
+ } = api, searchBounds = new Circle({
305
+ center: map.getCenter(),
306
+ radius: 100
307
+ }).getBounds();
308
+ this.autoComplete = new places.Autocomplete(input, {
309
+ bounds: searchBounds,
310
+ types: []
311
+ // return all kinds of places
312
+ }), event.addListener(this.autoComplete, "place_changed", this.handleChange);
313
+ }
314
+ render() {
315
+ return /* @__PURE__ */ jsx(WrapperContainer, { children: /* @__PURE__ */ jsx(TextInput, { name: "place", ref: this.searchInputRef, placeholder: "Search for place or address", padding: 4 }) });
316
+ }
317
+ }
318
+ const fallbackLatLng$1 = {
319
+ lat: 40.7058254,
320
+ lng: -74.1180863
321
+ }, defaultMapLocation$1 = {
322
+ lng: 10.74609,
323
+ lat: 59.91273
324
+ }, GeopointSelect = (t0) => {
325
+ const $ = c(25), {
326
+ api,
327
+ value,
328
+ onChange,
329
+ defaultLocation: t1,
330
+ defaultZoom: t2
331
+ } = t0, defaultLocation = t1 === void 0 ? defaultMapLocation$1 : t1, defaultZoom = t2 === void 0 ? 8 : t2;
332
+ let t3;
333
+ $[0] !== defaultLocation || $[1] !== value ? (t3 = () => ({
334
+ ...fallbackLatLng$1,
335
+ ...defaultLocation,
336
+ ...value
337
+ }), $[0] = defaultLocation, $[1] = value, $[2] = t3) : t3 = $[2];
338
+ const getCenter2 = t3;
339
+ let t4;
340
+ $[3] !== onChange ? (t4 = (geoPoint) => {
341
+ onChange && onChange(geoPoint);
342
+ }, $[3] = onChange, $[4] = t4) : t4 = $[4];
343
+ const setValue = t4;
344
+ let t5;
345
+ $[5] !== setValue ? (t5 = (place) => {
346
+ place.geometry?.location && setValue(place.geometry.location);
347
+ }, $[5] = setValue, $[6] = t5) : t5 = $[6];
348
+ const handlePlaceChanged = t5;
349
+ let t6;
350
+ $[7] !== setValue ? (t6 = (event) => {
351
+ event.latLng && setValue(event.latLng);
352
+ }, $[7] = setValue, $[8] = t6) : t6 = $[8];
353
+ const handleMarkerDragEnd = t6;
354
+ let t7;
355
+ $[9] !== setValue ? (t7 = (event_0) => {
356
+ event_0.latLng && setValue(event_0.latLng);
357
+ }, $[9] = setValue, $[10] = t7) : t7 = $[10];
358
+ const handleMapClick = t7;
359
+ let t8;
360
+ $[11] !== getCenter2 ? (t8 = getCenter2(), $[11] = getCenter2, $[12] = t8) : t8 = $[12];
361
+ let t9;
362
+ $[13] !== api || $[14] !== handleMarkerDragEnd || $[15] !== handlePlaceChanged || $[16] !== onChange || $[17] !== value ? (t9 = (map) => /* @__PURE__ */ jsxs(Fragment, { children: [
277
363
  /* @__PURE__ */ jsx(SearchInput, { api, map, onChange: handlePlaceChanged }),
278
- value && /* @__PURE__ */ jsx(
279
- Marker,
280
- {
281
- api,
282
- map,
283
- position: value,
284
- onMove: onChange ? handleMarkerDragEnd : void 0
285
- }
286
- )
287
- ] }) });
364
+ value && /* @__PURE__ */ jsx(Marker, { api, map, position: value, onMove: onChange ? handleMarkerDragEnd : void 0 })
365
+ ] }), $[13] = api, $[14] = handleMarkerDragEnd, $[15] = handlePlaceChanged, $[16] = onChange, $[17] = value, $[18] = t9) : t9 = $[18];
366
+ let t10;
367
+ return $[19] !== api || $[20] !== defaultZoom || $[21] !== handleMapClick || $[22] !== t8 || $[23] !== t9 ? (t10 = /* @__PURE__ */ jsx(GoogleMap, { api, location: t8, onClick: handleMapClick, defaultZoom, children: t9 }), $[19] = api, $[20] = defaultZoom, $[21] = handleMapClick, $[22] = t8, $[23] = t9, $[24] = t10) : t10 = $[24], t10;
288
368
  }, EMPTY_PATH$1 = [], getStaticImageUrl$1 = (value, apiKey) => {
289
369
  const loc = `${value.lat},${value.lng}`;
290
370
  return `https://maps.googleapis.com/maps/api/staticmap?${new URLSearchParams({
@@ -297,7 +377,7 @@ const fallbackLatLng$1 = { lat: 40.7058254, lng: -74.1180863 }, GeopointSelect =
297
377
  }).toString()}`;
298
378
  };
299
379
  function GeopointInput(props) {
300
- const {
380
+ const $ = c(51), {
301
381
  changed,
302
382
  elementProps,
303
383
  focused,
@@ -314,198 +394,183 @@ function GeopointInput(props) {
314
394
  onBlur: handleBlur,
315
395
  onFocus: handleFocus,
316
396
  "aria-describedby": ariaDescribedBy
317
- } = elementProps, schemaTypeName = schemaType.name, dialogId = useId(), dialogRef = useRef(null), handleFocusButton = useCallback(() => inputRef?.current?.focus(), [inputRef]), [modalOpen, setModalOpen] = useState(!1), handleCloseModal = useCallback(() => {
397
+ } = elementProps, schemaTypeName = schemaType.name, dialogId = useId(), dialogRef = useRef(null);
398
+ let t0;
399
+ $[0] !== inputRef ? (t0 = () => inputRef?.current?.focus(), $[0] = inputRef, $[1] = t0) : t0 = $[1];
400
+ const handleFocusButton = t0, [modalOpen, setModalOpen] = useState(!1);
401
+ let t1;
402
+ $[2] !== handleFocusButton ? (t1 = () => {
318
403
  dialogRef.current && dialogRef.current.blur(), setModalOpen(!1), handleFocusButton();
319
- }, [setModalOpen, handleFocusButton]), handleToggleModal = useCallback(
320
- () => setModalOpen((currentState) => !currentState),
321
- [setModalOpen]
322
- ), handleChange = useCallback(
323
- (latLng) => {
324
- onChange([
325
- setIfMissing({ _type: schemaTypeName }),
326
- set(latLng.lat(), ["lat"]),
327
- set(latLng.lng(), ["lng"])
328
- ]);
329
- },
330
- [schemaTypeName, onChange]
331
- ), handleClear = useCallback(() => {
404
+ }, $[2] = handleFocusButton, $[3] = t1) : t1 = $[3];
405
+ const handleCloseModal = t1;
406
+ let t2;
407
+ $[4] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (t2 = () => setModalOpen(_temp$1), $[4] = t2) : t2 = $[4];
408
+ const handleToggleModal = t2;
409
+ let t3;
410
+ $[5] !== onChange || $[6] !== schemaTypeName ? (t3 = (latLng) => {
411
+ onChange([setIfMissing({
412
+ _type: schemaTypeName
413
+ }), set(latLng.lat(), ["lat"]), set(latLng.lng(), ["lng"])]);
414
+ }, $[5] = onChange, $[6] = schemaTypeName, $[7] = t3) : t3 = $[7];
415
+ const handleChange = t3;
416
+ let t4;
417
+ $[8] !== onChange ? (t4 = () => {
332
418
  onChange(unset());
333
- }, [onChange]);
334
- return useEffect(() => {
419
+ }, $[8] = onChange, $[9] = t4) : t4 = $[9];
420
+ const handleClear = t4;
421
+ let t5, t6;
422
+ if ($[10] !== modalOpen || $[11] !== onPathFocus ? (t5 = () => {
335
423
  modalOpen && onPathFocus(EMPTY_PATH$1);
336
- }, [modalOpen, onPathFocus]), !config2 || !config2.apiKey ? /* @__PURE__ */ jsxs("div", { children: [
337
- /* @__PURE__ */ jsxs("p", { children: [
338
- "The ",
339
- /* @__PURE__ */ jsx("a", { href: "https://sanity.io/docs/schema-types/geopoint-type", children: "Geopoint type" }),
340
- " needs a Google Maps API key with access to:"
341
- ] }),
342
- /* @__PURE__ */ jsxs("ul", { children: [
343
- /* @__PURE__ */ jsx("li", { children: "Google Maps JavaScript API" }),
344
- /* @__PURE__ */ jsx("li", { children: "Google Places API Web Service" }),
345
- /* @__PURE__ */ jsx("li", { children: "Google Static Maps API" })
346
- ] }),
347
- /* @__PURE__ */ jsx("p", { children: "Please enter the API key with access to these services in your googleMapsInput plugin config." })
348
- ] }) : /* @__PURE__ */ jsxs(Stack, { space: 3, children: [
349
- value && /* @__PURE__ */ jsx(ChangeIndicator, { path, isChanged: changed, hasFocus: !!focused, children: /* @__PURE__ */ jsx(
350
- PreviewImage,
351
- {
352
- src: getStaticImageUrl$1(value, config2.apiKey),
353
- alt: "Map location",
354
- onClick: handleFocusButton,
355
- onDoubleClick: handleToggleModal
356
- }
357
- ) }),
358
- /* @__PURE__ */ jsx(Box, { children: /* @__PURE__ */ jsxs(Grid, { columns: value ? 2 : 1, gap: 3, children: [
359
- /* @__PURE__ */ jsx(
360
- Button,
361
- {
362
- "aria-describedby": ariaDescribedBy,
363
- disabled: readOnly,
364
- icon: value && EditIcon,
365
- id,
366
- mode: "ghost",
367
- onClick: handleToggleModal,
368
- onFocus: handleFocus,
369
- padding: 3,
370
- ref: inputRef,
371
- text: value ? "Edit" : "Set location"
372
- }
373
- ),
374
- value && /* @__PURE__ */ jsx(
375
- Button,
376
- {
377
- disabled: readOnly,
378
- icon: TrashIcon,
379
- mode: "ghost",
380
- onClick: handleClear,
381
- padding: 3,
382
- text: "Remove",
383
- tone: "critical"
384
- }
385
- )
386
- ] }) }),
387
- modalOpen && /* @__PURE__ */ jsx(
388
- Dialog,
389
- {
390
- header: "Place the marker on the map",
391
- id: `${dialogId}_dialog`,
392
- onBlur: handleBlur,
393
- onClose: handleCloseModal,
394
- ref: dialogRef,
395
- width: 1,
396
- children: /* @__PURE__ */ jsx(DialogInnerContainer, { children: /* @__PURE__ */ jsx(GoogleMapsLoadProxy, { config: getGeoConfig(), children: (api) => /* @__PURE__ */ jsx(
397
- GeopointSelect,
398
- {
399
- api,
400
- value: value || void 0,
401
- onChange: readOnly ? void 0 : handleChange,
402
- defaultLocation: config2.defaultLocation,
403
- defaultZoom: config2.defaultZoom
404
- }
405
- ) }) })
406
- }
407
- )
408
- ] });
409
- }
410
- const fallbackLatLng = { lat: 40.7058254, lng: -74.1180863 }, MarkerDragSync = ({ api, marker, circleRef, isMarkerDragging }) => (useEffect(() => {
411
- const handleDrag = () => {
412
- isMarkerDragging.current = !0;
413
- }, handleDragEnd = () => {
414
- isMarkerDragging.current = !1;
415
- }, dragListener = api.event.addListener(marker, "drag", handleDrag), dragEndListener = api.event.addListener(marker, "dragend", handleDragEnd);
416
- return () => {
417
- api.event.removeListener(dragListener), api.event.removeListener(dragEndListener);
418
- };
419
- }, [api, marker, circleRef, isMarkerDragging]), null), GeopointRadiusSelect = ({
420
- api,
421
- value,
422
- onChange,
423
- defaultLocation = { lng: 10.74609, lat: 59.91273 },
424
- defaultRadiusZoom = 12,
425
- defaultRadius = 1e3
426
- }) => {
427
- const circleRef = useRef(null), markerRef = useRef(void 0), isMarkerDragging = useRef(!1), getCenter2 = useCallback(() => ({ ...fallbackLatLng, ...defaultLocation, ...value }), [value, defaultLocation]), setValue = useCallback(
428
- (geoPoint, radius) => {
429
- if (onChange) {
430
- const roundedRadius = radius ? Math.round(radius) : void 0;
431
- onChange(geoPoint, roundedRadius);
432
- }
433
- },
434
- [onChange]
435
- ), handlePlaceChanged = useCallback(
436
- (place) => {
437
- place.geometry?.location && setValue(place.geometry.location, value?.radius || defaultRadius);
438
- },
439
- [setValue, value?.radius, defaultRadius]
440
- ), handleMarkerDragEnd = useCallback(
441
- (event) => {
442
- event.latLng && (circleRef.current && circleRef.current.setCenter(event.latLng), setValue(event.latLng, value?.radius || defaultRadius));
443
- },
444
- [setValue, value?.radius, defaultRadius]
445
- ), handleMapClick = useCallback(
446
- (event) => {
447
- event.latLng && setValue(event.latLng, value?.radius || defaultRadius);
424
+ }, t6 = [modalOpen, onPathFocus], $[10] = modalOpen, $[11] = onPathFocus, $[12] = t5, $[13] = t6) : (t5 = $[12], t6 = $[13]), useEffect(t5, t6), !config2 || !config2.apiKey) {
425
+ let t72;
426
+ return $[14] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (t72 = /* @__PURE__ */ jsxs("div", { children: [
427
+ /* @__PURE__ */ jsxs("p", { children: [
428
+ "The ",
429
+ /* @__PURE__ */ jsx("a", { href: "https://sanity.io/docs/schema-types/geopoint-type", children: "Geopoint type" }),
430
+ " needs a Google Maps API key with access to:"
431
+ ] }),
432
+ /* @__PURE__ */ jsxs("ul", { children: [
433
+ /* @__PURE__ */ jsx("li", { children: "Google Maps JavaScript API" }),
434
+ /* @__PURE__ */ jsx("li", { children: "Google Places API Web Service" }),
435
+ /* @__PURE__ */ jsx("li", { children: "Google Static Maps API" })
436
+ ] }),
437
+ /* @__PURE__ */ jsx("p", { children: "Please enter the API key with access to these services in your googleMapsInput plugin config." })
438
+ ] }), $[14] = t72) : t72 = $[14], t72;
439
+ }
440
+ let t7;
441
+ $[15] !== changed || $[16] !== config2 || $[17] !== focused || $[18] !== handleFocusButton || $[19] !== path || $[20] !== value ? (t7 = value && /* @__PURE__ */ jsx(ChangeIndicator, { path, isChanged: changed, hasFocus: !!focused, children: /* @__PURE__ */ jsx(PreviewImage, { src: getStaticImageUrl$1(value, config2.apiKey), alt: "Map location", onClick: handleFocusButton, onDoubleClick: handleToggleModal }) }), $[15] = changed, $[16] = config2, $[17] = focused, $[18] = handleFocusButton, $[19] = path, $[20] = value, $[21] = t7) : t7 = $[21];
442
+ const t8 = value ? 2 : 1, t9 = value && EditIcon, t10 = value ? "Edit" : "Set location";
443
+ let t11;
444
+ $[22] !== ariaDescribedBy || $[23] !== handleFocus || $[24] !== id || $[25] !== inputRef || $[26] !== readOnly || $[27] !== t10 || $[28] !== t9 ? (t11 = /* @__PURE__ */ jsx(Button, { "aria-describedby": ariaDescribedBy, disabled: readOnly, icon: t9, id, mode: "ghost", onClick: handleToggleModal, onFocus: handleFocus, padding: 3, ref: inputRef, text: t10 }), $[22] = ariaDescribedBy, $[23] = handleFocus, $[24] = id, $[25] = inputRef, $[26] = readOnly, $[27] = t10, $[28] = t9, $[29] = t11) : t11 = $[29];
445
+ let t12;
446
+ $[30] !== handleClear || $[31] !== readOnly || $[32] !== value ? (t12 = value && /* @__PURE__ */ jsx(Button, { disabled: readOnly, icon: TrashIcon, mode: "ghost", onClick: handleClear, padding: 3, text: "Remove", tone: "critical" }), $[30] = handleClear, $[31] = readOnly, $[32] = value, $[33] = t12) : t12 = $[33];
447
+ let t13;
448
+ $[34] !== t11 || $[35] !== t12 || $[36] !== t8 ? (t13 = /* @__PURE__ */ jsx(Box, { children: /* @__PURE__ */ jsxs(Grid, { columns: t8, gap: 3, children: [
449
+ t11,
450
+ t12
451
+ ] }) }), $[34] = t11, $[35] = t12, $[36] = t8, $[37] = t13) : t13 = $[37];
452
+ let t14;
453
+ $[38] !== config2 || $[39] !== dialogId || $[40] !== handleBlur || $[41] !== handleChange || $[42] !== handleCloseModal || $[43] !== modalOpen || $[44] !== readOnly || $[45] !== value ? (t14 = modalOpen && /* @__PURE__ */ jsx(Dialog, { header: "Place the marker on the map", id: `${dialogId}_dialog`, onBlur: handleBlur, onClose: handleCloseModal, ref: dialogRef, width: 1, children: /* @__PURE__ */ jsx(DialogInnerContainer, { children: /* @__PURE__ */ jsx(GoogleMapsLoadProxy, { config: getGeoConfig(), children: (api) => /* @__PURE__ */ jsx(GeopointSelect, { api, value: value || void 0, onChange: readOnly ? void 0 : handleChange, defaultLocation: config2.defaultLocation, defaultZoom: config2.defaultZoom }) }) }) }), $[38] = config2, $[39] = dialogId, $[40] = handleBlur, $[41] = handleChange, $[42] = handleCloseModal, $[43] = modalOpen, $[44] = readOnly, $[45] = value, $[46] = t14) : t14 = $[46];
454
+ let t15;
455
+ return $[47] !== t13 || $[48] !== t14 || $[49] !== t7 ? (t15 = /* @__PURE__ */ jsxs(Stack, { space: 3, children: [
456
+ t7,
457
+ t13,
458
+ t14
459
+ ] }), $[47] = t13, $[48] = t14, $[49] = t7, $[50] = t15) : t15 = $[50], t15;
460
+ }
461
+ function _temp$1(currentState) {
462
+ return !currentState;
463
+ }
464
+ const fallbackLatLng = {
465
+ lat: 40.7058254,
466
+ lng: -74.1180863
467
+ }, defaultMapLocation = {
468
+ lng: 10.74609,
469
+ lat: 59.91273
470
+ }, MarkerDragSync = (t0) => {
471
+ const $ = c(9), {
472
+ api,
473
+ marker,
474
+ circleRef,
475
+ isMarkerDragging
476
+ } = t0;
477
+ let t1;
478
+ $[0] !== api.event || $[1] !== isMarkerDragging || $[2] !== marker ? (t1 = () => {
479
+ const handleDrag = () => {
480
+ isMarkerDragging.current = !0;
481
+ }, handleDragEnd = () => {
482
+ isMarkerDragging.current = !1;
483
+ }, dragListener = api.event.addListener(marker, "drag", handleDrag), dragEndListener = api.event.addListener(marker, "dragend", handleDragEnd);
484
+ return () => {
485
+ api.event.removeListener(dragListener), api.event.removeListener(dragEndListener);
486
+ };
487
+ }, $[0] = api.event, $[1] = isMarkerDragging, $[2] = marker, $[3] = t1) : t1 = $[3];
488
+ let t2;
489
+ return $[4] !== api || $[5] !== circleRef || $[6] !== isMarkerDragging || $[7] !== marker ? (t2 = [api, marker, circleRef, isMarkerDragging], $[4] = api, $[5] = circleRef, $[6] = isMarkerDragging, $[7] = marker, $[8] = t2) : t2 = $[8], useEffect(t1, t2), null;
490
+ }, GeopointRadiusSelect = (t0) => {
491
+ const $ = c(35), {
492
+ api,
493
+ value,
494
+ onChange,
495
+ defaultLocation: t1,
496
+ defaultRadiusZoom: t2,
497
+ defaultRadius: t3
498
+ } = t0, defaultLocation = t1 === void 0 ? defaultMapLocation : t1, defaultRadiusZoom = t2 === void 0 ? 12 : t2, defaultRadius = t3 === void 0 ? 1e3 : t3, circleRef = useRef(null), markerRef = useRef(void 0), isMarkerDragging = useRef(!1);
499
+ let t4;
500
+ $[0] !== defaultLocation || $[1] !== value ? (t4 = () => ({
501
+ ...fallbackLatLng,
502
+ ...defaultLocation,
503
+ ...value
504
+ }), $[0] = defaultLocation, $[1] = value, $[2] = t4) : t4 = $[2];
505
+ const getCenter2 = t4;
506
+ let t5;
507
+ $[3] !== onChange ? (t5 = (geoPoint, radius) => {
508
+ if (onChange) {
509
+ const roundedRadius = radius ? Math.round(radius) : void 0;
510
+ onChange(geoPoint, roundedRadius);
511
+ }
512
+ }, $[3] = onChange, $[4] = t5) : t5 = $[4];
513
+ const setValue = t5;
514
+ let t6;
515
+ $[5] !== defaultRadius || $[6] !== setValue || $[7] !== value?.radius ? (t6 = (place) => {
516
+ place.geometry?.location && setValue(place.geometry.location, value?.radius || defaultRadius);
517
+ }, $[5] = defaultRadius, $[6] = setValue, $[7] = value?.radius, $[8] = t6) : t6 = $[8];
518
+ const handlePlaceChanged = t6;
519
+ let t7;
520
+ $[9] !== defaultRadius || $[10] !== setValue || $[11] !== value?.radius ? (t7 = (event) => {
521
+ event.latLng && (circleRef.current && circleRef.current.setCenter(event.latLng), setValue(event.latLng, value?.radius || defaultRadius));
522
+ }, $[9] = defaultRadius, $[10] = setValue, $[11] = value?.radius, $[12] = t7) : t7 = $[12];
523
+ const handleMarkerDragEnd = t7;
524
+ let t8;
525
+ $[13] !== defaultRadius || $[14] !== setValue || $[15] !== value?.radius ? (t8 = (event_0) => {
526
+ event_0.latLng && setValue(event_0.latLng, value?.radius || defaultRadius);
527
+ }, $[13] = defaultRadius, $[14] = setValue, $[15] = value?.radius, $[16] = t8) : t8 = $[16];
528
+ const handleMapClick = t8;
529
+ let t10, t9;
530
+ $[17] !== value ? (t9 = () => {
531
+ value && circleRef.current && (circleRef.current.setCenter({
532
+ lat: value.lat,
533
+ lng: value.lng
534
+ }), circleRef.current.setRadius(value.radius));
535
+ }, t10 = [value], $[17] = value, $[18] = t10, $[19] = t9) : (t10 = $[18], t9 = $[19]), useEffect(t9, t10);
536
+ let t11;
537
+ $[20] !== getCenter2 ? (t11 = getCenter2(), $[20] = getCenter2, $[21] = t11) : t11 = $[21];
538
+ let t12;
539
+ $[22] !== api || $[23] !== handleMarkerDragEnd || $[24] !== handlePlaceChanged || $[25] !== onChange || $[26] !== setValue || $[27] !== value ? (t12 = (map) => (value && !circleRef.current && (circleRef.current = new api.Circle({
540
+ map,
541
+ center: {
542
+ lat: value.lat,
543
+ lng: value.lng
448
544
  },
449
- [setValue, value?.radius, defaultRadius]
450
- );
451
- return useEffect(() => {
452
- value && circleRef.current && (circleRef.current.setCenter({ lat: value.lat, lng: value.lng }), circleRef.current.setRadius(value.radius));
453
- }, [value]), /* @__PURE__ */ jsx(
454
- GoogleMap,
455
- {
456
- api,
457
- location: getCenter2(),
458
- onClick: handleMapClick,
459
- defaultZoom: defaultRadiusZoom,
460
- children: (map) => (value && !circleRef.current && (circleRef.current = new api.Circle({
461
- map,
462
- center: { lat: value.lat, lng: value.lng },
463
- radius: value.radius,
464
- fillColor: "#4285F4",
465
- fillOpacity: 0.2,
466
- strokeColor: "#4285F4",
467
- strokeOpacity: 0.8,
468
- strokeWeight: 2,
469
- editable: !0
470
- }), circleRef.current.addListener("center_changed", () => {
471
- if (circleRef.current && markerRef.current && !isMarkerDragging.current) {
472
- const circleCenter = circleRef.current.getCenter();
473
- circleCenter && markerRef.current.setPosition(circleCenter);
474
- }
475
- }), circleRef.current.addListener("radius_changed", () => {
476
- if (circleRef.current) {
477
- const center = circleRef.current.getCenter(), radius = circleRef.current.getRadius();
478
- center && setValue(center, Math.round(radius));
479
- }
480
- }), circleRef.current.addListener("dragend", () => {
481
- if (circleRef.current) {
482
- const center = circleRef.current.getCenter(), radius = circleRef.current.getRadius();
483
- center && setValue(center, Math.round(radius));
484
- }
485
- })), /* @__PURE__ */ jsxs(Fragment, { children: [
486
- /* @__PURE__ */ jsx(SearchInput, { api, map, onChange: handlePlaceChanged }),
487
- value && /* @__PURE__ */ jsx(
488
- Marker,
489
- {
490
- api,
491
- map,
492
- position: value,
493
- onMove: onChange ? handleMarkerDragEnd : void 0,
494
- markerRef
495
- }
496
- ),
497
- value && markerRef.current && /* @__PURE__ */ jsx(
498
- MarkerDragSync,
499
- {
500
- api,
501
- marker: markerRef.current,
502
- circleRef,
503
- isMarkerDragging
504
- }
505
- )
506
- ] }))
545
+ radius: value.radius,
546
+ fillColor: "#4285F4",
547
+ fillOpacity: 0.2,
548
+ strokeColor: "#4285F4",
549
+ strokeOpacity: 0.8,
550
+ strokeWeight: 2,
551
+ editable: !0
552
+ }), circleRef.current.addListener("center_changed", () => {
553
+ if (circleRef.current && markerRef.current && !isMarkerDragging.current) {
554
+ const circleCenter = circleRef.current.getCenter();
555
+ circleCenter && markerRef.current.setPosition(circleCenter);
556
+ }
557
+ }), circleRef.current.addListener("radius_changed", () => {
558
+ if (circleRef.current) {
559
+ const center = circleRef.current.getCenter(), radius_0 = circleRef.current.getRadius();
560
+ center && setValue(center, Math.round(radius_0));
507
561
  }
508
- );
562
+ }), circleRef.current.addListener("dragend", () => {
563
+ if (circleRef.current) {
564
+ const center_0 = circleRef.current.getCenter(), radius_1 = circleRef.current.getRadius();
565
+ center_0 && setValue(center_0, Math.round(radius_1));
566
+ }
567
+ })), /* @__PURE__ */ jsxs(Fragment, { children: [
568
+ /* @__PURE__ */ jsx(SearchInput, { api, map, onChange: handlePlaceChanged }),
569
+ value && /* @__PURE__ */ jsx(Marker, { api, map, position: value, onMove: onChange ? handleMarkerDragEnd : void 0, markerRef }),
570
+ value && markerRef.current && /* @__PURE__ */ jsx(MarkerDragSync, { api, marker: markerRef.current, circleRef, isMarkerDragging })
571
+ ] })), $[22] = api, $[23] = handleMarkerDragEnd, $[24] = handlePlaceChanged, $[25] = onChange, $[26] = setValue, $[27] = value, $[28] = t12) : t12 = $[28];
572
+ let t13;
573
+ return $[29] !== api || $[30] !== defaultRadiusZoom || $[31] !== handleMapClick || $[32] !== t11 || $[33] !== t12 ? (t13 = /* @__PURE__ */ jsx(GoogleMap, { api, location: t11, onClick: handleMapClick, defaultZoom: defaultRadiusZoom, children: t12 }), $[29] = api, $[30] = defaultRadiusZoom, $[31] = handleMapClick, $[32] = t11, $[33] = t12, $[34] = t13) : t13 = $[34], t13;
509
574
  }, EMPTY_PATH = [], generateCirclePoints = (lat, lng, radius) => {
510
575
  const points = [];
511
576
  for (let i = 0; i <= 32; i++) {
@@ -538,7 +603,7 @@ const fallbackLatLng = { lat: 40.7058254, lng: -74.1180863 }, MarkerDragSync = (
538
603
  return `https://maps.googleapis.com/maps/api/staticmap?${qs.toString()}`;
539
604
  };
540
605
  function GeopointRadiusInput(props) {
541
- const {
606
+ const $ = c(64), {
542
607
  changed,
543
608
  elementProps,
544
609
  focused,
@@ -555,135 +620,113 @@ function GeopointRadiusInput(props) {
555
620
  onBlur: handleBlur,
556
621
  onFocus: handleFocus,
557
622
  "aria-describedby": ariaDescribedBy
558
- } = elementProps, schemaTypeName = schemaType.name, dialogId = useId(), dialogRef = useRef(null), handleFocusButton = useCallback(() => inputRef?.current?.focus(), [inputRef]), [modalOpen, setModalOpen] = useState(!1), handleCloseModal = useCallback(() => {
623
+ } = elementProps, schemaTypeName = schemaType.name, dialogId = useId(), dialogRef = useRef(null);
624
+ let t0;
625
+ $[0] !== inputRef ? (t0 = () => inputRef?.current?.focus(), $[0] = inputRef, $[1] = t0) : t0 = $[1];
626
+ const handleFocusButton = t0, [modalOpen, setModalOpen] = useState(!1);
627
+ let t1;
628
+ $[2] !== handleFocusButton ? (t1 = () => {
559
629
  dialogRef.current && dialogRef.current.blur(), setModalOpen(!1), handleFocusButton();
560
- }, [setModalOpen, handleFocusButton]), handleToggleModal = useCallback(
561
- () => setModalOpen((currentState) => !currentState),
562
- [setModalOpen]
563
- ), handleChange = useCallback(
564
- (latLng, radius) => {
565
- const currentRadius = radius ?? value?.radius ?? config2.defaultRadius ?? 1e3;
566
- onChange([
567
- setIfMissing({ _type: schemaTypeName }),
568
- set(latLng.lat(), ["lat"]),
569
- set(latLng.lng(), ["lng"]),
570
- set(currentRadius, ["radius"])
571
- ]);
572
- },
573
- [schemaTypeName, onChange, value?.radius, config2.defaultRadius]
574
- ), handleRadiusChange = useCallback(
575
- (event) => {
576
- value && onChange([set(Math.round(Number(event.currentTarget.value)), ["radius"])]);
577
- },
578
- [onChange, value]
579
- ), handleClear = useCallback(() => {
630
+ }, $[2] = handleFocusButton, $[3] = t1) : t1 = $[3];
631
+ const handleCloseModal = t1;
632
+ let t2;
633
+ $[4] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (t2 = () => setModalOpen(_temp), $[4] = t2) : t2 = $[4];
634
+ const handleToggleModal = t2;
635
+ let t3;
636
+ $[5] !== config2.defaultRadius || $[6] !== onChange || $[7] !== schemaTypeName || $[8] !== value?.radius ? (t3 = (latLng, radius) => {
637
+ const currentRadius = radius ?? value?.radius ?? config2.defaultRadius ?? 1e3;
638
+ onChange([setIfMissing({
639
+ _type: schemaTypeName
640
+ }), set(latLng.lat(), ["lat"]), set(latLng.lng(), ["lng"]), set(currentRadius, ["radius"])]);
641
+ }, $[5] = config2.defaultRadius, $[6] = onChange, $[7] = schemaTypeName, $[8] = value?.radius, $[9] = t3) : t3 = $[9];
642
+ const handleChange = t3;
643
+ let t4;
644
+ $[10] !== onChange || $[11] !== value ? (t4 = (event) => {
645
+ value && onChange([set(Math.round(Number(event.currentTarget.value)), ["radius"])]);
646
+ }, $[10] = onChange, $[11] = value, $[12] = t4) : t4 = $[12];
647
+ const handleRadiusChange = t4;
648
+ let t5;
649
+ $[13] !== onChange ? (t5 = () => {
580
650
  onChange(unset());
581
- }, [onChange]);
582
- return useEffect(() => {
651
+ }, $[13] = onChange, $[14] = t5) : t5 = $[14];
652
+ const handleClear = t5;
653
+ let t6, t7;
654
+ if ($[15] !== modalOpen || $[16] !== onPathFocus ? (t6 = () => {
583
655
  modalOpen && onPathFocus(EMPTY_PATH);
584
- }, [modalOpen, onPathFocus]), !config2 || !config2.apiKey ? /* @__PURE__ */ jsxs("div", { children: [
585
- /* @__PURE__ */ jsxs("p", { children: [
586
- "The ",
587
- /* @__PURE__ */ jsx("a", { href: "https://sanity.io/docs/schema-types/geopoint-type", children: "Geopoint Radius type" }),
588
- " ",
589
- "needs a Google Maps API key with access to:"
590
- ] }),
591
- /* @__PURE__ */ jsxs("ul", { children: [
592
- /* @__PURE__ */ jsx("li", { children: "Google Maps JavaScript API" }),
593
- /* @__PURE__ */ jsx("li", { children: "Google Places API Web Service" }),
594
- /* @__PURE__ */ jsx("li", { children: "Google Static Maps API" })
595
- ] }),
596
- /* @__PURE__ */ jsx("p", { children: "Please enter the API key with access to these services in your googleMapsInput plugin config." })
597
- ] }) : /* @__PURE__ */ jsxs(Stack, { space: 3, children: [
598
- value && /* @__PURE__ */ jsx(ChangeIndicator, { path, isChanged: changed, hasFocus: !!focused, children: /* @__PURE__ */ jsx(
599
- PreviewImage,
600
- {
601
- src: getStaticImageUrl(value, config2.apiKey),
602
- alt: "Map location with radius",
603
- onClick: handleFocusButton,
604
- onDoubleClick: handleToggleModal
605
- }
606
- ) }),
607
- value && /* @__PURE__ */ jsxs(Stack, { space: 2, children: [
608
- /* @__PURE__ */ jsx(Label, { children: "Radius (meters)" }),
609
- /* @__PURE__ */ jsx(
610
- TextInput,
611
- {
612
- type: "number",
613
- value: Math.round(value.radius || config2.defaultRadius || 1e3),
614
- onChange: handleRadiusChange,
615
- disabled: readOnly,
616
- min: 1,
617
- max: 5e4,
618
- step: 1
619
- }
620
- )
621
- ] }),
622
- /* @__PURE__ */ jsx(Box, { children: /* @__PURE__ */ jsxs(Grid, { columns: value ? 2 : 1, gap: 3, children: [
623
- /* @__PURE__ */ jsx(
624
- Button,
625
- {
626
- "aria-describedby": ariaDescribedBy,
627
- disabled: readOnly,
628
- icon: value && EditIcon,
629
- id,
630
- mode: "ghost",
631
- onClick: handleToggleModal,
632
- onFocus: handleFocus,
633
- padding: 3,
634
- ref: inputRef,
635
- text: value ? "Edit" : "Set location and radius"
636
- }
637
- ),
638
- value && /* @__PURE__ */ jsx(
639
- Button,
640
- {
641
- disabled: readOnly,
642
- icon: TrashIcon,
643
- mode: "ghost",
644
- onClick: handleClear,
645
- padding: 3,
646
- text: "Remove",
647
- tone: "critical"
648
- }
649
- )
650
- ] }) }),
651
- modalOpen && /* @__PURE__ */ jsx(
652
- Dialog,
653
- {
654
- header: "Place the marker and set radius on the map",
655
- id: `${dialogId}_dialog`,
656
- onBlur: handleBlur,
657
- onClose: handleCloseModal,
658
- ref: dialogRef,
659
- width: 1,
660
- children: /* @__PURE__ */ jsx(DialogInnerContainer, { children: /* @__PURE__ */ jsx(GoogleMapsLoadProxy, { config: getGeoConfig(), children: (api) => /* @__PURE__ */ jsx(
661
- GeopointRadiusSelect,
662
- {
663
- api,
664
- value: value || void 0,
665
- onChange: readOnly ? void 0 : handleChange,
666
- defaultLocation: config2.defaultLocation,
667
- defaultRadiusZoom: config2.defaultRadiusZoom,
668
- defaultRadius: config2.defaultRadius
669
- }
670
- ) }) })
671
- }
672
- )
673
- ] });
656
+ }, t7 = [modalOpen, onPathFocus], $[15] = modalOpen, $[16] = onPathFocus, $[17] = t6, $[18] = t7) : (t6 = $[17], t7 = $[18]), useEffect(t6, t7), !config2 || !config2.apiKey) {
657
+ let t82;
658
+ return $[19] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (t82 = /* @__PURE__ */ jsxs("div", { children: [
659
+ /* @__PURE__ */ jsxs("p", { children: [
660
+ "The ",
661
+ /* @__PURE__ */ jsx("a", { href: "https://sanity.io/docs/schema-types/geopoint-type", children: "Geopoint Radius type" }),
662
+ " ",
663
+ "needs a Google Maps API key with access to:"
664
+ ] }),
665
+ /* @__PURE__ */ jsxs("ul", { children: [
666
+ /* @__PURE__ */ jsx("li", { children: "Google Maps JavaScript API" }),
667
+ /* @__PURE__ */ jsx("li", { children: "Google Places API Web Service" }),
668
+ /* @__PURE__ */ jsx("li", { children: "Google Static Maps API" })
669
+ ] }),
670
+ /* @__PURE__ */ jsx("p", { children: "Please enter the API key with access to these services in your googleMapsInput plugin config." })
671
+ ] }), $[19] = t82) : t82 = $[19], t82;
672
+ }
673
+ let t8;
674
+ $[20] !== changed || $[21] !== config2.apiKey || $[22] !== focused || $[23] !== handleFocusButton || $[24] !== path || $[25] !== value ? (t8 = value && /* @__PURE__ */ jsx(ChangeIndicator, { path, isChanged: changed, hasFocus: !!focused, children: /* @__PURE__ */ jsx(PreviewImage, { src: getStaticImageUrl(value, config2.apiKey), alt: "Map location with radius", onClick: handleFocusButton, onDoubleClick: handleToggleModal }) }), $[20] = changed, $[21] = config2.apiKey, $[22] = focused, $[23] = handleFocusButton, $[24] = path, $[25] = value, $[26] = t8) : t8 = $[26];
675
+ let t9;
676
+ $[27] !== config2.defaultRadius || $[28] !== handleRadiusChange || $[29] !== readOnly || $[30] !== value ? (t9 = value && /* @__PURE__ */ jsxs(Stack, { space: 2, children: [
677
+ /* @__PURE__ */ jsx(Label, { children: "Radius (meters)" }),
678
+ /* @__PURE__ */ jsx(TextInput, { type: "number", value: Math.round(value.radius || config2.defaultRadius || 1e3), onChange: handleRadiusChange, disabled: readOnly, min: 1, max: 5e4, step: 1 })
679
+ ] }), $[27] = config2.defaultRadius, $[28] = handleRadiusChange, $[29] = readOnly, $[30] = value, $[31] = t9) : t9 = $[31];
680
+ const t10 = value ? 2 : 1, t11 = value && EditIcon, t12 = value ? "Edit" : "Set location and radius";
681
+ let t13;
682
+ $[32] !== ariaDescribedBy || $[33] !== handleFocus || $[34] !== id || $[35] !== inputRef || $[36] !== readOnly || $[37] !== t11 || $[38] !== t12 ? (t13 = /* @__PURE__ */ jsx(Button, { "aria-describedby": ariaDescribedBy, disabled: readOnly, icon: t11, id, mode: "ghost", onClick: handleToggleModal, onFocus: handleFocus, padding: 3, ref: inputRef, text: t12 }), $[32] = ariaDescribedBy, $[33] = handleFocus, $[34] = id, $[35] = inputRef, $[36] = readOnly, $[37] = t11, $[38] = t12, $[39] = t13) : t13 = $[39];
683
+ let t14;
684
+ $[40] !== handleClear || $[41] !== readOnly || $[42] !== value ? (t14 = value && /* @__PURE__ */ jsx(Button, { disabled: readOnly, icon: TrashIcon, mode: "ghost", onClick: handleClear, padding: 3, text: "Remove", tone: "critical" }), $[40] = handleClear, $[41] = readOnly, $[42] = value, $[43] = t14) : t14 = $[43];
685
+ let t15;
686
+ $[44] !== t10 || $[45] !== t13 || $[46] !== t14 ? (t15 = /* @__PURE__ */ jsx(Box, { children: /* @__PURE__ */ jsxs(Grid, { columns: t10, gap: 3, children: [
687
+ t13,
688
+ t14
689
+ ] }) }), $[44] = t10, $[45] = t13, $[46] = t14, $[47] = t15) : t15 = $[47];
690
+ let t16;
691
+ $[48] !== config2.defaultLocation || $[49] !== config2.defaultRadius || $[50] !== config2.defaultRadiusZoom || $[51] !== dialogId || $[52] !== handleBlur || $[53] !== handleChange || $[54] !== handleCloseModal || $[55] !== modalOpen || $[56] !== readOnly || $[57] !== value ? (t16 = modalOpen && /* @__PURE__ */ jsx(Dialog, { header: "Place the marker and set radius on the map", id: `${dialogId}_dialog`, onBlur: handleBlur, onClose: handleCloseModal, ref: dialogRef, width: 1, children: /* @__PURE__ */ jsx(DialogInnerContainer, { children: /* @__PURE__ */ jsx(GoogleMapsLoadProxy, { config: getGeoConfig(), children: (api) => /* @__PURE__ */ jsx(GeopointRadiusSelect, { api, value: value || void 0, onChange: readOnly ? void 0 : handleChange, defaultLocation: config2.defaultLocation, defaultRadiusZoom: config2.defaultRadiusZoom, defaultRadius: config2.defaultRadius }) }) }) }), $[48] = config2.defaultLocation, $[49] = config2.defaultRadius, $[50] = config2.defaultRadiusZoom, $[51] = dialogId, $[52] = handleBlur, $[53] = handleChange, $[54] = handleCloseModal, $[55] = modalOpen, $[56] = readOnly, $[57] = value, $[58] = t16) : t16 = $[58];
692
+ let t17;
693
+ return $[59] !== t15 || $[60] !== t16 || $[61] !== t8 || $[62] !== t9 ? (t17 = /* @__PURE__ */ jsxs(Stack, { space: 3, children: [
694
+ t8,
695
+ t9,
696
+ t15,
697
+ t16
698
+ ] }), $[59] = t15, $[60] = t16, $[61] = t8, $[62] = t9, $[63] = t17) : t17 = $[63], t17;
699
+ }
700
+ function _temp(currentState) {
701
+ return !currentState;
674
702
  }
703
+ const RootContainer = styled.div.withConfig({
704
+ displayName: "RootContainer",
705
+ componentId: "sc-sa7btb-0"
706
+ })`position:relative;min-height:200px;&:empty{background-color:var(--card-skeleton-color-from);display:table;width:100%;}&:empty:after{content:'Missing/invalid data';display:table-cell;vertical-align:middle;text-align:center;position:relative;}`;
675
707
  class Arrow extends PureComponent {
676
- line;
677
708
  eventHandlers = {};
678
709
  componentDidMount() {
679
- const { from, to, api, map, zIndex, onClick, color, arrowRef } = this.props, lineSymbol = {
710
+ const {
711
+ from,
712
+ to,
713
+ api,
714
+ map,
715
+ zIndex,
716
+ onClick,
717
+ color,
718
+ arrowRef
719
+ } = this.props, lineSymbol = {
680
720
  path: api.SymbolPath.FORWARD_OPEN_ARROW
681
721
  };
682
722
  this.line = new api.Polyline({
683
723
  map,
684
724
  zIndex,
685
725
  path: [from, to],
686
- icons: [{ icon: lineSymbol, offset: "50%" }],
726
+ icons: [{
727
+ icon: lineSymbol,
728
+ offset: "50%"
729
+ }],
687
730
  strokeOpacity: 0.55,
688
731
  strokeColor: color ? color.text : "black"
689
732
  }), onClick && (this.eventHandlers.click = api.event.addListener(this.line, "click", onClick)), arrowRef && (arrowRef.current = this.line);
@@ -691,93 +734,84 @@ class Arrow extends PureComponent {
691
734
  componentDidUpdate(prevProps) {
692
735
  if (!this.line)
693
736
  return;
694
- const { from, to, map } = this.props;
737
+ const {
738
+ from,
739
+ to,
740
+ map
741
+ } = this.props;
695
742
  (!latLngAreEqual(prevProps.from, from) || !latLngAreEqual(prevProps.to, to)) && this.line.setPath([from, to]), prevProps.map !== map && this.line.setMap(map);
696
743
  }
697
744
  componentWillUnmount() {
698
745
  this.line && this.line.setMap(null), this.eventHandlers.click && this.eventHandlers.click.remove();
699
746
  }
700
- // eslint-disable-next-line class-methods-use-this
701
747
  render() {
702
748
  return null;
703
749
  }
704
750
  }
705
- function GeopointMove({ diff, api, map, label }) {
706
- const { fromValue: from, toValue: to } = diff, annotation = diff.isChanged ? diff.annotation : void 0, userColor = useUserColor(annotation ? annotation.author : null) || void 0, fromRef = useRef(void 0), toRef = useRef(void 0);
707
- return /* @__PURE__ */ jsxs(Fragment, { children: [
708
- from && /* @__PURE__ */ jsx(
709
- Marker,
710
- {
711
- api,
712
- map,
713
- position: from,
714
- zIndex: 0,
715
- opacity: 0.55,
716
- markerRef: fromRef,
717
- color: userColor
718
- }
719
- ),
720
- from && to && /* @__PURE__ */ jsx(Arrow, { api, map, from, to, zIndex: 1, color: userColor }),
721
- to && /* @__PURE__ */ jsx(
722
- Marker,
723
- {
724
- api,
725
- map,
726
- position: to,
727
- zIndex: 2,
728
- markerRef: toRef,
729
- label,
730
- color: userColor
751
+ function GeopointMove(t0) {
752
+ const $ = c(21), {
753
+ diff,
754
+ api,
755
+ map,
756
+ label
757
+ } = t0, {
758
+ fromValue: from,
759
+ toValue: to
760
+ } = diff, annotation = diff.isChanged ? diff.annotation : void 0, userColor = useUserColor(annotation ? annotation.author : null) || void 0, fromRef = useRef(void 0), toRef = useRef(void 0);
761
+ let t1;
762
+ $[0] !== api || $[1] !== from || $[2] !== map || $[3] !== userColor ? (t1 = from && /* @__PURE__ */ jsx(Marker, { api, map, position: from, zIndex: 0, opacity: 0.55, markerRef: fromRef, color: userColor }), $[0] = api, $[1] = from, $[2] = map, $[3] = userColor, $[4] = t1) : t1 = $[4];
763
+ let t2;
764
+ $[5] !== api || $[6] !== from || $[7] !== map || $[8] !== to || $[9] !== userColor ? (t2 = from && to && /* @__PURE__ */ jsx(Arrow, { api, map, from, to, zIndex: 1, color: userColor }), $[5] = api, $[6] = from, $[7] = map, $[8] = to, $[9] = userColor, $[10] = t2) : t2 = $[10];
765
+ let t3;
766
+ $[11] !== api || $[12] !== label || $[13] !== map || $[14] !== to || $[15] !== userColor ? (t3 = to && /* @__PURE__ */ jsx(Marker, { api, map, position: to, zIndex: 2, markerRef: toRef, label, color: userColor }), $[11] = api, $[12] = label, $[13] = map, $[14] = to, $[15] = userColor, $[16] = t3) : t3 = $[16];
767
+ let t4;
768
+ return $[17] !== t1 || $[18] !== t2 || $[19] !== t3 ? (t4 = /* @__PURE__ */ jsxs(Fragment, { children: [
769
+ t1,
770
+ t2,
771
+ t3
772
+ ] }), $[17] = t1, $[18] = t2, $[19] = t3, $[20] = t4) : t4 = $[20], t4;
773
+ }
774
+ const GeopointArrayDiff = (t0) => {
775
+ const $ = c(4), {
776
+ diff,
777
+ schemaType
778
+ } = t0;
779
+ let t1;
780
+ $[0] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (t1 = getGeoConfig(), $[0] = t1) : t1 = $[0];
781
+ let t2;
782
+ return $[1] !== diff || $[2] !== schemaType ? (t2 = /* @__PURE__ */ jsx(RootContainer, { children: /* @__PURE__ */ jsx(GoogleMapsLoadProxy, { config: t1, children: (api) => /* @__PURE__ */ jsx(GeopointDiff$1, { api, diff, schemaType }) }) }), $[1] = diff, $[2] = schemaType, $[3] = t2) : t2 = $[3], t2;
783
+ };
784
+ function GeopointDiff$1(t0) {
785
+ const $ = c(17), {
786
+ api,
787
+ diff
788
+ } = t0;
789
+ let T0, bounds, t1, t2, t3;
790
+ if ($[0] !== api || $[1] !== diff.fromValue || $[2] !== diff.toValue) {
791
+ t3 = /* @__PURE__ */ Symbol.for("react.early_return_sentinel");
792
+ bb0: {
793
+ const fromValue = (diff.fromValue || []).filter(hasCoordinates), toValue = (diff.toValue || []).filter(hasCoordinates);
794
+ if (fromValue.length === 0 && toValue.length === 0) {
795
+ t3 = null;
796
+ break bb0;
731
797
  }
732
- )
733
- ] });
734
- }
735
- const RootContainer = styled.div`
736
- position: relative;
737
- min-height: 200px;
738
-
739
- &:empty {
740
- background-color: var(--card-skeleton-color-from);
741
- display: table;
742
- width: 100%;
743
- }
744
-
745
- &:empty:after {
746
- content: 'Missing/invalid data';
747
- display: table-cell;
748
- vertical-align: middle;
749
- text-align: center;
750
- position: relative;
751
- }
752
- `, GeopointArrayDiff = ({
753
- diff,
754
- schemaType
755
- }) => /* @__PURE__ */ jsx(RootContainer, { children: /* @__PURE__ */ jsx(GoogleMapsLoadProxy, { config: getGeoConfig(), children: (api) => /* @__PURE__ */ jsx(GeopointDiff$1, { api, diff, schemaType }) }) });
756
- function GeopointDiff$1({ api, diff }) {
757
- const fromValue = (diff.fromValue || []).filter(hasCoordinates), toValue = (diff.toValue || []).filter(hasCoordinates);
758
- if (fromValue.length === 0 && toValue.length === 0)
759
- return null;
760
- const bounds = getBounds$2(fromValue, toValue, api);
761
- return /* @__PURE__ */ jsx(
762
- GoogleMap,
763
- {
764
- api,
765
- location: bounds.getCenter().toJSON(),
766
- mapTypeControl: !1,
767
- controlSize: 20,
768
- bounds,
769
- children: (map) => /* @__PURE__ */ jsx(Fragment, { children: diff.items.map(({ toIndex, diff: pointDiff }) => isChangeDiff(pointDiff) ? /* @__PURE__ */ jsx(
770
- GeopointMove,
771
- {
772
- api,
773
- map,
774
- diff: pointDiff,
775
- label: `${toIndex}`
776
- },
777
- toIndex
778
- ) : null) })
798
+ bounds = getBounds$2(fromValue, toValue, api), T0 = GoogleMap, t1 = api, t2 = bounds.getCenter().toJSON();
779
799
  }
780
- );
800
+ $[0] = api, $[1] = diff.fromValue, $[2] = diff.toValue, $[3] = T0, $[4] = bounds, $[5] = t1, $[6] = t2, $[7] = t3;
801
+ } else
802
+ T0 = $[3], bounds = $[4], t1 = $[5], t2 = $[6], t3 = $[7];
803
+ if (t3 !== /* @__PURE__ */ Symbol.for("react.early_return_sentinel"))
804
+ return t3;
805
+ let t4;
806
+ $[8] !== api || $[9] !== diff.items ? (t4 = (map) => /* @__PURE__ */ jsx(Fragment, { children: diff.items.map((t52) => {
807
+ const {
808
+ toIndex,
809
+ diff: pointDiff
810
+ } = t52;
811
+ return isChangeDiff(pointDiff) ? /* @__PURE__ */ jsx(GeopointMove, { api, map, diff: pointDiff, label: `${toIndex}` }, toIndex) : null;
812
+ }) }), $[8] = api, $[9] = diff.items, $[10] = t4) : t4 = $[10];
813
+ let t5;
814
+ return $[11] !== T0 || $[12] !== bounds || $[13] !== t1 || $[14] !== t2 || $[15] !== t4 ? (t5 = /* @__PURE__ */ jsx(T0, { api: t1, location: t2, mapTypeControl: !1, controlSize: 20, bounds, children: t4 }), $[11] = T0, $[12] = bounds, $[13] = t1, $[14] = t2, $[15] = t4, $[16] = t5) : t5 = $[16], t5;
781
815
  }
782
816
  function isChangeDiff(diff) {
783
817
  return diff.action !== "unchanged" && diff.type === "object";
@@ -789,30 +823,52 @@ function getBounds$2(fromValue, toValue, api) {
789
823
  const bounds = new api.LatLngBounds();
790
824
  return [...fromValue || [], ...toValue || []].forEach((point) => bounds.extend(point)), bounds;
791
825
  }
792
- const GeopointFieldDiff = ({
793
- diff,
794
- schemaType
795
- }) => /* @__PURE__ */ jsx(RootContainer, { children: /* @__PURE__ */ jsx(GoogleMapsLoadProxy, { config: getGeoConfig(), children: (api) => /* @__PURE__ */ jsx(GeopointDiff, { api, diff, schemaType }) }) });
796
- function GeopointDiff({ api, diff }) {
797
- const { fromValue, toValue } = diff, annotation = getAnnotationAtPath(diff, ["lat"]) || getAnnotationAtPath(diff, ["lng"]) || getAnnotationAtPath(diff, []), center = getCenter$1(diff, api), bounds = fromValue && toValue ? getBounds$1(fromValue, toValue, api) : void 0;
798
- return /* @__PURE__ */ jsx(DiffTooltip, { annotations: annotation ? [annotation] : [], description: getAction$1(diff), children: /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(
799
- GoogleMap,
800
- {
801
- api,
802
- location: center,
803
- mapTypeControl: !1,
804
- controlSize: 20,
805
- bounds,
806
- scrollWheel: !1,
807
- children: (map) => /* @__PURE__ */ jsx(GeopointMove, { api, map, diff })
808
- }
809
- ) }) });
826
+ const GeopointFieldDiff = (t0) => {
827
+ const $ = c(4), {
828
+ diff,
829
+ schemaType
830
+ } = t0;
831
+ let t1;
832
+ $[0] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (t1 = getGeoConfig(), $[0] = t1) : t1 = $[0];
833
+ let t2;
834
+ return $[1] !== diff || $[2] !== schemaType ? (t2 = /* @__PURE__ */ jsx(RootContainer, { children: /* @__PURE__ */ jsx(GoogleMapsLoadProxy, { config: t1, children: (api) => /* @__PURE__ */ jsx(GeopointDiff, { api, diff, schemaType }) }) }), $[1] = diff, $[2] = schemaType, $[3] = t2) : t2 = $[3], t2;
835
+ };
836
+ function GeopointDiff(t0) {
837
+ const $ = c(25), {
838
+ api,
839
+ diff
840
+ } = t0, {
841
+ fromValue,
842
+ toValue
843
+ } = diff;
844
+ let t1;
845
+ $[0] !== diff ? (t1 = getAnnotationAtPath(diff, ["lat"]) || getAnnotationAtPath(diff, ["lng"]) || getAnnotationAtPath(diff, []), $[0] = diff, $[1] = t1) : t1 = $[1];
846
+ const annotation = t1;
847
+ let t2;
848
+ $[2] !== api || $[3] !== diff ? (t2 = getCenter$1(diff, api), $[2] = api, $[3] = diff, $[4] = t2) : t2 = $[4];
849
+ const center = t2;
850
+ let t3;
851
+ $[5] !== api || $[6] !== fromValue || $[7] !== toValue ? (t3 = fromValue && toValue ? getBounds$1(fromValue, toValue, api) : void 0, $[5] = api, $[6] = fromValue, $[7] = toValue, $[8] = t3) : t3 = $[8];
852
+ const bounds = t3;
853
+ let t4;
854
+ $[9] !== annotation ? (t4 = annotation ? [annotation] : [], $[9] = annotation, $[10] = t4) : t4 = $[10];
855
+ let t5;
856
+ $[11] !== diff ? (t5 = getAction$1(diff), $[11] = diff, $[12] = t5) : t5 = $[12];
857
+ let t6;
858
+ $[13] !== api || $[14] !== diff ? (t6 = (map) => /* @__PURE__ */ jsx(GeopointMove, { api, map, diff }), $[13] = api, $[14] = diff, $[15] = t6) : t6 = $[15];
859
+ let t7;
860
+ $[16] !== api || $[17] !== bounds || $[18] !== center || $[19] !== t6 ? (t7 = /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(GoogleMap, { api, location: center, mapTypeControl: !1, controlSize: 20, bounds, scrollWheel: !1, children: t6 }) }), $[16] = api, $[17] = bounds, $[18] = center, $[19] = t6, $[20] = t7) : t7 = $[20];
861
+ let t8;
862
+ return $[21] !== t4 || $[22] !== t5 || $[23] !== t7 ? (t8 = /* @__PURE__ */ jsx(DiffTooltip, { annotations: t4, description: t5, children: t7 }), $[21] = t4, $[22] = t5, $[23] = t7, $[24] = t8) : t8 = $[24], t8;
810
863
  }
811
864
  function getBounds$1(fromValue, toValue, api) {
812
865
  return new api.LatLngBounds().extend(fromValue).extend(toValue);
813
866
  }
814
867
  function getCenter$1(diff, api) {
815
- const { fromValue, toValue } = diff;
868
+ const {
869
+ fromValue,
870
+ toValue
871
+ } = diff;
816
872
  if (fromValue && toValue)
817
873
  return getBounds$1(fromValue, toValue, api).getCenter().toJSON();
818
874
  if (fromValue)
@@ -822,16 +878,31 @@ function getCenter$1(diff, api) {
822
878
  throw new Error("Neither a from or a to value present");
823
879
  }
824
880
  function getAction$1(diff) {
825
- const { fromValue, toValue } = diff;
881
+ const {
882
+ fromValue,
883
+ toValue
884
+ } = diff;
826
885
  return fromValue && toValue ? "Moved" : fromValue ? "Removed" : toValue ? "Added" : "Unchanged";
827
886
  }
828
- function GeopointRadiusMove({ diff, api, map, label }) {
829
- const { fromValue: from, toValue: to } = diff, annotation = diff.isChanged ? diff.annotation : void 0, userColor = useUserColor(annotation ? annotation.author : null) || void 0, fromRef = useRef(void 0), toRef = useRef(void 0), fromCircleRef = useRef(void 0), toCircleRef = useRef(void 0);
830
- return useEffect(() => {
887
+ function GeopointRadiusMove(t0) {
888
+ const $ = c(33), {
889
+ diff,
890
+ api,
891
+ map,
892
+ label
893
+ } = t0, {
894
+ fromValue: from,
895
+ toValue: to
896
+ } = diff, annotation = diff.isChanged ? diff.annotation : void 0, userColor = useUserColor(annotation ? annotation.author : null) || void 0, fromRef = useRef(void 0), toRef = useRef(void 0), fromCircleRef = useRef(void 0), toCircleRef = useRef(void 0);
897
+ let t1;
898
+ $[0] !== api || $[1] !== from || $[2] !== map || $[3] !== to || $[4] !== userColor?.background ? (t1 = () => {
831
899
  const color = userColor?.background || "#4285F4";
832
900
  return from && from.radius && (fromCircleRef.current = new api.Circle({
833
901
  map,
834
- center: { lat: from.lat, lng: from.lng },
902
+ center: {
903
+ lat: from.lat,
904
+ lng: from.lng
905
+ },
835
906
  radius: from.radius,
836
907
  fillColor: color,
837
908
  fillOpacity: 0.1,
@@ -841,7 +912,10 @@ function GeopointRadiusMove({ diff, api, map, label }) {
841
912
  zIndex: 0
842
913
  })), to && to.radius && (toCircleRef.current = new api.Circle({
843
914
  map,
844
- center: { lat: to.lat, lng: to.lng },
915
+ center: {
916
+ lat: to.lat,
917
+ lng: to.lng
918
+ },
845
919
  radius: to.radius,
846
920
  fillColor: color,
847
921
  fillOpacity: 0.2,
@@ -852,52 +926,59 @@ function GeopointRadiusMove({ diff, api, map, label }) {
852
926
  })), () => {
853
927
  fromCircleRef.current && fromCircleRef.current.setMap(null), toCircleRef.current && toCircleRef.current.setMap(null);
854
928
  };
855
- }, [api, map, from, to, userColor]), /* @__PURE__ */ jsxs(Fragment, { children: [
856
- from && /* @__PURE__ */ jsx(
857
- Marker,
858
- {
859
- api,
860
- map,
861
- position: from,
862
- zIndex: 0,
863
- opacity: 0.55,
864
- markerRef: fromRef,
865
- color: userColor
866
- }
867
- ),
868
- from && to && /* @__PURE__ */ jsx(Arrow, { api, map, from, to, zIndex: 1, color: userColor }),
869
- to && /* @__PURE__ */ jsx(
870
- Marker,
871
- {
872
- api,
873
- map,
874
- position: to,
875
- zIndex: 2,
876
- markerRef: toRef,
877
- label,
878
- color: userColor
879
- }
880
- )
881
- ] });
882
- }
883
- const GeopointRadiusFieldDiff = ({
884
- diff,
885
- schemaType
886
- }) => /* @__PURE__ */ jsx(RootContainer, { children: /* @__PURE__ */ jsx(GoogleMapsLoadProxy, { config: getGeoConfig(), children: (api) => /* @__PURE__ */ jsx(GeopointRadiusDiff, { api, diff, schemaType }) }) });
887
- function GeopointRadiusDiff({ api, diff }) {
888
- const { fromValue, toValue } = diff, annotation = getAnnotationAtPath(diff, ["lat"]) || getAnnotationAtPath(diff, ["lng"]) || getAnnotationAtPath(diff, ["radius"]) || getAnnotationAtPath(diff, []), center = getCenter(diff, api), bounds = fromValue && toValue ? getBounds(fromValue, toValue, api) : void 0;
889
- return /* @__PURE__ */ jsx(DiffTooltip, { annotations: annotation ? [annotation] : [], description: getAction(diff), children: /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(
890
- GoogleMap,
891
- {
892
- api,
893
- location: center,
894
- mapTypeControl: !1,
895
- controlSize: 20,
896
- bounds,
897
- scrollWheel: !1,
898
- children: (map) => /* @__PURE__ */ jsx(GeopointRadiusMove, { api, map, diff })
899
- }
900
- ) }) });
929
+ }, $[0] = api, $[1] = from, $[2] = map, $[3] = to, $[4] = userColor?.background, $[5] = t1) : t1 = $[5];
930
+ let t2;
931
+ $[6] !== api || $[7] !== from || $[8] !== map || $[9] !== to || $[10] !== userColor ? (t2 = [api, map, from, to, userColor], $[6] = api, $[7] = from, $[8] = map, $[9] = to, $[10] = userColor, $[11] = t2) : t2 = $[11], useEffect(t1, t2);
932
+ let t3;
933
+ $[12] !== api || $[13] !== from || $[14] !== map || $[15] !== userColor ? (t3 = from && /* @__PURE__ */ jsx(Marker, { api, map, position: from, zIndex: 0, opacity: 0.55, markerRef: fromRef, color: userColor }), $[12] = api, $[13] = from, $[14] = map, $[15] = userColor, $[16] = t3) : t3 = $[16];
934
+ let t4;
935
+ $[17] !== api || $[18] !== from || $[19] !== map || $[20] !== to || $[21] !== userColor ? (t4 = from && to && /* @__PURE__ */ jsx(Arrow, { api, map, from, to, zIndex: 1, color: userColor }), $[17] = api, $[18] = from, $[19] = map, $[20] = to, $[21] = userColor, $[22] = t4) : t4 = $[22];
936
+ let t5;
937
+ $[23] !== api || $[24] !== label || $[25] !== map || $[26] !== to || $[27] !== userColor ? (t5 = to && /* @__PURE__ */ jsx(Marker, { api, map, position: to, zIndex: 2, markerRef: toRef, label, color: userColor }), $[23] = api, $[24] = label, $[25] = map, $[26] = to, $[27] = userColor, $[28] = t5) : t5 = $[28];
938
+ let t6;
939
+ return $[29] !== t3 || $[30] !== t4 || $[31] !== t5 ? (t6 = /* @__PURE__ */ jsxs(Fragment, { children: [
940
+ t3,
941
+ t4,
942
+ t5
943
+ ] }), $[29] = t3, $[30] = t4, $[31] = t5, $[32] = t6) : t6 = $[32], t6;
944
+ }
945
+ const GeopointRadiusFieldDiff = (t0) => {
946
+ const $ = c(4), {
947
+ diff,
948
+ schemaType
949
+ } = t0;
950
+ let t1;
951
+ $[0] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (t1 = getGeoConfig(), $[0] = t1) : t1 = $[0];
952
+ let t2;
953
+ return $[1] !== diff || $[2] !== schemaType ? (t2 = /* @__PURE__ */ jsx(RootContainer, { children: /* @__PURE__ */ jsx(GoogleMapsLoadProxy, { config: t1, children: (api) => /* @__PURE__ */ jsx(GeopointRadiusDiff, { api, diff, schemaType }) }) }), $[1] = diff, $[2] = schemaType, $[3] = t2) : t2 = $[3], t2;
954
+ };
955
+ function GeopointRadiusDiff(t0) {
956
+ const $ = c(25), {
957
+ api,
958
+ diff
959
+ } = t0, {
960
+ fromValue,
961
+ toValue
962
+ } = diff;
963
+ let t1;
964
+ $[0] !== diff ? (t1 = getAnnotationAtPath(diff, ["lat"]) || getAnnotationAtPath(diff, ["lng"]) || getAnnotationAtPath(diff, ["radius"]) || getAnnotationAtPath(diff, []), $[0] = diff, $[1] = t1) : t1 = $[1];
965
+ const annotation = t1;
966
+ let t2;
967
+ $[2] !== api || $[3] !== diff ? (t2 = getCenter(diff, api), $[2] = api, $[3] = diff, $[4] = t2) : t2 = $[4];
968
+ const center = t2;
969
+ let t3;
970
+ $[5] !== api || $[6] !== fromValue || $[7] !== toValue ? (t3 = fromValue && toValue ? getBounds(fromValue, toValue, api) : void 0, $[5] = api, $[6] = fromValue, $[7] = toValue, $[8] = t3) : t3 = $[8];
971
+ const bounds = t3;
972
+ let t4;
973
+ $[9] !== annotation ? (t4 = annotation ? [annotation] : [], $[9] = annotation, $[10] = t4) : t4 = $[10];
974
+ let t5;
975
+ $[11] !== diff ? (t5 = getAction(diff), $[11] = diff, $[12] = t5) : t5 = $[12];
976
+ let t6;
977
+ $[13] !== api || $[14] !== diff ? (t6 = (map) => /* @__PURE__ */ jsx(GeopointRadiusMove, { api, map, diff }), $[13] = api, $[14] = diff, $[15] = t6) : t6 = $[15];
978
+ let t7;
979
+ $[16] !== api || $[17] !== bounds || $[18] !== center || $[19] !== t6 ? (t7 = /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(GoogleMap, { api, location: center, mapTypeControl: !1, controlSize: 20, bounds, scrollWheel: !1, children: t6 }) }), $[16] = api, $[17] = bounds, $[18] = center, $[19] = t6, $[20] = t7) : t7 = $[20];
980
+ let t8;
981
+ return $[21] !== t4 || $[22] !== t5 || $[23] !== t7 ? (t8 = /* @__PURE__ */ jsx(DiffTooltip, { annotations: t4, description: t5, children: t7 }), $[21] = t4, $[22] = t5, $[23] = t7, $[24] = t8) : t8 = $[24], t8;
901
982
  }
902
983
  function getBounds(fromValue, toValue, api) {
903
984
  const bounds = new api.LatLngBounds().extend(fromValue).extend(toValue), fromRadius = fromValue.radius || 0, toRadius = toValue.radius || 0, maxRadius = Math.max(fromRadius, toRadius);
@@ -920,7 +1001,10 @@ function getBounds(fromValue, toValue, api) {
920
1001
  return bounds;
921
1002
  }
922
1003
  function getCenter(diff, api) {
923
- const { fromValue, toValue } = diff;
1004
+ const {
1005
+ fromValue,
1006
+ toValue
1007
+ } = diff;
924
1008
  if (fromValue && toValue)
925
1009
  return getBounds(fromValue, toValue, api).getCenter().toJSON();
926
1010
  if (fromValue)
@@ -930,7 +1014,10 @@ function getCenter(diff, api) {
930
1014
  throw new Error("Neither a from or a to value present");
931
1015
  }
932
1016
  function getAction(diff) {
933
- const { fromValue, toValue } = diff;
1017
+ const {
1018
+ fromValue,
1019
+ toValue
1020
+ } = diff;
934
1021
  if (fromValue && toValue) {
935
1022
  const latChanged = fromValue.lat !== toValue.lat || fromValue.lng !== toValue.lng, radiusChanged = fromValue.radius !== toValue.radius;
936
1023
  return latChanged && radiusChanged ? "Moved and radius changed" : latChanged ? "Moved" : radiusChanged ? "Radius changed" : "Unchanged";
@@ -945,51 +1032,48 @@ function getAction(diff) {
945
1032
  const googleMapsInput = definePlugin((config2) => (setGeoConfig(config2), {
946
1033
  name: "google-maps-input",
947
1034
  schema: {
948
- types: [
949
- {
950
- name: "geopointRadius",
951
- title: "Geopoint with Radius",
952
- type: "object",
953
- fields: [
954
- {
955
- name: "lat",
956
- title: "Latitude",
957
- type: "number",
958
- validation: (Rule) => Rule.required().min(-90).max(90)
959
- },
960
- {
961
- name: "lng",
962
- title: "Longitude",
963
- type: "number",
964
- validation: (Rule) => Rule.required().min(-180).max(180)
965
- },
966
- {
967
- name: "alt",
968
- title: "Altitude",
969
- type: "number"
970
- },
971
- {
972
- name: "radius",
973
- title: "Radius (meters)",
974
- type: "number",
975
- validation: (Rule) => Rule.required().min(1).max(5e4)
976
- }
977
- ],
978
- preview: {
979
- select: {
980
- lat: "lat",
981
- lng: "lng",
982
- radius: "radius"
983
- },
984
- prepare({ lat, lng, radius }) {
985
- return {
986
- title: `${lat.toFixed(6)}, ${lng.toFixed(6)}`,
987
- subtitle: radius ? `Radius: ${radius}m` : "No radius set"
988
- };
989
- }
1035
+ types: [{
1036
+ name: "geopointRadius",
1037
+ title: "Geopoint with Radius",
1038
+ type: "object",
1039
+ fields: [{
1040
+ name: "lat",
1041
+ title: "Latitude",
1042
+ type: "number",
1043
+ validation: (Rule) => Rule.required().min(-90).max(90)
1044
+ }, {
1045
+ name: "lng",
1046
+ title: "Longitude",
1047
+ type: "number",
1048
+ validation: (Rule) => Rule.required().min(-180).max(180)
1049
+ }, {
1050
+ name: "alt",
1051
+ title: "Altitude",
1052
+ type: "number"
1053
+ }, {
1054
+ name: "radius",
1055
+ title: "Radius (meters)",
1056
+ type: "number",
1057
+ validation: (Rule) => Rule.required().min(1).max(5e4)
1058
+ }],
1059
+ preview: {
1060
+ select: {
1061
+ lat: "lat",
1062
+ lng: "lng",
1063
+ radius: "radius"
1064
+ },
1065
+ prepare({
1066
+ lat,
1067
+ lng,
1068
+ radius
1069
+ }) {
1070
+ return {
1071
+ title: `${lat.toFixed(6)}, ${lng.toFixed(6)}`,
1072
+ subtitle: radius ? `Radius: ${radius}m` : "No radius set"
1073
+ };
990
1074
  }
991
1075
  }
992
- ]
1076
+ }]
993
1077
  },
994
1078
  form: {
995
1079
  components: {