import { ref as w, computed as g, createElementBlock as e, openBlock as o, normalizeStyle as n, normalizeClass as N, createCommentVNode as a, unref as s, createVNode as d, createElementVNode as t, Fragment as k, renderList as v, createStaticVNode as $ } from "vue";
import { u as F, P as A, X as c, s as h, W as O } from "./index-BsIlHNy8.js";
import { u as V } from "./useNestedProp-CyyJlG5K.js";
import { _ as y } from "./PackageVersion-CZ0-Jk6A.js";
import { _ as X } from "./_plugin-vue_export-helper-CHgC5LLL.js";
const G = ["id"], R = ["xmlns"], T = ["stroke"], Y = ["stroke"], D = ["stroke"], U = ["fill", "stroke"], J = ["fill"], K = ["fill", "stroke"], Q = ["fill"], ll = ["fill", "stroke"], tl = ["fill"], el = ["fill", "stroke"], ol = ["fill"], sl = ["fill", "stroke"], rl = ["fill"], il = ["fill", "stroke"], nl = ["fill"], al = ["xmlns"], cl = ["stroke"], ul = ["stroke"], dl = ["stroke"], yl = ["stroke"], kl = ["stroke"], hl = ["stroke"], vl = ["stroke"], _l = ["stroke"], xl = ["stroke"], pl = ["xmlns"], gl = ["stroke", "fill"], fl = ["xmlns"], wl = ["stroke", "fill"], ml = ["xmlns"], bl = ["fill"], Ml = ["fill"], Cl = ["fill"], Ll = ["fill"], $l = ["xmlns"], Al = ["stroke"], Pl = ["fill"], Bl = ["stroke", "fill"], Wl = ["stroke", "fill"], zl = ["fill"], jl = ["stroke", "fill"], ql = ["stroke", "fill"], Hl = ["fill"], El = ["stroke", "fill"], Sl = ["stroke", "fill"], Zl = ["fill"], Il = ["stroke", "fill"], Nl = ["stroke", "fill"], Fl = ["fill"], Ol = ["stroke", "fill"], Vl = ["stroke", "fill"], Xl = ["xmlns"], Gl = ["stroke"], Rl = ["stroke"], Tl = ["stroke", "fill"], Yl = ["stroke", "fill"], Dl = ["stroke", "fill"], Ul = ["stroke", "fill"], Jl = ["stroke", "fill"], Kl = ["stroke", "fill"], Ql = ["stroke", "fill"], lt = ["stroke", "fill"], tt = ["stroke", "fill"], et = ["stroke", "fill"], ot = ["stroke", "fill"], st = ["stroke", "fill"], rt = ["stroke", "fill"], it = ["stroke", "fill"], nt = ["stroke", "fill"], at = ["stroke", "fill"], ct = ["stroke", "fill"], ut = ["stroke", "fill"], dt = ["stroke", "fill"], yt = ["stroke", "fill"], kt = ["stroke", "fill"], ht = ["stroke", "fill"], vt = ["stroke", "fill"], _t = ["xmlns"], xt = ["stroke"], pt = ["xmlns"], gt = ["stroke"], ft = ["xmlns"], wt = ["stroke"], mt = ["xmlns"], bt = ["fill"], Mt = ["fill"], Ct = ["fill"], Lt = ["fill"], $t = ["fill"], At = ["fill"], Pt = ["fill"], Bt = ["fill"], Wt = ["fill"], zt = ["fill"], jt = ["fill"], qt = ["fill"], Ht = ["xmlns"], Et = ["stroke"], St = ["stroke"], Zt = ["stroke"], It = ["stroke"], Nt = ["stroke"], Ft = ["stroke"], Ot = ["xmlns"], Vt = ["stroke"], Xt = ["stroke"], Gt = ["stroke"], Rt = ["stroke"], Tt = ["stroke"], Yt = ["stroke"], Dt = ["stroke"], Ut = ["stroke"], Jt = ["stroke"], Kt = ["xmlns"], Qt = ["stroke"], le = ["xmlns"], te = ["stroke"], ee = ["stroke"], oe = ["stroke"], se = ["stroke"], re = ["stroke"], ie = ["stroke"], ne = ["stroke"], ae = ["stroke"], ce = ["stroke"], ue = ["xmlns"], de = ["x1", "x2", "stroke"], ye = ["xmlns"], ke = ["x", "y", "width", "height", "fill"], he = ["y", "width", "height", "fill"], ve = ["xmlns"], _e = ["fill"], xe = ["fill"], pe = ["fill"], ge = ["xmlns"], fe = ["x1", "x2", "y1", "y2", "stroke"], we = ["stroke"], me = ["fill"], be = ["xmlns"], Me = ["fill"], Ce = ["fill"], Le = ["x1", "y1", "x2", "y2", "stroke-width", "stroke"], $e = ["xmlns"], Ae = { key: 0 }, Pe = ["stroke", "stroke-width"], Be = ["stroke", "stroke-width"], We = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], ze = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], je = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], qe = ["x", "y", "height", "width", "fill"], He = ["xmlns", "viewBox"], Ee = ["x", "y", "stroke", "fill"], Se = ["xmlns"], Ze = ["d", "stroke"], Ie = ["cx", "cy", "r", "fill", "stroke"], Ne = ["cx", "cy", "r", "fill", "stroke"], Fe = ["x", "y", "width", "fill"], Oe = ["cx", "cy", "fill"], Ve = ["cx", "cy", "fill"], Xe = ["stroke"], Ge = ["xmlns"], Re = ["stroke", "stroke-width"], Te = ["stroke", "stroke-width"], Ye = ["stroke", "stroke-width"], De = ["fill"], Ue = ["fill"], Je = ["fill"], Ke = ["fill"], Qe = ["fill"], lo = ["fill"], to = ["xmlns"], eo = { key: 0 }, oo = ["stroke", "stroke-width"], so = ["stroke", "stroke-width"], ro = ["stroke", "stroke-width"], io = { key: 1 }, no = ["r", "fill"], ao = ["r", "fill"], co = ["xmlns"], uo = { key: 0 }, yo = ["stroke", "stroke-width"], ko = ["stroke", "stroke-width"], ho = ["fill", "rx", "x", "y", "width", "height"], vo = ["xmlns"], _o = ["stroke-width", "stroke"], xo = ["stroke-width", "stroke"], po = ["stroke-width", "stroke"], go = ["xmlns"], fo = ["stroke"], wo = ["stroke"], mo = ["stroke"], bo = ["stroke"], Mo = ["fill"], Co = ["stroke"], Lo = ["xmlns"], $o = ["stroke", "stroke-width"], Ao = ["stroke", "stroke-width"], Po = ["fill", "r"], Bo = ["fill", "r"], Wo = ["fill", "r"], zo = ["fill", "r"], jo = ["fill", "r"], qo = ["fill", "r"], Ho = ["fill", "r"], Eo = ["fill", "r"], So = ["fill", "r"], Zo = ["xmlns"], Io = ["d", "stroke", "stroke-width"], No = ["d", "stroke", "stroke-width"], Fo = ["d", "stroke", "stroke-width"], Oo = ["d", "stroke", "stroke-width"], Vo = ["stroke", "stroke-width"], Xo = ["stroke", "stroke-width"], Go = ["stroke", "stroke-width"], Ro = ["fill"], To = ["fill"], Yo = ["xmlns"], Do = ["x", "y", "fill"], Uo = ["x", "y", "fill"], Jo = ["x", "y", "fill"], Ko = ["xmlns"], Qo = ["fill"], ls = ["fill"], ts = ["y1", "y2", "stroke", "stroke-width"], es = ["x1", "x2", "stroke", "stroke-width"], os = ["xmlns", "stroke"], ss = ["fill"], rs = ["xmlns", "stroke"], is = ["xmlns", "stroke"], ns = ["fill"], as = ["xmlns", "stroke"], cs = ["xmlns", "stroke"], us = ["fill"], ds = ["xmlns", "stroke"], ys = ["xmlns", "stroke"], ks = ["fill"], hs = ["xmlns", "stroke"], vs = ["xmlns", "stroke"], _s = ["fill"], xs = ["xmlns", "stroke"], ps = ["xmlns"], gs = ["points", "fill", "stroke", "stroke-width"], fs = ["xmlns"], ws = { key: 0 }, ms = ["stroke", "stroke-width"], bs = ["y", "width", "fill", "rx"], Ms = {
  __name: "vue-ui-skeleton",
  props: {
    config: {
      type: Object,
      default() {
        return {};
      }
    }
  },
  setup(P) {
    const { vue_ui_skeleton: B } = F(), W = P, z = w(`vue-ui-skeleton-${Math.random()}`), l = g(() => V({
      userConfig: W.config,
      defaultConfig: B
    })), j = g(() => l.value.style.animated), u = g(() => l.value.type), q = w([60, 50, 55, 36, 40, 25, 26, 12]), H = g(() => A({
      plot: { x: 50, y: 50 },
      radius: 40,
      sides: 6
    }).path), E = g(() => A({
      plot: { x: 50, y: 50 },
      radius: 30,
      sides: 6
    }).path), S = g(() => A({
      plot: { x: 50, y: 50 },
      radius: 20,
      sides: 6
    }).path), Z = g(() => A({
      plot: { x: 50, y: 50 },
      radius: 10,
      sides: 6
    }).path), b = w([
      {
        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 = w([
      {
        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
      }
    ]), m = w([
      [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]
    ]), M = w(
      [
        { 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 C(f, _ = 1) {
      return {
        x: 200 + 160 * Math.cos(29.85 + f * Math.PI / 180) * _,
        y: 200 + 160 * Math.sin(29.85 + f * Math.PI / 180) * _
      };
    }
    const I = g(() => {
      const f = [];
      for (let r = 0; r < 100; r += 1)
        f.push({
          x1: C(360 / 100 * r).x,
          y1: C(360 / 100 * r).y,
          x2: C(360 / 100 * r, 0.9).x,
          y2: C(360 / 100 * r, 0.9).y,
          color: l.value.style.wheel.color
        });
      return f;
    });
    return (f, _) => (o(), e("div", {
      id: z.value,
      class: N({ "vue-ui-skeleton": !0, "vue-ui-skeleton-animated": j.value }),
      style: n(`background:${l.value.style.backgroundColor};color:${l.value.style.color};display:flex;align-items:center;justify-content:center;`)
    }, [
      u.value === "historyPlot" ? (o(), e("svg", {
        key: 0,
        xmlns: s(c),
        width: "100%",
        viewBox: "0 0 612 512",
        style: n(`background:${l.value.style.backgroundColor}`)
      }, [
        d(y),
        t("line", {
          x1: "12",
          x2: "12",
          y1: "12",
          y2: "500",
          stroke: l.value.style.historyPlot.color,
          "stroke-width": "3",
          "stroke-linecap": "round"
        }, null, 8, T),
        t("line", {
          x1: "12",
          x2: "600",
          y1: "500",
          y2: "500",
          stroke: l.value.style.historyPlot.color,
          "stroke-width": "3",
          "stroke-linecap": "round"
        }, null, 8, Y),
        t("path", {
          d: "M 80,100 300,200 400,150 560,230 360,420 230,320",
          fill: "none",
          stroke: l.value.style.historyPlot.color,
          "stroke-width": "3"
        }, null, 8, D),
        t("circle", {
          cx: "80",
          cy: "100",
          r: "24",
          fill: l.value.style.historyPlot.color,
          stroke: l.value.style.backgroundColor,
          "stroke-width": "3"
        }, null, 8, U),
        t("text", {
          x: "80",
          y: "108",
          fill: l.value.style.backgroundColor,
          "font-size": "24",
          "text-anchor": "middle"
        }, "1", 8, J),
        t("circle", {
          cx: "300",
          cy: "200",
          r: "24",
          fill: l.value.style.historyPlot.color,
          stroke: l.value.style.backgroundColor,
          "stroke-width": "3"
        }, null, 8, K),
        t("text", {
          x: "300",
          y: "208",
          fill: l.value.style.backgroundColor,
          "font-size": "24",
          "text-anchor": "middle"
        }, "2", 8, Q),
        t("circle", {
          cx: "400",
          cy: "150",
          r: "24",
          fill: l.value.style.historyPlot.color,
          stroke: l.value.style.backgroundColor,
          "stroke-width": "3"
        }, null, 8, ll),
        t("text", {
          x: "400",
          y: "158",
          fill: l.value.style.backgroundColor,
          "font-size": "24",
          "text-anchor": "middle"
        }, "3", 8, tl),
        t("circle", {
          cx: "560",
          cy: "230",
          r: "24",
          fill: l.value.style.historyPlot.color,
          stroke: l.value.style.backgroundColor,
          "stroke-width": "3"
        }, null, 8, el),
        t("text", {
          x: "560",
          y: "238",
          fill: l.value.style.backgroundColor,
          "font-size": "24",
          "text-anchor": "middle"
        }, "4", 8, ol),
        t("circle", {
          cx: "360",
          cy: "420",
          r: "24",
          fill: l.value.style.historyPlot.color,
          stroke: l.value.style.backgroundColor,
          "stroke-width": "3"
        }, null, 8, sl),
        t("text", {
          x: "360",
          y: "428",
          fill: l.value.style.backgroundColor,
          "font-size": "24",
          "text-anchor": "middle"
        }, "5", 8, rl),
        t("circle", {
          cx: "230",
          cy: "320",
          r: "24",
          fill: l.value.style.historyPlot.color,
          stroke: l.value.style.backgroundColor,
          "stroke-width": "3"
        }, null, 8, il),
        t("text", {
          x: "230",
          y: "328",
          fill: l.value.style.backgroundColor,
          "font-size": "24",
          "text-anchor": "middle"
        }, "6", 8, nl)
      ], 12, R)) : a("", !0),
      u.value === "circlePack" ? (o(), e("svg", {
        key: 1,
        xmlns: s(c),
        width: "100%",
        viewBox: "0 0 100 100",
        style: n(`background:${l.value.style.backgroundColor}`)
      }, [
        t("circle", {
          cx: 50,
          cy: 50,
          r: 20,
          stroke: l.value.style.circlePack.color,
          "stroke-width": 1,
          fill: "none"
        }, null, 8, cl),
        t("circle", {
          cx: 80,
          cy: 50,
          r: 10,
          stroke: l.value.style.circlePack.color,
          "stroke-width": 1,
          fill: "none"
        }, null, 8, ul),
        t("circle", {
          cx: 28,
          cy: 30,
          r: 10,
          stroke: l.value.style.circlePack.color,
          "stroke-width": 1,
          fill: "none"
        }, null, 8, dl),
        t("circle", {
          cx: 25,
          cy: 76,
          r: 16,
          stroke: l.value.style.circlePack.color,
          "stroke-width": 1,
          fill: "none"
        }, null, 8, yl),
        t("circle", {
          cx: 60,
          cy: 78.5,
          r: 10,
          stroke: l.value.style.circlePack.color,
          "stroke-width": 1,
          fill: "none"
        }, null, 8, kl),
        t("circle", {
          cx: 64,
          cy: 20,
          r: 13,
          stroke: l.value.style.circlePack.color,
          "stroke-width": 1,
          fill: "none"
        }, null, 8, hl),
        t("circle", {
          cx: 72,
          cy: 37,
          r: 5,
          stroke: l.value.style.circlePack.color,
          "stroke-width": 1,
          fill: "none"
        }, null, 8, vl),
        t("circle", {
          cx: 25,
          cy: 45,
          r: 5,
          stroke: l.value.style.circlePack.color,
          "stroke-width": 1,
          fill: "none"
        }, null, 8, _l),
        t("circle", {
          cx: 70,
          cy: 66,
          r: 5,
          stroke: l.value.style.circlePack.color,
          "stroke-width": 1,
          fill: "none"
        }, null, 8, xl)
      ], 12, al)) : a("", !0),
      u.value === "flow" ? (o(), e("svg", {
        key: 2,
        xmlns: s(c),
        width: "100%",
        viewBox: "0 0 80 60",
        style: n(`background:${l.value.style.backgroundColor}`)
      }, [
        d(y),
        t("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: l.value.style.flow.color,
          "stroke-width": 0.8,
          "stroke-linecap": "round",
          "stroke-linejoin": "round",
          fill: l.value.style.flow.color
        }, null, 8, gl)
      ], 12, pl)) : a("", !0),
      u.value === "parallelCoordinatePlot" ? (o(), e("svg", {
        key: 3,
        xmlns: s(c),
        width: "100%",
        viewBox: "0 0 80 60",
        style: n(`background:${l.value.style.backgroundColor}`)
      }, [
        d(y),
        t("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: l.value.style.parallelCoordinatePlot.color,
          "stroke-width": 0.8,
          "stroke-linecap": "round",
          "stroke-linejoin": "round",
          fill: l.value.style.parallelCoordinatePlot.color
        }, null, 8, wl)
      ], 12, fl)) : a("", !0),
      u.value === "bullet" ? (o(), e("svg", {
        key: 4,
        xmlns: s(c),
        width: "100%",
        viewBox: "0 0 600 96",
        style: n(`background:${l.value.style.backgroundColor}`)
      }, [
        t("rect", {
          fill: l.value.style.bullet.color,
          x: 24,
          y: 12,
          width: 300,
          height: 72,
          style: { opacity: "0.8" }
        }, null, 8, bl),
        t("rect", {
          fill: l.value.style.bullet.color,
          x: 324,
          y: 12,
          width: 150,
          height: 72,
          style: { opacity: "0.6" }
        }, null, 8, Ml),
        t("rect", {
          fill: l.value.style.bullet.color,
          x: 474,
          y: 12,
          width: 102,
          height: 72,
          style: { opacity: "0.3" }
        }, null, 8, Cl),
        t("rect", {
          fill: l.value.style.bullet.color,
          x: 24,
          y: 36,
          width: 490,
          height: 24,
          style: { opacity: "1" }
        }, null, 8, Ll)
      ], 12, ml)) : a("", !0),
      u.value === "dumbbell" ? (o(), e("svg", {
        key: 5,
        xmlns: s(c),
        width: "100%",
        viewBox: "0 0 100 55",
        style: n(`background:${l.value.style.backgroundColor}`)
      }, [
        d(y),
        t("line", {
          x1: "3",
          x2: "3",
          y1: "3",
          y2: "67",
          stroke: l.value.style.dumbbell.color,
          "stroke-width": 0.5,
          "stroke-linecap": "round",
          "stroke-linejoin": "round"
        }, null, 8, Al),
        t("path", {
          d: `
                    M 30,11
                    C 39,10 39,10
                    45,11
                    L 45,9
                    C 39,10 39,10
                    30,9 Z
                `,
          fill: l.value.style.dumbbell.color
        }, null, 8, Pl),
        t("circle", {
          cx: "30",
          cy: "10",
          r: "2",
          stroke: l.value.style.backgroundColor,
          "stroke-width": 0.3,
          fill: l.value.style.dumbbell.color
        }, null, 8, Bl),
        t("circle", {
          cx: "46",
          cy: "10",
          r: "2",
          stroke: l.value.style.backgroundColor,
          "stroke-width": 0.3,
          fill: l.value.style.dumbbell.color
        }, null, 8, Wl),
        t("path", {
          d: `
                    M 10,21
                    C 23,20 23,20
                    36,21
                    L 36,19
                    C 23,20 23,20
                    10,19 Z
                `,
          fill: l.value.style.dumbbell.color
        }, null, 8, zl),
        t("circle", {
          cx: "10",
          cy: "20",
          r: "2",
          stroke: l.value.style.backgroundColor,
          "stroke-width": 0.3,
          fill: l.value.style.dumbbell.color
        }, null, 8, jl),
        t("circle", {
          cx: "36",
          cy: "20",
          r: "2",
          stroke: l.value.style.backgroundColor,
          "stroke-width": 0.3,
          fill: l.value.style.dumbbell.color
        }, null, 8, ql),
        t("path", {
          d: `
                    M 30,31
                    C 45,30 45,30
                    60,31
                    L 60,29
                    C 45,30 45,30
                    30,29 Z
                `,
          fill: l.value.style.dumbbell.color
        }, null, 8, Hl),
        t("circle", {
          cx: "30",
          cy: "30",
          r: "2",
          stroke: l.value.style.backgroundColor,
          "stroke-width": 0.3,
          fill: l.value.style.dumbbell.color
        }, null, 8, El),
        t("circle", {
          cx: "60",
          cy: "30",
          r: "2",
          stroke: l.value.style.backgroundColor,
          "stroke-width": 0.3,
          fill: l.value.style.dumbbell.color
        }, null, 8, Sl),
        t("path", {
          d: `
                    M 50,41
                    C 65,40 65,40
                    80,41
                    L 80,39
                    C 65,40 65,40
                    50,39 Z
                `,
          fill: l.value.style.dumbbell.color
        }, null, 8, Zl),
        t("circle", {
          cx: "50",
          cy: "40",
          r: "2",
          stroke: l.value.style.backgroundColor,
          "stroke-width": 0.3,
          fill: l.value.style.dumbbell.color
        }, null, 8, Il),
        t("circle", {
          cx: "80",
          cy: "40",
          r: "2",
          stroke: l.value.style.backgroundColor,
          "stroke-width": 0.3,
          fill: l.value.style.dumbbell.color
        }, null, 8, Nl),
        t("path", {
          d: `
                    M 40,51
                    C 65,50 65,50
                    90,51
                    L 90,49
                    C 65,50 65,50
                    40,49 Z
                `,
          fill: l.value.style.dumbbell.color
        }, null, 8, Fl),
        t("circle", {
          cx: "40",
          cy: "50",
          r: "2",
          stroke: l.value.style.backgroundColor,
          "stroke-width": 0.3,
          fill: l.value.style.dumbbell.color
        }, null, 8, Ol),
        t("circle", {
          cx: "90",
          cy: "50",
          r: "2",
          stroke: l.value.style.backgroundColor,
          "stroke-width": 0.3,
          fill: l.value.style.dumbbell.color
        }, null, 8, Vl)
      ], 12, $l)) : a("", !0),
      u.value === "stripPlot" ? (o(), e("svg", {
        key: 6,
        xmlns: s(c),
        width: "100%",
        viewBox: "0 0 100 100",
        style: n(`background:${l.value.style.backgroundColor}`)
      }, [
        d(y),
        t("line", {
          x1: "3",
          x2: "3",
          y1: "3",
          y2: "97",
          stroke: l.value.style.stripPlot.color,
          "stroke-width": 0.5,
          "stroke-linecap": "round",
          "stroke-linejoin": "round"
        }, null, 8, Gl),
        t("line", {
          x1: "3",
          x2: "97",
          y1: "97",
          y2: "97",
          stroke: l.value.style.stripPlot.color,
          "stroke-width": 0.5,
          "stroke-linecap": "round",
          "stroke-linejoin": "round"
        }, null, 8, Rl),
        t("circle", {
          cx: "12",
          cy: "8",
          r: "4",
          stroke: l.value.style.backgroundColor,
          "stroke-width": 0.3,
          fill: l.value.style.stripPlot.color,
          style: { opacity: "0.5" }
        }, null, 8, Tl),
        t("circle", {
          cx: "12",
          cy: "40",
          r: "4",
          stroke: l.value.style.backgroundColor,
          "stroke-width": 0.3,
          fill: l.value.style.stripPlot.color,
          style: { opacity: "0.5" }
        }, null, 8, Yl),
        t("circle", {
          cx: "12",
          cy: "60",
          r: "4",
          stroke: l.value.style.backgroundColor,
          "stroke-width": 0.3,
          fill: l.value.style.stripPlot.color,
          style: { opacity: "0.5" }
        }, null, 8, Dl),
        t("circle", {
          cx: "12",
          cy: "70",
          r: "4",
          stroke: l.value.style.backgroundColor,
          "stroke-width": 0.3,
          fill: l.value.style.stripPlot.color,
          style: { opacity: "0.5" }
        }, null, 8, Ul),
        t("circle", {
          cx: "32",
          cy: "25",
          r: "4",
          stroke: l.value.style.backgroundColor,
          "stroke-width": 0.3,
          fill: l.value.style.stripPlot.color,
          style: { opacity: "0.5" }
        }, null, 8, Jl),
        t("circle", {
          cx: "32",
          cy: "38",
          r: "4",
          stroke: l.value.style.backgroundColor,
          "stroke-width": 0.3,
          fill: l.value.style.stripPlot.color,
          style: { opacity: "0.5" }
        }, null, 8, Kl),
        t("circle", {
          cx: "32",
          cy: "44",
          r: "4",
          stroke: l.value.style.backgroundColor,
          "stroke-width": 0.3,
          fill: l.value.style.stripPlot.color,
          style: { opacity: "0.5" }
        }, null, 8, Ql),
        t("circle", {
          cx: "32",
          cy: "55",
          r: "4",
          stroke: l.value.style.backgroundColor,
          "stroke-width": 0.3,
          fill: l.value.style.stripPlot.color,
          style: { opacity: "0.5" }
        }, null, 8, lt),
        t("circle", {
          cx: "52",
          cy: "30",
          r: "4",
          stroke: l.value.style.backgroundColor,
          "stroke-width": 0.3,
          fill: l.value.style.stripPlot.color,
          style: { opacity: "0.5" }
        }, null, 8, tt),
        t("circle", {
          cx: "52",
          cy: "33",
          r: "4",
          stroke: l.value.style.backgroundColor,
          "stroke-width": 0.3,
          fill: l.value.style.stripPlot.color,
          style: { opacity: "0.5" }
        }, null, 8, et),
        t("circle", {
          cx: "52",
          cy: "43",
          r: "4",
          stroke: l.value.style.backgroundColor,
          "stroke-width": 0.3,
          fill: l.value.style.stripPlot.color,
          style: { opacity: "0.5" }
        }, null, 8, ot),
        t("circle", {
          cx: "52",
          cy: "63",
          r: "4",
          stroke: l.value.style.backgroundColor,
          "stroke-width": 0.3,
          fill: l.value.style.stripPlot.color,
          style: { opacity: "0.5" }
        }, null, 8, st),
        t("circle", {
          cx: "52",
          cy: "78",
          r: "4",
          stroke: l.value.style.backgroundColor,
          "stroke-width": 0.3,
          fill: l.value.style.stripPlot.color,
          style: { opacity: "0.5" }
        }, null, 8, rt),
        t("circle", {
          cx: "72",
          cy: "58",
          r: "4",
          stroke: l.value.style.backgroundColor,
          "stroke-width": 0.3,
          fill: l.value.style.stripPlot.color,
          style: { opacity: "0.5" }
        }, null, 8, it),
        t("circle", {
          cx: "72",
          cy: "70",
          r: "4",
          stroke: l.value.style.backgroundColor,
          "stroke-width": 0.3,
          fill: l.value.style.stripPlot.color,
          style: { opacity: "0.5" }
        }, null, 8, nt),
        t("circle", {
          cx: "72",
          cy: "78",
          r: "4",
          stroke: l.value.style.backgroundColor,
          "stroke-width": 0.3,
          fill: l.value.style.stripPlot.color,
          style: { opacity: "0.5" }
        }, null, 8, at),
        t("circle", {
          cx: "72",
          cy: "88",
          r: "4",
          stroke: l.value.style.backgroundColor,
          "stroke-width": 0.3,
          fill: l.value.style.stripPlot.color,
          style: { opacity: "0.5" }
        }, null, 8, ct),
        t("circle", {
          cx: "92",
          cy: "66",
          r: "4",
          stroke: l.value.style.backgroundColor,
          "stroke-width": 0.3,
          fill: l.value.style.stripPlot.color,
          style: { opacity: "0.5" }
        }, null, 8, ut),
        t("circle", {
          cx: "92",
          cy: "77",
          r: "4",
          stroke: l.value.style.backgroundColor,
          "stroke-width": 0.3,
          fill: l.value.style.stripPlot.color,
          style: { opacity: "0.5" }
        }, null, 8, dt),
        t("circle", {
          cx: "92",
          cy: "85",
          r: "4",
          stroke: l.value.style.backgroundColor,
          "stroke-width": 0.3,
          fill: l.value.style.stripPlot.color,
          style: { opacity: "0.5" }
        }, null, 8, yt),
        t("circle", {
          cx: "92",
          cy: "88",
          r: "4",
          stroke: l.value.style.backgroundColor,
          "stroke-width": 0.3,
          fill: l.value.style.stripPlot.color,
          style: { opacity: "0.5" }
        }, null, 8, kt),
        t("circle", {
          cx: "92",
          cy: "90",
          r: "4",
          stroke: l.value.style.backgroundColor,
          "stroke-width": 0.3,
          fill: l.value.style.stripPlot.color,
          style: { opacity: "0.5" }
        }, null, 8, ht),
        t("circle", {
          cx: "92",
          cy: "92",
          r: "4",
          stroke: l.value.style.backgroundColor,
          "stroke-width": 0.3,
          fill: l.value.style.stripPlot.color,
          style: { opacity: "0.5" }
        }, null, 8, vt)
      ], 12, Xl)) : a("", !0),
      u.value === "treemap" ? (o(), e("svg", {
        key: 7,
        xmlns: s(c),
        width: "100%",
        viewBox: "0 0 30 21",
        style: n(`background:${l.value.style.backgroundColor}`)
      }, [
        d(y),
        t("path", {
          fill: "none",
          stroke: l.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, xt)
      ], 12, _t)) : a("", !0),
      u.value === "galaxy" ? (o(), e("svg", {
        key: 8,
        xmlns: s(c),
        width: "100%",
        viewBox: "0.5 0 20 20",
        style: n(`background:${l.value.style.backgroundColor}`)
      }, [
        d(y),
        t("path", {
          fill: "none",
          stroke: l.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, gt)
      ], 12, pt)) : a("", !0),
      u.value === "bar3d" ? (o(), e("svg", {
        key: 9,
        xmlns: s(c),
        width: "100%",
        viewBox: "2 0 16 20",
        style: n(`background:${l.value.style.backgroundColor}`)
      }, [
        d(y),
        t("path", {
          fill: "none",
          stroke: l.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, wt)
      ], 12, ft)) : a("", !0),
      u.value === "sparkHistogram" ? (o(), e("svg", {
        key: 10,
        xmlns: s(c),
        width: "100%",
        viewBox: "0 0 100 20",
        style: n(`background:${l.value.style.backgroundColor}`)
      }, [
        d(y),
        t("rect", {
          x: "3",
          y: "8",
          height: "4",
          width: "6",
          rx: "1.5",
          fill: l.value.style.sparkHistogram.color
        }, null, 8, bt),
        t("rect", {
          x: "11",
          y: "6",
          height: "8",
          width: "6",
          rx: "2",
          fill: l.value.style.sparkHistogram.color
        }, null, 8, Mt),
        t("rect", {
          x: "19",
          y: "7",
          height: "6",
          width: "6",
          rx: "2",
          fill: l.value.style.sparkHistogram.color
        }, null, 8, Ct),
        t("rect", {
          x: "27",
          y: "6",
          height: "8",
          width: "6",
          rx: "2",
          fill: l.value.style.sparkHistogram.color
        }, null, 8, Lt),
        t("rect", {
          x: "35",
          y: "8",
          height: "4",
          width: "6",
          rx: "1.5",
          fill: l.value.style.sparkHistogram.color
        }, null, 8, $t),
        t("rect", {
          x: "43",
          y: "7",
          height: "6",
          width: "6",
          rx: "2",
          fill: l.value.style.sparkHistogram.color
        }, null, 8, At),
        t("rect", {
          x: "51",
          y: "8.5",
          height: "3",
          width: "6",
          rx: "1.5",
          fill: l.value.style.sparkHistogram.color
        }, null, 8, Pt),
        t("rect", {
          x: "59",
          y: "7",
          height: "6",
          width: "6",
          rx: "2",
          fill: l.value.style.sparkHistogram.color
        }, null, 8, Bt),
        t("rect", {
          x: "67",
          y: "6",
          height: "8",
          width: "6",
          rx: "2",
          fill: l.value.style.sparkHistogram.color
        }, null, 8, Wt),
        t("rect", {
          x: "75",
          y: "7",
          height: "6",
          width: "6",
          rx: "2",
          fill: l.value.style.sparkHistogram.color
        }, null, 8, zt),
        t("rect", {
          x: "83",
          y: "7",
          height: "6",
          width: "6",
          rx: "2",
          fill: l.value.style.sparkHistogram.color
        }, null, 8, jt),
        t("rect", {
          x: "91",
          y: "8",
          height: "4",
          width: "6",
          rx: "1.5",
          fill: l.value.style.sparkHistogram.color
        }, null, 8, qt)
      ], 12, mt)) : a("", !0),
      u.value === "sparkbar" ? (o(), e("svg", {
        key: 11,
        xmlns: s(c),
        width: "100%",
        viewBox: "0 0 500 200",
        style: n(`background:${l.value.style.backgroundColor}`)
      }, [
        d(y),
        t("line", {
          x1: "12",
          x2: "488",
          y1: "50",
          y2: "50",
          "stroke-width": "16",
          "stroke-linecap": "round",
          stroke: l.value.style.sparkbar.color,
          opacity: "0.5"
        }, null, 8, Et),
        t("line", {
          x1: "12",
          x2: "400",
          y1: "50",
          y2: "50",
          "stroke-width": "16",
          "stroke-linecap": "round",
          stroke: l.value.style.sparkbar.color,
          opacity: "1"
        }, null, 8, St),
        t("line", {
          x1: "12",
          x2: "488",
          y1: "100",
          y2: "100",
          "stroke-width": "16",
          "stroke-linecap": "round",
          stroke: l.value.style.sparkbar.color,
          opacity: "0.5"
        }, null, 8, Zt),
        t("line", {
          x1: "12",
          x2: "350",
          y1: "100",
          y2: "100",
          "stroke-width": "16",
          "stroke-linecap": "round",
          stroke: l.value.style.sparkbar.color,
          opacity: "1"
        }, null, 8, It),
        t("line", {
          x1: "12",
          x2: "488",
          y1: "150",
          y2: "150",
          "stroke-width": "16",
          "stroke-linecap": "round",
          stroke: l.value.style.sparkbar.color,
          opacity: "0.5"
        }, null, 8, Nt),
        t("line", {
          x1: "12",
          x2: "235",
          y1: "150",
          y2: "150",
          "stroke-width": "16",
          "stroke-linecap": "round",
          stroke: l.value.style.sparkbar.color,
          opacity: "1"
        }, null, 8, Ft)
      ], 12, Ht)) : a("", !0),
      u.value === "sparkStackbar" ? (o(), e("svg", {
        key: 12,
        xmlns: s(c),
        width: "100%",
        viewBox: "0 0 500 64",
        style: n(`background:${l.value.style.backgroundColor}`)
      }, [
        d(y),
        t("line", {
          x1: "12",
          x2: "488",
          y1: "32",
          y2: "32",
          "stroke-width": "16",
          "stroke-linecap": "round",
          stroke: l.value.style.sparkStackbar.color,
          opacity: "0.5"
        }, null, 8, Vt),
        t("line", {
          x1: "12",
          x2: "380",
          y1: "32",
          y2: "32",
          "stroke-width": "16",
          "stroke-linecap": "round",
          stroke: l.value.style.sparkStackbar.color,
          opacity: "0.6"
        }, null, 8, Xt),
        t("line", {
          x1: "12",
          x2: "200",
          y1: "32",
          y2: "32",
          "stroke-width": "16",
          "stroke-linecap": "round",
          stroke: l.value.style.sparkStackbar.color,
          opacity: "0.8"
        }, null, 8, Gt),
        t("line", {
          x1: "12",
          x2: "120",
          y1: "32",
          y2: "32",
          "stroke-width": "16",
          "stroke-linecap": "round",
          stroke: l.value.style.sparkStackbar.color,
          opacity: "1"
        }, null, 8, Rt)
      ], 12, Ot)) : a("", !0),
      u.value === "thermometer" ? (o(), e("svg", {
        key: 13,
        width: "100%",
        viewBox: "0 0 20 20",
        style: n(`background:${l.value.style.backgroundColor}`)
      }, [
        d(y),
        t("path", {
          fill: "none",
          stroke: l.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, Tt),
        t("path", {
          stroke: l.value.style.thermometer.color,
          "stroke-width": "1",
          style: { opacity: "0.6" },
          d: "M 10 17 L 10 12 ",
          "stroke-linecap": "round"
        }, null, 8, Yt),
        t("path", {
          "stroke-linecap": "round",
          stroke: l.value.style.thermometer.color,
          "stroke-width": "1",
          opacity: "M 10 17 L 10 9"
        }, null, 8, Dt),
        t("path", {
          "stroke-linecap": "round",
          stroke: l.value.style.thermometer.color,
          "stroke-width": "1",
          opacity: "0.3",
          d: "M 10 17 L 10 6"
        }, null, 8, Ut),
        t("path", {
          "stroke-linecap": "round",
          stroke: l.value.style.thermometer.color,
          "stroke-width": "1",
          style: { opacity: "0.1" },
          d: "M 10 17 L 10 3"
        }, null, 8, Jt)
      ], 4)) : a("", !0),
      u.value === "relationCircle" ? (o(), e("svg", {
        key: 14,
        xmlns: s(c),
        width: "100%",
        viewBox: "0 0 20 20",
        style: n(`background:${l.value.style.backgroundColor}`)
      }, [
        d(y),
        t("path", {
          fill: "none",
          stroke: l.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, Qt)
      ], 12, Kt)) : a("", !0),
      u.value === "molecule" ? (o(), e("svg", {
        key: 15,
        xmlns: s(c),
        width: "100%",
        viewBox: "0 0 100 100",
        style: n(`background:${l.value.style.backgroundColor}`)
      }, [
        d(y),
        t("circle", {
          cx: "50",
          cy: "50",
          r: "6",
          "stroke-width": "2",
          fill: "none",
          stroke: l.value.style.molecule.color
        }, null, 8, te),
        t("circle", {
          cx: "20",
          cy: "50",
          r: "3",
          "stroke-width": "1.6",
          fill: "none",
          stroke: l.value.style.molecule.color
        }, null, 8, ee),
        t("circle", {
          cx: "80",
          cy: "50",
          r: "3",
          "stroke-width": "1.6",
          fill: "none",
          stroke: l.value.style.molecule.color
        }, null, 8, oe),
        t("circle", {
          cx: "50",
          cy: "20",
          r: "3",
          "stroke-width": "1.6",
          fill: "none",
          stroke: l.value.style.molecule.color
        }, null, 8, se),
        t("circle", {
          cx: "50",
          cy: "80",
          r: "3",
          "stroke-width": "1.6",
          fill: "none",
          stroke: l.value.style.molecule.color
        }, null, 8, re),
        t("line", {
          x1: "50",
          x2: "50",
          y1: "23",
          y2: "45",
          "stroke-width": "1",
          stroke: l.value.style.molecule.color
        }, null, 8, ie),
        t("line", {
          x1: "50",
          x2: "50",
          y1: "77",
          y2: "55",
          "stroke-width": "1",
          stroke: l.value.style.molecule.color
        }, null, 8, ne),
        t("line", {
          x1: "23",
          x2: "45",
          y1: "50",
          y2: "50",
          "stroke-width": "1",
          stroke: l.value.style.molecule.color
        }, null, 8, ae),
        t("line", {
          x1: "77",
          x2: "55",
          y1: "50",
          y2: "50",
          "stroke-width": "1",
          stroke: l.value.style.molecule.color
        }, null, 8, ce)
      ], 12, le)) : a("", !0),
      u.value === "tiremarks" ? (o(), e("svg", {
        key: 16,
        xmlns: s(c),
        width: "100%",
        viewBox: "0 0 312 56",
        style: n(`background:${l.value.style.backgroundColor}`)
      }, [
        d(y),
        (o(), e(k, null, v(100, (r) => t("g", null, [
          t("line", {
            x1: 10 + r * 2.9,
            y1: 6,
            x2: 10 + r * 2.9,
            y2: 50,
            stroke: l.value.style.tiremarks.color,
            style: n(r > 80 ? "opacity: 0.5" : ""),
            "stroke-linecap": "round"
          }, null, 12, de)
        ])), 64))
      ], 12, ue)) : a("", !0),
      u.value === "pyramid" ? (o(), e("svg", {
        key: 17,
        xmlns: s(c),
        width: "100%",
        viewBox: "0 0 105 80",
        style: n(`background:${l.value.style.backgroundColor}`)
      }, [
        d(y),
        (o(!0), e(k, null, v(m.value, (r, i) => (o(), e("g", null, [
          t("rect", {
            x: 50 - r[0],
            y: i * (80 / m.value.length),
            width: r[0],
            height: 80 / m.value.length * 0.95,
            fill: l.value.style.pyramid.color
          }, null, 8, ke),
          t("rect", {
            x: 55,
            y: i * (80 / m.value.length),
            width: r[1],
            height: 80 / m.value.length * 0.95,
            fill: l.value.style.pyramid.color
          }, null, 8, he)
        ]))), 256))
      ], 12, ye)) : a("", !0),
      u.value === "rings" ? (o(), e("svg", {
        key: 18,
        xmlns: s(c),
        width: "100%",
        viewBox: "0 0 400 400",
        style: n(`background:${l.value.style.backgroundColor}`)
      }, [
        d(y),
        t("circle", {
          cx: 200,
          cy: 200,
          r: 180,
          fill: s(h)(l.value.style.rings.color, 40)
        }, null, 8, _e),
        t("circle", {
          cx: 200,
          cy: 250,
          r: 130,
          fill: s(h)(l.value.style.rings.color, 60)
        }, null, 8, xe),
        t("circle", {
          cx: 200,
          cy: 290,
          r: 90,
          fill: s(h)(l.value.style.rings.color, 100)
        }, null, 8, pe)
      ], 12, ve)) : a("", !0),
      u.value === "wheel" ? (o(), e("svg", {
        key: 19,
        xmlns: s(c),
        width: "100%",
        viewBox: "0 0 400 400",
        style: n(`background:${l.value.style.backgroundColor}`)
      }, [
        d(y),
        (o(!0), e(k, null, v(I.value, (r, i) => (o(), e("line", {
          x1: r.x1,
          x2: r.x2,
          y1: r.y1,
          y2: r.y2,
          stroke: i < 66 ? r.color : s(h)(r.color, 50),
          "stroke-width": 5,
          "stroke-linecap": "round"
        }, null, 8, fe))), 256)),
        t("circle", {
          cx: 200,
          cy: 200,
          r: 130,
          "stroke-width": 3,
          stroke: s(h)(l.value.style.wheel.color, 50),
          fill: "none"
        }, null, 8, we),
        t("rect", {
          fill: s(h)(l.value.style.wheel.color, 50),
          rx: 12,
          x: 160,
          y: 170,
          height: 60,
          width: 80,
          stroke: "none"
        }, null, 8, me)
      ], 12, ge)) : a("", !0),
      u.value === "sparkline" ? (o(), e("svg", {
        key: 20,
        xmlns: s(c),
        width: "100%",
        viewBox: "0 0 150 32",
        style: n(`background:${l.value.style.backgroundColor}`)
      }, [
        d(y),
        t("g", null, [
          t("rect", {
            x: "2",
            y: "2",
            height: "6",
            width: "24",
            fill: l.value.style.sparkline.color,
            rx: "3"
          }, null, 8, Me),
          t("rect", {
            x: "2",
            y: "12",
            height: "16",
            width: "16",
            fill: l.value.style.sparkline.color,
            rx: "3"
          }, null, 8, Ce)
        ]),
        (o(!0), e(k, null, v(M.value, (r, i) => (o(), e("g", null, [
          i < M.value.length - 1 ? (o(), e("line", {
            key: 0,
            x1: r.x,
            y1: r.y,
            x2: M.value[i + 1].x,
            y2: M.value[i + 1].y,
            "stroke-width": l.value.style.sparkline.strokeWidth,
            stroke: l.value.style.sparkline.color,
            "stroke-linecap": "round",
            "stroke-linejoin": "round"
          }, null, 8, Le)) : a("", !0)
        ]))), 256))
      ], 12, be)) : a("", !0),
      u.value === "candlesticks" ? (o(), e("svg", {
        key: 21,
        xmlns: s(c),
        width: "100%",
        viewBox: "0 0 512 316",
        style: n(`background:${l.value.style.backgroundColor}`)
      }, [
        d(y),
        l.value.style.candlesticks.axis.show ? (o(), e("g", Ae, [
          t("line", {
            x1: 2,
            x2: 2,
            y1: 2,
            y2: 314,
            stroke: l.value.style.candlesticks.axis.color,
            "stroke-width": l.value.style.candlesticks.axis.strokeWidth,
            "stroke-linecap": "round"
          }, null, 8, Pe),
          t("line", {
            x1: 2,
            x2: 510,
            y1: 314,
            y2: 314,
            stroke: l.value.style.candlesticks.axis.color,
            "stroke-width": l.value.style.candlesticks.axis.strokeWidth,
            "stroke-linecap": "round"
          }, null, 8, Be)
        ])) : a("", !0),
        (o(!0), e(k, null, v(x.value, (r, i) => (o(), e("g", null, [
          t("line", {
            x1: 24 + 464 * i / (x.value.length - 1) - 464 / (x.value.length - 1) / 8,
            x2: 24 + 464 * i / (x.value.length - 1) + 464 / (x.value.length - 1) / 8,
            y1: r.y,
            y2: r.y,
            stroke: l.value.style.candlesticks.candle.color,
            "stroke-width": l.value.style.candlesticks.candle.strokeWidth,
            "stroke-linecap": "round"
          }, null, 8, We),
          t("line", {
            x1: 24 + 464 * i / (x.value.length - 1) - 464 / (x.value.length - 1) / 8,
            x2: 24 + 464 * i / (x.value.length - 1) + 464 / (x.value.length - 1) / 8,
            y1: r.y + r.height,
            y2: r.y + r.height,
            stroke: l.value.style.candlesticks.candle.color,
            "stroke-width": l.value.style.candlesticks.candle.strokeWidth,
            "stroke-linecap": "round"
          }, null, 8, ze),
          t("line", {
            x1: 24 + 464 * i / (x.value.length - 1),
            x2: 24 + 464 * i / (x.value.length - 1),
            y1: r.y,
            y2: r.y + r.height,
            stroke: l.value.style.candlesticks.candle.color,
            "stroke-width": l.value.style.candlesticks.candle.strokeWidth,
            "stroke-linecap": "round"
          }, null, 8, je),
          t("rect", {
            x: 24 + 464 * i / (x.value.length - 1) - 464 / (x.value.length - 1) / 8,
            y: r.y + (r.height - r.bar * 1.5),
            height: r.bar,
            width: 464 / (x.value.length - 1) / 4,
            fill: l.value.style.candlesticks.candle.color,
            rx: "1"
          }, null, 8, qe)
        ]))), 256))
      ], 12, $e)) : a("", !0),
      u.value === "heatmap" ? (o(), e("svg", {
        key: 22,
        xmlns: s(c),
        width: "100%",
        viewBox: `0 0 ${10 * l.value.style.heatmap.cellsX} ${10 * l.value.style.heatmap.cellsY}`,
        style: n(`background:${l.value.style.backgroundColor}`)
      }, [
        d(y),
        (o(!0), e(k, null, v(l.value.style.heatmap.cellsY, (r, i) => (o(), e("g", null, [
          (o(!0), e(k, null, v(l.value.style.heatmap.cellsX, (L, p) => (o(), e("g", null, [
            t("rect", {
              x: p * 10,
              y: i * 10,
              height: 10,
              width: 10,
              stroke: l.value.style.backgroundColor,
              "stroke-width": 1,
              fill: s(h)(l.value.style.heatmap.color, Math.round(Math.random() * 100))
            }, null, 8, Ee)
          ]))), 256))
        ]))), 256))
      ], 12, He)) : a("", !0),
      u.value === "chestnut" ? (o(), e("svg", {
        key: 23,
        xmlns: s(c),
        width: "100%",
        viewBox: "0 0 512 316",
        style: n(`background:${l.value.style.backgroundColor}`)
      }, [
        d(y),
        (o(!0), e(k, null, v(b.value, (r) => (o(), e("g", null, [
          (o(!0), e(k, null, v(r.bars, (i) => (o(), e("g", null, [
            (o(), e(k, null, v(22, (L, p) => t("path", {
              d: `M
                            ${i.x},${i.y + p}
                            C${i.x - 20},${i.y + p} 
                            ${i.x - 80},${i.y + p} 
                            ${r.root.x + r.root.r / 2}, ${r.root.y}
                        `,
              stroke: s(h)(l.value.style.chestnut.color, i.opacity * 0.2),
              fill: "none",
              "stroke-width": "2",
              "shape-rendering": "cirspEdges"
            }, null, 8, Ze)), 64))
          ]))), 256))
        ]))), 256)),
        (o(!0), e(k, null, v(b.value, (r) => (o(), e("circle", {
          cx: r.root.x,
          cy: r.root.y,
          r: r.root.r,
          fill: `${l.value.style.backgroundColor}`,
          stroke: l.value.backgroundColor,
          "stroke-width": 3
        }, null, 8, Ie))), 256)),
        (o(!0), e(k, null, v(b.value, (r) => (o(), e("circle", {
          cx: r.root.x,
          cy: r.root.y,
          r: r.root.r,
          fill: s(h)(l.value.style.chestnut.color, r.root.opacity),
          stroke: l.value.style.backgroundColor,
          "stroke-width": 3
        }, null, 8, Ne))), 256)),
        (o(!0), e(k, null, v(b.value, (r) => (o(), e("g", null, [
          (o(!0), e(k, null, v(r.bars, (i) => (o(), e("rect", {
            rx: "2",
            x: i.x,
            y: i.y,
            width: i.width,
            height: 22,
            fill: s(h)(l.value.style.chestnut.color, i.opacity)
          }, null, 8, Fe))), 256)),
          (o(!0), e(k, null, v(r.bars, (i) => (o(), e("circle", {
            cx: i.x + i.width + 32,
            cy: i.y + 11,
            r: 11,
            fill: s(h)(l.value.style.chestnut.color, i.opacity)
          }, null, 8, Oe))), 256)),
          (o(!0), e(k, null, v(r.bars, (i) => (o(), e("circle", {
            cx: i.x + i.width + 32,
            cy: i.y + 11,
            r: 5,
            fill: l.value.style.backgroundColor
          }, null, 8, Ve))), 256))
        ]))), 256)),
        t("line", {
          x1: 200,
          x2: 200,
          y1: 10,
          y2: 300,
          stroke: l.value.style.backgroundColor,
          "stroke-width": 3
        }, null, 8, Xe)
      ], 12, Se)) : a("", !0),
      u.value === "donutEvolution" ? (o(), e("svg", {
        key: 24,
        xmlns: s(c),
        width: "100%",
        viewBox: "0 0 108 70",
        style: n(`background:${l.value.style.backgroundColor}`)
      }, [
        d(y),
        l.value.style.line.axis.show ? (o(), e("path", {
          key: 0,
          d: "M3 3 3 67 105 67",
          stroke: l.value.style.donutEvolution.axis.color,
          "stroke-width": l.value.style.donutEvolution.axis.strokeWidth,
          "stroke-linecap": "round",
          "stroke-linejoin": "round",
          fill: "none"
        }, null, 8, Re)) : a("", !0),
        t("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: l.value.style.donutEvolution.donuts.color,
          "stroke-width": l.value.style.donutEvolution.donuts.strokeWidth
        }, null, 8, Te),
        t("path", {
          fill: "none",
          d: "M19 52 27 45M37 45 44 49M52 46 62 38M71 36 78 40M86 37 97 18",
          stroke: l.value.style.donutEvolution.axis.color,
          "stroke-width": l.value.style.donutEvolution.axis.strokeWidth,
          "stroke-linecap": "round",
          "stroke-linejoin": "round"
        }, null, 8, Ye),
        t("path", {
          d: "M10 55 12 55C12 53 14 52 15 52L15 50C13 50 10 52 10 55",
          fill: l.value.style.donutEvolution.donuts.color,
          stroke: "none",
          style: { opacity: "0.3" }
        }, null, 8, De),
        t("path", {
          d: "M32 48 32 50C35 50 37 47 37 45L35 45C35 47 33 48 32 48",
          fill: l.value.style.donutEvolution.donuts.color,
          stroke: "none",
          style: { opacity: "0.3" }
        }, null, 8, Ue),
        t("path", {
          d: "M49 53 49 55A1 1 0 0049 45L49 47C53 47 53 53 49 53",
          fill: l.value.style.donutEvolution.donuts.color,
          stroke: "none",
          style: { opacity: "0.3" }
        }, null, 8, Je),
        t("path", {
          d: "M63 35C63 33 65 32 66 32L66 30C63 30 61 33 61 35L63 35",
          fill: l.value.style.donutEvolution.donuts.color,
          stroke: "none",
          style: { opacity: "0.3" }
        }, null, 8, Ke),
        t("path", {
          d: "M78 41A1 1 0 0088 41L86 41C86 45 80 45 80 41L78 41",
          fill: l.value.style.donutEvolution.donuts.color,
          stroke: "none",
          style: { opacity: "0.3" }
        }, null, 8, Qe),
        t("path", {
          d: "M95 14C95 17 98 19 100 19L100 17C99 17 97 16 97 14L95 14",
          fill: l.value.style.donutEvolution.donuts.color,
          stroke: "none",
          style: { opacity: "0.3" }
        }, null, 8, lo)
      ], 12, Ge)) : a("", !0),
      u.value === "line" ? (o(), e("svg", {
        key: 25,
        xmlns: s(c),
        width: "100%",
        viewBox: "0 0 100 70",
        style: n(`background:${l.value.style.backgroundColor}`)
      }, [
        d(y),
        l.value.style.line.axis.show ? (o(), e("g", eo, [
          t("line", {
            x1: "3",
            x2: "3",
            y1: "3",
            y2: "67",
            stroke: l.value.style.line.axis.color,
            "stroke-width": l.value.style.line.axis.strokeWidth,
            "stroke-linecap": "round",
            "stroke-linejoin": "round"
          }, null, 8, oo),
          t("line", {
            x1: "3",
            x2: "97",
            y1: "67",
            y2: "67",
            stroke: l.value.style.line.axis.color,
            "stroke-width": l.value.style.line.axis.strokeWidth,
            "stroke-linecap": "round",
            "stroke-linejoin": "round"
          }, null, 8, so)
        ])) : a("", !0),
        t("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: l.value.style.line.path.color,
          "stroke-width": l.value.style.line.path.strokeWidth
        }, null, 8, ro),
        l.value.style.line.path.showPlots ? (o(), e("g", io, [
          t("circle", {
            cx: "9",
            cy: "60",
            r: l.value.style.line.path.strokeWidth,
            fill: l.value.style.line.path.color
          }, null, 8, no),
          t("circle", {
            cx: "90",
            cy: "12",
            r: l.value.style.line.path.strokeWidth,
            fill: l.value.style.line.path.color
          }, null, 8, ao)
        ])) : a("", !0)
      ], 12, to)) : a("", !0),
      u.value === "bar" ? (o(), e("svg", {
        key: 26,
        xmlns: s(c),
        width: "100%",
        viewBox: "0 0 100 70",
        style: n(`background:${l.value.style.backgroundColor}`)
      }, [
        d(y),
        l.value.style.bar.axis.show ? (o(), e("g", uo, [
          t("line", {
            x1: "3",
            x2: "3",
            y1: "3",
            y2: "67",
            stroke: l.value.style.bar.axis.color,
            "stroke-width": l.value.style.bar.axis.strokeWidth,
            "stroke-linecap": "round",
            "stroke-linejoin": "round"
          }, null, 8, yo),
          t("line", {
            x1: "3",
            x2: "97",
            y1: "67",
            y2: "67",
            stroke: l.value.style.bar.axis.color,
            "stroke-width": l.value.style.bar.axis.strokeWidth,
            "stroke-linecap": "round",
            "stroke-linejoin": "round"
          }, null, 8, ko)
        ])) : a("", !0),
        (o(!0), e(k, null, v(q.value, (r, i) => (o(), e("rect", {
          fill: l.value.style.bar.color,
          rx: l.value.style.bar.borderRadius,
          x: 6 + 11.2 * i,
          y: r,
          width: l.value.style.bar.barWidth,
          height: 67 - r
        }, null, 8, ho))), 256))
      ], 12, co)) : a("", !0),
      u.value === "donut" ? (o(), e("svg", {
        key: 27,
        xmlns: s(c),
        width: "100%",
        viewBox: "0 0 400 400",
        style: n(`background:${l.value.style.backgroundColor}`)
      }, [
        d(y),
        t("path", {
          d: " M 300 200 A 100 100 0 0 1 113 250",
          fill: "none",
          "stroke-width": l.value.style.donut.strokeWidth,
          stroke: l.value.style.donut.color
        }, null, 8, _o),
        t("path", {
          d: " M 113 250 A 100 100 0 0 1 250 113",
          fill: "none",
          "stroke-width": l.value.style.donut.strokeWidth,
          stroke: s(h)(l.value.style.donut.color, 60)
        }, null, 8, xo),
        t("path", {
          d: " M 250 113 A 100 100 0 0 1 300 200",
          fill: "none",
          "stroke-width": l.value.style.donut.strokeWidth,
          stroke: s(h)(l.value.style.donut.color, 30)
        }, null, 8, po)
      ], 12, vo)) : a("", !0),
      u.value === "onion" ? (o(), e("svg", {
        key: 28,
        xmlns: s(c),
        width: "100%",
        viewBox: "0 0 400 400",
        style: n(`background:${l.value.style.backgroundColor}`)
      }, [
        d(y),
        t("path", {
          d: " M 200 60 A 140 140 0 1 1 60 200",
          stroke: l.value.style.onion.color,
          "stroke-linecap": "round",
          "stroke-width": "20",
          fill: "none"
        }, null, 8, fo),
        t("path", {
          d: " M 200 100 A 100 100 0 1 1 100 200",
          stroke: s(h)(l.value.style.onion.color, 60),
          "stroke-linecap": "round",
          "stroke-width": "20",
          fill: "none"
        }, null, 8, wo),
        t("path", {
          d: " M 200 140 A 60 60 0 1 1 140 200",
          fill: "none",
          stroke: s(h)(l.value.style.onion.color, 40),
          "stroke-linecap": "round",
          "stroke-width": "20"
        }, null, 8, mo)
      ], 12, go)) : a("", !0),
      u.value === "gauge" ? (o(), e("svg", {
        key: 29,
        width: "100%",
        viewBox: "0 0 400 400",
        style: n(`background:${l.value.style.backgroundColor}`)
      }, [
        d(y),
        t("path", {
          d: " M 82 255 A 120 120 0 1 1 318 255",
          fill: "none",
          stroke: l.value.style.gauge.color,
          "stroke-linecap": "round",
          "stroke-width": "20"
        }, null, 8, bo),
        t("circle", {
          cx: "200",
          cy: "256",
          r: "12",
          fill: l.value.style.gauge.color
        }, null, 8, Mo),
        t("line", {
          x1: "200",
          y1: "256",
          x2: "250",
          y2: "160",
          "stroke-width": "8",
          stroke: l.value.style.gauge.color,
          "stroke-linecap": "round"
        }, null, 8, Co)
      ], 4)) : a("", !0),
      u.value === "quadrant" ? (o(), e("svg", {
        key: 30,
        xmlns: s(c),
        viewBox: "0 0 100 100",
        style: n(`background:${l.value.style.backgroundColor}`)
      }, [
        d(y),
        t("line", {
          x1: "50",
          x2: "50",
          y1: "3",
          y2: "97",
          stroke: l.value.style.quadrant.grid.color,
          "stroke-width": l.value.style.quadrant.grid.strokeWidth
        }, null, 8, $o),
        t("line", {
          x1: "3",
          x2: "97",
          y1: "50",
          y2: "50",
          stroke: l.value.style.quadrant.grid.color,
          "stroke-width": l.value.style.quadrant.grid.strokeWidth
        }, null, 8, Ao),
        t("circle", {
          fill: l.value.style.quadrant.plots.color,
          r: l.value.style.quadrant.plots.radius,
          cx: "20",
          cy: "20"
        }, null, 8, Po),
        t("circle", {
          fill: l.value.style.quadrant.plots.color,
          r: l.value.style.quadrant.plots.radius,
          cx: "80",
          cy: "60"
        }, null, 8, Bo),
        t("circle", {
          fill: l.value.style.quadrant.plots.color,
          r: l.value.style.quadrant.plots.radius,
          cx: "65",
          cy: "55"
        }, null, 8, Wo),
        t("circle", {
          fill: l.value.style.quadrant.plots.color,
          r: l.value.style.quadrant.plots.radius,
          cx: "36",
          cy: "67"
        }, null, 8, zo),
        t("circle", {
          fill: l.value.style.quadrant.plots.color,
          r: l.value.style.quadrant.plots.radius,
          cx: "15",
          cy: "75"
        }, null, 8, jo),
        t("circle", {
          fill: l.value.style.quadrant.plots.color,
          r: l.value.style.quadrant.plots.radius,
          cx: "40",
          cy: "55"
        }, null, 8, qo),
        t("circle", {
          fill: l.value.style.quadrant.plots.color,
          r: l.value.style.quadrant.plots.radius,
          cx: "76",
          cy: "32"
        }, null, 8, Ho),
        t("circle", {
          fill: l.value.style.quadrant.plots.color,
          r: l.value.style.quadrant.plots.radius,
          cx: "85",
          cy: "26"
        }, null, 8, Eo),
        t("circle", {
          fill: l.value.style.quadrant.plots.color,
          r: l.value.style.quadrant.plots.radius,
          cx: "55",
          cy: "46"
        }, null, 8, So)
      ], 12, Lo)) : a("", !0),
      u.value === "radar" ? (o(), e("svg", {
        key: 31,
        xmlns: s(c),
        viewBox: "0 0 100 100",
        style: n(`background:${l.value.style.backgroundColor}`)
      }, [
        d(y),
        t("path", {
          d: H.value,
          fill: "none",
          stroke: l.value.style.radar.grid.color,
          "stroke-width": l.value.style.radar.grid.strokeWidth,
          "stroke-linecap": "round",
          "stroke-linejoin": "round"
        }, null, 8, Io),
        t("path", {
          d: E.value,
          fill: "none",
          stroke: s(h)(l.value.style.radar.grid.color, 70),
          "stroke-width": l.value.style.radar.grid.strokeWidth / 2,
          "stroke-linecap": "round",
          "stroke-linejoin": "round"
        }, null, 8, No),
        t("path", {
          d: S.value,
          fill: "none",
          stroke: s(h)(l.value.style.radar.grid.color, 70),
          "stroke-width": l.value.style.radar.grid.strokeWidth / 2,
          "stroke-linecap": "round",
          "stroke-linejoin": "round"
        }, null, 8, Fo),
        t("path", {
          d: Z.value,
          fill: "none",
          stroke: s(h)(l.value.style.radar.grid.color, 70),
          "stroke-width": l.value.style.radar.grid.strokeWidth / 2.5,
          "stroke-linecap": "round",
          "stroke-linejoin": "round"
        }, null, 8, Oo),
        t("path", {
          d: "M 9,50 91,50",
          stroke: s(h)(l.value.style.radar.grid.color, 50),
          "stroke-width": l.value.style.radar.grid.strokeWidth / 2
        }, null, 8, Vo),
        t("path", {
          d: "M 29.5,14.5 70.5 85.5",
          stroke: s(h)(l.value.style.radar.grid.color, 50),
          "stroke-width": l.value.style.radar.grid.strokeWidth / 2
        }, null, 8, Xo),
        t("path", {
          d: "M 29.5,85.5 70.5 14.5",
          stroke: s(h)(l.value.style.radar.grid.color, 50),
          "stroke-width": l.value.style.radar.grid.strokeWidth / 2
        }, null, 8, Go),
        t("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: s(h)(l.value.style.radar.shapes.color, 30)
        }, null, 8, Ro),
        t("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: s(h)(l.value.style.radar.shapes.color, 50)
        }, null, 8, To)
      ], 12, Zo)) : a("", !0),
      u.value === "waffle" ? (o(), e("svg", {
        key: 32,
        xmlns: s(c),
        viewBox: "0 0 100 100",
        style: n(`background:${l.value.style.backgroundColor}`)
      }, [
        d(y),
        (o(), e(k, null, v(10, (r, i) => t("g", null, [
          (o(), e(k, null, v(10, (L, p) => t("g", null, [
            t("rect", {
              x: 3 + p * 9.5,
              y: 3 + i * 9.5,
              height: 9,
              width: 9,
              fill: s(h)(l.value.style.waffle.color, 20),
              rx: "1"
            }, null, 8, Do)
          ])), 64))
        ])), 64)),
        (o(), e(k, null, v(10, (r, i) => t("g", null, [
          (o(), e(k, null, v(10, (L, p) => t("g", null, [
            i > 2 ? (o(), e("rect", {
              key: 0,
              x: 3 + p * 9.5,
              y: 3 + i * 9.5,
              height: 9,
              width: 9,
              fill: s(h)(l.value.style.waffle.color, 30),
              rx: "1"
            }, null, 8, Uo)) : a("", !0)
          ])), 64))
        ])), 64)),
        (o(), e(k, null, v(10, (r, i) => t("g", null, [
          (o(), e(k, null, v(10, (L, p) => t("g", null, [
            i > 6 ? (o(), e("rect", {
              key: 0,
              x: 3 + p * 9.5,
              y: 3 + i * 9.5,
              height: 9,
              width: 9,
              fill: s(h)(l.value.style.waffle.color, 50),
              rx: "1"
            }, null, 8, Jo)) : a("", !0)
          ])), 64))
        ])), 64))
      ], 12, Yo)) : a("", !0),
      u.value === "table" ? (o(), e("svg", {
        key: 33,
        xmlns: s(c),
        width: "100%",
        viewBox: "0 0 100 70",
        style: n(`background:${l.value.style.backgroundColor}`)
      }, [
        d(y),
        t("rect", {
          fill: s(h)(l.value.style.table.th.color, 50),
          x: 3.5,
          y: 5,
          height: "10",
          width: "93"
        }, null, 8, Qo),
        t("rect", {
          fill: s(h)(l.value.style.table.th.color, 50),
          x: 3.5,
          y: 15,
          height: "50",
          width: "23.25"
        }, null, 8, ls),
        (o(), e(k, null, v(7, (r, i) => t("line", {
          x1: "3.7",
          x2: "96.3",
          y1: 5 + i * 10,
          y2: 5 + i * 10,
          stroke: l.value.style.table.td.color,
          "stroke-width": l.value.style.table.td.strokeWidth,
          "stroke-linecap": "round"
        }, null, 8, ts)), 64)),
        (o(), e(k, null, v(5, (r, i) => t("line", {
          x1: 3.5 + i * 23.25,
          x2: 3.5 + i * 23.25,
          y1: "5",
          y2: "65",
          stroke: l.value.style.table.td.color,
          "stroke-width": l.value.style.table.td.strokeWidth,
          "stroke-linecap": "round"
        }, null, 8, es)), 64))
      ], 12, Ko)) : a("", !0),
      u.value === "rating" ? (o(), e(k, { key: 34 }, [
        l.value.style.rating.useSmiley ? (o(), e("div", {
          key: 0,
          style: n(`display:flex;flex-direction:row;align-items:center;justify-content:center;width:${l.value.style.rating.maxWidth}px`)
        }, [
          l.value.style.rating.filled ? (o(), e("svg", {
            key: 0,
            xmlns: s(c),
            style: n(`width:${l.value.style.rating.maxWidth / 5}px;aspect-ratio: 1 / 1`),
            viewBox: "0 0 24 24",
            "stroke-width": "1.5",
            stroke: l.value.style.rating.color,
            "stroke-linecap": "round",
            "stroke-linejoin": "round",
            fill: "none"
          }, [
            d(y),
            _[0] || (_[0] = t("path", {
              stroke: "none",
              d: "M0 0h24v24H0z",
              fill: "none"
            }, null, -1)),
            t("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: l.value.style.rating.color
            }, null, 8, ss)
          ], 12, os)) : (o(), e("svg", {
            key: 1,
            xmlns: s(c),
            style: n(`width:${l.value.style.rating.maxWidth / 5}px;aspect-ratio: 1 / 1`),
            viewBox: "0 0 24 24",
            "stroke-width": "1.5",
            stroke: l.value.style.rating.color,
            "stroke-linecap": "round",
            "stroke-linejoin": "round",
            fill: "none"
          }, _[1] || (_[1] = [
            $('<path stroke="none" d="M0 0h24v24H0z" fill="none" data-v-1c824e2d></path><path d="M12 12m-9 0a9 9 0 1 0 18 0a9 9 0 1 0 -18 0" data-v-1c824e2d></path><path d="M9 10l.01 0" data-v-1c824e2d></path><path d="M15 10l.01 0" data-v-1c824e2d></path><path d="M9.5 15.25a3.5 3.5 0 0 1 5 0" data-v-1c824e2d></path>', 5)
          ]), 12, rs)),
          l.value.style.rating.filled ? (o(), e("svg", {
            key: 2,
            xmlns: s(c),
            style: n(`width:${l.value.style.rating.maxWidth / 5}px;aspect-ratio: 1 / 1`),
            viewBox: "0 0 24 24",
            "stroke-width": "1.5",
            stroke: l.value.style.rating.color,
            "stroke-linecap": "round",
            "stroke-linejoin": "round",
            fill: "none"
          }, [
            _[2] || (_[2] = t("path", {
              stroke: "none",
              d: "M0 0h24v24H0z",
              fill: "none"
            }, null, -1)),
            t("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: l.value.style.rating.color
            }, null, 8, ns)
          ], 12, is)) : (o(), e("svg", {
            key: 3,
            xmlns: s(c),
            style: n(`width:${l.value.style.rating.maxWidth / 5}px;aspect-ratio: 1 / 1`),
            viewBox: "0 0 24 24",
            "stroke-width": "1.5",
            stroke: l.value.style.rating.color,
            "stroke-linecap": "round",
            "stroke-linejoin": "round",
            fill: "none"
          }, _[3] || (_[3] = [
            $('<path stroke="none" d="M0 0h24v24H0z" fill="none" data-v-1c824e2d></path><path d="M12 12m-9 0a9 9 0 1 0 18 0a9 9 0 1 0 -18 0" data-v-1c824e2d></path><path d="M9 10l.01 0" data-v-1c824e2d></path><path d="M15 10l.01 0" data-v-1c824e2d></path><path d="M9 15l6 0" data-v-1c824e2d></path>', 5)
          ]), 12, as)),
          l.value.style.rating.filled ? (o(), e("svg", {
            key: 4,
            xmlns: s(c),
            style: n(`width:${l.value.style.rating.maxWidth / 5}px;aspect-ratio: 1 / 1`),
            viewBox: "0 0 24 24",
            "stroke-width": "1.5",
            stroke: l.value.style.rating.color,
            "stroke-linecap": "round",
            "stroke-linejoin": "round",
            fill: "none"
          }, [
            _[4] || (_[4] = t("path", {
              stroke: "none",
              d: "M0 0h24v24H0z",
              fill: "none"
            }, null, -1)),
            t("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: l.value.style.rating.color
            }, null, 8, us)
          ], 12, cs)) : (o(), e("svg", {
            key: 5,
            xmlns: s(c),
            style: n(`width:${l.value.style.rating.maxWidth / 5}px;aspect-ratio: 1 / 1`),
            viewBox: "0 0 24 24",
            "stroke-width": "1.5",
            stroke: l.value.style.rating.color,
            "stroke-linecap": "round",
            "stroke-linejoin": "round",
            fill: "none"
          }, _[5] || (_[5] = [
            t("path", {
              stroke: "none",
              d: "M0 0h24v24H0z",
              fill: "none"
            }, null, -1),
            t("path", { d: "M12 12m-9 0a9 9 0 1 0 18 0a9 9 0 1 0 -18 0" }, null, -1),
            t("path", { d: "M9 10l.01 0" }, null, -1),
            t("path", { d: "M15 10l.01 0" }, null, -1)
          ]), 12, ds)),
          l.value.style.rating.filled ? (o(), e("svg", {
            key: 6,
            xmlns: s(c),
            style: n(`width:${l.value.style.rating.maxWidth / 5}px;aspect-ratio: 1 / 1`),
            viewBox: "0 0 24 24",
            "stroke-width": "1.5",
            stroke: l.value.style.rating.color,
            "stroke-linecap": "round",
            "stroke-linejoin": "round",
            fill: "none"
          }, [
            _[6] || (_[6] = t("path", {
              stroke: "none",
              d: "M0 0h24v24H0z",
              fill: "none"
            }, null, -1)),
            t("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: l.value.style.rating.color
            }, null, 8, ks)
          ], 12, ys)) : (o(), e("svg", {
            key: 7,
            xmlns: s(c),
            style: n(`width:${l.value.style.rating.maxWidth / 5}px;aspect-ratio: 1 / 1`),
            viewBox: "0 0 24 24",
            "stroke-width": "1.5",
            stroke: l.value.style.rating.color,
            "stroke-linecap": "round",
            "stroke-linejoin": "round",
            fill: "none"
          }, _[7] || (_[7] = [
            $('<path stroke="none" d="M0 0h24v24H0z" fill="none" data-v-1c824e2d></path><path d="M12 12m-9 0a9 9 0 1 0 18 0a9 9 0 1 0 -18 0" data-v-1c824e2d></path><path d="M9 10l.01 0" data-v-1c824e2d></path><path d="M15 10l.01 0" data-v-1c824e2d></path><path d="M9.5 15a3.5 3.5 0 0 0 5 0" data-v-1c824e2d></path>', 5)
          ]), 12, hs)),
          l.value.style.rating.filled ? (o(), e("svg", {
            key: 8,
            xmlns: s(c),
            style: n(`width:${l.value.style.rating.maxWidth / 5}px;aspect-ratio: 1 / 1`),
            viewBox: "0 0 24 24",
            "stroke-width": "1.5",
            stroke: l.value.style.rating.color,
            "stroke-linecap": "round",
            "stroke-linejoin": "round",
            fill: "none"
          }, [
            _[8] || (_[8] = t("path", {
              stroke: "none",
              d: "M0 0h24v24H0z",
              fill: "none"
            }, null, -1)),
            t("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: l.value.style.rating.color
            }, null, 8, _s)
          ], 12, vs)) : (o(), e("svg", {
            key: 9,
            xmlns: s(c),
            style: n(`width:${l.value.style.rating.maxWidth / 5}px;aspect-ratio: 1 / 1`),
            viewBox: "0 0 24 24",
            "stroke-width": "1.5",
            stroke: l.value.style.rating.color,
            "stroke-linecap": "round",
            "stroke-linejoin": "round",
            fill: "none"
          }, _[9] || (_[9] = [
            $('<path stroke="none" d="M0 0h24v24H0z" fill="none" data-v-1c824e2d></path><path d="M12 12m-9 0a9 9 0 1 0 18 0a9 9 0 1 0 -18 0" data-v-1c824e2d></path><path d="M9 9l.01 0" data-v-1c824e2d></path><path d="M15 9l.01 0" data-v-1c824e2d></path><path d="M8 13a4 4 0 1 0 8 0h-8" data-v-1c824e2d></path>', 5)
          ]), 12, xs))
        ], 4)) : (o(), e("svg", {
          key: 1,
          xmlns: s(c),
          width: "100%",
          viewBox: "0 0 100 30",
          style: n(`background:${l.value.style.backgroundColor};max-width:${l.value.style.rating.maxWidth}px`)
        }, [
          d(y),
          (o(), e(k, null, v(5, (r, i) => t("polygon", {
            points: s(O)({
              plot: { x: 10 + i * 20, y: 15 },
              radius: 6
            }),
            fill: l.value.style.rating.filled ? l.value.style.rating.color : "none",
            stroke: l.value.style.rating.color,
            "stroke-width": l.value.style.rating.strokeWidth,
            "stroke-linecap": "round",
            "stroke-linejoin": "round"
          }, null, 8, gs)), 64))
        ], 12, ps))
      ], 64)) : a("", !0),
      u.value === "verticalBar" ? (o(), e("svg", {
        key: 35,
        xmlns: s(c),
        width: "100%",
        viewBox: "0 0 100 100",
        style: n(`background:${l.value.style.backgroundColor}`)
      }, [
        d(y),
        l.value.style.verticalBar.axis.show ? (o(), e("g", ws, [
          t("line", {
            x1: 3,
            x2: 3,
            y1: 3,
            y2: 97,
            stroke: l.value.style.verticalBar.axis.color,
            "stroke-width": l.value.style.verticalBar.axis.strokeWidth
          }, null, 8, ms)
        ])) : a("", !0),
        (o(), e(k, null, v(6, (r, i) => t("rect", {
          x: 3,
          y: 5 + i * 15.6,
          height: "12",
          width: 94 - 94 * i / 6,
          fill: l.value.style.verticalBar.color,
          rx: l.value.style.verticalBar.borderRadius
        }, null, 8, bs)), 64))
      ], 12, fs)) : a("", !0)
    ], 14, G));
  }
}, Bs = /* @__PURE__ */ X(Ms, [["__scopeId", "data-v-1c824e2d"]]);
export {
  Bs as default
};