@varlet/ui 1.26.1-alpha.1644652196468 → 1.26.1

package/es/list/List.js

@@ -89,8 +89,10 @@ export default defineComponent({
       var containerBottom = scroller === window ? window.innerHeight : scroller.getBoundingClientRect().bottom;
       var {
         bottom: detectorBottom
-      } = detectorEl.value.getBoundingClientRect();
-      return detectorBottom - toPxNum(props.offset) <= containerBottom;
+      } = detectorEl.value.getBoundingClientRect(); // The fractional part of the detectorBottom when bottoming out overflows
+      // https://github.com/varletjs/varlet/issues/310
+
+      return Math.floor(detectorBottom) - toPxNum(props.offset) <= containerBottom;
     }; // expose
 
 

package/es/slider/Slider.js

@@ -1,3 +1,5 @@
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
 import { defineComponent, ref, onMounted, computed, reactive, nextTick, watch } from 'vue';
 import { useValidation } from '../utils/components';
 import { useForm } from '../form/provide';
@@ -74,11 +76,9 @@ export function render(_ctx, _cache) {
     /* STYLE */
     ), _createElementVNode("div", {
       class: _normalizeClass(["var-slider__thumb-ripple", [_ctx.thumbsProps[item.enumValue].active ? 'var-slider__thumb-ripple-active' : null]]),
-      style: _normalizeStyle({
-        background: _ctx.thumbColor,
-        height: _ctx.thumbSize === undefined ? undefined : _ctx.thumbsProps[item.enumValue].active ? 3 * _ctx.toNumber(_ctx.thumbSize) + "px" : '0px',
-        width: _ctx.thumbSize === undefined ? undefined : _ctx.thumbsProps[item.enumValue].active ? 3 * _ctx.toNumber(_ctx.thumbSize) + "px" : '0px'
-      })
+      style: _normalizeStyle(_extends({
+        background: _ctx.thumbColor
+      }, _ctx.getRippleSize(item)))
     }, null, 6
     /* CLASS, STYLE */
     ), _createElementVNode("div", {
@@ -166,6 +166,19 @@ export default defineComponent({
       return list;
     });
 
+    var getRippleSize = item => {
+      var size;
+
+      if (props.thumbSize !== undefined) {
+        size = thumbsProps[item.enumValue].active ? 3 * toNumber(props.thumbSize) + "px" : '0px';
+      }
+
+      return {
+        height: size,
+        width: size
+      };
+    };
+
     var showLabel = type => {
       if (props.labelVisible === 'always') return true;
       if (props.labelVisible === 'never') return false;
@@ -369,6 +382,7 @@ export default defineComponent({
       thumbsProps,
       thumbList,
       toNumber,
+      getRippleSize,
       showLabel,
       start,
       move,

package/es/varlet.esm.js

@@ -6,8 +6,8 @@ var context = {
 };
 reactive(context);
 var Context = reactive(context);
-function _extends$c() {
-  _extends$c = Object.assign || function(target) {
+function _extends$d() {
+  _extends$d = Object.assign || function(target) {
     for (var i = 1; i < arguments.length; i++) {
       var source = arguments[i];
       for (var key in source) {
@@ -18,7 +18,7 @@ function _extends$c() {
     }
     return target;
   };
-  return _extends$c.apply(this, arguments);
+  return _extends$d.apply(this, arguments);
 }
 var ANIMATION_DURATION$1 = 250;
 function setStyles(element) {
@@ -119,7 +119,7 @@ function forbidRippleTask() {
 }
 function mounted$1(el, binding) {
   var _binding$value, _binding$value$touchm, _binding$value2;
-  el._ripple = _extends$c({
+  el._ripple = _extends$d({
     tasker: null
   }, (_binding$value = binding.value) != null ? _binding$value : {}, {
     touchmoveForbid: (_binding$value$touchm = (_binding$value2 = binding.value) == null ? void 0 : _binding$value2.touchmoveForbid) != null ? _binding$value$touchm : Context.touchmoveForbid,
@@ -150,7 +150,7 @@ function unmounted(el) {
 }
 function updated$1(el, binding) {
   var _binding$value3, _binding$value$touchm2, _binding$value4;
-  el._ripple = _extends$c({}, el._ripple, (_binding$value3 = binding.value) != null ? _binding$value3 : {}, {
+  el._ripple = _extends$d({}, el._ripple, (_binding$value3 = binding.value) != null ? _binding$value3 : {}, {
     touchmoveForbid: (_binding$value$touchm2 = (_binding$value4 = binding.value) == null ? void 0 : _binding$value4.touchmoveForbid) != null ? _binding$value$touchm2 : Context.touchmoveForbid,
     tasker: null
   });
@@ -476,8 +476,8 @@ function _objectWithoutPropertiesLoose(source, excluded) {
   }
   return target;
 }
-function _extends$b() {
-  _extends$b = Object.assign || function(target) {
+function _extends$c() {
+  _extends$c = Object.assign || function(target) {
     for (var i = 1; i < arguments.length; i++) {
       var source = arguments[i];
       for (var key in source) {
@@ -488,7 +488,7 @@ function _extends$b() {
     }
     return target;
   };
-  return _extends$b.apply(this, arguments);
+  return _extends$c.apply(this, arguments);
 }
 function pickProps(props2, propsKey) {
   return Array.isArray(propsKey) ? propsKey.reduce((pickedProps, key) => {
@@ -517,7 +517,7 @@ function mountInstance(component, props2, eventListener) {
   }
   var Host = {
     setup() {
-      return () => h(component, _extends$b({}, props2, eventListener));
+      return () => h(component, _extends$c({}, props2, eventListener));
     }
   };
   var {
@@ -605,7 +605,7 @@ function useChildren(key) {
     removeItem(childProviders, childProvider);
   };
   var bindChildren = (parentProvider) => {
-    provide(key, _extends$b({
+    provide(key, _extends$c({
       collect,
       clear: clear2
     }, parentProvider));
@@ -708,8 +708,8 @@ function exposeApis(apis) {
     Object.assign(instance.proxy, apis);
   }
 }
-function _extends$a() {
-  _extends$a = Object.assign || function(target) {
+function _extends$b() {
+  _extends$b = Object.assign || function(target) {
     for (var i = 1; i < arguments.length; i++) {
       var source = arguments[i];
       for (var key in source) {
@@ -720,7 +720,7 @@ function _extends$a() {
     }
     return target;
   };
-  return _extends$a.apply(this, arguments);
+  return _extends$b.apply(this, arguments);
 }
 function _isSlot$2(s) {
   return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !isVNode(s);
@@ -768,7 +768,7 @@ var Popup = defineComponent({
       } = props2;
       return createVNode("div", {
         "class": ["var-popup__overlay", overlayClass],
-        "style": _extends$a({
+        "style": _extends$b({
           zIndex: zIndex.value - 1
         }, overlayStyle),
         "onClick": hidePopup
@@ -1131,8 +1131,8 @@ var Icon = defineComponent({
 Icon.install = function(app) {
   app.component(Icon.name, Icon);
 };
-function _extends$9() {
-  _extends$9 = Object.assign || function(target) {
+function _extends$a() {
+  _extends$a = Object.assign || function(target) {
     for (var i = 1; i < arguments.length; i++) {
       var source = arguments[i];
       for (var key in source) {
@@ -1143,9 +1143,9 @@ function _extends$9() {
     }
     return target;
   };
-  return _extends$9.apply(this, arguments);
+  return _extends$a.apply(this, arguments);
 }
-var props$Q = _extends$9({
+var props$Q = _extends$a({
   show: {
     type: Boolean,
     default: false
@@ -1277,8 +1277,8 @@ var zhCN = {
   paginationPage: "\u9875",
   paginationJump: "\u524D\u5F80"
 };
-function _extends$8() {
-  _extends$8 = Object.assign || function(target) {
+function _extends$9() {
+  _extends$9 = Object.assign || function(target) {
     for (var i = 1; i < arguments.length; i++) {
       var source = arguments[i];
       for (var key in source) {
@@ -1289,7 +1289,7 @@ function _extends$8() {
     }
     return target;
   };
-  return _extends$8.apply(this, arguments);
+  return _extends$9.apply(this, arguments);
 }
 function useLocale() {
   var packs2 = {};
@@ -1310,7 +1310,7 @@ function useLocale() {
       console.warn("The " + lang + " does not exist. You can mount a language package using the add method");
       return;
     }
-    packs2[lang] = _extends$8({}, packs2[lang], pack3);
+    packs2[lang] = _extends$9({}, packs2[lang], pack3);
     use2(lang);
   };
   return {
@@ -6624,8 +6624,8 @@ var PanelHeader = defineComponent({
     };
   }
 });
-function _extends$7() {
-  _extends$7 = Object.assign || function(target) {
+function _extends$8() {
+  _extends$8 = Object.assign || function(target) {
     for (var i = 1; i < arguments.length; i++) {
       var source = arguments[i];
       for (var key in source) {
@@ -6636,7 +6636,7 @@ function _extends$7() {
     }
     return target;
   };
-  return _extends$7.apply(this, arguments);
+  return _extends$8.apply(this, arguments);
 }
 dayjs.extend(isSameOrBefore);
 dayjs.extend(isSameOrAfter);
@@ -6668,7 +6668,7 @@ function render$E(_ctx, _cache) {
         class: "var-month-picker__button",
         "var-month-picker-cover": "",
         ripple: false
-      }, _extends$7({}, _ctx.buttonProps(month.index)), {
+      }, _extends$8({}, _ctx.buttonProps(month.index)), {
         onClick: ($event) => _ctx.chooseMonth(month)
       }), {
         default: withCtx(() => [createTextVNode(toDisplayString(_ctx.getMonthAbbr(month.index)), 1)]),
@@ -6950,8 +6950,8 @@ var YearPickerPanel = defineComponent({
     };
   }
 });
-function _extends$6() {
-  _extends$6 = Object.assign || function(target) {
+function _extends$7() {
+  _extends$7 = Object.assign || function(target) {
     for (var i = 1; i < arguments.length; i++) {
       var source = arguments[i];
       for (var key in source) {
@@ -6962,7 +6962,7 @@ function _extends$6() {
     }
     return target;
   };
-  return _extends$6.apply(this, arguments);
+  return _extends$7.apply(this, arguments);
 }
 dayjs.extend(isSameOrBefore);
 dayjs.extend(isSameOrAfter);
@@ -7007,7 +7007,7 @@ function render$C(_ctx, _cache) {
         "var-day-picker-cover": "",
         round: "",
         ripple: false
-      }, _extends$6({}, _ctx.buttonProps(day)), {
+      }, _extends$7({}, _ctx.buttonProps(day)), {
         onClick: ($event) => _ctx.chooseDay(day)
       }), {
         default: withCtx(() => [createTextVNode(toDisplayString(_ctx.filterDay(day)), 1)]),
@@ -7644,8 +7644,8 @@ var DatePicker = defineComponent({
 DatePicker.install = function(app) {
   app.component(DatePicker.name, DatePicker);
 };
-function _extends$5() {
-  _extends$5 = Object.assign || function(target) {
+function _extends$6() {
+  _extends$6 = Object.assign || function(target) {
     for (var i = 1; i < arguments.length; i++) {
       var source = arguments[i];
       for (var key in source) {
@@ -7656,12 +7656,12 @@ function _extends$5() {
     }
     return target;
   };
-  return _extends$5.apply(this, arguments);
+  return _extends$6.apply(this, arguments);
 }
 function messageAlignValidator(messageAlign) {
   return ["left", "center", "right"].includes(messageAlign);
 }
-var props$y = _extends$5({
+var props$y = _extends$6({
   show: {
     type: Boolean,
     default: false
@@ -7959,8 +7959,8 @@ var props$x = {
     default: false
   }
 };
-function _extends$4() {
-  _extends$4 = Object.assign || function(target) {
+function _extends$5() {
+  _extends$5 = Object.assign || function(target) {
     for (var i = 1; i < arguments.length; i++) {
       var source = arguments[i];
       for (var key in source) {
@@ -7971,7 +7971,7 @@ function _extends$4() {
     }
     return target;
   };
-  return _extends$4.apply(this, arguments);
+  return _extends$5.apply(this, arguments);
 }
 var _hoisted_1$o = {
   key: 0,
@@ -8005,12 +8005,12 @@ var Divider = defineComponent({
         margin
       };
       if (isBool(inset) || inset === 0)
-        return _extends$4({}, baseStyle);
+        return _extends$5({}, baseStyle);
       var _inset = toNumber(inset);
       var absInsetWithUnit = Math.abs(_inset) + (inset + "").replace(_inset + "", "");
-      return vertical ? _extends$4({}, baseStyle, {
+      return vertical ? _extends$5({}, baseStyle, {
         height: "calc(80% - " + toSizeUnit(absInsetWithUnit) + ")"
-      }) : _extends$4({}, baseStyle, {
+      }) : _extends$5({}, baseStyle, {
         width: "calc(100% - " + toSizeUnit(absInsetWithUnit) + ")",
         left: _inset > 0 ? toSizeUnit(absInsetWithUnit) : toSizeUnit(0)
       });
@@ -8024,7 +8024,7 @@ var Divider = defineComponent({
     onUpdated(() => {
       checkHasText();
     });
-    return _extends$4({}, toRefs(state), {
+    return _extends$5({}, toRefs(state), {
       style,
       isInset
     });
@@ -8159,8 +8159,8 @@ function _asyncToGenerator$7(fn) {
     });
   };
 }
-function _extends$3() {
-  _extends$3 = Object.assign || function(target) {
+function _extends$4() {
+  _extends$4 = Object.assign || function(target) {
     for (var i = 1; i < arguments.length; i++) {
       var source = arguments[i];
       for (var key in source) {
@@ -8171,7 +8171,7 @@ function _extends$3() {
     }
     return target;
   };
-  return _extends$3.apply(this, arguments);
+  return _extends$4.apply(this, arguments);
 }
 var BACKGROUND_IMAGE_ARG_NAME = "background-image";
 var LAZY_LOADING = "lazy-loading";
@@ -8241,7 +8241,7 @@ function createLazy(el, binding) {
     error: (_el$getAttribute2 = el.getAttribute(LAZY_ERROR)) != null ? _el$getAttribute2 : defaultLazyOptions.error,
     attempt: el.getAttribute(LAZY_ATTEMPT) ? Number(el.getAttribute(LAZY_ATTEMPT)) : defaultLazyOptions.attempt
   };
-  el._lazy = _extends$3({
+  el._lazy = _extends$4({
     src: binding.value,
     arg: binding.arg,
     currentAttempt: 0,
@@ -8990,8 +8990,8 @@ var SwipeItem = defineComponent({
 SwipeItem.install = function(app) {
   app.component(SwipeItem.name, SwipeItem);
 };
-function _extends$2() {
-  _extends$2 = Object.assign || function(target) {
+function _extends$3() {
+  _extends$3 = Object.assign || function(target) {
     for (var i = 1; i < arguments.length; i++) {
       var source = arguments[i];
       for (var key in source) {
@@ -9002,9 +9002,9 @@ function _extends$2() {
     }
     return target;
   };
-  return _extends$2.apply(this, arguments);
+  return _extends$3.apply(this, arguments);
 }
-var props$t = _extends$2({
+var props$t = _extends$3({
   show: {
     type: Boolean,
     default: false
@@ -10356,7 +10356,7 @@ var List = defineComponent({
       var {
         bottom: detectorBottom
       } = detectorEl.value.getBoundingClientRect();
-      return detectorBottom - toPxNum(props2.offset) <= containerBottom;
+      return Math.floor(detectorBottom) - toPxNum(props2.offset) <= containerBottom;
     };
     var check2 = /* @__PURE__ */ function() {
       var _ref = _asyncToGenerator$3(function* () {
@@ -11051,8 +11051,8 @@ var Pagination = defineComponent({
 Pagination.install = function(app) {
   app.component(Pagination.name, Pagination);
 };
-function _extends$1() {
-  _extends$1 = Object.assign || function(target) {
+function _extends$2() {
+  _extends$2 = Object.assign || function(target) {
     for (var i = 1; i < arguments.length; i++) {
       var source = arguments[i];
       for (var key in source) {
@@ -11063,9 +11063,9 @@ function _extends$1() {
     }
     return target;
   };
-  return _extends$1.apply(this, arguments);
+  return _extends$2.apply(this, arguments);
 }
-var props$k = _extends$1({
+var props$k = _extends$2({
   columns: {
     type: Array,
     default: () => []
@@ -13203,6 +13203,20 @@ var props$b = {
     type: Function
   }
 };
+function _extends$1() {
+  _extends$1 = Object.assign || function(target) {
+    for (var i = 1; i < arguments.length; i++) {
+      var source = arguments[i];
+      for (var key in source) {
+        if (Object.prototype.hasOwnProperty.call(source, key)) {
+          target[key] = source[key];
+        }
+      }
+    }
+    return target;
+  };
+  return _extends$1.apply(this, arguments);
+}
 var Thumbs;
 (function(Thumbs2) {
   Thumbs2["First"] = "1";
@@ -13259,11 +13273,9 @@ function render$d(_ctx, _cache) {
       })
     }, null, 4), createElementVNode("div", {
       class: normalizeClass(["var-slider__thumb-ripple", [_ctx.thumbsProps[item.enumValue].active ? "var-slider__thumb-ripple-active" : null]]),
-      style: normalizeStyle({
-        background: _ctx.thumbColor,
-        height: _ctx.thumbSize === void 0 ? void 0 : _ctx.thumbsProps[item.enumValue].active ? 3 * _ctx.toNumber(_ctx.thumbSize) + "px" : "0px",
-        width: _ctx.thumbSize === void 0 ? void 0 : _ctx.thumbsProps[item.enumValue].active ? 3 * _ctx.toNumber(_ctx.thumbSize) + "px" : "0px"
-      })
+      style: normalizeStyle(_extends$1({
+        background: _ctx.thumbColor
+      }, _ctx.getRippleSize(item)))
     }, null, 6), createElementVNode("div", {
       class: normalizeClass(["var-slider__thumb-label", [_ctx.showLabel(item.enumValue) ? "var-slider__thumb-label-active" : null]]),
       style: normalizeStyle({
@@ -13329,6 +13341,16 @@ var Slider = defineComponent({
       }
       return list2;
     });
+    var getRippleSize = (item) => {
+      var size;
+      if (props2.thumbSize !== void 0) {
+        size = thumbsProps[item.enumValue].active ? 3 * toNumber(props2.thumbSize) + "px" : "0px";
+      }
+      return {
+        height: size,
+        width: size
+      };
+    };
     var showLabel = (type) => {
       if (props2.labelVisible === "always")
         return true;
@@ -13517,6 +13539,7 @@ var Slider = defineComponent({
       thumbsProps,
       thumbList,
       toNumber,
+      getRippleSize,
       showLabel,
       start,
       move,

package/lib/list/List.js

@@ -104,8 +104,10 @@ var _default = (0, _vue.defineComponent)({
       var containerBottom = scroller === window ? window.innerHeight : scroller.getBoundingClientRect().bottom;
       var {
         bottom: detectorBottom
-      } = detectorEl.value.getBoundingClientRect();
-      return detectorBottom - (0, _elements.toPxNum)(props.offset) <= containerBottom;
+      } = detectorEl.value.getBoundingClientRect(); // The fractional part of the detectorBottom when bottoming out overflows
+      // https://github.com/varletjs/varlet/issues/310
+
+      return Math.floor(detectorBottom) - (0, _elements.toPxNum)(props.offset) <= containerBottom;
     }; // expose
 
 

package/lib/slider/Slider.js

@@ -20,6 +20,8 @@ var _formDetails = _interopRequireDefault(require("../form-details"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
 var Thumbs;
 
 (function (Thumbs) {
@@ -88,11 +90,9 @@ function render(_ctx, _cache) {
     /* STYLE */
     ), (0, _vue.createElementVNode)("div", {
       class: (0, _vue.normalizeClass)(["var-slider__thumb-ripple", [_ctx.thumbsProps[item.enumValue].active ? 'var-slider__thumb-ripple-active' : null]]),
-      style: (0, _vue.normalizeStyle)({
-        background: _ctx.thumbColor,
-        height: _ctx.thumbSize === undefined ? undefined : _ctx.thumbsProps[item.enumValue].active ? 3 * _ctx.toNumber(_ctx.thumbSize) + "px" : '0px',
-        width: _ctx.thumbSize === undefined ? undefined : _ctx.thumbsProps[item.enumValue].active ? 3 * _ctx.toNumber(_ctx.thumbSize) + "px" : '0px'
-      })
+      style: (0, _vue.normalizeStyle)(_extends({
+        background: _ctx.thumbColor
+      }, _ctx.getRippleSize(item)))
     }, null, 6
     /* CLASS, STYLE */
     ), (0, _vue.createElementVNode)("div", {
@@ -181,6 +181,19 @@ var _default = (0, _vue.defineComponent)({
       return list;
     });
 
+    var getRippleSize = item => {
+      var size;
+
+      if (props.thumbSize !== undefined) {
+        size = thumbsProps[item.enumValue].active ? 3 * (0, _shared.toNumber)(props.thumbSize) + "px" : '0px';
+      }
+
+      return {
+        height: size,
+        width: size
+      };
+    };
+
     var showLabel = type => {
       if (props.labelVisible === 'always') return true;
       if (props.labelVisible === 'never') return false;
@@ -384,6 +397,7 @@ var _default = (0, _vue.defineComponent)({
       thumbsProps,
       thumbList,
       toNumber: _shared.toNumber,
+      getRippleSize,
       showLabel,
       start,
       move,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@varlet/ui",
-  "version": "1.26.1-alpha.1644652196468",
+  "version": "1.26.1",
   "description": "A material like components library",
   "module": "es/index.js",
   "main": "lib/index.js",
@@ -39,13 +39,13 @@
   },
   "gitHead": "ee9c3866bedad96c86365b0f9888a3a6bb781b1f",
   "dependencies": {
-    "@varlet/icons": "1.26.1-alpha.1644652196468",
+    "@varlet/icons": "1.26.1",
     "dayjs": "^1.10.4",
     "decimal.js": "^10.2.1"
   },
   "devDependencies": {
-    "@varlet/cli": "1.26.1-alpha.1644652196468",
-    "@varlet/touch-emulator": "1.26.1-alpha.1644652196468",
+    "@varlet/cli": "1.26.1",
+    "@varlet/touch-emulator": "1.26.1",
     "@vue/test-utils": "2.0.0-rc.6",
     "@vue/runtime-core": "3.2.25",
     "typescript": "^4.4.4",