@preschen/gen-vis 0.3.0 → 0.5.0

package/dist/gen-vis.js

@@ -0,0 +1,1127 @@
+(() => { const s = document.createElement("style"); s.textContent = ".hover[data-v-364032d4]{font-size:13px;position:absolute;top:0}.hover .title[data-v-364032d4]{text-align:center;border-bottom:2px solid #000;padding:1px 3px;font-weight:700}.hover[data-v-364032d4]{background-color:#fffc;top:40%}.hover[data-v-364032d4] table{border-collapse:collapse}.hover[data-v-364032d4] table tr.nearest{font-weight:700}.hover[data-v-364032d4] table tr td{text-align:left;padding:1px 5px}.hover[data-v-364032d4] table tr td.value,.hover[data-v-364032d4] table tr td.y{text-align:right}.hover[data-v-364032d4] table tr td:first-child{border-left:0}.hover[data-v-364032d4] table{margin-left:auto;margin-right:auto}.hover[data-v-364032d4]{pointer-events:none}.vis-inner[data-v-1f05a06e]{display:inline-block;position:relative}.vis-inner .debug[data-v-1f05a06e]{font-size:12px}.vis-inner[data-v-1f05a06e] svg g.axis-position-top g.tick line{transform:translateY(5px)}.vis-inner[data-v-1f05a06e] svg g.axis-position-right g.tick line{transform:translate(-4px)}.vis-inner[data-v-1f05a06e] svg g.axis-position-bottom g.tick line{transform:translateY(-4px)}.vis-inner[data-v-1f05a06e] svg g.axis-position-left g.tick line{transform:translate(5px)}.vis-inner[data-v-1f05a06e] svg g.tick text,.vis-inner[data-v-1f05a06e] svg .axis-title{font-size:13px}.vis-inner[data-v-1f05a06e] svg g.group[data-visible=false],.vis-inner[data-v-1f05a06e] svg path[data-visible=false]{opacity:.01}.vis-inner[data-v-1f05a06e] svg g.grid{stroke:#ccc;stroke-width:.75px}.vis-inner[data-v-1f05a06e] svg g.hoverMarker line{stroke-width:.75px;stroke:#aaa}svg[data-v-ce0e972e]{margin-right:5px;display:inline-block}.legend .title[data-v-1bc8d55f]{margin:3px;font-size:13px;font-weight:700;position:relative}.legend .entries>div[data-v-1bc8d55f]{cursor:pointer;margin:0 5px;display:inline-block}.legend .entries>div[data-visible=false][data-v-1bc8d55f]{opacity:.3}.legend .entries>div span[data-v-1bc8d55f]{font-size:13px;display:inline-block;position:relative;top:-4px}.legend .entries>div.bold[data-v-1bc8d55f]{font-weight:700}.formElement[data-v-b7f59ae7]{margin:6px 4px;font-size:13px}.formElement .title[data-v-b7f59ae7]{margin-right:5px;font-weight:700;display:inline-block}.formElement .entries[data-v-b7f59ae7]{display:inline-block}.formElement .entries>div[data-v-b7f59ae7]{margin-right:5px;display:inline-block}.formElement .entries>div input[data-v-b7f59ae7]{display:inline-block;position:relative;top:1px}.vis[data-v-f8fa11d2] text,.vis[data-v-f8fa11d2] span,.vis[data-v-f8fa11d2] div{font-family:var(--gen-vis-font-family,Century Gothic, sans-serif)}.vis-header .title[data-v-f8fa11d2]{font-size:22px;font-weight:700}.vis-header .subtitle[data-v-f8fa11d2]{margin-top:3px;font-size:13px}.vis-header[data-v-f8fa11d2]{margin-bottom:10px}.vis-footer span[data-v-f8fa11d2]{font-size:13px}.facet-title[data-v-f8fa11d2]{margin-top:8px;font-size:13px;font-weight:700}.vis-error[data-v-a9d47434]{color:#b00;font-size:13px}\n/*$vite$:1*/"; document.head.appendChild(s); })();
+import { Fragment as e, createApp as t, createBlock as n, createCommentVNode as r, createElementBlock as i, createElementVNode as a, markRaw as o, mergeProps as s, normalizeStyle as c, openBlock as l, reactive as u, renderList as d, resolveComponent as f, toDisplayString as p, toRaw as m } from "vue";
+import * as h from "d3";
+import g from "deepmerge";
+//#region src/utils/data.js
+var _ = (e) => typeof e == "string" ? (e = e.replace(/^/, ""), /^\s*\[/.test(e) ? JSON.parse(e) : h.csvParse(e)) : e, v = (e) => e == null || e === "", ee = {
+	numeric: (e) => {
+		let t = v(e) ? NaN : +e;
+		return isNaN(t) ? null : t;
+	},
+	date: (e) => {
+		let t = v(e) ? NaN : typeof e == "number" ? e : Date.parse(e);
+		return isNaN(t) ? null : t;
+	}
+}, te = (e, t) => {
+	let n = Object.keys(t.mapping).map((e) => ({
+		name: e,
+		column: t.mapping[e].column,
+		convert: ee[t.mapping[e].type] ?? ((e) => e)
+	}));
+	return e.map((e) => {
+		let t = {};
+		return n.forEach((n) => {
+			t[n.name] = n.convert(e[n.column]);
+		}), t;
+	});
+}, ne = (e, t) => {
+	e.values = [...new Set(t.map((t) => t[e.dim]))], (e.mapping.type == "numeric" || e.mapping.type == "date") && (e.values = e.values.filter((e) => e !== null).sort((e, t) => e - t), e.extent = e.mapping.stacked ? h.extent(t.map((t) => t[`${e.dim}:st:e`])) : h.extent(e.values));
+}, re = (e, t, n = []) => {
+	b(e, [...n, t.h]).forEach((e) => {
+		let n = 0, r = 0;
+		e.entries.forEach((e) => {
+			let i = e[t.v];
+			i >= 0 ? (e[`${t.v}:st:s`] = n, n += i, e[`${t.v}:st:e`] = n) : (e[`${t.v}:st:s`] = r, r += i, e[`${t.v}:st:e`] = r);
+		});
+	});
+}, y = (e, t) => {
+	e.forEach((e) => {
+		Object.values(t).forEach((t) => {
+			e[`${t.dim}:scaled`] = t.scale(e[t.dim]), e[`${t.dim}:scaled:min`] = t.scale(t.domain[0]), e[`${t.dim}:scaled:0`] = t.scale(0), e[`${t.dim}:scaled:max`] = t.scale(t.domain[1]), t.mapping.stacked && (e[`${t.dim}:st:e:scaled`] = t.scale(e[`${t.dim}:st:e`]), e[`${t.dim}:st:s:scaled`] = t.scale(e[`${t.dim}:st:s`]), e[`${t.dim}:st:h:scaled`] = e[`${t.dim}:st:s:scaled`] - e[`${t.dim}:st:e:scaled`]);
+		});
+	});
+}, b = (e, t) => {
+	let n = /* @__PURE__ */ new Map();
+	return e.forEach((e) => {
+		let r = JSON.stringify(t.map((t) => e[t]));
+		n.has(r) || n.set(r, {
+			group: Object.fromEntries(t.map((t) => [t, e[t]])),
+			entries: []
+		}), n.get(r).entries.push(e);
+	}), [...n.values()];
+}, x = (e, t) => t.length == 0 ? [...e] : e.filter((e) => t.reduce((t, n) => Array.isArray(n.key) ? t && n.key.includes(e[n.dim]) : typeof n.key == "function" ? t && n.key(e[n.dim]) : t && e[n.dim] == n.key, !0)), ie = (e, t, n) => t, S = (e) => g.all(e, { arrayMerge: ie }), C = (e, t) => e == t || JSON.stringify(e) == JSON.stringify(t), w = (e, t) => Object.fromEntries(Object.entries(e).map(([e, n], r) => [e, t(n, e)])), T = (e, t) => Array.isArray(e) ? e.map(t) : w(e, t), ae = (e, t, n, r) => e.map((e) => ({
+	group: Object.keys(e.group).map((t) => ({
+		dim: t,
+		key: e.group[t]
+	})),
+	props: t._fill(Object.assign({}, n, ...Object.keys(e.group).map((t) => r[t].props[e.group[t]]))),
+	values: e.entries
+})), oe = (e, t, n = !0, r = !1) => {
+	if (e.value === void 0 || e.value === null || r) {
+		if (e.prop == "ref") {
+			let n = t[e.ref];
+			n !== void 0 && (e.value = n);
+		}
+		if (e.prop == "relative") {
+			let n = t[e.ref];
+			n !== void 0 && (e.value = e.ratio * n);
+		}
+		if (e.prop == "steps") {
+			let n = t[e.ref];
+			n !== void 0 && e.steps.forEach((t) => {
+				n > t.cut && (e.value = t.value);
+			});
+		}
+	}
+	return n ? e.value : e;
+}, E = (e, t) => oe({ ...j(e) }, t, !0), D = (e, t, n = !0) => O(T(e, j), t, n), O = (e, t, n = !1) => T(e, (e) => oe({ ...e }, t, n)), k = (e) => e.prop !== void 0, A = (e) => Object.values(e).flatMap((e) => typeof e != "object" || !e ? [] : k(e) ? typeof e.ref == "string" ? [e.ref.split(":")[0]] : [] : A(e)), j = (e) => {
+	if (typeof e == "object" && !Array.isArray(e) && e !== null) return k(e) ? e : w(e, j);
+	if (typeof e == "string" && e.charAt() == "@") {
+		let t = e.substring(1);
+		return {
+			prop: "ref",
+			ref: t,
+			parts: t.split(":")
+		};
+	}
+	return {
+		prop: "fixed",
+		value: e
+	};
+}, M = (e) => {
+	if (e.props) {
+		let t = e.props;
+		e.props = Object.fromEntries(Object.keys(t.manual).map((e) => {
+			let n = Object.assign({}, t.common, t.manual[e]);
+			return n.name ??= e, n.visible ??= !0, [e, n];
+		}));
+	}
+	return e.scale && (e.scale.type ??= "linear", e.scale.domain ??= [null, null], e.scale.domainAbs || (e.scale.domainRel ??= e.scale.domain.map((e, t) => e === null ? (t == 0 ? -1 : 1) * .02 : 0)), e.scale.domainAbs ??= [0, 0], Array.isArray(e.scale.range) || (e.scale.orientation == "horizontal" ? e.scale.range = [0, "@width"] : e.scale.orientation == "vertical" && (e.scale.range = ["@height", 0]))), e.axis && (e.axis.padding ??= 3), e.hover !== void 0 && e.axis !== void 0 && (e.hover.format ??= e.axis.format), e.legend && (e.legend.props === void 0 && (e.legend.props = {}), "name" in e.legend.props || (e.legend.props.name = "@name")), e.hover && (e.hover.props === void 0 && (e.hover.props = {}), "name" in e.hover.props || (e.hover.props.name = "@name")), e;
+}, se = (e) => (Object.values(e.mapping).forEach(M), Array.isArray(e.plot) || (e.plot = [e.plot]), e.facets && Array.isArray(e.facets.dim) && (e.facets.dim = e.facets.dim[0]), e.plot.forEach((e, t) => {
+	e.categories ??= [], e.id ??= `plot-${t}`, e.highlightProps = Object.keys(e.props).filter((e) => e.startsWith("highlight-")).map((e) => e.substring(10));
+}), e.plot.forEach((e) => {
+	e.props = w(e.props, j), e._fill = (t) => O(e.props, t);
+}), e), N = (e, t) => {
+	let n = e.formElements ?? [], r = new Set(n.flatMap((e) => e.values.flatMap((e) => Object.keys(e.mapping ?? {}))));
+	if (r.size == 0) return !1;
+	let i = n.map((t) => t.values.find((n) => C(n.value, e.globals?.[t.ref]))).filter((e) => e && e.mapping);
+	return r.forEach((n) => {
+		let r = i.filter((e) => e.mapping[n]).map((e) => e.mapping[n]), a = M(S([t.mapping[n] ?? {}, ...r]));
+		e.mapping[n] && "props" in e.mapping[n] && (a.props = e.mapping[n].props), e.mapping[n] = a;
+	}), !0;
+}, P = (e) => e.charAt(0).toUpperCase() + e.slice(1), F = {
+	de: {
+		number: {
+			decimal: ",",
+			thousands: ".",
+			grouping: [3],
+			currency: ["", " €"]
+		},
+		time: {
+			dateTime: "%A, der %e. %B %Y, %X",
+			date: "%d.%m.%Y",
+			time: "%H:%M:%S",
+			periods: ["AM", "PM"],
+			days: [
+				"Sonntag",
+				"Montag",
+				"Dienstag",
+				"Mittwoch",
+				"Donnerstag",
+				"Freitag",
+				"Samstag"
+			],
+			shortDays: [
+				"So",
+				"Mo",
+				"Di",
+				"Mi",
+				"Do",
+				"Fr",
+				"Sa"
+			],
+			months: [
+				"Januar",
+				"Februar",
+				"März",
+				"April",
+				"Mai",
+				"Juni",
+				"Juli",
+				"August",
+				"September",
+				"Oktober",
+				"November",
+				"Dezember"
+			],
+			shortMonths: [
+				"Jan",
+				"Feb",
+				"Mrz",
+				"Apr",
+				"Mai",
+				"Jun",
+				"Jul",
+				"Aug",
+				"Sep",
+				"Okt",
+				"Nov",
+				"Dez"
+			]
+		},
+		timeTicks: {
+			millisecond: ".%L",
+			second: ":%S",
+			minute: "%H:%M",
+			hour: "%H:%M",
+			day: "%a %d",
+			week: "%d. %b",
+			month: "%B",
+			year: "%Y"
+		}
+	},
+	en: {
+		number: {
+			decimal: ".",
+			thousands: ",",
+			grouping: [3],
+			currency: ["$", ""]
+		},
+		time: {
+			dateTime: "%x, %X",
+			date: "%-m/%-d/%Y",
+			time: "%-I:%M:%S %p",
+			periods: ["AM", "PM"],
+			days: [
+				"Sunday",
+				"Monday",
+				"Tuesday",
+				"Wednesday",
+				"Thursday",
+				"Friday",
+				"Saturday"
+			],
+			shortDays: [
+				"Sun",
+				"Mon",
+				"Tue",
+				"Wed",
+				"Thu",
+				"Fri",
+				"Sat"
+			],
+			months: [
+				"January",
+				"February",
+				"March",
+				"April",
+				"May",
+				"June",
+				"July",
+				"August",
+				"September",
+				"October",
+				"November",
+				"December"
+			],
+			shortMonths: [
+				"Jan",
+				"Feb",
+				"Mar",
+				"Apr",
+				"May",
+				"Jun",
+				"Jul",
+				"Aug",
+				"Sep",
+				"Oct",
+				"Nov",
+				"Dec"
+			]
+		},
+		timeTicks: {
+			millisecond: ".%L",
+			second: ":%S",
+			minute: "%I:%M",
+			hour: "%I %p",
+			day: "%a %d",
+			week: "%b %d",
+			month: "%B",
+			year: "%Y"
+		}
+	}
+}, ce = Object.keys(F), I = {
+	time: [
+		h.timeSecond,
+		h.timeMinute,
+		h.timeHour,
+		h.timeDay,
+		h.timeWeek,
+		h.timeMonth,
+		h.timeYear
+	],
+	utc: [
+		h.utcSecond,
+		h.utcMinute,
+		h.utcHour,
+		h.utcDay,
+		h.utcWeek,
+		h.utcMonth,
+		h.utcYear
+	]
+}, L = (e, t, n) => {
+	let r = Object.fromEntries(Object.entries(t).map(([t, n]) => [t, e(n)])), [i, a, o, s, c, l, u] = n;
+	return (e) => (i(e) < e ? r.millisecond : a(e) < e ? r.second : o(e) < e ? r.minute : s(e) < e ? r.hour : l(e) < e ? c(e) < e ? r.day : r.week : u(e) < e ? r.month : r.year)(e);
+}, le = (e = "de") => {
+	let t = typeof e == "string" ? { base: e } : e, n = F[t.base ?? "de"];
+	if (!n) throw Error(`Unknown locale '${t.base}', expected one of ${ce.map((e) => `'${e}'`).join(", ")}`);
+	let r = h.formatLocale({
+		...n.number,
+		...t.number
+	}), i = h.timeFormatLocale({
+		...n.time,
+		...t.time
+	}), a = {
+		...n.timeTicks,
+		...t.timeTicks
+	};
+	return {
+		number: r,
+		time: i,
+		tickFormat(e, t, n = 10) {
+			if ([
+				"linear",
+				"pow",
+				"sqrt"
+			].includes(t)) {
+				let [t, i] = e.domain(), a = h.precisionFixed(h.tickStep(t, i, n));
+				return r.format(`,.${Number.isFinite(a) ? a : 0}f`);
+			}
+			return t == "time" ? L(i.format, a, I.time) : t == "utc" ? L(i.utcFormat, a, I.utc) : null;
+		}
+	};
+}, R = [
+	"svg:path",
+	"svg:circle",
+	"svg:line",
+	"svg:rect",
+	"svg:text",
+	"base:area",
+	"bar",
+	"stackedBar"
+], z = [
+	"numeric",
+	"date",
+	"categorical"
+], B = ["horizontal", "vertical"], V = [
+	"top",
+	"bottom",
+	"left",
+	"right"
+], H = [
+	"fixed",
+	"ref",
+	"relative",
+	"steps"
+], U = (e) => e.map((e) => `'${e}'`).join(", "), W = (e, t, n) => {
+	if (typeof e != "object" || !e || Array.isArray(e)) return;
+	if ("prop" in e) {
+		H.includes(e.prop) ? e.prop != "fixed" && typeof e.ref != "string" && n(t, `a '${e.prop}' prop needs a 'ref'`) : n(t, `unknown prop '${e.prop}', expected one of ${U(H)}`);
+		return;
+	}
+	let r = [
+		"ratio",
+		"steps",
+		"ref",
+		"mode"
+	].filter((t) => t in e);
+	if (r.length > 0) return n(t, `has ${U(r)} but no 'prop', so it is not evaluated`);
+	Object.entries(e).forEach(([e, r]) => W(r, `${t}.${e}`, n));
+}, ue = (e) => {
+	let t = [], n = (e, n) => t.push(`${e}: ${n}`), r = e.mapping ?? {};
+	e.mapping || n("mapping", "missing"), Object.entries(r).forEach(([e, t]) => {
+		let r = `mapping.${e}`;
+		if (typeof t.column != "string" && n(r, "no 'column'"), t.type !== void 0 && !z.includes(t.type) && n(`${r}.type`, `unknown type '${t.type}', expected one of ${U(z)}`), t.props && !t.props.manual && n(`${r}.props`, "expected 'manual' (and optional 'common') entries"), t.scale) {
+			let e = t.scale.type ?? "linear", i = h[`scale${P(e)}`];
+			typeof i == "function" ? typeof i().ticks == "function" != ["numeric", "date"].includes(t.type) && n(`${r}.scale.type`, `a ${e} scale does not fit the type '${t.type}'`) : n(`${r}.scale.type`, `unknown d3 scale '${e}'`), t.scale.orientation !== void 0 && !B.includes(t.scale.orientation) && n(`${r}.scale.orientation`, `unknown orientation '${t.scale.orientation}', expected one of ${U(B)}`);
+		}
+		t.axis && (t.scale || n(`${r}.axis`, "an axis needs a 'scale'"), V.includes(t.axis.position) || n(`${r}.axis.position`, `unknown position '${t.axis.position}', expected one of ${U(V)}`), W(t.axis.ticks, `${r}.axis.ticks`, n));
+	});
+	let i = [].concat(e.plot ?? []);
+	if (i.length == 0 && n("plot", "missing"), i.forEach((e, t) => {
+		let i = `plot[${t}]`;
+		R.includes(e.type) || n(`${i}.type`, `unknown type '${e.type}', expected one of ${U(R)}`), (e.categories ?? []).filter((e) => !(e in r)).forEach((e) => n(`${i}.categories`, `unknown mapping '${e}'`)), W(e.props, `${i}.props`, n);
+	}), e.facets) {
+		let t = [].concat(e.facets.dim ?? []);
+		t.length != 1 && n("facets.dim", "expected the name of one mapping"), t.filter((e) => !(e in r)).forEach((e) => n("facets.dim", `unknown mapping '${e}'`));
+	}
+	return W(e.options?.height, "options.height", n), W(e.facets?.cols, "facets.cols", n), t;
+}, G = (e, t = document.baseURI) => new URL(e, t).href, K = async (e) => {
+	try {
+		return await h.text(e);
+	} catch (t) {
+		throw Error(`Could not load '${e}': ${t.message}`);
+	}
+}, q = (e, t) => {
+	try {
+		return JSON.parse(e);
+	} catch (e) {
+		throw Error(`Invalid JSON in definition ${t}: ${e.message}`);
+	}
+}, de = async (e, t, n = K) => {
+	let r = [e], i = /* @__PURE__ */ new Set();
+	for (; e.parent;) {
+		if (t = G(e.parent, t), i.has(t)) throw Error(`Cyclic parent definition '${t}'`);
+		i.add(t), e = q(await n(t), `'${t}'`), r.unshift(e);
+	}
+	return S(r);
+}, J = (e) => o(Array.from(m(e))), fe = async ({ def: e = null, defUrl: t = null, data: n = null }) => {
+	let r;
+	e === null ? (r = G(t), e = q(await K(r), `'${r}'`)) : typeof e == "string" && (e = q(e, "attribute"));
+	let i = await de(JSON.parse(JSON.stringify(e)), r);
+	ue(i).forEach((e) => console.warn(`gen-vis ${r ?? "inline definition"}: ${e}`));
+	let a = se(JSON.parse(JSON.stringify(i)));
+	if (N(a, i), n === null) {
+		if (!i.data) throw Error("No data given, neither in the definition nor as attribute.");
+		n = await K(G(i.data, r));
+	}
+	let s = J(_(n));
+	return {
+		defUrl: r ?? null,
+		defOrg: i,
+		locale: o(le(i.options?.locale)),
+		rows: s,
+		def: a,
+		data: J(te(s, a))
+	};
+}, pe = class {
+	defUrl = null;
+	defOrg = null;
+	locale = null;
+	def = null;
+	rows = null;
+	data = null;
+	runs = 0;
+	get loaded() {
+		return this.def !== null && this.data !== null;
+	}
+	get axis() {
+		let e = {};
+		return this.mappingNamesWithKey("scale").forEach((t) => {
+			let n = this.mapping(t).scale.orientation;
+			n == "horizontal" && (e.h = t), n == "vertical" && (e.v = t);
+		}), e;
+	}
+	formatter(e) {
+		return e == "time" ? this.locale.time.format : e == "utc" ? this.locale.time.utcFormat : this.locale.number.format;
+	}
+	mapping(e) {
+		return this.def.mapping[e];
+	}
+	prop(e, t) {
+		return this.def.mapping[e].props[t];
+	}
+	mappingNamesWithKey(e) {
+		return Object.keys(this.def.mapping).filter((t) => e in this.def.mapping[t]);
+	}
+	async init(e) {
+		let t = ++this.runs;
+		this.def = this.data = null;
+		try {
+			let n = await fe(e);
+			t == this.runs && Object.assign(this, n);
+		} catch (e) {
+			if (t == this.runs) throw e;
+		}
+	}
+	applyFormElements() {
+		N(this.def, this.defOrg) && (this.data = J(te(this.rows, this.def)));
+	}
+}, me = () => u(new pe()), Y = (e, t) => {
+	let n = e.mapping.scale, r = h[`scale${P(n.type)}`]();
+	if (r.range(D(n.range, t)), e.extent) {
+		e.domain = [...n.domain], e.domainRel = [...n.domainRel ? n.domainRel : [0, 0]], e.domainAbs = n.domainAbs, e.domain[0] ??= e.extent[0], e.domain[1] ??= e.extent[1];
+		let t = e.domain[1] - e.domain[0];
+		e.domain[0] += t * e.domainRel[0], e.domain[1] += t * e.domainRel[1], e.domain[0] += e.domainAbs[0], e.domain[1] += e.domainAbs[1], r.invertCustom = (t) => e.values[h.bisectCenter(e.values, r.invert(t))];
+	} else e.domain = e.values, n.padding ??= .4, r.padding(n.padding), r.invertCustom = (e) => {
+		let t = Math.floor(e / r.step());
+		return r.domain()[Math.max(0, Math.min(t, r.domain().length - 1))];
+	};
+	r.domain(e.domain), e.scale = r;
+}, X = function(e) {
+	let t = h.select(this);
+	Object.entries(e).forEach(([e, n], r) => {
+		if (n instanceof Object) {
+			if (!k(n)) return;
+			n = n.value;
+		}
+		if (e == "text") {
+			t.text(n);
+			return;
+		}
+		t.attr(e, n);
+	});
+}, he = function(e) {
+	let t = h.select(this);
+	e.group.forEach((e) => {
+		t.attr(`data-group-${e.dim}`, e.key);
+	}), e.group.forEach((e) => {
+		t.attr(`data-visible-${e.dim}`, e.visible);
+	}), t.attr("data-visible", e.group.reduce((e, t) => e && t.visible, !0));
+}, ge = (e, t, n) => {
+	let r = t.categories.filter((e) => e in n).map((e) => ({
+		attr: `data-group-${e}`,
+		value: String(n[e])
+	}));
+	return r.length == 0 ? null : e.selectAll(`g.plotGroup.${t.id} [${r[0].attr}]`).filter(function() {
+		return r.every((e) => this.getAttribute(e.attr) === e.value);
+	});
+}, Z = (e, t, n = null) => {
+	t.filter((e) => e.highlightProps.length > 0).forEach((t) => {
+		e.selectAll(`g.plotGroup.${t.id} .highlight`).classed("highlight", !1).each(function() {
+			let e = h.select(this);
+			t.highlightProps.forEach((t) => e.attr(t, e.attr(`default-${t}`)));
+		});
+		let r = n && ge(e, t, n);
+		r && r.classed("highlight", !0).raise().each(function() {
+			let e = h.select(this);
+			t.highlightProps.forEach((t) => {
+				e.attr(`default-${t}`, e.attr(t)).attr(t, e.attr(`highlight-${t}`));
+			});
+		});
+	});
+}, Q = (e, t) => {
+	let n = e.__vccOpts || e;
+	for (let [e, r] of t) n[e] = r;
+	return n;
+}, _e = {
+	props: [
+		"title",
+		"axis",
+		"side",
+		"data"
+	],
+	data: () => ({ space: 20 }),
+	computed: {
+		left() {
+			return this.side == "left" ? `${this.axis.h.value - this.space}px` : `${this.axis.h.value + this.space}px`;
+		},
+		transform() {
+			return this.side == "left" ? "translate(-100%, -50%)" : "translate(0, -50%)";
+		}
+	},
+	mounted() {
+		this.render();
+	},
+	watch: { data: "render" },
+	methods: { render() {
+		if (!this.$refs.entries || !this.data) return;
+		let e = [...this.data].sort((e, t) => t.entries[this.axis.v.col].value - e.entries[this.axis.v.col].value), t = h.select(this.$refs.entries).selectAll("tr.entry").data(e).join("tr").attr("class", "entry").classed("nearest", (e) => e.nearest);
+		t.selectAll("td").remove(), t.selectAll("td").data((e) => Object.entries(e.entries)).join("td").attr("class", (e) => e[0]).html((e) => typeof e[1] == "object" ? e[1].name : e[1]);
+	} }
+}, ve = { class: "title" }, ye = {
+	class: "entries",
+	ref: "entries"
+};
+function be(e, t, n, o, s, u) {
+	return n.axis && n.axis.h ? (l(), i("div", {
+		key: 0,
+		class: "hover",
+		ref: "hover",
+		style: c({
+			left: u.left,
+			transform: u.transform
+		})
+	}, [a("div", ve, p(n.axis.h.name), 1), a("table", ye, null, 512)], 4)) : r("", !0);
+}
+var xe = /*#__PURE__*/ Q(_e, [["render", be], ["__scopeId", "data-v-364032d4"]]), Se = (...e) => e.every((e) => Number.isFinite(e)), Ce = {
+	props: [
+		"filter",
+		"shared",
+		"height",
+		"width",
+		"margins",
+		"data"
+	],
+	inject: ["store"],
+	data: () => ({
+		info: {},
+		debug: null,
+		def: null,
+		hover: { visible: !1 }
+	}),
+	computed: {
+		innerWidth() {
+			return this.width - (this.margins.left + this.margins.right);
+		},
+		innerHeight() {
+			return this.height - (this.margins.top + this.margins.bottom);
+		},
+		relativeBases() {
+			return {
+				width: this.width,
+				innerWidth: this.innerWidth,
+				height: this.height,
+				innerHeight: this.innerHeight
+			};
+		}
+	},
+	components: { Hover: xe },
+	created() {
+		this.def = this.store.def;
+	},
+	mounted() {
+		this.inner = h.select(this.$refs.inner), this.scales(), this.axis(), this.plot(), this.hoverInit();
+	},
+	unmounted() {
+		document.removeEventListener("pointerdown", this.hideOnPointerOutside);
+	},
+	methods: {
+		plot() {
+			this.def.plot.forEach((e) => {
+				let t = ae(b(this.data, e.categories), e, this.relativeBases, this.def.mapping), n = this.inner.append("g").classed("plotGroup", !0).classed(e.id, !0);
+				this[e.type](t, n);
+			});
+		},
+		_groupwise: function(e, t) {
+			return t.classed("paths", !0).selectAll("path").data(e).enter().append("path").each(function(e) {
+				X.call(this, e.props);
+			}).each(he);
+		},
+		_pointwise(e, t, n, r = (e) => e) {
+			return t.classed(n, !0).selectAll("g.group").data(e).enter().append("g").attr("class", "group").each(he).selectAll(n).data((e) => {
+				let t = A(e.props);
+				return e.values.filter((e) => t.every((t) => e[t] !== null)).map((t) => r(O(e.props, t)));
+			}).enter().append(n).each(X);
+		},
+		"svg:path": function(e, t) {
+			this._groupwise(e, t).attr("d", (e) => h.line().defined((e) => Se(e.x, e.y)).x((e) => e.x).y((e) => e.y)(e.values.map((t) => O(e.props.d, t, !0))));
+		},
+		"svg:circle": function(e, t) {
+			this._pointwise(e, t, "circle");
+		},
+		"svg:line": function(e, t) {
+			this._pointwise(e, t, "line");
+		},
+		"svg:rect": function(e, t) {
+			this._pointwise(e, t, "rect");
+		},
+		"svg:text": function(e, t) {
+			this._pointwise(e, t, "text");
+		},
+		"base:area": function(e, t) {
+			this._groupwise(e, t).attr("d", (e) => h.area().defined((e) => Se(e.x, e.y0, e.y1)).x((e) => e.x).y1((e) => e.y1).y0((e) => e.y0)(e.values.map((t) => O(e.props.d, t, !0))));
+		},
+		bar(e, t) {
+			let n = this;
+			this._pointwise(e, t, "rect", (e) => {
+				let t = e.height.parts[0], r = n.info[t].scale(0);
+				if (e.width === void 0) {
+					let t = e.cx.parts[0];
+					e.width = j(n.info[t].scale.step() * (1 - n.info[t].scale.padding()));
+				}
+				return e.x = j(e.cx.value - e.width.value / 2), delete e.cx, e.y = j(e.height.value), e.height = j(r - e.height.value), e;
+			});
+		},
+		stackedBar(e, t) {
+			e.forEach((e) => {
+				let t = e.props.x.ref, n = e.props.y.ref;
+				e.props.x = j(`@${t}:scaled`), e.props.y = j(`@${n}:st:e:scaled`), e.props.height = j(`@${n}:st:h:scaled`), e.props.transform = j(`translate(-${e.props.width.value / 2} 0)`);
+			}), this._pointwise(e, t, "rect", (e) => (e.height.value < 0 && (e.y.value += e.height.value, e.height.value = -e.height.value), e));
+		},
+		scales() {
+			let e = {};
+			this.store.mappingNamesWithKey("scale").filter((e) => !Object.keys(this.shared).includes(e)).forEach((t) => {
+				let n = {
+					dim: t,
+					mapping: this.store.mapping(t)
+				};
+				ne(n, this.data), Y(n, {
+					width: this.innerWidth,
+					height: this.innerHeight
+				}), e[t] = n;
+			}), y(this.data, e), this.info = {
+				...this.shared,
+				...e
+			};
+		},
+		axis() {
+			this.store.mappingNamesWithKey("axis").forEach((e) => {
+				let t = this.store.mapping(e), n = t.axis, r = this.info[e].scale, i = E(n.ticks, this.relativeBases), a = h[`axis${P(n.position)}`](r).tickSizeInner(9).tickSizeOuter(0).ticks(i).tickPadding(n.padding);
+				if (n.format) a.tickFormat(this.store.formatter(t.scale.type)(n.format));
+				else if (!n.values) {
+					let e = this.store.locale.tickFormat(r, t.scale.type, i);
+					e && a.tickFormat(e);
+				}
+				if (n.values && a.tickValues(n.values), n.grid) {
+					let e = n.values ?? (r.ticks ? r.ticks(i) : r.domain());
+					this.grid(r, e, ["left", "right"].includes(n.position));
+				}
+				let o = this.inner.append("g").attr("class", `axis-name-${e} axis-position-${n.position}`).call(a);
+				if (n.position == "bottom" && o.attr("transform", `translate(0, ${this.innerHeight})`), n.position == "right" && o.attr("transform", `translate(${this.innerWidth}, 0)`), n.rotate && o.selectAll("text").attr("text-anchor", n.rotate > 0 ? "end" : "start").attr("transform", `rotate(${-n.rotate})`), n.title) {
+					let e = this.inner.append("text").attr("class", "axis-title").attr("y", 0).attr("x", 0).attr("text-anchor", "middle").attr("dominant-baseline", "middle").text(n.title.name);
+					n.position == "left" && e.attr("transform", `rotate(-90) translate(-${this.innerHeight / 2} -${n.title.offset})`), n.position == "right" && e.attr("transform", `rotate(90) translate(${this.innerHeight / 2} -${this.innerWidth + n.title.offset})`), n.position == "top" && e.attr("transform", `translate(${this.innerWidth / 2} -${n.title.offset})`), n.position == "bottom" && e.attr("transform", `translate(${this.innerWidth / 2} ${this.innerHeight + n.title.offset})`);
+				}
+			});
+		},
+		grid(e, t, n) {
+			let r = e.bandwidth ? e.bandwidth() / 2 : 0, i = this.inner.append("g").attr("class", "grid").selectAll("line").data(t).enter().append("line");
+			n ? i.attr("x1", 0).attr("x2", this.innerWidth).attr("y1", (t) => e(t) + r).attr("y2", (t) => e(t) + r) : i.attr("y1", 0).attr("y2", this.innerHeight).attr("x1", (t) => e(t) + r).attr("x2", (t) => e(t) + r);
+		},
+		hoverInit() {
+			let e = this, t = this.store.axis;
+			if (!t.h || !t.v) return;
+			let n = Object.fromEntries(Object.entries(t).map(([e, t]) => {
+				let n = this.def.mapping[t], r = n.hover?.format ?? n.axis?.format ?? (["time", "utc"].includes(n.scale.type) ? "%x" : "c");
+				return [e, {
+					axis: e,
+					name: t,
+					formatter: this.store.formatter(n.scale.type)(r)
+				}];
+			})), r = this.store.mappingNamesWithKey("hover").filter((e) => e != t.h && e != t.v && this.store.mapping(e).props), i = h.select(this.$refs.hoverMarker).select("line"), a = () => {
+				e.hover.visible = !1, Z(e.inner, e.def.plot);
+			};
+			this.hideOnPointerOutside = (t) => {
+				e.hover.visible && !e.$refs.svg.contains(t.target) && a();
+			}, document.addEventListener("pointerdown", this.hideOnPointerOutside), this.inner.append("rect").attr("class", "events").attr("width", this.innerWidth).attr("height", this.innerHeight).attr("opacity", 0).style("touch-action", "pan-y").on("pointerdown pointermove", function(t) {
+				e.hover.visible = !0;
+				let a = h.pointer(t), o = e.info[n.h.name], s = o.scale.invertCustom(a[0]);
+				if (s === void 0) return;
+				let c = o.scale(s);
+				i.attr("x1", c).attr("x2", c).attr("y1", 0).attr("y2", e.innerHeight);
+				let l = x(e.data, [{
+					dim: n.h.name,
+					key: s
+				}]).filter((e) => e[n.v.name] !== null).map((t) => {
+					let i = {
+						entries: {},
+						data: t,
+						nearest: !1
+					};
+					return r.forEach((n) => {
+						i.entries[n] = D(e.store.mapping(n).hover.props, e.store.prop(n, t[n]));
+					}), i.entries[n.v.name] = {
+						value: t[n.v.name],
+						name: n.v.formatter(t[n.v.name])
+					}, i;
+				}), u = e.info[n.v.name].scale.invert(a[1]), d = n.v.name, f;
+				f = e.store.mapping(d).stacked ? h.least(l, (e) => {
+					let [t, n] = h.extent([e.data[`${d}:st:s`], e.data[`${d}:st:e`]]);
+					return u < t ? t - u : u > n ? u - n : 0;
+				}) : h.least(l, (e) => Math.abs(e.data[d] - u)), f && (f.nearest = !0), Z(e.inner, e.def.plot, f?.data), e.hover.data = l, e.hover.axis = {
+					h: {
+						col: n.h.name,
+						value: c,
+						name: n.h.formatter(s)
+					},
+					v: {
+						col: n.v.name,
+						value: u
+					}
+				}, e.hover.side = c > e.innerWidth / 2 ? "left" : "right";
+			}).on("pointerleave", (e) => {
+				e.pointerType != "touch" && a();
+			}).on("pointercancel", a);
+		}
+	}
+}, we = ["width", "height"], Te = ["transform"], Ee = ["visibility"], De = {
+	key: 0,
+	class: "debug"
+};
+function Oe(e, t, o, s, u, d) {
+	let m = f("hover");
+	return l(), i("div", {
+		style: c(`width: ${o.width}px;`),
+		class: "vis-inner"
+	}, [
+		(l(), i("svg", {
+			ref: "svg",
+			width: o.width,
+			height: o.height,
+			class: "facet"
+		}, [a("g", {
+			ref: "inner",
+			transform: `translate(${o.margins.left} ${o.margins.top})`
+		}, [a("g", {
+			visibility: e.hover.visible ? "visible" : "hidden",
+			class: "hoverMarker",
+			ref: "hoverMarker"
+		}, [...t[0] ||= [a("line", null, null, -1)]], 8, Ee)], 8, Te)], 8, we)),
+		a("div", { style: c(`transform: translate(${o.margins.left}px, ${o.margins.top + d.innerHeight / 2}px); position: absolute; top: 0; left: 0;`) }, [e.hover.visible ? (l(), n(m, {
+			key: 0,
+			data: e.hover.data,
+			side: e.hover.side,
+			axis: e.hover.axis
+		}, null, 8, [
+			"data",
+			"side",
+			"axis"
+		])) : r("", !0)], 4),
+		e.debug ? (l(), i("span", De, p(e.debug), 1)) : r("", !0)
+	], 4);
+}
+var ke = /*#__PURE__*/ Q(Ce, [["render", Oe], ["__scopeId", "data-v-1f05a06e"]]), Ae = {
+	props: ["info", "props"],
+	mounted() {
+		let e = h.select(this.$refs.legendSymbol);
+		this.info.elements.forEach((t) => {
+			let n = e.append(t.type);
+			X.call(n.node(), D(t.props, this.props));
+		});
+	}
+}, je = ["width", "height"];
+function Me(e, t, n, r, a, o) {
+	return l(), i("svg", {
+		width: n.info.size,
+		height: n.info.size,
+		ref: "legendSymbol"
+	}, null, 8, je);
+}
+//#endregion
+//#region src/comp/Legend.vue
+var Ne = {
+	props: ["legend"],
+	inject: ["store"],
+	data: () => ({
+		info: {},
+		entries: []
+	}),
+	components: { LegendSymbol: /* @__PURE__ */ Q(Ae, [["render", Me], ["__scopeId", "data-v-ce0e972e"]]) },
+	mounted() {
+		this.info = this.store.mapping(this.legend), this.entries = Object.keys(this.info.props).map((e) => ({
+			key: e,
+			props: this.info.props[e],
+			filled: D(this.info.legend.props, this.info.props[e])
+		}));
+	},
+	methods: { switched(e) {
+		e.props.visible = !e.props.visible, this.$emit("changeSelected", {
+			dim: this.legend,
+			key: e.key,
+			selected: e.props.visible
+		});
+	} }
+}, Pe = ["data-dim"], Fe = { class: "title" }, Ie = { class: "entries" }, Le = [
+	"data-visible",
+	"data-key",
+	"onClick",
+	"onMouseenter"
+], Re = ["innerHTML"];
+function ze(t, o, c, u, m, h) {
+	let g = f("LegendSymbol");
+	return l(), i("div", {
+		class: "legend",
+		"data-dim": c.legend
+	}, [a("div", Fe, p(t.info.name), 1), a("div", Ie, [(l(!0), i(e, null, d(t.entries, (e) => (l(), i("div", s({
+		"data-visible": e.props.visible,
+		"data-key": e.key
+	}, { ref_for: !0 }, Object.assign({ ...e.filled }, { name: null }), {
+		onClick: (t) => h.switched(e),
+		onMouseenter: (n) => t.$emit("highlight", {
+			dim: this.legend,
+			key: e.key
+		}),
+		onMouseleave: o[0] ||= (e) => t.$emit("highlight", {})
+	}), [t.info.legend.symbol ? (l(), n(g, {
+		key: 0,
+		info: t.info.legend.symbol,
+		props: e.props
+	}, null, 8, ["info", "props"])) : r("", !0), a("span", { innerHTML: e.filled.name }, null, 8, Re)], 16, Le))), 256))])], 8, Pe);
+}
+var Be = /*#__PURE__*/ Q(Ne, [["render", ze], ["__scopeId", "data-v-1bc8d55f"]]), Ve = {
+	props: ["element", "globals"],
+	computed: { vg() {
+		return this.globals[this.element.ref];
+	} },
+	methods: {
+		switched(e) {
+			this.globals[this.element.ref] = e.value, this.$emit("changeSelected", {});
+		},
+		equal(e) {
+			return C(e, this.vg);
+		}
+	}
+}, He = ["id"], Ue = { class: "title" }, We = {
+	key: 0,
+	class: "entries"
+}, Ge = ["id", "onClick"], Ke = [
+	"name",
+	"value",
+	"checked"
+], qe = ["for"];
+function Je(t, n, o, s, c, u) {
+	return l(), i("div", {
+		class: "formElement",
+		id: `container-${o.element.id}`
+	}, [a("div", Ue, p(o.element.name) + ":", 1), o.element.type == "switch" ? (l(), i("div", We, [(l(!0), i(e, null, d(o.element.values, (e) => (l(), i("div", {
+		id: `container-${e.id}`,
+		onClick: (t) => u.switched(e)
+	}, [a("input", {
+		type: "radio",
+		name: o.element.id,
+		value: e.id,
+		checked: u.equal(e.value)
+	}, null, 8, Ke), a("label", { for: e.id }, p(e.name), 9, qe)], 8, Ge))), 256))])) : r("", !0)], 8, He);
+}
+//#endregion
+//#region src/comp/Vis.vue
+var Ye = {
+	inject: ["store"],
+	data: () => ({
+		initialized: !1,
+		options: {},
+		globals: {},
+		legends: [],
+		formElements: [],
+		filter: [],
+		data: [],
+		facets: {
+			shared: {},
+			entries: [],
+			height: 0,
+			width: 0,
+			margins: {
+				top: 0,
+				right: 0,
+				bottom: 0,
+				left: 0
+			}
+		}
+	}),
+	computed: {
+		innerWidth() {
+			return this.options.width - (this.options.margins.left + this.options.margins.right);
+		},
+		innerHeight() {
+			return this.options.height - (this.options.margins.top + this.options.margins.bottom);
+		}
+	},
+	components: {
+		Facet: ke,
+		LegendEntry: Be,
+		FormElement: /* @__PURE__ */ Q(Ve, [["render", Je], ["__scopeId", "data-v-b7f59ae7"]])
+	},
+	mounted() {
+		this.baseInit(), this.dataInit(), this.scales(), this.store.def.options.width || (this.resizeObserver = new ResizeObserver(() => {
+			clearTimeout(this.resizeTimeout), this.resizeTimeout = setTimeout(this.resized, 100);
+		}), this.resizeObserver.observe(this.$refs.vis));
+	},
+	unmounted() {
+		this.resizeObserver?.disconnect(), clearTimeout(this.resizeTimeout);
+	},
+	methods: {
+		baseInit() {
+			this.legends = this.store.mappingNamesWithKey("legend"), this.formElements = this.store.def.formElements, this.globals = this.store.def.globals, this.options = Object.assign({}, this.store.def.options), this.measure();
+		},
+		measure() {
+			let e = this.store.def.options;
+			this.options.width = e.width || this.$refs.vis.getBoundingClientRect().width, this.options.height = E(e.height, { totalWidth: this.options.width });
+		},
+		resized() {
+			let e = this.$refs.vis?.getBoundingClientRect().width;
+			e && e != this.options.width && (this.measure(), this.dataInit(), this.scales());
+		},
+		dataInit() {
+			let e = this.store.def, t = this.store.axis;
+			if (this.filter = this.store.mappingNamesWithKey("props").map((e) => ({
+				dim: e,
+				key: Object.keys(this.store.mapping(e).props).filter((t) => this.store.mapping(e).props[t].visible)
+			})), this.data = o(x(this.store.data, this.filter)), t.v && this.store.mapping(t.v).stacked && re(this.data, t, e.facets ? [e.facets.dim] : []), e.facets) {
+				this.facets.margins = this.options.margins, this.facets.height = this.options.height;
+				let t = E(e.facets.cols, { totalWidth: this.options.width });
+				this.facets.width = this.options.width / t;
+				let n = e.facets.dim, r = b(this.data, [n]);
+				this.facets.entries = r.filter((e) => Object.keys(this.store.mapping(n).props).includes(e.group[n])).map((e) => ({
+					filter: {
+						dim: e.group[n],
+						key: n,
+						name: this.store.mapping(n).props[e.group[n]].name
+					},
+					data: o(e.entries)
+				}));
+			}
+		},
+		scales() {
+			let e = this.store.def;
+			if (e.facets && e.facets.scales) {
+				let t = E(e.facets.scales, e.globals).map((e) => {
+					let t = {
+						dim: e,
+						mapping: this.store.mapping(e)
+					};
+					return ne(t, this.data), Y(t, {
+						width: this.facets.width - (this.facets.margins.left + this.facets.margins.right),
+						height: this.facets.height - (this.facets.margins.top + this.facets.margins.bottom)
+					}), t;
+				});
+				y(this.data, t), this.facets.shared = Object.fromEntries(t.map((e) => [e.dim, e]));
+			}
+			this.initialized = !0;
+		},
+		changeSelected(e) {
+			this.dataInit(), this.scales();
+		},
+		formChanged(e) {
+			this.store.applyFormElements(), this.changeSelected(e);
+		},
+		highlight(e) {
+			Z(h.select(this.$refs.vis), this.store.def.plot, { [e.dim]: e.key });
+		}
+	}
+}, Xe = { class: "vis-header" }, Ze = { class: "title" }, Qe = { class: "subtitle" }, $e = {
+	ref: "form",
+	class: "vis-form-elements"
+}, et = {
+	ref: "legends",
+	class: "vis-legends"
+}, tt = {
+	key: 0,
+	class: "vis-body"
+}, nt = { class: "vis-footer" }, rt = ["innerHTML"];
+function it(t, o, s, u, m, h) {
+	let g = f("form-element"), _ = f("legend-entry"), v = f("facet");
+	return l(), i("div", {
+		class: "vis",
+		ref: "vis",
+		style: c({ "--gen-vis-font-family": t.options.fontFamily })
+	}, [
+		a("div", Xe, [a("div", Ze, p(t.options.title), 1), a("div", Qe, p(t.options.subtitle), 1)]),
+		a("div", $e, [(l(!0), i(e, null, d(t.formElements, (e) => (l(), n(g, {
+			element: e,
+			globals: t.globals,
+			onChangeSelected: h.formChanged
+		}, null, 8, [
+			"element",
+			"globals",
+			"onChangeSelected"
+		]))), 256))], 512),
+		a("div", et, [(l(!0), i(e, null, d(t.legends, (e) => (l(), n(_, {
+			legend: e,
+			onChangeSelected: h.changeSelected,
+			onHighlight: h.highlight
+		}, null, 8, [
+			"legend",
+			"onChangeSelected",
+			"onHighlight"
+		]))), 256))], 512),
+		t.initialized ? (l(), i("div", tt, [t.facets.entries.length > 0 ? (l(!0), i(e, { key: 0 }, d(t.facets.entries, (e) => (l(), i("div", { style: c(`width: ${t.facets.width}px; display: inline-block;`) }, [a("div", {
+			class: "facet-title",
+			style: c(`margin-left: ${t.facets.margins.left}px`)
+		}, p(e.filter.name), 5), (l(), n(v, {
+			key: e.data,
+			data: e.data,
+			shared: t.facets.shared,
+			height: t.facets.height,
+			width: t.facets.width,
+			margins: t.facets.margins
+		}, null, 8, [
+			"data",
+			"shared",
+			"height",
+			"width",
+			"margins"
+		]))], 4))), 256)) : (l(), n(v, {
+			key: t.data,
+			data: t.data,
+			shared: {},
+			height: t.options.height,
+			width: t.options.width,
+			margins: t.options.margins
+		}, null, 8, [
+			"data",
+			"height",
+			"width",
+			"margins"
+		]))])) : r("", !0),
+		a("div", nt, [a("span", { innerHTML: t.options.footer }, null, 8, rt)])
+	], 4);
+}
+//#endregion
+//#region src/comp/App.vue
+var at = {
+	name: "GenVis",
+	props: {
+		debug: {
+			type: Boolean,
+			default: !1
+		},
+		defFile: {
+			type: String,
+			default: null
+		},
+		def: {
+			type: [Object, String],
+			default: null
+		},
+		data: {
+			type: [Array, String],
+			default: null
+		}
+	},
+	data: () => ({
+		store: me(),
+		error: null
+	}),
+	provide() {
+		return { store: this.store };
+	},
+	components: { VisBase: /* @__PURE__ */ Q(Ye, [["render", it], ["__scopeId", "data-v-f8fa11d2"]]) },
+	watch: {
+		def: "init",
+		defFile: "init",
+		data: "init"
+	},
+	mounted() {
+		this.init();
+	},
+	errorCaptured(e) {
+		return this.showError(e), !1;
+	},
+	methods: {
+		async init() {
+			if (this.error = null, this.def === null && this.defFile === null) return this.showError(/* @__PURE__ */ Error("No definition given."));
+			try {
+				await this.store.init({
+					def: this.def,
+					defUrl: this.defFile,
+					data: this.data
+				});
+			} catch (e) {
+				this.showError(e);
+			}
+		},
+		showError(e) {
+			console.error(e), this.error = e.message;
+		}
+	}
+}, ot = { class: "vis-outer" }, st = {
+	key: 0,
+	class: "vis-error"
+}, ct = { key: 2 }, lt = { style: {
+	height: "500px",
+	overflow: "auto",
+	"font-size": "11px"
+} }, ut = { style: {
+	height: "500px",
+	overflow: "auto",
+	"font-size": "11px"
+} };
+function dt(e, t, o, s, c, u) {
+	let d = f("vis-base");
+	return l(), i("div", ot, [e.error ? (l(), i("div", st, p(e.error), 1)) : e.store.loaded ? (l(), n(d, { key: 1 })) : r("", !0), o.debug && e.store.def ? (l(), i("div", ct, [
+		t[0] ||= a("h3", null, "prepared:", -1),
+		a("pre", lt, p(JSON.stringify(e.store.def, null, 4)), 1),
+		t[1] ||= a("h3", null, "org:", -1),
+		a("pre", ut, p(JSON.stringify(e.store.defOrg, null, 4)), 1)
+	])) : r("", !0)]);
+}
+var $ = /*#__PURE__*/ Q(at, [["render", dt], ["__scopeId", "data-v-a9d47434"]]), ft = { install(e) {
+	e.component("GenVis", $);
+} }, pt = (e) => {
+	let n = Object.fromEntries(e.getAttributeNames().filter((e) => e.startsWith("data-")).map((t) => [t.substring(5), e.getAttribute(t)]));
+	return t($, n).mount(e);
+}, mt = (e) => {
+	for (let t of document.getElementsByClassName(e)) t.classList.contains("gen-vis-attached") || (t.classList.add("gen-vis-attached"), pt(t));
+};
+//#endregion
+export { $ as GenVis, ft as default, mt as mountGenVisByClass, pt as mountGenVisElement };