@varlet/ui 1.23.4-alpha.8 → 1.23.4

package/lib/swipe/Swipe.js

@@ -1,408 +0,0 @@
-"use strict";
-
-exports.__esModule = true;
-exports.render = render;
-exports.default = void 0;
-
-var _vue = require("vue");
-
-var _provide = require("./provide");
-
-var _elements = require("../utils/elements");
-
-var _props = require("./props");
-
-var _shared = require("../utils/shared");
-
-var SWIPE_DELAY = 250;
-var SWIPE_DISTANCE = 20;
-
-var _withScopeId = n => ((0, _vue.pushScopeId)(""), n = n(), (0, _vue.popScopeId)(), n);
-
-var _hoisted_1 = {
-  class: "var-swipe",
-  ref: "swipeEl"
-};
-var _hoisted_2 = ["onClick"];
-
-function render(_ctx, _cache) {
-  return (0, _vue.openBlock)(), (0, _vue.createElementBlock)("div", _hoisted_1, [(0, _vue.createElementVNode)("div", {
-    class: (0, _vue.normalizeClass)(["var-swipe__track", [_ctx.vertical ? 'var-swipe--vertical' : null]]),
-    style: (0, _vue.normalizeStyle)({
-      width: !_ctx.vertical ? _ctx.trackSize + "px" : undefined,
-      height: _ctx.vertical ? _ctx.trackSize + "px" : undefined,
-      transform: "translate" + (_ctx.vertical ? 'Y' : 'X') + "(" + _ctx.translate + "px)",
-      transitionDuration: _ctx.lockDuration ? "0ms" : _ctx.toNumber(_ctx.duration) + "ms"
-    }),
-    onTouchstart: _cache[0] || (_cache[0] = (...args) => _ctx.handleTouchstart && _ctx.handleTouchstart(...args)),
-    onTouchmove: _cache[1] || (_cache[1] = (...args) => _ctx.handleTouchmove && _ctx.handleTouchmove(...args)),
-    onTouchend: _cache[2] || (_cache[2] = (...args) => _ctx.handleTouchend && _ctx.handleTouchend(...args))
-  }, [(0, _vue.renderSlot)(_ctx.$slots, "default")], 38
-  /* CLASS, STYLE, HYDRATE_EVENTS */
-  ), (0, _vue.renderSlot)(_ctx.$slots, "indicator", {
-    index: _ctx.index,
-    length: _ctx.length
-  }, () => [_ctx.indicator && _ctx.length ? ((0, _vue.openBlock)(), (0, _vue.createElementBlock)("div", {
-    key: 0,
-    class: (0, _vue.normalizeClass)(["var-swipe__indicators", [_ctx.vertical ? 'var-swipe--indicators-vertical' : null]])
-  }, [((0, _vue.openBlock)(true), (0, _vue.createElementBlock)(_vue.Fragment, null, (0, _vue.renderList)(_ctx.length, (l, idx) => {
-    return (0, _vue.openBlock)(), (0, _vue.createElementBlock)("div", {
-      class: (0, _vue.normalizeClass)(["var-swipe__indicator", [_ctx.index === idx ? 'var-swipe--indicator-active' : null, _ctx.vertical ? 'var-swipe--indicator-vertical' : null]]),
-      style: (0, _vue.normalizeStyle)({
-        background: _ctx.indicatorColor
-      }),
-      key: l,
-      onClick: $event => _ctx.to(idx)
-    }, null, 14
-    /* CLASS, STYLE, PROPS */
-    , _hoisted_2);
-  }), 128
-  /* KEYED_FRAGMENT */
-  ))], 2
-  /* CLASS */
-  )) : (0, _vue.createCommentVNode)("v-if", true)])], 512
-  /* NEED_PATCH */
-  );
-}
-
-var _default = (0, _vue.defineComponent)({
-  render,
-  name: 'VarSwipe',
-  props: _props.props,
-
-  setup(props) {
-    var swipeEl = (0, _vue.ref)(null);
-    var size = (0, _vue.ref)(0);
-    var vertical = (0, _vue.computed)(() => props.vertical);
-    var trackSize = (0, _vue.ref)(0);
-    var translate = (0, _vue.ref)(0);
-    var lockDuration = (0, _vue.ref)(false);
-    var index = (0, _vue.ref)(0);
-    var {
-      swipeItems,
-      bindSwipeItems,
-      length
-    } = (0, _provide.useSwipeItems)();
-    var touching = false;
-    var timer = -1;
-    var startX;
-    var startY;
-    var startTime;
-    var prevX;
-    var prevY;
-
-    var findSwipeItem = idx => swipeItems.find(({
-      index
-    }) => index.value === idx);
-
-    var dispatchBorrower = () => {
-      if (!props.loop) {
-        return;
-      } // track越左边界
-
-
-      if (translate.value >= 0) {
-        findSwipeItem(length.value - 1).setTranslate(-trackSize.value);
-      } // track越右边界
-
-
-      if (translate.value <= -(trackSize.value - size.value)) {
-        findSwipeItem(0).setTranslate(trackSize.value);
-      } // track没越界
-
-
-      if (translate.value > -(trackSize.value - size.value) && translate.value < 0) {
-        findSwipeItem(length.value - 1).setTranslate(0);
-        findSwipeItem(0).setTranslate(0);
-      }
-    };
-
-    var getSwipeIndex = targetSwipeIndex => {
-      var swipeIndex = (0, _shared.isNumber)(targetSwipeIndex) ? targetSwipeIndex : Math.floor((translate.value - size.value / 2) / -size.value);
-      var {
-        loop
-      } = props;
-
-      if (swipeIndex <= -1) {
-        return loop ? -1 : 0;
-      }
-
-      if (swipeIndex >= length.value) {
-        return loop ? length.value : length.value - 1;
-      }
-
-      return swipeIndex;
-    };
-
-    var swipeIndexToIndex = swipeIndex => {
-      var {
-        loop
-      } = props;
-
-      if (swipeIndex === -1) {
-        return loop ? length.value - 1 : 0;
-      }
-
-      if (swipeIndex === length.value) {
-        return loop ? 0 : length.value - 1;
-      }
-
-      return swipeIndex;
-    };
-
-    var boundaryIndex = index => {
-      var {
-        loop
-      } = props;
-
-      if (index < 0) {
-        return loop ? length.value - 1 : 0;
-      }
-
-      if (index > length.value - 1) {
-        return loop ? 0 : length.value - 1;
-      }
-
-      return index;
-    };
-
-    var fixPosition = fn => {
-      var overLeft = translate.value >= size.value;
-      var overRight = translate.value <= -trackSize.value;
-      var leftTranslate = 0;
-      var rightTranslate = -(trackSize.value - size.value);
-      lockDuration.value = true; // 检测是否有越界情况 越界修正
-
-      if (overLeft || overRight) {
-        lockDuration.value = true;
-        translate.value = overRight ? leftTranslate : rightTranslate;
-        findSwipeItem(0).setTranslate(0);
-        findSwipeItem(length.value - 1).setTranslate(0);
-      }
-
-      (0, _elements.nextTickFrame)(() => {
-        lockDuration.value = false;
-        fn == null ? void 0 : fn();
-      });
-    };
-
-    var initialIndex = () => {
-      lockDuration.value = true;
-      index.value = boundaryIndex((0, _shared.toNumber)(props.initialIndex));
-      translate.value = index.value * -size.value;
-      (0, _elements.nextTickFrame)(() => {
-        lockDuration.value = false;
-      });
-    };
-
-    var startAutoplay = () => {
-      var {
-        autoplay
-      } = props;
-
-      if (!autoplay || length.value <= 1) {
-        return;
-      }
-
-      stopAutoplay();
-      timer = window.setTimeout(() => {
-        next();
-        startAutoplay();
-      }, (0, _shared.toNumber)(autoplay));
-    };
-
-    var stopAutoplay = () => {
-      timer && clearInterval(timer);
-    };
-
-    var getDirection = (x, y) => {
-      if (x > y && x > 10) {
-        return 'horizontal';
-      }
-
-      if (y > x && y > 10) {
-        return 'vertical';
-      }
-    };
-
-    var handleTouchstart = event => {
-      if (length.value <= 1 || !props.touchable) {
-        return;
-      }
-
-      var {
-        clientX,
-        clientY
-      } = event.touches[0];
-      startX = clientX;
-      startY = clientY;
-      startTime = performance.now();
-      touching = true;
-      stopAutoplay();
-      fixPosition(() => {
-        lockDuration.value = true;
-      });
-    };
-
-    var handleTouchmove = event => {
-      var {
-        touchable,
-        vertical
-      } = props;
-
-      if (!touching || !touchable) {
-        return;
-      }
-
-      var {
-        clientX,
-        clientY
-      } = event.touches[0];
-      var deltaX = Math.abs(clientX - startX);
-      var deltaY = Math.abs(clientY - startY);
-      var direction = getDirection(deltaX, deltaY);
-      var expectDirection = vertical ? 'vertical' : 'horizontal';
-
-      if (direction === expectDirection) {
-        event.preventDefault();
-        var moveX = prevX !== undefined ? clientX - prevX : 0;
-        var moveY = prevY !== undefined ? clientY - prevY : 0;
-        prevX = clientX;
-        prevY = clientY;
-        translate.value += vertical ? moveY : moveX;
-        dispatchBorrower();
-      }
-    };
-
-    var handleTouchend = () => {
-      if (!touching) {
-        return;
-      }
-
-      var {
-        vertical,
-        onChange
-      } = props;
-      var positive = vertical ? prevY < startY : prevX < startX;
-      var distance = vertical ? Math.abs(startY - prevY) : Math.abs(startX - prevX);
-      var quickSwiping = performance.now() - startTime <= SWIPE_DELAY && distance >= SWIPE_DISTANCE;
-      var swipeIndex = quickSwiping ? positive ? getSwipeIndex(index.value + 1) : getSwipeIndex(index.value - 1) : getSwipeIndex();
-      touching = false;
-      lockDuration.value = false;
-      prevX = undefined;
-      prevY = undefined;
-      translate.value = swipeIndex * -size.value;
-      var prevIndex = index.value;
-      index.value = swipeIndexToIndex(swipeIndex);
-      startAutoplay();
-      prevIndex !== index.value && (onChange == null ? void 0 : onChange(index.value));
-    }; // expose
-
-
-    var resize = () => {
-      size.value = props.vertical ? swipeEl.value.offsetHeight : swipeEl.value.offsetWidth;
-      trackSize.value = size.value * length.value;
-      initialIndex();
-      startAutoplay();
-    }; // expose
-
-
-    var next = () => {
-      if (length.value <= 1) {
-        return;
-      }
-
-      var {
-        loop,
-        onChange
-      } = props;
-      var currentIndex = index.value;
-      index.value = boundaryIndex(currentIndex + 1);
-      onChange == null ? void 0 : onChange(index.value);
-      fixPosition(() => {
-        if (currentIndex === length.value - 1 && loop) {
-          findSwipeItem(0).setTranslate(trackSize.value);
-          translate.value = length.value * -size.value;
-          return;
-        }
-
-        if (currentIndex !== length.value - 1) {
-          translate.value = index.value * -size.value;
-        }
-      });
-    }; // expose
-
-
-    var prev = () => {
-      if (length.value <= 1) {
-        return;
-      }
-
-      var {
-        loop,
-        onChange
-      } = props;
-      var currentIndex = index.value;
-      index.value = boundaryIndex(currentIndex - 1);
-      onChange == null ? void 0 : onChange(index.value);
-      fixPosition(() => {
-        if (currentIndex === 0 && loop) {
-          findSwipeItem(length.value - 1).setTranslate(-trackSize.value);
-          translate.value = size.value;
-          return;
-        }
-
-        if (currentIndex !== 0) {
-          translate.value = index.value * -size.value;
-        }
-      });
-    }; // expose
-
-
-    var to = idx => {
-      if (length.value <= 1 || idx === index.value) {
-        return;
-      }
-
-      idx = idx < 0 ? 0 : idx;
-      idx = idx >= length.value ? length.value : idx;
-      var task = idx > index.value ? next : prev;
-      Array.from({
-        length: Math.abs(idx - index.value)
-      }).forEach(task);
-    };
-
-    var swipeProvider = {
-      size,
-      vertical
-    };
-    bindSwipeItems(swipeProvider);
-    (0, _vue.watch)(() => length.value, resize);
-    (0, _vue.onMounted)(() => {
-      window.addEventListener('resize', resize);
-    });
-    (0, _vue.onUnmounted)(() => {
-      window.removeEventListener('resize', resize);
-      stopAutoplay();
-    });
-    return {
-      length,
-      index,
-      swipeEl,
-      trackSize,
-      translate,
-      lockDuration,
-      handleTouchstart,
-      handleTouchmove,
-      handleTouchend,
-      next,
-      prev,
-      to,
-      resize,
-      toNumber: _shared.toNumber
-    };
-  }
-
-});
-
-exports.default = _default;

package/lib/swipe/index.js

@@ -1,17 +0,0 @@
-"use strict";
-
-exports.__esModule = true;
-exports.default = exports._SwipeComponent = void 0;
-
-var _Swipe = _interopRequireDefault(require("./Swipe.js"));
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-_Swipe.default.install = function (app) {
-  app.component(_Swipe.default.name, _Swipe.default);
-};
-
-var _SwipeComponent = _Swipe.default;
-exports._SwipeComponent = _SwipeComponent;
-var _default = _Swipe.default;
-exports.default = _default;

package/lib/swipe/props.js

@@ -1,40 +0,0 @@
-"use strict";
-
-exports.__esModule = true;
-exports.props = void 0;
-var props = {
-  loop: {
-    type: Boolean,
-    default: true
-  },
-  autoplay: {
-    type: [String, Number]
-  },
-  duration: {
-    type: [String, Number],
-    default: 300
-  },
-  initialIndex: {
-    type: [String, Number],
-    default: 0
-  },
-  indicator: {
-    type: Boolean,
-    default: true
-  },
-  indicatorColor: {
-    type: String
-  },
-  vertical: {
-    type: Boolean,
-    default: false
-  },
-  touchable: {
-    type: Boolean,
-    default: true
-  },
-  onChange: {
-    type: Function
-  }
-};
-exports.props = props;

package/lib/swipe/provide.js

@@ -1,27 +0,0 @@
-"use strict";
-
-exports.__esModule = true;
-exports.useSwipeItems = useSwipeItems;
-exports.SWIPE_COUNT_SWIPE_ITEM_KEY = exports.SWIPE_BIND_SWIPE_ITEM_KEY = void 0;
-
-var _components = require("../utils/components");
-
-var SWIPE_BIND_SWIPE_ITEM_KEY = Symbol('SWIPE_BIND_SWIPE_ITEM_KEY');
-exports.SWIPE_BIND_SWIPE_ITEM_KEY = SWIPE_BIND_SWIPE_ITEM_KEY;
-var SWIPE_COUNT_SWIPE_ITEM_KEY = Symbol('SWIPE_COUNT_SWIPE_ITEM_KEY');
-exports.SWIPE_COUNT_SWIPE_ITEM_KEY = SWIPE_COUNT_SWIPE_ITEM_KEY;
-
-function useSwipeItems() {
-  var {
-    childProviders,
-    bindChildren
-  } = (0, _components.useChildren)(SWIPE_BIND_SWIPE_ITEM_KEY);
-  var {
-    length
-  } = (0, _components.useAtChildrenCounter)(SWIPE_COUNT_SWIPE_ITEM_KEY);
-  return {
-    length,
-    swipeItems: childProviders,
-    bindSwipeItems: bindChildren
-  };
-}

package/lib/swipe/style/index.js

@@ -1,3 +0,0 @@
-require('../../styles/common.css')
-require('../swipe.css')
-require('../SwipeSfc.css')

package/lib/swipe/style/less.js

@@ -1,3 +0,0 @@
-require('../../styles/common.less')
-require('../swipe.less')
-require('../SwipeSfc.less')

package/lib/swipe/swipe.css

@@ -1 +0,0 @@
-:root { --swipe-indicator-color: #fff; --swipe-indicators-offset: 10px; --swipe-indicator-offset: 4px;}.var-swipe { position: relative; overflow: hidden; user-select: none;}.var-swipe__track { width: 100%; height: 100%; display: flex; transition-property: transform;}.var-swipe__indicators { position: absolute; display: flex; bottom: var(--swipe-indicators-offset); left: 50%; transform: translateX(-50%);}.var-swipe__indicator { width: 8px; height: 8px; border-radius: 50%; background: var(--swipe-indicator-color); opacity: 0.3; margin: 0 var(--swipe-indicator-offset); transition: opacity 0.3s;}.var-swipe--vertical { flex-direction: column;}.var-swipe--indicators-vertical { flex-direction: column; left: var(--swipe-indicators-offset); bottom: 50%; transform: translateY(50%);}.var-swipe--indicator-active { opacity: 1;}.var-swipe--indicator-vertical { margin: var(--swipe-indicator-offset) 0;}

package/lib/swipe/swipe.less

@@ -1,59 +0,0 @@
-@swipe-indicator-color: #fff;
-@swipe-indicators-offset: 10px;
-@swipe-indicator-offset: 4px;
-
-:root {
-  --swipe-indicator-color: @swipe-indicator-color;
-  --swipe-indicators-offset: @swipe-indicators-offset;
-  --swipe-indicator-offset: @swipe-indicator-offset;
-}
-
-.var-swipe {
-  position: relative;
-  overflow: hidden;
-  user-select: none;
-
-  &__track {
-    width: 100%;
-    height: 100%;
-    display: flex;
-    transition-property: transform;
-  }
-
-  &__indicators {
-    position: absolute;
-    display: flex;
-    bottom: var(--swipe-indicators-offset);
-    left: 50%;
-    transform: translateX(-50%);
-  }
-
-  &__indicator {
-    width: 8px;
-    height: 8px;
-    border-radius: 50%;
-    background: var(--swipe-indicator-color);
-    opacity: 0.3;
-    margin: 0 var(--swipe-indicator-offset);
-    transition: opacity 0.3s;
-  }
-
-  &--vertical {
-    flex-direction: column;
-  }
-
-  &--indicators-vertical {
-    flex-direction: column;
-    left: var(--swipe-indicators-offset);
-    bottom: 50%;
-    transform: translateY(50%);
-  }
-
-  &--indicator-active {
-    opacity: 1;
-  }
-
-  &--indicator-vertical {
-    margin: var(--swipe-indicator-offset) 0;
-  }
-}

package/lib/swipe-item/SwipeItem.js

@@ -1,58 +0,0 @@
-"use strict";
-
-exports.__esModule = true;
-exports.render = render;
-exports.default = void 0;
-
-var _vue = require("vue");
-
-var _provide = require("./provide");
-
-function render(_ctx, _cache) {
-  return (0, _vue.openBlock)(), (0, _vue.createElementBlock)("div", {
-    class: "var-swipe-item",
-    style: (0, _vue.normalizeStyle)({
-      width: !_ctx.vertical ? _ctx.size + "px" : undefined,
-      height: _ctx.vertical ? _ctx.size + "px" : undefined,
-      transform: "translate" + (_ctx.vertical ? 'Y' : 'X') + "(" + _ctx.translate + "px)"
-    })
-  }, [(0, _vue.renderSlot)(_ctx.$slots, "default")], 4
-  /* STYLE */
-  );
-}
-
-var _default = (0, _vue.defineComponent)({
-  render,
-  name: 'VarSwipeItem',
-
-  setup() {
-    var translate = (0, _vue.ref)(0);
-    var {
-      swipe,
-      bindSwipe,
-      index
-    } = (0, _provide.useSwipe)();
-    var {
-      size,
-      vertical
-    } = swipe;
-
-    var setTranslate = x => {
-      translate.value = x;
-    };
-
-    var swipeItemProvider = {
-      index,
-      setTranslate
-    };
-    bindSwipe(swipeItemProvider);
-    return {
-      size,
-      vertical,
-      translate
-    };
-  }
-
-});
-
-exports.default = _default;

package/lib/swipe-item/index.js

@@ -1,17 +0,0 @@
-"use strict";
-
-exports.__esModule = true;
-exports.default = exports._SwipeItemComponent = void 0;
-
-var _SwipeItem = _interopRequireDefault(require("./SwipeItem.js"));
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-_SwipeItem.default.install = function (app) {
-  app.component(_SwipeItem.default.name, _SwipeItem.default);
-};
-
-var _SwipeItemComponent = _SwipeItem.default;
-exports._SwipeItemComponent = _SwipeItemComponent;
-var _default = _SwipeItem.default;
-exports.default = _default;

package/lib/swipe-item/provide.js

@@ -1,28 +0,0 @@
-"use strict";
-
-exports.__esModule = true;
-exports.useSwipe = useSwipe;
-
-var _components = require("../utils/components");
-
-var _provide = require("../swipe/provide");
-
-function useSwipe() {
-  var {
-    bindParent,
-    parentProvider
-  } = (0, _components.useParent)(_provide.SWIPE_BIND_SWIPE_ITEM_KEY);
-  var {
-    index
-  } = (0, _components.useAtParentIndex)(_provide.SWIPE_COUNT_SWIPE_ITEM_KEY);
-
-  if (!bindParent || !parentProvider || !index) {
-    throw Error('<var-swipe-item/> must in <var-swipe/>');
-  }
-
-  return {
-    index,
-    swipe: parentProvider,
-    bindSwipe: bindParent
-  };
-}

package/lib/swipe-item/style/index.js

@@ -1,3 +0,0 @@
-require('../../styles/common.css')
-require('../swipeItem.css')
-require('../SwipeItemSfc.css')

package/lib/swipe-item/style/less.js

@@ -1,3 +0,0 @@
-require('../../styles/common.less')
-require('../swipeItem.less')
-require('../SwipeItemSfc.less')

package/lib/swipe-item/swipeItem.css

@@ -1 +0,0 @@
-.var-swipe-item { flex-shrink: 0; width: 100%; height: 100%;}

package/lib/swipe-item/swipeItem.less

@@ -1,5 +0,0 @@
-.var-swipe-item {
-  flex-shrink: 0;
-  width: 100%;
-  height: 100%;
-}