@varlet/ui 2.16.7 → 2.16.8-alpha.1695118057982

package/es/slider/Slider.mjs

@@ -1,196 +1,260 @@
-import VarFormDetails from '../form-details/index.mjs';
-import VarHoverOverlay, { useHoverOverlay } from '../hover-overlay/index.mjs';
-import Hover from '../hover/index.mjs';
-import { defineComponent, ref, onBeforeUnmount, computed, reactive, nextTick, watch, unref } from 'vue';
-import { useValidation, createNamespace, call } from '../utils/components.mjs';
-import { useForm } from '../form/provide.mjs';
-import { getLeft, multiplySizeUnit } from '../utils/elements.mjs';
-import { warn } from '../utils/logger.mjs';
-import { isArray, isNumber, toNumber, getRect } from '@varlet/shared';
-import { props, Thumbs } from './props.mjs';
-import { onSmartMounted } from '@varlet/use';
-var {
-  name,
-  n,
-  classes
-} = createNamespace('slider');
+import VarFormDetails from "../form-details/index.mjs";
+import VarHoverOverlay, { useHoverOverlay } from "../hover-overlay/index.mjs";
+import Hover from "../hover/index.mjs";
+import { defineComponent, ref, onBeforeUnmount, computed, reactive, nextTick, watch, unref } from "vue";
+import { useValidation, createNamespace, call } from "../utils/components.mjs";
+import { useForm } from "../form/provide.mjs";
+import { getLeft, multiplySizeUnit } from "../utils/elements.mjs";
+import { warn } from "../utils/logger.mjs";
+import { isArray, isNumber, toNumber, getRect } from "@varlet/shared";
+import { props, Thumbs } from "./props.mjs";
+import { onSmartMounted } from "@varlet/use";
+const { name, n, classes } = createNamespace("slider");
 import { normalizeClass as _normalizeClass, normalizeStyle as _normalizeStyle, createElementVNode as _createElementVNode, renderList as _renderList, Fragment as _Fragment, openBlock as _openBlock, createElementBlock as _createElementBlock, renderSlot as _renderSlot, resolveDirective as _resolveDirective, withDirectives as _withDirectives, resolveComponent as _resolveComponent, createVNode as _createVNode, toDisplayString as _toDisplayString, withModifiers as _withModifiers, pushScopeId as _pushScopeId, popScopeId as _popScopeId } from "vue";
-var _withScopeId = n => (_pushScopeId(""), n = n(), _popScopeId(), n);
-var _hoisted_1 = ["onTouchstart"];
+const _withScopeId = (n2) => (_pushScopeId(""), n2 = n2(), _popScopeId(), n2);
+const _hoisted_1 = ["onTouchstart"];
 function __render__(_ctx, _cache) {
-  var _component_var_hover_overlay = _resolveComponent("var-hover-overlay");
-  var _component_var_form_details = _resolveComponent("var-form-details");
-  var _directive_hover = _resolveDirective("hover");
-  return _openBlock(), _createElementBlock("div", {
-    class: _normalizeClass(_ctx.classes(_ctx.n(_ctx.direction), _ctx.n('$--box')))
-  }, [_createElementVNode("div", {
-    class: _normalizeClass(_ctx.classes(_ctx.n(_ctx.direction + "-block"), [_ctx.isDisabled, _ctx.n('--disabled')], [_ctx.errorMessage, _ctx.n(_ctx.direction + "--error")])),
-    ref: "sliderEl",
-    onClick: _cache[0] || (_cache[0] = function () {
-      return _ctx.click && _ctx.click(...arguments);
-    })
-  }, [_createElementVNode("div", {
-    class: _normalizeClass(_ctx.n(_ctx.direction + "-track"))
-  }, [_createElementVNode("div", {
-    class: _normalizeClass(_ctx.n(_ctx.direction + "-track-background")),
-    style: _normalizeStyle({
-      background: _ctx.trackColor,
-      height: _ctx.isVertical ? '100%' : _ctx.multiplySizeUnit(_ctx.trackHeight),
-      width: _ctx.isVertical ? _ctx.multiplySizeUnit(_ctx.trackHeight) : '100%'
-    })
-  }, null, 6 /* CLASS, STYLE */), _createElementVNode("div", {
-    class: _normalizeClass(_ctx.n(_ctx.direction + "-track-fill")),
-    style: _normalizeStyle(_ctx.getFillStyle)
-  }, null, 6 /* CLASS, STYLE */)], 2 /* CLASS */), (_openBlock(true), _createElementBlock(_Fragment, null, _renderList(_ctx.thumbList, item => {
-    return _openBlock(), _createElementBlock("div", {
-      class: _normalizeClass(_ctx.n(_ctx.direction + "-thumb")),
-      key: item.enumValue,
-      style: _normalizeStyle(_ctx.thumbStyle(item)),
-      onTouchstart: _withModifiers($event => _ctx.start($event, item.enumValue), ["stop"])
-    }, [_renderSlot(_ctx.$slots, "button", {
-      currentValue: item.text
-    }, () => [_withDirectives(_createElementVNode("div", {
-      class: _normalizeClass(_ctx.n(_ctx.direction + "-thumb-block")),
-      style: _normalizeStyle({
-        background: _ctx.thumbColor
-      })
-    }, null, 6 /* CLASS, STYLE */), [[_directive_hover, value => _ctx.hover(value, item), "desktop"]]), _createElementVNode("div", {
-      class: _normalizeClass(_ctx.classes(_ctx.n(_ctx.direction + "-thumb-ripple"), [_ctx.thumbsProps[item.enumValue].active, _ctx.n(_ctx.direction + "-thumb-ripple--active")])),
-      style: _normalizeStyle({
-        background: _ctx.thumbsProps[item.enumValue].active ? _ctx.thumbColor : undefined
-      })
-    }, [_createVNode(_component_var_hover_overlay, {
-      hovering: item.hovering
-    }, null, 8 /* PROPS */, ["hovering"])], 6 /* CLASS, STYLE */), _createElementVNode("div", {
-      class: _normalizeClass(_ctx.classes(_ctx.n(_ctx.direction + "-thumb-label"), [_ctx.showLabel(item.enumValue), _ctx.n(_ctx.direction + "-thumb-label--active")])),
-      style: _normalizeStyle({
-        background: _ctx.labelColor,
-        color: _ctx.labelTextColor,
-        height: _ctx.thumbSize === undefined ? _ctx.thumbSize : _ctx.multiplySizeUnit(_ctx.thumbSize, 2),
-        width: _ctx.thumbSize === undefined ? _ctx.thumbSize : _ctx.multiplySizeUnit(_ctx.thumbSize, 2)
-      })
-    }, [_createElementVNode("span", null, _toDisplayString(item.text), 1 /* TEXT */)], 6 /* CLASS, STYLE */)])], 46 /* CLASS, STYLE, PROPS, HYDRATE_EVENTS */, _hoisted_1);
-  }), 128 /* KEYED_FRAGMENT */))], 2 /* CLASS */), _createVNode(_component_var_form_details, {
-    "error-message": _ctx.errorMessage,
-    class: _normalizeClass(_ctx.n('form')),
-    "var-slider-cover": ""
-  }, null, 8 /* PROPS */, ["error-message", "class"])], 2 /* CLASS */);
+  const _component_var_hover_overlay = _resolveComponent("var-hover-overlay");
+  const _component_var_form_details = _resolveComponent("var-form-details");
+  const _directive_hover = _resolveDirective("hover");
+  return _openBlock(), _createElementBlock(
+    "div",
+    {
+      class: _normalizeClass(_ctx.classes(_ctx.n(_ctx.direction), _ctx.n("$--box")))
+    },
+    [
+      _createElementVNode(
+        "div",
+        {
+          class: _normalizeClass(_ctx.classes(_ctx.n(`${_ctx.direction}-block`), [_ctx.isDisabled, _ctx.n("--disabled")], [_ctx.errorMessage, _ctx.n(`${_ctx.direction}--error`)])),
+          ref: "sliderEl",
+          onClick: _cache[0] || (_cache[0] = (...args) => _ctx.click && _ctx.click(...args))
+        },
+        [
+          _createElementVNode(
+            "div",
+            {
+              class: _normalizeClass(_ctx.n(`${_ctx.direction}-track`))
+            },
+            [
+              _createElementVNode(
+                "div",
+                {
+                  class: _normalizeClass(_ctx.n(`${_ctx.direction}-track-background`)),
+                  style: _normalizeStyle({
+                    background: _ctx.trackColor,
+                    height: _ctx.isVertical ? "100%" : _ctx.multiplySizeUnit(_ctx.trackHeight),
+                    width: _ctx.isVertical ? _ctx.multiplySizeUnit(_ctx.trackHeight) : "100%"
+                  })
+                },
+                null,
+                6
+                /* CLASS, STYLE */
+              ),
+              _createElementVNode(
+                "div",
+                {
+                  class: _normalizeClass(_ctx.n(`${_ctx.direction}-track-fill`)),
+                  style: _normalizeStyle(_ctx.getFillStyle)
+                },
+                null,
+                6
+                /* CLASS, STYLE */
+              )
+            ],
+            2
+            /* CLASS */
+          ),
+          (_openBlock(true), _createElementBlock(
+            _Fragment,
+            null,
+            _renderList(_ctx.thumbList, (item) => {
+              return _openBlock(), _createElementBlock("div", {
+                class: _normalizeClass(_ctx.n(`${_ctx.direction}-thumb`)),
+                key: item.enumValue,
+                style: _normalizeStyle(_ctx.thumbStyle(item)),
+                onTouchstart: _withModifiers(($event) => _ctx.start($event, item.enumValue), ["stop"])
+              }, [
+                _renderSlot(_ctx.$slots, "button", {
+                  currentValue: item.text
+                }, () => [
+                  _withDirectives(_createElementVNode(
+                    "div",
+                    {
+                      class: _normalizeClass(_ctx.n(`${_ctx.direction}-thumb-block`)),
+                      style: _normalizeStyle({
+                        background: _ctx.thumbColor
+                      })
+                    },
+                    null,
+                    6
+                    /* CLASS, STYLE */
+                  ), [
+                    [_directive_hover, (value) => _ctx.hover(value, item), "desktop"]
+                  ]),
+                  _createElementVNode(
+                    "div",
+                    {
+                      class: _normalizeClass(
+                        _ctx.classes(_ctx.n(`${_ctx.direction}-thumb-ripple`), [
+                          _ctx.thumbsProps[item.enumValue].active,
+                          _ctx.n(`${_ctx.direction}-thumb-ripple--active`)
+                        ])
+                      ),
+                      style: _normalizeStyle({
+                        background: _ctx.thumbsProps[item.enumValue].active ? _ctx.thumbColor : void 0
+                      })
+                    },
+                    [
+                      _createVNode(_component_var_hover_overlay, {
+                        hovering: item.hovering
+                      }, null, 8, ["hovering"])
+                    ],
+                    6
+                    /* CLASS, STYLE */
+                  ),
+                  _createElementVNode(
+                    "div",
+                    {
+                      class: _normalizeClass(
+                        _ctx.classes(_ctx.n(`${_ctx.direction}-thumb-label`), [_ctx.showLabel(item.enumValue), _ctx.n(`${_ctx.direction}-thumb-label--active`)])
+                      ),
+                      style: _normalizeStyle({
+                        background: _ctx.labelColor,
+                        color: _ctx.labelTextColor,
+                        height: _ctx.thumbSize === void 0 ? _ctx.thumbSize : _ctx.multiplySizeUnit(_ctx.thumbSize, 2),
+                        width: _ctx.thumbSize === void 0 ? _ctx.thumbSize : _ctx.multiplySizeUnit(_ctx.thumbSize, 2)
+                      })
+                    },
+                    [
+                      _createElementVNode(
+                        "span",
+                        null,
+                        _toDisplayString(item.text),
+                        1
+                        /* TEXT */
+                      )
+                    ],
+                    6
+                    /* CLASS, STYLE */
+                  )
+                ])
+              ], 46, _hoisted_1);
+            }),
+            128
+            /* KEYED_FRAGMENT */
+          ))
+        ],
+        2
+        /* CLASS */
+      ),
+      _createVNode(_component_var_form_details, {
+        "error-message": _ctx.errorMessage,
+        class: _normalizeClass(_ctx.n("form")),
+        "var-slider-cover": ""
+      }, null, 8, ["error-message", "class"])
+    ],
+    2
+    /* CLASS */
+  );
 }
-
-var __sfc__ = defineComponent({
+const __sfc__ = defineComponent({
   name,
   components: {
     VarFormDetails,
     VarHoverOverlay
   },
-  directives: {
-    Hover
-  },
+  directives: { Hover },
   props,
-  setup(props) {
-    var maxDistance = ref(0);
-    var sliderEl = ref(null);
-    var isScroll = ref(false);
-    var scope = computed(() => toNumber(props.max) - toNumber(props.min));
-    var unitWidth = computed(() => maxDistance.value / scope.value * toNumber(props.step));
-    var isDisabled = computed(() => props.disabled || (form == null ? void 0 : form.disabled.value));
-    var isReadonly = computed(() => props.readonly || (form == null ? void 0 : form.readonly.value));
-    var isVertical = computed(() => props.direction === 'vertical');
-    var {
-      bindForm,
-      form
-    } = useForm();
-    var {
-      errorMessage,
-      validateWithTrigger: vt,
-      validate: v,
-      resetValidation
-    } = useValidation();
-    var {
-      hovering: hoveringFirst,
-      handleHovering: handleHoveringFirst
-    } = useHoverOverlay();
-    var {
-      hovering: hoveringSecond,
-      handleHovering: handleHoveringSecond
-    } = useHoverOverlay();
-    var thumbList = computed(() => {
-      var {
-        modelValue,
-        range
-      } = props;
-      var list = [];
+  setup(props2) {
+    const maxDistance = ref(0);
+    const sliderEl = ref(null);
+    const isScroll = ref(false);
+    const scope = computed(() => toNumber(props2.max) - toNumber(props2.min));
+    const unitWidth = computed(() => maxDistance.value / scope.value * toNumber(props2.step));
+    const isDisabled = computed(() => props2.disabled || (form == null ? void 0 : form.disabled.value));
+    const isReadonly = computed(() => props2.readonly || (form == null ? void 0 : form.readonly.value));
+    const isVertical = computed(() => props2.direction === "vertical");
+    const { bindForm, form } = useForm();
+    const { errorMessage, validateWithTrigger: vt, validate: v, resetValidation } = useValidation();
+    const { hovering: hoveringFirst, handleHovering: handleHoveringFirst } = useHoverOverlay();
+    const { hovering: hoveringSecond, handleHovering: handleHoveringSecond } = useHoverOverlay();
+    const thumbList = computed(() => {
+      const { modelValue, range } = props2;
+      let list = [];
       if (range && isArray(modelValue)) {
-        list = [{
-          value: getValue(modelValue[0]),
-          enumValue: Thumbs.First,
-          text: toPrecision(modelValue[0]),
-          hovering: unref(hoveringFirst),
-          handleHovering: handleHoveringFirst
-        }, {
-          value: getValue(modelValue[1]),
-          enumValue: Thumbs.Second,
-          text: toPrecision(modelValue[1]),
-          hovering: unref(hoveringSecond),
-          handleHovering: handleHoveringSecond
-        }];
+        list = [
+          {
+            value: getValue(modelValue[0]),
+            enumValue: Thumbs.First,
+            text: toPrecision(modelValue[0]),
+            hovering: unref(hoveringFirst),
+            handleHovering: handleHoveringFirst
+          },
+          {
+            value: getValue(modelValue[1]),
+            enumValue: Thumbs.Second,
+            text: toPrecision(modelValue[1]),
+            hovering: unref(hoveringSecond),
+            handleHovering: handleHoveringSecond
+          }
+        ];
       } else if (isNumber(modelValue)) {
-        list = [{
-          value: getValue(modelValue),
-          enumValue: Thumbs.First,
-          text: toPrecision(modelValue),
-          hovering: unref(hoveringFirst),
-          handleHovering: handleHoveringFirst
-        }];
+        list = [
+          {
+            value: getValue(modelValue),
+            enumValue: Thumbs.First,
+            text: toPrecision(modelValue),
+            hovering: unref(hoveringFirst),
+            handleHovering: handleHoveringFirst
+          }
+        ];
       }
       return list;
     });
-    var getFillStyle = computed(() => {
-      var {
-        activeColor,
-        range,
-        modelValue
-      } = props;
-      var gap = range && isArray(modelValue) ? getValue(Math.min(modelValue[0], modelValue[1])) : 0;
-      var fillLength = range && isArray(modelValue) ? getValue(Math.max(modelValue[0], modelValue[1])) - gap : getValue(modelValue);
+    const getFillStyle = computed(() => {
+      const { activeColor, range, modelValue } = props2;
+      const gap = range && isArray(modelValue) ? getValue(Math.min(modelValue[0], modelValue[1])) : 0;
+      const fillLength = range && isArray(modelValue) ? getValue(Math.max(modelValue[0], modelValue[1])) - gap : getValue(modelValue);
       return isVertical.value ? {
-        left: '0px',
-        height: fillLength + "%",
-        bottom: gap + "%",
+        left: "0px",
+        height: `${fillLength}%`,
+        bottom: `${gap}%`,
         background: activeColor
       } : {
-        top: '0px',
-        width: fillLength + "%",
-        left: gap + "%",
+        top: "0px",
+        width: `${fillLength}%`,
+        left: `${gap}%`,
         background: activeColor
       };
     });
-    var thumbsProps = reactive({
+    const thumbsProps = reactive({
       [Thumbs.First]: getThumbProps(),
       [Thumbs.Second]: getThumbProps()
     });
-    var activeThumb;
-    var sliderProvider = {
+    let activeThumb;
+    const sliderProvider = {
       reset,
       validate,
       resetValidation
     };
     call(bindForm, sliderProvider);
-    watch([() => props.modelValue, () => props.step], _ref => {
-      var [modelValue, step] = _ref;
-      if (!stepValidator() || !valueValidator() || isScroll.value) return;
+    watch([() => props2.modelValue, () => props2.step], ([modelValue, step]) => {
+      if (!stepValidator() || !valueValidator() || isScroll.value)
+        return;
       setProps(modelValue, toNumber(step));
     });
     watch(maxDistance, () => setProps());
     onSmartMounted(() => {
-      if (!stepValidator() || !valueValidator()) return;
-      maxDistance.value = sliderEl.value[isVertical.value ? 'offsetHeight' : 'offsetWidth'];
+      if (!stepValidator() || !valueValidator())
+        return;
+      maxDistance.value = sliderEl.value[isVertical.value ? "offsetHeight" : "offsetWidth"];
     });
     onBeforeUnmount(() => {
       removeDocumentEvents();
     });
     function validate() {
-      return v(props.rules, props.modelValue);
+      return v(props2.rules, props2.modelValue);
     }
     function getThumbProps() {
       return {
@@ -201,140 +265,131 @@ var __sfc__ = defineComponent({
       };
     }
     function validateWithTrigger() {
-      return nextTick(() => vt(['onChange'], 'onChange', props.rules, props.modelValue));
+      return nextTick(() => vt(["onChange"], "onChange", props2.rules, props2.modelValue));
     }
     function getOffset(e) {
-      var currentTarget = e.currentTarget;
-      if (!currentTarget) return 0;
+      const currentTarget = e.currentTarget;
+      if (!currentTarget)
+        return 0;
       if (!isVertical.value) {
         return e.clientX - getLeft(currentTarget);
       }
       return maxDistance.value - (e.clientY - getRect(currentTarget).top);
     }
     function thumbStyle(thumb) {
-      var key = isVertical.value ? 'bottom' : 'left';
+      const key = isVertical.value ? "bottom" : "left";
       return {
-        [key]: thumb.value + "%",
-        zIndex: thumbsProps[thumb.enumValue].active ? 1 : undefined
+        [key]: `${thumb.value}%`,
+        zIndex: thumbsProps[thumb.enumValue].active ? 1 : void 0
       };
     }
     function showLabel(type) {
-      if (props.labelVisible === 'always') return true;
-      if (props.labelVisible === 'never') return false;
+      if (props2.labelVisible === "always")
+        return true;
+      if (props2.labelVisible === "never")
+        return false;
       return thumbsProps[type].active;
     }
     function getValue(value) {
-      var {
-        min,
-        max
-      } = props;
-      if (value < toNumber(min)) return 0;
-      if (value > toNumber(max)) return 100;
+      const { min, max } = props2;
+      if (value < toNumber(min))
+        return 0;
+      if (value > toNumber(max))
+        return 100;
       return (value - toNumber(min)) / scope.value * 100;
     }
     function toPrecision(value) {
-      if (!isNumber(value)) return 0;
-      var num = value;
-      if (num < Number(props.min)) num = Number(props.min);
-      if (num > Number(props.max)) num = Number(props.max);
-      var isInteger = parseInt("" + num, 10) === num;
+      if (!isNumber(value))
+        return 0;
+      let num = value;
+      if (num < Number(props2.min))
+        num = Number(props2.min);
+      if (num > Number(props2.max))
+        num = Number(props2.max);
+      const isInteger = parseInt(`${num}`, 10) === num;
       return isInteger ? num : toNumber(num.toPrecision(5));
     }
     function hover(value, item) {
-      if (isDisabled.value) return;
+      if (isDisabled.value)
+        return;
       item.handleHovering(value);
     }
     function setPercent(moveDistance, type) {
-      var rangeValue = [];
-      var {
-        step,
-        range,
-        modelValue,
-        onChange,
-        min
-      } = props;
-      var stepNumber = toNumber(step);
-      var roundDistance = Math.round(moveDistance / unitWidth.value);
-      var curValue = roundDistance * stepNumber + toNumber(min);
-      var prevValue = thumbsProps[type].percentValue * stepNumber + toNumber(min);
+      let rangeValue = [];
+      const { step, range, modelValue, onChange, min } = props2;
+      const stepNumber = toNumber(step);
+      const roundDistance = Math.round(moveDistance / unitWidth.value);
+      const curValue = roundDistance * stepNumber + toNumber(min);
+      const prevValue = thumbsProps[type].percentValue * stepNumber + toNumber(min);
       thumbsProps[type].percentValue = roundDistance;
       if (range && isArray(modelValue)) {
         rangeValue = type === Thumbs.First ? [curValue, modelValue[1]] : [modelValue[0], curValue];
       }
       if (prevValue !== curValue) {
-        var value = range ? rangeValue.map(value => toPrecision(value)) : toPrecision(curValue);
+        const value = range ? rangeValue.map((value2) => toPrecision(value2)) : toPrecision(curValue);
         call(onChange, value);
-        call(props['onUpdate:modelValue'], value);
+        call(props2["onUpdate:modelValue"], value);
         validateWithTrigger();
       }
     }
     function getType(offset) {
-      if (!props.range) return Thumbs.First;
-      var thumb1Distance = thumbsProps[Thumbs.First].percentValue * unitWidth.value;
-      var thumb2Distance = thumbsProps[Thumbs.Second].percentValue * unitWidth.value;
-      var offsetToThumb1 = Math.abs(offset - thumb1Distance);
-      var offsetToThumb2 = Math.abs(offset - thumb2Distance);
+      if (!props2.range)
+        return Thumbs.First;
+      const thumb1Distance = thumbsProps[Thumbs.First].percentValue * unitWidth.value;
+      const thumb2Distance = thumbsProps[Thumbs.Second].percentValue * unitWidth.value;
+      const offsetToThumb1 = Math.abs(offset - thumb1Distance);
+      const offsetToThumb2 = Math.abs(offset - thumb2Distance);
       return offsetToThumb1 <= offsetToThumb2 ? Thumbs.First : Thumbs.Second;
     }
     function addDocumentEvents() {
-      document.addEventListener('touchmove', move, {
-        passive: false
-      });
-      document.addEventListener('touchend', end);
-      document.addEventListener('touchcancel', end);
+      document.addEventListener("touchmove", move, { passive: false });
+      document.addEventListener("touchend", end);
+      document.addEventListener("touchcancel", end);
     }
     function removeDocumentEvents() {
-      document.removeEventListener('touchmove', move);
-      document.removeEventListener('touchend', end);
-      document.removeEventListener('touchcancel', end);
+      document.removeEventListener("touchmove", move);
+      document.removeEventListener("touchend", end);
+      document.removeEventListener("touchcancel", end);
     }
     function start(event, type) {
-      if (!maxDistance.value) maxDistance.value = sliderEl.value.offsetWidth;
+      if (!maxDistance.value)
+        maxDistance.value = sliderEl.value.offsetWidth;
       if (!isDisabled.value) {
         thumbsProps[type].active = true;
       }
       activeThumb = type;
       addDocumentEvents();
-      if (isDisabled.value || isReadonly.value) return;
-      call(props.onStart);
+      if (isDisabled.value || isReadonly.value)
+        return;
+      call(props2.onStart);
       isScroll.value = true;
-      var {
-        clientX,
-        clientY
-      } = event.touches[0];
+      const { clientX, clientY } = event.touches[0];
       thumbsProps[type].startPosition = isVertical.value ? clientY : clientX;
     }
     function move(event) {
       event.preventDefault();
-      if (isDisabled.value || isReadonly.value || !isScroll.value) return;
-      var {
-        startPosition,
-        currentOffset
-      } = thumbsProps[activeThumb];
-      var {
-        clientX,
-        clientY
-      } = event.touches[0];
-      var moveDistance = (isVertical.value ? startPosition - clientY : clientX - startPosition) + currentOffset;
-      if (moveDistance <= 0) moveDistance = 0;else if (moveDistance >= maxDistance.value) moveDistance = maxDistance.value;
+      if (isDisabled.value || isReadonly.value || !isScroll.value)
+        return;
+      const { startPosition, currentOffset } = thumbsProps[activeThumb];
+      const { clientX, clientY } = event.touches[0];
+      let moveDistance = (isVertical.value ? startPosition - clientY : clientX - startPosition) + currentOffset;
+      if (moveDistance <= 0)
+        moveDistance = 0;
+      else if (moveDistance >= maxDistance.value)
+        moveDistance = maxDistance.value;
       setPercent(moveDistance, activeThumb);
     }
     function end() {
       removeDocumentEvents();
-      var {
-        range,
-        modelValue,
-        onEnd,
-        step,
-        min
-      } = props;
+      const { range, modelValue, onEnd, step, min } = props2;
       if (!isDisabled.value) {
         thumbsProps[activeThumb].active = false;
       }
-      if (isDisabled.value || isReadonly.value) return;
-      var rangeValue = [];
+      if (isDisabled.value || isReadonly.value)
+        return;
+      let rangeValue = [];
       thumbsProps[activeThumb].currentOffset = thumbsProps[activeThumb].percentValue * unitWidth.value;
-      var curValue = thumbsProps[activeThumb].percentValue * toNumber(step) + toNumber(min);
+      const curValue = thumbsProps[activeThumb].percentValue * toNumber(step) + toNumber(min);
       if (range && isArray(modelValue)) {
         rangeValue = activeThumb === Thumbs.First ? [curValue, modelValue[1]] : [modelValue[0], curValue];
       }
@@ -342,31 +397,30 @@ var __sfc__ = defineComponent({
       isScroll.value = false;
     }
     function click(event) {
-      if (isDisabled.value || isReadonly.value) return;
-      if (event.target.closest("." + n('thumb'))) return;
-      var offset = getOffset(event);
-      var type = getType(offset);
+      if (isDisabled.value || isReadonly.value)
+        return;
+      if (event.target.closest(`.${n("thumb")}`))
+        return;
+      const offset = getOffset(event);
+      const type = getType(offset);
       activeThumb = type;
       setPercent(offset, type);
       end();
     }
     function stepValidator() {
-      var stepNumber = toNumber(props.step);
+      const stepNumber = toNumber(props2.step);
       if (isNaN(stepNumber)) {
-        warn('Slider', 'type of prop "step" should be Number');
+        warn("Slider", 'type of prop "step" should be Number');
         return false;
       }
       if (stepNumber < 0) {
-        warn('Slider', '"step" should be > 0');
+        warn("Slider", '"step" should be > 0');
         return false;
       }
       return true;
     }
     function valueValidator() {
-      var {
-        range,
-        modelValue
-      } = props;
+      const { range, modelValue } = props2;
       if (range && !isArray(modelValue)) {
         console.error('[Varlet] Slider: "modelValue" should be an Array');
         return false;
@@ -381,23 +435,16 @@ var __sfc__ = defineComponent({
       }
       return true;
     }
-    function setProps(modelValue, step) {
-      if (modelValue === void 0) {
-        modelValue = props.modelValue;
-      }
-      if (step === void 0) {
-        step = toNumber(props.step);
-      }
-      var getPercent = value => {
-        var {
-          min,
-          max
-        } = props;
-        if (value < toNumber(min)) return 0;
-        if (value > toNumber(max)) return scope.value / step;
+    function setProps(modelValue = props2.modelValue, step = toNumber(props2.step)) {
+      const getPercent = (value) => {
+        const { min, max } = props2;
+        if (value < toNumber(min))
+          return 0;
+        if (value > toNumber(max))
+          return scope.value / step;
         return (value - toNumber(min)) / step;
       };
-      if (props.range && isArray(modelValue)) {
+      if (props2.range && isArray(modelValue)) {
         thumbsProps[Thumbs.First].percentValue = getPercent(modelValue[0]);
         thumbsProps[Thumbs.First].currentOffset = thumbsProps[Thumbs.First].percentValue * unitWidth.value;
         thumbsProps[Thumbs.Second].percentValue = getPercent(modelValue[1]);
@@ -407,8 +454,8 @@ var __sfc__ = defineComponent({
       }
     }
     function reset() {
-      var resetValue = props.range ? [0, 0] : 0;
-      call(props['onUpdate:modelValue'], resetValue);
+      const resetValue = props2.range ? [0, 0] : 0;
+      call(props2["onUpdate:modelValue"], resetValue);
       resetValidation();
     }
     return {
@@ -435,4 +482,7 @@ var __sfc__ = defineComponent({
   }
 });
 __sfc__.render = __render__;
-export default __sfc__;
+var stdin_default = __sfc__;
+export {
+  stdin_default as default
+};