first

node_modules/vant/lib/sticky/index.js

@@ -0,0 +1,162 @@
+"use strict";
+
+exports.__esModule = true;
+exports.default = void 0;
+
+var _style = require("../utils/dom/style");
+
+var _unit = require("../utils/format/unit");
+
+var _utils = require("../utils");
+
+var _scroll = require("../utils/dom/scroll");
+
+var _bindEvent = require("../mixins/bind-event");
+
+var _createNamespace = (0, _utils.createNamespace)('sticky'),
+    createComponent = _createNamespace[0],
+    bem = _createNamespace[1];
+
+var _default = createComponent({
+  mixins: [(0, _bindEvent.BindEventMixin)(function (bind, isBind) {
+    if (!this.scroller) {
+      this.scroller = (0, _scroll.getScroller)(this.$el);
+    }
+
+    if (this.observer) {
+      var method = isBind ? 'observe' : 'unobserve';
+      this.observer[method](this.$el);
+    }
+
+    bind(this.scroller, 'scroll', this.onScroll, true);
+    this.onScroll();
+  })],
+  props: {
+    zIndex: [Number, String],
+    container: null,
+    offsetTop: {
+      type: [Number, String],
+      default: 0
+    }
+  },
+  data: function data() {
+    return {
+      fixed: false,
+      height: 0,
+      transform: 0
+    };
+  },
+  computed: {
+    offsetTopPx: function offsetTopPx() {
+      return (0, _unit.unitToPx)(this.offsetTop);
+    },
+    style: function style() {
+      if (!this.fixed) {
+        return;
+      }
+
+      var style = {};
+
+      if ((0, _utils.isDef)(this.zIndex)) {
+        style.zIndex = this.zIndex;
+      }
+
+      if (this.offsetTopPx && this.fixed) {
+        style.top = this.offsetTopPx + "px";
+      }
+
+      if (this.transform) {
+        style.transform = "translate3d(0, " + this.transform + "px, 0)";
+      }
+
+      return style;
+    }
+  },
+  watch: {
+    fixed: function fixed(isFixed) {
+      this.$emit('change', isFixed);
+    }
+  },
+  created: function created() {
+    var _this = this;
+
+    // compatibility: https://caniuse.com/#feat=intersectionobserver
+    if (!_utils.isServer && window.IntersectionObserver) {
+      this.observer = new IntersectionObserver(function (entries) {
+        // trigger scroll when visibility changed
+        if (entries[0].intersectionRatio > 0) {
+          _this.onScroll();
+        }
+      }, {
+        root: document.body
+      });
+    }
+  },
+  methods: {
+    onScroll: function onScroll() {
+      var _this2 = this;
+
+      if ((0, _style.isHidden)(this.$el)) {
+        return;
+      }
+
+      this.height = this.$el.offsetHeight;
+      var container = this.container,
+          offsetTopPx = this.offsetTopPx;
+      var scrollTop = (0, _scroll.getScrollTop)(window);
+      var topToPageTop = (0, _scroll.getElementTop)(this.$el);
+
+      var emitScrollEvent = function emitScrollEvent() {
+        _this2.$emit('scroll', {
+          scrollTop: scrollTop,
+          isFixed: _this2.fixed
+        });
+      }; // The sticky component should be kept inside the container element
+
+
+      if (container) {
+        var bottomToPageTop = topToPageTop + container.offsetHeight;
+
+        if (scrollTop + offsetTopPx + this.height > bottomToPageTop) {
+          var distanceToBottom = this.height + scrollTop - bottomToPageTop;
+
+          if (distanceToBottom < this.height) {
+            this.fixed = true;
+            this.transform = -(distanceToBottom + offsetTopPx);
+          } else {
+            this.fixed = false;
+          }
+
+          emitScrollEvent();
+          return;
+        }
+      }
+
+      if (scrollTop + offsetTopPx > topToPageTop) {
+        this.fixed = true;
+        this.transform = 0;
+      } else {
+        this.fixed = false;
+      }
+
+      emitScrollEvent();
+    }
+  },
+  render: function render() {
+    var h = arguments[0];
+    var fixed = this.fixed;
+    var style = {
+      height: fixed ? this.height + "px" : null
+    };
+    return h("div", {
+      "style": style
+    }, [h("div", {
+      "class": bem({
+        fixed: fixed
+      }),
+      "style": this.style
+    }, [this.slots()])]);
+  }
+});
+
+exports.default = _default;