@varlet/ui 2.10.2 → 2.10.3-alpha.1683717781836

package/es/swipe/Swipe.mjs

@@ -87,7 +87,7 @@ var __sfc__ = defineComponent({
       bindSwipeItems,
       length
     } = useSwipeItems();
-    var isCalledPrevOrNext = false;
+    var initializedIndex = false;
     var touching = false;
     var timer = -1;
     var startX;
@@ -195,7 +195,12 @@ var __sfc__ = defineComponent({
     };
 
     var initialIndex = () => {
+      if (initializedIndex) {
+        return;
+      }
+
       index.value = boundaryIndex(toNumber(props.initialIndex));
+      initializedIndex = true;
     };
 
     var startAutoplay = () => {
@@ -326,7 +331,7 @@ var __sfc__ = defineComponent({
         return;
       }
 
-      isCalledPrevOrNext = true;
+      initialIndex();
       var {
         loop,
         onChange
@@ -357,7 +362,7 @@ var __sfc__ = defineComponent({
         return;
       }
 
-      isCalledPrevOrNext = true;
+      initialIndex();
       var {
         loop,
         onChange
@@ -407,11 +412,9 @@ var __sfc__ = defineComponent({
     };
     bindSwipeItems(swipeProvider);
     watch(() => length.value, /*#__PURE__*/_asyncToGenerator(function* () {
-      isCalledPrevOrNext = false; // In nuxt, the size of the swipe cannot got when the route is change, need double raf
-
-      yield doubleRaf(); // When double raf prev or next is called will block initialIndex
-
-      !isCalledPrevOrNext && initialIndex();
+      // In nuxt, the size of the swipe cannot got when the route is change, need double raf
+      yield doubleRaf();
+      initialIndex();
       resize();
     }));
     onActivated(resize);

package/es/tab-item/TabItem.mjs

@@ -7,7 +7,7 @@ var {
   n,
   classes
 } = createNamespace('tab-item');
-import { renderSlot as _renderSlot, createCommentVNode as _createCommentVNode, resolveComponent as _resolveComponent, normalizeClass as _normalizeClass, withCtx as _withCtx, openBlock as _openBlock, createBlock as _createBlock } from "vue";
+import { renderSlot as _renderSlot, resolveComponent as _resolveComponent, normalizeClass as _normalizeClass, withCtx as _withCtx, openBlock as _openBlock, createBlock as _createBlock } from "vue";
 
 function __render__(_ctx, _cache) {
   var _component_var_swipe_item = _resolveComponent("var-swipe-item");
@@ -16,9 +16,7 @@ function __render__(_ctx, _cache) {
     class: _normalizeClass(_ctx.classes(_ctx.n(), [!_ctx.current, _ctx.n('--inactive')])),
     "var-tab-item-cover": ""
   }, {
-    default: _withCtx(() => [_ctx.initSlot ? _renderSlot(_ctx.$slots, "default", {
-      key: 0
-    }) : _createCommentVNode("v-if", true)]),
+    default: _withCtx(() => [_renderSlot(_ctx.$slots, "default")]),
     _: 3
     /* FORWARDED */
 
@@ -36,7 +34,6 @@ var __sfc__ = defineComponent({
 
   setup(props) {
     var current = ref(false);
-    var initSlot = ref(false);
     var name = computed(() => props.name);
     var {
       index,
@@ -44,10 +41,6 @@ var __sfc__ = defineComponent({
     } = useTabsItems();
 
     var setCurrent = value => {
-      if (!initSlot.value && value) {
-        initSlot.value = true;
-      }
-
       current.value = value;
     };
 
@@ -60,8 +53,7 @@ var __sfc__ = defineComponent({
     return {
       n,
       classes,
-      current,
-      initSlot
+      current
     };
   }
 

package/es/utils/elements.mjs

@@ -1,20 +1,43 @@
-function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { Promise.resolve(value).then(_next, _throw); } }
+function _extends() { _extends = Object.assign ? Object.assign.bind() : 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); }
 
-function _asyncToGenerator(fn) { return function () { var self = this, args = arguments; return new Promise(function (resolve, reject) { var gen = fn.apply(self, args); function _next(value) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value); } function _throw(err) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err); } _next(undefined); }); }; }
-
-import { isNumber, isObject, isString, kebabCase, toNumber } from '@varlet/shared';
+import { isNumber, isObject, isString, kebabCase, toNumber, isWindow } from '@varlet/shared';
 import { getGlobalThis } from './shared.mjs';
 import { error } from '../utils/logger.mjs';
+// shorthand only
+export function getStyle(element) {
+  return window.getComputedStyle(element);
+}
+export function getRect(element) {
+  if (isWindow(element)) {
+    var width = element.innerWidth;
+    var height = element.innerHeight;
+    var rect = {
+      x: 0,
+      y: 0,
+      top: 0,
+      left: 0,
+      right: width,
+      bottom: height,
+      width,
+      height
+    };
+    return _extends({}, rect, {
+      toJSON: () => rect
+    });
+  }
+
+  return element.getBoundingClientRect();
+}
 export function getLeft(element) {
   var {
     left
-  } = element.getBoundingClientRect();
+  } = getRect(element);
   return left + (document.body.scrollLeft || document.documentElement.scrollLeft);
 }
 export function getTop(element) {
   var {
     top
-  } = element.getBoundingClientRect();
+  } = getRect(element);
   return top + (document.body.scrollTop || document.documentElement.scrollTop);
 }
 export function getScrollTop(element) {
@@ -26,34 +49,25 @@ export function getScrollLeft(element) {
   var left = 'scrollLeft' in element ? element.scrollLeft : element.pageXOffset;
   return Math.max(left, 0);
 }
-export function inViewport(_x) {
-  return _inViewport.apply(this, arguments);
-}
-
-function _inViewport() {
-  _inViewport = _asyncToGenerator(function* (element) {
-    yield doubleRaf();
-    var {
-      top,
-      bottom,
-      left,
-      right
-    } = element.getBoundingClientRect();
-    var {
-      innerWidth,
-      innerHeight
-    } = window;
-    var xInViewport = left <= innerWidth && right >= 0;
-    var yInViewport = top <= innerHeight && bottom >= 0;
-    return xInViewport && yInViewport;
-  });
-  return _inViewport.apply(this, arguments);
+export function inViewport(element) {
+  var {
+    top,
+    bottom,
+    left,
+    right
+  } = getRect(element);
+  var {
+    width,
+    height
+  } = getRect(window);
+  var xInViewport = left <= width && right >= 0;
+  var yInViewport = top <= height && bottom >= 0;
+  return xInViewport && yInViewport;
 }
-
 export function getTranslate(el) {
   var {
     transform
-  } = window.getComputedStyle(el);
+  } = getStyle(el);
   return +transform.slice(transform.lastIndexOf(',') + 2, transform.length - 1);
 }
 export function getParentScroller(el) {
@@ -74,7 +88,7 @@ export function getParentScroller(el) {
     var {
       overflowY,
       overflow
-    } = window.getComputedStyle(element);
+    } = getStyle(element);
 
     if (scrollRE.test(overflowY) || scrollRE.test(overflow)) {
       return element;
@@ -87,7 +101,7 @@ export function getAllParentScroller(el) {
   var allParentScroller = [];
   var element = el;
 
-  while (element !== window) {
+  while (!isWindow(element)) {
     element = getParentScroller(element);
     allParentScroller.push(element);
   }
@@ -110,15 +124,15 @@ export function getTarget(target, componentName) {
 }
 export function getViewportSize() {
   var {
-    innerWidth,
-    innerHeight
-  } = window;
-  return innerWidth > innerHeight ? {
-    vMin: innerHeight,
-    vMax: innerWidth
+    width,
+    height
+  } = getRect(window);
+  return width > height ? {
+    vMin: height,
+    vMax: width
   } : {
-    vMin: innerWidth,
-    vMax: innerHeight
+    vMin: width,
+    vMax: height
   };
 } // example 1rem
 
@@ -149,17 +163,22 @@ export var toPxNum = value => {
     return +value.replace('px', '');
   }
 
+  var {
+    width,
+    height
+  } = getRect(window);
+
   if (isVw(value)) {
-    return +value.replace('vw', '') * window.innerWidth / 100;
+    return +value.replace('vw', '') * width / 100;
   }
 
   if (isVh(value)) {
-    return +value.replace('vh', '') * window.innerHeight / 100;
+    return +value.replace('vh', '') * height / 100;
   }
 
   if (isRem(value)) {
     var num = +value.replace('rem', '');
-    var rootFontSize = window.getComputedStyle(document.documentElement).fontSize;
+    var rootFontSize = getStyle(document.documentElement).fontSize;
     return num * parseFloat(rootFontSize);
   }