@sanity/google-maps-input 6.1.1 → 6.1.3
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 +1 -4
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +830 -628
- package/dist/index.js.map +1 -1
- package/package.json +10 -10
package/dist/index.js
CHANGED
|
@@ -1,701 +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,
|
|
3
|
+
import { ChangeIndicator, DiffFromTo, definePlugin, set, setIfMissing, unset } from "sanity";
|
|
5
4
|
import { ImageIcon } from "@sanity/icons/Image";
|
|
6
|
-
import {
|
|
7
|
-
import { createContext,
|
|
8
|
-
import {
|
|
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
9
|
import { EditIcon } from "@sanity/icons/Edit";
|
|
10
10
|
import { TrashIcon } from "@sanity/icons/Trash";
|
|
11
11
|
import { ErrorOutlineIcon } from "@sanity/icons/ErrorOutline";
|
|
12
12
|
import { WarningOutlineIcon } from "@sanity/icons/WarningOutline";
|
|
13
|
-
const
|
|
13
|
+
const METERS_PER_DEGREE = 111e3;
|
|
14
14
|
function lngMetersPerDegree(lat) {
|
|
15
|
-
|
|
15
|
+
return METERS_PER_DEGREE * Math.max(Math.cos(lat * Math.PI / 180), .01);
|
|
16
16
|
}
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
markers: [{
|
|
35
|
-
location: center
|
|
36
|
-
}]
|
|
37
|
-
});
|
|
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
|
+
});
|
|
38
34
|
}
|
|
39
35
|
function generateCirclePoints(lat, lng, radius) {
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
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;
|
|
49
45
|
}
|
|
50
|
-
|
|
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
|
+
*/
|
|
51
51
|
function getCircleBounds(lat, lng, radius) {
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
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
|
+
];
|
|
66
71
|
}
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
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
|
+
});
|
|
93
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
|
+
*/
|
|
94
104
|
const GoogleMapsInputContext = createContext(null);
|
|
95
105
|
GoogleMapsInputContext.displayName = "GoogleMapsInputContext";
|
|
96
106
|
var mapDiffImage = "_7uupx50", mapDiffPlaceholder = "_7uupx51";
|
|
97
107
|
function hasRadius(value) {
|
|
98
|
-
|
|
108
|
+
return typeof value.radius == "number";
|
|
99
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
|
+
*/
|
|
100
115
|
function StaticMapDiffPreview(t0) {
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
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;
|
|
126
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
|
+
*/
|
|
127
165
|
function GeopointDiff(t0) {
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
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;
|
|
134
173
|
}
|
|
135
|
-
const
|
|
174
|
+
const REQUIRED_APIS = [
|
|
175
|
+
"Google Maps JavaScript API",
|
|
176
|
+
"Google Static Maps API",
|
|
177
|
+
"Google Places API (New)"
|
|
178
|
+
];
|
|
136
179
|
function RequiredApis() {
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
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;
|
|
140
189
|
}
|
|
141
190
|
function _temp$2(api) {
|
|
142
|
-
|
|
191
|
+
return /* @__PURE__ */ jsx(Text, {
|
|
192
|
+
as: "li",
|
|
193
|
+
size: 1,
|
|
194
|
+
muted: !0,
|
|
195
|
+
children: api
|
|
196
|
+
}, api);
|
|
143
197
|
}
|
|
144
198
|
function MessageCard(t0) {
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
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;
|
|
167
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
|
+
*/
|
|
168
237
|
function MissingApiKeyCard(t0) {
|
|
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
|
-
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
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;
|
|
207
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
|
+
*/
|
|
208
315
|
function InvalidApiKeyCard() {
|
|
209
|
-
|
|
210
|
-
|
|
211
|
-
|
|
212
|
-
|
|
213
|
-
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
|
|
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;
|
|
217
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
|
+
*/
|
|
218
336
|
function MapApiGate(t0) {
|
|
219
|
-
|
|
220
|
-
|
|
221
|
-
|
|
222
|
-
|
|
223
|
-
|
|
224
|
-
|
|
225
|
-
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
|
|
230
|
-
|
|
231
|
-
|
|
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;
|
|
232
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
|
+
*/
|
|
233
363
|
function getValidLatLng(value) {
|
|
234
|
-
|
|
235
|
-
|
|
236
|
-
|
|
237
|
-
|
|
238
|
-
|
|
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;
|
|
239
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
|
+
*/
|
|
240
375
|
const MAP_ID = "DEMO_MAP_ID";
|
|
241
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
|
+
*/
|
|
242
382
|
function SearchInput(t0) {
|
|
243
|
-
|
|
244
|
-
|
|
245
|
-
|
|
246
|
-
|
|
247
|
-
|
|
248
|
-
|
|
249
|
-
|
|
250
|
-
|
|
251
|
-
|
|
252
|
-
|
|
253
|
-
|
|
254
|
-
|
|
255
|
-
|
|
256
|
-
|
|
257
|
-
|
|
258
|
-
|
|
259
|
-
|
|
260
|
-
lat: location.lat(),
|
|
261
|
-
lng: location.lng()
|
|
262
|
-
};
|
|
263
|
-
onSelect(latLng), map?.panTo(latLng);
|
|
264
|
-
} }), $[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;
|
|
265
400
|
}
|
|
266
401
|
const fallbackLatLng$1 = {
|
|
267
|
-
|
|
268
|
-
|
|
402
|
+
lat: 40.7058254,
|
|
403
|
+
lng: -74.1180863
|
|
269
404
|
}, defaultMapLocation$1 = {
|
|
270
|
-
|
|
271
|
-
|
|
405
|
+
lng: 10.74609,
|
|
406
|
+
lat: 59.91273
|
|
272
407
|
};
|
|
273
408
|
function GeopointSelect(t0) {
|
|
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
|
-
|
|
330
|
-
|
|
331
|
-
|
|
332
|
-
|
|
333
|
-
|
|
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;
|
|
334
469
|
}
|
|
335
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
|
+
*/
|
|
336
476
|
function StaticMapPreview(t0) {
|
|
337
|
-
|
|
338
|
-
|
|
339
|
-
|
|
340
|
-
|
|
341
|
-
|
|
342
|
-
|
|
343
|
-
|
|
344
|
-
|
|
345
|
-
|
|
346
|
-
|
|
347
|
-
|
|
348
|
-
|
|
349
|
-
|
|
350
|
-
|
|
351
|
-
|
|
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;
|
|
352
497
|
}
|
|
353
|
-
var dialogInnerContainer = "b5c1gf0";
|
|
354
498
|
const EMPTY_PATH$1 = [];
|
|
355
499
|
function GeopointInput(props) {
|
|
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
|
-
|
|
432
|
-
|
|
433
|
-
|
|
434
|
-
|
|
435
|
-
|
|
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;
|
|
436
604
|
}
|
|
437
605
|
function _temp$1(currentState) {
|
|
438
|
-
|
|
606
|
+
return !currentState;
|
|
439
607
|
}
|
|
440
608
|
const fallbackLatLng = {
|
|
441
|
-
|
|
442
|
-
|
|
609
|
+
lat: 40.7058254,
|
|
610
|
+
lng: -74.1180863
|
|
443
611
|
}, defaultMapLocation = {
|
|
444
|
-
|
|
445
|
-
|
|
612
|
+
lng: 10.74609,
|
|
613
|
+
lat: 59.91273
|
|
446
614
|
};
|
|
447
615
|
function GeopointRadiusSelect(t0) {
|
|
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
|
-
|
|
515
|
-
|
|
516
|
-
|
|
517
|
-
|
|
518
|
-
|
|
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;
|
|
519
695
|
}
|
|
520
696
|
const EMPTY_PATH = [];
|
|
521
697
|
function GeopointRadiusInput(props) {
|
|
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
|
-
|
|
610
|
-
|
|
611
|
-
|
|
612
|
-
|
|
613
|
-
|
|
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;
|
|
614
826
|
}
|
|
615
827
|
function _temp(currentState) {
|
|
616
|
-
|
|
828
|
+
return !currentState;
|
|
617
829
|
}
|
|
618
830
|
const googleMapsInput = definePlugin((config) => ({
|
|
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
|
-
|
|
676
|
-
|
|
677
|
-
|
|
678
|
-
|
|
679
|
-
components: {
|
|
680
|
-
input(props) {
|
|
681
|
-
return isGeopoint(props.schemaType) ? /* @__PURE__ */ jsx(GeopointInput, { ...props, geoConfig: config }) : isGeopointRadius(props.schemaType) ? /* @__PURE__ */ jsx(GeopointRadiusInput, { ...props, geoConfig: config }) : props.renderDefault(props);
|
|
682
|
-
}
|
|
683
|
-
}
|
|
684
|
-
}
|
|
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
|
+
} } }
|
|
685
891
|
}));
|
|
686
892
|
function isGeopoint(schemaType) {
|
|
687
|
-
|
|
893
|
+
return isType("geopoint", schemaType);
|
|
688
894
|
}
|
|
689
895
|
function isGeopointRadius(schemaType) {
|
|
690
|
-
|
|
896
|
+
return isType("geopointRadius", schemaType);
|
|
691
897
|
}
|
|
692
898
|
function isType(name, schema) {
|
|
693
|
-
|
|
899
|
+
return schema?.name === name ? !0 : schema?.name ? isType(name, schema?.type) : !1;
|
|
694
900
|
}
|
|
695
|
-
export {
|
|
696
|
-
|
|
697
|
-
|
|
698
|
-
GeopointRadiusInput,
|
|
699
|
-
googleMapsInput
|
|
700
|
-
};
|
|
701
|
-
//# sourceMappingURL=index.js.map
|
|
901
|
+
export { GeopointDiff, GeopointInput, GeopointRadiusInput, googleMapsInput };
|
|
902
|
+
|
|
903
|
+
//# sourceMappingURL=index.js.map
|