@cldemo/ui-kit 1.0.0

package/buildLibs/utils/Element/ClSlider.js

@@ -0,0 +1,721 @@
+import { defineComponent as it, inject as yt, ref as P, reactive as X, computed as D, onMounted as dt, nextTick as tt, watch as et, openBlock as E, createElementBlock as N, normalizeStyle as Y, normalizeClass as q, withDirectives as kt, withKeys as Q, createElementVNode as ot, unref as bt, provide as Ct, createVNode as rt, Fragment as ut, createBlock as gt, renderList as pt, createCommentVNode as ht } from "vue";
+import { C as k } from "../Shared/base-PQGakkrl.js";
+import { D as Mt } from "../Shared/drag-CzfhSB0g.js";
+import "js-cookie";
+import "decimal.js";
+import { tooltipDirectives as Dt, tooltipCommon as Z } from "../Web/__directive__/Tooltip.js";
+const Et = /* @__PURE__ */ it({
+  name: "ClSliderBar",
+  __name: "Bar",
+  props: {
+    left: {
+      type: Number,
+      default: 0
+    },
+    width: {
+      type: Number,
+      default: 0
+    },
+    isDisabled: {
+      type: Boolean,
+      default: !1
+    },
+    isVertical: {
+      type: Boolean,
+      default: !1
+    },
+    isBarDrag: {
+      type: Boolean,
+      default: !1
+    }
+  },
+  emits: ["onMoveStart", "onMoveIng", "onMoveEnd", "onMouseover", "onMouseout", "onClick"],
+  setup(v, { emit: O }) {
+    const i = v, u = O, R = yt("$SliderTop"), I = P(null), M = X({
+      isHover: !1,
+      left: i.left
+    }), f = {
+      isClick: !1,
+      dragStart: 0,
+      dragStartRatio: 0
+    }, c = D(() => ({
+      "slider-bar": !0,
+      "slider-bar-drag": i.isBarDrag
+    })), l = D(() => {
+      const m = {};
+      return i.isVertical ? (m.bottom = `${M.left}%`, m.height = `${i.width}%`) : (m.left = `${M.left}%`, m.width = `${i.width}%`), m;
+    }), B = (m, g) => {
+      f.isClick = !0, f.dragStart = i.isVertical ? g.clientY : g.clientX, f.dragStartRatio = i.left, u("onMoveStart");
+    }, _ = (m, g) => {
+      f.isClick = !1;
+      let T = 0;
+      i.isVertical ? T = f.dragStart - g.clientY : T = g.clientX - f.dragStart;
+      const V = R.getDragValueInfo(T, f.dragStartRatio);
+      M.left = V.ratio, u("onMoveIng", V.ratio);
+    }, h = (m) => {
+      f.isClick ? u("onClick", m) : u("onMoveEnd"), f.isClick = !1;
+    }, y = () => {
+      const m = {
+        start(g, T) {
+          let V = !1;
+          return !i.isDisabled && i.isBarDrag && g.buttons === 1 && (V = !0, B(g, T)), V;
+        },
+        ing: (g, T) => {
+          _(g, T);
+        },
+        end: (g) => {
+          h(g);
+        }
+      };
+      new Mt(I.value, m);
+    };
+    dt(() => {
+      tt(() => {
+        y();
+      });
+    }), et(
+      () => i.left,
+      (m, g) => {
+        m !== g && m !== M.left && (M.left = m);
+      }
+    );
+    const z = (m) => {
+      !i.isDisabled && !i.isBarDrag && u("onClick", m);
+    }, j = () => {
+      u("onMouseover");
+    }, A = () => {
+      u("onMouseout");
+    };
+    return (m, g) => (E(), N("div", {
+      ref_key: "refElBar",
+      ref: I,
+      class: q(c.value),
+      style: Y(l.value),
+      onMouseover: j,
+      onMouseout: A,
+      onClick: z
+    }, null, 38));
+  }
+}), ct = /* @__PURE__ */ it({
+  name: "ClSliderButton",
+  __name: "Button",
+  props: {
+    className: String,
+    value: [String, Number],
+    ratio: {
+      type: Number,
+      default: 0
+    },
+    isDisabled: {
+      type: Boolean,
+      default: !1
+    },
+    isVertical: {
+      type: Boolean,
+      default: !1
+    },
+    tooltipFormat: String
+  },
+  emits: ["onMoveIng", "onMoveEnd", "onDblClick"],
+  setup(v, { expose: O, emit: i }) {
+    const u = v, R = i, I = yt("$SliderTop"), M = Dt, f = P(null), c = X({
+      isHover: !1,
+      ratio: u.ratio,
+      value: u.value
+    }), l = {
+      dragStart: 0,
+      dragStartRatio: 0,
+      isMoveIng: !1
+    }, B = D(() => {
+      let s = c.value;
+      if (s) {
+        const r = u.tooltipFormat;
+        s = k.getFormatThousands(s.toString()), r && !k.isEmpty(r) && (s = k.convertStringFormat(r, { _value: s }));
+      }
+      return s;
+    }), _ = D(() => u.isVertical ? "right" : "top"), h = D(() => {
+      const s = {
+        "slider-button": !0,
+        hover: c.isHover
+      };
+      return u.className && !k.isEmpty(u.className) && u.className.split(" ").forEach((r) => {
+        k.isEmpty(r) || (s[r] = !0);
+      }), s;
+    }), y = D(() => {
+      const s = {};
+      return u.isVertical ? s.bottom = `${c.ratio}%` : s.left = `${c.ratio}%`, s;
+    }), z = () => {
+      Z.show(f.value);
+    }, j = () => {
+      Z.hide(f.value);
+    }, A = (s, r) => {
+      let S = 0;
+      u.isVertical ? S = l.dragStart - r.clientY : S = r.clientX - l.dragStart;
+      const $ = I.getDragValueInfo(S, l.dragStartRatio);
+      return c.ratio = $.ratio, c.value = $.value, $;
+    }, m = (s, r) => {
+      l.dragStart = u.isVertical ? r.clientY : r.clientX, l.dragStartRatio = u.ratio;
+    }, g = (s, r) => {
+      const S = A(s, r);
+      Z.show(f.value), R("onMoveIng", { value: S.ratio, runType: "drag" });
+    }, T = (s, r) => {
+      A(s, r), c.isHover || f.value === s.target || f.value?.contains(s.target) || Z.hide(f.value), R("onMoveEnd", { runType: "drag" });
+    }, V = (s) => {
+      l.isMoveIng = !0;
+      const r = I.getButtonMoveValueInfo(s, u.ratio);
+      c.ratio = r.ratio, c.value = r.value, R("onMoveIng", { value: r.ratio, runType: "keydown" });
+    }, C = () => {
+      const s = {
+        start(r, S) {
+          let $ = !1;
+          return !u.isDisabled && r.buttons === 1 && ($ = !0, m(r, S)), $;
+        },
+        ing: (r, S) => {
+          g(r, S);
+        },
+        end: (r, S) => {
+          T(r, S);
+        }
+      };
+      new Mt(f.value, s);
+    };
+    dt(() => {
+      tt(() => {
+        C();
+      });
+    }), et(
+      () => u.value,
+      (s, r) => {
+        s !== r && s !== c.value && (c.value = s);
+      }
+    ), et(
+      () => u.ratio,
+      (s, r) => {
+        s !== r && s !== c.ratio && (c.ratio = s);
+      }
+    );
+    const J = (s) => {
+      u.isDisabled || (s.preventDefault(), s.stopPropagation(), V("left"));
+    }, G = (s) => {
+      u.isDisabled || (s.preventDefault(), s.stopPropagation(), V("right"));
+    }, at = () => {
+      u.isDisabled || (c.isHover = !0);
+    }, K = () => {
+      u.isDisabled || (c.isHover = !1, l.isMoveIng && (l.isMoveIng = !1, R("onMoveEnd", { runType: "keydown" })));
+    }, W = () => {
+      u.isDisabled || R("onDblClick");
+    };
+    return O({
+      showTooltip: () => {
+        z();
+      },
+      hideTooltip: () => {
+        j();
+      }
+    }), (s, r) => kt((E(), N("div", {
+      ref_key: "refElButton",
+      ref: f,
+      class: q(h.value),
+      style: Y(y.value),
+      tabindex: "0",
+      onDblclick: W,
+      onFocus: at,
+      onBlur: K,
+      onKeydown: [
+        Q(J, ["down"]),
+        Q(G, ["up"]),
+        Q(J, ["left"]),
+        Q(G, ["right"])
+      ]
+    }, [...r[0] || (r[0] = [
+      ot("div", { class: "slider-button-icon" }, null, -1)
+    ])], 38)), [
+      [
+        bt(M),
+        { trigger: ["hover", "focus"], position: _.value, html: B.value, updRefreshInx: c.ratio },
+        void 0,
+        { black: !0 }
+      ]
+    ]);
+  }
+}), It = /* @__PURE__ */ it({
+  name: "ClSliderDot",
+  __name: "Dot",
+  props: {
+    itemInfo: {
+      type: Object,
+      default: () => ({})
+    },
+    isHover: {
+      type: Boolean,
+      default: !1
+    },
+    isVertical: {
+      type: Boolean,
+      default: !1
+    },
+    isTooltip: {
+      type: Boolean,
+      default: !0
+    },
+    tooltipFormat: String
+  },
+  emits: ["onMouseover", "onMouseout", "onClick"],
+  setup(v, { emit: O }) {
+    const i = v, u = O, R = Dt, I = D(() => i.isVertical ? "right" : "top"), M = D(() => {
+      let h = i.itemInfo.value;
+      if (h) {
+        const y = i.tooltipFormat;
+        h = k.getFormatThousands(h.toString()), y && !k.isEmpty(y) && (h = k.convertStringFormat(y, { _value: h }));
+      }
+      return h;
+    }), f = D(() => ({
+      "slider-dot": !0,
+      "slider-dot-active": i.itemInfo.isActive,
+      "slider-dot-hide": i.itemInfo.isHide,
+      hover: i.isHover
+    })), c = D(() => {
+      const h = {};
+      return i.isVertical ? h.bottom = `${i.itemInfo.ratio}%` : h.left = `${i.itemInfo.ratio}%`, h;
+    }), l = () => {
+      u("onMouseover");
+    }, B = () => {
+      u("onMouseout");
+    }, _ = () => {
+      u("onClick");
+    };
+    return (h, y) => kt((E(), N("div", {
+      class: q(f.value),
+      style: Y(c.value),
+      onMouseover: l,
+      onMouseout: B,
+      onClick: _
+    }, [...y[0] || (y[0] = [
+      ot("div", { class: "slider-dot-icon" }, null, -1)
+    ])], 38)), [
+      [
+        bt(R),
+        { init: v.isTooltip, position: I.value, html: M.value },
+        void 0,
+        {
+          black: !0,
+          hover: !0
+        }
+      ]
+    ]);
+  }
+}), wt = { class: "slider-container" }, Nt = {
+  key: 2,
+  class: "slider-dots"
+}, _t = {
+  key: 0,
+  class: "slider-marks"
+}, xt = ["innerHTML", "onMouseover"], Lt = /* @__PURE__ */ it({
+  name: "ClSlider",
+  __name: "Index",
+  props: {
+    className: String,
+    value: [String, Number],
+    min: {
+      type: Number,
+      default: 0
+    },
+    max: {
+      type: Number,
+      default: 100
+    },
+    disabled: {
+      type: Boolean,
+      default: !1
+    },
+    isRange: {
+      type: Boolean,
+      default: !1
+    },
+    isBarDrag: {
+      type: Boolean,
+      default: !1
+    },
+    splitNumber: {
+      type: Number,
+      default: 0
+    },
+    isShowDot: {
+      type: Boolean,
+      default: !0
+    },
+    isShowDotActive: {
+      type: Boolean,
+      default: !0
+    },
+    marks: {
+      type: Array,
+      default: () => []
+    },
+    isVertical: {
+      type: Boolean,
+      default: !1
+    },
+    verticalHeight: String,
+    size: {
+      type: String,
+      default: "large",
+      // large | small
+      validator: (v) => ["large", "small"].indexOf(v) > -1
+    },
+    numType: {
+      type: String,
+      default: "int",
+      // int | float2 | float3
+      validator: (v) => ["int", "float2", "float3"].indexOf(v) > -1
+    },
+    tooltipFormat: String
+  },
+  emits: ["update:value", "onChange"],
+  setup(v, { emit: O }) {
+    const i = v, u = O, R = P(null), I = P(null), M = P(null), f = X({
+      keyIndex: `slider-${k.getRandom(8)}`,
+      markHoverIndex: -1
+    }), c = X({
+      left: 0,
+      width: 0
+    }), l = X({
+      start: i.min,
+      end: i.min,
+      startRatio: 0,
+      endRatio: 0
+    }), B = P([]), _ = P([]), h = D(() => Math.abs(i.max - i.min)), y = D(() => i.marks.length > 0), z = D(() => {
+      const { isRange: e, isBarDrag: t } = i;
+      let o = !1;
+      return e && (o = t), o;
+    }), j = (e) => {
+      const t = {};
+      return i.isVertical ? t.bottom = `${e.ratio}%` : t.left = `${e.ratio}%`, k.isEmpty(e.color) || (t.color = e.color), t;
+    }, A = D(() => {
+      const e = {
+        "panel-slider": !0,
+        "slider-disabled": i.disabled,
+        "slider-vertical": i.isVertical,
+        "slider-level": !i.isVertical
+      };
+      let t = i.size;
+      return k.isEmpty(t) && (t = "large"), e[`slider-${t}`] = !0, i.className && !k.isEmpty(i.className) && i.className.split(" ").forEach((o) => {
+        k.isEmpty(o) || (e[o] = !0);
+      }), e;
+    }), m = D(() => {
+      const e = {};
+      return i.isVertical && (e.height = i.verticalHeight), e;
+    }), g = (e) => {
+      const t = e ? e.start : l.start, o = e ? e.end : l.end;
+      let a = t, n = o;
+      a > n && (a = o, n = t);
+      const d = i.isRange ? `${a},${n}` : n.toString();
+      u("update:value", d), u("onChange", d, { start: a, end: n });
+    }, T = (e, t = 2) => Number((e * 100).toFixed(t)), V = (e) => {
+      const t = h.value;
+      return t > 0 ? T((e - i.min) / t) : 0;
+    }, C = (e) => {
+      let t = 0;
+      if (e <= 0)
+        t = i.min;
+      else if (e >= 100)
+        t = i.max;
+      else {
+        const { numType: o } = i, n = h.value * e / 100, d = k.getValueByFormat(n.toString(), o, { isThousands: !1 });
+        if (t = i.min + Number(d), k.isExistValue(["float2", "float3"], o)) {
+          const p = t.toString(), b = Number(p.replace("float", ""));
+          k.isExistValue(p, ".") && p.split(".")[1].length > b && (t = Number(t.toFixed(b)));
+        }
+      }
+      return t;
+    }, J = (e) => {
+      let t = Number(e), o = !0;
+      return t <= i.min ? (t = i.min, o = !1) : t >= i.max && (t = i.max, o = !1), { value: t, check: o };
+    }, G = () => {
+      if (y.value) {
+        const e = [];
+        i.marks.forEach((t) => {
+          const o = k.getJsonClone(t);
+          o.value = Number(o.value), o.ratio = V(o.value), e.push(o);
+        }), _.value = e;
+      }
+    }, at = () => {
+      const e = [];
+      if (y.value)
+        _.value.forEach((t) => {
+          e.push({ ratio: t.ratio, value: t.value, isActive: !1, isHide: !1 });
+        });
+      else if (i.splitNumber > 1) {
+        const t = Number((100 / i.splitNumber).toFixed()), o = t / 2;
+        for (let a = 1; a < i.splitNumber; a++) {
+          const n = t * a, d = C(n);
+          e.push({
+            value: d,
+            ratio: n,
+            isActive: !1,
+            isHide: !1,
+            left: n - o,
+            right: n + o
+          });
+        }
+      }
+      B.value = e;
+    }, K = () => {
+      if (B.value.length > 0) {
+        const { isShowDot: e, isShowDotActive: t, min: o, max: a } = i, n = y.value, d = c.left, p = d + c.width, b = [];
+        B.value.forEach((w) => {
+          const x = k.getJsonClone(w), H = w.ratio >= d && w.ratio <= p;
+          x.isActive = H;
+          let F = !1;
+          n ? F = !0 : e ? (F = !0, H && (t ? F = !0 : F = !1)) : F = !1, (x.ratio === o || x.ratio === a) && (F = !1), x.isHide = !F, b.push(x);
+        }), B.value = b;
+      }
+    }, W = (e) => {
+      const t = e.startRatio > e.endRatio ? e.endRatio : e.startRatio, o = Math.abs(e.endRatio - e.startRatio);
+      c.left = t, c.width = o;
+    }, L = (e) => {
+      tt(() => {
+        i.isRange ? e ? (I.value?.showTooltip(), M.value?.showTooltip()) : (I.value?.hideTooltip(), M.value?.hideTooltip()) : e ? M.value?.showTooltip() : M.value?.hideTooltip();
+      });
+    }, U = (e) => {
+      W(e), l.start = e.start, l.end = e.end, l.startRatio = e.startRatio, l.endRatio = e.endRatio, K();
+    }, s = (e) => {
+      let t, o;
+      if (e && !k.isEmpty(e)) {
+        const d = e.toString().split(","), p = J(d[0]);
+        if (i.isRange) {
+          if (t = p.value, o = t, d.length > 1) {
+            const b = J(d[1]);
+            b.value > t && (o = b.value);
+          }
+        } else
+          t = i.min, o = p.value;
+      } else
+        t = i.min, o = i.min;
+      const a = V(t), n = V(o);
+      U({ start: t, end: o, startRatio: a, endRatio: n });
+    }, r = (e) => {
+      let t = T(e);
+      const o = B.value;
+      if (!y.value && o.length > 0) {
+        if (t < o[0].left)
+          t = 0;
+        else if (t > o[o.length - 1].right)
+          t = 100;
+        else
+          for (let a = 0; a < o.length; a++)
+            if (t >= o[a].left && t <= o[a].right) {
+              t = o[a].ratio;
+              break;
+            }
+      }
+      return t;
+    }, S = (e) => {
+      const t = r(e), o = C(t);
+      let { start: a, startRatio: n, end: d, endRatio: p } = l, b = "";
+      if (i.isRange)
+        if (t <= n)
+          b = "start";
+        else if (t >= p)
+          b = "end";
+        else {
+          const w = (p - n) / 2;
+          t > n && t <= n + w ? b = "start" : t >= p - w && t < p && (b = "end");
+        }
+      else
+        b = "end";
+      switch (b) {
+        case "start":
+          a = o, n = t;
+          break;
+        case "end":
+          d = o, p = t;
+          break;
+      }
+      return { start: a, end: d, startRatio: n, endRatio: p };
+    }, $ = () => {
+      G(), at(), s(i.value);
+    };
+    dt(() => {
+      tt(() => {
+        $();
+      });
+    }), et(
+      () => i.value,
+      (e, t) => {
+        if (e && e !== t) {
+          let o = !0;
+          const a = e.toString().split(","), n = Number(a[0]);
+          if (i.isRange) {
+            const d = a.length > 1 ? Number(a[1]) : n;
+            (n === l.start && d === l.end || n === l.end && d === l.start) && (o = !1);
+          } else
+            o = n !== l.end;
+          o && s(e);
+        }
+      }
+    );
+    const nt = (e) => {
+      if (!i.disabled) {
+        e.preventDefault(), e.stopPropagation();
+        const t = R.value, o = t.getBoundingClientRect(), a = i.isVertical ? (o.bottom - e.clientY) / t.clientHeight : (e.clientX - o.left) / t.clientWidth, n = S(a);
+        U(n), g(n);
+      }
+    }, st = (e, t) => {
+      let { startRatio: o, endRatio: a } = l;
+      const n = e.value;
+      t === "start" ? (o = n, l.start = C(n), l.startRatio = n) : (a = n, l.end = C(n), l.endRatio = n), W({ startRatio: o, endRatio: a }), K(), e.runType === "keydown" && g();
+    }, lt = (e) => {
+      const { left: t, width: o } = c, a = {
+        startRatio: t,
+        endRatio: t + o
+      };
+      a.start = C(a.startRatio), a.end = C(a.endRatio), U(a), e.runType === "drag" && g(a);
+    }, ft = (e) => {
+      if (i.isRange) {
+        let { start: t, startRatio: o, end: a, endRatio: n } = l;
+        e === "start" ? (n = o, a = t) : (o = n, t = a);
+        const d = { start: t, startRatio: o, end: a, endRatio: n };
+        U(d), g(d);
+      }
+    }, Rt = () => {
+      L(!0);
+    }, Bt = (e) => {
+      const t = e;
+      l.start = C(e), l.startRatio = e;
+      const o = e + c.width;
+      l.end = C(o), l.endRatio = o, W({ startRatio: t, endRatio: o }), K(), L(!0);
+    }, St = () => {
+      g(), L(!1);
+    }, Tt = () => {
+      L(!0);
+    }, Vt = () => {
+      L(!1);
+    }, vt = (e) => {
+      y.value && (f.markHoverIndex = e);
+    }, mt = () => {
+      f.markHoverIndex = -1;
+    };
+    return Ct("$SliderTop", {
+      getDragValueInfo: (e, t) => {
+        const o = i.isVertical ? e / R.value.clientHeight : e / R.value.clientWidth;
+        let a = t / 100 + o;
+        a >= 1 ? a = 1 : a <= 0 && (a = 0), a = r(a);
+        const n = C(a);
+        return { ratio: a, value: n };
+      },
+      getButtonMoveValueInfo: (e, t) => {
+        const o = e === "left" ? -1 : 1, a = Number(t);
+        let n;
+        const d = B.value, p = d.length;
+        if (!y.value && p > 0) {
+          let w = -1;
+          if (a < d[0].ratio)
+            w = -1;
+          else if (a > d[p - 1].ratio)
+            w = p;
+          else
+            for (let H = 0; H < p; H++)
+              if (a >= d[H].ratio && H + 1 < p && a < d[H + 1].ratio) {
+                w = H;
+                break;
+              }
+          const x = w + o;
+          x < 0 ? n = 0 : x >= p ? n = 100 : n = d[x].ratio;
+        } else
+          n = a + o;
+        n >= 100 ? n = 100 : n <= 0 && (n = 0);
+        const b = C(n);
+        return { ratio: n, value: b };
+      }
+    }), (e, t) => (E(), N("div", {
+      class: q(A.value),
+      style: Y(m.value)
+    }, [
+      ot("div", wt, [
+        ot("div", {
+          ref_key: "refElTrack",
+          ref: R,
+          class: "slider-track",
+          onClick: nt
+        }, null, 512),
+        rt(Et, {
+          isDisabled: v.disabled,
+          isVertical: v.isVertical,
+          isBarDrag: z.value,
+          left: c.left,
+          width: c.width,
+          onOnMoveStart: Rt,
+          onOnMoveIng: Bt,
+          onOnMoveEnd: St,
+          onOnClick: nt,
+          onOnMouseover: Tt,
+          onOnMouseout: Vt
+        }, null, 8, ["isDisabled", "isVertical", "isBarDrag", "left", "width"]),
+        v.isRange ? (E(), N(ut, { key: 0 }, [
+          rt(ct, {
+            ref_key: "refBtnStart",
+            ref: I,
+            isDisabled: v.disabled,
+            isVertical: v.isVertical,
+            value: l.start,
+            ratio: l.startRatio,
+            tooltipFormat: v.tooltipFormat,
+            onOnMoveIng: t[0] || (t[0] = (o) => st(o, "start")),
+            onOnMoveEnd: lt,
+            onOnDblClick: t[1] || (t[1] = (o) => ft("start"))
+          }, null, 8, ["isDisabled", "isVertical", "value", "ratio", "tooltipFormat"]),
+          rt(ct, {
+            ref_key: "refBtnEnd",
+            ref: M,
+            isDisabled: v.disabled,
+            isVertical: v.isVertical,
+            value: l.end,
+            ratio: l.endRatio,
+            tooltipFormat: v.tooltipFormat,
+            onOnMoveIng: t[2] || (t[2] = (o) => st(o, "end")),
+            onOnMoveEnd: lt,
+            onOnDblClick: t[3] || (t[3] = (o) => ft("end"))
+          }, null, 8, ["isDisabled", "isVertical", "value", "ratio", "tooltipFormat"])
+        ], 64)) : (E(), gt(ct, {
+          key: 1,
+          ref_key: "refBtnEnd",
+          ref: M,
+          isDisabled: v.disabled,
+          isVertical: v.isVertical,
+          value: l.end,
+          ratio: l.endRatio,
+          tooltipFormat: v.tooltipFormat,
+          onOnMoveIng: t[4] || (t[4] = (o) => st(o, "end")),
+          onOnMoveEnd: lt
+        }, null, 8, ["isDisabled", "isVertical", "value", "ratio", "tooltipFormat"])),
+        B.value.length > 0 ? (E(), N("div", Nt, [
+          (E(!0), N(ut, null, pt(B.value, (o, a) => (E(), gt(It, {
+            key: `${f.keyIndex}-dot-${a}`,
+            isVertical: v.isVertical,
+            itemInfo: o,
+            isHover: f.markHoverIndex === a,
+            isTooltip: !y.value,
+            onOnMouseover: (n) => vt(a),
+            onOnMouseout: mt,
+            onOnClick: nt
+          }, null, 8, ["isVertical", "itemInfo", "isHover", "isTooltip", "onOnMouseover"]))), 128))
+        ])) : ht("", !0)
+      ]),
+      y.value ? (E(), N("div", _t, [
+        (E(!0), N(ut, null, pt(_.value, (o, a) => (E(), N("div", {
+          key: `${f.keyIndex}-mark-${a}`,
+          class: q({ "slider-mark": !0, hover: f.markHoverIndex === a }),
+          style: Y(j(o)),
+          innerHTML: o.mark,
+          onMouseover: (n) => vt(a),
+          onMouseout: mt
+        }, null, 46, xt))), 128))
+      ])) : ht("", !0)
+    ], 6));
+  }
+});
+export {
+  Lt as default
+};
+//# sourceMappingURL=ClSlider.js.map