@object-ui/plugin-map 17.5.0 → 17.6.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +286 -0
- package/README.md +144 -232
- package/dist/ObjectMap.d.ts +18 -3
- package/dist/ObjectMap.d.ts.map +1 -1
- package/dist/camera.d.ts +102 -0
- package/dist/camera.d.ts.map +1 -0
- package/dist/index.js +249 -212
- package/dist/index.umd.cjs +1 -1
- package/package.json +10 -9
package/dist/index.js
CHANGED
|
@@ -1,24 +1,44 @@
|
|
|
1
1
|
import { useCallback as e, useEffect as t, useMemo as n, useRef as r, useState as i } from "react";
|
|
2
|
-
import { ComponentRegistry as a, buildExpandFields as o,
|
|
3
|
-
import { ElementDataSourceGate as
|
|
4
|
-
import {
|
|
5
|
-
import {
|
|
6
|
-
import
|
|
2
|
+
import { ComponentRegistry as a, buildExpandFields as o, convertSortToQueryParams as s, extractRecords as c, getRecordDisplayName as ee } from "@object-ui/core";
|
|
3
|
+
import { ElementDataSourceGate as l, useNavigationOverlay as te, useSchemaContext as u } from "@object-ui/react";
|
|
4
|
+
import { ObjectMapConfigSchema as d } from "@object-ui/types/zod";
|
|
5
|
+
import { NavigationOverlay as ne, cn as f, useIsMobile as re } from "@object-ui/components";
|
|
6
|
+
import ie, { Marker as p, NavigationControl as ae, Popup as oe } from "react-map-gl/maplibre";
|
|
7
7
|
import "maplibre-gl/dist/maplibre-gl.css";
|
|
8
|
-
import { jsx as
|
|
8
|
+
import { jsx as m, jsxs as h } from "react/jsx-runtime";
|
|
9
|
+
function g(e) {
|
|
10
|
+
return e >= -180 && e < 180 ? e : ((e + 180) % 360 + 360) % 360 - 180;
|
|
11
|
+
}
|
|
12
|
+
var _ = (e) => Math.min(85, Math.max(-85, e));
|
|
13
|
+
function se(e) {
|
|
14
|
+
if (e.length === 0) return null;
|
|
15
|
+
let t = e.map(([e]) => g(e)).sort((e, t) => e - t), n = e.map(([, e]) => _(e)), r = t.length, i = t[0] + 360 - t[r - 1], a = 0;
|
|
16
|
+
for (let e = 1; e < r; e++) {
|
|
17
|
+
let n = t[e] - t[e - 1];
|
|
18
|
+
n > i && (i = n, a = e);
|
|
19
|
+
}
|
|
20
|
+
let o = t[a], s = t[(a + r - 1) % r], c = a === 0 ? s : s + 360;
|
|
21
|
+
return [[o, Math.min(...n)], [c, Math.max(...n)]];
|
|
22
|
+
}
|
|
23
|
+
function ce(e) {
|
|
24
|
+
let [[t, n], [r, i]] = e;
|
|
25
|
+
return {
|
|
26
|
+
longitude: g((t + r) / 2),
|
|
27
|
+
latitude: (n + i) / 2
|
|
28
|
+
};
|
|
29
|
+
}
|
|
30
|
+
//#endregion
|
|
9
31
|
//#region src/ObjectMap.tsx
|
|
10
|
-
var v =
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
function ie(e) {
|
|
21
|
-
return e.data ? e.data : e.staticData ? {
|
|
32
|
+
var le = "https://demotiles.maplibre.org/style.json", v = Object.keys(d.shape).filter((e) => e !== "style");
|
|
33
|
+
function ue(e) {
|
|
34
|
+
if (e.data) {
|
|
35
|
+
let t = e.data;
|
|
36
|
+
return Array.isArray(t) ? {
|
|
37
|
+
provider: "value",
|
|
38
|
+
items: t
|
|
39
|
+
} : e.data;
|
|
40
|
+
}
|
|
41
|
+
return e.staticData ? {
|
|
22
42
|
provider: "value",
|
|
23
43
|
items: e.staticData
|
|
24
44
|
} : e.objectName ? {
|
|
@@ -26,19 +46,10 @@ function ie(e) {
|
|
|
26
46
|
object: e.objectName
|
|
27
47
|
} : null;
|
|
28
48
|
}
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
return { [n]: r };
|
|
34
|
-
}
|
|
35
|
-
if (Array.isArray(e)) return e.reduce((e, t) => (t.field && t.order && (e[t.field] = t.order), e), {});
|
|
36
|
-
}
|
|
37
|
-
}
|
|
38
|
-
var b = () => globalThis.process?.env?.NODE_ENV !== "production", x = /* @__PURE__ */ new Set();
|
|
39
|
-
function S(e) {
|
|
40
|
-
if (!b()) return;
|
|
41
|
-
let t = e?.filter;
|
|
49
|
+
var y = () => globalThis.process?.env?.NODE_ENV !== "production", b = /* @__PURE__ */ new Set();
|
|
50
|
+
function x(e) {
|
|
51
|
+
if (!y()) return;
|
|
52
|
+
let t = e.filter;
|
|
42
53
|
if (!t || typeof t != "object" || Array.isArray(t) || !Object.prototype.hasOwnProperty.call(t, "map")) return;
|
|
43
54
|
let n = t.map;
|
|
44
55
|
if (!n || typeof n != "object") return;
|
|
@@ -48,41 +59,52 @@ function S(e) {
|
|
|
48
59
|
} catch {
|
|
49
60
|
r = `${e.type ?? "map"}::${e.objectName ?? ""}::<unserializable>`;
|
|
50
61
|
}
|
|
51
|
-
|
|
62
|
+
b.has(r) || (b.add(r), console.warn("[ObjectMap] `filter.map` is no longer read as map configuration, so this map is rendering with the DEFAULT field names (`latitude` / `longitude` / `name`). `filter` is the query filter; the map config belongs under the declared `map` input — move it to `schema.map` (`{ type: 'object-map', map: { latitudeField, longitudeField, titleField } }`). The old spelling was never documented and could not survive a `dataSource` binding, whose merged filter is an `and` node with no `map` key at all (objectstack#7121). If `map` is genuinely a field you are filtering on, ignore this — the filter itself is passed through untouched. objectui#4034."));
|
|
52
63
|
}
|
|
64
|
+
var S = /* @__PURE__ */ new Set();
|
|
53
65
|
function C(e) {
|
|
54
|
-
|
|
55
|
-
let t = e.style
|
|
56
|
-
if (
|
|
66
|
+
if (!y()) return;
|
|
67
|
+
let t = e.style;
|
|
68
|
+
if (typeof t != "string" || t === "") return;
|
|
69
|
+
let n = `${e.type ?? "map"}::${e.objectName ?? ""}::${t}`;
|
|
70
|
+
S.has(n) || (S.add(n), console.warn(`[ObjectMap] A top-level \`style\` is NOT read as a map style, so this map is rendering with the DEFAULT public demo tiles and \`${t}\` was dropped. \`style\` is the base schema's INLINE CSS key (a record of CSS properties), which every node may carry; the map style is \`mapStyle\` — named that way precisely to avoid this collision. Write \`mapStyle: '${t}'\` at the top level, or \`map: { style: '${t}' }\` in the declared config block. On a view, note that \`options.map\` is FLATTENED into the top level, so its \`style\` lands here as this same top-level key — spell it \`map: { mapStyle }\` there. objectui#5017.`));
|
|
71
|
+
}
|
|
72
|
+
var w = /* @__PURE__ */ new Set();
|
|
73
|
+
function T(e) {
|
|
74
|
+
if (!y()) return;
|
|
75
|
+
let t = v.filter((t) => e[t] !== void 0);
|
|
76
|
+
if (t.length === 0) return;
|
|
77
|
+
let n = `${e.type ?? "map"}::${e.objectName ?? ""}::${t.join(",")}`;
|
|
78
|
+
w.has(n) || (w.add(n), console.warn(`[ObjectMap] The \`map\` block configures this map, so these top-level keys are IGNORED: ${t.map((e) => `\`${e}\``).join(", ")}. The \`map\` block is the authoring shape; the flat top-level spelling is the internal form ObjectView/ListView produce when they flatten \`options.map\`, and what the author wrote outranks it. Move anything you still need into \`map\`, or drop the \`map\` block. objectui#5018.`));
|
|
79
|
+
}
|
|
80
|
+
function de(e) {
|
|
81
|
+
x(e), C(e);
|
|
82
|
+
let t = e.mapStyle || e.map?.style, n = e.map ?? null;
|
|
83
|
+
if (n) {
|
|
84
|
+
let r = d.safeParse(n);
|
|
85
|
+
return r.success || console.warn("[ObjectMap] Invalid map configuration:", r.error.format()), T(e), {
|
|
86
|
+
...n,
|
|
87
|
+
style: n.style || t
|
|
88
|
+
};
|
|
89
|
+
}
|
|
90
|
+
return e.locationField || e.latitudeField ? {
|
|
57
91
|
locationField: e.locationField,
|
|
58
92
|
latitudeField: e.latitudeField,
|
|
59
93
|
longitudeField: e.longitudeField,
|
|
60
|
-
titleField: e.titleField
|
|
94
|
+
titleField: e.titleField,
|
|
61
95
|
descriptionField: e.descriptionField,
|
|
62
96
|
zoom: e.zoom,
|
|
63
97
|
center: e.center,
|
|
64
98
|
style: t
|
|
65
|
-
}
|
|
66
|
-
let n = e.map ? e.map : null;
|
|
67
|
-
if (n) {
|
|
68
|
-
let e = v.safeParse(n);
|
|
69
|
-
return e.success || console.warn("[ObjectMap] Invalid map configuration:", e.error.format()), {
|
|
70
|
-
...n,
|
|
71
|
-
style: n.style || t
|
|
72
|
-
};
|
|
73
|
-
}
|
|
74
|
-
return {
|
|
99
|
+
} : {
|
|
75
100
|
latitudeField: "latitude",
|
|
76
101
|
longitudeField: "longitude",
|
|
77
102
|
locationField: "location",
|
|
78
|
-
titleField: "name",
|
|
79
103
|
descriptionField: "description",
|
|
80
|
-
zoom: 10,
|
|
81
|
-
center: [0, 0],
|
|
82
104
|
style: t
|
|
83
105
|
};
|
|
84
106
|
}
|
|
85
|
-
function
|
|
107
|
+
function fe(e, t) {
|
|
86
108
|
if (t.latitudeField && t.longitudeField) {
|
|
87
109
|
let n = e[t.latitudeField], r = e[t.longitudeField];
|
|
88
110
|
if (typeof n == "number" && typeof r == "number") return [n, r];
|
|
@@ -104,7 +126,7 @@ function ae(e, t) {
|
|
|
104
126
|
}
|
|
105
127
|
return null;
|
|
106
128
|
}
|
|
107
|
-
function
|
|
129
|
+
function pe(e, t, n = 50) {
|
|
108
130
|
if (e.length <= 1 || t >= 15) return e.map((e) => ({
|
|
109
131
|
id: e.id,
|
|
110
132
|
coordinates: e.coordinates,
|
|
@@ -135,102 +157,96 @@ function oe(e, t, n = 50) {
|
|
|
135
157
|
}
|
|
136
158
|
}), a;
|
|
137
159
|
}
|
|
138
|
-
var
|
|
139
|
-
let [
|
|
140
|
-
|
|
141
|
-
}, []),
|
|
160
|
+
var E = ({ schema: a, dataSource: l, className: u, data: d, onMarkerClick: g, onRowClick: _, onEdit: v, onDelete: y, enableClustering: b, clusterRadius: x = 50 }) => {
|
|
161
|
+
let [S, C] = i([]), [w, T] = i(!0), [E, D] = i(null), [O, me] = i(null), [he, k] = i(null), [A, ge] = i(""), j = re(), M = r(null), [N, _e] = i(null), [P, F] = i(null), [I, L] = i(!1), [R, ve] = i(null), ye = e((e) => {
|
|
162
|
+
ve(e?.error?.message || "Failed to load the map style/tiles.");
|
|
163
|
+
}, []), be = e(() => {
|
|
142
164
|
if (typeof navigator > "u" || !navigator.geolocation) {
|
|
143
|
-
|
|
165
|
+
F("Geolocation is not available in this browser.");
|
|
144
166
|
return;
|
|
145
167
|
}
|
|
146
|
-
|
|
168
|
+
L(!0), F(null), navigator.geolocation.getCurrentPosition((e) => {
|
|
147
169
|
let { longitude: t, latitude: n } = e.coords;
|
|
148
|
-
|
|
170
|
+
_e({
|
|
149
171
|
lng: t,
|
|
150
172
|
lat: n
|
|
151
|
-
}),
|
|
173
|
+
}), L(!1);
|
|
152
174
|
try {
|
|
153
|
-
|
|
175
|
+
M.current?.flyTo({
|
|
154
176
|
center: [t, n],
|
|
155
177
|
zoom: 12,
|
|
156
178
|
duration: 800
|
|
157
179
|
});
|
|
158
180
|
} catch {}
|
|
159
181
|
}, (e) => {
|
|
160
|
-
|
|
182
|
+
L(!1), F(e.message || "Unable to retrieve location.");
|
|
161
183
|
}, {
|
|
162
184
|
enableHighAccuracy: !1,
|
|
163
185
|
timeout: 8e3,
|
|
164
186
|
maximumAge: 6e4
|
|
165
187
|
});
|
|
166
|
-
}, []),
|
|
188
|
+
}, []), z = ue(a), B = n(() => z, [JSON.stringify(z)]), V = n(() => de(a), [a]), H = B?.provider === "value";
|
|
167
189
|
t(() => {
|
|
168
190
|
(async () => {
|
|
169
191
|
try {
|
|
170
|
-
if (
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
D(e), O(!1);
|
|
174
|
-
return;
|
|
175
|
-
}
|
|
176
|
-
}
|
|
177
|
-
if (a.data) {
|
|
178
|
-
let e = a.data;
|
|
179
|
-
if (Array.isArray(e)) {
|
|
180
|
-
D(e), O(!1);
|
|
181
|
-
return;
|
|
182
|
-
}
|
|
192
|
+
if (T(!0), Array.isArray(d)) {
|
|
193
|
+
C(d), T(!1);
|
|
194
|
+
return;
|
|
183
195
|
}
|
|
184
|
-
if (
|
|
185
|
-
|
|
196
|
+
if (H && B?.provider === "value") {
|
|
197
|
+
C(B.items), T(!1);
|
|
186
198
|
return;
|
|
187
199
|
}
|
|
188
|
-
if (!
|
|
189
|
-
if (
|
|
190
|
-
let e =
|
|
200
|
+
if (!l || typeof l.find != "function") throw Error("DataSource required for object/api providers");
|
|
201
|
+
if (B?.provider === "object") {
|
|
202
|
+
let e = B.object, t = o(O?.fields), n = await l.find(e, {
|
|
191
203
|
$filter: a.filter,
|
|
192
|
-
$orderby:
|
|
204
|
+
$orderby: s(a.sort),
|
|
193
205
|
...t.length > 0 ? { $expand: t } : {}
|
|
194
|
-
}), r =
|
|
195
|
-
|
|
196
|
-
} else
|
|
197
|
-
|
|
206
|
+
}), r = c(n);
|
|
207
|
+
C(r);
|
|
208
|
+
} else B?.provider === "api" && (console.warn("API provider not yet implemented for ObjectMap"), C([]));
|
|
209
|
+
T(!1);
|
|
198
210
|
} catch (e) {
|
|
199
|
-
|
|
211
|
+
D(e), T(!1);
|
|
200
212
|
}
|
|
201
213
|
})();
|
|
202
214
|
}, [
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
215
|
+
d,
|
|
216
|
+
B,
|
|
217
|
+
l,
|
|
218
|
+
H,
|
|
206
219
|
a.filter,
|
|
207
220
|
a.sort,
|
|
208
|
-
|
|
221
|
+
O
|
|
209
222
|
]), t(() => {
|
|
210
|
-
!
|
|
223
|
+
!H && l && (async () => {
|
|
211
224
|
try {
|
|
212
|
-
if (!
|
|
213
|
-
let e =
|
|
225
|
+
if (!l) return;
|
|
226
|
+
let e = B?.provider === "object" ? B.object : a.objectName;
|
|
214
227
|
if (!e) return;
|
|
215
|
-
let t = await
|
|
216
|
-
|
|
228
|
+
let t = await l.getObjectSchema(e);
|
|
229
|
+
me(t);
|
|
217
230
|
} catch (e) {
|
|
218
231
|
console.error("Failed to fetch object schema:", e);
|
|
219
232
|
}
|
|
220
233
|
})();
|
|
221
234
|
}, [
|
|
222
235
|
a.objectName,
|
|
223
|
-
|
|
224
|
-
|
|
225
|
-
|
|
236
|
+
l,
|
|
237
|
+
H,
|
|
238
|
+
B
|
|
226
239
|
]);
|
|
227
|
-
let { markers:
|
|
240
|
+
let { markers: U, invalidCount: W } = n(() => {
|
|
228
241
|
let e = 0;
|
|
229
242
|
return {
|
|
230
|
-
markers:
|
|
231
|
-
let r =
|
|
243
|
+
markers: S.map((t, n) => {
|
|
244
|
+
let r = fe(t, V);
|
|
232
245
|
if (!r) return e++, null;
|
|
233
|
-
let i =
|
|
246
|
+
let i = ee(O, t, {
|
|
247
|
+
titleField: V.titleField,
|
|
248
|
+
fallback: "Marker"
|
|
249
|
+
}), a = V.descriptionField ? t[V.descriptionField] : void 0, [o, s] = r;
|
|
234
250
|
return !isFinite(o) || !isFinite(s) || o < -90 || o > 90 || s < -180 || s > 180 ? (e++, null) : {
|
|
235
251
|
id: t.id || t._id || `marker-${n}`,
|
|
236
252
|
title: i,
|
|
@@ -241,146 +257,167 @@ var w = ({ schema: a, dataSource: c, className: u, onMarkerClick: p, onRowClick:
|
|
|
241
257
|
}).filter((e) => e !== null),
|
|
242
258
|
invalidCount: e
|
|
243
259
|
};
|
|
244
|
-
}, [
|
|
260
|
+
}, [
|
|
261
|
+
S,
|
|
262
|
+
V,
|
|
263
|
+
O
|
|
264
|
+
]), G = n(() => U.find((e) => e.id === he), [U, he]), [K, xe] = i(V.zoom || 3), Se = e((e) => {
|
|
265
|
+
try {
|
|
266
|
+
let t = e?.target?.getZoom?.();
|
|
267
|
+
typeof t == "number" && Number.isFinite(t) && xe(Math.round(t));
|
|
268
|
+
} catch {}
|
|
269
|
+
}, []), q = te({
|
|
245
270
|
navigation: a.navigation,
|
|
246
271
|
objectName: a.objectName,
|
|
247
|
-
onRowClick:
|
|
248
|
-
}),
|
|
249
|
-
if (!
|
|
250
|
-
let e =
|
|
251
|
-
return
|
|
252
|
-
}, [
|
|
272
|
+
onRowClick: _
|
|
273
|
+
}), J = n(() => {
|
|
274
|
+
if (!A.trim()) return U;
|
|
275
|
+
let e = A.toLowerCase();
|
|
276
|
+
return U.filter((t) => t.title?.toLowerCase().includes(e) || t.description?.toLowerCase().includes(e));
|
|
277
|
+
}, [U, A]), Ce = n(() => b ?? (a.enableClustering || J.length > 100) ? pe(J, K, x) : J.map((e) => ({
|
|
253
278
|
id: e.id,
|
|
254
279
|
coordinates: e.coordinates,
|
|
255
280
|
markers: [e],
|
|
256
281
|
isCluster: !1
|
|
257
282
|
})), [
|
|
258
|
-
|
|
259
|
-
|
|
260
|
-
|
|
261
|
-
|
|
283
|
+
J,
|
|
284
|
+
K,
|
|
285
|
+
b,
|
|
286
|
+
x,
|
|
262
287
|
a
|
|
263
|
-
]),
|
|
264
|
-
if (
|
|
265
|
-
|
|
266
|
-
|
|
267
|
-
|
|
288
|
+
]), Y = n(() => se(J.map((e) => e.coordinates)), [J]), X = typeof V.center?.[0] == "number" ? V.center[0] : void 0, Z = typeof V.center?.[1] == "number" ? V.center[1] : void 0, Q = typeof V.zoom == "number" ? V.zoom : void 0, $ = X !== void 0 || Z !== void 0 || Q !== void 0, we = n(() => {
|
|
289
|
+
if (Y && !$) return {
|
|
290
|
+
bounds: Y,
|
|
291
|
+
fitBoundsOptions: {
|
|
292
|
+
padding: 48,
|
|
293
|
+
maxZoom: 12
|
|
294
|
+
}
|
|
295
|
+
};
|
|
296
|
+
let e = Y ? ce(Y) : {
|
|
297
|
+
longitude: 0,
|
|
298
|
+
latitude: 0
|
|
268
299
|
};
|
|
269
|
-
let e = $.map((e) => e.coordinates[0]), t = $.map((e) => e.coordinates[1]), n = Math.min(...e), r = Math.max(...e), i = Math.min(...t), a = Math.max(...t);
|
|
270
300
|
return {
|
|
271
|
-
longitude:
|
|
272
|
-
latitude:
|
|
273
|
-
zoom:
|
|
301
|
+
longitude: Z ?? e.longitude,
|
|
302
|
+
latitude: X ?? e.latitude,
|
|
303
|
+
zoom: Q ?? (Y ? 3 : 2)
|
|
274
304
|
};
|
|
275
|
-
}, [
|
|
276
|
-
|
|
277
|
-
|
|
278
|
-
|
|
305
|
+
}, [
|
|
306
|
+
Y,
|
|
307
|
+
$,
|
|
308
|
+
Z,
|
|
309
|
+
X,
|
|
310
|
+
Q
|
|
311
|
+
]);
|
|
312
|
+
return w ? /* @__PURE__ */ m("div", {
|
|
313
|
+
className: f("min-w-0 overflow-hidden", u),
|
|
314
|
+
children: /* @__PURE__ */ m("div", {
|
|
279
315
|
className: "flex items-center justify-center h-96 bg-muted rounded-lg border",
|
|
280
|
-
children: /* @__PURE__ */
|
|
316
|
+
children: /* @__PURE__ */ m("div", {
|
|
281
317
|
className: "text-muted-foreground",
|
|
282
318
|
children: "Loading map..."
|
|
283
319
|
})
|
|
284
320
|
})
|
|
285
|
-
}) :
|
|
286
|
-
className:
|
|
287
|
-
children: /* @__PURE__ */
|
|
321
|
+
}) : E ? /* @__PURE__ */ m("div", {
|
|
322
|
+
className: f("min-w-0 overflow-hidden", u),
|
|
323
|
+
children: /* @__PURE__ */ m("div", {
|
|
288
324
|
className: "flex items-center justify-center h-96 bg-muted rounded-lg border",
|
|
289
|
-
children: /* @__PURE__ */
|
|
325
|
+
children: /* @__PURE__ */ h("div", {
|
|
290
326
|
className: "text-destructive",
|
|
291
|
-
children: ["Error: ",
|
|
327
|
+
children: ["Error: ", E.message]
|
|
292
328
|
})
|
|
293
329
|
})
|
|
294
|
-
}) : /* @__PURE__ */
|
|
295
|
-
className:
|
|
330
|
+
}) : /* @__PURE__ */ h("div", {
|
|
331
|
+
className: f("min-w-0 overflow-hidden", u),
|
|
296
332
|
children: [
|
|
297
|
-
|
|
333
|
+
W > 0 && /* @__PURE__ */ m("div", {
|
|
298
334
|
className: "mb-2 p-2 text-sm text-yellow-800 bg-yellow-50 border border-yellow-200 rounded",
|
|
299
|
-
children: `${
|
|
335
|
+
children: `${W} record${W === 1 ? "" : "s"} with missing or invalid coordinates excluded from the map.`
|
|
300
336
|
}),
|
|
301
|
-
|
|
337
|
+
U.length > 0 && /* @__PURE__ */ m("div", {
|
|
302
338
|
className: "mb-2",
|
|
303
|
-
children: /* @__PURE__ */
|
|
339
|
+
children: /* @__PURE__ */ m("input", {
|
|
304
340
|
type: "text",
|
|
305
|
-
value:
|
|
306
|
-
onChange: (e) =>
|
|
341
|
+
value: A,
|
|
342
|
+
onChange: (e) => ge(e.target.value),
|
|
307
343
|
placeholder: "Search locations…",
|
|
308
344
|
className: "w-full px-3 py-2 text-sm border rounded-md bg-background placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-ring"
|
|
309
345
|
})
|
|
310
346
|
}),
|
|
311
|
-
/* @__PURE__ */
|
|
347
|
+
/* @__PURE__ */ h("div", {
|
|
312
348
|
className: "relative border rounded-lg overflow-hidden bg-muted h-[300px] sm:h-[400px] md:h-[500px] lg:h-[600px] w-full",
|
|
313
349
|
children: [
|
|
314
|
-
/* @__PURE__ */
|
|
350
|
+
/* @__PURE__ */ h(ie, {
|
|
315
351
|
ref: (e) => {
|
|
316
|
-
|
|
352
|
+
M.current = e;
|
|
317
353
|
},
|
|
318
|
-
initialViewState:
|
|
354
|
+
initialViewState: we,
|
|
319
355
|
style: {
|
|
320
356
|
width: "100%",
|
|
321
357
|
height: "100%"
|
|
322
358
|
},
|
|
323
|
-
mapStyle:
|
|
359
|
+
mapStyle: V.style || le,
|
|
324
360
|
touchZoomRotate: !0,
|
|
325
361
|
dragRotate: !0,
|
|
326
362
|
touchPitch: !0,
|
|
327
|
-
|
|
328
|
-
|
|
363
|
+
onLoad: Se,
|
|
364
|
+
onZoom: (e) => xe(Math.round(e.viewState.zoom)),
|
|
365
|
+
onError: ye,
|
|
329
366
|
children: [
|
|
330
|
-
|
|
367
|
+
R && /* @__PURE__ */ h("div", {
|
|
331
368
|
role: "alert",
|
|
332
369
|
className: "absolute inset-x-0 top-0 z-20 p-2 text-sm text-center text-amber-900 bg-amber-50 border-b border-amber-200",
|
|
333
370
|
children: [
|
|
334
371
|
"Map failed to load (",
|
|
335
|
-
|
|
372
|
+
R,
|
|
336
373
|
"). Markers below are still listed in the search box;",
|
|
337
374
|
" ",
|
|
338
|
-
|
|
375
|
+
V.style ? "check the configured map style URL." : "configure a custom map style for production use."
|
|
339
376
|
]
|
|
340
377
|
}),
|
|
341
|
-
/* @__PURE__ */
|
|
378
|
+
/* @__PURE__ */ m(ae, {
|
|
342
379
|
position: "top-right",
|
|
343
380
|
showCompass: !0,
|
|
344
381
|
showZoom: !0
|
|
345
382
|
}),
|
|
346
|
-
/* @__PURE__ */
|
|
383
|
+
/* @__PURE__ */ m("button", {
|
|
347
384
|
type: "button",
|
|
348
|
-
onClick:
|
|
349
|
-
disabled:
|
|
385
|
+
onClick: be,
|
|
386
|
+
disabled: I,
|
|
350
387
|
className: "absolute top-2 left-2 z-10 inline-flex items-center justify-center size-9 rounded-md bg-background/95 border shadow-sm hover:bg-background disabled:opacity-50",
|
|
351
388
|
"aria-label": "Show my location",
|
|
352
389
|
"data-testid": "map-geolocate",
|
|
353
|
-
children: /* @__PURE__ */
|
|
390
|
+
children: /* @__PURE__ */ m("span", {
|
|
354
391
|
"aria-hidden": "true",
|
|
355
|
-
children:
|
|
392
|
+
children: I ? "⏳" : "🧭"
|
|
356
393
|
})
|
|
357
394
|
}),
|
|
358
|
-
|
|
359
|
-
longitude:
|
|
360
|
-
latitude:
|
|
395
|
+
N && /* @__PURE__ */ m(p, {
|
|
396
|
+
longitude: N.lng,
|
|
397
|
+
latitude: N.lat,
|
|
361
398
|
anchor: "center",
|
|
362
|
-
children: /* @__PURE__ */
|
|
399
|
+
children: /* @__PURE__ */ m("div", {
|
|
363
400
|
className: "size-3 rounded-full bg-blue-500 ring-4 ring-blue-500/30 shadow",
|
|
364
401
|
"aria-label": "Your location",
|
|
365
402
|
"data-testid": "map-user-location"
|
|
366
403
|
})
|
|
367
404
|
}),
|
|
368
|
-
|
|
405
|
+
Ce.map((e) => e.isCluster ? /* @__PURE__ */ m(p, {
|
|
369
406
|
longitude: e.coordinates[0],
|
|
370
407
|
latitude: e.coordinates[1],
|
|
371
408
|
anchor: "center",
|
|
372
409
|
onClick: (t) => {
|
|
373
410
|
t.originalEvent.stopPropagation();
|
|
374
411
|
try {
|
|
375
|
-
let t = Math.min(20, Math.max(
|
|
376
|
-
|
|
412
|
+
let t = Math.min(20, Math.max(K + 2, 8));
|
|
413
|
+
M.current?.flyTo({
|
|
377
414
|
center: [e.coordinates[0], e.coordinates[1]],
|
|
378
415
|
zoom: t,
|
|
379
416
|
duration: 600
|
|
380
417
|
});
|
|
381
418
|
} catch {}
|
|
382
419
|
},
|
|
383
|
-
children: /* @__PURE__ */
|
|
420
|
+
children: /* @__PURE__ */ m("div", {
|
|
384
421
|
className: "flex items-center justify-center rounded-full bg-primary text-primary-foreground font-bold text-xs cursor-pointer hover:scale-110 transition-transform shadow-md",
|
|
385
422
|
style: {
|
|
386
423
|
width: Math.min(48, 24 + e.markers.length * 2),
|
|
@@ -390,48 +427,48 @@ var w = ({ schema: a, dataSource: c, className: u, onMarkerClick: p, onRowClick:
|
|
|
390
427
|
"data-testid": "map-cluster",
|
|
391
428
|
children: e.markers.length
|
|
392
429
|
})
|
|
393
|
-
}, e.id) : /* @__PURE__ */
|
|
430
|
+
}, e.id) : /* @__PURE__ */ m(p, {
|
|
394
431
|
longitude: e.coordinates[0],
|
|
395
432
|
latitude: e.coordinates[1],
|
|
396
433
|
anchor: "bottom",
|
|
397
434
|
onClick: (t) => {
|
|
398
435
|
t.originalEvent.stopPropagation();
|
|
399
436
|
let n = e.markers[0];
|
|
400
|
-
|
|
437
|
+
k(n.id), q.handleClick(n.data), g?.(n.data);
|
|
401
438
|
},
|
|
402
|
-
children: /* @__PURE__ */
|
|
439
|
+
children: /* @__PURE__ */ m("div", {
|
|
403
440
|
className: "text-2xl cursor-pointer hover:scale-110 transition-transform",
|
|
404
441
|
children: "📍"
|
|
405
442
|
})
|
|
406
443
|
}, e.id)),
|
|
407
|
-
|
|
408
|
-
longitude:
|
|
409
|
-
latitude:
|
|
444
|
+
G && !j && /* @__PURE__ */ m(oe, {
|
|
445
|
+
longitude: G.coordinates[0],
|
|
446
|
+
latitude: G.coordinates[1],
|
|
410
447
|
anchor: "top",
|
|
411
|
-
onClose: () =>
|
|
448
|
+
onClose: () => k(null),
|
|
412
449
|
closeOnClick: !1,
|
|
413
|
-
children: /* @__PURE__ */
|
|
450
|
+
children: /* @__PURE__ */ h("div", {
|
|
414
451
|
className: "p-2 min-w-[150px] sm:min-w-[200px]",
|
|
415
452
|
children: [
|
|
416
|
-
/* @__PURE__ */
|
|
453
|
+
/* @__PURE__ */ m("h3", {
|
|
417
454
|
className: "font-bold text-sm mb-1",
|
|
418
|
-
children:
|
|
455
|
+
children: G.title
|
|
419
456
|
}),
|
|
420
|
-
|
|
457
|
+
G.description && /* @__PURE__ */ m("p", {
|
|
421
458
|
className: "text-xs text-muted-foreground",
|
|
422
|
-
children:
|
|
459
|
+
children: G.description
|
|
423
460
|
}),
|
|
424
|
-
/* @__PURE__ */
|
|
461
|
+
/* @__PURE__ */ h("div", {
|
|
425
462
|
className: "mt-2 text-xs flex gap-2",
|
|
426
|
-
children: [
|
|
463
|
+
children: [v && /* @__PURE__ */ m("button", {
|
|
427
464
|
type: "button",
|
|
428
465
|
className: "text-blue-500 hover:underline",
|
|
429
|
-
onClick: () =>
|
|
466
|
+
onClick: () => v(G.data),
|
|
430
467
|
children: "Edit"
|
|
431
|
-
}),
|
|
468
|
+
}), y && /* @__PURE__ */ m("button", {
|
|
432
469
|
type: "button",
|
|
433
470
|
className: "text-red-500 hover:underline",
|
|
434
|
-
onClick: () =>
|
|
471
|
+
onClick: () => y(G.data),
|
|
435
472
|
children: "Delete"
|
|
436
473
|
})]
|
|
437
474
|
})
|
|
@@ -440,69 +477,69 @@ var w = ({ schema: a, dataSource: c, className: u, onMarkerClick: p, onRowClick:
|
|
|
440
477
|
})
|
|
441
478
|
]
|
|
442
479
|
}),
|
|
443
|
-
|
|
480
|
+
G && j && /* @__PURE__ */ h("div", {
|
|
444
481
|
className: "absolute inset-x-0 bottom-0 z-30 bg-background border-t shadow-lg rounded-t-2xl p-4 pb-[max(env(safe-area-inset-bottom),1rem)]",
|
|
445
482
|
role: "dialog",
|
|
446
483
|
"aria-label": "Location details",
|
|
447
484
|
"data-testid": "map-mobile-record-sheet",
|
|
448
485
|
children: [
|
|
449
|
-
/* @__PURE__ */
|
|
486
|
+
/* @__PURE__ */ m("div", {
|
|
450
487
|
className: "mx-auto mb-2 h-1 w-10 rounded-full bg-muted",
|
|
451
488
|
"aria-hidden": "true"
|
|
452
489
|
}),
|
|
453
|
-
/* @__PURE__ */
|
|
490
|
+
/* @__PURE__ */ h("div", {
|
|
454
491
|
className: "flex items-start justify-between gap-3",
|
|
455
|
-
children: [/* @__PURE__ */
|
|
492
|
+
children: [/* @__PURE__ */ h("div", {
|
|
456
493
|
className: "min-w-0 flex-1",
|
|
457
|
-
children: [/* @__PURE__ */
|
|
494
|
+
children: [/* @__PURE__ */ m("h3", {
|
|
458
495
|
className: "text-sm font-semibold truncate",
|
|
459
|
-
children:
|
|
460
|
-
}),
|
|
496
|
+
children: G.title
|
|
497
|
+
}), G.description && /* @__PURE__ */ m("p", {
|
|
461
498
|
className: "mt-1 text-xs text-muted-foreground line-clamp-3",
|
|
462
|
-
children:
|
|
499
|
+
children: G.description
|
|
463
500
|
})]
|
|
464
|
-
}), /* @__PURE__ */
|
|
501
|
+
}), /* @__PURE__ */ m("button", {
|
|
465
502
|
type: "button",
|
|
466
|
-
onClick: () =>
|
|
503
|
+
onClick: () => k(null),
|
|
467
504
|
className: "text-muted-foreground hover:text-foreground text-lg leading-none px-2",
|
|
468
505
|
"aria-label": "Close details",
|
|
469
506
|
"data-testid": "map-mobile-record-close",
|
|
470
507
|
children: "×"
|
|
471
508
|
})]
|
|
472
509
|
}),
|
|
473
|
-
/* @__PURE__ */
|
|
510
|
+
/* @__PURE__ */ h("div", {
|
|
474
511
|
className: "mt-3 flex flex-wrap gap-2 text-xs",
|
|
475
|
-
children: [
|
|
512
|
+
children: [v && /* @__PURE__ */ m("button", {
|
|
476
513
|
type: "button",
|
|
477
514
|
className: "px-3 py-1.5 rounded-md border bg-card hover:bg-accent",
|
|
478
|
-
onClick: () =>
|
|
515
|
+
onClick: () => v(G.data),
|
|
479
516
|
children: "Edit"
|
|
480
|
-
}),
|
|
517
|
+
}), y && /* @__PURE__ */ m("button", {
|
|
481
518
|
type: "button",
|
|
482
519
|
className: "px-3 py-1.5 rounded-md border border-destructive/30 text-destructive hover:bg-destructive/10",
|
|
483
|
-
onClick: () =>
|
|
520
|
+
onClick: () => y(G.data),
|
|
484
521
|
children: "Delete"
|
|
485
522
|
})]
|
|
486
523
|
})
|
|
487
524
|
]
|
|
488
525
|
}),
|
|
489
|
-
|
|
526
|
+
P && /* @__PURE__ */ m("div", {
|
|
490
527
|
className: "absolute top-2 left-14 right-2 z-10 text-xs px-3 py-1.5 rounded-md bg-destructive/10 text-destructive border border-destructive/30",
|
|
491
|
-
children:
|
|
528
|
+
children: P
|
|
492
529
|
})
|
|
493
530
|
]
|
|
494
531
|
}),
|
|
495
|
-
|
|
496
|
-
...
|
|
532
|
+
q.isOverlay && /* @__PURE__ */ m(ne, {
|
|
533
|
+
...q,
|
|
497
534
|
title: "Location Details",
|
|
498
|
-
children: (e) => /* @__PURE__ */
|
|
535
|
+
children: (e) => /* @__PURE__ */ m("div", {
|
|
499
536
|
className: "space-y-3",
|
|
500
|
-
children: Object.entries(e).map(([e, t]) => /* @__PURE__ */
|
|
537
|
+
children: Object.entries(e).map(([e, t]) => /* @__PURE__ */ h("div", {
|
|
501
538
|
className: "flex flex-col",
|
|
502
|
-
children: [/* @__PURE__ */
|
|
539
|
+
children: [/* @__PURE__ */ m("span", {
|
|
503
540
|
className: "text-xs font-medium text-muted-foreground uppercase tracking-wide",
|
|
504
541
|
children: e.replace(/_/g, " ")
|
|
505
|
-
}), /* @__PURE__ */
|
|
542
|
+
}), /* @__PURE__ */ m("span", {
|
|
506
543
|
className: "text-sm",
|
|
507
544
|
children: String(t ?? "—")
|
|
508
545
|
})]
|
|
@@ -511,25 +548,25 @@ var w = ({ schema: a, dataSource: c, className: u, onMarkerClick: p, onRowClick:
|
|
|
511
548
|
})
|
|
512
549
|
]
|
|
513
550
|
});
|
|
514
|
-
},
|
|
551
|
+
}, D = {
|
|
515
552
|
filter: !0,
|
|
516
553
|
sort: !0
|
|
517
|
-
},
|
|
554
|
+
}, O = ({ schema: e, ...t }) => {
|
|
518
555
|
let { dataSource: n } = u() || {};
|
|
519
|
-
return /* @__PURE__ */
|
|
556
|
+
return /* @__PURE__ */ m(l, {
|
|
520
557
|
schema: e,
|
|
521
|
-
mapping:
|
|
558
|
+
mapping: D,
|
|
522
559
|
dataSource: n,
|
|
523
560
|
testId: "object-map",
|
|
524
561
|
errorTitle: "This map’s data source could not be resolved",
|
|
525
|
-
children: (e) => /* @__PURE__ */
|
|
562
|
+
children: (e) => /* @__PURE__ */ m(E, {
|
|
526
563
|
schema: e,
|
|
527
564
|
dataSource: n,
|
|
528
565
|
...t
|
|
529
566
|
})
|
|
530
567
|
});
|
|
531
568
|
};
|
|
532
|
-
a.register("object-map",
|
|
569
|
+
a.register("object-map", O, {
|
|
533
570
|
namespace: "plugin-map",
|
|
534
571
|
label: "Object Map",
|
|
535
572
|
category: "view",
|
|
@@ -544,7 +581,7 @@ a.register("object-map", E, {
|
|
|
544
581
|
label: "Map Config",
|
|
545
582
|
description: "latitudeField, longitudeField, titleField"
|
|
546
583
|
}]
|
|
547
|
-
}), a.register("map",
|
|
584
|
+
}), a.register("map", O, {
|
|
548
585
|
namespace: "view",
|
|
549
586
|
label: "Map View",
|
|
550
587
|
category: "view",
|
|
@@ -561,4 +598,4 @@ a.register("object-map", E, {
|
|
|
561
598
|
}]
|
|
562
599
|
});
|
|
563
600
|
//#endregion
|
|
564
|
-
export {
|
|
601
|
+
export { E as ObjectMap, O as ObjectMapRenderer };
|