import "../../../../../../node_modules/.pnpm/vue@3.3.4/node_modules/vue/dist/vue.runtime.esm-bundler.mjs";
import { defineComponent, openBlock, createElementBlock, createElementVNode as createBaseVNode, Fragment, renderList, createStaticVNode, pushScopeId, popScopeId } from "../../../../../../node_modules/.pnpm/@vue_runtime-core@3.3.4/node_modules/@vue/runtime-core/dist/runtime-core.esm-bundler.mjs";
import { useCssVars } from "../../../../../../node_modules/.pnpm/@vue_runtime-dom@3.3.4/node_modules/@vue/runtime-dom/dist/runtime-dom.esm-bundler.mjs";
import { unref, toRefs } from "../../../../../../node_modules/.pnpm/@vue_reactivity@3.3.4/node_modules/@vue/reactivity/dist/reactivity.esm-bundler.mjs";
const _withScopeId = (n) => (pushScopeId("data-v-b4d0ec68"), n = n(), popScopeId(), n);
const _hoisted_1 = {
  xmlns: "http://www.w3.org/2000/svg",
  viewBox: `0 0 200 200`
};
const _hoisted_2 = /* @__PURE__ */ createStaticVNode('<filter id="innerShadow" x="-20%" y="-20%" width="140%" height="140%" data-v-b4d0ec68><feGaussianBlur in="SourceGraphic" stdDeviation="3" result="blur" data-v-b4d0ec68></feGaussianBlur><feOffset in="blur" dx="2.5" dy="2.5" data-v-b4d0ec68></feOffset></filter><g data-v-b4d0ec68><circle id="shadow" style="fill:rgba(0, 0, 0, 0.1);" cx="100" cy="100" r="87" filter="url(#innerShadow)" data-v-b4d0ec68></circle><circle id="circle" class="clock-border" cx="100" cy="100" r="80" data-v-b4d0ec68></circle></g>', 2);
const _hoisted_4 = {
  x1: "100",
  y1: "100",
  x2: "100",
  y2: "55",
  style: { "stroke-width": "3px" },
  class: "clock-line"
};
const _hoisted_5 = ["from", "to"];
const _hoisted_6 = {
  x1: "100",
  y1: "100",
  x2: "100",
  y2: "40",
  style: { "stroke-width": "4px" },
  class: "clock-line"
};
const _hoisted_7 = ["from", "to"];
const _hoisted_8 = {
  x1: "100",
  y1: "100",
  x2: "100",
  y2: "30",
  style: { "stroke-width": "2px" },
  class: "clock-line"
};
const _hoisted_9 = ["from", "to"];
const _hoisted_10 = /* @__PURE__ */ _withScopeId(() => /* @__PURE__ */ createBaseVNode("circle", {
  id: "center",
  style: { "fill": "#128a86", "stroke": "#c1efed", "stroke-width": "2px" },
  cx: "100",
  cy: "100",
  r: "3"
}, null, -1));
const _hoisted_11 = ["transform"];
const _sfc_main = /* @__PURE__ */ defineComponent({
  __name: "index",
  props: {
    chartConfig: {
      type: Object,
      required: true
    }
  },
  setup(__props) {
    const props = __props;
    useCssVars((_ctx) => ({
      "47fe3763": unref(borderColor),
      "46891283": unref(border) + "px",
      "7239e62c": unref(bgColor),
      "67e7692f": unref(color)
    }));
    let { border, color, bgColor, borderColor } = toRefs(props.chartConfig.option);
    const date = /* @__PURE__ */ new Date();
    const hoursAngle = 360 * date.getHours() / 12 + date.getMinutes() / 2;
    const minuteAngle = 360 * date.getMinutes() / 60;
    const secAngle = 360 * date.getSeconds() / 60;
    return (_ctx, _cache) => {
      return openBlock(), createElementBlock("svg", _hoisted_1, [
        _hoisted_2,
        createBaseVNode("g", null, [
          createBaseVNode("line", _hoisted_4, [
            createBaseVNode("animateTransform", {
              attributeName: "transform",
              attributeType: "XML",
              type: "rotate",
              dur: "43200s",
              repeatCount: "indefinite",
              from: `${hoursAngle} 100 100`,
              to: `${hoursAngle + 360} 100 100`
            }, null, 8, _hoisted_5)
          ]),
          createBaseVNode("line", _hoisted_6, [
            createBaseVNode("animateTransform", {
              attributeName: "transform",
              attributeType: "XML",
              type: "rotate",
              dur: "3600s",
              repeatCount: "indefinite",
              from: `${minuteAngle} 100 100`,
              to: `${minuteAngle + 360} 100 100`
            }, null, 8, _hoisted_7)
          ]),
          createBaseVNode("line", _hoisted_8, [
            createBaseVNode("animateTransform", {
              attributeName: "transform",
              attributeType: "XML",
              type: "rotate",
              dur: "60s",
              repeatCount: "indefinite",
              from: `${secAngle} 100 100`,
              to: `${secAngle + 360} 100 100`
            }, null, 8, _hoisted_9)
          ])
        ]),
        _hoisted_10,
        (openBlock(), createElementBlock(Fragment, null, renderList(12, (num) => {
          return createBaseVNode("line", {
            x1: "100",
            y1: "30",
            x2: "100",
            y2: "40",
            class: "clock-line",
            transform: `rotate(${(num + 1) * 360 / 12} 100 100)`,
            key: `line_${num + 1}`
          }, null, 8, _hoisted_11);
        }), 64))
      ]);
    };
  }
});
export {
  _sfc_main as default
};
