layui-vue/es/slider/index.js

import { w as withInstall } from "../badge/index2.js";
import { defineComponent, ref, openBlock, createElementBlock, withModifiers, normalizeClass, createVNode, withCtx, createElementVNode, normalizeStyle, Fragment, renderList, unref, withDirectives, vShow, toRef } from "vue";
import { _ as _sfc_main$5 } from "../tooltip/index2.js";
import { o as on, a as off } from "../_chunks/evtd/index.js";
import "../_chunks/@vueuse/index.js";
var index = /* @__PURE__ */ (() => '.layui-popper{position:fixed;padding:10px;border-radius:3px;word-wrap:break-word;min-width:12px;min-height:12px;font-size:14px;box-sizing:border-box;box-shadow:0 2px 12px #00000026;background-color:#fff;color:#3a3a3a;border:1px solid #cecece;max-width:300px;z-index:99999}.layui-popper[position=top]{margin-bottom:6px}.layui-popper[position=top] .layui-popper-arrow{bottom:-6px;border-bottom-width:0;border-top-color:#cecece}.layui-popper[position=top] .layui-popper-arrow:after{bottom:1px;border-bottom-width:0;margin-left:-6px;border-top-color:#fff}.layui-popper[position=bottom]{margin-top:6px}.layui-popper[position=bottom] .layui-popper-arrow{top:-6px;border-top-width:0;border-bottom-color:#cecece}.layui-popper[position=bottom] .layui-popper-arrow:after{top:1px;border-top-width:0;margin-left:-6px;border-bottom-color:#fff}.layui-popper[position=right]{margin-left:6px}.layui-popper[position=right] .layui-popper-arrow{left:-6px;border-left-width:0;border-right-color:#cecece}.layui-popper[position=right] .layui-popper-arrow:after{left:1px;border-left-width:0;margin-top:-6px;border-right-color:#fff}.layui-popper[position=left]{margin-right:6px}.layui-popper[position=left] .layui-popper-arrow{right:-6px;border-right-width:0;border-left-color:#cecece}.layui-popper[position=left] .layui-popper-arrow:after{right:1px;border-right-width:0;margin-top:-6px;border-left-color:#fff}.layui-popper[position=top] .layui-popper-arrow,.layui-popper[position=bottom] .layui-popper-arrow{left:-moz-calc(44%);left:-webkit-calc(44%);left:calc(50% - 6px)}.layui-popper[position=left] .layui-popper-arrow,.layui-popper[position=right] .layui-popper-arrow{top:-moz-calc(44%);top:-webkit-calc(44%);top:calc(50% - 6px)}.layui-popper:after{content:" ";position:absolute;display:block}.layui-popper[position=top]:after{bottom:-7px;left:0;width:100%;height:7px}.layui-popper[position=bottom]:after{top:-7px;left:0;width:100%;height:7px}.layui-popper[position=left]:after{right:-7px;bottom:0;height:100%;width:7px}.layui-popper[position=right]:after{left:-7px;bottom:0;height:100%;width:7px}.layui-popper .layui-popper-arrow,.layui-popper .layui-popper-arrow:after{position:absolute;display:block;width:0;height:0;border-width:6px;border-style:solid;border-color:transparent}.layui-popper .layui-popper-arrow:after{content:" "}.layui-popper.layui-dark{background-color:#353535;color:#fff;border:1px solid #353535}.layui-popper.layui-dark[position=top]{margin-bottom:6px}.layui-popper.layui-dark[position=top] .layui-popper-arrow{bottom:-6px;border-bottom-width:0;border-top-color:#353535}.layui-popper.layui-dark[position=top] .layui-popper-arrow:after{bottom:1px;border-bottom-width:0;margin-left:-6px;border-top-color:#353535}.layui-popper.layui-dark[position=bottom]{margin-top:6px}.layui-popper.layui-dark[position=bottom] .layui-popper-arrow{top:-6px;border-top-width:0;border-bottom-color:#353535}.layui-popper.layui-dark[position=bottom] .layui-popper-arrow:after{top:1px;border-top-width:0;margin-left:-6px;border-bottom-color:#353535}.layui-popper.layui-dark[position=right]{margin-left:6px}.layui-popper.layui-dark[position=right] .layui-popper-arrow{left:-6px;border-left-width:0;border-right-color:#353535}.layui-popper.layui-dark[position=right] .layui-popper-arrow:after{left:1px;border-left-width:0;margin-top:-6px;border-right-color:#353535}.layui-popper.layui-dark[position=left]{margin-right:6px}.layui-popper.layui-dark[position=left] .layui-popper-arrow{right:-6px;border-right-width:0;border-left-color:#353535}.layui-popper.layui-dark[position=left] .layui-popper-arrow:after{right:1px;border-right-width:0;margin-top:-6px;border-left-color:#353535}.layui-slider-v{width:100%;height:18px;margin-bottom:8px}.layui-slider-track-v{width:100%;height:16px;position:relative;cursor:pointer;z-index:30}.layui-slider-btn-v{width:12px;height:12px;background-color:#fff;position:absolute;border:2px solid var(--global-primary-color);border-radius:50%;cursor:pointer;left:0%;z-index:2}.layui-slider-rate-v{width:0%;height:4px;position:absolute;top:6px;left:0;bac
function throttle(func) {
  let timer = null;
  return function(args) {
    if (!timer) {
      timer = setTimeout(() => {
        timer = null;
        func(args);
      }, 30);
    }
  };
}
function handle_select(e) {
  e.preventDefault();
}
function makeDots(props) {
  if (props.step === 0)
    return [];
  let val = 0;
  let dots = [0];
  let count = Math.floor(100 / props.step) - 1;
  for (let i = 0; i < count; i++) {
    val += props.step;
    dots.push(val);
  }
  dots.push(100);
  return dots;
}
const _hoisted_1$4 = ["onMousedown"];
const _hoisted_2$4 = ["onClick"];
const __default__$4 = {
  name: "StandardVue"
};
const _sfc_main$4 = defineComponent({
  ...__default__$4,
  props: {
    val: { default: 0 },
    disabled: { type: Boolean, default: false },
    step: { default: 0 },
    min: { default: 0 },
    max: { default: 100 },
    showDots: { type: Boolean, default: false },
    backgroundColor: { default: "#ccc" }
  },
  emits: ["link-val-hook"],
  setup(__props, { emit }) {
    const props = __props;
    const moveAction = throttle(standardMove);
    function handle_mouseup() {
      off("selectstart", document, handle_select);
      off("mouseup", window, handle_mouseup);
      off("mousemove", window, moveAction);
      tooptipHide.value = true;
    }
    function handle_mousedown() {
      on("selectstart", window, handle_select, { once: true });
      on("mouseup", window, handle_mouseup);
      on("mousemove", window, moveAction);
    }
    const tracker = ref(null);
    let standard_style = ref(props.val);
    const tooptipHide = ref(true);
    function standardMove(e) {
      tooptipHide.value = false;
      if (!tracker.value) {
        return;
      }
      let tracker_rect = tracker.value.getBoundingClientRect();
      let origin_left = tracker_rect.left;
      let point_left = e.clientX;
      let distance = point_left - origin_left;
      if (distance < props.min) {
        standard_style.value = props.min;
      } else {
        let rate = distance / tracker_rect.width * 100;
        calcWithStep(rate, standard_style);
        if (standard_style.value > props.max) {
          standard_style.value = props.max;
        }
      }
      emit("link-val-hook", standard_style.value);
    }
    function calcWithStep(rate, val) {
      if (typeof rate === "undefined")
        return false;
      if (typeof val.value === "number") {
        let r = rate - val.value;
        if (Math.abs(r) < props.step) {
          return false;
        }
        if (props.step === 0)
          val.value = Math.floor(rate);
        if (r < 0 && props.step !== 0) {
          val.value -= props.step;
        } else {
          val.value += props.step;
        }
      }
    }
    const dots = makeDots(props);
    const focusDot = (val) => {
      emit("link-val-hook", val);
    };
    return (_ctx, _cache) => {
      return openBlock(), createElementBlock("div", {
        ref_key: "tracker",
        ref: tracker,
        onMousedown: withModifiers(handle_mousedown, ["stop"]),
        class: normalizeClass(["layui-slider-track-v", [__props.disabled ? "layui-slider-disabled" : ""]])
      }, [
        createVNode(_sfc_main$5, {
          content: "" + __props.val,
          "is-can-hide": tooptipHide.value
        }, {
          default: withCtx(() => [
            createElementVNode("div", {
              style: normalizeStyle({ left: __props.val + "%" }),
              class: normalizeClass(["layui-slider-btn-v", [__props.disabled ? "layui-slider-disabled disable-btn" : ""]])
            }, null, 6)
          ]),
          _: 1
        }, 8, ["content", "is-can-hide"]),
        createElementVNode("div", {
          style: normalizeStyle({ width: __props.val + "%" }),
          class: normalizeClass(["layui-slider-rate-v", [__props.disabled ? "layui-slider-disabled disable-line" : ""]])
        }, null, 6),
        createElementVNode("div", {
          class: "layui-slider-line-v",
          style: normalizeStyle({
            backgroundColor: props.backgroundColor
          })
        }, null, 4),
        (openBlock(true), createElementBlock(Fragment, null, renderList(unref(dots), (item, index2) => {
          return withDirectives((openBlock(), createElementBlock("div", {
            onClick: ($event) => focusDot(item),
            class: "layui-slider-dots",
            key: index2,
            style: normalizeStyle({ left: item + "%" })
          }, null, 12, _hoisted_2$4)), [
            [vShow, __props.showDots]
          ]);
        }), 128))
      ], 42, _hoisted_1$4);
    };
  }
});
const _hoisted_1$3 = ["onMousedown"];
const _hoisted_2$3 = /* @__PURE__ */ createElementVNode("div", { class: "layui-slider-line-v" }, null, -1);
const _hoisted_3$3 = ["onClick"];
const __default__$3 = {
  name: "StandardRange"
};
const _sfc_main$3 = defineComponent({
  ...__default__$3,
  props: {
    rangeValue: null,
    disabled: { type: Boolean, default: false },
    step: { default: 0 },
    min: { default: 0 },
    max: { default: 100 },
    showDots: { type: Boolean, default: true }
  },
  emits: ["link-val-hook"],
  setup(__props, { emit }) {
    const props = __props;
    let rv = toRef(props, "rangeValue");
    const moveAction = throttle(rangeMove);
    let currbtn = -1;
    function handle_mousedown() {
      currbtn = -1;
      tooptipHide.value = false;
      on("selectstart", window, handle_select2, { once: true });
      on("mouseup", window, handle_mouseup);
      on("mousemove", window, moveAction);
    }
    function handle_mouseup() {
      tooptipHide.value = true;
      off("selectstart", document, handle_select2);
      off("mouseup", window, handle_mouseup);
      off("mousemove", window, moveAction);
    }
    function handle_select2(e) {
      e.preventDefault();
    }
    const tracker = ref(null);
    const tooptipHide = ref(true);
    function rangeMove(e) {
      if (!tracker.value) {
        return;
      }
      let tracker_rect = tracker.value.getBoundingClientRect();
      let origin_left = tracker_rect.left;
      let point_left = e.clientX;
      let distance = point_left - origin_left;
      if (distance < props.min) {
        rv.value[0] = props.min;
      } else {
        let rate = distance / tracker_rect.width * 100;
        let idx = -1;
        if (currbtn === -1) {
          currbtn = moveNeighbors(Math.floor(rate), rv);
          idx = currbtn;
        } else {
          idx = currbtn;
        }
        calcWithStep(rate, rv, idx);
        if (rv.value[1] > props.max) {
          rv.value[1] = props.max;
        }
        if (rv.value[0] < props.min) {
          rv.value[0] = props.min;
        }
      }
      emit("link-val-hook", rv.value);
    }
    function moveNeighbors(rate, rangeValues) {
      let d1 = Math.abs(rate - rangeValues.value[0]);
      let d2 = Math.abs(rate - rangeValues.value[1]);
      if (d1 > d2) {
        return 1;
      } else {
        return 0;
      }
    }
    function calcWithStep(rate, val, idx = -1) {
      if (typeof rate === "undefined")
        return false;
      if (typeof val.value === "object") {
        let r = rate - val.value[idx];
        if (Math.abs(r) < props.step) {
          return false;
        }
        if (props.step === 0)
          val.value[idx] = Math.floor(rate);
        if (Array.isArray(val.value)) {
          if (r < 0 && props.step !== 0) {
            val.value[idx] -= props.step;
          } else {
            val.value[idx] += props.step;
          }
          cross(val);
        }
      }
    }
    function cross(val) {
      if (val.value[0] > val.value[1]) {
        let tmp = val.value[0];
        val.value[0] = val.value[1];
        val.value[1] = tmp;
        currbtn = currbtn === 0 ? 1 : 0;
      }
    }
    const dots = makeDots(props);
    const focusDot = (item) => {
      let currbtn2 = moveNeighbors(item, rv);
      rv.value[currbtn2] = item;
      emit("link-val-hook", rv.value);
    };
    return (_ctx, _cache) => {
      return openBlock(), createElementBlock("div", {
        ref_key: "tracker",
        ref: tracker,
        onMousedown: withModifiers(handle_mousedown, ["stop"]),
        class: normalizeClass(["layui-slider-srange", [__props.disabled ? "layui-slider-disabled" : ""]])
      }, [
        createVNode(_sfc_main$5, {
          content: "" + unref(rv)[0],
          "is-can-hide": tooptipHide.value
        }, {
          default: withCtx(() => [
            createElementVNode("div", {
              style: normalizeStyle({ left: unref(rv)[0] + "%" }),
              class: normalizeClass(["layui-slider-btn-v", [props.disabled ? "layui-slider-disabled disable-btn" : ""]])
            }, null, 6)
          ]),
          _: 1
        }, 8, ["content", "is-can-hide"]),
        createVNode(_sfc_main$5, {
          content: "" + unref(rv)[1],
          "is-can-hide": tooptipHide.value
        }, {
          default: withCtx(() => [
            createElementVNode("div", {
              style: normalizeStyle({ left: unref(rv)[1] + "%" }),
              class: normalizeClass(["layui-slider-btn-v", [props.disabled ? "layui-slider-disabled disable-btn" : ""]])
            }, null, 6)
          ]),
          _: 1
        }, 8, ["content", "is-can-hide"]),
        _hoisted_2$3,
        createElementVNode("div", {
          style: normalizeStyle({
            width: unref(rv)[1] - unref(rv)[0] + "%",
            left: unref(rv)[0] + "%"
          }),
          class: normalizeClass(["layui-slider-rate-v", [props.disabled ? "layui-slider-disabled disable-line" : ""]])
        }, null, 6),
        (openBlock(true), createElementBlock(Fragment, null, renderList(unref(dots), (item, index2) => {
          return withDirectives((openBlock(), createElementBlock("div", {
            onClick: ($event) => focusDot(item),
            class: "layui-slider-dots",
            key: index2,
            style: normalizeStyle({ left: item + "%" })
          }, null, 12, _hoisted_3$3)), [
            [vShow, __props.showDots]
          ]);
        }), 128))
      ], 42, _hoisted_1$3);
    };
  }
});
const _hoisted_1$2 = { class: "layui-slider-vertical" };
const _hoisted_2$2 = ["onMousedown"];
const _hoisted_3$2 = /* @__PURE__ */ createElementVNode("div", { class: "layui-slider-vertical-line" }, null, -1);
const _hoisted_4$2 = ["onClick"];
const __default__$2 = {
  name: "Vertical"
};
const _sfc_main$2 = defineComponent({
  ...__default__$2,
  props: {
    val: { default: 0 },
    disabled: { type: Boolean, default: true },
    step: { default: 0 },
    min: { default: 0 },
    max: { default: 100 },
    showDots: { type: Boolean, default: false }
  },
  emits: ["link-val-hook"],
  setup(__props, { emit }) {
    const props = __props;
    const moveAction = throttle(verticalMove);
    function handle_mouseup() {
      off("selectstart", document, handle_select2);
      off("mouseup", window, handle_mouseup);
      off("mousemove", window, moveAction);
      tooptipHide.value = true;
    }
    function handle_select2(e) {
      e.preventDefault();
    }
    function handle_mousedown() {
      on("selectstart", window, handle_select2, { once: true });
      on("mouseup", window, handle_mouseup);
      on("mousemove", window, moveAction);
    }
    const tracker = ref(null);
    let vertical_style = ref(props.val);
    const tooptipHide = ref(true);
    function verticalMove(e) {
      tooptipHide.value = false;
      if (!tracker.value) {
        return;
      }
      let tracker_rect = tracker.value.getBoundingClientRect();
      let origin_bottom = tracker_rect.bottom;
      let point_bottom = e.clientY;
      let distance = (point_bottom - origin_bottom) * -1;
      if (distance < props.min) {
        vertical_style.value = props.min;
      } else {
        let rate = distance / tracker_rect.height * 100;
        calcWithStep(rate, vertical_style);
        if (vertical_style.value > props.max) {
          vertical_style.value = props.max;
        }
      }
      emit("link-val-hook", vertical_style.value);
    }
    function calcWithStep(rate, val) {
      if (typeof rate === "undefined")
        return false;
      if (typeof val.value === "number") {
        let r = rate - val.value;
        if (Math.abs(r) < props.step) {
          return false;
        }
        if (props.step === 0)
          val.value = Math.floor(rate);
        if (r < 0 && props.step !== 0) {
          val.value -= props.step;
        } else {
          val.value += props.step;
        }
      }
    }
    const makeDots2 = () => {
      if (props.step === 0)
        return [];
      let val = 0;
      let dots2 = [];
      let count = Math.floor(100 / props.step) - 1;
      for (let i = 0; i < count; i++) {
        val += props.step;
        dots2.push(val);
      }
      return dots2;
    };
    const dots = makeDots2();
    const focusDot = (val) => {
      emit("link-val-hook", val);
    };
    return (_ctx, _cache) => {
      return openBlock(), createElementBlock("div", _hoisted_1$2, [
        createElementVNode("div", {
          onMousedown: withModifiers(handle_mousedown, ["stop"]),
          ref_key: "tracker",
          ref: tracker,
          class: normalizeClass([[__props.disabled ? "layui-slider-disabled" : ""], "layui-slider-vertical-track"])
        }, [
          createVNode(_sfc_main$5, {
            content: "" + __props.val,
            "is-can-hide": tooptipHide.value
          }, {
            default: withCtx(() => [
              createElementVNode("div", {
                style: normalizeStyle({ bottom: __props.val + "%" }),
                class: normalizeClass([[props.disabled ? "layui-slider-disabled disable-btn" : ""], "layui-slider-vertical-btn"])
              }, null, 6)
            ]),
            _: 1
          }, 8, ["content", "is-can-hide"]),
          createElementVNode("div", {
            style: normalizeStyle({ height: __props.val + "%" }),
            class: normalizeClass([[props.disabled ? "layui-slider-disabled disable-line" : ""], "layui-slider-vertical-rate"])
          }, null, 6),
          _hoisted_3$2,
          (openBlock(true), createElementBlock(Fragment, null, renderList(unref(dots), (item, index2) => {
            return withDirectives((openBlock(), createElementBlock("div", {
              onClick: ($event) => focusDot(item),
              class: "layui-slider-vertical-dots",
              key: index2,
              style: normalizeStyle({ bottom: item + "%" })
            }, null, 12, _hoisted_4$2)), [
              [vShow, __props.showDots]
            ]);
          }), 128))
        ], 42, _hoisted_2$2)
      ]);
    };
  }
});
const _hoisted_1$1 = { class: "layui-slider-vertical" };
const _hoisted_2$1 = ["onMousedown"];
const _hoisted_3$1 = /* @__PURE__ */ createElementVNode("div", { class: "layui-slider-vertical-line" }, null, -1);
const _hoisted_4$1 = ["onClick"];
const __default__$1 = {
  name: "VerticalRange"
};
const _sfc_main$1 = defineComponent({
  ...__default__$1,
  props: {
    rangeValue: null,
    disabled: { type: Boolean, default: false },
    step: { default: 0 },
    min: { default: 0 },
    max: { default: 100 },
    showDots: { type: Boolean, default: false }
  },
  emits: ["link-val-hook"],
  setup(__props, { emit }) {
    const props = __props;
    let rv = toRef(props, "rangeValue");
    const moveAction = throttle(rangeMove);
    let currbtn = -1;
    function handle_mousedown() {
      currbtn = -1;
      tooptipHide.value = false;
      on("selectstart", window, handle_select2, { once: true });
      on("mouseup", window, handle_mouseup);
      on("mousemove", window, moveAction);
    }
    function handle_mouseup() {
      tooptipHide.value = true;
      off("selectstart", document, handle_select2);
      off("mouseup", window, handle_mouseup);
      off("mousemove", window, moveAction);
    }
    function handle_select2(e) {
      e.preventDefault();
    }
    const tracker = ref(null);
    const tooptipHide = ref(true);
    function rangeMove(e) {
      if (!tracker.value) {
        return;
      }
      let tracker_rect = tracker.value.getBoundingClientRect();
      let origin_bottom = tracker_rect.bottom;
      let point_bottom = e.clientY;
      let distance = (point_bottom - origin_bottom) * -1;
      if (distance < props.min) {
        rv.value[0] = props.min;
      } else {
        let rate = distance / tracker_rect.height * 100;
        let idx = -1;
        if (currbtn === -1) {
          currbtn = moveNeighbors(Math.floor(rate), rv);
          idx = currbtn;
        } else {
          idx = currbtn;
        }
        calcWithStep(rate, rv, idx);
        if (rv.value[1] > props.max) {
          rv.value[1] = props.max;
        }
        if (rv.value[0] < props.min) {
          rv.value[0] = props.min;
        }
      }
      emit("link-val-hook", rv.value);
    }
    function moveNeighbors(rate, rangeValues) {
      let d1 = Math.abs(rate - rangeValues.value[0]);
      let d2 = Math.abs(rate - rangeValues.value[1]);
      if (d1 > d2) {
        return 1;
      } else {
        return 0;
      }
    }
    function calcWithStep(rate, val, idx = -1) {
      if (typeof rate === "undefined")
        return false;
      if (typeof val.value === "object") {
        let r = rate - val.value[idx];
        if (Math.abs(r) < props.step) {
          return false;
        }
        if (props.step === 0)
          val.value[idx] = Math.floor(rate);
        if (Array.isArray(val.value)) {
          if (r < 0 && props.step !== 0) {
            val.value[idx] -= props.step;
          } else {
            val.value[idx] += props.step;
          }
          cross(val);
        }
      }
    }
    function cross(val) {
      if (val.value[0] > val.value[1]) {
        let tmp = val.value[0];
        val.value[0] = val.value[1];
        val.value[1] = tmp;
        currbtn = currbtn === 0 ? 1 : 0;
      }
    }
    const dots = makeDots(props);
    const focusDot = (item) => {
      let currbtn2 = moveNeighbors(item, rv);
      rv.value[currbtn2] = item;
      emit("link-val-hook", rv.value);
    };
    return (_ctx, _cache) => {
      return openBlock(), createElementBlock("div", _hoisted_1$1, [
        createElementVNode("div", {
          ref_key: "tracker",
          ref: tracker,
          onMousedown: withModifiers(handle_mousedown, ["stop"]),
          class: normalizeClass(["layui-slider-vrange", [__props.disabled ? "layui-slider-disabled" : ""]])
        }, [
          createVNode(_sfc_main$5, {
            content: "" + unref(rv)[1],
            "is-can-hide": tooptipHide.value
          }, {
            default: withCtx(() => [
              createElementVNode("div", {
                style: normalizeStyle({ bottom: unref(rv)[1] + "%" }),
                class: normalizeClass(["layui-slider-vertical-btn", [props.disabled ? "layui-slider-disabled disable-btn" : ""]])
              }, null, 6)
            ]),
            _: 1
          }, 8, ["content", "is-can-hide"]),
          createVNode(_sfc_main$5, {
            content: "" + unref(rv)[0],
            "is-can-hide": tooptipHide.value
          }, {
            default: withCtx(() => [
              createElementVNode("div", {
                style: normalizeStyle({ bottom: unref(rv)[0] + "%" }),
                class: normalizeClass(["layui-slider-vertical-btn", [props.disabled ? "layui-slider-disabled disable-btn" : ""]])
              }, null, 6)
            ]),
            _: 1
          }, 8, ["content", "is-can-hide"]),
          _hoisted_3$1,
          createElementVNode("div", {
            style: normalizeStyle({
              height: unref(rv)[1] - unref(rv)[0] + "%",
              bottom: unref(rv)[0] + "%"
            }),
            class: normalizeClass(["layui-slider-vertical-rate", [props.disabled ? "layui-slider-disabled disable-line" : ""]])
          }, null, 6),
          (openBlock(true), createElementBlock(Fragment, null, renderList(unref(dots), (item, index2) => {
            return withDirectives((openBlock(), createElementBlock("div", {
              onClick: ($event) => focusDot(item),
              class: "layui-slider-vertical-dots",
              key: index2,
              style: normalizeStyle({ bottom: item + "%" })
            }, null, 12, _hoisted_4$1)), [
              [vShow, __props.showDots]
            ]);
          }), 128))
        ], 42, _hoisted_2$1)
      ]);
    };
  }
});
const _hoisted_1 = { key: 0 };
const _hoisted_2 = { key: 0 };
const _hoisted_3 = { key: 1 };
const _hoisted_4 = { key: 1 };
const _hoisted_5 = { key: 0 };
const _hoisted_6 = { key: 1 };
const __default__ = {
  name: "LaySlider"
};
const _sfc_main = defineComponent({
  ...__default__,
  props: {
    vertical: { type: Boolean, default: false },
    modelValue: { default: 0 },
    min: { default: 0 },
    max: { default: 100 },
    step: { default: 0 },
    disabled: { type: Boolean, default: false },
    range: { type: Boolean },
    rangeValue: null,
    showDots: { type: Boolean, default: false },
    backgroundColor: { default: "#ccc" }
  },
  emits: ["update:modelValue"],
  setup(__props, { emit }) {
    const props = __props;
    let rangeValues = toRef(props, "rangeValue");
    function valHook(val) {
      emit("update:modelValue", val);
    }
    return (_ctx, _cache) => {
      return openBlock(), createElementBlock("div", null, [
        __props.vertical ? (openBlock(), createElementBlock("div", _hoisted_1, [
          __props.range ? (openBlock(), createElementBlock("div", _hoisted_2, [
            createVNode(_sfc_main$1, {
              step: __props.step,
              onLinkValHook: valHook,
              disabled: __props.disabled,
              rangeValue: unref(rangeValues),
              min: __props.min,
              max: __props.max,
              showDots: __props.showDots
            }, null, 8, ["step", "disabled", "rangeValue", "min", "max", "showDots"])
          ])) : (openBlock(), createElementBlock("div", _hoisted_3, [
            createVNode(_sfc_main$2, {
              step: __props.step,
              onLinkValHook: valHook,
              disabled: __props.disabled,
              val: __props.modelValue,
              min: __props.min,
              max: __props.max,
              showDots: __props.showDots
            }, null, 8, ["step", "disabled", "val", "min", "max", "showDots"])
          ]))
        ])) : (openBlock(), createElementBlock("div", _hoisted_4, [
          __props.range ? (openBlock(), createElementBlock("div", _hoisted_5, [
            createVNode(_sfc_main$3, {
              step: __props.step,
              onLinkValHook: valHook,
              disabled: __props.disabled,
              rangeValue: unref(rangeValues),
              min: __props.min,
              max: __props.max,
              showDots: __props.showDots
            }, null, 8, ["step", "disabled", "rangeValue", "min", "max", "showDots"])
          ])) : (openBlock(), createElementBlock("div", _hoisted_6, [
            createVNode(_sfc_main$4, {
              val: __props.modelValue,
              onLinkValHook: valHook,
              disabled: __props.disabled,
              step: __props.step,
              min: __props.min,
              max: __props.max,
              showDots: __props.showDots,
              backgroundColor: props.backgroundColor
            }, null, 8, ["val", "disabled", "step", "min", "max", "showDots", "backgroundColor"])
          ]))
        ]))
      ]);
    };
  }
});
const component = withInstall(_sfc_main);
export { component as default };