vue-data-ui 3.17.13 → 3.18.1

package/dist/vue-ui-skeleton-CxTmGCQp.js

@@ -0,0 +1,2556 @@
+import { t as e } from "./rolldown-runtime-CAFD8bLK.js";
+import { D as t, P as n, jt as r, t as i } from "./lib-BkiwukKO.js";
+import { t as ee } from "./useConfig-BV0kTCnO.js";
+import { t as te } from "./useNestedProp-Ck4hsrpu.js";
+import { t as a } from "./_plugin-vue_export-helper-Dq1MygBL.js";
+import { n as o } from "./PackageVersion-DhDKg-ez.js";
+import { Fragment as s, computed as c, createCommentVNode as l, createElementBlock as u, createElementVNode as d, createStaticVNode as f, createVNode as p, normalizeClass as ne, normalizeStyle as m, openBlock as h, ref as g, renderList as _, unref as v } from "vue";
+//#region src/components/vue-ui-skeleton.vue
+var y = /* @__PURE__ */ e({ default: () => K }), re = ["id"], ie = ["xmlns"], ae = { transform: "translate(300, 300)" }, oe = [
+	"d",
+	"fill",
+	"stroke"
+], se = ["xmlns"], ce = ["id"], le = ["stop-color"], b = ["stop-color"], x = ["stop-color"], S = ["stop-color"], C = ["fill", "stroke"], w = ["fill", "stroke"], T = ["fill", "stroke"], E = ["fill", "stroke"], D = ["fill", "stroke"], O = ["xmlns"], k = ["stroke"], A = ["stroke"], j = ["stroke"], M = ["fill", "stroke"], N = ["fill"], P = ["fill", "stroke"], F = ["fill"], I = ["fill", "stroke"], L = ["fill"], R = ["fill", "stroke"], z = ["fill"], B = ["fill", "stroke"], V = ["fill"], H = ["fill", "stroke"], U = ["fill"], W = ["xmlns"], ue = ["stroke"], de = ["stroke"], fe = ["stroke"], pe = ["stroke"], me = ["stroke"], he = ["stroke"], ge = ["stroke"], _e = ["stroke"], ve = ["stroke"], ye = ["xmlns"], be = ["stroke", "fill"], xe = ["xmlns"], Se = ["stroke", "fill"], Ce = ["xmlns"], we = ["fill"], Te = ["fill"], Ee = ["fill"], De = ["fill"], Oe = ["xmlns"], ke = ["stroke"], Ae = ["fill"], je = ["stroke", "fill"], Me = ["stroke", "fill"], Ne = ["fill"], Pe = ["stroke", "fill"], Fe = ["stroke", "fill"], Ie = ["fill"], Le = ["stroke", "fill"], Re = ["stroke", "fill"], ze = ["fill"], Be = ["stroke", "fill"], Ve = ["stroke", "fill"], He = ["fill"], Ue = ["stroke", "fill"], We = ["stroke", "fill"], Ge = ["xmlns"], Ke = ["stroke"], qe = ["stroke"], Je = ["stroke", "fill"], Ye = ["stroke", "fill"], Xe = ["stroke", "fill"], Ze = ["stroke", "fill"], Qe = ["stroke", "fill"], $e = ["stroke", "fill"], et = ["stroke", "fill"], tt = ["stroke", "fill"], nt = ["stroke", "fill"], rt = ["stroke", "fill"], it = ["stroke", "fill"], at = ["stroke", "fill"], ot = ["stroke", "fill"], st = ["stroke", "fill"], ct = ["stroke", "fill"], lt = ["stroke", "fill"], ut = ["stroke", "fill"], dt = ["stroke", "fill"], ft = ["stroke", "fill"], pt = ["stroke", "fill"], mt = ["stroke", "fill"], ht = ["stroke", "fill"], gt = ["stroke", "fill"], _t = ["xmlns"], vt = ["stroke"], yt = ["xmlns"], bt = ["stroke"], xt = ["xmlns"], St = ["stroke"], Ct = ["xmlns"], wt = ["fill"], Tt = ["fill"], Et = ["fill"], Dt = ["fill"], Ot = ["fill"], kt = ["fill"], At = ["fill"], jt = ["fill"], Mt = ["fill"], Nt = ["fill"], Pt = ["fill"], Ft = ["fill"], It = ["xmlns"], Lt = ["stroke"], Rt = ["stroke"], zt = ["stroke"], Bt = ["stroke"], Vt = ["stroke"], Ht = ["stroke"], Ut = ["xmlns"], Wt = ["stroke"], Gt = ["stroke"], Kt = ["stroke"], qt = ["stroke"], Jt = ["stroke"], Yt = ["stroke"], Xt = ["stroke"], Zt = ["stroke"], Qt = ["stroke"], $t = ["xmlns"], en = ["stroke"], tn = ["xmlns"], nn = ["stroke"], rn = ["stroke"], an = ["stroke"], on = ["stroke"], sn = ["stroke"], cn = ["stroke"], ln = ["stroke"], un = ["stroke"], dn = ["stroke"], G = ["xmlns"], fn = [
+	"x1",
+	"x2",
+	"stroke"
+], pn = ["xmlns"], mn = [
+	"x",
+	"y",
+	"width",
+	"height",
+	"fill"
+], hn = [
+	"y",
+	"width",
+	"height",
+	"fill"
+], gn = ["xmlns"], _n = ["fill"], vn = ["fill"], yn = ["fill"], bn = ["xmlns"], xn = [
+	"x1",
+	"x2",
+	"y1",
+	"y2",
+	"stroke"
+], Sn = ["stroke"], Cn = ["fill"], wn = ["xmlns"], Tn = ["fill"], En = ["fill"], Dn = [
+	"x1",
+	"y1",
+	"x2",
+	"y2",
+	"stroke-width",
+	"stroke"
+], On = ["xmlns"], kn = { key: 0 }, An = ["stroke", "stroke-width"], jn = ["stroke", "stroke-width"], Mn = [
+	"x1",
+	"x2",
+	"y1",
+	"y2",
+	"stroke",
+	"stroke-width"
+], Nn = [
+	"x1",
+	"x2",
+	"y1",
+	"y2",
+	"stroke",
+	"stroke-width"
+], Pn = [
+	"x1",
+	"x2",
+	"y1",
+	"y2",
+	"stroke",
+	"stroke-width"
+], Fn = [
+	"x",
+	"y",
+	"height",
+	"width",
+	"fill"
+], In = ["xmlns", "viewBox"], Ln = [
+	"x",
+	"y",
+	"stroke",
+	"fill"
+], Rn = ["xmlns"], zn = ["d", "stroke"], Bn = [
+	"cx",
+	"cy",
+	"r",
+	"fill",
+	"stroke"
+], Vn = [
+	"cx",
+	"cy",
+	"r",
+	"fill",
+	"stroke"
+], Hn = [
+	"x",
+	"y",
+	"width",
+	"fill"
+], Un = [
+	"cx",
+	"cy",
+	"fill"
+], Wn = [
+	"cx",
+	"cy",
+	"fill"
+], Gn = ["stroke"], Kn = ["xmlns"], qn = ["stroke", "stroke-width"], Jn = ["stroke", "stroke-width"], Yn = ["stroke", "stroke-width"], Xn = ["fill"], Zn = ["fill"], Qn = ["fill"], $n = ["fill"], er = ["fill"], tr = ["fill"], nr = ["xmlns"], rr = { key: 0 }, ir = ["stroke", "stroke-width"], ar = ["stroke", "stroke-width"], or = ["stroke", "stroke-width"], sr = { key: 1 }, cr = ["r", "fill"], lr = ["r", "fill"], ur = ["xmlns"], dr = { key: 0 }, fr = ["stroke", "stroke-width"], pr = ["stroke", "stroke-width"], mr = [
+	"fill",
+	"rx",
+	"x",
+	"y",
+	"width",
+	"height"
+], hr = ["xmlns"], gr = ["stroke-width", "stroke"], _r = ["stroke-width", "stroke"], vr = ["stroke-width", "stroke"], yr = ["xmlns"], br = ["stroke"], xr = ["stroke"], Sr = ["stroke"], Cr = ["stroke"], wr = ["fill"], Tr = ["stroke"], Er = ["xmlns"], Dr = ["stroke", "stroke-width"], Or = ["stroke", "stroke-width"], kr = ["fill", "r"], Ar = ["fill", "r"], jr = ["fill", "r"], Mr = ["fill", "r"], Nr = ["fill", "r"], Pr = ["fill", "r"], Fr = ["fill", "r"], Ir = ["fill", "r"], Lr = ["fill", "r"], Rr = ["xmlns"], zr = [
+	"d",
+	"stroke",
+	"stroke-width"
+], Br = [
+	"d",
+	"stroke",
+	"stroke-width"
+], Vr = [
+	"d",
+	"stroke",
+	"stroke-width"
+], Hr = [
+	"d",
+	"stroke",
+	"stroke-width"
+], Ur = ["stroke", "stroke-width"], Wr = ["stroke", "stroke-width"], Gr = ["stroke", "stroke-width"], Kr = ["fill"], qr = ["fill"], Jr = ["xmlns"], Yr = [
+	"x",
+	"y",
+	"fill"
+], Xr = [
+	"x",
+	"y",
+	"fill"
+], Zr = [
+	"x",
+	"y",
+	"fill"
+], Qr = ["xmlns"], $r = ["fill"], ei = ["fill"], ti = [
+	"y1",
+	"y2",
+	"stroke",
+	"stroke-width"
+], ni = [
+	"x1",
+	"x2",
+	"stroke",
+	"stroke-width"
+], ri = ["xmlns", "stroke"], ii = ["fill"], ai = ["xmlns", "stroke"], oi = ["xmlns", "stroke"], si = ["fill"], ci = ["xmlns", "stroke"], li = ["xmlns", "stroke"], ui = ["fill"], di = ["xmlns", "stroke"], fi = ["xmlns", "stroke"], pi = ["fill"], mi = ["xmlns", "stroke"], hi = ["xmlns", "stroke"], gi = ["fill"], _i = ["xmlns", "stroke"], vi = ["xmlns"], yi = [
+	"points",
+	"fill",
+	"stroke",
+	"stroke-width"
+], bi = ["xmlns"], xi = { key: 0 }, Si = ["stroke", "stroke-width"], Ci = [
+	"y",
+	"width",
+	"fill",
+	"rx"
+], K = /* @__PURE__ */ a({
+	__name: "vue-ui-skeleton",
+	props: { config: {
+		type: Object,
+		default() {
+			return {};
+		}
+	} },
+	setup(e) {
+		let { vue_ui_skeleton: a } = ee(), y = e, K = g(`vue-ui-skeleton-${Math.random()}`), q = c(() => te({
+			userConfig: y.config,
+			defaultConfig: a
+		})), wi = c(() => q.value.style.animated), J = c(() => q.value.type), Ti = g([
+			60,
+			50,
+			55,
+			36,
+			40,
+			25,
+			26,
+			12
+		]), Ei = c(() => t({
+			plot: {
+				x: 50,
+				y: 50
+			},
+			radius: 40,
+			sides: 6
+		}).path), Di = c(() => t({
+			plot: {
+				x: 50,
+				y: 50
+			},
+			radius: 30,
+			sides: 6
+		}).path), Oi = c(() => t({
+			plot: {
+				x: 50,
+				y: 50
+			},
+			radius: 20,
+			sides: 6
+		}).path), ki = c(() => t({
+			plot: {
+				x: 50,
+				y: 50
+			},
+			radius: 10,
+			sides: 6
+		}).path), Y = g([
+			{
+				root: {
+					x: 70,
+					y: 77,
+					r: 44,
+					opacity: 100
+				},
+				bars: [
+					{
+						x: 200,
+						y: 37,
+						opacity: 100,
+						width: 240
+					},
+					{
+						x: 200,
+						y: 118,
+						opacity: 100,
+						width: 180
+					},
+					{
+						x: 200,
+						y: 253,
+						opacity: 100,
+						width: 80
+					}
+				]
+			},
+			{
+				root: {
+					x: 70,
+					y: 177,
+					r: 32,
+					opacity: 70
+				},
+				bars: [
+					{
+						x: 200,
+						y: 145,
+						opacity: 70,
+						width: 160
+					},
+					{
+						x: 200,
+						y: 172,
+						opacity: 70,
+						width: 140
+					},
+					{
+						x: 200,
+						y: 199,
+						opacity: 70,
+						width: 120
+					}
+				]
+			},
+			{
+				root: {
+					x: 70,
+					y: 257,
+					r: 24,
+					opacity: 40
+				},
+				bars: [
+					{
+						x: 200,
+						y: 64,
+						opacity: 40,
+						width: 220
+					},
+					{
+						x: 200,
+						y: 91,
+						opacity: 40,
+						width: 200
+					},
+					{
+						x: 200,
+						y: 226,
+						opacity: 40,
+						width: 100
+					}
+				]
+			}
+		]), X = g([
+			{
+				y: 200,
+				height: 100,
+				bar: 50
+			},
+			{
+				y: 180,
+				height: 100,
+				bar: 40
+			},
+			{
+				y: 150,
+				height: 100,
+				bar: 30
+			},
+			{
+				y: 120,
+				height: 80,
+				bar: 50
+			},
+			{
+				y: 110,
+				height: 60,
+				bar: 30
+			},
+			{
+				y: 80,
+				height: 80,
+				bar: 10
+			},
+			{
+				y: 50,
+				height: 80,
+				bar: 40
+			},
+			{
+				y: 24,
+				height: 40,
+				bar: 24
+			},
+			{
+				y: 44,
+				height: 20,
+				bar: 13
+			},
+			{
+				y: 32,
+				height: 45,
+				bar: 19
+			}
+		]), Z = g([
+			[3, 2.5],
+			[4, 3.1],
+			[8, 6],
+			[9.5, 6.5],
+			[12, 11],
+			[16, 15],
+			[18, 18.2],
+			[25, 24],
+			[24, 26],
+			[32, 32],
+			[33, 32],
+			[32, 31],
+			[38, 37],
+			[37, 38],
+			[42, 41],
+			[40, 41],
+			[44, 45],
+			[38, 35],
+			[31, 32]
+		]), Q = g([
+			{
+				x: 40,
+				y: 30
+			},
+			{
+				x: 45,
+				y: 28
+			},
+			{
+				x: 50,
+				y: 25
+			},
+			{
+				x: 55,
+				y: 20
+			},
+			{
+				x: 60,
+				y: 27
+			},
+			{
+				x: 65,
+				y: 14
+			},
+			{
+				x: 70,
+				y: 23
+			},
+			{
+				x: 75,
+				y: 16
+			},
+			{
+				x: 80,
+				y: 25
+			},
+			{
+				x: 85,
+				y: 10
+			},
+			{
+				x: 90,
+				y: 18
+			},
+			{
+				x: 95,
+				y: 7
+			},
+			{
+				x: 100,
+				y: 12
+			},
+			{
+				x: 105,
+				y: 10
+			},
+			{
+				x: 110,
+				y: 20
+			},
+			{
+				x: 115,
+				y: 7
+			},
+			{
+				x: 120,
+				y: 14
+			},
+			{
+				x: 125,
+				y: 10
+			},
+			{
+				x: 130,
+				y: 19
+			},
+			{
+				x: 135,
+				y: 3
+			},
+			{
+				x: 140,
+				y: 10
+			},
+			{
+				x: 145,
+				y: 2
+			},
+			{
+				x: 150,
+				y: 1
+			}
+		]);
+		function $(e, t = 1) {
+			let n = 29.85;
+			return {
+				x: 200 + 160 * Math.cos(n + e * Math.PI / 180) * t,
+				y: 200 + 160 * Math.sin(n + e * Math.PI / 180) * t
+			};
+		}
+		let Ai = c(() => {
+			let e = [];
+			for (let t = 0; t < 100; t += 1) e.push({
+				x1: $(360 / 100 * t).x,
+				y1: $(360 / 100 * t).y,
+				x2: $(360 / 100 * t, .9).x,
+				y2: $(360 / 100 * t, .9).y,
+				color: q.value.style.wheel.color
+			});
+			return e;
+		}), ji = g([
+			"M1.7373367220238844,203.9926019764303 A204.00000000000003,204.00000000000003 0 0 1 -131.29456850765732,-156.13371282457896 L-115.84814868322702,-137.76504072756964 A180,180 0 0 0 1.5329441664916625,179.99347233214436 Z",
+			"M-123.32705122334838,-162.50057980374598 A204.00000000000003,204.00000000000003 0 0 1 -10.195750531218382,-203.74505312057315 L-8.996250468722101,-179.77504687109393 A180,180 0 0 0 -108.81798637354268,-143.382864532717 Z",
+			"M1.2491397351303004e-14,-204.00000000000003 A204.00000000000003,204.00000000000003 0 0 1 198.55086769611978,46.83538125304364 L175.19194208481156,41.32533639974439 A180,180 0 0 0 1.1021821192326179e-14,-180 Z",
+			"M195.9619373656435,56.7002566475993 A204.00000000000003,204.00000000000003 0 0 1 11.930546287661176,203.65083369649628 L10.52695260675986,179.69191208514374 A180,180 0 0 0 172.90759179321483,50.02963821846996 Z",
+			"M-166.86833637580506,-67.49043128600653A180,180 0 0 1 -115.84814868322714,-137.76504072756956Q0,0 119.8300231855595,-134.31591693968468A180,180 0 0 1 171.96279754157493,-53.1864292999193Q0,0 -166.86833637580506,-67.49043128600653Z",
+			"M-29.992438727439374,-177.4836714156567A180,180 0 0 1 -19.255831667995757,-178.96707224172218Q0,0 112.88946799894526,140.199743276923A180,180 0 0 1 53.62560948591857,171.8263484081058Q0,0 -29.992438727439374,-177.4836714156567Z",
+			"M179.7057615540709,10.287821162491808A180,180 0 0 1 175.19194208481153,41.32533639974442Q0,0 -40.86560737697651,-175.29974938290928A180,180 0 0 1 -29.992438727439374,-177.4836714156567Q0,0 179.7057615540709,10.287821162491808Z",
+			"M-19.255831667995757,-178.96707224172218A180,180 0 0 1 -8.996250468722259,-179.7750468710939Q0,0 -179.00766444768982,18.87474685878697A180,180 0 0 1 -166.86833637580506,-67.49043128600653Q0,0 -19.255831667995757,-178.96707224172218Z",
+			"M-108.81798637354268,-143.382864532717A180,180 0 0 1 -40.86560737697651,-175.29974938290928Q0,0 -108.81798637354268,-143.382864532717A180,180 0 0 1 -40.86560737697651,-175.29974938290928Q0,0 -108.81798637354268,-143.382864532717Z",
+			"M1.1021821192326179e-14,-180A180,180 0 0 1 119.8300231855595,-134.31591693968468Q0,0 1.1021821192326179e-14,-180A180,180 0 0 1 119.8300231855595,-134.31591693968468Q0,0 1.1021821192326179e-14,-180Z",
+			"M-148.8461772161856,101.21667613653332A180,180 0 0 1 -179.00766444768982,18.87474685878697Q0,0 -148.8461772161856,101.21667613653332A180,180 0 0 1 -179.00766444768982,18.87474685878697Q0,0 -148.8461772161856,101.21667613653332Z",
+			"M1.5329441664916625,179.99347233214436A180,180 0 0 1 -148.8461772161856,101.21667613653332Q0,0 53.62560948591857,171.8263484081058A180,180 0 0 1 31.72923485708112,177.1814201754354Q0,0 1.5329441664916625,179.99347233214436Z",
+			"M31.72923485708112,177.1814201754354A180,180 0 0 1 10.52695260675986,179.69191208514374Q0,0 171.96279754157493,-53.1864292999193A180,180 0 0 1 179.7057615540709,10.287821162491808Q0,0 31.72923485708112,177.1814201754354Z",
+			"M172.90759179321483,50.02963821846996A180,180 0 0 1 112.88946799894526,140.199743276923Q0,0 172.90759179321483,50.02963821846996A180,180 0 0 1 112.88946799894526,140.199743276923Q0,0 172.90759179321483,50.02963821846996Z"
+		]);
+		return (e, t) => (h(), u("div", {
+			id: K.value,
+			class: ne({
+				"vue-data-ui-component": !0,
+				"vue-ui-skeleton": !0,
+				"vue-ui-skeleton-animated": wi.value
+			}),
+			style: m(`background:${q.value.style.backgroundColor};color:${q.value.style.color};display:flex;align-items:center;justify-content:center;`)
+		}, [
+			J.value === "chord" ? (h(), u("svg", {
+				key: 0,
+				xmlns: v(i),
+				width: "100%",
+				viewBox: "0 0 600 600",
+				style: m({ background: q.value.style.backgroundColor })
+			}, [p(o), d("g", ae, [(h(!0), u(s, null, _(ji.value, (e, t) => (h(), u("path", {
+				key: e,
+				d: e,
+				fill: q.value.style.chord.color,
+				stroke: q.value.style.backgroundColor,
+				"stroke-width": "2",
+				style: m({ opacity: t > 3 ? .6 : 1 })
+			}, null, 12, oe))), 128))])], 12, ie)) : l("", !0),
+			J.value === "ridgeline" ? (h(), u("svg", {
+				key: 1,
+				xmlns: v(i),
+				width: "100%",
+				viewBox: "20 0 512 200",
+				style: m(`background:${q.value.style.backgroundColor}`)
+			}, [
+				p(o),
+				d("defs", null, [d("linearGradient", {
+					id: `ridgeline-gradient-${K.value}`,
+					x1: "50%",
+					y1: "0%",
+					x2: "50%",
+					y2: "100%"
+				}, [
+					d("stop", {
+						offset: "0%",
+						"stop-color": q.value.style.ridgeline.color,
+						"stop-opacity": "1"
+					}, null, 8, le),
+					d("stop", {
+						offset: "30%",
+						"stop-color": q.value.style.ridgeline.color,
+						"stop-opacity": "0.7"
+					}, null, 8, b),
+					d("stop", {
+						offset: "70%",
+						"stop-color": q.value.style.ridgeline.color,
+						"stop-opacity": "0.3"
+					}, null, 8, x),
+					d("stop", {
+						offset: "100%",
+						"stop-color": q.value.style.ridgeline.color,
+						"stop-opacity": "0.1"
+					}, null, 8, S)
+				], 8, ce)]),
+				d("path", {
+					fill: `url(#ridgeline-gradient-${K.value})`,
+					stroke: q.value.style.ridgeline.color,
+					"stroke-width": "1",
+					d: "M66.6953125,60 L66.6953125,60 C72.88009982638889,59.403611453288086 79.06488715277779,58.89368232203086 85.24967447916667,58.21083435986425 C91.43446180555556,57.52798639769764 97.61924913194446,55.827101525061806 103.80403645833334,55.81495611628739 C109.98882378472223,55.802810707512975 116.17361111111111,55.808794600725854 122.3583984375,55.79659841225535 C128.54318576388889,55.784402223784845 134.7279730902778,50.50120257180663 140.91276041666669,50.50120257180663 C147.09754774305557,50.50120257180663 153.28233506944446,55.449371402529025 159.46712239583334,55.449371402529025 C165.65190972222223,55.449371402529025 171.83669704861111,52.6726852661858 178.021484375,52.6726852661858 C184.20627170138889,52.6726852661858 190.3910590277778,53.68748523105861 196.57584635416669,54.588107791627955 C202.76063368055557,55.4887303521973 208.94542100694446,59.17209535382662 215.13020833333334,59.17209535382662 C221.31499565972223,59.17209535382662 227.49978298611111,52.45924262596313 233.6845703125,52.45924262596313 C239.86935763888889,52.45924262596313 246.0541449652778,53.35394069624585 252.23893229166669,53.35394069624585 C258.4237196180556,53.35394069624585 264.60850694444446,48.87053557137407 270.79329427083337,48.87053557137407 C276.97808159722223,48.87053557137407 283.16286892361114,53.66236486164665 289.34765625,53.66236486164665 C295.5324435763889,53.66236486164665 301.71723090277777,27.591473273183208 307.9020182291667,27.591473273183208 C314.0868055555556,27.591473273183208 320.27159288194446,36.89852761880239 326.45638020833337,41.437518391010784 C332.64116753472223,45.97650916321916 338.82595486111114,54.832874234480315 345.0107421875,54.832874234480315 C351.1955295138889,54.832874234480315 357.38031684027777,18.691201442289355 363.5651041666667,18.691201442289355 C369.7498914930556,18.691201442289355 375.93467881944446,57.13764103396694 382.11946614583337,57.13764103396694 C388.30425347222223,57.13764103396694 394.48904079861114,45.68426316642005 400.673828125,40.20394349296662 C406.8586154513889,34.72362381951317 413.04340277777777,24.227858288281524 419.2281901041667,24.227858288281524 C425.4129774305556,24.227858288281524 431.59776475694446,40.62757421574731 437.78255208333337,40.62757421574731 C443.96733940972223,40.62757421574731 450.15212673611114,40.51108265240213 456.3369140625,40.28423459323992 C462.5217013888889,40.057386534077715 468.70648871527777,2.1986259303168354 474.8912760416667,2.1986259303168354 C481.0760633680556,2.1986259303168354 487.26085069444446,26.26823707335967 493.44563802083337,38.30304264488109 L493.44563802083337,60 ",
+					"stroke-linecap": "round",
+					"stroke-linejoin": "round"
+				}, null, 8, C),
+				d("path", {
+					fill: `url(#ridgeline-gradient-${K.value})`,
+					stroke: q.value.style.ridgeline.color,
+					"stroke-width": "1",
+					d: "M66.6953125,90 L66.6953125,90 C72.88009982638889,89.77691866194493 79.06488715277779,89.6480674216807 85.24967447916667,89.3307559858348 C91.43446180555556,89.0134445499889 97.61924913194446,87.68266335878263 103.80403645833334,87.68266335878263 C109.98882378472223,87.68266335878263 116.17361111111111,89.33939506404997 122.3583984375,89.33939506404997 C128.54318576388889,89.33939506404997 134.7279730902778,80.57818692301632 140.91276041666669,80.57818692301632 C147.09754774305557,80.57818692301632 153.28233506944446,84.72929899595943 159.46712239583334,84.72929899595943 C165.65190972222223,84.72929899595943 171.83669704861111,76.29369461861882 178.021484375,76.29369461861882 C184.20627170138889,76.29369461861882 190.3910590277778,87.15511944847793 196.57584635416669,87.15511944847793 C202.76063368055557,87.15511944847793 208.94542100694446,77.94863017425682 215.13020833333334,74.99584997381157 C221.31499565972223,72.04306977336633 227.49978298611111,68.02886623624688 233.6845703125,68.02886623624688 C239.86935763888889,68.02886623624688 246.0541449652778,77.62348634322068 252.23893229166669,80.79968178070098 C258.4237196180556,83.97587721818128 264.60850694444446,88.39897472556459 270.79329427083337,88.39897472556459 C276.97808159722223,88.39897472556459 283.16286892361114,63.96493991037978 289.34765625,63.96493991037978 C295.5324435763889,63.96493991037978 301.71723090277777,80.9314320263608 307.9020182291667,80.9314320263608 C314.0868055555556,80.9314320263608 320.27159288194446,60.30690675691305 326.45638020833337,60.30690675691305 C332.64116753472223,60.30690675691305 338.82595486111114,80.67911579309319 345.0107421875,80.67911579309319 C351.1955295138889,80.67911579309319 357.38031684027777,67.55382714087668 363.5651041666667,67.55382714087668 C369.7498914930556,67.55382714087668 375.93467881944446,81.05597396275368 382.11946614583337,81.05597396275368 C388.30425347222223,81.05597396275368 394.48904079861114,54.64612249628824 400.673828125,54.64612249628824 C406.8586154513889,54.64612249628824 413.04340277777777,55.13964865957763 419.2281901041667,55.91372079887162 C425.4129774305556,56.687792938165614 431.59776475694446,69.73490119628686 437.78255208333337,69.73490119628686 C443.96733940972223,69.73490119628686 450.15212673611114,64.42569974333888 456.3369140625,61.42720502984072 C462.5217013888889,58.42871031634255 468.70648871527777,51.619770711423186 474.8912760416667,51.619770711423186 C481.0760633680556,51.619770711423186 487.26085069444446,71.43616197640954 493.44563802083337,81.34435760890271 L493.44563802083337,90 ",
+					"stroke-linecap": "round",
+					"stroke-linejoin": "round"
+				}, null, 8, w),
+				d("path", {
+					fill: `url(#ridgeline-gradient-${K.value})`,
+					stroke: q.value.style.ridgeline.color,
+					"stroke-width": "1",
+					d: "M66.6953125,120 L66.6953125,120 C72.88009982638889,119.66196806626975 79.06488715277779,119.44533270180851 85.24967447916667,118.98590419880924 C91.43446180555556,118.52647569580996 97.61924913194446,117.81773649883283 103.80403645833334,116.83526495762351 C109.98882378472223,115.85279341641419 116.17361111111111,113.13699308912776 122.3583984375,112.1532391330314 C128.54318576388889,111.16948517693505 134.7279730902778,109.99850075011585 140.91276041666669,109.99850075011585 C147.09754774305557,109.99850075011585 153.28233506944446,110.52302856658399 159.46712239583334,111.20320255966007 C165.65190972222223,111.88337655273615 171.83669704861111,117.86718432281516 178.021484375,117.86718432281516 C184.20627170138889,117.86718432281516 190.3910590277778,105.7185696258208 196.57584635416669,105.7185696258208 C202.76063368055557,105.7185696258208 208.94542100694446,110.31751295094999 215.13020833333334,110.31751295094999 C221.31499565972223,110.31751295094999 227.49978298611111,99.70404230342633 233.6845703125,98.99064382512827 C239.86935763888889,98.27724534683021 246.0541449652778,97.80890189925606 252.23893229166669,97.80890189925606 C258.4237196180556,97.80890189925606 264.60850694444446,115.55764695626283 270.79329427083337,116.03253869768785 C276.97808159722223,116.50743043911288 283.16286892361114,116.77385330737809 289.34765625,116.77385330737809 C295.5324435763889,116.77385330737809 301.71723090277777,99.67826782033458 307.9020182291667,99.67826782033458 C314.0868055555556,99.67826782033458 320.27159288194446,112.3566918690216 326.45638020833337,112.3566918690216 C332.64116753472223,112.3566918690216 338.82595486111114,112.02516373585607 345.0107421875,111.68929597325065 C351.1955295138889,111.35342821064523 357.38031684027777,110.90183216475394 363.5651041666667,109.63399668493035 C369.7498914930556,108.36616120510676 375.93467881944446,84.17797508108582 382.11946614583337,84.17797508108582 C388.30425347222223,84.17797508108582 394.48904079861114,94.53076076341709 400.673828125,94.53076076341709 C406.8586154513889,94.53076076341709 413.04340277777777,73.4620627222233 419.2281901041667,73.4620627222233 C425.4129774305556,73.4620627222233 431.59776475694446,106.73221498100051 437.78255208333337,106.73221498100051 C443.96733940972223,106.73221498100051 450.15212673611114,79.76344757126915 456.3369140625,79.76344757126915 C462.5217013888889,79.76344757126915 468.70648871527777,106.72764789963081 474.8912760416667,107.12246048541942 C481.0760633680556,107.51727307120804 487.26085069444446,107.52600835218848 493.44563802083337,107.72778228557301 L493.44563802083337,120 ",
+					"stroke-linecap": "round",
+					"stroke-linejoin": "round"
+				}, null, 8, T),
+				d("path", {
+					fill: `url(#ridgeline-gradient-${K.value})`,
+					stroke: q.value.style.ridgeline.color,
+					"stroke-width": "1",
+					d: "M66.6953125,150 L66.6953125,150 C72.88009982638889,149.47795029840844 79.06488715277779,148.4338508952253 85.24967447916667,148.4338508952253 C91.43446180555556,148.4338508952253 97.61924913194446,149.78862806087534 103.80403645833334,149.78862806087534 C109.98882378472223,149.78862806087534 116.17361111111111,148.04072353168746 122.3583984375,146.60906937938194 C128.54318576388889,145.1774152270764 134.7279730902778,139.99324557351443 140.91276041666669,139.99324557351443 C147.09754774305557,139.99324557351443 153.28233506944446,149.97273754861985 159.46712239583334,149.97273754861985 C165.65190972222223,149.97273754861985 171.83669704861111,145.03376687065332 178.021484375,144.32772797689168 C184.20627170138889,143.62168908313004 190.3910590277778,143.8107253736048 196.57584635416669,143.02409560735822 C202.76063368055557,142.23746584111163 208.94542100694446,130.58782434985233 215.13020833333334,130.58782434985233 C221.31499565972223,130.58782434985233 227.49978298611111,149.11182283334733 233.6845703125,149.11182283334733 C239.86935763888889,149.11182283334733 246.0541449652778,146.61934000905183 252.23893229166669,146.61934000905183 C258.4237196180556,146.61934000905183 264.60850694444446,149.63856103727883 270.79329427083337,149.63856103727883 C276.97808159722223,149.63856103727883 283.16286892361114,120.24508280084818 289.34765625,120.24508280084818 C295.5324435763889,120.24508280084818 301.71723090277777,125.8060617486636 307.9020182291667,128.6125576296939 C314.0868055555556,131.4190535107242 320.27159288194446,133.74644461824312 326.45638020833337,137.08470876232406 C332.64116753472223,140.422972906405 338.82595486111114,149.32898535510793 345.0107421875,149.32898535510793 C351.1955295138889,149.32898535510793 357.38031684027777,145.03425137258355 363.5651041666667,140.55008414046353 C369.7498914930556,136.0659169083435 375.93467881944446,111.78284121111767 382.11946614583337,111.78284121111767 C388.30425347222223,111.78284121111767 394.48904079861114,113.0713199708892 400.673828125,114.79772539893028 C406.8586154513889,116.52413082697136 413.04340277777777,133.15608044416945 419.2281901041667,133.15608044416945 C425.4129774305556,133.15608044416945 431.59776475694446,125.48444339686912 437.78255208333337,120.24326995443076 C443.96733940972223,115.0020965119924 450.15212673611114,101.73324574781462 456.3369140625,100.14499087277113 C462.5217013888889,98.55673599772764 468.70648871527777,97.44223271035757 474.8912760416667,97.44223271035757 C481.0760633680556,97.44223271035757 487.26085069444446,132.1334233728692 493.44563802083337,149.479018704125 L493.44563802083337,150 ",
+					"stroke-linecap": "round",
+					"stroke-linejoin": "round"
+				}, null, 8, E),
+				d("path", {
+					fill: `url(#ridgeline-gradient-${K.value})`,
+					stroke: q.value.style.ridgeline.color,
+					"stroke-width": "1",
+					d: "M66.6953125,180 L66.6953125,180 C72.88009982638889,179.39605101103442 79.06488715277779,178.92730785819862 85.24967447916667,178.18815303310322 C91.43446180555556,177.44899820800782 97.61924913194446,175.33107571940982 103.80403645833334,175.33107571940982 C109.98882378472223,175.33107571940982 116.17361111111111,177.47366730075544 122.3583984375,177.47366730075544 C128.54318576388889,177.47366730075544 134.7279730902778,170.38775880855806 140.91276041666669,170.38775880855806 C147.09754774305557,170.38775880855806 153.28233506944446,171.4694838366037 159.46712239583334,172.41798939562977 C165.65190972222223,173.36649495465585 171.83669704861111,177.1729843832873 178.021484375,177.1729843832873 C184.20627170138889,177.1729843832873 190.3910590277778,174.7215709705521 196.57584635416669,172.5530222705251 C202.76063368055557,170.3844735704981 208.94542100694446,161.56078332389657 215.13020833333334,161.56078332389657 C221.31499565972223,161.56078332389657 227.49978298611111,171.1370681840353 233.6845703125,171.1370681840353 C239.86935763888889,171.1370681840353 246.0541449652778,170.88725102137704 252.23893229166669,170.45309201950832 C258.4237196180556,170.0189330176396 264.60850694444446,156.84700075078612 270.79329427083337,156.84700075078612 C276.97808159722223,156.84700075078612 283.16286892361114,174.0829766419065 289.34765625,174.0829766419065 C295.5324435763889,174.0829766419065 301.71723090277777,171.5781917260595 307.9020182291667,168.8920253992975 C314.0868055555556,166.2058590725355 320.27159288194446,153.43891051012255 326.45638020833337,150.88771611488693 C332.64116753472223,148.3365217196513 338.82595486111114,146.02799801023272 345.0107421875,146.02799801023272 C351.1955295138889,146.02799801023272 357.38031684027777,164.6350120745111 363.5651041666667,164.6350120745111 C369.7498914930556,164.6350120745111 375.93467881944446,140.42043513396675 382.11946614583337,137.9765300293455 C388.30425347222223,135.53262492472425 394.48904079861114,133.72620179898215 400.673828125,133.72620179898215 C406.8586154513889,133.72620179898215 413.04340277777777,141.64613191592866 419.2281901041667,141.64613191592866 C425.4129774305556,141.64613191592866 431.59776475694446,139.69953612312747 437.78255208333337,139.69953612312747 C443.96733940972223,139.69953612312747 450.15212673611114,169.39176477225985 456.3369140625,169.39176477225985 C462.5217013888889,169.39176477225985 468.70648871527777,166.8370171970348 474.8912760416667,163.2533085704992 C481.0760633680556,159.6695999439636 487.26085069444446,134.41776952349974 493.44563802083337,120 L493.44563802083337,180 ",
+					"stroke-linecap": "round",
+					"stroke-linejoin": "round"
+				}, null, 8, D)
+			], 12, se)) : l("", !0),
+			J.value === "historyPlot" ? (h(), u("svg", {
+				key: 2,
+				xmlns: v(i),
+				width: "100%",
+				viewBox: "0 0 612 512",
+				style: m(`background:${q.value.style.backgroundColor}`)
+			}, [
+				p(o),
+				d("line", {
+					x1: "12",
+					x2: "12",
+					y1: "12",
+					y2: "500",
+					stroke: q.value.style.historyPlot.color,
+					"stroke-width": "3",
+					"stroke-linecap": "round"
+				}, null, 8, k),
+				d("line", {
+					x1: "12",
+					x2: "600",
+					y1: "500",
+					y2: "500",
+					stroke: q.value.style.historyPlot.color,
+					"stroke-width": "3",
+					"stroke-linecap": "round"
+				}, null, 8, A),
+				d("path", {
+					d: "M 80,100 300,200 400,150 560,230 360,420 230,320",
+					fill: "none",
+					stroke: q.value.style.historyPlot.color,
+					"stroke-width": "3"
+				}, null, 8, j),
+				d("circle", {
+					cx: "80",
+					cy: "100",
+					r: "24",
+					fill: q.value.style.historyPlot.color,
+					stroke: q.value.style.backgroundColor,
+					"stroke-width": "3"
+				}, null, 8, M),
+				d("text", {
+					x: "80",
+					y: "108",
+					fill: q.value.style.backgroundColor,
+					"font-size": "24",
+					"text-anchor": "middle"
+				}, " 1 ", 8, N),
+				d("circle", {
+					cx: "300",
+					cy: "200",
+					r: "24",
+					fill: q.value.style.historyPlot.color,
+					stroke: q.value.style.backgroundColor,
+					"stroke-width": "3"
+				}, null, 8, P),
+				d("text", {
+					x: "300",
+					y: "208",
+					fill: q.value.style.backgroundColor,
+					"font-size": "24",
+					"text-anchor": "middle"
+				}, " 2 ", 8, F),
+				d("circle", {
+					cx: "400",
+					cy: "150",
+					r: "24",
+					fill: q.value.style.historyPlot.color,
+					stroke: q.value.style.backgroundColor,
+					"stroke-width": "3"
+				}, null, 8, I),
+				d("text", {
+					x: "400",
+					y: "158",
+					fill: q.value.style.backgroundColor,
+					"font-size": "24",
+					"text-anchor": "middle"
+				}, " 3 ", 8, L),
+				d("circle", {
+					cx: "560",
+					cy: "230",
+					r: "24",
+					fill: q.value.style.historyPlot.color,
+					stroke: q.value.style.backgroundColor,
+					"stroke-width": "3"
+				}, null, 8, R),
+				d("text", {
+					x: "560",
+					y: "238",
+					fill: q.value.style.backgroundColor,
+					"font-size": "24",
+					"text-anchor": "middle"
+				}, " 4 ", 8, z),
+				d("circle", {
+					cx: "360",
+					cy: "420",
+					r: "24",
+					fill: q.value.style.historyPlot.color,
+					stroke: q.value.style.backgroundColor,
+					"stroke-width": "3"
+				}, null, 8, B),
+				d("text", {
+					x: "360",
+					y: "428",
+					fill: q.value.style.backgroundColor,
+					"font-size": "24",
+					"text-anchor": "middle"
+				}, " 5 ", 8, V),
+				d("circle", {
+					cx: "230",
+					cy: "320",
+					r: "24",
+					fill: q.value.style.historyPlot.color,
+					stroke: q.value.style.backgroundColor,
+					"stroke-width": "3"
+				}, null, 8, H),
+				d("text", {
+					x: "230",
+					y: "328",
+					fill: q.value.style.backgroundColor,
+					"font-size": "24",
+					"text-anchor": "middle"
+				}, " 6 ", 8, U)
+			], 12, O)) : l("", !0),
+			J.value === "circlePack" ? (h(), u("svg", {
+				key: 3,
+				xmlns: v(i),
+				width: "100%",
+				viewBox: "0 0 100 100",
+				style: m(`background:${q.value.style.backgroundColor}`)
+			}, [
+				d("circle", {
+					cx: 50,
+					cy: 50,
+					r: 20,
+					stroke: q.value.style.circlePack.color,
+					"stroke-width": 1,
+					fill: "none"
+				}, null, 8, ue),
+				d("circle", {
+					cx: 80,
+					cy: 50,
+					r: 10,
+					stroke: q.value.style.circlePack.color,
+					"stroke-width": 1,
+					fill: "none"
+				}, null, 8, de),
+				d("circle", {
+					cx: 28,
+					cy: 30,
+					r: 10,
+					stroke: q.value.style.circlePack.color,
+					"stroke-width": 1,
+					fill: "none"
+				}, null, 8, fe),
+				d("circle", {
+					cx: 25,
+					cy: 76,
+					r: 16,
+					stroke: q.value.style.circlePack.color,
+					"stroke-width": 1,
+					fill: "none"
+				}, null, 8, pe),
+				d("circle", {
+					cx: 60,
+					cy: 78.5,
+					r: 10,
+					stroke: q.value.style.circlePack.color,
+					"stroke-width": 1,
+					fill: "none"
+				}, null, 8, me),
+				d("circle", {
+					cx: 64,
+					cy: 20,
+					r: 13,
+					stroke: q.value.style.circlePack.color,
+					"stroke-width": 1,
+					fill: "none"
+				}, null, 8, he),
+				d("circle", {
+					cx: 72,
+					cy: 37,
+					r: 5,
+					stroke: q.value.style.circlePack.color,
+					"stroke-width": 1,
+					fill: "none"
+				}, null, 8, ge),
+				d("circle", {
+					cx: 25,
+					cy: 45,
+					r: 5,
+					stroke: q.value.style.circlePack.color,
+					"stroke-width": 1,
+					fill: "none"
+				}, null, 8, _e),
+				d("circle", {
+					cx: 70,
+					cy: 66,
+					r: 5,
+					stroke: q.value.style.circlePack.color,
+					"stroke-width": 1,
+					fill: "none"
+				}, null, 8, ve)
+			], 12, W)) : l("", !0),
+			J.value === "flow" ? (h(), u("svg", {
+				key: 4,
+				xmlns: v(i),
+				width: "100%",
+				viewBox: "0 0 80 60",
+				style: m(`background:${q.value.style.backgroundColor}`)
+			}, [p(o), d("path", {
+				d: "M 5 5 L 5 55 M 75 5 L 75 55 M 28 5 L 28 55 M 52 5 L 52 55 M 5 8 L 28 12 L 52 9 L 75 8 L 75 12 L 52 12 L 28 21 L 5 29 Z M 5 34 L 28 35 L 52 24 L 75 21 L 75 27 L 52 30 L 28 44 L 52 39 L 75 41 L 75 47 L 52 45 L 28 52 L 5 52 Z",
+				stroke: q.value.style.flow.color,
+				"stroke-width": .8,
+				"stroke-linecap": "round",
+				"stroke-linejoin": "round",
+				fill: q.value.style.flow.color
+			}, null, 8, be)], 12, ye)) : l("", !0),
+			J.value === "parallelCoordinatePlot" ? (h(), u("svg", {
+				key: 5,
+				xmlns: v(i),
+				width: "100%",
+				viewBox: "0 0 80 60",
+				style: m(`background:${q.value.style.backgroundColor}`)
+			}, [p(o), d("path", {
+				d: "M 5 5 L 5 55 M 75 5 L 75 55 M 28 5 L 28 55 M 52 5 L 52 55 M 5 10 A 1 1 0 0 0 5 12 A 1 1 0 0 0 5 10 M 28 15 A 1 1 0 0 0 28 17 A 1 1 0 0 0 28 15 M 52 8 A 1 1 0 0 0 52 10 A 1 1 0 0 0 52 8 M 75 11 A 1 1 0 0 0 75 13 A 1 1 0 0 0 75 11 M 6 11 L 27 16 M 29 16 L 51 9 M 53 9 L 74 12 M 5 50 A 1 1 0 0 0 5 48 A 1 1 0 0 0 5 50 M 28 39 A 1 1 0 0 0 28 41 A 1 1 0 0 0 28 39 M 52 45 A 1 1 0 0 0 52 47 A 1 1 0 0 0 52 45 M 75 45 A 1 1 0 0 0 75 47 A 1 1 0 0 0 75 45 M 6 49 L 27 40 M 29 40 L 51 46 M 53 46 L 74 46 M 5 25 A 1 1 0 0 0 5 27 A 1 1 0 0 0 5 25 M 28 31 A 1 1 0 0 0 28 33 A 1 1 0 0 0 28 31 M 52 23 A 1 1 0 0 0 52 25 A 1 1 0 0 0 52 23 M 75 21 A 1 1 0 0 0 75 23 A 1 1 0 0 0 75 21 M 6 26 L 27 32 M 29 32 L 51 24 M 53 24 L 74 22",
+				stroke: q.value.style.parallelCoordinatePlot.color,
+				"stroke-width": .8,
+				"stroke-linecap": "round",
+				"stroke-linejoin": "round",
+				fill: q.value.style.parallelCoordinatePlot.color
+			}, null, 8, Se)], 12, xe)) : l("", !0),
+			J.value === "bullet" ? (h(), u("svg", {
+				key: 6,
+				xmlns: v(i),
+				width: "100%",
+				viewBox: "0 0 600 96",
+				style: m(`background:${q.value.style.backgroundColor}`)
+			}, [
+				d("rect", {
+					fill: q.value.style.bullet.color,
+					x: 24,
+					y: 12,
+					width: 300,
+					height: 72,
+					style: { opacity: "0.8" }
+				}, null, 8, we),
+				d("rect", {
+					fill: q.value.style.bullet.color,
+					x: 324,
+					y: 12,
+					width: 150,
+					height: 72,
+					style: { opacity: "0.6" }
+				}, null, 8, Te),
+				d("rect", {
+					fill: q.value.style.bullet.color,
+					x: 474,
+					y: 12,
+					width: 102,
+					height: 72,
+					style: { opacity: "0.3" }
+				}, null, 8, Ee),
+				d("rect", {
+					fill: q.value.style.bullet.color,
+					x: 24,
+					y: 36,
+					width: 490,
+					height: 24,
+					style: { opacity: "1" }
+				}, null, 8, De)
+			], 12, Ce)) : l("", !0),
+			J.value === "dumbbell" ? (h(), u("svg", {
+				key: 7,
+				xmlns: v(i),
+				width: "100%",
+				viewBox: "0 0 100 55",
+				style: m(`background:${q.value.style.backgroundColor}`)
+			}, [
+				p(o),
+				d("line", {
+					x1: "3",
+					x2: "3",
+					y1: "3",
+					y2: "67",
+					stroke: q.value.style.dumbbell.color,
+					"stroke-width": .5,
+					"stroke-linecap": "round",
+					"stroke-linejoin": "round"
+				}, null, 8, ke),
+				d("path", {
+					d: "\n                    M 30,11\n                    C 39,10 39,10\n                    45,11\n                    L 45,9\n                    C 39,10 39,10\n                    30,9 Z\n                ",
+					fill: q.value.style.dumbbell.color
+				}, null, 8, Ae),
+				d("circle", {
+					cx: "30",
+					cy: "10",
+					r: "2",
+					stroke: q.value.style.backgroundColor,
+					"stroke-width": .3,
+					fill: q.value.style.dumbbell.color
+				}, null, 8, je),
+				d("circle", {
+					cx: "46",
+					cy: "10",
+					r: "2",
+					stroke: q.value.style.backgroundColor,
+					"stroke-width": .3,
+					fill: q.value.style.dumbbell.color
+				}, null, 8, Me),
+				d("path", {
+					d: "\n                    M 10,21\n                    C 23,20 23,20\n                    36,21\n                    L 36,19\n                    C 23,20 23,20\n                    10,19 Z\n                ",
+					fill: q.value.style.dumbbell.color
+				}, null, 8, Ne),
+				d("circle", {
+					cx: "10",
+					cy: "20",
+					r: "2",
+					stroke: q.value.style.backgroundColor,
+					"stroke-width": .3,
+					fill: q.value.style.dumbbell.color
+				}, null, 8, Pe),
+				d("circle", {
+					cx: "36",
+					cy: "20",
+					r: "2",
+					stroke: q.value.style.backgroundColor,
+					"stroke-width": .3,
+					fill: q.value.style.dumbbell.color
+				}, null, 8, Fe),
+				d("path", {
+					d: "\n                    M 30,31\n                    C 45,30 45,30\n                    60,31\n                    L 60,29\n                    C 45,30 45,30\n                    30,29 Z\n                ",
+					fill: q.value.style.dumbbell.color
+				}, null, 8, Ie),
+				d("circle", {
+					cx: "30",
+					cy: "30",
+					r: "2",
+					stroke: q.value.style.backgroundColor,
+					"stroke-width": .3,
+					fill: q.value.style.dumbbell.color
+				}, null, 8, Le),
+				d("circle", {
+					cx: "60",
+					cy: "30",
+					r: "2",
+					stroke: q.value.style.backgroundColor,
+					"stroke-width": .3,
+					fill: q.value.style.dumbbell.color
+				}, null, 8, Re),
+				d("path", {
+					d: "\n                    M 50,41\n                    C 65,40 65,40\n                    80,41\n                    L 80,39\n                    C 65,40 65,40\n                    50,39 Z\n                ",
+					fill: q.value.style.dumbbell.color
+				}, null, 8, ze),
+				d("circle", {
+					cx: "50",
+					cy: "40",
+					r: "2",
+					stroke: q.value.style.backgroundColor,
+					"stroke-width": .3,
+					fill: q.value.style.dumbbell.color
+				}, null, 8, Be),
+				d("circle", {
+					cx: "80",
+					cy: "40",
+					r: "2",
+					stroke: q.value.style.backgroundColor,
+					"stroke-width": .3,
+					fill: q.value.style.dumbbell.color
+				}, null, 8, Ve),
+				d("path", {
+					d: "\n                    M 40,51\n                    C 65,50 65,50\n                    90,51\n                    L 90,49\n                    C 65,50 65,50\n                    40,49 Z\n                ",
+					fill: q.value.style.dumbbell.color
+				}, null, 8, He),
+				d("circle", {
+					cx: "40",
+					cy: "50",
+					r: "2",
+					stroke: q.value.style.backgroundColor,
+					"stroke-width": .3,
+					fill: q.value.style.dumbbell.color
+				}, null, 8, Ue),
+				d("circle", {
+					cx: "90",
+					cy: "50",
+					r: "2",
+					stroke: q.value.style.backgroundColor,
+					"stroke-width": .3,
+					fill: q.value.style.dumbbell.color
+				}, null, 8, We)
+			], 12, Oe)) : l("", !0),
+			J.value === "stripPlot" ? (h(), u("svg", {
+				key: 8,
+				xmlns: v(i),
+				width: "100%",
+				viewBox: "0 0 100 100",
+				style: m(`background:${q.value.style.backgroundColor}`)
+			}, [
+				p(o),
+				d("line", {
+					x1: "3",
+					x2: "3",
+					y1: "3",
+					y2: "97",
+					stroke: q.value.style.stripPlot.color,
+					"stroke-width": .5,
+					"stroke-linecap": "round",
+					"stroke-linejoin": "round"
+				}, null, 8, Ke),
+				d("line", {
+					x1: "3",
+					x2: "97",
+					y1: "97",
+					y2: "97",
+					stroke: q.value.style.stripPlot.color,
+					"stroke-width": .5,
+					"stroke-linecap": "round",
+					"stroke-linejoin": "round"
+				}, null, 8, qe),
+				d("circle", {
+					cx: "12",
+					cy: "8",
+					r: "4",
+					stroke: q.value.style.backgroundColor,
+					"stroke-width": .3,
+					fill: q.value.style.stripPlot.color,
+					style: { opacity: "0.5" }
+				}, null, 8, Je),
+				d("circle", {
+					cx: "12",
+					cy: "40",
+					r: "4",
+					stroke: q.value.style.backgroundColor,
+					"stroke-width": .3,
+					fill: q.value.style.stripPlot.color,
+					style: { opacity: "0.5" }
+				}, null, 8, Ye),
+				d("circle", {
+					cx: "12",
+					cy: "60",
+					r: "4",
+					stroke: q.value.style.backgroundColor,
+					"stroke-width": .3,
+					fill: q.value.style.stripPlot.color,
+					style: { opacity: "0.5" }
+				}, null, 8, Xe),
+				d("circle", {
+					cx: "12",
+					cy: "70",
+					r: "4",
+					stroke: q.value.style.backgroundColor,
+					"stroke-width": .3,
+					fill: q.value.style.stripPlot.color,
+					style: { opacity: "0.5" }
+				}, null, 8, Ze),
+				d("circle", {
+					cx: "32",
+					cy: "25",
+					r: "4",
+					stroke: q.value.style.backgroundColor,
+					"stroke-width": .3,
+					fill: q.value.style.stripPlot.color,
+					style: { opacity: "0.5" }
+				}, null, 8, Qe),
+				d("circle", {
+					cx: "32",
+					cy: "38",
+					r: "4",
+					stroke: q.value.style.backgroundColor,
+					"stroke-width": .3,
+					fill: q.value.style.stripPlot.color,
+					style: { opacity: "0.5" }
+				}, null, 8, $e),
+				d("circle", {
+					cx: "32",
+					cy: "44",
+					r: "4",
+					stroke: q.value.style.backgroundColor,
+					"stroke-width": .3,
+					fill: q.value.style.stripPlot.color,
+					style: { opacity: "0.5" }
+				}, null, 8, et),
+				d("circle", {
+					cx: "32",
+					cy: "55",
+					r: "4",
+					stroke: q.value.style.backgroundColor,
+					"stroke-width": .3,
+					fill: q.value.style.stripPlot.color,
+					style: { opacity: "0.5" }
+				}, null, 8, tt),
+				d("circle", {
+					cx: "52",
+					cy: "30",
+					r: "4",
+					stroke: q.value.style.backgroundColor,
+					"stroke-width": .3,
+					fill: q.value.style.stripPlot.color,
+					style: { opacity: "0.5" }
+				}, null, 8, nt),
+				d("circle", {
+					cx: "52",
+					cy: "33",
+					r: "4",
+					stroke: q.value.style.backgroundColor,
+					"stroke-width": .3,
+					fill: q.value.style.stripPlot.color,
+					style: { opacity: "0.5" }
+				}, null, 8, rt),
+				d("circle", {
+					cx: "52",
+					cy: "43",
+					r: "4",
+					stroke: q.value.style.backgroundColor,
+					"stroke-width": .3,
+					fill: q.value.style.stripPlot.color,
+					style: { opacity: "0.5" }
+				}, null, 8, it),
+				d("circle", {
+					cx: "52",
+					cy: "63",
+					r: "4",
+					stroke: q.value.style.backgroundColor,
+					"stroke-width": .3,
+					fill: q.value.style.stripPlot.color,
+					style: { opacity: "0.5" }
+				}, null, 8, at),
+				d("circle", {
+					cx: "52",
+					cy: "78",
+					r: "4",
+					stroke: q.value.style.backgroundColor,
+					"stroke-width": .3,
+					fill: q.value.style.stripPlot.color,
+					style: { opacity: "0.5" }
+				}, null, 8, ot),
+				d("circle", {
+					cx: "72",
+					cy: "58",
+					r: "4",
+					stroke: q.value.style.backgroundColor,
+					"stroke-width": .3,
+					fill: q.value.style.stripPlot.color,
+					style: { opacity: "0.5" }
+				}, null, 8, st),
+				d("circle", {
+					cx: "72",
+					cy: "70",
+					r: "4",
+					stroke: q.value.style.backgroundColor,
+					"stroke-width": .3,
+					fill: q.value.style.stripPlot.color,
+					style: { opacity: "0.5" }
+				}, null, 8, ct),
+				d("circle", {
+					cx: "72",
+					cy: "78",
+					r: "4",
+					stroke: q.value.style.backgroundColor,
+					"stroke-width": .3,
+					fill: q.value.style.stripPlot.color,
+					style: { opacity: "0.5" }
+				}, null, 8, lt),
+				d("circle", {
+					cx: "72",
+					cy: "88",
+					r: "4",
+					stroke: q.value.style.backgroundColor,
+					"stroke-width": .3,
+					fill: q.value.style.stripPlot.color,
+					style: { opacity: "0.5" }
+				}, null, 8, ut),
+				d("circle", {
+					cx: "92",
+					cy: "66",
+					r: "4",
+					stroke: q.value.style.backgroundColor,
+					"stroke-width": .3,
+					fill: q.value.style.stripPlot.color,
+					style: { opacity: "0.5" }
+				}, null, 8, dt),
+				d("circle", {
+					cx: "92",
+					cy: "77",
+					r: "4",
+					stroke: q.value.style.backgroundColor,
+					"stroke-width": .3,
+					fill: q.value.style.stripPlot.color,
+					style: { opacity: "0.5" }
+				}, null, 8, ft),
+				d("circle", {
+					cx: "92",
+					cy: "85",
+					r: "4",
+					stroke: q.value.style.backgroundColor,
+					"stroke-width": .3,
+					fill: q.value.style.stripPlot.color,
+					style: { opacity: "0.5" }
+				}, null, 8, pt),
+				d("circle", {
+					cx: "92",
+					cy: "88",
+					r: "4",
+					stroke: q.value.style.backgroundColor,
+					"stroke-width": .3,
+					fill: q.value.style.stripPlot.color,
+					style: { opacity: "0.5" }
+				}, null, 8, mt),
+				d("circle", {
+					cx: "92",
+					cy: "90",
+					r: "4",
+					stroke: q.value.style.backgroundColor,
+					"stroke-width": .3,
+					fill: q.value.style.stripPlot.color,
+					style: { opacity: "0.5" }
+				}, null, 8, ht),
+				d("circle", {
+					cx: "92",
+					cy: "92",
+					r: "4",
+					stroke: q.value.style.backgroundColor,
+					"stroke-width": .3,
+					fill: q.value.style.stripPlot.color,
+					style: { opacity: "0.5" }
+				}, null, 8, gt)
+			], 12, Ge)) : l("", !0),
+			J.value === "treemap" ? (h(), u("svg", {
+				key: 9,
+				xmlns: v(i),
+				width: "100%",
+				viewBox: "0 0 30 21",
+				style: m(`background:${q.value.style.backgroundColor}`)
+			}, [p(o), d("path", {
+				fill: "none",
+				stroke: q.value.style.treemap.color,
+				"stroke-width": "0.3",
+				"stroke-linecap": "round",
+				"stroke-linejoin": "round",
+				d: "M 1 1 L 29 1 L 29 20 L 1 20 Z M 10 1 L 10 20 M 1 13 L 10 13 M 22 11 L 22 20 M 10 11 L 22 11 M 22 11 L 29 11 M 7 13 L 7 20 M 17 11 L 17 20 M 22 15 L 29 15 M 26 15 L 26 20 M 20 1 L 20 11"
+			}, null, 8, vt)], 12, _t)) : l("", !0),
+			J.value === "galaxy" ? (h(), u("svg", {
+				key: 10,
+				xmlns: v(i),
+				width: "100%",
+				viewBox: "0.5 0 20 20",
+				style: m(`background:${q.value.style.backgroundColor}`)
+			}, [p(o), d("path", {
+				fill: "none",
+				stroke: q.value.style.galaxy.color,
+				"stroke-width": "2",
+				"stroke-linecap": "round",
+				d: "M 7 11 A 1 1 0 0 0 11 11 M 14 11 A 1 1 0 0 0 7 11 M 3 11 A 1 1 0 0 0 14 11 M 18 11 A 1 1 0 0 0 3 11 M 16.4 16 C 17 15 18 13 18 11"
+			}, null, 8, bt)], 12, yt)) : l("", !0),
+			J.value === "bar3d" ? (h(), u("svg", {
+				key: 11,
+				xmlns: v(i),
+				width: "100%",
+				viewBox: "2 0 16 20",
+				style: m(`background:${q.value.style.backgroundColor}`)
+			}, [p(o), d("path", {
+				fill: "none",
+				stroke: q.value.style.bar3d.color,
+				"stroke-width": "0.2",
+				d: "M10 1 6 3 6 17 10 19 14 17 14 3 10 1M6 3 10 5 14 3M10 5 10 19",
+				"stroke-linecap": "round",
+				"stroke-linejoin": "round"
+			}, null, 8, St)], 12, xt)) : l("", !0),
+			J.value === "sparkHistogram" ? (h(), u("svg", {
+				key: 12,
+				xmlns: v(i),
+				width: "100%",
+				viewBox: "0 0 100 20",
+				style: m(`background:${q.value.style.backgroundColor}`)
+			}, [
+				p(o),
+				d("rect", {
+					x: "3",
+					y: "8",
+					height: "4",
+					width: "6",
+					rx: "1.5",
+					fill: q.value.style.sparkHistogram.color
+				}, null, 8, wt),
+				d("rect", {
+					x: "11",
+					y: "6",
+					height: "8",
+					width: "6",
+					rx: "2",
+					fill: q.value.style.sparkHistogram.color
+				}, null, 8, Tt),
+				d("rect", {
+					x: "19",
+					y: "7",
+					height: "6",
+					width: "6",
+					rx: "2",
+					fill: q.value.style.sparkHistogram.color
+				}, null, 8, Et),
+				d("rect", {
+					x: "27",
+					y: "6",
+					height: "8",
+					width: "6",
+					rx: "2",
+					fill: q.value.style.sparkHistogram.color
+				}, null, 8, Dt),
+				d("rect", {
+					x: "35",
+					y: "8",
+					height: "4",
+					width: "6",
+					rx: "1.5",
+					fill: q.value.style.sparkHistogram.color
+				}, null, 8, Ot),
+				d("rect", {
+					x: "43",
+					y: "7",
+					height: "6",
+					width: "6",
+					rx: "2",
+					fill: q.value.style.sparkHistogram.color
+				}, null, 8, kt),
+				d("rect", {
+					x: "51",
+					y: "8.5",
+					height: "3",
+					width: "6",
+					rx: "1.5",
+					fill: q.value.style.sparkHistogram.color
+				}, null, 8, At),
+				d("rect", {
+					x: "59",
+					y: "7",
+					height: "6",
+					width: "6",
+					rx: "2",
+					fill: q.value.style.sparkHistogram.color
+				}, null, 8, jt),
+				d("rect", {
+					x: "67",
+					y: "6",
+					height: "8",
+					width: "6",
+					rx: "2",
+					fill: q.value.style.sparkHistogram.color
+				}, null, 8, Mt),
+				d("rect", {
+					x: "75",
+					y: "7",
+					height: "6",
+					width: "6",
+					rx: "2",
+					fill: q.value.style.sparkHistogram.color
+				}, null, 8, Nt),
+				d("rect", {
+					x: "83",
+					y: "7",
+					height: "6",
+					width: "6",
+					rx: "2",
+					fill: q.value.style.sparkHistogram.color
+				}, null, 8, Pt),
+				d("rect", {
+					x: "91",
+					y: "8",
+					height: "4",
+					width: "6",
+					rx: "1.5",
+					fill: q.value.style.sparkHistogram.color
+				}, null, 8, Ft)
+			], 12, Ct)) : l("", !0),
+			J.value === "sparkbar" ? (h(), u("svg", {
+				key: 13,
+				xmlns: v(i),
+				width: "100%",
+				viewBox: "0 0 500 200",
+				style: m(`background:${q.value.style.backgroundColor}`)
+			}, [
+				p(o),
+				d("line", {
+					x1: "12",
+					x2: "488",
+					y1: "50",
+					y2: "50",
+					"stroke-width": "16",
+					"stroke-linecap": "round",
+					stroke: q.value.style.sparkbar.color,
+					opacity: "0.5"
+				}, null, 8, Lt),
+				d("line", {
+					x1: "12",
+					x2: "400",
+					y1: "50",
+					y2: "50",
+					"stroke-width": "16",
+					"stroke-linecap": "round",
+					stroke: q.value.style.sparkbar.color,
+					opacity: "1"
+				}, null, 8, Rt),
+				d("line", {
+					x1: "12",
+					x2: "488",
+					y1: "100",
+					y2: "100",
+					"stroke-width": "16",
+					"stroke-linecap": "round",
+					stroke: q.value.style.sparkbar.color,
+					opacity: "0.5"
+				}, null, 8, zt),
+				d("line", {
+					x1: "12",
+					x2: "350",
+					y1: "100",
+					y2: "100",
+					"stroke-width": "16",
+					"stroke-linecap": "round",
+					stroke: q.value.style.sparkbar.color,
+					opacity: "1"
+				}, null, 8, Bt),
+				d("line", {
+					x1: "12",
+					x2: "488",
+					y1: "150",
+					y2: "150",
+					"stroke-width": "16",
+					"stroke-linecap": "round",
+					stroke: q.value.style.sparkbar.color,
+					opacity: "0.5"
+				}, null, 8, Vt),
+				d("line", {
+					x1: "12",
+					x2: "235",
+					y1: "150",
+					y2: "150",
+					"stroke-width": "16",
+					"stroke-linecap": "round",
+					stroke: q.value.style.sparkbar.color,
+					opacity: "1"
+				}, null, 8, Ht)
+			], 12, It)) : l("", !0),
+			J.value === "sparkStackbar" ? (h(), u("svg", {
+				key: 14,
+				xmlns: v(i),
+				width: "100%",
+				viewBox: "0 0 500 64",
+				style: m(`background:${q.value.style.backgroundColor}`)
+			}, [
+				p(o),
+				d("line", {
+					x1: "12",
+					x2: "488",
+					y1: "32",
+					y2: "32",
+					"stroke-width": "16",
+					"stroke-linecap": "round",
+					stroke: q.value.style.sparkStackbar.color,
+					opacity: "0.5"
+				}, null, 8, Wt),
+				d("line", {
+					x1: "12",
+					x2: "380",
+					y1: "32",
+					y2: "32",
+					"stroke-width": "16",
+					"stroke-linecap": "round",
+					stroke: q.value.style.sparkStackbar.color,
+					opacity: "0.6"
+				}, null, 8, Gt),
+				d("line", {
+					x1: "12",
+					x2: "200",
+					y1: "32",
+					y2: "32",
+					"stroke-width": "16",
+					"stroke-linecap": "round",
+					stroke: q.value.style.sparkStackbar.color,
+					opacity: "0.8"
+				}, null, 8, Kt),
+				d("line", {
+					x1: "12",
+					x2: "120",
+					y1: "32",
+					y2: "32",
+					"stroke-width": "16",
+					"stroke-linecap": "round",
+					stroke: q.value.style.sparkStackbar.color,
+					opacity: "1"
+				}, null, 8, qt)
+			], 12, Ut)) : l("", !0),
+			J.value === "thermometer" ? (h(), u("svg", {
+				key: 15,
+				width: "100%",
+				viewBox: "0 0 20 20",
+				style: m(`background:${q.value.style.backgroundColor}`)
+			}, [
+				p(o),
+				d("path", {
+					fill: "none",
+					stroke: q.value.style.thermometer.color,
+					"stroke-width": "0.2",
+					"stroke-linecap": "round",
+					d: "M 13 4 A 1 1 0 0 0 7 4 L 7 16 A 1 1 0 0 0 13 16 L 13 4 M 7 15 L 8 15 M 7 12 L 8 12 M 7 9 L 8 9 M 7 6 L 8 6 M 12 15 L 13 15 M 12 12 L 13 12 M 12 9 L 13 9 M 12 6 L 13 6 "
+				}, null, 8, Jt),
+				d("path", {
+					stroke: q.value.style.thermometer.color,
+					"stroke-width": "1",
+					style: { opacity: "0.6" },
+					d: "M 10 17 L 10 12 ",
+					"stroke-linecap": "round"
+				}, null, 8, Yt),
+				d("path", {
+					"stroke-linecap": "round",
+					stroke: q.value.style.thermometer.color,
+					"stroke-width": "1",
+					opacity: "M 10 17 L 10 9"
+				}, null, 8, Xt),
+				d("path", {
+					"stroke-linecap": "round",
+					stroke: q.value.style.thermometer.color,
+					"stroke-width": "1",
+					opacity: "0.3",
+					d: "M 10 17 L 10 6"
+				}, null, 8, Zt),
+				d("path", {
+					"stroke-linecap": "round",
+					stroke: q.value.style.thermometer.color,
+					"stroke-width": "1",
+					style: { opacity: "0.1" },
+					d: "M 10 17 L 10 3"
+				}, null, 8, Qt)
+			], 4)) : l("", !0),
+			J.value === "relationCircle" ? (h(), u("svg", {
+				key: 16,
+				xmlns: v(i),
+				width: "100%",
+				viewBox: "0 0 20 20",
+				style: m(`background:${q.value.style.backgroundColor}`)
+			}, [p(o), d("path", {
+				fill: "none",
+				stroke: q.value.style.relationCircle.color,
+				"stroke-width": "0.2",
+				"stroke-linecap": "round",
+				d: "M1 10A1 1 0 0019 10 1 1 0 001 10M1 10C7 11 9 13 10 19M10 19C10 11 8 7 6 2M10 19C10 11 12 7 14 2M10 19C11 13 12 11 19 10"
+			}, null, 8, en)], 12, $t)) : l("", !0),
+			J.value === "molecule" ? (h(), u("svg", {
+				key: 17,
+				xmlns: v(i),
+				width: "100%",
+				viewBox: "0 0 100 100",
+				style: m(`background:${q.value.style.backgroundColor}`)
+			}, [
+				p(o),
+				d("circle", {
+					cx: "50",
+					cy: "50",
+					r: "6",
+					"stroke-width": "2",
+					fill: "none",
+					stroke: q.value.style.molecule.color
+				}, null, 8, nn),
+				d("circle", {
+					cx: "20",
+					cy: "50",
+					r: "3",
+					"stroke-width": "1.6",
+					fill: "none",
+					stroke: q.value.style.molecule.color
+				}, null, 8, rn),
+				d("circle", {
+					cx: "80",
+					cy: "50",
+					r: "3",
+					"stroke-width": "1.6",
+					fill: "none",
+					stroke: q.value.style.molecule.color
+				}, null, 8, an),
+				d("circle", {
+					cx: "50",
+					cy: "20",
+					r: "3",
+					"stroke-width": "1.6",
+					fill: "none",
+					stroke: q.value.style.molecule.color
+				}, null, 8, on),
+				d("circle", {
+					cx: "50",
+					cy: "80",
+					r: "3",
+					"stroke-width": "1.6",
+					fill: "none",
+					stroke: q.value.style.molecule.color
+				}, null, 8, sn),
+				d("line", {
+					x1: "50",
+					x2: "50",
+					y1: "23",
+					y2: "45",
+					"stroke-width": "1",
+					stroke: q.value.style.molecule.color
+				}, null, 8, cn),
+				d("line", {
+					x1: "50",
+					x2: "50",
+					y1: "77",
+					y2: "55",
+					"stroke-width": "1",
+					stroke: q.value.style.molecule.color
+				}, null, 8, ln),
+				d("line", {
+					x1: "23",
+					x2: "45",
+					y1: "50",
+					y2: "50",
+					"stroke-width": "1",
+					stroke: q.value.style.molecule.color
+				}, null, 8, un),
+				d("line", {
+					x1: "77",
+					x2: "55",
+					y1: "50",
+					y2: "50",
+					"stroke-width": "1",
+					stroke: q.value.style.molecule.color
+				}, null, 8, dn)
+			], 12, tn)) : l("", !0),
+			J.value === "tiremarks" ? (h(), u("svg", {
+				key: 18,
+				xmlns: v(i),
+				width: "100%",
+				viewBox: "0 0 312 56",
+				style: m(`background:${q.value.style.backgroundColor}`)
+			}, [p(o), (h(), u(s, null, _(100, (e) => d("g", null, [d("line", {
+				x1: 10 + e * 2.9,
+				y1: 6,
+				x2: 10 + e * 2.9,
+				y2: 50,
+				stroke: q.value.style.tiremarks.color,
+				style: m(e > 80 ? "opacity: 0.5" : ""),
+				"stroke-linecap": "round"
+			}, null, 12, fn)])), 64))], 12, G)) : l("", !0),
+			J.value === "pyramid" ? (h(), u("svg", {
+				key: 19,
+				xmlns: v(i),
+				width: "100%",
+				viewBox: "0 0 105 80",
+				style: m(`background:${q.value.style.backgroundColor}`)
+			}, [p(o), (h(!0), u(s, null, _(Z.value, (e, t) => (h(), u("g", null, [d("rect", {
+				x: 50 - e[0],
+				y: t * (80 / Z.value.length),
+				width: e[0],
+				height: 80 / Z.value.length * .95,
+				fill: q.value.style.pyramid.color
+			}, null, 8, mn), d("rect", {
+				x: 55,
+				y: t * (80 / Z.value.length),
+				width: e[1],
+				height: 80 / Z.value.length * .95,
+				fill: q.value.style.pyramid.color
+			}, null, 8, hn)]))), 256))], 12, pn)) : l("", !0),
+			J.value === "rings" ? (h(), u("svg", {
+				key: 20,
+				xmlns: v(i),
+				width: "100%",
+				viewBox: "0 0 400 400",
+				style: m(`background:${q.value.style.backgroundColor}`)
+			}, [
+				p(o),
+				d("circle", {
+					cx: 200,
+					cy: 200,
+					r: 180,
+					fill: v(r)(q.value.style.rings.color, 40)
+				}, null, 8, _n),
+				d("circle", {
+					cx: 200,
+					cy: 250,
+					r: 130,
+					fill: v(r)(q.value.style.rings.color, 60)
+				}, null, 8, vn),
+				d("circle", {
+					cx: 200,
+					cy: 290,
+					r: 90,
+					fill: v(r)(q.value.style.rings.color, 100)
+				}, null, 8, yn)
+			], 12, gn)) : l("", !0),
+			J.value === "wheel" ? (h(), u("svg", {
+				key: 21,
+				xmlns: v(i),
+				width: "100%",
+				viewBox: "0 0 400 400",
+				style: m(`background:${q.value.style.backgroundColor}`)
+			}, [
+				p(o),
+				(h(!0), u(s, null, _(Ai.value, (e, t) => (h(), u("line", {
+					x1: e.x1,
+					x2: e.x2,
+					y1: e.y1,
+					y2: e.y2,
+					stroke: t < 66 ? e.color : v(r)(e.color, 50),
+					"stroke-width": 5,
+					"stroke-linecap": "round"
+				}, null, 8, xn))), 256)),
+				d("circle", {
+					cx: 200,
+					cy: 200,
+					r: 130,
+					"stroke-width": 3,
+					stroke: v(r)(q.value.style.wheel.color, 50),
+					fill: "none"
+				}, null, 8, Sn),
+				d("rect", {
+					fill: v(r)(q.value.style.wheel.color, 50),
+					rx: 12,
+					x: 160,
+					y: 170,
+					height: 60,
+					width: 80,
+					stroke: "none"
+				}, null, 8, Cn)
+			], 12, bn)) : l("", !0),
+			J.value === "sparkline" ? (h(), u("svg", {
+				key: 22,
+				xmlns: v(i),
+				width: "100%",
+				viewBox: "0 0 150 32",
+				style: m(`background:${q.value.style.backgroundColor}`)
+			}, [
+				p(o),
+				d("g", null, [d("rect", {
+					x: "2",
+					y: "2",
+					height: "6",
+					width: "24",
+					fill: q.value.style.sparkline.color,
+					rx: "3"
+				}, null, 8, Tn), d("rect", {
+					x: "2",
+					y: "12",
+					height: "16",
+					width: "16",
+					fill: q.value.style.sparkline.color,
+					rx: "3"
+				}, null, 8, En)]),
+				(h(!0), u(s, null, _(Q.value, (e, t) => (h(), u("g", null, [t < Q.value.length - 1 ? (h(), u("line", {
+					key: 0,
+					x1: e.x,
+					y1: e.y,
+					x2: Q.value[t + 1].x,
+					y2: Q.value[t + 1].y,
+					"stroke-width": q.value.style.sparkline.strokeWidth,
+					stroke: q.value.style.sparkline.color,
+					"stroke-linecap": "round",
+					"stroke-linejoin": "round"
+				}, null, 8, Dn)) : l("", !0)]))), 256))
+			], 12, wn)) : l("", !0),
+			J.value === "candlesticks" ? (h(), u("svg", {
+				key: 23,
+				xmlns: v(i),
+				width: "100%",
+				viewBox: "0 0 512 316",
+				style: m(`background:${q.value.style.backgroundColor}`)
+			}, [
+				p(o),
+				q.value.style.candlesticks.axis.show ? (h(), u("g", kn, [d("line", {
+					x1: 2,
+					x2: 2,
+					y1: 2,
+					y2: 314,
+					stroke: q.value.style.candlesticks.axis.color,
+					"stroke-width": q.value.style.candlesticks.axis.strokeWidth,
+					"stroke-linecap": "round"
+				}, null, 8, An), d("line", {
+					x1: 2,
+					x2: 510,
+					y1: 314,
+					y2: 314,
+					stroke: q.value.style.candlesticks.axis.color,
+					"stroke-width": q.value.style.candlesticks.axis.strokeWidth,
+					"stroke-linecap": "round"
+				}, null, 8, jn)])) : l("", !0),
+				(h(!0), u(s, null, _(X.value, (e, t) => (h(), u("g", null, [
+					d("line", {
+						x1: 24 + 464 * t / (X.value.length - 1) - 464 / (X.value.length - 1) / 8,
+						x2: 24 + 464 * t / (X.value.length - 1) + 464 / (X.value.length - 1) / 8,
+						y1: e.y,
+						y2: e.y,
+						stroke: q.value.style.candlesticks.candle.color,
+						"stroke-width": q.value.style.candlesticks.candle.strokeWidth,
+						"stroke-linecap": "round"
+					}, null, 8, Mn),
+					d("line", {
+						x1: 24 + 464 * t / (X.value.length - 1) - 464 / (X.value.length - 1) / 8,
+						x2: 24 + 464 * t / (X.value.length - 1) + 464 / (X.value.length - 1) / 8,
+						y1: e.y + e.height,
+						y2: e.y + e.height,
+						stroke: q.value.style.candlesticks.candle.color,
+						"stroke-width": q.value.style.candlesticks.candle.strokeWidth,
+						"stroke-linecap": "round"
+					}, null, 8, Nn),
+					d("line", {
+						x1: 24 + 464 * t / (X.value.length - 1),
+						x2: 24 + 464 * t / (X.value.length - 1),
+						y1: e.y,
+						y2: e.y + e.height,
+						stroke: q.value.style.candlesticks.candle.color,
+						"stroke-width": q.value.style.candlesticks.candle.strokeWidth,
+						"stroke-linecap": "round"
+					}, null, 8, Pn),
+					d("rect", {
+						x: 24 + 464 * t / (X.value.length - 1) - 464 / (X.value.length - 1) / 8,
+						y: e.y + (e.height - e.bar * 1.5),
+						height: e.bar,
+						width: 464 / (X.value.length - 1) / 4,
+						fill: q.value.style.candlesticks.candle.color,
+						rx: "1"
+					}, null, 8, Fn)
+				]))), 256))
+			], 12, On)) : l("", !0),
+			J.value === "heatmap" ? (h(), u("svg", {
+				key: 24,
+				xmlns: v(i),
+				width: "100%",
+				viewBox: `0 0 ${10 * q.value.style.heatmap.cellsX} ${10 * q.value.style.heatmap.cellsY}`,
+				style: m(`background:${q.value.style.backgroundColor}`)
+			}, [p(o), (h(!0), u(s, null, _(q.value.style.heatmap.cellsY, (e, t) => (h(), u("g", null, [(h(!0), u(s, null, _(q.value.style.heatmap.cellsX, (e, n) => (h(), u("g", null, [d("rect", {
+				x: n * 10,
+				y: t * 10,
+				height: 10,
+				width: 10,
+				stroke: q.value.style.backgroundColor,
+				"stroke-width": 1,
+				fill: v(r)(q.value.style.heatmap.color, Math.round(Math.random() * 100))
+			}, null, 8, Ln)]))), 256))]))), 256))], 12, In)) : l("", !0),
+			J.value === "chestnut" ? (h(), u("svg", {
+				key: 25,
+				xmlns: v(i),
+				width: "100%",
+				viewBox: "0 0 512 316",
+				style: m(`background:${q.value.style.backgroundColor}`)
+			}, [
+				p(o),
+				(h(!0), u(s, null, _(Y.value, (e) => (h(), u("g", null, [(h(!0), u(s, null, _(e.bars, (t) => (h(), u("g", null, [(h(), u(s, null, _(22, (n, i) => d("path", {
+					d: `M
+                            ${t.x},${t.y + i}
+                            C${t.x - 20},${t.y + i} 
+                            ${t.x - 80},${t.y + i} 
+                            ${e.root.x + e.root.r / 2}, ${e.root.y}
+                        `,
+					stroke: v(r)(q.value.style.chestnut.color, t.opacity * .2),
+					fill: "none",
+					"stroke-width": "2",
+					"shape-rendering": "cirspEdges"
+				}, null, 8, zn)), 64))]))), 256))]))), 256)),
+				(h(!0), u(s, null, _(Y.value, (e) => (h(), u("circle", {
+					cx: e.root.x,
+					cy: e.root.y,
+					r: e.root.r,
+					fill: `${q.value.style.backgroundColor}`,
+					stroke: q.value.backgroundColor,
+					"stroke-width": 3
+				}, null, 8, Bn))), 256)),
+				(h(!0), u(s, null, _(Y.value, (e) => (h(), u("circle", {
+					cx: e.root.x,
+					cy: e.root.y,
+					r: e.root.r,
+					fill: v(r)(q.value.style.chestnut.color, e.root.opacity),
+					stroke: q.value.style.backgroundColor,
+					"stroke-width": 3
+				}, null, 8, Vn))), 256)),
+				(h(!0), u(s, null, _(Y.value, (e) => (h(), u("g", null, [
+					(h(!0), u(s, null, _(e.bars, (e) => (h(), u("rect", {
+						rx: "2",
+						x: e.x,
+						y: e.y,
+						width: e.width,
+						height: 22,
+						fill: v(r)(q.value.style.chestnut.color, e.opacity)
+					}, null, 8, Hn))), 256)),
+					(h(!0), u(s, null, _(e.bars, (e) => (h(), u("circle", {
+						cx: e.x + e.width + 32,
+						cy: e.y + 11,
+						r: 11,
+						fill: v(r)(q.value.style.chestnut.color, e.opacity)
+					}, null, 8, Un))), 256)),
+					(h(!0), u(s, null, _(e.bars, (e) => (h(), u("circle", {
+						cx: e.x + e.width + 32,
+						cy: e.y + 11,
+						r: 5,
+						fill: q.value.style.backgroundColor
+					}, null, 8, Wn))), 256))
+				]))), 256)),
+				d("line", {
+					x1: 200,
+					x2: 200,
+					y1: 10,
+					y2: 300,
+					stroke: q.value.style.backgroundColor,
+					"stroke-width": 3
+				}, null, 8, Gn)
+			], 12, Rn)) : l("", !0),
+			J.value === "donutEvolution" ? (h(), u("svg", {
+				key: 26,
+				xmlns: v(i),
+				width: "100%",
+				viewBox: "0 0 108 70",
+				style: m(`background:${q.value.style.backgroundColor}`)
+			}, [
+				p(o),
+				q.value.style.line.axis.show ? (h(), u("path", {
+					key: 0,
+					d: "M3 3 3 67 105 67",
+					stroke: q.value.style.donutEvolution.axis.color,
+					"stroke-width": q.value.style.donutEvolution.axis.strokeWidth,
+					"stroke-linecap": "round",
+					"stroke-linejoin": "round",
+					fill: "none"
+				}, null, 8, qn)) : l("", !0),
+				d("path", {
+					fill: "none",
+					d: "M10 55A1 1 0 0020 55 1 1 0 0010 55M12 55A1 1 0 0018 55 1 1 0 0012 55M10 55 12 55M15 52 15 50M27 45A1 1 0 0037 45 1 1 0 0027 45M29 45A1 1 0 0035 45 1 1 0 0029 45M32 48 32 50M35 45 37 45M44 50A1 1 0 0054 50 1 1 0 0044 50M46 50A1 1 0 0052 50 1 1 0 0046 50M49 45 49 47M49 53 49 55M61 35A1 1 0 0071 35 1 1 0 0061 35M63 35A1 1 0 0069 35 1 1 0 0063 35M66 30 66 32M61 35 63 35M78 41A1 1 0 0088 41 1 1 0 0078 41M80 41A1 1 0 0086 41 1 1 0 0080 41M78 41 80 41M86 41 88 41M95 14A1 1 0 00105 14 1 1 0 0095 14M97 14A1 1 0 00103 14 1 1 0 0097 14M95 14 97 14M100 17 100 19",
+					stroke: q.value.style.donutEvolution.donuts.color,
+					"stroke-width": q.value.style.donutEvolution.donuts.strokeWidth
+				}, null, 8, Jn),
+				d("path", {
+					fill: "none",
+					d: "M19 52 27 45M37 45 44 49M52 46 62 38M71 36 78 40M86 37 97 18",
+					stroke: q.value.style.donutEvolution.axis.color,
+					"stroke-width": q.value.style.donutEvolution.axis.strokeWidth,
+					"stroke-linecap": "round",
+					"stroke-linejoin": "round"
+				}, null, 8, Yn),
+				d("path", {
+					d: "M10 55 12 55C12 53 14 52 15 52L15 50C13 50 10 52 10 55",
+					fill: q.value.style.donutEvolution.donuts.color,
+					stroke: "none",
+					style: { opacity: "0.3" }
+				}, null, 8, Xn),
+				d("path", {
+					d: "M32 48 32 50C35 50 37 47 37 45L35 45C35 47 33 48 32 48",
+					fill: q.value.style.donutEvolution.donuts.color,
+					stroke: "none",
+					style: { opacity: "0.3" }
+				}, null, 8, Zn),
+				d("path", {
+					d: "M49 53 49 55A1 1 0 0049 45L49 47C53 47 53 53 49 53",
+					fill: q.value.style.donutEvolution.donuts.color,
+					stroke: "none",
+					style: { opacity: "0.3" }
+				}, null, 8, Qn),
+				d("path", {
+					d: "M63 35C63 33 65 32 66 32L66 30C63 30 61 33 61 35L63 35",
+					fill: q.value.style.donutEvolution.donuts.color,
+					stroke: "none",
+					style: { opacity: "0.3" }
+				}, null, 8, $n),
+				d("path", {
+					d: "M78 41A1 1 0 0088 41L86 41C86 45 80 45 80 41L78 41",
+					fill: q.value.style.donutEvolution.donuts.color,
+					stroke: "none",
+					style: { opacity: "0.3" }
+				}, null, 8, er),
+				d("path", {
+					d: "M95 14C95 17 98 19 100 19L100 17C99 17 97 16 97 14L95 14",
+					fill: q.value.style.donutEvolution.donuts.color,
+					stroke: "none",
+					style: { opacity: "0.3" }
+				}, null, 8, tr)
+			], 12, Kn)) : l("", !0),
+			J.value === "line" ? (h(), u("svg", {
+				key: 27,
+				xmlns: v(i),
+				width: "100%",
+				viewBox: "0 0 100 70",
+				style: m(`background:${q.value.style.backgroundColor}`)
+			}, [
+				p(o),
+				q.value.style.line.axis.show ? (h(), u("g", rr, [d("line", {
+					x1: "3",
+					x2: "3",
+					y1: "3",
+					y2: "67",
+					stroke: q.value.style.line.axis.color,
+					"stroke-width": q.value.style.line.axis.strokeWidth,
+					"stroke-linecap": "round",
+					"stroke-linejoin": "round"
+				}, null, 8, ir), d("line", {
+					x1: "3",
+					x2: "97",
+					y1: "67",
+					y2: "67",
+					stroke: q.value.style.line.axis.color,
+					"stroke-width": q.value.style.line.axis.strokeWidth,
+					"stroke-linecap": "round",
+					"stroke-linejoin": "round"
+				}, null, 8, ar)])) : l("", !0),
+				d("path", {
+					d: "M 9,60 22,50 35,55 48,36 61,40 74,25 87,26 90,12",
+					fill: "none",
+					"stroke-linecap": "round",
+					"stroke-linejoin": "round",
+					stroke: q.value.style.line.path.color,
+					"stroke-width": q.value.style.line.path.strokeWidth
+				}, null, 8, or),
+				q.value.style.line.path.showPlots ? (h(), u("g", sr, [d("circle", {
+					cx: "9",
+					cy: "60",
+					r: q.value.style.line.path.strokeWidth,
+					fill: q.value.style.line.path.color
+				}, null, 8, cr), d("circle", {
+					cx: "90",
+					cy: "12",
+					r: q.value.style.line.path.strokeWidth,
+					fill: q.value.style.line.path.color
+				}, null, 8, lr)])) : l("", !0)
+			], 12, nr)) : l("", !0),
+			J.value === "bar" ? (h(), u("svg", {
+				key: 28,
+				xmlns: v(i),
+				width: "100%",
+				viewBox: "0 0 100 70",
+				style: m(`background:${q.value.style.backgroundColor}`)
+			}, [
+				p(o),
+				q.value.style.bar.axis.show ? (h(), u("g", dr, [d("line", {
+					x1: "3",
+					x2: "3",
+					y1: "3",
+					y2: "67",
+					stroke: q.value.style.bar.axis.color,
+					"stroke-width": q.value.style.bar.axis.strokeWidth,
+					"stroke-linecap": "round",
+					"stroke-linejoin": "round"
+				}, null, 8, fr), d("line", {
+					x1: "3",
+					x2: "97",
+					y1: "67",
+					y2: "67",
+					stroke: q.value.style.bar.axis.color,
+					"stroke-width": q.value.style.bar.axis.strokeWidth,
+					"stroke-linecap": "round",
+					"stroke-linejoin": "round"
+				}, null, 8, pr)])) : l("", !0),
+				(h(!0), u(s, null, _(Ti.value, (e, t) => (h(), u("rect", {
+					fill: q.value.style.bar.color,
+					rx: q.value.style.bar.borderRadius,
+					x: 6 + 11.2 * t,
+					y: e,
+					width: q.value.style.bar.barWidth,
+					height: 67 - e
+				}, null, 8, mr))), 256))
+			], 12, ur)) : l("", !0),
+			J.value === "donut" ? (h(), u("svg", {
+				key: 29,
+				xmlns: v(i),
+				width: "100%",
+				viewBox: "0 0 400 400",
+				style: m(`background:${q.value.style.backgroundColor}`)
+			}, [
+				p(o),
+				d("path", {
+					d: " M 300 200 A 100 100 0 0 1 113 250",
+					fill: "none",
+					"stroke-width": q.value.style.donut.strokeWidth,
+					stroke: q.value.style.donut.color
+				}, null, 8, gr),
+				d("path", {
+					d: " M 113 250 A 100 100 0 0 1 250 113",
+					fill: "none",
+					"stroke-width": q.value.style.donut.strokeWidth,
+					stroke: v(r)(q.value.style.donut.color, 60)
+				}, null, 8, _r),
+				d("path", {
+					d: " M 250 113 A 100 100 0 0 1 300 200",
+					fill: "none",
+					"stroke-width": q.value.style.donut.strokeWidth,
+					stroke: v(r)(q.value.style.donut.color, 30)
+				}, null, 8, vr)
+			], 12, hr)) : l("", !0),
+			J.value === "onion" ? (h(), u("svg", {
+				key: 30,
+				xmlns: v(i),
+				width: "100%",
+				viewBox: "0 0 400 400",
+				style: m(`background:${q.value.style.backgroundColor}`)
+			}, [
+				p(o),
+				d("path", {
+					d: " M 200 60 A 140 140 0 1 1 60 200",
+					stroke: q.value.style.onion.color,
+					"stroke-linecap": "round",
+					"stroke-width": "20",
+					fill: "none"
+				}, null, 8, br),
+				d("path", {
+					d: " M 200 100 A 100 100 0 1 1 100 200",
+					stroke: v(r)(q.value.style.onion.color, 60),
+					"stroke-linecap": "round",
+					"stroke-width": "20",
+					fill: "none"
+				}, null, 8, xr),
+				d("path", {
+					d: " M 200 140 A 60 60 0 1 1 140 200",
+					fill: "none",
+					stroke: v(r)(q.value.style.onion.color, 40),
+					"stroke-linecap": "round",
+					"stroke-width": "20"
+				}, null, 8, Sr)
+			], 12, yr)) : l("", !0),
+			J.value === "gauge" ? (h(), u("svg", {
+				key: 31,
+				width: "100%",
+				viewBox: "0 0 400 400",
+				style: m(`background:${q.value.style.backgroundColor}`)
+			}, [
+				p(o),
+				d("path", {
+					d: " M 82 255 A 120 120 0 1 1 318 255",
+					fill: "none",
+					stroke: q.value.style.gauge.color,
+					"stroke-linecap": "round",
+					"stroke-width": "20"
+				}, null, 8, Cr),
+				d("circle", {
+					cx: "200",
+					cy: "256",
+					r: "12",
+					fill: q.value.style.gauge.color
+				}, null, 8, wr),
+				d("line", {
+					x1: "200",
+					y1: "256",
+					x2: "250",
+					y2: "160",
+					"stroke-width": "8",
+					stroke: q.value.style.gauge.color,
+					"stroke-linecap": "round"
+				}, null, 8, Tr)
+			], 4)) : l("", !0),
+			J.value === "quadrant" ? (h(), u("svg", {
+				key: 32,
+				xmlns: v(i),
+				viewBox: "0 0 100 100",
+				style: m(`background:${q.value.style.backgroundColor}`)
+			}, [
+				p(o),
+				d("line", {
+					x1: "50",
+					x2: "50",
+					y1: "3",
+					y2: "97",
+					stroke: q.value.style.quadrant.grid.color,
+					"stroke-width": q.value.style.quadrant.grid.strokeWidth
+				}, null, 8, Dr),
+				d("line", {
+					x1: "3",
+					x2: "97",
+					y1: "50",
+					y2: "50",
+					stroke: q.value.style.quadrant.grid.color,
+					"stroke-width": q.value.style.quadrant.grid.strokeWidth
+				}, null, 8, Or),
+				d("circle", {
+					fill: q.value.style.quadrant.plots.color,
+					r: q.value.style.quadrant.plots.radius,
+					cx: "20",
+					cy: "20"
+				}, null, 8, kr),
+				d("circle", {
+					fill: q.value.style.quadrant.plots.color,
+					r: q.value.style.quadrant.plots.radius,
+					cx: "80",
+					cy: "60"
+				}, null, 8, Ar),
+				d("circle", {
+					fill: q.value.style.quadrant.plots.color,
+					r: q.value.style.quadrant.plots.radius,
+					cx: "65",
+					cy: "55"
+				}, null, 8, jr),
+				d("circle", {
+					fill: q.value.style.quadrant.plots.color,
+					r: q.value.style.quadrant.plots.radius,
+					cx: "36",
+					cy: "67"
+				}, null, 8, Mr),
+				d("circle", {
+					fill: q.value.style.quadrant.plots.color,
+					r: q.value.style.quadrant.plots.radius,
+					cx: "15",
+					cy: "75"
+				}, null, 8, Nr),
+				d("circle", {
+					fill: q.value.style.quadrant.plots.color,
+					r: q.value.style.quadrant.plots.radius,
+					cx: "40",
+					cy: "55"
+				}, null, 8, Pr),
+				d("circle", {
+					fill: q.value.style.quadrant.plots.color,
+					r: q.value.style.quadrant.plots.radius,
+					cx: "76",
+					cy: "32"
+				}, null, 8, Fr),
+				d("circle", {
+					fill: q.value.style.quadrant.plots.color,
+					r: q.value.style.quadrant.plots.radius,
+					cx: "85",
+					cy: "26"
+				}, null, 8, Ir),
+				d("circle", {
+					fill: q.value.style.quadrant.plots.color,
+					r: q.value.style.quadrant.plots.radius,
+					cx: "55",
+					cy: "46"
+				}, null, 8, Lr)
+			], 12, Er)) : l("", !0),
+			J.value === "radar" ? (h(), u("svg", {
+				key: 33,
+				xmlns: v(i),
+				viewBox: "0 0 100 100",
+				style: m(`background:${q.value.style.backgroundColor}`)
+			}, [
+				p(o),
+				d("path", {
+					d: Ei.value,
+					fill: "none",
+					stroke: q.value.style.radar.grid.color,
+					"stroke-width": q.value.style.radar.grid.strokeWidth,
+					"stroke-linecap": "round",
+					"stroke-linejoin": "round"
+				}, null, 8, zr),
+				d("path", {
+					d: Di.value,
+					fill: "none",
+					stroke: v(r)(q.value.style.radar.grid.color, 70),
+					"stroke-width": q.value.style.radar.grid.strokeWidth / 2,
+					"stroke-linecap": "round",
+					"stroke-linejoin": "round"
+				}, null, 8, Br),
+				d("path", {
+					d: Oi.value,
+					fill: "none",
+					stroke: v(r)(q.value.style.radar.grid.color, 70),
+					"stroke-width": q.value.style.radar.grid.strokeWidth / 2,
+					"stroke-linecap": "round",
+					"stroke-linejoin": "round"
+				}, null, 8, Vr),
+				d("path", {
+					d: ki.value,
+					fill: "none",
+					stroke: v(r)(q.value.style.radar.grid.color, 70),
+					"stroke-width": q.value.style.radar.grid.strokeWidth / 2.5,
+					"stroke-linecap": "round",
+					"stroke-linejoin": "round"
+				}, null, 8, Hr),
+				d("path", {
+					d: "M 9,50 91,50",
+					stroke: v(r)(q.value.style.radar.grid.color, 50),
+					"stroke-width": q.value.style.radar.grid.strokeWidth / 2
+				}, null, 8, Ur),
+				d("path", {
+					d: "M 29.5,14.5 70.5 85.5",
+					stroke: v(r)(q.value.style.radar.grid.color, 50),
+					"stroke-width": q.value.style.radar.grid.strokeWidth / 2
+				}, null, 8, Wr),
+				d("path", {
+					d: "M 29.5,85.5 70.5 14.5",
+					stroke: v(r)(q.value.style.radar.grid.color, 50),
+					"stroke-width": q.value.style.radar.grid.strokeWidth / 2
+				}, null, 8, Gr),
+				d("path", {
+					d: "M 34,23 68.5,18, 70,50 61.5,70 35,75.5 10,50  Z",
+					stroke: "none",
+					"stroke-linejoin": "round",
+					fill: v(r)(q.value.style.radar.shapes.color, 30)
+				}, null, 8, Kr),
+				d("path", {
+					d: "M 43.5,40 64.5,25, 84,50 55.5,60 29.5,85.5 25,50  Z",
+					stroke: "none",
+					"stroke-linejoin": "round",
+					fill: v(r)(q.value.style.radar.shapes.color, 50)
+				}, null, 8, qr)
+			], 12, Rr)) : l("", !0),
+			J.value === "waffle" ? (h(), u("svg", {
+				key: 34,
+				xmlns: v(i),
+				viewBox: "0 0 100 100",
+				style: m(`background:${q.value.style.backgroundColor}`)
+			}, [
+				p(o),
+				(h(), u(s, null, _(10, (e, t) => d("g", null, [(h(), u(s, null, _(10, (e, n) => d("g", null, [d("rect", {
+					x: 3 + n * 9.5,
+					y: 3 + t * 9.5,
+					height: 9,
+					width: 9,
+					fill: v(r)(q.value.style.waffle.color, 20),
+					rx: "1"
+				}, null, 8, Yr)])), 64))])), 64)),
+				(h(), u(s, null, _(10, (e, t) => d("g", null, [(h(), u(s, null, _(10, (e, n) => d("g", null, [t > 2 ? (h(), u("rect", {
+					key: 0,
+					x: 3 + n * 9.5,
+					y: 3 + t * 9.5,
+					height: 9,
+					width: 9,
+					fill: v(r)(q.value.style.waffle.color, 30),
+					rx: "1"
+				}, null, 8, Xr)) : l("", !0)])), 64))])), 64)),
+				(h(), u(s, null, _(10, (e, t) => d("g", null, [(h(), u(s, null, _(10, (e, n) => d("g", null, [t > 6 ? (h(), u("rect", {
+					key: 0,
+					x: 3 + n * 9.5,
+					y: 3 + t * 9.5,
+					height: 9,
+					width: 9,
+					fill: v(r)(q.value.style.waffle.color, 50),
+					rx: "1"
+				}, null, 8, Zr)) : l("", !0)])), 64))])), 64))
+			], 12, Jr)) : l("", !0),
+			J.value === "table" ? (h(), u("svg", {
+				key: 35,
+				xmlns: v(i),
+				width: "100%",
+				viewBox: "0 0 100 70",
+				style: m(`background:${q.value.style.backgroundColor}`)
+			}, [
+				p(o),
+				d("rect", {
+					fill: v(r)(q.value.style.table.th.color, 50),
+					x: 3.5,
+					y: 5,
+					height: "10",
+					width: "93"
+				}, null, 8, $r),
+				d("rect", {
+					fill: v(r)(q.value.style.table.th.color, 50),
+					x: 3.5,
+					y: 15,
+					height: "50",
+					width: "23.25"
+				}, null, 8, ei),
+				(h(), u(s, null, _(7, (e, t) => d("line", {
+					x1: "3.7",
+					x2: "96.3",
+					y1: 5 + t * 10,
+					y2: 5 + t * 10,
+					stroke: q.value.style.table.td.color,
+					"stroke-width": q.value.style.table.td.strokeWidth,
+					"stroke-linecap": "round"
+				}, null, 8, ti)), 64)),
+				(h(), u(s, null, _(5, (e, t) => d("line", {
+					x1: 3.5 + t * 23.25,
+					x2: 3.5 + t * 23.25,
+					y1: "5",
+					y2: "65",
+					stroke: q.value.style.table.td.color,
+					"stroke-width": q.value.style.table.td.strokeWidth,
+					"stroke-linecap": "round"
+				}, null, 8, ni)), 64))
+			], 12, Qr)) : l("", !0),
+			J.value === "rating" ? (h(), u(s, { key: 36 }, [q.value.style.rating.useSmiley ? (h(), u("div", {
+				key: 0,
+				style: m(`display:flex;flex-direction:row;align-items:center;justify-content:center;width:${q.value.style.rating.maxWidth}px`)
+			}, [
+				q.value.style.rating.filled ? (h(), u("svg", {
+					key: 0,
+					xmlns: v(i),
+					style: m(`width:${q.value.style.rating.maxWidth / 5}px;aspect-ratio: 1 / 1`),
+					viewBox: "0 0 24 24",
+					"stroke-width": "1.5",
+					stroke: q.value.style.rating.color,
+					"stroke-linecap": "round",
+					"stroke-linejoin": "round",
+					fill: "none"
+				}, [
+					p(o),
+					t[0] ||= d("path", {
+						stroke: "none",
+						d: "M0 0h24v24H0z",
+						fill: "none"
+					}, null, -1),
+					d("path", {
+						d: "M17 3.34a10 10 0 1 1 -14.995 8.984l-.005 -.324l.005 -.324a10 10 0 0 1 14.995 -8.336zm-5 9.86a4.5 4.5 0 0 0 -3.214 1.35a1 1 0 1 0 1.428 1.4a2.5 2.5 0 0 1 3.572 0a1 1 0 0 0 1.428 -1.4a4.5 4.5 0 0 0 -3.214 -1.35zm-2.99 -4.2l-.127 .007a1 1 0 0 0 0 1.986l.117 .007l.127 -.007a1 1 0 0 0 0 -1.986l-.117 -.007zm6 0l-.127 .007a1 1 0 0 0 0 1.986l.117 .007l.127 -.007a1 1 0 0 0 0 -1.986l-.117 -.007z",
+						"stroke-width": "0",
+						fill: q.value.style.rating.color
+					}, null, 8, ii)
+				], 12, ri)) : (h(), u("svg", {
+					key: 1,
+					xmlns: v(i),
+					style: m(`width:${q.value.style.rating.maxWidth / 5}px;aspect-ratio: 1 / 1`),
+					viewBox: "0 0 24 24",
+					"stroke-width": "1.5",
+					stroke: q.value.style.rating.color,
+					"stroke-linecap": "round",
+					"stroke-linejoin": "round",
+					fill: "none"
+				}, [...t[1] ||= [f("<path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" data-v-633331e3></path><path d=\"M12 12m-9 0a9 9 0 1 0 18 0a9 9 0 1 0 -18 0\" data-v-633331e3></path><path d=\"M9 10l.01 0\" data-v-633331e3></path><path d=\"M15 10l.01 0\" data-v-633331e3></path><path d=\"M9.5 15.25a3.5 3.5 0 0 1 5 0\" data-v-633331e3></path>", 5)]], 12, ai)),
+				q.value.style.rating.filled ? (h(), u("svg", {
+					key: 2,
+					xmlns: v(i),
+					style: m(`width:${q.value.style.rating.maxWidth / 5}px;aspect-ratio: 1 / 1`),
+					viewBox: "0 0 24 24",
+					"stroke-width": "1.5",
+					stroke: q.value.style.rating.color,
+					"stroke-linecap": "round",
+					"stroke-linejoin": "round",
+					fill: "none"
+				}, [t[2] ||= d("path", {
+					stroke: "none",
+					d: "M0 0h24v24H0z",
+					fill: "none"
+				}, null, -1), d("path", {
+					d: "M17 3.34a10 10 0 1 1 -14.995 8.984l-.005 -.324l.005 -.324a10 10 0 0 1 14.995 -8.336zm-2 10.66h-6l-.117 .007a1 1 0 0 0 0 1.986l.117 .007h6l.117 -.007a1 1 0 0 0 0 -1.986l-.117 -.007zm-5.99 -5l-.127 .007a1 1 0 0 0 0 1.986l.117 .007l.127 -.007a1 1 0 0 0 0 -1.986l-.117 -.007zm6 0l-.127 .007a1 1 0 0 0 0 1.986l.117 .007l.127 -.007a1 1 0 0 0 0 -1.986l-.117 -.007z",
+					"stroke-width": "0",
+					fill: q.value.style.rating.color
+				}, null, 8, si)], 12, oi)) : (h(), u("svg", {
+					key: 3,
+					xmlns: v(i),
+					style: m(`width:${q.value.style.rating.maxWidth / 5}px;aspect-ratio: 1 / 1`),
+					viewBox: "0 0 24 24",
+					"stroke-width": "1.5",
+					stroke: q.value.style.rating.color,
+					"stroke-linecap": "round",
+					"stroke-linejoin": "round",
+					fill: "none"
+				}, [...t[3] ||= [f("<path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" data-v-633331e3></path><path d=\"M12 12m-9 0a9 9 0 1 0 18 0a9 9 0 1 0 -18 0\" data-v-633331e3></path><path d=\"M9 10l.01 0\" data-v-633331e3></path><path d=\"M15 10l.01 0\" data-v-633331e3></path><path d=\"M9 15l6 0\" data-v-633331e3></path>", 5)]], 12, ci)),
+				q.value.style.rating.filled ? (h(), u("svg", {
+					key: 4,
+					xmlns: v(i),
+					style: m(`width:${q.value.style.rating.maxWidth / 5}px;aspect-ratio: 1 / 1`),
+					viewBox: "0 0 24 24",
+					"stroke-width": "1.5",
+					stroke: q.value.style.rating.color,
+					"stroke-linecap": "round",
+					"stroke-linejoin": "round",
+					fill: "none"
+				}, [t[4] ||= d("path", {
+					stroke: "none",
+					d: "M0 0h24v24H0z",
+					fill: "none"
+				}, null, -1), d("path", {
+					d: "M17 3.34a10 10 0 1 1 -14.995 8.984l-.005 -.324l.005 -.324a10 10 0 0 1 14.995 -8.336zm-7.99 5.66l-.127 .007a1 1 0 0 0 0 1.986l.117 .007l.127 -.007a1 1 0 0 0 0 -1.986l-.117 -.007zm6 0l-.127 .007a1 1 0 0 0 0 1.986l.117 .007l.127 -.007a1 1 0 0 0 0 -1.986l-.117 -.007z",
+					"stroke-width": "0",
+					fill: q.value.style.rating.color
+				}, null, 8, ui)], 12, li)) : (h(), u("svg", {
+					key: 5,
+					xmlns: v(i),
+					style: m(`width:${q.value.style.rating.maxWidth / 5}px;aspect-ratio: 1 / 1`),
+					viewBox: "0 0 24 24",
+					"stroke-width": "1.5",
+					stroke: q.value.style.rating.color,
+					"stroke-linecap": "round",
+					"stroke-linejoin": "round",
+					fill: "none"
+				}, [...t[5] ||= [
+					d("path", {
+						stroke: "none",
+						d: "M0 0h24v24H0z",
+						fill: "none"
+					}, null, -1),
+					d("path", { d: "M12 12m-9 0a9 9 0 1 0 18 0a9 9 0 1 0 -18 0" }, null, -1),
+					d("path", { d: "M9 10l.01 0" }, null, -1),
+					d("path", { d: "M15 10l.01 0" }, null, -1)
+				]], 12, di)),
+				q.value.style.rating.filled ? (h(), u("svg", {
+					key: 6,
+					xmlns: v(i),
+					style: m(`width:${q.value.style.rating.maxWidth / 5}px;aspect-ratio: 1 / 1`),
+					viewBox: "0 0 24 24",
+					"stroke-width": "1.5",
+					stroke: q.value.style.rating.color,
+					"stroke-linecap": "round",
+					"stroke-linejoin": "round",
+					fill: "none"
+				}, [t[6] ||= d("path", {
+					stroke: "none",
+					d: "M0 0h24v24H0z",
+					fill: "none"
+				}, null, -1), d("path", {
+					d: "M17 3.34a10 10 0 1 1 -14.995 8.984l-.005 -.324l.005 -.324a10 10 0 0 1 14.995 -8.336zm-1.8 10.946a1 1 0 0 0 -1.414 .014a2.5 2.5 0 0 1 -3.572 0a1 1 0 0 0 -1.428 1.4a4.5 4.5 0 0 0 6.428 0a1 1 0 0 0 -.014 -1.414zm-6.19 -5.286l-.127 .007a1 1 0 0 0 .117 1.993l.127 -.007a1 1 0 0 0 -.117 -1.993zm6 0l-.127 .007a1 1 0 0 0 .117 1.993l.127 -.007a1 1 0 0 0 -.117 -1.993z",
+					"stroke-width": "0",
+					fill: q.value.style.rating.color
+				}, null, 8, pi)], 12, fi)) : (h(), u("svg", {
+					key: 7,
+					xmlns: v(i),
+					style: m(`width:${q.value.style.rating.maxWidth / 5}px;aspect-ratio: 1 / 1`),
+					viewBox: "0 0 24 24",
+					"stroke-width": "1.5",
+					stroke: q.value.style.rating.color,
+					"stroke-linecap": "round",
+					"stroke-linejoin": "round",
+					fill: "none"
+				}, [...t[7] ||= [f("<path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" data-v-633331e3></path><path d=\"M12 12m-9 0a9 9 0 1 0 18 0a9 9 0 1 0 -18 0\" data-v-633331e3></path><path d=\"M9 10l.01 0\" data-v-633331e3></path><path d=\"M15 10l.01 0\" data-v-633331e3></path><path d=\"M9.5 15a3.5 3.5 0 0 0 5 0\" data-v-633331e3></path>", 5)]], 12, mi)),
+				q.value.style.rating.filled ? (h(), u("svg", {
+					key: 8,
+					xmlns: v(i),
+					style: m(`width:${q.value.style.rating.maxWidth / 5}px;aspect-ratio: 1 / 1`),
+					viewBox: "0 0 24 24",
+					"stroke-width": "1.5",
+					stroke: q.value.style.rating.color,
+					"stroke-linecap": "round",
+					"stroke-linejoin": "round",
+					fill: "none"
+				}, [t[8] ||= d("path", {
+					stroke: "none",
+					d: "M0 0h24v24H0z",
+					fill: "none"
+				}, null, -1), d("path", {
+					d: "M17 3.34a10 10 0 1 1 -14.995 8.984l-.005 -.324l.005 -.324a10 10 0 0 1 14.995 -8.336zm-2 9.66h-6a1 1 0 0 0 -1 1v.05a3.975 3.975 0 0 0 3.777 3.97l.227 .005a4.026 4.026 0 0 0 3.99 -3.79l.006 -.206a1 1 0 0 0 -1 -1.029zm-5.99 -5l-.127 .007a1 1 0 0 0 .117 1.993l.127 -.007a1 1 0 0 0 -.117 -1.993zm6 0l-.127 .007a1 1 0 0 0 .117 1.993l.127 -.007a1 1 0 0 0 -.117 -1.993z",
+					"stroke-width": "0",
+					fill: q.value.style.rating.color
+				}, null, 8, gi)], 12, hi)) : (h(), u("svg", {
+					key: 9,
+					xmlns: v(i),
+					style: m(`width:${q.value.style.rating.maxWidth / 5}px;aspect-ratio: 1 / 1`),
+					viewBox: "0 0 24 24",
+					"stroke-width": "1.5",
+					stroke: q.value.style.rating.color,
+					"stroke-linecap": "round",
+					"stroke-linejoin": "round",
+					fill: "none"
+				}, [...t[9] ||= [f("<path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" data-v-633331e3></path><path d=\"M12 12m-9 0a9 9 0 1 0 18 0a9 9 0 1 0 -18 0\" data-v-633331e3></path><path d=\"M9 9l.01 0\" data-v-633331e3></path><path d=\"M15 9l.01 0\" data-v-633331e3></path><path d=\"M8 13a4 4 0 1 0 8 0h-8\" data-v-633331e3></path>", 5)]], 12, _i))
+			], 4)) : (h(), u("svg", {
+				key: 1,
+				xmlns: v(i),
+				width: "100%",
+				viewBox: "0 0 100 30",
+				style: m(`background:${q.value.style.backgroundColor};max-width:${q.value.style.rating.maxWidth}px`)
+			}, [p(o), (h(), u(s, null, _(5, (e, t) => d("polygon", {
+				points: v(n)({
+					plot: {
+						x: 10 + t * 20,
+						y: 15
+					},
+					radius: 6
+				}),
+				fill: q.value.style.rating.filled ? q.value.style.rating.color : "none",
+				stroke: q.value.style.rating.color,
+				"stroke-width": q.value.style.rating.strokeWidth,
+				"stroke-linecap": "round",
+				"stroke-linejoin": "round"
+			}, null, 8, yi)), 64))], 12, vi))], 64)) : l("", !0),
+			J.value === "verticalBar" ? (h(), u("svg", {
+				key: 37,
+				xmlns: v(i),
+				width: "100%",
+				viewBox: "0 0 100 100",
+				style: m(`background:${q.value.style.backgroundColor}`)
+			}, [
+				p(o),
+				q.value.style.verticalBar.axis.show ? (h(), u("g", xi, [d("line", {
+					x1: 3,
+					x2: 3,
+					y1: 3,
+					y2: 97,
+					stroke: q.value.style.verticalBar.axis.color,
+					"stroke-width": q.value.style.verticalBar.axis.strokeWidth
+				}, null, 8, Si)])) : l("", !0),
+				(h(), u(s, null, _(6, (e, t) => d("rect", {
+					x: 3,
+					y: 5 + t * 15.6,
+					height: "12",
+					width: 94 - 94 * t / 6,
+					fill: q.value.style.verticalBar.color,
+					rx: q.value.style.verticalBar.borderRadius
+				}, null, 8, Ci)), 64))
+			], 12, bi)) : l("", !0)
+		], 14, re));
+	}
+}, [["__scopeId", "data-v-633331e3"]]);
+//#endregion
+export { y as n, K as t };