@sanity/google-maps-input 6.1.0 → 6.1.2
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.
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +835 -629
- package/dist/index.js.map +1 -1
- package/package.json +11 -12
package/dist/index.js
CHANGED
|
@@ -1,697 +1,903 @@
|
|
|
1
1
|
import "@sanity/google-maps-input/bundle.css";
|
|
2
|
-
import { jsx, jsxs, Fragment } from "react/jsx-runtime";
|
|
3
2
|
import { c } from "react/compiler-runtime";
|
|
4
|
-
import { DiffFromTo,
|
|
5
|
-
import { ImageIcon
|
|
6
|
-
import {
|
|
7
|
-
import { createContext,
|
|
8
|
-
import {
|
|
9
|
-
|
|
3
|
+
import { ChangeIndicator, DiffFromTo, definePlugin, set, setIfMissing, unset } from "sanity";
|
|
4
|
+
import { ImageIcon } from "@sanity/icons/Image";
|
|
5
|
+
import { Box, Button, Card, Code, Dialog, Flex, Grid, Label, Spinner, Stack, Text, TextInput } from "@sanity/ui";
|
|
6
|
+
import { createContext, use, useEffect, useId, useRef, useState } from "react";
|
|
7
|
+
import { APILoadingStatus, APIProvider, AdvancedMarker, Circle, ControlPosition, Map, MapControl, StaticMap, createStaticMapsUrl, useApiLoadingStatus, useMap, useMapsLibrary } from "@vis.gl/react-google-maps";
|
|
8
|
+
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
|
|
9
|
+
import { EditIcon } from "@sanity/icons/Edit";
|
|
10
|
+
import { TrashIcon } from "@sanity/icons/Trash";
|
|
11
|
+
import { ErrorOutlineIcon } from "@sanity/icons/ErrorOutline";
|
|
12
|
+
import { WarningOutlineIcon } from "@sanity/icons/WarningOutline";
|
|
13
|
+
const METERS_PER_DEGREE = 111e3;
|
|
10
14
|
function lngMetersPerDegree(lat) {
|
|
11
|
-
|
|
15
|
+
return METERS_PER_DEGREE * Math.max(Math.cos(lat * Math.PI / 180), .01);
|
|
12
16
|
}
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
markers: [{
|
|
31
|
-
location: center
|
|
32
|
-
}]
|
|
33
|
-
});
|
|
17
|
+
/**
|
|
18
|
+
* Static map preview for a plain geopoint: a single marker centered in view.
|
|
19
|
+
*/
|
|
20
|
+
function getGeopointStaticMapUrl(value, apiKey, { width = 640, height = 300, zoom = 13 } = {}) {
|
|
21
|
+
let center = {
|
|
22
|
+
lat: value.lat,
|
|
23
|
+
lng: value.lng
|
|
24
|
+
};
|
|
25
|
+
return createStaticMapsUrl({
|
|
26
|
+
apiKey,
|
|
27
|
+
width,
|
|
28
|
+
height,
|
|
29
|
+
scale: 2,
|
|
30
|
+
zoom,
|
|
31
|
+
center,
|
|
32
|
+
markers: [{ location: center }]
|
|
33
|
+
});
|
|
34
34
|
}
|
|
35
35
|
function generateCirclePoints(lat, lng, radius) {
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
36
|
+
let points = [], latRatio = radius / METERS_PER_DEGREE, lngRatio = radius / lngMetersPerDegree(lat);
|
|
37
|
+
for (let i = 0; i <= 64; i++) {
|
|
38
|
+
let angle = i / 64 * 2 * Math.PI;
|
|
39
|
+
points.push({
|
|
40
|
+
lat: lat + latRatio * Math.cos(angle),
|
|
41
|
+
lng: lng + lngRatio * Math.sin(angle)
|
|
42
|
+
});
|
|
43
|
+
}
|
|
44
|
+
return points;
|
|
45
45
|
}
|
|
46
|
-
|
|
46
|
+
/**
|
|
47
|
+
* The four cardinal extremes of the (padded) circle. Passing these as `visible`
|
|
48
|
+
* lets the Static Maps API auto-fit the viewport around the whole circle —
|
|
49
|
+
* with margin — instead of clipping it.
|
|
50
|
+
*/
|
|
47
51
|
function getCircleBounds(lat, lng, radius) {
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
52
|
+
let padded = radius * 1.15, latDelta = padded / METERS_PER_DEGREE, lngDelta = padded / lngMetersPerDegree(lat);
|
|
53
|
+
return [
|
|
54
|
+
{
|
|
55
|
+
lat: lat + latDelta,
|
|
56
|
+
lng
|
|
57
|
+
},
|
|
58
|
+
{
|
|
59
|
+
lat: lat - latDelta,
|
|
60
|
+
lng
|
|
61
|
+
},
|
|
62
|
+
{
|
|
63
|
+
lat,
|
|
64
|
+
lng: lng + lngDelta
|
|
65
|
+
},
|
|
66
|
+
{
|
|
67
|
+
lat,
|
|
68
|
+
lng: lng - lngDelta
|
|
69
|
+
}
|
|
70
|
+
];
|
|
62
71
|
}
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
72
|
+
/**
|
|
73
|
+
* Static map preview for a geopoint with a radius: a marker plus a filled circle.
|
|
74
|
+
* The viewport is derived from the circle bounds (no fixed zoom) so the entire
|
|
75
|
+
* radius stays within the image.
|
|
76
|
+
*/
|
|
77
|
+
function getGeopointRadiusStaticMapUrl(value, apiKey, { width = 640, height = 300 } = {}) {
|
|
78
|
+
return value.radius ? createStaticMapsUrl({
|
|
79
|
+
apiKey,
|
|
80
|
+
width,
|
|
81
|
+
height,
|
|
82
|
+
scale: 2,
|
|
83
|
+
markers: [{ location: {
|
|
84
|
+
lat: value.lat,
|
|
85
|
+
lng: value.lng
|
|
86
|
+
} }],
|
|
87
|
+
paths: [{
|
|
88
|
+
coordinates: generateCirclePoints(value.lat, value.lng, value.radius),
|
|
89
|
+
color: "0x4285F4",
|
|
90
|
+
weight: 2,
|
|
91
|
+
fillcolor: "0x4285F480"
|
|
92
|
+
}],
|
|
93
|
+
visible: getCircleBounds(value.lat, value.lng, value.radius)
|
|
94
|
+
}) : getGeopointStaticMapUrl(value, apiKey, {
|
|
95
|
+
width,
|
|
96
|
+
height
|
|
97
|
+
});
|
|
89
98
|
}
|
|
99
|
+
/**
|
|
100
|
+
* Diff components are resolved by the Studio outside of the form, so they can't
|
|
101
|
+
* receive the plugin config as a prop the way the inputs do. The plugin installs
|
|
102
|
+
* this provider at the Studio layout level so diff previews can read the API key.
|
|
103
|
+
*/
|
|
90
104
|
const GoogleMapsInputContext = createContext(null);
|
|
91
105
|
GoogleMapsInputContext.displayName = "GoogleMapsInputContext";
|
|
92
106
|
var mapDiffImage = "_7uupx50", mapDiffPlaceholder = "_7uupx51";
|
|
93
107
|
function hasRadius(value) {
|
|
94
|
-
|
|
108
|
+
return typeof value.radius == "number";
|
|
95
109
|
}
|
|
110
|
+
/**
|
|
111
|
+
* Renders the static map image for a single side of a geopoint/geopointRadius
|
|
112
|
+
* diff. Used as the `previewComponent` for `DiffFromTo`, mirroring how the
|
|
113
|
+
* built-in image diff shows a before/after thumbnail.
|
|
114
|
+
*/
|
|
96
115
|
function StaticMapDiffPreview(t0) {
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
116
|
+
let $ = c(7), { value } = t0, [failed, setFailed] = useState(!1), apiKey = use(GoogleMapsInputContext)?.apiKey;
|
|
117
|
+
if (!value || typeof value.lat != "number" || typeof value.lng != "number" || !apiKey) return null;
|
|
118
|
+
if (failed) {
|
|
119
|
+
let t1;
|
|
120
|
+
return $[0] === Symbol.for("react.memo_cache_sentinel") ? (t1 = /* @__PURE__ */ jsx("div", {
|
|
121
|
+
className: mapDiffPlaceholder,
|
|
122
|
+
children: /* @__PURE__ */ jsxs(Flex, {
|
|
123
|
+
align: "center",
|
|
124
|
+
gap: 2,
|
|
125
|
+
justify: "center",
|
|
126
|
+
padding: 3,
|
|
127
|
+
children: [/* @__PURE__ */ jsx(Text, {
|
|
128
|
+
muted: !0,
|
|
129
|
+
size: 1,
|
|
130
|
+
children: /* @__PURE__ */ jsx(ImageIcon, {})
|
|
131
|
+
}), /* @__PURE__ */ jsx(Text, {
|
|
132
|
+
muted: !0,
|
|
133
|
+
size: 1,
|
|
134
|
+
children: "Map preview unavailable"
|
|
135
|
+
})]
|
|
136
|
+
})
|
|
137
|
+
}), $[0] = t1) : t1 = $[0], t1;
|
|
138
|
+
}
|
|
139
|
+
let t1;
|
|
140
|
+
$[1] !== apiKey || $[2] !== value ? (t1 = hasRadius(value) ? getGeopointRadiusStaticMapUrl(value, apiKey, {
|
|
141
|
+
width: 500,
|
|
142
|
+
height: 280
|
|
143
|
+
}) : getGeopointStaticMapUrl(value, apiKey, {
|
|
144
|
+
width: 500,
|
|
145
|
+
height: 280
|
|
146
|
+
}), $[1] = apiKey, $[2] = value, $[3] = t1) : t1 = $[3];
|
|
147
|
+
let url = t1, t2;
|
|
148
|
+
$[4] === Symbol.for("react.memo_cache_sentinel") ? (t2 = () => setFailed(!0), $[4] = t2) : t2 = $[4];
|
|
149
|
+
let t3;
|
|
150
|
+
return $[5] === url ? t3 = $[6] : (t3 = /* @__PURE__ */ jsx("img", {
|
|
151
|
+
className: mapDiffImage,
|
|
152
|
+
alt: "",
|
|
153
|
+
src: url,
|
|
154
|
+
onError: t2,
|
|
155
|
+
height: 280,
|
|
156
|
+
width: 500
|
|
157
|
+
}), $[5] = url, $[6] = t3), t3;
|
|
122
158
|
}
|
|
159
|
+
/**
|
|
160
|
+
* Diff component for `geopoint` and `geopointRadius` values. Renders a
|
|
161
|
+
* before/after static map preview using `DiffFromTo`, matching the look of the
|
|
162
|
+
* built-in image diff. Handles both types: the preview detects a `radius` field
|
|
163
|
+
* and draws the radius circle when present.
|
|
164
|
+
*/
|
|
123
165
|
function GeopointDiff(t0) {
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
166
|
+
let $ = c(3), { diff, schemaType } = t0, t1;
|
|
167
|
+
return $[0] !== diff || $[1] !== schemaType ? (t1 = /* @__PURE__ */ jsx(DiffFromTo, {
|
|
168
|
+
diff,
|
|
169
|
+
schemaType,
|
|
170
|
+
previewComponent: StaticMapDiffPreview,
|
|
171
|
+
layout: "grid"
|
|
172
|
+
}), $[0] = diff, $[1] = schemaType, $[2] = t1) : t1 = $[2], t1;
|
|
130
173
|
}
|
|
131
|
-
const
|
|
174
|
+
const REQUIRED_APIS = [
|
|
175
|
+
"Google Maps JavaScript API",
|
|
176
|
+
"Google Static Maps API",
|
|
177
|
+
"Google Places API (New)"
|
|
178
|
+
];
|
|
132
179
|
function RequiredApis() {
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
180
|
+
let $ = c(1), t0;
|
|
181
|
+
return $[0] === Symbol.for("react.memo_cache_sentinel") ? (t0 = /* @__PURE__ */ jsx(Box, {
|
|
182
|
+
paddingLeft: 3,
|
|
183
|
+
children: /* @__PURE__ */ jsx(Stack, {
|
|
184
|
+
as: "ul",
|
|
185
|
+
gap: 2,
|
|
186
|
+
children: REQUIRED_APIS.map(_temp$2)
|
|
187
|
+
})
|
|
188
|
+
}), $[0] = t0) : t0 = $[0], t0;
|
|
136
189
|
}
|
|
137
190
|
function _temp$2(api) {
|
|
138
|
-
|
|
191
|
+
return /* @__PURE__ */ jsx(Text, {
|
|
192
|
+
as: "li",
|
|
193
|
+
size: 1,
|
|
194
|
+
muted: !0,
|
|
195
|
+
children: api
|
|
196
|
+
}, api);
|
|
139
197
|
}
|
|
140
198
|
function MessageCard(t0) {
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
199
|
+
let $ = c(13), { tone, icon, title, children } = t0, t1;
|
|
200
|
+
$[0] === icon ? t1 = $[1] : (t1 = /* @__PURE__ */ jsx(Box, {
|
|
201
|
+
flex: "none",
|
|
202
|
+
children: /* @__PURE__ */ jsx(Text, {
|
|
203
|
+
size: 3,
|
|
204
|
+
children: icon
|
|
205
|
+
})
|
|
206
|
+
}), $[0] = icon, $[1] = t1);
|
|
207
|
+
let t2;
|
|
208
|
+
$[2] === title ? t2 = $[3] : (t2 = /* @__PURE__ */ jsx(Text, {
|
|
209
|
+
size: 1,
|
|
210
|
+
weight: "semibold",
|
|
211
|
+
children: title
|
|
212
|
+
}), $[2] = title, $[3] = t2);
|
|
213
|
+
let t3;
|
|
214
|
+
$[4] !== children || $[5] !== t2 ? (t3 = /* @__PURE__ */ jsxs(Stack, {
|
|
215
|
+
flex: 1,
|
|
216
|
+
gap: 4,
|
|
217
|
+
children: [t2, children]
|
|
218
|
+
}), $[4] = children, $[5] = t2, $[6] = t3) : t3 = $[6];
|
|
219
|
+
let t4;
|
|
220
|
+
$[7] !== t1 || $[8] !== t3 ? (t4 = /* @__PURE__ */ jsxs(Flex, {
|
|
221
|
+
gap: 3,
|
|
222
|
+
children: [t1, t3]
|
|
223
|
+
}), $[7] = t1, $[8] = t3, $[9] = t4) : t4 = $[9];
|
|
224
|
+
let t5;
|
|
225
|
+
return $[10] !== t4 || $[11] !== tone ? (t5 = /* @__PURE__ */ jsx(Card, {
|
|
226
|
+
padding: 4,
|
|
227
|
+
radius: 2,
|
|
228
|
+
tone,
|
|
229
|
+
border: !0,
|
|
230
|
+
children: t4
|
|
231
|
+
}), $[10] = t4, $[11] = tone, $[12] = t5) : t5 = $[12], t5;
|
|
163
232
|
}
|
|
233
|
+
/**
|
|
234
|
+
* Shown when the plugin has not been given an API key. Explains how to provide
|
|
235
|
+
* one in the plugin config and which Google APIs it needs.
|
|
236
|
+
*/
|
|
164
237
|
function MissingApiKeyCard(t0) {
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
238
|
+
let $ = c(10), { typeTitle } = t0, t1;
|
|
239
|
+
$[0] === Symbol.for("react.memo_cache_sentinel") ? (t1 = /* @__PURE__ */ jsx(WarningOutlineIcon, {}), $[0] = t1) : t1 = $[0];
|
|
240
|
+
let t2;
|
|
241
|
+
$[1] === Symbol.for("react.memo_cache_sentinel") ? (t2 = /* @__PURE__ */ jsx("code", { children: "googleMapsInput" }), $[1] = t2) : t2 = $[1];
|
|
242
|
+
let t3;
|
|
243
|
+
$[2] === typeTitle ? t3 = $[3] : (t3 = /* @__PURE__ */ jsxs(Text, {
|
|
244
|
+
size: 1,
|
|
245
|
+
muted: !0,
|
|
246
|
+
children: [
|
|
247
|
+
"The ",
|
|
248
|
+
typeTitle,
|
|
249
|
+
" field uses Google Maps and needs an API key. Add one to the",
|
|
250
|
+
" ",
|
|
251
|
+
t2,
|
|
252
|
+
" plugin configuration:"
|
|
253
|
+
]
|
|
254
|
+
}), $[2] = typeTitle, $[3] = t3);
|
|
255
|
+
let t4;
|
|
256
|
+
$[4] === Symbol.for("react.memo_cache_sentinel") ? (t4 = /* @__PURE__ */ jsx(Card, {
|
|
257
|
+
padding: 3,
|
|
258
|
+
radius: 2,
|
|
259
|
+
tone: "transparent",
|
|
260
|
+
border: !0,
|
|
261
|
+
overflow: "auto",
|
|
262
|
+
children: /* @__PURE__ */ jsx(Code, {
|
|
263
|
+
size: 1,
|
|
264
|
+
children: "googleMapsInput({apiKey: 'your-api-key'})"
|
|
265
|
+
})
|
|
266
|
+
}), $[4] = t4) : t4 = $[4];
|
|
267
|
+
let t5;
|
|
268
|
+
$[5] === Symbol.for("react.memo_cache_sentinel") ? (t5 = /* @__PURE__ */ jsxs(Stack, {
|
|
269
|
+
gap: 3,
|
|
270
|
+
children: [/* @__PURE__ */ jsx(Text, {
|
|
271
|
+
size: 1,
|
|
272
|
+
muted: !0,
|
|
273
|
+
children: "The key needs these APIs enabled:"
|
|
274
|
+
}), /* @__PURE__ */ jsx(RequiredApis, {})]
|
|
275
|
+
}), $[5] = t5) : t5 = $[5];
|
|
276
|
+
let t6;
|
|
277
|
+
$[6] === Symbol.for("react.memo_cache_sentinel") ? (t6 = /* @__PURE__ */ jsx("a", {
|
|
278
|
+
href: "https://developers.google.com/maps/documentation/javascript/get-api-key",
|
|
279
|
+
target: "_blank",
|
|
280
|
+
rel: "noopener noreferrer",
|
|
281
|
+
children: "Get an API key"
|
|
282
|
+
}), $[6] = t6) : t6 = $[6];
|
|
283
|
+
let t7;
|
|
284
|
+
$[7] === Symbol.for("react.memo_cache_sentinel") ? (t7 = /* @__PURE__ */ jsxs(Text, {
|
|
285
|
+
size: 1,
|
|
286
|
+
muted: !0,
|
|
287
|
+
children: [
|
|
288
|
+
t6,
|
|
289
|
+
" · ",
|
|
290
|
+
/* @__PURE__ */ jsx("a", {
|
|
291
|
+
href: "https://developers.google.com/maps/documentation/javascript/demo-key",
|
|
292
|
+
target: "_blank",
|
|
293
|
+
rel: "noopener noreferrer",
|
|
294
|
+
children: "use a demo key to test"
|
|
295
|
+
})
|
|
296
|
+
]
|
|
297
|
+
}), $[7] = t7) : t7 = $[7];
|
|
298
|
+
let t8;
|
|
299
|
+
return $[8] === t3 ? t8 = $[9] : (t8 = /* @__PURE__ */ jsxs(MessageCard, {
|
|
300
|
+
tone: "caution",
|
|
301
|
+
icon: t1,
|
|
302
|
+
title: "Google Maps API key required",
|
|
303
|
+
children: [
|
|
304
|
+
t3,
|
|
305
|
+
t4,
|
|
306
|
+
t5,
|
|
307
|
+
t7
|
|
308
|
+
]
|
|
309
|
+
}), $[8] = t3, $[9] = t8), t8;
|
|
203
310
|
}
|
|
311
|
+
/**
|
|
312
|
+
* Shown when a key is configured but Google rejects the request (e.g. an
|
|
313
|
+
* invalid/demo key, a restricted key, or one missing the required APIs).
|
|
314
|
+
*/
|
|
204
315
|
function InvalidApiKeyCard() {
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
|
|
211
|
-
|
|
212
|
-
|
|
316
|
+
let $ = c(2), t0;
|
|
317
|
+
$[0] === Symbol.for("react.memo_cache_sentinel") ? (t0 = /* @__PURE__ */ jsx(ErrorOutlineIcon, {}), $[0] = t0) : t0 = $[0];
|
|
318
|
+
let t1;
|
|
319
|
+
return $[1] === Symbol.for("react.memo_cache_sentinel") ? (t1 = /* @__PURE__ */ jsxs(MessageCard, {
|
|
320
|
+
tone: "critical",
|
|
321
|
+
icon: t0,
|
|
322
|
+
title: "Map preview couldn’t load",
|
|
323
|
+
children: [/* @__PURE__ */ jsx(Text, {
|
|
324
|
+
size: 1,
|
|
325
|
+
muted: !0,
|
|
326
|
+
children: "The Google Maps API key was rejected. Check that it is a valid key — not a demo or placeholder key — that it is not restricted in a way that blocks this Studio’s URL, and that it has these APIs enabled:"
|
|
327
|
+
}), /* @__PURE__ */ jsx(RequiredApis, {})]
|
|
328
|
+
}), $[1] = t1) : t1 = $[1], t1;
|
|
213
329
|
}
|
|
330
|
+
/**
|
|
331
|
+
* Renders the interactive map only once the Maps JavaScript API has loaded.
|
|
332
|
+
* While loading it shows a spinner, and if the key is rejected it surfaces the
|
|
333
|
+
* same "invalid key" guidance used by the static preview. Must be rendered
|
|
334
|
+
* inside an `<APIProvider>`.
|
|
335
|
+
*/
|
|
214
336
|
function MapApiGate(t0) {
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
|
|
218
|
-
|
|
219
|
-
|
|
220
|
-
|
|
221
|
-
|
|
222
|
-
|
|
223
|
-
|
|
224
|
-
|
|
225
|
-
|
|
226
|
-
|
|
227
|
-
|
|
337
|
+
let $ = c(4), { children } = t0, status = useApiLoadingStatus();
|
|
338
|
+
if (status === APILoadingStatus.AUTH_FAILURE || status === APILoadingStatus.FAILED) {
|
|
339
|
+
let t1;
|
|
340
|
+
return $[0] === Symbol.for("react.memo_cache_sentinel") ? (t1 = /* @__PURE__ */ jsx(InvalidApiKeyCard, {}), $[0] = t1) : t1 = $[0], t1;
|
|
341
|
+
}
|
|
342
|
+
if (status !== APILoadingStatus.LOADED) {
|
|
343
|
+
let t1;
|
|
344
|
+
return $[1] === Symbol.for("react.memo_cache_sentinel") ? (t1 = /* @__PURE__ */ jsx(Flex, {
|
|
345
|
+
align: "center",
|
|
346
|
+
justify: "center",
|
|
347
|
+
height: "fill",
|
|
348
|
+
padding: 4,
|
|
349
|
+
children: /* @__PURE__ */ jsx(Spinner, { muted: !0 })
|
|
350
|
+
}), $[1] = t1) : t1 = $[1], t1;
|
|
351
|
+
}
|
|
352
|
+
let t1;
|
|
353
|
+
return $[2] === children ? t1 = $[3] : (t1 = /* @__PURE__ */ jsx(Fragment, { children }), $[2] = children, $[3] = t1), t1;
|
|
228
354
|
}
|
|
355
|
+
/**
|
|
356
|
+
* Geopoint values can exist in a partial/empty state — a freshly added array
|
|
357
|
+
* item is just `{_type, _key}` with no coordinates yet. Passing such a value's
|
|
358
|
+
* `lat`/`lng` (which are `undefined`, or could be `NaN`/`Infinity`) to Google
|
|
359
|
+
* Maps markers, circles or the map center throws an `InvalidValueError`. Use
|
|
360
|
+
* this to extract a usable `LatLng` only when both coordinates are finite
|
|
361
|
+
* numbers, and `null` otherwise.
|
|
362
|
+
*/
|
|
229
363
|
function getValidLatLng(value) {
|
|
230
|
-
|
|
231
|
-
|
|
232
|
-
|
|
233
|
-
|
|
234
|
-
|
|
364
|
+
let lat = value?.lat, lng = value?.lng;
|
|
365
|
+
return typeof lat == "number" && Number.isFinite(lat) && typeof lng == "number" && Number.isFinite(lng) ? {
|
|
366
|
+
lat,
|
|
367
|
+
lng
|
|
368
|
+
} : null;
|
|
235
369
|
}
|
|
370
|
+
/**
|
|
371
|
+
* Advanced markers require a vector map, which in turn requires a map id.
|
|
372
|
+
* `DEMO_MAP_ID` is Google's reserved id for trying advanced markers without
|
|
373
|
+
* creating a cloud-based map style; it renders the default (red) marker.
|
|
374
|
+
*/
|
|
236
375
|
const MAP_ID = "DEMO_MAP_ID";
|
|
237
376
|
var searchInput = "_1aoq8p40";
|
|
377
|
+
/**
|
|
378
|
+
* Place search using the `<gmp-place-autocomplete>` web component (Places API
|
|
379
|
+
* New). The element is provided by the `places` library, so we wait for it to
|
|
380
|
+
* load before rendering, then listen for the `gmp-select` event.
|
|
381
|
+
*/
|
|
238
382
|
function SearchInput(t0) {
|
|
239
|
-
|
|
240
|
-
|
|
241
|
-
|
|
242
|
-
|
|
243
|
-
|
|
244
|
-
|
|
245
|
-
|
|
246
|
-
|
|
247
|
-
|
|
248
|
-
|
|
249
|
-
|
|
250
|
-
|
|
251
|
-
|
|
252
|
-
|
|
253
|
-
|
|
254
|
-
|
|
255
|
-
|
|
256
|
-
lat: location.lat(),
|
|
257
|
-
lng: location.lng()
|
|
258
|
-
};
|
|
259
|
-
onSelect(latLng), map?.panTo(latLng);
|
|
260
|
-
} }), $[0] = map, $[1] = onSelect, $[2] = t1) : t1 = $[2], t1;
|
|
383
|
+
let $ = c(3), { onSelect } = t0, places = useMapsLibrary("places"), map = useMap();
|
|
384
|
+
if (!places) return null;
|
|
385
|
+
let t1;
|
|
386
|
+
return $[0] !== map || $[1] !== onSelect ? (t1 = /* @__PURE__ */ jsx("gmp-place-autocomplete", {
|
|
387
|
+
className: searchInput,
|
|
388
|
+
"ongmp-select": async (t2) => {
|
|
389
|
+
let { placePrediction } = t2, place = placePrediction.toPlace();
|
|
390
|
+
await place.fetchFields({ fields: ["location"] });
|
|
391
|
+
let location = place.location;
|
|
392
|
+
if (!location) return;
|
|
393
|
+
let latLng = {
|
|
394
|
+
lat: location.lat(),
|
|
395
|
+
lng: location.lng()
|
|
396
|
+
};
|
|
397
|
+
onSelect(latLng), map?.panTo(latLng);
|
|
398
|
+
}
|
|
399
|
+
}), $[0] = map, $[1] = onSelect, $[2] = t1) : t1 = $[2], t1;
|
|
261
400
|
}
|
|
262
401
|
const fallbackLatLng$1 = {
|
|
263
|
-
|
|
264
|
-
|
|
402
|
+
lat: 40.7058254,
|
|
403
|
+
lng: -74.1180863
|
|
265
404
|
}, defaultMapLocation$1 = {
|
|
266
|
-
|
|
267
|
-
|
|
405
|
+
lng: 10.74609,
|
|
406
|
+
lat: 59.91273
|
|
268
407
|
};
|
|
269
408
|
function GeopointSelect(t0) {
|
|
270
|
-
|
|
271
|
-
|
|
272
|
-
|
|
273
|
-
|
|
274
|
-
|
|
275
|
-
|
|
276
|
-
|
|
277
|
-
|
|
278
|
-
|
|
279
|
-
|
|
280
|
-
|
|
281
|
-
|
|
282
|
-
|
|
283
|
-
|
|
284
|
-
|
|
285
|
-
|
|
286
|
-
|
|
287
|
-
|
|
288
|
-
|
|
289
|
-
|
|
290
|
-
|
|
291
|
-
|
|
292
|
-
|
|
293
|
-
|
|
294
|
-
|
|
295
|
-
|
|
296
|
-
|
|
297
|
-
|
|
298
|
-
|
|
299
|
-
|
|
300
|
-
|
|
301
|
-
|
|
302
|
-
|
|
303
|
-
|
|
304
|
-
|
|
305
|
-
|
|
306
|
-
|
|
307
|
-
|
|
308
|
-
|
|
309
|
-
|
|
310
|
-
|
|
311
|
-
|
|
312
|
-
|
|
313
|
-
|
|
314
|
-
|
|
315
|
-
|
|
316
|
-
|
|
317
|
-
|
|
318
|
-
|
|
319
|
-
|
|
320
|
-
|
|
321
|
-
|
|
322
|
-
|
|
323
|
-
|
|
324
|
-
|
|
325
|
-
|
|
326
|
-
|
|
327
|
-
|
|
328
|
-
|
|
329
|
-
|
|
409
|
+
let $ = c(29), { value, onChange, onZoomChange, defaultLocation: t1, defaultZoom: t2 } = t0, defaultLocation = t1 === void 0 ? defaultMapLocation$1 : t1, defaultZoom = t2 === void 0 ? 8 : t2, t3;
|
|
410
|
+
$[0] === value ? t3 = $[1] : (t3 = getValidLatLng(value), $[0] = value, $[1] = t3);
|
|
411
|
+
let position = t3, t4;
|
|
412
|
+
$[2] !== defaultLocation || $[3] !== position ? (t4 = {
|
|
413
|
+
...fallbackLatLng$1,
|
|
414
|
+
...defaultLocation,
|
|
415
|
+
...position
|
|
416
|
+
}, $[2] = defaultLocation, $[3] = position, $[4] = t4) : t4 = $[4];
|
|
417
|
+
let center = t4, t5;
|
|
418
|
+
$[5] === defaultZoom ? t5 = $[6] : (t5 = Math.round(defaultZoom), $[5] = defaultZoom, $[6] = t5);
|
|
419
|
+
let lastZoomRef = useRef(t5), t6;
|
|
420
|
+
$[7] === onChange ? t6 = $[8] : (t6 = (event) => {
|
|
421
|
+
event.detail.latLng && onChange && onChange(event.detail.latLng);
|
|
422
|
+
}, $[7] = onChange, $[8] = t6);
|
|
423
|
+
let handleMapClick = t6, t7;
|
|
424
|
+
$[9] === onChange ? t7 = $[10] : (t7 = (event_0) => {
|
|
425
|
+
event_0.latLng && onChange && onChange({
|
|
426
|
+
lat: event_0.latLng.lat(),
|
|
427
|
+
lng: event_0.latLng.lng()
|
|
428
|
+
});
|
|
429
|
+
}, $[9] = onChange, $[10] = t7);
|
|
430
|
+
let handleMarkerDragEnd = t7, t8;
|
|
431
|
+
$[11] === onChange ? t8 = $[12] : (t8 = (location) => {
|
|
432
|
+
onChange?.(location);
|
|
433
|
+
}, $[11] = onChange, $[12] = t8);
|
|
434
|
+
let handleSelect = t8, t9;
|
|
435
|
+
$[13] === onZoomChange ? t9 = $[14] : (t9 = (event_1) => {
|
|
436
|
+
if (!onZoomChange) return;
|
|
437
|
+
let zoom = Math.round(event_1.detail.zoom);
|
|
438
|
+
zoom !== lastZoomRef.current && (lastZoomRef.current = zoom, onZoomChange(zoom));
|
|
439
|
+
}, $[13] = onZoomChange, $[14] = t9);
|
|
440
|
+
let t10 = onZoomChange ? t9 : void 0, t11;
|
|
441
|
+
$[15] === Symbol.for("react.memo_cache_sentinel") ? (t11 = {
|
|
442
|
+
width: "100%",
|
|
443
|
+
height: "100%"
|
|
444
|
+
}, $[15] = t11) : t11 = $[15];
|
|
445
|
+
let t12;
|
|
446
|
+
$[16] === handleSelect ? t12 = $[17] : (t12 = /* @__PURE__ */ jsx(MapControl, {
|
|
447
|
+
position: ControlPosition.TOP_RIGHT,
|
|
448
|
+
children: /* @__PURE__ */ jsx(SearchInput, { onSelect: handleSelect })
|
|
449
|
+
}), $[16] = handleSelect, $[17] = t12);
|
|
450
|
+
let t13;
|
|
451
|
+
$[18] !== handleMarkerDragEnd || $[19] !== onChange || $[20] !== position ? (t13 = position && /* @__PURE__ */ jsx(AdvancedMarker, {
|
|
452
|
+
position,
|
|
453
|
+
draggable: !!onChange,
|
|
454
|
+
onDragEnd: handleMarkerDragEnd
|
|
455
|
+
}), $[18] = handleMarkerDragEnd, $[19] = onChange, $[20] = position, $[21] = t13) : t13 = $[21];
|
|
456
|
+
let t14;
|
|
457
|
+
return $[22] !== center || $[23] !== defaultZoom || $[24] !== handleMapClick || $[25] !== t10 || $[26] !== t12 || $[27] !== t13 ? (t14 = /* @__PURE__ */ jsxs(Map, {
|
|
458
|
+
mapId: MAP_ID,
|
|
459
|
+
defaultCenter: center,
|
|
460
|
+
defaultZoom,
|
|
461
|
+
onClick: handleMapClick,
|
|
462
|
+
onZoomChanged: t10,
|
|
463
|
+
gestureHandling: "greedy",
|
|
464
|
+
streetViewControl: !1,
|
|
465
|
+
mapTypeControl: !1,
|
|
466
|
+
style: t11,
|
|
467
|
+
children: [t12, t13]
|
|
468
|
+
}), $[22] = center, $[23] = defaultZoom, $[24] = handleMapClick, $[25] = t10, $[26] = t12, $[27] = t13, $[28] = t14) : t14 = $[28], t14;
|
|
330
469
|
}
|
|
331
470
|
var staticMapContainer = "nbnf7q0", staticMapImage = "nbnf7q1";
|
|
471
|
+
/**
|
|
472
|
+
* Renders the Google Static Maps preview (via the library's `StaticMap`). If
|
|
473
|
+
* the image is rejected (invalid/demo key, restricted, or missing Static Maps
|
|
474
|
+
* API access) the broken image is replaced with a helpful error card.
|
|
475
|
+
*/
|
|
332
476
|
function StaticMapPreview(t0) {
|
|
333
|
-
|
|
334
|
-
|
|
335
|
-
|
|
336
|
-
|
|
337
|
-
|
|
338
|
-
|
|
339
|
-
|
|
340
|
-
|
|
341
|
-
|
|
342
|
-
|
|
343
|
-
|
|
344
|
-
|
|
345
|
-
|
|
346
|
-
|
|
347
|
-
|
|
477
|
+
let $ = c(8), { url, onClick, onDoubleClick } = t0, [failed, setFailed] = useState(!1);
|
|
478
|
+
if (failed) {
|
|
479
|
+
let t1;
|
|
480
|
+
return $[0] === Symbol.for("react.memo_cache_sentinel") ? (t1 = /* @__PURE__ */ jsx(InvalidApiKeyCard, {}), $[0] = t1) : t1 = $[0], t1;
|
|
481
|
+
}
|
|
482
|
+
let t1;
|
|
483
|
+
$[1] === Symbol.for("react.memo_cache_sentinel") ? (t1 = () => setFailed(!0), $[1] = t1) : t1 = $[1];
|
|
484
|
+
let t2;
|
|
485
|
+
$[2] === url ? t2 = $[3] : (t2 = /* @__PURE__ */ jsx(StaticMap, {
|
|
486
|
+
className: staticMapImage,
|
|
487
|
+
url
|
|
488
|
+
}), $[2] = url, $[3] = t2);
|
|
489
|
+
let t3;
|
|
490
|
+
return $[4] !== onClick || $[5] !== onDoubleClick || $[6] !== t2 ? (t3 = /* @__PURE__ */ jsx("div", {
|
|
491
|
+
className: staticMapContainer,
|
|
492
|
+
onClick,
|
|
493
|
+
onDoubleClick,
|
|
494
|
+
onErrorCapture: t1,
|
|
495
|
+
children: t2
|
|
496
|
+
}), $[4] = onClick, $[5] = onDoubleClick, $[6] = t2, $[7] = t3) : t3 = $[7], t3;
|
|
348
497
|
}
|
|
349
|
-
var dialogInnerContainer = "b5c1gf0";
|
|
350
498
|
const EMPTY_PATH$1 = [];
|
|
351
499
|
function GeopointInput(props) {
|
|
352
|
-
|
|
353
|
-
|
|
354
|
-
|
|
355
|
-
|
|
356
|
-
|
|
357
|
-
|
|
358
|
-
|
|
359
|
-
|
|
360
|
-
|
|
361
|
-
|
|
362
|
-
|
|
363
|
-
|
|
364
|
-
|
|
365
|
-
|
|
366
|
-
|
|
367
|
-
|
|
368
|
-
|
|
369
|
-
|
|
370
|
-
|
|
371
|
-
|
|
372
|
-
|
|
373
|
-
|
|
374
|
-
|
|
375
|
-
|
|
376
|
-
|
|
377
|
-
|
|
378
|
-
|
|
379
|
-
|
|
380
|
-
|
|
381
|
-
|
|
382
|
-
|
|
383
|
-
|
|
384
|
-
|
|
385
|
-
|
|
386
|
-
|
|
387
|
-
|
|
388
|
-
|
|
389
|
-
|
|
390
|
-
|
|
391
|
-
|
|
392
|
-
|
|
393
|
-
|
|
394
|
-
|
|
395
|
-
|
|
396
|
-
|
|
397
|
-
|
|
398
|
-
|
|
399
|
-
|
|
400
|
-
|
|
401
|
-
|
|
402
|
-
|
|
403
|
-
|
|
404
|
-
|
|
405
|
-
|
|
406
|
-
|
|
407
|
-
|
|
408
|
-
|
|
409
|
-
|
|
410
|
-
|
|
411
|
-
|
|
412
|
-
|
|
413
|
-
|
|
414
|
-
|
|
415
|
-
|
|
416
|
-
|
|
417
|
-
|
|
418
|
-
|
|
419
|
-
|
|
420
|
-
|
|
421
|
-
|
|
422
|
-
|
|
423
|
-
|
|
424
|
-
|
|
425
|
-
|
|
426
|
-
|
|
427
|
-
|
|
428
|
-
|
|
429
|
-
|
|
430
|
-
|
|
431
|
-
|
|
500
|
+
let $ = c(58), { changed, elementProps, focused, geoConfig: config, onChange, onPathFocus, path, readOnly, schemaType, value } = props, { id, ref: inputRef, onBlur: handleBlur, onFocus: handleFocus, "aria-describedby": ariaDescribedBy } = elementProps, schemaTypeName = schemaType.name, dialogId = useId(), dialogRef = useRef(null), t0;
|
|
501
|
+
$[0] === inputRef ? t0 = $[1] : (t0 = () => inputRef?.current?.focus(), $[0] = inputRef, $[1] = t0);
|
|
502
|
+
let handleFocusButton = t0, [modalOpen, setModalOpen] = useState(!1), t1;
|
|
503
|
+
$[2] === handleFocusButton ? t1 = $[3] : (t1 = () => {
|
|
504
|
+
dialogRef.current && dialogRef.current.blur(), setModalOpen(!1), handleFocusButton();
|
|
505
|
+
}, $[2] = handleFocusButton, $[3] = t1);
|
|
506
|
+
let handleCloseModal = t1, t2;
|
|
507
|
+
$[4] === Symbol.for("react.memo_cache_sentinel") ? (t2 = () => setModalOpen(_temp$1), $[4] = t2) : t2 = $[4];
|
|
508
|
+
let handleToggleModal = t2, t3;
|
|
509
|
+
$[5] !== onChange || $[6] !== schemaTypeName ? (t3 = (latLng) => {
|
|
510
|
+
onChange([
|
|
511
|
+
setIfMissing({ _type: schemaTypeName }),
|
|
512
|
+
set(latLng.lat, ["lat"]),
|
|
513
|
+
set(latLng.lng, ["lng"])
|
|
514
|
+
]);
|
|
515
|
+
}, $[5] = onChange, $[6] = schemaTypeName, $[7] = t3) : t3 = $[7];
|
|
516
|
+
let handleChange = t3, t4;
|
|
517
|
+
$[8] !== onChange || $[9] !== schemaTypeName ? (t4 = (zoom) => {
|
|
518
|
+
onChange([setIfMissing({ _type: schemaTypeName }), set(zoom, ["zoom"])]);
|
|
519
|
+
}, $[8] = onChange, $[9] = schemaTypeName, $[10] = t4) : t4 = $[10];
|
|
520
|
+
let handleZoomChange = t4, t5;
|
|
521
|
+
$[11] === onChange ? t5 = $[12] : (t5 = () => {
|
|
522
|
+
onChange(unset());
|
|
523
|
+
}, $[11] = onChange, $[12] = t5);
|
|
524
|
+
let handleClear = t5, t6, t7;
|
|
525
|
+
if ($[13] !== modalOpen || $[14] !== onPathFocus ? (t6 = () => {
|
|
526
|
+
modalOpen && onPathFocus(EMPTY_PATH$1);
|
|
527
|
+
}, t7 = [modalOpen, onPathFocus], $[13] = modalOpen, $[14] = onPathFocus, $[15] = t6, $[16] = t7) : (t6 = $[15], t7 = $[16]), useEffect(t6, t7), !config || !config.apiKey) {
|
|
528
|
+
let t8;
|
|
529
|
+
return $[17] === Symbol.for("react.memo_cache_sentinel") ? (t8 = /* @__PURE__ */ jsx(MissingApiKeyCard, { typeTitle: "Geopoint" }), $[17] = t8) : t8 = $[17], t8;
|
|
530
|
+
}
|
|
531
|
+
let position, t8;
|
|
532
|
+
$[18] !== config || $[19] !== value ? (position = getValidLatLng(value), t8 = position ? getGeopointStaticMapUrl(position, config.apiKey, { zoom: value?.zoom }) : null, $[18] = config, $[19] = value, $[20] = position, $[21] = t8) : (position = $[20], t8 = $[21]);
|
|
533
|
+
let staticImageUrl = t8, t9;
|
|
534
|
+
$[22] !== changed || $[23] !== focused || $[24] !== handleFocusButton || $[25] !== path || $[26] !== staticImageUrl ? (t9 = staticImageUrl && /* @__PURE__ */ jsx(ChangeIndicator, {
|
|
535
|
+
path,
|
|
536
|
+
isChanged: changed,
|
|
537
|
+
hasFocus: !!focused,
|
|
538
|
+
children: /* @__PURE__ */ jsx(StaticMapPreview, {
|
|
539
|
+
url: staticImageUrl,
|
|
540
|
+
onClick: handleFocusButton,
|
|
541
|
+
onDoubleClick: handleToggleModal
|
|
542
|
+
})
|
|
543
|
+
}), $[22] = changed, $[23] = focused, $[24] = handleFocusButton, $[25] = path, $[26] = staticImageUrl, $[27] = t9) : t9 = $[27];
|
|
544
|
+
let t10 = position ? 2 : 1, t11 = position ? EditIcon : void 0, t12 = position ? "Edit" : "Set location", t13;
|
|
545
|
+
$[28] !== ariaDescribedBy || $[29] !== handleFocus || $[30] !== id || $[31] !== inputRef || $[32] !== readOnly || $[33] !== t11 || $[34] !== t12 ? (t13 = /* @__PURE__ */ jsx(Button, {
|
|
546
|
+
"aria-describedby": ariaDescribedBy,
|
|
547
|
+
disabled: readOnly,
|
|
548
|
+
icon: t11,
|
|
549
|
+
id,
|
|
550
|
+
mode: "ghost",
|
|
551
|
+
onClick: handleToggleModal,
|
|
552
|
+
onFocus: handleFocus,
|
|
553
|
+
padding: 3,
|
|
554
|
+
ref: inputRef,
|
|
555
|
+
text: t12
|
|
556
|
+
}), $[28] = ariaDescribedBy, $[29] = handleFocus, $[30] = id, $[31] = inputRef, $[32] = readOnly, $[33] = t11, $[34] = t12, $[35] = t13) : t13 = $[35];
|
|
557
|
+
let t14;
|
|
558
|
+
$[36] !== handleClear || $[37] !== position || $[38] !== readOnly ? (t14 = position && /* @__PURE__ */ jsx(Button, {
|
|
559
|
+
disabled: readOnly,
|
|
560
|
+
icon: TrashIcon,
|
|
561
|
+
mode: "ghost",
|
|
562
|
+
onClick: handleClear,
|
|
563
|
+
padding: 3,
|
|
564
|
+
text: "Remove",
|
|
565
|
+
tone: "critical"
|
|
566
|
+
}), $[36] = handleClear, $[37] = position, $[38] = readOnly, $[39] = t14) : t14 = $[39];
|
|
567
|
+
let t15;
|
|
568
|
+
$[40] !== t10 || $[41] !== t13 || $[42] !== t14 ? (t15 = /* @__PURE__ */ jsx(Box, { children: /* @__PURE__ */ jsxs(Grid, {
|
|
569
|
+
gridTemplateColumns: t10,
|
|
570
|
+
gap: 3,
|
|
571
|
+
children: [t13, t14]
|
|
572
|
+
}) }), $[40] = t10, $[41] = t13, $[42] = t14, $[43] = t15) : t15 = $[43];
|
|
573
|
+
let t16;
|
|
574
|
+
$[44] !== config || $[45] !== dialogId || $[46] !== handleBlur || $[47] !== handleChange || $[48] !== handleCloseModal || $[49] !== handleZoomChange || $[50] !== modalOpen || $[51] !== readOnly || $[52] !== value ? (t16 = modalOpen && /* @__PURE__ */ jsx(Dialog, {
|
|
575
|
+
header: "Place the marker on the map",
|
|
576
|
+
id: `${dialogId}_dialog`,
|
|
577
|
+
onBlur: handleBlur,
|
|
578
|
+
onClose: handleCloseModal,
|
|
579
|
+
ref: dialogRef,
|
|
580
|
+
width: 1,
|
|
581
|
+
children: /* @__PURE__ */ jsx("div", {
|
|
582
|
+
className: "b5c1gf0",
|
|
583
|
+
children: /* @__PURE__ */ jsx(APIProvider, {
|
|
584
|
+
apiKey: config.apiKey,
|
|
585
|
+
children: /* @__PURE__ */ jsx(MapApiGate, { children: /* @__PURE__ */ jsx(GeopointSelect, {
|
|
586
|
+
value: value || void 0,
|
|
587
|
+
onChange: readOnly ? void 0 : handleChange,
|
|
588
|
+
onZoomChange: readOnly || !config.saveZoom ? void 0 : handleZoomChange,
|
|
589
|
+
defaultLocation: config.defaultLocation,
|
|
590
|
+
defaultZoom: value?.zoom || config.defaultZoom
|
|
591
|
+
}) })
|
|
592
|
+
})
|
|
593
|
+
})
|
|
594
|
+
}), $[44] = config, $[45] = dialogId, $[46] = handleBlur, $[47] = handleChange, $[48] = handleCloseModal, $[49] = handleZoomChange, $[50] = modalOpen, $[51] = readOnly, $[52] = value, $[53] = t16) : t16 = $[53];
|
|
595
|
+
let t17;
|
|
596
|
+
return $[54] !== t15 || $[55] !== t16 || $[56] !== t9 ? (t17 = /* @__PURE__ */ jsxs(Stack, {
|
|
597
|
+
gap: 3,
|
|
598
|
+
children: [
|
|
599
|
+
t9,
|
|
600
|
+
t15,
|
|
601
|
+
t16
|
|
602
|
+
]
|
|
603
|
+
}), $[54] = t15, $[55] = t16, $[56] = t9, $[57] = t17) : t17 = $[57], t17;
|
|
432
604
|
}
|
|
433
605
|
function _temp$1(currentState) {
|
|
434
|
-
|
|
606
|
+
return !currentState;
|
|
435
607
|
}
|
|
436
608
|
const fallbackLatLng = {
|
|
437
|
-
|
|
438
|
-
|
|
609
|
+
lat: 40.7058254,
|
|
610
|
+
lng: -74.1180863
|
|
439
611
|
}, defaultMapLocation = {
|
|
440
|
-
|
|
441
|
-
|
|
612
|
+
lng: 10.74609,
|
|
613
|
+
lat: 59.91273
|
|
442
614
|
};
|
|
443
615
|
function GeopointRadiusSelect(t0) {
|
|
444
|
-
|
|
445
|
-
|
|
446
|
-
|
|
447
|
-
|
|
448
|
-
|
|
449
|
-
|
|
450
|
-
|
|
451
|
-
|
|
452
|
-
|
|
453
|
-
|
|
454
|
-
|
|
455
|
-
|
|
456
|
-
|
|
457
|
-
|
|
458
|
-
|
|
459
|
-
|
|
460
|
-
|
|
461
|
-
|
|
462
|
-
|
|
463
|
-
|
|
464
|
-
|
|
465
|
-
|
|
466
|
-
|
|
467
|
-
|
|
468
|
-
|
|
469
|
-
|
|
470
|
-
|
|
471
|
-
|
|
472
|
-
|
|
473
|
-
|
|
474
|
-
|
|
475
|
-
|
|
476
|
-
|
|
477
|
-
|
|
478
|
-
|
|
479
|
-
|
|
480
|
-
|
|
481
|
-
|
|
482
|
-
|
|
483
|
-
|
|
484
|
-
|
|
485
|
-
|
|
486
|
-
|
|
487
|
-
|
|
488
|
-
|
|
489
|
-
|
|
490
|
-
|
|
491
|
-
|
|
492
|
-
|
|
493
|
-
|
|
494
|
-
|
|
495
|
-
|
|
496
|
-
|
|
497
|
-
|
|
498
|
-
|
|
499
|
-
|
|
500
|
-
|
|
501
|
-
|
|
502
|
-
|
|
503
|
-
|
|
504
|
-
|
|
505
|
-
|
|
506
|
-
|
|
507
|
-
|
|
508
|
-
|
|
509
|
-
|
|
510
|
-
|
|
511
|
-
|
|
512
|
-
|
|
513
|
-
|
|
514
|
-
|
|
616
|
+
let $ = c(38), { value, onChange, defaultLocation: t1, defaultRadiusZoom: t2, defaultRadius: t3 } = t0, defaultLocation = t1 === void 0 ? defaultMapLocation : t1, defaultRadiusZoom = t2 === void 0 ? 12 : t2, defaultRadius = t3 === void 0 ? 1e3 : t3, t4;
|
|
617
|
+
$[0] === value ? t4 = $[1] : (t4 = getValidLatLng(value), $[0] = value, $[1] = t4);
|
|
618
|
+
let position = t4, t5;
|
|
619
|
+
$[2] !== defaultLocation || $[3] !== position ? (t5 = {
|
|
620
|
+
...fallbackLatLng,
|
|
621
|
+
...defaultLocation,
|
|
622
|
+
...position
|
|
623
|
+
}, $[2] = defaultLocation, $[3] = position, $[4] = t5) : t5 = $[4];
|
|
624
|
+
let center = t5, currentRadius = value?.radius ?? defaultRadius, t6;
|
|
625
|
+
$[5] === onChange ? t6 = $[6] : (t6 = (latLng, radius) => {
|
|
626
|
+
onChange?.(latLng, radius == null ? void 0 : Math.round(radius));
|
|
627
|
+
}, $[5] = onChange, $[6] = t6);
|
|
628
|
+
let setValue = t6, t7;
|
|
629
|
+
$[7] !== currentRadius || $[8] !== setValue ? (t7 = (event) => {
|
|
630
|
+
event.detail.latLng && setValue(event.detail.latLng, currentRadius);
|
|
631
|
+
}, $[7] = currentRadius, $[8] = setValue, $[9] = t7) : t7 = $[9];
|
|
632
|
+
let handleMapClick = t7, t8;
|
|
633
|
+
$[10] !== currentRadius || $[11] !== setValue ? (t8 = (event_0) => {
|
|
634
|
+
event_0.latLng && setValue({
|
|
635
|
+
lat: event_0.latLng.lat(),
|
|
636
|
+
lng: event_0.latLng.lng()
|
|
637
|
+
}, currentRadius);
|
|
638
|
+
}, $[10] = currentRadius, $[11] = setValue, $[12] = t8) : t8 = $[12];
|
|
639
|
+
let handleMarkerDragEnd = t8, t9;
|
|
640
|
+
$[13] !== currentRadius || $[14] !== setValue ? (t9 = (location) => setValue(location, currentRadius), $[13] = currentRadius, $[14] = setValue, $[15] = t9) : t9 = $[15];
|
|
641
|
+
let handleSelect = t9, t10;
|
|
642
|
+
$[16] !== setValue || $[17] !== value ? (t10 = (radius_0) => {
|
|
643
|
+
value && setValue({
|
|
644
|
+
lat: value.lat,
|
|
645
|
+
lng: value.lng
|
|
646
|
+
}, radius_0);
|
|
647
|
+
}, $[16] = setValue, $[17] = value, $[18] = t10) : t10 = $[18];
|
|
648
|
+
let handleCircleRadiusChanged = t10, t11;
|
|
649
|
+
$[19] !== currentRadius || $[20] !== setValue ? (t11 = (event_1) => {
|
|
650
|
+
event_1.latLng && setValue({
|
|
651
|
+
lat: event_1.latLng.lat(),
|
|
652
|
+
lng: event_1.latLng.lng()
|
|
653
|
+
}, currentRadius);
|
|
654
|
+
}, $[19] = currentRadius, $[20] = setValue, $[21] = t11) : t11 = $[21];
|
|
655
|
+
let handleCircleDragEnd = t11, t12;
|
|
656
|
+
$[22] === Symbol.for("react.memo_cache_sentinel") ? (t12 = {
|
|
657
|
+
width: "100%",
|
|
658
|
+
height: "100%"
|
|
659
|
+
}, $[22] = t12) : t12 = $[22];
|
|
660
|
+
let t13;
|
|
661
|
+
$[23] === handleSelect ? t13 = $[24] : (t13 = /* @__PURE__ */ jsx(MapControl, {
|
|
662
|
+
position: ControlPosition.TOP_RIGHT,
|
|
663
|
+
children: /* @__PURE__ */ jsx(SearchInput, { onSelect: handleSelect })
|
|
664
|
+
}), $[23] = handleSelect, $[24] = t13);
|
|
665
|
+
let t14;
|
|
666
|
+
$[25] !== currentRadius || $[26] !== handleCircleDragEnd || $[27] !== handleCircleRadiusChanged || $[28] !== handleMarkerDragEnd || $[29] !== onChange || $[30] !== position ? (t14 = position && /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(AdvancedMarker, {
|
|
667
|
+
position,
|
|
668
|
+
draggable: !!onChange,
|
|
669
|
+
onDragEnd: handleMarkerDragEnd
|
|
670
|
+
}), /* @__PURE__ */ jsx(Circle, {
|
|
671
|
+
center: position,
|
|
672
|
+
radius: currentRadius,
|
|
673
|
+
editable: !!onChange,
|
|
674
|
+
draggable: !!onChange,
|
|
675
|
+
fillColor: "#4285F4",
|
|
676
|
+
fillOpacity: .2,
|
|
677
|
+
strokeColor: "#4285F4",
|
|
678
|
+
strokeOpacity: .8,
|
|
679
|
+
strokeWeight: 2,
|
|
680
|
+
onRadiusChanged: handleCircleRadiusChanged,
|
|
681
|
+
onDragEnd: handleCircleDragEnd
|
|
682
|
+
})] }), $[25] = currentRadius, $[26] = handleCircleDragEnd, $[27] = handleCircleRadiusChanged, $[28] = handleMarkerDragEnd, $[29] = onChange, $[30] = position, $[31] = t14) : t14 = $[31];
|
|
683
|
+
let t15;
|
|
684
|
+
return $[32] !== center || $[33] !== defaultRadiusZoom || $[34] !== handleMapClick || $[35] !== t13 || $[36] !== t14 ? (t15 = /* @__PURE__ */ jsxs(Map, {
|
|
685
|
+
mapId: MAP_ID,
|
|
686
|
+
defaultCenter: center,
|
|
687
|
+
defaultZoom: defaultRadiusZoom,
|
|
688
|
+
onClick: handleMapClick,
|
|
689
|
+
gestureHandling: "greedy",
|
|
690
|
+
streetViewControl: !1,
|
|
691
|
+
mapTypeControl: !1,
|
|
692
|
+
style: t12,
|
|
693
|
+
children: [t13, t14]
|
|
694
|
+
}), $[32] = center, $[33] = defaultRadiusZoom, $[34] = handleMapClick, $[35] = t13, $[36] = t14, $[37] = t15) : t15 = $[37], t15;
|
|
515
695
|
}
|
|
516
696
|
const EMPTY_PATH = [];
|
|
517
697
|
function GeopointRadiusInput(props) {
|
|
518
|
-
|
|
519
|
-
|
|
520
|
-
|
|
521
|
-
|
|
522
|
-
|
|
523
|
-
|
|
524
|
-
|
|
525
|
-
|
|
526
|
-
|
|
527
|
-
|
|
528
|
-
|
|
529
|
-
|
|
530
|
-
|
|
531
|
-
|
|
532
|
-
|
|
533
|
-
|
|
534
|
-
|
|
535
|
-
|
|
536
|
-
|
|
537
|
-
|
|
538
|
-
|
|
539
|
-
|
|
540
|
-
|
|
541
|
-
|
|
542
|
-
|
|
543
|
-
|
|
544
|
-
|
|
545
|
-
|
|
546
|
-
|
|
547
|
-
|
|
548
|
-
|
|
549
|
-
|
|
550
|
-
|
|
551
|
-
|
|
552
|
-
|
|
553
|
-
|
|
554
|
-
|
|
555
|
-
|
|
556
|
-
|
|
557
|
-
|
|
558
|
-
|
|
559
|
-
|
|
560
|
-
|
|
561
|
-
|
|
562
|
-
|
|
563
|
-
|
|
564
|
-
|
|
565
|
-
|
|
566
|
-
|
|
567
|
-
|
|
568
|
-
|
|
569
|
-
|
|
570
|
-
|
|
571
|
-
|
|
572
|
-
|
|
573
|
-
|
|
574
|
-
|
|
575
|
-
|
|
576
|
-
|
|
577
|
-
|
|
578
|
-
|
|
579
|
-
|
|
580
|
-
|
|
581
|
-
|
|
582
|
-
|
|
583
|
-
|
|
584
|
-
|
|
585
|
-
|
|
586
|
-
|
|
587
|
-
|
|
588
|
-
|
|
589
|
-
|
|
590
|
-
|
|
591
|
-
|
|
592
|
-
|
|
593
|
-
|
|
594
|
-
|
|
595
|
-
|
|
596
|
-
|
|
597
|
-
|
|
598
|
-
|
|
599
|
-
|
|
600
|
-
|
|
601
|
-
|
|
602
|
-
|
|
603
|
-
|
|
604
|
-
|
|
605
|
-
|
|
606
|
-
|
|
607
|
-
|
|
608
|
-
|
|
609
|
-
|
|
698
|
+
let $ = c(73), { changed, elementProps, focused, geoConfig: config, onChange, onPathFocus, path, readOnly, schemaType, value } = props, { id, ref: inputRef, onBlur: handleBlur, onFocus: handleFocus, "aria-describedby": ariaDescribedBy } = elementProps, schemaTypeName = schemaType.name, dialogId = useId(), dialogRef = useRef(null), t0;
|
|
699
|
+
$[0] === inputRef ? t0 = $[1] : (t0 = () => inputRef?.current?.focus(), $[0] = inputRef, $[1] = t0);
|
|
700
|
+
let handleFocusButton = t0, [modalOpen, setModalOpen] = useState(!1), t1;
|
|
701
|
+
$[2] === handleFocusButton ? t1 = $[3] : (t1 = () => {
|
|
702
|
+
dialogRef.current && dialogRef.current.blur(), setModalOpen(!1), handleFocusButton();
|
|
703
|
+
}, $[2] = handleFocusButton, $[3] = t1);
|
|
704
|
+
let handleCloseModal = t1, t2;
|
|
705
|
+
$[4] === Symbol.for("react.memo_cache_sentinel") ? (t2 = () => setModalOpen(_temp), $[4] = t2) : t2 = $[4];
|
|
706
|
+
let handleToggleModal = t2, t3;
|
|
707
|
+
$[5] !== config.defaultRadius || $[6] !== onChange || $[7] !== schemaTypeName || $[8] !== value?.radius ? (t3 = (latLng, radius) => {
|
|
708
|
+
let currentRadius = radius ?? value?.radius ?? config.defaultRadius ?? 1e3;
|
|
709
|
+
onChange([
|
|
710
|
+
setIfMissing({ _type: schemaTypeName }),
|
|
711
|
+
set(latLng.lat, ["lat"]),
|
|
712
|
+
set(latLng.lng, ["lng"]),
|
|
713
|
+
set(currentRadius, ["radius"])
|
|
714
|
+
]);
|
|
715
|
+
}, $[5] = config.defaultRadius, $[6] = onChange, $[7] = schemaTypeName, $[8] = value?.radius, $[9] = t3) : t3 = $[9], value?.radius;
|
|
716
|
+
let handleChange = t3, t4;
|
|
717
|
+
$[10] !== onChange || $[11] !== value ? (t4 = (event) => {
|
|
718
|
+
value && onChange([set(Math.round(Number(event.currentTarget.value)), ["radius"])]);
|
|
719
|
+
}, $[10] = onChange, $[11] = value, $[12] = t4) : t4 = $[12];
|
|
720
|
+
let handleRadiusChange = t4, t5;
|
|
721
|
+
$[13] === onChange ? t5 = $[14] : (t5 = () => {
|
|
722
|
+
onChange(unset());
|
|
723
|
+
}, $[13] = onChange, $[14] = t5);
|
|
724
|
+
let handleClear = t5, t6, t7;
|
|
725
|
+
if ($[15] !== modalOpen || $[16] !== onPathFocus ? (t6 = () => {
|
|
726
|
+
modalOpen && onPathFocus(EMPTY_PATH);
|
|
727
|
+
}, t7 = [modalOpen, onPathFocus], $[15] = modalOpen, $[16] = onPathFocus, $[17] = t6, $[18] = t7) : (t6 = $[17], t7 = $[18]), useEffect(t6, t7), !config || !config.apiKey) {
|
|
728
|
+
let t8;
|
|
729
|
+
return $[19] === Symbol.for("react.memo_cache_sentinel") ? (t8 = /* @__PURE__ */ jsx(MissingApiKeyCard, { typeTitle: "Geopoint Radius" }), $[19] = t8) : t8 = $[19], t8;
|
|
730
|
+
}
|
|
731
|
+
let position, radius_0, t8;
|
|
732
|
+
if ($[20] !== config.apiKey || $[21] !== config.defaultRadius || $[22] !== value) {
|
|
733
|
+
position = getValidLatLng(value);
|
|
734
|
+
let t9;
|
|
735
|
+
$[26] !== config.defaultRadius || $[27] !== value?.radius ? (t9 = Math.round(value?.radius || config.defaultRadius || 1e3), $[26] = config.defaultRadius, $[27] = value?.radius, $[28] = t9) : t9 = $[28], radius_0 = t9, t8 = position ? getGeopointRadiusStaticMapUrl({
|
|
736
|
+
lat: position.lat,
|
|
737
|
+
lng: position.lng,
|
|
738
|
+
radius: value?.radius ?? 0
|
|
739
|
+
}, config.apiKey) : null, $[20] = config.apiKey, $[21] = config.defaultRadius, $[22] = value, $[23] = position, $[24] = radius_0, $[25] = t8;
|
|
740
|
+
} else position = $[23], radius_0 = $[24], t8 = $[25];
|
|
741
|
+
let staticImageUrl = t8, t9;
|
|
742
|
+
$[29] !== changed || $[30] !== focused || $[31] !== handleFocusButton || $[32] !== path || $[33] !== staticImageUrl ? (t9 = staticImageUrl && /* @__PURE__ */ jsx(ChangeIndicator, {
|
|
743
|
+
path,
|
|
744
|
+
isChanged: changed,
|
|
745
|
+
hasFocus: !!focused,
|
|
746
|
+
children: /* @__PURE__ */ jsx(StaticMapPreview, {
|
|
747
|
+
url: staticImageUrl,
|
|
748
|
+
onClick: handleFocusButton,
|
|
749
|
+
onDoubleClick: handleToggleModal
|
|
750
|
+
})
|
|
751
|
+
}), $[29] = changed, $[30] = focused, $[31] = handleFocusButton, $[32] = path, $[33] = staticImageUrl, $[34] = t9) : t9 = $[34];
|
|
752
|
+
let t10;
|
|
753
|
+
$[35] !== handleRadiusChange || $[36] !== position || $[37] !== radius_0 || $[38] !== readOnly ? (t10 = position && /* @__PURE__ */ jsxs(Stack, {
|
|
754
|
+
gap: 2,
|
|
755
|
+
children: [/* @__PURE__ */ jsx(Label, { children: "Radius (meters)" }), /* @__PURE__ */ jsx(TextInput, {
|
|
756
|
+
type: "number",
|
|
757
|
+
value: radius_0,
|
|
758
|
+
onChange: handleRadiusChange,
|
|
759
|
+
disabled: readOnly,
|
|
760
|
+
min: 1,
|
|
761
|
+
max: 5e4,
|
|
762
|
+
step: 1
|
|
763
|
+
})]
|
|
764
|
+
}), $[35] = handleRadiusChange, $[36] = position, $[37] = radius_0, $[38] = readOnly, $[39] = t10) : t10 = $[39];
|
|
765
|
+
let t11 = position ? 2 : 1, t12 = position ? EditIcon : void 0, t13 = position ? "Edit" : "Set location and radius", t14;
|
|
766
|
+
$[40] !== ariaDescribedBy || $[41] !== handleFocus || $[42] !== id || $[43] !== inputRef || $[44] !== readOnly || $[45] !== t12 || $[46] !== t13 ? (t14 = /* @__PURE__ */ jsx(Button, {
|
|
767
|
+
"aria-describedby": ariaDescribedBy,
|
|
768
|
+
disabled: readOnly,
|
|
769
|
+
icon: t12,
|
|
770
|
+
id,
|
|
771
|
+
mode: "ghost",
|
|
772
|
+
onClick: handleToggleModal,
|
|
773
|
+
onFocus: handleFocus,
|
|
774
|
+
padding: 3,
|
|
775
|
+
ref: inputRef,
|
|
776
|
+
text: t13
|
|
777
|
+
}), $[40] = ariaDescribedBy, $[41] = handleFocus, $[42] = id, $[43] = inputRef, $[44] = readOnly, $[45] = t12, $[46] = t13, $[47] = t14) : t14 = $[47];
|
|
778
|
+
let t15;
|
|
779
|
+
$[48] !== handleClear || $[49] !== position || $[50] !== readOnly ? (t15 = position && /* @__PURE__ */ jsx(Button, {
|
|
780
|
+
disabled: readOnly,
|
|
781
|
+
icon: TrashIcon,
|
|
782
|
+
mode: "ghost",
|
|
783
|
+
onClick: handleClear,
|
|
784
|
+
padding: 3,
|
|
785
|
+
text: "Remove",
|
|
786
|
+
tone: "critical"
|
|
787
|
+
}), $[48] = handleClear, $[49] = position, $[50] = readOnly, $[51] = t15) : t15 = $[51];
|
|
788
|
+
let t16;
|
|
789
|
+
$[52] !== t11 || $[53] !== t14 || $[54] !== t15 ? (t16 = /* @__PURE__ */ jsx(Box, { children: /* @__PURE__ */ jsxs(Grid, {
|
|
790
|
+
gridTemplateColumns: t11,
|
|
791
|
+
gap: 3,
|
|
792
|
+
children: [t14, t15]
|
|
793
|
+
}) }), $[52] = t11, $[53] = t14, $[54] = t15, $[55] = t16) : t16 = $[55];
|
|
794
|
+
let t17;
|
|
795
|
+
$[56] !== config.apiKey || $[57] !== config.defaultLocation || $[58] !== config.defaultRadius || $[59] !== config.defaultRadiusZoom || $[60] !== dialogId || $[61] !== handleBlur || $[62] !== handleChange || $[63] !== handleCloseModal || $[64] !== modalOpen || $[65] !== readOnly || $[66] !== value ? (t17 = modalOpen && /* @__PURE__ */ jsx(Dialog, {
|
|
796
|
+
header: "Place the marker and set radius on the map",
|
|
797
|
+
id: `${dialogId}_dialog`,
|
|
798
|
+
onBlur: handleBlur,
|
|
799
|
+
onClose: handleCloseModal,
|
|
800
|
+
ref: dialogRef,
|
|
801
|
+
width: 1,
|
|
802
|
+
children: /* @__PURE__ */ jsx("div", {
|
|
803
|
+
className: "b5c1gf0",
|
|
804
|
+
children: /* @__PURE__ */ jsx(APIProvider, {
|
|
805
|
+
apiKey: config.apiKey,
|
|
806
|
+
children: /* @__PURE__ */ jsx(MapApiGate, { children: /* @__PURE__ */ jsx(GeopointRadiusSelect, {
|
|
807
|
+
value: value || void 0,
|
|
808
|
+
onChange: readOnly ? void 0 : handleChange,
|
|
809
|
+
defaultLocation: config.defaultLocation,
|
|
810
|
+
defaultRadiusZoom: config.defaultRadiusZoom,
|
|
811
|
+
defaultRadius: config.defaultRadius
|
|
812
|
+
}) })
|
|
813
|
+
})
|
|
814
|
+
})
|
|
815
|
+
}), $[56] = config.apiKey, $[57] = config.defaultLocation, $[58] = config.defaultRadius, $[59] = config.defaultRadiusZoom, $[60] = dialogId, $[61] = handleBlur, $[62] = handleChange, $[63] = handleCloseModal, $[64] = modalOpen, $[65] = readOnly, $[66] = value, $[67] = t17) : t17 = $[67];
|
|
816
|
+
let t18;
|
|
817
|
+
return $[68] !== t10 || $[69] !== t16 || $[70] !== t17 || $[71] !== t9 ? (t18 = /* @__PURE__ */ jsxs(Stack, {
|
|
818
|
+
gap: 3,
|
|
819
|
+
children: [
|
|
820
|
+
t9,
|
|
821
|
+
t10,
|
|
822
|
+
t16,
|
|
823
|
+
t17
|
|
824
|
+
]
|
|
825
|
+
}), $[68] = t10, $[69] = t16, $[70] = t17, $[71] = t9, $[72] = t18) : t18 = $[72], t18;
|
|
610
826
|
}
|
|
611
827
|
function _temp(currentState) {
|
|
612
|
-
|
|
828
|
+
return !currentState;
|
|
613
829
|
}
|
|
614
830
|
const googleMapsInput = definePlugin((config) => ({
|
|
615
|
-
|
|
616
|
-
|
|
617
|
-
|
|
618
|
-
|
|
619
|
-
|
|
620
|
-
|
|
621
|
-
|
|
622
|
-
|
|
623
|
-
|
|
624
|
-
|
|
625
|
-
|
|
626
|
-
|
|
627
|
-
|
|
628
|
-
|
|
629
|
-
|
|
630
|
-
|
|
631
|
-
|
|
632
|
-
|
|
633
|
-
|
|
634
|
-
|
|
635
|
-
|
|
636
|
-
|
|
637
|
-
|
|
638
|
-
|
|
639
|
-
|
|
640
|
-
|
|
641
|
-
|
|
642
|
-
|
|
643
|
-
|
|
644
|
-
|
|
645
|
-
|
|
646
|
-
|
|
647
|
-
|
|
648
|
-
|
|
649
|
-
|
|
650
|
-
|
|
651
|
-
|
|
652
|
-
|
|
653
|
-
|
|
654
|
-
|
|
655
|
-
|
|
656
|
-
|
|
657
|
-
|
|
658
|
-
|
|
659
|
-
|
|
660
|
-
|
|
661
|
-
|
|
662
|
-
|
|
663
|
-
|
|
664
|
-
|
|
665
|
-
|
|
666
|
-
|
|
667
|
-
|
|
668
|
-
|
|
669
|
-
|
|
670
|
-
|
|
671
|
-
|
|
672
|
-
|
|
673
|
-
|
|
674
|
-
|
|
675
|
-
components: {
|
|
676
|
-
input(props) {
|
|
677
|
-
return isGeopoint(props.schemaType) ? /* @__PURE__ */ jsx(GeopointInput, { ...props, geoConfig: config }) : isGeopointRadius(props.schemaType) ? /* @__PURE__ */ jsx(GeopointRadiusInput, { ...props, geoConfig: config }) : props.renderDefault(props);
|
|
678
|
-
}
|
|
679
|
-
}
|
|
680
|
-
}
|
|
831
|
+
name: "google-maps-input",
|
|
832
|
+
studio: { components: { activeToolLayout: function(props) {
|
|
833
|
+
return /* @__PURE__ */ jsx(GoogleMapsInputContext, {
|
|
834
|
+
value: config,
|
|
835
|
+
children: props.renderDefault(props)
|
|
836
|
+
});
|
|
837
|
+
} } },
|
|
838
|
+
schema: { types: [{
|
|
839
|
+
name: "geopointRadius",
|
|
840
|
+
title: "Geopoint with Radius",
|
|
841
|
+
type: "object",
|
|
842
|
+
components: config.apiKey ? { diff: GeopointDiff } : void 0,
|
|
843
|
+
fields: [
|
|
844
|
+
{
|
|
845
|
+
name: "lat",
|
|
846
|
+
title: "Latitude",
|
|
847
|
+
type: "number",
|
|
848
|
+
validation: (Rule) => Rule.required().min(-90).max(90)
|
|
849
|
+
},
|
|
850
|
+
{
|
|
851
|
+
name: "lng",
|
|
852
|
+
title: "Longitude",
|
|
853
|
+
type: "number",
|
|
854
|
+
validation: (Rule) => Rule.required().min(-180).max(180)
|
|
855
|
+
},
|
|
856
|
+
{
|
|
857
|
+
name: "alt",
|
|
858
|
+
title: "Altitude",
|
|
859
|
+
type: "number"
|
|
860
|
+
},
|
|
861
|
+
{
|
|
862
|
+
name: "radius",
|
|
863
|
+
title: "Radius (meters)",
|
|
864
|
+
type: "number",
|
|
865
|
+
validation: (Rule) => Rule.required().min(1).max(5e4)
|
|
866
|
+
}
|
|
867
|
+
],
|
|
868
|
+
preview: {
|
|
869
|
+
select: {
|
|
870
|
+
lat: "lat",
|
|
871
|
+
lng: "lng",
|
|
872
|
+
radius: "radius"
|
|
873
|
+
},
|
|
874
|
+
prepare({ lat, lng, radius }) {
|
|
875
|
+
return {
|
|
876
|
+
title: typeof lat == "number" && typeof lng == "number" ? `${lat.toFixed(6)}, ${lng.toFixed(6)}` : "No location set",
|
|
877
|
+
subtitle: radius ? `Radius: ${radius}m` : "No radius set"
|
|
878
|
+
};
|
|
879
|
+
}
|
|
880
|
+
}
|
|
881
|
+
}] },
|
|
882
|
+
form: { components: { input(props) {
|
|
883
|
+
return isGeopoint(props.schemaType) ? /* @__PURE__ */ jsx(GeopointInput, {
|
|
884
|
+
...props,
|
|
885
|
+
geoConfig: config
|
|
886
|
+
}) : isGeopointRadius(props.schemaType) ? /* @__PURE__ */ jsx(GeopointRadiusInput, {
|
|
887
|
+
...props,
|
|
888
|
+
geoConfig: config
|
|
889
|
+
}) : props.renderDefault(props);
|
|
890
|
+
} } }
|
|
681
891
|
}));
|
|
682
892
|
function isGeopoint(schemaType) {
|
|
683
|
-
|
|
893
|
+
return isType("geopoint", schemaType);
|
|
684
894
|
}
|
|
685
895
|
function isGeopointRadius(schemaType) {
|
|
686
|
-
|
|
896
|
+
return isType("geopointRadius", schemaType);
|
|
687
897
|
}
|
|
688
898
|
function isType(name, schema) {
|
|
689
|
-
|
|
899
|
+
return schema?.name === name ? !0 : schema?.name ? isType(name, schema?.type) : !1;
|
|
690
900
|
}
|
|
691
|
-
export {
|
|
692
|
-
|
|
693
|
-
|
|
694
|
-
GeopointRadiusInput,
|
|
695
|
-
googleMapsInput
|
|
696
|
-
};
|
|
697
|
-
//# sourceMappingURL=index.js.map
|
|
901
|
+
export { GeopointDiff, GeopointInput, GeopointRadiusInput, googleMapsInput };
|
|
902
|
+
|
|
903
|
+
//# sourceMappingURL=index.js.map
|