import { defineComponent as k, toRefs as p, computed as _, openBlock as $, createElementBlock as m, unref as t, createElementVNode as o } from "vue";
const x = { class: "go-border-box" }, L = ["width", "height"], y = ["d"], C = /* @__PURE__ */ o("stop", {
  offset: "0%",
  "stop-color": "#fff",
  "stop-opacity": "1"
}, null, -1), w = /* @__PURE__ */ o("stop", {
  offset: "100%",
  "stop-color": "#fff",
  "stop-opacity": "0"
}, null, -1), M = [
  C,
  w
], B = ["fill"], D = ["dur", "path"], E = ["fill", "points"], N = ["stroke", "xlink:href"], S = ["stroke", "xlink:href", "mask"], U = ["from", "to", "dur"], j = k({ name: "EBorder08" }), I = /* @__PURE__ */ k({
  ...j,
  props: {
    chartConfig: {
      type: Object,
      required: !0
    }
  },
  setup(g) {
    const i = g, n = (f = 10) => Number(
      Math.random().toString().substring(2, f) + Date.now()
    ).toString(36), s = `border-box-08-path-${n()}`, a = `border-box-08-gradient-${n()}`, l = `border-box-08-mask-${n()}`, { w: e, h: r } = p(i.chartConfig.attr), { colors: c, dur: d, backgroundColor: v, reverse: b } = p(
      i.chartConfig.option
    ), u = _(() => (e.value + r.value - 5) * 2), h = _(() => b.value ? `M 2.5, 2.5 L 2.5, ${r.value - 2.5} L ${e.value - 2.5}, ${r.value - 2.5} L ${e.value - 2.5}, 2.5 L 2.5, 2.5` : `M2.5, 2.5 L${e.value - 2.5}, 2.5 L${e.value - 2.5}, ${r.value - 2.5} L2.5, ${r.value - 2.5} L2.5, 2.5`);
    return (f, q) => ($(), m("div", x, [
      ($(), m("svg", {
        width: t(e),
        height: t(r)
      }, [
        o("defs", null, [
          o("path", {
            id: s,
            d: t(h),
            fill: "transparent"
          }, null, 8, y),
          o("radialGradient", {
            id: a,
            cx: "50%",
            cy: "50%",
            r: "50%"
          }, M),
          o("mask", { id: l }, [
            o("circle", {
              cx: "0",
              cy: "0",
              r: "150",
              fill: `url(#${a})`
            }, [
              o("animateMotion", {
                dur: `${t(d)}s`,
                path: t(h),
                rotate: "auto",
                repeatCount: "indefinite"
              }, null, 8, D)
            ], 8, B)
          ])
        ]),
        o("polygon", {
          fill: t(v),
          points: `5, 5 ${t(e) - 5}, 5 ${t(e) - 5} ${t(r) - 5} 5, ${t(r) - 5}`
        }, null, 8, E),
        o("use", {
          stroke: t(c)[0],
          "stroke-width": "1",
          "xlink:href": `#${s}`
        }, null, 8, N),
        o("use", {
          stroke: t(c)[1],
          "stroke-width": "3",
          "xlink:href": `#${s}`,
          mask: `url(#${l})`
        }, [
          o("animate", {
            attributeName: "stroke-dasharray",
            from: `0, ${t(u)}`,
            to: `${t(u)}, 0`,
            dur: `${t(d)}s`,
            repeatCount: "indefinite"
          }, null, 8, U)
        ], 8, S)
      ], 8, L))
    ]));
  }
});
export {
  I as default
};
