@varlet/ui 2.16.1 → 2.16.3-alpha.1694267513697

package/es/swipe/Swipe.mjs

@@ -10,6 +10,7 @@ import { usePopup } from '../popup/provide.mjs';
 var SWIPE_DELAY = 250;
 var SWIPE_OFFSET = 20;
 var {
+  name,
   n,
   classes
 } = createNamespace('swipe');
@@ -39,7 +40,10 @@ function __render__(_ctx, _cache) {
     })
   }, [_renderSlot(_ctx.$slots, "default")], 38 /* CLASS, STYLE, HYDRATE_EVENTS */), _renderSlot(_ctx.$slots, "indicator", {
     index: _ctx.index,
-    length: _ctx.length
+    length: _ctx.length,
+    prev: _ctx.prev,
+    next: _ctx.next,
+    to: _ctx.to
   }, () => [_ctx.indicator && _ctx.length ? (_openBlock(), _createElementBlock("div", {
     key: 0,
     class: _normalizeClass(_ctx.classes(_ctx.n('indicators'), [_ctx.vertical, _ctx.n('--indicators-vertical')]))
@@ -56,7 +60,7 @@ function __render__(_ctx, _cache) {
 }
 
 var __sfc__ = defineComponent({
-  name: 'VarSwipe',
+  name,
   props,
   setup(props) {
     var swipeEl = ref(null);
@@ -92,13 +96,46 @@ var __sfc__ = defineComponent({
     var isExpectDirection = computed(() => direction.value === (props.vertical ? 'vertical' : 'horizontal'));
     var initializedIndex = false;
     var timer = -1;
-    var findSwipeItem = idx => swipeItems.find(_ref => {
-      var {
-        index
-      } = _ref;
-      return index.value === idx;
-    });
-    var dispatchSwipeItems = () => {
+    var swipeProvider = {
+      size,
+      vertical
+    };
+    bindSwipeItems(swipeProvider);
+    call(bindPopup, null);
+    watch(() => length.value, /*#__PURE__*/_asyncToGenerator(function* () {
+      // In nuxt, the size of the swipe cannot got when the route is change, need double raf
+      yield doubleRaf();
+      initialIndex();
+      resize();
+    }));
+    if (popup) {
+      // watch popup show again
+      watch(() => popup.show.value, /*#__PURE__*/function () {
+        var _ref2 = _asyncToGenerator(function* (show) {
+          if (show) {
+            yield doubleRaf();
+            resize();
+          } else {
+            stopAutoplay();
+          }
+        });
+        return function (_x) {
+          return _ref2.apply(this, arguments);
+        };
+      }());
+    }
+    onActivated(resize);
+    onSmartUnmounted(stopAutoplay);
+    onWindowResize(resize);
+    function findSwipeItem(idx) {
+      return swipeItems.find(_ref3 => {
+        var {
+          index
+        } = _ref3;
+        return index.value === idx;
+      });
+    }
+    function dispatchSwipeItems() {
       if (!props.loop) {
         return;
       }
@@ -115,8 +152,8 @@ var __sfc__ = defineComponent({
         findSwipeItem(length.value - 1).setTranslate(0);
         findSwipeItem(0).setTranslate(0);
       }
-    };
-    var getSwipeIndex = targetSwipeIndex => {
+    }
+    function getSwipeIndex(targetSwipeIndex) {
       var swipeIndex = isNumber(targetSwipeIndex) ? targetSwipeIndex : Math.floor((trackTranslate.value - size.value / 2) / -size.value);
       var {
         loop
@@ -128,8 +165,8 @@ var __sfc__ = defineComponent({
         return loop ? length.value : length.value - 1;
       }
       return swipeIndex;
-    };
-    var swipeIndexToIndex = swipeIndex => {
+    }
+    function swipeIndexToIndex(swipeIndex) {
       var {
         loop
       } = props;
@@ -140,8 +177,8 @@ var __sfc__ = defineComponent({
         return loop ? 0 : length.value - 1;
       }
       return swipeIndex;
-    };
-    var clampIndex = index => {
+    }
+    function clampIndex(index) {
       if (props.loop) {
         if (index < 0) {
           return length.value + index;
@@ -152,9 +189,12 @@ var __sfc__ = defineComponent({
         return index;
       }
       return clamp(index, 0, length.value - 1);
-    };
-    var fixPosition = /*#__PURE__*/function () {
-      var _ref2 = _asyncToGenerator(function* () {
+    }
+    function fixPosition() {
+      return _fixPosition.apply(this, arguments);
+    }
+    function _fixPosition() {
+      _fixPosition = _asyncToGenerator(function* () {
         var overLeft = trackTranslate.value >= size.value;
         var overRight = trackTranslate.value <= -trackSize.value;
         var leftTranslate = 0;
@@ -169,18 +209,16 @@ var __sfc__ = defineComponent({
         yield doubleRaf();
         lockDuration.value = false;
       });
-      return function fixPosition() {
-        return _ref2.apply(this, arguments);
-      };
-    }();
-    var initialIndex = () => {
+      return _fixPosition.apply(this, arguments);
+    }
+    function initialIndex() {
       if (initializedIndex) {
         return;
       }
       index.value = clampIndex(toNumber(props.initialIndex));
       initializedIndex = true;
-    };
-    var startAutoplay = () => {
+    }
+    function startAutoplay() {
       var {
         autoplay
       } = props;
@@ -192,16 +230,19 @@ var __sfc__ = defineComponent({
         next();
         startAutoplay();
       }, toNumber(autoplay));
-    };
-    var stopAutoplay = () => {
+    }
+    function stopAutoplay() {
       timer && clearTimeout(timer);
-    };
-    var setTrackTranslate = value => {
+    }
+    function setTrackTranslate(value) {
       trackTranslate.value = value;
       dispatchSwipeItems();
-    };
-    var handleTouchstart = /*#__PURE__*/function () {
-      var _ref3 = _asyncToGenerator(function* (event) {
+    }
+    function handleTouchstart(_x2) {
+      return _handleTouchstart.apply(this, arguments);
+    }
+    function _handleTouchstart() {
+      _handleTouchstart = _asyncToGenerator(function* (event) {
         if (length.value <= 1 || !props.touchable) {
           return;
         }
@@ -210,11 +251,9 @@ var __sfc__ = defineComponent({
         yield fixPosition();
         lockDuration.value = true;
       });
-      return function handleTouchstart(_x) {
-        return _ref3.apply(this, arguments);
-      };
-    }();
-    var handleTouchmove = event => {
+      return _handleTouchstart.apply(this, arguments);
+    }
+    function handleTouchmove(event) {
       var {
         touchable,
         vertical
@@ -228,8 +267,8 @@ var __sfc__ = defineComponent({
       }
       event.preventDefault();
       setTrackTranslate(trackTranslate.value + (vertical ? moveY.value : moveX.value));
-    };
-    var handleTouchend = () => {
+    }
+    function handleTouchend() {
       if (!touching.value) {
         return;
       }
@@ -253,10 +292,10 @@ var __sfc__ = defineComponent({
       if (prevIndex !== index.value) {
         call(onChange, index.value);
       }
-    };
+    }
 
     // expose
-    var resize = () => {
+    function resize() {
       if (!swipeEl.value) {
         return;
       }
@@ -271,10 +310,14 @@ var __sfc__ = defineComponent({
       setTimeout(() => {
         lockDuration.value = false;
       });
-    };
+    }
+
     // expose
-    var next = /*#__PURE__*/function () {
-      var _ref4 = _asyncToGenerator(function* (options) {
+    function next(_x3) {
+      return _next2.apply(this, arguments);
+    } // expose
+    function _next2() {
+      _next2 = _asyncToGenerator(function* (options) {
         if (length.value <= 1) {
           return;
         }
@@ -298,13 +341,13 @@ var __sfc__ = defineComponent({
           trackTranslate.value = index.value * -size.value;
         }
       });
-      return function next(_x2) {
-        return _ref4.apply(this, arguments);
-      };
-    }();
-    // expose
-    var prev = /*#__PURE__*/function () {
-      var _ref5 = _asyncToGenerator(function* (options) {
+      return _next2.apply(this, arguments);
+    }
+    function prev(_x4) {
+      return _prev.apply(this, arguments);
+    } // expose
+    function _prev() {
+      _prev = _asyncToGenerator(function* (options) {
         if (length.value <= 1) {
           return;
         }
@@ -328,12 +371,9 @@ var __sfc__ = defineComponent({
           trackTranslate.value = index.value * -size.value;
         }
       });
-      return function prev(_x3) {
-        return _ref5.apply(this, arguments);
-      };
-    }();
-    // expose
-    var to = (idx, options) => {
+      return _prev.apply(this, arguments);
+    }
+    function to(idx, options) {
       if (length.value <= 1 || idx === index.value) {
         return;
       }
@@ -348,47 +388,16 @@ var __sfc__ = defineComponent({
           event: index === count - 1 ? options == null ? void 0 : options.event : false
         });
       });
-    };
-    var swipeProvider = {
-      size,
-      vertical
-    };
-    bindSwipeItems(swipeProvider);
-    call(bindPopup, null);
-    watch(() => length.value, /*#__PURE__*/_asyncToGenerator(function* () {
-      // In nuxt, the size of the swipe cannot got when the route is change, need double raf
-      yield doubleRaf();
-      initialIndex();
-      resize();
-    }));
-    if (popup) {
-      // watch popup show again
-      watch(() => popup.show.value, /*#__PURE__*/function () {
-        var _ref7 = _asyncToGenerator(function* (show) {
-          if (show) {
-            yield doubleRaf();
-            resize();
-          } else {
-            stopAutoplay();
-          }
-        });
-        return function (_x4) {
-          return _ref7.apply(this, arguments);
-        };
-      }());
     }
-    onActivated(resize);
-    onSmartUnmounted(stopAutoplay);
-    onWindowResize(resize);
     return {
-      n,
-      classes,
       length,
       index,
       swipeEl,
       trackSize,
       trackTranslate,
       lockDuration,
+      n,
+      classes,
       handleTouchstart,
       handleTouchmove,
       handleTouchend,

package/es/swipe-item/SwipeItem.mjs

@@ -2,6 +2,7 @@ import { defineComponent, ref } from 'vue';
 import { useSwipe } from './provide.mjs';
 import { createNamespace } from '../utils/components.mjs';
 var {
+  name,
   n
 } = createNamespace('swipe-item');
 import { renderSlot as _renderSlot, normalizeClass as _normalizeClass, normalizeStyle as _normalizeStyle, openBlock as _openBlock, createElementBlock as _createElementBlock } from "vue";
@@ -17,7 +18,7 @@ function __render__(_ctx, _cache) {
 }
 
 var __sfc__ = defineComponent({
-  name: 'VarSwipeItem',
+  name,
   setup() {
     var translate = ref(0);
     var {
@@ -29,14 +30,14 @@ var __sfc__ = defineComponent({
       size,
       vertical
     } = swipe;
-    var setTranslate = x => {
-      translate.value = x;
-    };
     var swipeItemProvider = {
       index,
       setTranslate
     };
     bindSwipe(swipeItemProvider);
+    function setTranslate(x) {
+      translate.value = x;
+    }
     return {
       n,
       size,

package/es/switch/Switch.mjs

@@ -8,6 +8,7 @@ import { multiplySizeUnit } from '../utils/elements.mjs';
 import { useForm } from '../form/provide.mjs';
 import { props } from './props.mjs';
 var {
+  name,
   n,
   classes
 } = createNamespace('switch');
@@ -60,7 +61,7 @@ function __render__(_ctx, _cache) {
   }, null, 8 /* PROPS */, ["error-message"])], 2 /* CLASS */)), [[_directive_hover, _ctx.hover, "desktop"]]);
 }
 var __sfc__ = defineComponent({
-  name: 'VarSwitch',
+  name,
   components: {
     VarFormDetails,
     VarHoverOverlay
@@ -85,8 +86,6 @@ var __sfc__ = defineComponent({
       hovering,
       handleHovering
     } = useHoverOverlay();
-    var validate = () => v(props.rules, props.modelValue);
-    var validateWithTrigger = () => nextTick(() => vt(['onChange'], 'onChange', props.rules, props.modelValue));
     var styleComputed = computed(() => {
       var {
         size,
@@ -123,7 +122,19 @@ var __sfc__ = defineComponent({
       };
     });
     var radius = computed(() => multiplySizeUnit(props.size, 0.8));
-    var switchActive = event => {
+    var switchProvider = {
+      reset,
+      validate,
+      resetValidation
+    };
+    call(bindForm, switchProvider);
+    function validate() {
+      return v(props.rules, props.modelValue);
+    }
+    function validateWithTrigger() {
+      return nextTick(() => vt(['onChange'], 'onChange', props.rules, props.modelValue));
+    }
+    function switchActive(event) {
       var {
         onClick,
         onChange,
@@ -143,32 +154,26 @@ var __sfc__ = defineComponent({
       call(onChange, newValue);
       call(updateModelValue, newValue);
       validateWithTrigger();
-    };
-    var hover = value => {
+    }
+    function hover(value) {
       if (props.disabled || form != null && form.disabled.value) {
         return;
       }
       handleHovering(value);
-    };
-    var reset = () => {
+    }
+    function reset() {
       call(props['onUpdate:modelValue'], props.inactiveValue);
       resetValidation();
-    };
-    var switchProvider = {
-      reset,
-      validate,
-      resetValidation
-    };
-    call(bindForm, switchProvider);
+    }
     return {
-      n,
-      classes,
       hovering,
       radius,
       styleComputed,
       errorMessage,
       formDisabled: form == null ? void 0 : form.disabled,
       formReadonly: form == null ? void 0 : form.readonly,
+      n,
+      classes,
       multiplySizeUnit,
       switchActive,
       hover

package/es/tab/Tab.mjs

@@ -4,6 +4,7 @@ import { props } from './props.mjs';
 import { call, createNamespace } from '../utils/components.mjs';
 import { useTabs } from './provide.mjs';
 var {
+  name,
   n,
   classes
 } = createNamespace('tab');
@@ -24,16 +25,16 @@ function __render__(_ctx, _cache) {
   }]]);
 }
 var __sfc__ = defineComponent({
-  name: 'VarTab',
+  name,
   directives: {
     Ripple
   },
   props,
   setup(props) {
     var tabEl = ref(null);
+    var element = computed(() => tabEl.value);
     var name = computed(() => props.name);
     var disabled = computed(() => props.disabled);
-    var element = computed(() => tabEl.value);
     var {
       index,
       tabs,
@@ -55,15 +56,20 @@ var __sfc__ = defineComponent({
       element
     };
     bindTabs(tabProvider);
-    var shouldActive = () => {
+    watch(() => [props.name, props.disabled], resize);
+    function shouldActive() {
       if (props.name != null) {
         return active.value === props.name;
       }
       return active.value === (index == null ? void 0 : index.value);
-    };
-    var computeColorStyle = () => props.disabled ? disabledColor.value : shouldActive() ? activeColor.value : inactiveColor.value;
-    var computeColorClass = () => props.disabled ? n('$-tab--disabled') : shouldActive() ? n('$-tab--active') : n('$-tab--inactive');
-    var handleClick = event => {
+    }
+    function computeColorStyle() {
+      return props.disabled ? disabledColor.value : shouldActive() ? activeColor.value : inactiveColor.value;
+    }
+    function computeColorClass() {
+      return props.disabled ? n('$-tab--disabled') : shouldActive() ? n('$-tab--active') : n('$-tab--inactive');
+    }
+    function handleClick(event) {
       var {
         disabled,
         name,
@@ -74,17 +80,15 @@ var __sfc__ = defineComponent({
       }
       call(onClick, name != null ? name : index.value, event);
       onTabClick(tabProvider);
-    };
-    watch(() => props.name, resize);
-    watch(() => props.disabled, resize);
+    }
     return {
-      n,
-      classes,
       tabEl,
       active,
       activeColor,
       inactiveColor,
       itemDirection,
+      n,
+      classes,
       computeColorStyle,
       computeColorClass,
       handleClick

package/es/tab-item/TabItem.mjs

@@ -4,6 +4,7 @@ import { useTabsItems, useLists } from './provide.mjs';
 import { props } from './props.mjs';
 import { createNamespace } from '../utils/components.mjs';
 var {
+  name,
   n,
   classes
 } = createNamespace('tab-item');
@@ -19,7 +20,7 @@ function __render__(_ctx, _cache) {
   }, 8 /* PROPS */, ["class"]);
 }
 var __sfc__ = defineComponent({
-  name: 'VarTabItem',
+  name,
   components: {
     VarSwipeItem
   },
@@ -34,9 +35,6 @@ var __sfc__ = defineComponent({
     var {
       bindLists
     } = useLists();
-    var setCurrent = value => {
-      current.value = value;
-    };
     var tabItemProvider = {
       index,
       name,
@@ -45,10 +43,13 @@ var __sfc__ = defineComponent({
     };
     bindTabsItems(tabItemProvider);
     bindLists(tabItemProvider);
+    function setCurrent(value) {
+      current.value = value;
+    }
     return {
+      current,
       n,
-      classes,
-      current
+      classes
     };
   }
 });

package/es/table/Table.mjs

@@ -3,6 +3,7 @@ import { toSizeUnit } from '../utils/elements.mjs';
 import { createNamespace, formatElevation } from '../utils/components.mjs';
 import { props } from './props.mjs';
 var {
+  name,
   n,
   classes
 } = createNamespace('table');
@@ -24,16 +25,14 @@ function __render__(_ctx, _cache) {
 }
 
 var __sfc__ = defineComponent({
-  name: 'VarTable',
+  name,
   props,
-  setup() {
-    return {
-      toSizeUnit,
-      n,
-      classes,
-      formatElevation
-    };
-  }
+  setup: () => ({
+    toSizeUnit,
+    n,
+    classes,
+    formatElevation
+  })
 });
 __sfc__.render = __render__;
 export default __sfc__;