declarative-ui-core 1.0.4 → 1.0.6
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 +189 -186
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
import { jsxs as v, jsx as
|
|
2
|
-
import { useRef as
|
|
1
|
+
import { jsxs as v, jsx as r } from "react/jsx-runtime";
|
|
2
|
+
import { useRef as A, useState as G, useEffect as C, useMemo as S } from "react";
|
|
3
3
|
import P from "maplibre-gl";
|
|
4
|
-
import
|
|
5
|
-
import
|
|
4
|
+
import J from "react-markdown";
|
|
5
|
+
import F from "mermaid";
|
|
6
6
|
import { VegaLite as K } from "react-vega";
|
|
7
7
|
const o = {
|
|
8
8
|
canvas: {
|
|
@@ -54,74 +54,74 @@ const o = {
|
|
|
54
54
|
muted: { fontSize: 13, color: "#666" },
|
|
55
55
|
error: { padding: 10, border: "1px solid #f2c", borderRadius: 12, background: "#fff7fb", fontSize: 12 }
|
|
56
56
|
};
|
|
57
|
-
function X({ componentId:
|
|
57
|
+
function X({ componentId: i, component: t }) {
|
|
58
58
|
const e = t.config?.columns;
|
|
59
59
|
return /* @__PURE__ */ v("div", { style: o.panel, children: [
|
|
60
|
-
/* @__PURE__ */
|
|
61
|
-
/* @__PURE__ */
|
|
60
|
+
/* @__PURE__ */ r("div", { style: o.panelHeader, children: /* @__PURE__ */ r("div", { style: o.panelTitle, children: t.title ?? i }) }),
|
|
61
|
+
/* @__PURE__ */ r("div", { style: o.panelBody, children: /* @__PURE__ */ v("div", { style: o.kvList, children: [
|
|
62
62
|
(e ?? []).map((n) => /* @__PURE__ */ v("label", { style: o.formRow, children: [
|
|
63
|
-
/* @__PURE__ */
|
|
64
|
-
/* @__PURE__ */
|
|
63
|
+
/* @__PURE__ */ r("div", { style: o.formLabel, children: n.label }),
|
|
64
|
+
/* @__PURE__ */ r("input", { style: o.input, placeholder: n.key })
|
|
65
65
|
] }, n.key)),
|
|
66
|
-
e?.length ? null : /* @__PURE__ */
|
|
66
|
+
e?.length ? null : /* @__PURE__ */ r("div", { style: o.muted, children: "No columns provided." })
|
|
67
67
|
] }) })
|
|
68
68
|
] });
|
|
69
69
|
}
|
|
70
|
-
function
|
|
70
|
+
function T(i, t) {
|
|
71
71
|
if (!t) return;
|
|
72
|
-
const e = t.startsWith("data.") ? t.slice(5) : t, n =
|
|
72
|
+
const e = t.startsWith("data.") ? t.slice(5) : t, n = i.data?.[e];
|
|
73
73
|
if (!(!n || n.source !== "inline"))
|
|
74
74
|
return n.rows;
|
|
75
75
|
}
|
|
76
|
-
function Y({ page:
|
|
77
|
-
const n =
|
|
76
|
+
function Y({ page: i, componentId: t, component: e }) {
|
|
77
|
+
const n = T(i, e.dataRef) ?? [], l = e.config?.mode, s = e.config?.displayFields, p = s && s.length > 0 ? s : n.length > 0 ? Object.keys(n[0]) : [];
|
|
78
78
|
return /* @__PURE__ */ v("div", { style: o.panel, children: [
|
|
79
|
-
/* @__PURE__ */
|
|
80
|
-
/* @__PURE__ */
|
|
81
|
-
/* @__PURE__ */
|
|
82
|
-
/* @__PURE__ */
|
|
83
|
-
] }, y)) }) :
|
|
84
|
-
/* @__PURE__ */
|
|
85
|
-
/* @__PURE__ */
|
|
86
|
-
] }, b)) }, m)) }) : /* @__PURE__ */
|
|
79
|
+
/* @__PURE__ */ r("div", { style: o.panelHeader, children: /* @__PURE__ */ r("div", { style: o.panelTitle, children: e.title ?? t }) }),
|
|
80
|
+
/* @__PURE__ */ r("div", { style: o.panelBody, children: l === "kv" && n.length === 1 ? /* @__PURE__ */ r("div", { style: o.kvList, children: Object.entries(n[0]).map(([y, m]) => /* @__PURE__ */ v("div", { style: o.kvRow, children: [
|
|
81
|
+
/* @__PURE__ */ r("div", { style: o.kvKey, children: y }),
|
|
82
|
+
/* @__PURE__ */ r("div", { style: o.kvValue, children: String(m) })
|
|
83
|
+
] }, y)) }) : p.length > 0 ? /* @__PURE__ */ r("div", { style: o.listCards, children: n.map((y, m) => /* @__PURE__ */ r("div", { style: o.listCard, children: p.map((b) => /* @__PURE__ */ v("div", { style: o.listCardRow, children: [
|
|
84
|
+
/* @__PURE__ */ r("div", { style: o.listCardLabel, children: b }),
|
|
85
|
+
/* @__PURE__ */ r("div", { style: o.listCardValue, children: String(y[b] ?? "") })
|
|
86
|
+
] }, b)) }, m)) }) : /* @__PURE__ */ r("pre", { style: o.pre, children: JSON.stringify(n, null, 2) }) })
|
|
87
87
|
] });
|
|
88
88
|
}
|
|
89
89
|
function I() {
|
|
90
|
-
const
|
|
91
|
-
return
|
|
92
|
-
const n =
|
|
90
|
+
const i = A(null), [t, e] = G({ width: 0, height: 0 });
|
|
91
|
+
return C(() => {
|
|
92
|
+
const n = i.current;
|
|
93
93
|
if (!n) return;
|
|
94
94
|
const l = new ResizeObserver((s) => {
|
|
95
|
-
const
|
|
96
|
-
if (!
|
|
97
|
-
const y =
|
|
95
|
+
const p = s[0];
|
|
96
|
+
if (!p) return;
|
|
97
|
+
const y = p.contentRect, m = { width: Math.round(y.width), height: Math.round(y.height) };
|
|
98
98
|
e((b) => Math.abs(b.width - m.width) <= 1 && Math.abs(b.height - m.height) <= 1 ? b : m);
|
|
99
99
|
});
|
|
100
100
|
return l.observe(n), () => l.disconnect();
|
|
101
|
-
}, []), { ref:
|
|
101
|
+
}, []), { ref: i, size: t };
|
|
102
102
|
}
|
|
103
|
-
function q(
|
|
103
|
+
function q(i, t) {
|
|
104
104
|
if (!t) return;
|
|
105
|
-
const e =
|
|
105
|
+
const e = i.setProjection;
|
|
106
106
|
if (typeof e != "function") return;
|
|
107
107
|
const n = typeof t == "string" ? t : t && typeof t == "object" && typeof t.name == "string" ? t.name : t && typeof t == "object" && typeof t.type == "string" ? t.type : void 0;
|
|
108
108
|
if (n)
|
|
109
109
|
try {
|
|
110
|
-
e.call(
|
|
110
|
+
e.call(i, n);
|
|
111
111
|
return;
|
|
112
112
|
} catch {
|
|
113
113
|
}
|
|
114
114
|
}
|
|
115
|
-
function _(
|
|
116
|
-
if (!
|
|
117
|
-
const t =
|
|
115
|
+
function _(i) {
|
|
116
|
+
if (!i || typeof i != "object") return {};
|
|
117
|
+
const t = i, e = Array.isArray(t.markers) ? t.markers : void 0, n = e ? e.map((l) => {
|
|
118
118
|
if (!l) return null;
|
|
119
119
|
if ("lngLat" in l) {
|
|
120
|
-
const s = l,
|
|
121
|
-
if (Array.isArray(
|
|
120
|
+
const s = l, p = s.lngLat;
|
|
121
|
+
if (Array.isArray(p) && p.length === 2)
|
|
122
122
|
return {
|
|
123
123
|
name: typeof s.name == "string" ? s.name : void 0,
|
|
124
|
-
lngLat: [Number(
|
|
124
|
+
lngLat: [Number(p[0]), Number(p[1])],
|
|
125
125
|
popup: typeof s.popup == "string" ? s.popup : void 0,
|
|
126
126
|
shape: typeof s.shape == "string" ? s.shape : void 0,
|
|
127
127
|
color: typeof s.color == "string" ? s.color : void 0,
|
|
@@ -131,9 +131,9 @@ function _(r) {
|
|
|
131
131
|
if ("longitude" in l && "latitude" in l) {
|
|
132
132
|
const s = l;
|
|
133
133
|
if (typeof s.longitude == "number" && typeof s.latitude == "number") {
|
|
134
|
-
const
|
|
134
|
+
const p = typeof s.title == "string" ? s.title : void 0, y = typeof s.description == "string" ? s.description : void 0;
|
|
135
135
|
return {
|
|
136
|
-
name:
|
|
136
|
+
name: p,
|
|
137
137
|
lngLat: [Number(s.longitude), Number(s.latitude)],
|
|
138
138
|
popup: y,
|
|
139
139
|
shape: typeof s.shape == "string" ? s.shape : void 0,
|
|
@@ -154,8 +154,8 @@ function _(r) {
|
|
|
154
154
|
}
|
|
155
155
|
return {};
|
|
156
156
|
}
|
|
157
|
-
function
|
|
158
|
-
return { type: "FeatureCollection", features:
|
|
157
|
+
function W(i) {
|
|
158
|
+
return { type: "FeatureCollection", features: i.map((e) => {
|
|
159
159
|
const n = 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;
|
|
160
160
|
if (typeof n != "number" || typeof l != "number" || !Number.isFinite(n) || !Number.isFinite(l)) return null;
|
|
161
161
|
const s = { ...e };
|
|
@@ -166,16 +166,16 @@ function V(r) {
|
|
|
166
166
|
};
|
|
167
167
|
}).filter((e) => e !== null) };
|
|
168
168
|
}
|
|
169
|
-
function
|
|
170
|
-
return (Array.isArray(
|
|
169
|
+
function V(i, t) {
|
|
170
|
+
return (Array.isArray(i?.layers) ? i.layers : []).some((n) => n && typeof n == "object" && n.source === t);
|
|
171
171
|
}
|
|
172
|
-
function H(
|
|
173
|
-
const e = "data", n = "circle-data", l =
|
|
172
|
+
function H(i, t) {
|
|
173
|
+
const e = "data", n = "circle-data", l = W(t), s = { ...i.sources ?? {} };
|
|
174
174
|
s[e] = {
|
|
175
175
|
type: "geojson",
|
|
176
176
|
data: l
|
|
177
177
|
};
|
|
178
|
-
const
|
|
178
|
+
const p = Array.isArray(i.layers) ? [...i.layers] : [], y = !V(i, e), m = p.filter((b) => b && typeof b == "object" && b.id !== n);
|
|
179
179
|
return y && m.push({
|
|
180
180
|
id: n,
|
|
181
181
|
type: "circle",
|
|
@@ -188,21 +188,23 @@ function H(r, t) {
|
|
|
188
188
|
"circle-opacity": 1
|
|
189
189
|
}
|
|
190
190
|
}), {
|
|
191
|
-
...
|
|
191
|
+
...i,
|
|
192
192
|
sources: s,
|
|
193
193
|
layers: m
|
|
194
194
|
};
|
|
195
195
|
}
|
|
196
|
-
function E(
|
|
197
|
-
const e = "data", n = "circle-data", l =
|
|
196
|
+
function E(i, t) {
|
|
197
|
+
const e = "data", n = "circle-data", l = W(t);
|
|
198
|
+
console.log("[MapLibreGL] ensureDataSourceAndLayer called with", t.length, "rows"), console.log("[MapLibreGL] GeoJSON features:", l.features.length);
|
|
198
199
|
try {
|
|
199
|
-
const s =
|
|
200
|
-
s && typeof s.setData == "function" ? s.setData(l) :
|
|
201
|
-
} catch {
|
|
200
|
+
const s = i.getSource(e) ?? null;
|
|
201
|
+
s && typeof s.setData == "function" ? (console.log("[MapLibreGL] Updating existing source"), s.setData(l)) : (console.log("[MapLibreGL] Adding new source"), i.addSource(e, { type: "geojson", data: l }));
|
|
202
|
+
} catch (s) {
|
|
203
|
+
console.error("[MapLibreGL] Error adding/updating source:", s);
|
|
202
204
|
}
|
|
203
205
|
try {
|
|
204
|
-
const s =
|
|
205
|
-
|
|
206
|
+
const s = i.getStyle(), p = V(s, e);
|
|
207
|
+
console.log("[MapLibreGL] hasAnyLayerUsingSource:", p, "hasLayer:", !!i.getLayer(n)), !p && !i.getLayer(n) && (console.log("[MapLibreGL] Adding circle layer"), i.addLayer({
|
|
206
208
|
id: n,
|
|
207
209
|
type: "circle",
|
|
208
210
|
source: e,
|
|
@@ -213,27 +215,28 @@ function E(r, t) {
|
|
|
213
215
|
"circle-stroke-width": 2,
|
|
214
216
|
"circle-opacity": 1
|
|
215
217
|
}
|
|
216
|
-
});
|
|
217
|
-
} catch {
|
|
218
|
+
}), console.log("[MapLibreGL] Circle layer added successfully"));
|
|
219
|
+
} catch (s) {
|
|
220
|
+
console.error("[MapLibreGL] Error adding layer:", s);
|
|
218
221
|
}
|
|
219
222
|
}
|
|
220
|
-
function Q({ page:
|
|
221
|
-
const n = e.title ?? t, l = "circle-data", { ref: s, size:
|
|
223
|
+
function Q({ page: i, componentId: t, component: e }) {
|
|
224
|
+
const n = e.title ?? t, l = "circle-data", { ref: s, size: p } = I(), y = A(null), m = A([]), b = A(/* @__PURE__ */ new Map()), c = S(() => _(e.config), [e.config]), u = S(() => T(i, e.dataRef), [i, e.dataRef]), w = S(() => {
|
|
222
225
|
if (!u || u.length === 0) return null;
|
|
223
|
-
let d = 1 / 0, a = 1 / 0,
|
|
226
|
+
let d = 1 / 0, a = 1 / 0, L = -1 / 0, f = -1 / 0;
|
|
224
227
|
for (const h of u) {
|
|
225
|
-
const
|
|
226
|
-
typeof
|
|
228
|
+
const k = typeof h.longitude == "number" ? h.longitude : typeof h.lng == "number" ? h.lng : typeof h.lon == "number" ? h.lon : void 0, j = typeof h.latitude == "number" ? h.latitude : typeof h.lat == "number" ? h.lat : void 0;
|
|
229
|
+
typeof k != "number" || typeof j != "number" || !Number.isFinite(k) || !Number.isFinite(j) || (d = Math.min(d, k), a = Math.min(a, j), L = Math.max(L, k), f = Math.max(f, j));
|
|
227
230
|
}
|
|
228
|
-
return !Number.isFinite(d) || !Number.isFinite(a) || !Number.isFinite(
|
|
231
|
+
return !Number.isFinite(d) || !Number.isFinite(a) || !Number.isFinite(L) || !Number.isFinite(f) ? null : [
|
|
229
232
|
[d, a],
|
|
230
|
-
[
|
|
233
|
+
[L, f]
|
|
231
234
|
];
|
|
232
|
-
}, [u]), g =
|
|
235
|
+
}, [u]), g = S(() => {
|
|
233
236
|
if (!c.options) return;
|
|
234
237
|
const { projection: d, ...a } = c.options;
|
|
235
238
|
return a;
|
|
236
|
-
}, [c.options]), x =
|
|
239
|
+
}, [c.options]), x = S(() => {
|
|
237
240
|
const d = c.options?.projection;
|
|
238
241
|
if (typeof d == "string") return d;
|
|
239
242
|
if (d && typeof d == "object" && typeof d.name == "string") return d.name;
|
|
@@ -242,7 +245,7 @@ function Q({ page: r, componentId: t, component: e }) {
|
|
|
242
245
|
if (typeof a == "string") return a;
|
|
243
246
|
if (a && typeof a == "object" && typeof a.name == "string") return a.name;
|
|
244
247
|
if (a && typeof a == "object" && typeof a.type == "string") return a.type;
|
|
245
|
-
}, [c.options, c.style]),
|
|
248
|
+
}, [c.options, c.style]), M = typeof c.style == "string" && typeof x == "string", R = typeof c.style == "string" && Array.isArray(u) && u.length > 0, U = S(
|
|
246
249
|
() => ({
|
|
247
250
|
version: 8,
|
|
248
251
|
sources: {},
|
|
@@ -250,56 +253,56 @@ function Q({ page: r, componentId: t, component: e }) {
|
|
|
250
253
|
}),
|
|
251
254
|
[]
|
|
252
255
|
), N = (d) => {
|
|
253
|
-
if (!
|
|
254
|
-
const a = c.style,
|
|
255
|
-
if (
|
|
256
|
+
if (!M && !R) return;
|
|
257
|
+
const a = c.style, L = b.current.get(a);
|
|
258
|
+
if (L) {
|
|
256
259
|
try {
|
|
257
|
-
let
|
|
258
|
-
|
|
260
|
+
let f = L;
|
|
261
|
+
M && (f = { ...f ?? {}, projection: { type: x } }), R && e.dataRef && u && (f = H(f, u) ?? f), d.setStyle(f);
|
|
259
262
|
} catch {
|
|
260
263
|
}
|
|
261
264
|
return;
|
|
262
265
|
}
|
|
263
|
-
fetch(a).then((
|
|
264
|
-
b.current.set(a,
|
|
265
|
-
let h =
|
|
266
|
-
|
|
266
|
+
fetch(a).then((f) => f.json()).then((f) => {
|
|
267
|
+
b.current.set(a, f);
|
|
268
|
+
let h = f ?? {};
|
|
269
|
+
M && (h = { ...h, projection: { type: x } }), R && e.dataRef && u && (h = H(h, u) ?? h);
|
|
267
270
|
try {
|
|
268
271
|
d.setStyle(h);
|
|
269
272
|
} catch {
|
|
270
273
|
}
|
|
271
274
|
}).catch(() => {
|
|
272
275
|
});
|
|
273
|
-
}, z =
|
|
276
|
+
}, z = S(() => {
|
|
274
277
|
if (c.style)
|
|
275
278
|
return typeof c.style == "object" && c.style && e.dataRef && Array.isArray(u) && u.length > 0 ? H(c.style, u) ?? c.style : c.style;
|
|
276
279
|
}, [c.style, e.dataRef, u]);
|
|
277
|
-
return
|
|
280
|
+
return C(() => {
|
|
278
281
|
const d = s.current;
|
|
279
282
|
if (!d || !z) return;
|
|
280
283
|
if (!y.current) {
|
|
281
|
-
const
|
|
284
|
+
const L = {
|
|
282
285
|
container: d,
|
|
283
|
-
style: typeof z == "string" && (
|
|
286
|
+
style: typeof z == "string" && (M || R) ? U : z,
|
|
284
287
|
attributionControl: {},
|
|
285
288
|
...g ?? {}
|
|
286
|
-
},
|
|
287
|
-
N(
|
|
288
|
-
const h = () => q(
|
|
289
|
-
|
|
290
|
-
const
|
|
291
|
-
if (u && u.length > 0 && (E(
|
|
289
|
+
}, f = new P.Map(L);
|
|
290
|
+
N(f);
|
|
291
|
+
const h = () => q(f, x);
|
|
292
|
+
f.once("load", h), f.once("style.load", h), f.addControl(new P.NavigationControl({ visualizePitch: !0 }), "top-right");
|
|
293
|
+
const k = () => {
|
|
294
|
+
if (u && u.length > 0 && (E(f, u), !c.options?.center && c.options?.zoom === void 0 && w))
|
|
292
295
|
try {
|
|
293
|
-
|
|
296
|
+
f.fitBounds(w, { padding: 30, duration: 0, maxZoom: 12 });
|
|
294
297
|
} catch {
|
|
295
298
|
}
|
|
296
299
|
};
|
|
297
|
-
return
|
|
298
|
-
m.current.forEach((j) => j.remove()), m.current = [], y.current = null,
|
|
300
|
+
return f.once("style.load", k), y.current = f, () => {
|
|
301
|
+
m.current.forEach((j) => j.remove()), m.current = [], y.current = null, f.remove();
|
|
299
302
|
};
|
|
300
303
|
}
|
|
301
304
|
const a = y.current;
|
|
302
|
-
if (
|
|
305
|
+
if (M || R)
|
|
303
306
|
N(a);
|
|
304
307
|
else
|
|
305
308
|
try {
|
|
@@ -307,15 +310,15 @@ function Q({ page: r, componentId: t, component: e }) {
|
|
|
307
310
|
} catch {
|
|
308
311
|
}
|
|
309
312
|
if (x) {
|
|
310
|
-
const
|
|
311
|
-
a.once("style.load",
|
|
313
|
+
const L = () => q(a, x);
|
|
314
|
+
a.once("style.load", L), a.once("render", L);
|
|
312
315
|
}
|
|
313
316
|
if (c.options?.center && c.options?.zoom !== void 0)
|
|
314
317
|
try {
|
|
315
318
|
a.jumpTo({ center: c.options.center, zoom: c.options.zoom });
|
|
316
319
|
} catch {
|
|
317
320
|
}
|
|
318
|
-
}, [z, g, s, x, R,
|
|
321
|
+
}, [z, g, s, x, R, M, u, w, c.options?.center, c.options?.zoom]), C(() => {
|
|
319
322
|
const d = y.current;
|
|
320
323
|
if (!d || !u || u.length === 0) return;
|
|
321
324
|
const a = () => {
|
|
@@ -326,80 +329,80 @@ function Q({ page: r, componentId: t, component: e }) {
|
|
|
326
329
|
}
|
|
327
330
|
};
|
|
328
331
|
d.isStyleLoaded() ? a() : (d.once("style.load", a), d.once("load", a));
|
|
329
|
-
}, [u, w, c.options?.center, c.options?.zoom]),
|
|
332
|
+
}, [u, w, c.options?.center, c.options?.zoom]), C(() => {
|
|
330
333
|
const d = y.current;
|
|
331
|
-
d && (
|
|
332
|
-
}, [
|
|
334
|
+
d && (p.width <= 0 || p.height <= 0 || d.resize());
|
|
335
|
+
}, [p.width, p.height]), C(() => {
|
|
333
336
|
const d = y.current;
|
|
334
337
|
if (!d || !u || u.length === 0) return;
|
|
335
338
|
const a = new P.Popup({
|
|
336
339
|
closeButton: !1,
|
|
337
340
|
closeOnClick: !1
|
|
338
|
-
}),
|
|
339
|
-
if (!
|
|
340
|
-
const j =
|
|
341
|
+
}), L = (k) => {
|
|
342
|
+
if (!k.features || k.features.length === 0) return;
|
|
343
|
+
const j = k.features[0], $ = j.properties ?? {}, B = $.name ?? $.region ?? $.title ?? $.label ?? $.description;
|
|
341
344
|
if (B) {
|
|
342
345
|
d.getCanvas().style.cursor = "pointer";
|
|
343
|
-
const
|
|
344
|
-
a.setLngLat(
|
|
346
|
+
const Z = j.geometry.coordinates.slice();
|
|
347
|
+
a.setLngLat(Z).setHTML(`<div style="padding: 4px 8px; font-size: 13px;">${B}</div>`).addTo(d);
|
|
345
348
|
}
|
|
346
|
-
},
|
|
349
|
+
}, f = () => {
|
|
347
350
|
d.getCanvas().style.cursor = "", a.remove();
|
|
348
351
|
}, h = () => {
|
|
349
|
-
d.getLayer(l) ? (d.on("mouseenter", l,
|
|
352
|
+
d.getLayer(l) ? (d.on("mouseenter", l, L), d.on("mouseleave", l, f)) : d.once("styledata", h);
|
|
350
353
|
};
|
|
351
354
|
return h(), () => {
|
|
352
|
-
a.remove(), d && !d._removed && d.getLayer(l) && (d.off("mouseenter", l,
|
|
355
|
+
a.remove(), d && !d._removed && d.getLayer(l) && (d.off("mouseenter", l, L), d.off("mouseleave", l, f));
|
|
353
356
|
};
|
|
354
|
-
}, [u, l]),
|
|
357
|
+
}, [u, l]), C(() => {
|
|
355
358
|
const d = y.current;
|
|
356
359
|
d && (m.current.forEach((a) => a.remove()), m.current = [], (c.markers ?? []).forEach((a) => {
|
|
357
|
-
const
|
|
358
|
-
if (
|
|
359
|
-
const
|
|
360
|
-
|
|
360
|
+
const f = a.shape === "circle" || typeof a.radius == "number" || typeof a.color == "string" ? document.createElement("div") : null;
|
|
361
|
+
if (f) {
|
|
362
|
+
const k = typeof a.radius == "number" && Number.isFinite(a.radius) ? Math.max(2, a.radius) : 8;
|
|
363
|
+
f.style.width = `${k * 2}px`, f.style.height = `${k * 2}px`, f.style.borderRadius = "999px", f.style.background = typeof a.color == "string" ? a.color : "#2563eb", f.style.border = "2px solid #ffffff", f.style.boxShadow = "0 2px 10px rgba(0,0,0,0.25)";
|
|
361
364
|
}
|
|
362
|
-
const h = new P.Marker(
|
|
365
|
+
const h = new P.Marker(f ? { element: f } : void 0).setLngLat(a.lngLat);
|
|
363
366
|
if (a.popup || a.name) {
|
|
364
|
-
const
|
|
365
|
-
h.setPopup(new P.Popup({ offset: 20 }).setHTML(
|
|
367
|
+
const k = a.popup ?? `<div style="font-size:12px"><strong>${a.name ?? ""}</strong></div>`;
|
|
368
|
+
h.setPopup(new P.Popup({ offset: 20 }).setHTML(k));
|
|
366
369
|
}
|
|
367
370
|
h.addTo(d), m.current.push(h);
|
|
368
371
|
}));
|
|
369
372
|
}, [c.markers]), /* @__PURE__ */ v("div", { style: o.panel, children: [
|
|
370
|
-
/* @__PURE__ */
|
|
371
|
-
/* @__PURE__ */
|
|
373
|
+
/* @__PURE__ */ r("div", { style: o.panelHeader, children: /* @__PURE__ */ r("div", { style: o.panelTitle, children: n }) }),
|
|
374
|
+
/* @__PURE__ */ r("div", { style: o.panelBody, children: c.style ? /* @__PURE__ */ r("div", { ref: s, style: { width: "100%", height: "100%", minHeight: 420 } }) : /* @__PURE__ */ v("div", { style: o.muted, children: [
|
|
372
375
|
"MapLibre requires a style in component.config. Provide either:",
|
|
373
|
-
/* @__PURE__ */
|
|
376
|
+
/* @__PURE__ */ r("pre", { style: o.pre, children: JSON.stringify({ style: "https://.../style.json", options: { center: [12.5, 41.9], zoom: 4 } }, null, 2) })
|
|
374
377
|
] }) })
|
|
375
378
|
] });
|
|
376
379
|
}
|
|
377
|
-
function ee({ page:
|
|
380
|
+
function ee({ page: i, componentId: t, component: e }) {
|
|
378
381
|
const n = e.title ?? t, l = typeof e.config?.md == "string" ? e.config.md : "";
|
|
379
382
|
return l ? /* @__PURE__ */ v("div", { style: o.panel, children: [
|
|
380
|
-
/* @__PURE__ */
|
|
381
|
-
/* @__PURE__ */
|
|
383
|
+
/* @__PURE__ */ r("div", { style: o.panelHeader, children: /* @__PURE__ */ r("div", { style: o.panelTitle, children: n }) }),
|
|
384
|
+
/* @__PURE__ */ r("div", { style: { ...o.panelBody, overflow: "auto" }, children: /* @__PURE__ */ r("div", { style: {
|
|
382
385
|
padding: "8px",
|
|
383
386
|
lineHeight: "1.6",
|
|
384
387
|
fontSize: "14px"
|
|
385
|
-
}, children: /* @__PURE__ */
|
|
388
|
+
}, children: /* @__PURE__ */ r(J, { children: l }) }) })
|
|
386
389
|
] }) : /* @__PURE__ */ v("div", { style: o.panel, children: [
|
|
387
|
-
/* @__PURE__ */
|
|
388
|
-
/* @__PURE__ */
|
|
390
|
+
/* @__PURE__ */ r("div", { style: o.panelHeader, children: /* @__PURE__ */ r("div", { style: o.panelTitle, children: n }) }),
|
|
391
|
+
/* @__PURE__ */ r("div", { style: o.panelBody, children: /* @__PURE__ */ r("div", { style: o.muted, children: 'No markdown content provided. Add an "md" field to config.' }) })
|
|
389
392
|
] });
|
|
390
393
|
}
|
|
391
|
-
|
|
394
|
+
F.initialize({
|
|
392
395
|
startOnLoad: !1,
|
|
393
396
|
theme: "default",
|
|
394
397
|
securityLevel: "loose"
|
|
395
398
|
});
|
|
396
|
-
function te({ page:
|
|
397
|
-
const n = e.title ?? t, l = typeof e.config?.mermaid == "string" ? e.config.mermaid : "", s =
|
|
398
|
-
|
|
399
|
+
function te({ page: i, componentId: t, component: e }) {
|
|
400
|
+
const n = e.title ?? t, l = typeof e.config?.mermaid == "string" ? e.config.mermaid : "", s = A(null), [p, y] = G(1);
|
|
401
|
+
C(() => {
|
|
399
402
|
if (!l || !s.current) return;
|
|
400
403
|
(async () => {
|
|
401
404
|
try {
|
|
402
|
-
const w = `mermaid-${t}-${Date.now()}`, { svg: g } = await
|
|
405
|
+
const w = `mermaid-${t}-${Date.now()}`, { svg: g } = await F.render(w, l);
|
|
403
406
|
if (s.current) {
|
|
404
407
|
s.current.innerHTML = g;
|
|
405
408
|
const x = s.current.querySelector("svg");
|
|
@@ -413,9 +416,9 @@ function te({ page: r, componentId: t, component: e }) {
|
|
|
413
416
|
const m = () => y((u) => Math.min(u + 0.2, 3)), b = () => y((u) => Math.max(u - 0.2, 0.5)), c = () => y(1);
|
|
414
417
|
return l ? /* @__PURE__ */ v("div", { style: o.panel, children: [
|
|
415
418
|
/* @__PURE__ */ v("div", { style: o.panelHeader, children: [
|
|
416
|
-
/* @__PURE__ */
|
|
419
|
+
/* @__PURE__ */ r("div", { style: o.panelTitle, children: n }),
|
|
417
420
|
/* @__PURE__ */ v("div", { style: { display: "flex", gap: "4px", marginLeft: "auto" }, children: [
|
|
418
|
-
/* @__PURE__ */
|
|
421
|
+
/* @__PURE__ */ r(
|
|
419
422
|
"button",
|
|
420
423
|
{
|
|
421
424
|
onClick: b,
|
|
@@ -445,12 +448,12 @@ function te({ page: r, componentId: t, component: e }) {
|
|
|
445
448
|
},
|
|
446
449
|
title: "Reset zoom",
|
|
447
450
|
children: [
|
|
448
|
-
Math.round(
|
|
451
|
+
Math.round(p * 100),
|
|
449
452
|
"%"
|
|
450
453
|
]
|
|
451
454
|
}
|
|
452
455
|
),
|
|
453
|
-
/* @__PURE__ */
|
|
456
|
+
/* @__PURE__ */ r(
|
|
454
457
|
"button",
|
|
455
458
|
{
|
|
456
459
|
onClick: m,
|
|
@@ -468,120 +471,120 @@ function te({ page: r, componentId: t, component: e }) {
|
|
|
468
471
|
)
|
|
469
472
|
] })
|
|
470
473
|
] }),
|
|
471
|
-
/* @__PURE__ */
|
|
474
|
+
/* @__PURE__ */ r("div", { style: { ...o.panelBody, overflow: "auto", position: "relative" }, children: /* @__PURE__ */ r("div", { style: {
|
|
472
475
|
padding: "50px",
|
|
473
476
|
display: "flex",
|
|
474
477
|
justifyContent: "center",
|
|
475
478
|
alignItems: "center"
|
|
476
|
-
}, children: /* @__PURE__ */
|
|
479
|
+
}, children: /* @__PURE__ */ r(
|
|
477
480
|
"div",
|
|
478
481
|
{
|
|
479
482
|
ref: s,
|
|
480
483
|
style: {
|
|
481
|
-
transform: `scale(${
|
|
484
|
+
transform: `scale(${p})`,
|
|
482
485
|
transformOrigin: "center center",
|
|
483
486
|
transition: "transform 0.2s ease"
|
|
484
487
|
}
|
|
485
488
|
}
|
|
486
489
|
) }) })
|
|
487
490
|
] }) : /* @__PURE__ */ v("div", { style: o.panel, children: [
|
|
488
|
-
/* @__PURE__ */
|
|
489
|
-
/* @__PURE__ */
|
|
491
|
+
/* @__PURE__ */ r("div", { style: o.panelHeader, children: /* @__PURE__ */ r("div", { style: o.panelTitle, children: n }) }),
|
|
492
|
+
/* @__PURE__ */ r("div", { style: o.panelBody, children: /* @__PURE__ */ r("div", { style: o.muted, children: 'No mermaid diagram provided. Add a "mermaid" field to config.' }) })
|
|
490
493
|
] });
|
|
491
494
|
}
|
|
492
|
-
function
|
|
493
|
-
const n =
|
|
495
|
+
function re({ page: i, componentId: t, component: e }) {
|
|
496
|
+
const n = T(i, e.dataRef) ?? [], l = e.config?.columns, s = l && l.length ? l : Object.keys(n[0] ?? {}).map((p) => ({ key: p, label: p }));
|
|
494
497
|
return /* @__PURE__ */ v("div", { style: o.panel, children: [
|
|
495
|
-
/* @__PURE__ */
|
|
496
|
-
/* @__PURE__ */
|
|
497
|
-
/* @__PURE__ */
|
|
498
|
-
/* @__PURE__ */
|
|
498
|
+
/* @__PURE__ */ r("div", { style: o.panelHeader, children: /* @__PURE__ */ r("div", { style: o.panelTitle, children: e.title ?? t }) }),
|
|
499
|
+
/* @__PURE__ */ r("div", { style: o.panelBody, children: /* @__PURE__ */ r("div", { style: o.tableWrap, children: /* @__PURE__ */ v("table", { style: o.table, children: [
|
|
500
|
+
/* @__PURE__ */ r("thead", { children: /* @__PURE__ */ r("tr", { children: s.map((p) => /* @__PURE__ */ r("th", { style: o.th, children: p.label }, p.key)) }) }),
|
|
501
|
+
/* @__PURE__ */ r("tbody", { children: n.map((p, y) => /* @__PURE__ */ r("tr", { children: s.map((m) => /* @__PURE__ */ r("td", { style: o.td, children: String(p[m.key] ?? "") }, m.key)) }, y)) })
|
|
499
502
|
] }) }) })
|
|
500
503
|
] });
|
|
501
504
|
}
|
|
502
|
-
function
|
|
505
|
+
function ie({ componentId: i, component: t }) {
|
|
503
506
|
return /* @__PURE__ */ v("div", { style: o.panel, children: [
|
|
504
|
-
/* @__PURE__ */
|
|
505
|
-
/* @__PURE__ */
|
|
507
|
+
/* @__PURE__ */ r("div", { style: o.panelHeader, children: /* @__PURE__ */ r("div", { style: o.panelTitle, children: t.title ?? i }) }),
|
|
508
|
+
/* @__PURE__ */ r("div", { style: o.panelBody, children: /* @__PURE__ */ r("pre", { style: o.pre, children: JSON.stringify(t, null, 2) }) })
|
|
506
509
|
] });
|
|
507
510
|
}
|
|
508
|
-
function ne(
|
|
509
|
-
if (!
|
|
511
|
+
function ne(i) {
|
|
512
|
+
if (!i || typeof i != "object") return !1;
|
|
510
513
|
const t = (e) => {
|
|
511
514
|
if (!e || typeof e != "object") return !1;
|
|
512
515
|
const n = e.mark, l = n === "text" || n && typeof n == "object" && n.type === "text", s = !!(e.encoding?.text && typeof e.encoding.text == "object" && "value" in e.encoding.text);
|
|
513
516
|
return l && s ? !0 : Array.isArray(e.layer) ? e.layer.some(t) : e.spec ? t(e.spec) : !1;
|
|
514
517
|
};
|
|
515
|
-
return t(
|
|
518
|
+
return t(i);
|
|
516
519
|
}
|
|
517
|
-
function oe({ page:
|
|
518
|
-
const n =
|
|
520
|
+
function oe({ page: i, componentId: t, component: e }) {
|
|
521
|
+
const n = T(i, e.dataRef), { ref: l, size: s } = I(), p = e.spec ?? {}, y = p.config ?? {}, m = {
|
|
519
522
|
...y,
|
|
520
523
|
axis: { ...y.axis, grid: !1 },
|
|
521
524
|
axisX: { ...y.axisX, grid: !1 },
|
|
522
525
|
axisY: { ...y.axisY, grid: !1 },
|
|
523
526
|
view: { ...y.view, stroke: null }
|
|
524
|
-
}, b = { ...
|
|
527
|
+
}, b = { ...p, config: m }, c = s.width > 0 && s.height > 0 ? {
|
|
525
528
|
...b,
|
|
526
529
|
autosize: { type: "fit", contains: "padding" },
|
|
527
530
|
width: Math.floor(s.width),
|
|
528
531
|
height: Math.floor(s.height)
|
|
529
532
|
} : b, u = n ? { ...c, data: { values: n } } : ne(c) ? { ...c, data: { values: [{}] } } : c, w = e.title === "" ? "" : e.title ?? t;
|
|
530
533
|
return /* @__PURE__ */ v("div", { style: o.panel, children: [
|
|
531
|
-
w ? /* @__PURE__ */
|
|
532
|
-
/* @__PURE__ */
|
|
534
|
+
w ? /* @__PURE__ */ r("div", { style: o.panelHeader, children: /* @__PURE__ */ r("div", { style: o.panelTitle, children: w }) }) : null,
|
|
535
|
+
/* @__PURE__ */ r("div", { style: o.panelBody, children: /* @__PURE__ */ r("div", { ref: l, style: { width: "100%", height: "100%" }, children: /* @__PURE__ */ r(K, { spec: u, actions: !1 }) }) })
|
|
533
536
|
] });
|
|
534
537
|
}
|
|
535
|
-
function O({ page:
|
|
538
|
+
function O({ page: i, componentId: t, component: e }) {
|
|
536
539
|
switch (e.type) {
|
|
537
540
|
case "vegalite5":
|
|
538
|
-
return /* @__PURE__ */
|
|
541
|
+
return /* @__PURE__ */ r(oe, { page: i, componentId: t, component: e });
|
|
539
542
|
case "table":
|
|
540
|
-
return /* @__PURE__ */
|
|
543
|
+
return /* @__PURE__ */ r(re, { page: i, componentId: t, component: e });
|
|
541
544
|
case "form":
|
|
542
|
-
return /* @__PURE__ */
|
|
545
|
+
return /* @__PURE__ */ r(X, { page: i, componentId: t, component: e });
|
|
543
546
|
case "list":
|
|
544
|
-
return /* @__PURE__ */
|
|
547
|
+
return /* @__PURE__ */ r(Y, { page: i, componentId: t, component: e });
|
|
545
548
|
case "map":
|
|
546
|
-
return /* @__PURE__ */
|
|
549
|
+
return /* @__PURE__ */ r(Q, { page: i, componentId: t, component: e });
|
|
547
550
|
case "markdown":
|
|
548
|
-
return /* @__PURE__ */
|
|
551
|
+
return /* @__PURE__ */ r(ee, { page: i, componentId: t, component: e });
|
|
549
552
|
case "mermaid":
|
|
550
|
-
return /* @__PURE__ */
|
|
553
|
+
return /* @__PURE__ */ r(te, { page: i, componentId: t, component: e });
|
|
551
554
|
default:
|
|
552
|
-
return /* @__PURE__ */
|
|
555
|
+
return /* @__PURE__ */ r(ie, { page: i, componentId: t, component: e });
|
|
553
556
|
}
|
|
554
557
|
}
|
|
555
|
-
function D(
|
|
556
|
-
return Math.min(e, Math.max(t,
|
|
558
|
+
function D(i, t, e) {
|
|
559
|
+
return Math.min(e, Math.max(t, i));
|
|
557
560
|
}
|
|
558
|
-
function se(
|
|
559
|
-
const t =
|
|
561
|
+
function se(i) {
|
|
562
|
+
const t = i.reduce((n, l) => Math.max(n, l.y + l.h), 0), e = i.reduce((n, l) => Math.max(n, l.x + l.w), 0);
|
|
560
563
|
return { maxBottom: t, maxRight: e };
|
|
561
564
|
}
|
|
562
|
-
function we({ page:
|
|
563
|
-
const { ref: t, size: e } = I(), n =
|
|
564
|
-
return /* @__PURE__ */
|
|
565
|
+
function we({ page: i }) {
|
|
566
|
+
const { ref: t, size: e } = I(), n = i.layout.cols ?? 24, l = i.layout.rowHeight ?? 30, s = i.layout.margin?.[0] ?? 10, p = i.layout.margin?.[1] ?? 10, y = i.layout.containerPadding?.[0] ?? 0, m = i.layout.containerPadding?.[1] ?? 0, { maxBottom: b } = se(i.layout.items), c = b * l + Math.max(0, b - 1) * p + m * 2, u = e.width > 0 ? e.width < 768 : !1, w = [...i.layout.items].sort((g, x) => g.y - x.y || g.x - x.x);
|
|
567
|
+
return /* @__PURE__ */ r("div", { ref: t, children: u ? /* @__PURE__ */ r(
|
|
565
568
|
"div",
|
|
566
569
|
{
|
|
567
570
|
style: {
|
|
568
571
|
display: "flex",
|
|
569
572
|
flexDirection: "column",
|
|
570
|
-
gap:
|
|
573
|
+
gap: p,
|
|
571
574
|
padding: `${m}px ${y}px`
|
|
572
575
|
},
|
|
573
576
|
children: w.map((g) => {
|
|
574
|
-
const x =
|
|
575
|
-
return /* @__PURE__ */
|
|
576
|
-
/* @__PURE__ */
|
|
577
|
-
/* @__PURE__ */
|
|
577
|
+
const x = i.components[g.i], M = g.h * l + Math.max(0, g.h - 1) * p;
|
|
578
|
+
return /* @__PURE__ */ r("div", { style: { width: "100%", height: M }, children: x ? /* @__PURE__ */ r(O, { page: i, componentId: g.i, component: x }) : /* @__PURE__ */ v("div", { style: o.panel, children: [
|
|
579
|
+
/* @__PURE__ */ r("div", { style: o.panelHeader, children: /* @__PURE__ */ r("div", { style: o.panelTitle, children: g.i }) }),
|
|
580
|
+
/* @__PURE__ */ r("div", { style: o.panelBody, children: /* @__PURE__ */ v("div", { style: o.error, children: [
|
|
578
581
|
"No entry in components for id: ",
|
|
579
582
|
g.i
|
|
580
583
|
] }) })
|
|
581
584
|
] }) }, g.i);
|
|
582
585
|
})
|
|
583
586
|
}
|
|
584
|
-
) : /* @__PURE__ */
|
|
587
|
+
) : /* @__PURE__ */ r(
|
|
585
588
|
"div",
|
|
586
589
|
{
|
|
587
590
|
style: {
|
|
@@ -589,12 +592,12 @@ function we({ page: r }) {
|
|
|
589
592
|
padding: `${m}px ${y}px`,
|
|
590
593
|
gridTemplateColumns: `repeat(${n}, minmax(0, 1fr))`,
|
|
591
594
|
gridAutoRows: `${l}px`,
|
|
592
|
-
gap: `${
|
|
595
|
+
gap: `${p}px ${s}px`,
|
|
593
596
|
minHeight: c
|
|
594
597
|
},
|
|
595
|
-
children:
|
|
596
|
-
const x =
|
|
597
|
-
return /* @__PURE__ */
|
|
598
|
+
children: i.layout.items.map((g) => {
|
|
599
|
+
const x = i.components[g.i];
|
|
600
|
+
return /* @__PURE__ */ r(
|
|
598
601
|
"div",
|
|
599
602
|
{
|
|
600
603
|
style: {
|
|
@@ -603,9 +606,9 @@ function we({ page: r }) {
|
|
|
603
606
|
gridRowStart: Math.max(1, g.y + 1),
|
|
604
607
|
gridRowEnd: `span ${Math.max(1, g.h)}`
|
|
605
608
|
},
|
|
606
|
-
children: x ? /* @__PURE__ */
|
|
607
|
-
/* @__PURE__ */
|
|
608
|
-
/* @__PURE__ */
|
|
609
|
+
children: x ? /* @__PURE__ */ r(O, { page: i, componentId: g.i, component: x }) : /* @__PURE__ */ v("div", { style: o.panel, children: [
|
|
610
|
+
/* @__PURE__ */ r("div", { style: o.panelHeader, children: /* @__PURE__ */ r("div", { style: o.panelTitle, children: g.i }) }),
|
|
611
|
+
/* @__PURE__ */ r("div", { style: o.panelBody, children: /* @__PURE__ */ v("div", { style: o.error, children: [
|
|
609
612
|
"No entry in components for id: ",
|
|
610
613
|
g.i
|
|
611
614
|
] }) })
|
|
@@ -617,7 +620,7 @@ function we({ page: r }) {
|
|
|
617
620
|
}
|
|
618
621
|
) });
|
|
619
622
|
}
|
|
620
|
-
const le = "https://json-schema.org/draft/2020-12/schema", ae = "https://example.com/ai-canvas/page.schema.json", de = "AI Canvas Page", ce = "object", pe = !1, fe = ["layout", "components", "data"], ye = { meta: { $ref: "#/$defs/Meta" }, layout: { $ref: "#/$defs/Layout" }, components: { $ref: "#/$defs/Components" }, data: { $ref: "#/$defs/Data" } }, ue = { Meta: { type: "object", additionalProperties: !1, properties: { title: { type: "string", minLength: 1 }, description: { type: "string" }, version: { type: "string" } } }, Layout: { type: "object", additionalProperties: !1, required: ["engine", "items"], properties: { engine: { type: "string", enum: ["rgl"] }, cols: { type: "integer", minimum: 1, default: 24 }, rowHeight: { type: "integer", minimum: 1, default: 30 }, margin: { type: "array", items: { type: "integer", minimum: 0 }, minItems: 2, maxItems: 2, default: [10, 10] }, containerPadding: { type: "array", items: { type: "integer", minimum: 0 }, minItems: 2, maxItems: 2, default: [0, 0] }, items: { type: "array", minItems: 1, items: { $ref: "#/$defs/RglItem" } } } }, RglItem: { type: "object", additionalProperties: !1, required: ["i", "x", "y", "w", "h"], properties: { i: { type: "string", minLength: 1 }, x: { type: "integer", minimum: 0 }, y: { type: "integer", minimum: 0 }, w: { type: "integer", minimum: 1 }, h: { type: "integer", minimum: 1 }, static: { type: "boolean", default: !1 } } }, Components: { type: "object", description: "Map of componentId -> component config. Keys should match layout.items[*].i.", additionalProperties: { $ref: "#/$defs/Component" } }, Component: { type: "object", additionalProperties: !1, required: ["type"], properties: { type: { type: "string", enum: ["vegalite5", "map", "list", "form", "table", "markdown", "mermaid"] }, title: { type: "string" }, dataRef: { type: "string", minLength: 1 }, config: { type: "object", description: "Component-specific configuration (non-Vega-Lite components). Keep flexible for now.", additionalProperties: !0, default: {} }, spec: { type: "object", description: "Vega-Lite spec (only for type=vegalite5).", additionalProperties: !0 } }, allOf: [{ if: { properties: { type: { const: "vegalite5" } }, required: ["type"] }, then: { required: ["spec"] }, else: { properties: { spec: !1 } } }, { if: { properties: { type: { const: "map" } }, required: ["type"] }, then: { properties: { config: { type: "object", additionalProperties: !0, description: "MapLibre GL JS configuration. Provide either a MapLibre Style Specification object (Mapbox style spec v8) directly, or an object like { style: <style-spec-or-url>, options: <map options> }." } } } }, { if: { properties: { type: { const: "table" } }, required: ["type"] }, then: { properties: { config: { type: "object", additionalProperties: !0, required: ["columns"], properties: { columns: { type: "array", minItems: 1, items: { $ref: "#/$defs/Column" } } } } } } }, { if: { properties: { type: { const: "form" } }, required: ["type"] }, then: { properties: { config: { type: "object", additionalProperties: !0, required: ["columns"], properties: { columns: { type: "array", minItems: 1, items: { $ref: "#/$defs/Column" } } } } } } }, { if: { properties: { type: { const: "list" } }, required: ["type"] }, then: { properties: { config: { type: "object", additionalProperties: !0 } } } }, { if: { properties: { type: { const: "markdown" } }, required: ["type"] }, then: { properties: { config: { type: "object", additionalProperties: !0, required: ["md"], properties: { md: { type: "string", minLength: 1, description: "Markdown content to render" } } } } } }, { if: { properties: { type: { const: "mermaid" } }, required: ["type"] }, then: { properties: { config: { type: "object", additionalProperties: !0, required: ["mermaid"], properties: { mermaid: { type: "string", minLength: 1, description: "Mermaid diagram definition" } } } } } }] }, Column: { type: "object", additionalProperties: !1, required: ["key", "label"], properties: { key: { type: "string", minLength: 1 }, label: { type: "string", minLength: 1 } } }, Data: { type: "object", description: "Map of datasetName -> inline dataset.", additionalProperties: { $ref: "#/$defs/InlineDataset" } }, InlineDataset: { type: "object", additionalProperties: !1, required: ["source", "rows"], properties: { source: { type: "string", enum: ["inline"] }, rows: { type: "array", items: { type: "object", additionalProperties: !0 } } } } },
|
|
623
|
+
const le = "https://json-schema.org/draft/2020-12/schema", ae = "https://example.com/ai-canvas/page.schema.json", de = "AI Canvas Page", ce = "object", pe = !1, fe = ["layout", "components", "data"], ye = { meta: { $ref: "#/$defs/Meta" }, layout: { $ref: "#/$defs/Layout" }, components: { $ref: "#/$defs/Components" }, data: { $ref: "#/$defs/Data" } }, ue = { Meta: { type: "object", additionalProperties: !1, properties: { title: { type: "string", minLength: 1 }, description: { type: "string" }, version: { type: "string" } } }, Layout: { type: "object", additionalProperties: !1, required: ["engine", "items"], properties: { engine: { type: "string", enum: ["rgl"] }, cols: { type: "integer", minimum: 1, default: 24 }, rowHeight: { type: "integer", minimum: 1, default: 30 }, margin: { type: "array", items: { type: "integer", minimum: 0 }, minItems: 2, maxItems: 2, default: [10, 10] }, containerPadding: { type: "array", items: { type: "integer", minimum: 0 }, minItems: 2, maxItems: 2, default: [0, 0] }, items: { type: "array", minItems: 1, items: { $ref: "#/$defs/RglItem" } } } }, RglItem: { type: "object", additionalProperties: !1, required: ["i", "x", "y", "w", "h"], properties: { i: { type: "string", minLength: 1 }, x: { type: "integer", minimum: 0 }, y: { type: "integer", minimum: 0 }, w: { type: "integer", minimum: 1 }, h: { type: "integer", minimum: 1 }, static: { type: "boolean", default: !1 } } }, Components: { type: "object", description: "Map of componentId -> component config. Keys should match layout.items[*].i.", additionalProperties: { $ref: "#/$defs/Component" } }, Component: { type: "object", additionalProperties: !1, required: ["type"], properties: { type: { type: "string", enum: ["vegalite5", "map", "list", "form", "table", "markdown", "mermaid"] }, title: { type: "string" }, dataRef: { type: "string", minLength: 1 }, config: { type: "object", description: "Component-specific configuration (non-Vega-Lite components). Keep flexible for now.", additionalProperties: !0, default: {} }, spec: { type: "object", description: "Vega-Lite spec (only for type=vegalite5).", additionalProperties: !0 } }, allOf: [{ if: { properties: { type: { const: "vegalite5" } }, required: ["type"] }, then: { required: ["spec"] }, else: { properties: { spec: !1 } } }, { if: { properties: { type: { const: "map" } }, required: ["type"] }, then: { properties: { config: { type: "object", additionalProperties: !0, description: "MapLibre GL JS configuration. Provide either a MapLibre Style Specification object (Mapbox style spec v8) directly, or an object like { style: <style-spec-or-url>, options: <map options> }." } } } }, { if: { properties: { type: { const: "table" } }, required: ["type"] }, then: { properties: { config: { type: "object", additionalProperties: !0, required: ["columns"], properties: { columns: { type: "array", minItems: 1, items: { $ref: "#/$defs/Column" } } } } } } }, { if: { properties: { type: { const: "form" } }, required: ["type"] }, then: { properties: { config: { type: "object", additionalProperties: !0, required: ["columns"], properties: { columns: { type: "array", minItems: 1, items: { $ref: "#/$defs/Column" } } } } } } }, { if: { properties: { type: { const: "list" } }, required: ["type"] }, then: { properties: { config: { type: "object", additionalProperties: !0 } } } }, { if: { properties: { type: { const: "markdown" } }, required: ["type"] }, then: { properties: { config: { type: "object", additionalProperties: !0, required: ["md"], properties: { md: { type: "string", minLength: 1, description: "Markdown content to render" } } } } } }, { if: { properties: { type: { const: "mermaid" } }, required: ["type"] }, then: { properties: { config: { type: "object", additionalProperties: !0, required: ["mermaid"], properties: { mermaid: { type: "string", minLength: 1, description: "Mermaid diagram definition" } } } } } }] }, Column: { type: "object", additionalProperties: !1, required: ["key", "label"], properties: { key: { type: "string", minLength: 1 }, label: { type: "string", minLength: 1 } } }, Data: { type: "object", description: "Map of datasetName -> inline dataset.", additionalProperties: { $ref: "#/$defs/InlineDataset" } }, InlineDataset: { type: "object", additionalProperties: !1, required: ["source", "rows"], properties: { source: { type: "string", enum: ["inline"] }, rows: { type: "array", items: { type: "object", additionalProperties: !0 } } } } }, Le = {
|
|
621
624
|
$schema: le,
|
|
622
625
|
$id: ae,
|
|
623
626
|
title: de,
|
|
@@ -627,8 +630,8 @@ const le = "https://json-schema.org/draft/2020-12/schema", ae = "https://example
|
|
|
627
630
|
properties: ye,
|
|
628
631
|
$defs: ue
|
|
629
632
|
};
|
|
630
|
-
function
|
|
631
|
-
const t = JSON.parse(JSON.stringify(
|
|
633
|
+
function ke(i) {
|
|
634
|
+
const t = JSON.parse(JSON.stringify(i));
|
|
632
635
|
t && typeof t == "object" && delete t.$id;
|
|
633
636
|
try {
|
|
634
637
|
const n = t?.$defs?.Layout?.properties?.items;
|
|
@@ -649,7 +652,7 @@ function Le(r) {
|
|
|
649
652
|
}
|
|
650
653
|
export {
|
|
651
654
|
we as CanvasRenderer,
|
|
652
|
-
|
|
653
|
-
|
|
655
|
+
Le as PAGE_SCHEMA,
|
|
656
|
+
ke as schemaWithoutRemoteVegaLiteRef,
|
|
654
657
|
o as styles
|
|
655
658
|
};
|