| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120 | import { createVNode as _createVNode } from "vue";import { ref, watch, computed, reactive, defineComponent } from "vue";import { extend, isHidden, unitToPx, numericProp, getScrollTop, getZIndexStyle, makeStringProp, makeNumericProp, createNamespace } from "../utils/index.mjs";import { useRect, useEventListener, useScrollParent } from "@vant/use";import { useVisibilityChange } from "../composables/use-visibility-change.mjs";const [name, bem] = createNamespace("sticky");const stickyProps = {  zIndex: numericProp,  position: makeStringProp("top"),  container: Object,  offsetTop: makeNumericProp(0),  offsetBottom: makeNumericProp(0)};var stdin_default = defineComponent({  name,  props: stickyProps,  emits: ["scroll", "change"],  setup(props, {    emit,    slots  }) {    const root = ref();    const scrollParent = useScrollParent(root);    const state = reactive({      fixed: false,      width: 0,      height: 0,      transform: 0    });    const offset = computed(() => unitToPx(props.position === "top" ? props.offsetTop : props.offsetBottom));    const rootStyle = computed(() => {      const {        fixed,        height,        width      } = state;      if (fixed) {        return {          width: `${width}px`,          height: `${height}px`        };      }    });    const stickyStyle = computed(() => {      if (!state.fixed) {        return;      }      const style = extend(getZIndexStyle(props.zIndex), {        width: `${state.width}px`,        height: `${state.height}px`,        [props.position]: `${offset.value}px`      });      if (state.transform) {        style.transform = `translate3d(0, ${state.transform}px, 0)`;      }      return style;    });    const emitScroll = (scrollTop) => emit("scroll", {      scrollTop,      isFixed: state.fixed    });    const onScroll = () => {      if (!root.value || isHidden(root)) {        return;      }      const {        container,        position      } = props;      const rootRect = useRect(root);      const scrollTop = getScrollTop(window);      state.width = rootRect.width;      state.height = rootRect.height;      if (position === "top") {        if (container) {          const containerRect = useRect(container);          const difference = containerRect.bottom - offset.value - state.height;          state.fixed = offset.value > rootRect.top && containerRect.bottom > 0;          state.transform = difference < 0 ? difference : 0;        } else {          state.fixed = offset.value > rootRect.top;        }      } else {        const {          clientHeight        } = document.documentElement;        if (container) {          const containerRect = useRect(container);          const difference = clientHeight - containerRect.top - offset.value - state.height;          state.fixed = clientHeight - offset.value < rootRect.bottom && clientHeight > containerRect.top;          state.transform = difference < 0 ? -difference : 0;        } else {          state.fixed = clientHeight - offset.value < rootRect.bottom;        }      }      emitScroll(scrollTop);    };    watch(() => state.fixed, (value) => emit("change", value));    useEventListener("scroll", onScroll, {      target: scrollParent,      passive: true    });    useVisibilityChange(root, onScroll);    return () => {      var _a;      return _createVNode("div", {        "ref": root,        "style": rootStyle.value      }, [_createVNode("div", {        "class": bem({          fixed: state.fixed        }),        "style": stickyStyle.value      }, [(_a = slots.default) == null ? void 0 : _a.call(slots)])]);    };  }});export {  stdin_default as default};
 |