declarative-ui-core 1.0.14 → 1.0.16
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.js +153 -146
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
import { jsxs as
|
|
2
|
-
import { useRef as T, useState as O, useEffect as
|
|
1
|
+
import { jsxs as v, jsx as i } from "react/jsx-runtime";
|
|
2
|
+
import { useRef as T, useState as O, useEffect as $, useMemo as R } from "react";
|
|
3
3
|
import j from "maplibre-gl";
|
|
4
4
|
import _ from "react-markdown";
|
|
5
5
|
import F from "mermaid";
|
|
6
6
|
import { VegaLite as J } from "react-vega";
|
|
7
|
-
const
|
|
7
|
+
const n = {
|
|
8
8
|
canvas: {
|
|
9
9
|
display: "grid",
|
|
10
10
|
width: "100%",
|
|
@@ -56,48 +56,48 @@ const o = {
|
|
|
56
56
|
};
|
|
57
57
|
function K({ componentId: t, component: r }) {
|
|
58
58
|
const e = r.config?.columns;
|
|
59
|
-
return /* @__PURE__ */
|
|
60
|
-
/* @__PURE__ */ i("div", { style:
|
|
61
|
-
/* @__PURE__ */ i("div", { style:
|
|
62
|
-
(e ?? []).map((
|
|
63
|
-
/* @__PURE__ */ i("div", { style:
|
|
64
|
-
/* @__PURE__ */ i("input", { style:
|
|
65
|
-
] },
|
|
66
|
-
e?.length ? null : /* @__PURE__ */ i("div", { style:
|
|
59
|
+
return /* @__PURE__ */ v("div", { style: n.panel, children: [
|
|
60
|
+
/* @__PURE__ */ i("div", { style: n.panelHeader, children: /* @__PURE__ */ i("div", { style: n.panelTitle, children: r.title ?? t }) }),
|
|
61
|
+
/* @__PURE__ */ i("div", { style: n.panelBody, children: /* @__PURE__ */ v("div", { style: n.kvList, children: [
|
|
62
|
+
(e ?? []).map((o) => /* @__PURE__ */ v("label", { style: n.formRow, children: [
|
|
63
|
+
/* @__PURE__ */ i("div", { style: n.formLabel, children: o.label }),
|
|
64
|
+
/* @__PURE__ */ i("input", { style: n.input, placeholder: o.key })
|
|
65
|
+
] }, o.key)),
|
|
66
|
+
e?.length ? null : /* @__PURE__ */ i("div", { style: n.muted, children: "No columns provided." })
|
|
67
67
|
] }) })
|
|
68
68
|
] });
|
|
69
69
|
}
|
|
70
70
|
function A(t, r) {
|
|
71
71
|
if (!r) return;
|
|
72
|
-
const e = r.startsWith("data.") ? r.slice(5) : r,
|
|
73
|
-
if (!(!
|
|
74
|
-
return
|
|
72
|
+
const e = r.startsWith("data.") ? r.slice(5) : r, o = t.data?.[e];
|
|
73
|
+
if (!(!o || o.source !== "inline"))
|
|
74
|
+
return o.rows;
|
|
75
75
|
}
|
|
76
76
|
function X({ page: t, componentId: r, component: e }) {
|
|
77
|
-
const
|
|
78
|
-
return /* @__PURE__ */
|
|
79
|
-
/* @__PURE__ */ i("div", { style:
|
|
80
|
-
/* @__PURE__ */ i("div", { style:
|
|
81
|
-
/* @__PURE__ */ i("div", { style:
|
|
82
|
-
/* @__PURE__ */ i("div", { style:
|
|
83
|
-
] }, f)) }) : c.length > 0 ? /* @__PURE__ */ i("div", { style:
|
|
84
|
-
/* @__PURE__ */ i("div", { style:
|
|
85
|
-
/* @__PURE__ */ i("div", { style:
|
|
86
|
-
] }, x)) }, h)) }) : /* @__PURE__ */ i("pre", { style:
|
|
77
|
+
const o = A(t, e.dataRef) ?? [], l = e.config?.mode, s = e.config?.displayFields, c = s && s.length > 0 ? s : o.length > 0 ? Object.keys(o[0]) : [];
|
|
78
|
+
return /* @__PURE__ */ v("div", { style: n.panel, children: [
|
|
79
|
+
/* @__PURE__ */ i("div", { style: n.panelHeader, children: /* @__PURE__ */ i("div", { style: n.panelTitle, children: e.title ?? r }) }),
|
|
80
|
+
/* @__PURE__ */ i("div", { style: n.panelBody, children: l === "kv" && o.length === 1 ? /* @__PURE__ */ i("div", { style: n.kvList, children: Object.entries(o[0]).map(([f, h]) => /* @__PURE__ */ v("div", { style: n.kvRow, children: [
|
|
81
|
+
/* @__PURE__ */ i("div", { style: n.kvKey, children: f }),
|
|
82
|
+
/* @__PURE__ */ i("div", { style: n.kvValue, children: String(h) })
|
|
83
|
+
] }, f)) }) : c.length > 0 ? /* @__PURE__ */ i("div", { style: n.listCards, children: o.map((f, h) => /* @__PURE__ */ i("div", { style: n.listCard, children: c.map((x) => /* @__PURE__ */ v("div", { style: n.listCardRow, children: [
|
|
84
|
+
/* @__PURE__ */ i("div", { style: n.listCardLabel, children: x }),
|
|
85
|
+
/* @__PURE__ */ i("div", { style: n.listCardValue, children: String(f[x] ?? "") })
|
|
86
|
+
] }, x)) }, h)) }) : /* @__PURE__ */ i("pre", { style: n.pre, children: JSON.stringify(o, null, 2) }) })
|
|
87
87
|
] });
|
|
88
88
|
}
|
|
89
89
|
function I() {
|
|
90
90
|
const t = T(null), [r, e] = O({ width: 0, height: 0 });
|
|
91
|
-
return
|
|
92
|
-
const
|
|
93
|
-
if (!
|
|
91
|
+
return $(() => {
|
|
92
|
+
const o = t.current;
|
|
93
|
+
if (!o) return;
|
|
94
94
|
const l = new ResizeObserver((s) => {
|
|
95
95
|
const c = s[0];
|
|
96
96
|
if (!c) return;
|
|
97
97
|
const f = c.contentRect, h = { width: Math.round(f.width), height: Math.round(f.height) };
|
|
98
98
|
e((x) => Math.abs(x.width - h.width) <= 1 && Math.abs(x.height - h.height) <= 1 ? x : h);
|
|
99
99
|
});
|
|
100
|
-
return l.observe(
|
|
100
|
+
return l.observe(o), () => l.disconnect();
|
|
101
101
|
}, []), { ref: t, size: r };
|
|
102
102
|
}
|
|
103
103
|
if (typeof window < "u")
|
|
@@ -107,21 +107,21 @@ if (typeof window < "u")
|
|
|
107
107
|
} catch (t) {
|
|
108
108
|
console.warn("[MapLibreGL] Failed to configure CSP-safe worker:", t);
|
|
109
109
|
}
|
|
110
|
-
function
|
|
110
|
+
function q(t, r) {
|
|
111
111
|
if (!r) return;
|
|
112
112
|
const e = t.setProjection;
|
|
113
113
|
if (typeof e != "function") return;
|
|
114
|
-
const
|
|
115
|
-
if (
|
|
114
|
+
const o = typeof r == "string" ? r : r && typeof r == "object" && typeof r.name == "string" ? r.name : r && typeof r == "object" && typeof r.type == "string" ? r.type : void 0;
|
|
115
|
+
if (o)
|
|
116
116
|
try {
|
|
117
|
-
e.call(t,
|
|
117
|
+
e.call(t, o);
|
|
118
118
|
return;
|
|
119
119
|
} catch {
|
|
120
120
|
}
|
|
121
121
|
}
|
|
122
122
|
function Y(t) {
|
|
123
123
|
if (!t || typeof t != "object") return {};
|
|
124
|
-
const r = t, e = Array.isArray(r.markers) ? r.markers : void 0,
|
|
124
|
+
const r = t, e = Array.isArray(r.markers) ? r.markers : void 0, o = e ? e.map((l) => {
|
|
125
125
|
if (!l) return null;
|
|
126
126
|
if ("lngLat" in l) {
|
|
127
127
|
const s = l, c = s.lngLat;
|
|
@@ -152,39 +152,39 @@ function Y(t) {
|
|
|
152
152
|
return null;
|
|
153
153
|
}).filter((l) => l !== null) : void 0;
|
|
154
154
|
if (typeof r.style == "string" || r.style && typeof r.style == "object")
|
|
155
|
-
return { style: r.style, options: r.options, markers:
|
|
155
|
+
return { style: r.style, options: r.options, markers: o };
|
|
156
156
|
if (r.version && r.sources && r.layers)
|
|
157
|
-
return { style: r, options: {}, markers:
|
|
157
|
+
return { style: r, options: {}, markers: o };
|
|
158
158
|
if (r.style) {
|
|
159
159
|
const { style: l, ...s } = r;
|
|
160
|
-
return { style: l, options: s, markers:
|
|
160
|
+
return { style: l, options: s, markers: o };
|
|
161
161
|
}
|
|
162
162
|
return {};
|
|
163
163
|
}
|
|
164
164
|
function W(t) {
|
|
165
165
|
return { type: "FeatureCollection", features: t.map((e) => {
|
|
166
|
-
const
|
|
167
|
-
if (typeof
|
|
166
|
+
const o = typeof e.longitude == "number" ? e.longitude : typeof e.lng == "number" ? e.lng : typeof e.lon == "number" ? e.lon : void 0, l = typeof e.latitude == "number" ? e.latitude : typeof e.lat == "number" ? e.lat : void 0;
|
|
167
|
+
if (typeof o != "number" || typeof l != "number" || !Number.isFinite(o) || !Number.isFinite(l)) return null;
|
|
168
168
|
const s = { ...e };
|
|
169
169
|
return {
|
|
170
170
|
type: "Feature",
|
|
171
|
-
geometry: { type: "Point", coordinates: [
|
|
171
|
+
geometry: { type: "Point", coordinates: [o, l] },
|
|
172
172
|
properties: s
|
|
173
173
|
};
|
|
174
174
|
}).filter((e) => e !== null) };
|
|
175
175
|
}
|
|
176
176
|
function U(t, r) {
|
|
177
|
-
return (Array.isArray(t?.layers) ? t.layers : []).some((
|
|
177
|
+
return (Array.isArray(t?.layers) ? t.layers : []).some((o) => o && typeof o == "object" && o.source === r);
|
|
178
178
|
}
|
|
179
179
|
function H(t, r) {
|
|
180
|
-
const e = "data",
|
|
180
|
+
const e = "data", o = "circle-data", l = W(r), s = { ...t.sources ?? {} };
|
|
181
181
|
s[e] = {
|
|
182
182
|
type: "geojson",
|
|
183
183
|
data: l
|
|
184
184
|
};
|
|
185
|
-
const c = Array.isArray(t.layers) ? [...t.layers] : [], f = !U(t, e), h = c.filter((x) => x && typeof x == "object" && x.id !==
|
|
185
|
+
const c = Array.isArray(t.layers) ? [...t.layers] : [], f = !U(t, e), h = c.filter((x) => x && typeof x == "object" && x.id !== o);
|
|
186
186
|
return f && h.push({
|
|
187
|
-
id:
|
|
187
|
+
id: o,
|
|
188
188
|
type: "circle",
|
|
189
189
|
source: e,
|
|
190
190
|
paint: {
|
|
@@ -200,8 +200,8 @@ function H(t, r) {
|
|
|
200
200
|
layers: h
|
|
201
201
|
};
|
|
202
202
|
}
|
|
203
|
-
function
|
|
204
|
-
const e = "data",
|
|
203
|
+
function B(t, r) {
|
|
204
|
+
const e = "data", o = "circle-data", l = W(r);
|
|
205
205
|
console.log("[MapLibreGL] ensureDataSourceAndLayer called with", r.length, "rows"), console.log("[MapLibreGL] GeoJSON features:", l.features.length);
|
|
206
206
|
const s = t.style;
|
|
207
207
|
if (!s || !s._loaded) {
|
|
@@ -229,8 +229,8 @@ function E(t, r) {
|
|
|
229
229
|
}
|
|
230
230
|
try {
|
|
231
231
|
const c = t.getStyle(), f = U(c, e);
|
|
232
|
-
console.log("[MapLibreGL] hasAnyLayerUsingSource:", f, "hasLayer:", !!t.getLayer(
|
|
233
|
-
id:
|
|
232
|
+
console.log("[MapLibreGL] hasAnyLayerUsingSource:", f, "hasLayer:", !!t.getLayer(o)), !f && !t.getLayer(o) && (console.log("[MapLibreGL] Adding circle layer"), t.addLayer({
|
|
233
|
+
id: o,
|
|
234
234
|
type: "circle",
|
|
235
235
|
source: e,
|
|
236
236
|
paint: {
|
|
@@ -246,22 +246,22 @@ function E(t, r) {
|
|
|
246
246
|
}
|
|
247
247
|
}
|
|
248
248
|
function Q({ page: t, componentId: r, component: e }) {
|
|
249
|
-
const
|
|
249
|
+
const o = e.title ?? r, l = "circle-data", { ref: s, size: c } = I(), f = T(null), h = T([]), x = T(/* @__PURE__ */ new Map()), p = R(() => Y(e.config), [e.config]), u = R(() => A(t, e.dataRef), [t, e.dataRef]), k = R(() => {
|
|
250
250
|
if (!u || u.length === 0) return null;
|
|
251
251
|
let a = 1 / 0, d = 1 / 0, w = -1 / 0, y = -1 / 0;
|
|
252
252
|
for (const m of u) {
|
|
253
|
-
const
|
|
254
|
-
typeof
|
|
253
|
+
const b = typeof m.longitude == "number" ? m.longitude : typeof m.lng == "number" ? m.lng : typeof m.lon == "number" ? m.lon : void 0, M = typeof m.latitude == "number" ? m.latitude : typeof m.lat == "number" ? m.lat : void 0;
|
|
254
|
+
typeof b != "number" || typeof M != "number" || !Number.isFinite(b) || !Number.isFinite(M) || (a = Math.min(a, b), d = Math.min(d, M), w = Math.max(w, b), y = Math.max(y, M));
|
|
255
255
|
}
|
|
256
256
|
return !Number.isFinite(a) || !Number.isFinite(d) || !Number.isFinite(w) || !Number.isFinite(y) ? null : [
|
|
257
257
|
[a, d],
|
|
258
258
|
[w, y]
|
|
259
259
|
];
|
|
260
|
-
}, [u]), g =
|
|
260
|
+
}, [u]), g = R(() => {
|
|
261
261
|
if (!p.options) return;
|
|
262
262
|
const { projection: a, ...d } = p.options;
|
|
263
263
|
return d;
|
|
264
|
-
}, [p.options]), L =
|
|
264
|
+
}, [p.options]), L = R(() => {
|
|
265
265
|
const a = p.options?.projection;
|
|
266
266
|
if (typeof a == "string") return a;
|
|
267
267
|
if (a && typeof a == "object" && typeof a.name == "string") return a.name;
|
|
@@ -270,7 +270,7 @@ function Q({ page: t, componentId: r, component: e }) {
|
|
|
270
270
|
if (typeof d == "string") return d;
|
|
271
271
|
if (d && typeof d == "object" && typeof d.name == "string") return d.name;
|
|
272
272
|
if (d && typeof d == "object" && typeof d.type == "string") return d.type;
|
|
273
|
-
}, [p.options, p.style]), S = typeof p.style == "string" && typeof L == "string",
|
|
273
|
+
}, [p.options, p.style]), S = typeof p.style == "string" && typeof L == "string", z = typeof p.style == "string" && Array.isArray(u) && u.length > 0, V = R(
|
|
274
274
|
() => ({
|
|
275
275
|
version: 8,
|
|
276
276
|
sources: {},
|
|
@@ -278,12 +278,12 @@ function Q({ page: t, componentId: r, component: e }) {
|
|
|
278
278
|
}),
|
|
279
279
|
[]
|
|
280
280
|
), N = (a) => {
|
|
281
|
-
if (!S &&
|
|
281
|
+
if (!S && !z) return;
|
|
282
282
|
const d = p.style, w = x.current.get(d);
|
|
283
283
|
if (w) {
|
|
284
284
|
try {
|
|
285
285
|
let y = w;
|
|
286
|
-
S && (y = { ...y ?? {}, projection: { type: L } }),
|
|
286
|
+
S && (y = { ...y ?? {}, projection: { type: L } }), z && e.dataRef && u && (y = H(y, u) ?? y), a.setStyle(y);
|
|
287
287
|
} catch {
|
|
288
288
|
}
|
|
289
289
|
return;
|
|
@@ -291,53 +291,60 @@ function Q({ page: t, componentId: r, component: e }) {
|
|
|
291
291
|
fetch(d).then((y) => y.json()).then((y) => {
|
|
292
292
|
x.current.set(d, y);
|
|
293
293
|
let m = y ?? {};
|
|
294
|
-
S && (m = { ...m, projection: { type: L } }),
|
|
294
|
+
S && (m = { ...m, projection: { type: L } }), z && e.dataRef && u && (m = H(m, u) ?? m);
|
|
295
295
|
try {
|
|
296
296
|
a.setStyle(m);
|
|
297
297
|
} catch {
|
|
298
298
|
}
|
|
299
299
|
}).catch(() => {
|
|
300
300
|
});
|
|
301
|
-
},
|
|
301
|
+
}, P = R(() => {
|
|
302
302
|
if (p.style)
|
|
303
303
|
return typeof p.style == "object" && p.style && e.dataRef && Array.isArray(u) && u.length > 0 ? H(p.style, u) ?? p.style : p.style;
|
|
304
304
|
}, [p.style, e.dataRef, u]);
|
|
305
|
-
return
|
|
305
|
+
return $(() => {
|
|
306
306
|
const a = s.current;
|
|
307
|
-
if (!a || !
|
|
307
|
+
if (!a || !P) return;
|
|
308
308
|
if (!f.current) {
|
|
309
|
+
if (typeof window < "u" && window.openai?.requestDisplayMode) {
|
|
310
|
+
console.log("[MapLibreGL] Requesting fullscreen mode for map");
|
|
311
|
+
const M = window.openai.requestDisplayMode({ mode: "fullscreen" });
|
|
312
|
+
M && typeof M.catch == "function" && M.catch((C) => {
|
|
313
|
+
console.log("[MapLibreGL] Could not request fullscreen:", C);
|
|
314
|
+
});
|
|
315
|
+
}
|
|
309
316
|
const w = {
|
|
310
317
|
container: a,
|
|
311
|
-
style: typeof
|
|
318
|
+
style: typeof P == "string" && (S || z) ? V : P,
|
|
312
319
|
attributionControl: {},
|
|
313
320
|
...g ?? {}
|
|
314
321
|
}, y = new j.Map(w);
|
|
315
322
|
N(y);
|
|
316
|
-
const m = () =>
|
|
323
|
+
const m = () => q(y, L);
|
|
317
324
|
y.once("load", m), y.once("style.load", m), y.addControl(new j.NavigationControl({ visualizePitch: !0 }), "top-right");
|
|
318
|
-
const
|
|
325
|
+
const b = () => {
|
|
319
326
|
u && u.length > 0 && setTimeout(() => {
|
|
320
|
-
if (y.isStyleLoaded() && (
|
|
327
|
+
if (y.isStyleLoaded() && (B(y, u), !p.options?.center && p.options?.zoom === void 0 && k))
|
|
321
328
|
try {
|
|
322
329
|
y.fitBounds(k, { padding: 30, duration: 0, maxZoom: 12 });
|
|
323
330
|
} catch {
|
|
324
331
|
}
|
|
325
332
|
}, 100);
|
|
326
333
|
};
|
|
327
|
-
return y.on("style.load",
|
|
334
|
+
return y.on("style.load", b), y.once("load", b), f.current = y, () => {
|
|
328
335
|
h.current.forEach((M) => M.remove()), h.current = [], f.current = null, y.remove();
|
|
329
336
|
};
|
|
330
337
|
}
|
|
331
338
|
const d = f.current;
|
|
332
|
-
if (S ||
|
|
339
|
+
if (S || z)
|
|
333
340
|
N(d);
|
|
334
341
|
else
|
|
335
342
|
try {
|
|
336
|
-
d.setStyle(
|
|
343
|
+
d.setStyle(P);
|
|
337
344
|
} catch {
|
|
338
345
|
}
|
|
339
346
|
if (L) {
|
|
340
|
-
const w = () =>
|
|
347
|
+
const w = () => q(d, L);
|
|
341
348
|
d.once("style.load", w), d.once("render", w);
|
|
342
349
|
}
|
|
343
350
|
if (p.options?.center && p.options?.zoom !== void 0)
|
|
@@ -345,16 +352,16 @@ function Q({ page: t, componentId: r, component: e }) {
|
|
|
345
352
|
d.jumpTo({ center: p.options.center, zoom: p.options.zoom });
|
|
346
353
|
} catch {
|
|
347
354
|
}
|
|
348
|
-
}, [
|
|
355
|
+
}, [P, g, s, L, z, S, u, k, p.options?.center, p.options?.zoom]), $(() => {
|
|
349
356
|
const a = f.current;
|
|
350
357
|
if (!a || !u || u.length === 0) return;
|
|
351
358
|
const d = () => {
|
|
352
|
-
const
|
|
353
|
-
if (console.log("[MapLibreGL] apply() called, isStyleLoaded:", a.isStyleLoaded(), "style._loaded:",
|
|
359
|
+
const b = a.style, M = a.isStyleLoaded() && b && b._loaded;
|
|
360
|
+
if (console.log("[MapLibreGL] apply() called, isStyleLoaded:", a.isStyleLoaded(), "style._loaded:", b?._loaded), !M) {
|
|
354
361
|
console.warn("[MapLibreGL] Style not ready, skipping apply");
|
|
355
362
|
return;
|
|
356
363
|
}
|
|
357
|
-
if (
|
|
364
|
+
if (B(a, u), !p.options?.center && p.options?.zoom === void 0 && k)
|
|
358
365
|
try {
|
|
359
366
|
a.fitBounds(k, { padding: 30, duration: 0, maxZoom: 12 });
|
|
360
367
|
} catch {
|
|
@@ -366,25 +373,25 @@ function Q({ page: t, componentId: r, component: e }) {
|
|
|
366
373
|
}, m = () => {
|
|
367
374
|
console.log("[MapLibreGL] load event fired"), setTimeout(d, 50);
|
|
368
375
|
};
|
|
369
|
-
return a.once("style.load", y), a.once("load", m), [500, 1e3, 2e3, 3e3].forEach((
|
|
376
|
+
return a.once("style.load", y), a.once("load", m), [500, 1e3, 2e3, 3e3].forEach((b) => {
|
|
370
377
|
w.push(setTimeout(() => {
|
|
371
|
-
a.isStyleLoaded() && (console.log(`[MapLibreGL] Fallback timer (${
|
|
372
|
-
},
|
|
378
|
+
a.isStyleLoaded() && (console.log(`[MapLibreGL] Fallback timer (${b}ms) applying data layer`), d());
|
|
379
|
+
}, b));
|
|
373
380
|
}), () => {
|
|
374
|
-
w.forEach((
|
|
381
|
+
w.forEach((b) => clearTimeout(b));
|
|
375
382
|
};
|
|
376
|
-
}, [u, k, p.options?.center, p.options?.zoom]),
|
|
383
|
+
}, [u, k, p.options?.center, p.options?.zoom]), $(() => {
|
|
377
384
|
const a = f.current;
|
|
378
385
|
a && (c.width <= 0 || c.height <= 0 || a.resize());
|
|
379
|
-
}, [c.width, c.height]),
|
|
386
|
+
}, [c.width, c.height]), $(() => {
|
|
380
387
|
const a = f.current;
|
|
381
388
|
if (!a || !u || u.length === 0) return;
|
|
382
389
|
const d = new j.Popup({
|
|
383
390
|
closeButton: !1,
|
|
384
391
|
closeOnClick: !1
|
|
385
|
-
}), w = (
|
|
386
|
-
if (!
|
|
387
|
-
const M =
|
|
392
|
+
}), w = (b) => {
|
|
393
|
+
if (!b.features || b.features.length === 0) return;
|
|
394
|
+
const M = b.features[0], C = M.properties ?? {}, G = C.name ?? C.region ?? C.title ?? C.label ?? C.description;
|
|
388
395
|
if (G) {
|
|
389
396
|
a.getCanvas().style.cursor = "pointer";
|
|
390
397
|
const Z = M.geometry.coordinates.slice();
|
|
@@ -398,41 +405,41 @@ function Q({ page: t, componentId: r, component: e }) {
|
|
|
398
405
|
return m(), () => {
|
|
399
406
|
d.remove(), a && !a._removed && a.getLayer(l) && (a.off("mouseenter", l, w), a.off("mouseleave", l, y));
|
|
400
407
|
};
|
|
401
|
-
}, [u, l]),
|
|
408
|
+
}, [u, l]), $(() => {
|
|
402
409
|
const a = f.current;
|
|
403
410
|
a && (h.current.forEach((d) => d.remove()), h.current = [], (p.markers ?? []).forEach((d) => {
|
|
404
411
|
const y = d.shape === "circle" || typeof d.radius == "number" || typeof d.color == "string" ? document.createElement("div") : null;
|
|
405
412
|
if (y) {
|
|
406
|
-
const
|
|
407
|
-
y.style.width = `${
|
|
413
|
+
const b = typeof d.radius == "number" && Number.isFinite(d.radius) ? Math.max(2, d.radius) : 8;
|
|
414
|
+
y.style.width = `${b * 2}px`, y.style.height = `${b * 2}px`, y.style.borderRadius = "999px", y.style.background = typeof d.color == "string" ? d.color : "#2563eb", y.style.border = "2px solid #ffffff", y.style.boxShadow = "0 2px 10px rgba(0,0,0,0.25)";
|
|
408
415
|
}
|
|
409
416
|
const m = new j.Marker(y ? { element: y } : void 0).setLngLat(d.lngLat);
|
|
410
417
|
if (d.popup || d.name) {
|
|
411
|
-
const
|
|
412
|
-
m.setPopup(new j.Popup({ offset: 20 }).setHTML(
|
|
418
|
+
const b = d.popup ?? `<div style="font-size:12px"><strong>${d.name ?? ""}</strong></div>`;
|
|
419
|
+
m.setPopup(new j.Popup({ offset: 20 }).setHTML(b));
|
|
413
420
|
}
|
|
414
421
|
m.addTo(a), h.current.push(m);
|
|
415
422
|
}));
|
|
416
|
-
}, [p.markers]), /* @__PURE__ */
|
|
417
|
-
/* @__PURE__ */ i("div", { style:
|
|
418
|
-
/* @__PURE__ */ i("div", { style:
|
|
423
|
+
}, [p.markers]), /* @__PURE__ */ v("div", { style: n.panel, children: [
|
|
424
|
+
/* @__PURE__ */ i("div", { style: n.panelHeader, children: /* @__PURE__ */ i("div", { style: n.panelTitle, children: o }) }),
|
|
425
|
+
/* @__PURE__ */ i("div", { style: n.panelBody, children: p.style ? /* @__PURE__ */ i("div", { ref: s, style: { width: "100%", height: "100%", minHeight: 420 } }) : /* @__PURE__ */ v("div", { style: n.muted, children: [
|
|
419
426
|
"MapLibre requires a style in component.config. Provide either:",
|
|
420
|
-
/* @__PURE__ */ i("pre", { style:
|
|
427
|
+
/* @__PURE__ */ i("pre", { style: n.pre, children: JSON.stringify({ style: "https://.../style.json", options: { center: [12.5, 41.9], zoom: 4 } }, null, 2) })
|
|
421
428
|
] }) })
|
|
422
429
|
] });
|
|
423
430
|
}
|
|
424
431
|
function ee({ page: t, componentId: r, component: e }) {
|
|
425
|
-
const
|
|
426
|
-
return l ? /* @__PURE__ */
|
|
427
|
-
/* @__PURE__ */ i("div", { style:
|
|
428
|
-
/* @__PURE__ */ i("div", { style: { ...
|
|
432
|
+
const o = e.title ?? r, l = typeof e.config?.md == "string" ? e.config.md : "";
|
|
433
|
+
return l ? /* @__PURE__ */ v("div", { style: n.panel, children: [
|
|
434
|
+
/* @__PURE__ */ i("div", { style: n.panelHeader, children: /* @__PURE__ */ i("div", { style: n.panelTitle, children: o }) }),
|
|
435
|
+
/* @__PURE__ */ i("div", { style: { ...n.panelBody, overflow: "auto" }, children: /* @__PURE__ */ i("div", { style: {
|
|
429
436
|
padding: "8px",
|
|
430
437
|
lineHeight: "1.6",
|
|
431
438
|
fontSize: "14px"
|
|
432
439
|
}, children: /* @__PURE__ */ i(_, { children: l }) }) })
|
|
433
|
-
] }) : /* @__PURE__ */
|
|
434
|
-
/* @__PURE__ */ i("div", { style:
|
|
435
|
-
/* @__PURE__ */ i("div", { style:
|
|
440
|
+
] }) : /* @__PURE__ */ v("div", { style: n.panel, children: [
|
|
441
|
+
/* @__PURE__ */ i("div", { style: n.panelHeader, children: /* @__PURE__ */ i("div", { style: n.panelTitle, children: o }) }),
|
|
442
|
+
/* @__PURE__ */ i("div", { style: n.panelBody, children: /* @__PURE__ */ i("div", { style: n.muted, children: 'No markdown content provided. Add an "md" field to config.' }) })
|
|
436
443
|
] });
|
|
437
444
|
}
|
|
438
445
|
F.initialize({
|
|
@@ -441,8 +448,8 @@ F.initialize({
|
|
|
441
448
|
securityLevel: "loose"
|
|
442
449
|
});
|
|
443
450
|
function te({ page: t, componentId: r, component: e }) {
|
|
444
|
-
const
|
|
445
|
-
|
|
451
|
+
const o = e.title ?? r, l = typeof e.config?.mermaid == "string" ? e.config.mermaid : "", s = T(null), [c, f] = O(1);
|
|
452
|
+
$(() => {
|
|
446
453
|
if (!l || !s.current) return;
|
|
447
454
|
(async () => {
|
|
448
455
|
try {
|
|
@@ -458,10 +465,10 @@ function te({ page: t, componentId: r, component: e }) {
|
|
|
458
465
|
})();
|
|
459
466
|
}, [l, r]);
|
|
460
467
|
const h = () => f((u) => Math.min(u + 0.2, 3)), x = () => f((u) => Math.max(u - 0.2, 0.5)), p = () => f(1);
|
|
461
|
-
return l ? /* @__PURE__ */
|
|
462
|
-
/* @__PURE__ */
|
|
463
|
-
/* @__PURE__ */ i("div", { style:
|
|
464
|
-
/* @__PURE__ */
|
|
468
|
+
return l ? /* @__PURE__ */ v("div", { style: n.panel, children: [
|
|
469
|
+
/* @__PURE__ */ v("div", { style: n.panelHeader, children: [
|
|
470
|
+
/* @__PURE__ */ i("div", { style: n.panelTitle, children: o }),
|
|
471
|
+
/* @__PURE__ */ v("div", { style: { display: "flex", gap: "4px", marginLeft: "auto" }, children: [
|
|
465
472
|
/* @__PURE__ */ i(
|
|
466
473
|
"button",
|
|
467
474
|
{
|
|
@@ -478,7 +485,7 @@ function te({ page: t, componentId: r, component: e }) {
|
|
|
478
485
|
children: "−"
|
|
479
486
|
}
|
|
480
487
|
),
|
|
481
|
-
/* @__PURE__ */
|
|
488
|
+
/* @__PURE__ */ v(
|
|
482
489
|
"button",
|
|
483
490
|
{
|
|
484
491
|
onClick: p,
|
|
@@ -515,7 +522,7 @@ function te({ page: t, componentId: r, component: e }) {
|
|
|
515
522
|
)
|
|
516
523
|
] })
|
|
517
524
|
] }),
|
|
518
|
-
/* @__PURE__ */ i("div", { style: { ...
|
|
525
|
+
/* @__PURE__ */ i("div", { style: { ...n.panelBody, overflow: "auto", position: "relative" }, children: /* @__PURE__ */ i("div", { style: {
|
|
519
526
|
padding: "50px",
|
|
520
527
|
display: "flex",
|
|
521
528
|
justifyContent: "center",
|
|
@@ -531,38 +538,38 @@ function te({ page: t, componentId: r, component: e }) {
|
|
|
531
538
|
}
|
|
532
539
|
}
|
|
533
540
|
) }) })
|
|
534
|
-
] }) : /* @__PURE__ */
|
|
535
|
-
/* @__PURE__ */ i("div", { style:
|
|
536
|
-
/* @__PURE__ */ i("div", { style:
|
|
541
|
+
] }) : /* @__PURE__ */ v("div", { style: n.panel, children: [
|
|
542
|
+
/* @__PURE__ */ i("div", { style: n.panelHeader, children: /* @__PURE__ */ i("div", { style: n.panelTitle, children: o }) }),
|
|
543
|
+
/* @__PURE__ */ i("div", { style: n.panelBody, children: /* @__PURE__ */ i("div", { style: n.muted, children: 'No mermaid diagram provided. Add a "mermaid" field to config.' }) })
|
|
537
544
|
] });
|
|
538
545
|
}
|
|
539
546
|
function re({ page: t, componentId: r, component: e }) {
|
|
540
|
-
const
|
|
541
|
-
return /* @__PURE__ */
|
|
542
|
-
/* @__PURE__ */ i("div", { style:
|
|
543
|
-
/* @__PURE__ */ i("div", { style:
|
|
544
|
-
/* @__PURE__ */ i("thead", { children: /* @__PURE__ */ i("tr", { children: s.map((c) => /* @__PURE__ */ i("th", { style:
|
|
545
|
-
/* @__PURE__ */ i("tbody", { children:
|
|
547
|
+
const o = A(t, e.dataRef) ?? [], l = e.config?.columns, s = l && l.length ? l : Object.keys(o[0] ?? {}).map((c) => ({ key: c, label: c }));
|
|
548
|
+
return /* @__PURE__ */ v("div", { style: n.panel, children: [
|
|
549
|
+
/* @__PURE__ */ i("div", { style: n.panelHeader, children: /* @__PURE__ */ i("div", { style: n.panelTitle, children: e.title ?? r }) }),
|
|
550
|
+
/* @__PURE__ */ i("div", { style: n.panelBody, children: /* @__PURE__ */ i("div", { style: n.tableWrap, children: /* @__PURE__ */ v("table", { style: n.table, children: [
|
|
551
|
+
/* @__PURE__ */ i("thead", { children: /* @__PURE__ */ i("tr", { children: s.map((c) => /* @__PURE__ */ i("th", { style: n.th, children: c.label }, c.key)) }) }),
|
|
552
|
+
/* @__PURE__ */ i("tbody", { children: o.map((c, f) => /* @__PURE__ */ i("tr", { children: s.map((h) => /* @__PURE__ */ i("td", { style: n.td, children: String(c[h.key] ?? "") }, h.key)) }, f)) })
|
|
546
553
|
] }) }) })
|
|
547
554
|
] });
|
|
548
555
|
}
|
|
549
556
|
function ie({ componentId: t, component: r }) {
|
|
550
|
-
return /* @__PURE__ */
|
|
551
|
-
/* @__PURE__ */ i("div", { style:
|
|
552
|
-
/* @__PURE__ */ i("div", { style:
|
|
557
|
+
return /* @__PURE__ */ v("div", { style: n.panel, children: [
|
|
558
|
+
/* @__PURE__ */ i("div", { style: n.panelHeader, children: /* @__PURE__ */ i("div", { style: n.panelTitle, children: r.title ?? t }) }),
|
|
559
|
+
/* @__PURE__ */ i("div", { style: n.panelBody, children: /* @__PURE__ */ i("pre", { style: n.pre, children: JSON.stringify(r, null, 2) }) })
|
|
553
560
|
] });
|
|
554
561
|
}
|
|
555
|
-
function
|
|
562
|
+
function oe(t) {
|
|
556
563
|
if (!t || typeof t != "object") return !1;
|
|
557
564
|
const r = (e) => {
|
|
558
565
|
if (!e || typeof e != "object") return !1;
|
|
559
|
-
const
|
|
566
|
+
const o = e.mark, l = o === "text" || o && typeof o == "object" && o.type === "text", s = !!(e.encoding?.text && typeof e.encoding.text == "object" && "value" in e.encoding.text);
|
|
560
567
|
return l && s ? !0 : Array.isArray(e.layer) ? e.layer.some(r) : e.spec ? r(e.spec) : !1;
|
|
561
568
|
};
|
|
562
569
|
return r(t);
|
|
563
570
|
}
|
|
564
|
-
function
|
|
565
|
-
const
|
|
571
|
+
function ne({ page: t, componentId: r, component: e }) {
|
|
572
|
+
const o = A(t, e.dataRef), { ref: l, size: s } = I(), c = e.spec ?? {}, f = c.config ?? {}, h = {
|
|
566
573
|
...f,
|
|
567
574
|
axis: { ...f.axis, grid: !1 },
|
|
568
575
|
axisX: { ...f.axisX, grid: !1 },
|
|
@@ -573,16 +580,16 @@ function oe({ page: t, componentId: r, component: e }) {
|
|
|
573
580
|
autosize: { type: "fit", contains: "padding" },
|
|
574
581
|
width: Math.floor(s.width),
|
|
575
582
|
height: Math.floor(s.height)
|
|
576
|
-
} : x, u =
|
|
577
|
-
return /* @__PURE__ */
|
|
578
|
-
k ? /* @__PURE__ */ i("div", { style:
|
|
579
|
-
/* @__PURE__ */ i("div", { style:
|
|
583
|
+
} : x, u = o ? { ...p, data: { values: o } } : oe(p) ? { ...p, data: { values: [{}] } } : p, k = e.title === "" ? "" : e.title ?? r;
|
|
584
|
+
return /* @__PURE__ */ v("div", { style: n.panel, children: [
|
|
585
|
+
k ? /* @__PURE__ */ i("div", { style: n.panelHeader, children: /* @__PURE__ */ i("div", { style: n.panelTitle, children: k }) }) : null,
|
|
586
|
+
/* @__PURE__ */ i("div", { style: n.panelBody, children: /* @__PURE__ */ i("div", { ref: l, style: { width: "100%", height: "100%" }, children: /* @__PURE__ */ i(J, { spec: u, actions: !1 }) }) })
|
|
580
587
|
] });
|
|
581
588
|
}
|
|
582
|
-
function
|
|
589
|
+
function E({ page: t, componentId: r, component: e }) {
|
|
583
590
|
switch (e.type) {
|
|
584
591
|
case "vegalite5":
|
|
585
|
-
return /* @__PURE__ */ i(
|
|
592
|
+
return /* @__PURE__ */ i(ne, { page: t, componentId: r, component: e });
|
|
586
593
|
case "table":
|
|
587
594
|
return /* @__PURE__ */ i(re, { page: t, componentId: r, component: e });
|
|
588
595
|
case "form":
|
|
@@ -603,11 +610,11 @@ function D(t, r, e) {
|
|
|
603
610
|
return Math.min(e, Math.max(r, t));
|
|
604
611
|
}
|
|
605
612
|
function se(t) {
|
|
606
|
-
const r = t.reduce((
|
|
613
|
+
const r = t.reduce((o, l) => Math.max(o, l.y + l.h), 0), e = t.reduce((o, l) => Math.max(o, l.x + l.w), 0);
|
|
607
614
|
return { maxBottom: r, maxRight: e };
|
|
608
615
|
}
|
|
609
616
|
function Le({ page: t }) {
|
|
610
|
-
const { ref: r, size: e } = I(),
|
|
617
|
+
const { ref: r, size: e } = I(), o = t.layout.cols ?? 24, l = t.layout.rowHeight ?? 30, s = t.layout.margin?.[0] ?? 10, c = t.layout.margin?.[1] ?? 10, f = t.layout.containerPadding?.[0] ?? 0, h = t.layout.containerPadding?.[1] ?? 0, { maxBottom: x } = se(t.layout.items), p = x * l + Math.max(0, x - 1) * c + h * 2, u = e.width > 0 ? e.width < 768 : !1, k = [...t.layout.items].sort((g, L) => g.y - L.y || g.x - L.x);
|
|
611
618
|
return /* @__PURE__ */ i("div", { ref: r, children: u ? /* @__PURE__ */ i(
|
|
612
619
|
"div",
|
|
613
620
|
{
|
|
@@ -619,9 +626,9 @@ function Le({ page: t }) {
|
|
|
619
626
|
},
|
|
620
627
|
children: k.map((g) => {
|
|
621
628
|
const L = t.components[g.i], S = g.h * l + Math.max(0, g.h - 1) * c;
|
|
622
|
-
return /* @__PURE__ */ i("div", { style: { width: "100%", height: S }, children: L ? /* @__PURE__ */ i(
|
|
623
|
-
/* @__PURE__ */ i("div", { style:
|
|
624
|
-
/* @__PURE__ */ i("div", { style:
|
|
629
|
+
return /* @__PURE__ */ i("div", { style: { width: "100%", height: S }, children: L ? /* @__PURE__ */ i(E, { page: t, componentId: g.i, component: L }) : /* @__PURE__ */ v("div", { style: n.panel, children: [
|
|
630
|
+
/* @__PURE__ */ i("div", { style: n.panelHeader, children: /* @__PURE__ */ i("div", { style: n.panelTitle, children: g.i }) }),
|
|
631
|
+
/* @__PURE__ */ i("div", { style: n.panelBody, children: /* @__PURE__ */ v("div", { style: n.error, children: [
|
|
625
632
|
"No entry in components for id: ",
|
|
626
633
|
g.i
|
|
627
634
|
] }) })
|
|
@@ -632,9 +639,9 @@ function Le({ page: t }) {
|
|
|
632
639
|
"div",
|
|
633
640
|
{
|
|
634
641
|
style: {
|
|
635
|
-
...
|
|
642
|
+
...n.canvas,
|
|
636
643
|
padding: `${h}px ${f}px`,
|
|
637
|
-
gridTemplateColumns: `repeat(${
|
|
644
|
+
gridTemplateColumns: `repeat(${o}, minmax(0, 1fr))`,
|
|
638
645
|
gridAutoRows: `${l}px`,
|
|
639
646
|
gap: `${c}px ${s}px`,
|
|
640
647
|
minHeight: p
|
|
@@ -645,14 +652,14 @@ function Le({ page: t }) {
|
|
|
645
652
|
"div",
|
|
646
653
|
{
|
|
647
654
|
style: {
|
|
648
|
-
gridColumnStart: D(g.x + 1, 1,
|
|
649
|
-
gridColumnEnd: `span ${D(g.w, 1,
|
|
655
|
+
gridColumnStart: D(g.x + 1, 1, o + 1),
|
|
656
|
+
gridColumnEnd: `span ${D(g.w, 1, o)}`,
|
|
650
657
|
gridRowStart: Math.max(1, g.y + 1),
|
|
651
658
|
gridRowEnd: `span ${Math.max(1, g.h)}`
|
|
652
659
|
},
|
|
653
|
-
children: L ? /* @__PURE__ */ i(
|
|
654
|
-
/* @__PURE__ */ i("div", { style:
|
|
655
|
-
/* @__PURE__ */ i("div", { style:
|
|
660
|
+
children: L ? /* @__PURE__ */ i(E, { page: t, componentId: g.i, component: L }) : /* @__PURE__ */ v("div", { style: n.panel, children: [
|
|
661
|
+
/* @__PURE__ */ i("div", { style: n.panelHeader, children: /* @__PURE__ */ i("div", { style: n.panelTitle, children: g.i }) }),
|
|
662
|
+
/* @__PURE__ */ i("div", { style: n.panelBody, children: /* @__PURE__ */ v("div", { style: n.error, children: [
|
|
656
663
|
"No entry in components for id: ",
|
|
657
664
|
g.i
|
|
658
665
|
] }) })
|
|
@@ -678,17 +685,17 @@ function ke(t) {
|
|
|
678
685
|
const r = JSON.parse(JSON.stringify(t));
|
|
679
686
|
r && typeof r == "object" && delete r.$id;
|
|
680
687
|
try {
|
|
681
|
-
const
|
|
682
|
-
|
|
688
|
+
const o = r?.$defs?.Layout?.properties?.items;
|
|
689
|
+
o && typeof o == "object" && (o.minItems = 0);
|
|
683
690
|
} catch {
|
|
684
691
|
}
|
|
685
|
-
const e = (
|
|
686
|
-
if (!(!
|
|
687
|
-
if (
|
|
688
|
-
delete
|
|
692
|
+
const e = (o) => {
|
|
693
|
+
if (!(!o || typeof o != "object")) {
|
|
694
|
+
if (o.$ref === "https://vega.github.io/schema/vega-lite/v5.json") {
|
|
695
|
+
delete o.$ref, o.type = "object", o.additionalProperties = !0;
|
|
689
696
|
return;
|
|
690
697
|
}
|
|
691
|
-
for (const l of Object.values(
|
|
698
|
+
for (const l of Object.values(o))
|
|
692
699
|
Array.isArray(l) ? l.forEach(e) : e(l);
|
|
693
700
|
}
|
|
694
701
|
};
|
|
@@ -698,5 +705,5 @@ export {
|
|
|
698
705
|
Le as CanvasRenderer,
|
|
699
706
|
we as PAGE_SCHEMA,
|
|
700
707
|
ke as schemaWithoutRemoteVegaLiteRef,
|
|
701
|
-
|
|
708
|
+
n as styles
|
|
702
709
|
};
|